@digdir/designsystemet-react 0.56.3-alpha.0 → 0.56.3-alpha.1
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/dist/cjs/components/DropdownMenu/DropdownMenuTrigger.js +4 -2
- package/dist/cjs/components/Modal/ModalTrigger/ModalTrigger.js +4 -2
- package/dist/cjs/components/Popover/PopoverTrigger.js +5 -3
- package/dist/cjs/hooks/useMediaQuery.js +7 -1
- package/dist/cjs/react-css-modules.css +2 -1
- package/dist/esm/components/DropdownMenu/DropdownMenuTrigger.js +4 -2
- package/dist/esm/components/Modal/ModalTrigger/ModalTrigger.js +4 -2
- package/dist/esm/components/Popover/PopoverTrigger.js +5 -3
- package/dist/esm/hooks/useMediaQuery.js +7 -1
- package/dist/esm/react-css-modules.css +2 -1
- package/dist/types/components/DropdownMenu/DropdownMenuTrigger.d.ts.map +1 -1
- package/dist/types/components/Modal/ModalTrigger/ModalTrigger.d.ts.map +1 -1
- package/dist/types/components/Popover/PopoverTrigger.d.ts.map +1 -1
- package/dist/types/hooks/useMediaQuery.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -4,13 +4,15 @@
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var floatingUi_react = require('../../node_modules/@floating-ui/react/dist/floating-ui.react.js');
|
|
7
|
+
var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
|
|
7
8
|
var DropdownMenu = require('./DropdownMenu.js');
|
|
8
9
|
var Button = require('../Button/Button.js');
|
|
9
10
|
|
|
10
|
-
const DropdownMenuTrigger = React.forwardRef(({ ...rest }, ref) => {
|
|
11
|
+
const DropdownMenuTrigger = React.forwardRef(({ asChild, ...rest }, ref) => {
|
|
11
12
|
const { triggerRef, internalOpen, setInternalOpen, isControlled } = React.useContext(DropdownMenu.DropdownMenuContext);
|
|
12
13
|
const mergedRefs = floatingUi_react.useMergeRefs([ref, triggerRef]);
|
|
13
|
-
|
|
14
|
+
const Component = asChild ? index.Slot : Button.Button;
|
|
15
|
+
return (jsxRuntime.jsx(Component, { ref: mergedRefs, onClick: () => {
|
|
14
16
|
if (!isControlled)
|
|
15
17
|
setInternalOpen(!internalOpen);
|
|
16
18
|
}, "aria-haspopup": 'menu', "aria-expanded": internalOpen, ...rest }));
|
|
@@ -3,12 +3,14 @@
|
|
|
3
3
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var index = require('../../../node_modules/@radix-ui/react-slot/dist/index.js');
|
|
6
7
|
var ModalRoot = require('../ModalRoot.js');
|
|
7
8
|
var Button = require('../../Button/Button.js');
|
|
8
9
|
|
|
9
|
-
const ModalTrigger = React.forwardRef(({ ...rest }, ref) => {
|
|
10
|
+
const ModalTrigger = React.forwardRef(({ asChild, ...rest }, ref) => {
|
|
10
11
|
const { modalRef, open } = React.useContext(ModalRoot.ModalContext);
|
|
11
|
-
|
|
12
|
+
const Component = asChild ? index.Slot : Button.Button;
|
|
13
|
+
return (jsxRuntime.jsx(Component, { ref: ref, onClick: () => modalRef?.current?.showModal(), "aria-expanded": open, "aria-haspopup": 'dialog', ...rest }));
|
|
12
14
|
});
|
|
13
15
|
ModalTrigger.displayName = 'ModalTrigger';
|
|
14
16
|
|
|
@@ -4,19 +4,21 @@
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var floatingUi_react = require('../../node_modules/@floating-ui/react/dist/floating-ui.react.js');
|
|
7
|
+
var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
|
|
7
8
|
var Popover = require('./Popover.js');
|
|
8
9
|
var Button = require('../Button/Button.js');
|
|
9
10
|
|
|
10
|
-
const PopoverTrigger = React.forwardRef(({ id, ...rest }, ref) => {
|
|
11
|
+
const PopoverTrigger = React.forwardRef(({ id, asChild, ...rest }, ref) => {
|
|
11
12
|
const { triggerRef, internalOpen, setInternalOpen, isControlled, popoverId, triggerId, setTriggerId, } = React.useContext(Popover.PopoverContext);
|
|
12
13
|
const mergedRefs = floatingUi_react.useMergeRefs([ref, triggerRef]);
|
|
13
14
|
React.useEffect(() => {
|
|
14
15
|
id && setTriggerId?.(id);
|
|
15
16
|
}, [id, setTriggerId]);
|
|
16
|
-
|
|
17
|
+
const Component = asChild ? index.Slot : Button.Button;
|
|
18
|
+
return (jsxRuntime.jsx(Component, { ref: mergedRefs, onClick: () => {
|
|
17
19
|
if (!isControlled)
|
|
18
20
|
setInternalOpen(!internalOpen);
|
|
19
|
-
}, "aria-expanded": internalOpen,
|
|
21
|
+
}, "aria-expanded": internalOpen, "aria-controls": internalOpen ? popoverId : undefined, id: triggerId, ...rest }));
|
|
20
22
|
});
|
|
21
23
|
PopoverTrigger.displayName = 'PopoverTrigger';
|
|
22
24
|
|
|
@@ -4,7 +4,13 @@
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
|
|
6
6
|
function useMediaQuery(query) {
|
|
7
|
-
const getMatches = (query) =>
|
|
7
|
+
const getMatches = (query) => {
|
|
8
|
+
/* Check if window is defined, if not - return false */
|
|
9
|
+
if (typeof window === 'undefined') {
|
|
10
|
+
return false;
|
|
11
|
+
}
|
|
12
|
+
return window?.matchMedia(query).matches ?? false;
|
|
13
|
+
};
|
|
8
14
|
const [matches, setMatches] = React.useState(getMatches(query));
|
|
9
15
|
const eventListener = () => {
|
|
10
16
|
setMatches(getMatches(query));
|
|
@@ -1406,7 +1406,8 @@
|
|
|
1406
1406
|
}
|
|
1407
1407
|
|
|
1408
1408
|
.fds-pagination-listitem-ddc0278f:where(.fds-pagination-compact-ddc0278f) {
|
|
1409
|
-
--fsdc-pagination-listitem-margin: var(--fds-spacing-
|
|
1409
|
+
--fsdc-pagination-listitem-margin: var(--fds-spacing-0);
|
|
1410
|
+
--fdsc-pagination-chevron-margin: var(--fds-spacing-1);
|
|
1410
1411
|
}
|
|
1411
1412
|
|
|
1412
1413
|
.fds-pagination-pagination-ddc0278f .fds-pagination-ellipsis-ddc0278f {
|
|
@@ -2,13 +2,15 @@
|
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { forwardRef, useContext } from 'react';
|
|
4
4
|
import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
|
|
5
|
+
import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
|
|
5
6
|
import { DropdownMenuContext } from './DropdownMenu.js';
|
|
6
7
|
import { Button } from '../Button/Button.js';
|
|
7
8
|
|
|
8
|
-
const DropdownMenuTrigger = forwardRef(({ ...rest }, ref) => {
|
|
9
|
+
const DropdownMenuTrigger = forwardRef(({ asChild, ...rest }, ref) => {
|
|
9
10
|
const { triggerRef, internalOpen, setInternalOpen, isControlled } = useContext(DropdownMenuContext);
|
|
10
11
|
const mergedRefs = useMergeRefs([ref, triggerRef]);
|
|
11
|
-
|
|
12
|
+
const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : Button;
|
|
13
|
+
return (jsx(Component, { ref: mergedRefs, onClick: () => {
|
|
12
14
|
if (!isControlled)
|
|
13
15
|
setInternalOpen(!internalOpen);
|
|
14
16
|
}, "aria-haspopup": 'menu', "aria-expanded": internalOpen, ...rest }));
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { forwardRef, useContext } from 'react';
|
|
4
|
+
import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../../node_modules/@radix-ui/react-slot/dist/index.js';
|
|
4
5
|
import { ModalContext } from '../ModalRoot.js';
|
|
5
6
|
import { Button } from '../../Button/Button.js';
|
|
6
7
|
|
|
7
|
-
const ModalTrigger = forwardRef(({ ...rest }, ref) => {
|
|
8
|
+
const ModalTrigger = forwardRef(({ asChild, ...rest }, ref) => {
|
|
8
9
|
const { modalRef, open } = useContext(ModalContext);
|
|
9
|
-
|
|
10
|
+
const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : Button;
|
|
11
|
+
return (jsx(Component, { ref: ref, onClick: () => modalRef?.current?.showModal(), "aria-expanded": open, "aria-haspopup": 'dialog', ...rest }));
|
|
10
12
|
});
|
|
11
13
|
ModalTrigger.displayName = 'ModalTrigger';
|
|
12
14
|
|
|
@@ -2,19 +2,21 @@
|
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { forwardRef, useContext, useEffect } from 'react';
|
|
4
4
|
import { useMergeRefs } from '../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
|
|
5
|
+
import { Slot as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
|
|
5
6
|
import { PopoverContext } from './Popover.js';
|
|
6
7
|
import { Button } from '../Button/Button.js';
|
|
7
8
|
|
|
8
|
-
const PopoverTrigger = forwardRef(({ id, ...rest }, ref) => {
|
|
9
|
+
const PopoverTrigger = forwardRef(({ id, asChild, ...rest }, ref) => {
|
|
9
10
|
const { triggerRef, internalOpen, setInternalOpen, isControlled, popoverId, triggerId, setTriggerId, } = useContext(PopoverContext);
|
|
10
11
|
const mergedRefs = useMergeRefs([ref, triggerRef]);
|
|
11
12
|
useEffect(() => {
|
|
12
13
|
id && setTriggerId?.(id);
|
|
13
14
|
}, [id, setTriggerId]);
|
|
14
|
-
|
|
15
|
+
const Component = asChild ? $5e63c961fc1ce211$export$8c6ed5c666ac1360 : Button;
|
|
16
|
+
return (jsx(Component, { ref: mergedRefs, onClick: () => {
|
|
15
17
|
if (!isControlled)
|
|
16
18
|
setInternalOpen(!internalOpen);
|
|
17
|
-
}, "aria-expanded": internalOpen,
|
|
19
|
+
}, "aria-expanded": internalOpen, "aria-controls": internalOpen ? popoverId : undefined, id: triggerId, ...rest }));
|
|
18
20
|
});
|
|
19
21
|
PopoverTrigger.displayName = 'PopoverTrigger';
|
|
20
22
|
|
|
@@ -2,7 +2,13 @@
|
|
|
2
2
|
import { useState, useEffect } from 'react';
|
|
3
3
|
|
|
4
4
|
function useMediaQuery(query) {
|
|
5
|
-
const getMatches = (query) =>
|
|
5
|
+
const getMatches = (query) => {
|
|
6
|
+
/* Check if window is defined, if not - return false */
|
|
7
|
+
if (typeof window === 'undefined') {
|
|
8
|
+
return false;
|
|
9
|
+
}
|
|
10
|
+
return window?.matchMedia(query).matches ?? false;
|
|
11
|
+
};
|
|
6
12
|
const [matches, setMatches] = useState(getMatches(query));
|
|
7
13
|
const eventListener = () => {
|
|
8
14
|
setMatches(getMatches(query));
|
|
@@ -1406,7 +1406,8 @@
|
|
|
1406
1406
|
}
|
|
1407
1407
|
|
|
1408
1408
|
.fds-pagination-listitem-ddc0278f:where(.fds-pagination-compact-ddc0278f) {
|
|
1409
|
-
--fsdc-pagination-listitem-margin: var(--fds-spacing-
|
|
1409
|
+
--fsdc-pagination-listitem-margin: var(--fds-spacing-0);
|
|
1410
|
+
--fdsc-pagination-chevron-margin: var(--fds-spacing-1);
|
|
1410
1411
|
}
|
|
1411
1412
|
|
|
1412
1413
|
.fds-pagination-pagination-ddc0278f .fds-pagination-ellipsis-ddc0278f {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuTrigger.d.ts","sourceRoot":"","sources":["../../../../src/components/DropdownMenu/DropdownMenuTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuTrigger.d.ts","sourceRoot":"","sources":["../../../../src/components/DropdownMenu/DropdownMenuTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAInC,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,qBAAqB,CAChE,OAAO,MAAM,CACd,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;4NAqB9B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalTrigger.d.ts","sourceRoot":"","sources":["../../../../../src/components/Modal/ModalTrigger/ModalTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ModalTrigger.d.ts","sourceRoot":"","sources":["../../../../../src/components/Modal/ModalTrigger/ModalTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAGpC,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtC,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,MAAM,CAAC,CAAC;AAE3E,eAAO,MAAM,YAAY;;;;;;;;;4NAexB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverTrigger.d.ts","sourceRoot":"","sources":["../../../../src/components/Popover/PopoverTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"PopoverTrigger.d.ts","sourceRoot":"","sources":["../../../../src/components/Popover/PopoverTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAInC,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,MAAM,CAAC,CAAC;AAE7E,eAAO,MAAM,cAAc;;;;;;;;;4NAkCzB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../../src/hooks/useMediaQuery.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,
|
|
1
|
+
{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../../src/hooks/useMediaQuery.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAwBpD"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@digdir/designsystemet-react",
|
|
3
|
-
"version": "0.56.3-alpha.
|
|
3
|
+
"version": "0.56.3-alpha.1",
|
|
4
4
|
"description": "React components for Designsystemet",
|
|
5
5
|
"author": "Designsystemet team",
|
|
6
6
|
"repository": "https://github.com/digdir/designsystemet",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"rollup": "^4.12.1",
|
|
44
44
|
"typescript": "^5.4.2"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "42b28e0a196bed6cfb2f0b64feb6a1fdf635ec57"
|
|
47
47
|
}
|