@entur/modal 1.7.56 → 1.7.58-RC.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/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  This package contains the different Modal components.
4
4
 
5
- > 💡 Looking for the [documentation](https://design.entur.no/komponenter/layout-and-surfaces/modals)?
5
+ > 💡 Looking for the [documentation](https://design.entur.no/komponenter/layout-og-flater/modal)?
6
6
 
7
7
  ## Installation
8
8
 
@@ -14,4 +14,4 @@ yarn add @entur/modal
14
14
 
15
15
  ## Usage
16
16
 
17
- Please refer to the [documentation](https://design.entur.no/komponenter/layout-and-surfaces/modals) for usage information.
17
+ Please refer to the [documentation](https://design.entur.no/komponenter/layout-og-flater/modal) for usage information.
@@ -15,10 +15,10 @@ export type ModalContentProps = {
15
15
  [key: string]: any;
16
16
  };
17
17
  export declare const headingsMap: {
18
- extraSmall: <E extends React.ElementType<any> = "h4">({ margin, children, as, ...rest }: import("@entur/typography").Heading4Props<E>) => JSX.Element;
19
- small: <E_1 extends React.ElementType<any> = "h3">({ margin, children, as, ...rest }: import("@entur/typography").Heading3Props<E_1>) => JSX.Element;
20
- medium: <E_2 extends React.ElementType<any> = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E_2>) => JSX.Element;
21
- large: <E_2 extends React.ElementType<any> = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E_2>) => JSX.Element;
22
- extraLarge: <E_2 extends React.ElementType<any> = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E_2>) => JSX.Element;
18
+ extraSmall: <E extends React.ElementType = "h4">({ margin, children, as, ...rest }: import("@entur/typography").Heading4Props<E>) => JSX.Element;
19
+ small: <E extends React.ElementType = "h3">({ margin, children, as, ...rest }: import("@entur/typography").Heading3Props<E>) => JSX.Element;
20
+ medium: <E extends React.ElementType = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E>) => JSX.Element;
21
+ large: <E extends React.ElementType = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E>) => JSX.Element;
22
+ extraLarge: <E extends React.ElementType = "h2">({ margin, children, as, ...rest }: import("@entur/typography").Heading2Props<E>) => JSX.Element;
23
23
  };
24
24
  export declare const ModalContent: React.FC<ModalContentProps>;
@@ -14,30 +14,22 @@ var a11y = require('@entur/a11y');
14
14
  var layout = require('@entur/layout');
15
15
 
