@digdir/designsystemet-react 0.52.0-alpha.0

package/dist/esm/utilities/AnimateHeight/AnimateHeight.js

@@ -0,0 +1,42 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useRef, useCallback } from 'react';
+import { clsx } from '../../node_modules/clsx/dist/clsx.js';
+import classes from './AnimateHeight.module.css.js';
+import { usePrevious } from '../../hooks/usePrevious.js';
+import { useMediaQuery } from '../../hooks/useMediaQuery.js';
+
+const transitionDurationInMilliseconds = 250;
+/**
+ * AnimateHeight is a component that animates its height when the `open` prop changes.
+ */
+const AnimateHeight = ({ children, className, open = false, style, ...rest }) => {
+    const [height, setHeight] = useState(0);
+    const prevOpen = usePrevious(open);
+    const openOrClosed = open ? 'open' : 'closed';
+    const [state, setState] = useState(openOrClosed);
+    const timeoutRef = useRef(null);
+    const shouldAnimate = !useMediaQuery('(prefers-reduced-motion)');
+    const contentRef = useCallback((node) => {
+        if (node) {
+            const resizeObserver = new ResizeObserver(() => {
+                setHeight(open ? node.getBoundingClientRect().height : 0);
+            });
+            resizeObserver.observe(node);
+        }
+        if (prevOpen !== undefined && prevOpen !== open) {
+            // Opening or closing
+            setState(shouldAnimate ? 'openingOrClosing' : openOrClosed);
+            timeoutRef.current && clearTimeout(timeoutRef.current); // Reset timeout if already active (i.e. if the user closes the component before it finishes opening)
+            timeoutRef.current = setTimeout(() => {
+                setState(openOrClosed);
+            }, transitionDurationInMilliseconds);
+        }
+    }, [open, openOrClosed, prevOpen, shouldAnimate]);
+    const transition = state === 'openingOrClosing'
+        ? `height ${transitionDurationInMilliseconds}ms ease-in-out`
+        : undefined;
+    return (jsx("div", { ...rest, className: clsx(classes.root, classes[state], className), style: { height, transition, ...style }, children: jsx("div", { ref: contentRef, className: classes.content, children: children }) }));
+};
+
+export { AnimateHeight };

package/dist/esm/utilities/AnimateHeight/AnimateHeight.module.css.js

@@ -0,0 +1,4 @@
+'use client';
+var classes = {"root":"fds-animateheight-root-e875993d","openingOrClosing":"fds-animateheight-openingOrClosing-e875993d","closed":"fds-animateheight-closed-e875993d","open":"fds-animateheight-open-e875993d","content":"fds-animateheight-content-e875993d"};
+
+export { classes as default };

package/dist/esm/utilities/RovingTabIndex/RovingTabindexItem.js

@@ -0,0 +1,40 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
+import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
+import { useRovingTabindex } from './useRovingTabindex.js';
+
+/** Get the next focusable RovingTabindexItem */
+function getNextFocusableValue(items, value) {
+    const currIndex = items.findIndex((item) => item.value === value);
+    return items.at(currIndex === items.length - 1 ? 0 : currIndex + 1);
+}
+/** Get the previous focusable RovingTabindexItem */
+function getPrevFocusableValue(items, value) {
+    const currIndex = items.findIndex((item) => item.value === value);
+    return items.at(currIndex === 0 ? -1 : currIndex - 1);
+}
+const RovingTabindexItem = forwardRef(({ value, as = 'div', asChild, ...rest }, ref) => {
+    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : as;
+    const focusValue = value ?? (typeof rest.children == 'string' ? rest.children : '');
+    const { getOrderedItems, getRovingProps } = useRovingTabindex(focusValue);
+    const rovingProps = getRovingProps({
+        onKeyDown: (e) => {
+            rest?.onKeyDown?.(e);
+            const items = getOrderedItems();
+            let nextItem;
+            if (e.key === 'ArrowRight') {
+                nextItem = getNextFocusableValue(items, focusValue);
+            }
+            if (e.key === 'ArrowLeft') {
+                nextItem = getPrevFocusableValue(items, focusValue);
+            }
+            nextItem?.element.focus();
+        },
+    });
+    const mergedRefs = useMergeRefs([ref, rovingProps.ref]);
+    return (jsx(Component, { ...rest, ...rovingProps, ref: mergedRefs, children: rest.children }));
+});
+
+export { RovingTabindexItem, getNextFocusableValue, getPrevFocusableValue };

