Compare commits

..
Author SHA1 Message Date
github-actions[bot] fc6bdd70c7 Lerna versionbump [ci skip]
- @navikt/ds-icons@0.5.6
 - @navikt/ds-react@0.10.6
 - @navikt/ds-react-internal@0.5.4
2021-10-19 11:53:52 +00:00
Andreas Nordahl 998f0c7752 [fix] simplify tsconfig of @navikt/ds-react-internal (#1285)
* simplify tsconfig of @navikt/ds-react-internal

* new tsconfig for core react

* new tsconfig in icons

* rename tsconfig-esm to tsconfig.esm
2021-10-19 13:39:30 +02:00
Andreas NordahlandKen 900525fecf Typo migration guide (#1293)
* Typo migration guide draft

* Update @navikt/core/react/src/typography/stories/typography.stories.mdx

Co-authored-by: Ken <26967723+KenAJoh@users.noreply.github.com>

Co-authored-by: Ken <26967723+KenAJoh@users.noreply.github.com>
2021-10-18 17:37:22 +02:00
14 changed files with 101 additions and 79 deletions

No files matched your search

+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/ds-icons",
"version": "0.5.5",
"version": "0.5.6",
"private": false,
"description": "NAVs egne ikoner i SVG og React format",
"repository": {
@@ -31,7 +31,7 @@
"convert-icons": "node figma-api/pngConverter.mjs",
"clean": "rimraf src png NAV-ikonpakke-png.zip NAV-ikonpakke-svg.zip",
"zip-icons": "node figma-api/zipIcons.mjs",
"build": "yarn clean && yarn create-icons && tsc && tsc -p tsconfig-esm.json && yarn create-package-json-pointers-to-esm && yarn run convert-icons && yarn zip-icons"
"build": "yarn clean && yarn create-icons && tsc && tsc -p tsconfig.esm.json && yarn create-package-json-pointers-to-esm && yarn run convert-icons && yarn zip-icons"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0"
-13
View File
@@ -1,13 +0,0 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"compilerOptions": {
"rootDir": "./src",
"esModuleInterop": true,
"module": "ES2020",
"target": "ES2015",
"outDir": "./esm",
"sourceMap": true,
"declaration": true
},
"include": ["./src"]
}
+9
View File
@@ -0,0 +1,9 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./esm",
"module": "esnext",
"sourceMap": true,
"declaration": true
}
}
+3 -9
View File
@@ -1,13 +1,7 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"extends": "../../../tsconfig.json",
"compilerOptions": {
"module": "commonjs",
"outDir": "./cjs",
"target": "es2015",
"rootDir": "./src",
"esModuleInterop": true,
"sourceMap": false,
"declaration": false
},
"include": ["./src"]
"module": "commonjs"
}
}
+4 -4
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/ds-react",
"version": "0.10.5",
"version": "0.10.6",
"private": false,
"description": "NAV designsystem react components",
"author": "NAV Designsystem team",
@@ -29,13 +29,13 @@
"scripts": {
"create-package-json-pointers-to-esm": "node ../../../utilities/scripts/createPackageJsonsWithESMPointers.js",
"clean": "rimraf cjs esm",
"build": "yarn run clean && tsc && tsc -p tsconfig-esm.json && yarn create-package-json-pointers-to-esm",
"watch": "tsc --watch -p tsconfig-esm.json",
"build": "yarn run clean && tsc && tsc -p tsconfig.esm.json && yarn create-package-json-pointers-to-esm",
"watch": "tsc --watch -p tsconfig.esm.json",
"test": "jest"
},
"dependencies": {
"@material-ui/core": "^4.12.3",
"@navikt/ds-icons": "^0.5.5",
"@navikt/ds-icons": "^0.5.6",
"@popperjs/core": "^2.10.1",
"classnames": "^2.2.6",
"copy-to-clipboard": "^3.3.1",
@@ -1,4 +1,5 @@
import { Meta } from "@storybook/addon-docs";
import { Alert, Heading, BodyLong } from "@navikt/ds-react";
<Meta title="ds-react/Typography/intro" />
@@ -37,3 +38,46 @@ Vi anbefaler å før eller siden endre tilbake til default root font size da des
komponenter og design-tokens er basert på dette. Endringen til 18px root font size var i grunn for å teste en løsning for å
forstørre font, noe som er fikset ved nye typo-løsningen. Vi vil derfor unngå å måtte ha midlertidge patcher/fikser
for å tilpasse systemet for alle de forskjellige variantene av font size på root.
## Migrasjonsguide fra `nav-frontend-typografi` til `@navikt/ds-react`
De nye typografi-komponentene er ikke helt en-til-en med de gamle, så det kan hende du må trekke på en designer om du er usikker på hvilken komponent du skal velge. Eller du kan spørre en av oss i designsystemet.
### Overskrifter
Overskrifters tekststørrelse er nå uavhengig heading-nivå. Det betyr at du står fritt til å sørge for at overskrift-hierarkiet stemmer for din side, uavhengig av visuelt hierarki. Før kunne det være trøblete om men f.eks. ønsket seg en h1, men `<Sidetittel>` opplevdes som for stor.
En direkte en-til-en oversettelse av gamle komponenter til nye, hvor man bevarer størrelsene, ser sånn ut:
`<Sidetittel> -> <Heading size="2xlarge">`
`<Innholdstittel> -> <Heading size="xlarge">`
`<Systemtittel> -> <Heading size="medium">`
`<Undertittel> -> <Heading size="small">`
<Alert variant="warning">
Pass på å sette riktig `level` i hver Heading-komponent for å ivareta
hierarkiet (h1-h6).
</Alert>
### Brødtekst
De nye komponentene for brødtekst heter `<BodyLong>` og `<BodyShort>`. `<BodyLong>` er ment å brukes der det er snakk om løpende tekst, f.eks. i en artikkel. I komponent-tekst som med fordel kan være mer kompakt skal `<BodyShort>` brukes, for den har en lavere linjehøyde.
Ny brødtekst-størrelse er 18px. Om du bygger grensesnitt med kompakt design (les; interne flater) der du ønsker å fortsette å bruke 16px brødtekst så finnes det en `<BodyLong size="small">` og `<BodyShort size="small">` som er til for deg.
`<Normaltekst> ->` `<BodyLong>`/`<BodyShort>` (muligens med `size=small`)
### Andre komponenter
`<Ingress> -> <Ingress>`
`<Element> -> <Label>`
`<UndertekstBold> -> <Detail>`
`<Undertekst> -> <Detail size="small">`
`<Feilmelding>` Denne har vi valgt å ikke videreføre, for vi er usikre på om det er behov for en egen komponent. Skriv gjerne en melding på #designsystem eller send en PM til @andreas.nordahl eller @ken.aleksander.johansen om du savner den.
-14
View File
@@ -1,14 +0,0 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"compilerOptions": {
"outDir": "./esm",
"rootDir": "./src",
"esModuleInterop": true,
"module": "ES2020",
"target": "ES2015",
"sourceMap": true,
"declaration": true
},
"include": ["./src"],
"exclude": ["./src/**/stories", "**/*.test.ts", "**/*.test.tsx"]
}
+9
View File
@@ -0,0 +1,9 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./esm",
"module": "esnext",
"sourceMap": true,
"declaration": true
}
}
+3 -8
View File
@@ -1,14 +1,9 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"extends": "../../../tsconfig.json",
"compilerOptions": {
"outDir": "./cjs",
"rootDir": "./src",
"esModuleInterop": true,
"module": "commonjs",
"target": "es2015",
"sourceMap": false,
"declaration": false
"noImplicitAny": false
},
"include": ["./src"],
"exclude": ["./src/**/stories", "**/*.test.ts", "**/*.test.tsx"]
"include": ["./src"]
}
+5 -5
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/ds-react-internal",
"version": "0.5.3",
"version": "0.5.4",
"private": false,
"description": "NAV internal designsystem react components",
"author": "NAV Designsystem team",
@@ -29,12 +29,12 @@
"scripts": {
"create-package-json-pointers-to-esm": "node ../../../utilities/scripts/createPackageJsonsWithESMPointers.js",
"clean": "rimraf cjs esm",
"build": "yarn run clean && tsc && tsc -p tsconfig-esm.json && yarn create-package-json-pointers-to-esm",
"watch": "tsc --watch -p tsconfig-esm.json"
"build": "yarn run clean && tsc && tsc -p tsconfig.esm.json && yarn create-package-json-pointers-to-esm",
"watch": "tsc --watch -p tsconfig.esm.json"
},
"dependencies": {
"@navikt/ds-icons": "^0.5.5",
"@navikt/ds-react": "^0.10.5",
"@navikt/ds-icons": "^0.5.6",
"@navikt/ds-react": "^0.10.6",
"classnames": "^2.3.1"
},
"devDependencies": {
-14
View File
@@ -1,14 +0,0 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"compilerOptions": {
"outDir": "./esm",
"rootDir": "./src",
"esModuleInterop": true,
"module": "ES2020",
"target": "ES2015",
"sourceMap": true,
"declaration": true
},
"include": ["./src"],
"exclude": ["./src/**/stories", "**/*.test.ts", "**/*.test.tsx"]
}
+9
View File
@@ -0,0 +1,9 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./esm",
"module": "esnext",
"sourceMap": true,
"declaration": true
}
}
+3 -10
View File
@@ -1,14 +1,7 @@
{
"extends": "../../../utilities/build/tsconfig-pakker.json",
"extends": "../../../tsconfig.json",
"compilerOptions": {
"outDir": "./cjs",
"rootDir": "./src",
"esModuleInterop": true,
"module": "commonjs",
"target": "es2015",
"sourceMap": false,
"declaration": false
},
"include": ["./src"],
"exclude": ["./src/**/stories", "**/*.test.ts", "**/*.test.tsx"]
"module": "commonjs"
}
}
+10
View File
@@ -0,0 +1,10 @@
{
"compilerOptions": {
"jsx": "react",
"strict": true,
"esModuleInterop": true,
"target": "es6",
"moduleResolution": "node"
},
"exclude": ["**/stories", "**/*.test.ts", "**/*.test.tsx"]
}