16
16
  function _extends() {
17
- _extends = Object.assign ? Object.assign.bind() : function (target) {
18
- for (var i = 1; i < arguments.length; i++) {
19
- var source = arguments[i];
20
- for (var key in source) {
21
- if (Object.prototype.hasOwnProperty.call(source, key)) {
22
- target[key] = source[key];
23
- }
24
- }
17
+ return _extends = Object.assign ? Object.assign.bind() : function (n) {
18
+ for (var e = 1; e < arguments.length; e++) {
19
+ var t = arguments[e];
20
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25
21
  }
26
- return target;
27
- };
28
- return _extends.apply(this, arguments);
22
+ return n;
23
+ }, _extends.apply(null, arguments);
29
24
  }
30
- function _objectWithoutPropertiesLoose(source, excluded) {
31
- if (source == null) return {};
32
- var target = {};
33
- var sourceKeys = Object.keys(source);
34
- var key, i;
35
- for (i = 0; i < sourceKeys.length; i++) {
36
- key = sourceKeys[i];
37
- if (excluded.indexOf(key) >= 0) continue;
38
- target[key] = source[key];
25
+ function _objectWithoutPropertiesLoose(r, e) {
26
+ if (null == r) return {};
27
+ var t = {};
28
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
29
+ if (e.includes(n)) continue;
30
+ t[n] = r[n];
39
31
  }
40
- return target;
32
+ return t;
41
33
  }
42
34
 
43
35
  var _excluded$2 = ["className", "open"];
@@ -1 +1 @@
1
- {"version":3,"file":"modal.cjs.development.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Modal.tsx","../src/Drawer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n"],"names":["ModalOverlay","className","open","rest","_excluded","React","createElement","DialogOverlay","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","Modal","closeLabel","initialFocusRef","onDismiss","closeOnClickOutside","showCloseButton","includes","handleOnDismiss","IconButton","onClick","type","CloseIcon","Drawer","contrast","style","overlay","titleId","handleKeyDown","e","key","stopPropagation","Wrapper","Contrast","Fragment","ContentContainer","ConditionalWrapper","condition","wrapper","onKeyDown","MoveFocusInside","VisuallyHidden","warnAboutMissingStyles"],"mappings":"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"}
1
+ {"version":3,"file":"modal.cjs.development.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Modal.tsx","../src/Drawer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n"],"names":["ModalOverlay","_ref","className","open","rest","_objectWithoutPropertiesLoose","_excluded","React","createElement","DialogOverlay","_extends","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","_ref$align","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","Modal","_ref$closeLabel","closeLabel","initialFocusRef","onDismiss","_ref$closeOnClickOuts","closeOnClickOutside","showCloseButton","includes","handleOnDismiss","IconButton","onClick","type","CloseIcon","Drawer","_ref$contrast","contrast","_ref$open","style","_ref$overlay","overlay","titleId","handleKeyDown","e","key","stopPropagation","Wrapper","Contrast","Fragment","ContentContainer","ConditionalWrapper","condition","wrapper","onKeyDown","MoveFocusInside","VisuallyHidden","_ref2","warnAboutMissingStyles"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),n=require("react"),t=require("@entur/icons"),a=require("@entur/button"),r=require("@entur/typography"),i=require("classnames"),l=require("@reach/dialog"),o=require("react-focus-lock"),s=require("@entur/a11y"),c=require("@entur/layout");function d(){return d=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},d.apply(this,arguments)}function u(e,n){if(null==e)return{};var t,a,r={},i=Object.keys(e);for(a=0;a<i.length;a++)n.indexOf(t=i[a])>=0||(r[t]=e[t]);return r}var m=["className","open"],g=function(e){var t=e.className,a=e.open,r=u(e,m);return n.createElement(l.DialogOverlay,d({className:i("eds-modal__overlay",t),isOpen:a},r))},p=["children","className","size","title","align"],v={extraSmall:r.Heading4,small:r.Heading3,medium:r.Heading2,large:r.Heading2,extraLarge:r.Heading2},y=function(t){var a=t.children,o=t.className,s=t.size,c=t.title,m=t.align,g=void 0===m?"start":m,y=u(t,p),b=v[s]||r.Heading2,f=e.useRandomId("eds-modal");return n.createElement(l.DialogContent,d({className:i("eds-modal__content","eds-modal__content--size-"+s,"eds-modal__content--align-"+g,o),"aria-labelledby":f},y),c&&n.createElement(b,{margin:"bottom",as:"h2",id:f},c),a)},b=["children","closeLabel","initialFocusRef","open","onDismiss","size","align","title","closeOnClickOutside"],f=function(e){var n=e.children;return e.condition?(0,e.wrapper)(n):n};e.warnAboutMissingStyles("modal","icons","typography","a11y","button"),exports.Drawer=function(d){var u=d.children,m=d.className,p=d.closeLabel,v=void 0===p?"Lukk skuff":p,y=d.contrast,b=void 0!==y&&y,E=d.open,h=void 0===E||E,_=d.onDismiss,O=d.title,k=d.style,N=d.overlay,q=void 0!==N&&N,w=e.useRandomId("eds-drawer");return h?n.createElement(f,{condition:q,wrapper:function(e){return n.createElement(g,{open:h,onDismiss:_},e)}},n.createElement(b?c.Contrast:n.Fragment,null,n.createElement(q?l.DialogContent:"div",{"aria-labelledby":w,className:i("eds-drawer",m),onKeyDown:function(e){"Escape"===e.key&&(e.stopPropagation(),_())},style:k},n.createElement(o.MoveFocusInside,null,n.createElement("div",{className:"eds-drawer__content"},n.createElement(r.Heading3,{as:"h2",id:w},O),u),n.createElement(a.IconButton,{className:"eds-drawer__close-button",onClick:_,type:"button"},n.createElement(t.CloseIcon,{"aria-hidden":!0}),n.createElement(s.VisuallyHidden,null,v)))))):null},exports.Modal=function(i){var l,o=i.children,s=i.closeLabel,c=void 0===s?"Lukk":s,m=i.initialFocusRef,p=i.open,f=i.onDismiss,E=i.size,h=i.align,_=void 0===h?"start":h,O=i.title,k=i.closeOnClickOutside,N=void 0===k||k,q=u(i,b),w=e.useRandomId("eds-modal"),x=v[E]||r.Heading2,C=["medium","large","extraLarge"].includes(E);return f&&N&&(l=f),n.createElement(g,{open:p,onDismiss:l,initialFocusRef:m},n.createElement(y,d({size:E,align:_},q),C&&n.createElement(a.IconButton,{className:"eds-modal__close","aria-label":c,onClick:f,type:"button"},n.createElement(t.CloseIcon,null)),O&&n.createElement(x,{margin:"bottom",as:"h2",id:w},O),o))},exports.ModalContent=y,exports.ModalOverlay=g,exports.headingsMap=v;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),n=require("react"),a=require("@entur/icons"),t=require("@entur/button"),r=require("@entur/typography"),l=require("classnames"),i=require("@reach/dialog"),o=require("react-focus-lock"),s=require("@entur/a11y"),c=require("@entur/layout");function d(){return d=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var a=arguments[n];for(var t in a)({}).hasOwnProperty.call(a,t)&&(e[t]=a[t])}return e},d.apply(null,arguments)}function u(e,n){if(null==e)return{};var a={};for(var t in e)if({}.hasOwnProperty.call(e,t)){if(n.includes(t))continue;a[t]=e[t]}return a}var m=["className","open"],g=function(e){var a=e.className,t=e.open,r=u(e,m);return n.createElement(i.DialogOverlay,d({className:l("eds-modal__overlay",a),isOpen:t},r))},p=["children","className","size","title","align"],v={extraSmall:r.Heading4,small:r.Heading3,medium:r.Heading2,large:r.Heading2,extraLarge:r.Heading2},y=function(a){var t=a.children,o=a.className,s=a.size,c=a.title,m=a.align,g=void 0===m?"start":m,y=u(a,p),f=v[s]||r.Heading2,b=e.useRandomId("eds-modal");return n.createElement(i.DialogContent,d({className:l("eds-modal__content","eds-modal__content--size-"+s,"eds-modal__content--align-"+g,o),"aria-labelledby":b},y),c&&n.createElement(f,{margin:"bottom",as:"h2",id:b},c),t)},f=["children","closeLabel","initialFocusRef","open","onDismiss","size","align","title","closeOnClickOutside"],b=function(e){var n=e.children;return e.condition?(0,e.wrapper)(n):n};e.warnAboutMissingStyles("modal","icons","typography","a11y","button"),exports.Drawer=function(d){var u=d.children,m=d.className,p=d.closeLabel,v=void 0===p?"Lukk skuff":p,y=d.contrast,f=void 0!==y&&y,E=d.open,h=void 0===E||E,_=d.onDismiss,O=d.title,k=d.style,w=d.overlay,N=void 0!==w&&w,q=e.useRandomId("eds-drawer");return h?n.createElement(b,{condition:N,wrapper:function(e){return n.createElement(g,{open:h,onDismiss:_},e)}},n.createElement(f?c.Contrast:n.Fragment,null,n.createElement(N?i.DialogContent:"div",{"aria-labelledby":q,className:l("eds-drawer",m),onKeyDown:function(e){"Escape"===e.key&&(e.stopPropagation(),_())},style:k},n.createElement(o.MoveFocusInside,null,n.createElement("div",{className:"eds-drawer__content"},n.createElement(r.Heading3,{as:"h2",id:q},O),u),n.createElement(t.IconButton,{className:"eds-drawer__close-button",onClick:_,type:"button"},n.createElement(a.CloseIcon,{"aria-hidden":!0}),n.createElement(s.VisuallyHidden,null,v)))))):null},exports.Modal=function(l){var i,o=l.children,s=l.closeLabel,c=void 0===s?"Lukk":s,m=l.initialFocusRef,p=l.open,b=l.onDismiss,E=l.size,h=l.align,_=void 0===h?"start":h,O=l.title,k=l.closeOnClickOutside,w=void 0===k||k,N=u(l,f),q=e.useRandomId("eds-modal"),C=v[E]||r.Heading2,D=["medium","large","extraLarge"].includes(E);return b&&w&&(i=b),n.createElement(g,{open:p,onDismiss:i,initialFocusRef:m},n.createElement(y,d({size:E,align:_},N),D&&n.createElement(t.IconButton,{className:"eds-modal__close","aria-label":c,onClick:b,type:"button"},n.createElement(a.CloseIcon,null)),O&&n.createElement(C,{margin:"bottom",as:"h2",id:q},O),o))},exports.ModalContent=y,exports.ModalOverlay=g,exports.headingsMap=v;
2
2
  //# sourceMappingURL=modal.cjs.production.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"modal.cjs.production.min.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Drawer.tsx","../src/index.tsx","../src/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n"],"names":["ModalOverlay","_ref","className","open","rest","_objectWithoutPropertiesLoose","_excluded","React","createElement","DialogOverlay","_extends","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","_ref$align","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","ConditionalWrapper","_ref2","condition","wrapper","warnAboutMissingStyles","_ref$closeLabel","closeLabel","_ref$contrast","contrast","_ref$open","onDismiss","style","_ref$overlay","overlay","titleId","Contrast","Fragment","onKeyDown","e","key","stopPropagation","MoveFocusInside","IconButton","onClick","type","CloseIcon","VisuallyHidden","handleOnDismiss","initialFocusRef","_ref$closeOnClickOuts","closeOnClickOutside","showCloseButton","includes"],"mappings":"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"}
