@norges-domstoler/dds-components 0.0.0-dev-20260602071227 → 0.0.0-dev-20260605083837
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.
- package/dist/index.css +36 -54
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +33 -2
- package/dist/index.d.ts +33 -2
- package/dist/index.js +35 -24
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +35 -23
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
package/dist/index.css
CHANGED
|
@@ -1887,84 +1887,92 @@
|
|
|
1887
1887
|
}
|
|
1888
1888
|
}
|
|
1889
1889
|
.Button_button--xsmall {
|
|
1890
|
+
height: var(--dds-size-height-input-xsmall);
|
|
1891
|
+
padding-block: var(--dds-spacing-x0-125);
|
|
1890
1892
|
&.Button_just-text {
|
|
1891
|
-
padding: var(--dds-spacing-x0-
|
|
1893
|
+
padding-inline: var(--dds-spacing-x0-5);
|
|
1892
1894
|
}
|
|
1893
1895
|
&.Button_with-text-and-icon {
|
|
1894
1896
|
gap: var(--dds-spacing-xs-icon-text-gap);
|
|
1895
1897
|
&.Button_with-icon-left {
|
|
1896
|
-
padding: var(--dds-spacing-x0-25) var(--dds-spacing-x0-5)
|
|
1898
|
+
padding-inline: var(--dds-spacing-x0-25) var(--dds-spacing-x0-5);
|
|
1897
1899
|
}
|
|
1898
1900
|
&.Button_with-icon-right {
|
|
1899
|
-
padding: var(--dds-spacing-x0-
|
|
1901
|
+
padding-inline: var(--dds-spacing-x0-5) var(--dds-spacing-x0-25);
|
|
1900
1902
|
}
|
|
1901
1903
|
}
|
|
1902
1904
|
&.Button_just-icon,
|
|
1903
1905
|
&.Button_button--is-loading.Button_no-content {
|
|
1904
|
-
padding: var(--dds-spacing-x0-25);
|
|
1906
|
+
padding-inline: var(--dds-spacing-x0-25);
|
|
1905
1907
|
}
|
|
1906
1908
|
&.Button_clear {
|
|
1907
1909
|
padding: var(--dds-spacing-x0-125);
|
|
1908
1910
|
}
|
|
1909
1911
|
}
|
|
1910
1912
|
.Button_button--small {
|
|
1913
|
+
height: var(--dds-size-height-input-small);
|
|
1914
|
+
padding-block: var(--dds-spacing-x0-25);
|
|
1911
1915
|
&.Button_just-text {
|
|
1912
|
-
padding: var(--dds-spacing-x0-
|
|
1916
|
+
padding-inline: var(--dds-spacing-x0-75);
|
|
1913
1917
|
}
|
|
1914
1918
|
&.Button_with-text-and-icon {
|
|
1915
1919
|
gap: var(--dds-spacing-sm-icon-text-gap);
|
|
1916
1920
|
&.Button_with-icon-left {
|
|
1917
|
-
padding: var(--dds-spacing-x0-5) var(--dds-spacing-x0-75)
|
|
1921
|
+
padding-inline: var(--dds-spacing-x0-5) var(--dds-spacing-x0-75);
|
|
1918
1922
|
}
|
|
1919
1923
|
&.Button_with-icon-right {
|
|
1920
|
-
padding: var(--dds-spacing-x0-
|
|
1924
|
+
padding-inline: var(--dds-spacing-x0-75) var(--dds-spacing-x0-5);
|
|
1921
1925
|
}
|
|
1922
1926
|
}
|
|
1923
1927
|
&.Button_just-icon,
|
|
1924
1928
|
&.Button_button--is-loading.Button_no-content {
|
|
1925
|
-
padding: var(--dds-spacing-x0-5);
|
|
1929
|
+
padding-inline: var(--dds-spacing-x0-5);
|
|
1926
1930
|
}
|
|
1927
1931
|
&.Button_clear {
|
|
1928
1932
|
padding: var(--dds-spacing-x0-25);
|
|
1929
1933
|
}
|
|
1930
1934
|
}
|
|
1931
1935
|
.Button_button--medium {
|
|
1936
|
+
height: var(--dds-size-height-input-medium);
|
|
1937
|
+
padding-block: var(--dds-spacing-x0-5);
|
|
1932
1938
|
&.Button_just-text {
|
|
1933
|
-
padding: var(--dds-spacing-
|
|
1939
|
+
padding-inline: var(--dds-spacing-x1);
|
|
1934
1940
|
}
|
|
1935
1941
|
&.Button_with-text-and-icon {
|
|
1936
1942
|
gap: var(--dds-spacing-md-icon-text-gap);
|
|
1937
1943
|
&.Button_with-icon-left {
|
|
1938
|
-
padding: var(--dds-spacing-x0-75) var(--dds-spacing-x1)
|
|
1944
|
+
padding-inline: var(--dds-spacing-x0-75) var(--dds-spacing-x1);
|
|
1939
1945
|
}
|
|
1940
1946
|
&.Button_with-icon-right {
|
|
1941
|
-
padding: var(--dds-spacing-
|
|
1947
|
+
padding-inline: var(--dds-spacing-x1) var(--dds-spacing-x0-75);
|
|
1942
1948
|
}
|
|
1943
1949
|
}
|
|
1944
1950
|
&.Button_just-icon,
|
|
1945
1951
|
&.Button_button--is-loading.Button_no-content {
|
|
1946
|
-
padding: var(--dds-spacing-x0-75);
|
|
1952
|
+
padding-inline: var(--dds-spacing-x0-75);
|
|
1947
1953
|
}
|
|
1948
1954
|
&.Button_clear {
|
|
1949
1955
|
padding: var(--dds-spacing-x0-5);
|
|
1950
1956
|
}
|
|
1951
1957
|
}
|
|
1952
1958
|
.Button_button--large {
|
|
1959
|
+
height: var(--dds-size-height-input-large);
|
|
1960
|
+
padding-block: var(--dds-spacing-x0-75);
|
|
1953
1961
|
&.Button_just-text {
|
|
1954
|
-
padding: var(--dds-spacing-x1
|
|
1962
|
+
padding-inline: var(--dds-spacing-x1-5);
|
|
1955
1963
|
}
|
|
1956
1964
|
&.Button_with-text-and-icon {
|
|
1957
1965
|
gap: var(--dds-spacing-lg-icon-text-gap);
|
|
1958
1966
|
&.Button_with-icon-left {
|
|
1959
|
-
padding: var(--dds-spacing-x1) var(--dds-spacing-x1-5)
|
|
1967
|
+
padding-inline: var(--dds-spacing-x1) var(--dds-spacing-x1-5);
|
|
1960
1968
|
}
|
|
1961
1969
|
&.Button_with-icon-right {
|
|
1962
|
-
padding: var(--dds-spacing-x1
|
|
1970
|
+
padding-inline: var(--dds-spacing-x1-5) var(--dds-spacing-x1);
|
|
1963
1971
|
}
|
|
1964
1972
|
}
|
|
1965
1973
|
&.Button_just-icon,
|
|
1966
1974
|
&.Button_button--is-loading.Button_no-content {
|
|
1967
|
-
padding: var(--dds-spacing-x1);
|
|
1975
|
+
padding-inline: var(--dds-spacing-x1);
|
|
1968
1976
|
}
|
|
1969
1977
|
&.Button_clear {
|
|
1970
1978
|
padding: var(--dds-spacing-x0-75);
|
|
@@ -2551,10 +2559,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
2551
2559
|
font-family: var(--dds-font-family-monospace);
|
|
2552
2560
|
}
|
|
2553
2561
|
.DateInput_segment {
|
|
2554
|
-
padding: 0 0.05rem;
|
|
2555
|
-
display: block;
|
|
2556
|
-
width: -moz-max-content;
|
|
2557
|
-
width: max-content;
|
|
2558
2562
|
font-variant-numeric: tabular-nums;
|
|
2559
2563
|
outline: none;
|
|
2560
2564
|
font-family: var(--dds-font-family-monospace);
|
|
@@ -2803,16 +2807,20 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
2803
2807
|
}
|
|
2804
2808
|
}
|
|
2805
2809
|
:where(.Input_input--large) {
|
|
2806
|
-
padding: var(--dds-spacing-
|
|
2810
|
+
padding: var(--dds-spacing-x0-75);
|
|
2811
|
+
height: var(--dds-size-height-input-large);
|
|
2807
2812
|
}
|
|
2808
2813
|
:where(.Input_input--medium) {
|
|
2809
|
-
padding: var(--dds-spacing-x0-75);
|
|
2814
|
+
padding: var(--dds-spacing-x0-5) var(--dds-spacing-x0-75);
|
|
2815
|
+
height: var(--dds-size-height-input-medium);
|
|
2810
2816
|
}
|
|
2811
2817
|
:where(.Input_input--small) {
|
|
2812
|
-
padding: var(--dds-spacing-x0-5);
|
|
2818
|
+
padding: var(--dds-spacing-x0-25) var(--dds-spacing-x0-5);
|
|
2819
|
+
height: var(--dds-size-height-input-small);
|
|
2813
2820
|
}
|
|
2814
2821
|
:where(.Input_input--xsmall) {
|
|
2815
|
-
padding: var(--dds-spacing-x0-25);
|
|
2822
|
+
padding: var(--dds-spacing-x0-125) var(--dds-spacing-x0-25);
|
|
2823
|
+
height: var(--dds-size-height-input-xsmall);
|
|
2816
2824
|
}
|
|
2817
2825
|
:where(.Input_input-with-icon--large) {
|
|
2818
2826
|
padding-left: calc(var(--dds-input-absolute-el-left-large) + var(--dds-size-icon-component) + var(--dds-spacing-lg-icon-text-gap));
|
|
@@ -3806,6 +3814,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
3806
3814
|
}
|
|
3807
3815
|
}
|
|
3808
3816
|
&:disabled {
|
|
3817
|
+
opacity: 1;
|
|
3809
3818
|
cursor: not-allowed;
|
|
3810
3819
|
color: var(--dds-color-text-subtle);
|
|
3811
3820
|
background-color: var(--dds-color-surface-field-disabled);
|
|
@@ -3927,6 +3936,9 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
3927
3936
|
.PhoneInput_calling-code {
|
|
3928
3937
|
left: var(--dds-spacing-x0-5);
|
|
3929
3938
|
}
|
|
3939
|
+
.PhoneInput_calling-code--disabled {
|
|
3940
|
+
color: var(--dds-color-text-subtle);
|
|
3941
|
+
}
|
|
3930
3942
|
|
|
3931
3943
|
/* src/components/Popover/Popover.module.css */
|
|
3932
3944
|
.Popover_container {
|
|
@@ -4359,11 +4371,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
4359
4371
|
grid-auto-columns: 1fr;
|
|
4360
4372
|
}
|
|
4361
4373
|
.ToggleBar_content {
|
|
4362
|
-
display: flex;
|
|
4363
|
-
justify-content: center;
|
|
4364
|
-
align-items: center;
|
|
4365
4374
|
word-break: break-word;
|
|
4366
|
-
height: 100%;
|
|
4367
4375
|
box-sizing: border-box;
|
|
4368
4376
|
cursor: pointer;
|
|
4369
4377
|
background-color: var(--dds-color-surface-default);
|
|
@@ -4426,18 +4434,8 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
4426
4434
|
|
|
4427
4435
|
/* src/components/ToggleButton/ToggleButton.module.css */
|
|
4428
4436
|
.ToggleButton_content {
|
|
4429
|
-
display: flex;
|
|
4430
|
-
align-items: center;
|
|
4431
|
-
width: 100%;
|
|
4432
|
-
height: 100%;
|
|
4433
4437
|
box-sizing: border-box;
|
|
4434
4438
|
cursor: pointer;
|
|
4435
|
-
width: -moz-fit-content;
|
|
4436
|
-
width: fit-content;
|
|
4437
|
-
border: 1px solid var(--dds-color-border-default);
|
|
4438
|
-
border-radius: var(--dds-border-radius-rounded);
|
|
4439
|
-
background-color: var(--dds-color-surface-default);
|
|
4440
|
-
color: var(--dds-color-text-default);
|
|
4441
4439
|
@media (prefers-reduced-motion: no-preference) {
|
|
4442
4440
|
transition:
|
|
4443
4441
|
border-color var(--dds-motion-micro-state),
|
|
@@ -4449,22 +4447,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
|
|
|
4449
4447
|
background-color: var(--dds-color-surface-hover-default);
|
|
4450
4448
|
}
|
|
4451
4449
|
}
|
|
4452
|
-
.ToggleButton_small {
|
|
4453
|
-
gap: var(--dds-spacing-sm-icon-text-gap);
|
|
4454
|
-
padding: var(--dds-spacing-x0-5) var(--dds-spacing-x1);
|
|
4455
|
-
}
|
|
4456
|
-
.ToggleButton_xsmall {
|
|
4457
|
-
gap: var(--dds-spacing-xs-icon-text-gap);
|
|
4458
|
-
padding: var(--dds-spacing-x0-25) var(--dds-spacing-x0-5);
|
|
4459
|
-
}
|
|
4460
|
-
.ToggleButton_content--with-icon {
|
|
4461
|
-
&.ToggleButton_small {
|
|
4462
|
-
padding-inline-start: var(--dds-spacing-x0-75);
|
|
4463
|
-
}
|
|
4464
|
-
&.ToggleButton_xsmall {
|
|
4465
|
-
padding-inline-start: var(--dds-spacing-x0-25);
|
|
4466
|
-
}
|
|
4467
|
-
}
|
|
4468
4450
|
input:checked + .ToggleButton_content {
|
|
4469
4451
|
color: var(--dds-color-text-on-action);
|
|
4470
4452
|
background-color: var(--dds-color-surface-action-resting);
|