@popsure/dirty-swan 0.57.3 → 0.57.5

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.
Files changed (26) hide show
  1. package/dist/cjs/index.js +12 -8
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/lib/components/autocompleteAddress/index.d.ts +1 -0
  4. package/dist/cjs/lib/components/autocompleteAddress/index.stories.d.ts +1 -1
  5. package/dist/esm/components/autocompleteAddress/index.js +7 -3
  6. package/dist/esm/components/autocompleteAddress/index.js.map +1 -1
  7. package/dist/esm/components/autocompleteAddress/index.stories.js +2 -2
  8. package/dist/esm/components/autocompleteAddress/index.stories.js.map +1 -1
  9. package/dist/esm/components/badge/index.js +1 -1
  10. package/dist/esm/components/badge/index.js.map +1 -1
  11. package/dist/esm/components/modal/bottomModal/index.js +1 -1
  12. package/dist/esm/components/modal/bottomModal/index.js.map +1 -1
  13. package/dist/esm/components/segmentedControl/index.js +2 -2
  14. package/dist/esm/components/segmentedControl/index.js.map +1 -1
  15. package/dist/esm/components/spinner/index.js +1 -1
  16. package/dist/esm/components/spinner/index.js.map +1 -1
  17. package/dist/esm/lib/components/autocompleteAddress/index.d.ts +1 -0
  18. package/dist/esm/lib/components/autocompleteAddress/index.stories.d.ts +1 -1
  19. package/package.json +1 -1
  20. package/src/lib/components/autocompleteAddress/index.stories.tsx +2 -0
  21. package/src/lib/components/autocompleteAddress/index.tsx +18 -15
  22. package/src/lib/components/badge/index.tsx +1 -0
  23. package/src/lib/components/modal/bottomModal/index.tsx +1 -1
  24. package/src/lib/components/segmentedControl/index.tsx +1 -1
  25. package/src/lib/components/segmentedControl/style.module.scss +5 -0
  26. package/src/lib/components/spinner/index.tsx +1 -0
package/dist/cjs/index.js CHANGED
@@ -5109,7 +5109,7 @@ var AutocompleteAddress = function (_a) {
5109
5109
  map: map.current,
5110
5110
  });
5111
5111
  setPlaceFromAddress(address);
