@navikt/ds-react 5.9.1 → 5.9.2

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.
@@ -44,7 +44,10 @@ const DateWrapper = ({ open, children, onClose, anchor, locale, variant, popover
44
44
  "navds-date": variant === "month",
45
45
  }), flip: false }, popoverProps), children));
46
46
  }
47
- return (react_1.default.createElement(modal_1.Modal, { ref: modalRef, open: open, onClose: onClose, "aria-label": (0, labels_1.modalLabel)(locale, variant), className: (0, clsx_1.default)("navds-date__modal", {
47
+ return (react_1.default.createElement(modal_1.Modal, { ref: modalRef, open: open, onClose: (event) => {
48
+ event.stopPropagation();
49
+ onClose();
50
+ }, "aria-label": (0, labels_1.modalLabel)(locale, variant), className: (0, clsx_1.default)("navds-date__modal", {
48
51
  "navds-date__nested-modal": isInModal,
49
52
  "navds-date": variant === "month",
50
53
  }), closeOnBackdropClick: true },
@@ -15,7 +15,10 @@ export const DateWrapper = ({ open, children, onClose, anchor, locale, variant,
15
15
  "navds-date": variant === "month",
16
16
  }), flip: false }, popoverProps), children));
17
17
  }
18
- return (React.createElement(Modal, { ref: modalRef, open: open, onClose: onClose, "aria-label": modalLabel(locale, variant), className: cl("navds-date__modal", {
18
+ return (React.createElement(Modal, { ref: modalRef, open: open, onClose: (event) => {
19
+ event.stopPropagation();
20
+ onClose();
21
+ }, "aria-label": modalLabel(locale, variant), className: cl("navds-date__modal", {
19
22
  "navds-date__nested-modal": isInModal,
20
23
  "navds-date": variant === "month",
21
24
  }), closeOnBackdropClick: true },
@@ -1 +1 @@
1
- {"version":3,"file":"DateWrapper.js","sourceRoot":"","sources":["../../../src/date/parts/DateWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAepE,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,MAAM,EACN,MAAM,EACN,OAAO,EACP,YAAY,GACK,EAAE,EAAE;IACrB,MAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,UAAU,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,SAAS,GACb,QAAQ,CAAC,+BAA+B,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;IAEhE,IAAI,SAAS,EAAE;QACb,OAAO,CACL,oBAAC,OAAO,kBACN,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,MAAM,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE;gBACnC,YAAY,EAAE,OAAO,KAAK,OAAO;aAClC,CAAC,EACF,IAAI,EAAE,KAAK,IACP,YAAY,GAEf,QAAQ,CACD,CACX,CAAC;KACH;IACD,OAAO,CACL,oBAAC,KAAK,IACJ,GAAG,EAAE,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,gBACJ,UAAU,CAAC,MAAM,EAAE,OAAO,CAAC,EACvC,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE;YACjC,0BAA0B,EAAE,SAAS;YACrC,YAAY,EAAE,OAAO,KAAK,OAAO;SAClC,CAAC,EACF,oBAAoB;QAEpB,6BAAK,SAAS,EAAC,wBAAwB;YACpC,QAAQ;YACT,oBAAC,MAAM,IACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,0CAAE,KAAK,EAAE,CAAA,EAAA,EACzC,IAAI,EAAC,OAAO,IAEX,qBAAqB,CAAC,MAAM,CAAC,CACvB,CACL,CACA,CACT,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"DateWrapper.js","sourceRoot":"","sources":["../../../src/date/parts/DateWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAepE,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,MAAM,EACN,MAAM,EACN,OAAO,EACP,YAAY,GACK,EAAE,EAAE;IACrB,MAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,UAAU,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,SAAS,GACb,QAAQ,CAAC,+BAA+B,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;IAEhE,IAAI,SAAS,EAAE;QACb,OAAO,CACL,oBAAC,OAAO,kBACN,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,MAAM,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE;gBACnC,YAAY,EAAE,OAAO,KAAK,OAAO;aAClC,CAAC,EACF,IAAI,EAAE,KAAK,IACP,YAAY,GAEf,QAAQ,CACD,CACX,CAAC;KACH;IACD,OAAO,CACL,oBAAC,KAAK,IACJ,GAAG,EAAE,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;YACjB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO,EAAE,CAAC;QACZ,CAAC,gBACW,UAAU,CAAC,MAAM,EAAE,OAAO,CAAC,EACvC,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE;YACjC,0BAA0B,EAAE,SAAS;YACrC,YAAY,EAAE,OAAO,KAAK,OAAO;SAClC,CAAC,EACF,oBAAoB;QAEpB,6BAAK,SAAS,EAAC,wBAAwB;YACpC,QAAQ;YACT,oBAAC,MAAM,IACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,GAAG,EAAE,WAAC,OAAA,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,0CAAE,KAAK,EAAE,CAAA,EAAA,EACzC,IAAI,EAAC,OAAO,IAEX,qBAAqB,CAAC,MAAM,CAAC,CACvB,CACL,CACA,CACT,CAAC;AACJ,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@navikt/ds-react",
3
- "version": "5.9.1",
3
+ "version": "5.9.2",
4
4
  "description": "Aksel react-components for NAV designsystem",
5
5
  "author": "Aksel | NAV designsystem team",
6
6
  "license": "MIT",
@@ -38,8 +38,8 @@
38
38
  },
39
39
  "dependencies": {
40
40
  "@floating-ui/react": "0.25.4",
41
- "@navikt/aksel-icons": "^5.9.1",
42
- "@navikt/ds-tokens": "^5.9.1",
41
+ "@navikt/aksel-icons": "^5.9.2",
42
+ "@navikt/ds-tokens": "^5.9.2",
43
43
  "@radix-ui/react-tabs": "1.0.0",
44
44
  "@radix-ui/react-toggle-group": "1.0.0",
45
45
  "clsx": "^1.2.1",
@@ -437,28 +437,36 @@ export const ModalDemo = () => {
437
437
  toDate: new Date("Feb 23 2024"),
438
438
  onDateChange: console.log,
439
439
  });
440
+ const [open, setOpen] = useState(true);
440
441
 
441
442
  return (
442
- <Modal open header={{ heading: "Modal-demo" }}>
443
- <Modal.Body style={{ position: "relative" }}>
444
- <BodyLong spacing>
445
- Lorem ipsum dolor sit, amet consectetur adipisicing elit.
446
- </BodyLong>
447
-
448
- <DatePicker {...datepickerProps} dropdownCaption>
449
- <DatePicker.Input
450
- {...inputProps}
451
- label="Velg dato"
452
- description="Format: dd.mm.yyyy"
453
- />
454
- </DatePicker>
455
- </Modal.Body>
456
- <Modal.Footer>
457
- <Button>Neste</Button>
458
- <Button variant="secondary">Tilbake</Button>
459
- <Button variant="tertiary">Avbryt</Button>
460
- </Modal.Footer>
461
- </Modal>
443
+ <>
444
+ <Button onClick={() => setOpen(!open)}>Open modal</Button>
445
+ <Modal
446
+ open={open}
447
+ onClose={() => setOpen(false)}
448
+ header={{ heading: "Modal-demo" }}
449
+ >
450
+ <Modal.Body style={{ position: "relative" }}>
451
+ <BodyLong spacing>
452
+ Lorem ipsum dolor sit, amet consectetur adipisicing elit.
453
+ </BodyLong>
454
+
455
+ <DatePicker {...datepickerProps} dropdownCaption>
456
+ <DatePicker.Input
457
+ {...inputProps}
458
+ label="Velg dato"
459
+ description="Format: dd.mm.yyyy"
460
+ />
461
+ </DatePicker>
462
+ </Modal.Body>
463
+ <Modal.Footer>
464
+ <Button>Neste</Button>
465
+ <Button variant="secondary">Tilbake</Button>
466
+ <Button variant="tertiary">Avbryt</Button>
467
+ </Modal.Footer>
468
+ </Modal>
469
+ </>
462
470
  );
463
471
  };
464
472
  ModalDemo.parameters = { chromatic: { pauseAnimationAtEnd: true } };
@@ -57,7 +57,10 @@ export const DateWrapper = ({
57
57
  <Modal
58
58
  ref={modalRef}
59
59
  open={open}
60
- onClose={onClose}
60
+ onClose={(event) => {
61
+ event.stopPropagation();
62
+ onClose();
63
+ }}
61
64
  aria-label={modalLabel(locale, variant)}
62
65
  className={cl("navds-date__modal", {
63
66
  "navds-date__nested-modal": isInModal,