@popsure/dirty-swan 0.38.0 → 0.38.2
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/dist/cjs/index.js +22 -16
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/components/autocompleteAddress/index.js +1 -1
- package/dist/esm/components/autocompleteAddress/index.js.map +1 -1
- package/dist/esm/components/autocompleteAddress/index.test.js +6 -6
- package/dist/esm/components/autocompleteAddress/index.test.js.map +1 -1
- package/dist/esm/components/button/index.js +1 -1
- package/dist/esm/components/button/index.js.map +1 -1
- package/dist/esm/components/icon/IconWrapper/IconWrapper.js +5 -2
- package/dist/esm/components/icon/IconWrapper/IconWrapper.js.map +1 -1
- package/dist/esm/components/icon/icons.stories.js +1 -1
- package/dist/esm/components/icon/index.stories.js +1 -1
- package/dist/esm/components/multiDropzone/index.js +15 -12
- package/dist/esm/components/multiDropzone/index.js.map +1 -1
- package/dist/esm/components/multiDropzone/index.test.js +71 -51
- package/dist/esm/components/multiDropzone/index.test.js.map +1 -1
- package/dist/esm/{index-38cf6d96.js → index-35a77b9b.js} +1 -1
- package/dist/esm/{index-38cf6d96.js.map → index-35a77b9b.js.map} +1 -1
- package/package.json +1 -1
- package/src/lib/components/autocompleteAddress/index.test.tsx +6 -6
- package/src/lib/components/autocompleteAddress/index.tsx +9 -5
- package/src/lib/components/button/index.tsx +2 -3
- package/src/lib/components/icon/IconWrapper/IconWrapper.tsx +5 -1
- package/src/lib/components/icon/IconWrapper/styles.module.scss +1 -1
- package/src/lib/components/multiDropzone/index.test.tsx +101 -81
- package/src/lib/components/multiDropzone/index.tsx +52 -40
- package/src/lib/components/multiDropzone/style.module.scss +2 -2
|
@@ -64,7 +64,7 @@ describe('AutocompleteAddress component', function () {
|
|
|
64
64
|
target: { value: 'Köpeniker' },
|
|
65
65
|
});
|
|
66
66
|
expect(getAllByTestId(inputTestId).length).toEqual(5);
|
|
67
|
-
expect(getByDisplayValue(
|
|
67
|
+
expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();
|
|
68
68
|
return [2 /*return*/];
|
|
69
69
|
});
|
|
70
70
|
}); });
|
|
@@ -75,7 +75,7 @@ describe('AutocompleteAddress component', function () {
|
|
|
75
75
|
case 0:
|
|
76
76
|
callback = jest.fn();
|
|
77
77
|
_a = setup(undefined, callback), findByText = _a.findByText, getAllByTestId = _a.getAllByTestId, user = _a.user;
|
|
78
|
-
return [4 /*yield*/, findByText('
|
|
78
|
+
return [4 /*yield*/, findByText('enter address manually')];
|
|
79
79
|
case 1:
|
|
80
80
|
btn = _b.sent();
|
|
81
81
|
return [4 /*yield*/, user.click(btn)];
|
|
@@ -104,10 +104,10 @@ describe('AutocompleteAddress component', function () {
|
|
|
104
104
|
var getByDisplayValue;
|
|
105
105
|
return __generator(this, function (_a) {
|
|
106
106
|
getByDisplayValue = setup(address).getByDisplayValue;
|
|
107
|
-
expect(getByDisplayValue(
|
|
108
|
-
expect(getByDisplayValue(
|
|
109
|
-
expect(getByDisplayValue(
|
|
110
|
-
expect(getByDisplayValue(
|
|
107
|
+
expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();
|
|
108
|
+
expect(getByDisplayValue('4000')).toBeVisible();
|
|
109
|
+
expect(getByDisplayValue('10179')).toBeVisible();
|
|
110
|
+
expect(getByDisplayValue('Berlin')).toBeVisible();
|
|
111
111
|
return [2 /*return*/];
|
|
112
112
|
});
|
|
113
113
|
}); });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/autocompleteAddress/index.test.tsx"],"sourcesContent":["import { Address } from '@popsure/public-models';\nimport { fireEvent, render } from '../../util/testUtils';\n\nimport { AutocompleteAddress } from '.';\n\nconst address = {\n street: 'Köpeniker Strasse',\n houseNumber: '4000',\n postcode: '10179',\n city: 'Berlin',\n country: 'DE',\n};\n\nconst setup = (\n address: Partial<Address> | undefined = undefined,\n onAddressChange: (address: Partial<Address>) => void = () => {}\n) => {\n return render(\n <AutocompleteAddress\n address={address}\n apiKey={''}\n onAddressChange={onAddressChange}\n />\n );\n};\n\nconst inputTestId = 'ds-input-input';\n\ndescribe('AutocompleteAddress component', () => {\n it('Should show all address fields once a search is completed', async () => {\n // @ts-ignore\n window.google.maps.places.Autocomplete = class {\n reference: HTMLElement;\n constructor(reference: HTMLElement) {\n this.reference = reference;\n }\n // @ts-ignore\n addListener(_action, callback) {\n this.reference.addEventListener('change', (e: Event) =>\n (e.target as HTMLInputElement).value !== ''\n ? callback({\n geometry: {\n location: class {},\n },\n address_components: [\n {\n long_name: 'Köpeniker Strasse',\n short_name: 'Köpeniker Strasse',\n types: ['route'],\n },\n ],\n })\n : null\n );\n }\n };\n\n const { getAllByTestId, getByDisplayValue, getByTestId } = setup();\n\n fireEvent.change(getByTestId(inputTestId), {\n target: { value: 'Köpeniker' },\n });\n\n expect(getAllByTestId(inputTestId).length).toEqual(5);\n expect(getByDisplayValue(
|
|
1
|
+
{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/autocompleteAddress/index.test.tsx"],"sourcesContent":["import { Address } from '@popsure/public-models';\nimport { fireEvent, render } from '../../util/testUtils';\n\nimport { AutocompleteAddress } from '.';\n\nconst address = {\n street: 'Köpeniker Strasse',\n houseNumber: '4000',\n postcode: '10179',\n city: 'Berlin',\n country: 'DE',\n};\n\nconst setup = (\n address: Partial<Address> | undefined = undefined,\n onAddressChange: (address: Partial<Address>) => void = () => {}\n) => {\n return render(\n <AutocompleteAddress\n address={address}\n apiKey={''}\n onAddressChange={onAddressChange}\n />\n );\n};\n\nconst inputTestId = 'ds-input-input';\n\ndescribe('AutocompleteAddress component', () => {\n it('Should show all address fields once a search is completed', async () => {\n // @ts-ignore\n window.google.maps.places.Autocomplete = class {\n reference: HTMLElement;\n constructor(reference: HTMLElement) {\n this.reference = reference;\n }\n // @ts-ignore\n addListener(_action, callback) {\n this.reference.addEventListener('change', (e: Event) =>\n (e.target as HTMLInputElement).value !== ''\n ? callback({\n geometry: {\n location: class {},\n },\n address_components: [\n {\n long_name: 'Köpeniker Strasse',\n short_name: 'Köpeniker Strasse',\n types: ['route'],\n },\n ],\n })\n : null\n );\n }\n };\n\n const { getAllByTestId, getByDisplayValue, getByTestId } = setup();\n\n fireEvent.change(getByTestId(inputTestId), {\n target: { value: 'Köpeniker' },\n });\n\n expect(getAllByTestId(inputTestId).length).toEqual(5);\n expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();\n });\n\n it('Should enable to enter the address manually', async () => {\n const callback = jest.fn();\n const { findByText, getAllByTestId, user } = setup(undefined, callback);\n const btn = await findByText('enter address manually');\n\n await user.click(btn);\n\n // fill out all fields\n const inputs = getAllByTestId(inputTestId);\n\n await user.type(inputs[0], 'Köpeniker Strasse');\n await user.type(inputs[1], '4000');\n await user.type(inputs[3], '10179');\n await user.type(inputs[4], 'Berlin');\n\n // callback should be called with a complete address\n expect(callback).toHaveBeenCalledWith(address);\n });\n\n it('Should prefill fields if an address is provided', async () => {\n const { getByDisplayValue } = setup(address);\n\n expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();\n expect(getByDisplayValue('4000')).toBeVisible();\n expect(getByDisplayValue('10179')).toBeVisible();\n expect(getByDisplayValue('Berlin')).toBeVisible();\n });\n});\n"],"names":["render","_jsx"],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ var buttonTypeClassNameMap = {
|
|
|
15
15
|
outlineGrey: 'p-btn--outline-grey',
|
|
16
16
|
};
|
|
17
17
|
var Button = React__default.forwardRef(function (_a, ref) {
|
|
18
|
-
var className = _a.className, _b = _a.loading, loading = _b === void 0 ? false : _b, buttonTitle = _a.buttonTitle, _c = _a.buttonType, buttonType = _c === void 0 ? 'primary' : _c, leftIcon = _a.leftIcon
|
|
18
|
+
var className = _a.className, _b = _a.loading, loading = _b === void 0 ? false : _b, buttonTitle = _a.buttonTitle, _c = _a.buttonType, buttonType = _c === void 0 ? 'primary' : _c, leftIcon = _a.leftIcon, props = __rest(_a, ["className", "loading", "buttonTitle", "buttonType", "leftIcon"]);
|
|
19
19
|
var buttonClassName = buttonTypeClassNameMap[buttonType];
|
|
20
20
|
var loadingClassName = loading ? 'p-btn--loading' : '';
|
|
21
21
|
return (jsx("button", __assign({ ref: ref, className: buttonClassName + " " + loadingClassName + " " + (className !== null && className !== void 0 ? className : '') }, props, { children: leftIcon ? (jsxs("div", __assign({ className: styles['content-container'] }, { children: [jsx("img", { width: "20px", height: "20px", className: "mr8", src: leftIcon.src, alt: leftIcon.alt }, void 0),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport styles from './styles.module.scss';\n\ntype ButtonType =\n | 'primary'\n | 'secondary'\n | 'secondaryGrey'\n | 'outline'\n | 'outlineGrey';\n\nconst buttonTypeClassNameMap: { [K in ButtonType]: string } = {\n primary: 'p-btn--primary',\n secondary: 'p-btn--secondary',\n secondaryGrey: 'p-btn--secondary-grey',\n outline: 'p-btn--outline',\n outlineGrey: 'p-btn--outline-grey',\n};\n\ninterface Icon {\n src: string;\n alt: string;\n}\n\ntype
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/lib/components/button/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport styles from './styles.module.scss';\n\ntype ButtonType =\n | 'primary'\n | 'secondary'\n | 'secondaryGrey'\n | 'outline'\n | 'outlineGrey';\n\nconst buttonTypeClassNameMap: { [K in ButtonType]: string } = {\n primary: 'p-btn--primary',\n secondary: 'p-btn--secondary',\n secondaryGrey: 'p-btn--secondary-grey',\n outline: 'p-btn--outline',\n outlineGrey: 'p-btn--outline-grey',\n};\n\ninterface Icon {\n src: string;\n alt: string;\n}\n\ntype ButtonProps = {\n buttonTitle: string;\n buttonType?: ButtonType;\n leftIcon?: Icon;\n loading?: boolean;\n} & Omit<JSX.IntrinsicElements['button'], 'children'>;\n\nexport default React.forwardRef(\n (\n {\n className,\n loading = false,\n buttonTitle,\n buttonType = 'primary',\n leftIcon,\n ...props\n }: ButtonProps,\n ref?: React.ForwardedRef<HTMLButtonElement>\n ) => {\n const buttonClassName = buttonTypeClassNameMap[buttonType];\n const loadingClassName = loading ? 'p-btn--loading' : '';\n return (\n <button\n ref={ref}\n className={`${buttonClassName} ${loadingClassName} ${className ?? ''}`}\n {...props}\n >\n {leftIcon ? (\n <div className={styles['content-container']}>\n <img\n width=\"20px\"\n height=\"20px\"\n className=\"mr8\"\n src={leftIcon.src}\n alt={leftIcon.alt}\n />\n <div>{buttonTitle}</div>\n </div>\n ) : (\n <>{buttonTitle}</>\n )}\n </button>\n );\n }\n);\n"],"names":["React","_jsx","_jsxs"],"mappings":";;;;;;;;;AAWA,IAAM,sBAAsB,GAAkC;IAC5D,OAAO,EAAE,gBAAgB;IACzB,SAAS,EAAE,kBAAkB;IAC7B,aAAa,EAAE,uBAAuB;IACtC,OAAO,EAAE,gBAAgB;IACzB,WAAW,EAAE,qBAAqB;CACnC,CAAC;AAcF,aAAeA,cAAK,CAAC,UAAU,CAC7B,UACE,EAOc,EACd,GAA2C;IAPzC,IAAA,SAAS,eAAA,EACT,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EACf,WAAW,iBAAA,EACX,kBAAsB,EAAtB,UAAU,mBAAG,SAAS,KAAA,EACtB,QAAQ,cAAA,EACL,KAAK,cANV,iEAOC,CADS;IAIV,IAAM,eAAe,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAC;IAC3D,IAAM,gBAAgB,GAAG,OAAO,GAAG,gBAAgB,GAAG,EAAE,CAAC;IACzD,QACEC,yBACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAK,eAAe,SAAI,gBAAgB,UAAI,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,EAAE,CAAE,IAClE,KAAK,cAER,QAAQ,IACPC,uBAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,iBACzCD,aACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,SAAS,EAAC,KAAK,EACf,GAAG,EAAE,QAAQ,CAAC,GAAG,EACjB,GAAG,EAAE,QAAQ,CAAC,GAAG,WACjB;gBACFA,uBAAM,WAAW,WAAO,aACpB,KAENA,0BAAG,WAAW,WAAI,CACnB,YACM,EACT;AACJ,CAAC,CACF;;;;"}
|
|
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
3
3
|
import { c as classNames } from '../../../index-6ea95111.js';
|
|
4
4
|
import { s as styleInject } from '../../../style-inject.es-1f59c1d0.js';
|
|
5
5
|
|
|
6
|
-
var css_248z = ".styles-module_wrapper__1_lY0 {\n
|
|
6
|
+
var css_248z = ".styles-module_wrapper__1_lY0 {\n padding: 4px;\n}";
|
|
7
7
|
var styles = {"wrapper":"styles-module_wrapper__1_lY0"};
|
|
8
8
|
styleInject(css_248z);
|
|
9
9
|
|
|
@@ -12,7 +12,10 @@ var IconWrapper = function (_a) {
|
|
|
12
12
|
var children = _a.children, _c = _a.size, size = _c === void 0 ? 16 : _c, color = _a.color, className = _a.className;
|
|
13
13
|
return (jsx("span", __assign({ className: classNames('d-inline-block', styles.wrapper, className !== null && className !== void 0 ? className : '', (_b = {},
|
|
14
14
|
_b["tc-" + color] = !!color,
|
|
15
|
-
_b))
|
|
15
|
+
_b)), style: {
|
|
16
|
+
width: size + "px",
|
|
17
|
+
height: size + "px"
|
|
18
|
+
} }, { children: jsx("svg", __assign({ className: 'w100', viewBox: "0 0 24 24", fill: "none" }, { children: children }), void 0) }), void 0));
|
|
16
19
|
};
|
|
17
20
|
|
|
18
21
|
export { IconWrapper };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconWrapper.js","sources":["../../../../../../src/lib/components/icon/IconWrapper/IconWrapper.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Color, Size } from '../../../models/styles';\n\nimport styles from './styles.module.scss';\nimport { ReactNode } from 'react';\n\nexport type IconWrapperProps = {\n children?: ReactNode;\n size?: Size;\n color?: Color;\n className?: string;\n};\n\nconst IconWrapper = ({\n children,\n size = 16,\n color,\n className,\n}: IconWrapperProps) => (\n <span\n className={classNames('d-inline-block', styles.wrapper, className ?? '', {\n [`tc-${color}`]: !!color,\n })}\n
|
|
1
|
+
{"version":3,"file":"IconWrapper.js","sources":["../../../../../../src/lib/components/icon/IconWrapper/IconWrapper.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Color, Size } from '../../../models/styles';\n\nimport styles from './styles.module.scss';\nimport { ReactNode } from 'react';\n\nexport type IconWrapperProps = {\n children?: ReactNode;\n size?: Size;\n color?: Color;\n className?: string;\n};\n\nconst IconWrapper = ({\n children,\n size = 16,\n color,\n className,\n}: IconWrapperProps) => (\n <span\n className={classNames('d-inline-block', styles.wrapper, className ?? '', {\n [`tc-${color}`]: !!color,\n })}\n style={{\n width: `${size}px`,\n height: `${size}px`\n }}\n >\n <svg className='w100' viewBox=\"0 0 24 24\" fill=\"none\">\n {children}\n </svg>\n </span>\n);\n\nexport { IconWrapper };"],"names":["_jsx"],"mappings":";;;;;;;;;IAaM,WAAW,GAAG,UAAC,EAKF;;QAJjB,QAAQ,cAAA,EACR,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,KAAK,WAAA,EACL,SAAS,eAAA;IACa,QACtBA,uBACE,SAAS,EAAE,UAAU,CAAC,gBAAgB,EAAE,MAAM,CAAC,OAAO,EAAE,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,EAAE;YACrE,GAAC,QAAM,KAAO,IAAG,CAAC,CAAC,KAAK;gBACxB,EACF,KAAK,EAAE;YACL,KAAK,EAAK,IAAI,OAAI;YAClB,MAAM,EAAK,IAAI,OAAI;SACpB,gBAEDA,sBAAK,SAAS,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,gBAClD,QAAQ,YACL,YACD;AAbe;;;;"}
|
|
@@ -2,7 +2,7 @@ import { _ as __assign } from '../../tslib.es6-5bc94358.js';
|
|
|
2
2
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { useState } from 'react';
|
|
4
4
|
import { Input } from '../input/index.js';
|
|
5
|
-
import { i as icons } from '../../index-
|
|
5
|
+
import { i as icons } from '../../index-35a77b9b.js';
|
|
6
6
|
import Button from '../button/index.js';
|
|
7
7
|
import { c as classNames } from '../../index-6ea95111.js';
|
|
8
8
|
import { s as styleInject } from '../../style-inject.es-1f59c1d0.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { IconWrapper } from './IconWrapper/IconWrapper.js';
|
|
3
|
-
import { i as icons } from '../../index-
|
|
3
|
+
import { i as icons } from '../../index-35a77b9b.js';
|
|
4
4
|
import '../../tslib.es6-5bc94358.js';
|
|
5
5
|
import '../../index-6ea95111.js';
|
|
6
6
|
import '../../style-inject.es-1f59c1d0.js';
|
|
@@ -2812,23 +2812,25 @@ var MultiDropzone = function (_a) {
|
|
|
2812
2812
|
var formattedAccept = getFormattedAcceptObject(accept);
|
|
2813
2813
|
var fileList = formatAcceptFileList(formattedAccept);
|
|
2814
2814
|
var maxSizePlaceholder = maxSize && maxSize > 0
|
|
2815
|
-
? ((textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.sizeUpToText) ||
|
|
2816
|
-
:
|
|
2817
|
-
var placeholder = ((textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.supportsTextShort) ||
|
|
2815
|
+
? ((textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.sizeUpToText) || 'up to') + " " + formatBytes(maxSize)
|
|
2816
|
+
: '';
|
|
2817
|
+
var placeholder = ((textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.supportsTextShort) || 'Supports') + " " + (fileList || 'JPEG, PNG, PDF') + " " + maxSizePlaceholder;
|
|
2818
2818
|
var isOverMaxFiles = maxFiles > 0 && uploadedFiles.length > maxFiles;
|
|
2819
|
-
var removeError = function (removeId) {
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
|
|
2819
|
+
var removeError = function (removeId) {
|
|
2820
|
+
return setErrors(errors.filter(function (_a) {
|
|
2821
|
+
var id = _a.id;
|
|
2822
|
+
return id !== removeId;
|
|
2823
|
+
}));
|
|
2824
|
+
};
|
|
2823
2825
|
var onDrop = useCallback(function (acceptedFiles, filesRejected) {
|
|
2824
2826
|
onFileSelect(acceptedFiles);
|
|
2825
|
-
setErrors(function (previousErrors) { return
|
|
2827
|
+
setErrors(function (previousErrors) { return __spreadArray$1(__spreadArray$1([], previousErrors), filesRejected.map(function (_a) {
|
|
2826
2828
|
var errors = _a.errors;
|
|
2827
2829
|
return ({
|
|
2828
2830
|
id: generateId(),
|
|
2829
2831
|
message: getErrorMessage(errors[0], { fileList: fileList, maxSize: maxSize }, textOverrides),
|
|
2830
2832
|
});
|
|
2831
|
-
}))
|
|
2833
|
+
})); });
|
|
2832
2834
|
}, [fileList, maxSize, onFileSelect, textOverrides]);
|
|
2833
2835
|
var _f = useDropzone({
|
|
2834
2836
|
accept: formattedAccept,
|
|
@@ -2836,11 +2838,12 @@ var MultiDropzone = function (_a) {
|
|
|
2836
2838
|
maxSize: maxSize,
|
|
2837
2839
|
onDrop: onDrop,
|
|
2838
2840
|
}), getRootProps = _f.getRootProps, getInputProps = _f.getInputProps;
|
|
2841
|
+
var uniqueId = useRef(generateId());
|
|
2839
2842
|
return (jsxs("div", __assign({ className: styles.container }, { children: [jsxs("div", __assign({ className: classNames("w100 ta-center br8 c-pointer " + styles.dropzoneContainer, (_b = {},
|
|
2840
2843
|
_b[styles['dropzoneContainerDisabled']] = uploading,
|
|
2841
|
-
_b)) }, getRootProps(), { children: [jsx("input", __assign({ "data-testid": "ds-drop-input" }, getInputProps()), void 0),
|
|
2844
|
+
_b)) }, getRootProps(), { children: [jsx("input", __assign({ "data-testid": "ds-drop-input", id: uniqueId.current }, getInputProps()), void 0),
|
|
2842
2845
|
jsx("img", { className: isCondensed ? styles.img : '', src: isCondensed ? icons.uploadSmallIcon : icons.uploadIcon, alt: "purple cloud with an arrow" }, void 0),
|
|
2843
|
-
jsx("
|
|
2846
|
+
jsx("label", __assign({ htmlFor: uniqueId.current, className: "p-h4 mt8 d-block c-pointer " + (isCondensed ? styles.textInline : '') }, { children: uploading
|
|
2844
2847
|
? (textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.currentlyUploadingText) ||
|
|
2845
2848
|
'Please wait while uploading file...'
|
|
2846
2849
|
: (textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.instructionsText) || 'Choose file or drag & drop' }), void 0),
|
|
@@ -2855,7 +2858,7 @@ var MultiDropzone = function (_a) {
|
|
|
2855
2858
|
}, onRemoveFile: function () { return removeError(id); }, uploading: false }, id));
|
|
2856
2859
|
}),
|
|
2857
2860
|
uploadedFiles.length > 0 && (jsx("div", __assign({ className: "w100 mt16" }, { children: uploadedFiles.map(function (file) { return (jsx(UploadFileCell, { uploadStatus: getUploadStatus(file.progress, file.error), file: file, onRemoveFile: onRemoveFile, uploading: uploading }, file.id)); }) }), void 0)),
|
|
2858
|
-
jsx(AnimateHeight, __assign({ duration: 300, height: isOverMaxFiles ? 'auto' : 0 }, { children: jsx("p", __assign({ className: "tc-red-500 p-p--small" }, { children: (textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.tooManyFilesError) ||
|
|
2861
|
+
jsx(AnimateHeight, __assign({ duration: 300, height: isOverMaxFiles ? 'auto' : 0 }, { children: jsx("p", __assign({ className: "tc-red-500 p-p--small" }, { children: (textOverrides === null || textOverrides === void 0 ? void 0 : textOverrides.tooManyFilesError) || 'Too many files.' }), void 0) }), void 0)] }), void 0));
|
|
2859
2862
|
};
|
|
2860
2863
|
|
|
2861
2864
|
export { MultiDropzone };
|