@norges-domstoler/dds-components 5.2.0-beta.0 → 5.2.0

package/dist/assets/svg/calendar_today.svg.js

@@ -1,4 +1,4 @@
-var img = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='rgba(58%2c65%2c70%2c1)'%3e%3cpath d='M0 0h24v24H0V0z' fill='none'/%3e%3cpath d='M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V10h16v11zm0-13H4V5h16v3z'/%3e%3c/svg%3e";
+var img = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px'%3e%3cpath d='M0 0h24v24H0V0z' fill='none'/%3e%3cpath d='M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V10h16v11zm0-13H4V5h16v3z' fill='%233a4146' /%3e%3c/svg%3e";
   var CalendarIcon = img;
 
 export { CalendarIcon as default };

package/dist/cjs/components/DescriptionList/DescriptionList.tokens.d.ts

@@ -0,0 +1,70 @@
+export declare const descriptionListTokens: {
+    term: {
+        appearance: {
+            small: {
+                font: {
+                    lineHeight: any;
+                    fontSize: string;
+                    letterSpacing: any;
+                    fontFamily: any;
+                    fontWeight: any;
+                    fontStyle: any;
+                };
+                color: string;
+                lineHeight: any;
+                fontSize: string;
+                letterSpacing: any;
+                fontFamily: any;
+                fontWeight: any;
+                fontStyle: any;
+            };
+            bold: {
+                font: {
+                    lineHeight: any;
+                    fontSize: string;
+                    letterSpacing: any;
+                    fontFamily: any;
+                    fontWeight: any;
+                    fontStyle: any;
+                };
+                lineHeight: any;
+                fontSize: string;
+                letterSpacing: any;
+                fontFamily: any;
+                fontWeight: number;
+                fontStyle: any;
+                color: string;
+            };
+        };
+        firstOfType: {
+            marginTop: string;
+        };
+    };
+    desc: {
+        base: {
+            font: {
+                lineHeight: any;
+                fontSize: string;
+                letterSpacing: any;
+                fontFamily: any;
+                fontWeight: any;
+                fontStyle: any;
+            };
+            gap: string;
+            color: string;
+        };
+        lastChild: {
+            marginBottom: string;
+        };
+    };
+    list: {
+        beforeNextTerm: {
+            marginTop: string;
+        };
+    };
+    group: {
+        base: {
+            margin: string;
+        };
+    };
+};

package/dist/cjs/components/Drawer/DrawerGroup.d.ts

@@ -9,5 +9,5 @@ declare type DrawerGroupProps = {
     /**Ekstra logikk som kjøres når `<Drawer />` lukkes. */
     onClose?: () => void;
 };
-export declare const DrawerGroup: ({ children, drawerId, onOpen, onClose }: DrawerGroupProps) => JSX.Element;
+export declare const DrawerGroup: ({ children, drawerId, onOpen, onClose, }: DrawerGroupProps) => JSX.Element;
 export {};

package/dist/cjs/components/Modal/Modal.tokens.d.ts

@@ -10,10 +10,4 @@ export declare const modalTokens: {
     actionsContainer: {
         base: CSSObject;
     };
-    bodyScrollable: {
-        base: CSSObject;
-        focus: {
-            base: CSSObject;
-        };
-    };
 };

package/dist/cjs/components/Modal/ModalBody.d.ts

@@ -1,13 +1,18 @@
 import { BaseComponentPropsWithChildren } from '../../types';
+import { Property } from 'csstype';
 export declare type ModalBodyProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Gjør at innholdet kan scrolles. Det må eventuelt settes (max)bredde og (max)høyde styling på både denne subkomponenten og `<Modal />`.  */
     scrollable?: boolean;
