@digdir/designsystemet-react 1.0.0-next.48 → 1.0.0-next.49

package/dist/cjs/components/Modal/ModalTriggerContext.js

@@ -1,28 +0,0 @@
-'use client';
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-
-const Context = react.createContext({
-    current: null,
-});
-/**
- * ModalTriggerContext component, used to provide a context for a modal trigger.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     Content
- *   </Modal>
- * </Modal.TriggerContext>
- */
-const ModalTriggerContext = ({ children }) => {
-    const contextRef = react.useRef(null);
-    return jsxRuntime.jsx(Context.Provider, { value: contextRef, children: children });
-};
-ModalTriggerContext.displayName = 'ModalTriggerContext';
-
-exports.Context = Context;
-exports.ModalTriggerContext = ModalTriggerContext;

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

@@ -1,34 +0,0 @@
-'use client';
-'use strict';
-
-var Modal$1 = require('./Modal.js');
-var ModalBlock = require('./ModalBlock.js');
-var ModalTrigger = require('./ModalTrigger.js');
-var ModalTriggerContext = require('./ModalTriggerContext.js');
-
-/**
- * Modal component, used to display a modal dialog.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     <Modal.Block>
- *       Content
- *     </Modal.Block>
- *   </Modal>
- * </Modal.TriggerContext>
- */
-const Modal = Object.assign(Modal$1.Modal, {
-    Block: ModalBlock.ModalBlock,
-    TriggerContext: ModalTriggerContext.ModalTriggerContext,
-    Trigger: ModalTrigger.ModalTrigger,
-});
-Modal.Block.displayName = 'Modal.Block';
-Modal.TriggerContext.displayName = 'Modal.TriggerContext';
-Modal.Trigger.displayName = 'Modal.Trigger';
-
-exports.ModalBlock = ModalBlock.ModalBlock;
-exports.ModalTrigger = ModalTrigger.ModalTrigger;
-exports.ModalTriggerContext = ModalTriggerContext.ModalTriggerContext;
-exports.Modal = Modal;

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

@@ -1,72 +0,0 @@
-'use client';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useMergeRefs } from '@floating-ui/react';
-import { Slot } from '@radix-ui/react-slot';
-import cl from 'clsx/lite';
-import { forwardRef, useContext, useRef, useEffect } from 'react';
-import { Context } from './ModalTriggerContext.js';
-import { Button } from '../Button/Button.js';
-
-/**
- * Modal component, used to display a modal dialog.
- *
- * @example with TriggerContext
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     <Modal.Block>
- *       Content
- *     </Modal.Block>
- *   </Modal>
- * </Modal.TriggerContext>
- *
- * @example without TriggerContext
- * const modalRef = useRef<HTMLDialogElement>(null);
- *
- * ...
- *
- * <Button onClick={() => modalRef.current?.showModal()}>Open Modal</Button>
- * <Modal ref={modalRef}>
- *   Content
- * </Modal>
- */
-const Modal = forwardRef(function Modal({ asChild, children, className, closeButton = 'Lukk dialogvindu', onClose, open, backdropClose = false, ...rest }, ref) {
-    const contextRef = useContext(Context);
-    const modalRef = useRef(null); // This local ref is used to make sure the modal works without a ModalTriggerContext
-    const Component = asChild ? Slot : 'dialog';
-    const mergedRefs = useMergeRefs([contextRef, ref, modalRef]);
-    useEffect(() => modalRef.current?.[open ? 'showModal' : 'close'](), [open]); // Toggle open based on prop
-    useEffect(() => {
-        const modal = modalRef.current;
-        const handleBackdropClick = ({ clientY: y, clientX: x, target, }) => {
-            if (window.getSelection()?.toString())
-                return; // Fix bug where if you select text spanning two divs it thinks you clicked outside
-            if (modal && target === modal && backdropClose) {
-                const { top, left, right, bottom } = modal.getBoundingClientRect();
-                const isInDialog = top <= y && y <= bottom && left <= x && x <= right;
-                if (!isInDialog)
-                    modal?.close(); // Both <dialog> and ::backdrop is considered same event.target
-            }
-        };
-        const handleAutoFocus = () => {
-            const autofocus = modal?.querySelector('[autofocus]');
-            if (document.activeElement !== autofocus)
-                autofocus?.focus();
-        };
-        modal?.addEventListener('animationend', handleAutoFocus);
-        modal?.addEventListener('click', handleBackdropClick);
-        return () => {
-            modal?.removeEventListener('animationend', handleAutoFocus);
-            modal?.removeEventListener('click', handleBackdropClick);
-        };
-    }, [backdropClose]);
-    /* handle closing */
-    useEffect(() => {
-        const handleClose = (event) => onClose?.(event);
-        modalRef.current?.addEventListener('close', handleClose);
-        return () => modalRef.current?.removeEventListener('close', handleClose);
-    }, [onClose]);
-    return (jsxs(Component, { className: cl('ds-modal', className), ref: mergedRefs, ...rest, children: [closeButton !== false && (jsx("form", { method: 'dialog', children: jsx(Button, { "aria-label": closeButton, autoFocus: true, "data-color": 'neutral', icon: true, name: 'close', type: 'submit', variant: 'tertiary' }) })), children] }));
-});
-
-export { Modal };

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

