@norges-domstoler/dds-components 23.2.0 → 23.2.1

package/README.md

@@ -1,50 +1,50 @@
-# @norges-domstoler/dds-components
-
-[![Version](https://img.shields.io/npm/v/@norges-domstoler/dds-components)](https://www.npmjs.com/package/@norges-domstoler/dds-components) ![License](https://img.shields.io/npm/l/@norges-domstoler/dds-components)
-
-React UI komponenter til bruk i domstolenes tjenester.
-
-Sjekk ut [Elsa - domstolenes designsystem](https://design.domstol.no/) og [Elsa Storybook](https://domstolene.github.io/designsystem) for dokumentasjon og demoer.
-
-## 📦 Installasjon
-
-```sh
-pnpm add @norges-domstoler/dds-components
-```
-
-Importer styling av komponentene i CSS:
-
-```css
-@import '@norges-domstoler/dds-components/index.css';
-```
-
-## 🔨 Bruk
-
-Wrapp applikasjonen din i `<DdsProvider>`.
-
-```jsx
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import {
-  Button,
-  TextInput,
-  DdsProvider,
-} from '@norges-domstoler/dds-components';
-
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
-  <React>
-    <DdsProvider language="nb">
-      <TextInput label="Input" />
-      <Button>Primary</Button>
-      <Button purpose="secondary" size="small">
-        Secondary
-      </Button>
-    </DdsProvider>
-  </React>,
-);
-```
-
-## 📃 Komponenter
-
-Sjekk [Komponenter](https://design.domstol.no/987b33f71/p/438035-komponenter) for oversikt over alle komponenter, og [Nyheter](https://design.domstol.no/987b33f71/p/66ec5c-nyheter) for status på nye komponenter.
+# @norges-domstoler/dds-components
+
+[![Version](https://img.shields.io/npm/v/@norges-domstoler/dds-components)](https://www.npmjs.com/package/@norges-domstoler/dds-components) ![License](https://img.shields.io/npm/l/@norges-domstoler/dds-components)
+
+React UI komponenter til bruk i domstolenes tjenester.
+
+Sjekk ut [Elsa - domstolenes designsystem](https://design.domstol.no/) og [Elsa Storybook](https://domstolene.github.io/designsystem) for dokumentasjon og demoer.
+
+## 📦 Installasjon
+
+```sh
+pnpm add @norges-domstoler/dds-components
+```
+
+Importer styling av komponentene i CSS:
+
+```css
+@import '@norges-domstoler/dds-components/index.css';
+```
+
+## 🔨 Bruk
+
+Wrapp applikasjonen din i `<DdsProvider>`.
+
+```jsx
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import {
+  Button,
+  TextInput,
+  DdsProvider,
+} from '@norges-domstoler/dds-components';
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React>
+    <DdsProvider language="nb">
+      <TextInput label="Input" />
+      <Button>Primary</Button>
+      <Button purpose="secondary" size="small">
+        Secondary
+      </Button>
+    </DdsProvider>
+  </React>,
+);
+```
+
+## 📃 Komponenter
+
+Sjekk [Komponenter](https://design.domstol.no/987b33f71/p/438035-komponenter) for oversikt over alle komponenter, og [Nyheter](https://design.domstol.no/987b33f71/p/66ec5c-nyheter) for status på nye komponenter.

package/dist/index.css

@@ -63,10 +63,6 @@
 }
 
 /* src/styles/selection.css */
-*::-moz-selection {
-  background-color: var(--dds-color-surface-highlighted-default);
-  color: var(--dds-color-text-default);
-}
 *::selection {
   background-color: var(--dds-color-surface-highlighted-default);
   color: var(--dds-color-text-default);
@@ -121,7 +117,6 @@
 :where(.typographyStyles_a--nested__parent .typographyStyles_a--nested__child) {
   font: inherit;
   color: var(--dds-color-text-link);
-  width: -moz-fit-content;
   width: fit-content;
   text-decoration: underline;
   text-decoration-thickness: max(1px, 0.0625rem);
@@ -586,7 +581,6 @@
 /* src/components/helpers/AccordionBase/AccordionBase.module.css */
 :where(.AccordionBase_header-button) {
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
   position: relative;
   cursor: pointer;
@@ -660,7 +654,6 @@
 .DropdownItem_item--interactive {
   text-align: left;
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
   border: none;
   cursor: pointer;
@@ -790,7 +783,6 @@
 }
 .layout_dds-c-gap {
   --dds-r-c-gap: var(--dds-r-xs-c-gap);
-  -moz-column-gap: var(--dds-r-c-gap, initial);
   column-gap: var(--dds-r-c-gap, initial);
 }
 .layout_dds-r-gap {
@@ -1972,7 +1964,6 @@
 /* src/components/Typography/Typography/Typography.module.css */
 .Typography_container {
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
 }
 
@@ -2001,12 +1992,10 @@
 /* src/components/Button/Button.module.css */
 :where(.Button_button) {
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: -moz-fit-content;
   width: fit-content;
   cursor: pointer;
   box-shadow: none;
@@ -2055,7 +2044,6 @@
     padding-inline: var(--dds-spacing-x0-25);
   }
   &.Button_clear {
-    min-height: -moz-fit-content;
     min-height: fit-content;
     padding: var(--dds-spacing-x0-125);
   }
@@ -2196,7 +2184,6 @@
   cursor: pointer;
   display: flex;
   align-items: center;
-  width: -moz-fit-content;
   width: fit-content;
   gap: var(--dds-spacing-x0-25);
   --dds-toggle-medium-thumb-spacing-inline: var(--dds-spacing-x0-125);
@@ -2569,7 +2556,6 @@
 .SelectionControl_label {
   cursor: pointer;
   -webkit-user-select: none;
-  -moz-user-select: none;
   user-select: none;
   &:not(:hover) input[aria-invalid]:enabled:not([aria-readonly=true]):not(:focus-visible):not(:checked) ~ .SelectionControl_selection-control {
     background-color: var(--dds-color-surface-danger-default);
@@ -2765,7 +2751,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 }
 .DateInput_calendar__month-button {
   -webkit-user-select: none;
-  -moz-user-select: none;
   user-select: none;
 }
 .DateInput_calendar__grid-element {
@@ -2897,10 +2882,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
   &[type=datetime-local] {
     -webkit-appearance: none;
   }
-  &:hover:enabled:-moz-read-write:not(:focus-visible):not(.Input_disabled):not(.Input_read-only) {
-    border-color: var(--dds-color-border-action-hover);
-    box-shadow: 0 0 0 1px var(--dds-color-border-action-hover);
-  }
   &:hover:enabled:read-write:not(:focus-visible):not(.Input_disabled):not(.Input_read-only) {
     border-color: var(--dds-color-border-action-hover);
     box-shadow: 0 0 0 1px var(--dds-color-border-action-hover);
@@ -2908,13 +2889,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 }
 :where(.Input_input--stateful) {
   -webkit-appearance: textfield;
-  &:enabled:-moz-read-only {
-    box-shadow: none;
-    border: 1px solid var(--dds-color-border-default);
-    background-color: var(--dds-color-surface-field-disabled);
-    color: var(--dds-color-text-medium);
-    cursor: default;
-  }
   &:not(.Input_disabled).Input_read-only,
   &:enabled:read-only {
     box-shadow: none;
@@ -2939,20 +2913,11 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 :where(.Input_input--stateful-danger) {
   border-color: var(--dds-color-border-danger);
   box-shadow: 0 0 0 1px var(--dds-color-border-danger);
-  &:hover:enabled:-moz-read-write:not(:focus-within) {
-    border-color: var(--dds-color-border-danger);
-    box-shadow: 0 0 0 1px var(--dds-color-border-danger);
-  }
   &:not(.Input_disabled):hover:not(:focus-within),
   &:hover:enabled:read-write:not(:focus-within) {
     border-color: var(--dds-color-border-danger);
     box-shadow: 0 0 0 1px var(--dds-color-border-danger);
   }
-  &:focus-within:enabled:-moz-read-write,
-  &:hover:focus-within:enabled:-moz-read-write,
-  &:active:enabled:-moz-read-write {
-    border-color: 1px solid var(--dds-color-border-default);
-  }
   &:not(.Input_disabled):focus-within,
   &:focus-within:enabled:read-write,
   &:hover:focus-within:enabled:read-write,
@@ -3301,7 +3266,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 .Table_sort-button {
   gap: var(--dds-spacing-x0-5);
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
   display: flex;
   align-items: center;
@@ -3399,20 +3363,15 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
       top: calc((var(--dds-font-lineheight-x1) * 1em) / 2 - var(--dds-list-bullet-size) / 2);
       left: 0;
       background: var(--dds-color-text-body);
-      -webkit-mask-size: 100%;
       mask-size: 100%;
-      -webkit-mask-repeat: no-repeat;
       mask-repeat: no-repeat;
-      -webkit-mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<circle cx="12" cy="12" r="6" fill="%230B0D0E"/>%0A</svg>%0A');
-      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<circle cx="12" cy="12" r="6" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0D%0A<circle cx="12" cy="12" r="6" fill="%230B0D0E"/>%0D%0A</svg>%0D%0A');
     }
     ul > li:before {
-      -webkit-mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect x="4" y="10" width="15.65" height="3.9125" fill="%230B0D0E"/>%0A</svg>%0A');
-      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect x="4" y="10" width="15.65" height="3.9125" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0D%0A<rect x="4" y="10" width="15.65" height="3.9125" fill="%230B0D0E"/>%0D%0A</svg>%0D%0A');
     }
     ul > li > ul > li:before {
-      -webkit-mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M12 16.6154C16.4183 16.6154 20 12.7581 20 8H4C4 12.7581 7.58172 16.6154 12 16.6154Z" fill="%230B0D0E"/>%0A</svg>%0A');
-      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M12 16.6154C16.4183 16.6154 20 12.7581 20 8H4C4 12.7581 7.58172 16.6154 12 16.6154Z" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0D%0A<path d="M12 16.6154C16.4183 16.6154 20 12.7581 20 8H4C4 12.7581 7.58172 16.6154 12 16.6154Z" fill="%230B0D0E"/>%0D%0A</svg>%0D%0A');
     }
   }
 }
@@ -3707,17 +3666,10 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
   }
 }
 .InlineEdit_inline-select {
-  -webkit-appearance: none;
-  -moz-appearance: none;
   appearance: none;
   text-overflow: ellipsis;
   cursor: pointer;
 }
-.InlineEdit_inline-input:hover:enabled:-moz-read-write:not(:focus) {
-  border-color: transparent;
-  box-shadow: none;
-  background-color: var(--dds-color-surface-hover-default);
-}
 .InlineEdit_inline-input:hover:enabled:read-write:not(:focus),
 .InlineEdit_inline-select:hover:enabled:not(:focus) {
   border-color: transparent;
@@ -3861,7 +3813,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 .NewsPopover_img-wrapper img {
   width: 100%;
   height: 100%;
-  -o-object-fit: contain;
   object-fit: contain;
 }
 
@@ -3900,8 +3851,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 
 /* src/components/Select/NativeSelect/NativeSelect.module.css */
 .NativeSelect_select {
-  -webkit-appearance: none;
-  -moz-appearance: none;
   appearance: none;
   text-overflow: ellipsis;
   font: inherit;
@@ -4043,7 +3992,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 /* src/components/Popover/Popover.module.css */
 .Popover_container {
   position: absolute;
-  width: -moz-fit-content;
   width: fit-content;
   z-index: var(--dds-zindex-popover);
   padding: var(--dds-spacing-x0-75) var(--dds-spacing-x1) var(--dds-spacing-x1-5) var(--dds-spacing-x1);
@@ -4279,7 +4227,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
 .Tabs_tab {
   border: none;
   -webkit-user-select: text;
-  -moz-user-select: text;
   user-select: text;
   display: flex;
   align-items: center;