5112
- }, [hasLoadedGoogleAPI]); // eslint-disable-line
5112
+ }, [hasLoadedGoogleAPI, countryCode]); // eslint-disable-line
5113
5113
  var onPlaceChanged = function (newPlace, updateAddress) {
5114
5114
  var _a, _b, _c, _d, _e;
5115
5115
  if (newPlace === void 0) { newPlace = (_a = autocomplete.current) === null || _a === void 0 ? void 0 : _a.getPlace(); }
@@ -5169,8 +5169,12 @@ var AutocompleteAddress = function (_a) {
5169
5169
  };
5170
5170
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: classNames$1("wmx8 bg-grey-500 ".concat(styles$D['map-container']), (_b = {},
5171
5171
  _b[styles$D['map-container--hidden']] = place === null,
5172
- _b)), children: [jsxRuntime.jsx("div", { className: styles$D.map, id: "map" }), isLoading && (jsxRuntime.jsx("div", { className: styles$D['loading-spinner'], children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }) }))] }), jsxRuntime.jsx("div", { className: "wmx8", children: manualAddressEntry === false ? (jsxRuntime.jsxs("div", { style: { position: 'relative' }, children: [jsxRuntime.jsx(Input, { className: "w100", id: "autocomplete", "data-cy": "autocomplete", type: "text", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.manualAddressEntry) || 'Search for address', ref: autocompleteElement }, "autocomplete-search"), hasLoadedGoogleAPI === false && (jsxRuntime.jsx("div", { "data-cy": "google-api-loader", className: styles$D['loading-spinner'], children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }) }))] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "d-flex c-gap16 ".concat(styles$D['input-line']), children: [jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete", type: "text", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.street) || 'Street', value: (address === null || address === void 0 ? void 0 : address.street) || '', onChange: onManualAddressChange(), name: "street" }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.street), "autocomplete-street"), jsxRuntime.jsx(Input, __assign({ className: "wmx2 ".concat(styles$D['house-number-input']), "data-cy": "autocomplete-house-number", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.houseNumber) || 'House Number', value: (address === null || address === void 0 ? void 0 : address.houseNumber) || '', name: "houseNumber", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.houseNumber), "autocomplete-house-number")] }), jsxRuntime.jsx(Input, __assign({ className: "mt16", "data-cy": "autocomplete-additional-info", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.additionalInformation) ||
5173
- 'Additional information (C/O, apartment, …)', value: (address === null || address === void 0 ? void 0 : address.additionalInformation) || '', name: "additionalInformation", onChange: onManualAddressChange({ updatePlace: false }) }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.additionalInformation), "autocomplete-additional-info"), jsxRuntime.jsxs("div", { className: "d-flex mt16 c-gap16 ".concat(styles$D['input-line']), children: [jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete-postcode", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.postcode) || 'Postcode', value: (address === null || address === void 0 ? void 0 : address.postcode) || '', name: "postcode", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.postcode), "autocomplete-postcode"), jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete-city", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.city) || 'City', value: (address === null || address === void 0 ? void 0 : address.city) || '', name: "city", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.city), "autocomplete-city")] })] })) }), manualAddressEntry === false && (jsxRuntime.jsxs("div", { className: "p-p mt8", children: [(manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.preText) || 'Or ', jsxRuntime.jsx("button", { className: 'p-a p-p fw-bold c-pointer bg-transparent', onClick: handleEnterAddressManually, type: "button", children: (manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.cta) || 'enter address manually' })] }))] }));
5172
+ _b)), children: [jsxRuntime.jsx("div", { className: styles$D.map, id: "map", "aria-hidden": "true" }), isLoading && (jsxRuntime.jsx("div", { className: styles$D['loading-spinner'], children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }) }))] }), jsxRuntime.jsx("div", { className: "wmx8", children: !manualAddressEntry ? (jsxRuntime.jsxs("div", { style: { position: 'relative' }, children: [jsxRuntime.jsx(Input, { className: "w100", id: "autocomplete", "data-cy": "autocomplete", type: "text", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.manualAddressEntry) || 'Search for address', ref: autocompleteElement }, "autocomplete-search"), hasLoadedGoogleAPI === false && (jsxRuntime.jsx("div", { "data-cy": "google-api-loader", className: styles$D['loading-spinner'], children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }) }))] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "d-flex c-gap16 ".concat(styles$D['input-line']), children: [jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete", type: "text", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.street) || 'Street', value: (address === null || address === void 0 ? void 0 : address.street) || '', onChange: onManualAddressChange(), name: "street" }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.street), "autocomplete-street"), jsxRuntime.jsx(Input, __assign({ className: "wmx2 ".concat(styles$D['house-number-input']), "data-cy": "autocomplete-house-number", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.houseNumber) || 'House Number', value: (address === null || address === void 0 ? void 0 : address.houseNumber) || '', name: "houseNumber", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.houseNumber), "autocomplete-house-number")] }), jsxRuntime.jsx(Input, __assign({ className: "mt16", "data-cy": "autocomplete-additional-info", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.additionalInformation) ||
5173
+ 'Additional information (C/O, apartment, …)', value: (address === null || address === void 0 ? void 0 : address.additionalInformation) || '', name: "additionalInformation", onChange: onManualAddressChange({ updatePlace: false }) }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.additionalInformation), "autocomplete-additional-info"), jsxRuntime.jsxs("div", { className: "d-flex mt16 c-gap16 ".concat(styles$D['input-line']), children: [jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete-postcode", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.postcode) || 'Postcode', value: (address === null || address === void 0 ? void 0 : address.postcode) || '', name: "postcode", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.postcode), "autocomplete-postcode"), jsxRuntime.jsx(Input, __assign({ className: "w100", "data-cy": "autocomplete-city", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.city) || 'City', value: (address === null || address === void 0 ? void 0 : address.city) || '', name: "city", onChange: onManualAddressChange() }, inputProps === null || inputProps === void 0 ? void 0 : inputProps.city), "autocomplete-city")] })] })) }), jsxRuntime.jsxs("div", { className: "p-p mt8", children: [(manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.preText) || 'Or ', jsxRuntime.jsx("button", { className: 'p-a p-p fw-bold c-pointer bg-transparent', onClick: function () {
5174
+ manualAddressEntry ? setManualAddressEntry(false) : handleEnterAddressManually();
5175
+ }, type: "button", children: manualAddressEntry
5176
+ ? (manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.ctaSearch) || 'search for address'
5177
+ : (manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.cta) || 'enter address manually' })] })] }));
5174
5178
  };
