framepexls-ui-lib 0.2.11 → 0.2.12
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/Checkbox.d.mts +1 -1
- package/dist/Checkbox.d.ts +1 -1
- package/dist/Link.js +3 -4
- package/dist/Link.mjs +3 -4
- package/dist/Pagination.js +5 -18
- package/dist/Pagination.mjs +5 -18
- package/dist/Sidebar.js +24 -17
- package/dist/Sidebar.mjs +24 -17
- package/dist/Table.js +5 -4
- package/dist/Table.mjs +5 -4
- package/package.json +1 -1
package/dist/Checkbox.d.mts
CHANGED
|
@@ -11,7 +11,7 @@ type CheckboxProps = Omit<React__default.InputHTMLAttributes<HTMLInputElement>,
|
|
|
11
11
|
className?: string;
|
|
12
12
|
inputClassName?: string;
|
|
13
13
|
};
|
|
14
|
-
declare const Checkbox: React__default.ForwardRefExoticComponent<Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "
|
|
14
|
+
declare const Checkbox: React__default.ForwardRefExoticComponent<Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
|
|
15
15
|
label?: React__default.ReactNode;
|
|
16
16
|
description?: React__default.ReactNode;
|
|
17
17
|
error?: boolean;
|
package/dist/Checkbox.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ type CheckboxProps = Omit<React__default.InputHTMLAttributes<HTMLInputElement>,
|
|
|
11
11
|
className?: string;
|
|
12
12
|
inputClassName?: string;
|
|
13
13
|
};
|
|
14
|
-
declare const Checkbox: React__default.ForwardRefExoticComponent<Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "
|
|
14
|
+
declare const Checkbox: React__default.ForwardRefExoticComponent<Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
|
|
15
15
|
label?: React__default.ReactNode;
|
|
16
16
|
description?: React__default.ReactNode;
|
|
17
17
|
error?: boolean;
|
package/dist/Link.js
CHANGED
|
@@ -81,12 +81,11 @@ function Link({
|
|
|
81
81
|
...rest,
|
|
82
82
|
children: [
|
|
83
83
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: deco ? "" : "", children }),
|
|
84
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
84
|
+
underline !== "none" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
85
85
|
import_framer_motion.motion.span,
|
|
86
86
|
{
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
style: { backgroundColor: "currentColor", willChange: "transform" },
|
|
87
|
+
className: `absolute left-0 right-0 -bottom-0.5 h-[2px] origin-left rounded-full ${underline === "always" ? "opacity-100" : "opacity-0 group-hover:opacity-100"}`,
|
|
88
|
+
style: { backgroundColor: "currentColor" },
|
|
90
89
|
initial: { scaleX: underline === "always" ? 1 : 0 },
|
|
91
90
|
animate: { scaleX: underline === "always" ? 1 : 0 },
|
|
92
91
|
whileHover: underline === "hover" ? { scaleX: 1 } : void 0,
|
package/dist/Link.mjs
CHANGED
|
@@ -48,12 +48,11 @@ function Link({
|
|
|
48
48
|
...rest,
|
|
49
49
|
children: [
|
|
50
50
|
/* @__PURE__ */ jsx("span", { className: deco ? "" : "", children }),
|
|
51
|
-
/* @__PURE__ */ jsx(
|
|
51
|
+
underline !== "none" && /* @__PURE__ */ jsx(
|
|
52
52
|
motion.span,
|
|
53
53
|
{
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
style: { backgroundColor: "currentColor", willChange: "transform" },
|
|
54
|
+
className: `absolute left-0 right-0 -bottom-0.5 h-[2px] origin-left rounded-full ${underline === "always" ? "opacity-100" : "opacity-0 group-hover:opacity-100"}`,
|
|
55
|
+
style: { backgroundColor: "currentColor" },
|
|
57
56
|
initial: { scaleX: underline === "always" ? 1 : 0 },
|
|
58
57
|
animate: { scaleX: underline === "always" ? 1 : 0 },
|
|
59
58
|
whileHover: underline === "hover" ? { scaleX: 1 } : void 0,
|
package/dist/Pagination.js
CHANGED
|
@@ -33,8 +33,6 @@ __export(Pagination_exports, {
|
|
|
33
33
|
});
|
|
34
34
|
module.exports = __toCommonJS(Pagination_exports);
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
-
var import_framer_motion = require("framer-motion");
|
|
37
|
-
var import_animations = require("./animations");
|
|
38
36
|
var import_Button = __toESM(require("./Button"));
|
|
39
37
|
function Pagination({
|
|
40
38
|
page,
|
|
@@ -111,35 +109,24 @@ function Pagination({
|
|
|
111
109
|
active,
|
|
112
110
|
disabled,
|
|
113
111
|
onClick
|
|
114
|
-
}) => /* @__PURE__ */ (0, import_jsx_runtime.
|
|
112
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
115
113
|
import_Button.default,
|
|
116
114
|
{
|
|
117
115
|
unstyled: true,
|
|
118
116
|
disabled,
|
|
119
117
|
onClick,
|
|
120
118
|
className: `relative h-10 min-w-10 px-3 inline-flex items-center justify-center text-[15px] font-medium transition
|
|
121
|
-
${active ? `${ACTIVE_TEXT[color]}` : "text-slate-900 hover:bg-white/60"}
|
|
119
|
+
${active ? `${PILL_BG[color]} ${ACTIVE_TEXT[color]} rounded-2xl shadow-sm` : "text-slate-900 hover:bg-white/60"}
|
|
122
120
|
${disabled ? "opacity-40 cursor-not-allowed" : ""}`,
|
|
123
121
|
"aria-current": active ? "page" : void 0,
|
|
124
|
-
children
|
|
125
|
-
active && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
126
|
-
import_framer_motion.motion.span,
|
|
127
|
-
{
|
|
128
|
-
layoutId: "pagination-pill",
|
|
129
|
-
transition: import_animations.springSm,
|
|
130
|
-
className: `absolute inset-0 rounded-2xl ${PILL_BG[color]} shadow-sm will-change-transform`,
|
|
131
|
-
style: { willChange: "transform" }
|
|
132
|
-
}
|
|
133
|
-
),
|
|
134
|
-
children
|
|
135
|
-
]
|
|
122
|
+
children
|
|
136
123
|
}
|
|
137
124
|
);
|
|
138
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { className: className || "w-full md:w-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.
|
|
125
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { className: className || "w-full md:w-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative inline-flex overflow-hidden rounded-2xl border border-slate-200 bg-slate-100/60 shadow-sm dark:border-white/10 dark:bg-white/5", children: [
|
|
139
126
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Btn, { disabled: page === 1, onClick: () => onPageChange(page - 1), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", className: "h-5 w-5", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M15 18l-6-6 6-6" }) }) }),
|
|
140
127
|
range.map(
|
|
141
128
|
(it, idx) => it === "..." ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-10 min-w-10 px-3 inline-flex items-center justify-center text-slate-500 dark:text-slate-400", children: "\u2026" }, `dots-${idx}`) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Btn, { active: it === page, onClick: () => onPageChange(it), children: it }, it)
|
|
142
129
|
),
|
|
143
130
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Btn, { disabled: page === totalPages, onClick: () => onPageChange(page + 1), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", className: "h-5 w-5", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 6l6 6-6 6" }) }) })
|
|
144
|
-
] }) })
|
|
131
|
+
] }) });
|
|
145
132
|
}
|
package/dist/Pagination.mjs
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { LayoutGroup, motion } from "framer-motion";
|
|
4
|
-
import { springSm } from "./animations";
|
|
5
3
|
import Button from "./Button";
|
|
6
4
|
function Pagination({
|
|
7
5
|
page,
|
|
@@ -78,37 +76,26 @@ function Pagination({
|
|
|
78
76
|
active,
|
|
79
77
|
disabled,
|
|
80
78
|
onClick
|
|
81
|
-
}) => /* @__PURE__ */
|
|
79
|
+
}) => /* @__PURE__ */ jsx(
|
|
82
80
|
Button,
|
|
83
81
|
{
|
|
84
82
|
unstyled: true,
|
|
85
83
|
disabled,
|
|
86
84
|
onClick,
|
|
87
85
|
className: `relative h-10 min-w-10 px-3 inline-flex items-center justify-center text-[15px] font-medium transition
|
|
88
|
-
${active ? `${ACTIVE_TEXT[color]}` : "text-slate-900 hover:bg-white/60"}
|
|
86
|
+
${active ? `${PILL_BG[color]} ${ACTIVE_TEXT[color]} rounded-2xl shadow-sm` : "text-slate-900 hover:bg-white/60"}
|
|
89
87
|
${disabled ? "opacity-40 cursor-not-allowed" : ""}`,
|
|
90
88
|
"aria-current": active ? "page" : void 0,
|
|
91
|
-
children
|
|
92
|
-
active && /* @__PURE__ */ jsx(
|
|
93
|
-
motion.span,
|
|
94
|
-
{
|
|
95
|
-
layoutId: "pagination-pill",
|
|
96
|
-
transition: springSm,
|
|
97
|
-
className: `absolute inset-0 rounded-2xl ${PILL_BG[color]} shadow-sm will-change-transform`,
|
|
98
|
-
style: { willChange: "transform" }
|
|
99
|
-
}
|
|
100
|
-
),
|
|
101
|
-
children
|
|
102
|
-
]
|
|
89
|
+
children
|
|
103
90
|
}
|
|
104
91
|
);
|
|
105
|
-
return /* @__PURE__ */ jsx("nav", { className: className || "w-full md:w-auto", children: /* @__PURE__ */
|
|
92
|
+
return /* @__PURE__ */ jsx("nav", { className: className || "w-full md:w-auto", children: /* @__PURE__ */ jsxs("div", { className: "relative inline-flex overflow-hidden rounded-2xl border border-slate-200 bg-slate-100/60 shadow-sm dark:border-white/10 dark:bg-white/5", children: [
|
|
106
93
|
/* @__PURE__ */ jsx(Btn, { disabled: page === 1, onClick: () => onPageChange(page - 1), children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-5 w-5", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M15 18l-6-6 6-6" }) }) }),
|
|
107
94
|
range.map(
|
|
108
95
|
(it, idx) => it === "..." ? /* @__PURE__ */ jsx("span", { className: "h-10 min-w-10 px-3 inline-flex items-center justify-center text-slate-500 dark:text-slate-400", children: "\u2026" }, `dots-${idx}`) : /* @__PURE__ */ jsx(Btn, { active: it === page, onClick: () => onPageChange(it), children: it }, it)
|
|
109
96
|
),
|
|
110
97
|
/* @__PURE__ */ jsx(Btn, { disabled: page === totalPages, onClick: () => onPageChange(page + 1), children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-5 w-5", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M9 6l6 6-6 6" }) }) })
|
|
111
|
-
] }) })
|
|
98
|
+
] }) });
|
|
112
99
|
}
|
|
113
100
|
export {
|
|
114
101
|
Pagination as default
|
package/dist/Sidebar.js
CHANGED
|
@@ -226,7 +226,6 @@ function Sidebar({
|
|
|
226
226
|
{
|
|
227
227
|
className: [
|
|
228
228
|
"hidden xl:fixed xl:inset-y-0 xl:flex xl:flex-col xl:border-r xl:border-black/5 bg-white xl:py-6 dark:bg-[var(--fx-surface)] z-40",
|
|
229
|
-
"transition-[width] duration-200",
|
|
230
229
|
collapsed ? "xl:w-28 xl:px-3" : "xl:w-72 xl:px-4"
|
|
231
230
|
].join(" "),
|
|
232
231
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -247,7 +246,7 @@ function Sidebar({
|
|
|
247
246
|
)
|
|
248
247
|
}
|
|
249
248
|
),
|
|
250
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: ["hidden xl:block",
|
|
249
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: ["hidden xl:block", collapsed ? "xl:w-20" : "xl:w-72"].join(" ") }),
|
|
251
250
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { children: drawerOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_framer_motion.motion.div, { className: "fixed inset-0 z-40 xl:hidden", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: [
|
|
252
251
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-black/40" }),
|
|
253
252
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
@@ -258,8 +257,9 @@ function Sidebar({
|
|
|
258
257
|
initial: { x: -340 },
|
|
259
258
|
animate: { x: 0 },
|
|
260
259
|
exit: { x: -340 },
|
|
261
|
-
transition: { type: "
|
|
260
|
+
transition: { type: "tween", duration: 0.22, ease: "easeOut" },
|
|
262
261
|
className: "relative h-full w-[88%] max-w-80 bg-white px-5 py-6 shadow-2xl dark:bg-[var(--fx-surface)]",
|
|
262
|
+
style: { willChange: "transform" },
|
|
263
263
|
children: [
|
|
264
264
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-4 flex items-center justify-between", children: [
|
|
265
265
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -419,15 +419,18 @@ function RenderItem({
|
|
|
419
419
|
isActive ? `${WRAP_ACTIVE[color]} text-slate-900 dark:text-white` : "text-slate-700 hover:bg-slate-100 dark:text-slate-200 dark:hover:bg-white/10"
|
|
420
420
|
].join(" "),
|
|
421
421
|
children: [
|
|
422
|
-
isActive && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
422
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { initial: false, children: isActive && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
423
423
|
import_framer_motion.motion.span,
|
|
424
424
|
{
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
425
|
+
className: `pointer-events-none absolute inset-0 rounded-2xl ${WRAP_ACTIVE[color]}`,
|
|
426
|
+
initial: { opacity: 0 },
|
|
427
|
+
animate: { opacity: 1 },
|
|
428
|
+
exit: { opacity: 0 },
|
|
429
|
+
transition: { duration: 0.12 },
|
|
430
|
+
style: { zIndex: 0 }
|
|
431
|
+
},
|
|
432
|
+
`active-${item.key}`
|
|
433
|
+
) }),
|
|
431
434
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Button.default, { unstyled: true, type: "button", onClick: () => go(item.key), className: "flex min-w-0 flex-1 items-center gap-3", children: [
|
|
432
435
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
433
436
|
"span",
|
|
@@ -472,6 +475,7 @@ function RenderItem({
|
|
|
472
475
|
exit: { height: 0, opacity: 0, y: -4 },
|
|
473
476
|
transition: { type: "tween", duration: 0.18 },
|
|
474
477
|
className: "mt-1 overflow-hidden",
|
|
478
|
+
style: { willChange: "height, opacity, transform" },
|
|
475
479
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-xl border border-slate-200 bg-white shadow-sm dark:border-white/10 dark:bg-white/10", children: children.map((ch) => {
|
|
476
480
|
const active2 = ch.key === activeKey;
|
|
477
481
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -507,15 +511,18 @@ function RenderItem({
|
|
|
507
511
|
collapsed ? "justify-center" : ""
|
|
508
512
|
].join(" "),
|
|
509
513
|
children: [
|
|
510
|
-
active && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
514
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { initial: false, children: active && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
511
515
|
import_framer_motion.motion.span,
|
|
512
516
|
{
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
517
|
+
className: `pointer-events-none absolute inset-0 rounded-2xl ${WRAP_ACTIVE[color]}`,
|
|
518
|
+
initial: { opacity: 0 },
|
|
519
|
+
animate: { opacity: 1 },
|
|
520
|
+
exit: { opacity: 0 },
|
|
521
|
+
transition: { duration: 0.12 },
|
|
522
|
+
style: { zIndex: 0 }
|
|
523
|
+
},
|
|
524
|
+
`active-${item.key}`
|
|
525
|
+
) }),
|
|
519
526
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
520
527
|
"span",
|
|
521
528
|
{
|
package/dist/Sidebar.mjs
CHANGED
|
@@ -193,7 +193,6 @@ function Sidebar({
|
|
|
193
193
|
{
|
|
194
194
|
className: [
|
|
195
195
|
"hidden xl:fixed xl:inset-y-0 xl:flex xl:flex-col xl:border-r xl:border-black/5 bg-white xl:py-6 dark:bg-[var(--fx-surface)] z-40",
|
|
196
|
-
"transition-[width] duration-200",
|
|
197
196
|
collapsed ? "xl:w-28 xl:px-3" : "xl:w-72 xl:px-4"
|
|
198
197
|
].join(" "),
|
|
199
198
|
children: /* @__PURE__ */ jsx(
|
|
@@ -214,7 +213,7 @@ function Sidebar({
|
|
|
214
213
|
)
|
|
215
214
|
}
|
|
216
215
|
),
|
|
217
|
-
/* @__PURE__ */ jsx("div", { className: ["hidden xl:block",
|
|
216
|
+
/* @__PURE__ */ jsx("div", { className: ["hidden xl:block", collapsed ? "xl:w-20" : "xl:w-72"].join(" ") }),
|
|
218
217
|
/* @__PURE__ */ jsx(AnimatePresence, { children: drawerOpen && /* @__PURE__ */ jsxs(motion.div, { className: "fixed inset-0 z-40 xl:hidden", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: [
|
|
219
218
|
/* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/40" }),
|
|
220
219
|
/* @__PURE__ */ jsxs(
|
|
@@ -225,8 +224,9 @@ function Sidebar({
|
|
|
225
224
|
initial: { x: -340 },
|
|
226
225
|
animate: { x: 0 },
|
|
227
226
|
exit: { x: -340 },
|
|
228
|
-
transition: { type: "
|
|
227
|
+
transition: { type: "tween", duration: 0.22, ease: "easeOut" },
|
|
229
228
|
className: "relative h-full w-[88%] max-w-80 bg-white px-5 py-6 shadow-2xl dark:bg-[var(--fx-surface)]",
|
|
229
|
+
style: { willChange: "transform" },
|
|
230
230
|
children: [
|
|
231
231
|
/* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center justify-between", children: [
|
|
232
232
|
/* @__PURE__ */ jsx(
|
|
@@ -386,15 +386,18 @@ function RenderItem({
|
|
|
386
386
|
isActive ? `${WRAP_ACTIVE[color]} text-slate-900 dark:text-white` : "text-slate-700 hover:bg-slate-100 dark:text-slate-200 dark:hover:bg-white/10"
|
|
387
387
|
].join(" "),
|
|
388
388
|
children: [
|
|
389
|
-
isActive && /* @__PURE__ */ jsx(
|
|
389
|
+
/* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: isActive && /* @__PURE__ */ jsx(
|
|
390
390
|
motion.span,
|
|
391
391
|
{
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
392
|
+
className: `pointer-events-none absolute inset-0 rounded-2xl ${WRAP_ACTIVE[color]}`,
|
|
393
|
+
initial: { opacity: 0 },
|
|
394
|
+
animate: { opacity: 1 },
|
|
395
|
+
exit: { opacity: 0 },
|
|
396
|
+
transition: { duration: 0.12 },
|
|
397
|
+
style: { zIndex: 0 }
|
|
398
|
+
},
|
|
399
|
+
`active-${item.key}`
|
|
400
|
+
) }),
|
|
398
401
|
/* @__PURE__ */ jsxs(Button, { unstyled: true, type: "button", onClick: () => go(item.key), className: "flex min-w-0 flex-1 items-center gap-3", children: [
|
|
399
402
|
/* @__PURE__ */ jsx(
|
|
400
403
|
"span",
|
|
@@ -439,6 +442,7 @@ function RenderItem({
|
|
|
439
442
|
exit: { height: 0, opacity: 0, y: -4 },
|
|
440
443
|
transition: { type: "tween", duration: 0.18 },
|
|
441
444
|
className: "mt-1 overflow-hidden",
|
|
445
|
+
style: { willChange: "height, opacity, transform" },
|
|
442
446
|
children: /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-slate-200 bg-white shadow-sm dark:border-white/10 dark:bg-white/10", children: children.map((ch) => {
|
|
443
447
|
const active2 = ch.key === activeKey;
|
|
444
448
|
return /* @__PURE__ */ jsx(
|
|
@@ -474,15 +478,18 @@ function RenderItem({
|
|
|
474
478
|
collapsed ? "justify-center" : ""
|
|
475
479
|
].join(" "),
|
|
476
480
|
children: [
|
|
477
|
-
active && /* @__PURE__ */ jsx(
|
|
481
|
+
/* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: active && /* @__PURE__ */ jsx(
|
|
478
482
|
motion.span,
|
|
479
483
|
{
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
484
|
+
className: `pointer-events-none absolute inset-0 rounded-2xl ${WRAP_ACTIVE[color]}`,
|
|
485
|
+
initial: { opacity: 0 },
|
|
486
|
+
animate: { opacity: 1 },
|
|
487
|
+
exit: { opacity: 0 },
|
|
488
|
+
transition: { duration: 0.12 },
|
|
489
|
+
style: { zIndex: 0 }
|
|
490
|
+
},
|
|
491
|
+
`active-${item.key}`
|
|
492
|
+
) }),
|
|
486
493
|
/* @__PURE__ */ jsx(
|
|
487
494
|
"span",
|
|
488
495
|
{
|
package/dist/Table.js
CHANGED
|
@@ -107,10 +107,11 @@ function SortTh({
|
|
|
107
107
|
active && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
108
108
|
import_framer_motion.motion.span,
|
|
109
109
|
{
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
110
|
+
className: "absolute -bottom-0.5 left-0 right-0 h-0.5 rounded-full bg-current opacity-70",
|
|
111
|
+
initial: { opacity: 0 },
|
|
112
|
+
animate: { opacity: 0.7 },
|
|
113
|
+
exit: { opacity: 0 },
|
|
114
|
+
transition: import_animations.microTransition
|
|
114
115
|
}
|
|
115
116
|
)
|
|
116
117
|
] }),
|
package/dist/Table.mjs
CHANGED
|
@@ -71,10 +71,11 @@ function SortTh({
|
|
|
71
71
|
active && /* @__PURE__ */ jsx(
|
|
72
72
|
motion.span,
|
|
73
73
|
{
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
74
|
+
className: "absolute -bottom-0.5 left-0 right-0 h-0.5 rounded-full bg-current opacity-70",
|
|
75
|
+
initial: { opacity: 0 },
|
|
76
|
+
animate: { opacity: 0.7 },
|
|
77
|
+
exit: { opacity: 0 },
|
|
78
|
+
transition: microTransition
|
|
78
79
|
}
|
|
79
80
|
)
|
|
80
81
|
] }),
|