@radix-ui/react-accordion 1.2.0-rc.2 → 1.2.0-rc.4
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.d.mts +8 -9
- package/dist/index.d.ts +8 -9
- package/dist/index.js +319 -326
- package/dist/index.js.map +4 -4
- package/dist/index.mjs +0 -21
- package/dist/index.mjs.map +2 -2
- package/package.json +12 -12
package/dist/index.d.mts
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
-
import * as Radix from '@radix-ui/react-primitive';
|
|
4
3
|
import { Primitive } from '@radix-ui/react-primitive';
|
|
5
4
|
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
|
|
6
5
|
|
|
7
|
-
|
|
6
|
+
type Scope<C = any> = {
|
|
8
7
|
[scopeName: string]: React.Context<C>[];
|
|
9
8
|
} | undefined;
|
|
10
|
-
|
|
9
|
+
type ScopeHook = (scope: Scope) => {
|
|
11
10
|
[__scopeProp: string]: Scope;
|
|
12
11
|
};
|
|
13
12
|
interface CreateScope {
|
|
@@ -15,7 +14,7 @@ interface CreateScope {
|
|
|
15
14
|
(): ScopeHook;
|
|
16
15
|
}
|
|
17
16
|
|
|
18
|
-
|
|
17
|
+
type Direction = 'ltr' | 'rtl';
|
|
19
18
|
declare const createAccordionScope: CreateScope;
|
|
20
19
|
interface AccordionSingleProps extends AccordionImplSingleProps {
|
|
21
20
|
type: 'single';
|
|
@@ -59,7 +58,7 @@ interface AccordionImplMultipleProps extends AccordionImplProps {
|
|
|
59
58
|
*/
|
|
60
59
|
onValueChange?(value: string[]): void;
|
|
61
60
|
}
|
|
62
|
-
|
|
61
|
+
type PrimitiveDivProps = React__default.ComponentPropsWithoutRef<typeof Primitive.div>;
|
|
63
62
|
interface AccordionImplProps extends PrimitiveDivProps {
|
|
64
63
|
/**
|
|
65
64
|
* Whether or not an accordion is disabled from user interaction.
|
|
@@ -77,7 +76,7 @@ interface AccordionImplProps extends PrimitiveDivProps {
|
|
|
77
76
|
*/
|
|
78
77
|
dir?: Direction;
|
|
79
78
|
}
|
|
80
|
-
|
|
79
|
+
type CollapsibleProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;
|
|
81
80
|
interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {
|
|
82
81
|
/**
|
|
83
82
|
* Whether or not an accordion item is disabled from user interaction.
|
|
@@ -94,7 +93,7 @@ interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpe
|
|
|
94
93
|
* `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.
|
|
95
94
|
*/
|
|
96
95
|
declare const AccordionItem: React__default.ForwardRefExoticComponent<AccordionItemProps & React__default.RefAttributes<HTMLDivElement>>;
|
|
97
|
-
|
|
96
|
+
type PrimitiveHeading3Props = React__default.ComponentPropsWithoutRef<typeof Primitive.h3>;
|
|
98
97
|
interface AccordionHeaderProps extends PrimitiveHeading3Props {
|
|
99
98
|
}
|
|
100
99
|
/**
|
|
@@ -102,7 +101,7 @@ interface AccordionHeaderProps extends PrimitiveHeading3Props {
|
|
|
102
101
|
* whether or not its content is collapsed.
|
|
103
102
|
*/
|
|
104
103
|
declare const AccordionHeader: React__default.ForwardRefExoticComponent<AccordionHeaderProps & React__default.RefAttributes<HTMLHeadingElement>>;
|
|
105
|
-
|
|
104
|
+
type CollapsibleTriggerProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;
|
|
106
105
|
interface AccordionTriggerProps extends CollapsibleTriggerProps {
|
|
107
106
|
}
|
|
108
107
|
/**
|
|
@@ -110,7 +109,7 @@ interface AccordionTriggerProps extends CollapsibleTriggerProps {
|
|
|
110
109
|
* should always be nested inside of an `AccordionHeader`.
|
|
111
110
|
*/
|
|
112
111
|
declare const AccordionTrigger: React__default.ForwardRefExoticComponent<AccordionTriggerProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
113
|
-
|
|
112
|
+
type CollapsibleContentProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;
|
|
114
113
|
interface AccordionContentProps extends CollapsibleContentProps {
|
|
115
114
|
}
|
|
116
115
|
/**
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
-
import * as Radix from '@radix-ui/react-primitive';
|
|
4
3
|
import { Primitive } from '@radix-ui/react-primitive';
|
|
5
4
|
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
|
|
6
5
|
|
|
7
|
-
|
|
6
|
+
type Scope<C = any> = {
|
|
8
7
|
[scopeName: string]: React.Context<C>[];
|
|
9
8
|
} | undefined;
|
|
10
|
-
|
|
9
|
+
type ScopeHook = (scope: Scope) => {
|
|
11
10
|
[__scopeProp: string]: Scope;
|
|
12
11
|
};
|
|
13
12
|
interface CreateScope {
|
|
@@ -15,7 +14,7 @@ interface CreateScope {
|
|
|
15
14
|
(): ScopeHook;
|
|
16
15
|
}
|
|
17
16
|
|
|
18
|
-
|
|
17
|
+
type Direction = 'ltr' | 'rtl';
|
|
19
18
|
declare const createAccordionScope: CreateScope;
|
|
20
19
|
interface AccordionSingleProps extends AccordionImplSingleProps {
|
|
21
20
|
type: 'single';
|
|
@@ -59,7 +58,7 @@ interface AccordionImplMultipleProps extends AccordionImplProps {
|
|
|
59
58
|
*/
|
|
60
59
|
onValueChange?(value: string[]): void;
|
|
61
60
|
}
|
|
62
|
-
|
|
61
|
+
type PrimitiveDivProps = React__default.ComponentPropsWithoutRef<typeof Primitive.div>;
|
|
63
62
|
interface AccordionImplProps extends PrimitiveDivProps {
|
|
64
63
|
/**
|
|
65
64
|
* Whether or not an accordion is disabled from user interaction.
|
|
@@ -77,7 +76,7 @@ interface AccordionImplProps extends PrimitiveDivProps {
|
|
|
77
76
|
*/
|
|
78
77
|
dir?: Direction;
|
|
79
78
|
}
|
|
80
|
-
|
|
79
|
+
type CollapsibleProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;
|
|
81
80
|
interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {
|
|
82
81
|
/**
|
|
83
82
|
* Whether or not an accordion item is disabled from user interaction.
|
|
@@ -94,7 +93,7 @@ interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpe
|
|
|
94
93
|
* `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.
|
|
95
94
|
*/
|
|
96
95
|
declare const AccordionItem: React__default.ForwardRefExoticComponent<AccordionItemProps & React__default.RefAttributes<HTMLDivElement>>;
|
|
97
|
-
|
|
96
|
+
type PrimitiveHeading3Props = React__default.ComponentPropsWithoutRef<typeof Primitive.h3>;
|
|
98
97
|
interface AccordionHeaderProps extends PrimitiveHeading3Props {
|
|
99
98
|
}
|
|
100
99
|
/**
|
|
@@ -102,7 +101,7 @@ interface AccordionHeaderProps extends PrimitiveHeading3Props {
|
|
|
102
101
|
* whether or not its content is collapsed.
|
|
103
102
|
*/
|
|
104
103
|
declare const AccordionHeader: React__default.ForwardRefExoticComponent<AccordionHeaderProps & React__default.RefAttributes<HTMLHeadingElement>>;
|
|
105
|
-
|
|
104
|
+
type CollapsibleTriggerProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;
|
|
106
105
|
interface AccordionTriggerProps extends CollapsibleTriggerProps {
|
|
107
106
|
}
|
|
108
107
|
/**
|
|
@@ -110,7 +109,7 @@ interface AccordionTriggerProps extends CollapsibleTriggerProps {
|
|
|
110
109
|
* should always be nested inside of an `AccordionHeader`.
|
|
111
110
|
*/
|
|
112
111
|
declare const AccordionTrigger: React__default.ForwardRefExoticComponent<AccordionTriggerProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
113
|
-
|
|
112
|
+
type CollapsibleContentProps = React__default.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;
|
|
114
113
|
interface AccordionContentProps extends CollapsibleContentProps {
|
|
115
114
|
}
|
|
116
115
|
/**
|
package/dist/index.js
CHANGED
|
@@ -1,357 +1,350 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
mod
|
|
31
|
-
));
|
|
3
|
+
var __create = Object.create;
|
|
4
|
+
var __defProp = Object.defineProperty;
|
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
8
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __export = (target, all) => {
|
|
10
|
+
for (var name in all)
|
|
11
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
|
+
};
|
|
13
|
+
var __copyProps = (to, from, except, desc) => {
|
|
14
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
15
|
+
for (let key of __getOwnPropNames(from))
|
|
16
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
17
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
|
+
}
|
|
19
|
+
return to;
|
|
20
|
+
};
|
|
21
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
26
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
27
|
+
mod
|
|
28
|
+
));
|
|
29
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
32
30
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
{ collapsible: false }
|
|
88
|
-
);
|
|
89
|
-
var AccordionImplSingle = import_react.default.forwardRef(
|
|
90
|
-
(props, forwardedRef) => {
|
|
91
|
-
const {
|
|
92
|
-
value: valueProp,
|
|
93
|
-
defaultValue,
|
|
94
|
-
onValueChange = () => {
|
|
95
|
-
},
|
|
96
|
-
collapsible = false,
|
|
97
|
-
...accordionSingleProps
|
|
98
|
-
} = props;
|
|
99
|
-
const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
|
|
100
|
-
prop: valueProp,
|
|
101
|
-
defaultProp: defaultValue,
|
|
102
|
-
onChange: onValueChange
|
|
103
|
-
});
|
|
104
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
105
|
-
AccordionValueProvider,
|
|
106
|
-
{
|
|
107
|
-
scope: props.__scopeAccordion,
|
|
108
|
-
value: value ? [value] : [],
|
|
109
|
-
onItemOpen: setValue,
|
|
110
|
-
onItemClose: import_react.default.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
|
|
111
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
|
|
112
|
-
}
|
|
113
|
-
);
|
|
114
|
-
}
|
|
115
|
-
);
|
|
116
|
-
var AccordionImplMultiple = import_react.default.forwardRef((props, forwardedRef) => {
|
|
31
|
+
// packages/react/accordion/src/index.ts
|
|
32
|
+
var src_exports = {};
|
|
33
|
+
__export(src_exports, {
|
|
34
|
+
Accordion: () => Accordion,
|
|
35
|
+
AccordionContent: () => AccordionContent,
|
|
36
|
+
AccordionHeader: () => AccordionHeader,
|
|
37
|
+
AccordionItem: () => AccordionItem,
|
|
38
|
+
AccordionTrigger: () => AccordionTrigger,
|
|
39
|
+
Content: () => Content2,
|
|
40
|
+
Header: () => Header,
|
|
41
|
+
Item: () => Item,
|
|
42
|
+
Root: () => Root2,
|
|
43
|
+
Trigger: () => Trigger2,
|
|
44
|
+
createAccordionScope: () => createAccordionScope
|
|
45
|
+
});
|
|
46
|
+
module.exports = __toCommonJS(src_exports);
|
|
47
|
+
|
|
48
|
+
// packages/react/accordion/src/Accordion.tsx
|
|
49
|
+
var import_react = __toESM(require("react"));
|
|
50
|
+
var import_react_context = require("@radix-ui/react-context");
|
|
51
|
+
var import_react_collection = require("@radix-ui/react-collection");
|
|
52
|
+
var import_react_compose_refs = require("@radix-ui/react-compose-refs");
|
|
53
|
+
var import_primitive = require("@radix-ui/primitive");
|
|
54
|
+
var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
|
|
55
|
+
var import_react_primitive = require("@radix-ui/react-primitive");
|
|
56
|
+
var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
|
|
57
|
+
var import_react_collapsible = require("@radix-ui/react-collapsible");
|
|
58
|
+
var import_react_id = require("@radix-ui/react-id");
|
|
59
|
+
var import_react_direction = require("@radix-ui/react-direction");
|
|
60
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
61
|
+
var ACCORDION_NAME = "Accordion";
|
|
62
|
+
var ACCORDION_KEYS = ["Home", "End", "ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
|
|
63
|
+
var [Collection, useCollection, createCollectionScope] = (0, import_react_collection.createCollection)(ACCORDION_NAME);
|
|
64
|
+
var [createAccordionContext, createAccordionScope] = (0, import_react_context.createContextScope)(ACCORDION_NAME, [
|
|
65
|
+
createCollectionScope,
|
|
66
|
+
import_react_collapsible.createCollapsibleScope
|
|
67
|
+
]);
|
|
68
|
+
var useCollapsibleScope = (0, import_react_collapsible.createCollapsibleScope)();
|
|
69
|
+
var Accordion = import_react.default.forwardRef(
|
|
70
|
+
(props, forwardedRef) => {
|
|
71
|
+
const { type, ...accordionProps } = props;
|
|
72
|
+
const singleProps = accordionProps;
|
|
73
|
+
const multipleProps = accordionProps;
|
|
74
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: props.__scopeAccordion, children: type === "multiple" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImplMultiple, { ...multipleProps, ref: forwardedRef }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImplSingle, { ...singleProps, ref: forwardedRef }) });
|
|
75
|
+
}
|
|
76
|
+
);
|
|
77
|
+
Accordion.displayName = ACCORDION_NAME;
|
|
78
|
+
var [AccordionValueProvider, useAccordionValueContext] = createAccordionContext(ACCORDION_NAME);
|
|
79
|
+
var [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(
|
|
80
|
+
ACCORDION_NAME,
|
|
81
|
+
{ collapsible: false }
|
|
82
|
+
);
|
|
83
|
+
var AccordionImplSingle = import_react.default.forwardRef(
|
|
84
|
+
(props, forwardedRef) => {
|
|
117
85
|
const {
|
|
118
86
|
value: valueProp,
|
|
119
87
|
defaultValue,
|
|
120
88
|
onValueChange = () => {
|
|
121
89
|
},
|
|
122
|
-
|
|
90
|
+
collapsible = false,
|
|
91
|
+
...accordionSingleProps
|
|
123
92
|
} = props;
|
|
124
|
-
const [value
|
|
93
|
+
const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
|
|
125
94
|
prop: valueProp,
|
|
126
95
|
defaultProp: defaultValue,
|
|
127
96
|
onChange: onValueChange
|
|
128
97
|
});
|
|
129
|
-
const handleItemOpen = import_react.default.useCallback(
|
|
130
|
-
(itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
|
|
131
|
-
[setValue]
|
|
132
|
-
);
|
|
133
|
-
const handleItemClose = import_react.default.useCallback(
|
|
134
|
-
(itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
|
|
135
|
-
[setValue]
|
|
136
|
-
);
|
|
137
98
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
138
99
|
AccordionValueProvider,
|
|
139
100
|
{
|
|
140
101
|
scope: props.__scopeAccordion,
|
|
141
|
-
value,
|
|
142
|
-
onItemOpen:
|
|
143
|
-
onItemClose:
|
|
144
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible
|
|
102
|
+
value: value ? [value] : [],
|
|
103
|
+
onItemOpen: setValue,
|
|
104
|
+
onItemClose: import_react.default.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
|
|
105
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
|
|
145
106
|
}
|
|
146
107
|
);
|
|
108
|
+
}
|
|
109
|
+
);
|
|
110
|
+
var AccordionImplMultiple = import_react.default.forwardRef((props, forwardedRef) => {
|
|
111
|
+
const {
|
|
112
|
+
value: valueProp,
|
|
113
|
+
defaultValue,
|
|
114
|
+
onValueChange = () => {
|
|
115
|
+
},
|
|
116
|
+
...accordionMultipleProps
|
|
117
|
+
} = props;
|
|
118
|
+
const [value = [], setValue] = (0, import_react_use_controllable_state.useControllableState)({
|
|
119
|
+
prop: valueProp,
|
|
120
|
+
defaultProp: defaultValue,
|
|
121
|
+
onChange: onValueChange
|
|
147
122
|
});
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
123
|
+
const handleItemOpen = import_react.default.useCallback(
|
|
124
|
+
(itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
|
|
125
|
+
[setValue]
|
|
126
|
+
);
|
|
127
|
+
const handleItemClose = import_react.default.useCallback(
|
|
128
|
+
(itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
|
|
129
|
+
[setValue]
|
|
130
|
+
);
|
|
131
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
132
|
+
AccordionValueProvider,
|
|
133
|
+
{
|
|
134
|
+
scope: props.__scopeAccordion,
|
|
135
|
+
value,
|
|
136
|
+
onItemOpen: handleItemOpen,
|
|
137
|
+
onItemClose: handleItemClose,
|
|
138
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionMultipleProps, ref: forwardedRef }) })
|
|
139
|
+
}
|
|
140
|
+
);
|
|
141
|
+
});
|
|
142
|
+
var [AccordionImplProvider, useAccordionContext] = createAccordionContext(ACCORDION_NAME);
|
|
143
|
+
var AccordionImpl = import_react.default.forwardRef(
|
|
144
|
+
(props, forwardedRef) => {
|
|
145
|
+
const { __scopeAccordion, disabled, dir, orientation = "vertical", ...accordionProps } = props;
|
|
146
|
+
const accordionRef = import_react.default.useRef(null);
|
|
147
|
+
const composedRefs = (0, import_react_compose_refs.useComposedRefs)(accordionRef, forwardedRef);
|
|
148
|
+
const getItems = useCollection(__scopeAccordion);
|
|
149
|
+
const direction = (0, import_react_direction.useDirection)(dir);
|
|
150
|
+
const isDirectionLTR = direction === "ltr";
|
|
151
|
+
const handleKeyDown = (0, import_primitive.composeEventHandlers)(props.onKeyDown, (event) => {
|
|
152
|
+
if (!ACCORDION_KEYS.includes(event.key)) return;
|
|
153
|
+
const target = event.target;
|
|
154
|
+
const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);
|
|
155
|
+
const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);
|
|
156
|
+
const triggerCount = triggerCollection.length;
|
|
157
|
+
if (triggerIndex === -1) return;
|
|
158
|
+
event.preventDefault();
|
|
159
|
+
let nextIndex = triggerIndex;
|
|
160
|
+
const homeIndex = 0;
|
|
161
|
+
const endIndex = triggerCount - 1;
|
|
162
|
+
const moveNext = () => {
|
|
163
|
+
nextIndex = triggerIndex + 1;
|
|
164
|
+
if (nextIndex > endIndex) {
|
|
165
|
+
nextIndex = homeIndex;
|
|
166
|
+
}
|
|
167
|
+
};
|
|
168
|
+
const movePrev = () => {
|
|
169
|
+
nextIndex = triggerIndex - 1;
|
|
170
|
+
if (nextIndex < homeIndex) {
|
|
171
|
+
nextIndex = endIndex;
|
|
172
|
+
}
|
|
173
|
+
};
|
|
174
|
+
switch (event.key) {
|
|
175
|
+
case "Home":
|
|
176
|
+
nextIndex = homeIndex;
|
|
177
|
+
break;
|
|
178
|
+
case "End":
|
|
179
|
+
nextIndex = endIndex;
|
|
180
|
+
break;
|
|
181
|
+
case "ArrowRight":
|
|
182
|
+
if (orientation === "horizontal") {
|
|
183
|
+
if (isDirectionLTR) {
|
|
184
|
+
moveNext();
|
|
185
|
+
} else {
|
|
186
|
+
movePrev();
|
|
187
|
+
}
|
|
172
188
|
}
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
nextIndex = endIndex;
|
|
189
|
+
break;
|
|
190
|
+
case "ArrowDown":
|
|
191
|
+
if (orientation === "vertical") {
|
|
192
|
+
moveNext();
|
|
178
193
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
nextIndex = endIndex;
|
|
186
|
-
break;
|
|
187
|
-
case "ArrowRight":
|
|
188
|
-
if (orientation === "horizontal") {
|
|
189
|
-
if (isDirectionLTR) {
|
|
190
|
-
moveNext();
|
|
191
|
-
} else {
|
|
192
|
-
movePrev();
|
|
193
|
-
}
|
|
194
|
-
}
|
|
195
|
-
break;
|
|
196
|
-
case "ArrowDown":
|
|
197
|
-
if (orientation === "vertical") {
|
|
194
|
+
break;
|
|
195
|
+
case "ArrowLeft":
|
|
196
|
+
if (orientation === "horizontal") {
|
|
197
|
+
if (isDirectionLTR) {
|
|
198
|
+
movePrev();
|
|
199
|
+
} else {
|
|
198
200
|
moveNext();
|
|
199
201
|
}
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
202
|
+
}
|
|
203
|
+
break;
|
|
204
|
+
case "ArrowUp":
|
|
205
|
+
if (orientation === "vertical") {
|
|
206
|
+
movePrev();
|
|
207
|
+
}
|
|
208
|
+
break;
|
|
209
|
+
}
|
|
210
|
+
const clampedIndex = nextIndex % triggerCount;
|
|
211
|
+
triggerCollection[clampedIndex].ref.current?.focus();
|
|
212
|
+
});
|
|
213
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
214
|
+
AccordionImplProvider,
|
|
215
|
+
{
|
|
216
|
+
scope: __scopeAccordion,
|
|
217
|
+
disabled,
|
|
218
|
+
direction: dir,
|
|
219
|
+
orientation,
|
|
220
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
221
|
+
import_react_primitive.Primitive.div,
|
|
222
|
+
{
|
|
223
|
+
...accordionProps,
|
|
224
|
+
"data-orientation": orientation,
|
|
225
|
+
ref: composedRefs,
|
|
226
|
+
onKeyDown: disabled ? void 0 : handleKeyDown
|
|
227
|
+
}
|
|
228
|
+
) })
|
|
229
|
+
}
|
|
230
|
+
);
|
|
231
|
+
}
|
|
232
|
+
);
|
|
233
|
+
var ITEM_NAME = "AccordionItem";
|
|
234
|
+
var [AccordionItemProvider, useAccordionItemContext] = createAccordionContext(ITEM_NAME);
|
|
235
|
+
var AccordionItem = import_react.default.forwardRef(
|
|
236
|
+
(props, forwardedRef) => {
|
|
237
|
+
const { __scopeAccordion, value, ...accordionItemProps } = props;
|
|
238
|
+
const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);
|
|
239
|
+
const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);
|
|
240
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
241
|
+
const triggerId = (0, import_react_id.useId)();
|
|
242
|
+
const open = value && valueContext.value.includes(value) || false;
|
|
243
|
+
const disabled = accordionContext.disabled || props.disabled;
|
|
244
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
245
|
+
AccordionItemProvider,
|
|
246
|
+
{
|
|
247
|
+
scope: __scopeAccordion,
|
|
248
|
+
open,
|
|
249
|
+
disabled,
|
|
250
|
+
triggerId,
|
|
251
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
252
|
+
CollapsiblePrimitive.Root,
|
|
253
|
+
{
|
|
254
|
+
"data-orientation": accordionContext.orientation,
|
|
255
|
+
"data-state": getState(open),
|
|
256
|
+
...collapsibleScope,
|
|
257
|
+
...accordionItemProps,
|
|
258
|
+
ref: forwardedRef,
|
|
259
|
+
disabled,
|
|
260
|
+
open,
|
|
261
|
+
onOpenChange: (open2) => {
|
|
262
|
+
if (open2) {
|
|
263
|
+
valueContext.onItemOpen(value);
|
|
205
264
|
} else {
|
|
206
|
-
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
|
-
break;
|
|
210
|
-
case "ArrowUp":
|
|
211
|
-
if (orientation === "vertical") {
|
|
212
|
-
movePrev();
|
|
213
|
-
}
|
|
214
|
-
break;
|
|
215
|
-
}
|
|
216
|
-
const clampedIndex = nextIndex % triggerCount;
|
|
217
|
-
triggerCollection[clampedIndex].ref.current?.focus();
|
|
218
|
-
});
|
|
219
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
220
|
-
AccordionImplProvider,
|
|
221
|
-
{
|
|
222
|
-
scope: __scopeAccordion,
|
|
223
|
-
disabled,
|
|
224
|
-
direction: dir,
|
|
225
|
-
orientation,
|
|
226
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
227
|
-
import_react_primitive.Primitive.div,
|
|
228
|
-
{
|
|
229
|
-
...accordionProps,
|
|
230
|
-
"data-orientation": orientation,
|
|
231
|
-
ref: composedRefs,
|
|
232
|
-
onKeyDown: disabled ? void 0 : handleKeyDown
|
|
233
|
-
}
|
|
234
|
-
) })
|
|
235
|
-
}
|
|
236
|
-
);
|
|
237
|
-
}
|
|
238
|
-
);
|
|
239
|
-
var ITEM_NAME = "AccordionItem";
|
|
240
|
-
var [AccordionItemProvider, useAccordionItemContext] = createAccordionContext(ITEM_NAME);
|
|
241
|
-
var AccordionItem = import_react.default.forwardRef(
|
|
242
|
-
(props, forwardedRef) => {
|
|
243
|
-
const { __scopeAccordion, value, ...accordionItemProps } = props;
|
|
244
|
-
const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);
|
|
245
|
-
const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);
|
|
246
|
-
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
247
|
-
const triggerId = (0, import_react_id.useId)();
|
|
248
|
-
const open = value && valueContext.value.includes(value) || false;
|
|
249
|
-
const disabled = accordionContext.disabled || props.disabled;
|
|
250
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
251
|
-
AccordionItemProvider,
|
|
252
|
-
{
|
|
253
|
-
scope: __scopeAccordion,
|
|
254
|
-
open,
|
|
255
|
-
disabled,
|
|
256
|
-
triggerId,
|
|
257
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
258
|
-
CollapsiblePrimitive.Root,
|
|
259
|
-
{
|
|
260
|
-
"data-orientation": accordionContext.orientation,
|
|
261
|
-
"data-state": getState(open),
|
|
262
|
-
...collapsibleScope,
|
|
263
|
-
...accordionItemProps,
|
|
264
|
-
ref: forwardedRef,
|
|
265
|
-
disabled,
|
|
266
|
-
open,
|
|
267
|
-
onOpenChange: (open2) => {
|
|
268
|
-
if (open2) {
|
|
269
|
-
valueContext.onItemOpen(value);
|
|
270
|
-
} else {
|
|
271
|
-
valueContext.onItemClose(value);
|
|
272
|
-
}
|
|
265
|
+
valueContext.onItemClose(value);
|
|
273
266
|
}
|
|
274
267
|
}
|
|
275
|
-
)
|
|
276
|
-
}
|
|
277
|
-
);
|
|
278
|
-
}
|
|
279
|
-
);
|
|
280
|
-
AccordionItem.displayName = ITEM_NAME;
|
|
281
|
-
var HEADER_NAME = "AccordionHeader";
|
|
282
|
-
var AccordionHeader = import_react.default.forwardRef(
|
|
283
|
-
(props, forwardedRef) => {
|
|
284
|
-
const { __scopeAccordion, ...headerProps } = props;
|
|
285
|
-
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
286
|
-
const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);
|
|
287
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
288
|
-
import_react_primitive.Primitive.h3,
|
|
289
|
-
{
|
|
290
|
-
"data-orientation": accordionContext.orientation,
|
|
291
|
-
"data-state": getState(itemContext.open),
|
|
292
|
-
"data-disabled": itemContext.disabled ? "" : void 0,
|
|
293
|
-
...headerProps,
|
|
294
|
-
ref: forwardedRef
|
|
295
|
-
}
|
|
296
|
-
);
|
|
297
|
-
}
|
|
298
|
-
);
|
|
299
|
-
AccordionHeader.displayName = HEADER_NAME;
|
|
300
|
-
var TRIGGER_NAME = "AccordionTrigger";
|
|
301
|
-
var AccordionTrigger = import_react.default.forwardRef(
|
|
302
|
-
(props, forwardedRef) => {
|
|
303
|
-
const { __scopeAccordion, ...triggerProps } = props;
|
|
304
|
-
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
305
|
-
const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);
|
|
306
|
-
const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);
|
|
307
|
-
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
308
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
309
|
-
CollapsiblePrimitive.Trigger,
|
|
310
|
-
{
|
|
311
|
-
"aria-disabled": itemContext.open && !collapsibleContext.collapsible || void 0,
|
|
312
|
-
"data-orientation": accordionContext.orientation,
|
|
313
|
-
id: itemContext.triggerId,
|
|
314
|
-
...collapsibleScope,
|
|
315
|
-
...triggerProps,
|
|
316
|
-
ref: forwardedRef
|
|
317
|
-
}
|
|
318
|
-
) });
|
|
319
|
-
}
|
|
320
|
-
);
|
|
321
|
-
AccordionTrigger.displayName = TRIGGER_NAME;
|
|
322
|
-
var CONTENT_NAME = "AccordionContent";
|
|
323
|
-
var AccordionContent = import_react.default.forwardRef(
|
|
324
|
-
(props, forwardedRef) => {
|
|
325
|
-
const { __scopeAccordion, ...contentProps } = props;
|
|
326
|
-
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
327
|
-
const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);
|
|
328
|
-
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
329
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
330
|
-
CollapsiblePrimitive.Content,
|
|
331
|
-
{
|
|
332
|
-
role: "region",
|
|
333
|
-
"aria-labelledby": itemContext.triggerId,
|
|
334
|
-
"data-orientation": accordionContext.orientation,
|
|
335
|
-
...collapsibleScope,
|
|
336
|
-
...contentProps,
|
|
337
|
-
ref: forwardedRef,
|
|
338
|
-
style: {
|
|
339
|
-
["--radix-accordion-content-height"]: "var(--radix-collapsible-content-height)",
|
|
340
|
-
["--radix-accordion-content-width"]: "var(--radix-collapsible-content-width)",
|
|
341
|
-
...props.style
|
|
342
268
|
}
|
|
269
|
+
)
|
|
270
|
+
}
|
|
271
|
+
);
|
|
272
|
+
}
|
|
273
|
+
);
|
|
274
|
+
AccordionItem.displayName = ITEM_NAME;
|
|
275
|
+
var HEADER_NAME = "AccordionHeader";
|
|
276
|
+
var AccordionHeader = import_react.default.forwardRef(
|
|
277
|
+
(props, forwardedRef) => {
|
|
278
|
+
const { __scopeAccordion, ...headerProps } = props;
|
|
279
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
280
|
+
const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);
|
|
281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
282
|
+
import_react_primitive.Primitive.h3,
|
|
283
|
+
{
|
|
284
|
+
"data-orientation": accordionContext.orientation,
|
|
285
|
+
"data-state": getState(itemContext.open),
|
|
286
|
+
"data-disabled": itemContext.disabled ? "" : void 0,
|
|
287
|
+
...headerProps,
|
|
288
|
+
ref: forwardedRef
|
|
289
|
+
}
|
|
290
|
+
);
|
|
291
|
+
}
|
|
292
|
+
);
|
|
293
|
+
AccordionHeader.displayName = HEADER_NAME;
|
|
294
|
+
var TRIGGER_NAME = "AccordionTrigger";
|
|
295
|
+
var AccordionTrigger = import_react.default.forwardRef(
|
|
296
|
+
(props, forwardedRef) => {
|
|
297
|
+
const { __scopeAccordion, ...triggerProps } = props;
|
|
298
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
299
|
+
const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);
|
|
300
|
+
const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);
|
|
301
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
302
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
303
|
+
CollapsiblePrimitive.Trigger,
|
|
304
|
+
{
|
|
305
|
+
"aria-disabled": itemContext.open && !collapsibleContext.collapsible || void 0,
|
|
306
|
+
"data-orientation": accordionContext.orientation,
|
|
307
|
+
id: itemContext.triggerId,
|
|
308
|
+
...collapsibleScope,
|
|
309
|
+
...triggerProps,
|
|
310
|
+
ref: forwardedRef
|
|
311
|
+
}
|
|
312
|
+
) });
|
|
313
|
+
}
|
|
314
|
+
);
|
|
315
|
+
AccordionTrigger.displayName = TRIGGER_NAME;
|
|
316
|
+
var CONTENT_NAME = "AccordionContent";
|
|
317
|
+
var AccordionContent = import_react.default.forwardRef(
|
|
318
|
+
(props, forwardedRef) => {
|
|
319
|
+
const { __scopeAccordion, ...contentProps } = props;
|
|
320
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
321
|
+
const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);
|
|
322
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
323
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
324
|
+
CollapsiblePrimitive.Content,
|
|
325
|
+
{
|
|
326
|
+
role: "region",
|
|
327
|
+
"aria-labelledby": itemContext.triggerId,
|
|
328
|
+
"data-orientation": accordionContext.orientation,
|
|
329
|
+
...collapsibleScope,
|
|
330
|
+
...contentProps,
|
|
331
|
+
ref: forwardedRef,
|
|
332
|
+
style: {
|
|
333
|
+
["--radix-accordion-content-height"]: "var(--radix-collapsible-content-height)",
|
|
334
|
+
["--radix-accordion-content-width"]: "var(--radix-collapsible-content-width)",
|
|
335
|
+
...props.style
|
|
343
336
|
}
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
);
|
|
347
|
-
AccordionContent.displayName = CONTENT_NAME;
|
|
348
|
-
function getState(open) {
|
|
349
|
-
return open ? "open" : "closed";
|
|
337
|
+
}
|
|
338
|
+
);
|
|
350
339
|
}
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
340
|
+
);
|
|
341
|
+
AccordionContent.displayName = CONTENT_NAME;
|
|
342
|
+
function getState(open) {
|
|
343
|
+
return open ? "open" : "closed";
|
|
344
|
+
}
|
|
345
|
+
var Root2 = Accordion;
|
|
346
|
+
var Item = AccordionItem;
|
|
347
|
+
var Header = AccordionHeader;
|
|
348
|
+
var Trigger2 = AccordionTrigger;
|
|
349
|
+
var Content2 = AccordionContent;
|
|
357
350
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/Accordion.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\nAccordion.propTypes = {\n type(props) {\n const value = props.value || props.defaultValue;\n if (props.type && !['single', 'multiple'].includes(props.type)) {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected one of `single | multiple`.'\n );\n }\n if (props.type === 'multiple' && typeof value === 'string') {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected `single` when `defaultValue` or `value` is type `string`.'\n );\n }\n if (props.type === 'single' && Array.isArray(value)) {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected `multiple` when `defaultValue` or `value` is type `string[]`.'\n );\n }\n return null;\n },\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = Radix.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["React", "value", "open", "Root", "Trigger", "Content"]
|
|
3
|
+
"sources": ["../src/index.ts", "../src/Accordion.tsx"],
|
|
4
|
+
"sourcesContent": ["'use client';\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n} from './Accordion';\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n} from './Accordion';\n", "import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Content", "Root", "Trigger", "React", "value", "open", "Root", "Trigger", "Content"]
|
|
7
7
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -30,27 +30,6 @@ var Accordion = React.forwardRef(
|
|
|
30
30
|
}
|
|
31
31
|
);
|
|
32
32
|
Accordion.displayName = ACCORDION_NAME;
|
|
33
|
-
Accordion.propTypes = {
|
|
34
|
-
type(props) {
|
|
35
|
-
const value = props.value || props.defaultValue;
|
|
36
|
-
if (props.type && !["single", "multiple"].includes(props.type)) {
|
|
37
|
-
return new Error(
|
|
38
|
-
"Invalid prop `type` supplied to `Accordion`. Expected one of `single | multiple`."
|
|
39
|
-
);
|
|
40
|
-
}
|
|
41
|
-
if (props.type === "multiple" && typeof value === "string") {
|
|
42
|
-
return new Error(
|
|
43
|
-
"Invalid prop `type` supplied to `Accordion`. Expected `single` when `defaultValue` or `value` is type `string`."
|
|
44
|
-
);
|
|
45
|
-
}
|
|
46
|
-
if (props.type === "single" && Array.isArray(value)) {
|
|
47
|
-
return new Error(
|
|
48
|
-
"Invalid prop `type` supplied to `Accordion`. Expected `multiple` when `defaultValue` or `value` is type `string[]`."
|
|
49
|
-
);
|
|
50
|
-
}
|
|
51
|
-
return null;
|
|
52
|
-
}
|
|
53
|
-
};
|
|
54
33
|
var [AccordionValueProvider, useAccordionValueContext] = createAccordionContext(ACCORDION_NAME);
|
|
55
34
|
var [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(
|
|
56
35
|
ACCORDION_NAME,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/Accordion.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\nAccordion.propTypes = {\n type(props) {\n const value = props.value || props.defaultValue;\n if (props.type && !['single', 'multiple'].includes(props.type)) {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected one of `single | multiple`.'\n );\n }\n if (props.type === 'multiple' && typeof value === 'string') {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected `single` when `defaultValue` or `value` is type `string`.'\n );\n }\n if (props.type === 'single' && Array.isArray(value)) {\n return new Error(\n 'Invalid prop `type` supplied to `Accordion`. Expected `multiple` when `defaultValue` or `value` is type `string[]`.'\n );\n }\n return null;\n },\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = Radix.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = Radix.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
|
|
5
|
-
"mappings": ";;;AAAA,OAAO,WAAW;AAClB,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,iBAAiB;AAC1B,YAAY,0BAA0B;AACtC,SAAS,8BAA8B;AACvC,SAAS,aAAa;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["value", "open", "Root", "Trigger", "Content"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@radix-ui/react-accordion",
|
|
3
|
-
"version": "1.2.0-rc.
|
|
3
|
+
"version": "1.2.0-rc.4",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -28,21 +28,21 @@
|
|
|
28
28
|
"version": "yarn version"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@radix-ui/primitive": "1.1.0-rc.
|
|
32
|
-
"@radix-ui/react-collapsible": "1.1.0-rc.
|
|
33
|
-
"@radix-ui/react-collection": "1.1.0-rc.
|
|
34
|
-
"@radix-ui/react-compose-refs": "1.1.0-rc.
|
|
35
|
-
"@radix-ui/react-context": "1.1.0-rc.
|
|
36
|
-
"@radix-ui/react-direction": "1.1.0-rc.
|
|
37
|
-
"@radix-ui/react-id": "1.1.0-rc.
|
|
38
|
-
"@radix-ui/react-primitive": "
|
|
39
|
-
"@radix-ui/react-use-controllable-state": "1.1.0-rc.
|
|
31
|
+
"@radix-ui/primitive": "1.1.0-rc.4",
|
|
32
|
+
"@radix-ui/react-collapsible": "1.1.0-rc.4",
|
|
33
|
+
"@radix-ui/react-collection": "1.1.0-rc.4",
|
|
34
|
+
"@radix-ui/react-compose-refs": "1.1.0-rc.4",
|
|
35
|
+
"@radix-ui/react-context": "1.1.0-rc.4",
|
|
36
|
+
"@radix-ui/react-direction": "1.1.0-rc.4",
|
|
37
|
+
"@radix-ui/react-id": "1.1.0-rc.4",
|
|
38
|
+
"@radix-ui/react-primitive": "2.0.0-rc.1",
|
|
39
|
+
"@radix-ui/react-use-controllable-state": "1.1.0-rc.4"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@types/react": "*",
|
|
43
43
|
"@types/react-dom": "*",
|
|
44
|
-
"react": "^16.8 || ^17.0 || ^18.0",
|
|
45
|
-
"react-dom": "^16.8 || ^17.0 || ^18.0"
|
|
44
|
+
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0",
|
|
45
|
+
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0"
|
|
46
46
|
},
|
|
47
47
|
"peerDependenciesMeta": {
|
|
48
48
|
"@types/react": {
|