@particle-academy/react-fancy 5.50.0 → 5.51.1

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.
Files changed (121) hide show
  1. package/CHANGELOG.md +68 -0
  2. package/dist/chart.cjs +2 -2
  3. package/dist/chart.d.cts +9 -1
  4. package/dist/chart.d.ts +9 -1
  5. package/dist/chart.js +1 -1
  6. package/dist/{chunk-T5OCRKPD.cjs → chunk-23PAOCQQ.cjs} +4 -4
  7. package/dist/{chunk-T5OCRKPD.cjs.map → chunk-23PAOCQQ.cjs.map} +1 -1
  8. package/dist/{chunk-GBGJWAXZ.cjs → chunk-25UPDBI6.cjs} +4 -4
  9. package/dist/{chunk-GBGJWAXZ.cjs.map → chunk-25UPDBI6.cjs.map} +1 -1
  10. package/dist/chunk-3K2CEAI7.js +78 -0
  11. package/dist/chunk-3K2CEAI7.js.map +1 -0
  12. package/dist/{chunk-L637KPEA.js → chunk-4NBM3LXN.js} +3 -3
  13. package/dist/{chunk-L637KPEA.js.map → chunk-4NBM3LXN.js.map} +1 -1
  14. package/dist/{chunk-2QIGXSSZ.cjs → chunk-7ZDJPHLJ.cjs} +6 -6
  15. package/dist/{chunk-2QIGXSSZ.cjs.map → chunk-7ZDJPHLJ.cjs.map} +1 -1
  16. package/dist/{chunk-3AQLEMH7.js → chunk-AOFDFBRV.js} +12 -4
  17. package/dist/chunk-AOFDFBRV.js.map +1 -0
  18. package/dist/{chunk-VWBKFQQN.cjs → chunk-ATANWEXA.cjs} +8 -8
  19. package/dist/{chunk-VWBKFQQN.cjs.map → chunk-ATANWEXA.cjs.map} +1 -1
  20. package/dist/{chunk-7B3HK6TY.cjs → chunk-B6CQ4KK7.cjs} +6 -4
  21. package/dist/chunk-B6CQ4KK7.cjs.map +1 -0
  22. package/dist/{chunk-YQJWD53X.js → chunk-ENYHLZ2X.js} +3 -3
  23. package/dist/{chunk-YQJWD53X.js.map → chunk-ENYHLZ2X.js.map} +1 -1
  24. package/dist/chunk-FQZE5N2N.cjs +80 -0
  25. package/dist/chunk-FQZE5N2N.cjs.map +1 -0
  26. package/dist/{chunk-PV5WDIGM.cjs → chunk-FVG3YXXM.cjs} +4 -4
  27. package/dist/{chunk-PV5WDIGM.cjs.map → chunk-FVG3YXXM.cjs.map} +1 -1
  28. package/dist/{chunk-KYZNCVRD.js → chunk-FYKOLKQZ.js} +43 -26
  29. package/dist/chunk-FYKOLKQZ.js.map +1 -0
  30. package/dist/{chunk-FU6R6BZ4.js → chunk-GAB2QXHH.js} +102 -40
  31. package/dist/chunk-GAB2QXHH.js.map +1 -0
  32. package/dist/{chunk-Z43BI7CQ.cjs → chunk-GU5BYZTR.cjs} +4 -4
  33. package/dist/{chunk-Z43BI7CQ.cjs.map → chunk-GU5BYZTR.cjs.map} +1 -1
  34. package/dist/{chunk-TXCAIL5X.cjs → chunk-HKRB2Z6R.cjs} +4 -4
  35. package/dist/{chunk-TXCAIL5X.cjs.map → chunk-HKRB2Z6R.cjs.map} +1 -1
  36. package/dist/{chunk-7MJ7VEKE.js → chunk-IAUJKZAQ.js} +3 -3
  37. package/dist/{chunk-7MJ7VEKE.js.map → chunk-IAUJKZAQ.js.map} +1 -1
  38. package/dist/{chunk-CK6LRROH.js → chunk-M5ACSJJ4.js} +6 -4
  39. package/dist/chunk-M5ACSJJ4.js.map +1 -0
  40. package/dist/{chunk-XBC3M4BL.js → chunk-MGE5KOVA.js} +3 -3
  41. package/dist/{chunk-XBC3M4BL.js.map → chunk-MGE5KOVA.js.map} +1 -1
  42. package/dist/{chunk-IPBEVSSC.cjs → chunk-MH4QS7OE.cjs} +6 -6
  43. package/dist/{chunk-IPBEVSSC.cjs.map → chunk-MH4QS7OE.cjs.map} +1 -1
  44. package/dist/{chunk-P7F32HIH.js → chunk-N6OZZAOT.js} +3 -3
  45. package/dist/{chunk-P7F32HIH.js.map → chunk-N6OZZAOT.js.map} +1 -1
  46. package/dist/{chunk-VFIVF5YO.js → chunk-PHDIQ4VC.js} +3 -3
  47. package/dist/{chunk-VFIVF5YO.js.map → chunk-PHDIQ4VC.js.map} +1 -1
  48. package/dist/{chunk-UBZFOTZN.cjs → chunk-PLNDZF2A.cjs} +12 -4
  49. package/dist/chunk-PLNDZF2A.cjs.map +1 -0
  50. package/dist/{chunk-MSRYJETY.cjs → chunk-R3UG6PVX.cjs} +42 -25
  51. package/dist/chunk-R3UG6PVX.cjs.map +1 -0
  52. package/dist/{chunk-NAQJF3G6.cjs → chunk-SAPOYAGN.cjs} +101 -39
  53. package/dist/chunk-SAPOYAGN.cjs.map +1 -0
  54. package/dist/{chunk-BR27AXFE.cjs → chunk-SYVOGYJG.cjs} +9 -9
  55. package/dist/{chunk-BR27AXFE.cjs.map → chunk-SYVOGYJG.cjs.map} +1 -1
  56. package/dist/{chunk-NYDR2VSA.js → chunk-TNYWQ6EQ.js} +3 -3
  57. package/dist/{chunk-NYDR2VSA.js.map → chunk-TNYWQ6EQ.js.map} +1 -1
  58. package/dist/{chunk-SWBF2BXA.js → chunk-TT3K5D6J.js} +3 -3
  59. package/dist/{chunk-SWBF2BXA.js.map → chunk-TT3K5D6J.js.map} +1 -1
  60. package/dist/{chunk-W7IP6RT3.cjs → chunk-WBVWV2V7.cjs} +4 -4
  61. package/dist/{chunk-W7IP6RT3.cjs.map → chunk-WBVWV2V7.cjs.map} +1 -1
  62. package/dist/{chunk-EEWRLFTI.js → chunk-XB6YHUKW.js} +3 -3
  63. package/dist/{chunk-EEWRLFTI.js.map → chunk-XB6YHUKW.js.map} +1 -1
  64. package/dist/{chunk-D354R6T6.js → chunk-ZY4CVNNZ.js} +3 -3
  65. package/dist/{chunk-D354R6T6.js.map → chunk-ZY4CVNNZ.js.map} +1 -1
  66. package/dist/command.cjs +4 -4
  67. package/dist/command.js +2 -2
  68. package/dist/composer.cjs +7 -5
  69. package/dist/composer.js +5 -3
  70. package/dist/context-menu.cjs +4 -4
  71. package/dist/context-menu.js +2 -2
  72. package/dist/drawer.cjs +4 -4
  73. package/dist/drawer.js +2 -2
  74. package/dist/dropdown.cjs +4 -4
  75. package/dist/dropdown.js +2 -2
  76. package/dist/editor.cjs +1 -1
  77. package/dist/editor.js +1 -1
  78. package/dist/index.cjs +67 -67
  79. package/dist/index.d.cts +11 -1
  80. package/dist/index.d.ts +11 -1
  81. package/dist/index.js +17 -17
  82. package/dist/input.cjs +6 -4
  83. package/dist/input.js +5 -3
  84. package/dist/inputs.cjs +4 -4
  85. package/dist/inputs.js +3 -3
  86. package/dist/json-editor.cjs +15 -15
  87. package/dist/json-editor.js +4 -4
  88. package/dist/magic-wand.cjs +3 -2
  89. package/dist/magic-wand.d.cts +51 -6
  90. package/dist/magic-wand.d.ts +51 -6
  91. package/dist/magic-wand.js +2 -1
  92. package/dist/mobile-menu.cjs +4 -4
  93. package/dist/mobile-menu.js +2 -2
  94. package/dist/modal.cjs +4 -4
  95. package/dist/modal.js +2 -2
  96. package/dist/paste-pills.cjs +17 -15
  97. package/dist/paste-pills.d.cts +3 -1
  98. package/dist/paste-pills.d.ts +3 -1
  99. package/dist/paste-pills.js +4 -2
  100. package/dist/prompt-input.cjs +7 -4
  101. package/dist/prompt-input.js +6 -3
  102. package/dist/sidebar.cjs +1 -1
  103. package/dist/sidebar.js +1 -1
  104. package/dist/styles.css.map +1 -1
  105. package/dist/toast.cjs +3 -3
  106. package/dist/toast.js +1 -1
  107. package/docs/Chart.md +6 -0
  108. package/docs/MagicWand.md +29 -2
  109. package/package.json +1 -1
  110. package/dist/chunk-3AQLEMH7.js.map +0 -1
  111. package/dist/chunk-3WGRVDQR.cjs +0 -39
  112. package/dist/chunk-3WGRVDQR.cjs.map +0 -1
  113. package/dist/chunk-7B3HK6TY.cjs.map +0 -1
  114. package/dist/chunk-CHADHN6M.js +0 -37
  115. package/dist/chunk-CHADHN6M.js.map +0 -1
  116. package/dist/chunk-CK6LRROH.js.map +0 -1
  117. package/dist/chunk-FU6R6BZ4.js.map +0 -1
  118. package/dist/chunk-KYZNCVRD.js.map +0 -1
  119. package/dist/chunk-MSRYJETY.cjs.map +0 -1
  120. package/dist/chunk-NAQJF3G6.cjs.map +0 -1
  121. package/dist/chunk-UBZFOTZN.cjs.map +0 -1