+    /**Høyde på container. */
+    height?: Property.Height;
 }>;
 export declare const ModalBody: import("react").ForwardRefExoticComponent<{
     htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Gjør at innholdet kan scrolles. Det må eventuelt settes (max)bredde og (max)høyde styling på både denne subkomponenten og `<Modal />`.  */
     scrollable?: boolean | undefined;
+    /**Høyde på container. */
+    height?: Property.Height<0 | (string & {})> | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/OverflowMenu/OverflowMenuGroup.d.ts

@@ -11,4 +11,4 @@ export declare type OverflowMenuGroupProps = {
     /**Custom id for `<OverflowMenu />`. */
     overflowMenuId?: string;
 };
-export declare const OverflowMenuGroup: ({ children, onClose, onToggle, onOpen, overflowMenuId }: OverflowMenuGroupProps) => JSX.Element;
+export declare const OverflowMenuGroup: ({ children, onClose, onToggle, onOpen, overflowMenuId, }: OverflowMenuGroupProps) => JSX.Element;

package/dist/cjs/components/Popover/PopoverGroup.d.ts

@@ -11,4 +11,4 @@ export declare type PopoverGroupProps = {
     /** Barna til wrapperen: anchor-element som det første og `<Popover />` so det adnre.  */
     children: ReactNode;
 };
-export declare const PopoverGroup: ({ isOpen, onCloseButtonClick, onTriggerClick, children, popoverId }: PopoverGroupProps) => JSX.Element;
+export declare const PopoverGroup: ({ isOpen, onCloseButtonClick, onTriggerClick, children, popoverId, }: PopoverGroupProps) => JSX.Element;

package/dist/cjs/components/RadioButton/RadioButton.d.ts

@@ -12,4 +12,6 @@ export declare const RadioButton: import("react").ForwardRefExoticComponent<{
     required?: boolean | undefined;
     onChange?: import("react").ChangeEventHandler<HTMLInputElement> | undefined;
     'aria-describedby'?: string | undefined;
+} & {
+    children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/components/RadioButton/RadioButton.stories.d.ts

@@ -15,6 +15,8 @@ declare const _default: {
         checked?: boolean | undefined;
         readOnly?: boolean | undefined;
         required?: boolean | undefined;
+    } & {
+        children?: import("react").ReactNode;
     } & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         label: {

package/dist/cjs/components/RadioButton/RadioButton.types.d.ts

@@ -1,7 +1,7 @@
 import { InputHTMLAttributes } from 'react';
-import { BaseComponentProps } from '../../types';
+import { BaseComponentPropsWithChildren } from '../../types';
 declare type PickedInputHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'name' | 'readOnly' | 'checked' | 'value' | 'required' | 'onChange' | 'aria-describedby'>;
-export declare type RadioButtonProps = BaseComponentProps<HTMLInputElement, {
+export declare type RadioButtonProps = BaseComponentPropsWithChildren<HTMLInputElement, {
     /**Ledetekst for alternativet. */
     label?: string;
     /**Spesifiserer om input er disabled. */

package/dist/cjs/components/ScrollableContainer/ScrollableContainer.d.ts

@@ -0,0 +1,7 @@
+import { BaseComponentPropsWithChildren } from '../../types';
+import { Property } from 'csstype';
+export declare type ScrollableContainerProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+    /**Høyde på innholdscontainer. */
+    contentHeight?: Property.Height;
+}>;
+export declare const ScrollableContainer: (props: ScrollableContainerProps) => JSX.Element;

package/dist/cjs/components/ScrollableContainer/ScrollableContainer.stories.d.ts

@@ -0,0 +1,15 @@
+import { ScrollableContainerProps } from '.';
+declare const _default: {
+    title: string;
+    component: (props: ScrollableContainerProps) => JSX.Element;
+    argTypes: {
+        contentHeight: {
+            control: {
+                type: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Default: (args: ScrollableContainerProps) => JSX.Element;
+export declare const JustScrollbar: () => JSX.Element;

package/dist/cjs/components/ScrollableContainer/ScrollableContainer.tokens.d.ts

@@ -0,0 +1,25 @@
+export declare const scrollbarWidthNumberPx = 10;
+export declare const scrollbarTokens: {
+    minThumbHeightPx: number;
+    track: {
+        backgroundColor: string;
+        borderRadius: string;
+        width: string;
+    };
+    thumb: {
+        base: {
+            backgroundColor: string;
+            borderRadius: string;
+            width: string;
+        };
+        hover: {
+            backgroundColor: string;
+        };
+    };
+    content: {
+        paddingRight: string;
+    };
+    outerContainer: {
+        padding: string;
+    };
+};

package/dist/cjs/components/ScrollableContainer/Scrollbar.d.ts

@@ -0,0 +1,7 @@
+import { RefObject } from 'react';
+import { BaseComponentProps } from '../../types';
+export declare type ScrollbarProps = BaseComponentProps<HTMLDivElement, {
+    /** Ref til container med innholdet som skal scrolles. */
+    contentRef?: RefObject<HTMLDivElement>;
+}>;
+export declare const Scrollbar: (props: ScrollbarProps) => JSX.Element | null;

package/dist/cjs/components/ScrollableContainer/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Scrollbar';
+export * from './ScrollableContainer';
+export * from './scrollbarStyling';

package/dist/cjs/components/ScrollableContainer/scrollbarStyling.d.ts

@@ -0,0 +1,26 @@
+/**
+ * CSS-in-JS scrollbar styling til bruk der det ikke passer å bruke dedikerte komponenter. Inkluderer styling for webkit pseudo-elementer og for Firefox.
+ */
+export declare const scrollbarStyling: {
+    webkit: {
+        '&::-webkit-scrollbar': {
+            width: string;
+            height: string;
+        };
+        '&::-webkit-scrollbar-track': {
+            background: string;
+            borderRadius: string;
+        };
+        '&::-webkit-scrollbar-thumb': {
+            background: string;
+            borderRadius: string;
+        };
+    };
+    '&::-webkit-scrollbar-thumb:hover': {
+        background: string;
+    };
+    firefox: {
+        scrollbarColor: string;
+        scrollbarWidth: string;
+    };
+};

package/dist/cjs/helpers/Chevron/AnimatedChevronUpDown.d.ts

@@ -4,5 +4,5 @@ declare type SvgChevronProps = {
     height?: Property.Height<string>;
     width?: Property.Width<string>;
 };
-export declare const AnimatedChevronUpDown: ({ isUp, height, width }: SvgChevronProps) => JSX.Element;
+export declare const AnimatedChevronUpDown: ({ isUp, height, width, }: SvgChevronProps) => JSX.Element;
 export {};

package/dist/cjs/helpers/styling/index.d.ts

@@ -5,4 +5,3 @@ export * from './hover';
 export * from './focus';
 export * from './danger';
 export * from './hideInput';
-export * from './scrollbarStyling';

package/dist/cjs/hooks/useRoveFocus.d.ts

@@ -1,3 +1,4 @@
-import { Dispatch, SetStateAction } from 'react';
+import { Dispatch, SetStateAction, KeyboardEvent } from 'react';
 import { Direction } from '../types';
+export declare const isKeyboardEvent: (e: Event | KeyboardEvent<Element>) => e is KeyboardEvent<Element>;
 export declare function useRoveFocus(size: number | undefined, reset?: boolean, direction?: Direction): [number, Dispatch<SetStateAction<number>>];

package/dist/cjs/index.d.ts

@@ -33,5 +33,6 @@ export * from './components/Tabs';
 export * from './components/Tag';
 export * from './components/Chip';
 export * from './components/VisuallyHidden';
+export * from './components/ScrollableContainer';
 export * from './icons/tsx';
 export * from './components/Stepper';