Compare commits

...
Author SHA1 Message Date
github-actions[bot]andgithub-actions[bot] 3edb149b01 Version Packages (#1957)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-05-04 10:34:54 +02:00
Ken 8c85590099 🐛 CheckMarkCircle var ikke riktig alignet (#1956) 2023-05-04 10:31:38 +02:00
github-actions[bot]andgithub-actions[bot] 029d3c7719 Version Packages (#1955)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-05-03 16:00:48 +02:00
Ken 7019898c09 🐛 Timeline håndterte ikke startDate/endDate-endringer riktig (#1953) 2023-05-03 15:50:55 +02:00
github-actions[bot]andgithub-actions[bot] 36f4f5646a Version Packages (#1954)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-05-03 15:23:45 +02:00
Ken 27b2b4a11c 🚚 Flyttet codemods fra @navikt/ds-codemods -> @navikt/aksel (#1952) 2023-05-03 15:17:12 +02:00
Ken 9c0174e206 🎨 Ansvarlig for tema er nå opt-in for god-praksis 2023-05-03 12:23:55 +02:00
github-actions[bot]andgithub-actions[bot] b99a29f805 Version Packages (#1951)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-28 12:38:10 +02:00
Ken c03d53d5aa 🎉 Nye ikoner (#1950) 2023-04-28 12:30:50 +02:00
github-actions[bot]andgithub-actions[bot] 30330473b1 Version Packages (#1949)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-27 16:20:52 +02:00
Ken b1e18fd724 🐛 Timeline bruker nå norsk locale (#1948) 2023-04-27 16:18:41 +02:00
Ken 5b458c2d52 💄 Ascii-art for CLI 2023-04-27 15:22:19 +02:00
github-actions[bot]andgithub-actions[bot] 6450922b32 Version Packages (#1947)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-27 14:46:32 +02:00
Ken f6e3840cde 📝 Bedre dokumentasjon for @navikt/aksel (#1946) 2023-04-27 14:41:49 +02:00
Ken 1afdee453f 🏷️ Conditional ExpansionCard-prop (#1944) 2023-04-27 14:38:43 +02:00
Ken 1c7734fb09 📝 Bedre dokumentasjon textarea 2023-04-27 12:26:35 +02:00
Ken 9816c4f3a9 ⬆️ Oppdatert sanity til 3.9.1 2023-04-27 12:10:46 +02:00
Ken c40bf79a46 🐛 Forside brakk ved bruk av Card uten ingress/metadata 2023-04-27 10:54:27 +02:00
Ken b1cf8e4724 🐛 CDN fikk ikke riktig mappe for generert CSS 2023-04-27 09:54:06 +02:00
Ken 4578693878 🐛 Release-workflow for CSS hadde feil nesting 2023-04-26 08:58:18 +02:00
Ken 297aef13ad ⬆️ Yarn lock 2023-04-26 08:57:15 +02:00
github-actions[bot]andgithub-actions[bot] d5c040d24f Version Packages (#1942)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-26 08:35:28 +02:00
Ken 250d6c55b6 ⬆️ Yarn lock 2023-04-26 08:17:44 +02:00
Ken de69c6c18b 🐛 Sync ds-css version with CLI 2023-04-26 08:16:16 +02:00
Ken 657b7f3f3e Fragmentert CSS + CLI-verktøy @navikt/aksel (#1941) 2023-04-26 08:13:40 +02:00
Ken 00697c7581 ⚰️ Fjernet Snyk-scans fra workflows (#1940) 2023-04-25 19:11:27 +02:00
Ken a556ac6d44 ⚰️ Fjernet Snyk-scans fra workflows (#1940) 2023-04-25 19:09:41 +02:00
github-actions[bot]andgithub-actions[bot] 32c7228504 Version Packages (#1938)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-24 15:45:26 +02:00
Ken ff001f2bcf 🐛 ExpansionCard.Content sendte ikke videre className 2023-04-24 15:35:09 +02:00
Ken 048dc285eb 🔥 Fjernet github-realeases fra changeset-config 2023-04-24 09:26:04 +02:00
github-actions[bot]andgithub-actions[bot] ecd58dd7d3 Version Packages (#1934)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-04-24 09:12:11 +02:00
Ken 2845342468 🎨 Datepickers viser nå bare in-range datoer ved input-fokus (#1929) 2023-04-21 19:03:36 +02:00
Ken 6682be1c8e 🔧 Alle pakker bruker nå npm provernance for verifisering (#1930) 2023-04-21 19:03:19 +02:00
Ken dfe923582a 🎉 Nye ikoner for aksel-icons (#1928) 2023-04-21 11:01:22 +02:00
166 changed files with 5306 additions and 613 deletions

No files matched your search

+1
View File
@@ -12,6 +12,7 @@
"@navikt/ds-react-internal",
"@navikt/ds-codemod",
"@navikt/aksel-icons",
"@navikt/aksel",
"@navikt/ds-icons"
]
],
-28
View File
@@ -6,34 +6,6 @@ on:
- next
jobs:
snyk-monitor:
name: monitor dependencies
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Run Snyk to check for vulnerabilities
continue-on-error: true
uses: snyk/actions/node@master
env:
SNYK_TOKEN: ${{ secrets.SNYK_TOKEN }}
with:
command: monitor
args: --org=designsystemet --severity-threshold=high
snyk-test:
name: analyze dependencies
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Run Snyk to check for vulnerabilities
uses: snyk/actions/node@master
continue-on-error: true
env:
SNYK_TOKEN: ${{ secrets.SNYK_TOKEN }}
with:
command: test
args: --org=designsystemet --severity-threshold=high
build_and_deploy:
name: Build and deploy to dev-gcp
runs-on: ubuntu-20.04
-28
View File
@@ -10,34 +10,6 @@ env:
IMAGE: ghcr.io/navikt/aksel
jobs:
snyk-monitor:
name: monitor dependencies
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Run Snyk to check for vulnerabilities
continue-on-error: true
uses: snyk/actions/node@master
env:
SNYK_TOKEN: ${{ secrets.SNYK_TOKEN }}
with:
command: monitor
args: --org=designsystemet --severity-threshold=high
snyk-test:
name: analyze dependencies
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Run Snyk to check for vulnerabilities
uses: snyk/actions/node@master
continue-on-error: true
env:
SNYK_TOKEN: ${{ secrets.SNYK_TOKEN }}
with:
command: test
args: --org=designsystemet --severity-threshold=high
sync_data_with_sanity:
name: Update component data
runs-on: ubuntu-latest
+16 -1
View File
@@ -11,7 +11,7 @@ concurrency: ${{ github.workflow }}-${{ github.ref }}
jobs:
build:
name: "Release packages"
if: "!contains(github.event.head_commit.message, '[ci skip]')"
if: ${{!contains(github.event.head_commit.message, '[ci skip]')}}
runs-on: ubuntu-latest
permissions:
id-token: "write"
@@ -45,6 +45,7 @@ jobs:
with:
version: yarn version
publish: yarn release
createGithubReleases: false
env:
NPM_TOKEN: ${{ secrets.NPM_AUTOMATION }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -82,3 +83,17 @@ jobs:
cdn-team-name: aksel
source: ./@navikt/aksel-icons/aksel-icons.zip
destination: "/icons/zip"
- name: Get @navikt/ds-css version
run: |
VERSION=$(yarn css:get-version)
echo "version=$VERSION" >> $GITHUB_ENV
echo "Version of @navikt/ds-css: ${{ env.version }}"
- name: Upload CSS to NAV CDN
if: steps.changesets.outputs.published == 'true'
uses: navikt/frontend/actions/cdn-upload/v1@main
with:
cdn-team-name: aksel
source: ./@navikt/core/css/dist/version/${{env.version}}
destination: "@navikt/ds-css"
+38
View File
@@ -1,5 +1,43 @@
# @navikt/aksel-icons
## 2.9.6
### Patch Changes
- [#1956](https://github.com/navikt/aksel/pull/1956) [`8c8559009`](https://github.com/navikt/aksel/commit/8c8559009982911bc4402913656ba4cc6a223dd1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :bug: Fikset CheckmarkCircleIcon
## 2.9.5
## 2.9.4
## 2.9.3
### Patch Changes
- [#1950](https://github.com/navikt/aksel/pull/1950) [`c03d53d5a`](https://github.com/navikt/aksel/commit/c03d53d5aa2dc7f06a223d48069fa21ee39bb396) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Nye ikoner
- :tada: BulletList
- :tada: NumberList
## 2.9.2
## 2.9.1
## 2.9.0
## 2.8.16
## 2.8.15
### Patch Changes
- [#1928](https://github.com/navikt/aksel/pull/1928) [`dfe923582`](https://github.com/navikt/aksel/commit/dfe923582a57b41c77cfb4fbfa7c56be047ef2b0) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Lagt til nye ikoner :tada:
- HandKnot.svg
- HandKnotFilled.svg
- [#1930](https://github.com/navikt/aksel/pull/1930) [`6682be1c8`](https://github.com/navikt/aksel/commit/6682be1c8e6562213c64e5be4bed70fef54ab865) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Alle pakker implementerer nå npm provenance (beta)
## 2.8.14
## 2.8.13
+1 -1
View File
@@ -13,5 +13,5 @@ keywords:
- forward
- videresend
variant: Stroke
updated_at: 08.03.2023
updated_at: 20.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -11,5 +11,5 @@ keywords:
- overføring
- overgang
variant: Stroke
updated_at: 08.03.2023
updated_at: 24.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -12,5 +12,5 @@ keywords:
- ombestemt
- back
variant: Stroke
updated_at: 08.03.2023
updated_at: 21.04.2023
created_at: 07.03.2023
@@ -13,5 +13,5 @@ keywords:
- oppfrisking
- oppdatering
variant: Stroke
updated_at: 08.03.2023
updated_at: 25.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -1,3 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.75 18.1893L17.75 9.5C17.75 9.08579 17.4142 8.75 17 8.75C16.5858 8.75 16.25 9.08579 16.25 9.5L16.25 18.1893L14.0303 15.9697C13.7374 15.6768 13.2626 15.6768 12.9697 15.9697C12.6768 16.2626 12.6768 16.7374 12.9697 17.0303L16.4697 20.5303C16.5416 20.6022 16.6245 20.6565 16.7129 20.6931C16.8013 20.7298 16.8983 20.75 17 20.75C17.1017 20.75 17.1987 20.7298 17.2871 20.6931C17.3755 20.6565 17.4584 20.6022 17.5303 20.5303L21.0303 17.0303C21.3232 16.7374 21.3232 16.2626 21.0303 15.9697C20.7374 15.6768 20.2626 15.6768 19.9697 15.9697L17.75 18.1893ZM11.0303 6.96967L7.53033 3.46967C7.45842 3.39776 7.37555 3.34351 7.28709 3.30691C7.19866 3.27024 7.10169 3.25 7 3.25C6.80806 3.25 6.61612 3.32322 6.46967 3.46967L2.96967 6.96967C2.67678 7.26256 2.67678 7.73744 2.96967 8.03033C3.26256 8.32322 3.73744 8.32322 4.03033 8.03033L6.25 5.81066L6.25 14.5C6.25 14.9142 6.58579 15.25 7 15.25C7.41421 15.25 7.75 14.9142 7.75 14.5L7.75 5.81066L9.96967 8.03033C10.2626 8.32322 10.7374 8.32322 11.0303 8.03033C11.3232 7.73744 11.3232 7.26256 11.0303 6.96967Z" fill="#262626"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.5303 21.0303C17.2374 21.3232 16.7626 21.3232 16.4697 21.0303L12.9697 17.5303C12.6768 17.2374 12.6768 16.7626 12.9697 16.4697C13.2626 16.1768 13.7374 16.1768 14.0303 16.4697L16.25 18.6893L16.25 9.5C16.25 9.08579 16.5858 8.75 17 8.75C17.4142 8.75 17.75 9.08579 17.75 9.5L17.75 18.6893L19.9697 16.4697C20.2626 16.1768 20.7374 16.1768 21.0303 16.4697C21.3232 16.7626 21.3232 17.2374 21.0303 17.5303L17.5303 21.0303ZM11.0303 6.46967L7.53033 2.96967C7.23744 2.67678 6.76256 2.67678 6.46967 2.96967L2.96967 6.46967C2.67678 6.76256 2.67678 7.23744 2.96967 7.53033C3.26256 7.82322 3.73744 7.82322 4.03033 7.53033L6.25 5.31066L6.25 14.5C6.25 14.9142 6.58579 15.25 7 15.25C7.41421 15.25 7.75 14.9142 7.75 14.5L7.75 5.31066L9.96967 7.53033C10.2626 7.82322 10.7374 7.82322 11.0303 7.53033C11.3232 7.23744 11.3232 6.76256 11.0303 6.46967Z" fill="#262626"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 999 B

+1 -1
View File
@@ -9,5 +9,5 @@ keywords:
- sortering
- sorting
variant: Stroke
updated_at: 12.04.2023
updated_at: 24.04.2023
created_at: 07.03.2023
+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 5.75C3.86193 5.75 3.75 5.86193 3.75 6C3.75 6.13807 3.86193 6.25 4 6.25C4.13807 6.25 4.25 6.13807 4.25 6C4.25 5.86193 4.13807 5.75 4 5.75ZM2.25 6C2.25 5.0335 3.0335 4.25 4 4.25C4.9665 4.25 5.75 5.0335 5.75 6C5.75 6.9665 4.9665 7.75 4 7.75C3.0335 7.75 2.25 6.9665 2.25 6ZM3.75 12C3.75 11.8619 3.86193 11.75 4 11.75C4.13807 11.75 4.25 11.8619 4.25 12C4.25 12.1381 4.13807 12.25 4 12.25C3.86193 12.25 3.75 12.1381 3.75 12ZM4 10.25C3.0335 10.25 2.25 11.0335 2.25 12C2.25 12.9665 3.0335 13.75 4 13.75C4.9665 13.75 5.75 12.9665 5.75 12C5.75 11.0335 4.9665 10.25 4 10.25ZM3.75 18C3.75 17.8619 3.86193 17.75 4 17.75C4.13807 17.75 4.25 17.8619 4.25 18C4.25 18.1381 4.13807 18.25 4 18.25C3.86193 18.25 3.75 18.1381 3.75 18ZM4 16.25C3.0335 16.25 2.25 17.0335 2.25 18C2.25 18.9665 3.0335 19.75 4 19.75C4.9665 19.75 5.75 18.9665 5.75 18C5.75 17.0335 4.9665 16.25 4 16.25ZM9 17.25C8.58579 17.25 8.25 17.5858 8.25 18C8.25 18.4142 8.58579 18.75 9 18.75H21C21.4142 18.75 21.75 18.4142 21.75 18C21.75 17.5858 21.4142 17.25 21 17.25H9ZM8.25 12C8.25 11.5858 8.58579 11.25 9 11.25H21C21.4142 11.25 21.75 11.5858 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75H9C8.58579 12.75 8.25 12.4142 8.25 12ZM9 5.25C8.58579 5.25 8.25 5.58579 8.25 6C8.25 6.41421 8.58579 6.75 9 6.75H21C21.4142 6.75 21.75 6.41421 21.75 6C21.75 5.58579 21.4142 5.25 21 5.25H9Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

@@ -1,10 +1,11 @@
name: List
name: BulletList
category: Statistics and math
sub_category: Tabular
keywords:
- liste
- rekkefølge
- order
- punktliste
variant: Stroke
updated_at: 08.03.2023
updated_at: 28.04.2023
created_at: 07.03.2023
@@ -15,5 +15,5 @@ keywords:
- fullføring
- validering
variant: Stroke
updated_at: 08.03.2023
updated_at: 04.05.2023
created_at: 07.03.2023
@@ -1,3 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21ZM16.5725 9.48447C16.8401 9.16827 16.8007 8.69503 16.4845 8.42748C16.1683 8.15992 15.695 8.19935 15.4275 8.51556L10.454 14.3933L8.03033 11.9697C7.73744 11.6768 7.26256 11.6768 6.96967 11.9697C6.67678 12.2626 6.67678 12.7375 6.96967 13.0303L9.96967 16.0303C10.118 16.1787 10.3216 16.2581 10.5312 16.2494C10.7407 16.2407 10.9371 16.1446 11.0725 15.9845L16.5725 9.48447Z" fill="#262626"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.75 21.5C17.1348 21.5 21.5 17.1348 21.5 11.75C21.5 6.36522 17.1348 2 11.75 2C6.36522 2 2 6.36522 2 11.75C2 17.1348 6.36522 21.5 11.75 21.5ZM16.7036 9.02485C16.9934 8.68229 16.9507 8.16962 16.6082 7.87977C16.2656 7.58991 15.7529 7.63263 15.4631 7.97519L10.0751 14.3428L7.44952 11.7172C7.13222 11.3999 6.61778 11.3999 6.30048 11.7172C5.98317 12.0345 5.98317 12.5489 6.30048 12.8662L9.55048 16.1162C9.71114 16.2769 9.93175 16.3629 10.1588 16.3535C10.3858 16.344 10.5985 16.24 10.7453 16.0665L16.7036 9.02485Z" fill="#262626"/>
</svg>

Before

Width:  |  Height:  |  Size: 650 B

After

Width:  |  Height:  |  Size: 679 B

@@ -15,5 +15,5 @@ keywords:
- fullføring
- validering
variant: Fill
updated_at: 08.03.2023
updated_at: 04.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -6,5 +6,5 @@ keywords:
- venstre
- side
variant: Stroke
updated_at: 08.03.2023
updated_at: 20.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -9,5 +9,5 @@ keywords:
- vise/skjule
- bytte
variant: Stroke
updated_at: 08.03.2023
updated_at: 02.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -10,5 +10,5 @@ keywords:
- nettverk
- network
variant: Stroke
updated_at: 08.03.2023
updated_at: 18.04.2023
created_at: 07.03.2023
@@ -13,5 +13,5 @@ keywords:
- oppmerksomhet
- viktig
variant: Stroke
updated_at: 08.03.2023
updated_at: 25.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -9,5 +9,5 @@ keywords:
- open
- åpne
variant: Stroke
updated_at: 08.03.2023
updated_at: 19.04.2023
created_at: 07.03.2023
+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.75023 5C8.75023 4.30964 9.30988 3.75 10.0002 3.75C10.6906 3.75 11.2502 4.30964 11.2502 5V5.75H8.75023V5ZM8.75023 7.25V13.5C8.75023 13.7929 8.57973 14.059 8.31363 14.1814C8.04753 14.3038 7.73453 14.2601 7.51214 14.0694L5.39829 12.2576C4.91367 11.8422 4.19095 11.8699 3.73962 12.3213C3.30979 12.7511 3.26143 13.4316 3.62616 13.9179L8.37524 20.25H18.3986L19.6173 14.7659C19.8869 13.5528 19.122 12.3509 17.909 12.0813L11.8375 10.7321C11.4944 10.6559 11.2502 10.3515 11.2502 10V7.25H8.75023ZM10.0002 2.25C8.4921 2.25 7.26751 3.46401 7.25042 4.9681C7.03844 4.82515 6.81067 4.68453 6.58336 4.56753C6.28845 4.41573 5.89474 4.25 5.5 4.25C4.25736 4.25 3.25 5.25736 3.25 6.5C3.25 7.74264 4.25736 8.75 5.5 8.75C5.89474 8.75 6.28845 8.58427 6.58336 8.43247C6.8106 8.31551 7.03831 8.17493 7.25023 8.03203V11.8693L6.37448 11.1187C5.29475 10.1932 3.68453 10.255 2.67896 11.2606C1.72129 12.2183 1.61354 13.7344 2.42616 14.8179L7.40024 21.45C7.54188 21.6389 7.76417 21.75 8.00023 21.75H19.0002C19.3518 21.75 19.6561 21.5059 19.7324 21.1627L21.0816 15.0913C21.5309 13.0695 20.2561 11.0663 18.2344 10.6171L12.7502 9.39837V8.03234C12.962 8.17514 13.1896 8.31559 13.4166 8.43247C13.7115 8.58427 14.1053 8.75 14.5 8.75C15.7426 8.75 16.75 7.74264 16.75 6.5C16.75 5.25736 15.7426 4.25 14.5 4.25C14.1053 4.25 13.7115 4.41573 13.4166 4.56753C13.1895 4.68444 12.9619 4.82495 12.75 4.96779C12.7328 3.46385 11.5083 2.25 10.0002 2.25ZM13.3772 6.6411C13.3116 6.59389 13.2475 6.54657 13.1859 6.5C13.2475 6.45343 13.3116 6.40611 13.3772 6.3589C13.6227 6.18236 13.8759 6.0182 14.1031 5.90122C14.2162 5.84301 14.3119 5.80222 14.3886 5.77707C14.4608 5.75335 14.4956 5.7504 14.4997 5.75005C14.5002 5.75001 14.5003 5.75 14.5 5.75C14.9142 5.75 15.25 6.08579 15.25 6.5C15.25 6.91421 14.9142 7.25 14.5 7.25L14.5001 7.24999C14.5002 7.25 14.5002 7.25 14.5 7.25L14.4997 7.24995C14.4956 7.2496 14.4608 7.24665 14.3886 7.22293C14.3119 7.19778 14.2162 7.15699 14.1031 7.09878C13.8759 6.9818 13.6227 6.81764 13.3772 6.6411ZM6.81414 6.5C6.75246 6.45343 6.68842 6.40611 6.62277 6.3589C6.3773 6.18236 6.12414 6.0182 5.89688 5.90122C5.78379 5.84301 5.68809 5.80222 5.61143 5.77707C5.53915 5.75335 5.50443 5.7504 5.50025 5.75005C5.49978 5.75001 5.4997 5.75 5.5 5.75C5.08579 5.75 4.75 6.08579 4.75 6.5C4.75 6.91421 5.08579 7.25 5.5 7.25C5.4997 7.25 5.49978 7.24999 5.50025 7.24995C5.50443 7.2496 5.53915 7.24665 5.61143 7.22293C5.68809 7.19778 5.78379 7.15699 5.89688 7.09878C6.12414 6.9818 6.3773 6.81764 6.62277 6.6411C6.68842 6.59389 6.75246 6.54657 6.81414 6.5Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

+12
View File
@@ -0,0 +1,12 @@
name: HandKnot
category: People
sub_category: Hands
keywords:
- hånd
- påminnelse
- note
- notat
- reminder
variant: Stroke
updated_at: 21.04.2023
created_at: 21.04.2023
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.25042 4.9681C7.26752 3.46401 8.4921 2.25 10.0002 2.25C11.5083 2.25 12.7328 3.46384 12.7501 4.96778C12.9619 4.82494 13.1895 4.68444 13.4166 4.56753C13.7115 4.41573 14.1053 4.25 14.5 4.25C15.7426 4.25 16.75 5.25736 16.75 6.5C16.75 7.74264 15.7426 8.75 14.5 8.75C14.1053 8.75 13.7115 8.58427 13.4166 8.43247C13.1896 8.31559 12.962 8.17514 12.7502 8.03235L12.7502 5V9.39837L18.2344 10.6171C20.2561 11.0663 21.5309 13.0695 21.0816 15.0913L19.7324 21.1627C19.6561 21.5059 19.3518 21.75 19.0002 21.75H8.00024C7.76417 21.75 7.54188 21.6389 7.40024 21.45L2.42616 14.8179C1.61354 13.7344 1.72129 12.2183 2.67896 11.2606C3.68453 10.255 5.29475 10.1932 6.37448 11.1187L7.25024 11.8693L7.25024 8.03202C7.03831 8.17493 6.8106 8.31551 6.58336 8.43247C6.28845 8.58427 5.89474 8.75 5.5 8.75C4.25736 8.75 3.25 7.74264 3.25 6.5C3.25 5.25736 4.25736 4.25 5.5 4.25C5.89474 4.25 6.28845 4.41573 6.58336 4.56753C6.81067 4.68453 7.03844 4.82515 7.25042 4.9681ZM12 7C12 7.13807 11.8881 7.25 11.75 7.25H8.25C8.11193 7.25 8 7.13807 8 7V6C8 5.86193 8.11193 5.75 8.25 5.75H11.75C11.8881 5.75 12 5.86193 12 6V7ZM6.62277 6.3589C6.68842 6.40611 6.75246 6.45343 6.81414 6.5C6.75246 6.54657 6.68842 6.59389 6.62277 6.6411C6.3773 6.81764 6.12414 6.9818 5.89688 7.09878C5.78379 7.15699 5.68809 7.19778 5.61143 7.22293C5.53915 7.24665 5.50417 7.24965 5.5 7.25C5.08579 7.25 4.75 6.91421 4.75 6.5C4.75 6.08579 5.08604 5.75005 5.50025 5.75005C5.50443 5.7504 5.53915 5.75335 5.61143 5.77707C5.68809 5.80222 5.78379 5.84301 5.89688 5.90122C6.12414 6.0182 6.3773 6.18236 6.62277 6.3589ZM13.3772 6.6411C13.3116 6.59389 13.2475 6.54657 13.1859 6.5C13.2475 6.45343 13.3116 6.40611 13.3772 6.3589C13.6227 6.18236 13.8759 6.0182 14.1031 5.90122C14.2162 5.84301 14.3119 5.80222 14.3886 5.77707C14.4608 5.75335 14.4958 5.75035 14.5 5.75C14.9142 5.75 15.25 6.08579 15.25 6.5C15.25 6.91421 14.914 7.24995 14.4997 7.24995C14.4956 7.2496 14.4608 7.24665 14.3886 7.22293C14.3119 7.19778 14.2162 7.15699 14.1031 7.09878C13.8759 6.9818 13.6227 6.81764 13.3772 6.6411Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

@@ -0,0 +1,12 @@
name: HandKnotFilled
category: People
sub_category: Hands
keywords:
- hånd
- påminnelse
- note
- notat
- reminder
variant: Filled
updated_at: 21.04.2023
created_at: 21.04.2023
+1 -1
View File
@@ -10,5 +10,5 @@ keywords:
- wardrobe
- kleshenger
variant: Stroke
updated_at: 08.03.2023
updated_at: 18.04.2023
created_at: 07.03.2023
-3
View File
@@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 4.25C2.58579 4.25 2.25 4.58579 2.25 5V7C2.25 7.41421 2.58579 7.75 3 7.75H5C5.41421 7.75 5.75 7.41421 5.75 7V5C5.75 4.58579 5.41421 4.25 5 4.25H3ZM3.75 6.25V5.75H4.25V6.25H3.75ZM3 10.25C2.58579 10.25 2.25 10.5858 2.25 11V13C2.25 13.4142 2.58579 13.75 3 13.75H5C5.41421 13.75 5.75 13.4142 5.75 13V11C5.75 10.5858 5.41421 10.25 5 10.25H3ZM3.75 12.25V11.75H4.25V12.25H3.75ZM2.25 17C2.25 16.5858 2.58579 16.25 3 16.25H5C5.41421 16.25 5.75 16.5858 5.75 17V19C5.75 19.4142 5.41421 19.75 5 19.75H3C2.58579 19.75 2.25 19.4142 2.25 19V17ZM3.75 17.75V18.25H4.25V17.75H3.75ZM8 17.25C7.58579 17.25 7.25 17.5858 7.25 18C7.25 18.4142 7.58579 18.75 8 18.75H21C21.4142 18.75 21.75 18.4142 21.75 18C21.75 17.5858 21.4142 17.25 21 17.25H8ZM7.25 12C7.25 11.5858 7.58579 11.25 8 11.25H21C21.4142 11.25 21.75 11.5858 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75H8C7.58579 12.75 7.25 12.4142 7.25 12ZM8 5.25C7.58579 5.25 7.25 5.58579 7.25 6C7.25 6.41421 7.58579 6.75 8 6.75H21C21.4142 6.75 21.75 6.41421 21.75 6C21.75 5.58579 21.4142 5.25 21 5.25H8Z" fill="#262626"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

-3
View File
@@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 4.25C2.58579 4.25 2.25 4.58579 2.25 5V7C2.25 7.41421 2.58579 7.75 3 7.75H5C5.41421 7.75 5.75 7.41421 5.75 7V5C5.75 4.58579 5.41421 4.25 5 4.25H3ZM3 10.25C2.58579 10.25 2.25 10.5858 2.25 11V13C2.25 13.4142 2.58579 13.75 3 13.75H5C5.41421 13.75 5.75 13.4142 5.75 13V11C5.75 10.5858 5.41421 10.25 5 10.25H3ZM2.25 17C2.25 16.5858 2.58579 16.25 3 16.25H5C5.41421 16.25 5.75 16.5858 5.75 17V19C5.75 19.4142 5.41421 19.75 5 19.75H3C2.58579 19.75 2.25 19.4142 2.25 19V17ZM8 17.25C7.58579 17.25 7.25 17.5858 7.25 18C7.25 18.4142 7.58579 18.75 8 18.75H21C21.4142 18.75 21.75 18.4142 21.75 18C21.75 17.5858 21.4142 17.25 21 17.25H8ZM7.25 12C7.25 11.5858 7.58579 11.25 8 11.25H21C21.4142 11.25 21.75 11.5858 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75H8C7.58579 12.75 7.25 12.4142 7.25 12ZM8 5.25C7.58579 5.25 7.25 5.58579 7.25 6C7.25 6.41421 7.58579 6.75 8 6.75H21C21.4142 6.75 21.75 6.41421 21.75 6C21.75 5.58579 21.4142 5.25 21 5.25H8Z" fill="#262626"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

+1 -1
View File
@@ -7,5 +7,5 @@ keywords:
- grid
- rutenett
variant: Stroke
updated_at: 08.03.2023
updated_at: 19.04.2023
created_at: 07.03.2023
+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.25 5C5.25 4.7234 5.09776 4.46926 4.8539 4.33875C4.61003 4.20823 4.31412 4.22254 4.08398 4.37596L2.58398 5.37596C2.23933 5.60573 2.1462 6.07138 2.37597 6.41603C2.60573 6.76067 3.07138 6.8538 3.41603 6.62404L3.75 6.40139V9.75H3C2.58579 9.75 2.25 10.0858 2.25 10.5C2.25 10.9142 2.58579 11.25 3 11.25H4.5H6C6.41422 11.25 6.75 10.9142 6.75 10.5C6.75 10.0858 6.41422 9.75 6 9.75H5.25V5ZM4.5 14.25C4.08579 14.25 3.75 14.5858 3.75 15C3.75 15.4142 3.41422 15.75 3 15.75C2.58579 15.75 2.25 15.4142 2.25 15C2.25 13.7574 3.25736 12.75 4.5 12.75H4.54007C5.76058 12.75 6.75 13.7394 6.75 14.9599C6.75 15.4875 6.56129 15.9976 6.21798 16.3981L4.63067 18.25H6C6.41422 18.25 6.75 18.5858 6.75 19C6.75 19.4142 6.41422 19.75 6 19.75H3C2.70711 19.75 2.44101 19.5795 2.31862 19.3134C2.19623 19.0473 2.23995 18.7343 2.43056 18.5119L5.07909 15.422C5.18938 15.2933 5.25 15.1294 5.25 14.9599C5.25 14.5679 4.93215 14.25 4.54007 14.25H4.5ZM9 17.25C8.58579 17.25 8.25 17.5858 8.25 18C8.25 18.4142 8.58579 18.75 9 18.75H21C21.4142 18.75 21.75 18.4142 21.75 18C21.75 17.5858 21.4142 17.25 21 17.25H9ZM8.25 12C8.25 11.5858 8.58579 11.25 9 11.25H21C21.4142 11.25 21.75 11.5858 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75H9C8.58579 12.75 8.25 12.4142 8.25 12ZM9 5.25C8.58579 5.25 8.25 5.58579 8.25 6C8.25 6.41421 8.58579 6.75 9 6.75H21C21.4142 6.75 21.75 6.41421 21.75 6C21.75 5.58579 21.4142 5.25 21 5.25H9Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

@@ -1,10 +1,11 @@
name: ListFill
name: NumberList
category: Statistics and math
sub_category: Tabular
keywords:
- liste
- rekkefølge
- order
variant: Fill
updated_at: 08.03.2023
created_at: 07.03.2023
- nummerliste
variant: Stroke
updated_at: 28.04.2023
created_at: 28.04.2023
+1 -1
View File
@@ -13,5 +13,5 @@ keywords:
- papir
- kontorrekvisita
variant: Stroke
updated_at: 08.03.2023
updated_at: 18.04.2023
created_at: 07.03.2023
+1 -1
View File
@@ -20,5 +20,5 @@ keywords:
- ansvar
- paragraf
variant: Stroke
updated_at: 08.03.2023
updated_at: 03.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -6,5 +6,5 @@ keywords:
- legg til
- more
variant: Stroke
updated_at: 08.03.2023
updated_at: 03.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -11,5 +11,5 @@ keywords:
- doctor
- patient
variant: Stroke
updated_at: 08.03.2023
updated_at: 18.04.2023
created_at: 07.03.2023
+3 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/aksel-icons",
"version": "2.8.14",
"version": "2.9.6",
"author": "Aksel | NAV",
"homepage": "https://aksel.nav.no/ikoner",
"repository": {
@@ -17,7 +17,8 @@
"svg"
],
"publishConfig": {
"access": "public"
"access": "public",
"provenance": true
},
"sideEffects": [
"*.svg"
+1
View File
@@ -0,0 +1 @@
dist
+54
View File
@@ -0,0 +1,54 @@
# @navikt/aksel
## 2.9.6
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.6
## 2.9.5
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.5
## 2.9.4
### Patch Changes
- [#1952](https://github.com/navikt/aksel/pull/1952) [`27b2b4a11`](https://github.com/navikt/aksel/commit/27b2b4a11caf5ca05c96c686c453653d8a900e5f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :truck: Flyttet Codemods from `@navikt/ds-codemods` -> `@navikt/aksel`.
- `@navikt/ds-codemods` vil bli deprecated ettehvert.
- Updated dependencies []:
- @navikt/ds-css@2.9.4
## 2.9.3
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.3
## 2.9.2
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.2
## 2.9.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.1
## 2.9.0
### Patch Changes
- Updated dependencies [[`657b7f3f3`](https://github.com/navikt/aksel/commit/657b7f3f3e62c5ce3173e6c95a29fcd237ce7343)]:
- @navikt/ds-css@2.9.0
+173
View File
@@ -0,0 +1,173 @@
# Aksel command line interface
CLI tool for managing CSS-imports and Codemods when consuming Aksel-packages.
[Documentation](https://aksel.nav.no/preview/grunnleggende/kode/kommandolinje)
```bash
run:
npx @navikt/aksel
commands:
css-imports: Generate css-imports for all components from Aksel
codemod: Codemods for version-migrations related to Aksel
```
## Codemods
Codemods are code-transformations that patches breaking changes in your project. This helps when migrating without spending time doing it manually.
```bash
To get started:
npx @navikt/aksel codemod --help
```
### v1 -> v2
[Documentation](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112)
v2-css: Patches changed css-variables
v2-js: Patches changed js-variables
v2-sass: Patches changed sass-variables
v2-less: Patches changed less-variables
#### css-tokens (--navds format)
`npx @navikt/aksel codemod v2-css src`
When having redefined a token, you will need to manually find and replace these instances after the codemod-run. A global search for `--v2-migration__` will show all found instances where you had redefined a token.
```diff
.example{
- color: var(--navds-global-color-gray-900);
+ color: var(--a-gray-900);
- --navds-semantic-color-text: red;
+ --v2-migration__navds-semantic-color-text: red;
}
```
#### sass/scss-tokens ($navds format)
`npx @navikt/aksel codemod v2-sass src`
```diff
.example{
- color: $navds-global-color-gray-900;
+ color: $a-gray-900;
}
```
#### less-tokens (@navds format)
`npx @navikt/aksel codemod v2-less src`
```diff
.example{
- color: @navds-global-color-gray-900;
+ color: @a-gray-900;
}
```
#### js-tokens
`npx @navikt/aksel codemod v2-js src`
```diff
- import { NavdsGlobalColorGray900 } from "@navikt/ds-tokens";
+ import { AGray900 } from "@navikt/ds-tokens";
const styled = styled.p`
- color: ${NavdsGlobalColorGray900};
+ color: ${AGray900};
`
```
### beta -> v1
[Documentation](https://aksel.nav.no/grunnleggende/kode/migrering#h50d54a5af8c1)
v1-preset: Runs all codemods for beta -> v1
v1-pagination: Fixes breaking API-changes for <Pagination /> component
v1-tabs: Fixes breaking API-changes for <Tabs /> component
v1-chat: Fixes breaking API-changes for <SpeechBubble /> (now <Chat/>) component
#### preset
Combines all avaliable codemods for migrating from beta -> v1. This transform should only be ran once.
Includes these transforms
- v1-tabs
- v1-chat
- v1-pagination
#### tabs
`npx @navikt/aksel codemod v1-tabs src`
```diff
<Tabs
defaultValue="logg"
onChange={(x) => console.log(x)}
- loop
+ iconPosition="left"
>
<Tabs.List
- loop
>
<Tabs.Tab
value="logg"
label="logg"
- iconPosition="left"
/>
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
</Tabs>
```
#### chat
`npx @navikt/aksel codemod v1-chat src`
```diff
-<SpeechBubble
+<Chat
- illustration={<Illustration />}
- topText="Ola Normann 01.01.21 14:00"
- illustrationBgColor="blue"
+ avatar={<Illustration />}
+ name="Ola Normann 01.01.21 14:00"
+ avatarBgColor="blue"
backgroundColor="red"
>
- <SpeechBubble.Bubble>
+ <Chat.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
- </SpeechBubble.Bubble>
+ </Chat.Bubble>
-</SpeechBubble>
+</Chat>
```
#### pagination
`npx @navikt/aksel codemod v1-pagination src`
This codemod can only be ran once, since the size-scale will keep decreasing for each subsequent iteration.
```diff
-<Pagiation />
+<Pagiation size="small"/>
-<Pagiation size="medium"/>
+<Pagiation size="small"/>
-<Pagiation size="small"/>
+<Pagiation size="xsmall"/>
```
## License
[MIT](https://github.com/navikt/aksel/blob/main/LICENCE)
+8
View File
@@ -0,0 +1,8 @@
const config = {
transform: { "^.+\\.js?$": "ts-jest", "^.+\\.ts?$": "ts-jest" },
testMatch: ["**/tests/*.test.ts"],
verbose: true,
rootDir: ".",
};
module.exports = config;
+62
View File
@@ -0,0 +1,62 @@
{
"name": "@navikt/aksel",
"version": "2.9.6",
"description": "Aksel command line interface. Handles css-imports, codemods and more",
"author": "Aksel | NAV designsystem team",
"license": "MIT",
"keywords": [
"Commandline",
"CLI",
"CDN",
"Codemods"
],
"files": [
"dist",
"!dist/**/tests"
],
"scripts": {
"clean": "rimraf dist",
"build": "yarn clean && tsc -p tsconfig.json",
"dev": "tsc --watch -p tsconfig.json",
"test": "yarn build && jest",
"test:watch": "jest --watch"
},
"bin": "./dist/index.js",
"repository": {
"type": "git",
"url": "git+https://github.com/navikt/aksel.git",
"directory": "@navikt/aksel"
},
"homepage": "https://aksel.nav.no/grunnleggende/kode/kommandolinje",
"dependencies": {
"@navikt/ds-css": "2.9.6",
"axios": "1.3.6",
"chalk": "4.1.0",
"clipboardy": "^2.3.0",
"commander": "10.0.1",
"enquirer": "^2.3.6",
"fast-glob": "3.2.11",
"figlet": "1.6.0",
"is-git-clean": "1.1.0",
"jscodeshift": "0.13.1",
"jscodeshift-add-imports": "1.0.10",
"lodash": "4.17.21",
"react-scanner": "^1.1.0"
},
"devDependencies": {
"@types/inquirer": "^9.0.3",
"@types/jest": "^29.0.0",
"jest": "^29.0.0",
"rimraf": "3.0.2",
"ts-jest": "^29.0.0",
"typescript": "^4.8.0"
},
"sideEffects": false,
"engines": {
"node": ">=16.0.0"
},
"publishConfig": {
"access": "public",
"provenance": true
}
}
+46
View File
@@ -0,0 +1,46 @@
import { Command } from "commander";
import figlet from "figlet";
import chalk from "chalk";
import { getMigrationString } from "./migrations.js";
import { validateGit, validateMigration } from "./validation.js";
import { runCodeshift } from "./run-codeshift.js";
const program = new Command();
export function codemodCommand() {
program.name(`${chalk.blueBright(`npx @navikt/aksel`)}`);
program
.command("codemod")
.addHelpText("beforeAll", figlet.textSync("Codemods"))
.addHelpText(
"afterAll",
chalk.gray(`\nAvailable migrations:\n${getMigrationString()}`)
)
.description("Migrations for Aksel components and more")
.argument("<migration>", "Migration name")
.option("-e, --ext [extension]", "default: js,ts,jsx,tsx,css,scss,less")
.option(
"-g, --glob [glob]",
"Globbing pattern, overrides --ext! Run with 'noglob' if using zsh-terminal. "
)
.option("-d, --dry-run", "Dry run, no changes will be made")
.option("-p, --print", "Print transformed files")
.option(
"-f, --force",
"Forcibly run migrations without checking git-changes"
)
.addHelpText(
"after",
`\nExample:
$ npx @navikt/aksel --dry-run v2-css`
)
.action((str, options) => {
validateMigration(str, program);
validateGit(options, program);
runCodeshift(str, options, program);
});
program.parse();
}
+77
View File
@@ -0,0 +1,77 @@
import chalk from "chalk";
export const migrations: {
[key: string]: { description: string; value: string; path: string }[];
} = {
"1.0.0": [
{
description: "Runs all codemods for beta -> v1 migration",
value: "v1-preset",
path: "v1.0.0/preset/preset",
},
{
description: "Fixes breaking API-changes for <Pagination /> component",
value: "v1-pagination",
path: "v1.0.0/pagination/pagination",
},
{
description: "Fixes breaking API-changes for <Tabs /> component",
value: "v1-tabs",
path: "v1.0.0/tabs/tabs",
},
{
description:
"Fixes breaking API-changes for <SpeechBubble /> (now <Chat/>) component",
value: "v1-chat",
path: "v1.0.0/chat/chat",
},
],
"2.0.0": [
{
description: "Patches changed css-variables",
value: "v2-css",
path: "v2.0.0/update-css-tokens/update-css-tokens",
},
{
description: "Patches changed js-variables",
value: "v2-js",
path: "v2.0.0/update-js-tokens/update-js-tokens",
},
{
description: "Patches changed sass-variables",
value: "v2-sass",
path: "v2.0.0/update-sass-tokens/update-sass-tokens",
},
{
description: "Patches changed less-variables",
value: "v2-less",
path: "v2.0.0/update-less-tokens/update-less-tokens",
},
],
};
export function getMigrationPath(str: string) {
return Object.values(migrations)
.reduce((acc, val) => [...val, ...acc], [])
.find((x) => x.value === str)?.path;
}
export function getMigrationNames() {
return Object.values(migrations).reduce(
(acc, val) => [...val.map((x) => x.value), ...acc],
[] as string[]
);
}
export function getMigrationString() {
let str = "";
Object.entries(migrations).forEach(([version, migrations]) => {
str += `\n${chalk.underline(version)}\n`;
migrations.forEach((migration) => {
str += `${chalk.blue(migration.value)}: ${migration.description}\n`;
});
});
return str;
}
@@ -0,0 +1,64 @@
import { Command } from "commander";
import fg from "fast-glob";
import * as jscodeshift from "jscodeshift/src/Runner";
import path from "path";
import { getMigrationPath } from "./migrations";
import chalk from "chalk";
const ignoreNodeModules = [
"**/node_modules/**",
"**/dist/**",
"**/build/**",
"**/lib/**",
"**/.next/**",
];
export async function runCodeshift(
input: string,
options: any,
program: Command
) {
const codemodPath = path.join(
__dirname,
`./transforms/${getMigrationPath(input)}.js`
);
const filepaths = fg.sync([options.glob ?? getDefaultGlob(options?.ext)], {
cwd: process.cwd(),
ignore: ignoreNodeModules,
});
console.log("\nRunning migration:", chalk.green("input"));
options?.glob && console.log(`Using glob: ${chalk.green(options.glob)}\n`);
try {
await jscodeshift.run(codemodPath, filepaths, {
babel: true,
ignorePattern: ignoreNodeModules,
extensions: "tsx,ts,jsx,js",
parser: "tsx",
verbose: 2,
runInBand: true,
silent: false,
stdin: false,
dry: options?.dryRun,
force: options?.force,
print: options?.print,
});
} catch (error) {
program.error(chalk.red("Error:", error.message));
}
}
function getDefaultGlob(ext: string): string {
const defaultExt = "js,ts,jsx,tsx,css,scss,less";
return `**/*.{${cleanExtensions(ext ?? defaultExt).join(",")}}`;
}
function cleanExtensions(ext: string): string[] {
return ext
.split(",")
.map((e) => e.trim())
.map((e) => e.replace(".", ""));
}
@@ -0,0 +1,19 @@
import { getMigrationNames, getMigrationPath } from "../migrations";
import path from "path";
import fs from "fs";
describe("migrations", () => {
const values = getMigrationNames();
const paths = values.map((x) => getMigrationPath(x));
paths.forEach((x) => {
const checkPath = path.join(
process.cwd(),
"dist/codemod",
`transforms/${x}.js`
);
test(`Check transform-path: ${checkPath}`, () => {
expect(fs.existsSync(checkPath)).toBeTruthy();
});
});
});
+368
View File
@@ -0,0 +1,368 @@
/* prettier-ignore */
const tokens = [
["--navds-semantic-color-text-inverted", "--a-text-on-inverted"],
["--navds-semantic-color-text-muted", "--a-text-subtle"],
["--navds-semantic-color-text", "--a-text-default"],
["--navds-semantic-color-feedback-danger-text", "--a-text-danger"],
["--navds-semantic-color-link-visited", "--a-text-visited"],
["--navds-semantic-color-link", "--a-text-action"],
["--navds-spacing-32", "--a-spacing-32"],
["--navds-spacing-24", "--a-spacing-24"],
["--navds-spacing-20", "--a-spacing-20"],
["--navds-spacing-18", "--a-spacing-18"],
["--navds-spacing-16", "--a-spacing-16"],
["--navds-spacing-14", "--a-spacing-14"],
["--navds-spacing-12", "--a-spacing-12"],
["--navds-spacing-11", "--a-spacing-11"],
["--navds-spacing-10", "--a-spacing-10"],
["--navds-spacing-9", "--a-spacing-9"],
["--navds-spacing-8", "--a-spacing-8"],
["--navds-spacing-7", "--a-spacing-7"],
["--navds-spacing-6", "--a-spacing-6"],
["--navds-spacing-5", "--a-spacing-5"],
["--navds-spacing-4", "--a-spacing-4"],
["--navds-spacing-3", "--a-spacing-3"],
["--navds-spacing-2", "--a-spacing-2"],
["--navds-spacing-1", "--a-spacing-1"],
["--navds-global-color-purple-900", "--a-purple-900"],
["--navds-global-color-purple-800", "--a-purple-800"],
["--navds-global-color-purple-700", "--a-purple-700"],
["--navds-global-color-purple-600", "--a-purple-600"],
["--navds-global-color-purple-500", "--a-purple-500"],
["--navds-global-color-purple-400", "--a-purple-400"],
["--navds-global-color-purple-300", "--a-purple-300"],
["--navds-global-color-purple-200", "--a-purple-200"],
["--navds-global-color-purple-100", "--a-purple-100"],
["--navds-global-color-purple-50", "--a-purple-50"],
["--navds-global-color-orange-900", "--a-orange-900"],
["--navds-global-color-orange-800", "--a-orange-800"],
["--navds-global-color-orange-700", "--a-orange-700"],
["--navds-global-color-orange-600", "--a-orange-600"],
["--navds-global-color-orange-500", "--a-orange-500"],
["--navds-global-color-orange-400", "--a-orange-400"],
["--navds-global-color-orange-300", "--a-orange-300"],
["--navds-global-color-orange-200", "--a-orange-200"],
["--navds-global-color-orange-100", "--a-orange-100"],
["--navds-global-color-orange-50", "--a-orange-50"],
["--navds-global-color-limegreen-900", "--a-limegreen-900"],
["--navds-global-color-limegreen-800", "--a-limegreen-800"],
["--navds-global-color-limegreen-700", "--a-limegreen-700"],
["--navds-global-color-limegreen-600", "--a-limegreen-600"],
["--navds-global-color-limegreen-500", "--a-limegreen-500"],
["--navds-global-color-limegreen-400", "--a-limegreen-400"],
["--navds-global-color-limegreen-300", "--a-limegreen-300"],
["--navds-global-color-limegreen-200", "--a-limegreen-200"],
["--navds-global-color-limegreen-100", "--a-limegreen-100"],
["--navds-global-color-limegreen-50", "--a-limegreen-50"],
["--navds-global-color-lightblue-900", "--a-lightblue-900"],
["--navds-global-color-lightblue-800", "--a-lightblue-800"],
["--navds-global-color-lightblue-700", "--a-lightblue-700"],
["--navds-global-color-lightblue-600", "--a-lightblue-600"],
["--navds-global-color-lightblue-500", "--a-lightblue-500"],
["--navds-global-color-lightblue-400", "--a-lightblue-400"],
["--navds-global-color-lightblue-300", "--a-lightblue-300"],
["--navds-global-color-lightblue-200", "--a-lightblue-200"],
["--navds-global-color-lightblue-100", "--a-lightblue-100"],
["--navds-global-color-lightblue-50", "--a-lightblue-50"],
["--navds-global-color-green-900", "--a-green-900"],
["--navds-global-color-green-800", "--a-green-800"],
["--navds-global-color-green-700", "--a-green-700"],
["--navds-global-color-green-600", "--a-green-600"],
["--navds-global-color-green-500", "--a-green-500"],
["--navds-global-color-green-400", "--a-green-400"],
["--navds-global-color-green-300", "--a-green-300"],
["--navds-global-color-green-200", "--a-green-200"],
["--navds-global-color-green-100", "--a-green-100"],
["--navds-global-color-green-50", "--a-green-50"],
["--navds-global-color-deepblue-900", "--a-deepblue-900"],
["--navds-global-color-deepblue-800", "--a-deepblue-800"],
["--navds-global-color-deepblue-700", "--a-deepblue-700"],
["--navds-global-color-deepblue-600", "--a-deepblue-600"],
["--navds-global-color-deepblue-500", "--a-deepblue-500"],
["--navds-global-color-deepblue-400", "--a-deepblue-400"],
["--navds-global-color-deepblue-300", "--a-deepblue-300"],
["--navds-global-color-deepblue-200", "--a-deepblue-200"],
["--navds-global-color-deepblue-100", "--a-deepblue-100"],
["--navds-global-color-deepblue-50", "--a-deepblue-50"],
["--navds-global-color-red-900", "--a-red-900"],
["--navds-global-color-red-800", "--a-red-800"],
["--navds-global-color-red-700", "--a-red-700"],
["--navds-global-color-red-600", "--a-red-600"],
["--navds-global-color-red-500", "--a-red-500"],
["--navds-global-color-red-400", "--a-red-400"],
["--navds-global-color-red-300", "--a-red-300"],
["--navds-global-color-red-200", "--a-red-200"],
["--navds-global-color-red-100", "--a-red-100"],
["--navds-global-color-red-50", "--a-red-50"],
["--navds-global-color-blue-900", "--a-blue-900"],
["--navds-global-color-blue-800", "--a-blue-800"],
["--navds-global-color-blue-700", "--a-blue-700"],
["--navds-global-color-blue-600", "--a-blue-600"],
["--navds-global-color-blue-500", "--a-blue-500"],
["--navds-global-color-blue-400", "--a-blue-400"],
["--navds-global-color-blue-300", "--a-blue-300"],
["--navds-global-color-blue-200", "--a-blue-200"],
["--navds-global-color-blue-100", "--a-blue-100"],
["--navds-global-color-blue-50", "--a-blue-50"],
["--navds-global-color-gray-900", "--a-gray-900"],
["--navds-global-color-gray-800", "--a-gray-800"],
["--navds-global-color-gray-700", "--a-gray-700"],
["--navds-global-color-gray-600", "--a-gray-600"],
["--navds-global-color-gray-500", "--a-gray-500"],
["--navds-global-color-gray-400", "--a-gray-400"],
["--navds-global-color-gray-300", "--a-gray-300"],
["--navds-global-color-gray-200", "--a-gray-200"],
["--navds-global-color-gray-100", "--a-gray-100"],
["--navds-global-color-gray-50", "--a-gray-50"],
["--navds-global-color-nav-red", "--a-nav-red"],
["--navds-global-color-white", "--a-white"],
["--navds-global-color-transparent", "--a-transparent"],
["--navds-border-radius-full", "--a-border-radius-full"],
["--navds-border-radius-xlarge", "--a-border-radius-xlarge"],
["--navds-border-radius-large", "--a-border-radius-large"],
["--navds-border-radius-medium", "--a-border-radius-medium"],
["--navds-border-radius-small", "--a-border-radius-small"],
["--navds-z-index-tooltip", "--a-z-index-tooltip"],
["--navds-z-index-focus", "--a-z-index-focus"],
["--navds-z-index-popover", "--a-z-index-popover"],
["--navds-z-index-modal", "--a-z-index-modal"],
["--navds-font-weight-regular", "--a-font-weight-regular"],
["--navds-font-weight-bold", "--a-font-weight-bold"],
["--navds-font-size-small", "--a-font-size-small"],
["--navds-font-size-medium", "--a-font-size-medium"],
["--navds-font-size-large", "--a-font-size-large"],
["--navds-font-size-xlarge", "--a-font-size-xlarge"],
["--navds-font-size-heading-xsmall", "--a-font-size-heading-xsmall"],
["--navds-font-size-heading-small", "--a-font-size-heading-small"],
["--navds-font-size-heading-medium", "--a-font-size-heading-medium"],
["--navds-font-size-heading-large", "--a-font-size-heading-large"],
["--navds-font-size-heading-xlarge", "--a-font-size-heading-xlarge"],
["--navds-font-size-heading-2xlarge", "--a-font-size-heading-2xlarge"],
["--navds-font-line-height-medium", "--a-font-line-height-medium"],
["--navds-font-line-height-large", "--a-font-line-height-large"],
["--navds-font-line-height-xlarge", "--a-font-line-height-xlarge"],
["--navds-font-line-height-heading-xsmall","--a-font-line-height-heading-xsmall"],
["--navds-font-line-height-heading-small","--a-font-line-height-heading-small"],
["--navds-font-line-height-heading-medium","--a-font-line-height-heading-medium"],
["--navds-font-line-height-heading-large","--a-font-line-height-heading-large"],
["--navds-font-line-height-heading-xlarge","--a-font-line-height-heading-xlarge"],
["--navds-font-line-height-heading-2xlarge","--a-font-line-height-heading-2xlarge"],
["--navds-font-family", "--a-font-family"],
["--navds-semantic-color-feedback-info-icon", "--a-icon-info"],
["--navds-semantic-color-feedback-warning-icon", "--a-icon-warning"],
["--navds-semantic-color-feedback-danger-icon", "--a-icon-danger"],
["--navds-semantic-color-feedback-success-icon", "--a-icon-success"],
["--navds-semantic-color-feedback-info-background", "--a-surface-info-subtle"],
["--navds-semantic-color-feedback-warning-background", "--a-surface-warning-subtle"],
["--navds-semantic-color-interaction-danger-selected", "--a-surface-danger-active"],
["--navds-semantic-color-interaction-danger-hover", "--a-surface-danger-hover"],
["--navds-semantic-color-interaction-danger", "--a-surface-danger"],
["--navds-semantic-color-feedback-danger-background", "--a-surface-danger-subtle"],
["--navds-semantic-color-feedback-success-background", "--a-surface-success-subtle"],
["--navds-semantic-color-interaction-primary-hover-subtle","--a-surface-action-subtle-hover"],
["--navds-semantic-color-interaction-primary-selected","--a-surface-action-selected"],
["--navds-semantic-color-interaction-primary-hover","--a-surface-action-hover"],
["--navds-semantic-color-interaction-primary", "--a-surface-action"],
["--navds-semantic-color-canvas-background-inverted", "--a-surface-inverted"],
["--navds-semantic-color-component-background-inverted", "--a-surface-inverted"],
["--navds-semantic-color-component-background-alternate", "--a-surface-subtle"],
["--navds-semantic-color-component-background-light", "--a-surface-default"],
["--navds-semantic-color-canvas-background-light", "--a-bg-default"],
["--navds-semantic-color-canvas-background", "--a-bg-subtle"],
["--navds-semantic-color-border-inverted", "--a-border-on-inverted"],
["--navds-semantic-color-border-muted", "--a-border-default"],
["--navds-semantic-color-border", "--a-border-strong"],
["--navds-semantic-color-focus-inverted", "--a-border-focus-on-inverted"],
["--navds-semantic-color-focus", "--a-border-focus"],
["--navds-semantic-color-feedback-info-border", "--a-border-info"],
["--navds-semantic-color-feedback-warning-border", "--a-border-warning"],
["--navds-semantic-color-feedback-danger-border", "--a-border-danger"],
["--navds-semantic-color-feedback-success-border", "--a-border-success"],
["--navds-semantic-color-divider", "--a-border-divider"],
["--navds-shadow-focus-inverted", "--a-shadow-focus-inverted"],
["--navds-shadow-focus", "--a-shadow-focus"],
["--navds-shadow-xsmall", "--a-shadow-xsmall"],
["--navds-shadow-small", "--a-shadow-small"],
["--navds-shadow-medium", "--a-shadow-medium"],
["--navds-shadow-large", "--a-shadow-large"],
["--navds-shadow-xlarge", "--a-shadow-xlarge"],
/* Components */
["--navds-modal-color-overlay", "--a-surface-backdrop"],
["--navds-accordion-color-border", "--a-border-strong"],
["--navds-accordion-color-text-hover", "--a-surface-action"],
["--navds-accordion-color-border-hover", "--a-surface-action"],
["--navds-accordion-color-background-open", "--a-surface-action-subtle"],
["--navds-alert-color-error-border", "--a-border-danger"],
["--navds-alert-color-error-background", "--a-surface-danger-subtle"],
["--navds-alert-color-warning-border", "--a-border-warning"],
["--navds-alert-color-warning-background", "--a-surface-warning-subtle"],
["--navds-alert-color-info-border", "--a-border-info"],
["--navds-alert-color-info-background", "--a-surface-info-subtle"],
["--navds-alert-color-success-border", "--a-border-success"],
["--navds-alert-color-success-background", "--a-surface-success-subtle"],
["--navds-alert-color-border", "--a-border-default"],
["--navds-chat-color-avatar-background", "--a-bg-subtle"],
["--navds-chat-color-background", "--a-bg-subtle"],
["--navds-chat-color-avatar", "--a-text-default"],
["--navds-guide-panel-color-illustration-background", "--a-surface-action-subtle"],
["--navds-guide-panel-color-background", "--a-surface-default"],
["--navds-guide-panel-color-border", "--a-border-action"],
["--navds-error-summary-color-background", "--a-surface-default"],
["--navds-error-summary-color-border", "--a-border-danger"],
["--navds-confirmation-panel-color-background-checked", "--a-surface-success-subtle"],
["--navds-confirmation-panel-color-background-error", "--a-surface-danger-subtle"],
["--navds-confirmation-panel-color-border-checked", "--a-border-success"],
["--navds-confirmation-panel-color-border-error", "--a-border-danger"],
["--navds-confirmation-panel-color-background", "--a-surface-warning-subtle"],
["--navds-confirmation-panel-color-border", "--a-border-warning"],
["--navds-radio-checkbox-color-background-hover", "--a-surface-action-subtle"],
["--navds-radio-checkbox-color-background-checked", "--a-surface-action"],
["--navds-radio-checkbox-color-shadow-hover", "--a-surface-action"],
["--navds-radio-checkbox-color-shadow-checked", "--a-surface-action"],
["--navds-radio-checkbox-color-shadow-error", "--a-surface-danger"],
["--navds-radio-checkbox-color-label-hover", "--a-surface-action"],
["--navds-radio-checkbox-color-background", "--a-surface-default"],
["--navds-radio-checkbox-color-text", "--a-text-default"],
["--navds-radio-checkbox-color-shadow", "--a-border-strong"],
["--navds-select-color-border-hover", "--a-surface-action"],
["--navds-select-color-border-error", "--a-surface-danger"],
["--navds-select-color-shadow-error", "--a-surface-danger"],
["--navds-select-color-border-disabled","--a-gray-400"],
["--navds-select-color-background-disabled", "--a-surface-subtle"],
["--navds-switch-color-label-hover", "--a-surface-action"],
["--navds-select-color-background", "--a-surface-default"],
["--navds-select-color-border", "--a-border-strong"],
["--navds-switch-color-label", "--a-text-default"],
["--navds-switch-color-track-background-hover-checked", "--a-icon-success"],
["--navds-switch-color-track-shadow-inner-focus", "--a-surface-default"],
["--navds-switch-color-track-background-checked", "--a-border-success"],
["--navds-switch-color-track-background-hover", "--a-surface-neutral-hover"],
["--navds-switch-color-track-background", "--a-surface-neutral"],
["--navds-switch-color-thumb-icon-checked", "--a-border-success"],
["--navds-switch-color-thumb-loader-checked", "--a-border-success"],
["--navds-switch-color-thumb-icon", "--a-icon-subtle"],
["--navds-switch-color-thumb", "--a-surface-default"],
["--navds-textarea-color-counter-text-error", "--a-surface-danger"],
["--navds-textarea-color-border-hover", "--a-surface-action"],
["--navds-textarea-color-border-error", "--a-surface-danger"],
["--navds-textarea-color-shadow-error", "--a-surface-danger"],
["--navds-textarea-color-counter-text", "--a-text-subtle"],
["--navds-textarea-color-text-disabled", "--a-text-default"],
["--navds-textarea-color-border-disabled", "--a-gray-400"],
["--navds-textarea-color-background-disabled", "--a-surface-subtle"],
["--navds-textarea-color-background", "--a-surface-default"],
["--navds-textarea-color-border", "--a-border-strong"],
["--navds-help-text-color-popover-background", "--a-surface-info-subtle"],
["--navds-help-text-color-background-hover", "--a-surface-action"],
["--navds-help-text-color-background-focus", "--a-surface-action"],
["--navds-help-text-color-shadow-hover", "--a-surface-action"],
["--navds-help-text-color-hover", "--a-surface-default"],
["--navds-help-text-color-focus", "--a-surface-default"],
["--navds-help-text-color", "--a-surface-action"],
["--navds-link-color-text-focus", "--a-text-on-action"],
["--navds-link-color-text-active", "--a-text-on-action"],
["--navds-link-color-text", "--a-text-action"],
["--navds-link-color-icon", "--a-icon-action"],
["--navds-link-color-icon-focus", "--a-icon-on-action"],
["--navds-link-color-background-focus", "--a-border-focus"],
["--navds-link-color-background-active", "--a-border-focus"],
["--navds-link-color-on-info-background", "--a-text-default"],
["--navds-link-color-on-error-background", "--a-text-default"],
["--navds-loader-color-neutral-foreground", "--a-border-default"],
["--navds-loader-color-interaction-foreground", "--a-surface-action"],
["--navds-loader-color-inverted-foreground", "--a-surface-default"],
["--navds-loader-color-transparent-background", "--a-surface-transparent"],
["--navds-loader-color-foreground", "--a-border-default"],
["--navds-loader-color-background", "--a-surface-active"],
["--navds-modal-color-background", "--a-surface-default"],
["--navds-pagination-color-text-selected", "--a-text-on-action"],
["--navds-pagination-color-background-selected", "--a-surface-action-selected"],
["--navds-popover-color-background", "--a-surface-default"],
["--navds-popover-color-border", "--a-border-default"],
["--navds-tag-color-info-background", "--a-surface-info-subtle"],
["--navds-tag-color-info-border", "--a-border-info"],
["--navds-tag-color-warning-background", "--a-surface-warning-subtle"],
["--navds-tag-color-warning-border", "--a-border-warning"],
["--navds-tag-color-success-background", "--a-surface-success-subtle"],
["--navds-tag-color-success-border", "--a-border-success"],
["--navds-tag-color-error-background", "--a-surface-danger-subtle"],
["--navds-tag-color-error-border", "--a-border-danger"],
["--navds-tag-color-border", "--a-border-default"],
["--navds-tag-color-background", "--a-surface-subtle"],
["--navds-toggle-group-color-background-hover", "--a-surface-action-subtle"],
["--navds-toggle-group-color-text-hover", "--a-surface-action"],
["--navds-toggle-group-color-background-pressed", "--a-surface-action-selected"],
["--navds-toggle-group-color-text-pressed", "--a-text-on-action"],
["--navds-toggle-group-color-background", "--a-surface-default"],
["--navds-toggle-group-color-text", "--a-text-default"],
["--navds-toggle-group-color-border", "--a-border-divider"],
["--navds-panel-color-background", "--a-surface-default"],
["--navds-panel-color-border", "--a-border-default"],
["--navds-link-panel-color-border-hover", "--a-surface-action"],
["--navds-link-panel-color-title-hover", "--a-text-action"],
["--navds-link-panel-color-text", "--a-text-default"],
["--navds-table-row-color-background-selected-hover", "--a-surface-action-subtle-hover"],
["--navds-table-row-color-background-hover", "--a-bg-subtle"],
["--navds-table-row-color-background-selected", "--a-surface-action-subtle"],
["--navds-table-row-color-background-zebra", "--a-surface-subtle"],
["--navds-table-cell-color-border-hover", "--a-border-strong"],
["--navds-table-cell-color-border", "--a-border-default"],
["--navds-button-color-primary-background-hover", "--a-surface-action-hover"],
["--navds-button-color-primary-background-active", "--a-surface-action-active"],
["--navds-button-color-primary-border-focus", "--a-surface-default"],
["--navds-button-color-primary-text", "--a-text-on-action"],
["--navds-button-color-primary-background", "--a-surface-action"],
["--navds-button-color-secondary-border-focus-active-hover", "--a-surface-default"],
["--navds-button-color-secondary-text-hover", "--a-text-action"],
["--navds-button-color-secondary-text-active", "--a-text-on-action"],
["--navds-button-color-secondary-background-hover", "--a-surface-action-subtle-hover"],
["--navds-button-color-secondary-background-active", "--a-surface-action-active"],
["--navds-button-color-secondary-border", "--a-border-action"],
["--navds-button-color-secondary-text", "--a-text-action"],
["--navds-button-color-secondary-background", "--a-surface-default"],
["--navds-button-color-tertiary-background-hover", "--a-surface-action-subtle-hover"],
["--navds-button-color-tertiary-border-focus", "--a-border-action"],
["--navds-button-color-tertiary-border-active", "--a-surface-default"],
["--navds-button-color-tertiary-background-active", "--a-surface-action-active"],
["--navds-button-color-tertiary-text-active", "--a-text-on-action"],
["--navds-button-color-tertiary-text", "--a-text-action"],
["--navds-button-color-danger-background-hover", "--a-surface-danger-hover"],
["--navds-button-color-danger-background-active", "--a-surface-danger-active"],
["--navds-button-color-danger-border-focus", "--a-surface-default"],
["--navds-button-color-danger-background", "--a-surface-danger"],
["--navds-button-color-danger-text", "--a-text-on-danger"],
["--navds-error-message-color-text", "--a-text-danger"],
["--navds-search-color-border-hover", "--a-border-action"],
["--navds-search-color-clear-hover", "--a-text-action"],
["--navds-search-color-border-error", "--a-border-danger"],
["--navds-search-color-text", "--a-text-default"],
["--navds-search-color-border", "--a-border-default"],
["--navds-text-field-color-border-hover", "--a-border-action"],
["--navds-text-field-color-border-error", "--a-border-danger"],
["--navds-text-field-color-shadow-error", "--a-border-danger"],
["--navds-text-field-color-border-disabled", "--a-gray-400"],
["--navds-text-field-color-background-disabled", "--a-surface-subtle"],
["--navds-text-field-color-placeholder-text", "--a-text-subtle"],
["--navds-text-field-color-text-disabled", "--a-text-default"],
["--navds-text-field-color-text", "--a-text-default"],
["--navds-text-field-color-background", "--a-surface-default"],
["--navds-text-field-color-border", "--a-border-default"],
["--navds-dropdown-menu-color", "--a-text-default"],
["--navdsi-dropdown-item-color-text", "--a-text-action"],
["--navdsi-dropdown-item-color-background-hover", "--a-surface-action-subtle-hover"],
["--navdsi-dropdown-item-color-background-active", "--a-surface-action-active"],
["--navds-dropdown-item-color-focus", "--a-border-focus"],
["--navdsi-header-color-text", "--a-text-on-inverted"],
["--navdsi-header-color-background", "--a-surface-inverted"],
["--navdsi-header-color-border", "--a-gray-600"],
["--navdsi-header-color-hover", "--a-surface-inverted-hover"],
["--navdsi-header-color-active", "--a-surface-inverted-active"],
["--navds-button-icon-adjustment", "--ac-button-icon-margin"]
]
module.exports = { tokens };
@@ -0,0 +1,18 @@
import renameProps from "../../utils/rename-props";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options) {
const j = api.jscodeshift;
const root = j(file.source);
const printOptions = options.printOptions;
return renameProps({
root,
componentName: options.component,
props: { [options.from]: options.to },
}).toSource(printOptions);
}
@@ -0,0 +1,17 @@
import { check } from "../../../utils/check";
const migration = "rename-prop";
const fixtures = ["rename"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
options: {
component: "SpeechBubble",
from: "illustration",
to: "avatar",
},
});
}
@@ -0,0 +1,8 @@
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<SpeechBubble illustration={<Illustration />}>
<div />
</SpeechBubble>
);
};
@@ -0,0 +1,8 @@
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<SpeechBubble avatar={<Illustration />}>
<div />
</SpeechBubble>
);
};
@@ -0,0 +1,68 @@
import renameProps from "../../../utils/rename-props";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options) {
const j = api.jscodeshift;
let localName = "SpeechBubble";
const root = j(file.source);
/* Finds and replaces import from SpeechBubble -> Chat */
root
.find(j.ImportDeclaration)
.filter((path) => path.node.source.value === "@navikt/ds-react")
.forEach((imp) => {
imp.value.specifiers.forEach((x) => {
if (x.imported.name === "SpeechBubble") {
if (x.local.name !== x.imported.name) {
localName = x.local.name;
x.imported.name = "Chat";
} else {
x.imported.name = "Chat";
x.local.name = "Chat";
}
}
});
});
if (j(file.source).findJSXElements(localName)) {
renameProps({
root,
componentName: localName,
props: {
illustrationBgColor: "avatarBgColor",
illustration: "avatar",
topText: "name",
},
});
/* Find and replace name of all <SpeechBubble />*/
const compRoot = root.find(j.JSXElement, {
openingElement: { name: { name: localName } },
});
compRoot.forEach((x) => {
if (localName !== "SpeechBubble") return;
x.node.openingElement.name.name = "Chat";
x.node.closingElement.name.name = "Chat";
});
/* Need to handle dot-notations differently */
const child = root.find(j.JSXElement);
child.forEach((x) => {
if (
x.value.openingElement.name.type === "JSXMemberExpression" &&
x.value.openingElement.name.object.name === "SpeechBubble"
) {
x.value.openingElement.name.object.name = "Chat";
x.value.closingElement.name.object.name = "Chat";
}
});
}
return root.toSource(options.printOptions);
}
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "chat";
const fixtures = ["complete", "idempotent", "props", "renamed"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
});
}
@@ -0,0 +1,26 @@
import { SpeechBubble, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<SpeechBubble
illustration={<Illustration />}
topText="Ola Normann 01.01.21 14:00"
backgroundColor="red"
illustrationBgColor="blue"
{...testProps}
>
<SpeechBubble.Bubble {...testProps}>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint laboris
labore nisi ut.
</SpeechBubble.Bubble>
</SpeechBubble>
);
};
@@ -0,0 +1,26 @@
import { Chat, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<Chat
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
{...testProps}
>
<Chat.Bubble {...testProps}>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</Chat.Bubble>
<Chat.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</Chat.Bubble>
<Chat.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint laboris
labore nisi ut.
</Chat.Bubble>
</Chat>
);
};
@@ -0,0 +1,25 @@
import { Chat, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<Chat
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<Chat.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</Chat.Bubble>
<Chat.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</Chat.Bubble>
<Chat.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint laboris
labore nisi ut.
</Chat.Bubble>
</Chat>
);
};
@@ -0,0 +1,25 @@
import { Chat, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<Chat
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<Chat.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</Chat.Bubble>
<Chat.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</Chat.Bubble>
<Chat.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint laboris
labore nisi ut.
</Chat.Bubble>
</Chat>
);
};
@@ -0,0 +1,44 @@
import { SpeechBubble, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<div>
<SpeechBubble
illustration={<Illustration />}
topText="Ola Normann 01.01.21 14:00"
backgroundColor="red"
illustrationBgColor="blue"
>
<SpeechBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</SpeechBubble.Bubble>
</SpeechBubble>
<SpeechBubble
illustration={<Illustration />}
topText="Ola Normann 01.01.21 14:00"
backgroundColor="red"
illustrationBgColor="blue"
>
<SpeechBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</SpeechBubble.Bubble>
<SpeechBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</SpeechBubble.Bubble>
</SpeechBubble>
</div>
);
};
@@ -0,0 +1,44 @@
import { Chat, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<div>
<Chat
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<Chat.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</Chat.Bubble>
<Chat.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</Chat.Bubble>
<Chat.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</Chat.Bubble>
</Chat>
<Chat
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<Chat.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</Chat.Bubble>
<Chat.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</Chat.Bubble>
<Chat.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</Chat.Bubble>
</Chat>
</div>
);
};
@@ -0,0 +1,44 @@
import { SpeechBubble as DsBubble, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<div>
<DsBubble
illustration={<Illustration />}
topText="Ola Normann 01.01.21 14:00"
backgroundColor="red"
illustrationBgColor="blue"
>
<DsBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</DsBubble.Bubble>
<DsBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</DsBubble.Bubble>
<DsBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</DsBubble.Bubble>
</DsBubble>
<DsBubble
illustration={<Illustration />}
topText="Ola Normann 01.01.21 14:00"
backgroundColor="red"
illustrationBgColor="blue"
>
<DsBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</DsBubble.Bubble>
<DsBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</DsBubble.Bubble>
<DsBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</DsBubble.Bubble>
</DsBubble>
</div>
);
};
@@ -0,0 +1,44 @@
import { Chat as DsBubble, Button } from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<div>
<DsBubble
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<DsBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</DsBubble.Bubble>
<DsBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</DsBubble.Bubble>
<DsBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</DsBubble.Bubble>
</DsBubble>
<DsBubble
avatar={<Illustration />}
name="Ola Normann 01.01.21 14:00"
backgroundColor="red"
avatarBgColor="blue"
>
<DsBubble.Bubble>
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
</DsBubble.Bubble>
<DsBubble.Bubble>
Eu fugiat esse fugiat Lorem culpa nulla mollit tempor incididunt aute
do.
</DsBubble.Bubble>
<DsBubble.Bubble>
Adipisicing laborum est eu laborum est sit in commodo enim sint
laboris labore nisi ut.
</DsBubble.Bubble>
</DsBubble>
</div>
);
};
@@ -0,0 +1,83 @@
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options) {
const j = api.jscodeshift;
let localName = "Pagination";
const root = j(file.source);
function addMigrationTag(node) {
const attributes = node.openingElement.attributes;
const isMigrated = attributes.find(
(node) =>
node.type === "JSXAttribute" &&
node.name.name === "data-version" &&
node.value.value === "v1"
);
if (!isMigrated) {
attributes.push(
j.jsxAttribute(j.jsxIdentifier("data-version"), j.literal("v1"))
);
}
}
/* https://github.com/mui/material-ui/blob/master/packages/mui-codemod/src/v5.0.0/variant-prop.js */
function addExplicitStandardProp(node) {
const attributes = node.openingElement.attributes;
const variant = attributes.find(
(node) => node.type === "JSXAttribute" && node.name.name === "size"
);
if (!variant) {
attributes.unshift(
j.jsxAttribute(j.jsxIdentifier("size"), j.literal("small"))
);
addMigrationTag(node);
}
}
/* Finds locally used name for Pagination */
root
.find(j.ImportDeclaration)
.filter((path) => path.node.source.value === "@navikt/ds-react")
.forEach((imp) => {
imp.value.specifiers.forEach((x) => {
if (
x.imported.name === "Pagination" &&
x.local.name !== x.imported.name
) {
localName = x.local.name;
}
});
});
if (j(file.source).findJSXElements(localName)) {
root.findJSXElements(`${localName}`).forEach((parent) => {
const skip = !!parent.value.openingElement?.attributes.find(
(x) => x.name.name === "data-version" && x.value.value === "v1"
);
parent.value.openingElement?.attributes.forEach((x, index) => {
let didUpdate = false;
if (x.name?.name === "size" && x.type === "JSXAttribute" && !skip) {
/* addExplicitStandardProp */
if (x.value.value === "medium") {
x.value = j.literal("small");
didUpdate = true;
} else if (x.value.value === "small") {
x.value = j.literal("xsmall");
didUpdate = true;
}
didUpdate && addMigrationTag(parent.value);
}
});
addExplicitStandardProp(parent.value);
});
}
return root.toSource(options.printOptions);
}
@@ -0,0 +1,18 @@
import { Pagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<Pagination
size="small"
onPageChange={setPage}
data-version="v1"
{...testProps}
/>
<Pagination size="small" onPageChange={setPage} data-version="v1" />
<Pagination size="xsmall" onPageChange={setPage} data-version="v1" />
<Pagination onPageChange={setPage} />
<Pagination size="small" onPageChange={setPage} />
</div>
);
};
@@ -0,0 +1,18 @@
import { Pagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<Pagination
size="small"
onPageChange={setPage}
data-version="v1"
{...testProps}
/>
<Pagination size="small" onPageChange={setPage} data-version="v1" />
<Pagination size="xsmall" onPageChange={setPage} data-version="v1" />
<Pagination size="small" onPageChange={setPage} data-version="v1" />
<Pagination size="xsmall" onPageChange={setPage} data-version="v1" />
</div>
);
};
@@ -0,0 +1,11 @@
import { Pagination as DsPagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<DsPagination onPageChange={setPage} />
<DsPagination size="medium" onPageChange={setPage} />
<DsPagination size="small" onPageChange={setPage} />
</div>
);
};
@@ -0,0 +1,11 @@
import { Pagination as DsPagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<DsPagination size="small" onPageChange={setPage} data-version="v1" />
<DsPagination size="small" onPageChange={setPage} data-version="v1" />
<DsPagination size="xsmall" onPageChange={setPage} data-version="v1" />
</div>
);
};
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "pagination";
const fixtures = ["size", "idempotent", "import"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
});
}
@@ -0,0 +1,11 @@
import { Pagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<Pagination onPageChange={setPage} />
<Pagination size="medium" onPageChange={setPage} />
<Pagination size="small" onPageChange={setPage} />
</div>
);
};
@@ -0,0 +1,11 @@
import { Pagination, Button } from "@navikt/ds-react";
export const Demo = () => {
return (
<div>
<Pagination size="small" onPageChange={setPage} data-version="v1" />
<Pagination size="small" onPageChange={setPage} data-version="v1" />
<Pagination size="xsmall" onPageChange={setPage} data-version="v1" />
</div>
);
};
@@ -0,0 +1,15 @@
import transformTabs from "../tabs/tabs";
import transformChat from "../chat/chat";
import transformPagination from "../pagination/pagination";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options) {
file.source = transformTabs(file, api, options);
file.source = transformChat(file, api, options);
file.source = transformPagination(file, api, options);
return file.source;
}
@@ -0,0 +1,83 @@
import renameProps from "../../../utils/rename-props";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options) {
const j = api.jscodeshift;
let localName = "Tabs";
let iconPositionProp = null;
const root = j(file.source);
/* Finds used name for Tabs component */
root
.find(j.ImportDeclaration)
.filter((path) => path.node.source.value === "@navikt/ds-react")
.forEach((imp) => {
imp.value.specifiers.forEach((x) => {
if (x.imported.name === "Tabs" && x.local.name !== x.imported.name) {
localName = x.local.name;
}
});
});
if (j(file.source).findJSXElements(localName)) {
renameProps({
root,
componentName: `${localName}.List`,
props: {
loop: "null",
},
});
root.findJSXElements(`${localName}`).forEach((parent) => {
parent.value.children.forEach((el) => {
const openingEl = el.openingElement;
if (openingEl?.name && openingEl.name.type === "JSXMemberExpression") {
if (
openingEl.name.object.name === localName &&
openingEl.name.property.name === "List"
) {
/* Move loop-prop */
el.openingElement.attributes.forEach((x, index) => {
if (x.name?.name === "loop" && x.type === "JSXAttribute") {
parent.value.openingElement.attributes.push(x);
delete el.openingElement.attributes[index];
}
});
/* Find and move iconPosition-prop to <Tabs/> */
el.children.forEach((tab) => {
const tabEl = tab.openingElement;
if (tabEl?.name && tabEl.name.type === "JSXMemberExpression") {
if (
tabEl.name.object.name === localName &&
tabEl.name.property.name === "Tab"
) {
tabEl?.attributes.forEach((x, index) => {
if (
x.name?.name === "iconPosition" &&
x.type === "JSXAttribute"
) {
if (!iconPositionProp) {
iconPositionProp = x;
}
delete tabEl.attributes[index];
}
});
}
}
});
}
}
});
iconPositionProp &&
parent.value.openingElement.attributes.push(iconPositionProp);
iconPositionProp = null;
});
}
return root.toSource(options.printOptions);
}
@@ -0,0 +1,25 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<div>
<Tabs defaultValue="logg" onChange={(x) => console.log(x)} {...testProps}>
<Tabs.List loop={false} {...testProps}>
<Tabs.Tab value="logg" iconPosition={props.left} label="logg" {...testProps}/>
<Tabs.Tab value="logg2" iconPosition="top" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
<Tabs defaultValue="logg" onChange={(x) => console.log(x)}>
<Tabs.List>
<Tabs.Tab value="logg" label="logg" />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
</div>
);
};
@@ -0,0 +1,30 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<div>
<Tabs
defaultValue="logg"
onChange={(x) => console.log(x)}
{...testProps}
loop={false}
iconPosition={props.left}>
<Tabs.List {...testProps}>
<Tabs.Tab value="logg" label="logg" {...testProps} />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
<Tabs defaultValue="logg" onChange={(x) => console.log(x)}>
<Tabs.List>
<Tabs.Tab value="logg" label="logg" />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
</div>
);
};
@@ -0,0 +1,19 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<Tabs
defaultValue="logg"
onChange={(x) => console.log(x)}
loop
iconPosition="left">
<Tabs.List>
<Tabs.Tab value="logg" label="logg" />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
);
};
@@ -0,0 +1,19 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<Tabs
defaultValue="logg"
onChange={(x) => console.log(x)}
loop
iconPosition="left">
<Tabs.List>
<Tabs.Tab value="logg" label="logg" />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
);
};
@@ -0,0 +1,15 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<Tabs defaultValue="logg" onChange={(x) => console.log(x)}>
<Tabs.List loop>
<Tabs.Tab value="logg" iconPosition="left" label="logg" />
<Tabs.Tab value="logg2" iconPosition="top" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
);
};
@@ -0,0 +1,19 @@
import { Tabs } from "@navikt/ds-react";
const TabComp = () => {
return (
/* prettier-ignore */
<Tabs
defaultValue="logg"
onChange={(x) => console.log(x)}
loop
iconPosition="left">
<Tabs.List>
<Tabs.Tab value="logg" label="logg" />
<Tabs.Tab value="logg2" label="logg2medlangtekst" />
</Tabs.List>
<Tabs.Panel value="logg">TabPanel for Logg-tab</Tabs.Panel>
<Tabs.Panel value="logg2">TabPanel for Inbox-tab</Tabs.Panel>
</Tabs>
);
};
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "tabs";
const fixtures = ["complete", "idempotent", "props"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
});
}
@@ -0,0 +1,7 @@
.test {
color: var(--navds-global-color-blue-100);
color: var(--navds-global-color-red-100);
--navds-global-color-red-100: var(--navds-global-color-green-100);
--navds-global-color-blue-100: red;
}
@@ -0,0 +1,16 @@
const StyledDiv = styled`
--navds-global-color-red-100: var(--navds-global-color-green-100);
--navds-global-color-blue-100: red;
.test{
color: var(--navds-global-color-blue-100);
}
`;
<style>
{`
.test{
color: var(--navds-global-color-blue-100);
}
`}
</style>;
@@ -0,0 +1,7 @@
.test {
color: var(--a-blue-100);
color: var(--a-red-100);
--v2-migration__navds-global-color-red-100: var(--a-green-100);
--v2-migration__navds-global-color-blue-100: red;
}
@@ -0,0 +1,16 @@
const StyledDiv = styled`
--v2-migration__navds-global-color-red-100: var(--a-green-100);
--v2-migration__navds-global-color-blue-100: red;
.test{
color: var(--a-blue-100);
}
`;
<style>
{`
.test{
color: var(--a-blue-100);
}
`}
</style>;
@@ -0,0 +1,18 @@
import { check } from "../../../../utils/check";
const migration = "update-css-tokens";
const fixtures = ["complete"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
});
check(__dirname, {
fixture,
migration,
extension: "css",
});
}
@@ -0,0 +1,22 @@
import { tokens } from "../../../tokens-map.mjs";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api) {
let src = file.source;
tokens.forEach((tok) => {
// eslint-disable-next-line no-useless-concat
const rgx = new RegExp("(" + `${tok[0]}:` + ")", "gm");
src = src.replace(rgx, `--v2-migration${tok[0].replace("--", "__")}:`);
});
tokens.forEach((tok) => {
const rgx = new RegExp("(" + tok[0] + ")", "gm");
src = src.replace(rgx, tok[1]);
});
return src;
}
@@ -0,0 +1,88 @@
import styled from "styled-components";
import {
NavdsGlobalColorBlue400 as abc132,
NavdsGlobalColorGray100,
NavdsGlobalColorGray400,
NavdsSemanticColorLink,
} from "@navikt/ds-tokens/dist/tokens";
import { BodyShort } from "@navikt/ds-react";
const StyledNavLink = styled(NavLink)`
border-bottom: 5px solid white;
color: inherit;
text-align: center;
text-decoration: none;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-left: 5px;
padding-right: 5px;
:hover {
border-bottom: 5px solid ${abc132};
p {
color: ${NavdsSemanticColorLink};
}
}
&.active {
background-color: ${NavdsGlobalColorGray100};
border-bottom: 5px solid ${NavdsSemanticColorLink};
.typo-normal {
font-weight: bold;
}
}
`;
const StyledLenketekst = styled(BodyShort)`
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
`;
const StyledTekst = styled(BodyShort)`
border-bottom: 5px solid white;
color: ${NavdsGlobalColorGray400};
text-align: center;
text-decoration: none;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-left: 5px;
padding-right: 5px;
`;
const Fane = ({ side, behandlingId, index, deaktivert }) => {
const { gåTilUrl } = useApp();
const fanenavn = side.navn;
return (
<>
{deaktivert && (
<StyledTekst size={"small"}>
{index + 1}. {fanenavn}
</StyledTekst>
)}
{!deaktivert && (
<StyledNavLink
key={side.navn}
to={`/behandling/${behandlingId}/${side.href}`}
onClick={(e) => {
e.preventDefault();
gåTilUrl(`/behandling/${behandlingId}/${side.href}`);
}}
>
<StyledLenketekst size={"small"}>
{index + 1}. {fanenavn}
</StyledLenketekst>
</StyledNavLink>
)}
</>
);
};
export default Fane;
@@ -0,0 +1,88 @@
import styled from "styled-components";
import {
ABlue400,
AGray100,
AGray400,
ATextAction,
} from "@navikt/ds-tokens/dist/tokens";
import { BodyShort } from "@navikt/ds-react";
const StyledNavLink = styled(NavLink)`
border-bottom: 5px solid white;
color: inherit;
text-align: center;
text-decoration: none;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-left: 5px;
padding-right: 5px;
:hover {
border-bottom: 5px solid ${ABlue400};
p {
color: ${ATextAction};
}
}
&.active {
background-color: ${AGray100};
border-bottom: 5px solid ${ATextAction};
.typo-normal {
font-weight: bold;
}
}
`;
const StyledLenketekst = styled(BodyShort)`
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
`;
const StyledTekst = styled(BodyShort)`
border-bottom: 5px solid white;
color: ${AGray400};
text-align: center;
text-decoration: none;
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-left: 5px;
padding-right: 5px;
`;
const Fane = ({ side, behandlingId, index, deaktivert }) => {
const { gåTilUrl } = useApp();
const fanenavn = side.navn;
return (
<>
{deaktivert && (
<StyledTekst size={"small"}>
{index + 1}. {fanenavn}
</StyledTekst>
)}
{!deaktivert && (
<StyledNavLink
key={side.navn}
to={`/behandling/${behandlingId}/${side.href}`}
onClick={(e) => {
e.preventDefault();
gåTilUrl(`/behandling/${behandlingId}/${side.href}`);
}}
>
<StyledLenketekst size={"small"}>
{index + 1}. {fanenavn}
</StyledLenketekst>
</StyledNavLink>
)}
</>
);
};
export default Fane;
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "update-js-tokens";
const fixtures = ["complete"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "js",
});
}
@@ -0,0 +1,67 @@
import type { JSCodeshift } from "jscodeshift";
import {
getImportSpecifier,
getImportSpecifierName,
renameImportSpecifier,
} from "../../../utils/imports";
import { translateToken } from "../../../utils/translate-token";
import { tokens } from "../../../tokens-map.mjs";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file: JSCodeshift, api) {
let src = file.source;
const j = api.jscodeshift as JSCodeshift;
let root = j(file.source);
const jsImport = root.find(j.ImportDeclaration).filter((x) => {
return ["@navikt/ds-tokens/dist/tokens"].includes(
x.node.source.value as string
);
});
if (!jsImport) {
return src;
}
tokens.forEach((x) => {
const name = translateToken(x[0], "js");
const out = translateToken(x[1], "js");
let foundName: string = "";
getImportSpecifier(j, root, name, "@navikt/ds-tokens/dist/tokens").forEach(
(x) => (foundName = x.node.imported.name)
);
if (name === foundName) {
const localName =
getImportSpecifierName(
j,
root,
name,
"@navikt/ds-tokens/dist/tokens"
) || name;
renameImportSpecifier(
j,
root,
name,
out,
"@navikt/ds-tokens/dist/tokens"
);
let code = root.toSource();
const rgx = new RegExp("(" + localName + ")", "gm");
code = code.replace(rgx, out);
root = j(code);
}
});
return root.toSource();
}
@@ -0,0 +1,26 @@
.filtersMenu {
box-shadow: @navds-global-color-blue-200 inset 0 0 0 8px;
border-radius: 0.2em;
background-color: white;
}
.filterExplanationHighlight {
background-color: @navds-global-color-green-100;
border: 1px solid @navds-global-color-green-500;
transition: all 0.4s linear;
}
.lenkepanelNavno {
border: 1px solid @navds-semantic-color-link;
.navds-link-panel__content {
display: flex;
}
.navds-link-panel__title,
.navds-link-panel__chevron {
color: @navds-semantic-color-link;
}
background-color: @navds-global-color-gray-600;
}
@@ -0,0 +1,26 @@
.filtersMenu {
box-shadow: @a-blue-200 inset 0 0 0 8px;
border-radius: 0.2em;
background-color: white;
}
.filterExplanationHighlight {
background-color: @a-green-100;
border: 1px solid @a-green-500;
transition: all 0.4s linear;
}
.lenkepanelNavno {
border: 1px solid @a-text-action;
.navds-link-panel__content {
display: flex;
}
.navds-link-panel__title,
.navds-link-panel__chevron {
color: @a-text-action;
}
background-color: @a-gray-600;
}
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "update-less-tokens";
const fixtures = ["complete"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "less",
});
}
@@ -0,0 +1,19 @@
import { translateToken } from "../../../utils/translate-token";
import { tokens } from "../../../tokens-map.mjs";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api) {
let src = file.source;
tokens.forEach((tok) => {
const lessToken = translateToken(tok[0], "less");
const rgx = new RegExp("(\\" + lessToken + ")", "gm");
src = src.replace(rgx, translateToken(tok[1], "less"));
});
return src;
}
@@ -0,0 +1,30 @@
.filtersMenu {
box-shadow: common.$navds-global-color-blue-200 inset 0 0 0 8px;
border-radius: 0.2em;
background-color: white;
}
.filterExplanationHighlight {
background-color: common.$navds-global-color-green-100;
border: 1px solid common.$navds-global-color-green-500;
transition: all 0.4s linear;
}
.lenkepanelNavno {
&:global(.navds-link-panel) {
border: 1px solid common.$navds-semantic-color-link;
}
:global {
.navds-link-panel__content {
display: flex;
}
.navds-link-panel__title,
.navds-link-panel__chevron {
color: common.$navds-semantic-color-link;
}
}
background-color: common.$navds-global-color-gray-600;
}
@@ -0,0 +1,30 @@
.filtersMenu {
box-shadow: common.$a-blue-200 inset 0 0 0 8px;
border-radius: 0.2em;
background-color: white;
}
.filterExplanationHighlight {
background-color: common.$a-green-100;
border: 1px solid common.$a-green-500;
transition: all 0.4s linear;
}
.lenkepanelNavno {
&:global(.navds-link-panel) {
border: 1px solid common.$a-text-action;
}
:global {
.navds-link-panel__content {
display: flex;
}
.navds-link-panel__title,
.navds-link-panel__chevron {
color: common.$a-text-action;
}
}
background-color: common.$a-gray-600;
}
@@ -0,0 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "update-sass-tokens";
const fixtures = ["complete"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "scss",
});
}
@@ -0,0 +1,19 @@
import { translateToken } from "../../../utils/translate-token";
import { tokens } from "../../../tokens-map.mjs";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api) {
let src = file.source;
tokens.forEach((tok) => {
const scssToken = translateToken(tok[0], "scss");
const rgx = new RegExp("(\\" + scssToken + ")", "gm");
src = src.replace(rgx, translateToken(tok[1], "scss"));
});
return src;
}
+47
View File
@@ -0,0 +1,47 @@
import fs from "node:fs";
import path from "node:path";
import prettier from "prettier";
const applyTransform = require("jscodeshift/dist/testUtils").applyTransform;
interface TestT {
fixture: string;
migration: string;
extension?: "js" | "scss" | "less" | "css";
options?: { [option: string]: any };
}
export function check(
dirName: string,
{ fixture, migration, extension = "js", options = {} }: TestT
) {
describe(migration, () => {
it(fixture, async () => {
const fixtureDir = path.join(dirName);
const inputPath = path.join(fixtureDir, `${fixture}.input.${extension}`);
const parser = extension;
const source = fs.readFileSync(inputPath, "utf8");
const expected = fs.readFileSync(
path.join(fixtureDir, `${fixture}.output.${extension}`),
"utf8"
);
// Assumes transform is one level up from tests directory
const module = await import(path.join(dirName, "..", migration));
const output = applyTransform({ ...module, parser: "tsx" }, options, {
source,
});
// Format output and expected with prettier for white spaces and line breaks consistency
expect(
prettier.format(output, {
parser: parser === "js" ? "typescript" : parser,
})
).toBe(
prettier.format(expected, {
parser: parser === "js" ? "typescript" : parser,
})
);
});
});
}
@@ -0,0 +1,37 @@
import core, { Collection } from "jscodeshift";
export function getImportSpecifier(
j: core.JSCodeshift,
source: Collection<any>,
specifier: string,
sourcePath: string
) {
return source
.find(j.ImportDeclaration)
.filter((path) => path.node.source.value === sourcePath)
.find(j.ImportSpecifier)
.filter((path) => path.value.imported.name === specifier);
}
export function renameImportSpecifier(
j: core.JSCodeshift,
source: Collection<any>,
specifier: string,
newSpecifier: string,
sourcePath: string
) {
getImportSpecifier(j, source, specifier, sourcePath).replaceWith(
j.importSpecifier(j.identifier(newSpecifier))
);
}
export function getImportSpecifierName(
j: core.JSCodeshift,
source: Collection<any>,
specifier: string,
sourcePath: string
) {
const specifiers = getImportSpecifier(j, source, specifier, sourcePath);
return specifiers.length > 0 ? specifiers.nodes()[0]!.local!.name : null;
}
@@ -0,0 +1,12 @@
export default function renameProps({ root, componentName, props }) {
return root.findJSXElements(componentName).forEach((path) => {
path.node.openingElement.attributes.forEach((node) => {
if (
node.type === "JSXAttribute" &&
Object.keys(props).includes(node.name.name)
) {
node.name.name = props[node.name.name];
}
});
});
}
@@ -0,0 +1,36 @@
import { translateToken } from "../translate-token";
export {};
jest.autoMockOff();
const tokens = [
{
name: "--navds-global-color-red-100",
scss: "$navds-global-color-red-100",
less: "@navds-global-color-red-100",
js: "NavdsGlobalColorRed100",
},
{
name: "--a-blue-100",
scss: "$a-blue-100",
less: "@a-blue-100",
js: "ABlue100",
},
];
describe("Translating tokens to correct format", () => {
test("To scss", () => {
tokens.forEach((x) =>
expect(translateToken(x.name, "scss")).toEqual(x.scss)
);
});
test("To less", () => {
tokens.forEach((x) =>
expect(translateToken(x.name, "less")).toEqual(x.less)
);
});
test("To js", () => {
tokens.forEach((x) => expect(translateToken(x.name, "js")).toEqual(x.js));
});
});
@@ -0,0 +1,15 @@
import _ from "lodash";
export const translateToken = (token: string, type: "scss" | "less" | "js") => {
switch (type) {
case "scss":
return token.replace("--", "$");
case "less":
return token.replace("--", "@");
case "js":
return _.startCase(token).split(" ").join("");
default:
return token;
}
};
Loaded 100 of 166 files, more files were not shown because too many files have changed in this diff. Show more