@popsure/dirty-swan 0.27.23 → 0.27.25

package/Readme.md

@@ -16,6 +16,8 @@ Start the development server using
 yarn storybook
 ```
 
+This will start storybook at `http://localhost:9009/`.
+
 ## Contributing
 
 ### Releasing a new version

package/dist/index.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var require$$0 = require('react');
+var crypto = require('crypto');
 var require$$1 = require('react-dom');
 var path = require('path');
 var require$$2 = require('querystring');
@@ -11,6 +12,7 @@ var require$$2 = require('querystring');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var require$$0__default = /*#__PURE__*/_interopDefaultLegacy(require$$0);
+var crypto__default = /*#__PURE__*/_interopDefaultLegacy(crypto);
 var require$$1__default = /*#__PURE__*/_interopDefaultLegacy(require$$1);
 var path__default = /*#__PURE__*/_interopDefaultLegacy(path);
 var require$$2__default = /*#__PURE__*/_interopDefaultLegacy(require$$2);
@@ -5151,18 +5153,80 @@ module.exports = isEqual;
 
 var isEqual = lodash_isequal.exports;
 
-var css_248z$p = ".style-module_container__2L4SP {\n  position: relative;\n}\n\n.style-module_prefix__3jAFZ {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--ds-grey-500);\n  transition: 0.3s top;\n}\n.style-module_prefix--with-error__1yTTM {\n  color: var(--ds-red-500);\n}\n.style-module_prefix--disabled__2-gcw {\n  color: var(--ds-grey-600);\n}\n\n.style-module_input__1eJO5:not(:placeholder-shown) ~ .style-module_placeholder__1U2z0,\n.style-module_input__1eJO5:focus ~ .style-module_placeholder__1U2z0 {\n  top: 7px;\n  left: 16px;\n  transform: translateY(0);\n  font-size: 10px;\n  line-height: 12px;\n  opacity: 1;\n}\n\n.style-module_input__1eJO5:focus ~ .style-module_placeholder__1U2z0 {\n  color: var(--ds-primary-500);\n}\n.style-module_input__1eJO5:focus ~ .style-module_placeholder--with-error__2ieRU {\n  color: var(--ds-red-500);\n}\n\n.style-module_input__1eJO5:focus ~ .style-module_prefix__3jAFZ {\n  color: var(--ds-primary-500);\n}\n.style-module_input__1eJO5:focus ~ .style-module_prefix--with-error__1yTTM {\n  color: var(--ds-red-500);\n}\n\n.style-module_input__1eJO5:not(:placeholder-shown) ~ .style-module_prefix__3jAFZ,\n.style-module_input__1eJO5:focus ~ .style-module_prefix__3jAFZ {\n  top: 28px;\n}\n\n.style-module_input__1eJO5 {\n  box-sizing: border-box;\n  padding-top: 9px;\n  font-family: inherit;\n}\n.style-module_input--no-placeholder__3EGwh {\n  padding-top: 0px;\n}\n.style-module_input--with-prefix__38e0j {\n  padding-left: 32px !important;\n}\n\n.style-module_placeholder__1U2z0 {\n  position: absolute;\n  pointer-events: none;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  transition: 0.3s ease all;\n  color: var(--ds-grey-500);\n}\n.style-module_placeholder--with-prefix__2PquQ {\n  left: 32px;\n}\n.style-module_placeholder--with-error__2ieRU {\n  color: var(--ds-red-500);\n}\n\n.style-module_error__167Zc {\n  margin-top: 4px;\n}";
-var styles$o = {"container":"style-module_container__2L4SP","prefix":"style-module_prefix__3jAFZ","prefix--with-error":"style-module_prefix--with-error__1yTTM","prefix--disabled":"style-module_prefix--disabled__2-gcw","input":"style-module_input__1eJO5","placeholder":"style-module_placeholder__1U2z0","placeholder--with-error":"style-module_placeholder--with-error__2ieRU","input--no-placeholder":"style-module_input--no-placeholder__3EGwh","input--with-prefix":"style-module_input--with-prefix__38e0j","placeholder--with-prefix":"style-module_placeholder--with-prefix__2PquQ","error":"style-module_error__167Zc"};
+const rnds8Pool = new Uint8Array(256); // # of random values to pre-allocate
+
+let poolPtr = rnds8Pool.length;
+function rng() {
+  if (poolPtr > rnds8Pool.length - 16) {
+    crypto__default['default'].randomFillSync(rnds8Pool);
+    poolPtr = 0;
+  }
+
+  return rnds8Pool.slice(poolPtr, poolPtr += 16);
+}
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+const byteToHex = [];
+
+for (let i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+
+function unsafeStringify(arr, offset = 0) {
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
+
+var native = {
+  randomUUID: crypto__default['default'].randomUUID
+};
+
+function v4(options, buf, offset) {
+  if (native.randomUUID && !buf && !options) {
+    return native.randomUUID();
+  }
+
+  options = options || {};
+  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (let i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return unsafeStringify(rnds);
+}
+
+var css_248z$p = ".style-module_container__2L4SP {\n  position: relative;\n}\n\n.style-module_prefix__3jAFZ {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--ds-grey-500);\n  transition: 0.3s top;\n}\n.style-module_prefix--with-error__1yTTM {\n  color: var(--ds-red-500);\n}\n.style-module_prefix--disabled__2-gcw {\n  color: var(--ds-grey-600);\n}\n\n.style-module_input__1eJO5:not(:placeholder-shown) ~ .style-module_placeholder__1U2z0,\n.style-module_input__1eJO5:focus ~ .style-module_placeholder__1U2z0 {\n  top: 7px;\n  left: 16px;\n  transform: translateY(0);\n  font-size: 10px;\n  line-height: 12px;\n  opacity: 1;\n}\n\n.style-module_input__1eJO5:focus ~ .style-module_placeholder__1U2z0 {\n  color: var(--ds-primary-500);\n}\n.style-module_input__1eJO5:focus ~ .style-module_placeholder--with-error__2ieRU {\n  color: var(--ds-red-500);\n}\n\n.style-module_input__1eJO5:focus ~ .style-module_prefix__3jAFZ {\n  color: var(--ds-primary-500);\n}\n.style-module_input__1eJO5:focus ~ .style-module_prefix--with-error__1yTTM {\n  color: var(--ds-red-500);\n}\n\n.style-module_input__1eJO5:not(:placeholder-shown) ~ .style-module_prefix__3jAFZ,\n.style-module_input__1eJO5:focus ~ .style-module_prefix__3jAFZ {\n  top: 28px;\n}\n\n.style-module_input__1eJO5 {\n  box-sizing: border-box;\n  padding-top: 9px;\n  font-family: inherit;\n}\n.style-module_input--no-placeholder__3EGwh {\n  padding-top: 0px;\n}\n.style-module_input--with-prefix__38e0j {\n  padding-left: 32px !important;\n}\n\n.style-module_placeholder__1U2z0 {\n  position: absolute;\n  pointer-events: none;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  transition: 0.3s ease all;\n  color: var(--ds-grey-500);\n}\n.style-module_placeholder--with-prefix__2PquQ {\n  left: 32px;\n}\n.style-module_placeholder--with-error__2ieRU {\n  color: var(--ds-red-500);\n}\n\n.style-module_label__3FEZ1 {\n  display: inline-block;\n  margin-top: 8px;\n  margin-bottom: 8px;\n  color: var(--ds-grey-600);\n}\n.style-module_label--with-error__166bP {\n  color: var(--ds-red-500);\n}\n.style-module_label--hidden__1e9iX {\n  visibility: hidden;\n  height: 0;\n}\n\n.style-module_error__167Zc {\n  margin-top: 4px;\n}";
+var styles$o = {"container":"style-module_container__2L4SP","prefix":"style-module_prefix__3jAFZ","prefix--with-error":"style-module_prefix--with-error__1yTTM","prefix--disabled":"style-module_prefix--disabled__2-gcw","input":"style-module_input__1eJO5","placeholder":"style-module_placeholder__1U2z0","placeholder--with-error":"style-module_placeholder--with-error__2ieRU","input--no-placeholder":"style-module_input--no-placeholder__3EGwh","input--with-prefix":"style-module_input--with-prefix__38e0j","placeholder--with-prefix":"style-module_placeholder--with-prefix__2PquQ","label":"style-module_label__3FEZ1","label--with-error":"style-module_label--with-error__166bP","label--hidden":"style-module_label--hidden__1e9iX","error":"style-module_error__167Zc"};
 styleInject(css_248z$p);
 
 var Input = require$$0__default['default'].forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e, _f;
-    var className = _a.className, placeholder = _a.placeholder, prefix = _a.prefix, error = _a.error, disabled = _a.disabled, props = __rest$1(_a, ["className", "placeholder", "prefix", "error", "disabled"]);
-    return (jsxRuntime.jsxs("div", __assign({ className: styles$o.container + " " + (className !== null && className !== void 0 ? className : '') }, { children: [jsxRuntime.jsx("input", __assign({ "data-testid": "ds-input-input", type: "text", ref: ref, className: classNames(error ? 'p-input--error' : 'p-input', placeholder && placeholder.length > 0
-                    ? styles$o.input
-                    : styles$o['input--no-placeholder'], (_b = {}, _b[styles$o['input--with-prefix']] = prefix, _b)), placeholder: " ", disabled: disabled }, props), void 0),
-            prefix && (jsxRuntime.jsx("span", __assign({ className: classNames(styles$o.prefix, (_c = {}, _c[styles$o['prefix--with-error']] = error, _c), (_d = {}, _d[styles$o['prefix--disabled']] = disabled, _d)) }, { children: prefix }), void 0)),
-            jsxRuntime.jsx("span", __assign({ className: classNames(styles$o.placeholder, (_e = {}, _e[styles$o['placeholder--with-prefix']] = prefix, _e), (_f = {}, _f[styles$o['placeholder--with-error']] = error, _f)) }, { children: placeholder }), void 0),
+    var _b, _c, _d, _e, _f, _g;
+    var className = _a.className, placeholder = _a.placeholder, label = _a.label, id = _a.id, prefix = _a.prefix, error = _a.error, disabled = _a.disabled, _h = _a.hideLabel, hideLabel = _h === void 0 ? false : _h, props = __rest$1(_a, ["className", "placeholder", "label", "id", "prefix", "error", "disabled", "hideLabel"]);
+    var uniqueId = id !== null && id !== void 0 ? id : v4();
+    return (jsxRuntime.jsxs("div", __assign({ className: styles$o.container + " " + (className !== null && className !== void 0 ? className : '') }, { children: [label && (jsxRuntime.jsx("label", __assign({ htmlFor: uniqueId, className: classNames('p-p', styles$o.label, (_b = {},
+                    _b[styles$o['label--with-error']] = error,
+                    _b[styles$o['label--hidden']] = hideLabel,
+                    _b)) }, { children: label }), void 0)),
+            jsxRuntime.jsxs("div", __assign({ style: { position: 'relative' } }, { children: [jsxRuntime.jsx("input", __assign({ id: uniqueId, "data-testid": "ds-input-input", type: "text", ref: ref, className: classNames(error ? 'p-input--error' : 'p-input', !label && placeholder && placeholder.length > 0
+                            ? styles$o.input
+                            : styles$o['input--no-placeholder'], (_c = {}, _c[styles$o['input--with-prefix']] = prefix, _c)), placeholder: label ? placeholder : ' ', disabled: disabled }, props), void 0),
+                    prefix && (jsxRuntime.jsx("span", __assign({ className: classNames(styles$o.prefix, (_d = {}, _d[styles$o['prefix--with-error']] = error, _d), (_e = {}, _e[styles$o['prefix--disabled']] = disabled, _e)) }, { children: prefix }), void 0)),
+                    !label && (jsxRuntime.jsx("label", __assign({ htmlFor: uniqueId, className: classNames(styles$o.placeholder, (_f = {}, _f[styles$o['placeholder--with-prefix']] = prefix, _f), (_g = {}, _g[styles$o['placeholder--with-error']] = error, _g)) }, { children: placeholder }), void 0))] }), void 0),
             error && (jsxRuntime.jsx("p", __assign({ className: "p-p--small tc-red-500 w100 " + styles$o.error }, { children: error }), void 0))] }), void 0));
 });
 
@@ -5331,32 +5395,32 @@ var AutoCompleteAddress = function (_a) {
                     _b[styles$n['map-container--hidden']] = place === null,
                     _b)) }, { children: [jsxRuntime.jsx("div", { className: styles$n.map, id: "map" }, void 0),
                     isLoading && (jsxRuntime.jsx("div", __assign({ className: styles$n['loading-spinner'] }, { children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }, void 0) }), void 0))] }), void 0),
