@particle-academy/react-fancy 5.58.0 → 5.60.0

package/dist/json-editor.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunk6XX6OHAP_cjs = require('./chunk-6XX6OHAP.cjs');
+var chunkM77BB2QI_cjs = require('./chunk-M77BB2QI.cjs');
+require('./chunk-TLRFXSPA.cjs');
 require('./chunk-JRRYYW3Y.cjs');
 require('./chunk-GLGUQGAQ.cjs');
 require('./chunk-2O5UXH5R.cjs');
-require('./chunk-TLRFXSPA.cjs');
 require('./chunk-MAZEX4EZ.cjs');
 require('./chunk-MRZXTL46.cjs');
 require('./chunk-P53432AK.cjs');
@@ -33,47 +33,47 @@ require('./chunk-ZU5Q77OT.cjs');
 
 Object.defineProperty(exports, "JsonEditor", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.JsonEditor; }
+  get: function () { return chunkM77BB2QI_cjs.JsonEditor; }
 });
 Object.defineProperty(exports, "applyJsonEdit", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.applyJsonEdit; }
+  get: function () { return chunkM77BB2QI_cjs.applyJsonEdit; }
 });
 Object.defineProperty(exports, "describeEdit", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.describeEdit; }
+  get: function () { return chunkM77BB2QI_cjs.describeEdit; }
 });
 Object.defineProperty(exports, "findJsonConflicts", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.findJsonConflicts; }
+  get: function () { return chunkM77BB2QI_cjs.findJsonConflicts; }
 });
 Object.defineProperty(exports, "getAtPath", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.getAtPath; }
+  get: function () { return chunkM77BB2QI_cjs.getAtPath; }
 });
 Object.defineProperty(exports, "inferType", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.inferType; }
+  get: function () { return chunkM77BB2QI_cjs.inferType; }
 });
 Object.defineProperty(exports, "parseKeyMap", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.parseKeyMap; }
+  get: function () { return chunkM77BB2QI_cjs.parseKeyMap; }
 });
 Object.defineProperty(exports, "parsePath", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.parsePath; }
+  get: function () { return chunkM77BB2QI_cjs.parsePath; }
 });
 Object.defineProperty(exports, "pathToString", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.pathToString; }
+  get: function () { return chunkM77BB2QI_cjs.pathToString; }
 });
 Object.defineProperty(exports, "resolveKeyRule", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.resolveKeyRule; }
+  get: function () { return chunkM77BB2QI_cjs.resolveKeyRule; }
 });
 Object.defineProperty(exports, "typeMatches", {
   enumerable: true,
-  get: function () { return chunk6XX6OHAP_cjs.typeMatches; }
+  get: function () { return chunkM77BB2QI_cjs.typeMatches; }
 });
 //# sourceMappingURL=json-editor.cjs.map
 //# sourceMappingURL=json-editor.cjs.map

package/dist/json-editor.js