1
+ {"version":3,"file":"modal.cjs.production.min.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Drawer.tsx","../src/index.tsx","../src/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n"],"names":["ModalOverlay","_ref","className","open","rest","_objectWithoutPropertiesLoose","_excluded","React","createElement","DialogOverlay","_extends","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","_ref$align","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","ConditionalWrapper","_ref2","condition","wrapper","warnAboutMissingStyles","_ref$closeLabel","closeLabel","_ref$contrast","contrast","_ref$open","onDismiss","style","_ref$overlay","overlay","titleId","Contrast","Fragment","onKeyDown","e","key","stopPropagation","MoveFocusInside","IconButton","onClick","type","CloseIcon","VisuallyHidden","handleOnDismiss","initialFocusRef","_ref$closeOnClickOuts","closeOnClickOutside","showCloseButton","includes"],"mappings":"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"}
package/dist/modal.esm.js CHANGED
@@ -10,30 +10,22 @@ import { VisuallyHidden } from '@entur/a11y';
10
10
  import { Contrast } from '@entur/layout';
11
11
 
12
12
  function _extends() {
13
- _extends = Object.assign ? Object.assign.bind() : function (target) {
14
- for (var i = 1; i < arguments.length; i++) {
15
- var source = arguments[i];
16
- for (var key in source) {
17
- if (Object.prototype.hasOwnProperty.call(source, key)) {
18
- target[key] = source[key];
19
- }
20
- }
13
+ return _extends = Object.assign ? Object.assign.bind() : function (n) {
14
+ for (var e = 1; e < arguments.length; e++) {
15
+ var t = arguments[e];
16
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
21
17
  }
22
- return target;
23
- };
24
- return _extends.apply(this, arguments);
18
+ return n;
19
+ }, _extends.apply(null, arguments);
25
20
  }
26
- function _objectWithoutPropertiesLoose(source, excluded) {
27
- if (source == null) return {};
28
- var target = {};
29
- var sourceKeys = Object.keys(source);
30
- var key, i;
31
- for (i = 0; i < sourceKeys.length; i++) {
32
- key = sourceKeys[i];
33
- if (excluded.indexOf(key) >= 0) continue;
34
- target[key] = source[key];
21
+ function _objectWithoutPropertiesLoose(r, e) {
22
+ if (null == r) return {};
23
+ var t = {};
24
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
25
+ if (e.includes(n)) continue;
26
+ t[n] = r[n];
35
27
  }
36
- return target;
28
+ return t;
37
29
  }
38
30
 
39
31
  var _excluded$2 = ["className", "open"];
@@ -1 +1 @@
1
- {"version":3,"file":"modal.esm.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Modal.tsx","../src/Drawer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n"],"names":["ModalOverlay","className","open","rest","_excluded","React","createElement","DialogOverlay","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","Modal","closeLabel","initialFocusRef","onDismiss","closeOnClickOutside","showCloseButton","includes","handleOnDismiss","IconButton","onClick","type","CloseIcon","Drawer","contrast","style","overlay","titleId","handleKeyDown","e","key","stopPropagation","Wrapper","Contrast","Fragment","ContentContainer","ConditionalWrapper","condition","wrapper","onKeyDown","MoveFocusInside","VisuallyHidden","warnAboutMissingStyles"],"mappings":"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"}
1
+ {"version":3,"file":"modal.esm.js","sources":["../src/ModalOverlay.tsx","../src/ModalContent.tsx","../src/Modal.tsx","../src/Drawer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { DialogOverlay } from '@reach/dialog';\n\nexport type ModalOverlayProps = {\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n [key: string]: any;\n};\n\nexport const ModalOverlay: React.FC<ModalOverlayProps> = ({\n className,\n open,\n ...rest\n}) => (\n <DialogOverlay\n className={classNames('eds-modal__overlay', className)}\n isOpen={open}\n {...rest}\n />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DialogContent } from '@reach/dialog';\nimport { Heading4, Heading3, Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nexport type ModalContentProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n [key: string]: any;\n};\n\nexport const headingsMap = {\n extraSmall: Heading4,\n small: Heading3,\n medium: Heading2,\n large: Heading2,\n extraLarge: Heading2,\n};\n\nexport const ModalContent: React.FC<ModalContentProps> = ({\n children,\n className,\n size,\n title,\n align = 'start',\n ...rest\n}) => {\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const randomId = useRandomId('eds-modal');\n return (\n <DialogContent\n className={classNames(\n 'eds-modal__content',\n `eds-modal__content--size-${size}`,\n `eds-modal__content--align-${align}`,\n className,\n )}\n aria-labelledby={randomId}\n {...rest}\n >\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </DialogContent>\n );\n};\n","import React from 'react';\n\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { Heading2 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\n\nimport { ModalOverlay } from './ModalOverlay';\nimport { ModalContent, headingsMap } from './ModalContent';\n\nimport './Modal.scss';\n\nexport type ModalProps = {\n /** Innholdet i modalen */\n children: React.ReactNode;\n /** Skjermleser-label til lukk-knappen */\n closeLabel?: string;\n /** En ref til elementet som skal være fokusert når modalen åpnes. Defaulter til lukkeknappen */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /** Flagg som sier om modalen er åpen */\n open?: boolean;\n /** Callback som kalles når brukeren ber om å lukke modalen */\n onDismiss?: () => void;\n /** Størrelsen på modalen */\n size: 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';\n /** Hvordan innholdet skal plasseres i modalen\n * @default 'start'\n */\n align?: 'start' | 'center' | 'end';\n /** Tittelen som vises i modalen */\n title?: React.ReactNode;\n /** Om modalen skal lukkes når man klikker på utsiden av den\n * @default true\n */\n closeOnClickOutside?: boolean;\n [key: string]: any;\n};\n\nexport const Modal: React.FC<ModalProps> = ({\n children,\n closeLabel = 'Lukk',\n initialFocusRef,\n open,\n onDismiss,\n size,\n align = 'start',\n title,\n closeOnClickOutside = true,\n ...rest\n}) => {\n const randomId = useRandomId('eds-modal');\n const Heading: React.ElementType = headingsMap[size] || Heading2;\n const showCloseButton = ['medium', 'large', 'extraLarge'].includes(size);\n\n let handleOnDismiss;\n if (onDismiss && closeOnClickOutside) {\n handleOnDismiss = onDismiss;\n }\n return (\n <ModalOverlay\n open={open}\n onDismiss={handleOnDismiss}\n initialFocusRef={initialFocusRef}\n >\n <ModalContent size={size} align={align} {...rest}>\n {showCloseButton && (\n <IconButton\n className=\"eds-modal__close\"\n aria-label={closeLabel}\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon />\n </IconButton>\n )}\n {title && (\n <Heading margin=\"bottom\" as=\"h2\" id={randomId}>\n {title}\n </Heading>\n )}\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { MoveFocusInside } from 'react-focus-lock';\nimport { VisuallyHidden } from '@entur/a11y';\nimport { Contrast } from '@entur/layout';\nimport { CloseIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { useRandomId } from '@entur/utils';\nimport { IconButton } from '@entur/button';\n\nimport './Drawer.scss';\nimport { ModalOverlay } from './ModalOverlay';\nimport { DialogContent } from '@reach/dialog';\n\nexport type DrawerProps = {\n /** Innholdet. Typisk tekst, lenker eller knapper */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Tekst som beskriver lukkeknappen for skjermlesere\n * @default 'Lukk skuff'\n */\n closeLabel?: string;\n /** Om draweren skal vises i mørk variant\n * @default false\n */\n contrast?: boolean;\n /** Callback som kalles når brukeren ønsker å lukke draweren */\n onDismiss: () => void;\n /** Om draweren er åpen eller ikke\n * @default true\n */\n open?: boolean;\n /** Tittel på toppen av draweren */\n title: string;\n /** Styling som sendes til Drawer */\n style?: React.CSSProperties;\n /** Legger på et overlay over resten av siden */\n overlay?: boolean;\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n children,\n className,\n closeLabel = 'Lukk skuff',\n contrast = false,\n open = true,\n onDismiss,\n title,\n style,\n overlay = false,\n}) => {\n const titleId = useRandomId('eds-drawer');\n\n if (!open) {\n return null;\n }\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onDismiss();\n }\n };\n\n const Wrapper = contrast ? Contrast : React.Fragment;\n const ContentContainer = overlay ? DialogContent : 'div';\n return (\n <ConditionalWrapper\n condition={overlay}\n wrapper={(children: React.ReactNode) => (\n <ModalOverlay open={open} onDismiss={onDismiss}>\n {children}\n </ModalOverlay>\n )}\n >\n <Wrapper>\n <ContentContainer\n aria-labelledby={titleId}\n className={classNames('eds-drawer', className)}\n onKeyDown={handleKeyDown}\n style={style}\n >\n <MoveFocusInside>\n <div className=\"eds-drawer__content\">\n <Heading3 as=\"h2\" id={titleId}>\n {title}\n </Heading3>\n {children}\n </div>\n <IconButton\n className=\"eds-drawer__close-button\"\n onClick={onDismiss}\n type=\"button\"\n >\n <CloseIcon aria-hidden />\n <VisuallyHidden>{closeLabel}</VisuallyHidden>\n </IconButton>\n </MoveFocusInside>\n </ContentContainer>\n </Wrapper>\n </ConditionalWrapper>\n );\n};\n\nconst ConditionalWrapper: React.FC<{\n condition: boolean;\n wrapper: (child: JSX.Element) => JSX.Element;\n children: React.ReactElement;\n}> = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('modal', 'icons', 'typography', 'a11y', 'button');\n\nexport * from './Modal';\nexport * from './ModalOverlay';\nexport * from './ModalContent';\nexport * from './Drawer';\n"],"names":["ModalOverlay","_ref","className","open","rest","_objectWithoutPropertiesLoose","_excluded","React","createElement","DialogOverlay","_extends","classNames","isOpen","headingsMap","extraSmall","Heading4","small","Heading3","medium","Heading2","large","extraLarge","ModalContent","children","size","title","_ref$align","align","Heading","randomId","useRandomId","DialogContent","margin","as","id","Modal","_ref$closeLabel","closeLabel","initialFocusRef","onDismiss","_ref$closeOnClickOuts","closeOnClickOutside","showCloseButton","includes","handleOnDismiss","IconButton","onClick","type","CloseIcon","Drawer","_ref$contrast","contrast","_ref$open","style","_ref$overlay","overlay","titleId","handleKeyDown","e","key","stopPropagation","Wrapper","Contrast","Fragment","ContentContainer","ConditionalWrapper","condition","wrapper","onKeyDown","MoveFocusInside","VisuallyHidden","_ref2","warnAboutMissingStyles"],"mappings":"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"}
package/dist/styles.css CHANGED
@@ -1,5 +1,113 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
+ :root {
4
+ --reach-dialog: 1;
5
+ }
6
+
7
+ .eds-modal__overlay {
8
+ background: rgba(0, 0, 0, 0.5);
9
+ bottom: 0;
10
+ display: flex;
11
+ left: 0;
12
+ overflow: hidden;
13
+ position: fixed;
14
+ right: 0;
15
+ top: 0;
16
+ z-index: 30;
17
+ animation: fadeInOverlay;
18
+ animation-duration: 0.2s;
19
+ animation-timing-function: ease-in-out;
20
+ }
21
+ .eds-modal__content {
22
+ background: var(--components-modal-modal-standard-fill);
23
+ border: 1px solid var(--components-modal-modal-standard-border);
24
+ border-radius: 0.75rem;
25
+ color: var(--components-modal-modal-standard-text);
26
+ margin: auto;
27
+ padding: 1.5rem;
28
+ position: relative;
29
+ width: 100%;
30
+ max-height: 90vh;
31
+ overflow: auto;
32
+ z-index: 40;
33
+ animation: slideInContent;
34
+ animation-duration: 0.2s;
35
+ animation-timing-function: ease-in-out;
36
+ }
37
+ .eds-modal__content--align-center {
38
+ display: flex;
39
+ flex-direction: column;
40
+ align-items: center;
41
+ text-align: center;
42
+ }
43
+ .eds-modal__content--align-end {
44
+ display: flex;
45
+ flex-direction: column;
46
+ align-items: flex-end;
47
+ }
48
+ .eds-modal__content--size-extraSmall {
49
+ max-width: 21rem;
50
+ padding: 1.5rem;
51
+ }
52
+ .eds-modal__content--size-small {
53
+ max-width: 28.125rem;
54
+ padding: 2.5rem;
55
+ }
56
+ .eds-modal__content--size-medium {
57
+ max-width: 45rem;
58
+ padding: 3rem;
59
+ }
60
+ .eds-modal__content--size-large {
61
+ max-width: 56.25rem;
62
+ padding: 3rem;
63
+ }
64
+ .eds-modal__content--size-extraLarge {
65
+ max-width: 78.75rem;
66
+ padding: 3rem;
67
+ }
68
+ .eds-modal__content::-webkit-scrollbar {
69
+ width: 16px;
70
+ }
71
+ .eds-modal__content::-webkit-scrollbar-track {
72
+ margin-top: 0.5rem;
73
+ margin-bottom: 0.5rem;
74
+ }
75
+ .eds-modal__content::-webkit-scrollbar-thumb {
76
+ background-color: lightgrey;
77
+ border: 4px solid transparent;
78
+ border-radius: 8px;
79
+ background-clip: padding-box;
80
+ }
81
+ .eds-modal__content::-webkit-scrollbar-thumb:hover {
82
+ background-color: grey;
83
+ }
84
+ .eds-modal__close {
85
+ position: absolute;
86
+ top: 1rem;
87
+ right: 1rem;
88
+ color: var(--components-modal-modal-standard-icon);
89
+ }
90
+
91
+ @keyframes fadeInOverlay {
92
+ from {
93
+ opacity: 0;
94
+ }
95
+ to {
96
+ opacity: 1;
97
+ }
98
+ }
99
+ @keyframes slideInContent {
100
+ from {
101
+ top: 5rem;
102
+ opacity: 0;
103
+ }
104
+ to {
105
+ top: 0%;
106
+ opacity: 1;
107
+ }
108
+ }
109
+ /* DO NOT CHANGE!*/
110
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
111
  /* DO NOT CHANGE!*/
4
112
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
5
113
  /* DO NOT CHANGE!*/
@@ -175,114 +283,6 @@
175
283
  }