-            jsxRuntime.jsx("div", __assign({ className: "wmx8" }, { children: manualAddressEntry === false ? (jsxRuntime.jsxs("div", __assign({ 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 }, void 0),
+            jsxRuntime.jsx("div", __assign({ className: "wmx8" }, { children: manualAddressEntry === false ? (jsxRuntime.jsxs("div", __assign({ 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", __assign({ className: styles$n['loading-spinner'] }, { children: jsxRuntime.jsx("div", { className: "ds-spinner ds-spinner__m" }, void 0) }), void 0))] }), void 0)) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", __assign({ className: "d-flex c-gap16 " + styles$n['input-line'] }, { children: [jsxRuntime.jsx(Input, { 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: function (e) {
                                         var newAddress = __assign(__assign({}, address), { street: e.target.value, country: GERMANY_ALPHA_CODE });
                                         setAddress(newAddress);
                                         debouncedSetPlace(newAddress);
-                                    } }, void 0),
+                                    } }, "autocomplete-street"),
                                 jsxRuntime.jsx(Input, { className: "wmx2 " + styles$n['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) || '', onChange: function (e) {
                                         var newAddress = __assign(__assign({}, address), { houseNumber: e.target.value, country: GERMANY_ALPHA_CODE });
                                         setAddress(newAddress);
                                         debouncedSetPlace(newAddress);
-                                    } }, void 0)] }), void 0),
+                                    } }, "autocomplete-house-number")] }), void 0),
                         jsxRuntime.jsx(Input, { className: "mt16", "data-cy": "autocomplete-additional-info", placeholder: (placeholders === null || placeholders === void 0 ? void 0 : placeholders.additionalInformation) ||
                                 'Additional information (C/O, apartment, …)', value: (address === null || address === void 0 ? void 0 : address.additionalInformation) || '', onChange: function (e) {
                                 var newAddress = __assign(__assign({}, address), { additionalInformation: e.target.value, country: GERMANY_ALPHA_CODE });
                                 setAddress(newAddress);
-                            } }, void 0),
+                            } }, "autocomplete-additional-info"),
                         jsxRuntime.jsxs("div", __assign({ className: "d-flex mt16 c-gap16 " + styles$n['input-line'] }, { children: [jsxRuntime.jsx(Input, { 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) || '', onChange: function (e) {
                                         var newAddress = __assign(__assign({}, address), { postcode: e.target.value, country: GERMANY_ALPHA_CODE });
                                         setAddress(newAddress);
                                         debouncedSetPlace(newAddress);
-                                    } }, void 0),
+                                    } }, "autocomplete-postcode"),
                                 jsxRuntime.jsx(Input, { 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) || '', onChange: function (e) {
                                         var newAddress = __assign(__assign({}, address), { city: e.target.value, country: GERMANY_ALPHA_CODE });
                                         setAddress(newAddress);
                                         debouncedSetPlace(newAddress);
-                                    } }, void 0)] }), void 0)] }, void 0)) }), void 0),
+                                    } }, "autocomplete-city")] }), void 0)] }, void 0)) }), void 0),
             manualAddressEntry === false && (jsxRuntime.jsxs("div", __assign({ className: "p-p mt8" }, { children: [(manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.preText) || 'Or ',
                     jsxRuntime.jsx("span", __assign({ className: "p-a fw-bold c-pointer", onClick: handleEnterAddressManually }, { children: (manualAddressEntryTexts === null || manualAddressEntryTexts === void 0 ? void 0 : manualAddressEntryTexts.cta) || 'Enter address manually' }), void 0)] }), void 0))] }, void 0));
 };