@@ -1,8 +1,8 @@
-export { JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-YBRQTZKV.js';
+export { JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches } from './chunk-ZGQEKDG6.js';
+import './chunk-2UTN3EFK.js';
 import './chunk-XQDGUXMS.js';
 import './chunk-T45LBTXH.js';
 import './chunk-DXZCKDYS.js';
-import './chunk-2UTN3EFK.js';
 import './chunk-UVUBV4VZ.js';
 import './chunk-KXYMMNNV.js';
 import './chunk-WX5XYDVN.js';

package/dist/media-viewer.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
-var chunkSLCR7A6W_cjs = require('./chunk-SLCR7A6W.cjs');
+var chunkAQ4DZT4Y_cjs = require('./chunk-AQ4DZT4Y.cjs');
 require('./chunk-TH7VP4CL.cjs');
-require('./chunk-7MDHCYEB.cjs');
+require('./chunk-5QKQXM5V.cjs');
 require('./chunk-7QENPLOP.cjs');
 require('./chunk-M5SEYDSS.cjs');
 require('./chunk-T6YELZPJ.cjs');
@@ -14,7 +14,7 @@ require('./chunk-ZU5Q77OT.cjs');
 
 Object.defineProperty(exports, "MediaViewer", {
   enumerable: true,
-  get: function () { return chunkSLCR7A6W_cjs.MediaViewer; }
+  get: function () { return chunkAQ4DZT4Y_cjs.MediaViewer; }
 });
 //# sourceMappingURL=media-viewer.cjs.map
 //# sourceMappingURL=media-viewer.cjs.map

package/dist/media-viewer.d.cts

@@ -1,7 +1,7 @@
-export { a as MediaViewer, b as MediaViewerProps } from './index-Bd4br4sF.cjs';
+export { a as MediaViewer, b as MediaViewerProps } from './index-WG8UdfiE.cjs';
 import 'react';
 import './ImageViewer.types-CtqaA6KV.cjs';
 import './FauxClient.types-Dtk9aRs6.cjs';
 import './VideoViewer.types-_AwQ8DQr.cjs';
 import './AudioViewer.types-CyhmQVQd.cjs';
-import './PdfViewer.types-DyoUBa2g.cjs';
+import './PdfViewer.types-BRtcZt-X.cjs';

package/dist/media-viewer.d.ts

@@ -1,7 +1,7 @@
-export { a as MediaViewer, b as MediaViewerProps } from './index-Bwrc9ktU.js';
+export { a as MediaViewer, b as MediaViewerProps } from './index-BiyyxWtb.js';
 import 'react';
 import './ImageViewer.types-BDTxBYEN.js';
 import './FauxClient.types-Dtk9aRs6.js';
 import './VideoViewer.types-_AwQ8DQr.js';
 import './AudioViewer.types-CyhmQVQd.js';
-import './PdfViewer.types-BEk2Jq6p.js';
+import './PdfViewer.types-sM52m3OI.js';

package/dist/media-viewer.js

@@ -1,6 +1,6 @@
-export { MediaViewer } from './chunk-MTTRPPHH.js';
+export { MediaViewer } from './chunk-5PHPJL7Z.js';
 import './chunk-VOGI7GX3.js';
-import './chunk-MORXQ5UM.js';
+import './chunk-CS2ZYMYP.js';
 import './chunk-ICMLLZKZ.js';
 import './chunk-GVMWJ4NI.js';
 import './chunk-CPY7NHXM.js';

package/dist/pdf-viewer.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunk7MDHCYEB_cjs = require('./chunk-7MDHCYEB.cjs');
+var chunk5QKQXM5V_cjs = require('./chunk-5QKQXM5V.cjs');
 require('./chunk-M5SEYDSS.cjs');
 require('./chunk-SNHU2AI4.cjs');
 require('./chunk-ZU5Q77OT.cjs');
@@ -9,7 +9,7 @@ require('./chunk-ZU5Q77OT.cjs');
 
 Object.defineProperty(exports, "PdfViewer", {
   enumerable: true,
-  get: function () { return chunk7MDHCYEB_cjs.PdfViewer; }
+  get: function () { return chunk5QKQXM5V_cjs.PdfViewer; }
 });
 //# sourceMappingURL=pdf-viewer.cjs.map
 //# sourceMappingURL=pdf-viewer.cjs.map

package/dist/pdf-viewer.d.cts

@@ -1,6 +1,6 @@
 import * as react from 'react';
-import { b as PdfViewerProps } from './PdfViewer.types-DyoUBa2g.cjs';
-export { P as PdfPageSource, a as PdfViewerPolicy, c as PdfViewerWatermark } from './PdfViewer.types-DyoUBa2g.cjs';
+import { c as PdfViewerProps } from './PdfViewer.types-BRtcZt-X.cjs';
+export { P as PdfPageErrorContext, a as PdfPageSource, b as PdfViewerPolicy, d as PdfViewerWatermark } from './PdfViewer.types-BRtcZt-X.cjs';
 import './FauxClient.types-Dtk9aRs6.cjs';
 
 /**

package/dist/pdf-viewer.d.ts

@@ -1,6 +1,6 @@
 import * as react from 'react';
-import { b as PdfViewerProps } from './PdfViewer.types-BEk2Jq6p.js';
-export { P as PdfPageSource, a as PdfViewerPolicy, c as PdfViewerWatermark } from './PdfViewer.types-BEk2Jq6p.js';
+import { c as PdfViewerProps } from './PdfViewer.types-sM52m3OI.js';
+export { P as PdfPageErrorContext, a as PdfPageSource, b as PdfViewerPolicy, d as PdfViewerWatermark } from './PdfViewer.types-sM52m3OI.js';
 import './FauxClient.types-Dtk9aRs6.js';
 
 /**

package/dist/pdf-viewer.js

@@ -1,4 +1,4 @@
-export { PdfViewer } from './chunk-MORXQ5UM.js';
+export { PdfViewer } from './chunk-CS2ZYMYP.js';
 import './chunk-GVMWJ4NI.js';
 import './chunk-EDYAXGUM.js';
 import './chunk-MMW2JGKZ.js';

package/dist/resizable-panels.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var chunkCEFK54WP_cjs = require('./chunk-CEFK54WP.cjs');
+require('./chunk-ZU5Q77OT.cjs');
+
+
+
+Object.defineProperty(exports, "ResizablePanels", {
+  enumerable: true,
+  get: function () { return chunkCEFK54WP_cjs.ResizablePanels; }
+});
+//# sourceMappingURL=resizable-panels.cjs.map
+//# sourceMappingURL=resizable-panels.cjs.map

package/dist/resizable-panels.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"resizable-panels.cjs"}

package/dist/resizable-panels.d.cts

@@ -0,0 +1,68 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+/**
+ * How the two PANELS are laid out.
+ *
+ * - `"horizontal"`: side by side. The separator is a vertical bar
+ *   (`aria-orientation="vertical"`), moved with ArrowLeft / ArrowRight.
+ * - `"vertical"`: stacked. The separator is a horizontal bar
+ *   (`aria-orientation="horizontal"`), moved with ArrowUp / ArrowDown.
+ */
+type ResizablePanelsOrientation = "horizontal" | "vertical";
+interface ResizablePanelsProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange"> {
+    /**
+     * Exactly two children: the PRIMARY panel (first, left / top) and the
+     * secondary panel (second, right / bottom). Further children are ignored.
+     */
+    children: ReactNode;
+    /**
+     * Controlled size of the primary panel, as a PERCENTAGE (0-100) of the
+     * container. Clamped to `min` / `max`.
+     */
+    value?: number;
+    /** Uncontrolled starting size, a percentage. Default `50`. */
+    defaultValue?: number;
+    /** Fires on every change while dragging or pressing keys. */
+    onValueChange?: (value: number) => void;
+    /**
+     * Fires ONCE when a gesture ends: at pointer release (or cancel) and at key
+     * release, and only if the value changed. This is the moment to persist a
+     * per-user size; the host owns persistence.
+     */
+    onValueCommit?: (value: number) => void;
+    /** Smallest primary size, a percentage. Default `10`. */
+    min?: number;
+    /** Largest primary size, a percentage. Default `90`. */
+    max?: number;
+    /** Panel layout. Default `"horizontal"` (side by side). */
+    orientation?: ResizablePanelsOrientation;
+    /** Arrow-key step, in percentage points. Default `5`. */
+    step?: number;
+    /** Shift + Arrow step, in percentage points. Default `20`. */
+    largeStep?: number;
+    /** Accessible name of the separator. Default `"Resize panels"`. */
+    label?: string;
+    /** Freezes the split: the separator is not focusable and ignores input. */
+    disabled?: boolean;
+}
+
+/**
+ * Two panels and a draggable, keyboard-operable separator between them — the
+ * W3C window-splitter pattern
+ * (https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/).
+ *
+ * `value` is the PRIMARY (first) panel's share of the container, as a
+ * percentage. The separator is `role="separator"` with `aria-valuenow/min/max`,
+ * `aria-controls` pointing at the primary panel, and a tab stop. Arrow keys
+ * along the drag axis move it by `step`, Shift + Arrow by `largeStep`, Home /
+ * End jump to `min` / `max`. Pointer and touch drags use pointer capture, so a
+ * fast drag that leaves the bar keeps resizing.
+ *
+ * `onValueChange` fires continuously; `onValueCommit` fires once per gesture
+ * (pointer release, key release) so a host can persist a per-user size without
+ * writing on every frame. The host owns persistence.
+ */
+declare const ResizablePanels: react.ForwardRefExoticComponent<ResizablePanelsProps & react.RefAttributes<HTMLDivElement>>;
+
+export { ResizablePanels, type ResizablePanelsOrientation, type ResizablePanelsProps };

