@navikt/ds-react 6.2.0 → 6.3.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.
- package/cjs/form/combobox/ComboboxProvider.js +5 -1
- package/cjs/form/combobox/ComboboxProvider.js.map +1 -1
- package/cjs/form/combobox/FilteredOptions/FilteredOptions.js +14 -12
- package/cjs/form/combobox/FilteredOptions/FilteredOptions.js.map +1 -1
- package/cjs/form/combobox/FilteredOptions/filtered-options-util.d.ts +3 -3
- package/cjs/form/combobox/FilteredOptions/filtered-options-util.js +1 -3
- package/cjs/form/combobox/FilteredOptions/filtered-options-util.js.map +1 -1
- package/cjs/form/combobox/FilteredOptions/filteredOptionsContext.d.ts +8 -5
- package/cjs/form/combobox/FilteredOptions/filteredOptionsContext.js +8 -13
- package/cjs/form/combobox/FilteredOptions/filteredOptionsContext.js.map +1 -1
- package/cjs/form/combobox/Input/Input.js +9 -7
- package/cjs/form/combobox/Input/Input.js.map +1 -1
- package/cjs/form/combobox/SelectedOptions/SelectedOptions.d.ts +2 -1
- package/cjs/form/combobox/SelectedOptions/SelectedOptions.js +3 -3
- package/cjs/form/combobox/SelectedOptions/SelectedOptions.js.map +1 -1
- package/cjs/form/combobox/SelectedOptions/selectedOptionsContext.d.ts +10 -7
- package/cjs/form/combobox/SelectedOptions/selectedOptionsContext.js +6 -8
- package/cjs/form/combobox/SelectedOptions/selectedOptionsContext.js.map +1 -1
- package/cjs/form/combobox/combobox-utils.d.ts +10 -0
- package/cjs/form/combobox/combobox-utils.js +27 -0
- package/cjs/form/combobox/combobox-utils.js.map +1 -0
- package/cjs/form/combobox/customOptionsContext.d.ts +5 -4
- package/cjs/form/combobox/customOptionsContext.js +1 -1
- package/cjs/form/combobox/customOptionsContext.js.map +1 -1
- package/cjs/form/combobox/types.d.ts +22 -11
- package/cjs/form/file-upload/FileUpload.context.d.ts +8 -0
- package/cjs/form/file-upload/FileUpload.context.js +7 -0
- package/cjs/form/file-upload/FileUpload.context.js.map +1 -0
- package/cjs/form/file-upload/FileUpload.d.ts +118 -0
- package/cjs/form/file-upload/FileUpload.js +73 -0
- package/cjs/form/file-upload/FileUpload.js.map +1 -0
- package/cjs/form/file-upload/FileUpload.types.d.ts +55 -0
- package/cjs/form/file-upload/FileUpload.types.js +8 -0
- package/cjs/form/file-upload/FileUpload.types.js.map +1 -0
- package/cjs/form/file-upload/i18n/get.d.ts +2 -0
- package/cjs/form/file-upload/i18n/get.js +38 -0
- package/cjs/form/file-upload/i18n/get.js.map +1 -0
- package/cjs/form/file-upload/i18n/i18n.context.d.ts +11 -0
- package/cjs/form/file-upload/i18n/i18n.context.js +39 -0
- package/cjs/form/file-upload/i18n/i18n.context.js.map +1 -0
- package/cjs/form/file-upload/i18n/i18n.types.d.ts +13 -0
- package/cjs/form/file-upload/i18n/i18n.types.js +3 -0
- package/cjs/form/file-upload/i18n/i18n.types.js.map +1 -0
- package/cjs/form/file-upload/i18n/locales/nb.json +20 -0
- package/cjs/form/file-upload/i18n/merge.d.ts +2 -0
- package/cjs/form/file-upload/i18n/merge.js +29 -0
- package/cjs/form/file-upload/i18n/merge.js.map +1 -0
- package/cjs/form/file-upload/index.d.ts +7 -0
- package/cjs/form/file-upload/index.js +16 -0
- package/cjs/form/file-upload/index.js.map +1 -0
- package/cjs/form/file-upload/parts/Trigger.d.ts +7 -0
- package/cjs/form/file-upload/parts/Trigger.js +43 -0
- package/cjs/form/file-upload/parts/Trigger.js.map +1 -0
- package/cjs/form/file-upload/parts/dropzone/Dropzone.d.ts +4 -0
- package/cjs/form/file-upload/parts/dropzone/Dropzone.js +106 -0
- package/cjs/form/file-upload/parts/dropzone/Dropzone.js.map +1 -0
- package/cjs/form/file-upload/parts/dropzone/dropzone.types.d.ts +18 -0
- package/cjs/form/file-upload/parts/dropzone/dropzone.types.js +3 -0
- package/cjs/form/file-upload/parts/dropzone/dropzone.types.js.map +1 -0
- package/cjs/form/file-upload/parts/dropzone/useDropzone.d.ts +13 -0
- package/cjs/form/file-upload/parts/dropzone/useDropzone.js +34 -0
- package/cjs/form/file-upload/parts/dropzone/useDropzone.js.map +1 -0
- package/cjs/form/file-upload/parts/item/Item.d.ts +55 -0
- package/cjs/form/file-upload/parts/item/Item.js +79 -0
- package/cjs/form/file-upload/parts/item/Item.js.map +1 -0
- package/cjs/form/file-upload/parts/item/Item.types.d.ts +5 -0
- package/cjs/form/file-upload/parts/item/Item.types.js +3 -0
- package/cjs/form/file-upload/parts/item/Item.types.js.map +1 -0
- package/cjs/form/file-upload/parts/item/ItemButton.d.ts +12 -0
- package/cjs/form/file-upload/parts/item/ItemButton.js +22 -0
- package/cjs/form/file-upload/parts/item/ItemButton.js.map +1 -0
- package/cjs/form/file-upload/parts/item/ItemIcon.d.ts +9 -0
- package/cjs/form/file-upload/parts/item/ItemIcon.js +51 -0
- package/cjs/form/file-upload/parts/item/ItemIcon.js.map +1 -0
- package/cjs/form/file-upload/parts/item/ItemName.d.ts +9 -0
- package/cjs/form/file-upload/parts/item/ItemName.js +32 -0
- package/cjs/form/file-upload/parts/item/ItemName.js.map +1 -0
- package/cjs/form/file-upload/parts/item/utils/download-file.d.ts +1 -0
- package/cjs/form/file-upload/parts/item/utils/download-file.js +13 -0
- package/cjs/form/file-upload/parts/item/utils/download-file.js.map +1 -0
- package/cjs/form/file-upload/parts/item/utils/file-type-checker.d.ts +2 -0
- package/cjs/form/file-upload/parts/item/utils/file-type-checker.js +6 -0
- package/cjs/form/file-upload/parts/item/utils/file-type-checker.js.map +1 -0
- package/cjs/form/file-upload/parts/item/utils/format-file-size.d.ts +2 -0
- package/cjs/form/file-upload/parts/item/utils/format-file-size.js +24 -0
- package/cjs/form/file-upload/parts/item/utils/format-file-size.js.map +1 -0
- package/cjs/form/file-upload/useFileUpload.d.ts +12 -0
- package/cjs/form/file-upload/useFileUpload.js +33 -0
- package/cjs/form/file-upload/useFileUpload.js.map +1 -0
- package/cjs/form/file-upload/utils/is-accepted-file-type.d.ts +1 -0
- package/cjs/form/file-upload/utils/is-accepted-file-type.js +26 -0
- package/cjs/form/file-upload/utils/is-accepted-file-type.js.map +1 -0
- package/cjs/form/file-upload/utils/is-accepted-size.d.ts +1 -0
- package/cjs/form/file-upload/utils/is-accepted-size.js +11 -0
- package/cjs/form/file-upload/utils/is-accepted-size.js.map +1 -0
- package/cjs/form/file-upload/utils/validate-files.d.ts +8 -0
- package/cjs/form/file-upload/utils/validate-files.js +48 -0
- package/cjs/form/file-upload/utils/validate-files.js.map +1 -0
- package/cjs/index.d.ts +1 -0
- package/cjs/index.js +3 -1
- package/cjs/index.js.map +1 -1
- package/cjs/loader/Loader.d.ts +0 -7
- package/cjs/loader/Loader.js.map +1 -1
- package/cjs/table/DataCell.d.ts +1 -3
- package/cjs/table/DataCell.js.map +1 -1
- package/cjs/util/create-context.d.ts +1 -0
- package/cjs/util/create-context.js.map +1 -1
- package/cjs/util/hooks/useEventListener.d.ts +1 -1
- package/cjs/util/hooks/useMergeRefs.d.ts +1 -1
- package/esm/form/combobox/ComboboxProvider.js +5 -1
- package/esm/form/combobox/ComboboxProvider.js.map +1 -1
- package/esm/form/combobox/FilteredOptions/FilteredOptions.js +14 -12
- package/esm/form/combobox/FilteredOptions/FilteredOptions.js.map +1 -1
- package/esm/form/combobox/FilteredOptions/filtered-options-util.d.ts +3 -3
- package/esm/form/combobox/FilteredOptions/filtered-options-util.js +1 -3
- package/esm/form/combobox/FilteredOptions/filtered-options-util.js.map +1 -1
- package/esm/form/combobox/FilteredOptions/filteredOptionsContext.d.ts +8 -5
- package/esm/form/combobox/FilteredOptions/filteredOptionsContext.js +8 -13
- package/esm/form/combobox/FilteredOptions/filteredOptionsContext.js.map +1 -1
- package/esm/form/combobox/Input/Input.js +9 -7
- package/esm/form/combobox/Input/Input.js.map +1 -1
- package/esm/form/combobox/SelectedOptions/SelectedOptions.d.ts +2 -1
- package/esm/form/combobox/SelectedOptions/SelectedOptions.js +3 -3
- package/esm/form/combobox/SelectedOptions/SelectedOptions.js.map +1 -1
- package/esm/form/combobox/SelectedOptions/selectedOptionsContext.d.ts +10 -7
- package/esm/form/combobox/SelectedOptions/selectedOptionsContext.js +6 -8
- package/esm/form/combobox/SelectedOptions/selectedOptionsContext.js.map +1 -1
- package/esm/form/combobox/combobox-utils.d.ts +10 -0
- package/esm/form/combobox/combobox-utils.js +22 -0
- package/esm/form/combobox/combobox-utils.js.map +1 -0
- package/esm/form/combobox/customOptionsContext.d.ts +5 -4
- package/esm/form/combobox/customOptionsContext.js +1 -1
- package/esm/form/combobox/customOptionsContext.js.map +1 -1
- package/esm/form/combobox/types.d.ts +22 -11
- package/esm/form/file-upload/FileUpload.context.d.ts +8 -0
- package/esm/form/file-upload/FileUpload.context.js +3 -0
- package/esm/form/file-upload/FileUpload.context.js.map +1 -0
- package/esm/form/file-upload/FileUpload.d.ts +118 -0
- package/esm/form/file-upload/FileUpload.js +44 -0
- package/esm/form/file-upload/FileUpload.js.map +1 -0
- package/esm/form/file-upload/FileUpload.types.d.ts +55 -0
- package/esm/form/file-upload/FileUpload.types.js +5 -0
- package/esm/form/file-upload/FileUpload.types.js.map +1 -0
- package/esm/form/file-upload/i18n/get.d.ts +2 -0
- package/esm/form/file-upload/i18n/get.js +34 -0
- package/esm/form/file-upload/i18n/get.js.map +1 -0
- package/esm/form/file-upload/i18n/i18n.context.d.ts +11 -0
- package/esm/form/file-upload/i18n/i18n.context.js +32 -0
- package/esm/form/file-upload/i18n/i18n.context.js.map +1 -0
- package/esm/form/file-upload/i18n/i18n.types.d.ts +13 -0
- package/esm/form/file-upload/i18n/i18n.types.js +2 -0
- package/esm/form/file-upload/i18n/i18n.types.js.map +1 -0
- package/esm/form/file-upload/i18n/locales/nb.json +20 -0
- package/esm/form/file-upload/i18n/merge.d.ts +2 -0
- package/esm/form/file-upload/i18n/merge.js +25 -0
- package/esm/form/file-upload/i18n/merge.js.map +1 -0
- package/esm/form/file-upload/index.d.ts +7 -0
- package/esm/form/file-upload/index.js +6 -0
- package/esm/form/file-upload/index.js.map +1 -0
- package/esm/form/file-upload/parts/Trigger.d.ts +7 -0
- package/esm/form/file-upload/parts/Trigger.js +18 -0
- package/esm/form/file-upload/parts/Trigger.js.map +1 -0
- package/esm/form/file-upload/parts/dropzone/Dropzone.d.ts +4 -0
- package/esm/form/file-upload/parts/dropzone/Dropzone.js +78 -0
- package/esm/form/file-upload/parts/dropzone/Dropzone.js.map +1 -0
- package/esm/form/file-upload/parts/dropzone/dropzone.types.d.ts +18 -0
- package/esm/form/file-upload/parts/dropzone/dropzone.types.js +2 -0
- package/esm/form/file-upload/parts/dropzone/dropzone.types.js.map +1 -0
- package/esm/form/file-upload/parts/dropzone/useDropzone.d.ts +13 -0
- package/esm/form/file-upload/parts/dropzone/useDropzone.js +30 -0
- package/esm/form/file-upload/parts/dropzone/useDropzone.js.map +1 -0
- package/esm/form/file-upload/parts/item/Item.d.ts +55 -0
- package/esm/form/file-upload/parts/item/Item.js +50 -0
- package/esm/form/file-upload/parts/item/Item.js.map +1 -0
- package/esm/form/file-upload/parts/item/Item.types.d.ts +5 -0
- package/esm/form/file-upload/parts/item/Item.types.js +2 -0
- package/esm/form/file-upload/parts/item/Item.types.js.map +1 -0
- package/esm/form/file-upload/parts/item/ItemButton.d.ts +12 -0
- package/esm/form/file-upload/parts/item/ItemButton.js +17 -0
- package/esm/form/file-upload/parts/item/ItemButton.js.map +1 -0
- package/esm/form/file-upload/parts/item/ItemIcon.d.ts +9 -0
- package/esm/form/file-upload/parts/item/ItemIcon.js +46 -0
- package/esm/form/file-upload/parts/item/ItemIcon.js.map +1 -0
- package/esm/form/file-upload/parts/item/ItemName.d.ts +9 -0
- package/esm/form/file-upload/parts/item/ItemName.js +27 -0
- package/esm/form/file-upload/parts/item/ItemName.js.map +1 -0
- package/esm/form/file-upload/parts/item/utils/download-file.d.ts +1 -0
- package/esm/form/file-upload/parts/item/utils/download-file.js +9 -0
- package/esm/form/file-upload/parts/item/utils/download-file.js.map +1 -0
- package/esm/form/file-upload/parts/item/utils/file-type-checker.d.ts +2 -0
- package/esm/form/file-upload/parts/item/utils/file-type-checker.js +2 -0
- package/esm/form/file-upload/parts/item/utils/file-type-checker.js.map +1 -0
- package/esm/form/file-upload/parts/item/utils/format-file-size.d.ts +2 -0
- package/esm/form/file-upload/parts/item/utils/format-file-size.js +20 -0
- package/esm/form/file-upload/parts/item/utils/format-file-size.js.map +1 -0
- package/esm/form/file-upload/useFileUpload.d.ts +12 -0
- package/esm/form/file-upload/useFileUpload.js +29 -0
- package/esm/form/file-upload/useFileUpload.js.map +1 -0
- package/esm/form/file-upload/utils/is-accepted-file-type.d.ts +1 -0
- package/esm/form/file-upload/utils/is-accepted-file-type.js +22 -0
- package/esm/form/file-upload/utils/is-accepted-file-type.js.map +1 -0
- package/esm/form/file-upload/utils/is-accepted-size.d.ts +1 -0
- package/esm/form/file-upload/utils/is-accepted-size.js +7 -0
- package/esm/form/file-upload/utils/is-accepted-size.js.map +1 -0
- package/esm/form/file-upload/utils/validate-files.d.ts +8 -0
- package/esm/form/file-upload/utils/validate-files.js +44 -0
- package/esm/form/file-upload/utils/validate-files.js.map +1 -0
- package/esm/index.d.ts +1 -0
- package/esm/index.js +1 -0
- package/esm/index.js.map +1 -1
- package/esm/loader/Loader.d.ts +0 -7
- package/esm/loader/Loader.js.map +1 -1
- package/esm/table/DataCell.d.ts +1 -3
- package/esm/table/DataCell.js.map +1 -1
- package/esm/util/create-context.d.ts +1 -0
- package/esm/util/create-context.js.map +1 -1
- package/esm/util/hooks/useEventListener.d.ts +1 -1
- package/esm/util/hooks/useMergeRefs.d.ts +1 -1
- package/package.json +13 -3
- package/src/form/combobox/ComboboxProvider.tsx +7 -3
- package/src/form/combobox/FilteredOptions/FilteredOptions.tsx +22 -15
- package/src/form/combobox/FilteredOptions/filtered-options-util.ts +5 -10
- package/src/form/combobox/FilteredOptions/filteredOptionsContext.tsx +19 -29
- package/src/form/combobox/Input/Input.tsx +14 -8
- package/src/form/combobox/SelectedOptions/SelectedOptions.tsx +8 -5
- package/src/form/combobox/SelectedOptions/selectedOptionsContext.tsx +24 -25
- package/src/form/combobox/combobox-utils.test.ts +67 -0
- package/src/form/combobox/combobox-utils.ts +32 -0
- package/src/form/combobox/combobox.stories.tsx +67 -32
- package/src/form/combobox/combobox.test.tsx +32 -1
- package/src/form/combobox/customOptionsContext.tsx +9 -8
- package/src/form/combobox/types.ts +23 -11
- package/src/form/file-upload/FileUpload.context.tsx +9 -0
- package/src/form/file-upload/FileUpload.tsx +142 -0
- package/src/form/file-upload/FileUpload.types.ts +57 -0
- package/src/form/file-upload/file-upload-dropzone.stories.tsx +123 -0
- package/src/form/file-upload/file-upload-item.stories.tsx +136 -0
- package/src/form/file-upload/file-upload.stories.tsx +236 -0
- package/src/form/file-upload/i18n/get.ts +48 -0
- package/src/form/file-upload/i18n/i18n.context.test.tsx +92 -0
- package/src/form/file-upload/i18n/i18n.context.ts +67 -0
- package/src/form/file-upload/i18n/i18n.types.ts +20 -0
- package/src/form/file-upload/i18n/locales/nb.json +20 -0
- package/src/form/file-upload/i18n/merge.ts +35 -0
- package/src/form/file-upload/index.ts +21 -0
- package/src/form/file-upload/parts/Trigger.tsx +48 -0
- package/src/form/file-upload/parts/dropzone/Dropzone.tsx +181 -0
- package/src/form/file-upload/parts/dropzone/dropzone.types.ts +22 -0
- package/src/form/file-upload/parts/dropzone/useDropzone.ts +43 -0
- package/src/form/file-upload/parts/item/Item.tsx +165 -0
- package/src/form/file-upload/parts/item/Item.types.ts +6 -0
- package/src/form/file-upload/parts/item/ItemButton.tsx +52 -0
- package/src/form/file-upload/parts/item/ItemIcon.tsx +74 -0
- package/src/form/file-upload/parts/item/ItemName.tsx +58 -0
- package/src/form/file-upload/parts/item/utils/download-file.ts +9 -0
- package/src/form/file-upload/parts/item/utils/file-type-checker.ts +4 -0
- package/src/form/file-upload/parts/item/utils/format-file-size.test.ts +76 -0
- package/src/form/file-upload/parts/item/utils/format-file-size.ts +25 -0
- package/src/form/file-upload/useFileUpload.ts +54 -0
- package/src/form/file-upload/utils/is-accepted-file-type.test.ts +69 -0
- package/src/form/file-upload/utils/is-accepted-file-type.ts +25 -0
- package/src/form/file-upload/utils/is-accepted-size.test.ts +26 -0
- package/src/form/file-upload/utils/is-accepted-size.ts +7 -0
- package/src/form/file-upload/utils/validate-files.test.ts +132 -0
- package/src/form/file-upload/utils/validate-files.ts +62 -0
- package/src/index.ts +14 -0
- package/src/internal-header/header.stories.tsx +8 -5
- package/src/loader/Loader.tsx +0 -7
- package/src/table/DataCell.tsx +1 -6
- package/src/util/create-context.tsx +1 -0
- package/src/util/hooks/useMergeRefs.ts +1 -1
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const aksel_icons_1 = require("@navikt/aksel-icons");
|
|
43
|
+
const button_1 = require("../../../../button");
|
|
44
|
+
const typography_1 = require("../../../../typography");
|
|
45
|
+
const composeEventHandlers_1 = require("../../../../util/composeEventHandlers");
|
|
46
|
+
const hooks_1 = require("../../../../util/hooks");
|
|
47
|
+
const omit_1 = require("../../../../util/omit");
|
|
48
|
+
const useFormField_1 = require("../../../useFormField");
|
|
49
|
+
const FileUpload_context_1 = require("../../FileUpload.context");
|
|
50
|
+
const i18n_context_1 = require("../../i18n/i18n.context");
|
|
51
|
+
const useFileUpload_1 = require("../../useFileUpload");
|
|
52
|
+
const useDropzone_1 = require("./useDropzone");
|
|
53
|
+
const Dropzone = (0, react_1.forwardRef)((props, ref) => {
|
|
54
|
+
const { onSelect, error, label, description, className, multiple = true, accept, validator, maxSizeInBytes, fileLimit, icon: DropzoneIcon = aksel_icons_1.CloudUpIcon, disabled, translations, onClick } = props, rest = __rest(props, ["onSelect", "error", "label", "description", "className", "multiple", "accept", "validator", "maxSizeInBytes", "fileLimit", "icon", "disabled", "translations", "onClick"]);
|
|
55
|
+
const context = (0, FileUpload_context_1.useFileUploadTranslation)(false);
|
|
56
|
+
const translate = (0, i18n_context_1.useI18n)("FileUpload", { dropzone: translations }, context === null || context === void 0 ? void 0 : context.translations);
|
|
57
|
+
const fileLimitReached = fileLimit && (fileLimit === null || fileLimit === void 0 ? void 0 : fileLimit.current) >= (fileLimit === null || fileLimit === void 0 ? void 0 : fileLimit.max) && (fileLimit === null || fileLimit === void 0 ? void 0 : fileLimit.max) > 0;
|
|
58
|
+
const _disabled = disabled !== null && disabled !== void 0 ? disabled : fileLimitReached;
|
|
59
|
+
const { inputProps, errorId, showErrorMsg, hasError, inputDescriptionId } = (0, useFormField_1.useFormField)(Object.assign(Object.assign({}, props), { disabled: _disabled }), "fileUpload");
|
|
60
|
+
const { id: inputId, "aria-describedby": ariaDescribedby } = inputProps, inputPropsRest = __rest(inputProps, ["id", "aria-describedby"]);
|
|
61
|
+
const labelId = (0, hooks_1.useId)();
|
|
62
|
+
const { upload, onChange, inputRef, mergedRef } = (0, useFileUpload_1.useFileUpload)({
|
|
63
|
+
ref,
|
|
64
|
+
onSelect,
|
|
65
|
+
validator,
|
|
66
|
+
accept,
|
|
67
|
+
maxSizeInBytes,
|
|
68
|
+
disabled: inputProps.disabled,
|
|
69
|
+
});
|
|
70
|
+
const dropzoneCtx = (0, useDropzone_1.useDropzone)({
|
|
71
|
+
upload,
|
|
72
|
+
disabled: inputProps.disabled,
|
|
73
|
+
});
|
|
74
|
+
return (react_1.default.createElement("div", { className: (0, clsx_1.default)("navds-form-field", "navds-dropzone", className, {
|
|
75
|
+
"navds-dropzone--error": hasError,
|
|
76
|
+
"navds-dropzone--dragging": dropzoneCtx.isDraggingOver,
|
|
77
|
+
"navds-dropzone--disabled": inputProps.disabled,
|
|
78
|
+
}) },
|
|
79
|
+
react_1.default.createElement(typography_1.Label, { htmlFor: inputId, id: labelId, className: "navds-form-field__label" }, label),
|
|
80
|
+
!!description && (react_1.default.createElement(typography_1.BodyShort, { id: inputDescriptionId, className: "navds-form-field__description", as: "div" }, description)),
|
|
81
|
+
react_1.default.createElement("div", { className: "navds-dropzone__area", onDragEnter: dropzoneCtx.onDragEnter, onDragOver: dropzoneCtx.onDragOver, onDragLeave: dropzoneCtx.onDragLeave, onDrop: dropzoneCtx.onDrop, onClick: (0, composeEventHandlers_1.composeEventHandlers)(onClick, () => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }) },
|
|
82
|
+
!inputProps.disabled && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
83
|
+
react_1.default.createElement("div", { className: "navds-dropzone__area-icon" },
|
|
84
|
+
react_1.default.createElement(DropzoneIcon, { fontSize: "1.5rem", "aria-hidden": true })),
|
|
85
|
+
react_1.default.createElement("div", { className: "navds-dropzone__area-release" },
|
|
86
|
+
react_1.default.createElement("div", { className: "navds-dropzone__area-release__icon" },
|
|
87
|
+
react_1.default.createElement(DropzoneIcon, { "aria-hidden": true })),
|
|
88
|
+
react_1.default.createElement("span", { "aria-hidden": !dropzoneCtx.isDraggingOver, className: "navds-dropzone__area-release__text" }, translate("dropzone.drop"))),
|
|
89
|
+
react_1.default.createElement("div", { "aria-hidden": true },
|
|
90
|
+
react_1.default.createElement(typography_1.BodyShort, { as: "div", spacing: true }, multiple
|
|
91
|
+
? translate("dropzone.dragAndDropMultiple")
|
|
92
|
+
: translate("dropzone.dragAndDrop")),
|
|
93
|
+
react_1.default.createElement(typography_1.BodyShort, { as: "div" }, translate("dropzone.or"))),
|
|
94
|
+
react_1.default.createElement(button_1.Button, Object.assign({}, (0, omit_1.omit)(rest, ["errorId"]), inputPropsRest, { "aria-describedby": (0, clsx_1.default)(labelId, ariaDescribedby), className: "navds-dropzone__area-button", type: "button", variant: "secondary" }), multiple
|
|
95
|
+
? translate("dropzone.buttonMultiple")
|
|
96
|
+
: translate("dropzone.button")))),
|
|
97
|
+
inputProps.disabled && (react_1.default.createElement("div", { className: "navds-dropzone__area-disabled" },
|
|
98
|
+
react_1.default.createElement(aksel_icons_1.CircleSlashIcon, { "aria-hidden": true, fontSize: "1.75rem" }),
|
|
99
|
+
react_1.default.createElement(typography_1.BodyShort, { as: "div" }, fileLimitReached
|
|
100
|
+
? translate("dropzone.disabledFilelimit")
|
|
101
|
+
: translate("dropzone.disabled")))),
|
|
102
|
+
react_1.default.createElement("input", { id: inputId, type: "file", style: { display: "none" }, multiple: multiple, accept: accept, onChange: onChange, ref: mergedRef, disabled: inputProps.disabled })),
|
|
103
|
+
react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(typography_1.ErrorMessage, null, error))));
|
|
104
|
+
});
|
|
105
|
+
exports.default = Dropzone;
|
|
106
|
+
//# sourceMappingURL=Dropzone.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dropzone.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/dropzone/Dropzone.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { FormFieldProps } from "../../../useFormField";
|
|
3
|
+
import { FileUploadBaseProps } from "../../FileUpload.types";
|
|
4
|
+
import { ComponentTranslation } from "../../i18n/i18n.types";
|
|
5
|
+
export interface FileUploadDropzoneProps extends FileUploadBaseProps, Omit<FormFieldProps, "size" | "readOnly">, Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect" | "onClick">, Pick<React.HTMLAttributes<HTMLDivElement>, "onClick"> {
|
|
6
|
+
/**
|
|
7
|
+
* Text shown to the user.
|
|
8
|
+
*/
|
|
9
|
+
label: string;
|
|
10
|
+
/**
|
|
11
|
+
* @default CloudUpIcon
|
|
12
|
+
*/
|
|
13
|
+
icon?: React.ComponentType<any>;
|
|
14
|
+
/**
|
|
15
|
+
* i18n-API for customizing texts and labels
|
|
16
|
+
*/
|
|
17
|
+
translations?: ComponentTranslation<"FileUpload">["dropzone"];
|
|
18
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropzone.types.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/dropzone/dropzone.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { UseFileUploadProps } from "../../useFileUpload";
|
|
2
|
+
interface Props {
|
|
3
|
+
upload: (fileList: FileList) => void;
|
|
4
|
+
disabled: UseFileUploadProps["disabled"];
|
|
5
|
+
}
|
|
6
|
+
export declare const useDropzone: ({ upload, disabled }: Props) => {
|
|
7
|
+
isDraggingOver: boolean;
|
|
8
|
+
onDragEnter: (() => void) | undefined;
|
|
9
|
+
onDragOver: ((event: React.DragEvent<HTMLDivElement>) => void) | undefined;
|
|
10
|
+
onDragLeave: (() => void) | undefined;
|
|
11
|
+
onDrop: ((event: React.DragEvent<HTMLDivElement>) => void) | undefined;
|
|
12
|
+
};
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useDropzone = void 0;
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const useDropzone = ({ upload, disabled }) => {
|
|
6
|
+
const [isDraggingOver, setIsDraggingOver] = (0, react_1.useState)(false);
|
|
7
|
+
const onDragEnter = () => {
|
|
8
|
+
setIsDraggingOver(true);
|
|
9
|
+
};
|
|
10
|
+
const onDragOver = (event) => {
|
|
11
|
+
event.preventDefault(); // Prevents the browser from opening the file in a new tab
|
|
12
|
+
};
|
|
13
|
+
const onDragLeave = () => {
|
|
14
|
+
setIsDraggingOver(false);
|
|
15
|
+
};
|
|
16
|
+
const onDrop = (event) => {
|
|
17
|
+
event.preventDefault(); // Prevents the browser from opening the file in a new tab
|
|
18
|
+
setIsDraggingOver(false);
|
|
19
|
+
const fileList = event.dataTransfer.files;
|
|
20
|
+
if (!fileList) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
upload(fileList);
|
|
24
|
+
};
|
|
25
|
+
return {
|
|
26
|
+
isDraggingOver,
|
|
27
|
+
onDragEnter: disabled ? undefined : onDragEnter,
|
|
28
|
+
onDragOver: disabled ? undefined : onDragOver,
|
|
29
|
+
onDragLeave: disabled ? undefined : onDragLeave,
|
|
30
|
+
onDrop: disabled ? undefined : onDrop,
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
exports.useDropzone = useDropzone;
|
|
34
|
+
//# sourceMappingURL=useDropzone.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDropzone.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/dropzone/useDropzone.ts"],"names":[],"mappings":";;;AAAA,iCAAiC;AAQ1B,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAS,EAAE,EAAE;IACzD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5D,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,KAAsC,EAAE,EAAE;QAC5D,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,0DAA0D;IACpF,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,KAAsC,EAAE,EAAE;QACxD,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,0DAA0D;QAClF,iBAAiB,CAAC,KAAK,CAAC,CAAC;QAEzB,MAAM,QAAQ,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC;QAC1C,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QAED,MAAM,CAAC,QAAQ,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,OAAO;QACL,cAAc;QACd,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW;QAC/C,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU;QAC7C,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW;QAC/C,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM;KACtC,CAAC;AACJ,CAAC,CAAC;AAlCW,QAAA,WAAW,eAkCtB"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import React, { MouseEvent } from "react";
|
|
2
|
+
import { OverridableComponent } from "../../../../util";
|
|
3
|
+
import { ComponentTranslation } from "../../i18n/i18n.types";
|
|
4
|
+
import { FileItem } from "./Item.types";
|
|
5
|
+
export interface FileItemBaseProps {
|
|
6
|
+
/**
|
|
7
|
+
* Overrides html-tag
|
|
8
|
+
* @default "div"
|
|
9
|
+
*/
|
|
10
|
+
as?: "div" | "li";
|
|
11
|
+
/**
|
|
12
|
+
* Either a native File or file metadata.
|
|
13
|
+
*/
|
|
14
|
+
file: FileItem;
|
|
15
|
+
/**
|
|
16
|
+
* onClick on the file name.
|
|
17
|
+
* @note If this and `href` is not set and the `file` prop is a native file, onClick will download the file.
|
|
18
|
+
*/
|
|
19
|
+
onFileClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
|
|
20
|
+
/**
|
|
21
|
+
* href on the file name.
|
|
22
|
+
* @note If this and `onFileClick` is not set and the `file` prop is a native file, onClick will download the file.
|
|
23
|
+
*/
|
|
24
|
+
href?: string;
|
|
25
|
+
/**
|
|
26
|
+
* Error message relating to the item.
|
|
27
|
+
*/
|
|
28
|
+
error?: string;
|
|
29
|
+
/**
|
|
30
|
+
* Status "downloading" and "uploading" displays a loading indicator.
|
|
31
|
+
* @default "idle"
|
|
32
|
+
*/
|
|
33
|
+
status?: "downloading" | "uploading" | "idle";
|
|
34
|
+
/**
|
|
35
|
+
* i18n-API for customizing texts and labels
|
|
36
|
+
*/
|
|
37
|
+
translations?: ComponentTranslation<"FileUpload">["item"];
|
|
38
|
+
onRetry?: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
39
|
+
onDelete?: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
40
|
+
}
|
|
41
|
+
type FileItemActionDelete = {
|
|
42
|
+
onDelete: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
43
|
+
itemAction: "delete";
|
|
44
|
+
};
|
|
45
|
+
type FileItemActionRetry = {
|
|
46
|
+
onRetry: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
47
|
+
itemAction: "retry";
|
|
48
|
+
};
|
|
49
|
+
type FileItemActionNone = {
|
|
50
|
+
itemAction?: "none";
|
|
51
|
+
};
|
|
52
|
+
type FileItemConditionalProps = FileItemActionDelete | FileItemActionRetry | FileItemActionNone;
|
|
53
|
+
export type FileUploadItemProps = FileItemBaseProps & FileItemConditionalProps & React.HTMLAttributes<HTMLDivElement>;
|
|
54
|
+
export declare const Item: OverridableComponent<FileUploadItemProps, HTMLDivElement>;
|
|
55
|
+
export default Item;
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.Item = void 0;
|
|
41
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
42
|
+
const react_1 = __importStar(require("react"));
|
|
43
|
+
const aksel_icons_1 = require("@navikt/aksel-icons");
|
|
44
|
+
const typography_1 = require("../../../../typography");
|
|
45
|
+
const FileUpload_context_1 = require("../../FileUpload.context");
|
|
46
|
+
const i18n_context_1 = require("../../i18n/i18n.context");
|
|
47
|
+
const ItemButton_1 = __importDefault(require("./ItemButton"));
|
|
48
|
+
const ItemIcon_1 = __importDefault(require("./ItemIcon"));
|
|
49
|
+
const ItemName_1 = __importDefault(require("./ItemName"));
|
|
50
|
+
const format_file_size_1 = require("./utils/format-file-size");
|
|
51
|
+
exports.Item = (0, react_1.forwardRef)((_a, ref) => {
|
|
52
|
+
var { as: Component = "div", file, status = "idle", onDelete, onRetry, error, className, href, onFileClick, itemAction = "delete", translations } = _a, rest = __rest(_a, ["as", "file", "status", "onDelete", "onRetry", "error", "className", "href", "onFileClick", "itemAction", "translations"]);
|
|
53
|
+
const context = (0, FileUpload_context_1.useFileUploadTranslation)(false);
|
|
54
|
+
const translate = (0, i18n_context_1.useI18n)("FileUpload", { item: translations }, context === null || context === void 0 ? void 0 : context.translations);
|
|
55
|
+
const showError = !!error && status === "idle";
|
|
56
|
+
function getStatusText() {
|
|
57
|
+
if (status === "uploading") {
|
|
58
|
+
return translate("item.uploading");
|
|
59
|
+
}
|
|
60
|
+
if (status === "downloading") {
|
|
61
|
+
return translate("item.downloading");
|
|
62
|
+
}
|
|
63
|
+
return (0, format_file_size_1.formatFileSize)(file);
|
|
64
|
+
}
|
|
65
|
+
return (react_1.default.createElement(Component, Object.assign({ ref: ref }, rest, { className: (0, clsx_1.default)("navds-file-item", className, {
|
|
66
|
+
"navds-file-item--error": showError,
|
|
67
|
+
}) }),
|
|
68
|
+
react_1.default.createElement("div", { className: "navds-file-item__inner" },
|
|
69
|
+
react_1.default.createElement(ItemIcon_1.default, { isLoading: status !== "idle", file: file, showError: showError }),
|
|
70
|
+
react_1.default.createElement("div", { className: "navds-file-item__file-info" },
|
|
71
|
+
react_1.default.createElement(ItemName_1.default, { file: file, href: href, onClick: onFileClick }),
|
|
72
|
+
react_1.default.createElement(typography_1.BodyShort, { as: "div", size: "small" }, getStatusText()),
|
|
73
|
+
react_1.default.createElement("div", { className: "navds-file-item__error", "aria-relevant": "additions removals", "aria-live": "polite" }, showError && (react_1.default.createElement(typography_1.BodyShort, { size: "small", className: "navds-file-item__error-content" },
|
|
74
|
+
react_1.default.createElement(aksel_icons_1.ExclamationmarkTriangleIcon, { "aria-hidden": true }),
|
|
75
|
+
error)))),
|
|
76
|
+
status === "idle" && (react_1.default.createElement(ItemButton_1.default, { file: file, onRetry: onRetry, onDelete: onDelete, action: itemAction, retryTitle: translate("item.retryButtonTitle"), deleteTitle: translate("item.deleteButtonTitle") })))));
|
|
77
|
+
});
|
|
78
|
+
exports.default = exports.Item;
|
|
79
|
+
//# sourceMappingURL=Item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/item/Item.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAsB;AACtB,+CAAsD;AACtD,qDAAkE;AAClE,uDAAmD;AAEnD,iEAAoE;AACpE,0DAAkD;AAGlD,8DAAsC;AACtC,0DAAkC;AAClC,0DAAkC;AAClC,+DAA0D;AA8D7C,QAAA,IAAI,GACf,IAAA,kBAAU,EACR,CACE,EAaC,EACD,GAAG,EACH,EAAE;QAfF,EACE,EAAE,EAAE,SAAS,GAAG,KAAK,EACrB,IAAI,EACJ,MAAM,GAAG,MAAM,EACf,QAAQ,EACR,OAAO,EACP,KAAK,EACL,SAAS,EACT,IAAI,EACJ,WAAW,EACX,UAAU,GAAG,QAAQ,EACrB,YAAY,OAEb,EADI,IAAI,cAZT,0HAaC,CADQ;IAIT,MAAM,OAAO,GAAG,IAAA,6CAAwB,EAAC,KAAK,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,IAAA,sBAAO,EACvB,YAAY,EACZ,EAAE,IAAI,EAAE,YAAY,EAAE,EACtB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,CACtB,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,IAAI,MAAM,KAAK,MAAM,CAAC;IAE/C,SAAS,aAAa;QACpB,IAAI,MAAM,KAAK,WAAW,EAAE,CAAC;YAC3B,OAAO,SAAS,CAAC,gBAAgB,CAAC,CAAC;QACrC,CAAC;QACD,IAAI,MAAM,KAAK,aAAa,EAAE,CAAC;YAC7B,OAAO,SAAS,CAAC,kBAAkB,CAAC,CAAC;QACvC,CAAC;QACD,OAAO,IAAA,iCAAc,EAAC,IAAI,CAAC,CAAC;IAC9B,CAAC;IAED,OAAO,CACL,8BAAC,SAAS,kBACR,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,SAAS,EAAE,IAAA,cAAE,EAAC,iBAAiB,EAAE,SAAS,EAAE;YAC1C,wBAAwB,EAAE,SAAS;SACpC,CAAC;QAEF,uCAAK,SAAS,EAAC,wBAAwB;YACrC,8BAAC,kBAAQ,IACP,SAAS,EAAE,MAAM,KAAK,MAAM,EAC5B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,GACpB;YACF,uCAAK,SAAS,EAAC,4BAA4B;gBACzC,8BAAC,kBAAQ,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,GAAI;gBAC1D,8BAAC,sBAAS,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAC,OAAO,IAC7B,aAAa,EAAE,CACN;gBACZ,uCACE,SAAS,EAAC,wBAAwB,mBACpB,oBAAoB,eACxB,QAAQ,IAEjB,SAAS,IAAI,CACZ,8BAAC,sBAAS,IACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,gCAAgC;oBAE1C,8BAAC,yCAA2B,0BAAe;oBAC1C,KAAK,CACI,CACb,CACG,CACF;YAEL,MAAM,KAAK,MAAM,IAAI,CACpB,8BAAC,oBAAU,IACT,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,UAAU,EAClB,UAAU,EAAE,SAAS,CAAC,uBAAuB,CAAC,EAC9C,WAAW,EAAE,SAAS,CAAC,wBAAwB,CAAC,GAChD,CACH,CACG,CACI,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ,kBAAe,YAAI,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Item.types.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/item/Item.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FileItem } from "./Item.types";
|
|
3
|
+
interface Props {
|
|
4
|
+
file: FileItem;
|
|
5
|
+
onRetry?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
6
|
+
onDelete?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
7
|
+
action: "delete" | "retry" | "none";
|
|
8
|
+
retryTitle: string;
|
|
9
|
+
deleteTitle: string;
|
|
10
|
+
}
|
|
11
|
+
declare const ItemButton: ({ onRetry, onDelete, action, retryTitle, deleteTitle, }: Props) => React.JSX.Element | null;
|
|
12
|
+
export default ItemButton;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const aksel_icons_1 = require("@navikt/aksel-icons");
|
|
8
|
+
const button_1 = require("../../../../button");
|
|
9
|
+
const ItemButton = ({ onRetry, onDelete, action, retryTitle, deleteTitle, }) => {
|
|
10
|
+
if (action === "none") {
|
|
11
|
+
return null;
|
|
12
|
+
}
|
|
13
|
+
if (onRetry && action === "retry") {
|
|
14
|
+
return (react_1.default.createElement(button_1.Button, { className: "navds-file-item__button", type: "button", variant: "tertiary-neutral", onClick: onRetry, icon: react_1.default.createElement(aksel_icons_1.ArrowsCirclepathIcon, { title: retryTitle }) }));
|
|
15
|
+
}
|
|
16
|
+
if (onDelete && action === "delete") {
|
|
17
|
+
return (react_1.default.createElement(button_1.Button, { className: "navds-file-item__button", type: "button", variant: "tertiary-neutral", onClick: onDelete, icon: react_1.default.createElement(aksel_icons_1.TrashIcon, { title: deleteTitle }) }));
|
|
18
|
+
}
|
|
19
|
+
return null;
|
|
20
|
+
};
|
|
21
|
+
exports.default = ItemButton;
|
|
22
|
+
//# sourceMappingURL=ItemButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ItemButton.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/item/ItemButton.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,qDAAsE;AACtE,+CAA4C;AAY5C,MAAM,UAAU,GAAG,CAAC,EAClB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,UAAU,EACV,WAAW,GACL,EAAE,EAAE;IACV,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,OAAO,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;QAClC,OAAO,CACL,8BAAC,eAAM,IACL,SAAS,EAAC,yBAAyB,EACnC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,8BAAC,kCAAoB,IAAC,KAAK,EAAE,UAAU,GAAI,GACjD,CACH,CAAC;IACJ,CAAC;IACD,IAAI,QAAQ,IAAI,MAAM,KAAK,QAAQ,EAAE,CAAC;QACpC,OAAO,CACL,8BAAC,eAAM,IACL,SAAS,EAAC,yBAAyB,EACnC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,8BAAC,uBAAS,IAAC,KAAK,EAAE,WAAW,GAAI,GACvC,CACH,CAAC;IACJ,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FileItem } from "./Item.types";
|
|
3
|
+
interface ItemIconProps {
|
|
4
|
+
isLoading?: boolean;
|
|
5
|
+
file: FileItem;
|
|
6
|
+
showError: boolean;
|
|
7
|
+
}
|
|
8
|
+
declare function ItemIcon({ isLoading, file, showError }: ItemIconProps): React.JSX.Element;
|
|
9
|
+
export default ItemIcon;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const aksel_icons_1 = require("@navikt/aksel-icons");
|
|
8
|
+
const loader_1 = require("../../../../loader");
|
|
9
|
+
const iconProps = {
|
|
10
|
+
fontSize: "2rem",
|
|
11
|
+
"aria-hidden": true,
|
|
12
|
+
};
|
|
13
|
+
function ItemIcon({ isLoading, file, showError }) {
|
|
14
|
+
if (isLoading) {
|
|
15
|
+
return (react_1.default.createElement("div", { className: "navds-file-item__icon navds-file-item__icon--loading" },
|
|
16
|
+
react_1.default.createElement(loader_1.Loader, { size: "large" })));
|
|
17
|
+
}
|
|
18
|
+
else if (showError) {
|
|
19
|
+
return (react_1.default.createElement("div", { className: "navds-file-item__icon" },
|
|
20
|
+
react_1.default.createElement(aksel_icons_1.FileXMarkIcon, Object.assign({}, iconProps))));
|
|
21
|
+
}
|
|
22
|
+
return (react_1.default.createElement("div", { className: "navds-file-item__icon" },
|
|
23
|
+
react_1.default.createElement(Icon, { file: file })));
|
|
24
|
+
}
|
|
25
|
+
function Icon({ file }) {
|
|
26
|
+
const extension = file.name.substring(file.name.lastIndexOf(".") + 1);
|
|
27
|
+
switch (extension) {
|
|
28
|
+
case "jpg":
|
|
29
|
+
case "jpeg":
|
|
30
|
+
case "png":
|
|
31
|
+
case "gif":
|
|
32
|
+
case "webp":
|
|
33
|
+
return react_1.default.createElement(aksel_icons_1.FileImageIcon, Object.assign({}, iconProps));
|
|
34
|
+
case "pdf":
|
|
35
|
+
return react_1.default.createElement(aksel_icons_1.FilePdfIcon, Object.assign({}, iconProps));
|
|
36
|
+
case "txt":
|
|
37
|
+
return react_1.default.createElement(aksel_icons_1.FileTextIcon, Object.assign({}, iconProps));
|
|
38
|
+
case "csv":
|
|
39
|
+
return react_1.default.createElement(aksel_icons_1.FileCsvIcon, Object.assign({}, iconProps));
|
|
40
|
+
case "xls":
|
|
41
|
+
case "xlsx":
|
|
42
|
+
return react_1.default.createElement(aksel_icons_1.FileExcelIcon, Object.assign({}, iconProps));
|
|
43
|
+
case "doc":
|
|
44
|
+
case "docx":
|
|
45
|
+
return react_1.default.createElement(aksel_icons_1.FileWordIcon, Object.assign({}, iconProps));
|
|
46
|
+
default:
|
|
47
|
+
return react_1.default.createElement(aksel_icons_1.FileIcon, Object.assign({}, iconProps));
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
exports.default = ItemIcon;
|
|
51
|
+
//# sourceMappingURL=ItemIcon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ItemIcon.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/item/ItemIcon.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,qDAS6B;AAC7B,+CAA4C;AAS5C,MAAM,SAAS,GAAG;IAChB,QAAQ,EAAE,MAAM;IAChB,aAAa,EAAE,IAAI;CACpB,CAAC;AAEF,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAiB;IAC7D,IAAI,SAAS,EAAE,CAAC;QACd,OAAO,CACL,uCAAK,SAAS,EAAC,sDAAsD;YACnE,8BAAC,eAAM,IAAC,IAAI,EAAC,OAAO,GAAG,CACnB,CACP,CAAC;IACJ,CAAC;SAAM,IAAI,SAAS,EAAE,CAAC;QACrB,OAAO,CACL,uCAAK,SAAS,EAAC,uBAAuB;YACpC,8BAAC,2BAAa,oBAAK,SAAS,EAAI,CAC5B,CACP,CAAC;IACJ,CAAC;IACD,OAAO,CACL,uCAAK,SAAS,EAAC,uBAAuB;QACpC,8BAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI,CAChB,CACP,CAAC;AACJ,CAAC;AAED,SAAS,IAAI,CAAC,EAAE,IAAI,EAAsB;IACxC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAEtE,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,KAAK,CAAC;QACX,KAAK,MAAM,CAAC;QACZ,KAAK,KAAK,CAAC;QACX,KAAK,KAAK,CAAC;QACX,KAAK,MAAM;YACT,OAAO,8BAAC,2BAAa,oBAAK,SAAS,EAAI,CAAC;QAC1C,KAAK,KAAK;YACR,OAAO,8BAAC,yBAAW,oBAAK,SAAS,EAAI,CAAC;QACxC,KAAK,KAAK;YACR,OAAO,8BAAC,0BAAY,oBAAK,SAAS,EAAI,CAAC;QACzC,KAAK,KAAK;YACR,OAAO,8BAAC,yBAAW,oBAAK,SAAS,EAAI,CAAC;QACxC,KAAK,KAAK,CAAC;QACX,KAAK,MAAM;YACT,OAAO,8BAAC,2BAAa,oBAAK,SAAS,EAAI,CAAC;QAC1C,KAAK,KAAK,CAAC;QACX,KAAK,MAAM;YACT,OAAO,8BAAC,0BAAY,oBAAK,SAAS,EAAI,CAAC;QACzC;YACE,OAAO,8BAAC,sBAAQ,oBAAK,SAAS,EAAI,CAAC;IACvC,CAAC;AACH,CAAC;AAED,kBAAe,QAAQ,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FileItem } from "./Item.types";
|
|
3
|
+
interface Props {
|
|
4
|
+
file: FileItem;
|
|
5
|
+
href?: string;
|
|
6
|
+
onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
|
|
7
|
+
}
|
|
8
|
+
declare const ItemName: ({ file, href, onClick }: Props) => React.JSX.Element;
|
|
9
|
+
export default ItemName;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const link_1 = require("../../../../link");
|
|
8
|
+
const download_file_1 = require("./utils/download-file");
|
|
9
|
+
const file_type_checker_1 = require("./utils/file-type-checker");
|
|
10
|
+
const ItemName = ({ file, href, onClick }) => {
|
|
11
|
+
if (onClick && href) {
|
|
12
|
+
return (react_1.default.createElement(link_1.Link, { href: href, onClick: onClick }, file.name));
|
|
13
|
+
}
|
|
14
|
+
if (onClick) {
|
|
15
|
+
return (react_1.default.createElement(link_1.Link, { href: "#", onClick: (event) => {
|
|
16
|
+
event.preventDefault();
|
|
17
|
+
onClick(event);
|
|
18
|
+
} }, file.name));
|
|
19
|
+
}
|
|
20
|
+
if (href) {
|
|
21
|
+
return react_1.default.createElement(link_1.Link, { href: href }, file.name);
|
|
22
|
+
}
|
|
23
|
+
if ((0, file_type_checker_1.isNativeFile)(file)) {
|
|
24
|
+
return (react_1.default.createElement(link_1.Link, { href: "#", download: file.name, onClick: (event) => {
|
|
25
|
+
event.preventDefault();
|
|
26
|
+
(0, download_file_1.downloadFile)(file);
|
|
27
|
+
} }, file.name));
|
|
28
|
+
}
|
|
29
|
+
return react_1.default.createElement("span", null, file.name);
|
|
30
|
+
};
|
|
31
|
+
exports.default = ItemName;
|
|
32
|
+
//# sourceMappingURL=ItemName.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ItemName.js","sourceRoot":"","sources":["../../../../../src/form/file-upload/parts/item/ItemName.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,2CAAwC;AAExC,yDAAqD;AACrD,iEAAyD;AAQzD,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAS,EAAE,EAAE;IAClD,IAAI,OAAO,IAAI,IAAI,EAAE,CAAC;QACpB,OAAO,CACL,8BAAC,WAAI,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,IAC/B,IAAI,CAAC,IAAI,CACL,CACR,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,8BAAC,WAAI,IACH,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO,CAAC,KAAK,CAAC,CAAC;YACjB,CAAC,IAEA,IAAI,CAAC,IAAI,CACL,CACR,CAAC;IACJ,CAAC;IAED,IAAI,IAAI,EAAE,CAAC;QACT,OAAO,8BAAC,WAAI,IAAC,IAAI,EAAE,IAAI,IAAG,IAAI,CAAC,IAAI,CAAQ,CAAC;IAC9C,CAAC;IAED,IAAI,IAAA,gCAAY,EAAC,IAAI,CAAC,EAAE,CAAC;QACvB,OAAO,CACL,8BAAC,WAAI,IACH,IAAI,EAAC,GAAG,EACR,QAAQ,EAAE,IAAI,CAAC,IAAI,EACnB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAA,4BAAY,EAAC,IAAI,CAAC,CAAC;YACrB,CAAC,IAEA,IAAI,CAAC,IAAI,CACL,CACR,CAAC;IACJ,CAAC;IAED,OAAO,4CAAO,IAAI,CAAC,IAAI,CAAQ,CAAC;AAClC,CAAC,CAAC;AAEF,kBAAe,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const downloadFile: (file: File) => void;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.downloadFile = void 0;
|
|
4
|
+
const downloadFile = (file) => {
|
|
5
|
+
const a = document.createElement("a");
|
|
6
|
+
const url = URL.createObjectURL(file);
|
|
7
|
+
a.href = url;
|
|
8
|
+
a.download = file.name;
|
|
9
|
+
a.click();
|
|
10
|
+
URL.revokeObjectURL(url);
|
|
11
|
+
};
|
|
12
|
+
exports.downloadFile = downloadFile;
|
|
13
|
+
//# sourceMappingURL=download-file.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"download-file.js","sourceRoot":"","sources":["../../../../../../src/form/file-upload/parts/item/utils/download-file.ts"],"names":[],"mappings":";;;AAAO,MAAM,YAAY,GAAG,CAAC,IAAU,EAAQ,EAAE;IAC/C,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACtC,MAAM,GAAG,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACtC,CAAC,CAAC,IAAI,GAAG,GAAG,CAAC;IACb,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC;IACvB,CAAC,CAAC,KAAK,EAAE,CAAC;IAEV,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;AAC3B,CAAC,CAAC;AARW,QAAA,YAAY,gBAQvB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"file-type-checker.js","sourceRoot":"","sources":["../../../../../../src/form/file-upload/parts/item/utils/file-type-checker.ts"],"names":[],"mappings":";;;AAEO,MAAM,YAAY,GAAG,CAAC,QAAkB,EAAoB,EAAE,CACnE,cAAc,IAAI,QAAQ,CAAC;AADhB,QAAA,YAAY,gBACI"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.formatFileSize = void 0;
|
|
4
|
+
const MAX_MEGA_BYTES = 500;
|
|
5
|
+
function formatFileSize(file) {
|
|
6
|
+
if (!file.size) {
|
|
7
|
+
return null;
|
|
8
|
+
}
|
|
9
|
+
const megaBytes = file.size / (1024 * 1024);
|
|
10
|
+
if (megaBytes <= MAX_MEGA_BYTES) {
|
|
11
|
+
return formatter.format(megaBytes);
|
|
12
|
+
}
|
|
13
|
+
return `> ${MAX_MEGA_BYTES} MB`;
|
|
14
|
+
}
|
|
15
|
+
exports.formatFileSize = formatFileSize;
|
|
16
|
+
const formatter = new Intl.NumberFormat("nb-NO", {
|
|
17
|
+
style: "unit",
|
|
18
|
+
unit: "megabyte",
|
|
19
|
+
minimumFractionDigits: 2,
|
|
20
|
+
maximumFractionDigits: 2,
|
|
21
|
+
// @ts-expect-error - Looks like roundingMode hasn't been added to TypeScript yet
|
|
22
|
+
roundingMode: "ceil",
|
|
23
|
+
});
|
|
24
|
+
//# sourceMappingURL=format-file-size.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"format-file-size.js","sourceRoot":"","sources":["../../../../../../src/form/file-upload/parts/item/utils/format-file-size.ts"],"names":[],"mappings":";;;AAEA,MAAM,cAAc,GAAG,GAAG,CAAC;AAE3B,SAAgB,cAAc,CAAC,IAAc;IAC3C,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QACf,OAAO,IAAI,CAAC;IACd,CAAC;IACD,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAE5C,IAAI,SAAS,IAAI,cAAc,EAAE,CAAC;QAChC,OAAO,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC;IAED,OAAO,KAAK,cAAc,KAAK,CAAC;AAClC,CAAC;AAXD,wCAWC;AAED,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;IAC/C,KAAK,EAAE,MAAM;IACb,IAAI,EAAE,UAAU;IAChB,qBAAqB,EAAE,CAAC;IACxB,qBAAqB,EAAE,CAAC;IACxB,iFAAiF;IACjF,YAAY,EAAE,MAAM;CACrB,CAAC,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { FileUploadBaseProps } from "./FileUpload.types";
|
|
3
|
+
export interface UseFileUploadProps extends Omit<FileUploadBaseProps, "fileLimit"> {
|
|
4
|
+
ref: React.ForwardedRef<HTMLInputElement>;
|
|
5
|
+
disabled?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export declare const useFileUpload: ({ ref, accept, onSelect, validator, maxSizeInBytes, disabled, }: UseFileUploadProps) => {
|
|
8
|
+
upload: (fileList: FileList) => void;
|
|
9
|
+
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
10
|
+
inputRef: import("react").MutableRefObject<HTMLInputElement | null>;
|
|
11
|
+
mergedRef: (instance: HTMLInputElement | null) => void;
|
|
12
|
+
};
|