From d2b60d8e860e5a88b9ebe735229d8c56330b3ea4 Mon Sep 17 00:00:00 2001 From: Ken Date: Mon, 6 Feb 2023 21:59:20 +0100 Subject: [PATCH 01/10] :lipstick: Oppdatert semantiske farger --- @navikt/core/tokens/docs.json | 40 ++++++++++---------- @navikt/core/tokens/src/global-colors.json | 2 +- @navikt/core/tokens/src/semantic-colors.json | 38 +++++++++++-------- 3 files changed, 44 insertions(+), 36 deletions(-) diff --git a/@navikt/core/tokens/docs.json b/@navikt/core/tokens/docs.json index 1d72731feb..ffad93bf6d 100644 --- a/@navikt/core/tokens/docs.json +++ b/@navikt/core/tokens/docs.json @@ -134,7 +134,7 @@ { "name": "--a-orange-300", "value": "rgba(255, 193, 102, 1)" }, { "name": "--a-orange-400", "value": "rgba(255, 170, 51, 1)" }, { "name": "--a-orange-500", "value": "rgba(255, 145, 0, 1)" }, - { "name": "--a-orange-600", "value": "rgba(212, 123, 0, 1)" }, + { "name": "--a-orange-600", "value": "rgba(199, 115, 0, 1)" }, { "name": "--a-orange-700", "value": "rgba(168, 100, 0, 1)" }, { "name": "--a-orange-800", "value": "rgba(125, 76, 0, 1)" }, { "name": "--a-orange-900", "value": "rgba(82, 51, 0, 1)" } @@ -163,7 +163,7 @@ { "name": "--a-border-selected", "value": "rgba(0, 103, 197, 1)" }, { "name": "--a-border-success", "value": "rgba(6, 137, 58, 1)" }, { "name": "--a-border-danger", "value": "rgba(195, 0, 0, 1)" }, - { "name": "--a-border-warning", "value": "rgba(212, 123, 0, 1)" }, + { "name": "--a-border-warning", "value": "rgba(199, 115, 0, 1)" }, { "name": "--a-border-info", "value": "rgba(54, 141, 168, 1)" }, { "name": "--a-border-on-inverted", "value": "rgba(229, 229, 229, 1)" }, { "name": "--a-border-on-inverted-subtle", "value": "rgba(89, 89, 89, 1)" }, @@ -173,7 +173,7 @@ "value": "rgba(153, 195, 255, 1)" }, { "name": "--a-border-alt-1", "value": "rgba(130, 105, 162, 1)" }, - { "name": "--a-border-alt-2", "value": "rgba(193, 203, 51, 1)" }, + { "name": "--a-border-alt-2", "value": "rgba(127, 137, 0, 1)" }, { "name": "--a-border-alt-3", "value": "rgba(0, 91, 130, 1)" } ], "semantic-text": [ @@ -200,8 +200,8 @@ ], "semantic-surface": [ { "name": "--a-surface-default", "value": "rgba(255, 255, 255, 1)" }, - { "name": "--a-surface-hover", "value": "rgba(0, 0, 0, 0.03)" }, - { "name": "--a-surface-active", "value": "rgba(0, 0, 0, 0.05)" }, + { "name": "--a-surface-hover", "value": "rgba(0, 0, 0, 0.05)" }, + { "name": "--a-surface-active", "value": "rgba(0, 0, 0, 0.1)" }, { "name": "--a-surface-selected", "value": "rgba(230, 240, 255, 1)" }, { "name": "--a-surface-subtle", "value": "rgba(247, 247, 247, 1)" }, { "name": "--a-surface-transparent", "value": "rgba(255, 255, 255, 0)" }, @@ -230,39 +230,39 @@ { "name": "--a-surface-neutral", "value": "rgba(112, 112, 112, 1)" }, { "name": "--a-surface-neutral-hover", "value": "rgba(89, 89, 89, 1)" }, { "name": "--a-surface-neutral-selected", "value": "rgba(89, 89, 89, 1)" }, - { "name": "--a-surface-success-subtle", "value": "rgba(243, 252, 245, 1)" }, + { "name": "--a-surface-success-subtle", "value": "rgba(204, 241, 214, 1)" }, { "name": "--a-surface-success-subtle-hover", - "value": "rgba(204, 241, 214, 1)" + "value": "rgba(153, 222, 173, 1)" }, { "name": "--a-surface-success", "value": "rgba(6, 137, 58, 1)" }, { "name": "--a-surface-success-hover", "value": "rgba(0, 124, 46, 1)" }, - { "name": "--a-surface-danger-subtle", "value": "rgba(255, 230, 230, 1)" }, + { "name": "--a-surface-danger-subtle", "value": "rgba(255, 184, 184, 1)" }, { "name": "--a-surface-danger-subtle-hover", - "value": "rgba(255, 184, 184, 1)" + "value": "rgba(246, 130, 130, 1)" }, { "name": "--a-surface-danger", "value": "rgba(195, 0, 0, 1)" }, { "name": "--a-surface-danger-hover", "value": "rgba(173, 0, 0, 1)" }, { "name": "--a-surface-danger-active", "value": "rgba(140, 0, 0, 1)" }, - { "name": "--a-surface-warning-subtle", "value": "rgba(255, 249, 240, 1)" }, + { "name": "--a-surface-warning-subtle", "value": "rgba(255, 236, 204, 1)" }, { "name": "--a-surface-warning", "value": "rgba(255, 145, 0, 1)" }, { "name": "--a-surface-warning-subtle-hover", - "value": "rgba(255, 236, 204, 1)" + "value": "rgba(255, 215, 153, 1)" }, - { "name": "--a-surface-info-subtle", "value": "rgba(235, 252, 255, 1)" }, + { "name": "--a-surface-info-subtle", "value": "rgba(216, 249, 255, 1)" }, { "name": "--a-surface-info-subtle-hover", - "value": "rgba(216, 249, 255, 1)" + "value": "rgba(181, 241, 255, 1)" }, { "name": "--a-surface-info", "value": "rgba(102, 203, 236, 1)" }, { "name": "--a-surface-alt-1", "value": "rgba(130, 105, 162, 1)" }, - { "name": "--a-surface-alt-1-subtle", "value": "rgba(239, 236, 244, 1)" }, + { "name": "--a-surface-alt-1-subtle", "value": "rgba(224, 216, 233, 1)" }, { "name": "--a-surface-alt-2", "value": "rgba(193, 203, 51, 1)" }, - { "name": "--a-surface-alt-2-subtle", "value": "rgba(253, 255, 230, 1)" }, + { "name": "--a-surface-alt-2-subtle", "value": "rgba(249, 252, 204, 1)" }, { "name": "--a-surface-alt-3", "value": "rgba(0, 91, 130, 1)" }, - { "name": "--a-surface-alt-3-subtle", "value": "rgba(230, 241, 248, 1)" }, + { "name": "--a-surface-alt-3-subtle", "value": "rgba(204, 226, 240, 1)" }, { "name": "--a-surface-alt-3-strong", "value": "rgba(0, 52, 83, 1)" } ], "semantic-bg": [ @@ -292,11 +292,13 @@ { "name": "--a-icon-on-success", "value": "rgba(255, 255, 255, 1)" }, { "name": "--a-icon-danger", "value": "rgba(195, 0, 0, 1)" }, { "name": "--a-icon-on-danger", "value": "rgba(255, 255, 255, 1)" }, - { "name": "--a-icon-warning", "value": "rgba(212, 123, 0, 1)" }, + { "name": "--a-icon-warning", "value": "rgba(199, 115, 0, 1)" }, { "name": "--a-icon-on-warning", "value": "rgba(38, 38, 38, 1)" }, - { "name": "--a-icon-info", "value": "rgba(54, 141, 168, 1)" }, + { "name": "--a-icon-info", "value": "rgba(35, 107, 125, 1)" }, { "name": "--a-icon-on-info", "value": "rgba(38, 38, 38, 1)" }, - { "name": "--a-icon-alt-1", "value": "rgba(130, 105, 162, 1)" } + { "name": "--a-icon-alt-1", "value": "rgba(99, 70, 137, 1)" }, + { "name": "--a-icon-alt-2", "value": "rgba(127, 137, 0, 1)" }, + { "name": "--a-icon-alt-3", "value": "rgba(51, 128, 165, 1)" } ], "radius": [ { "name": "--a-border-radius-small", "value": "2px" }, diff --git a/@navikt/core/tokens/src/global-colors.json b/@navikt/core/tokens/src/global-colors.json index b62c6a0327..dc73b0b12c 100644 --- a/@navikt/core/tokens/src/global-colors.json +++ b/@navikt/core/tokens/src/global-colors.json @@ -287,7 +287,7 @@ "value": "rgba(255, 145, 0, 1)" }, "600": { - "value": "rgba(212, 123, 0, 1)" + "value": "rgba(199, 115, 0, 1)" }, "700": { "value": "rgba(168, 100, 0, 1)" diff --git a/@navikt/core/tokens/src/semantic-colors.json b/@navikt/core/tokens/src/semantic-colors.json index f7f14a9ab0..3f560c4e43 100644 --- a/@navikt/core/tokens/src/semantic-colors.json +++ b/@navikt/core/tokens/src/semantic-colors.json @@ -74,10 +74,10 @@ "value": "{a.white.value}" }, "hover": { - "value": "{a.grayalpha.50.value}" + "value": "{a.grayalpha.100.value}" }, "active": { - "value": "{a.grayalpha.100.value}" + "value": "{a.grayalpha.200.value}" }, "selected": { "value": "{a.blue.50.value}" @@ -150,8 +150,8 @@ "success": { "subtle": { - "hover": { "value": "{a.green.100.value}" }, - "@": { "value": "{a.green.50.value}" } + "hover": { "value": "{a.green.200.value}" }, + "@": { "value": "{a.green.100.value}" } }, "@": { "value": "{a.green.500.value}" }, "hover": { "value": "{a.green.600.value}" } @@ -159,8 +159,8 @@ "danger": { "subtle": { - "hover": { "value": "{a.red.100.value}" }, - "@": { "value": "{a.red.50.value}" } + "hover": { "value": "{a.red.200.value}" }, + "@": { "value": "{a.red.100.value}" } }, "hover": { "value": "{a.red.600.value}" @@ -173,30 +173,30 @@ "warning": { "subtle": { - "hover": { "value": "{a.orange.100.value}" }, - "@": { "value": "{a.orange.50.value}" } + "hover": { "value": "{a.orange.200.value}" }, + "@": { "value": "{a.orange.100.value}" } }, "@": { "value": "{a.orange.500.value}" } }, "info": { "subtle": { - "hover": { "value": "{a.lightblue.100.value}" }, - "@": { "value": "{a.lightblue.50.value}" } + "hover": { "value": "{a.lightblue.200.value}" }, + "@": { "value": "{a.lightblue.100.value}" } }, "@": { "value": "{a.lightblue.500.value}" } }, "alt1": { - "subtle": { "value": "{a.purple.50.value}" }, + "subtle": { "value": "{a.purple.100.value}" }, "@": { "value": "{a.purple.400.value}" } }, "alt2": { - "subtle": { "value": "{a.limegreen.50.value}" }, + "subtle": { "value": "{a.limegreen.100.value}" }, "@": { "value": "{a.limegreen.400.value}" } }, "alt3": { - "subtle": { "value": "{a.deepblue.50.value}" }, + "subtle": { "value": "{a.deepblue.100.value}" }, "strong": { "value": "{a.deepblue.800.value}" }, "@": { "value": "{a.deepblue.500.value}" } } @@ -252,7 +252,7 @@ "value": "{a.purple.400.value}" }, "alt2": { - "value": "{a.limegreen.400.value}" + "value": "{a.limegreen.700.value}" }, "alt3": { "value": "{a.deepblue.500.value}" @@ -286,10 +286,16 @@ "value": "{a.orange.600.value}" }, "info": { - "value": "{a.lightblue.700.value}" + "value": "{a.lightblue.800.value}" }, "alt1": { - "value": "{a.purple.400.value}" + "value": "{a.purple.500.value}" + }, + "alt2": { + "value": "{a.limegreen.700.value}" + }, + "alt3": { + "value": "{a.deepblue.400.value}" }, "on": { "neutral": { From 9715d96d462028c7d072a93e6741a97a975fc168 Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 7 Feb 2023 10:04:27 +0100 Subject: [PATCH 02/10] :art: Story for lenker i Alert --- @navikt/core/react/src/alert/alert.stories.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/@navikt/core/react/src/alert/alert.stories.tsx b/@navikt/core/react/src/alert/alert.stories.tsx index fca5956d76..328407e4b0 100644 --- a/@navikt/core/react/src/alert/alert.stories.tsx +++ b/@navikt/core/react/src/alert/alert.stories.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Alert } from "."; -import { BodyLong, Heading as DsHeading } from ".."; +import { BodyLong, Heading as DsHeading, Link } from ".."; export default { title: "ds-react/Alert", @@ -127,3 +127,15 @@ export const Heading = () => { ); }; + +export const Links = () => { + return ( +
+ {variants.map((variant, i) => ( + + Id elit esse enim reprehenderit + + ))} +
+ ); +}; From 2bb16d10a1be01b2cc122f4ac9f2ae22b2e3ace8 Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 7 Feb 2023 10:06:40 +0100 Subject: [PATCH 03/10] :memo: changeset --- .changeset/cyan-trainers-exercise.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/cyan-trainers-exercise.md diff --git a/.changeset/cyan-trainers-exercise.md b/.changeset/cyan-trainers-exercise.md new file mode 100644 index 0000000000..b016c7d0cc --- /dev/null +++ b/.changeset/cyan-trainers-exercise.md @@ -0,0 +1,5 @@ +--- +"@navikt/ds-tokens": minor +--- + +Justeringer i semantiske fargetokens, statusfarger nå mer tydelig From d21c7d47d88486736ef188d4af7851fb32c5fa50 Mon Sep 17 00:00:00 2001 From: Ken Date: Wed, 8 Feb 2023 15:11:27 +0100 Subject: [PATCH 04/10] =?UTF-8?q?:lipstick:=20Lenkefarger=20er=20alltid=20?= =?UTF-8?q?default=20p=C3=A5=20confirmationpanel=20og=20alert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- @navikt/core/css/link.css | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/@navikt/core/css/link.css b/@navikt/core/css/link.css index 46137d5fa6..d95d61beda 100644 --- a/@navikt/core/css/link.css +++ b/@navikt/core/css/link.css @@ -6,12 +6,8 @@ gap: var(--a-spacing-1); } -.navds-alert--info .navds-link { - color: var(--a-text-default); -} - -.navds-alert--error .navds-link, -.navds-confirmation-panel--error .navds-link { +.navds-alert .navds-link, +.navds-confirmation-panel .navds-link { color: var(--a-text-default); } From b04afabcc086e26878e3acc5275f22ad9fb5143e Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 14 Feb 2023 12:19:50 +0100 Subject: [PATCH 05/10] :lipstick: Justert red-100 fargen --- @navikt/core/tokens/docs.json | 4 ++-- @navikt/core/tokens/src/global-colors.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/@navikt/core/tokens/docs.json b/@navikt/core/tokens/docs.json index ffad93bf6d..77d2b670f9 100644 --- a/@navikt/core/tokens/docs.json +++ b/@navikt/core/tokens/docs.json @@ -69,7 +69,7 @@ ], "global-red": [ { "name": "--a-red-50", "value": "rgba(255, 230, 230, 1)" }, - { "name": "--a-red-100", "value": "rgba(255, 184, 184, 1)" }, + { "name": "--a-red-100", "value": "rgba(255, 194, 194, 1)" }, { "name": "--a-red-200", "value": "rgba(246, 130, 130, 1)" }, { "name": "--a-red-300", "value": "rgba(242, 92, 92, 1)" }, { "name": "--a-red-400", "value": "rgba(222, 46, 46, 1)" }, @@ -237,7 +237,7 @@ }, { "name": "--a-surface-success", "value": "rgba(6, 137, 58, 1)" }, { "name": "--a-surface-success-hover", "value": "rgba(0, 124, 46, 1)" }, - { "name": "--a-surface-danger-subtle", "value": "rgba(255, 184, 184, 1)" }, + { "name": "--a-surface-danger-subtle", "value": "rgba(255, 194, 194, 1)" }, { "name": "--a-surface-danger-subtle-hover", "value": "rgba(246, 130, 130, 1)" diff --git a/@navikt/core/tokens/src/global-colors.json b/@navikt/core/tokens/src/global-colors.json index dc73b0b12c..0cbf8df119 100644 --- a/@navikt/core/tokens/src/global-colors.json +++ b/@navikt/core/tokens/src/global-colors.json @@ -112,7 +112,7 @@ "value": "rgba(255, 230, 230, 1)" }, "100": { - "value": "rgba(255, 184, 184, 1)" + "value": "rgba(255, 194, 194, 1)" }, "200": { "value": "rgba(246, 130, 130, 1)" From 935b1cdc15298c7f4bdea16b1cc426d1ba37279d Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 14 Feb 2023 13:18:52 +0100 Subject: [PATCH 06/10] :art: Oppdatert docs-tester --- .../tokens/config/tests/validate-docs.test.js | 61 +++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 @navikt/core/tokens/config/tests/validate-docs.test.js diff --git a/@navikt/core/tokens/config/tests/validate-docs.test.js b/@navikt/core/tokens/config/tests/validate-docs.test.js new file mode 100644 index 0000000000..0c933fa9a2 --- /dev/null +++ b/@navikt/core/tokens/config/tests/validate-docs.test.js @@ -0,0 +1,61 @@ +const docs = require("../docs.json"); +const DsTokens = require("../dist/tokens-cjs.js"); +const kebabCase = require("./kebabCase.js"); + +const flatten = Object.values(docs).reduce((old, val) => [...old, ...val], []); + +const notFound = []; +const removed = []; +const wrongValues = []; + +describe("Validate tokens dokumentation", () => { + Object.entries(DsTokens).forEach(([key, val]) => + it("should have correct name and value combination", () => { + const formatedKey = `--${kebabCase(key)}`.replace("--az-", "--a-z-"); + + const tokenInDoc = flatten.find((x) => x.name === formatedKey); + if (!tokenInDoc) { + notFound.push(formatedKey); + return; + } + if (tokenInDoc.value !== val) { + wrongValues.push(`${tokenInDoc.name}: ${tokenInDoc.value}`); + } + }) + ); +}); + +flatten.forEach((x) => { + !Object.keys(DsTokens).find( + (y) => `--${kebabCase(y)}`.replace("--az-", "--a-z-") === x.name + ) && removed.push(x.name); +}); + +Object.entries(DsTokens).forEach(([key, val]) => { + const formatedKey = `--${kebabCase(key)}`.replace("--az-", "--a-z-"); + + const tokenInDoc = flatten.find((x) => x.name === formatedKey); + if (!tokenInDoc) { + notFound.push(formatedKey); + return; + } + if (tokenInDoc.value !== val) { + wrongValues.push(`${tokenInDoc.name}: ${tokenInDoc.value}`); + } +}); + +if (wrongValues.length || notFound.length || removed.length) { + console.group("Not documented tokens:"); + console.log(notFound); + console.groupEnd(); + + console.group("Documented tokens not in package:"); + console.log(removed); + console.groupEnd(); + + console.group("Tokens with wrong documentation:"); + console.log(wrongValues); + console.groupEnd(); + console.log("\n"); + throw new Error("Found errors when validation tokens."); +} From 5c7b31fba8530af6b5f6b2c0cb0fdf1049880aa2 Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 14 Feb 2023 14:50:06 +0100 Subject: [PATCH 07/10] =?UTF-8?q?:art:=20Bakgrunn=20p=C3=A5=20alert-ikoner?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- @navikt/core/css/alert.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/@navikt/core/css/alert.css b/@navikt/core/css/alert.css index 2f82e23d29..0379c468f5 100644 --- a/@navikt/core/css/alert.css +++ b/@navikt/core/css/alert.css @@ -24,6 +24,7 @@ font-size: 1.5rem; align-self: flex-start; height: var(--a-font-line-height-xlarge); + background: radial-gradient(circle, var(--a-surface-default) 50%, 0, transparent); } .navds-alert--small > .navds-alert__icon { @@ -41,6 +42,10 @@ background-color: var(--ac-alert-warning-bg, var(--a-surface-warning-subtle)); } +.navds-alert--warning > .navds-alert__icon { + background: radial-gradient(circle at 50% 57%, var(--a-surface-default) 32%, 0, transparent); +} + .navds-alert--info { border-color: var(--ac-alert-info-border, var(--a-border-info)); background-color: var(--ac-alert-info-bg, var(--a-surface-info-subtle)); From 46b85ad8a3760829eadb19482c33ca5c91adc9a5 Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 14 Feb 2023 15:07:03 +0100 Subject: [PATCH 08/10] :green_heart: Fikset tester for token CI --- .../tokens/config/tests/validate-docs.test.js | 38 ++++++++++------ @navikt/core/tokens/config/validate-docs.js | 44 ------------------- 2 files changed, 24 insertions(+), 58 deletions(-) delete mode 100644 @navikt/core/tokens/config/validate-docs.js diff --git a/@navikt/core/tokens/config/tests/validate-docs.test.js b/@navikt/core/tokens/config/tests/validate-docs.test.js index 0c933fa9a2..e8024d9a29 100644 --- a/@navikt/core/tokens/config/tests/validate-docs.test.js +++ b/@navikt/core/tokens/config/tests/validate-docs.test.js @@ -1,6 +1,6 @@ -const docs = require("../docs.json"); -const DsTokens = require("../dist/tokens-cjs.js"); -const kebabCase = require("./kebabCase.js"); +const docs = require("../../docs.json"); +const DsTokens = require("../../dist/tokens-cjs.js"); +const kebabCase = require("../kebabCase.js"); const flatten = Object.values(docs).reduce((old, val) => [...old, ...val], []); @@ -9,20 +9,30 @@ const removed = []; const wrongValues = []; describe("Validate tokens dokumentation", () => { - Object.entries(DsTokens).forEach(([key, val]) => - it("should have correct name and value combination", () => { + flatten.forEach((x) => { + it(`${x} should be documented`, () => { + expect( + Object.keys(DsTokens).find( + (y) => `--${kebabCase(y)}`.replace("--az-", "--a-z-") === x.name + ) + ).toBeDefined(); + }); + }); + + Object.entries(DsTokens).forEach(([key, val]) => { + const formatedKey = `--${kebabCase(key)}`.replace("--az-", "--a-z-"); + it(`${formatedKey} should exist in docs`, () => { + const tokenInDoc = flatten.find((x) => x.name === formatedKey); + expect(tokenInDoc).toBeDefined(); + }); + + it(`${formatedKey} should have correct value ${val}`, () => { const formatedKey = `--${kebabCase(key)}`.replace("--az-", "--a-z-"); const tokenInDoc = flatten.find((x) => x.name === formatedKey); - if (!tokenInDoc) { - notFound.push(formatedKey); - return; - } - if (tokenInDoc.value !== val) { - wrongValues.push(`${tokenInDoc.name}: ${tokenInDoc.value}`); - } - }) - ); + expect(tokenInDoc?.value).toEqual(val); + }); + }); }); flatten.forEach((x) => { diff --git a/@navikt/core/tokens/config/validate-docs.js b/@navikt/core/tokens/config/validate-docs.js deleted file mode 100644 index 6293f38a2c..0000000000 --- a/@navikt/core/tokens/config/validate-docs.js +++ /dev/null @@ -1,44 +0,0 @@ -const docs = require("../docs.json"); -const DsTokens = require("../dist/tokens-cjs.js"); -const kebabCase = require("./kebabCase.js"); - -const flatten = Object.values(docs).reduce((old, val) => [...old, ...val], []); - -const notFound = []; -const removed = []; -const wrongValues = []; - -flatten.forEach((x) => { - !Object.keys(DsTokens).find( - (y) => `--${kebabCase(y)}`.replace("--az-", "--a-z-") === x.name - ) && removed.push(x.name); -}); - -Object.entries(DsTokens).forEach(([key, val]) => { - const formatedKey = `--${kebabCase(key)}`.replace("--az-", "--a-z-"); - - const tokenInDoc = flatten.find((x) => x.name === formatedKey); - if (!tokenInDoc) { - notFound.push(formatedKey); - return; - } - if (tokenInDoc.value !== val) { - wrongValues.push(`${tokenInDoc.name}: ${tokenInDoc.value}`); - } -}); - -if (wrongValues.length || notFound.length || removed.length) { - console.group("Not documented tokens:"); - console.log(notFound); - console.groupEnd(); - - console.group("Documented tokens not in package:"); - console.log(removed); - console.groupEnd(); - - console.group("Tokens with wrong documentation:"); - console.log(wrongValues); - console.groupEnd(); - console.log("\n"); - throw new Error("Found errors when validation tokens."); -} From de7f3024036c8a1d794a7fd179f05c0bf375b00e Mon Sep 17 00:00:00 2001 From: Ken Date: Tue, 14 Feb 2023 15:11:28 +0100 Subject: [PATCH 09/10] :bug: Fikset build-script --- @navikt/core/tokens/package.json | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/@navikt/core/tokens/package.json b/@navikt/core/tokens/package.json index 4e135c1bef..524febf8f9 100644 --- a/@navikt/core/tokens/package.json +++ b/@navikt/core/tokens/package.json @@ -18,11 +18,10 @@ "docs.json" ], "scripts": { - "build": "node ./config/build.js > /dev/null && yarn validate-docs", + "build": "node ./config/build.js > /dev/null", "watch": "nodemon --watch src/index.js --exec \"yarn build\"", "token": "cd config && style-dictionary build", - "test": "jest", - "validate-docs": "node config/validate-docs.js" + "test": "jest" }, "repository": { "type": "git", From 0b24e8d424d44b0c6cee891ecdba60c386eb61d3 Mon Sep 17 00:00:00 2001 From: Ken Date: Thu, 16 Feb 2023 13:31:13 +0100 Subject: [PATCH 10/10] :fire: Fjernet demo-pakke for ikoner fra PR --- @navikt/aksel-icons/src/Mute.tsx | 70 ------------------- @navikt/aksel-icons/src/index.ts | 1 - @navikt/aksel-icons/src/util/useId.ts | 39 ----------- @navikt/aksel-icons/svgtest/ChevronCeft.svg | 3 - @navikt/aksel-icons/svgtest/ChevronCeft.yml | 6 -- @navikt/aksel-icons/svgtest/ChevronDown.svg | 3 - @navikt/aksel-icons/svgtest/ChevronDown.yml | 8 --- @navikt/aksel-icons/svgtest/ChevronRight.svg | 3 - @navikt/aksel-icons/svgtest/ChevronRight.yml | 6 -- @navikt/aksel-icons/svgtest/ChevronUp.svg | 3 - @navikt/aksel-icons/svgtest/ChevronUp.yml | 9 --- @navikt/aksel-icons/svgtest/Hearing.svg | 6 -- @navikt/aksel-icons/svgtest/Hearing.yml | 6 -- .../aksel-icons/svgtest/HearingImpaired.svg | 6 -- .../aksel-icons/svgtest/HearingImpaired.yml | 6 -- 15 files changed, 175 deletions(-) delete mode 100644 @navikt/aksel-icons/src/Mute.tsx delete mode 100644 @navikt/aksel-icons/src/index.ts delete mode 100644 @navikt/aksel-icons/src/util/useId.ts delete mode 100644 @navikt/aksel-icons/svgtest/ChevronCeft.svg delete mode 100644 @navikt/aksel-icons/svgtest/ChevronCeft.yml delete mode 100644 @navikt/aksel-icons/svgtest/ChevronDown.svg delete mode 100644 @navikt/aksel-icons/svgtest/ChevronDown.yml delete mode 100644 @navikt/aksel-icons/svgtest/ChevronRight.svg delete mode 100644 @navikt/aksel-icons/svgtest/ChevronRight.yml delete mode 100644 @navikt/aksel-icons/svgtest/ChevronUp.svg delete mode 100644 @navikt/aksel-icons/svgtest/ChevronUp.yml delete mode 100644 @navikt/aksel-icons/svgtest/Hearing.svg delete mode 100644 @navikt/aksel-icons/svgtest/Hearing.yml delete mode 100644 @navikt/aksel-icons/svgtest/HearingImpaired.svg delete mode 100644 @navikt/aksel-icons/svgtest/HearingImpaired.yml diff --git a/@navikt/aksel-icons/src/Mute.tsx b/@navikt/aksel-icons/src/Mute.tsx deleted file mode 100644 index 30d1f3424a..0000000000 --- a/@navikt/aksel-icons/src/Mute.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import * as React from "react"; -import { SVGProps, Ref, forwardRef } from "react"; -import { useId } from "./util/useId"; -interface SVGRProps { - title?: string; - titleId?: string; -} -const SvgMute = forwardRef( - ( - { title, titleId: _titleId, ...props }: SVGProps & SVGRProps, - ref: Ref - ) => { - let titleId: string | undefined = useId(); - titleId = title ? (_titleId ? _titleId : "title-" + titleId) : undefined; - return ( - - {title ? {title} : null} - - - - - - - - - - ); - } -); -export default SvgMute; diff --git a/@navikt/aksel-icons/src/index.ts b/@navikt/aksel-icons/src/index.ts deleted file mode 100644 index ca25fb5bfb..0000000000 --- a/@navikt/aksel-icons/src/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default as MuteIcon } from "./Mute"; diff --git a/@navikt/aksel-icons/src/util/useId.ts b/@navikt/aksel-icons/src/util/useId.ts deleted file mode 100644 index 5bd54abbea..0000000000 --- a/@navikt/aksel-icons/src/util/useId.ts +++ /dev/null @@ -1,39 +0,0 @@ -//https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/useId.ts -import React, { useEffect, useState } from "react"; - -let globalId = 0; -function useGlobalId(idOverride?: string): string | undefined { - const [defaultId, setDefaultId] = useState(idOverride); - const id = idOverride || defaultId; - useEffect(() => { - if (defaultId == null) { - // Fallback to this default id when possible. - // Use the incrementing value for client-side rendering only. - // We can't use it server-side. - // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem - globalId += 1; - setDefaultId(`aksel-icon-${globalId}`); - } - }, [defaultId]); - return id; -} - -// eslint-disable-next-line no-useless-concat -- Workaround for https://github.com/webpack/webpack/issues/14814 -const maybeReactUseId: undefined | (() => string) = (React as any)[ - // eslint-disable-next-line no-useless-concat - "useId" + "" -]; -/** - * - * @example
- * @param idOverride - * @returns {string} - */ -export function useId(idOverride?: string): string | undefined { - if (maybeReactUseId !== undefined) { - const reactId = maybeReactUseId(); - return idOverride ?? reactId.replace(/(:)/g, ""); - } - // eslint-disable-next-line react-hooks/rules-of-hooks -- `useId` is invariant at runtime. - return useGlobalId(idOverride) ?? ""; -} diff --git a/@navikt/aksel-icons/svgtest/ChevronCeft.svg b/@navikt/aksel-icons/svgtest/ChevronCeft.svg deleted file mode 100644 index 8f4950b1e2..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronCeft.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/@navikt/aksel-icons/svgtest/ChevronCeft.yml b/@navikt/aksel-icons/svgtest/ChevronCeft.yml deleted file mode 100644 index c3a07aec73..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronCeft.yml +++ /dev/null @@ -1,6 +0,0 @@ -name: ChevronCeft -category: Icons -keywords: - - "" -updated_at: 15.02.2023 -created_at: 15.02.2023 diff --git a/@navikt/aksel-icons/svgtest/ChevronDown.svg b/@navikt/aksel-icons/svgtest/ChevronDown.svg deleted file mode 100644 index 51aa641fc6..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronDown.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/@navikt/aksel-icons/svgtest/ChevronDown.yml b/@navikt/aksel-icons/svgtest/ChevronDown.yml deleted file mode 100644 index 725a8dbf59..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronDown.yml +++ /dev/null @@ -1,8 +0,0 @@ -name: ChevronDown -category: Icons -keywords: - - down - - open - - decrease -updated_at: 15.02.2023 -created_at: 15.02.2023 diff --git a/@navikt/aksel-icons/svgtest/ChevronRight.svg b/@navikt/aksel-icons/svgtest/ChevronRight.svg deleted file mode 100644 index e5e747e85b..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronRight.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/@navikt/aksel-icons/svgtest/ChevronRight.yml b/@navikt/aksel-icons/svgtest/ChevronRight.yml deleted file mode 100644 index c2ac272b02..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronRight.yml +++ /dev/null @@ -1,6 +0,0 @@ -name: ChevronRight -category: Icons -keywords: - - "" -updated_at: 15.02.2023 -created_at: 15.02.2023 diff --git a/@navikt/aksel-icons/svgtest/ChevronUp.svg b/@navikt/aksel-icons/svgtest/ChevronUp.svg deleted file mode 100644 index 83829f1214..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronUp.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/@navikt/aksel-icons/svgtest/ChevronUp.yml b/@navikt/aksel-icons/svgtest/ChevronUp.yml deleted file mode 100644 index c1efe1e8fa..0000000000 --- a/@navikt/aksel-icons/svgtest/ChevronUp.yml +++ /dev/null @@ -1,9 +0,0 @@ -name: ChevronUp -category: Icons -keywords: - - up - - collapse - - close - - increase -updated_at: 15.02.2023 -created_at: 15.02.2023 diff --git a/@navikt/aksel-icons/svgtest/Hearing.svg b/@navikt/aksel-icons/svgtest/Hearing.svg deleted file mode 100644 index 703acf32cd..0000000000 --- a/@navikt/aksel-icons/svgtest/Hearing.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/@navikt/aksel-icons/svgtest/Hearing.yml b/@navikt/aksel-icons/svgtest/Hearing.yml deleted file mode 100644 index e679d3256c..0000000000 --- a/@navikt/aksel-icons/svgtest/Hearing.yml +++ /dev/null @@ -1,6 +0,0 @@ -name: Hearing -category: Icons -keywords: - - "" -updated_at: 15.02.2023 -created_at: 15.02.2023 diff --git a/@navikt/aksel-icons/svgtest/HearingImpaired.svg b/@navikt/aksel-icons/svgtest/HearingImpaired.svg deleted file mode 100644 index 6a2cbc8c96..0000000000 --- a/@navikt/aksel-icons/svgtest/HearingImpaired.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/@navikt/aksel-icons/svgtest/HearingImpaired.yml b/@navikt/aksel-icons/svgtest/HearingImpaired.yml deleted file mode 100644 index 62580f6e90..0000000000 --- a/@navikt/aksel-icons/svgtest/HearingImpaired.yml +++ /dev/null @@ -1,6 +0,0 @@ -name: HearingImpaired -category: Icons -keywords: - - "" -updated_at: 15.02.2023 -created_at: 15.02.2023