@obosbbl/grunnmuren-react 2.0.0-canary.16 → 2.0.0-canary.17
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/index.mjs +10 -7
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -50,16 +50,18 @@ const Footer = (props)=>/*#__PURE__*/ jsx("div", {
|
|
|
50
50
|
});
|
|
51
51
|
|
|
52
52
|
function Accordion(props, ref) {
|
|
53
|
-
const { children, ...restProps } = props;
|
|
53
|
+
const { children, className, ...restProps } = props;
|
|
54
54
|
const childCount = Children.count(children);
|
|
55
55
|
return /*#__PURE__*/ jsx("div", {
|
|
56
56
|
...restProps,
|
|
57
57
|
ref: ref,
|
|
58
|
+
className: cx('rounded-lg bg-white', className),
|
|
58
59
|
children: Children.map(children, (child, index)=>/*#__PURE__*/ jsxs(Fragment, {
|
|
59
60
|
children: [
|
|
60
61
|
child,
|
|
61
|
-
index < childCount - 1 &&
|
|
62
|
-
|
|
62
|
+
index < childCount - 1 && // Margin is added to enable support for containers with a background color
|
|
63
|
+
/*#__PURE__*/ jsx("hr", {
|
|
64
|
+
className: "mx-2 border-gray-light",
|
|
63
65
|
"aria-hidden": true
|
|
64
66
|
})
|
|
65
67
|
]
|
|
@@ -99,7 +101,7 @@ function AccordionItem(props, ref) {
|
|
|
99
101
|
};
|
|
100
102
|
return /*#__PURE__*/ jsx("div", {
|
|
101
103
|
...restProps,
|
|
102
|
-
className: cx('group relative', className),
|
|
104
|
+
className: cx('group relative px-2', className),
|
|
103
105
|
ref: ref,
|
|
104
106
|
"data-open": isOpen,
|
|
105
107
|
children: /*#__PURE__*/ jsx(Provider, {
|
|
@@ -107,14 +109,15 @@ function AccordionItem(props, ref) {
|
|
|
107
109
|
[
|
|
108
110
|
HeadingContext,
|
|
109
111
|
{
|
|
110
|
-
|
|
112
|
+
// Negative margin to strech the button to the entire with of the accordion (to support containers with a background color)
|
|
113
|
+
className: 'font-semibold leading-7 -mx-2',
|
|
111
114
|
// Supply a default level here to make this typecheck ok. Will be overwritten with the consumers set heading level anyways
|
|
112
115
|
level: 3,
|
|
113
116
|
_innerWrapper: (children)=>/*#__PURE__*/ jsxs("button", {
|
|
114
117
|
"aria-controls": contentId,
|
|
115
118
|
"aria-expanded": isOpen,
|
|
116
|
-
//
|
|
117
|
-
className: "
|
|
119
|
+
// Use outline with offset as focus indicator, this does not cover the left mint border on the expanded content and works with or without a background color on the accordion container
|
|
120
|
+
className: "flex min-h-[44px] w-full items-center justify-between gap-1.5 rounded-lg px-2 py-3.5 text-left focus-visible:outline focus-visible:outline-4 focus-visible:outline-offset-[-6px] focus-visible:outline-black",
|
|
118
121
|
id: buttonId,
|
|
119
122
|
onClick: handleOpenChange,
|
|
120
123
|
children: [
|