@mlw-packages/react-components 1.10.21 → 1.10.22

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.js CHANGED
@@ -20090,6 +20090,308 @@ function processNeo4jData(integrations, targetSystemName) {
20090
20090
  connections
20091
20091
  };
20092
20092
  }
20093
+ var AnimatedNumber = ({ value }) => {
20094
+ const [displayed, setDisplayed] = React32__namespace.default.useState(value);
20095
+ const prevRef = React32__namespace.default.useRef(value);
20096
+ React32__namespace.default.useEffect(() => {
20097
+ const start = prevRef.current;
20098
+ const end = value;
20099
+ if (start === end) return;
20100
+ const duration = 420;
20101
+ const startTime = performance.now();
20102
+ const tick = (now) => {
20103
+ const elapsed = now - startTime;
20104
+ const progress = Math.min(elapsed / duration, 1);
20105
+ const eased = progress === 1 ? 1 : 1 - Math.pow(2, -10 * progress);
20106
+ setDisplayed(Math.round(start + (end - start) * eased));
20107
+ if (progress < 1) requestAnimationFrame(tick);
20108
+ else prevRef.current = end;
20109
+ };
20110
+ requestAnimationFrame(tick);
20111
+ }, [value]);
20112
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: displayed });
20113
+ };
20114
+ var Callout = ({
20115
+ sx,
20116
+ sy,
20117
+ mx,
20118
+ my,
20119
+ ex,
20120
+ ey,
20121
+ fill,
20122
+ name,
20123
+ value,
20124
+ percent,
20125
+ isRight
20126
+ }) => /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: /* @__PURE__ */ jsxRuntime.jsxs(
20127
+ framerMotion.motion.g,
20128
+ {
20129
+ initial: { opacity: 0 },
20130
+ animate: { opacity: 1 },
20131
+ exit: { opacity: 0 },
20132
+ transition: { duration: 0.18 },
20133
+ className: "z-9999",
20134
+ children: [
20135
+ /* @__PURE__ */ jsxRuntime.jsx(
20136
+ framerMotion.motion.path,
20137
+ {
20138
+ d: `M${sx},${sy}L${mx},${my}L${ex},${ey}`,
20139
+ stroke: fill,
20140
+ fill: "none",
20141
+ strokeWidth: 1.5,
20142
+ strokeLinecap: "round",
20143
+ initial: { pathLength: 0, opacity: 0 },
20144
+ animate: { pathLength: 1, opacity: 1 },
20145
+ exit: { pathLength: 0, opacity: 0 },
20146
+ transition: { duration: 0.32, ease: "easeInOut" }
20147
+ }
20148
+ ),
20149
+ /* @__PURE__ */ jsxRuntime.jsx(
20150
+ framerMotion.motion.circle,
20151
+ {
20152
+ cx: ex,
20153
+ cy: ey,
20154
+ r: 3,
20155
+ fill,
20156
+ initial: { scale: 0, opacity: 0 },
20157
+ animate: { scale: 1, opacity: 1 },
20158
+ exit: { scale: 0, opacity: 0 }
20159
+ }
20160
+ ),
20161
+ /* @__PURE__ */ jsxRuntime.jsx(
20162
+ "foreignObject",
20163
+ {
20164
+ x: isRight ? ex + 10 : ex - 90,
20165
+ y: ey - 24,
20166
+ width: 90,
20167
+ height: 48,
20168
+ style: { overflow: "visible" },
20169
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
20170
+ framerMotion.motion.div,
20171
+ {
20172
+ initial: {
20173
+ opacity: 0,
20174
+ x: isRight ? -14 : 14,
20175
+ scale: 0.88,
20176
+ filter: "blur(4px)"
20177
+ },
20178
+ animate: { opacity: 1, x: 0, scale: 1, filter: "blur(0px)" },
20179
+ exit: {
20180
+ opacity: 0,
20181
+ x: isRight ? -8 : 8,
20182
+ scale: 0.92,
20183
+ filter: "blur(3px)"
20184
+ },
20185
+ transition: {
20186
+ type: "spring",
20187
+ stiffness: 460,
20188
+ damping: 26,
20189
+ mass: 0.8
20190
+ },
20191
+ style: { pointerEvents: "none" },
20192
+ children: [
20193
+ /* @__PURE__ */ jsxRuntime.jsxs(
20194
+ framerMotion.motion.div,
20195
+ {
20196
+ style: {
20197
+ fontSize: 15,
20198
+ fontWeight: 800,
20199
+ color: "#333",
20200
+ lineHeight: 1
20201
+ },
20202
+ initial: { y: 6, opacity: 0 },
20203
+ animate: { y: 0, opacity: 1 },
20204
+ exit: { y: -4, opacity: 0 },
20205
+ transition: {
20206
+ delay: 0.06,
20207
+ type: "spring",
20208
+ stiffness: 400,
20209
+ damping: 22
20210
+ },
20211
+ children: [
20212
+ "PV ",
20213
+ /* @__PURE__ */ jsxRuntime.jsx(AnimatedNumber, { value })
20214
+ ]
20215
+ }
20216
+ ),
20217
+ /* @__PURE__ */ jsxRuntime.jsxs(
20218
+ framerMotion.motion.div,
20219
+ {
20220
+ style: { fontSize: 11, color: "#999", marginTop: 5 },
20221
+ initial: { y: 6, opacity: 0 },
20222
+ animate: { y: 0, opacity: 1 },
20223
+ exit: { y: -4, opacity: 0 },
20224
+ transition: {
20225
+ delay: 0.12,
20226
+ type: "spring",
20227
+ stiffness: 400,
20228
+ damping: 22
20229
+ },
20230
+ children: [
20231
+ "Rate ",
20232
+ (percent * 100).toFixed(2),
20233
+ "%"
20234
+ ]
20235
+ }
20236
+ )
20237
+ ]
20238
+ },
20239
+ name
20240
+ )
20241
+ }
20242
+ )
20243
+ ]
20244
+ },
20245
+ name
20246
+ ) });
20247
+ var renderActiveShape = (props) => {
20248
+ const RADIAN = Math.PI / 180;
20249
+ const {
20250
+ cx,
20251
+ cy,
20252
+ midAngle,
20253
+ innerRadius,
20254
+ outerRadius,
20255
+ startAngle,
20256
+ endAngle,
20257
+ fill,
20258
+ payload,
20259
+ percent,
20260
+ value
20261
+ } = props;
20262
+ const sin = Math.sin(-RADIAN * (midAngle ?? 0));
20263
+ const cos = Math.cos(-RADIAN * (midAngle ?? 0));
20264
+ const sx = (cx ?? 0) + ((outerRadius ?? 0) + 10) * cos;
20265
+ const sy = (cy ?? 0) + ((outerRadius ?? 0) + 10) * sin;
20266
+ const mx = (cx ?? 0) + ((outerRadius ?? 0) + 30) * cos;
20267
+ const my = (cy ?? 0) + ((outerRadius ?? 0) + 30) * sin;
20268
+ const ex = mx + (cos >= 0 ? 1 : -1) * 22;
20269
+ const ey = my;
20270
+ return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
20271
+ /* @__PURE__ */ jsxRuntime.jsx("text", { x: cx, y: cy, dy: 8, textAnchor: "middle", fill, children: payload?.name }),
20272
+ /* @__PURE__ */ jsxRuntime.jsx(
20273
+ recharts.Sector,
20274
+ {
20275
+ cx,
20276
+ cy,
20277
+ innerRadius,
20278
+ outerRadius,
20279
+ startAngle,
20280
+ endAngle,
20281
+ fill
20282
+ }
20283
+ ),
20284
+ /* @__PURE__ */ jsxRuntime.jsx(
20285
+ recharts.Sector,
20286
+ {
20287
+ cx,
20288
+ cy,
20289
+ startAngle,
20290
+ endAngle,
20291
+ innerRadius: (outerRadius ?? 0) + 6,
20292
+ outerRadius: (outerRadius ?? 0) + 10,
20293
+ fill
20294
+ }
20295
+ ),
20296
+ /* @__PURE__ */ jsxRuntime.jsx(
20297
+ Callout,
20298
+ {
20299
+ sx,
20300
+ sy,
20301
+ mx,
20302
+ my,
20303
+ ex,
20304
+ ey,
20305
+ fill: fill ?? "#8884d8",
20306
+ name: payload?.name,
20307
+ value,
20308
+ percent: percent ?? 0,
20309
+ isRight: cos >= 0
20310
+ }
20311
+ )
20312
+ ] });
20313
+ };
20314
+ var PieChartComponent = ({
20315
+ data,
20316
+ width = 400,
20317
+ height = 300,
20318
+ innerRadius = 60,
20319
+ outerRadius = 80,
20320
+ showLegend = true,
20321
+ showTooltip = true,
20322
+ title,
20323
+ titlePosition = "left",
20324
+ className
20325
+ }) => {
20326
+ const [activeIndex, setActiveIndex] = React32.useState(0);
20327
+ const finalColors = Object.fromEntries(
20328
+ data.map((d) => [d.name, d.color || "#8884d8"])
20329
+ );
20330
+ return /* @__PURE__ */ jsxRuntime.jsxs(
20331
+ "div",
20332
+ {
20333
+ className: cn(
20334
+ "w-full overflow-hidden min-w-0 rounded-lg border-border bg-card",
20335
+ className
20336
+ ),
20337
+ tabIndex: -1,
20338
+ children: [
20339
+ title && /* @__PURE__ */ jsxRuntime.jsx(
20340
+ ChartHeader,
20341
+ {
20342
+ title,
20343
+ titlePosition,
20344
+ HORIZONTAL_PADDING_CLASS: "px-6",
20345
+ data,
20346
+ allKeys: data.map((d) => d.name),
20347
+ processedData: data,
20348
+ finalColors,
20349
+ mapperConfig: Object.fromEntries(
20350
+ data.map((d) => [
20351
+ d.name,
20352
+ { label: d.name, color: d.color || "#8884d8" }
20353
+ ])
20354
+ )
20355
+ }
20356
+ ),
20357
+ /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxRuntime.jsxs(
20358
+ recharts.PieChart,
20359
+ {
20360
+ width: typeof width === "number" ? width : 400,
20361
+ height,
20362
+ margin: { top: 20, right: 80, bottom: 20, left: 80 },
20363
+ children: [
20364
+ /* @__PURE__ */ jsxRuntime.jsx(
20365
+ recharts.Pie,
20366
+ {
20367
+ activeIndex,
20368
+ activeShape: renderActiveShape,
20369
+ data,
20370
+ dataKey: "value",
20371
+ nameKey: "name",
20372
+ cx: "50%",
20373
+ cy: "50%",
20374
+ innerRadius,
20375
+ outerRadius,
20376
+ fill: "#8884d8",
20377
+ onMouseEnter: (_, index) => setActiveIndex(index),
20378
+ onMouseLeave: () => setActiveIndex(void 0),
20379
+ onClick: (e) => {
20380
+ if (e && e.target && typeof e.target.blur === "function") e.target.blur();
20381
+ },
20382
+ children: data.map((entry, index) => /* @__PURE__ */ jsxRuntime.jsx(recharts.Cell, { fill: entry.color || "#8884d8" }, `cell-${index}`))
20383
+ }
20384
+ ),
20385
+ showLegend && /* @__PURE__ */ jsxRuntime.jsx(recharts.Legend, {}),
20386
+ showTooltip && /* @__PURE__ */ jsxRuntime.jsx(recharts.Tooltip, { content: () => null })
20387
+ ]
20388
+ }
20389
+ ) })
20390
+ ]
20391
+ }
20392
+ );
20393
+ };
20394
+ var PieChart_default = PieChartComponent;
20093
20395
  function NumericInput({
20094
20396
  value,
20095
20397
  onChange,
@@ -21084,12 +21386,23 @@ function CarouselBase({
21084
21386
  setDownloadSuccess(false);
21085
21387
  const currentItem = items[index];
21086
21388
  try {
21087
- const response = await fetch(currentItem.url);
21389
+ const response = await fetch(currentItem.url, { mode: "cors" });
21390
+ if (!response.ok) throw new Error("Erro ao baixar imagem");
21088
21391
  const blob = await response.blob();
21089
21392
  const url = window.URL.createObjectURL(blob);
21090
21393
  const link = document.createElement("a");
21091
21394
  link.href = url;
21092
- link.download = currentItem.title || "image";
21395
+ let ext = "";
21396
+ try {
21397
+ const urlObj = new URL(currentItem.url, window.location.href);
21398
+ const path = urlObj.pathname;
21399
+ ext = path.substring(path.lastIndexOf("."));
21400
+ if (!ext || ext.length > 6) ext = "";
21401
+ } catch {
21402
+ }
21403
+ let filename = currentItem.title || "image";
21404
+ if (ext && !filename.endsWith(ext)) filename += ext;
21405
+ link.download = filename;
21093
21406
  document.body.appendChild(link);
21094
21407
  link.click();
21095
21408
  document.body.removeChild(link);
@@ -21098,6 +21411,9 @@ function CarouselBase({
21098
21411
  setDownloadSuccess(true);
21099
21412
  setTimeout(() => setDownloadSuccess(false), 2e3);
21100
21413
  } catch (error) {
21414
+ alert(
21415
+ "Erro ao baixar imagem. Verifique a URL ou permiss\xF5es do servidor."
21416
+ );
21101
21417
  console.error("Error downloading image:", error);
21102
21418
  setIsDownloading(false);
21103
21419
  }
@@ -21139,8 +21455,13 @@ function CarouselBase({
21139
21455
  {
21140
21456
  src: item.url,
21141
21457
  alt: item.title,
21142
- className: cn("w-full h-full select-none"),
21143
- imageClassName,
21458
+ className: cn(
21459
+ "w-full h-full select-none object-contain"
21460
+ ),
21461
+ imageClassName: cn(
21462
+ "object-contain w-full h-full",
21463
+ imageClassName
21464
+ ),
21144
21465
  borderRadius: 8,
21145
21466
  maxZoom: 3
21146
21467
  }
@@ -21997,7 +22318,9 @@ function CommandItemRow({
21997
22318
  item,
21998
22319
  isActive,
21999
22320
  isSelected,
22321
+ multiSelect,
22000
22322
  onSelect,
22323
+ onToggleSelection,
22001
22324
  onHover,
22002
22325
  searchQuery
22003
22326
  }) {
@@ -22005,12 +22328,18 @@ function CommandItemRow({
22005
22328
  framerMotion.motion.button,
22006
22329
  {
22007
22330
  layout: true,
22008
- onClick: onSelect,
22331
+ onClick: (e) => {
22332
+ if (multiSelect && onToggleSelection && (e.ctrlKey || e.metaKey || e.shiftKey)) {
22333
+ onToggleSelection(e);
22334
+ } else {
22335
+ onSelect(e);
22336
+ }
22337
+ },
22009
22338
  onMouseEnter: onHover,
22010
22339
  className: `
22011
- w-full flex items-center gap-1 px-2 py-1 rounded-md text-left cursor-pointer
22340
+ w-full flex items-center gap-1 px-2 py-1 rounded-md text-left cursor-pointer
22012
22341
  transition-colors duration-75 group relative
22013
- ${isActive ? "text-accent-foreground hover:bg-accent" : "hover:bg-accent hover:text-accent-foreground"}
22342
+ ${isActive ? "text-accent-foreground bg-accent" : "hover:bg-accent hover:text-accent-foreground"}
22014
22343
  `,
22015
22344
  children: [
22016
22345
  item.icon && /* @__PURE__ */ jsxRuntime.jsx(
@@ -22022,7 +22351,7 @@ function CommandItemRow({
22022
22351
  }
22023
22352
  ),
22024
22353
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 min-w-0 px-1", children: [
22025
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [
22354
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 flex-wrap", children: [
22026
22355
  /* @__PURE__ */ jsxRuntime.jsx(
22027
22356
  "span",
22028
22357
  {
@@ -22360,7 +22689,7 @@ var VirtualResultList = React32.memo(
22360
22689
  ref: listRef,
22361
22690
  className: "overflow-y-auto overscroll-contain px-2 py-1 [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-muted-foreground/30 [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-muted-foreground/50 transition-colors",
22362
22691
  style: { maxHeight: `min(${LIST_MAX_HEIGHT}px, 60vh)` },
22363
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: totalSize, position: "relative" }, children: virtualItems.map((vItem) => {
22692
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: totalSize, position: "relative", width: "100%" }, children: virtualItems.map((vItem) => {
22364
22693
  const row = rows[vItem.index];
22365
22694
  return /* @__PURE__ */ jsxRuntime.jsx(
22366
22695
  "div",
@@ -22369,9 +22698,10 @@ var VirtualResultList = React32.memo(
22369
22698
  ref: virtualizer.measureElement,
22370
22699
  style: {
22371
22700
  position: "absolute",
22372
- top: vItem.start,
22701
+ top: 0,
22373
22702
  left: 0,
22374
- right: 0
22703
+ width: "100%",
22704
+ transform: `translateY(${vItem.start}px)`
22375
22705
  },
22376
22706
  children: row.kind === "label" ? /* @__PURE__ */ jsxRuntime.jsx(GroupLabel, { group: row.group }) : /* @__PURE__ */ jsxRuntime.jsx("div", { "data-active": row.globalIdx === activeIndex, children: /* @__PURE__ */ jsxRuntime.jsx(
22377
22707
  CommandItemRow,
@@ -22417,7 +22747,7 @@ var FooterBar = React32.memo(
22417
22747
  }
22418
22748
  ),
22419
22749
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
22420
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: "Ctrl+Enter" }),
22750
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[10px] px-1 bg-muted rounded border", children: "Ctrl+Enter" }),
22421
22751
  "Finalizar sele\xE7\xE3o"
22422
22752
  ] })
22423
22753
  ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -22477,9 +22807,9 @@ function CommandPalette(props) {
22477
22807
  showList
22478
22808
  } = useCommandPalette({
22479
22809
  ...props,
22480
- open: isMobile ? true : props.open
22810
+ open: props.open
22481
22811
  });
22482
- useKeyboardShortcut(shortcut.key, () => onOpenChange(!open), {
22812
+ useKeyboardShortcut(shortcut.key, () => onOpenChange?.(!open), {
22483
22813
  ctrl: shortcut.ctrl,
22484
22814
  meta: shortcut.meta,
22485
22815
  shift: shortcut.shift,
@@ -22488,7 +22818,7 @@ function CommandPalette(props) {
22488
22818
  React32.useEffect(() => {
22489
22819
  if (!open) return;
22490
22820
  const handleEscape = (e) => {
22491
- if (e.key === "Escape") onOpenChange(false);
22821
+ if (e.key === "Escape") onOpenChange?.(false);
22492
22822
  };
22493
22823
  document.addEventListener("keydown", handleEscape);
22494
22824
  return () => document.removeEventListener("keydown", handleEscape);
@@ -22515,11 +22845,11 @@ function CommandPalette(props) {
22515
22845
  (val) => {
22516
22846
  setQuery(val);
22517
22847
  setActiveIndex(0);
22518
- if (!open && val.trim() !== "") onOpenChange(true);
22848
+ if (!open && val.trim() !== "") onOpenChange?.(true);
22519
22849
  },
22520
22850
  [setQuery, setActiveIndex, open, onOpenChange]
22521
22851
  );
22522
- const handleClose = React32.useCallback(() => onOpenChange(false), [onOpenChange]);
22852
+ const handleClose = React32.useCallback(() => onOpenChange?.(false), [onOpenChange]);
22523
22853
  const handleClearQuery = React32.useCallback(() => setQuery(""), [setQuery]);
22524
22854
  const searchPlaceholder = multiSearch ? "Buscar\u2026 (separe termos por v\xEDrgula)" : placeholder;
22525
22855
  const sharedListProps = {
@@ -22537,100 +22867,118 @@ function CommandPalette(props) {
22537
22867
  searchQuery: query
22538
22868
  };
22539
22869
  if (isMobile) {
22540
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
22541
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed top-0 left-0 right-0 z-[100] px-3 py-2 bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(
22542
- DebouncedInput,
22870
+ return /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: open && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
22871
+ /* @__PURE__ */ jsxRuntime.jsxs(
22872
+ framerMotion.motion.div,
22543
22873
  {
22544
- ref: inputRef,
22545
- value: query,
22546
- debounce: debounceDelay,
22547
- onChange: handleQueryChangeMobile,
22548
- placeholder: searchPlaceholder
22874
+ initial: { opacity: 0, y: -20 },
22875
+ animate: { opacity: 1, y: 0 },
22876
+ exit: { opacity: 0, y: -20 },
22877
+ className: "fixed top-0 left-0 right-0 z-[100] px-4 py-3 bg-background border-b border-border shadow-sm flex items-center gap-3",
22878
+ children: [
22879
+ /* @__PURE__ */ jsxRuntime.jsx(react.MagnifyingGlassIcon, { className: "w-5 h-5 text-muted-foreground" }),
22880
+ /* @__PURE__ */ jsxRuntime.jsx(
22881
+ DebouncedInput,
22882
+ {
22883
+ ref: inputRef,
22884
+ value: query,
22885
+ debounce: debounceDelay,
22886
+ onChange: handleQueryChangeMobile,
22887
+ placeholder: searchPlaceholder,
22888
+ className: "flex-1 bg-transparent border-none shadow-none focus-visible:ring-0 p-0 text-base"
22889
+ }
22890
+ ),
22891
+ query && /* @__PURE__ */ jsxRuntime.jsx(ButtonBase, { variant: "ghost", size: "icon", onClick: handleClearQuery, className: "h-8 w-8", children: /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { className: "w-4 h-4" }) })
22892
+ ]
22549
22893
  }
22550
- ) }),
22551
- /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: showList && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
22552
- /* @__PURE__ */ jsxRuntime.jsx(
22553
- framerMotion.motion.div,
22554
- {
22555
- initial: { opacity: 0 },
22556
- animate: { opacity: 1 },
22557
- exit: { opacity: 0 },
22558
- transition: ANIMATION.overlay,
22559
- className: "fixed inset-0 z-[98] bg-background/60 backdrop-blur-[2px]",
22560
- onClick: handleClose
22561
- }
22562
- ),
22563
- /* @__PURE__ */ jsxRuntime.jsxs(
22564
- framerMotion.motion.div,
22565
- {
22566
- initial: { opacity: 0, y: -6 },
22567
- animate: { opacity: 1, y: 0 },
22568
- exit: { opacity: 0, y: -6 },
22569
- transition: ANIMATION.mobilePanel,
22570
- className: "fixed left-3 right-3 z-[99] bg-popover border border-border rounded-lg shadow-2xl shadow-black/20 dark:shadow-black/50 overflow-hidden top-14",
22571
- children: [
22572
- /* @__PURE__ */ jsxRuntime.jsx(SearchBadges, { terms: searchTerms }),
22573
- /* @__PURE__ */ jsxRuntime.jsx(VirtualResultList, { ...sharedListProps })
22574
- ]
22575
- }
22576
- )
22577
- ] }) })
22578
- ] });
22894
+ ),
22895
+ /* @__PURE__ */ jsxRuntime.jsx(
22896
+ framerMotion.motion.div,
22897
+ {
22898
+ initial: { opacity: 0 },
22899
+ animate: { opacity: 1 },
22900
+ exit: { opacity: 0 },
22901
+ transition: ANIMATION.overlay,
22902
+ className: "fixed inset-0 z-[98] bg-background/80 backdrop-blur-md",
22903
+ onClick: handleClose
22904
+ }
22905
+ ),
22906
+ showList && /* @__PURE__ */ jsxRuntime.jsxs(
22907
+ framerMotion.motion.div,
22908
+ {
22909
+ initial: { opacity: 0, y: 10 },
22910
+ animate: { opacity: 1, y: 0 },
22911
+ exit: { opacity: 0, y: 10 },
22912
+ transition: ANIMATION.mobilePanel,
22913
+ className: "fixed inset-x-0 bottom-0 top-[60px] z-[99] bg-background overflow-hidden flex flex-col",
22914
+ children: [
22915
+ /* @__PURE__ */ jsxRuntime.jsx(SearchBadges, { terms: searchTerms }),
22916
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(VirtualResultList, { ...sharedListProps }) })
22917
+ ]
22918
+ }
22919
+ )
22920
+ ] }) });
22579
22921
  }
22580
- return /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: open && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(
22581
- framerMotion.motion.div,
22582
- {
22583
- initial: { opacity: 0, scale: 0.96, y: -8 },
22584
- animate: { opacity: 1, scale: 1, y: 0 },
22585
- exit: { opacity: 0, scale: 0.96, y: -8 },
22586
- transition: ANIMATION.panel,
22587
- className: "fixed z-[100] top-4 -translate-x-1/2 w-full max-w-xl rounded-xl border border-border overflow-hidden shadow-2xl shadow-black/20 dark:shadow-black/60 bg-popover/95 backdrop-blur-xl",
22588
- style: { maxHeight: "min(600px, 80vh)" },
22589
- children: [
22590
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-4 py-2 border-b border-border", children: [
22591
- /* @__PURE__ */ jsxRuntime.jsx(
22592
- react.MagnifyingGlassIcon,
22593
- {
22594
- className: "w-4 h-4 text-muted-foreground flex-shrink-0",
22595
- weight: "bold"
22596
- }
22597
- ),
22922
+ return /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: open && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
22923
+ /* @__PURE__ */ jsxRuntime.jsx(
22924
+ framerMotion.motion.div,
22925
+ {
22926
+ initial: { opacity: 0 },
22927
+ animate: { opacity: 1 },
22928
+ exit: { opacity: 0 },
22929
+ className: "fixed inset-0 z-[99] bg-black/40 backdrop-blur-sm",
22930
+ onClick: handleClose
22931
+ }
22932
+ ),
22933
+ /* @__PURE__ */ jsxRuntime.jsxs(
22934
+ framerMotion.motion.div,
22935
+ {
22936
+ initial: { opacity: 0, scale: 0.96, y: -8 },
22937
+ animate: { opacity: 1, scale: 1, y: 0 },
22938
+ exit: { opacity: 0, scale: 0.96, y: -8 },
22939
+ transition: ANIMATION.panel,
22940
+ className: "fixed z-[100] top-4 -translate-x-1/2 w-full max-w-xl rounded-xl border border-border overflow-hidden shadow-2xl shadow-black/20 dark:shadow-black/60 bg-popover/95 backdrop-blur-xl",
22941
+ style: { maxHeight: "min(600px, 80vh)" },
22942
+ children: [
22943
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-4 py-2 border-b border-border", children: [
22944
+ /* @__PURE__ */ jsxRuntime.jsx(react.MagnifyingGlassIcon, { className: "w-4 h-4 text-muted-foreground flex-shrink-0", weight: "bold" }),
22945
+ /* @__PURE__ */ jsxRuntime.jsx(
22946
+ DebouncedInput,
22947
+ {
22948
+ ref: inputRef,
22949
+ value: query,
22950
+ debounce: debounceDelay,
22951
+ onChange: handleQueryChange,
22952
+ placeholder: searchPlaceholder,
22953
+ rightIcon: query ? /* @__PURE__ */ jsxRuntime.jsx(
22954
+ ButtonBase,
22955
+ {
22956
+ variant: "ghost",
22957
+ size: "icon",
22958
+ onClick: handleClearQuery,
22959
+ className: "text-muted-foreground hover:text-red-500 hover:bg-transparent transition-colors",
22960
+ children: /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { className: "w-4 h-4" })
22961
+ }
22962
+ ) : void 0,
22963
+ className: "flex-1 bg-transparent border-none focus-visible:ring-0 outline-none shadow-none px-0 h-7 text-sm caret-primary"
22964
+ }
22965
+ )
22966
+ ] }),
22967
+ /* @__PURE__ */ jsxRuntime.jsx(SearchBadges, { terms: searchTerms }),
22968
+ showList && /* @__PURE__ */ jsxRuntime.jsx(VirtualResultList, { ...sharedListProps }),
22598
22969
  /* @__PURE__ */ jsxRuntime.jsx(
22599
- DebouncedInput,
22970
+ FooterBar,
22600
22971
  {
22601
- ref: inputRef,
22602
- value: query,
22603
- debounce: debounceDelay,
22604
- onChange: handleQueryChange,
22605
- placeholder: searchPlaceholder,
22606
- rightIcon: query ? /* @__PURE__ */ jsxRuntime.jsx(
22607
- ButtonBase,
22608
- {
22609
- variant: "ghost",
22610
- size: "icon",
22611
- onClick: handleClearQuery,
22612
- className: "text-muted-foreground hover:text-red-500 hover:bg-transparent transition-colors",
22613
- children: /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { className: "w-4 h-4" })
22614
- }
22615
- ) : void 0,
22616
- className: "flex-1 bg-transparent border-none focus-visible:ring-0 outline-none shadow-none px-0 h-7 text-sm caret-primary"
22972
+ footer,
22973
+ totalItems,
22974
+ selectedCount: selectedItemIds.size,
22975
+ executeBulkAction
22617
22976
  }
22618
22977
  )
22619
- ] }),
22620
- /* @__PURE__ */ jsxRuntime.jsx(SearchBadges, { terms: searchTerms }),
22621
- showList && /* @__PURE__ */ jsxRuntime.jsx(VirtualResultList, { ...sharedListProps }),
22622
- /* @__PURE__ */ jsxRuntime.jsx(
22623
- FooterBar,
22624
- {
22625
- footer,
22626
- totalItems,
22627
- selectedCount: selectedItemIds.size,
22628
- executeBulkAction
22629
- }
22630
- )
22631
- ]
22632
- }
22633
- ) }) });
22978
+ ]
22979
+ }
22980
+ )
22981
+ ] }) });
22634
22982
  }
22635
22983
 
22636
22984
  exports.AddButton = AddButton;
@@ -22847,6 +23195,7 @@ exports.NoData = NoData_default;
22847
23195
  exports.NotificationButton = NotificationButton;
22848
23196
  exports.NumericInput = NumericInput;
22849
23197
  exports.PeriodsDropdown = PeriodsDropdown_default;
23198
+ exports.PieChartComponent = PieChart_default;
22850
23199
  exports.PopoverAnchorBase = PopoverAnchorBase;
22851
23200
  exports.PopoverBase = PopoverBase;
22852
23201
  exports.PopoverContentBase = PopoverContentBase;