176
284
  /* DO NOT CHANGE!*/
177
285
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
178
- :root {
179
- --reach-dialog: 1;
180
- }
181
-
182
- .eds-modal__overlay {
183
- background: rgba(0, 0, 0, 0.5);
184
- bottom: 0;
185
- display: flex;
186
- left: 0;
187
- overflow: hidden;
188
- position: fixed;
189
- right: 0;
190
- top: 0;
191
- z-index: 30;
192
- animation: fadeInOverlay;
193
- animation-duration: 0.2s;
194
- animation-timing-function: ease-in-out;
195
- }
196
- .eds-modal__content {
197
- background: var(--components-modal-modal-standard-fill);
198
- border: 1px solid var(--components-modal-modal-standard-border);
199
- border-radius: 0.75rem;
200
- color: var(--components-modal-modal-standard-text);
201
- margin: auto;
202
- padding: 1.5rem;
203
- position: relative;
204
- width: 100%;
205
- max-height: 90vh;
206
- overflow: auto;
207
- z-index: 40;
208
- animation: slideInContent;
209
- animation-duration: 0.2s;
210
- animation-timing-function: ease-in-out;
211
- }
212
- .eds-modal__content--align-center {
213
- display: flex;
214
- flex-direction: column;
215
- align-items: center;
216
- text-align: center;
217
- }
218
- .eds-modal__content--align-end {
219
- display: flex;
220
- flex-direction: column;
221
- align-items: flex-end;
222
- }
223
- .eds-modal__content--size-extraSmall {
224
- max-width: 21rem;
225
- padding: 1.5rem;
226
- }
227
- .eds-modal__content--size-small {
228
- max-width: 28.125rem;
229
- padding: 2.5rem;
230
- }
231
- .eds-modal__content--size-medium {
232
- max-width: 45rem;
233
- padding: 3rem;
234
- }
235
- .eds-modal__content--size-large {
236
- max-width: 56.25rem;
237
- padding: 3rem;
238
- }
239
- .eds-modal__content--size-extraLarge {
240
- max-width: 78.75rem;
241
- padding: 3rem;
242
- }
243
- .eds-modal__content::-webkit-scrollbar {
244
- width: 16px;
245
- }
246
- .eds-modal__content::-webkit-scrollbar-track {
247
- margin-top: 0.5rem;
248
- margin-bottom: 0.5rem;
249
- }
250
- .eds-modal__content::-webkit-scrollbar-thumb {
251
- background-color: lightgrey;
252
- border: 4px solid transparent;
253
- border-radius: 8px;
254
- background-clip: padding-box;
255
- }
256
- .eds-modal__content::-webkit-scrollbar-thumb:hover {
257
- background-color: grey;
258
- }
259
- .eds-modal__close {
260
- position: absolute;
261
- top: 1rem;
262
- right: 1rem;
263
- color: var(--components-modal-modal-standard-icon);
264
- }
265
-
266
- @keyframes fadeInOverlay {
267
- from {
268
- opacity: 0;
269
- }
270
- to {
271
- opacity: 1;
272
- }
273
- }
274
- @keyframes slideInContent {
275
- from {
276
- top: 5rem;
277
- opacity: 0;
278
- }
279
- to {
280
- top: 0%;
281
- opacity: 1;
282
- }
283
- }
284
- /* DO NOT CHANGE!*/
285
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
286
286
  .eds-drawer {
287
287
  animation: slideFromRight forwards ease-out 0.1s;
288
288
  background-color: var(--components-modal-drawer-standard-background);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/modal",
3
- "version": "1.7.56",
3
+ "version": "1.7.58-RC.0",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/modal.esm.js",
@@ -27,16 +27,19 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/a11y": "^0.2.93",
31
- "@entur/button": "^3.2.35",
32
- "@entur/icons": "^7.4.3",
33
- "@entur/layout": "^2.3.19",
34
- "@entur/tokens": "^3.17.3",
35
- "@entur/typography": "^1.8.48",
36
- "@entur/utils": "^0.12.1",
30
+ "@entur/a11y": "^0.2.94-RC.0",
31
+ "@entur/button": "^3.2.37-RC.0",
32
+ "@entur/icons": "^7.5.1-RC.0",
33
+ "@entur/layout": "^2.3.21-RC.0",
34
+ "@entur/tokens": "^3.17.4-RC.0",
35
+ "@entur/typography": "^1.8.50-RC.0",
36
+ "@entur/utils": "^0.12.2-RC.0",
37
37
  "@reach/dialog": "^0.16.0",
38
38
  "classnames": "^2.3.1",
39
39
  "react-focus-lock": "^2.9.1"
40
40
  },
41
- "gitHead": "214480c52396a9b6f7133bdb21c81986e69c5ec4"
41
+ "devDependencies": {
42
+ "dts-cli": "2.0.5"
43
+ },
44
+ "gitHead": "d7913682a41ade219cbd4dfc6e45060152c7fa0a"
42
45
  }