package/dist/esm/utilities/RovingTabIndex/RovingTabindexRoot.js

@@ -0,0 +1,63 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useState, useRef } from 'react';
+import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
+import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
+
+const RovingTabindexContext = createContext({
+    elements: { current: new Map() },
+    getOrderedItems: () => [],
+    setFocusableValue: () => {
+        /* intentionally empty */
+    },
+    onShiftTab: () => {
+        /* intentionally empty */
+    },
+    focusableValue: null,
+});
+const RovingTabindexRoot = forwardRef(({ valueId, as = 'div', asChild, onBlur, onFocus, ...rest }, ref) => {
+    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : as;
+    const [focusableValue, setFocusableValue] = useState(null);
+    const [isShiftTabbing, setIsShiftTabbing] = useState(false);
+    const elements = useRef(new Map());
+    const myRef = useRef();
+    const refs = useMergeRefs([ref, myRef]);
+    const getOrderedItems = () => {
+        if (!myRef.current)
+            return [];
+        const elementsFromDOM = Array.from(myRef.current.querySelectorAll('[data-roving-tabindex-item]'));
+        return Array.from(elements.current)
+            .sort((a, b) => elementsFromDOM.indexOf(a[1]) - elementsFromDOM.indexOf(b[1]))
+            .map(([value, element]) => ({ value, element }));
+    };
+    return (jsx(RovingTabindexContext.Provider, { value: {
+            elements,
+            getOrderedItems,
+            focusableValue,
+            setFocusableValue,
+            onShiftTab: () => {
+                setIsShiftTabbing(true);
+            },
+        }, children: jsx(Component, { ...rest, tabIndex: isShiftTabbing ? -1 : 0, onBlur: (e) => {
+                onBlur?.(e);
+                setIsShiftTabbing(false);
+            }, onFocus: (e) => {
+                onFocus?.(e);
+                if (e.target !== e.currentTarget)
+                    return;
+                const orderedItems = getOrderedItems();
+                if (orderedItems.length === 0)
+                    return;
+                if (focusableValue != null) {
+                    elements.current.get(focusableValue)?.focus();
+                }
+                else if (valueId != null) {
+                    elements.current.get(valueId)?.focus();
+                }
+                else {
+                    orderedItems.at(0)?.element.focus();
+                }
+            }, ref: refs }) }));
+});
+
+export { RovingTabindexContext, RovingTabindexRoot };

package/dist/esm/utilities/RovingTabIndex/useRovingTabindex.js

@@ -0,0 +1,40 @@
+'use client';
+import { useContext } from 'react';
+import { RovingTabindexContext } from './RovingTabindexRoot.js';
+
+// Logic from: https://www.joshuawootonn.com/react-roving-tabindex
+// Inspired by: https://github.com/radix-ui/primitives/tree/main/packages/react/roving-focus/src
+/** Handles props for `RovingTabIndex` in context with `RovingTabIndexRoot` */
+const useRovingTabindex = (value) => {
+    const { elements, getOrderedItems, setFocusableValue, focusableValue, onShiftTab, } = useContext(RovingTabindexContext);
+    return {
+        getOrderedItems,
+        isFocusable: focusableValue === value,
+        getRovingProps: (props) => ({
+            ...props,
+            ref: (element) => {
+                if (element) {
+                    elements.current.set(value, element);
+                }
+                else {
+                    elements.current.delete(value);
+                }
+            },
+            onKeyDown: (e) => {
+                props?.onKeyDown?.(e);
+                if (e.shiftKey && e.key === 'Tab') {
+                    onShiftTab();
+                    return;
+                }
+            },
+            onFocus: (e) => {
+                props?.onFocus?.(e);
+                setFocusableValue(value);
+            },
+            ['data-roving-tabindex-item']: true,
+            tabIndex: focusableValue === value ? 0 : -1,
+        }),
+    };
+};
+
+export { useRovingTabindex };

