@luxfi/ui 5.6.0 → 6.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +109 -0
- package/package.json +81 -278
- package/dist/accordion.cjs +0 -213
- package/dist/accordion.js +0 -186
- package/dist/alert.cjs +0 -553
- package/dist/alert.js +0 -531
- package/dist/avatar.cjs +0 -149
- package/dist/avatar.js +0 -125
- package/dist/badge.cjs +0 -611
- package/dist/badge.js +0 -589
- package/dist/button.cjs +0 -689
- package/dist/button.js +0 -664
- package/dist/checkbox.cjs +0 -265
- package/dist/checkbox.js +0 -241
- package/dist/close-button.cjs +0 -73
- package/dist/close-button.js +0 -51
- package/dist/collapsible.cjs +0 -702
- package/dist/collapsible.js +0 -679
- package/dist/color-mode.cjs +0 -96
- package/dist/color-mode.js +0 -72
- package/dist/dialog.cjs +0 -279
- package/dist/dialog.js +0 -246
- package/dist/drawer.cjs +0 -207
- package/dist/drawer.js +0 -175
- package/dist/empty-state.cjs +0 -93
- package/dist/empty-state.js +0 -71
- package/dist/field.cjs +0 -183
- package/dist/field.js +0 -160
- package/dist/heading.cjs +0 -46
- package/dist/heading.js +0 -40
- package/dist/icon-button.cjs +0 -491
- package/dist/icon-button.js +0 -470
- package/dist/image.cjs +0 -572
- package/dist/image.js +0 -551
- package/dist/index.cjs +0 -5779
- package/dist/index.js +0 -5619
- package/dist/input-group.cjs +0 -155
- package/dist/input-group.js +0 -133
- package/dist/input.cjs +0 -65
- package/dist/input.js +0 -59
- package/dist/link.cjs +0 -630
- package/dist/link.js +0 -606
- package/dist/menu.cjs +0 -305
- package/dist/menu.js +0 -269
- package/dist/pin-input.cjs +0 -182
- package/dist/pin-input.js +0 -160
- package/dist/popover.cjs +0 -327
- package/dist/popover.js +0 -294
- package/dist/progress-circle.cjs +0 -152
- package/dist/progress-circle.js +0 -128
- package/dist/progress.cjs +0 -117
- package/dist/progress.js +0 -94
- package/dist/provider.cjs +0 -62
- package/dist/provider.js +0 -40
- package/dist/radio.cjs +0 -177
- package/dist/radio.js +0 -153
- package/dist/rating.cjs +0 -80
- package/dist/rating.js +0 -58
- package/dist/select.cjs +0 -791
- package/dist/select.js +0 -757
- package/dist/separator.cjs +0 -57
- package/dist/separator.js +0 -51
- package/dist/skeleton.cjs +0 -370
- package/dist/skeleton.js +0 -346
- package/dist/slider.cjs +0 -138
- package/dist/slider.js +0 -115
- package/dist/switch.cjs +0 -163
- package/dist/switch.js +0 -140
- package/dist/table.cjs +0 -1044
- package/dist/table.js +0 -1013
- package/dist/tabs.cjs +0 -240
- package/dist/tabs.js +0 -213
- package/dist/tag.cjs +0 -651
- package/dist/tag.js +0 -628
- package/dist/textarea.cjs +0 -65
- package/dist/textarea.js +0 -59
- package/dist/toaster.cjs +0 -99
- package/dist/toaster.js +0 -96
- package/dist/tooltip.cjs +0 -171
- package/dist/tooltip.js +0 -148
- package/dist/utils.cjs +0 -11
- package/dist/utils.js +0 -9
- package/src/accordion.tsx +0 -285
- package/src/alert.tsx +0 -221
- package/src/avatar.tsx +0 -174
- package/src/badge.tsx +0 -158
- package/src/button.tsx +0 -411
- package/src/checkbox.tsx +0 -307
- package/src/close-button.tsx +0 -51
- package/src/collapsible.tsx +0 -126
- package/src/color-mode.tsx +0 -125
- package/src/dialog.tsx +0 -356
- package/src/drawer.tsx +0 -186
- package/src/empty-state.tsx +0 -97
- package/src/field.tsx +0 -202
- package/src/heading.tsx +0 -55
- package/src/icon-button.tsx +0 -192
- package/src/image.tsx +0 -280
- package/src/index.ts +0 -192
- package/src/input-group.tsx +0 -159
- package/src/input.tsx +0 -60
- package/src/link.tsx +0 -326
- package/src/menu.tsx +0 -471
- package/src/pin-input.tsx +0 -187
- package/src/popover.tsx +0 -400
- package/src/progress-circle.tsx +0 -180
- package/src/progress.tsx +0 -109
- package/src/provider.tsx +0 -12
- package/src/radio.tsx +0 -175
- package/src/rating.tsx +0 -79
- package/src/select.tsx +0 -696
- package/src/separator.tsx +0 -59
- package/src/skeleton.tsx +0 -302
- package/src/slider.tsx +0 -152
- package/src/switch.tsx +0 -158
- package/src/table.tsx +0 -621
- package/src/tabs.tsx +0 -354
- package/src/tag.tsx +0 -159
- package/src/textarea.tsx +0 -60
- package/src/toaster.tsx +0 -117
- package/src/tokens.css +0 -438
- package/src/tooltip.tsx +0 -184
- package/src/utils/cn.ts +0 -7
- package/src/utils.ts +0 -6
- package/tokens.css +0 -438
package/dist/accordion.cjs
DELETED
|
@@ -1,213 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
var AccordionPrimitive = require('@radix-ui/react-accordion');
|
|
5
|
-
var React = require('react');
|
|
6
|
-
var clsx = require('clsx');
|
|
7
|
-
var tailwindMerge = require('tailwind-merge');
|
|
8
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
-
|
|
10
|
-
function _interopNamespace(e) {
|
|
11
|
-
if (e && e.__esModule) return e;
|
|
12
|
-
var n = Object.create(null);
|
|
13
|
-
if (e) {
|
|
14
|
-
Object.keys(e).forEach(function (k) {
|
|
15
|
-
if (k !== 'default') {
|
|
16
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
17
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
18
|
-
enumerable: true,
|
|
19
|
-
get: function () { return e[k]; }
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
});
|
|
23
|
-
}
|
|
24
|
-
n.default = e;
|
|
25
|
-
return Object.freeze(n);
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
|
|
29
|
-
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
30
|
-
|
|
31
|
-
// src/accordion.tsx
|
|
32
|
-
function cn(...inputs) {
|
|
33
|
-
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
|
34
|
-
}
|
|
35
|
-
var IndicatorIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
36
|
-
var AccordionRoot = React__namespace.forwardRef(
|
|
37
|
-
function AccordionRoot2(props, ref) {
|
|
38
|
-
const {
|
|
39
|
-
multiple: _multiple,
|
|
40
|
-
value,
|
|
41
|
-
defaultValue,
|
|
42
|
-
onValueChange,
|
|
43
|
-
variant,
|
|
44
|
-
size,
|
|
45
|
-
noAnimation: _noAnimation,
|
|
46
|
-
lazyMount: _lazyMount,
|
|
47
|
-
className,
|
|
48
|
-
children,
|
|
49
|
-
position: _position,
|
|
50
|
-
w: _w,
|
|
51
|
-
bgColor: _bgColor,
|
|
52
|
-
borderRadius: _borderRadius,
|
|
53
|
-
...rest
|
|
54
|
-
} = props;
|
|
55
|
-
const handleValueChange = React__namespace.useCallback(
|
|
56
|
-
(next) => {
|
|
57
|
-
onValueChange?.({ value: next });
|
|
58
|
-
},
|
|
59
|
-
[onValueChange]
|
|
60
|
-
);
|
|
61
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
62
|
-
AccordionPrimitive__namespace.Root,
|
|
63
|
-
{
|
|
64
|
-
ref,
|
|
65
|
-
type: "multiple",
|
|
66
|
-
value,
|
|
67
|
-
defaultValue,
|
|
68
|
-
onValueChange: handleValueChange,
|
|
69
|
-
className: cn(
|
|
70
|
-
"w-full",
|
|
71
|
-
variant === "faq" && "accordion-faq",
|
|
72
|
-
size === "sm" && "accordion-sm",
|
|
73
|
-
className
|
|
74
|
-
),
|
|
75
|
-
"data-variant": variant,
|
|
76
|
-
"data-size": size,
|
|
77
|
-
...rest,
|
|
78
|
-
children
|
|
79
|
-
}
|
|
80
|
-
);
|
|
81
|
-
}
|
|
82
|
-
);
|
|
83
|
-
var AccordionItem = React__namespace.forwardRef(
|
|
84
|
-
function AccordionItem2(props, ref) {
|
|
85
|
-
const { className, as: _as, _first, _last, display: _display, ...rest } = props;
|
|
86
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
87
|
-
AccordionPrimitive__namespace.Item,
|
|
88
|
-
{
|
|
89
|
-
ref,
|
|
90
|
-
className: cn(
|
|
91
|
-
"border-b border-[var(--color-border-divider)]",
|
|
92
|
-
className
|
|
93
|
-
),
|
|
94
|
-
...rest
|
|
95
|
-
}
|
|
96
|
-
);
|
|
97
|
-
}
|
|
98
|
-
);
|
|
99
|
-
var AccordionItemTrigger = React__namespace.forwardRef(function AccordionItemTrigger2(props, ref) {
|
|
100
|
-
const {
|
|
101
|
-
children,
|
|
102
|
-
indicatorPlacement: indicatorPlacementProp,
|
|
103
|
-
variant,
|
|
104
|
-
noIndicator,
|
|
105
|
-
className,
|
|
106
|
-
// Strip Chakra style props
|
|
107
|
-
px: _px,
|
|
108
|
-
py: _py,
|
|
109
|
-
_hover,
|
|
110
|
-
wordBreak: _wordBreak,
|
|
111
|
-
textAlign: _textAlign,
|
|
112
|
-
cursor: _cursor,
|
|
113
|
-
display: _display,
|
|
114
|
-
alignItems: _alignItems,
|
|
115
|
-
columnGap: _columnGap,
|
|
116
|
-
...rest
|
|
117
|
-
} = props;
|
|
118
|
-
const indicatorPlacement = variant === "faq" ? "start" : indicatorPlacementProp ?? "end";
|
|
119
|
-
const indicator = variant === "faq" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
120
|
-
"span",
|
|
121
|
-
{
|
|
122
|
-
className: cn(
|
|
123
|
-
"relative inline-block h-3 w-3 shrink-0",
|
|
124
|
-
// horizontal bar (always visible)
|
|
125
|
-
"before:absolute before:left-0 before:top-1/2 before:block before:h-[2px] before:w-full before:-translate-y-1/2 before:rounded-[2px] before:bg-current",
|
|
126
|
-
// vertical bar (rotates to 0 when open)
|
|
127
|
-
"after:absolute after:left-1/2 after:top-0 after:block after:h-full after:w-[2px]",
|
|
128
|
-
"after:-translate-x-1/2 after:rounded-[2px] after:bg-current",
|
|
129
|
-
"after:transition-transform after:duration-200 after:ease-in-out",
|
|
130
|
-
// When parent trigger has data-state="open", rotate vertical bar
|
|
131
|
-
"group-data-[state=open]/trigger:after:rotate-90"
|
|
132
|
-
)
|
|
133
|
-
}
|
|
134
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
135
|
-
"span",
|
|
136
|
-
{
|
|
137
|
-
className: cn(
|
|
138
|
-
"inline-flex shrink-0 transition-transform duration-200",
|
|
139
|
-
"rotate-180",
|
|
140
|
-
"group-data-[state=open]/trigger:rotate-[270deg]"
|
|
141
|
-
),
|
|
142
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(IndicatorIcon, { className: "h-5 w-5" })
|
|
143
|
-
}
|
|
144
|
-
);
|
|
145
|
-
return /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Header, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
146
|
-
AccordionPrimitive__namespace.Trigger,
|
|
147
|
-
{
|
|
148
|
-
ref,
|
|
149
|
-
className: cn(
|
|
150
|
-
"group/trigger flex w-full cursor-pointer items-center gap-2 py-3 text-left text-[var(--color-text-primary)]",
|
|
151
|
-
"hover:text-[var(--color-hover)]",
|
|
152
|
-
"focus-visible:outline-none",
|
|
153
|
-
className
|
|
154
|
-
),
|
|
155
|
-
...rest,
|
|
156
|
-
children: [
|
|
157
|
-
indicatorPlacement === "start" && !noIndicator && indicator,
|
|
158
|
-
children,
|
|
159
|
-
indicatorPlacement === "end" && !noIndicator && indicator
|
|
160
|
-
]
|
|
161
|
-
}
|
|
162
|
-
) }) });
|
|
163
|
-
});
|
|
164
|
-
var AccordionItemContent = React__namespace.forwardRef(function AccordionItemContent2(props, ref) {
|
|
165
|
-
const { className, children, pb: _pb, pr: _pr, pl: _pl, w: _w, display: _display, flexDir: _flexDir, rowGap: _rowGap, ...rest } = props;
|
|
166
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
167
|
-
AccordionPrimitive__namespace.Content,
|
|
168
|
-
{
|
|
169
|
-
ref,
|
|
170
|
-
className: cn(
|
|
171
|
-
"overflow-hidden text-[var(--color-text-primary)]",
|
|
172
|
-
"data-[state=open]:animate-accordion-down",
|
|
173
|
-
"data-[state=closed]:animate-accordion-up",
|
|
174
|
-
className
|
|
175
|
-
),
|
|
176
|
-
...rest,
|
|
177
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pb-3", children })
|
|
178
|
-
}
|
|
179
|
-
);
|
|
180
|
-
});
|
|
181
|
-
function useAccordion(items) {
|
|
182
|
-
const [value, setValue] = React__namespace.useState([]);
|
|
183
|
-
const onValueChange = React__namespace.useCallback(({ value: value2 }) => {
|
|
184
|
-
setValue(value2);
|
|
185
|
-
}, []);
|
|
186
|
-
const scrollToItemFromUrl = React__namespace.useCallback(() => {
|
|
187
|
-
const hash = window.location.hash.replace("#", "");
|
|
188
|
-
if (!hash) {
|
|
189
|
-
return;
|
|
190
|
-
}
|
|
191
|
-
const itemToScroll = items.find((item) => item.id === hash);
|
|
192
|
-
if (itemToScroll) {
|
|
193
|
-
const el = document.getElementById(itemToScroll.id);
|
|
194
|
-
if (el) {
|
|
195
|
-
el.scrollIntoView({ behavior: "smooth", block: "start" });
|
|
196
|
-
}
|
|
197
|
-
setValue([itemToScroll.id]);
|
|
198
|
-
}
|
|
199
|
-
}, [items]);
|
|
200
|
-
return React__namespace.useMemo(() => {
|
|
201
|
-
return {
|
|
202
|
-
value,
|
|
203
|
-
onValueChange,
|
|
204
|
-
scrollToItemFromUrl
|
|
205
|
-
};
|
|
206
|
-
}, [value, onValueChange, scrollToItemFromUrl]);
|
|
207
|
-
}
|
|
208
|
-
|
|
209
|
-
exports.AccordionItem = AccordionItem;
|
|
210
|
-
exports.AccordionItemContent = AccordionItemContent;
|
|
211
|
-
exports.AccordionItemTrigger = AccordionItemTrigger;
|
|
212
|
-
exports.AccordionRoot = AccordionRoot;
|
|
213
|
-
exports.useAccordion = useAccordion;
|
package/dist/accordion.js
DELETED
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import { clsx } from 'clsx';
|
|
5
|
-
import { twMerge } from 'tailwind-merge';
|
|
6
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
7
|
-
|
|
8
|
-
// src/accordion.tsx
|
|
9
|
-
function cn(...inputs) {
|
|
10
|
-
return twMerge(clsx(inputs));
|
|
11
|
-
}
|
|
12
|
-
var IndicatorIcon = ({ className }) => /* @__PURE__ */ jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
13
|
-
var AccordionRoot = React.forwardRef(
|
|
14
|
-
function AccordionRoot2(props, ref) {
|
|
15
|
-
const {
|
|
16
|
-
multiple: _multiple,
|
|
17
|
-
value,
|
|
18
|
-
defaultValue,
|
|
19
|
-
onValueChange,
|
|
20
|
-
variant,
|
|
21
|
-
size,
|
|
22
|
-
noAnimation: _noAnimation,
|
|
23
|
-
lazyMount: _lazyMount,
|
|
24
|
-
className,
|
|
25
|
-
children,
|
|
26
|
-
position: _position,
|
|
27
|
-
w: _w,
|
|
28
|
-
bgColor: _bgColor,
|
|
29
|
-
borderRadius: _borderRadius,
|
|
30
|
-
...rest
|
|
31
|
-
} = props;
|
|
32
|
-
const handleValueChange = React.useCallback(
|
|
33
|
-
(next) => {
|
|
34
|
-
onValueChange?.({ value: next });
|
|
35
|
-
},
|
|
36
|
-
[onValueChange]
|
|
37
|
-
);
|
|
38
|
-
return /* @__PURE__ */ jsx(
|
|
39
|
-
AccordionPrimitive.Root,
|
|
40
|
-
{
|
|
41
|
-
ref,
|
|
42
|
-
type: "multiple",
|
|
43
|
-
value,
|
|
44
|
-
defaultValue,
|
|
45
|
-
onValueChange: handleValueChange,
|
|
46
|
-
className: cn(
|
|
47
|
-
"w-full",
|
|
48
|
-
variant === "faq" && "accordion-faq",
|
|
49
|
-
size === "sm" && "accordion-sm",
|
|
50
|
-
className
|
|
51
|
-
),
|
|
52
|
-
"data-variant": variant,
|
|
53
|
-
"data-size": size,
|
|
54
|
-
...rest,
|
|
55
|
-
children
|
|
56
|
-
}
|
|
57
|
-
);
|
|
58
|
-
}
|
|
59
|
-
);
|
|
60
|
-
var AccordionItem = React.forwardRef(
|
|
61
|
-
function AccordionItem2(props, ref) {
|
|
62
|
-
const { className, as: _as, _first, _last, display: _display, ...rest } = props;
|
|
63
|
-
return /* @__PURE__ */ jsx(
|
|
64
|
-
AccordionPrimitive.Item,
|
|
65
|
-
{
|
|
66
|
-
ref,
|
|
67
|
-
className: cn(
|
|
68
|
-
"border-b border-[var(--color-border-divider)]",
|
|
69
|
-
className
|
|
70
|
-
),
|
|
71
|
-
...rest
|
|
72
|
-
}
|
|
73
|
-
);
|
|
74
|
-
}
|
|
75
|
-
);
|
|
76
|
-
var AccordionItemTrigger = React.forwardRef(function AccordionItemTrigger2(props, ref) {
|
|
77
|
-
const {
|
|
78
|
-
children,
|
|
79
|
-
indicatorPlacement: indicatorPlacementProp,
|
|
80
|
-
variant,
|
|
81
|
-
noIndicator,
|
|
82
|
-
className,
|
|
83
|
-
// Strip Chakra style props
|
|
84
|
-
px: _px,
|
|
85
|
-
py: _py,
|
|
86
|
-
_hover,
|
|
87
|
-
wordBreak: _wordBreak,
|
|
88
|
-
textAlign: _textAlign,
|
|
89
|
-
cursor: _cursor,
|
|
90
|
-
display: _display,
|
|
91
|
-
alignItems: _alignItems,
|
|
92
|
-
columnGap: _columnGap,
|
|
93
|
-
...rest
|
|
94
|
-
} = props;
|
|
95
|
-
const indicatorPlacement = variant === "faq" ? "start" : indicatorPlacementProp ?? "end";
|
|
96
|
-
const indicator = variant === "faq" ? /* @__PURE__ */ jsx(
|
|
97
|
-
"span",
|
|
98
|
-
{
|
|
99
|
-
className: cn(
|
|
100
|
-
"relative inline-block h-3 w-3 shrink-0",
|
|
101
|
-
// horizontal bar (always visible)
|
|
102
|
-
"before:absolute before:left-0 before:top-1/2 before:block before:h-[2px] before:w-full before:-translate-y-1/2 before:rounded-[2px] before:bg-current",
|
|
103
|
-
// vertical bar (rotates to 0 when open)
|
|
104
|
-
"after:absolute after:left-1/2 after:top-0 after:block after:h-full after:w-[2px]",
|
|
105
|
-
"after:-translate-x-1/2 after:rounded-[2px] after:bg-current",
|
|
106
|
-
"after:transition-transform after:duration-200 after:ease-in-out",
|
|
107
|
-
// When parent trigger has data-state="open", rotate vertical bar
|
|
108
|
-
"group-data-[state=open]/trigger:after:rotate-90"
|
|
109
|
-
)
|
|
110
|
-
}
|
|
111
|
-
) : /* @__PURE__ */ jsx(
|
|
112
|
-
"span",
|
|
113
|
-
{
|
|
114
|
-
className: cn(
|
|
115
|
-
"inline-flex shrink-0 transition-transform duration-200",
|
|
116
|
-
"rotate-180",
|
|
117
|
-
"group-data-[state=open]/trigger:rotate-[270deg]"
|
|
118
|
-
),
|
|
119
|
-
children: /* @__PURE__ */ jsx(IndicatorIcon, { className: "h-5 w-5" })
|
|
120
|
-
}
|
|
121
|
-
);
|
|
122
|
-
return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { asChild: true, children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
|
|
123
|
-
AccordionPrimitive.Trigger,
|
|
124
|
-
{
|
|
125
|
-
ref,
|
|
126
|
-
className: cn(
|
|
127
|
-
"group/trigger flex w-full cursor-pointer items-center gap-2 py-3 text-left text-[var(--color-text-primary)]",
|
|
128
|
-
"hover:text-[var(--color-hover)]",
|
|
129
|
-
"focus-visible:outline-none",
|
|
130
|
-
className
|
|
131
|
-
),
|
|
132
|
-
...rest,
|
|
133
|
-
children: [
|
|
134
|
-
indicatorPlacement === "start" && !noIndicator && indicator,
|
|
135
|
-
children,
|
|
136
|
-
indicatorPlacement === "end" && !noIndicator && indicator
|
|
137
|
-
]
|
|
138
|
-
}
|
|
139
|
-
) }) });
|
|
140
|
-
});
|
|
141
|
-
var AccordionItemContent = React.forwardRef(function AccordionItemContent2(props, ref) {
|
|
142
|
-
const { className, children, pb: _pb, pr: _pr, pl: _pl, w: _w, display: _display, flexDir: _flexDir, rowGap: _rowGap, ...rest } = props;
|
|
143
|
-
return /* @__PURE__ */ jsx(
|
|
144
|
-
AccordionPrimitive.Content,
|
|
145
|
-
{
|
|
146
|
-
ref,
|
|
147
|
-
className: cn(
|
|
148
|
-
"overflow-hidden text-[var(--color-text-primary)]",
|
|
149
|
-
"data-[state=open]:animate-accordion-down",
|
|
150
|
-
"data-[state=closed]:animate-accordion-up",
|
|
151
|
-
className
|
|
152
|
-
),
|
|
153
|
-
...rest,
|
|
154
|
-
children: /* @__PURE__ */ jsx("div", { className: "pb-3", children })
|
|
155
|
-
}
|
|
156
|
-
);
|
|
157
|
-
});
|
|
158
|
-
function useAccordion(items) {
|
|
159
|
-
const [value, setValue] = React.useState([]);
|
|
160
|
-
const onValueChange = React.useCallback(({ value: value2 }) => {
|
|
161
|
-
setValue(value2);
|
|
162
|
-
}, []);
|
|
163
|
-
const scrollToItemFromUrl = React.useCallback(() => {
|
|
164
|
-
const hash = window.location.hash.replace("#", "");
|
|
165
|
-
if (!hash) {
|
|
166
|
-
return;
|
|
167
|
-
}
|
|
168
|
-
const itemToScroll = items.find((item) => item.id === hash);
|
|
169
|
-
if (itemToScroll) {
|
|
170
|
-
const el = document.getElementById(itemToScroll.id);
|
|
171
|
-
if (el) {
|
|
172
|
-
el.scrollIntoView({ behavior: "smooth", block: "start" });
|
|
173
|
-
}
|
|
174
|
-
setValue([itemToScroll.id]);
|
|
175
|
-
}
|
|
176
|
-
}, [items]);
|
|
177
|
-
return React.useMemo(() => {
|
|
178
|
-
return {
|
|
179
|
-
value,
|
|
180
|
-
onValueChange,
|
|
181
|
-
scrollToItemFromUrl
|
|
182
|
-
};
|
|
183
|
-
}, [value, onValueChange, scrollToItemFromUrl]);
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
export { AccordionItem, AccordionItemContent, AccordionItemTrigger, AccordionRoot, useAccordion };
|