@@ -1,28 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { Slot } from '@radix-ui/react-slot';
-import cl from 'clsx/lite';
-import { forwardRef } from 'react';
-
-/**
- * ModalBlock component, used to separate content in a modal.
- *
- * @example
- * <Modal>
- *   <Modal.Block>
- *     Header
- *   </Modal.Block>
- *   <Modal.Block>
- *     Content
- *   </Modal.Block>
- *   <Modal.Block>
- *     Footer
- *   </Modal.Block>
- * </Modal>
- */
-const ModalBlock = forwardRef(function ModalBlock({ asChild, className, ...rest }, ref) {
-    const Component = asChild ? Slot : 'div';
-    return (jsx(Component, { className: cl('ds-modal__block', className), ref: ref, ...rest }));
-});
-
-export { ModalBlock };

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

@@ -1,25 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { createContext, useRef } from 'react';
-
-const Context = createContext({
-    current: null,
-});
-/**
- * ModalTriggerContext component, used to provide a context for a modal trigger.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     Content
- *   </Modal>
- * </Modal.TriggerContext>
- */
-const ModalTriggerContext = ({ children }) => {
-    const contextRef = useRef(null);
-    return jsx(Context.Provider, { value: contextRef, children: children });
-};
-ModalTriggerContext.displayName = 'ModalTriggerContext';
-
-export { Context, ModalTriggerContext };

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

@@ -1,29 +0,0 @@
-'use client';
-import { Modal as Modal$1 } from './Modal.js';
-import { ModalBlock } from './ModalBlock.js';
-import { ModalTrigger } from './ModalTrigger.js';
-import { ModalTriggerContext } from './ModalTriggerContext.js';
-
-/**
- * Modal component, used to display a modal dialog.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     <Modal.Block>
- *       Content
- *     </Modal.Block>
- *   </Modal>
- * </Modal.TriggerContext>
- */
-const Modal = Object.assign(Modal$1, {
-    Block: ModalBlock,
-    TriggerContext: ModalTriggerContext,
-    Trigger: ModalTrigger,
-});
-Modal.Block.displayName = 'Modal.Block';
-Modal.TriggerContext.displayName = 'Modal.TriggerContext';
-Modal.Trigger.displayName = 'Modal.Trigger';
-
-export { Modal, ModalBlock, ModalTrigger, ModalTriggerContext };

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

@@ -1 +0,0 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAGlD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAIlD,MAAM,MAAM,UAAU,GAAG,UAAU,CACjC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD;IACE;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC7B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,KAAK;IA7Cd;;;OAGG;kBACW,MAAM,GAAG,KAAK;IAC5B;;;OAGG;oBACa,OAAO;IACvB;;OAEG;cACO,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI;IAChC;;;OAGG;cACO,OAAO;2CAsGnB,CAAC"}

package/dist/types/components/Modal/ModalBlock.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalBlock.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalBlock.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU;IAvBrB;;;OAGG;cACO,OAAO;yEA+BlB,CAAC"}

package/dist/types/components/Modal/ModalTrigger.d.ts

@@ -1,22 +0,0 @@
-import type { ComponentPropsWithRef } from 'react';
-import { Button } from '../Button/Button';
-export type ModalTriggerProps = ComponentPropsWithRef<typeof Button>;
-/**
- * ModalTrigger component, used within a Modal.TriggerContext to open a modal.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     Content
- *   </Modal>
- * </Modal.TriggerContext>
- */
-export declare const ModalTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("../../types").DefaultProps & React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "asChild" | "variant" | "icon" | "loading"> & {
-    variant?: "primary" | "secondary" | "tertiary";
-    icon?: boolean;
-    loading?: boolean;
-    asChild?: boolean;
-    type?: React.ButtonHTMLAttributes<HTMLButtonElement>["type"];
-} & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-//# sourceMappingURL=ModalTrigger.d.ts.map

