Compare commits

...
Author SHA1 Message Date
github-actions[bot]andgithub-actions[bot] 6eb8a79092 Version Packages (#2082)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-28 11:35:27 +02:00
Ken 718b3204d8 🐛 Fikset i18n for textarea 2023-06-28 11:25:32 +02:00
Ken 45970ac0fb 🐛 UU dukket ikke opp i søk 2023-06-28 10:39:54 +02:00
Ken fe5e8ada74 🐛 Fikset capitalize på god-praksis tagger 2023-06-28 10:39:07 +02:00
Ken 3e625a5cb5 🐛 Underline brakk på windows for forside-kort 2023-06-28 10:06:23 +02:00
Ken edc3495ce6 🐛 Fikset text-decoration for windows på aksel.nav.no 2023-06-27 20:26:59 +02:00
Ken 2520bc7ff5 🎨 Fikset lenker brukt på Aksel.nav.no
🎨 Intro-cards shadows

💄 Komponentoversikt-cards

💄 Oppdatert lenkevisning for cards på aksel.nav.no
2023-06-27 15:25:06 +02:00
github-actions[bot]andgithub-actions[bot] 44446e753a Version Packages (#2078)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-26 13:38:24 +02:00
Halvor Haugan 4156326752 Chat: fjern border, gjør svg mindre, bytt om "subtle" og "neutral" (#2077) 2023-06-26 13:27:25 +02:00
Ken 23970486ed 🐛 fikset date-handling for preview av god-praksis 2023-06-26 12:31:36 +02:00
Ken a8f1069650 🎉 Automatisk changelog på aksel.nav.no
🔥 Fjernet unified fra dependencies

🐛 Fikset changelog-format, la inn støtte for emojies
2023-06-23 18:30:03 +02:00
Julian Nymark f9c8320b74 sort + reverse the semver entries (#2074) 2023-06-23 11:01:33 +02:00
Ken c4839a12ed 📝 Oppdatert PR-template, Changelog-cleanup (#2073) 2023-06-23 10:43:53 +02:00
Halvor Haugan 60f64d7f70 📝 Dropdown: Better Item examples (#2072) 2023-06-22 17:21:12 +02:00
github-actions[bot]andgithub-actions[bot] e32dbe5c5d Version Packages (#2071)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-22 15:23:42 +02:00
Ken de36269582 ✨ Oppdaterte shadow-tokens (#2041) 2023-06-22 15:12:42 +02:00
Julian Nymark 6cb6c52770 Changelog generator script (#2046) 2023-06-22 15:10:03 +02:00
Ken a877d24ed0 🐛 Fikset corder-bleed på komponentside-header 2023-06-21 17:10:43 +02:00
github-actions[bot]andgithub-actions[bot] a1b6332fa1 Version Packages (#2070)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-21 13:48:45 +02:00
Ken 99c08b8e4a Fikset bug i Popover/Helptext der popover gikk helt ut i kantene (#2069) 2023-06-21 13:44:59 +02:00
Ken d39ed906c6 🐛 Fikset ExpansionCard bug ved nesting (#2067) 2023-06-21 13:40:48 +02:00
github-actions[bot]andgithub-actions[bot] 3b31bd3d75 Version Packages (#2066)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-21 11:59:33 +02:00
Halvor HauganandKen b1625ba388 ✨ Chat: ny small-variant, justert design, forbedret UU (#2048)
Co-authored-by: Ken <26967723+KenAJoh@users.noreply.github.com>
2023-06-21 09:40:50 +02:00
Ken 269d06c277 📝 ErrorSummary prop-dokumentasjon 2023-06-20 15:47:52 +02:00
Ken 0c56273f3b 🐛 Fikset rekkefølge på button-stories 2023-06-20 15:41:13 +02:00
Ken ab6a96aed7 ♻️ Oppdatert komponent demoer (#2063) 2023-06-20 11:46:45 +02:00
Ken 9ee8a72082 🔥 Fjernet død kode, lazy-loader sanity-moduler bare brukt for preview 2023-06-19 19:53:50 +02:00
Ken c2e5a92d8e 🎉 Oppdatert søk (#2062) 2023-06-19 18:28:24 +02:00
Ken 6059aa59aa 🐛 Oppdatert playwright-config for mindre flaky tester 2023-06-19 16:21:13 +02:00
Ken b877ada408 🐛 Fikset playwright-tester 2023-06-19 15:11:59 +02:00
Ken 4e339f183e 🔊 Oppdatert amplitude (#2061) 2023-06-19 14:09:08 +02:00
Ken 1d62bf26ff 🛠️ Diverse småjustering for Aksel (#2060) 2023-06-19 13:19:57 +02:00
github-actions[bot]andgithub-actions[bot] da0fbc3299 Version Packages (#2057)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-19 13:02:23 +02:00
Ken 9f59e67e2a ⚡ Lazy-loading date-fns: sparer ~10kB first-load (#2058) 2023-06-19 12:53:28 +02:00
Ken ed7aafcac8 🎨 Oppdatert deploy image (#2059) 2023-06-19 12:53:08 +02:00
Ken dfbbe92a63 🎨 Helptext har nå en prop for wrapperClassName (#2056) 2023-06-19 11:48:53 +02:00
Ken 42b5af64ab 🐛 Timeline Period brakk ved bruk av JSODOM 2023-06-17 10:25:45 +02:00
Ken 329119fa04 💄 DoDont-ikon er nå høyrestilt 2023-06-16 16:21:19 +02:00
Ken 0fc80f45cb ♿ Fikset regression der sanity ikke lengre støttet skjermlesere 2023-06-16 16:07:37 +02:00
Ken 337b9fda13 🐛 Fikset inlinecode bruk i heading 2023-06-16 12:58:26 +02:00
github-actions[bot]andgithub-actions[bot] 659e835da9 Version Packages (#2055)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-15 16:38:08 +02:00
Ken e10f4375b1 Merge branch 'main' of https://github.com/navikt/aksel 2023-06-15 16:34:25 +02:00
Ken 9a8bb26c36 🐛 Timeline brakk ved bruk av JSDOM-tester 2023-06-15 16:33:40 +02:00
github-actions[bot]andgithub-actions[bot] 69aea38784 Version Packages (#2053)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-15 15:55:48 +02:00
Ken 8f16d1571e 🎨 Oppdatert ikoner (#2054) 2023-06-15 15:51:47 +02:00
Marianne Røsvik e2265c9a78 Added two new icons (#2047) 2023-06-15 15:06:48 +02:00
Ken 925aa7a140 🐛 OverridableComponent omitter nå 'as' (#2051) 2023-06-15 14:46:34 +02:00
Ken 7c17e40cac 🐛 Datepicker og Monthpicker lukker nå popover ved escape (#2052) 2023-06-15 14:46:07 +02:00
github-actions[bot]andgithub-actions[bot] 3c8889ea88 Version Packages (#2050)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-13 16:49:54 +02:00
Ken e060961050 🐛 Fikset bruk av text-subtle på skjemaelementer (#2049) 2023-06-13 16:45:35 +02:00
Ken 18aa4ee7fb Merge branch 'main' of https://github.com/navikt/aksel 2023-06-09 14:36:38 +02:00
Ken f44edd76a2 Merge branch 'next' 2023-06-09 14:31:11 +02:00
github-actions[bot]andgithub-actions[bot] 1fa636bdd5 Version Packages (#2044)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-09 14:16:43 +02:00
Ken 44a75acb6b 🐛 className ble ikke riktig forwardet til period 2023-06-09 14:14:15 +02:00
Ken 550faee900 💄 Checkboard-pattern for transparent visning av tokens 2023-06-09 13:53:29 +02:00
Karl O 88b6174b0b 📝 La til next-logger så backend logging får rett log-level (#2042) 2023-06-09 13:34:31 +02:00
Ken fbf016b3bd ✨ Forbedringer for Aksel.nav.no UI (#2043) 2023-06-09 13:05:59 +02:00
09fa503b98 initial template for PR (#2019)
* initial template for PR

* update template

* update template

* 📝 Oppdatert template

---------

Co-authored-by: Ken <26967723+KenAJoh@users.noreply.github.com>
Co-authored-by: Ken <ken.aleksander@gmail.com>
2023-06-09 09:55:28 +02:00
Ken f5688485f5 ⬆️ Oppdatert Sanity 2023-06-08 18:43:14 +02:00
github-actions[bot]andgithub-actions[bot] 6385c4686e Version Packages (#2039)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-08 16:07:32 +02:00
Ken 30068dca3f 📝 La til jsdoc for skeleton-komponent 2023-06-08 16:03:27 +02:00
github-actions[bot]andgithub-actions[bot] 3aa04d2375 Version Packages (#2038)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-08 15:25:09 +02:00
Ken 91343563c9 🐛 Fikset markering av tekst internt i Skeleton-komponent 2023-06-08 15:21:52 +02:00
Ken d5c8112339 📝 Fikset typo i skeleton-docs 2023-06-08 15:02:24 +02:00
github-actions[bot]andgithub-actions[bot] e6cc9d1b4f Version Packages (#2031)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-08 14:49:16 +02:00
Ken db8c38a094 [Ny komponent] Skeleton (#1821) 2023-06-08 14:44:08 +02:00
Ken 35041e64eb Update README.md 2023-06-08 08:17:20 +02:00
Ken 690422d824 🐛 Fikset darkmode for skjemakomponenter 2023-06-07 20:10:28 +02:00
Ken b54bebd308 ⚡ Forbedret søk 2023-06-07 16:11:40 +02:00
Ken 8db194170c 🐛 Fikset chips.css bug etter merge 2023-06-07 15:45:00 +02:00
Ken 7b42f536aa 🎨 Oppdatert Chips-komponent (#2035) 2023-06-07 15:39:11 +02:00
Ken b2f796d681 💄 Text-subtle, icon-subtle til 700 nivå, form-description farger(#2036) 2023-06-07 15:22:02 +02:00
17d92c9ed5 add jsdoc (it's mostly copilot + some tweaks) (#2034)
* 📝 add jsdoc (it's mostly copilot + some tweaks)

* 😂 emojis

* 🏷️ add jsdoc for overridableComponents

* 🏷️ Oppdatert docgen for nestede komponenter

* 🎨 Oppdatert chat

* 🏷️ Dokumentert date-hooks

* 🏷️ Expansioncard-props

* 🏷️ Stepper.step jsdoc

* 🏷️ Tabs jsdoc

* 🏷️ Linkpaneltypes

* 🏷️ List jsdoc

* 🏷️ list jsdoc

* 🏷️ InternalHeader-docs

* 🏷️ jsdoc for dropdown

* 🏷️ Timeline jsdoc

---------

Co-authored-by: Ken <26967723+KenAJoh@users.noreply.github.com>
Co-authored-by: Ken <ken.aleksander@gmail.com>
2023-06-07 14:19:34 +02:00
Ken 7bae5dce88 🎨 Fikset søketreff for CSS + overflow av ikonsøk-form 2023-06-06 15:43:38 +02:00
Ken 6aca0a4b6a 🎨 Data-tokens (#2032) 2023-06-06 13:49:31 +02:00
Ken 4f7fde22a3 🐛 Regex-fix for sanity-url er 2023-06-06 13:45:34 +02:00
Ken 0dad69a8df 💄 Fadein frontpage-cards 2023-06-05 22:34:37 +02:00
Julian Nymark c028f36e2b Indent prop added to accordion (#2027) 2023-06-05 19:38:44 +02:00
Ken 988fb36619 📝 Nettside-readme 2023-06-05 17:25:09 +02:00
Ken f61cd88627 📝 Oppdatert readme 2023-06-05 17:10:26 +02:00
github-actions[bot]andgithub-actions[bot] 7d62019a13 Version Packages (#2028)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-06-05 16:05:27 +02:00
Ken 83e3a1131a ⚰️ Fjernet kode for gamle pakker (#2029) 2023-06-05 15:58:53 +02:00
Ken 895bdc08e5 v4: Internal til Core, Datepicker ut av beta (#2026) 2023-06-05 15:05:31 +02:00
Ken 3c991e13d1 🐛 Fikset duplisert-id for komponent-eksempler 2023-06-05 14:50:42 +02:00
MaxandMaximilian Lloyd 0c24d57c6c 📝 Noen JSDoc eksempler (#2025)
Co-authored-by: Maximilian Lloyd <maximilian.oysta.lloyd@nav.no>
2023-06-05 09:14:48 +02:00
Ken 0f0041b71e 🎨 Forbedret ikonside og eksempel-navigering
🎨 Fungerende anchor-tag navigering for eksempler

🚚 Flyttet sections-kode i sidebar ut i egen hook

💄 Oppdatert tag
2023-06-05 08:52:21 +02:00
Ken da40cc405c ⬆️ Oppdatert sanity (#2021) 2023-06-02 20:31:14 +02:00
Ken c135cbe642 ⬆️ Oppdatert playwright-image til 1.33.0 versjon 2023-06-01 08:25:22 +02:00
Ken 2a2e9edbd7 ⬇️ Negradert playwright for å matche docker img-tag 2023-05-31 23:39:39 +02:00
Ken d22d6049e8 ⬆️ Oppdatert playwright-image til nyeste versjon 2023-05-31 23:26:17 +02:00
Ken f9bea26a29 🔥 Fjernet lenke til identitet da siden ikke lengre finnes 2023-05-31 23:17:17 +02:00
1075 changed files with 12639 additions and 19416 deletions

No files matched your search

-3
View File
@@ -31,10 +31,7 @@ Alle base-pakkene våre har `fixed versjonering`. Dette tilsier at en bump på e
"@navikt/ds-react",
"@navikt/ds-css",
"@navikt/aksel-icons",
"@navikt/ds-icons",
"@navikt/ds-tokens",
"@navikt/ds-tailwind",
"@navikt/ds-css-internal",
"@navikt/ds-react-internal",
"@navikt/ds-codemod"
```
+5 -11
View File
@@ -1,6 +1,9 @@
{
"$schema": "https://unpkg.com/@changesets/config@2.2.0/schema.json",
"changelog": ["@changesets/changelog-github", { "repo": "navikt/aksel" }],
"changelog": [
"@svitejs/changesets-changelog-github-compact",
{ "repo": "navikt/aksel" }
],
"commit": false,
"fixed": [
[
@@ -8,12 +11,8 @@
"@navikt/ds-css",
"@navikt/ds-tokens",
"@navikt/ds-tailwind",
"@navikt/ds-css-internal",
"@navikt/ds-react-internal",
"@navikt/ds-codemod",
"@navikt/aksel-icons",
"@navikt/aksel",
"@navikt/ds-icons",
"@navikt/aksel-stylelint"
]
],
@@ -21,12 +20,7 @@
"access": "public",
"baseBranch": "main",
"updateInternalDependencies": "patch",
"ignore": [
"shadow-dom",
"aksel.nav.no",
"@navikt/ds-navno",
"aksel-icons-figma-plugin"
],
"ignore": ["shadow-dom", "aksel.nav.no", "aksel-icons-figma-plugin"],
"___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
"updateInternalDependents": "always"
+44
View File
@@ -0,0 +1,44 @@
### Description
<!-- PR description/motivation
add links to project-tasks, slack discussions etc here
-->
### Change summary
<!-- Short summary of changes in PR
- added variant x
- fixed bug in y
-->
### PR Checklist 📝 (Remove fields after check!)
#### New component? ✨
- Check that component-styling is correctly configured in `@navikt/core/css/config/_mappings.js`. This is needed for correct build and CDN upload.
- Check that styling is correctly exported from `@navikt/core/css/index.css`
- Check that correct tokens for component is documented in `@navikt/core/css/tokens.json`
- Check that only needed components and types are exported from `@navikt/core/react/src/index.ts`
- Add JSDoc to component (see other components for reference)
- Create storybook-stories for relevant component variations and compositions. Stories are used for [visual regression testing](https://www.chromatic.com/docs/), so make sure they are complete.
- Is the component sufficiently complex to warrant tests? Add some unit-tests for jest.
#### Component-updates 🎉
- Revalidate if everything under `New component` is still accounted for
- Deprecating/removing a CSS class? Add it to `@navikt/aksel-stylelint/src/deprecations.ts` with a suitable description. This helps stylelint-users keep their code clean and bug-free.
#### Documentation 📝
- Add/update component-demos for component `aksel.nav.no/website/pages/eksempler`
- Create/Update documentation in sanity if needed
Note: Props, tokens and examples only updates to sanity on merge to main
#### Versioning 🏷️
- Run `yarn changeset` to generate a version-entry for change.
- - Bug/hotfix: Patch
- - New feature: Minor
- - Breaking change: Major
- Adding breaking changes? Consider adding a codemod for easier migration.
- Breaking changes also needs documentation under "Migration"-page on website
+1 -1
View File
@@ -13,7 +13,7 @@ jobs:
playwright:
runs-on: ubuntu-latest
container:
image: mcr.microsoft.com/playwright:v1.30.0-focal
image: mcr.microsoft.com/playwright:v1.35.1-jammy
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
+4
View File
@@ -28,6 +28,10 @@ jobs:
node-version: 16.13.0
cache: yarn
- uses: denoland/setup-deno@v1
with:
deno-version: v1.x
- name: Restore cache
uses: actions/cache@v3
with:
+1 -1
View File
@@ -14,7 +14,7 @@ jobs:
name: Smoketest Aksel
runs-on: ubuntu-latest
container:
image: mcr.microsoft.com/playwright:v1.30.0-focal
image: mcr.microsoft.com/playwright:v1.35.1-jammy
steps:
- uses: actions/setup-node@v3
with:
-42
View File
@@ -1,42 +0,0 @@
name: Update Icons
on:
# schedule:
# - cron: 0 0 * * *
workflow_dispatch:
jobs:
update:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: 14
- name: Node-modules cache
uses: actions/cache@v3
id: node-cache
with:
path: "**/node_modules"
key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
- name: install
if: steps.node-cache.outputs.cache-hit != 'true'
run: yarn install
- name: postinstall
if: steps.node-cache.outputs.cache-hit == 'true'
run: yarn postinstall
- name: Update Icons
run: yarn workspace @navikt/ds-icons update
env:
FIGMA_TOKEN: ${{ secrets.FIGMA_IKONER_API }}
- name: Create Pull Request
uses: peter-evans/create-pull-request@v3
with:
token: ${{ secrets.GIT_REPO }}
commit-message: "Ikoner synket fra figma"
branch: figma-icons-sync
committer: GitHub <noreply@github.com>
author: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
signoff: false
delete-branch: true
title: "Ikonsynk Figma"
-39
View File
@@ -1,39 +0,0 @@
name: Update tokens
on:
workflow_dispatch:
jobs:
update:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: 14
- name: Node-modules cache
uses: actions/cache@v3
id: node-cache
with:
path: "**/node_modules"
key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
- name: install
if: steps.node-cache.outputs.cache-hit != 'true'
run: yarn install
- name: postinstall
if: steps.node-cache.outputs.cache-hit == 'true'
run: yarn postinstall
- name: Update tokens
run: yarn workspace @navikt/ds-tokens update
env:
FIGMA_TOKEN: ${{ secrets.FIGMA_IKONER_API }}
- name: Create Pull Request
uses: peter-evans/create-pull-request@v3
with:
token: ${{ secrets.GITHUB_TOKEN }}
branch: figma-tokens-sync
delete-branch: true
title: "Tokens sync Figma"
commit-message: "Tokens synket fra figma"
committer: GitHub <noreply@github.com>
signoff: false
+2 -1
View File
@@ -150,4 +150,5 @@ playwright-report/
/test-results/
backup-*.tar.gz
sitemap-urls.json
*.tar.gz
*.tar.gz
searchindex.json
+2 -10
View File
@@ -6,19 +6,11 @@ import { Meta, Canvas } from "@storybook/addon-docs";
[Dokumentasjon](https://aksel.nav.no/komponenter)
### Core
```bash
yarn add @navikt/ds-react @navikt/ds-css
```
### Interne-flater
```bash
yarn add @navikt/ds-react-internal @navikt/ds-css-internal
```
### Ikoner
## Ikoner
[Dokumentasjon](https://aksel.nav.no/ikoner)
@@ -26,7 +18,7 @@ yarn add @navikt/ds-react-internal @navikt/ds-css-internal
yarn add @navikt/aksel-icons
```
### Bruk
## Bruk
```jsx
import { Heading } from "@navikt/ds-react";
-2
View File
@@ -1,6 +1,4 @@
import { RouterContext } from "next/dist/shared/lib/router-context";
import "@navikt/ds-css/index.css";
import "@navikt/ds-css-internal/index.css";
import "./layout.css";
export const parameters = {
+18 -135
View File
@@ -1,206 +1,89 @@
# @navikt/aksel-icons
## 3.4.2
## 4.4.2
## 3.4.1
## 4.4.1
## 3.4.0
## 4.1.5
## 3.3.1
### Patch Changes
## 3.3.0
## 3.2.4
- Nye ikoner `ChevronRightLast` og `ChevronLeftLast` ([PR](https://github.com/navikt/aksel/pull/2054))
## 3.2.3
### Patch Changes
- [#1998](https://github.com/navikt/aksel/pull/1998) [`53c98181c`](https://github.com/navikt/aksel/commit/53c98181c327ead3406bec3487c10232af7d463a) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :tada: Nye ikoner!
- :sparkles: FileParagraph
- :sparkles: FilePlus
## 3.2.2
## 3.2.1
## 3.2.0
## 3.1.3
## 3.1.2
## 3.1.1
## 3.1.0
## 3.0.1
## 3.0.0
- Nye ikoner `FileParagraph` og `FilePlus` ([PR](https://github.com/navikt/aksel/pull/1998))
## 2.9.8
### Patch Changes
- [#1959](https://github.com/navikt/aksel/pull/1959) [`8790c5997`](https://github.com/navikt/aksel/commit/8790c5997e0d647419bdb5080c86781d08c196b8) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :lipstick: Statusikoner er nå tydeligere og mer konsistente.
- Oppdatert Statusikoner til å være tydeligere og mer konsistente. ([PR](https://github.com/navikt/aksel/pull/1959))
## 2.9.7
### Patch Changes
- :bug: CheckmarkIcon
- Fikset `CheckmarkIcon`-bug
## 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
- Fikset `CheckmarkCircleIcon`-bug ([PR](https://github.com/navikt/aksel/pull/1956))
## 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
- Nye ikoner `BulletList` og `NumberList` ([PR](https://github.com/navikt/aksel/pull/1950))
## 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
- :tada: Nye ikoner `HandKnot` og `HandKnotFilled` ([PR](https://github.com/navikt/aksel/pull/1928))
## 2.8.13
### Patch Changes
- [#1921](https://github.com/navikt/aksel/pull/1921) [`ecd6241e5`](https://github.com/navikt/aksel/commit/ecd6241e5751519fbda800a5f41a613957dbf77c) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner :tada:
## 2.8.12
- Oppdatert `InformationSquare`-ikon ([PR](https://github.com/navikt/aksel/pull/1921))
## 2.8.11
### Patch Changes
- [#1909](https://github.com/navikt/aksel/pull/1909) [`270427910`](https://github.com/navikt/aksel/commit/2704279107a5fbf93048de37d014e78f6721438f) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner
## 2.8.10
## 2.8.9
- Oppdatert `VideoSlack`, `Questionmark` og `Information`-ikoner ([PR](https://github.com/navikt/aksel/pull/1909))
## 2.8.8
### Patch Changes
- [`ed8e28454`](https://github.com/navikt/aksel/commit/ed8e284540a9e3a5be7d1d5e393f31db86962613) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :sparkles: Nye ikoner
- :tada: VideoSlash
- :tada: VideoSlashFill
## 2.8.7
## 2.8.6
## 2.8.5
- Nye ikoner `VideoSlash` og `VideoSlashFill`
## 2.8.4
### Patch Changes
- Fikset Sourcemap-bug i Aksel-icons
## 2.8.3
## 2.8.2
## 2.8.1
## 2.8.0
## 2.7.8
- Fikset Sourcemap-bug
## 2.7.7
### Patch Changes
- [`a22ac3eb7`](https://github.com/navikt/aksel/commit/a22ac3eb78135bf93d4771802475396849809c03) Thanks [@KenAJoh](https://github.com/KenAJoh)! - :Sparkles: Nye ikoner
- :tada: CaretUpDownFilledDown
- :tada: CaretUpDownFilledUp
- :tada: CloudDown
- :tada: CloudDownFill
- :tada: CloudUp
- :tada: CloudUpFill
- :tada: HddDown
- :tada: HddDownFill
- :tada: HddUp
- :tada: HddUpFill
- :tada: Inbox
- :tada: InboxDown
- :tada: InboxDownFill
- :tada: InboxFill
- :tada: InboxUp
- :tada: InboxUpFill
- :tada: ShoppingBasket
- :tada: ShoppingBasketFill
## 2.7.6
## 2.7.5
- Nye ikoner `CaretUpDownFilledDown`, `CaretUpDownFilledUp`, `CloudDown`, `CloudDownFill`, `CloudUp`, `CloudUpFill`, `HddDown`, `HddDownFill`, `HddUp`, `HddUpFill`, `Inbox`, `InboxDown`, `InboxDownFill`, `InboxFill`, `InboxUp`, `InboxUpFill`, `ShoppingBasket`, `ShoppingBasketFill`
## 2.7.4
### Patch Changes
- [#1852](https://github.com/navikt/aksel/pull/1852) [`a4fd1dd22`](https://github.com/navikt/aksel/commit/a4fd1dd227b9b56b747f962aa0c2b2dc9b4e30a4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikonpakke med nye ikoner :rocket:
- :tada: CaretDownFill
- :tada: CaretLeft
- :tada: CaretLeftFill
- :tada: CaretLeftRight
- :tada: CaretLeftRightFill
- :tada: CaretRight
- :tada: CaretRightFill
- :tada: CaretUpDownFill
- :tada: CaretUpFill
- :tada: Escalator
- :tada: Moon
- :tada: MoonFill
- :fire: EscalatorStroke
## 2.7.3
## 2.7.2
## 2.7.1
### Patch Changes
- [`7d9517cf9`](https://github.com/navikt/aksel/commit/7d9517cf90331b57441a0787a04eef66efd1b9b0) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Public-access for ny ikonpakke i GPR
- Nye ikoner, `CaretDownFill`, `CaretLeft`, `CaretLeftFill`, `CaretLeftRight`, `CaretLeftRightFill`, `CaretRight`, `CaretRightFill`, `CaretUpDownFill`, `CaretUpFill`, `Escalator`, `Moon`, `MoonFill`. Fjernet `EscalatorStroke` ([PR](https://github.com/navikt/aksel/pull/1852))
## 2.7.0
### Minor Changes
- [#1847](https://github.com/navikt/aksel/pull/1847) [`de291a972`](https://github.com/navikt/aksel/commit/de291a9722c262d40fecaec7be55b71f86e60160) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Ny ikonpakke med for core icons 3! `@navikt/aksel-icons`
- Ny ikonpakke med for core icons 3! `@navikt/aksel-icons` ([PR](https://github.com/navikt/aksel/pull/1847))
+1 -1
View File
@@ -15,5 +15,5 @@ keywords:
- Sammenføye
- Kildekontroll
variant: Stroke
updated_at: 08.03.2023
updated_at: 24.05.2023
created_at: 07.03.2023
@@ -5,5 +5,5 @@ keywords:
- left
- venstre
variant: Stroke
updated_at: 08.03.2023
updated_at: 14.06.2023
created_at: 07.03.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.5 6.25C7.5 5.83579 7.16421 5.5 6.75 5.5C6.33579 5.5 6 5.83579 6 6.25V17.75C6 18.1642 6.33579 18.5 6.75 18.5C7.16421 18.5 7.5 18.1642 7.5 17.75V6.25ZM17.7803 7.03033C18.0732 6.73744 18.0732 6.26256 17.7803 5.96967C17.4874 5.67678 17.0126 5.67678 16.7197 5.96967L11.2197 11.4697C11.079 11.6103 11 11.8011 11 12C11 12.1989 11.079 12.3897 11.2197 12.5303L16.7197 18.0303C17.0126 18.3232 17.4874 18.3232 17.7803 18.0303C18.0732 17.7374 18.0732 17.2626 17.7803 16.9697L12.8107 12L17.7803 7.03033Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 664 B

@@ -0,0 +1,12 @@
name: ChevronLeftFirst
category: Arrows
sub_category: Chevron
keywords:
- left
- venstre
- side
- first
- først
variant: Stroke
updated_at: 15.06.2023
created_at: 15.06.2023
@@ -6,5 +6,5 @@ keywords:
- høyre
- side
variant: Stroke
updated_at: 08.03.2023
updated_at: 09.06.2023
created_at: 07.03.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="M18 6.25C18 5.83579 17.6642 5.5 17.25 5.5C16.8358 5.5 16.5 5.83579 16.5 6.25V17.75C16.5 18.1642 16.8358 18.5 17.25 18.5C17.6642 18.5 18 18.1642 18 17.75V6.25ZM7.28033 6.21967C6.98744 5.92678 6.51256 5.92678 6.21967 6.21967C5.92678 6.51256 5.92678 6.98744 6.21967 7.28033L11.1893 12.25L6.21967 17.2197C5.92678 17.5126 5.92678 17.9874 6.21967 18.2803C6.51256 18.5732 6.98744 18.5732 7.28033 18.2803L12.7803 12.7803C13.0732 12.4874 13.0732 12.0126 12.7803 11.7197L7.28033 6.21967Z" fill="#262626"/>
</svg>

After

Width:  |  Height:  |  Size: 648 B

@@ -0,0 +1,10 @@
name: ChevronRightLast
category: Arrows
sub_category: Chevron
keywords:
- right
- høyre
- side
variant: Stroke
updated_at: 15.06.2023
created_at: 15.06.2023
+1 -1
View File
@@ -15,5 +15,5 @@ keywords:
- markup-språk
- kildekode
variant: Stroke
updated_at: 08.03.2023
updated_at: 24.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -13,5 +13,5 @@ keywords:
- dra og slippe
- skifte
variant: Stroke
updated_at: 08.03.2023
updated_at: 26.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -23,5 +23,5 @@ keywords:
- milepæler
- hendelser
variant: Stroke
updated_at: 08.03.2023
updated_at: 31.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -7,5 +7,5 @@ keywords:
- delete
- slett
variant: Stroke
updated_at: 08.03.2023
updated_at: 24.05.2023
created_at: 07.03.2023
+1 -1
View File
@@ -6,5 +6,5 @@ keywords:
- uploading
- send
variant: Stroke
updated_at: 08.03.2023
updated_at: 08.06.2023
created_at: 07.03.2023
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/aksel-icons",
"version": "3.4.2",
"version": "4.4.2",
"author": "Aksel | NAV",
"homepage": "https://aksel.nav.no/ikoner",
"repository": {
+13 -3
View File
@@ -1,19 +1,29 @@
# @navikt/aksel-stylelint
## 4.4.2
## 4.4.1
## 4.1.0
### Minor Changes
- Deprecated klassenavn `navds-chips--icon-left` ([PR](https://github.com/navikt/aksel/pull/2035))
## 3.4.2
### Patch Changes
- [#2017](https://github.com/navikt/aksel/pull/2017) [`7615dbbb5`](https://github.com/navikt/aksel/commit/7615dbbb54c7c96e2252366188547b27b2ac1142) Thanks [@JulianNymark](https://github.com/JulianNymark)! - add missing dependency
- La til riktige dependencies ([PR](https://github.com/navikt/aksel/pull/2017))
## 3.4.1
### Patch Changes
- :bug: Stylelint hotfix, inkluderer nå dist-mappe (kanskje..)
- Inkluderer nå dist-mappe i release
## 3.4.0
### Minor Changes
- [#1973](https://github.com/navikt/aksel/pull/1973) [`61c411421`](https://github.com/navikt/aksel/commit/61c4114214841ec42f48e1abd0d72d2a42d265ab) Thanks [@JulianNymark](https://github.com/JulianNymark)! - add stylelint plugin
- Stylelint-pakke for Aksel ([PR](https://github.com/navikt/aksel/pull/1973))
+4 -5
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/aksel-stylelint",
"version": "3.4.2",
"version": "4.4.2",
"author": "Aksel | NAV",
"homepage": "https://aksel.nav.no/grunnleggende/kode/stylelint",
"repository": {
@@ -27,17 +27,16 @@
],
"scripts": {
"test": "jest",
"copy-internal-tokens": "node -e \"require('fs').copyFileSync('../internal/css/tokens.json','dist/internal-tokens.json')\"",
"copy-css": "node -e \"require('fs').copyFileSync('../core/css/dist/index.css','dist/index.css')\"",
"copy-tokens": "node -e \"require('fs').copyFileSync('../core/css/tokens.json','dist/tokens.json')\"",
"copy": "yarn copy-internal-tokens && yarn copy-css && yarn copy-tokens",
"copy": "yarn copy-css && yarn copy-tokens",
"build": "tsc -p . && concurrently \"yarn:copy-*\"",
"watch:lint": "tsc --watch -p .",
"dev": "yarn watch:lint"
},
"devDependencies": {
"@navikt/ds-css": "^3.4.2",
"@navikt/ds-tokens": "^3.4.2",
"@navikt/ds-css": "^4.4.2",
"@navikt/ds-tokens": "^4.4.2",
"@types/jest": "^29.0.0",
"concurrently": "7.2.1",
"copyfiles": "2.4.1",
+21 -1
View File
@@ -1,8 +1,28 @@
type DeprecatedList = { classes: string[]; message: string }[];
type DeprecatedList = {
classes: string[];
message: string;
deprecatePrefix?: boolean;
}[];
export const deprecations: DeprecatedList = [
{
classes: ["navdsi-deprecated-example", "navdsi-other-deprecated-example"],
message: "Removed in vX.X.X, see documentation [link] for more information",
},
{
classes: [
"navdsi-dropdown",
"navdsi-copy-to-clipboard",
"navdsi-header",
"navdsi-timeline",
],
message:
"Class were moved to '@navikt/ds-css' and renamed with 'navds'-prefix in v4.0.0. Docs: https://aksel.nav.no/grunnleggende/kode/endringslogg#h728704adeb59.",
deprecatePrefix: true,
},
{
classes: ["navds-chips--icon-left"],
message:
"In v4.1.0 Chips. Toggle no longer handles special alignment for checkmark-icon, thus removing this class",
},
];
@@ -8,7 +8,7 @@ getTestRule()({
accept: [
{
code: ".foo { --ac-accordion-header-bg-hover: 1px; --ac-header-bg: red; }",
code: ".foo { --ac-accordion-header-bg-hover: 1px; --ac-internalheader-bg: red; }",
description: "existing '--ac-' tokens overridden",
},
{
@@ -40,5 +40,17 @@ getTestRule()({
column: 7,
endColumn: 38,
},
{
code: ".foo, \n .navdsi-dropdown-example \n .bar {}",
description: "selector with deprecated class name 1",
message: messages.unexpected(
"navdsi-dropdown-example",
deprecations[1].message
),
line: 2,
endLine: 2,
column: 3,
endColumn: 26,
},
],
});
@@ -17,7 +17,15 @@ const ruleFunction: stylelint.Rule = () => {
selectorParser((selectors) => {
selectors.walkClasses((className) => {
for (const deprecation of deprecations) {
if (!deprecation.classes.includes(className.value)) {
if (
!deprecation.deprecatePrefix &&
!deprecation.classes.includes(className.value)
) {
continue;
} else if (
deprecation.deprecatePrefix &&
!deprecation.classes.some((x) => className.value.startsWith(x))
) {
return;
}
stylelint.utils.report({
-2
View File
@@ -89,7 +89,6 @@ export const flattenObject = (obj) => {
const tokenCSSFile = "./index.css";
const tokenJsonFile = "./tokens.json";
const internalTokensJSONFile = "./internal-tokens.json";
let allowedTokenNames = [];
@@ -123,7 +122,6 @@ export const tokenExists = (
});
addTokens(tokenJsonFile, allowedTokenNames);
addTokens(internalTokensJSONFile, allowedTokenNames);
}
return allowedTokenNames.includes(inputToken);
+10 -161
View File
@@ -1,180 +1,29 @@
# @navikt/aksel
## 3.4.2
## 4.4.2
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.4.2
- @navikt/ds-css@4.4.2
## 3.4.1
## 4.4.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.4.1
- Updated dependencies [[`415632675`](https://github.com/navikt/aksel/commit/4156326752eaf7a97855b33653850362dada8788)]:
- @navikt/ds-css@4.4.1
## 3.4.0
## 4.0.0
### Patch Changes
### Major Changes
- Updated dependencies [[`b958d41a2`](https://github.com/navikt/aksel/commit/b958d41a20c66327658514fcf24ae20893c9531a)]:
- @navikt/ds-css@3.4.0
- Codemod for migrering av Datepicker/Monthpicker ut av Beta. `npx @navikt/aksel codemod v4-date` ([PR](https://github.com/navikt/aksel/pull/2026))
## 3.3.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.3.1
## 3.3.0
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.3.0
## 3.2.4
### Patch Changes
- Updated dependencies [[`30eee0dac`](https://github.com/navikt/aksel/commit/30eee0dac4e3e5a1379033283a6885e646e80458)]:
- @navikt/ds-css@3.2.4
## 3.2.3
### Patch Changes
- Updated dependencies [[`475e994f4`](https://github.com/navikt/aksel/commit/475e994f494b2080ffc05eb1684b6a244e3e2969), [`444e905e0`](https://github.com/navikt/aksel/commit/444e905e01965fd5cac40ff20c5225b072e67221)]:
- @navikt/ds-css@3.2.3
## 3.2.2
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.2.2
## 3.2.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.2.1
## 3.2.0
### Patch Changes
- Updated dependencies [[`affcab14c`](https://github.com/navikt/aksel/commit/affcab14c3d536929dfa64a36f5b43f9d0e8c3b7)]:
- @navikt/ds-css@3.2.0
## 3.1.3
### Patch Changes
- Updated dependencies [[`e8ecf309a`](https://github.com/navikt/aksel/commit/e8ecf309a910e47fd3cea6c54cd993ab1196910f)]:
- @navikt/ds-css@3.1.3
## 3.1.2
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.1.2
## 3.1.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.1.1
## 3.1.0
### Patch Changes
- Updated dependencies [[`9d2cd9e7f`](https://github.com/navikt/aksel/commit/9d2cd9e7fffb3cf6310c88229ee39ea85db19bca), [`f1c4c46eb`](https://github.com/navikt/aksel/commit/f1c4c46ebb0522561483f18e3b86b190cf9cc372)]:
- @navikt/ds-css@3.1.0
## 3.0.1
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@3.0.1
## 3.0.0
### Patch Changes
- Updated dependencies [[`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f), [`166ee5feb`](https://github.com/navikt/aksel/commit/166ee5feb3c987c4e633eb449812116bfd865d3f)]:
- @navikt/ds-css@3.0.0
## 2.9.8
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.8
## 2.9.7
### Patch Changes
- Updated dependencies []:
- @navikt/ds-css@2.9.7
## 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
- Codemods for migrering fra `@navikt/ds-react-internal` til `@navikt/ds-react` [Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h3b8538e1981d) ([PR](https://github.com/navikt/aksel/pull/2026))
## 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
- :truck: Flyttet Codemods fra `@navikt/ds-codemods` -> `@navikt/aksel`. `@navikt/ds-codemods` regnes nå som deprecated ([PR](https://github.com/navikt/aksel/pull/1952))
+39
View File
@@ -22,6 +22,45 @@ To get started:
npx @navikt/aksel codemod --help
```
### v4
In v4, we moved all the components from `@navikt/ds-react-internal` to `@navikt/ds-react`. This means that you will need to update all your imports to the new package. As a part of this, Header was renamed to `InternalHeader` and all the CSS-classes was renamed to use `navds` as a prefix instead of `navdsi`.
#### react
`npx @navikt/aksel codemod v4-internal-react ...`
Rewrites all imports from `@navikt/ds-react-internal` to `@navikt/ds-react`. Remember to remove `@navikt/ds-react-internal` as a dependency after migration.
```diff
- import { Dropdown, Timeline, Header } from "@navikt/ds-react-internal";
- import { Button, CopyButton } from "@navikt/ds-react";
+ import { Button, CopyButton, Dropdown, Timeline, InternalHeader as Header } from "@navikt/ds-react";
```
#### css
`npx @navikt/aksel codemod v4-internal-css ...`
Rewrites all css with `navdsi`-prefix to `navds`-prefix. Rewrites all `.navdsi-header` classes to `.navds-internalheader`.
Remember to remove `@navikt/ds-css-internal` as a dependency after migration + remove it from you lists of imports in the CSS-bundle.
```diff
- .navdsi-dropdown
+ .navds-dropdown
- .navdsi-header
+ .navds-internalheader
- .navdsi-timeline
+ .navds-timeline
```
Note: This is a "dumb" codemod that uses a simple regex to find and replace. This can lead to unknown sideeffects, so its reccomended to scope the codemod to spesific files.
```bash
`npx @navikt/aksel codemod v4-internal-css **/*.css`
```
### v3
There is no general codemods for migrating from v2 -> v3.
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "@navikt/aksel",
"version": "3.4.2",
"version": "4.4.2",
"description": "Aksel command line interface. Handles css-imports, codemods and more",
"author": "Aksel | NAV designsystem team",
"license": "MIT",
@@ -29,7 +29,7 @@
},
"homepage": "https://aksel.nav.no/grunnleggende/kode/kommandolinje",
"dependencies": {
"@navikt/ds-css": "3.4.2",
"@navikt/ds-css": "4.4.2",
"axios": "1.3.6",
"chalk": "4.1.0",
"clipboardy": "^2.3.0",
+24
View File
@@ -63,6 +63,30 @@ export const migrations: {
"Remember to clean css-import from '@navikt/ds-css-internal' if no longer needed\nIf non-text was used as children, or different locales were handled, you need to manually fix this",
},
],
"v4.0.0": [
{
description:
"Replaced deprecated 'internal'-component import to 'core'-imports",
value: "v4-internal-react",
path: "v4.0.0/internal-react/internal-react",
warning:
"Remember to also run 'v4-internal-css' if you have overwritten any css-classes!",
},
{
description:
"Replaced 'navdsi'-prefixes used to overwrite internal-css to 'navds'-prefixes",
value: "v4-internal-css",
path: "v4.0.0/internal-css/internal-css",
warning:
"Remember to remove '@navikt/ds-css-internal' imports if no longer needed! Also run 'v4-internal-react' to convert internal-react imports to core-imports",
},
{
description:
"Removes all instances of UNSAFE_ for datepicker/monthpicker.",
value: "v4-date",
path: "v4.0.0/date/date",
},
],
};
export function getMigrationPath(str: string) {
@@ -23,6 +23,7 @@ export default function transformer(file, api, options, ...rest) {
toImport: "@navikt/ds-react",
fromName: "CopyToClipboard",
toName,
ignoreAlias: true,
});
if (localName === null) {
@@ -0,0 +1,21 @@
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file) {
const names = [
"UNSAFE_useDatepicker",
"UNSAFE_DatePicker",
"UNSAFE_useRangeDatepicker",
"UNSAFE_MonthPicker",
"UNSAFE_useMonthpicker",
];
let src = file.source;
names.forEach((name) => {
src = src.replaceAll(name, name.replace("UNSAFE_", ""));
});
return src;
}
@@ -0,0 +1,72 @@
import {
UNSAFE_useDatepicker,
UNSAFE_DatePicker,
UNSAFE_useRangeDatepicker,
UNSAFE_MonthPicker,
UNSAFE_useMonthpicker as DsUnsafeUseMonthpicker,
} from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const UseDatepicker = () => {
const { datepickerProps, inputProps } = UNSAFE_useDatepicker({
fromDate: new Date("Aug 23 2019"),
toDate: new Date("Feb 23 2024"),
onDateChange: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<UNSAFE_DatePicker {...datepickerProps} dropdownCaption>
<UNSAFE_DatePicker.Input {...inputProps} label="Velg dato" />
</UNSAFE_DatePicker>
</div>
);
};
export const UseRangedDatepicker = () => {
const { datepickerProps, fromInputProps, toInputProps } =
UNSAFE_useRangeDatepicker({
fromDate: new Date("Aug 23 2019"),
onRangeChange: console.log,
onValidate: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<UNSAFE_DatePicker {...datepickerProps}>
<div style={{ display: "flex", gap: "1rem" }}>
<UNSAFE_DatePicker.Input {...fromInputProps} label="Fra" />
<UNSAFE_DatePicker.Input {...toInputProps} label="Til" />
</div>
</UNSAFE_DatePicker>
</div>
);
};
export const UseMonthpicker = () => {
const { inputProps, monthpickerProps } = UNSAFE_useMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
const {} = UNSAFE_useMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
return (
<div style={{ height: "20rem" }}>
<UNSAFE_MonthPicker {...monthpickerProps} dropdownCaption>
<UNSAFE_MonthPicker.Input
{...inputProps}
label="Velg måned"
variant="monthpicker"
/>
</UNSAFE_MonthPicker>
</div>
);
};
@@ -0,0 +1,71 @@
import {
useDatepicker,
DatePicker,
useRangeDatepicker,
MonthPicker,
useMonthpicker,
} from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const UseDatepicker = () => {
const { datepickerProps, inputProps } = useDatepicker({
fromDate: new Date("Aug 23 2019"),
toDate: new Date("Feb 23 2024"),
onDateChange: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps} dropdownCaption>
<DatePicker.Input {...inputProps} label="Velg dato" />
</DatePicker>
</div>
);
};
export const UseRangedDatepicker = () => {
const { datepickerProps, fromInputProps, toInputProps } = useRangeDatepicker({
fromDate: new Date("Aug 23 2019"),
onRangeChange: console.log,
onValidate: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps}>
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker.Input {...fromInputProps} label="Fra" />
<DatePicker.Input {...toInputProps} label="Til" />
</div>
</DatePicker>
</div>
);
};
export const UseMonthpicker = () => {
const { inputProps, monthpickerProps } = DsUnsafeUseMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
const {} = UNSAFE_useMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
return (
<div style={{ height: "20rem" }}>
<MonthPicker {...monthpickerProps} dropdownCaption>
<MonthPicker.Input
{...inputProps}
label="Velg måned"
variant="monthpicker"
/>
</MonthPicker>
</div>
);
};
@@ -1,12 +1,12 @@
import { check } from "../../../../utils/check";
const migration = "update-less-tokens";
const fixtures = ["complete"];
const migration = "date";
const fixtures = ["idempotent"];
for (const fixture of fixtures) {
check(__dirname, {
fixture,
migration,
extension: "less",
extension: "js",
});
}
@@ -0,0 +1,64 @@
import {
useDatepicker,
DatePicker,
useRangeDatepicker,
MonthPicker,
useMonthpicker,
} from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const UseDatepicker = () => {
const { datepickerProps, inputProps } = useDatepicker({
fromDate: new Date("Aug 23 2019"),
toDate: new Date("Feb 23 2024"),
onDateChange: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps} dropdownCaption>
<DatePicker.Input {...inputProps} label="Velg dato" />
</DatePicker>
</div>
);
};
export const UseRangedDatepicker = () => {
const { datepickerProps, fromInputProps, toInputProps } = useRangeDatepicker({
fromDate: new Date("Aug 23 2019"),
onRangeChange: console.log,
onValidate: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps}>
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker.Input {...fromInputProps} label="Fra" />
<DatePicker.Input {...toInputProps} label="Til" />
</div>
</DatePicker>
</div>
);
};
export const UseMonthpicker = () => {
const { inputProps, monthpickerProps } = useMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
return (
<div style={{ height: "20rem" }}>
<MonthPicker {...monthpickerProps} dropdownCaption>
<MonthPicker.Input
{...inputProps}
label="Velg måned"
variant="monthpicker"
/>
</MonthPicker>
</div>
);
};
@@ -0,0 +1,64 @@
import {
useDatepicker,
DatePicker,
useRangeDatepicker,
MonthPicker,
useMonthpicker,
} from "@navikt/ds-react";
/* eslint-disable react/jsx-no-undef */
export const UseDatepicker = () => {
const { datepickerProps, inputProps } = useDatepicker({
fromDate: new Date("Aug 23 2019"),
toDate: new Date("Feb 23 2024"),
onDateChange: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps} dropdownCaption>
<DatePicker.Input {...inputProps} label="Velg dato" />
</DatePicker>
</div>
);
};
export const UseRangedDatepicker = () => {
const { datepickerProps, fromInputProps, toInputProps } = useRangeDatepicker({
fromDate: new Date("Aug 23 2019"),
onRangeChange: console.log,
onValidate: console.log,
});
return (
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker {...datepickerProps}>
<div style={{ display: "flex", gap: "1rem" }}>
<DatePicker.Input {...fromInputProps} label="Fra" />
<DatePicker.Input {...toInputProps} label="Til" />
</div>
</DatePicker>
</div>
);
};
export const UseMonthpicker = () => {
const { inputProps, monthpickerProps } = useMonthpicker({
disabled: [new Date("Apr 1 2022")],
onMonthChange: console.log,
fromDate: new Date("Jan 1 2022"),
toDate: new Date("Sep 27 2025"),
});
return (
<div style={{ height: "20rem" }}>
<MonthPicker {...monthpickerProps} dropdownCaption>
<MonthPicker.Input
{...inputProps}
label="Velg måned"
variant="monthpicker"
/>
</MonthPicker>
</div>
);
};
@@ -0,0 +1,23 @@
const cssConversions = {
".navdsi-dropdown": ".navds-dropdown",
".navdsi-header": ".navds-internalheader",
".navdsi-timeline": ".navds-timeline",
"--ac-header-bg": "--ac-internalheader-bg",
"--ac-header-divider": "--ac-internalheader-divider",
"--ac-header-text": "--ac-internalheader-text",
"--ac-header-hover-bg": "--ac-internalheader-hover-bg",
"--ac-header-active-bg": "--ac-internalheader-active-bg",
};
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file) {
let src = file.source;
Object.entries(cssConversions).forEach(([key, value]) => {
src = src.replaceAll(key, value);
});
return src;
}
@@ -0,0 +1,545 @@
.navdsi-dropdown__menu {
overflow: hidden;
padding: var(--a-spacing-2) 0;
color: var(--ac-dropdown-text, var(--a-text-default));
width: 27ch;
max-height: 616px;
overflow-y: auto;
border-color: var(--ac-dropdown-border, var(--a-border-default));
}
.navdsi-dropdown__divider {
margin: var(--a-spacing-3) 0;
border: none;
border-bottom: 1px solid var(--a-border-divider);
}
.navdsi-dropdown__menu > :not(.navdsi-dropdown__divider):not(.navdsi-dropdown__list) {
margin: 0 var(--a-spacing-4) var(--a-spacing-3);
}
.navdsi-dropdown__list {
margin: 0;
padding: 0;
list-style: none;
}
.navdsi-dropdown__list-item {
margin: 0;
}
.navdsi-dropdown__list-heading {
margin: var(--a-spacing-1) var(--a-spacing-4) var(--a-spacing-3);
}
.navdsi-dropdown__item {
border: none;
margin: 0;
overflow: visible;
background: transparent;
color: var(--ac-dropdown-item-text, var(--a-text-action));
font: inherit;
text-decoration: none;
text-align: left;
cursor: pointer;
width: 100%;
display: flex;
align-items: center;
gap: var(--a-spacing-2);
padding: var(--a-spacing-1) var(--a-spacing-4);
}
.navdsi-dropdown__item:hover {
background-color: var(--ac-dropdown-item-hover-bg, var(--a-surface-action-subtle-hover));
}
.navdsi-dropdown__item:active {
background-color: var(--ac-dropdown-item-active-bg, var(--a-surface-action-active));
color: var(--ac-dropdown-item-active-text, var(--a-text-on-action));
}
.navdsi-dropdown__item:focus-visible {
outline: none;
box-shadow: inset 0 0 0 2px var(--a-border-focus);
}
@supports not selector(:focus-visible) {
.navdsi-dropdown__item:focus {
outline: none;
box-shadow: inset 0 0 0 2px var(--a-border-focus);
}
}
.navdsi-dropdown__item:disabled {
color: var(--ac-dropdown-item-text, var(--a-text-action));
opacity: 0.3;
background: transparent;
cursor: not-allowed;
}
.navdsi-header {
display: flex;
align-self: stretch;
background: var(--ac-header-bg, var(--a-surface-inverted));
min-height: var(--a-spacing-12);
--navdsi-header-focus: inset 0 0 0 2px var(--a-border-focus-on-inverted);
}
.navdsi-header__title {
border: none;
overflow: visible;
background: transparent;
font: inherit;
font-weight: var(--a-font-weight-bold);
line-height: normal;
text-align: left;
padding: 0 var(--a-spacing-5) 0 var(--a-spacing-6);
border-right: 1px solid var(--ac-header-divider, var(--a-gray-600));
display: flex;
align-items: center;
text-decoration: none;
margin: 0;
color: var(--ac-header-text, var(--a-text-on-inverted));
}
button.navdsi-header__title {
cursor: pointer;
}
.navdsi-header__user {
padding: 0 var(--a-spacing-5);
border-left: 1px solid var(--ac-header-divider, var(--a-gray-600));
display: flex;
align-items: center;
}
.navdsi-header__button {
border: none;
margin: 0;
padding: 0 var(--a-spacing-3);
overflow: visible;
background: transparent;
font: inherit;
line-height: normal;
cursor: pointer;
text-align: left;
display: flex;
align-items: center;
justify-self: center;
gap: var(--a-spacing-2);
border-left: 1px solid var(--ac-header-divider, var(--a-gray-600));
color: var(--ac-header-text, var(--a-text-on-inverted));
}
a.navdsi-header__title:hover,
button.navdsi-header__title:hover,
.navdsi-header__button:hover {
background-color: var(--ac-header-hover-bg, var(--a-surface-inverted-hover));
}
.navdsi-header__title:focus-visible,
.navdsi-header__button:focus-visible {
box-shadow: var(--navdsi-header-focus);
outline: none;
}
@supports not selector(:focus-visible) {
.navdsi-header__title:focus,
.navdsi-header__button:focus {
box-shadow: var(--navdsi-header-focus);
outline: none;
}
}
a.navdsi-header__title:active,
button.navdsi-header__title:active,
.navdsi-header__button:active {
background-color: var(--ac-header-active-bg, var(--a-surface-inverted-active));
}
.navdsi-header__user-button {
padding-left: var(--a-spacing-5);
gap: var(--a-spacing-4);
}
.navdsi-timeline {
position: relative;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
width: 100%;
min-width: fit-content;
align-items: center;
}
.navdsi-timeline__axislabels {
position: relative;
height: 1rem;
box-sizing: content-box;
grid-column: 2;
}
.navdsi-timeline__row-label {
white-space: nowrap;
width: auto;
margin-right: var(--a-spacing-4);
grid-column: 1;
min-height: 1.5rem;
display: flex;
align-items: center;
gap: var(--a-spacing-2);
}
.navdsi-timeline__row-label:where(:nth-last-child(2)) {
align-self: flex-end;
}
.navdsi-timeline__axislabels-label {
position: absolute;
color: var(--ac-timeline-axislabel-text, var(--a-text-subtle));
white-space: nowrap;
}
.navdsi-timeline__row {
display: flex;
background: var(--ac-timeline-row-bg, var(--a-surface-subtle));
margin: var(--a-spacing-4) 0;
grid-column: 2;
}
.navdsi-timeline__row--active {
background: var(--ac-timeline-row-active-bg, var(--a-surface-selected));
}
.navdsi-timeline__row:last-of-type {
margin-bottom: 0;
}
.navdsi-timeline__row-periods {
min-height: 1.5rem;
position: relative;
width: 100%;
margin: 0;
}
.navdsi-timeline__row-periods > li {
list-style-type: none;
}
.navdsi-timeline__period {
height: 100%;
border-radius: var(--a-border-radius-full);
position: absolute;
padding: 0;
display: flex;
align-items: center;
z-index: 2;
border: none;
font-size: 1rem;
}
.navdsi-timeline__period--inner {
margin: 0 var(--a-spacing-1);
overflow: hidden;
white-space: nowrap;
text-overflow: clip;
text-align: left;
display: flex;
align-items: center;
}
.navdsi-timeline__period--inner svg {
flex-shrink: 0;
}
.navdsi-timeline__period--clickable {
cursor: pointer;
}
.navdsi-timeline__period--success {
background: var(--ac-timeline-period-success-bg, var(--a-surface-success-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-success-border, var(--a-border-success));
}
.navdsi-timeline__period--success.navdsi-timeline__period--clickable:hover {
background: var(--a-surface-success-subtle-hover);
background: var(--ac-timeline-period-success-bg-hover, var(--a-surface-success-subtle-hover));
}
.navdsi-timeline__period--warning {
background: var(--ac-timeline-period-warning-bg, var(--a-surface-warning-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-warning-border, var(--a-border-warning));
}
.navdsi-timeline__period--warning.navdsi-timeline__period--clickable:hover {
background: var(--ac-timeline-period-warning-bg-hover, var(--a-surface-warning-subtle-hover));
}
.navdsi-timeline__period--danger {
background: var(--ac-timeline-period-danger-bg, var(--a-surface-danger-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-danger-border, var(--a-border-danger));
}
.navdsi-timeline__period--danger.navdsi-timeline__period--clickable:hover {
background: var(--ac-timeline-period-danger-bg-hover, var(--a-surface-danger-subtle-hover));
}
.navdsi-timeline__period--info {
background: var(--ac-timeline-period-info-bg, var(--a-surface-info-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-info-border, var(--a-border-info));
}
.navdsi-timeline__period--info.navdsi-timeline__period--clickable:hover {
background: var(--ac-timeline-period-info-bg-hover, var(--a-surface-info-subtle-hover));
}
.navdsi-timeline__period--neutral {
background: var(--ac-timeline-period-neutral-bg, var(--a-bg-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-neutral-border, var(--a-border-default));
}
.navdsi-timeline__period--neutral.navdsi-timeline__period--clickable:hover {
background: var(--ac-timeline-period-neutral-bg-hover, var(--a-gray-200));
}
.navdsi-timeline__period--connected-both {
border-radius: 0;
}
.navdsi-timeline__period--connected-right {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.navdsi-timeline__period--connected-left {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.navdsi-timeline__period--selected {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected));
z-index: 3;
}
.navdsi-timeline__pin-wrapper {
position: absolute;
grid-column: 2;
top: 0;
z-index: 1;
height: 100%;
display: flex;
flex-direction: column-reverse;
isolation: isolate;
--navdsc-timeline-pin-size: 0.9rem;
}
.navdsi-timeline__pin-button {
border: none;
cursor: pointer;
background: var(--a-surface-default);
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 4px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 5px var(--a-surface-default);
z-index: 2;
border-radius: var(--a-border-radius-full);
padding: 3.5px;
position: relative;
}
.navdsi-timeline__pin-button::before {
content: "";
inset: 0;
position: absolute;
width: 25px;
height: 25px;
border-radius: var(--a-border-radius-full);
left: calc(-12.5px + 3.5px);
top: calc(-12.5px + 3.5px);
}
.navdsi-timeline__pin-button:focus-visible {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 3px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
outline: none;
}
.navdsi-timeline__pin-button:hover {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 4px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 5px var(--a-surface-default);
}
.navdsi-timeline__pin-button:hover:focus-visible {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 3px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
}
@supports not selector(:focus-visible) {
.navdsi-timeline__pin-button:focus {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 3px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
outline: none;
}
.navdsi-timeline__pin-button:hover:focus {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 3px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
}
}
.navdsi-timeline__pin-wrapper::before {
content: "";
top: var(--navdsc-timeline-pin-size);
height: calc(94% - var(--navdsc-timeline-pin-size));
width: 1px;
margin: 0 auto;
background: var(--a-surface-inverted);
}
.navdsi-timeline__zoom {
margin-top: var(--a-spacing-6);
float: right;
display: flex;
list-style-type: none;
}
.navdsi-timeline__zoom-button {
all: unset;
cursor: pointer;
padding: 6px 9px 6px 8px;
border: 1px solid var(--ac-timeline-zoom-border, var(--a-border-default));
border-width: 1px 0 1px 1px;
background: var(--ac-timeline-zoom-bg, var(--a-surface-default));
}
.navdsi-timeline__zoom li:first-child .navdsi-timeline__zoom-button {
border-radius: var(--a-border-radius-medium) 0 0 var(--a-border-radius-medium);
}
.navdsi-timeline__zoom li:last-child .navdsi-timeline__zoom-button {
border-width: 1px;
border-radius: 0 var(--a-border-radius-medium) var(--a-border-radius-medium) 0;
}
.navdsi-timeline__zoom li:only-child .navdsi-timeline__zoom-button {
border-radius: var(--a-border-radius-medium);
}
.navdsi-timeline__zoom-button:not([aria-pressed="true"]):hover {
background: var(--ac-timeline-zoom-bg-hover, var(--a-surface-action-subtle-hover));
}
.navdsi-timeline__zoom-button[aria-pressed="true"] {
background: var(--ac-timeline-zoom-selected-bg, var(--a-surface-inverted));
color: var(--ac-timeline-zoom-selected-text, var(--a-text-on-inverted));
}
.navdsi-timeline__period:focus-visible {
outline: none;
z-index: 4;
box-shadow: 0 0 0 2px var(--a-border-focus);
}
.navdsi-timeline__period--selected:focus-visible {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected)),
0 0 0 2px var(--a-border-focus);
z-index: 3;
}
.navdsi-timeline__zoom li:focus-within {
z-index: var(--a-z-index-focus);
}
.navdsi-timeline__zoom-button:focus-visible {
box-shadow: 0 0 0 1px var(--a-surface-default), 0 0 0 3px var(--a-border-focus);
border-width: 1px;
}
.navdsi-timeline__zoom li:not(:last-child) .navdsi-timeline__zoom-button:focus-visible {
margin-right: 2px;
padding-right: 6px;
}
@supports not selector(:focus-visible) {
.navdsi-timeline__period:focus {
outline: none;
z-index: 4;
box-shadow: 0 0 0 2px var(--a-border-focus);
}
.navdsi-timeline__period--selected:focus {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected)),
0 0 0 2px var(--a-border-focus);
z-index: 3;
}
.navdsi-timeline__zoom-button:focus {
box-shadow: 0 0 0 1px var(--a-surface-default), 0 0 0 3px var(--a-border-focus);
border-width: 1px;
}
.navdsi-timeline__zoom li:not(:last-child) .navdsi-timeline__zoom-button:focus {
margin-right: 2px;
padding-right: 6px;
}
}
/**
* Timeline Popover
*/
.navds-timeline__popover {
z-index: var(--a-z-index-popover);
background-color: var(--ac-popover-bg, var(--a-surface-default));
box-shadow: var(--a-shadow-medium);
border: 1px solid;
border-color: var(--ac-popover-border, var(--a-border-default));
border-radius: var(--a-border-radius-medium);
}
.navds-timeline__popover:focus {
outline: none;
}
.navds-timeline__popover-content {
padding: var(--a-spacing-3);
}
.navds-timeline__popover-arrow {
position: absolute;
z-index: -1;
transform: rotate(45deg);
background-color: var(--ac-popover-bg, var(--a-surface-default));
border: 1px solid;
border-color: var(--ac-popover-border, var(--a-border-default));
width: 1rem;
height: 1rem;
}
.navds-timeline__popover[data-placement^="top"] > .navds-timeline__popover-arrow {
border-left-color: transparent;
border-top-color: transparent;
}
.navds-timeline__popover[data-placement^="bottom"] > .navds-timeline__popover-arrow {
border-bottom-color: transparent;
border-right-color: transparent;
}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {
border-left-color: transparent;
border-bottom-color: transparent;
}
.navds-timeline__popover[data-placement^="right"] > .navds-timeline__popover-arrow {
border-right-color: transparent;
border-top-color: transparent;
}
.tokens {
--ac-header-bg: red;
--ac-header-active-bg: orange;
}
@@ -0,0 +1,17 @@
const StyledDiv = styled`
.navdsi-dropdown__menu {}
.navdsi-dropdown__divider {}
button.navdsi-header__title:active {}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {}
.navdsi-timeline__period--danger {}
`;
<style>
{`
.navdsi-dropdown__menu {}
.navdsi-dropdown__divider {}
button.navdsi-header__title:active {}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {}
.navdsi-timeline__period--danger {}
`}
</style>;
@@ -0,0 +1,544 @@
.navds-dropdown__menu {
overflow: hidden;
padding: var(--a-spacing-2) 0;
color: var(--ac-dropdown-text, var(--a-text-default));
width: 27ch;
max-height: 616px;
overflow-y: auto;
}
.navds-dropdown__divider {
margin: var(--a-spacing-3) 0;
border: none;
border-bottom: 1px solid var(--a-border-divider);
}
.navds-dropdown__menu > :not(.navds-dropdown__divider):not(.navds-dropdown__list) {
margin: 0 var(--a-spacing-4) var(--a-spacing-3);
}
.navds-dropdown__list {
margin: 0;
padding: 0;
list-style: none;
}
.navds-dropdown__list-item {
margin: 0;
}
.navds-dropdown__list-heading {
margin: var(--a-spacing-1) var(--a-spacing-4) var(--a-spacing-3);
}
.navds-dropdown__item {
border: none;
margin: 0;
overflow: visible;
background: transparent;
color: var(--ac-dropdown-item-text, var(--a-text-action));
font: inherit;
text-decoration: none;
text-align: left;
cursor: pointer;
width: 100%;
display: flex;
align-items: center;
gap: var(--a-spacing-2);
padding: var(--a-spacing-1) var(--a-spacing-4);
}
.navds-dropdown__item:hover {
background-color: var(--ac-dropdown-item-hover-bg, var(--a-surface-action-subtle-hover));
}
.navds-dropdown__item:active {
background-color: var(--ac-dropdown-item-active-bg, var(--a-surface-action-active));
color: var(--ac-dropdown-item-active-text, var(--a-text-on-action));
}
.navds-dropdown__item:focus-visible {
outline: none;
box-shadow: inset 0 0 0 2px var(--a-border-focus);
}
@supports not selector(:focus-visible) {
.navds-dropdown__item:focus {
outline: none;
box-shadow: inset 0 0 0 2px var(--a-border-focus);
}
}
.navds-dropdown__item:disabled {
color: var(--ac-dropdown-item-text, var(--a-text-action));
opacity: 0.3;
background: transparent;
cursor: not-allowed;
}
.navds-internalheader {
display: flex;
align-self: stretch;
background: var(--ac-internalheader-bg, var(--a-surface-inverted));
min-height: var(--a-spacing-12);
--navds-internalheader-focus: inset 0 0 0 2px var(--a-border-focus-on-inverted);
}
.navds-internalheader__title {
border: none;
overflow: visible;
background: transparent;
font: inherit;
font-weight: var(--a-font-weight-bold);
line-height: normal;
text-align: left;
padding: 0 var(--a-spacing-5) 0 var(--a-spacing-6);
border-right: 1px solid var(--ac-internalheader-divider, var(--a-gray-600));
display: flex;
align-items: center;
text-decoration: none;
margin: 0;
color: var(--ac-internalheader-text, var(--a-text-on-inverted));
}
button.navds-internalheader__title {
cursor: pointer;
}
.navds-internalheader__user {
padding: 0 var(--a-spacing-5);
border-left: 1px solid var(--ac-internalheader-divider, var(--a-gray-600));
display: flex;
align-items: center;
}
.navds-internalheader__button {
border: none;
margin: 0;
padding: 0 var(--a-spacing-3);
overflow: visible;
background: transparent;
font: inherit;
line-height: normal;
cursor: pointer;
text-align: left;
display: flex;
align-items: center;
justify-self: center;
gap: var(--a-spacing-2);
border-left: 1px solid var(--ac-internalheader-divider, var(--a-gray-600));
color: var(--ac-internalheader-text, var(--a-text-on-inverted));
}
a.navds-internalheader__title:hover,
button.navds-internalheader__title:hover,
.navds-internalheader__button:hover {
background-color: var(--ac-internalheader-hover-bg, var(--a-surface-inverted-hover));
}
.navds-internalheader__title:focus-visible,
.navds-internalheader__button:focus-visible {
box-shadow: var(--navds-internalheader-focus);
outline: none;
}
@supports not selector(:focus-visible) {
.navds-internalheader__title:focus,
.navds-internalheader__button:focus {
box-shadow: var(--navds-internalheader-focus);
outline: none;
}
}
a.navds-internalheader__title:active,
button.navds-internalheader__title:active,
.navds-internalheader__button:active {
background-color: var(--ac-internalheader-active-bg, var(--a-surface-inverted-active));
}
.navds-internalheader__user-button {
padding-left: var(--a-spacing-5);
gap: var(--a-spacing-4);
}
.navds-timeline {
position: relative;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
width: 100%;
min-width: fit-content;
align-items: center;
}
.navds-timeline__axislabels {
position: relative;
height: 1rem;
box-sizing: content-box;
grid-column: 2;
}
.navds-timeline__row-label {
white-space: nowrap;
width: auto;
margin-right: var(--a-spacing-4);
grid-column: 1;
min-height: 1.5rem;
display: flex;
align-items: center;
gap: var(--a-spacing-2);
}
.navds-timeline__row-label:where(:nth-last-child(2)) {
align-self: flex-end;
}
.navds-timeline__axislabels-label {
position: absolute;
color: var(--ac-timeline-axislabel-text, var(--a-text-subtle));
white-space: nowrap;
}
.navds-timeline__row {
display: flex;
background: var(--ac-timeline-row-bg, var(--a-surface-subtle));
margin: var(--a-spacing-4) 0;
grid-column: 2;
}
.navds-timeline__row--active {
background: var(--ac-timeline-row-active-bg, var(--a-surface-selected));
}
.navds-timeline__row:last-of-type {
margin-bottom: 0;
}
.navds-timeline__row-periods {
min-height: 1.5rem;
position: relative;
width: 100%;
margin: 0;
}
.navds-timeline__row-periods > li {
list-style-type: none;
}
.navds-timeline__period {
height: 100%;
border-radius: var(--a-border-radius-full);
position: absolute;
padding: 0;
display: flex;
align-items: center;
z-index: 2;
border: none;
font-size: 1rem;
}
.navds-timeline__period--inner {
margin: 0 var(--a-spacing-1);
overflow: hidden;
white-space: nowrap;
text-overflow: clip;
text-align: left;
display: flex;
align-items: center;
}
.navds-timeline__period--inner svg {
flex-shrink: 0;
}
.navds-timeline__period--clickable {
cursor: pointer;
}
.navds-timeline__period--success {
background: var(--ac-timeline-period-success-bg, var(--a-surface-success-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-success-border, var(--a-border-success));
}
.navds-timeline__period--success.navds-timeline__period--clickable:hover {
background: var(--a-surface-success-subtle-hover);
background: var(--ac-timeline-period-success-bg-hover, var(--a-surface-success-subtle-hover));
}
.navds-timeline__period--warning {
background: var(--ac-timeline-period-warning-bg, var(--a-surface-warning-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-warning-border, var(--a-border-warning));
}
.navds-timeline__period--warning.navds-timeline__period--clickable:hover {
background: var(--ac-timeline-period-warning-bg-hover, var(--a-surface-warning-subtle-hover));
}
.navds-timeline__period--danger {
background: var(--ac-timeline-period-danger-bg, var(--a-surface-danger-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-danger-border, var(--a-border-danger));
}
.navds-timeline__period--danger.navds-timeline__period--clickable:hover {
background: var(--ac-timeline-period-danger-bg-hover, var(--a-surface-danger-subtle-hover));
}
.navds-timeline__period--info {
background: var(--ac-timeline-period-info-bg, var(--a-surface-info-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-info-border, var(--a-border-info));
}
.navds-timeline__period--info.navds-timeline__period--clickable:hover {
background: var(--ac-timeline-period-info-bg-hover, var(--a-surface-info-subtle-hover));
}
.navds-timeline__period--neutral {
background: var(--ac-timeline-period-neutral-bg, var(--a-bg-subtle));
box-shadow: inset 0 0 0 1px var(--ac-timeline-period-neutral-border, var(--a-border-default));
}
.navds-timeline__period--neutral.navds-timeline__period--clickable:hover {
background: var(--ac-timeline-period-neutral-bg-hover, var(--a-gray-200));
}
.navds-timeline__period--connected-both {
border-radius: 0;
}
.navds-timeline__period--connected-right {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.navds-timeline__period--connected-left {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.navds-timeline__period--selected {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected));
z-index: 3;
}
.navds-timeline__pin-wrapper {
position: absolute;
grid-column: 2;
top: 0;
z-index: 1;
height: 100%;
display: flex;
flex-direction: column-reverse;
isolation: isolate;
--navdsc-timeline-pin-size: 0.9rem;
}
.navds-timeline__pin-button {
border: none;
cursor: pointer;
background: var(--a-surface-default);
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 4px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 5px var(--a-surface-default);
z-index: 2;
border-radius: var(--a-border-radius-full);
padding: 3.5px;
position: relative;
}
.navds-timeline__pin-button::before {
content: "";
inset: 0;
position: absolute;
width: 25px;
height: 25px;
border-radius: var(--a-border-radius-full);
left: calc(-12.5px + 3.5px);
top: calc(-12.5px + 3.5px);
}
.navds-timeline__pin-button:focus-visible {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 3px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
outline: none;
}
.navds-timeline__pin-button:hover {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 4px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 5px var(--a-surface-default);
}
.navds-timeline__pin-button:hover:focus-visible {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 3px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
}
@supports not selector(:focus-visible) {
.navds-timeline__pin-button:focus {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg, var(--a-surface-danger)),
0 0 0 3px var(--ac-timeline-pin-bg, var(--a-surface-danger)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
outline: none;
}
.navds-timeline__pin-button:hover:focus {
box-shadow: inset 0 0 0 1px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)),
0 0 0 3px var(--ac-timeline-pin-bg-hover, var(--a-surface-danger-hover)), 0 0 0 4px var(--a-surface-default),
0 0 0 6px var(--a-border-focus);
}
}
.navds-timeline__pin-wrapper::before {
content: "";
top: var(--navdsc-timeline-pin-size);
height: calc(94% - var(--navdsc-timeline-pin-size));
width: 1px;
margin: 0 auto;
background: var(--a-surface-inverted);
}
.navds-timeline__zoom {
margin-top: var(--a-spacing-6);
float: right;
display: flex;
list-style-type: none;
}
.navds-timeline__zoom-button {
all: unset;
cursor: pointer;
padding: 6px 9px 6px 8px;
border: 1px solid var(--ac-timeline-zoom-border, var(--a-border-default));
border-width: 1px 0 1px 1px;
background: var(--ac-timeline-zoom-bg, var(--a-surface-default));
}
.navds-timeline__zoom li:first-child .navds-timeline__zoom-button {
border-radius: var(--a-border-radius-medium) 0 0 var(--a-border-radius-medium);
}
.navds-timeline__zoom li:last-child .navds-timeline__zoom-button {
border-width: 1px;
border-radius: 0 var(--a-border-radius-medium) var(--a-border-radius-medium) 0;
}
.navds-timeline__zoom li:only-child .navds-timeline__zoom-button {
border-radius: var(--a-border-radius-medium);
}
.navds-timeline__zoom-button:not([aria-pressed="true"]):hover {
background: var(--ac-timeline-zoom-bg-hover, var(--a-surface-action-subtle-hover));
}
.navds-timeline__zoom-button[aria-pressed="true"] {
background: var(--ac-timeline-zoom-selected-bg, var(--a-surface-inverted));
color: var(--ac-timeline-zoom-selected-text, var(--a-text-on-inverted));
}
.navds-timeline__period:focus-visible {
outline: none;
z-index: 4;
box-shadow: 0 0 0 2px var(--a-border-focus);
}
.navds-timeline__period--selected:focus-visible {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected)),
0 0 0 2px var(--a-border-focus);
z-index: 3;
}
.navds-timeline__zoom li:focus-within {
z-index: var(--a-z-index-focus);
}
.navds-timeline__zoom-button:focus-visible {
box-shadow: 0 0 0 1px var(--a-surface-default), 0 0 0 3px var(--a-border-focus);
border-width: 1px;
}
.navds-timeline__zoom li:not(:last-child) .navds-timeline__zoom-button:focus-visible {
margin-right: 2px;
padding-right: 6px;
}
@supports not selector(:focus-visible) {
.navds-timeline__period:focus {
outline: none;
z-index: 4;
box-shadow: 0 0 0 2px var(--a-border-focus);
}
.navds-timeline__period--selected:focus {
box-shadow: inset 0 0 0 2px var(--ac-timeline-period-selected-border, var(--a-border-action-selected)),
0 0 0 2px var(--a-border-focus);
z-index: 3;
}
.navds-timeline__zoom-button:focus {
box-shadow: 0 0 0 1px var(--a-surface-default), 0 0 0 3px var(--a-border-focus);
border-width: 1px;
}
.navds-timeline__zoom li:not(:last-child) .navds-timeline__zoom-button:focus {
margin-right: 2px;
padding-right: 6px;
}
}
/**
* Timeline Popover
*/
.navds-timeline__popover {
z-index: var(--a-z-index-popover);
background-color: var(--ac-popover-bg, var(--a-surface-default));
box-shadow: var(--a-shadow-medium);
border: 1px solid;
border-color: var(--ac-popover-border, var(--a-border-default));
border-radius: var(--a-border-radius-medium);
}
.navds-timeline__popover:focus {
outline: none;
}
.navds-timeline__popover-content {
padding: var(--a-spacing-3);
}
.navds-timeline__popover-arrow {
position: absolute;
z-index: -1;
transform: rotate(45deg);
background-color: var(--ac-popover-bg, var(--a-surface-default));
border: 1px solid;
border-color: var(--ac-popover-border, var(--a-border-default));
width: 1rem;
height: 1rem;
}
.navds-timeline__popover[data-placement^="top"] > .navds-timeline__popover-arrow {
border-left-color: transparent;
border-top-color: transparent;
}
.navds-timeline__popover[data-placement^="bottom"] > .navds-timeline__popover-arrow {
border-bottom-color: transparent;
border-right-color: transparent;
}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {
border-left-color: transparent;
border-bottom-color: transparent;
}
.navds-timeline__popover[data-placement^="right"] > .navds-timeline__popover-arrow {
border-right-color: transparent;
border-top-color: transparent;
}
.tokens {
--ac-internalheader-bg: red;
--ac-internalheader-active-bg: orange;
}
@@ -0,0 +1,17 @@
const StyledDiv = styled`
.navds-dropdown__menu {}
.navds-dropdown__divider {}
button.navds-internalheader__title:active {}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {}
.navds-timeline__period--danger {}
`;
<style>
{`
.navds-dropdown__menu {}
.navds-dropdown__divider {}
button.navds-internalheader__title:active {}
.navds-timeline__popover[data-placement^="left"] > .navds-timeline__popover-arrow {}
.navds-timeline__period--danger {}
`}
</style>;
@@ -1,6 +1,6 @@
import { check } from "../../../../utils/check";
const migration = "update-js-tokens";
const migration = "internal-css";
const fixtures = ["complete"];
for (const fixture of fixtures) {
@@ -0,0 +1,38 @@
import { getLineTerminator } from "../../../utils/lineterminator";
import moveAndRenameImport from "../../../utils/moveAndRenameImport";
/**
* @param {import('jscodeshift').FileInfo} file
* @param {import('jscodeshift').API} api
*/
export default function transformer(file, api, options, ...rest) {
const j = api.jscodeshift;
let root: any;
try {
root = j(file.source);
} catch {
return file.source;
}
moveAndRenameImport(j, root, {
fromImport: "@navikt/ds-react-internal",
toImport: "@navikt/ds-react",
fromName: "Header",
toName: "InternalHeader",
});
moveAndRenameImport(j, root, {
fromImport: "@navikt/ds-react-internal",
toImport: "@navikt/ds-react",
fromName: "Dropdown",
toName: "Dropdown",
});
moveAndRenameImport(j, root, {
fromImport: "@navikt/ds-react-internal",
toImport: "@navikt/ds-react",
fromName: "Timeline",
toName: "Timeline",
});
return root.toSource(getLineTerminator(file.source));
}
@@ -0,0 +1,2 @@
import { Dropdown, Timeline, Header } from "@navikt/ds-react-internal";
import { Button, CopyButton } from "@navikt/ds-react";
@@ -0,0 +1,7 @@
import {
Button,
CopyButton,
InternalHeader as Header,
Dropdown,
Timeline,
} from "@navikt/ds-react";
@@ -0,0 +1,5 @@
import {
Dropdown as DSDropdown,
Timeline as DSTimeline,
Header as TestHeader,
} from "@navikt/ds-react-internal";
@@ -0,0 +1,5 @@
import {
InternalHeader as TestHeader,
Dropdown as DSDropdown,
Timeline as DSTimeline,
} from "@navikt/ds-react";
@@ -0,0 +1 @@
import { Header as InternalHeader } from "@navikt/ds-react-internal";
@@ -0,0 +1 @@
import { InternalHeader } from "@navikt/ds-react";
@@ -0,0 +1 @@
import { Dropdown, Timeline, Header } from "@navikt/ds-react-internal";
@@ -0,0 +1 @@
import { InternalHeader as Header, Dropdown, Timeline } from "@navikt/ds-react";
@@ -1,7 +1,7 @@
import { check } from "../../../../utils/check";
const migration = "update-css-tokens";
const fixtures = ["complete"];
const migration = "internal-react";
const fixtures = ["import", "import-add", "import-alias", "import-edgecase"];
for (const fixture of fixtures) {
check(__dirname, {
@@ -9,10 +9,4 @@ for (const fixture of fixtures) {
migration,
extension: "js",
});
check(__dirname, {
fixture,
migration,
extension: "css",
});
}
@@ -8,8 +8,16 @@ export default function moveAndRenameImport(
toImport,
fromName,
toName,
}: { fromImport: string; toImport: string; fromName: string; toName: string }
ignoreAlias = false,
}: {
fromImport: string;
toImport: string;
fromName: string;
toName: string;
ignoreAlias?: boolean;
}
) {
/* Does package-name exist */
const existingFromImport = root.find(j.ImportDeclaration, {
source: {
value: fromImport,
@@ -39,6 +47,7 @@ export default function moveAndRenameImport(
existingFromImportSpecifier.remove();
}
/* Remove import if its now empty */
if (
!existingFromImport.get("specifiers").value?.length ||
existingFromImport.get("specifiers").value?.length === 0
@@ -46,12 +55,14 @@ export default function moveAndRenameImport(
existingFromImport.remove();
}
/* Does package exist */
const existingImport = root.find(j.ImportDeclaration, {
source: {
value: toImport,
},
});
/* Check if migrated name allready exist */
const existingImportSpecifier = existingImport.find(j.ImportSpecifier, {
imported: {
name: toName,
@@ -59,7 +70,9 @@ export default function moveAndRenameImport(
});
if (existingImportSpecifier.length <= 0) {
const newImportSpecifier = j.importSpecifier(j.identifier(toName));
const newImportSpecifier = ignoreAlias
? j.importSpecifier(j.identifier(toName))
: j.importSpecifier(j.identifier(toName), j.identifier(localname));
if (existingImport.length > 0) {
existingImport.get("specifiers").push(newImportSpecifier);
-9
View File
@@ -1,9 +0,0 @@
*.d.ts
*.js
bin/*.js
*.js.map
!transforms/**/__testfixtures__/**/*.js
!transforms/**/tests/**/*.output.js
!transforms/**/tests/**/*.input.js
transforms/**/tests/**/*.test.js
!jest.config.js
-239
View File
@@ -1,239 +0,0 @@
# @navikt/ds-codemod
## 3.4.2
## 3.4.1
## 3.4.0
## 3.3.1
## 3.3.0
## 3.2.4
## 3.2.3
## 3.2.2
## 3.2.1
## 3.2.0
## 3.1.3
## 3.1.2
## 3.1.1
## 3.1.0
## 3.0.1
## 3.0.0
## 2.9.8
## 2.9.7
## 2.9.6
## 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.
## 2.9.3
## 2.9.2
## 2.9.1
## 2.9.0
## 2.8.16
## 2.8.15
### Patch Changes
- [#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
## 2.8.12
## 2.8.11
## 2.8.10
## 2.8.9
## 2.8.8
## 2.8.7
## 2.8.6
## 2.8.5
## 2.8.4
## 2.8.3
## 2.8.2
## 2.8.1
## 2.8.0
## 2.7.8
## 2.7.7
## 2.7.6
## 2.7.5
## 2.7.4
## 2.7.3
## 2.7.2
## 2.7.1
## 2.7.0
## 2.6.2
## 2.6.1
## 2.6.0
## 2.5.1
## 2.5.0
## 2.4.3
## 2.4.2
### Patch Changes
- [#1823](https://github.com/navikt/aksel/pull/1823) [`a7ce61f84`](https://github.com/navikt/aksel/commit/a7ce61f840e5bfaafc4f70e550167fe0095555b8) Thanks [@kschieren](https://github.com/kschieren)! - added support for nested lists
## 2.4.1
## 2.4.0
## 2.3.1
## 2.3.0
## 2.2.0
## 2.1.7
## 2.1.6
## 2.1.5
## 2.1.4
## 2.1.3
## 2.1.2
## 2.1.1
## 2.1.0
## 2.0.18
## 2.0.17
## 2.0.16
## 2.0.15
## 2.0.14
## 2.0.13
## 2.0.12
## 2.0.11
## 2.0.10
## 2.0.9
## 2.0.8
## 2.0.7
## 2.0.6
## 2.0.5
## 2.0.4
## 2.0.3
## 2.0.2
## 2.0.1
## 2.0.0
### Major Changes
- [`6b96e4833`](https://github.com/navikt/aksel/commit/6b96e48330c2e013a1acee85cefccd9ccc1aece4) Thanks [@KenAJoh](https://github.com/KenAJoh)! - v2: Tokens update and font-loading
## 1.5.10
## 1.5.9
## 1.5.8
## 1.5.7
## 1.5.6
## 1.5.5
## 1.5.4
## 1.5.3
## 1.5.2
## 1.5.1
## 1.5.0
## 1.4.4
## 1.4.3
## 1.4.2
## 1.4.1
## 1.4.0
## 1.3.39
### Patch Changes
- [`40f0b3340`](https://github.com/navikt/aksel/commit/40f0b3340d01bf85fecc04f2f3a8e8b2acf996f1) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bump for latest-tag
## 1.3.38
-4
View File
@@ -1,4 +0,0 @@
# Deperecation!
This package will be been deprecated in favor of [@navikt/aksel](...)
Run `npx @navikt/aksel codemod --help` to get started
-36
View File
@@ -1,36 +0,0 @@
import meow, { AnyFlags } from "meow";
import { migrate } from "./migrate";
import { cliConfig } from "./config";
const help = `
Usage
$ npx @navikt/ds-codemod ${cliConfig.args
.map((arg) => `<${arg.name}>`)
.join(" ")}
${cliConfig.args.map((arg) => `${arg.name}\t${arg.description}`).join("\n ")}
Options
${Object.entries(cliConfig.flags)
.map(([name, val]: [string, any]) => `--${name}\t${val.description}`)
.join("\n ")}
`;
const { input, flags } = meow({
description: cliConfig.description,
flags: Object.fromEntries(
Object.entries(cliConfig.flags).map(
([name, flag]: [string, any]): [string, AnyFlags] => [
name,
{
alias: flag.alias,
type: flag.type,
},
]
)
),
help,
});
export async function run() {
await migrate(input[0], input[1], flags);
}
-37
View File
@@ -1,37 +0,0 @@
const createCLIConfig = (config: any) => config;
export const cliConfig = createCLIConfig({
description: "Migrations for NAV designsystem solutions",
args: [
{
name: "migration",
description:
"One of the choices from https://github.com/navikt/aksel/blob/main/%40navikt/codemod/README.md",
},
{
name: "path",
description:
"Files or directory to transform. Can be a glob like src/**.css",
},
],
flags: {
dry: {
alias: "d",
description: "Dry run, no changes will be made to files",
type: "boolean",
},
print: {
alias: "p",
description: "Print transformed files",
type: "boolean",
},
force: {
alias: "f",
description: "Forcibly run migrations without checking git-changes",
type: "boolean",
},
},
});
export const DS_MIGRATION_COMMENT =
"ds-codemod: Unable to migrate the following expression. Please upgrade manually.";
-5
View File
@@ -1,5 +0,0 @@
#!/usr/bin/env node
const { run } = require("./cli");
run();
-140
View File
@@ -1,140 +0,0 @@
import fs from "fs";
import path from "path";
import * as jscodeshift from "jscodeshift/src/Runner";
import chalk from "chalk";
import isGitClean from "is-git-clean";
import globby from "globby";
export interface MigrateOptions {
dry?: boolean;
print?: boolean;
force?: boolean;
}
const migrationsMap = [
{
name: "v1/preset: Runs all codemods for beta to v1 migration",
value: "v1/preset",
path: "v1.0.0/preset",
},
{
name: "v1/pagination: Fixes breaking API-changes from <Pagination /> component",
value: "v1/pagination",
path: "v1.0.0/pagination",
},
{
name: "v1/tabs: Fixes breaking API-changes from <Tabs /> component",
value: "v1/tabs",
path: "v1.0.0/tabs",
},
{
name: "v1/chat: Fixes breaking API-changes from <SpeechBubble /> (now <Chat/>) component",
value: "v1/chat",
path: "v1.0.0/chat",
},
{
name: "v2/css: Fixes css-variables",
value: "v2/css",
path: "v2.0.0/update-css-tokens/update-css-tokens",
},
{
name: "v2/js: Fixes js-variables",
value: "v2/js",
path: "v2.0.0/update-js-tokens/update-js-tokens",
},
{
name: "v2/sass: Fixes sass-variables",
value: "v2/sass",
path: "v2.0.0/update-sass-tokens/update-sass-tokens",
},
{
name: "v2/less: Fixes less-variables",
value: "v2/less",
path: "v2.0.0/update-less-tokens/update-less-tokens",
},
];
export async function migrate(
migration: string,
files: string,
options: MigrateOptions = {}
) {
const foundMigration = migrationsMap.find((x) => x.value === migration);
const migrationFile = path.join(
__dirname,
`../transforms/${foundMigration.path}.js`
);
try {
if (!fs.existsSync(migrationFile)) {
throw new Error(`No migration found for ${migration}`);
}
if (!files) throw new Error(`No path provided for migration`);
if (!options.dry) {
checkGitStatus(options.force);
}
const filepaths = globby.sync(files, { cwd: process.cwd() });
if (filepaths.length === 0) {
throw new Error(`No files found for ${files}`);
}
// eslint-disable-next-line no-console
console.log(chalk.green("Running migration:"), migration);
await jscodeshift.run(migrationFile, filepaths, {
babel: true,
ignorePattern: [
"**/node_modules/**",
"**/.next/**",
"**/build/**",
"**/dist/**",
],
extensions: "tsx,ts,jsx,js",
parser: "tsx",
verbose: 2,
runInBand: true,
silent: false,
stdin: false,
...options,
});
} catch (error) {
console.error(error);
process.exit(1);
}
}
export function checkGitStatus(force?: boolean) {
let clean = false;
let errorMessage = "Unable to determine if git directory is clean";
try {
clean = isGitClean.sync(process.cwd());
errorMessage = "Git directory is not clean";
} catch (err: any) {
if (err && err.stderr && err.stderr.indexOf("Not a git repository") >= 0) {
clean = true;
}
}
if (!clean) {
/* eslint-disable no-console */
if (force) {
console.log(`WARNING: ${errorMessage}. Forcibly continuing.`);
} else {
console.log("Thank you for using @navikt/ds-codemod!");
console.log(
chalk.yellow(
"\nBut before we continue, please stash or commit your git changes."
)
);
console.log(
"\nYou may use the --force flag to override this safety check."
);
process.exit(1);
}
}
}
-10
View File
@@ -1,10 +0,0 @@
import { deleteSync } from "del";
deleteSync([
"utils/**/*.js",
"bin/**/*.js",
"transforms/**/*.js",
"!transforms/**/__testfixtures__",
"!transforms/**/tests/*.input.*",
"!transforms/**/tests/*.output.*",
]);
-8
View File
@@ -1,8 +0,0 @@
const customJestConfig = {
testMatch: ["**/__tests__/**/*.js", "**/tests/*.test.js"],
verbose: true,
rootDir: "./transforms",
};
// createJestConfig is exported in this way to ensure that next/jest can load the Next.js config which is async
module.exports = customJestConfig;
-65
View File
@@ -1,65 +0,0 @@
{
"name": "@navikt/ds-codemod",
"version": "3.4.2",
"description": "Aksel codemods for NAVs designsystem",
"author": "Aksel | NAV designsystem team",
"license": "MIT",
"keywords": [
"react",
"codemod",
"jscodeshift"
],
"files": [
"transforms/**/*.js",
"utils/**/*.js",
"bin/*.js",
"lib/**/*.js",
"lib/cra-to-next/gitignore",
"tokens-map.mjs"
],
"scripts": {
"build": "yarn clean && tsc -p tsconfig.json",
"dev": "yarn clean && tsc --watch -p tsconfig.json",
"start": "./bin/cli.js",
"test": "yarn build && jest",
"test:watch": "jest --watch",
"clean": "node clean.mjs"
},
"bin": "./bin/ds-codemod.js",
"repository": {
"type": "git",
"url": "git+https://github.com/navikt/aksel.git",
"directory": "@navikt/codemod"
},
"homepage": "https://github.com/navikt/aksel/tree/main/@navikt/codemod",
"dependencies": {
"chalk": "4.1.0",
"cheerio": "1.0.0-rc.9",
"execa": "4.0.3",
"globby": "11.0.1",
"inquirer": "7.3.3",
"is-git-clean": "1.1.0",
"jest": "^29.0.0",
"jscodeshift": "0.13.1",
"jscodeshift-add-imports": "1.0.10",
"lodash": "4.17.21",
"meow": "7.0.1",
"prettier": "2.8.8"
},
"devDependencies": {
"@babel/preset-env": "^7.0.0",
"@types/jest": "^29.0.0",
"@types/jscodeshift": "0.11.5",
"@types/react": "^18.0.0",
"del": "7.0.0",
"typescript": "^4.8.0"
},
"sideEffects": false,
"engines": {
"node": ">=12.0.0"
},
"publishConfig": {
"access": "public",
"provenance": true
}
}
-368
View File
@@ -1,368 +0,0 @@
/* 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 };
@@ -1,18 +0,0 @@
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);
}
@@ -1,17 +0,0 @@
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",
},
});
}
@@ -1,8 +0,0 @@
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<SpeechBubble illustration={<Illustration />}>
<div />
</SpeechBubble>
);
};
@@ -1,8 +0,0 @@
/* eslint-disable react/jsx-no-undef */
export const Page = () => {
return (
<SpeechBubble avatar={<Illustration />}>
<div />
</SpeechBubble>
);
};
@@ -1,26 +0,0 @@
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>
);
};
@@ -1,26 +0,0 @@
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>
);
};
@@ -1,25 +0,0 @@
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>
);
};
@@ -1,25 +0,0 @@
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>
);
};
@@ -1,44 +0,0 @@
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>
);
};
@@ -1,44 +0,0 @@
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>
);
};
@@ -1,44 +0,0 @@
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>
);
};
@@ -1,44 +0,0 @@
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>
);
};
@@ -1,18 +0,0 @@
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>
);
};
@@ -1,18 +0,0 @@
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>
);
};
@@ -1,11 +0,0 @@
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>
);
};
@@ -1,11 +0,0 @@
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>
);
};
@@ -1,11 +0,0 @@
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>
);
};
@@ -1,11 +0,0 @@
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>
);
};
@@ -1,25 +0,0 @@
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>
);
};
@@ -1,30 +0,0 @@
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>
);
};
@@ -1,19 +0,0 @@
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>
);
};
@@ -1,19 +0,0 @@
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>
);
};
@@ -1,15 +0,0 @@
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>
);
};
@@ -1,19 +0,0 @@
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>
);
};
@@ -1,10 +0,0 @@
export {};
jest.autoMockOff();
const defineTest = require("jscodeshift/dist/testUtils").defineTest;
const tests = ["props", "complete", "idempotent", "renamed"];
for (const test of tests) {
defineTest(__dirname, "chat", null, `chat/${test}`);
}
@@ -1,10 +0,0 @@
export {};
jest.autoMockOff();
const defineTest = require("jscodeshift/dist/testUtils").defineTest;
const tests = ["size", "import", "idempotent"];
for (const test of tests) {
defineTest(__dirname, "pagination", null, `pagination/${test}`);
}
@@ -1,10 +0,0 @@
export {};
jest.autoMockOff();
const defineTest = require("jscodeshift/dist/testUtils").defineTest;
const tests = ["props", "idempotent", "complete"];
for (const test of tests) {
defineTest(__dirname, "tabs", null, `tabs/${test}`);
}
-68
View File
@@ -1,68 +0,0 @@
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);
}
@@ -1,83 +0,0 @@
/**
* @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);
}
Loaded 100 of 1075 files, more files were not shown because too many files have changed in this diff. Show more