@digdir/designsystemet-react 1.0.0-rc.8 → 1.0.0

package/dist/esm/components/Modal/ModalDialog.js

@@ -1,71 +0,0 @@
-'use client';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import { useFloating, useMergeRefs, FloatingFocusManager } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
-import { forwardRef, useRef, useContext, useEffect } from 'react';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { useScrollLock } from './useScrollLock.js';
-import { useModalState } from './useModalState.js';
-import { ModalContext } from './ModalRoot.js';
-
-const ModalDialog = forwardRef(({ onInteractOutside, onClose, onBeforeClose, asChild, className, children, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'dialog';
-    // This local ref is used to make sure the modal works without a ModalRoot
-    const modalDialogRef = useRef(null);
-    const { context } = useFloating();
-    const modal = useContext(ModalContext);
-    const open = useModalState(modalDialogRef);
-    const { modalRef, setOpen } = modal;
-    modal.closeModal = () => {
-        if (onBeforeClose && onBeforeClose() === false)
-            return;
-        modalDialogRef.current?.close();
-    };
-    const mergedRefs = useMergeRefs([modalRef, ref, modalDialogRef]);
-    useScrollLock(modalDialogRef, 'ds-modal--lock-scroll');
-    useEffect(() => {
-        setOpen(open);
-    }, [open, setOpen]);
-    useEffect(() => {
-        const modalEl = modalRef.current;
-        const handleBackdropClick = (e) => {
-            if (e.target === modalEl && onInteractOutside) {
-                // Fix bug where if you select text spanning two divs it thinks you clicked outside
-                if (window.getSelection()?.toString())
-                    return;
-                onInteractOutside?.();
-            }
-        };
-        if (modalEl)
-            modalEl.addEventListener('click', handleBackdropClick);
-        return () => {
-            if (modalEl) {
-                modalEl.removeEventListener('click', handleBackdropClick);
-            }
-        };
-    }, [onInteractOutside, modalRef, onBeforeClose, ref]);
-    useEffect(() => {
-        const modalEl = modalRef.current;
-        const handleModalClose = () => {
-            onClose?.();
-        };
-        if (modalEl)
-            modalEl.addEventListener('close', handleModalClose);
-        return () => {
-            if (modalEl) {
-                modalEl.removeEventListener('close', handleModalClose);
-            }
-        };
-    }, [modalRef, onClose]);
-    const onCancel = (e) => {
-        if (onBeforeClose && onBeforeClose() === false) {
-            e.preventDefault();
-            return;
-        }
-        modalRef.current?.close();
-    };
-    return (jsx(Component, { ref: mergedRefs, className: clsx('ds-modal', className), onCancel: onCancel, ...rest, children: open && (jsx(FloatingFocusManager, { context: context, children: jsx(Fragment, { children: children }) })) }));
-});
-ModalDialog.displayName = 'ModalDialog';
-
-export { ModalDialog };

package/dist/esm/components/Modal/ModalFooter.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-
-const ModalFooter = forwardRef(({ asChild, className, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'footer';
-    return (jsx(Component, { ref: ref, className: clsx('ds-modal__footer', className), ...rest }));
-});
-ModalFooter.displayName = 'ModalFooter';
-
-export { ModalFooter };

package/dist/esm/components/Modal/ModalHeader.js

@@ -1,19 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { XMarkIcon } from '@navikt/aksel-icons';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-import { ModalContext } from './ModalRoot.js';
-import { Button } from '../Button/Button.js';
-import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
-import { Heading } from '../Typography/Heading/Heading.js';
-
-const ModalHeader = forwardRef(({ closeButton = true, children, subtitle, asChild, className, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'div';
-    const context = useContext(ModalContext);
-    return (jsxs(Component, { ref: ref, className: clsx('ds-modal__header', !closeButton && 'ds-modal__header--no-button', className), ...rest, children: [subtitle && (jsx(Paragraph, { size: 'sm', variant: 'short', children: subtitle })), jsx(Heading, { level: 2, size: 'xs', children: children }), closeButton && (jsx(Button, { name: 'close', variant: 'tertiary', color: 'neutral', size: 'md', onClick: context?.closeModal, autoFocus: true, icon: true, className: 'ds-modal__header__button', children: jsx(XMarkIcon, { title: 'close modal', fontSize: '1.5em' }) }))] }));
-});
-ModalHeader.displayName = 'ModalHeader';
-
-export { ModalHeader };

package/dist/esm/components/Modal/ModalRoot.js

@@ -1,22 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { createContext, useRef, useState } from 'react';
-
-const ModalContext = createContext({
-    modalRef: { current: null },
-    open: false,
-    setOpen: () => { },
-});
-const ModalRoot = ({ children }) => {
-    const modalRef = useRef(null);
-    const [open, setOpen] = useState(false);
-    return (jsx(ModalContext.Provider, { value: {
-            closeModal: () => { },
-            modalRef,
-            open,
-            setOpen,
-        }, children: children }));
-};
-ModalRoot.displayName = 'ModalRoot';
-
-export { ModalContext, ModalRoot };

package/dist/esm/components/Modal/ModalTrigger.js

@@ -1,15 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-import { ModalContext } from './ModalRoot.js';
-import { Button } from '../Button/Button.js';
-
-const ModalTrigger = forwardRef(({ asChild, ...rest }, ref) => {
-    const { modalRef, open } = useContext(ModalContext);
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : Button;
-    return (jsx(Component, { ref: ref, onClick: () => modalRef?.current?.showModal(), "aria-expanded": open, "aria-haspopup": 'dialog', ...rest }));
-});
-ModalTrigger.displayName = 'ModalTrigger';
-
-export { ModalTrigger };

package/dist/esm/components/Modal/index.js

@@ -1,23 +0,0 @@
-'use client';
-import { ModalRoot } from './ModalRoot.js';
-import { ModalContent } from './ModaContent.js';
-import { ModalDialog } from './ModalDialog.js';
-import { ModalFooter } from './ModalFooter.js';
-import { ModalHeader } from './ModalHeader.js';
-import { ModalTrigger } from './ModalTrigger.js';
-
-const Modal = ModalDialog;
-Modal.Root = ModalRoot;
-Modal.Content = ModalContent;
-Modal.Footer = ModalFooter;
-Modal.Header = ModalHeader;
-Modal.Trigger = ModalTrigger;
-Modal.Dialog = ModalDialog;
-Modal.Root.displayName = 'Modal.Root';
-Modal.Dialog.displayName = 'Modal.Dialog';
-Modal.Footer.displayName = 'Modal.Footer';
-Modal.Header.displayName = 'Modal.Header';
-Modal.Content.displayName = 'Modal.Content';
-Modal.Trigger.displayName = 'Modal.Trigger';
-
-export { Modal, ModalContent, ModalDialog, ModalFooter, ModalHeader, ModalTrigger };

package/dist/esm/components/Modal/useModalState.js

@@ -1,28 +0,0 @@
-'use client';
-import { useState, useEffect } from 'react';
-
-const useModalState = (modalRef) => {
-    const [isOpen, setIsOpen] = useState(false);
-    useEffect(() => {
-        if (!modalRef?.current)
-            return;
-        if (modalRef.current?.open)
-            setIsOpen(true);
-        const observer = new MutationObserver(() => {
-            if (modalRef.current?.open)
-                setIsOpen(true);
-            else
-                setIsOpen(false);
-        });
-        observer.observe(modalRef.current, {
-            attributes: true,
-            attributeFilter: ['open'],
-        });
-        return () => {
-            observer.disconnect();
-        };
-    }, [modalRef]);
-    return isOpen;
-};
-
-export { useModalState };

package/dist/esm/components/Modal/useScrollLock.js

@@ -1,27 +0,0 @@
-'use client';
-import { useEffect } from 'react';
-
-function useScrollLock(modalRef, bodyClass) {
-    useEffect(() => {
-        if (!modalRef.current)
-            return;
-        if (modalRef.current.open)
-            document.body.classList.add(bodyClass);
-        const observer = new MutationObserver(() => {
-            if (modalRef.current?.open)
-                document.body.classList.add(bodyClass);
-            else
-                document.body.classList.remove(bodyClass);
-        });
-        observer.observe(modalRef.current, {
-            attributes: true,
-            attributeFilter: ['open'],
-        });
-        return () => {
-            observer.disconnect();
-            document.body.classList.remove(bodyClass);
-        };
-    }, [bodyClass, modalRef]);
-}
-
-export { useScrollLock };

package/dist/esm/components/Pagination/PaginationContent.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-import { forwardRef, useContext } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { PaginationContext } from './PaginationRoot.js';
-
-const PaginationContent = forwardRef(({ asChild, className, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'ul';
-    const { size } = useContext(PaginationContext);
-    return (jsx(Component, { ref: ref, className: clsx('ds-pagination', `ds-pagination--${size}`, className), ...rest }));
-});
-
-export { PaginationContent };

package/dist/esm/components/Pagination/PaginationEllipsis.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { PaginationContext } from './PaginationRoot.js';
-import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
-
-const PaginationEllipsis = forwardRef(({ className, ...rest }, ref) => {
-    const { size } = useContext(PaginationContext);
-    return (jsx(Paragraph, { ref: ref, className: clsx('ds-pagination__ellipsis', className), size: size, ...rest, children: "\u2026" }));
-});
-var PaginationEllipsis$1 = PaginationEllipsis;
-
-export { PaginationEllipsis, PaginationEllipsis$1 as default };

package/dist/esm/components/Pagination/PaginationNextPrev.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { PaginationButton } from './PaginationButton.js';
-
-const PaginationNext = forwardRef(({ ...rest }, ref) => {
-    return (jsx(PaginationButton, { ref: ref, "aria-label": rest.children != null ? undefined : 'Neste side', ...rest }));
-});
-const PaginationPrevious = forwardRef(({ ...rest }, ref) => {
-    return (jsx(PaginationButton, { ref: ref, "aria-label": rest.children != null ? undefined : 'Forrige side', ...rest }));
-});
-
-export { PaginationNext, PaginationPrevious };

package/dist/esm/components/Pagination/PaginationRoot.js

@@ -1,16 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
-import { createContext, forwardRef } from 'react';
-
-const PaginationContext = createContext({
-    size: 'md',
-    compact: false,
-});
-const PaginationRoot = forwardRef(({ asChild, compact = false, size = 'md', ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'nav';
-    return (jsx(PaginationContext.Provider, { value: { size, compact }, children: jsx(Component, { ref: ref, "aria-label": 'Pagination', ...rest }) }));
-});
-var PaginationRoot$1 = PaginationRoot;
-
-export { PaginationContext, PaginationRoot, PaginationRoot$1 as default };

package/dist/esm/components/Pagination/usePagination.js

@@ -1,63 +0,0 @@
-'use client';
-import { useState, useEffect } from 'react';
-
-const getSteps = ({ compact, currentPage, totalPages, }) => {
-    /**  Number of always visible pages at the start and end. */
-    const boundaryCount = 1;
-    /** Number of always visible pages before and after the current page. */
-    const siblingCount = compact ? 0 : 1;
-    const range = (start, end) => Array.from({ length: end - start + 1 }, (_, i) => start + i);
-    if (totalPages <= (boundaryCount + siblingCount) * 2 + 3)
-        return range(1, totalPages);
-    const startPages = range(1, boundaryCount);
-    const endPages = range(totalPages - boundaryCount + 1, totalPages);
-    const siblingsStart = Math.max(Math.min(currentPage - siblingCount, totalPages - boundaryCount - siblingCount * 2 - 1), boundaryCount + 2);
-    const siblingsEnd = siblingsStart + siblingCount * 2;
-    return [
-        ...startPages,
-        siblingsStart - (startPages[startPages.length - 1] ?? 0) === 2
-            ? siblingsStart - 1
-            : 'ellipsis',
-        ...range(siblingsStart, siblingsEnd),
-        (endPages[0] ?? totalPages + 1) - siblingsEnd === 2
-            ? siblingsEnd + 1
-            : 'ellipsis',
-        ...endPages,
-    ];
-};
-/** Hook to help manage pagination state */
-const usePagination = ({ totalPages, currentPage: currentPageProps = 1, compact, }) => {
-    const [currentPage, setCurrentPage] = useState(currentPageProps);
-    useEffect(() => {
-        setCurrentPage(currentPageProps);
-    }, [currentPageProps]);
-    const pages = getSteps({ currentPage, totalPages, compact });
-    const showNextPage = currentPage < totalPages;
-    const showPreviousPage = currentPage !== 1;
-    const nextPage = () => {
-        setCurrentPage(currentPage + 1 <= totalPages ? currentPage + 1 : totalPages);
-    };
-    const previousPage = () => {
-        setCurrentPage(currentPage - 1 > 0 ? currentPage - 1 : 1);
-    };
-    return {
-        /** Number of steps */
-        pages,
-        /** Current active page  */
-        currentPage,
-        /** Set active page */
-        setCurrentPage,
-        /** Decrements active page by 1 */
-        previousPage,
-        /** Increments active page by 1 */
-        nextPage,
-        /** Total amount of pages */
-        totalPages,
-        /** Indication if next page action should be shown or not */
-        showNextPage,
-        /** Indication if previous page action should be shown or not */
-        showPreviousPage,
-    };
-};
-
-export { usePagination };

package/dist/esm/components/Popover/PopoverContent.js

@@ -1,86 +0,0 @@
-'use client';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import * as React from 'react';
-import { forwardRef, useContext, useRef, useEffect, useMemo } from 'react';
-import { useFloating, useInteractions, useFocus, useClick, useDismiss, useRole, useMergeRefs, FloatingPortal } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { PopoverContext } from './Popover.js';
-import { autoUpdate, flip, shift } from '../../node_modules/@floating-ui/react-dom/node_modules/@floating-ui/dom/dist/floating-ui.dom.js';
-import { offset } from '../../node_modules/@floating-ui/core/dist/floating-ui.core.js';
-import { arrow } from '../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
-import { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect.js';
-import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
-
-const ARROW_HEIGHT = 7;
-const ARROW_GAP = 4;
-const ARROW_PLACEMENT = {
-    top: 'bottom',
-    right: 'left',
-    bottom: 'top',
-    left: 'right',
-};
-const PopoverContent = forwardRef(({ className, children, style, id, ...rest }, ref) => {
-    const { portal, internalOpen, size, isControlled, variant, placement, setInternalOpen, onClose, onOpenChange, anchorEl, popoverId, setPopoverId, triggerId, } = useContext(PopoverContext);
-    const Container = portal ? FloatingPortal : React.Fragment;
-    const floatingEl = useRef(null);
-    const arrowRef = useRef(null);
-    useEffect(() => {
-        id && setPopoverId?.(id);
-    }, [id, setPopoverId]);
-    const { context, update, refs, floatingStyles, placement: flPlacement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, } = useFloating({
-        placement,
-        open: internalOpen,
-        onOpenChange: (localOpen) => {
-            onOpenChange && onOpenChange(localOpen);
-            if (!localOpen)
-                onClose && onClose();
-            if (!isControlled)
-                setInternalOpen(localOpen);
-        },
-        whileElementsMounted: autoUpdate,
-        elements: {
-            reference: anchorEl ?? undefined,
-            floating: floatingEl.current,
-        },
-        middleware: [
-            offset(ARROW_HEIGHT + ARROW_GAP),
-            flip({
-                fallbackAxisSideDirection: 'start',
-            }),
-            shift(),
-            arrow({
-                element: arrowRef,
-            }),
-        ],
-    });
-    const { getFloatingProps } = useInteractions([
-        useFocus(context),
-        useClick(context),
-        useDismiss(context),
-        useRole(context),
-    ]);
-    const floatingRef = useMergeRefs([refs.setFloating, ref]);
-    useIsomorphicLayoutEffect(() => {
-        refs.setReference(anchorEl);
-        if (!refs.reference.current || !refs.floating.current || !internalOpen)
-            return;
-        const cleanup = autoUpdate(refs.reference.current, refs.floating.current, update);
-        return () => cleanup();
-    }, [refs.floating, refs.reference, update, anchorEl, refs, internalOpen]);
-    const arrowPlacement = useMemo(() => {
-        return ARROW_PLACEMENT[flPlacement.split('-')[0]];
-    }, [flPlacement]);
-    return (jsx(Fragment, { children: internalOpen && (jsx(Container, { children: jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { ref: floatingEl, className: clsx('ds-popover', `ds-popover--${variant}`, `ds-popover--${size}`, className), "data-placement": flPlacement, ...getFloatingProps({
-                        ref: floatingRef,
-                        tabIndex: undefined,
-                    }), style: { ...floatingStyles, ...style }, id: popoverId, "aria-labelledby": triggerId, ...rest, children: [children, jsx("div", { ref: arrowRef, className: clsx('ds-popover__arrow', `ds-popover__arrow--${arrowPlacement}`), style: {
-                                height: ARROW_HEIGHT,
-                                width: ARROW_HEIGHT,
-                                ...(arrowX != null ? { left: arrowX } : {}),
-                                ...(arrowY != null ? { top: arrowY } : {}),
-                                ...(arrowPlacement ? { [arrowPlacement]: -4.5 } : {}),
-                            } })] }) }) })) }));
-});
-PopoverContent.displayName = 'Popover.Content';
-
-export { PopoverContent };

package/dist/esm/components/Skeleton/Circle/Circle.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { useSynchronizedAnimation } from '../../../hooks/useSynchronizedAnimation.js';
-
-/**  Skeleton component used for indicating loading elements of circular shape */
-const Circle = ({ width, height, className, children, style, ...rest }) => {
-    const ref = useSynchronizedAnimation('ds-skeleton-opacity-fade');
-    return (jsx("div", { ref: ref, className: clsx('ds-skeleton', 'ds-skeleton--circle', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
-};
-Circle.displayName = 'SkeletonCircle';
-
-export { Circle };

package/dist/esm/components/Skeleton/Rectangle/Rectangle.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { useSynchronizedAnimation } from '../../../hooks/useSynchronizedAnimation.js';
-
-/**  Skeleton component used for indicating loading elements of rectangle shape */
-const Rectangle = ({ width, height, className, children, style, ...rest }) => {
-    const ref = useSynchronizedAnimation('ds-skeleton-opacity-fade');
-    return (jsx("div", { ref: ref, className: clsx('ds-skeleton', 'ds-skeleton--rectangle', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
-};
-Rectangle.displayName = 'SkeletonRectangle';
-
-export { Rectangle };

package/dist/esm/components/Skeleton/Text/Text.js

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { useSynchronizedAnimation } from '../../../hooks/useSynchronizedAnimation.js';
-
-/**  Skeleton component used for indicating loading elements of text */
-const Text = ({ width, height, className, style, children, ...rest }) => {
-    const ref = useSynchronizedAnimation('ds-skeleton-opacity-fade');
-    return (jsx("div", { ref: ref, className: clsx('ds-skeleton', 'ds-skeleton--text', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
-};
-Text.displayName = 'SkeletonText';
-
-export { Text };

package/dist/esm/components/Skeleton/index.js

@@ -1,15 +0,0 @@
-'use client';
-import { Circle } from './Circle/Circle.js';
-import { Rectangle } from './Rectangle/Rectangle.js';
-import { Text } from './Text/Text.js';
-
-const Skeleton = {
-    Circle: Circle,
-    Rectangle: Rectangle,
-    Text: Text,
-};
-Skeleton.Circle.displayName = 'Skeleton.Circle';
-Skeleton.Rectangle.displayName = 'Skeleton.Rectangle';
-Skeleton.Text.displayName = 'Skeleton.Text';
-
-export { Skeleton, Circle as SkeletonCircle, Rectangle as SkeletonRectangle, Text as SkeletonText };

package/dist/esm/components/Tabs/Tab.js

@@ -1,15 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { useTabItem } from './useTab.js';
-import { RovingTabindexItem } from '../../utilities/RovingTabIndex/RovingTabindexItem.js';
-
-const Tab = forwardRef((props, ref) => {
-    const { children, className, ...rest } = props;
-    const { ...useTabRest } = useTabItem(props);
-    return (jsx(RovingTabindexItem, { ...rest, asChild: true, children: jsx("button", { ...useTabRest, type: 'button', className: clsx('ds-tabs__tab', 'ds-focus', className), ref: ref, children: children }) }));
-});
-Tab.displayName = 'Tab';
-
-export { Tab };

package/dist/esm/components/Tabs/TabContent.js

@@ -1,15 +0,0 @@
-'use client';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { TabsContext } from './Tabs.js';
-import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
-
-const TabContent = forwardRef(({ children, value, className, ...rest }, ref) => {
-    const { value: tabsValue } = useContext(TabsContext);
-    const active = value == tabsValue;
-    return (jsx(Fragment, { children: active && (jsx(Paragraph, { asChild: true, children: jsx("div", { className: clsx('ds-tabs__content', className), ref: ref, ...rest, children: children }) })) }));
-});
-TabContent.displayName = 'TabContent';
-
-export { TabContent };

package/dist/esm/components/Tabs/TabList.js

@@ -1,12 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../node_modules/clsx/dist/lite.js';
-import { RovingTabindexRoot } from '../../utilities/RovingTabIndex/RovingTabindexRoot.js';
-
-const TabList = forwardRef(({ children, className, ...rest }, ref) => {
-    return (jsx(RovingTabindexRoot, { role: 'tablist', className: clsx('ds-tabs__tablist', className), ref: ref, ...rest, children: children }));
-});
-TabList.displayName = 'TabList';
-
-export { TabList };

package/dist/esm/components/Tabs/useTab.js

@@ -1,21 +0,0 @@
-'use client';
-import { useContext, useId } from 'react';
-import { TabsContext } from './Tabs.js';
-
-/** Handles props for `Tab` in context with `Tabs` */
-const useTabItem = (props) => {
-    const { value, ...rest } = props;
-    const tabs = useContext(TabsContext);
-    const buttonId = `tab-${useId()}`;
-    return {
-        ...rest,
-        id: buttonId,
-        'aria-selected': tabs.value == value,
-        role: 'tab',
-        onClick: () => {
-            tabs.onChange?.(value);
-        },
-    };
-};
-
-export { useTabItem };

package/dist/esm/components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js

@@ -1,16 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { useToggleGroupItem } from './useToggleGroupitem.js';
-import { RovingTabindexItem } from '../../../utilities/RovingTabIndex/RovingTabindexItem.js';
-import { Button } from '../../Button/Button.js';
-
-const ToggleGroupItem = forwardRef((props, ref) => {
-    const { children, icon, className, ...rest } = props;
-    const { active, size = 'md', buttonProps } = useToggleGroupItem(props);
-    return (jsx(RovingTabindexItem, { asChild: true, value: rest.value, children: jsx(Button, { className: clsx('ds-togglegroup__item', className), icon: icon, variant: active ? 'primary' : 'tertiary', size: size, ref: ref, ...rest, ...buttonProps, children: children }) }));
-});
-ToggleGroupItem.displayName = 'ToggleGroupItem';
-
-export { ToggleGroupItem };

package/dist/esm/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.js

@@ -1,29 +0,0 @@
-'use client';
-import { useContext, useId } from 'react';
-import { ToggleGroupContext } from '../ToggleGroup.js';
-
-/** Handles props for `ToggleGroup.Item` in context with `ToggleGroup` and `RovingTabIndex` */
-const useToggleGroupItem = (props) => {
-    const { ...rest } = props;
-    const toggleGroup = useContext(ToggleGroupContext);
-    const itemValue = props.value ?? (typeof props.children === 'string' ? props.children : '');
-    const active = toggleGroup.value == itemValue;
-    const buttonId = `togglegroup-item-${useId()}`;
-    return {
-        ...rest,
-        active: active,
-        size: toggleGroup?.size,
-        buttonProps: {
-            id: buttonId,
-            'aria-checked': active,
-            'aria-current': active,
-            role: 'radio',
-            name: toggleGroup.name,
-            onClick: () => {
-                toggleGroup.onChange?.(itemValue);
-            },
-        },
-    };
-};
-
-export { useToggleGroupItem };

package/dist/esm/components/Typography/ErrorMessage/ErrorMessage.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../../node_modules/@radix-ui/react-slot/dist/index.js';
-
-/** Use `ErrorMessage` to display text as error message. */
-const ErrorMessage = forwardRef(({ size = 'md', className, spacing, asChild, error = true, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : 'div';
-    return (jsx(Component, { ref: ref, className: clsx('ds-error-message', `ds-error_message--${size}`, spacing && 'ds-error-message--spacing', error && 'ds-error-message--error', className), ...rest }));
-});
-ErrorMessage.displayName = 'ErrorMessage';
-
-export { ErrorMessage };

package/dist/esm/components/Typography/Heading/Heading.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from '../../../node_modules/clsx/dist/lite.js';
-import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../../node_modules/@radix-ui/react-slot/dist/index.js';
-
-/** Use `Heading` to render h1-6 elements with heading text styles.  */
-const Heading = forwardRef(({ size = 'xl', level = 1, spacing = false, className, asChild, ...rest }, ref) => {
-    const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : `h${level ?? 1}`;
-    return (jsx(Component, { ref: ref, className: clsx('ds-heading', `ds-heading--${size}`, spacing && 'ds-heading--spacing', className), ...rest }));
-});
-Heading.displayName = 'Heading';
-
-export { Heading };