package/dist/esm/utilities/objectUtils.js

@@ -0,0 +1,26 @@
+'use client';
+/**
+ * Returns a partial copy of an object omitting the keys specified.
+ * @param {Array} names an array of String property names to omit from the new object
+ * @param {Object} obj The object to copy from
+ * @return {Object} A new object with properties from `names` not on it.
+ * @example omit(['a', 'd'], {a: 1, b: 2, c: 3, d: 4}); //=> {b: 2, c: 3}
+ */
+const omit = (names, obj) => {
+    const result = {};
+    const index = {};
+    let idx = 0;
+    const len = names.length;
+    while (idx < len) {
+        index[names[idx]] = 1;
+        idx += 1;
+    }
+    for (const prop in obj) {
+        if (!Object.prototype.hasOwnProperty.call(index, prop)) {
+            result[prop] = obj[prop];
+        }
+    }
+    return result;
+};
+
+export { omit };

package/dist/esm/utilities/useDebounce.js

@@ -0,0 +1,25 @@
+'use client';
+import { useRef, useEffect } from 'react';
+
+function useDebounce(callback, delay = 50) {
+    const timeoutRef = useRef(null);
+    useEffect(() => {
+        // Cleanup the previous timeout on re-render
+        return () => {
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+        };
+    }, []);
+    const debouncedCallback = (...args) => {
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+        }
+        timeoutRef.current = setTimeout(() => {
+            callback(...args);
+        }, delay);
+    };
+    return debouncedCallback;
+}
+
+export { useDebounce as default };

package/dist/esm/utilities/utility.module.css.js

@@ -0,0 +1,4 @@
+'use client';
+var utilityClasses = {"visuallyHidden":"fds-utility-visuallyHidden-1bd8d932","focusable":"fds-utility-focusable-1bd8d932"};
+
+export { utilityClasses as default };

package/dist/types/components/Accordion/Accordion.d.ts

