@norges-domstoler/dds-components 5.2.0-beta.2 → 5.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.
- package/dist/cjs/components/DescriptionList/DescriptionList.tokens.d.ts +70 -0
- package/dist/cjs/components/Modal/Modal.tokens.d.ts +0 -6
- package/dist/cjs/components/Modal/ModalBody.d.ts +6 -1
- package/dist/cjs/components/ScrollableContainer/ScrollableContainer.d.ts +7 -0
- package/dist/cjs/components/ScrollableContainer/ScrollableContainer.stories.d.ts +15 -0
- package/dist/cjs/components/ScrollableContainer/ScrollableContainer.tokens.d.ts +25 -0
- package/dist/cjs/components/ScrollableContainer/Scrollbar.d.ts +7 -0
- package/dist/cjs/components/ScrollableContainer/index.d.ts +3 -0
- package/dist/cjs/components/ScrollableContainer/scrollbarStyling.d.ts +26 -0
- package/dist/cjs/helpers/styling/index.d.ts +0 -1
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/index.js +886 -606
- package/dist/components/DescriptionList/DescriptionList.js +6 -3
- package/dist/components/DescriptionList/DescriptionList.tokens.d.ts +70 -0
- package/dist/components/DescriptionList/DescriptionList.tokens.js +60 -0
- package/dist/components/DescriptionList/DescriptionListDesc.js +2 -2
- package/dist/components/DescriptionList/DescriptionListGroup.js +4 -4
- package/dist/components/Drawer/Drawer.js +12 -10
- package/dist/components/Modal/Modal.tokens.d.ts +0 -6
- package/dist/components/Modal/Modal.tokens.js +0 -10
- package/dist/components/Modal/ModalBody.d.ts +6 -1
- package/dist/components/Modal/ModalBody.js +13 -13
- package/dist/components/OverflowMenu/OverflowMenu.js +3 -3
- package/dist/components/ScrollableContainer/ScrollableContainer.d.ts +7 -0
- package/dist/components/ScrollableContainer/ScrollableContainer.js +47 -0
- package/dist/components/ScrollableContainer/ScrollableContainer.stories.d.ts +15 -0
- package/dist/components/ScrollableContainer/ScrollableContainer.tokens.d.ts +25 -0
- package/dist/components/ScrollableContainer/ScrollableContainer.tokens.js +36 -0
- package/dist/components/ScrollableContainer/Scrollbar.d.ts +7 -0
- package/dist/components/ScrollableContainer/Scrollbar.js +178 -0
- package/dist/components/ScrollableContainer/index.d.ts +3 -0
- package/dist/components/ScrollableContainer/scrollbarStyling.d.ts +26 -0
- package/dist/components/ScrollableContainer/scrollbarStyling.js +40 -0
- package/dist/components/Select/Select.styles.js +3 -3
- package/dist/components/Table/Table.js +2 -2
- package/dist/components/Table/TableWrapper.js +3 -3
- package/dist/components/Tabs/TabList.js +2 -2
- package/dist/components/TextInput/TextInput.styles.js +2 -2
- package/dist/components/TextInput/TextInput.tokens.js +1 -1
- package/dist/helpers/styling/focusVisible.js +3 -2
- package/dist/helpers/styling/index.d.ts +0 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +3 -0
- package/package.json +1 -3
- package/dist/cjs/components/DescriptionList/DescriptionListDesc.tokens.d.ts +0 -7
- package/dist/cjs/components/DescriptionList/DescriptionListGroup.tokens.d.ts +0 -4
- package/dist/cjs/components/DescriptionList/DescriptionListTerm.tokens.d.ts +0 -13
- package/dist/cjs/helpers/styling/scrollbarStyling.d.ts +0 -3
- package/dist/components/DescriptionList/DescriptionListDesc.tokens.d.ts +0 -7
- package/dist/components/DescriptionList/DescriptionListDesc.tokens.js +0 -22
- package/dist/components/DescriptionList/DescriptionListGroup.tokens.d.ts +0 -4
- package/dist/components/DescriptionList/DescriptionListGroup.tokens.js +0 -11
- package/dist/components/DescriptionList/DescriptionListTerm.tokens.d.ts +0 -13
- package/dist/components/DescriptionList/DescriptionListTerm.tokens.js +0 -27
- package/dist/helpers/styling/scrollbarStyling.d.ts +0 -3
- package/dist/helpers/styling/scrollbarStyling.js +0 -8
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
export declare const descriptionListTokens: {
|
|
2
|
+
term: {
|
|
3
|
+
appearance: {
|
|
4
|
+
small: {
|
|
5
|
+
font: {
|
|
6
|
+
lineHeight: any;
|
|
7
|
+
fontSize: string;
|
|
8
|
+
letterSpacing: any;
|
|
9
|
+
fontFamily: any;
|
|
10
|
+
fontWeight: any;
|
|
11
|
+
fontStyle: any;
|
|
12
|
+
};
|
|
13
|
+
color: string;
|
|
14
|
+
lineHeight: any;
|
|
15
|
+
fontSize: string;
|
|
16
|
+
letterSpacing: any;
|
|
17
|
+
fontFamily: any;
|
|
18
|
+
fontWeight: any;
|
|
19
|
+
fontStyle: any;
|
|
20
|
+
};
|
|
21
|
+
bold: {
|
|
22
|
+
font: {
|
|
23
|
+
lineHeight: any;
|
|
24
|
+
fontSize: string;
|
|
25
|
+
letterSpacing: any;
|
|
26
|
+
fontFamily: any;
|
|
27
|
+
fontWeight: any;
|
|
28
|
+
fontStyle: any;
|
|
29
|
+
};
|
|
30
|
+
lineHeight: any;
|
|
31
|
+
fontSize: string;
|
|
32
|
+
letterSpacing: any;
|
|
33
|
+
fontFamily: any;
|
|
34
|
+
fontWeight: number;
|
|
35
|
+
fontStyle: any;
|
|
36
|
+
color: string;
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
firstOfType: {
|
|
40
|
+
marginTop: string;
|
|
41
|
+
};
|
|
42
|
+
};
|
|
43
|
+
desc: {
|
|
44
|
+
base: {
|
|
45
|
+
font: {
|
|
46
|
+
lineHeight: any;
|
|
47
|
+
fontSize: string;
|
|
48
|
+
letterSpacing: any;
|
|
49
|
+
fontFamily: any;
|
|
50
|
+
fontWeight: any;
|
|
51
|
+
fontStyle: any;
|
|
52
|
+
};
|
|
53
|
+
gap: string;
|
|
54
|
+
color: string;
|
|
55
|
+
};
|
|
56
|
+
lastChild: {
|
|
57
|
+
marginBottom: string;
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
list: {
|
|
61
|
+
beforeNextTerm: {
|
|
62
|
+
marginTop: string;
|
|
63
|
+
};
|
|
64
|
+
};
|
|
65
|
+
group: {
|
|
66
|
+
base: {
|
|
67
|
+
margin: string;
|
|
68
|
+
};
|
|
69
|
+
};
|
|
70
|
+
};
|
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
import { BaseComponentPropsWithChildren } from '../../types';
|
|
2
|
+
import { Property } from 'csstype';
|
|
2
3
|
export declare type ModalBodyProps = BaseComponentPropsWithChildren<HTMLDivElement, {
|
|
3
4
|
/**Gjør at innholdet kan scrolles. Det må eventuelt settes (max)bredde og (max)høyde styling på både denne subkomponenten og `<Modal />`. */
|
|
4
5
|
scrollable?: boolean;
|
|
6
|
+
/**Høyde på container. */
|
|
7
|
+
height?: Property.Height;
|
|
5
8
|
}>;
|
|
6
9
|
export declare const ModalBody: import("react").ForwardRefExoticComponent<{
|
|
7
10
|
htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
|
|
8
|
-
} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "
|
|
11
|
+
} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
|
|
9
12
|
/**Gjør at innholdet kan scrolles. Det må eventuelt settes (max)bredde og (max)høyde styling på både denne subkomponenten og `<Modal />`. */
|
|
10
13
|
scrollable?: boolean | undefined;
|
|
14
|
+
/**Høyde på container. */
|
|
15
|
+
height?: Property.Height<0 | (string & {})> | undefined;
|
|
11
16
|
} & {
|
|
12
17
|
children?: import("react").ReactNode;
|
|
13
18
|
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BaseComponentPropsWithChildren } from '../../types';
|
|
2
|
+
import { Property } from 'csstype';
|
|
3
|
+
export declare type ScrollableContainerProps = BaseComponentPropsWithChildren<HTMLDivElement, {
|
|
4
|
+
/**Høyde på innholdscontainer. */
|
|
5
|
+
contentHeight?: Property.Height;
|
|
6
|
+
}>;
|
|
7
|
+
export declare const ScrollableContainer: (props: ScrollableContainerProps) => JSX.Element;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ScrollableContainerProps } from '.';
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: (props: ScrollableContainerProps) => JSX.Element;
|
|
5
|
+
argTypes: {
|
|
6
|
+
contentHeight: {
|
|
7
|
+
control: {
|
|
8
|
+
type: string;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default _default;
|
|
14
|
+
export declare const Default: (args: ScrollableContainerProps) => JSX.Element;
|
|
15
|
+
export declare const JustScrollbar: () => JSX.Element;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export declare const scrollbarWidthNumberPx = 10;
|
|
2
|
+
export declare const scrollbarTokens: {
|
|
3
|
+
minThumbHeightPx: number;
|
|
4
|
+
track: {
|
|
5
|
+
backgroundColor: string;
|
|
6
|
+
borderRadius: string;
|
|
7
|
+
width: string;
|
|
8
|
+
};
|
|
9
|
+
thumb: {
|
|
10
|
+
base: {
|
|
11
|
+
backgroundColor: string;
|
|
12
|
+
borderRadius: string;
|
|
13
|
+
width: string;
|
|
14
|
+
};
|
|
15
|
+
hover: {
|
|
16
|
+
backgroundColor: string;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
content: {
|
|
20
|
+
paddingRight: string;
|
|
21
|
+
};
|
|
22
|
+
outerContainer: {
|
|
23
|
+
padding: string;
|
|
24
|
+
};
|
|
25
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { RefObject } from 'react';
|
|
2
|
+
import { BaseComponentProps } from '../../types';
|
|
3
|
+
export declare type ScrollbarProps = BaseComponentProps<HTMLDivElement, {
|
|
4
|
+
/** Ref til container med innholdet som skal scrolles. */
|
|
5
|
+
contentRef?: RefObject<HTMLDivElement>;
|
|
6
|
+
}>;
|
|
7
|
+
export declare const Scrollbar: (props: ScrollbarProps) => JSX.Element | null;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* CSS-in-JS scrollbar styling til bruk der det ikke passer å bruke dedikerte komponenter. Inkluderer styling for webkit pseudo-elementer og for Firefox.
|
|
3
|
+
*/
|
|
4
|
+
export declare const scrollbarStyling: {
|
|
5
|
+
webkit: {
|
|
6
|
+
'&::-webkit-scrollbar': {
|
|
7
|
+
width: string;
|
|
8
|
+
height: string;
|
|
9
|
+
};
|
|
10
|
+
'&::-webkit-scrollbar-track': {
|
|
11
|
+
background: string;
|
|
12
|
+
borderRadius: string;
|
|
13
|
+
};
|
|
14
|
+
'&::-webkit-scrollbar-thumb': {
|
|
15
|
+
background: string;
|
|
16
|
+
borderRadius: string;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
'&::-webkit-scrollbar-thumb:hover': {
|
|
20
|
+
background: string;
|
|
21
|
+
};
|
|
22
|
+
firefox: {
|
|
23
|
+
scrollbarColor: string;
|
|
24
|
+
scrollbarWidth: string;
|
|
25
|
+
};
|
|
26
|
+
};
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -33,5 +33,6 @@ export * from './components/Tabs';
|
|
|
33
33
|
export * from './components/Tag';
|
|
34
34
|
export * from './components/Chip';
|
|
35
35
|
export * from './components/VisuallyHidden';
|
|
36
|
+
export * from './components/ScrollableContainer';
|
|
36
37
|
export * from './icons/tsx';
|
|
37
38
|
export * from './components/Stepper';
|