package/dist/resizable-panels.d.ts

@@ -0,0 +1,68 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+/**
+ * How the two PANELS are laid out.
+ *
+ * - `"horizontal"`: side by side. The separator is a vertical bar
+ *   (`aria-orientation="vertical"`), moved with ArrowLeft / ArrowRight.
+ * - `"vertical"`: stacked. The separator is a horizontal bar
+ *   (`aria-orientation="horizontal"`), moved with ArrowUp / ArrowDown.
+ */
+type ResizablePanelsOrientation = "horizontal" | "vertical";
+interface ResizablePanelsProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange"> {
+    /**
+     * Exactly two children: the PRIMARY panel (first, left / top) and the
+     * secondary panel (second, right / bottom). Further children are ignored.
+     */
+    children: ReactNode;
+    /**
+     * Controlled size of the primary panel, as a PERCENTAGE (0-100) of the
+     * container. Clamped to `min` / `max`.
+     */
+    value?: number;
+    /** Uncontrolled starting size, a percentage. Default `50`. */
+    defaultValue?: number;
+    /** Fires on every change while dragging or pressing keys. */
+    onValueChange?: (value: number) => void;
+    /**
+     * Fires ONCE when a gesture ends: at pointer release (or cancel) and at key
+     * release, and only if the value changed. This is the moment to persist a
+     * per-user size; the host owns persistence.
+     */
+    onValueCommit?: (value: number) => void;
+    /** Smallest primary size, a percentage. Default `10`. */
+    min?: number;
+    /** Largest primary size, a percentage. Default `90`. */
+    max?: number;
+    /** Panel layout. Default `"horizontal"` (side by side). */
+    orientation?: ResizablePanelsOrientation;
+    /** Arrow-key step, in percentage points. Default `5`. */
+    step?: number;
+    /** Shift + Arrow step, in percentage points. Default `20`. */
+    largeStep?: number;
+    /** Accessible name of the separator. Default `"Resize panels"`. */
+    label?: string;
+    /** Freezes the split: the separator is not focusable and ignores input. */
+    disabled?: boolean;
+}
+
+/**
+ * Two panels and a draggable, keyboard-operable separator between them — the
+ * W3C window-splitter pattern
+ * (https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/).
+ *
+ * `value` is the PRIMARY (first) panel's share of the container, as a
+ * percentage. The separator is `role="separator"` with `aria-valuenow/min/max`,
+ * `aria-controls` pointing at the primary panel, and a tab stop. Arrow keys
+ * along the drag axis move it by `step`, Shift + Arrow by `largeStep`, Home /
+ * End jump to `min` / `max`. Pointer and touch drags use pointer capture, so a
+ * fast drag that leaves the bar keeps resizing.
+ *
+ * `onValueChange` fires continuously; `onValueCommit` fires once per gesture
+ * (pointer release, key release) so a host can persist a per-user size without
+ * writing on every frame. The host owns persistence.
+ */
+declare const ResizablePanels: react.ForwardRefExoticComponent<ResizablePanelsProps & react.RefAttributes<HTMLDivElement>>;
+
+export { ResizablePanels, type ResizablePanelsOrientation, type ResizablePanelsProps };