@@ -0,0 +1,18 @@
+import type { ReactNode, HTMLAttributes } from 'react';
+export type AccordionProps = {
+    /** Accordion background color */
+    color?: 'first' | 'second' | 'third' | 'neutral' | 'subtle';
+    /** Show border */
+    border?: boolean;
+    /** Instances of `Accordion.Item` */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const Accordion: import("react").ForwardRefExoticComponent<{
+    /** Accordion background color */
+    color?: "first" | "second" | "third" | "neutral" | "subtle" | undefined;
+    /** Show border */
+    border?: boolean | undefined;
+    /** Instances of `Accordion.Item` */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/types/components/Accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAMvD,MAAM,MAAM,cAAc,GAAG;IAC3B,iCAAiC;IACjC,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC5D,kBAAkB;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,SAAS;IARpB,iCAAiC;;IAEjC,kBAAkB;;IAElB,oCAAoC;cAC1B,SAAS;mFAkBpB,CAAC"}

package/dist/types/components/Accordion/AccordionContent/AccordionContent.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode, HTMLAttributes } from 'react';
+export type AccordionContentProps = {
+    /** Content inside `Accordion.Content`*/
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const AccordionContent: import("react").ForwardRefExoticComponent<{
+    /** Content inside `Accordion.Content`*/
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=AccordionContent.d.ts.map

package/dist/types/components/Accordion/AccordionContent/AccordionContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionContent/AccordionContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQvD,MAAM,MAAM,qBAAqB,GAAG;IAClC,wCAAwC;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,gBAAgB;IAJ3B,wCAAwC;cAC9B,SAAS;mFAmCnB,CAAC"}

package/dist/types/components/Accordion/AccordionContent/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AccordionContent';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/AccordionContent/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionContent/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}

package/dist/types/components/Accordion/AccordionHeader/AccordionHeader.d.ts

@@ -0,0 +1,18 @@
+import type { ReactNode, MouseEventHandler, HTMLAttributes } from 'react';
+export type AccordionHeaderProps = {
+    /** Heading level. Use this to make sure the heading is correct according to you page heading levels */
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Handle when clicked on header */
+    onHeaderClick?: MouseEventHandler<HTMLButtonElement> | undefined;
+    /** Heading text */
+    children: ReactNode;
+} & HTMLAttributes<HTMLHeadingElement>;
+export declare const AccordionHeader: import("react").ForwardRefExoticComponent<{
+    /** Heading level. Use this to make sure the heading is correct according to you page heading levels */
+    level?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    /** Handle when clicked on header */
+    onHeaderClick?: MouseEventHandler<HTMLButtonElement> | undefined;
+    /** Heading text */
+    children: ReactNode;
+} & HTMLAttributes<HTMLHeadingElement> & import("react").RefAttributes<HTMLHeadingElement>>;
+//# sourceMappingURL=AccordionHeader.d.ts.map

package/dist/types/components/Accordion/AccordionHeader/AccordionHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionHeader/AccordionHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ1E,MAAM,MAAM,oBAAoB,GAAG;IACjC,uGAAuG;IACvG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC9B,oCAAoC;IACpC,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC;IACjE,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEvC,eAAO,MAAM,eAAe;IAR1B,uGAAuG;;IAEvG,oCAAoC;oBACpB,kBAAkB,iBAAiB,CAAC,GAAG,SAAS;IAChE,mBAAmB;cACT,SAAS;2FAiDnB,CAAC"}

package/dist/types/components/Accordion/AccordionHeader/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AccordionHeader';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/AccordionHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionHeader/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/types/components/Accordion/AccordionItem/AccordionItem.d.ts

@@ -0,0 +1,32 @@
+import type { ReactNode, HTMLAttributes } from 'react';
+export type AccordionItemProps = {
+    /**
+     * Controls open-state.
+     *
+     * Using this removes automatic control of open-state
+     */
+    open?: boolean;
+    /**  Defaults the accordion to open if not controlled */
+    defaultOpen?: boolean;
+    /** Content should be one `<Accordion.Header>` and `<Accordion.Content>` */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+export type AccordionItemContextProps = {
+    open: boolean;
+    toggleOpen: () => void;
+    contentId: string;
+};
+export declare const AccordionItemContext: import("react").Context<AccordionItemContextProps | null>;
+export declare const AccordionItem: import("react").ForwardRefExoticComponent<{
+    /**
+     * Controls open-state.
+     *
+     * Using this removes automatic control of open-state
+     */
+    open?: boolean | undefined;
+    /**  Defaults the accordion to open if not controlled */
+    defaultOpen?: boolean | undefined;
+    /** Content should be one `<Accordion.Header>` and `<Accordion.Content>` */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=AccordionItem.d.ts.map

package/dist/types/components/Accordion/AccordionItem/AccordionItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionItem/AccordionItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAKvD,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,wDAAwD;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2EAA2E;IAC3E,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,yBAAyB,GAAG;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,oBAAoB,2DACsB,CAAC;AAExD,eAAO,MAAM,aAAa;IArBxB;;;;OAIG;;IAEH,wDAAwD;;IAExD,2EAA2E;cACjE,SAAS;mFA6CpB,CAAC"}

package/dist/types/components/Accordion/AccordionItem/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AccordionItem';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/AccordionItem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Accordion/AccordionItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/types/components/Accordion/index.d.ts

@@ -0,0 +1,17 @@
+import type { AccordionProps } from './Accordion';
+import type { AccordionItemProps } from './AccordionItem';
+import type { AccordionContentProps } from './AccordionContent';
+import type { AccordionHeaderProps } from './AccordionHeader';
+import { Accordion as AccordionParent } from './Accordion';
+import { AccordionItem } from './AccordionItem';
+import { AccordionContent } from './AccordionContent';
+import { AccordionHeader } from './AccordionHeader';
+type AccordionComponent = typeof AccordionParent & {
+    Item: typeof AccordionItem;
+    Header: typeof AccordionHeader;
+    Content: typeof AccordionContent;
+};
+declare const Accordion: AccordionComponent;
+export type { AccordionProps, AccordionContentProps, AccordionHeaderProps, AccordionItemProps, };
+export { Accordion, AccordionItem, AccordionContent, AccordionHeader };
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,SAAS,IAAI,eAAe,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,KAAK,kBAAkB,GAAG,OAAO,eAAe,GAAG;IACjD,IAAI,EAAE,OAAO,aAAa,CAAC;IAC3B,MAAM,EAAE,OAAO,eAAe,CAAC;IAC/B,OAAO,EAAE,OAAO,gBAAgB,CAAC;CAClC,CAAC;AAEF,QAAA,MAAM,SAAS,oBAAwC,CAAC;AAUxD,YAAY,EACV,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,kBAAkB,GACnB,CAAC;AACF,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,eAAe,EAAE,CAAC"}

package/dist/types/components/Alert/Alert.d.ts

@@ -0,0 +1,26 @@
+import type { HTMLAttributes } from 'react';
+type Severity = 'info' | 'warning' | 'success' | 'danger';
+export type AlertProps = {
+    /** Sets color & icon according to severity */
+    severity?: Severity;
+    /** Adds a shadow to elevate the component */
+    elevated?: boolean;
+    /** Sets `title` on the icon.
+     *
+     * Use this to inform screenreaders of severity.
+     *  Defaults to Norwegian. */
+    iconTitle?: string;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const Alert: import("react").ForwardRefExoticComponent<{
+    /** Sets color & icon according to severity */
+    severity?: Severity | undefined;
+    /** Adds a shadow to elevate the component */
+    elevated?: boolean | undefined;
+    /** Sets `title` on the icon.
+     *
+     * Use this to inform screenreaders of severity.
+     *  Defaults to Norwegian. */
+    iconTitle?: string | undefined;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=Alert.d.ts.map

package/dist/types/components/Alert/Alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AA4B5C,KAAK,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE1D,MAAM,MAAM,UAAU,GAAG;IACvB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;iCAG6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,KAAK;IAXhB,8CAA8C;;IAE9C,6CAA6C;;IAE7C;;;iCAG6B;;mFAqC9B,CAAC"}

package/dist/types/components/Alert/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Alert';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Alert/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/dist/types/components/Box/Box.d.ts

@@ -0,0 +1,31 @@
+import type { HTMLAttributes } from 'react';
+import type { OverridableComponent } from '../../types/OverridableComponent';
+export type BoxProps = {
+    /**
+     * Shadow size of the box
+     * @default undefined
+     */
+    shadow?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    /**
+     * Border color of the box
+     * @default undefined
+     */
+    borderColor?: 'default' | 'subtle' | 'strong';
+    /**
+     * Border radius of the box
+     * @default undefined
+     */
+    borderRadius?: 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge' | 'full';
+    /**
+     * Background color of the box
+     * @default 'default'
+     */
+    background?: 'default' | 'subtle';
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const Box: OverridableComponent<BoxProps, HTMLDivElement>;
+//# sourceMappingURL=Box.d.ts.map

package/dist/types/components/Box/Box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../src/components/Box/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AAI7E,MAAM,MAAM,QAAQ,GAAG;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IAC5D;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC9C;;;OAGG;IACH,YAAY,CAAC,EACT,OAAO,GACP,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,SAAS,GACT,UAAU,GACV,WAAW,GACX,MAAM,CAAC;IACX;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,GAAG,EAAE,oBAAoB,CAAC,QAAQ,EAAE,cAAc,CAiC9D,CAAC"}

package/dist/types/components/Box/index.d.ts

@@ -0,0 +1,3 @@
+export { Box } from './Box';
+export type { BoxProps } from './Box';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Box/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC"}

package/dist/types/components/Button/Button.d.ts

@@ -0,0 +1,26 @@
+import type { ButtonHTMLAttributes } from 'react';
+import type { OverridableComponent } from '../../types/OverridableComponent';
+export type ButtonProps = {
+    /** Specify which variant to use */
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    /** Specify which color palette to use */
+    color?: 'first' | 'second' | 'success' | 'danger' | 'inverted';
+    /** Size */
+    size?: 'small' | 'medium' | 'large';
+    /** If `Button` should fill full width of its container */
+    fullWidth?: boolean;
+    /** Toggle icon only styling, pass icon as children
+     * @default false
+     */
+    icon?: boolean;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & ButtonHTMLAttributes<HTMLButtonElement>;
+/**
+ * Button used for interaction
+ */
+export declare const Button: OverridableComponent<ButtonProps, HTMLButtonElement>;
+//# sourceMappingURL=Button.d.ts.map

package/dist/types/components/Button/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAKlD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AAI7E,MAAM,MAAM,WAAW,GAAG;IACxB,mCAAmC;IACnC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IAC/C,yCAAyC;IACzC,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC/D,WAAW;IACX,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAE5C;;GAEG;AACH,eAAO,MAAM,MAAM,EAAE,oBAAoB,CAAC,WAAW,EAAE,iBAAiB,CAwCrE,CAAC"}

package/dist/types/components/Button/index.d.ts

@@ -0,0 +1,3 @@
+export { Button } from './Button';
+export type { ButtonProps } from './Button';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/types/components/Card/Card.d.ts

@@ -0,0 +1,27 @@
+import type { ReactNode, HTMLAttributes } from 'react';
+import type { OverridableComponent } from '../../types/OverridableComponent';
+export type CardProps = {
+    /**
+     * Changes background & border color
+     * @default neutral
+     */
+    color?: 'neutral' | 'subtle' | 'first' | 'second' | 'third';
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Changes styling if card is used as a link
+     * @default false
+     */
+    isLink?: boolean;
+    /** Instances of `Card.Header`, `Card.Content`, `Card.Footer` or other React nodes like `Divider` */
+    children: ReactNode;
+    /**
+     * @deprecated Use `asChild` and `isLink={true}` instead
+     */
+    href?: never;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const Card: OverridableComponent<CardProps, HTMLDivElement>;
+//# sourceMappingURL=Card.d.ts.map

package/dist/types/components/Card/Card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAKvD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AAK7E,MAAM,MAAM,SAAS,GAAG;IACtB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oGAAoG;IACpG,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC;CACd,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,IAAI,EAAE,oBAAoB,CAAC,SAAS,EAAE,cAAc,CA4BhE,CAAC"}

package/dist/types/components/Card/CardContent.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes } from 'react';
+export type CardContentProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const CardContent: import("react").ForwardRefExoticComponent<{
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean | undefined;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CardContent.d.ts.map

package/dist/types/components/Card/CardContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAO5C,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,WAAW;IAPtB;;;OAGG;;mFAgBJ,CAAC"}

package/dist/types/components/Card/CardFooter.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes } from 'react';
+export type CardFooterProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const CardFooter: import("react").ForwardRefExoticComponent<{
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean | undefined;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CardFooter.d.ts.map

package/dist/types/components/Card/CardFooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAO5C,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,UAAU;IAPrB;;;OAGG;;mFAgBJ,CAAC"}

package/dist/types/components/Card/CardHeader.d.ts

@@ -0,0 +1,16 @@
+import type { HTMLAttributes } from 'react';
+export type CardHeaderProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const CardHeader: import("react").ForwardRefExoticComponent<{
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean | undefined;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CardHeader.d.ts.map

package/dist/types/components/Card/CardHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAO5C,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,eAAO,MAAM,UAAU;IAPrB;;;OAGG;;mFAgBJ,CAAC"}