@recursica/mantine-adapter 0.39.0 → 0.40.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 +24 -0
- package/dist/index.d.ts +130 -2
- 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 +2221 -1998
- package/dist/mantine-adapter.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Button/Button.module.css +13 -0
- package/src/components/Chip/CHIP_IMPLEMENTATION_NOTES.md +59 -0
- package/src/components/Chip/Chip.module.css +36 -4
- package/src/components/Chip/Chip.tsx +14 -5
- package/src/components/Chip/USAGE.md +7 -0
- package/src/components/FileUpload/FILEUPLOAD_IMPLEMENTATION_NOTES.md +244 -0
- package/src/components/FileUpload/FileUpload.module.css +204 -42
- package/src/components/FileUpload/FileUpload.stories.tsx +348 -4
- package/src/components/FileUpload/FileUpload.tsx +352 -5
- package/src/components/FileUpload/USAGE.md +163 -5
- package/src/components/TimePicker/TIMEPICKER_IMPLEMENTATION_NOTES.md +10 -0
- package/src/components/TimePicker/TimePicker.tsx +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @recursica/mantine-adapter
|
|
2
2
|
|
|
3
|
+
## 0.40.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 1c317a3: Implement the `FileUpload` component (drag-and-drop dropzone, browse-button fallback, removable file-chip list) in `mantine-adapter` and `mui-adapter`, replacing the "coming soon" stub, with a shared `RecursicaFileUploadProps`/`RecursicaFileUploadItem` contract in `adapter-common`. Also fixes `mui-adapter`'s `Chip` component's public type to allow `children` (a pre-existing type-only gap; the component already accepted them at runtime).
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- 1c317a3: `FileUpload` now surfaces a built-in error message ("File type not accepted", overridable via the new `invalidFileTypeMessage` prop) when a dropped/picked file doesn't match `accept`, shown through the standard assistive-text error slot instead of requiring the integrator to wire up `onFilesRejected` themselves. Also reverts `FileUpload`'s assistive/error rendering back to `FormControlWrapper` (file list renders above the assistive/error text again, matching every other form control).
|
|
12
|
+
|
|
13
|
+
Fixes `Chip` clipping the descender (e.g. the "g" in "image.png") off long labels — `overflow: hidden` was clipping vertically as well as horizontally, cutting off glyph ink whenever the line-height token was tighter than the font's natural ascent+descent.
|
|
14
|
+
|
|
15
|
+
- 1c317a3: `FileUpload` now supports a `maxFiles` prop (with an overridable `maxFilesMessage`, defaulting to "Maximum of {maxFiles} files allowed") that rejects files past a total-count cap the same way `accept`/`maxSize` already do.
|
|
16
|
+
|
|
17
|
+
Fixes `Chip` rendered without a real handler (`onRemove`/`onClick`/`onChange`) — such as `FileUpload`'s `readOnly` file list — still showing a pointer cursor on hover and picking up a phantom, un-styled keyboard Tab stop on its truncated label text. Both were general `Chip` bugs, not specific to `FileUpload`.
|
|
18
|
+
|
|
19
|
+
- 1c317a3: Fix `Button` showing the native browser focus outline instead of the recursica focus ring, and fix `Chip` losing its remove (X) icon behind an overflowing long label instead of truncating with an ellipsis. Adds optional `removeTabIndex`/`removeIconRef` props to `Chip` for building keyboard-navigable chip groups. Also fixes the remove icon's own focus ring rendering in the chip's neutral border color instead of the recursica focus-ring color, making it barely visible.
|
|
20
|
+
- 1c317a3: Fix `TimePicker`'s AM/PM dropdown showing blank until an hour is typed; it now defaults to "AM", matching `mui-adapter`.
|
|
21
|
+
- Updated dependencies [1c317a3]
|
|
22
|
+
- Updated dependencies [1c317a3]
|
|
23
|
+
- Updated dependencies [1c317a3]
|
|
24
|
+
- Updated dependencies [1c317a3]
|
|
25
|
+
- @recursica/adapter-common@0.16.0
|
|
26
|
+
|
|
3
27
|
## 0.39.0
|
|
4
28
|
|
|
5
29
|
### Minor Changes
|
package/dist/index.d.ts
CHANGED
|
@@ -375,11 +375,32 @@ declare const FileInput_2: default_2.FC<FileInputProps>;
|
|
|
375
375
|
|
|
376
376
|
declare type FileInputProps = default_2.HTMLAttributes<HTMLDivElement>;
|
|
377
377
|
|
|
378
|
+
/**
|
|
379
|
+
* Mirrors the semantics of the native HTML `accept` attribute (comma-separated file extensions,
|
|
380
|
+
* MIME types, or MIME wildcards like `image/*`) so drag-and-drop can be validated the same way —
|
|
381
|
+
* the browser only applies `accept` to its own file-picker dialog, never to a `drop` event, so
|
|
382
|
+
* without this a dropped file bypasses the restriction entirely.
|
|
383
|
+
*/
|
|
384
|
+
export declare function fileMatchesAccept(file: File, accept?: string): boolean;
|
|
385
|
+
|
|
378
386
|
export declare const FileUpload: typeof rawComponents.FileUpload;
|
|
379
387
|
|
|
380
|
-
|
|
388
|
+
/**
|
|
389
|
+
* A dropzone for uploading files, with a native browse-button fallback and a
|
|
390
|
+
* removable-chip list of the currently selected files.
|
|
391
|
+
*
|
|
392
|
+
* @example
|
|
393
|
+
* <FileUpload
|
|
394
|
+
* label="Upload Files"
|
|
395
|
+
* assistiveText="Max file size 5MB"
|
|
396
|
+
* files={files}
|
|
397
|
+
* onFilesAdded={(added) => setFiles((f) => [...f, ...added.map((file) => ({ file }))])}
|
|
398
|
+
* onFileRemove={(id) => setFiles((f) => f.filter((item) => (item.id ?? item.file.name) !== id))}
|
|
399
|
+
* />
|
|
400
|
+
*/
|
|
401
|
+
declare const FileUpload_2: default_2.ForwardRefExoticComponent<FileUploadProps & default_2.RefAttributes<HTMLDivElement>>;
|
|
381
402
|
|
|
382
|
-
declare type FileUploadProps =
|
|
403
|
+
declare type FileUploadProps = RecursicaOverStyled<RecursicaFileUploadProps_2>;
|
|
383
404
|
|
|
384
405
|
export declare const Flex: (<C = "div">(props: PolymorphicComponentProps<C, rawComponents.FlexProps>) => React.ReactElement) & Omit<FunctionComponent<(Omit<FlexProps_2 & RecursicaFlexProps, "m" | "my" | "mx" | "mt" | "mb" | "ml" | "mr" | "gap" | "rowGap" | "columnGap"> & {
|
|
385
406
|
m?: string | number | RecursicaSpacing;
|
|
@@ -1329,6 +1350,8 @@ declare namespace rawComponents {
|
|
|
1329
1350
|
Dropdown_2 as Dropdown,
|
|
1330
1351
|
FileInputProps,
|
|
1331
1352
|
FileInput_2 as FileInput,
|
|
1353
|
+
RecursicaFileUploadItem,
|
|
1354
|
+
RecursicaFileUploadProps_2 as RecursicaFileUploadProps,
|
|
1332
1355
|
FileUploadProps,
|
|
1333
1356
|
FileUpload_2 as FileUpload,
|
|
1334
1357
|
FlexProps,
|
|
@@ -1757,6 +1780,17 @@ export declare interface RecursicaChipProps {
|
|
|
1757
1780
|
removeLabel?: string;
|
|
1758
1781
|
/** Checked state for the chip (acts as a checkbox) */
|
|
1759
1782
|
checked?: boolean;
|
|
1783
|
+
/**
|
|
1784
|
+
* Tab index for the remove (X) icon. Defaults to `0`. Lets a parent implement a roving-tabindex
|
|
1785
|
+
* pattern across a group of chips (e.g. FileUpload's file list) by setting this to `-1` on every
|
|
1786
|
+
* chip except the currently-active one.
|
|
1787
|
+
*/
|
|
1788
|
+
removeTabIndex?: number;
|
|
1789
|
+
/**
|
|
1790
|
+
* Ref to the remove (X) icon element, so a parent can move focus to it imperatively — e.g.
|
|
1791
|
+
* arrow-key navigation across a group of chips.
|
|
1792
|
+
*/
|
|
1793
|
+
removeIconRef?: default_2.Ref<HTMLSpanElement>;
|
|
1760
1794
|
}
|
|
1761
1795
|
|
|
1762
1796
|
/**
|
|
@@ -1810,6 +1844,100 @@ declare interface RecursicaDropdownProps_2 {
|
|
|
1810
1844
|
placeholder?: string;
|
|
1811
1845
|
}
|
|
1812
1846
|
|
|
1847
|
+
/**
|
|
1848
|
+
* A single file entry rendered as a removable chip in the FileUpload's file list.
|
|
1849
|
+
*/
|
|
1850
|
+
export declare interface RecursicaFileUploadItem {
|
|
1851
|
+
/** The underlying browser File object. */
|
|
1852
|
+
file: File;
|
|
1853
|
+
/**
|
|
1854
|
+
* Stable identifier for this entry, used as the React key and passed back to
|
|
1855
|
+
* `onFileRemove`. Defaults to the file's `name` when not provided.
|
|
1856
|
+
*/
|
|
1857
|
+
id?: string;
|
|
1858
|
+
}
|
|
1859
|
+
|
|
1860
|
+
/**
|
|
1861
|
+
* Props for the Recursica FileUpload component.
|
|
1862
|
+
*/
|
|
1863
|
+
export declare interface RecursicaFileUploadProps {
|
|
1864
|
+
/**
|
|
1865
|
+
* Files currently selected, rendered as removable chips below the dropzone.
|
|
1866
|
+
* This is a controlled list — `onFilesAdded`/`onFileRemove` report changes, but
|
|
1867
|
+
* `FileUpload` never mutates this array itself; merge the reported changes into
|
|
1868
|
+
* your own state and pass the updated list back in.
|
|
1869
|
+
*/
|
|
1870
|
+
files?: RecursicaFileUploadItem[];
|
|
1871
|
+
/**
|
|
1872
|
+
* Called with the files the user just dropped onto the dropzone or picked via
|
|
1873
|
+
* the browse button. Only the newly added files are passed — merge them into
|
|
1874
|
+
* `files` yourself (e.g. to assign an `id`, dedupe, or reject some of them).
|
|
1875
|
+
*/
|
|
1876
|
+
onFilesAdded?: (files: File[]) => void;
|
|
1877
|
+
/**
|
|
1878
|
+
* Called when a file chip's remove (X) icon is activated, identified by its
|
|
1879
|
+
* `id` (or `file.name` when no `id` was given for that entry).
|
|
1880
|
+
*/
|
|
1881
|
+
onFileRemove?: (id: string) => void;
|
|
1882
|
+
/**
|
|
1883
|
+
* Native `accept` attribute for the underlying file input (e.g. `".pdf,.png"`
|
|
1884
|
+
* or `"image/*"`) — constrains the browse-button file picker natively. Also
|
|
1885
|
+
* enforced against files dropped onto the dropzone: the browser only applies
|
|
1886
|
+
* `accept` to its own file-picker dialog, never to a `drop` event, so files
|
|
1887
|
+
* that don't match are rejected the same way (see `onFilesRejected`) rather
|
|
1888
|
+
* than silently bypassing the restriction.
|
|
1889
|
+
*/
|
|
1890
|
+
accept?: string;
|
|
1891
|
+
/** Whether more than one file can be selected/dropped at once. Defaults to `true`. */
|
|
1892
|
+
multiple?: boolean;
|
|
1893
|
+
/**
|
|
1894
|
+
* Maximum size per file, in bytes. Files exceeding this are passed to
|
|
1895
|
+
* `onFilesRejected` instead of `onFilesAdded`.
|
|
1896
|
+
*/
|
|
1897
|
+
maxSize?: number;
|
|
1898
|
+
/**
|
|
1899
|
+
* Maximum total number of files allowed in `files`. Once reached, further
|
|
1900
|
+
* dropped/picked files are passed to `onFilesRejected` instead of
|
|
1901
|
+
* `onFilesAdded`.
|
|
1902
|
+
*/
|
|
1903
|
+
maxFiles?: number;
|
|
1904
|
+
/**
|
|
1905
|
+
* Called with any files rejected for exceeding `maxSize`/`maxFiles` or not
|
|
1906
|
+
* matching `accept`.
|
|
1907
|
+
*/
|
|
1908
|
+
onFilesRejected?: (files: File[]) => void;
|
|
1909
|
+
/**
|
|
1910
|
+
* Error message shown (via the standard assistive-text error slot) when a
|
|
1911
|
+
* dropped/picked file's extension or MIME type doesn't match `accept`.
|
|
1912
|
+
* Defaults to `"File type not accepted"`.
|
|
1913
|
+
*/
|
|
1914
|
+
invalidFileTypeMessage?: default_2.ReactNode;
|
|
1915
|
+
/**
|
|
1916
|
+
* Error message shown (via the standard assistive-text error slot) when a
|
|
1917
|
+
* dropped/picked file would exceed `maxFiles`. Defaults to
|
|
1918
|
+
* `"Maximum of {maxFiles} files allowed"`.
|
|
1919
|
+
*/
|
|
1920
|
+
maxFilesMessage?: default_2.ReactNode;
|
|
1921
|
+
/** Icon shown above the dropzone label. Defaults to the built-in upload icon. */
|
|
1922
|
+
icon?: default_2.ReactNode;
|
|
1923
|
+
/** Text shown inside the dropzone. Defaults to `"Drag and drop files here to upload"`. */
|
|
1924
|
+
dropzoneLabel?: default_2.ReactNode;
|
|
1925
|
+
/** Label for the button that opens the native file picker. Defaults to `"Browse files"`. */
|
|
1926
|
+
browseButtonLabel?: default_2.ReactNode;
|
|
1927
|
+
/** Screen-reader label for each file chip's remove button. Defaults to `"Remove"`. */
|
|
1928
|
+
removeFileLabel?: string;
|
|
1929
|
+
/** Disables the dropzone, browse button, and every file chip's remove icon. */
|
|
1930
|
+
disabled?: boolean;
|
|
1931
|
+
/**
|
|
1932
|
+
* Renders `files` as a static list of chips with no remove icon, and omits
|
|
1933
|
+
* the dropzone/browse button entirely.
|
|
1934
|
+
*/
|
|
1935
|
+
readOnly?: boolean;
|
|
1936
|
+
}
|
|
1937
|
+
|
|
1938
|
+
declare interface RecursicaFileUploadProps_2 extends Omit<default_2.HTMLAttributes<HTMLDivElement>, "children" | "onDrop" | "onChange">, Pick<InputWrapperProps, "label" | "error" | "required" | "withAsterisk" | "id">, Omit<RecursicaFormControlWrapperProps, "controlMaxWidth" | "controlMinWidth">, RecursicaFileUploadProps {
|
|
1939
|
+
}
|
|
1940
|
+
|
|
1813
1941
|
/**
|
|
1814
1942
|
* Props for the Recursica Flex layout component.
|
|
1815
1943
|
*/
|