package/dist/resizable-panels.js

@@ -0,0 +1,4 @@
+export { ResizablePanels } from './chunk-GDF6XTHC.js';
+import './chunk-MMW2JGKZ.js';
+//# sourceMappingURL=resizable-panels.js.map
+//# sourceMappingURL=resizable-panels.js.map

package/dist/resizable-panels.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"resizable-panels.js"}

package/dist/time-grid.d.cts

@@ -143,8 +143,9 @@ interface TimeGridProps {
     /** Hover, for a host-owned detail panel. `null, null` when the pointer leaves. */
     onCellHover?: (cell: TimeGridCell | null, at: TimeGridCoord | null) => void;
     /**
-     * Typed grid: render only the columns in view (plus overscan), holding the
-     * rest of the width with spacers. Default: on above 500 columns. Cell ids,
+     * Typed grid: render only the columns in view (plus overscan). The column
+     * tracks stay the full grid, so the scroll width never changes; each row's
+     * first rendered cell is placed explicitly. Default: on above 500 columns. Cell ids,
      * selection and callbacks still cover every cell — they come from `cells`,
      * not the DOM — and keyboard focus or an out-of-view `selection` scrolls the
      * window to it.

package/dist/time-grid.d.ts

@@ -143,8 +143,9 @@ interface TimeGridProps {
     /** Hover, for a host-owned detail panel. `null, null` when the pointer leaves. */
     onCellHover?: (cell: TimeGridCell | null, at: TimeGridCoord | null) => void;
     /**
-     * Typed grid: render only the columns in view (plus overscan), holding the
-     * rest of the width with spacers. Default: on above 500 columns. Cell ids,
+     * Typed grid: render only the columns in view (plus overscan). The column
+     * tracks stay the full grid, so the scroll width never changes; each row's
+     * first rendered cell is placed explicitly. Default: on above 500 columns. Cell ids,
      * selection and callbacks still cover every cell — they come from `cells`,
      * not the DOM — and keyboard focus or an out-of-view `selection` scrolls the
      * window to it.

package/docs/FileUpload.md

@@ -39,9 +39,12 @@ Provides file state context to its children.
 
 Drag-and-drop area that also opens a file picker on click.
 
+It contains a native browse `<button type="button">` (`data-react-fancy-file-upload-browse`), so keyboard users can Tab to it and open the picker with Enter or Space. On the default zone the button wraps the icon and copy; with custom `children` it is visually hidden beside them and the zone draws the focus ring. When `disabled`, the button is disabled and the zone carries `aria-disabled="true"`.
+
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
 | `children` | `ReactNode` | Default upload icon + text | Custom dropzone content |
+| `browseLabel` | `string` | The visible copy, or `"Browse files"` with custom children | Accessible name of the browse button |
 | `className` | `string` | - | Additional CSS classes |
 
 ### `FileUpload.List`

package/docs/ResizablePanels.md

@@ -0,0 +1,81 @@
+# ResizablePanels
+
+Two panels with a draggable, keyboard-operable separator between them. Follows the W3C [window splitter pattern](https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/).
+
+## Import
+
+```tsx
+import { ResizablePanels } from "@particle-academy/react-fancy";
+// or the subpath
+import { ResizablePanels } from "@particle-academy/react-fancy/resizable-panels";
+```
+
+## Basic Usage
+
+```tsx
+const [size, setSize] = useState(30);
+
+<div className="h-96">
+  <ResizablePanels
+    value={size}
+    onValueChange={setSize}
+    onValueCommit={(v) => savePreference("sidebar", v)}
+    min={15}
+    max={60}
+    label="Resize sidebar"
+  >
+    <nav>Sidebar</nav>
+    <main>Content</main>
+  </ResizablePanels>
+</div>
+```
+
+The component fills its parent (`h-full w-full`); give the parent a size.
+
+## Value
+
+`value` is the **primary (first) panel's size as a percentage (0-100)** of the container. It is clamped to `min` / `max`, and `min` / `max` are themselves clamped to 0-100, so a panel can never be sized past the container.
+
+## Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `children` | `ReactNode` | **required** | Two children: the primary panel, then the secondary |
+| `value` | `number` | - | Controlled primary size, a percentage |
+| `defaultValue` | `number` | `50` | Uncontrolled starting size |
+| `onValueChange` | `(value: number) => void` | - | Every change while dragging or pressing keys |
+| `onValueCommit` | `(value: number) => void` | - | Once per gesture (pointer release / cancel, key release), only if the value changed. Persist here; the host owns persistence |
+| `min` | `number` | `10` | Smallest primary size |
+| `max` | `number` | `90` | Largest primary size |
+| `orientation` | `"horizontal" \| "vertical"` | `"horizontal"` | Panel layout: side by side, or stacked |
+| `step` | `number` | `5` | Arrow-key step, in percentage points |
+| `largeStep` | `number` | `20` | Shift + Arrow step |
+| `label` | `string` | `"Resize panels"` | Accessible name of the separator |
+| `disabled` | `boolean` | `false` | Separator not focusable, ignores input |
+| `className` | `string` | - | Classes on the root |
+
+Other HTML attributes (including `data-*` handles) pass through to the root.
+
+## Orientation and keys
+
+`orientation` names how the **panels** are laid out:
+
+| `orientation` | Panels | Separator `aria-orientation` | Keys |
+|---|---|---|---|
+| `"horizontal"` | side by side | `vertical` | ArrowLeft / ArrowRight |
+| `"vertical"` | stacked | `horizontal` | ArrowUp / ArrowDown |
+
+Shift + Arrow moves by `largeStep`. Home / End jump to `min` / `max`.
+
+## Accessibility
+
+The separator is `role="separator"`, `tabIndex=0`, with `aria-valuenow`, `aria-valuemin`, `aria-valuemax`, `aria-orientation`, `aria-label` and `aria-controls` pointing at the primary panel. It shows a focus ring from the `--fancy-focus` token. Pointer and touch drags use pointer capture (`touch-action: none` on the separator), and the separator has a 12px hit area around its 1px line.
+
+## Data attributes
+
+| Selector | Element |
+|---|---|
+| `[data-react-fancy-resizable-panels]` | Root; carries `data-orientation`, `data-dragging` while dragging, `data-disabled` |
+| `[data-react-fancy-resizable-panels-panel="first"]` | Primary panel |
+| `[data-react-fancy-resizable-panels-panel="second"]` | Secondary panel |
+| `[data-react-fancy-resizable-panels-separator]` | The separator |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-academy/react-fancy",
-  "version": "5.58.0",
+  "version": "5.60.0",
   "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
   "repository": {
     "type": "git",
@@ -753,6 +753,16 @@
         "default": "./dist/reason-tag.cjs"
       }
     },
+    "./resizable-panels": {
+      "import": {
+        "types": "./dist/resizable-panels.d.ts",
+        "default": "./dist/resizable-panels.js"
+      },
+      "require": {
+        "types": "./dist/resizable-panels.d.cts",
+        "default": "./dist/resizable-panels.cjs"
+      }
+    },
     "./section": {
       "import": {
         "types": "./dist/section.d.ts",

package/dist/chunk-2GFM5WD4.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/FileUpload/FileUpload.context.ts","../src/components/FileUpload/FileUploadDropzone.tsx","../src/components/FileUpload/FileUploadList.tsx","../src/components/FileUpload/matchesAccept.ts","../src/components/FileUpload/FileUpload.tsx"],"names":["createContext","useContext","useState","useRef","useCallback","jsxs","cn","jsx","Fragment","Upload","useMemo","useEffect","File","X"],"mappings":"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","file":"chunk-2GFM5WD4.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { FileUploadContextValue } from \"./FileUpload.types\";\n\nexport const FileUploadContext =\n  createContext<FileUploadContextValue | null>(null);\n\nexport function useFileUpload(): FileUploadContextValue {\n  const ctx = useContext(FileUploadContext);\n  if (!ctx) {\n    throw new Error(\n      \"FileUpload compound components must be used within <FileUpload>\",\n    );\n  }\n  return ctx;\n}\n","import { useCallback, useRef, useState } from \"react\";\nimport { Upload } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useFileUpload } from \"./FileUpload.context\";\nimport type { FileUploadDropzoneProps } from \"./FileUpload.types\";\n\nexport function FileUploadDropzone({\n  children,\n  className,\n}: FileUploadDropzoneProps) {\n  const { addFiles, disabled, accept, multiple } = useFileUpload();\n  const [dragOver, setDragOver] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleDrop = useCallback(\n    (e: React.DragEvent) => {\n      e.preventDefault();\n      setDragOver(false);\n      if (disabled) return;\n      addFiles(e.dataTransfer.files);\n    },\n    [addFiles, disabled],\n  );\n\n  const handleDragOver = useCallback((e: React.DragEvent) => {\n    e.preventDefault();\n    setDragOver(true);\n  }, []);\n\n  const handleDragLeave = useCallback(() => setDragOver(false), []);\n\n  return (\n    <div\n      data-react-fancy-file-upload-dropzone=\"\"\n      onDrop={handleDrop}\n      onDragOver={handleDragOver}\n      onDragLeave={handleDragLeave}\n      onClick={() => !disabled && inputRef.current?.click()}\n      className={cn(\n        \"flex cursor-pointer flex-col items-center justify-center rounded-xl border-2 border-dashed p-8 text-center transition-colors\",\n        dragOver\n          ? \"border-blue-400 bg-blue-50 dark:border-blue-500 dark:bg-blue-950\"\n          : \"border-[color:var(--fancy-border-strong,var(--color-zinc-300))] hover:border-zinc-400 dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:hover:border-zinc-500\",\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n    >\n      <input\n        ref={inputRef}\n        type=\"file\"\n        className=\"hidden\"\n        onChange={(e) => {\n          if (e.target.files) addFiles(e.target.files);\n\n          // Reset, or choosing the SAME file again fires no `change` event at\n          // all and the gesture is simply dead — \"remove it, then re-add it\"\n          // and \"retry the import that just failed\" both stop working. The\n          // component never sees those files to reject them; it is not asked.\n          e.target.value = \"\";\n        }}\n        accept={accept}\n        multiple={multiple}\n        disabled={disabled}\n      />\n      {children ?? (\n        <>\n          <Upload size={32} strokeWidth={1.5} className=\"mb-2 text-zinc-400\" />\n          <p className=\"text-sm text-zinc-500\">\n            Drop files here or click to browse\n          </p>\n        </>\n      )}\n    </div>\n  );\n}\n\nFileUploadDropzone.displayName = \"FileUploadDropzone\";\n","import { useEffect, useMemo } from \"react\";\nimport { File, X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useFileUpload } from \"./FileUpload.context\";\nimport type { FileUploadListProps } from \"./FileUpload.types\";\n\nfunction formatSize(bytes: number): string {\n  if (bytes < 1024) return `${bytes} B`;\n  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;\n  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n}\n\nfunction getExtension(name: string): string {\n  const parts = name.split(\".\");\n  return parts.length > 1 ? parts.pop()!.toUpperCase() : \"\";\n}\n\nfunction ThumbnailItem({ file, index, onRemove }: { file: File; index: number; onRemove: (i: number) => void }) {\n  const isImage = file.type.startsWith(\"image/\");\n  const objectUrl = useMemo(() => (isImage ? URL.createObjectURL(file) : null), [file, isImage]);\n\n  useEffect(() => {\n    return () => {\n      if (objectUrl) URL.revokeObjectURL(objectUrl);\n    };\n  }, [objectUrl]);\n\n  return (\n    <div className=\"group relative flex w-20 flex-col items-center gap-1\">\n      <div className=\"relative h-20 w-20 overflow-hidden rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-zinc-50 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-zinc-800\">\n        {isImage && objectUrl ? (\n          <img src={objectUrl} alt={file.name} className=\"h-full w-full object-cover\" />\n        ) : (\n          <div className=\"flex h-full w-full flex-col items-center justify-center gap-1\">\n            <File size={20} className=\"text-zinc-400\" />\n            <span className=\"text-[10px] font-medium text-zinc-500\">{getExtension(file.name)}</span>\n          </div>\n        )}\n        <button\n          type=\"button\"\n          onClick={() => onRemove(index)}\n          className=\"absolute top-1 right-1 flex h-5 w-5 items-center justify-center rounded-full bg-black/60 text-white opacity-0 transition-opacity hover:bg-black/80 group-hover:opacity-100\"\n          aria-label={`Remove ${file.name}`}\n        >\n          <X size={10} />\n        </button>\n      </div>\n      <span className=\"w-full truncate text-center text-xs text-zinc-500\">{file.name}</span>\n    </div>\n  );\n}\n\nexport function FileUploadList({ thumbnail, className }: FileUploadListProps) {\n  const { files, removeFile } = useFileUpload();\n\n  if (files.length === 0) return null;\n\n  if (thumbnail) {\n    return (\n      <div data-react-fancy-file-upload-list=\"\" className={cn(\"mt-3 flex flex-wrap gap-3\", className)}>\n        {files.map((file, i) => (\n          <ThumbnailItem key={`${file.name}-${i}`} file={file} index={i} onRemove={removeFile} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <ul data-react-fancy-file-upload-list=\"\" className={cn(\"mt-3 space-y-2\", className)}>\n      {files.map((file, i) => (\n        <li\n          key={`${file.name}-${i}`}\n          className=\"flex items-center gap-3 rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] px-3 py-2 text-sm dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\"\n        >\n          <File size={16} className=\"shrink-0 text-zinc-400\" />\n          <span className=\"flex-1 truncate\">{file.name}</span>\n          <span className=\"shrink-0 text-xs text-zinc-400\">\n            {formatSize(file.size)}\n          </span>\n          <button\n            type=\"button\"\n            onClick={() => removeFile(i)}\n            className=\"shrink-0 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300\"\n            aria-label={`Remove ${file.name}`}\n          >\n            <X size={14} />\n          </button>\n        </li>\n      ))}\n    </ul>\n  );\n}\n\nFileUploadList.displayName = \"FileUploadList\";\n","/**\n * Does a file satisfy an `accept` string?\n *\n * The browser enforces `accept` in the FILE PICKER only. A drag-and-drop never\n * opens a picker, so on the drop path this is the only thing standing between an\n * image-only dropzone and a dropped executable. Forwarding the attribute to the\n * hidden input is half the job; this is the other half.\n *\n * Follows the HTML `accept` grammar: a comma-separated list of extensions\n * (`.csv`), exact MIME types (`text/plain`) and type wildcards (`image/*`).\n * Matching is case-insensitive, because a drop reports whatever the OS says and\n * `TEXT/PLAIN` is a real thing to receive.\n *\n * A dropped file often carries an EMPTY `type` — the OS may not know it and\n * `File.type` is a hint, never a guarantee. That is why extension rules are\n * checked against the name and not the type: an `accept=\".csv\"` zone has to work\n * for a .csv whose type is `\"\"`, which is the common case rather than the edge.\n */\nexport function matchesAccept(file: File, accept: string): boolean {\n  const rules = accept\n    .split(\",\")\n    .map((rule) => rule.trim().toLowerCase())\n    .filter(Boolean);\n\n  // An accept string that lists nothing constrains nothing. Failing closed here\n  // would turn `accept=\"\"` into a dropzone that silently swallows every file.\n  if (rules.length === 0) return true;\n\n  const type = file.type.toLowerCase();\n  const name = file.name.toLowerCase();\n\n  return rules.some((rule) => {\n    if (rule.startsWith(\".\")) return name.endsWith(rule);\n    if (rule.endsWith(\"/*\")) return type.startsWith(rule.slice(0, -1));\n    return type === rule;\n  });\n}\n","import { useCallback, useMemo, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { FileUploadContext } from \"./FileUpload.context\";\nimport { FileUploadDropzone } from \"./FileUploadDropzone\";\nimport { FileUploadList } from \"./FileUploadList\";\nimport { matchesAccept } from \"./matchesAccept\";\nimport type { FileUploadProps } from \"./FileUpload.types\";\n\nfunction FileUploadRoot({\n  children,\n  value,\n  onChange,\n  accept,\n  multiple = true,\n  maxFiles,\n  maxSize,\n  disabled = false,\n  className,\n}: FileUploadProps) {\n  const [internalFiles, setInternalFiles] = useState<File[]>([]);\n  const files = value ?? internalFiles;\n\n  const addFiles = useCallback(\n    (newFiles: FileList | File[]) => {\n      let toAdd = Array.from(newFiles);\n\n      // `accept` is enforced HERE, not only on the input: the input's attribute\n      // governs the picker, and a drop never opens one.\n      if (accept) {\n        toAdd = toAdd.filter((f) => matchesAccept(f, accept));\n      }\n\n      if (maxSize) {\n        toAdd = toAdd.filter((f) => f.size <= maxSize);\n      }\n\n      /*\n       * `multiple={false}` REPLACES; `maxFiles` refuses the overflow.\n       *\n       * These used to be the same rule — a cap of one, first-wins — on the\n       * reasoning that the two props must not disagree about what a single-file\n       * upload means. But they are different statements:\n       *\n       *   - `maxFiles={n}` is a QUOTA. Dropping five files into a three-file\n       *     field should keep three, not the last three.\n       *   - `multiple={false}` is a FIELD SHAPE: this input holds one file. Its\n       *     analogue is a radio group, where choosing again MOVES the selection.\n       *\n       * Under the old rule a single-file field could never change its mind: the\n       * second choice computed `[old, new].slice(0, 1)` and discarded the new\n       * file in silence. The YouGene estate worked around it by remounting the\n       * component with a `key`, which is the shape of a bug rather than a\n       * preference.\n       */\n      if (multiple === false) {\n        /*\n         * The FIRST of the incoming batch, not the last.\n         *\n         * Two separate questions hide here, and only one of them was the bug:\n         *\n         *   - ACROSS gestures — choose a file, then choose another. The second\n         *     must win, or the field cannot change its mind. That is the fix.\n         *   - WITHIN one gesture — drop two files at once onto a single-file\n         *     field. Which one wins is arbitrary, and taking the first is what\n         *     has always shipped; there is no replacement intent in a single\n         *     ambiguous drop.\n         *\n         * Taking `slice(-1)` would have answered both with \"the last\", quietly\n         * changing the second. The existing drop test caught it.\n         */\n        const replacement = toAdd.slice(0, 1);\n        // Nothing survived the accept/size filters — leave the field alone\n        // rather than clearing a file the user never asked to remove.\n        const next = replacement.length > 0 ? replacement : files;\n\n        if (value === undefined) setInternalFiles(next);\n        onChange?.(next);\n\n        return;\n      }\n\n      const updated = [...files, ...toAdd];\n      const limited = maxFiles ? updated.slice(0, maxFiles) : updated;\n\n      if (value === undefined) setInternalFiles(limited);\n      onChange?.(limited);\n    },\n    [accept, files, maxFiles, maxSize, multiple, onChange, value],\n  );\n\n  const removeFile = useCallback(\n    (index: number) => {\n      const updated = files.filter((_, i) => i !== index);\n      if (value === undefined) setInternalFiles(updated);\n      onChange?.(updated);\n    },\n    [files, onChange, value],\n  );\n\n  const ctx = useMemo(\n    () => ({ files, addFiles, removeFile, disabled, accept, multiple }),\n    [files, addFiles, removeFile, disabled, accept, multiple],\n  );\n\n  return (\n    <FileUploadContext.Provider value={ctx}>\n      <div data-react-fancy-file-upload=\"\" className={cn(className)}>{children}</div>\n    </FileUploadContext.Provider>\n  );\n}\n\nexport const FileUpload = Object.assign(FileUploadRoot, {\n  Dropzone: FileUploadDropzone,\n  List: FileUploadList,\n});\n"]}