package/CHANGELOG.md CHANGED
@@ -11,6 +11,74 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
11
11
 
12
12
  ## [Unreleased]
13
13
 
14
+ ## [5.51.1] - 2026-10-20
15
+
16
+ ### Fixed
17
+
18
+ - **`Toast.Stack`'s "+N" badge is readable in dark mode whatever is behind it**
19
+ (fancy-app-update#1). It was the soft zinc `Badge`, whose dark background is
20
+ `dark:bg-zinc-900/30` -- 30% opaque -- and it sits over the cards peeking out
21
+ behind the front one, so over a light image header its zinc-300 text was on a
22
+ light screenshot. It now paints an opaque `dark:bg-zinc-800` with
23
+ `dark:text-zinc-100`, plus a `ring-1` (`ring-zinc-200` / `dark:ring-zinc-700`)
24
+ and `shadow-sm` so it stands off a card edge. Light mode keeps `bg-zinc-100`
25
+ / `text-zinc-700`. Every `Toast.Stack` gets this, `AppUpdateStack` included.
26
+ **Nothing to do.** `Badge` itself is unchanged: every other soft badge keeps
27
+ its look.
28
+
29
+ ## [5.51.0] - 2026-10-20
30
+
31
+ ### Added
32
+
33
+ - **`Chart.Sparkline` takes `min`**: the value the bottom edge stands for.
34
+ `min={0}` scales from zero, the way `Chart.Line` and `Chart.Bar` always do, so
35
+ a window where every point had activity no longer draws its quietest point on
36
+ the floor (and a flat busy series draws along the top, not the bottom). A value
37
+ below `min` extends the scale instead of being drawn outside the box.
38
+ **Nothing to do:** without `min` the scale still starts at the data's minimum.
39
+ - **`MagicWand` takes `target`**, so it can act on a textarea, input or editor
40
+ the HOST renders. Pass a ref to a textarea / input as is, or for anything else
41
+ (a code editor, a contenteditable) an adapter:
42
+ `{ element, getSelection: () => ({ start, end }) | null, getSelectionRect? }`.
43
+ With `target`, MagicWand renders no textarea of its own, only the wand
44
+ (portalled, viewport-positioned). The write still goes through
45
+ `onValueChange`, and `value` must be the target's current value.
46
+ **Nothing to do** without `target`: the built-in textarea is unchanged.
47
+ - `MagicWandTarget`, `MagicWandTargetAdapter`, `MagicWandRect` type exports.
48
+ - Stable handles on the wand: `data-react-fancy-magic-wand` on the toolbar and
49
+ `data-react-fancy-magic-wand-action="<id>"` on each action.
50
+
51
+ ### Changed
52
+
53
+ - **Paste pills preview in a `Popover`, not a `Tooltip`** (`Composer`,
54
+ `PromptInput` and `Input` with inline paste). It opens on hover AND on focus,
55
+ so a keyboard user gets the same preview; the image pill is now focusable
56
+ (`tabIndex=0`) for that. An image pill shows its thumbnail; if the image cannot
57
+ load (typically a CSP without `blob:` in `img-src`) it shows its label instead
58
+ of an empty box, and the `<img>` now carries the label as `alt`.
59
+ **If you relied on the tooltip:** the preview now sits in
60
+ `[data-react-fancy-popover]`, not `[data-react-fancy-tooltip]`, and has no
61
+ `role="tooltip"`; update any selector or test that looked for those. It looks
62
+ like a Popover (light panel, border) rather than the dark tooltip bubble;
63
+ `classNames.preview` still merges onto it, so restyle there. It stays open
64
+ while the pointer is over it and closes ~300ms after leaving, and Escape closes
65
+ it. `data-react-fancy-composer-paste-pill-preview` and `renderPastePreview` are
66
+ unchanged: that is already the slot for supplying your own preview content.
67
+
68
+ ### Fixed
69
+
70
+ - **A closed `Drawer` unmounts even when no exit animation runs.** `useAnimation`
71
+ unmounted ONLY on `animationend`, so in an app that does not load Fancy's
72
+ stylesheet (and in jsdom) a closed panel stayed in the DOM forever. It now
73
+ measures the exit (`getAnimations()`, else the computed animation / transition
74
+ duration): nothing running unmounts at once, something running unmounts on its
75
+ own `animationend` or after its measured duration, whichever comes first. A
76
+ child's `animationend` bubbling up no longer ends the exit early. The same hook
77
+ drives **`Modal`, `Command`, `ContextMenu`, `Dropdown` and `MobileMenu`'s
78
+ flyout**, which had the same defect and get the same fix. **Nothing to do**; if
79
+ you worked around it (forcing a remount, a `key`, your own timeout), you can
80
+ remove the workaround.
81
+
14
82
  ## [5.50.0] - 2026-10-19
15
83
 
16
84
  ### Added
package/dist/chart.cjs CHANGED
@@ -1,13 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var chunk7B3HK6TY_cjs = require('./chunk-7B3HK6TY.cjs');
3
+ var chunkB6CQ4KK7_cjs = require('./chunk-B6CQ4KK7.cjs');
4
4
  require('./chunk-ZU5Q77OT.cjs');
5
5
 
6
6
 
7
7
 
8
8
  Object.defineProperty(exports, "Chart", {
9
9
  enumerable: true,
10
- get: function () { return chunk7B3HK6TY_cjs.Chart; }
10
+ get: function () { return chunkB6CQ4KK7_cjs.Chart; }
11
11
  });
12
12
  //# sourceMappingURL=chart.cjs.map
13
13
  //# sourceMappingURL=chart.cjs.map
package/dist/chart.d.cts CHANGED
@@ -73,6 +73,14 @@ interface ChartSparklineProps {
73
73
  width?: number;
74
74
  height?: number;
75
75
  color?: string;
76
+ /**
77
+ * The value the bottom edge stands for. Default: the data's own minimum, so
78
+ * the line uses the full height. `min={0}` scales from zero, as `Chart.Line`
79
+ * and `Chart.Bar` always do, so a run of busy-but-quiet values does not sit on
80
+ * the floor. A value below `min` extends the scale rather than being drawn
81
+ * outside the box.
82
+ */
83
+ min?: number;
76
84
  className?: string;
77
85
  }
78
86
  interface ChartHorizontalBarProps {
@@ -111,7 +119,7 @@ declare namespace ChartPie {
111
119
  var displayName: string;
112
120
  }
113
121
 
114
- declare function ChartSparkline({ data, width, height, color, className, }: ChartSparklineProps): react.JSX.Element;
122
+ declare function ChartSparkline({ data, width, height, color, min: floor, className, }: ChartSparklineProps): react.JSX.Element;
115
123
  declare namespace ChartSparkline {
116
124
  var displayName: string;
117
125
  }
package/dist/chart.d.ts CHANGED
@@ -73,6 +73,14 @@ interface ChartSparklineProps {
73
73
  width?: number;
74
74
  height?: number;
75
75
  color?: string;
76
+ /**
77
+ * The value the bottom edge stands for. Default: the data's own minimum, so
78
+ * the line uses the full height. `min={0}` scales from zero, as `Chart.Line`
79
+ * and `Chart.Bar` always do, so a run of busy-but-quiet values does not sit on
80
+ * the floor. A value below `min` extends the scale rather than being drawn
81
+ * outside the box.
82
+ */
83
+ min?: number;
76
84
  className?: string;
77
85
  }
78
86
  interface ChartHorizontalBarProps {
@@ -111,7 +119,7 @@ declare namespace ChartPie {
111
119
  var displayName: string;
112
120
  }
113
121
 
114
- declare function ChartSparkline({ data, width, height, color, className, }: ChartSparklineProps): react.JSX.Element;
122
+ declare function ChartSparkline({ data, width, height, color, min: floor, className, }: ChartSparklineProps): react.JSX.Element;
115
123
  declare namespace ChartSparkline {
116
124
  var displayName: string;
117
125
  }
package/dist/chart.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Chart } from './chunk-CK6LRROH.js';
1
+ export { Chart } from './chunk-M5ACSJJ4.js';
2
2
  import './chunk-MMW2JGKZ.js';
3
3
  //# sourceMappingURL=chart.js.map
4
4
  //# sourceMappingURL=chart.js.map
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunk3WGRVDQR_cjs = require('./chunk-3WGRVDQR.cjs');
3
+ var chunkFQZE5N2N_cjs = require('./chunk-FQZE5N2N.cjs');
4
4
  var chunkJ2DI6RMR_cjs = require('./chunk-J2DI6RMR.cjs');
5
5
  var chunkNBZC6LOB_cjs = require('./chunk-NBZC6LOB.cjs');
6
6
  var chunk57FQGQJK_cjs = require('./chunk-57FQGQJK.cjs');
@@ -50,7 +50,7 @@ function DropdownItems({ children, className }) {
50
50
  }, [setOpen, setActiveIndex]);
51
51
  chunk57FQGQJK_cjs.useOutsideClick(outsideRef, close, open, anchorRef);
52
52
  chunkRXDRYWVD_cjs.useEscapeKey(close, open);
53
- const { mounted, className: animClass, ref: animRef } = chunk3WGRVDQR_cjs.useAnimation({
53
+ const { mounted, className: animClass, ref: animRef } = chunkFQZE5N2N_cjs.useAnimation({
54
54
  open,
55
55
  enterClass: "fancy-scale-in",
56
56
  exitClass: "fancy-fade-out"
@@ -168,5 +168,5 @@ var Dropdown = Object.assign(DropdownRoot, {
168
168
 
169
169
  exports.Dropdown = Dropdown;
170
170
  exports.useDropdown = useDropdown;
171
- //# sourceMappingURL=chunk-T5OCRKPD.cjs.map
172
- //# sourceMappingURL=chunk-T5OCRKPD.cjs.map
171
+ //# sourceMappingURL=chunk-23PAOCQQ.cjs.map
172
+ //# sourceMappingURL=chunk-23PAOCQQ.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Dropdown/Dropdown.context.ts","../src/components/Dropdown/DropdownTrigger.tsx","../src/components/Dropdown/DropdownItems.tsx","../src/components/Dropdown/DropdownItem.tsx","../src/components/Dropdown/DropdownSeparator.tsx","../src/components/Dropdown/Dropdown.tsx"],"names":["createContext","useContext","jsx","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","useAnimation","useEffect","Portal","cn","useState","useMemo"],"mappings":"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","file":"chunk-T5OCRKPD.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DropdownContextValue } from \"./Dropdown.types\";\n\nexport const DropdownContext = createContext<DropdownContextValue | null>(null);\n\nexport function useDropdown(): DropdownContextValue {\n const ctx = useContext(DropdownContext);\n if (!ctx) {\n throw new Error(\n \"Dropdown compound components must be used within <Dropdown>\",\n );\n }\n return ctx;\n}\n","import { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownTriggerProps } from \"./Dropdown.types\";\n\nexport function DropdownTrigger({ children }: DropdownTriggerProps) {\n const { setOpen, open, anchorRef } = useDropdown();\n\n return (\n <span\n ref={anchorRef as React.RefObject<HTMLSpanElement>}\n data-react-fancy-dropdown-trigger=\"\"\n className=\"inline-flex\"\n onClick={() => setOpen(!open)}\n aria-expanded={open}\n aria-haspopup=\"menu\"\n >\n {children}\n </span>\n );\n}\n\nDropdownTrigger.displayName = \"DropdownTrigger\";\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DropdownItemsProps } from \"./Dropdown.types\";\n\nexport function DropdownItems({ children, className }: DropdownItemsProps) {\n const { open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset } =\n useDropdown();\n const floatingRef = useRef<HTMLDivElement>(null);\n const outsideRef = useRef<HTMLDivElement>(null);\n\n const position = useFloatingPosition(anchorRef, floatingRef, {\n placement,\n offset,\n enabled: open,\n });\n\n const close = useCallback(() => {\n setOpen(false);\n setActiveIndex(-1);\n }, [setOpen, setActiveIndex]);\n\n useOutsideClick(outsideRef, close, open, anchorRef);\n useEscapeKey(close, open);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-scale-in\",\n exitClass: \"fancy-fade-out\",\n });\n\n useEffect(() => {\n if (!open || !floatingRef.current) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = floatingRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n setActiveIndex(next);\n items[next]?.focus();\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n setActiveIndex(prev);\n items[prev]?.focus();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex, setActiveIndex]);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <div\n ref={(node) => {\n outsideRef.current = node;\n floatingRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n }}\n data-react-fancy-dropdown=\"\"\n role=\"menu\"\n className={cn(\n \"fixed z-50 min-w-[8rem] rounded-xl border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n style={{ left: position.x, top: position.y }}\n >\n {children}\n </div>\n </Portal>\n );\n}\n\nDropdownItems.displayName = \"DropdownItems\";\n","import { cn } from \"../../utils/cn\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownItemProps } from \"./Dropdown.types\";\n\nexport function DropdownItem({\n children,\n onClick,\n disabled = false,\n danger = false,\n className,\n}: DropdownItemProps) {\n const { setOpen } = useDropdown();\n\n return (\n <button\n data-react-fancy-dropdown-item=\"\"\n type=\"button\"\n role=\"menuitem\"\n disabled={disabled}\n aria-disabled={disabled}\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n danger\n ? \"text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950\"\n : \"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n onClick={() => {\n if (disabled) return;\n onClick?.();\n setOpen(false);\n }}\n >\n {children}\n </button>\n );\n}\n\nDropdownItem.displayName = \"DropdownItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { DropdownSeparatorProps } from \"./Dropdown.types\";\n\nexport function DropdownSeparator({ className }: DropdownSeparatorProps) {\n return (\n <div\n data-react-fancy-dropdown-separator=\"\"\n role=\"separator\"\n className={cn(\n \"my-1 h-px bg-zinc-200 dark:bg-zinc-700\",\n className,\n )}\n />\n );\n}\n\nDropdownSeparator.displayName = \"DropdownSeparator\";\n","import { useMemo, useRef, useState } from \"react\";\nimport { DropdownContext } from \"./Dropdown.context\";\nimport { DropdownTrigger } from \"./DropdownTrigger\";\nimport { DropdownItems } from \"./DropdownItems\";\nimport { DropdownItem } from \"./DropdownItem\";\nimport { DropdownSeparator } from \"./DropdownSeparator\";\nimport type { DropdownProps } from \"./Dropdown.types\";\n\nfunction DropdownRoot({\n children,\n placement = \"bottom-start\",\n offset = 4,\n}: DropdownProps) {\n const [open, setOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n const anchorRef = useRef<HTMLElement>(null);\n\n const ctx = useMemo(\n () => ({ open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset }),\n [open, anchorRef, activeIndex, placement, offset],\n );\n\n return (\n <DropdownContext.Provider value={ctx}>{children}</DropdownContext.Provider>\n );\n}\n\nexport const Dropdown = Object.assign(DropdownRoot, {\n Trigger: DropdownTrigger,\n Items: DropdownItems,\n Item: DropdownItem,\n Separator: DropdownSeparator,\n});\n"]}
1
+ {"version":3,"sources":["../src/components/Dropdown/Dropdown.context.ts","../src/components/Dropdown/DropdownTrigger.tsx","../src/components/Dropdown/DropdownItems.tsx","../src/components/Dropdown/DropdownItem.tsx","../src/components/Dropdown/DropdownSeparator.tsx","../src/components/Dropdown/Dropdown.tsx"],"names":["createContext","useContext","jsx","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","useAnimation","useEffect","Portal","cn","useState","useMemo"],"mappings":"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","file":"chunk-23PAOCQQ.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DropdownContextValue } from \"./Dropdown.types\";\n\nexport const DropdownContext = createContext<DropdownContextValue | null>(null);\n\nexport function useDropdown(): DropdownContextValue {\n const ctx = useContext(DropdownContext);\n if (!ctx) {\n throw new Error(\n \"Dropdown compound components must be used within <Dropdown>\",\n );\n }\n return ctx;\n}\n","import { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownTriggerProps } from \"./Dropdown.types\";\n\nexport function DropdownTrigger({ children }: DropdownTriggerProps) {\n const { setOpen, open, anchorRef } = useDropdown();\n\n return (\n <span\n ref={anchorRef as React.RefObject<HTMLSpanElement>}\n data-react-fancy-dropdown-trigger=\"\"\n className=\"inline-flex\"\n onClick={() => setOpen(!open)}\n aria-expanded={open}\n aria-haspopup=\"menu\"\n >\n {children}\n </span>\n );\n}\n\nDropdownTrigger.displayName = \"DropdownTrigger\";\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DropdownItemsProps } from \"./Dropdown.types\";\n\nexport function DropdownItems({ children, className }: DropdownItemsProps) {\n const { open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset } =\n useDropdown();\n const floatingRef = useRef<HTMLDivElement>(null);\n const outsideRef = useRef<HTMLDivElement>(null);\n\n const position = useFloatingPosition(anchorRef, floatingRef, {\n placement,\n offset,\n enabled: open,\n });\n\n const close = useCallback(() => {\n setOpen(false);\n setActiveIndex(-1);\n }, [setOpen, setActiveIndex]);\n\n useOutsideClick(outsideRef, close, open, anchorRef);\n useEscapeKey(close, open);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-scale-in\",\n exitClass: \"fancy-fade-out\",\n });\n\n useEffect(() => {\n if (!open || !floatingRef.current) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n const items = floatingRef.current?.querySelectorAll<HTMLElement>(\n '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n );\n if (!items?.length) return;\n\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n setActiveIndex(next);\n items[next]?.focus();\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n setActiveIndex(prev);\n items[prev]?.focus();\n }\n };\n\n document.addEventListener(\"keydown\", handleKeyDown);\n return () => document.removeEventListener(\"keydown\", handleKeyDown);\n }, [open, activeIndex, setActiveIndex]);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <div\n ref={(node) => {\n outsideRef.current = node;\n floatingRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n }}\n data-react-fancy-dropdown=\"\"\n role=\"menu\"\n className={cn(\n \"fixed z-50 min-w-[8rem] rounded-xl border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\",\n animClass,\n className,\n )}\n style={{ left: position.x, top: position.y }}\n >\n {children}\n </div>\n </Portal>\n );\n}\n\nDropdownItems.displayName = \"DropdownItems\";\n","import { cn } from \"../../utils/cn\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownItemProps } from \"./Dropdown.types\";\n\nexport function DropdownItem({\n children,\n onClick,\n disabled = false,\n danger = false,\n className,\n}: DropdownItemProps) {\n const { setOpen } = useDropdown();\n\n return (\n <button\n data-react-fancy-dropdown-item=\"\"\n type=\"button\"\n role=\"menuitem\"\n disabled={disabled}\n aria-disabled={disabled}\n className={cn(\n \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n danger\n ? \"text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950\"\n : \"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n onClick={() => {\n if (disabled) return;\n onClick?.();\n setOpen(false);\n }}\n >\n {children}\n </button>\n );\n}\n\nDropdownItem.displayName = \"DropdownItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { DropdownSeparatorProps } from \"./Dropdown.types\";\n\nexport function DropdownSeparator({ className }: DropdownSeparatorProps) {\n return (\n <div\n data-react-fancy-dropdown-separator=\"\"\n role=\"separator\"\n className={cn(\n \"my-1 h-px bg-zinc-200 dark:bg-zinc-700\",\n className,\n )}\n />\n );\n}\n\nDropdownSeparator.displayName = \"DropdownSeparator\";\n","import { useMemo, useRef, useState } from \"react\";\nimport { DropdownContext } from \"./Dropdown.context\";\nimport { DropdownTrigger } from \"./DropdownTrigger\";\nimport { DropdownItems } from \"./DropdownItems\";\nimport { DropdownItem } from \"./DropdownItem\";\nimport { DropdownSeparator } from \"./DropdownSeparator\";\nimport type { DropdownProps } from \"./Dropdown.types\";\n\nfunction DropdownRoot({\n children,\n placement = \"bottom-start\",\n offset = 4,\n}: DropdownProps) {\n const [open, setOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n const anchorRef = useRef<HTMLElement>(null);\n\n const ctx = useMemo(\n () => ({ open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset }),\n [open, anchorRef, activeIndex, placement, offset],\n );\n\n return (\n <DropdownContext.Provider value={ctx}>{children}</DropdownContext.Provider>\n );\n}\n\nexport const Dropdown = Object.assign(DropdownRoot, {\n Trigger: DropdownTrigger,\n Items: DropdownItems,\n Item: DropdownItem,\n Separator: DropdownSeparator,\n});\n"]}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunk3WGRVDQR_cjs = require('./chunk-3WGRVDQR.cjs');
3
+ var chunkFQZE5N2N_cjs = require('./chunk-FQZE5N2N.cjs');
4
4
  var chunkNBZC6LOB_cjs = require('./chunk-NBZC6LOB.cjs');
5
5
  var chunkRXDRYWVD_cjs = require('./chunk-RXDRYWVD.cjs');
6
6
  var chunkZU5Q77OT_cjs = require('./chunk-ZU5Q77OT.cjs');
@@ -25,7 +25,7 @@ function MobileMenuFlyout({
25
25
  className
26
26
  }) {
27
27
  const isLeft = side === "left";
28
- const { mounted, className: animClass, ref } = chunk3WGRVDQR_cjs.useAnimation({
28
+ const { mounted, className: animClass, ref } = chunkFQZE5N2N_cjs.useAnimation({
29
29
  open,
30
30
  enterClass: isLeft ? "fancy-slide-in-left" : "fancy-slide-in-right",
31
31
  exitClass: isLeft ? "fancy-slide-out-left" : "fancy-slide-out-right"
@@ -175,5 +175,5 @@ var MobileMenu = {
175
175
 
176
176
  exports.MobileMenu = MobileMenu;
177
177
  exports.useMobileMenu = useMobileMenu;
178
- //# sourceMappingURL=chunk-GBGJWAXZ.cjs.map
179
- //# sourceMappingURL=chunk-GBGJWAXZ.cjs.map
178
+ //# sourceMappingURL=chunk-25UPDBI6.cjs.map
179
+ //# sourceMappingURL=chunk-25UPDBI6.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MobileMenu/MobileMenu.context.ts","../src/components/MobileMenu/MobileMenuFlyout.tsx","../src/components/MobileMenu/MobileMenuBottomBar.tsx","../src/components/MobileMenu/MobileMenuItem.tsx","../src/components/MobileMenu/MobileMenu.tsx"],"names":["createContext","useContext","useAnimation","useEscapeKey","useEffect","Portal","jsx","jsxs","cn","X"],"mappings":"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","file":"chunk-GBGJWAXZ.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { MobileMenuContextValue } from \"./MobileMenu.types\";\n\nexport const MobileMenuContext = createContext<MobileMenuContextValue | null>(null);\n\nexport function useMobileMenu(): MobileMenuContextValue {\n const ctx = useContext(MobileMenuContext);\n if (!ctx) {\n throw new Error(\"useMobileMenu must be used within a <MobileMenu> component\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useEscapeKey } from \"../../hooks\";\nimport { useAnimation } from \"../../hooks\";\nimport { Portal } from \"../Portal\";\nimport { MobileMenuContext } from \"./MobileMenu.context\";\nimport type { MobileMenuFlyoutProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuFlyout({\n children,\n open,\n onClose,\n side = \"left\",\n title,\n className,\n}: MobileMenuFlyoutProps) {\n const isLeft = side === \"left\";\n\n const { mounted, className: animClass, ref } = useAnimation({\n open,\n enterClass: isLeft ? \"fancy-slide-in-left\" : \"fancy-slide-in-right\",\n exitClass: isLeft ? \"fancy-slide-out-left\" : \"fancy-slide-out-right\",\n });\n\n useEscapeKey(onClose, open);\n\n // Lock body scroll\n useEffect(() => {\n if (open) {\n const prev = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = prev;\n };\n }\n }, [open]);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <MobileMenuContext.Provider value={{ variant: \"flyout\" }}>\n <div data-react-fancy-mobile-menu-flyout=\"\" className=\"fixed inset-0 z-50\">\n {/* Backdrop */}\n <div\n className={cn(\n \"absolute inset-0 bg-black/40 transition-opacity\",\n open ? \"opacity-100\" : \"opacity-0\",\n )}\n onClick={onClose}\n />\n\n {/* Panel */}\n <div\n ref={ref as React.RefObject<HTMLDivElement>}\n className={cn(\n \"absolute top-0 flex h-full w-72 max-w-[80vw] flex-col bg-white shadow-xl dark:bg-zinc-900\",\n isLeft ? \"left-0\" : \"right-0\",\n animClass,\n className,\n )}\n >\n {/* Header */}\n <div className=\"flex items-center justify-between border-b border-zinc-200 px-4 py-3 dark:border-zinc-700\">\n {title && (\n <span className=\"text-sm font-semibold text-zinc-900 dark:text-zinc-100\">\n {title}\n </span>\n )}\n {!title && <span />}\n <button\n type=\"button\"\n onClick={onClose}\n className=\"flex h-8 w-8 items-center justify-center rounded-md text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n\n {/* Content */}\n <div className=\"flex-1 overflow-y-auto p-2\">\n {children}\n </div>\n </div>\n </div>\n </MobileMenuContext.Provider>\n </Portal>\n );\n}\n\nMobileMenuFlyout.displayName = \"MobileMenuFlyout\";\n","import { cn } from \"../../utils/cn\";\nimport { MobileMenuContext } from \"./MobileMenu.context\";\nimport type { MobileMenuBottomBarProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuBottomBar({ children, className }: MobileMenuBottomBarProps) {\n return (\n <MobileMenuContext.Provider value={{ variant: \"bottom-bar\" }}>\n <nav\n data-react-fancy-mobile-menu-bottom-bar=\"\"\n className={cn(\n \"fixed inset-x-0 bottom-0 z-40 flex items-stretch border-t border-zinc-200 bg-white/95 backdrop-blur-sm dark:border-zinc-700 dark:bg-zinc-900/95\",\n \"pb-[env(safe-area-inset-bottom)]\",\n className,\n )}\n >\n {children}\n </nav>\n </MobileMenuContext.Provider>\n );\n}\n\nMobileMenuBottomBar.displayName = \"MobileMenuBottomBar\";\n","import type { ElementType } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useMobileMenu } from \"./MobileMenu.context\";\nimport type { MobileMenuItemProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuItem({\n children,\n href,\n as: As,\n icon,\n active = false,\n disabled = false,\n badge,\n onClick,\n className,\n ...rest\n}: MobileMenuItemProps) {\n const { variant } = useMobileMenu();\n const isBottomBar = variant === \"bottom-bar\";\n\n // See NavigableProps: link mode engages on `href` OR `as`. Keeping `onClick`\n // in link mode matters most here — a mobile item usually has to close the menu\n // as well as navigate, and it was silently dropped.\n const isLink = Boolean(href || As);\n const Tag = isLink ? ((As ?? \"a\") as ElementType) : \"button\";\n const tagProps = isLink\n ? { ...(href ? { href } : {}), onClick }\n : { type: \"button\" as const, onClick };\n\n if (isBottomBar) {\n return (\n <Tag\n {...tagProps}\n {...rest}\n data-react-fancy-mobile-menu-item=\"\"\n data-active={active || undefined}\n aria-current={active ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n className={cn(\n \"flex flex-1 flex-col items-center justify-center gap-0.5 py-1.5 text-xs font-medium transition-colors\",\n \"outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-inset\",\n active\n ? \"text-blue-600 dark:text-blue-400\"\n : \"text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-100\",\n disabled && \"pointer-events-none opacity-50\",\n className,\n )}\n >\n {icon && <span className=\"flex h-5 w-5 items-center justify-center\">{icon}</span>}\n <span className=\"truncate\">{children}</span>\n {badge && <span className=\"absolute right-1 top-0.5\">{badge}</span>}\n </Tag>\n );\n }\n\n // Flyout variant — same as a vertical menu item\n return (\n <Tag\n {...tagProps}\n {...rest}\n data-react-fancy-mobile-menu-item=\"\"\n data-active={active || undefined}\n aria-current={active ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n className={cn(\n \"flex w-full items-center gap-3 rounded-md px-3 py-2.5 text-sm font-medium transition-colors\",\n \"outline-none focus-visible:ring-2 focus-visible:ring-blue-500\",\n active\n ? \"bg-zinc-100 text-zinc-900 dark:bg-zinc-800 dark:text-zinc-100\"\n : \"text-zinc-600 hover:bg-zinc-50 hover:text-zinc-900 dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-zinc-100\",\n disabled && \"pointer-events-none opacity-50\",\n className,\n )}\n >\n {icon && <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>}\n <span className=\"flex-1 truncate text-left\">{children}</span>\n {badge && <span className=\"shrink-0\">{badge}</span>}\n </Tag>\n );\n}\n\nMobileMenuItem.displayName = \"MobileMenuItem\";\n","import { MobileMenuFlyout } from \"./MobileMenuFlyout\";\nimport { MobileMenuBottomBar } from \"./MobileMenuBottomBar\";\nimport { MobileMenuItem } from \"./MobileMenuItem\";\n\nexport const MobileMenu = {\n Flyout: MobileMenuFlyout,\n BottomBar: MobileMenuBottomBar,\n Item: MobileMenuItem,\n};\n"]}
1
+ {"version":3,"sources":["../src/components/MobileMenu/MobileMenu.context.ts","../src/components/MobileMenu/MobileMenuFlyout.tsx","../src/components/MobileMenu/MobileMenuBottomBar.tsx","../src/components/MobileMenu/MobileMenuItem.tsx","../src/components/MobileMenu/MobileMenu.tsx"],"names":["createContext","useContext","useAnimation","useEscapeKey","useEffect","Portal","jsx","jsxs","cn","X"],"mappings":"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","file":"chunk-25UPDBI6.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { MobileMenuContextValue } from \"./MobileMenu.types\";\n\nexport const MobileMenuContext = createContext<MobileMenuContextValue | null>(null);\n\nexport function useMobileMenu(): MobileMenuContextValue {\n const ctx = useContext(MobileMenuContext);\n if (!ctx) {\n throw new Error(\"useMobileMenu must be used within a <MobileMenu> component\");\n }\n return ctx;\n}\n","import { useEffect } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useEscapeKey } from \"../../hooks\";\nimport { useAnimation } from \"../../hooks\";\nimport { Portal } from \"../Portal\";\nimport { MobileMenuContext } from \"./MobileMenu.context\";\nimport type { MobileMenuFlyoutProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuFlyout({\n children,\n open,\n onClose,\n side = \"left\",\n title,\n className,\n}: MobileMenuFlyoutProps) {\n const isLeft = side === \"left\";\n\n const { mounted, className: animClass, ref } = useAnimation({\n open,\n enterClass: isLeft ? \"fancy-slide-in-left\" : \"fancy-slide-in-right\",\n exitClass: isLeft ? \"fancy-slide-out-left\" : \"fancy-slide-out-right\",\n });\n\n useEscapeKey(onClose, open);\n\n // Lock body scroll\n useEffect(() => {\n if (open) {\n const prev = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = prev;\n };\n }\n }, [open]);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <MobileMenuContext.Provider value={{ variant: \"flyout\" }}>\n <div data-react-fancy-mobile-menu-flyout=\"\" className=\"fixed inset-0 z-50\">\n {/* Backdrop */}\n <div\n className={cn(\n \"absolute inset-0 bg-black/40 transition-opacity\",\n open ? \"opacity-100\" : \"opacity-0\",\n )}\n onClick={onClose}\n />\n\n {/* Panel */}\n <div\n ref={ref as React.RefObject<HTMLDivElement>}\n className={cn(\n \"absolute top-0 flex h-full w-72 max-w-[80vw] flex-col bg-white shadow-xl dark:bg-zinc-900\",\n isLeft ? \"left-0\" : \"right-0\",\n animClass,\n className,\n )}\n >\n {/* Header */}\n <div className=\"flex items-center justify-between border-b border-zinc-200 px-4 py-3 dark:border-zinc-700\">\n {title && (\n <span className=\"text-sm font-semibold text-zinc-900 dark:text-zinc-100\">\n {title}\n </span>\n )}\n {!title && <span />}\n <button\n type=\"button\"\n onClick={onClose}\n className=\"flex h-8 w-8 items-center justify-center rounded-md text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n\n {/* Content */}\n <div className=\"flex-1 overflow-y-auto p-2\">\n {children}\n </div>\n </div>\n </div>\n </MobileMenuContext.Provider>\n </Portal>\n );\n}\n\nMobileMenuFlyout.displayName = \"MobileMenuFlyout\";\n","import { cn } from \"../../utils/cn\";\nimport { MobileMenuContext } from \"./MobileMenu.context\";\nimport type { MobileMenuBottomBarProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuBottomBar({ children, className }: MobileMenuBottomBarProps) {\n return (\n <MobileMenuContext.Provider value={{ variant: \"bottom-bar\" }}>\n <nav\n data-react-fancy-mobile-menu-bottom-bar=\"\"\n className={cn(\n \"fixed inset-x-0 bottom-0 z-40 flex items-stretch border-t border-zinc-200 bg-white/95 backdrop-blur-sm dark:border-zinc-700 dark:bg-zinc-900/95\",\n \"pb-[env(safe-area-inset-bottom)]\",\n className,\n )}\n >\n {children}\n </nav>\n </MobileMenuContext.Provider>\n );\n}\n\nMobileMenuBottomBar.displayName = \"MobileMenuBottomBar\";\n","import type { ElementType } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useMobileMenu } from \"./MobileMenu.context\";\nimport type { MobileMenuItemProps } from \"./MobileMenu.types\";\n\nexport function MobileMenuItem({\n children,\n href,\n as: As,\n icon,\n active = false,\n disabled = false,\n badge,\n onClick,\n className,\n ...rest\n}: MobileMenuItemProps) {\n const { variant } = useMobileMenu();\n const isBottomBar = variant === \"bottom-bar\";\n\n // See NavigableProps: link mode engages on `href` OR `as`. Keeping `onClick`\n // in link mode matters most here — a mobile item usually has to close the menu\n // as well as navigate, and it was silently dropped.\n const isLink = Boolean(href || As);\n const Tag = isLink ? ((As ?? \"a\") as ElementType) : \"button\";\n const tagProps = isLink\n ? { ...(href ? { href } : {}), onClick }\n : { type: \"button\" as const, onClick };\n\n if (isBottomBar) {\n return (\n <Tag\n {...tagProps}\n {...rest}\n data-react-fancy-mobile-menu-item=\"\"\n data-active={active || undefined}\n aria-current={active ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n className={cn(\n \"flex flex-1 flex-col items-center justify-center gap-0.5 py-1.5 text-xs font-medium transition-colors\",\n \"outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-inset\",\n active\n ? \"text-blue-600 dark:text-blue-400\"\n : \"text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-100\",\n disabled && \"pointer-events-none opacity-50\",\n className,\n )}\n >\n {icon && <span className=\"flex h-5 w-5 items-center justify-center\">{icon}</span>}\n <span className=\"truncate\">{children}</span>\n {badge && <span className=\"absolute right-1 top-0.5\">{badge}</span>}\n </Tag>\n );\n }\n\n // Flyout variant — same as a vertical menu item\n return (\n <Tag\n {...tagProps}\n {...rest}\n data-react-fancy-mobile-menu-item=\"\"\n data-active={active || undefined}\n aria-current={active ? \"page\" : undefined}\n aria-disabled={disabled || undefined}\n className={cn(\n \"flex w-full items-center gap-3 rounded-md px-3 py-2.5 text-sm font-medium transition-colors\",\n \"outline-none focus-visible:ring-2 focus-visible:ring-blue-500\",\n active\n ? \"bg-zinc-100 text-zinc-900 dark:bg-zinc-800 dark:text-zinc-100\"\n : \"text-zinc-600 hover:bg-zinc-50 hover:text-zinc-900 dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-zinc-100\",\n disabled && \"pointer-events-none opacity-50\",\n className,\n )}\n >\n {icon && <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>}\n <span className=\"flex-1 truncate text-left\">{children}</span>\n {badge && <span className=\"shrink-0\">{badge}</span>}\n </Tag>\n );\n}\n\nMobileMenuItem.displayName = \"MobileMenuItem\";\n","import { MobileMenuFlyout } from \"./MobileMenuFlyout\";\nimport { MobileMenuBottomBar } from \"./MobileMenuBottomBar\";\nimport { MobileMenuItem } from \"./MobileMenuItem\";\n\nexport const MobileMenu = {\n Flyout: MobileMenuFlyout,\n BottomBar: MobileMenuBottomBar,\n Item: MobileMenuItem,\n};\n"]}
@@ -0,0 +1,78 @@
1
+ import { useState, useRef, useEffect } from 'react';
2
+
3
+ // src/hooks/use-animation.ts
4
+ var FALLBACK_GRACE_MS = 50;
5
+ function toMs(list) {
6
+ if (!list) return [0];
7
+ return list.split(",").map((part) => {
8
+ const v = part.trim();
9
+ const n = parseFloat(v);
10
+ if (Number.isNaN(n)) return 0;
11
+ return v.endsWith("ms") ? n : n * 1e3;
12
+ });
13
+ }
14
+ function longest(durations, delays) {
15
+ const d = toMs(durations);
16
+ const l = toMs(delays);
17
+ let max = 0;
18
+ for (let i = 0; i < Math.max(d.length, l.length); i++) {
19
+ max = Math.max(max, d[i % d.length] + l[i % l.length]);
20
+ }
21
+ return max;
22
+ }
23
+ function exitDuration(el) {
24
+ if (typeof el.getAnimations === "function" && el.getAnimations().length === 0) return 0;
25
+ if (typeof window === "undefined" || typeof window.getComputedStyle !== "function") return 0;
26
+ const style = window.getComputedStyle(el);
27
+ const name = style.animationName;
28
+ const animation = name && name !== "none" ? longest(style.animationDuration, style.animationDelay) : 0;
29
+ const transition = longest(style.transitionDuration, style.transitionDelay);
30
+ return Math.max(animation, transition);
31
+ }
32
+ function useAnimation({
33
+ open,
34
+ enterClass,
35
+ exitClass
36
+ }) {
37
+ const [mounted, setMounted] = useState(open);
38
+ const [animClass, setAnimClass] = useState(open ? enterClass : "");
39
+ const ref = useRef(null);
40
+ useEffect(() => {
41
+ if (open) {
42
+ setMounted(true);
43
+ setAnimClass(enterClass);
44
+ } else if (mounted) {
45
+ setAnimClass(exitClass);
46
+ }
47
+ }, [open, enterClass, exitClass, mounted]);
48
+ const exiting = !open && mounted && animClass === exitClass;
49
+ useEffect(() => {
50
+ if (!exiting) return;
51
+ const finish = () => {
52
+ setMounted(false);
53
+ setAnimClass("");
54
+ };
55
+ const el = ref.current;
56
+ const wait = el ? exitDuration(el) : 0;
57
+ if (!el || wait <= 0) {
58
+ finish();
59
+ return;
60
+ }
61
+ const onEnd = (e) => {
62
+ if (e.target === el) finish();
63
+ };
64
+ el.addEventListener("animationend", onEnd);
65
+ el.addEventListener("transitionend", onEnd);
66
+ const timer = setTimeout(finish, wait + FALLBACK_GRACE_MS);
67
+ return () => {
68
+ el.removeEventListener("animationend", onEnd);
69
+ el.removeEventListener("transitionend", onEnd);
70
+ clearTimeout(timer);
71
+ };
72
+ }, [exiting]);
73
+ return { mounted, className: animClass, ref };
74
+ }
75
+
76
+ export { useAnimation };
77
+ //# sourceMappingURL=chunk-3K2CEAI7.js.map
78
+ //# sourceMappingURL=chunk-3K2CEAI7.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/hooks/use-animation.ts"],"names":[],"mappings":"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","file":"chunk-3K2CEAI7.js","sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\ninterface UseAnimationOptions {\n open: boolean;\n enterClass: string;\n exitClass: string;\n}\n\ninterface UseAnimationReturn {\n mounted: boolean;\n className: string;\n ref: React.RefObject<HTMLElement | null>;\n}\n\n/** Slack on top of the measured exit, so the fallback never cuts a real animation short. */\nconst FALLBACK_GRACE_MS = 50;\n\n/** `\"0.2s, 150ms\"` -> `[200, 150]`. Unparseable entries count as 0. */\nfunction toMs(list: string | undefined): number[] {\n if (!list) return [0];\n return list.split(\",\").map((part) => {\n const v = part.trim();\n const n = parseFloat(v);\n if (Number.isNaN(n)) return 0;\n return v.endsWith(\"ms\") ? n : n * 1000;\n });\n}\n\n/** The longest duration + delay pair, CSS-style (the shorter list repeats). */\nfunction longest(durations: string | undefined, delays: string | undefined): number {\n const d = toMs(durations);\n const l = toMs(delays);\n let max = 0;\n for (let i = 0; i < Math.max(d.length, l.length); i++) {\n max = Math.max(max, d[i % d.length]! + l[i % l.length]!);\n }\n return max;\n}\n\n/**\n * How long the element's exit will take, in ms. 0 means nothing is running, so\n * there is no `animationend` to wait for.\n *\n * `getAnimations()` is asked first where it exists: it is the engine's own answer\n * and covers transitions too. Where it does not (jsdom, older engines) the\n * computed style is read instead — an `animation-name` of `none` (or none at all,\n * which is what an app without Fancy's stylesheet gets) means no animation.\n */\nfunction exitDuration(el: HTMLElement): number {\n if (typeof el.getAnimations === \"function\" && el.getAnimations().length === 0) return 0;\n if (typeof window === \"undefined\" || typeof window.getComputedStyle !== \"function\") return 0;\n\n const style = window.getComputedStyle(el);\n const name = style.animationName;\n const animation =\n name && name !== \"none\" ? longest(style.animationDuration, style.animationDelay) : 0;\n const transition = longest(style.transitionDuration, style.transitionDelay);\n\n return Math.max(animation, transition);\n}\n\n/**\n * Mount on open, play `exitClass` on close, then unmount.\n *\n * The unmount used to happen ONLY on `animationend`. With no animation running —\n * an app that does not load Fancy's stylesheet, jsdom, an `exitClass` that\n * resolves to nothing — the event never fires and the closed panel stayed in the\n * DOM forever. So the exit is measured: nothing running unmounts at once,\n * something running unmounts on its own `animationend` or after its measured\n * duration, whichever comes first.\n */\nexport function useAnimation({\n open,\n enterClass,\n exitClass,\n}: UseAnimationOptions): UseAnimationReturn {\n const [mounted, setMounted] = useState(open);\n const [animClass, setAnimClass] = useState(open ? enterClass : \"\");\n const ref = useRef<HTMLElement | null>(null);\n\n useEffect(() => {\n if (open) {\n setMounted(true);\n setAnimClass(enterClass);\n } else if (mounted) {\n setAnimClass(exitClass);\n }\n }, [open, enterClass, exitClass, mounted]);\n\n // Runs once the exit class is on the element, so the measurement sees it.\n const exiting = !open && mounted && animClass === exitClass;\n\n useEffect(() => {\n if (!exiting) return;\n\n const finish = () => {\n setMounted(false);\n setAnimClass(\"\");\n };\n\n const el = ref.current;\n const wait = el ? exitDuration(el) : 0;\n if (!el || wait <= 0) {\n finish();\n return;\n }\n\n // Only the element's OWN animation: a child's `animationend` bubbles here\n // too, and must not cut the exit short.\n const onEnd = (e: Event) => {\n if (e.target === el) finish();\n };\n el.addEventListener(\"animationend\", onEnd);\n el.addEventListener(\"transitionend\", onEnd);\n const timer = setTimeout(finish, wait + FALLBACK_GRACE_MS);\n\n return () => {\n el.removeEventListener(\"animationend\", onEnd);\n el.removeEventListener(\"transitionend\", onEnd);\n clearTimeout(timer);\n };\n }, [exiting]);\n\n return { mounted, className: animClass, ref };\n}\n"]}
@@ -1,4 +1,4 @@
1
- import { useInlinePaste, withSeparators, endsOf, InlinePasteEditor, PastedFilesInput } from './chunk-KYZNCVRD.js';
1
+ import { useInlinePaste, withSeparators, endsOf, InlinePasteEditor, PastedFilesInput } from './chunk-FYKOLKQZ.js';
2
2
  import { useControllableState } from './chunk-EDYAXGUM.js';
3
3
  import { cn } from './chunk-MMW2JGKZ.js';
4
4
  import { forwardRef, useRef, useMemo, useCallback } from 'react';
@@ -231,5 +231,5 @@ ${text}` : text);
231
231
  Composer.displayName = "Composer";
232
232
 
233
233
  export { Composer };
234
- //# sourceMappingURL=chunk-L637KPEA.js.map
235
- //# sourceMappingURL=chunk-L637KPEA.js.map
234
+ //# sourceMappingURL=chunk-4NBM3LXN.js.map
235
+ //# sourceMappingURL=chunk-4NBM3LXN.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Composer/Composer.tsx"],"names":["Composer","paste"],"mappings":"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","file":"chunk-L637KPEA.js","sourcesContent":["import { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport {\n endsOf,\n InlinePasteEditor,\n PastedFilesInput,\n useInlinePaste,\n withSeparators,\n type HeldPaste,\n type InlinePasteEditorHandle,\n} from \"../PastePills\";\nimport type { ComposerProps } from \"./Composer.types\";\n\n/** Characters of a held paste shown at each end of the hover preview, unless `previewChars` says otherwise. */\nconst PREVIEW_CHARS = 20;\n\nexport const Composer = forwardRef<HTMLDivElement, ComposerProps>(\n function Composer(\n {\n value: controlledValue,\n defaultValue = \"\",\n onChange,\n onSubmit,\n placeholder = \"Type a message...\",\n actions,\n disabled = false,\n className,\n pasteThreshold,\n pastePlacement = \"above\",\n pasteImages = false,\n previewChars = PREVIEW_CHARS,\n renderPastePreview,\n classNames,\n heldPastes: controlledHeldPastes,\n onHeldPastesChange,\n heldImages: controlledHeldImages,\n onHeldImagesChange,\n pasteFilesName,\n },\n ref,\n ) {\n const inline = pastePlacement === \"inline\";\n const [value, setValue] = useControllableState(\n controlledValue,\n defaultValue,\n onChange,\n );\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const editorRef = useRef<InlinePasteEditorHandle>(null);\n /*\n * The holding logic lives in `usePastePills`, wrapped by `useInlinePaste` for\n * the inline placement — which `PromptInput` shares, so the two components\n * cannot disagree about what a pill means. The rule that must not drift is\n * the one below: a send with pills still closed carries the text.\n */\n const paste = useInlinePaste({\n pasteThreshold,\n pasteImages,\n previewChars,\n renderPastePreview,\n classNames,\n disabled,\n heldPastes: controlledHeldPastes,\n onHeldPastesChange,\n heldImages: controlledHeldImages,\n onHeldImagesChange,\n editorRef,\n });\n const pills = paste.pills;\n const heldPastes = paste.heldPastes;\n const pastedFiles = useMemo(\n () => (inline && pasteImages ? paste.imagesIn(value).map((i) => i.file) : []),\n [inline, pasteImages, paste, value],\n );\n\n const handlePaste = useCallback(\n (e: React.ClipboardEvent<HTMLTextAreaElement>) => {\n // Composable by design, so this reads as a question rather than a handover.\n // Nothing else here wants the paste, so the answer is simply ignored.\n pills.handlePaste(e);\n },\n [pills],\n );\n\n const handleInlineChange = useCallback(\n (next: string) => {\n setValue(next);\n paste.prune(next);\n },\n [setValue, paste],\n );\n\n /** Everything the person believes they are sending, in the order they built it. */\n const composeOutgoing = useCallback(() => {\n if (inline) return paste.expand(value);\n\n return [value, ...heldPastes.map((p) => p.text)].filter(Boolean).join(\"\\n\\n\");\n }, [inline, value, heldPastes, paste]);\n\n const hasContent = value.trim().length > 0 || (!inline && heldPastes.length > 0);\n\n const focusInput = useCallback(() => {\n if (inline) editorRef.current?.focus();\n else textareaRef.current?.focus();\n }, [inline]);\n\n const handleSubmit = useCallback(() => {\n if (!hasContent || disabled) return;\n\n /*\n * THE DANGEROUS STATE, and the reason this feature needed a spec rather than\n * a guess. A pill reads as \"your paste is attached\" — so a send that drops it\n * means asking a question about a document without the document, and nobody\n * can tell: the sender believes it went, the receiver sees a question about\n * nothing.\n *\n * Above the input, held pastes go out in arrival order after what was typed,\n * because people type the question BEFORE pasting the thing it is about.\n * Inline, every pill goes out exactly where it sits.\n */\n const images = inline ? paste.imagesIn(value) : [];\n\n onSubmit?.(composeOutgoing(), { images });\n setValue(\"\");\n paste.clear();\n focusInput();\n }, [hasContent, disabled, value, inline, paste, onSubmit, composeOutgoing, setValue, focusInput]);\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n handleSubmit();\n }\n };\n\n /** Above the input: click a pill to dump it in, APPENDED to what is already typed. */\n const insertPaste = useCallback(\n (held: HeldPaste) => {\n // `expand` removes it and hands back the text; inserting is this\n // component's job because the hook owns no DOM.\n const text = pills.expand(held.id);\n\n if (text === undefined) return;\n\n setValue((current) => (current ? `${current}\\n\\n${text}` : text));\n textareaRef.current?.focus();\n },\n [pills, setValue],\n );\n\n return (\n <div\n data-react-fancy-composer=\"\"\n ref={ref}\n className={cn(\n \"rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n disabled && \"opacity-50\",\n className,\n )}\n >\n {!inline && heldPastes.length > 0 && (\n <div\n data-react-fancy-composer-paste-pills=\"\"\n className=\"flex flex-wrap gap-1.5 px-3 pt-3\"\n >\n {heldPastes.map((paste) => (\n // `group` + `group-hover` rather than hover state: the preview is\n // presentation, and a useState for it would be one more thing an\n // agent could desynchronise.\n <span key={paste.id} className=\"group relative inline-flex\">\n <button\n type=\"button\"\n data-react-fancy-composer-paste-pill={paste.id}\n onClick={() => insertPaste(paste)}\n disabled={disabled}\n // No `title`. A native tooltip plus the hover preview below\n // renders TWO tooltips on the same hover, at different delays.\n // The label says what clicking does; the preview says what the\n // text is, and it is linked rather than merely adjacent so a\n // screen reader reaches it too.\n aria-label={`Insert this pasted text, ${withSeparators(paste.text.length)} characters`}\n aria-describedby={`${paste.id}-preview`}\n // `pr-7` leaves room for the absolutely-positioned × that sits\n // over this button's right edge. With a smaller right padding the\n // × lands on top of the label.\n className={cn(\n \"inline-flex items-center gap-1.5 rounded-full border border-zinc-200 bg-zinc-50 py-1 pl-2.5 pr-7 text-xs text-zinc-700 transition-colors hover:bg-zinc-100 dark:border-zinc-700 dark:bg-zinc-800 dark:text-zinc-200 dark:hover:bg-zinc-700\",\n classNames?.pill,\n classNames?.textPill,\n )}\n >\n <span>\n Pasted text · {withSeparators(paste.text.length)} characters\n </span>\n </button>\n\n <button\n type=\"button\"\n data-react-fancy-composer-paste-pill-remove={paste.id}\n onClick={() => pills.remove(paste.id)}\n disabled={disabled}\n aria-label=\"Discard this pasted text\"\n className={cn(\n \"absolute right-1 top-1/2 -translate-y-1/2 rounded-full px-1 text-xs text-zinc-400 transition-colors hover:text-zinc-700 dark:hover:text-zinc-100\",\n classNames?.remove,\n )}\n >\n ×\n </button>\n\n <span\n id={`${paste.id}-preview`}\n data-react-fancy-composer-paste-pill-preview={paste.id}\n role=\"tooltip\"\n className={cn(\n \"pointer-events-none absolute bottom-full left-0 z-10 mb-1 hidden max-w-xs whitespace-pre-wrap break-all rounded-md bg-zinc-900 px-2 py-1 text-xs text-white group-hover:block dark:bg-zinc-100 dark:text-zinc-900\",\n classNames?.preview,\n )}\n >\n {renderPastePreview?.({ kind: \"text\", paste }) ??\n endsOf(paste.text, previewChars)}\n </span>\n </span>\n ))}\n </div>\n )}\n\n {inline ? (\n <>\n <InlinePasteEditor\n ref={editorRef}\n value={value}\n known={paste.known}\n onChange={handleInlineChange}\n onSubmit={handleSubmit}\n onPaste={paste.decidePaste}\n onHostsChange={paste.onHostsChange}\n placeholder={placeholder}\n disabled={disabled}\n className={classNames?.input}\n />\n {paste.portals}\n {pasteImages && pasteFilesName && (\n <PastedFilesInput name={pasteFilesName} files={pastedFiles} />\n )}\n </>\n ) : (\n <textarea\n ref={textareaRef}\n value={value}\n onChange={(e) => setValue(e.target.value)}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n placeholder={placeholder}\n disabled={disabled}\n rows={3}\n className={cn(\n \"w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400\",\n classNames?.input,\n )}\n />\n )}\n <div className=\"flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800\">\n <div className=\"flex items-center gap-1\">{actions}</div>\n <button\n type=\"button\"\n onClick={handleSubmit}\n disabled={disabled || !hasContent}\n className=\"rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100\"\n >\n Send\n </button>\n </div>\n </div>\n );\n },\n);\n\nComposer.displayName = \"Composer\";\n"]}
1
+ {"version":3,"sources":["../src/components/Composer/Composer.tsx"],"names":["Composer","paste"],"mappings":"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","file":"chunk-4NBM3LXN.js","sourcesContent":["import { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport {\n endsOf,\n InlinePasteEditor,\n PastedFilesInput,\n useInlinePaste,\n withSeparators,\n type HeldPaste,\n type InlinePasteEditorHandle,\n} from \"../PastePills\";\nimport type { ComposerProps } from \"./Composer.types\";\n\n/** Characters of a held paste shown at each end of the hover preview, unless `previewChars` says otherwise. */\nconst PREVIEW_CHARS = 20;\n\nexport const Composer = forwardRef<HTMLDivElement, ComposerProps>(\n function Composer(\n {\n value: controlledValue,\n defaultValue = \"\",\n onChange,\n onSubmit,\n placeholder = \"Type a message...\",\n actions,\n disabled = false,\n className,\n pasteThreshold,\n pastePlacement = \"above\",\n pasteImages = false,\n previewChars = PREVIEW_CHARS,\n renderPastePreview,\n classNames,\n heldPastes: controlledHeldPastes,\n onHeldPastesChange,\n heldImages: controlledHeldImages,\n onHeldImagesChange,\n pasteFilesName,\n },\n ref,\n ) {\n const inline = pastePlacement === \"inline\";\n const [value, setValue] = useControllableState(\n controlledValue,\n defaultValue,\n onChange,\n );\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const editorRef = useRef<InlinePasteEditorHandle>(null);\n /*\n * The holding logic lives in `usePastePills`, wrapped by `useInlinePaste` for\n * the inline placement — which `PromptInput` shares, so the two components\n * cannot disagree about what a pill means. The rule that must not drift is\n * the one below: a send with pills still closed carries the text.\n */\n const paste = useInlinePaste({\n pasteThreshold,\n pasteImages,\n previewChars,\n renderPastePreview,\n classNames,\n disabled,\n heldPastes: controlledHeldPastes,\n onHeldPastesChange,\n heldImages: controlledHeldImages,\n onHeldImagesChange,\n editorRef,\n });\n const pills = paste.pills;\n const heldPastes = paste.heldPastes;\n const pastedFiles = useMemo(\n () => (inline && pasteImages ? paste.imagesIn(value).map((i) => i.file) : []),\n [inline, pasteImages, paste, value],\n );\n\n const handlePaste = useCallback(\n (e: React.ClipboardEvent<HTMLTextAreaElement>) => {\n // Composable by design, so this reads as a question rather than a handover.\n // Nothing else here wants the paste, so the answer is simply ignored.\n pills.handlePaste(e);\n },\n [pills],\n );\n\n const handleInlineChange = useCallback(\n (next: string) => {\n setValue(next);\n paste.prune(next);\n },\n [setValue, paste],\n );\n\n /** Everything the person believes they are sending, in the order they built it. */\n const composeOutgoing = useCallback(() => {\n if (inline) return paste.expand(value);\n\n return [value, ...heldPastes.map((p) => p.text)].filter(Boolean).join(\"\\n\\n\");\n }, [inline, value, heldPastes, paste]);\n\n const hasContent = value.trim().length > 0 || (!inline && heldPastes.length > 0);\n\n const focusInput = useCallback(() => {\n if (inline) editorRef.current?.focus();\n else textareaRef.current?.focus();\n }, [inline]);\n\n const handleSubmit = useCallback(() => {\n if (!hasContent || disabled) return;\n\n /*\n * THE DANGEROUS STATE, and the reason this feature needed a spec rather than\n * a guess. A pill reads as \"your paste is attached\" — so a send that drops it\n * means asking a question about a document without the document, and nobody\n * can tell: the sender believes it went, the receiver sees a question about\n * nothing.\n *\n * Above the input, held pastes go out in arrival order after what was typed,\n * because people type the question BEFORE pasting the thing it is about.\n * Inline, every pill goes out exactly where it sits.\n */\n const images = inline ? paste.imagesIn(value) : [];\n\n onSubmit?.(composeOutgoing(), { images });\n setValue(\"\");\n paste.clear();\n focusInput();\n }, [hasContent, disabled, value, inline, paste, onSubmit, composeOutgoing, setValue, focusInput]);\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n handleSubmit();\n }\n };\n\n /** Above the input: click a pill to dump it in, APPENDED to what is already typed. */\n const insertPaste = useCallback(\n (held: HeldPaste) => {\n // `expand` removes it and hands back the text; inserting is this\n // component's job because the hook owns no DOM.\n const text = pills.expand(held.id);\n\n if (text === undefined) return;\n\n setValue((current) => (current ? `${current}\\n\\n${text}` : text));\n textareaRef.current?.focus();\n },\n [pills, setValue],\n );\n\n return (\n <div\n data-react-fancy-composer=\"\"\n ref={ref}\n className={cn(\n \"rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900\",\n disabled && \"opacity-50\",\n className,\n )}\n >\n {!inline && heldPastes.length > 0 && (\n <div\n data-react-fancy-composer-paste-pills=\"\"\n className=\"flex flex-wrap gap-1.5 px-3 pt-3\"\n >\n {heldPastes.map((paste) => (\n // `group` + `group-hover` rather than hover state: the preview is\n // presentation, and a useState for it would be one more thing an\n // agent could desynchronise.\n <span key={paste.id} className=\"group relative inline-flex\">\n <button\n type=\"button\"\n data-react-fancy-composer-paste-pill={paste.id}\n onClick={() => insertPaste(paste)}\n disabled={disabled}\n // No `title`. A native tooltip plus the hover preview below\n // renders TWO tooltips on the same hover, at different delays.\n // The label says what clicking does; the preview says what the\n // text is, and it is linked rather than merely adjacent so a\n // screen reader reaches it too.\n aria-label={`Insert this pasted text, ${withSeparators(paste.text.length)} characters`}\n aria-describedby={`${paste.id}-preview`}\n // `pr-7` leaves room for the absolutely-positioned × that sits\n // over this button's right edge. With a smaller right padding the\n // × lands on top of the label.\n className={cn(\n \"inline-flex items-center gap-1.5 rounded-full border border-zinc-200 bg-zinc-50 py-1 pl-2.5 pr-7 text-xs text-zinc-700 transition-colors hover:bg-zinc-100 dark:border-zinc-700 dark:bg-zinc-800 dark:text-zinc-200 dark:hover:bg-zinc-700\",\n classNames?.pill,\n classNames?.textPill,\n )}\n >\n <span>\n Pasted text · {withSeparators(paste.text.length)} characters\n </span>\n </button>\n\n <button\n type=\"button\"\n data-react-fancy-composer-paste-pill-remove={paste.id}\n onClick={() => pills.remove(paste.id)}\n disabled={disabled}\n aria-label=\"Discard this pasted text\"\n className={cn(\n \"absolute right-1 top-1/2 -translate-y-1/2 rounded-full px-1 text-xs text-zinc-400 transition-colors hover:text-zinc-700 dark:hover:text-zinc-100\",\n classNames?.remove,\n )}\n >\n ×\n </button>\n\n <span\n id={`${paste.id}-preview`}\n data-react-fancy-composer-paste-pill-preview={paste.id}\n role=\"tooltip\"\n className={cn(\n \"pointer-events-none absolute bottom-full left-0 z-10 mb-1 hidden max-w-xs whitespace-pre-wrap break-all rounded-md bg-zinc-900 px-2 py-1 text-xs text-white group-hover:block dark:bg-zinc-100 dark:text-zinc-900\",\n classNames?.preview,\n )}\n >\n {renderPastePreview?.({ kind: \"text\", paste }) ??\n endsOf(paste.text, previewChars)}\n </span>\n </span>\n ))}\n </div>\n )}\n\n {inline ? (\n <>\n <InlinePasteEditor\n ref={editorRef}\n value={value}\n known={paste.known}\n onChange={handleInlineChange}\n onSubmit={handleSubmit}\n onPaste={paste.decidePaste}\n onHostsChange={paste.onHostsChange}\n placeholder={placeholder}\n disabled={disabled}\n className={classNames?.input}\n />\n {paste.portals}\n {pasteImages && pasteFilesName && (\n <PastedFilesInput name={pasteFilesName} files={pastedFiles} />\n )}\n </>\n ) : (\n <textarea\n ref={textareaRef}\n value={value}\n onChange={(e) => setValue(e.target.value)}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n placeholder={placeholder}\n disabled={disabled}\n rows={3}\n className={cn(\n \"w-full resize-none bg-transparent px-4 pt-3 text-sm outline-none placeholder:text-zinc-400\",\n classNames?.input,\n )}\n />\n )}\n <div className=\"flex items-center justify-between border-t border-zinc-100 px-3 py-2 dark:border-zinc-800\">\n <div className=\"flex items-center gap-1\">{actions}</div>\n <button\n type=\"button\"\n onClick={handleSubmit}\n disabled={disabled || !hasContent}\n className=\"rounded-lg bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white transition-colors hover:bg-zinc-800 disabled:opacity-50 dark:bg-white dark:text-zinc-900 dark:hover:bg-zinc-100\"\n >\n Send\n </button>\n </div>\n </div>\n );\n },\n);\n\nComposer.displayName = \"Composer\";\n"]}
@@ -4,7 +4,7 @@ var chunk7EZBMGEE_cjs = require('./chunk-7EZBMGEE.cjs');
4
4
  var chunkXKDW6B7X_cjs = require('./chunk-XKDW6B7X.cjs');
5
5
  var chunkBBOIFV27_cjs = require('./chunk-BBOIFV27.cjs');
6
6
  var chunkYLGTDBB2_cjs = require('./chunk-YLGTDBB2.cjs');
7
- var chunkMSRYJETY_cjs = require('./chunk-MSRYJETY.cjs');
7
+ var chunkR3UG6PVX_cjs = require('./chunk-R3UG6PVX.cjs');
8
8
  var chunkKJ22KE56_cjs = require('./chunk-KJ22KE56.cjs');
9
9
  var chunkL3V3BYVS_cjs = require('./chunk-L3V3BYVS.cjs');
10
10
  var chunkSNHU2AI4_cjs = require('./chunk-SNHU2AI4.cjs');
@@ -82,7 +82,7 @@ var Input = react.forwardRef(
82
82
  const pasting = pasteThreshold !== void 0 || pasteImages;
83
83
  const editorRef = react.useRef(null);
84
84
  const hiddenRef = react.useRef(null);
85
- const paste = chunkMSRYJETY_cjs.useInlinePaste({
85
+ const paste = chunkR3UG6PVX_cjs.useInlinePaste({
86
86
  pasteThreshold,
87
87
  pasteImages,
88
88
  previewChars,
@@ -136,7 +136,7 @@ var Input = react.forwardRef(
136
136
  ),
137
137
  pasting ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
138
138
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(
139
- chunkMSRYJETY_cjs.InlinePasteEditor,
139
+ chunkR3UG6PVX_cjs.InlinePasteEditor,
140
140
  {
141
141
  ref: editorRef,
142
142
  id: inputId,
@@ -188,7 +188,7 @@ var Input = react.forwardRef(
188
188
  value: paste.expand(pasteValue)
189
189
  }
190
190
  ),
191
- pasteImages && filesName && /* @__PURE__ */ jsxRuntime.jsx(chunkMSRYJETY_cjs.PastedFilesInput, { name: filesName, files: pastedFiles, form: props.form })
191
+ pasteImages && filesName && /* @__PURE__ */ jsxRuntime.jsx(chunkR3UG6PVX_cjs.PastedFilesInput, { name: filesName, files: pastedFiles, form: props.form })
192
192
  ] }) : /* @__PURE__ */ jsxRuntime.jsx(
193
193
  "input",
194
194
  {
@@ -300,5 +300,5 @@ function EyeOffIcon() {
300
300
  }
301
301
 
302
302
  exports.Input = Input;
303
- //# sourceMappingURL=chunk-2QIGXSSZ.cjs.map
304
- //# sourceMappingURL=chunk-2QIGXSSZ.cjs.map
303
+ //# sourceMappingURL=chunk-7ZDJPHLJ.cjs.map
304
+ //# sourceMappingURL=chunk-7ZDJPHLJ.cjs.map