5175
5179
 
5176
5180
  var propTypes$2 = {exports: {}};
@@ -8534,7 +8538,7 @@ var getVariantClassNames = function (variant) { return ({
8534
8538
  }[variant]); };
8535
8539
  var Badge = function (_a) {
8536
8540
  var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.variant, variant = _d === void 0 ? 'information' : _d, children = _a.children;
8537
- return (jsxRuntime.jsx("div", { className: classNames$1(className, 'px16 br8 d-inline-block ai-center fw-bold p-p', { 'p-p--small': size === 'small' }, styles$y["badge--".concat(size)], getVariantClassNames(variant)), children: children }));
8541
+ return (jsxRuntime.jsx("div", { role: "status", className: classNames$1(className, 'px16 br8 d-inline-block ai-center fw-bold p-p', { 'p-p--small': size === 'small' }, styles$y["badge--".concat(size)], getVariantClassNames(variant)), children: children }));
8538
8542
  };
8539
8543
 
8540
8544
  var css_248z$y = ".styles-module_container__3zJJC {\n max-width: 100%;\n}\n\n.styles-module_narrow__2p34b {\n max-width: 424px;\n}";
@@ -11457,7 +11461,7 @@ var GenericModal = function (props) {
11457
11461
 
11458
11462
  var BottomModal = function (_a) {
11459
11463
  var className = _a.className, classNames = _a.classNames, rest = __rest$1(_a, ["className", "classNames"]);
11460
- return (jsxRuntime.jsx(GenericModal, __assign({ titleSize: "small", classNames: __assign(__assign({}, classNames), { wrapper: classNames$1('w100', styles$v.wrapper, classNames === null || classNames === void 0 ? void 0 : classNames.wrapper), container: function (_a) {
11464
+ return (jsxRuntime.jsx(GenericModal, __assign({ titleSize: "default", classNames: __assign(__assign({}, classNames), { wrapper: classNames$1('w100', styles$v.wrapper, classNames === null || classNames === void 0 ? void 0 : classNames.wrapper), container: function (_a) {
11461
11465
  var _b;
11462
11466
  var isClosing = _a.isClosing;
11463
11467
  return classNames$1('bg-white d-flex fd-column w100', className, styles$v.container, classNames === null || classNames === void 0 ? void 0 : classNames.container, (_b = {},
@@ -15619,7 +15623,7 @@ var ComparisonTable = function (props) {
15619
15623
  }), hideDetails && (jsxRuntime.jsx("div", { className: classNames$1(baseStyles['show-details-container'], baseStyles.sticky, 'mt48'), children: jsxRuntime.jsx("div", { children: jsxRuntime.jsxs("button", { className: classNames$1('w100 d-flex p-a p-h4 c-pointer', baseStyles['show-details-button'], classNameOverrides === null || classNameOverrides === void 0 ? void 0 : classNameOverrides.hideDetailsButton), onClick: toggleMoreRows, type: "button", children: [showMore ? hideDetailsCaption : showDetailsCaption, jsxRuntime.jsx(Chevron, { className: showMore ? '' : baseStyles['icon-inverted'] })] }) }) }))] })] }) }));
15620
15624
  };
15621
15625
 
15622
- var css_248z$d = ".style-module_background-container__2Gjka {\n position: relative;\n display: inline-block;\n background-color: var(--ds-primary-100);\n border-radius: 8px;\n padding: 0 8px;\n}\n\n.style-module_chip-container__7XeKn {\n display: flex;\n align-items: center;\n}\n\n.style-module_chip__3rgLT {\n cursor: pointer;\n z-index: 2;\n padding-left: 16px;\n padding-right: 16px;\n}\n\n.style-module_select-chip-background__YCAyw {\n position: absolute;\n background-color: white;\n border-radius: 8px;\n top: 8px;\n z-index: 1;\n transition: width 0.3s, left 0.3s;\n}";
15626
+ var css_248z$d = ".style-module_background-container__2Gjka {\n position: relative;\n display: inline-block;\n background-color: var(--ds-primary-100);\n border-radius: 8px;\n padding: 0 8px;\n}\n\n.style-module_chip-container__7XeKn {\n display: flex;\n align-items: center;\n}\n\n.style-module_chip__3rgLT {\n cursor: pointer;\n z-index: 2;\n padding-left: 16px;\n padding-right: 16px;\n}\n.style-module_chip__3rgLT:focus {\n outline-color: var(--ds-primary-500);\n outline-offset: 2px;\n}\n\n.style-module_select-chip-background__YCAyw {\n position: absolute;\n background-color: white;\n border-radius: 8px;\n top: 8px;\n z-index: 1;\n transition: width 0.3s, left 0.3s;\n}";
15623
15627
  var styles$d = {"background-container":"style-module_background-container__2Gjka","chip-container":"style-module_chip-container__7XeKn","chip":"style-module_chip__3rgLT","select-chip-background":"style-module_select-chip-background__YCAyw"};
15624
15628
  styleInject(css_248z$d);
15625
15629
 
@@ -15637,7 +15641,7 @@ var SegmentedControl = function (_a) {
15637
15641
  }, [selectedIndex]);
15638
15642
  return (jsxRuntime.jsx("div", { className: className, children: jsxRuntime.jsxs("div", { className: styles$d['background-container'], children: [jsxRuntime.jsx("div", { ref: chipContainer, className: styles$d['chip-container'], style: { height: "".concat(height, "px") }, children: values.map(function (value, index) {
15639
15643
  return (jsxRuntime.jsx("div", { role: "button", tabIndex: 0, onKeyDown: function (e) {
15640
- if (e.key === 'Enter') {
15644
+ if (e.key === 'Enter' || e.code === 'Space') {
15641
15645
  onChange(index);
15642
15646
  }
15643
15647
  }, onClick: function () {
@@ -15816,7 +15820,7 @@ var illustrations = {
15816
15820
 
15817
15821
  var Spinner = function (_a) {
15818
15822
  var _b = _a.size, size = _b === void 0 ? 's' : _b;
15819
- return (jsxRuntime.jsx("div", { className: classNames$1('ds-spinner', "ds-spinner__".concat(size)), "data-testid": "ds-spinner" }));
15823
+ return (jsxRuntime.jsx("div", { "aria-live": 'polite', className: classNames$1('ds-spinner', "ds-spinner__".concat(size)), "data-testid": "ds-spinner" }));
15820
15824
  };
15821
15825
 
15822
15826
  var css_248z$c = ".styles-module_container__F0d5Q {\n max-width: 100%;\n}\n\n.styles-module_toggleContainer__2yz_j {\n position: relative;\n width: 40px;\n height: 12px;\n}\n\n.styles-module_label__3EAX_ {\n align-items: center;\n}\n\n.styles-module_toggle__2sL88 {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: var(--ds-grey-400);\n transition: all 0.3s ease-in-out;\n border-radius: 100px;\n}\n.styles-module_toggle__2sL88:before {\n position: absolute;\n content: \"\";\n height: 20px;\n width: 20px;\n left: 0;\n bottom: -4px;\n background: var(--ds-grey-500);\n transition: 0.3s ease-in-out;\n transition-property: background-color, outline, transform;\n outline-color: var(--ds-purple-300);\n border-radius: 50%;\n}\n\n.styles-module_input__2sUF3 {\n opacity: 0;\n}\n.styles-module_input__2sUF3:checked + .styles-module_toggle__2sL88 {\n background: var(--ds-purple-100);\n}\n.styles-module_input__2sUF3:checked + .styles-module_toggle__2sL88:before {\n background: var(--ds-purple-500);\n}\n.styles-module_input__2sUF3:disabled + .styles-module_toggle__2sL88 {\n cursor: not-allowed;\n opacity: 0.4;\n}\n.styles-module_input__2sUF3:focus-visible ~ .styles-module_toggle__2sL88:before {\n outline: 4px solid var(--ds-purple-300);\n}\n.styles-module_input__2sUF3:checked + .styles-module_toggle__2sL88:before {\n transform: translateX(20px);\n}";