@recursica/mantine-adapter 0.40.0 → 0.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/dist/index.d.ts +104 -5
- package/dist/mantine-adapter.cjs +2 -2
- package/dist/mantine-adapter.cjs.map +1 -1
- package/dist/mantine-adapter.css +1 -1
- package/dist/mantine-adapter.js +2356 -2106
- package/dist/mantine-adapter.js.map +1 -1
- package/package.json +1 -1
- package/src/components/FileInput/FILEINPUT_IMPLEMENTATION_NOTES.md +148 -0
- package/src/components/FileInput/FileInput.module.css +269 -47
- package/src/components/FileInput/FileInput.stories.tsx +296 -4
- package/src/components/FileInput/FileInput.tsx +408 -5
- package/src/components/FileInput/USAGE.md +112 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @recursica/mantine-adapter
|
|
2
2
|
|
|
3
|
+
## 0.41.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 3d75770: Implement the `FileInput` component (single-line, `TextField`-shaped file picker with a native drag-and-drop drop target, single- and multiple-file modes, and a trailing clear icon) in `mantine-adapter` and `mui-adapter`, replacing the "coming soon" stub, with a shared `RecursicaFileInputProps` contract in `adapter-common` reusing `FileUpload`'s `RecursicaFileUploadItem`/validation interface (`accept`/`maxSize`/`maxFiles`/`readOnly`). Also adds `FileInput` to `RECURSICA_COMPONENTS` and moves `mui-adapter`'s export of it into the standard `wrapComponent` set (it was previously exported unwrapped, alongside the polymorphic layout primitives, as a leftover from its stub form).
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- b86ca2b: `FileInput` now renders every selected file as a removable `Chip` in a horizontally scrollable row, in both single- and multiple-file mode (previously single-file mode showed plain filename text with no remove affordance). The trailing clear-all control is now a real shared `Button` (icon-only, "text" variant) instead of a bespoke `<span role="button">`.
|
|
12
|
+
- Updated dependencies [3d75770]
|
|
13
|
+
- Updated dependencies [b86ca2b]
|
|
14
|
+
- @recursica/adapter-common@0.17.0
|
|
15
|
+
|
|
3
16
|
## 0.40.0
|
|
4
17
|
|
|
5
18
|
### Minor Changes
|
package/dist/index.d.ts
CHANGED
|
@@ -371,9 +371,22 @@ export declare interface EmptyValueRendererProps {
|
|
|
371
371
|
|
|
372
372
|
export declare const FileInput: typeof rawComponents.FileInput;
|
|
373
373
|
|
|
374
|
-
|
|
374
|
+
/**
|
|
375
|
+
* A single-line, `TextField`-shaped control for choosing one or more files, sharing
|
|
376
|
+
* `FileUpload`'s selection/validation interface (`accept`/`maxSize`/`maxFiles`, `readOnly`)
|
|
377
|
+
* behind a different presentation.
|
|
378
|
+
*
|
|
379
|
+
* @example
|
|
380
|
+
* <FileInput
|
|
381
|
+
* label="Resume"
|
|
382
|
+
* files={files}
|
|
383
|
+
* onFilesAdded={(added) => setFiles(added.map((file) => ({ file })))}
|
|
384
|
+
* onFileRemove={() => setFiles([])}
|
|
385
|
+
* />
|
|
386
|
+
*/
|
|
387
|
+
declare const FileInput_2: default_2.ForwardRefExoticComponent<FileInputProps & default_2.RefAttributes<HTMLDivElement>>;
|
|
375
388
|
|
|
376
|
-
declare type FileInputProps =
|
|
389
|
+
declare type FileInputProps = RecursicaOverStyled<RecursicaFileInputProps_2>;
|
|
377
390
|
|
|
378
391
|
/**
|
|
379
392
|
* Mirrors the semantics of the native HTML `accept` attribute (comma-separated file extensions,
|
|
@@ -1348,9 +1361,10 @@ declare namespace rawComponents {
|
|
|
1348
1361
|
RecursicaDropdownProps,
|
|
1349
1362
|
DropdownProps,
|
|
1350
1363
|
Dropdown_2 as Dropdown,
|
|
1364
|
+
RecursicaFileUploadItem,
|
|
1365
|
+
RecursicaFileInputProps_2 as RecursicaFileInputProps,
|
|
1351
1366
|
FileInputProps,
|
|
1352
1367
|
FileInput_2 as FileInput,
|
|
1353
|
-
RecursicaFileUploadItem,
|
|
1354
1368
|
RecursicaFileUploadProps_2 as RecursicaFileUploadProps,
|
|
1355
1369
|
FileUploadProps,
|
|
1356
1370
|
FileUpload_2 as FileUpload,
|
|
@@ -1561,7 +1575,7 @@ declare type ReadOnlyTextFieldProps = RecursicaOverStyled<RecursicaReadOnlyTextF
|
|
|
1561
1575
|
/**
|
|
1562
1576
|
* Official list of all components in Recursica.
|
|
1563
1577
|
*/
|
|
1564
|
-
export declare const RECURSICA_COMPONENTS: readonly ["Accordion", "AssistiveElement", "Autocomplete", "Avatar", "Badge", "Breadcrumb", "Button", "Card", "Checkbox", "Chip", "Container", "DatePicker", "Dropdown", "EmptyValueRenderer", "Flex", "FormControlLayout", "FormControlWrapper", "Grid", "Group", "HoverCard", "Label", "Layer", "Link", "Loader", "Menu", "Modal", "NumberInput", "Pagination", "Panel", "Popover", "Radio", "ReadOnlyField", "SegmentedControl", "Slider", "Stack", "Stepper", "Switch", "Table", "Tabs", "Text", "TextArea", "TextField", "TimePicker", "Timeline", "Title", "Toast", "Tooltip", "TransferList"];
|
|
1578
|
+
export declare const RECURSICA_COMPONENTS: readonly ["Accordion", "AssistiveElement", "Autocomplete", "Avatar", "Badge", "Breadcrumb", "Button", "Card", "Checkbox", "Chip", "Container", "DatePicker", "Dropdown", "EmptyValueRenderer", "FileInput", "Flex", "FormControlLayout", "FormControlWrapper", "Grid", "Group", "HoverCard", "Label", "Layer", "Link", "Loader", "Menu", "Modal", "NumberInput", "Pagination", "Panel", "Popover", "Radio", "ReadOnlyField", "SegmentedControl", "Slider", "Stack", "Stepper", "Switch", "Table", "Tabs", "Text", "TextArea", "TextField", "TimePicker", "Timeline", "Title", "Toast", "Tooltip", "TransferList"];
|
|
1565
1579
|
|
|
1566
1580
|
/**
|
|
1567
1581
|
* Props for the Recursica Accordion Control component.
|
|
@@ -1844,10 +1858,93 @@ declare interface RecursicaDropdownProps_2 {
|
|
|
1844
1858
|
placeholder?: string;
|
|
1845
1859
|
}
|
|
1846
1860
|
|
|
1861
|
+
/**
|
|
1862
|
+
* Props for the Recursica FileInput component.
|
|
1863
|
+
*
|
|
1864
|
+
* `FileInput` is presented as a single-line, `TextField`-shaped control rather than
|
|
1865
|
+
* `FileUpload`'s dropzone, but shares the same file-selection interface and validation
|
|
1866
|
+
* behavior (`accept`/`maxSize`/`maxFiles`, `onFilesRejected`, `readOnly`) so integrators can
|
|
1867
|
+
* move between them without relearning the contract.
|
|
1868
|
+
*/
|
|
1869
|
+
export declare interface RecursicaFileInputProps {
|
|
1870
|
+
/**
|
|
1871
|
+
* Files currently selected. This is a controlled list — `onFilesAdded`/`onFileRemove`
|
|
1872
|
+
* report changes, but `FileInput` never mutates this array itself; merge the reported
|
|
1873
|
+
* changes into your own state and pass the updated list back in.
|
|
1874
|
+
*/
|
|
1875
|
+
files?: RecursicaFileUploadItem[];
|
|
1876
|
+
/**
|
|
1877
|
+
* Called with the files the user just picked via the native file dialog or dropped onto
|
|
1878
|
+
* the control. Only the newly added files are passed — merge them into `files` yourself.
|
|
1879
|
+
*/
|
|
1880
|
+
onFilesAdded?: (files: File[]) => void;
|
|
1881
|
+
/**
|
|
1882
|
+
* Called when a file's remove affordance is activated, identified by its `id` (or
|
|
1883
|
+
* `file.name` when no `id` was given for that entry). In single-file mode this is also
|
|
1884
|
+
* called when the trailing clear icon removes the one selected file.
|
|
1885
|
+
*/
|
|
1886
|
+
onFileRemove?: (id: string) => void;
|
|
1887
|
+
/**
|
|
1888
|
+
* Native `accept` attribute for the underlying file input (e.g. `".pdf,.png"` or
|
|
1889
|
+
* `"image/*"`) — constrains the native file-picker dialog. Also enforced against files
|
|
1890
|
+
* dropped onto the control, the same way `FileUpload` enforces it.
|
|
1891
|
+
*/
|
|
1892
|
+
accept?: string;
|
|
1893
|
+
/** Whether more than one file can be selected/dropped at once. Defaults to `false`. */
|
|
1894
|
+
multiple?: boolean;
|
|
1895
|
+
/**
|
|
1896
|
+
* Maximum size per file, in bytes. Files exceeding this are passed to
|
|
1897
|
+
* `onFilesRejected` instead of `onFilesAdded`.
|
|
1898
|
+
*/
|
|
1899
|
+
maxSize?: number;
|
|
1900
|
+
/**
|
|
1901
|
+
* Maximum total number of files allowed in `files`. Only meaningful when `multiple` is
|
|
1902
|
+
* `true` — Once reached, further dropped/picked files are passed to `onFilesRejected`
|
|
1903
|
+
* instead of `onFilesAdded`.
|
|
1904
|
+
*/
|
|
1905
|
+
maxFiles?: number;
|
|
1906
|
+
/**
|
|
1907
|
+
* Called with any files rejected for exceeding `maxSize`/`maxFiles` or not matching
|
|
1908
|
+
* `accept`.
|
|
1909
|
+
*/
|
|
1910
|
+
onFilesRejected?: (files: File[]) => void;
|
|
1911
|
+
/**
|
|
1912
|
+
* Error message shown (via the standard assistive-text error slot) when a dropped/picked
|
|
1913
|
+
* file's extension or MIME type doesn't match `accept`. Defaults to
|
|
1914
|
+
* `"File type not accepted"`.
|
|
1915
|
+
*/
|
|
1916
|
+
invalidFileTypeMessage?: default_2.ReactNode;
|
|
1917
|
+
/**
|
|
1918
|
+
* Error message shown (via the standard assistive-text error slot) when a dropped/picked
|
|
1919
|
+
* file would exceed `maxFiles`. Defaults to `"Maximum of {maxFiles} files allowed"`.
|
|
1920
|
+
*/
|
|
1921
|
+
maxFilesMessage?: default_2.ReactNode;
|
|
1922
|
+
/** Leading icon shown inside the control. Defaults to the built-in upload icon. */
|
|
1923
|
+
icon?: default_2.ReactNode;
|
|
1924
|
+
/** Text shown when no file is selected. Defaults to `"Select a file..."`. */
|
|
1925
|
+
placeholder?: default_2.ReactNode;
|
|
1926
|
+
/** Screen-reader label for the control itself. Defaults to `"Choose file"`. */
|
|
1927
|
+
browseLabel?: string;
|
|
1928
|
+
/** Screen-reader label for a file chip's remove button. Defaults to `"Remove"`. */
|
|
1929
|
+
removeFileLabel?: string;
|
|
1930
|
+
/** Screen-reader label for the trailing clear-all icon. Defaults to `"Clear"`. */
|
|
1931
|
+
clearLabel?: string;
|
|
1932
|
+
/** Disables the control and its remove/clear icons. */
|
|
1933
|
+
disabled?: boolean;
|
|
1934
|
+
/**
|
|
1935
|
+
* Renders `files` as a static, non-interactive display with no clear/remove icons, and
|
|
1936
|
+
* disables picking or dropping new files.
|
|
1937
|
+
*/
|
|
1938
|
+
readOnly?: boolean;
|
|
1939
|
+
}
|
|
1940
|
+
|
|
1941
|
+
declare interface RecursicaFileInputProps_2 extends Omit<default_2.HTMLAttributes<HTMLDivElement>, "children" | "onDrop" | "onChange">, Pick<InputWrapperProps, "label" | "error" | "required" | "withAsterisk" | "id">, Omit<RecursicaFormControlWrapperProps, "controlMaxWidth" | "controlMinWidth">, RecursicaFileInputProps {
|
|
1942
|
+
}
|
|
1943
|
+
|
|
1847
1944
|
/**
|
|
1848
1945
|
* A single file entry rendered as a removable chip in the FileUpload's file list.
|
|
1849
1946
|
*/
|
|
1850
|
-
|
|
1947
|
+
declare interface RecursicaFileUploadItem {
|
|
1851
1948
|
/** The underlying browser File object. */
|
|
1852
1949
|
file: File;
|
|
1853
1950
|
/**
|
|
@@ -1856,6 +1953,8 @@ export declare interface RecursicaFileUploadItem {
|
|
|
1856
1953
|
*/
|
|
1857
1954
|
id?: string;
|
|
1858
1955
|
}
|
|
1956
|
+
export { RecursicaFileUploadItem as RecursicaFileInputItem }
|
|
1957
|
+
export { RecursicaFileUploadItem }
|
|
1859
1958
|
|
|
1860
1959
|
/**
|
|
1861
1960
|
* Props for the Recursica FileUpload component.
|