@sikt/sds-tabs 3.1.0 → 3.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/index.css +4 -2
  3. package/dist/index.css.map +1 -1
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  All notable changes to this project will be documented in this file. See [commit-and-tag-version](https://github.com/absolute-version/commit-and-tag-version) for commit guidelines.
4
4
 
5
+ ## [3.2.0](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-tabs@3.1.0...@sikt/sds-tabs@3.2.0) (2025-06-02)
6
+
7
+ ### Features
8
+
9
+ - **tabs:** change hover color to neutral ([1c81bdb](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/commit/1c81bdb438230613dcf1da0bcfd6966adde22864))
10
+
5
11
  ## [3.1.0](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-tabs@3.0.4...@sikt/sds-tabs@3.1.0) (2025-05-20)
6
12
 
7
13
  ### Features
package/dist/index.css CHANGED
@@ -1,6 +1,8 @@
1
1
  /* src/tabs.pcss */
2
2
  .sds-tabs {
3
3
  --tab-list-border-bottom: var(--sds-space-border-weight-regular);
4
+ --tab-hover-background-color: var( --sds-color-interaction-neutral-transparent-highlight );
5
+ --tab-active-background-color: var( --sds-color-interaction-neutral-transparent-pressed );
4
6
  }
5
7
  .sds-tabs__tab-list {
6
8
  border-bottom: var(--tab-list-border-bottom) solid var(--sds-color-layout-divider-subtle);
@@ -34,10 +36,10 @@
34
36
  }
35
37
  .sds-tabs__tab:hover,
36
38
  .sds-tabs__tab:focus-visible {
37
- background-color: var( --sds-color-interaction-primary-transparent-highlight );
39
+ background-color: var(--tab-hover-background-color);
38
40
  }
39
41
  .sds-tabs__tab:active {
40
- background-color: var( --sds-color-interaction-primary-transparent-pressed );
42
+ background-color: var(--tab-active-background-color);
41
43
  border-color: var(--sds-color-interaction-primary-strong-pressed);
42
44
  }
43
45
  .sds-tabs__tab:focus-visible {
package/dist/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/tabs.pcss","../src/tab-link.pcss"],"sourcesContent":[".sds-tabs {\n --tab-list-border-bottom: var(--sds-space-border-weight-regular);\n}\n\n .sds-tabs__tab-list {\n border-bottom: var(--tab-list-border-bottom) solid\n var(--sds-color-layout-divider-subtle);\n display: flex;\n margin-bottom: var(--sds-space-gap-small);\n }\n\n .sds-tabs__tab {\n align-items: center;\n border: 0 none;\n border-bottom: var(--sds-space-border-weight-bold) solid transparent;\n color: var(--sds-color-text-primary);\n display: flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-label-l-fontsize);\n font-weight: var(--sds-typography-label-l-fontweight);\n line-height: var(--sds-typography-label-l-lineheight);\n padding: var(--sds-space-padding-medium) var(--sds-space-padding-small);\n margin-bottom: calc(var(--tab-list-border-bottom) * -1);\n }\n\n .sds-tabs__tab-icon {\n align-items: center;\n display: flex;\n font-size: var(--sds-typography-fontsize-700);\n justify-content: center;\n }\n\n .sds-tabs__tab-badge {\n margin: -1px 0;\n }\n\n .sds-tabs__tab[aria-selected=\"true\"] {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-tabs__tab:hover,\n .sds-tabs__tab:focus-visible {\n background-color: var(\n --sds-color-interaction-primary-transparent-highlight\n );\n }\n\n .sds-tabs__tab:active {\n background-color: var(\n --sds-color-interaction-primary-transparent-pressed\n );\n border-color: var(--sds-color-interaction-primary-strong-pressed);\n }\n\n .sds-tabs__tab:focus-visible {\n outline: var(--sds-focus-outline);\n }\n\n .sds-tabs__tab-panel:focus-visible {\n outline: var(--sds-focus-outline);\n }\n",".sds-tab-link {\n display: inline-flex;\n text-decoration: none;\n}\n\n .sds-tab-link--selected {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-tab-link:focus-visible {\n outline-offset: 0;\n }\n"],"mappings":";AAAA,CAAC;AACC,4BAA0B,IAAI;AAChC;AAEE,CAAC;AACC,iBAAe,IAAI,0BAA0B,MAC3C,IAAI;AACN,WAAS;AACT,iBAAe,IAAI;AACrB;AAEA,CAAC;AACC,eAAa;AACb,UAAQ,EAAE;AACV,iBAAe,IAAI,gCAAgC,MAAM;AACzD,SAAO,IAAI;AACX,WAAS;AACT,OAAK,IAAI;AACT,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,WAAS,IAAI,4BAA4B,IAAI;AAC7C,iBAAe,KAAK,IAAI,0BAA0B,EAAE;AACtD;AAEA,CAAC;AACG,eAAa;AACb,WAAS;AACT,aAAW,IAAI;AACf,mBAAiB;AACnB;AAEF,CAAC;AACG,UAAQ,KAAK;AACf;AAEF,CAzBC,aAyBa,CAAC;AACX,gBAAc,IAAI;AACpB;AAEF,CA7BC,aA6Ba;AACZ,CA9BD,aA8Be;AACZ,oBAAkB,KAChB;AAEJ;AAEF,CApCC,aAoCa;AACV,oBAAkB,KAChB;AAEF,gBAAc,IAAI;AACpB;AAEF,CA3CC,aA2Ca;AACV,WAAS,IAAI;AACf;AAEF,CAAC,mBAAmB;AAChB,WAAS,IAAI;AACf;;;AC5DJ,CAAC;AACC,WAAS;AACT,mBAAiB;AACnB;AAEE,CAAC;AACC,gBAAc,IAAI;AACpB;AAEA,CATD,YASc;AACX,kBAAgB;AAClB;","names":[]}
1
+ {"version":3,"sources":["../src/tabs.pcss","../src/tab-link.pcss"],"sourcesContent":[".sds-tabs {\n --tab-list-border-bottom: var(--sds-space-border-weight-regular);\n --tab-hover-background-color: var(\n --sds-color-interaction-neutral-transparent-highlight\n );\n --tab-active-background-color: var(\n --sds-color-interaction-neutral-transparent-pressed\n );\n}\n\n .sds-tabs__tab-list {\n border-bottom: var(--tab-list-border-bottom) solid\n var(--sds-color-layout-divider-subtle);\n display: flex;\n margin-bottom: var(--sds-space-gap-small);\n }\n\n .sds-tabs__tab {\n align-items: center;\n border: 0 none;\n border-bottom: var(--sds-space-border-weight-bold) solid transparent;\n color: var(--sds-color-text-primary);\n display: flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-label-l-fontsize);\n font-weight: var(--sds-typography-label-l-fontweight);\n line-height: var(--sds-typography-label-l-lineheight);\n padding: var(--sds-space-padding-medium) var(--sds-space-padding-small);\n margin-bottom: calc(var(--tab-list-border-bottom) * -1);\n }\n\n .sds-tabs__tab-icon {\n align-items: center;\n display: flex;\n font-size: var(--sds-typography-fontsize-700);\n justify-content: center;\n }\n\n .sds-tabs__tab-badge {\n margin: -1px 0;\n }\n\n .sds-tabs__tab[aria-selected=\"true\"] {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-tabs__tab:hover,\n .sds-tabs__tab:focus-visible {\n background-color: var(--tab-hover-background-color);\n }\n\n .sds-tabs__tab:active {\n background-color: var(--tab-active-background-color);\n border-color: var(--sds-color-interaction-primary-strong-pressed);\n }\n\n .sds-tabs__tab:focus-visible {\n outline: var(--sds-focus-outline);\n }\n\n .sds-tabs__tab-panel:focus-visible {\n outline: var(--sds-focus-outline);\n }\n",".sds-tab-link {\n display: inline-flex;\n text-decoration: none;\n}\n\n .sds-tab-link--selected {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-tab-link:focus-visible {\n outline-offset: 0;\n }\n"],"mappings":";AAAA,CAAC;AACC,4BAA0B,IAAI;AAC9B,gCAA8B,KAC5B;AAEF,iCAA+B,KAC7B;AAEJ;AAEE,CAAC;AACC,iBAAe,IAAI,0BAA0B,MAC3C,IAAI;AACN,WAAS;AACT,iBAAe,IAAI;AACrB;AAEA,CAAC;AACC,eAAa;AACb,UAAQ,EAAE;AACV,iBAAe,IAAI,gCAAgC,MAAM;AACzD,SAAO,IAAI;AACX,WAAS;AACT,OAAK,IAAI;AACT,aAAW,IAAI;AACf,eAAa,IAAI;AACjB,eAAa,IAAI;AACjB,WAAS,IAAI,4BAA4B,IAAI;AAC7C,iBAAe,KAAK,IAAI,0BAA0B,EAAE;AACtD;AAEA,CAAC;AACG,eAAa;AACb,WAAS;AACT,aAAW,IAAI;AACf,mBAAiB;AACnB;AAEF,CAAC;AACG,UAAQ,KAAK;AACf;AAEF,CAzBC,aAyBa,CAAC;AACX,gBAAc,IAAI;AACpB;AAEF,CA7BC,aA6Ba;AACZ,CA9BD,aA8Be;AACZ,oBAAkB,IAAI;AACxB;AAEF,CAlCC,aAkCa;AACV,oBAAkB,IAAI;AACtB,gBAAc,IAAI;AACpB;AAEF,CAvCC,aAuCa;AACV,WAAS,IAAI;AACf;AAEF,CAAC,mBAAmB;AAChB,WAAS,IAAI;AACf;;;AC9DJ,CAAC;AACC,WAAS;AACT,mBAAiB;AACnB;AAEE,CAAC;AACC,gBAAc,IAAI;AACpB;AAEA,CATD,YASc;AACX,kBAAgB;AAClB;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sikt/sds-tabs",
3
- "version": "3.1.0",
3
+ "version": "3.2.0",
4
4
  "license": "UNLICENSED",
5
5
  "homepage": "https://designsystem.sikt.no/",
6
6
  "repository": {