@popsure/dirty-swan 0.38.0 → 0.38.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/dist/cjs/index.js +2 -2
- 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/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
|
@@ -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;;;;"}
|
package/package.json
CHANGED
|
@@ -62,13 +62,13 @@ describe('AutocompleteAddress component', () => {
|
|
|
62
62
|
});
|
|
63
63
|
|
|
64
64
|
expect(getAllByTestId(inputTestId).length).toEqual(5);
|
|
65
|
-
expect(getByDisplayValue(
|
|
65
|
+
expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();
|
|
66
66
|
});
|
|
67
67
|
|
|
68
68
|
it('Should enable to enter the address manually', async () => {
|
|
69
69
|
const callback = jest.fn();
|
|
70
70
|
const { findByText, getAllByTestId, user } = setup(undefined, callback);
|
|
71
|
-
const btn = await findByText('
|
|
71
|
+
const btn = await findByText('enter address manually');
|
|
72
72
|
|
|
73
73
|
await user.click(btn);
|
|
74
74
|
|
|
@@ -87,9 +87,9 @@ describe('AutocompleteAddress component', () => {
|
|
|
87
87
|
it('Should prefill fields if an address is provided', async () => {
|
|
88
88
|
const { getByDisplayValue } = setup(address);
|
|
89
89
|
|
|
90
|
-
expect(getByDisplayValue(
|
|
91
|
-
expect(getByDisplayValue(
|
|
92
|
-
expect(getByDisplayValue(
|
|
93
|
-
expect(getByDisplayValue(
|
|
90
|
+
expect(getByDisplayValue('Köpeniker Strasse')).toBeVisible();
|
|
91
|
+
expect(getByDisplayValue('4000')).toBeVisible();
|
|
92
|
+
expect(getByDisplayValue('10179')).toBeVisible();
|
|
93
|
+
expect(getByDisplayValue('Berlin')).toBeVisible();
|
|
94
94
|
});
|
|
95
95
|
});
|
|
@@ -239,7 +239,10 @@ const AutocompleteAddress = ({
|
|
|
239
239
|
ref={autocompleteElement}
|
|
240
240
|
/>
|
|
241
241
|
{hasLoadedGoogleAPI === false && (
|
|
242
|
-
<div
|
|
242
|
+
<div
|
|
243
|
+
data-cy="google-api-loader"
|
|
244
|
+
className={styles['loading-spinner']}
|
|
245
|
+
>
|
|
243
246
|
<div className="ds-spinner ds-spinner__m" />
|
|
244
247
|
</div>
|
|
245
248
|
)}
|
|
@@ -339,12 +342,13 @@ const AutocompleteAddress = ({
|
|
|
339
342
|
{manualAddressEntry === false && (
|
|
340
343
|
<div className="p-p mt8">
|
|
341
344
|
{manualAddressEntryTexts?.preText || 'Or '}
|
|
342
|
-
<
|
|
343
|
-
className=
|
|
345
|
+
<button
|
|
346
|
+
className={'p-a p-p fw-bold c-pointer bg-transparent'}
|
|
344
347
|
onClick={handleEnterAddressManually}
|
|
348
|
+
type="button"
|
|
345
349
|
>
|
|
346
|
-
{manualAddressEntryTexts?.cta || '
|
|
347
|
-
</
|
|
350
|
+
{manualAddressEntryTexts?.cta || 'enter address manually'}
|
|
351
|
+
</button>
|
|
348
352
|
</div>
|
|
349
353
|
)}
|
|
350
354
|
</>
|
|
@@ -22,7 +22,7 @@ interface Icon {
|
|
|
22
22
|
alt: string;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
type
|
|
25
|
+
type ButtonProps = {
|
|
26
26
|
buttonTitle: string;
|
|
27
27
|
buttonType?: ButtonType;
|
|
28
28
|
leftIcon?: Icon;
|
|
@@ -37,9 +37,8 @@ export default React.forwardRef(
|
|
|
37
37
|
buttonTitle,
|
|
38
38
|
buttonType = 'primary',
|
|
39
39
|
leftIcon,
|
|
40
|
-
type,
|
|
41
40
|
...props
|
|
42
|
-
}:
|
|
41
|
+
}: ButtonProps,
|
|
43
42
|
ref?: React.ForwardedRef<HTMLButtonElement>
|
|
44
43
|
) => {
|
|
45
44
|
const buttonClassName = buttonTypeClassNameMap[buttonType];
|