package/dist/types/components/Modal/ModalTrigger.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalTrigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAG1C,MAAM,MAAM,iBAAiB,GAAG,qBAAqB,CAAC,OAAO,MAAM,CAAC,CAAC;AAErE;;;;;;;;;;GAUG;AACH,eAAO,MAAM,YAAY;;;;;;4FAcxB,CAAC"}

package/dist/types/components/Modal/ModalTriggerContext.d.ts

@@ -1,21 +0,0 @@
-import type { ReactNode, RefObject } from 'react';
-export declare const Context: React.Context<RefObject<HTMLDialogElement | null>>;
-export type ModalTriggerContextProps = {
-    children: ReactNode;
-};
-/**
- * ModalTriggerContext component, used to provide a context for a modal trigger.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     Content
- *   </Modal>
- * </Modal.TriggerContext>
- */
-export declare const ModalTriggerContext: {
-    ({ children }: ModalTriggerContextProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-//# sourceMappingURL=ModalTriggerContext.d.ts.map

package/dist/types/components/Modal/ModalTriggerContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalTriggerContext.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalTriggerContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElD,eAAO,MAAM,OAAO,oDAElB,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAAC;AAE/D;;;;;;;;;;GAUG;AACH,eAAO,MAAM,mBAAmB;mBAAkB,wBAAwB;;CAIzE,CAAC"}

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

@@ -1,43 +0,0 @@
-import { ModalBlock } from './ModalBlock';
-import { ModalTrigger } from './ModalTrigger';
-import { ModalTriggerContext } from './ModalTriggerContext';
-/**
- * Modal component, used to display a modal dialog.
- *
- * @example
- * <Modal.TriggerContext>
- *   <Modal.Trigger>Open Modal</Modal.Trigger>
- *   <Modal>
- *     <Modal.Block>
- *       Content
- *     </Modal.Block>
- *   </Modal>
- * </Modal.TriggerContext>
- */
-declare const Modal: React.ForwardRefExoticComponent<Omit<import("../../types").DefaultProps & React.DialogHTMLAttributes<HTMLDialogElement>, "asChild" | "onClose" | "closeButton" | "backdropClose"> & {
-    closeButton?: string | false;
-    backdropClose?: boolean;
-    onClose?: (event: Event) => void;
-    asChild?: boolean;
-} & React.RefAttributes<HTMLDialogElement>> & {
-    Block: React.ForwardRefExoticComponent<{
-        asChild?: boolean;
-    } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-    TriggerContext: {
-        ({ children }: import("./ModalTriggerContext").ModalTriggerContextProps): import("react/jsx-runtime").JSX.Element;
-        displayName: string;
-    };
-    Trigger: React.ForwardRefExoticComponent<Omit<Omit<import("../../types").DefaultProps & React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "asChild" | "variant" | "icon" | "loading"> & {
-        variant?: "primary" | "secondary" | "tertiary";
-        icon?: boolean;
-        loading?: boolean;
-        asChild?: boolean;
-        type?: React.ButtonHTMLAttributes<HTMLButtonElement>["type"];
-    } & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-};
-export type { ModalBlockProps } from './ModalBlock';
-export type { ModalTriggerContextProps } from './ModalTriggerContext';
-export type { ModalProps } from './Modal';
-export type { ModalTriggerProps } from './ModalTrigger';
-export { Modal, ModalBlock, ModalTriggerContext, ModalTrigger };
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D;;;;;;;;;;;;GAYG;AACH,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;CAIT,CAAC;AAMH,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,YAAY,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AACtE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,mBAAmB,EAAE,YAAY,EAAE,CAAC"}

package/dist/types/components/Pagination/usePagination.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/usePagination.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAchE,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClE;;;OAGG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4BI;AACJ,eAAO,MAAM,aAAa,sEAMvB,kBAAkB;IAWf,sBAAsB;;;;qBAWL,qBAAqB,GAAG,IAAI;;IAG7C,8EAA8E;qBAKzE,qBAAqB;IAC1B,0EAA0E;qBAKrE,qBAAqB;IAC1B,gEAAgE;;IAEhE,4DAA4D;;CAGxB,CAAC"}