UNPKG

@playbooks/ui

Version:

An interface library for Playbooks.

1,292 lines 627 kB
import { jsx, Fragment, jsxs } from "react/jsx-runtime"; import React__default, { forwardRef, useMemo, useState, useRef, useImperativeHandle, useEffect, createContext, memo, useContext, Children, isValidElement, cloneElement, PureComponent, createRef, useCallback } from "react"; import { c as computeTailwind, G as Form$1, L as Label, I as Input$1, J as Select, O as Option, Q as TextArea } from "./index.es-7ZX4yv7W.js"; import * as ReactDOM__default from "react-dom"; import ReactDOM__default__default, { createPortal } from "react-dom"; import { g as getDefaultExportFromCjs } from "./_commonjsHelpers-DWwsNxpa-CUmg6egw.js"; import { P as PropTypes } from "./index-CfgCHjxq-uCO_WmT5.js"; import { c as useElementKeyDown } from "./index.es-ThnjXBwV.js"; import { useUI } from "./context.es.js"; import { Div, Span } from "./html.es.js"; var __assign = function() { __assign = Object.assign || function __assign2(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; function __rest$1(s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; } function __spreadArray(to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); } typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) { var e = new Error(message); return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; var escapeRegExp = function(stringToGoIntoTheRegex) { return stringToGoIntoTheRegex.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&"); }; var abbrMap = { k: 1e3, m: 1e6, b: 1e9 }; var parseAbbrValue = function(value, decimalSeparator) { if (decimalSeparator === void 0) { decimalSeparator = "."; } var reg = new RegExp("(\\d+(".concat(escapeRegExp(decimalSeparator), "\\d*)?)([kmb])$"), "i"); var match = value.match(reg); if (match) { var digits = match[1], abbr = match[3]; var multiplier = abbrMap[abbr.toLowerCase()]; return Number(digits.replace(decimalSeparator, ".")) * multiplier; } return void 0; }; var removeSeparators = function(value, separator) { if (separator === void 0) { separator = ","; } var reg = new RegExp(escapeRegExp(separator), "g"); return value.replace(reg, ""); }; var removeInvalidChars = function(value, validChars) { var chars = escapeRegExp(validChars.join("")); var reg = new RegExp("[^\\d".concat(chars, "]"), "gi"); return value.replace(reg, ""); }; var cleanValue = function(_a) { var value = _a.value, _b = _a.groupSeparator, groupSeparator = _b === void 0 ? "," : _b, _c = _a.decimalSeparator, decimalSeparator = _c === void 0 ? "." : _c, _d = _a.allowDecimals, allowDecimals = _d === void 0 ? true : _d, _e = _a.decimalsLimit, decimalsLimit = _e === void 0 ? 2 : _e, _f = _a.allowNegativeValue, allowNegativeValue = _f === void 0 ? true : _f, _g = _a.disableAbbreviations, disableAbbreviations = _g === void 0 ? false : _g, _h = _a.prefix, prefix = _h === void 0 ? "" : _h, _j = _a.transformRawValue, transformRawValue = _j === void 0 ? function(rawValue) { return rawValue; } : _j; var transformedValue = transformRawValue(value); if (transformedValue === "-") { return transformedValue; } var abbreviations = disableAbbreviations ? [] : ["k", "m", "b"]; var reg = new RegExp("((^|\\D)-\\d)|(-".concat(escapeRegExp(prefix), ")")); var isNegative = reg.test(transformedValue); var _k = RegExp("(\\d+)-?".concat(escapeRegExp(prefix))).exec(value) || [], prefixWithValue = _k[0], preValue = _k[1]; var withoutPrefix = prefix ? prefixWithValue ? transformedValue.replace(prefixWithValue, "").concat(preValue) : transformedValue.replace(prefix, "") : transformedValue; var withoutSeparators = removeSeparators(withoutPrefix, groupSeparator); var withoutInvalidChars = removeInvalidChars(withoutSeparators, __spreadArray([ groupSeparator, decimalSeparator ], abbreviations, true)); var valueOnly = withoutInvalidChars; if (!disableAbbreviations) { if (abbreviations.some(function(letter) { return letter === withoutInvalidChars.toLowerCase().replace(decimalSeparator, ""); })) { return ""; } var parsed = parseAbbrValue(withoutInvalidChars, decimalSeparator); if (parsed) { valueOnly = String(parsed); } } var includeNegative = isNegative && allowNegativeValue ? "-" : ""; if (decimalSeparator && valueOnly.includes(decimalSeparator)) { var _l = withoutInvalidChars.split(decimalSeparator), int = _l[0], decimals = _l[1]; var trimmedDecimals = decimalsLimit && decimals ? decimals.slice(0, decimalsLimit) : decimals; var includeDecimals = allowDecimals ? "".concat(decimalSeparator).concat(trimmedDecimals) : ""; return "".concat(includeNegative).concat(int).concat(includeDecimals); } return "".concat(includeNegative).concat(valueOnly); }; var fixedDecimalValue = function(value, decimalSeparator, fixedDecimalLength) { if (fixedDecimalLength !== void 0 && value.length > 1) { if (fixedDecimalLength === 0) { return value.replace(decimalSeparator, ""); } if (value.includes(decimalSeparator)) { var _a = value.split(decimalSeparator), int = _a[0], decimals = _a[1]; if (decimals.length === fixedDecimalLength) { return value; } if (decimals.length > fixedDecimalLength) { return "".concat(int).concat(decimalSeparator).concat(decimals.slice(0, fixedDecimalLength)); } } var reg = value.length > fixedDecimalLength ? new RegExp("(\\d+)(\\d{".concat(fixedDecimalLength, "})")) : new RegExp("(\\d)(\\d+)"); var match = value.match(reg); if (match) { var int = match[1], decimals = match[2]; return "".concat(int).concat(decimalSeparator).concat(decimals); } } return value; }; var getSuffix = function(value, _a) { var _b = _a.groupSeparator, groupSeparator = _b === void 0 ? "," : _b, _c = _a.decimalSeparator, decimalSeparator = _c === void 0 ? "." : _c; var suffixReg = new RegExp("\\d([^".concat(escapeRegExp(groupSeparator)).concat(escapeRegExp(decimalSeparator), "0-9]+)")); var suffixMatch = value.match(suffixReg); return suffixMatch ? suffixMatch[1] : void 0; }; var formatValue = function(options) { var _value = options.value, decimalSeparator = options.decimalSeparator, intlConfig = options.intlConfig, decimalScale = options.decimalScale, _a = options.prefix, prefix = _a === void 0 ? "" : _a, _b = options.suffix, suffix = _b === void 0 ? "" : _b; if (_value === "" || _value === void 0) { return ""; } if (_value === "-") { return "-"; } var isNegative = new RegExp("^\\d?-".concat(prefix ? "".concat(escapeRegExp(prefix), "?") : "", "\\d")).test(_value); var value = decimalSeparator !== "." ? replaceDecimalSeparator(_value, decimalSeparator, isNegative) : _value; if (decimalSeparator && decimalSeparator !== "-" && value.startsWith(decimalSeparator)) { value = "0" + value; } var _c = intlConfig || {}, locale = _c.locale, currency = _c.currency, formatOptions = __rest$1(_c, ["locale", "currency"]); var defaultNumberFormatOptions = __assign(__assign({}, formatOptions), { minimumFractionDigits: decimalScale || 0, maximumFractionDigits: 20 }); var numberFormatter = intlConfig ? new Intl.NumberFormat(locale, __assign(__assign({}, defaultNumberFormatOptions), currency && { style: "currency", currency })) : new Intl.NumberFormat(void 0, defaultNumberFormatOptions); var parts = numberFormatter.formatToParts(Number(value)); var formatted = replaceParts(parts, options); var intlSuffix = getSuffix(formatted, __assign({}, options)); var includeDecimalSeparator = _value.slice(-1) === decimalSeparator ? decimalSeparator : ""; var _d = value.match(RegExp("\\d+\\.(\\d+)")) || [], decimals = _d[1]; if (decimalScale === void 0 && decimals && decimalSeparator) { if (formatted.includes(decimalSeparator)) { formatted = formatted.replace(RegExp("(\\d+)(".concat(escapeRegExp(decimalSeparator), ")(\\d+)"), "g"), "$1$2".concat(decimals)); } else { if (intlSuffix && !suffix) { formatted = formatted.replace(intlSuffix, "".concat(decimalSeparator).concat(decimals).concat(intlSuffix)); } else { formatted = "".concat(formatted).concat(decimalSeparator).concat(decimals); } } } if (suffix && includeDecimalSeparator) { return "".concat(formatted).concat(includeDecimalSeparator).concat(suffix); } if (intlSuffix && includeDecimalSeparator) { return formatted.replace(intlSuffix, "".concat(includeDecimalSeparator).concat(intlSuffix)); } if (intlSuffix && suffix) { return formatted.replace(intlSuffix, "".concat(includeDecimalSeparator).concat(suffix)); } return [formatted, includeDecimalSeparator, suffix].join(""); }; var replaceDecimalSeparator = function(value, decimalSeparator, isNegative) { var newValue = value; if (decimalSeparator && decimalSeparator !== ".") { newValue = newValue.replace(RegExp(escapeRegExp(decimalSeparator), "g"), "."); if (isNegative && decimalSeparator === "-") { newValue = "-".concat(newValue.slice(1)); } } return newValue; }; var replaceParts = function(parts, _a) { var prefix = _a.prefix, groupSeparator = _a.groupSeparator, decimalSeparator = _a.decimalSeparator, decimalScale = _a.decimalScale, _b = _a.disableGroupSeparators, disableGroupSeparators = _b === void 0 ? false : _b; return parts.reduce(function(prev, _a2, i) { var type = _a2.type, value = _a2.value; if (i === 0 && prefix) { if (type === "minusSign") { return [value, prefix]; } if (type === "currency") { return __spreadArray(__spreadArray([], prev, true), [prefix], false); } return [prefix, value]; } if (type === "currency") { return prefix ? prev : __spreadArray(__spreadArray([], prev, true), [value], false); } if (type === "group") { return !disableGroupSeparators ? __spreadArray(__spreadArray([], prev, true), [groupSeparator !== void 0 ? groupSeparator : value], false) : prev; } if (type === "decimal") { if (decimalScale !== void 0 && decimalScale === 0) { return prev; } return __spreadArray(__spreadArray([], prev, true), [decimalSeparator !== void 0 ? decimalSeparator : value], false); } if (type === "fraction") { return __spreadArray(__spreadArray([], prev, true), [decimalScale !== void 0 ? value.slice(0, decimalScale) : value], false); } return __spreadArray(__spreadArray([], prev, true), [value], false); }, [""]).join(""); }; var defaultConfig = { currencySymbol: "", groupSeparator: "", decimalSeparator: "", prefix: "", suffix: "" }; var getLocaleConfig = function(intlConfig) { var _a = intlConfig || {}, locale = _a.locale, currency = _a.currency, formatOptions = __rest$1(_a, ["locale", "currency"]); var numberFormatter = locale ? new Intl.NumberFormat(locale, __assign(__assign({}, formatOptions), currency && { currency, style: "currency" })) : new Intl.NumberFormat(); return numberFormatter.formatToParts(1000.1).reduce(function(prev, curr, i) { if (curr.type === "currency") { if (i === 0) { return __assign(__assign({}, prev), { currencySymbol: curr.value, prefix: curr.value }); } else { return __assign(__assign({}, prev), { currencySymbol: curr.value, suffix: curr.value }); } } if (curr.type === "group") { return __assign(__assign({}, prev), { groupSeparator: curr.value }); } if (curr.type === "decimal") { return __assign(__assign({}, prev), { decimalSeparator: curr.value }); } return prev; }, defaultConfig); }; var isNumber = function(input) { return RegExp(/\d/, "gi").test(input); }; var padTrimValue = function(value, decimalSeparator, decimalScale) { if (decimalScale === void 0 || decimalSeparator === "" || decimalSeparator === void 0 || value === "" || value === void 0) { return value; } if (!value.match(/\d/g)) { return ""; } var _a = value.split(decimalSeparator), int = _a[0], decimals = _a[1]; if (decimalScale === 0) { return int; } var newValue = decimals || ""; if (newValue.length < decimalScale) { while (newValue.length < decimalScale) { newValue += "0"; } } else { newValue = newValue.slice(0, decimalScale); } return "".concat(int).concat(decimalSeparator).concat(newValue); }; var repositionCursor = function(_a) { var selectionStart = _a.selectionStart, value = _a.value, lastKeyStroke = _a.lastKeyStroke, stateValue = _a.stateValue, groupSeparator = _a.groupSeparator; var cursorPosition = selectionStart; var modifiedValue = value; if (stateValue && cursorPosition) { var splitValue = value.split(""); if (lastKeyStroke === "Backspace" && stateValue[cursorPosition] === groupSeparator) { splitValue.splice(cursorPosition - 1, 1); cursorPosition -= 1; } if (lastKeyStroke === "Delete" && stateValue[cursorPosition] === groupSeparator) { splitValue.splice(cursorPosition, 1); cursorPosition += 1; } modifiedValue = splitValue.join(""); return { modifiedValue, cursorPosition }; } return { modifiedValue, cursorPosition: selectionStart }; }; var CurrencyInput$1 = forwardRef(function(_a, ref) { var _b = _a.allowDecimals, allowDecimals = _b === void 0 ? true : _b, _c = _a.allowNegativeValue, allowNegativeValue = _c === void 0 ? true : _c, id = _a.id, name = _a.name, className = _a.className, customInput = _a.customInput, decimalsLimit = _a.decimalsLimit, defaultValue = _a.defaultValue, _d = _a.disabled, disabled = _d === void 0 ? false : _d, userMaxLength = _a.maxLength, userValue = _a.value, onValueChange = _a.onValueChange, fixedDecimalLength = _a.fixedDecimalLength, placeholder = _a.placeholder, decimalScale = _a.decimalScale, prefix = _a.prefix, suffix = _a.suffix, intlConfig = _a.intlConfig, step = _a.step, min = _a.min, max = _a.max, _e = _a.disableGroupSeparators, disableGroupSeparators = _e === void 0 ? false : _e, _f = _a.disableAbbreviations, disableAbbreviations = _f === void 0 ? false : _f, _decimalSeparator = _a.decimalSeparator, _groupSeparator = _a.groupSeparator, onChange2 = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, onKeyDown2 = _a.onKeyDown, onKeyUp = _a.onKeyUp, transformRawValue = _a.transformRawValue, _g = _a.formatValueOnBlur, formatValueOnBlur = _g === void 0 ? true : _g, props = __rest$1(_a, ["allowDecimals", "allowNegativeValue", "id", "name", "className", "customInput", "decimalsLimit", "defaultValue", "disabled", "maxLength", "value", "onValueChange", "fixedDecimalLength", "placeholder", "decimalScale", "prefix", "suffix", "intlConfig", "step", "min", "max", "disableGroupSeparators", "disableAbbreviations", "decimalSeparator", "groupSeparator", "onChange", "onFocus", "onBlur", "onKeyDown", "onKeyUp", "transformRawValue", "formatValueOnBlur"]); if (_decimalSeparator && isNumber(_decimalSeparator)) { throw new Error("decimalSeparator cannot be a number"); } if (_groupSeparator && isNumber(_groupSeparator)) { throw new Error("groupSeparator cannot be a number"); } var localeConfig = useMemo(function() { return getLocaleConfig(intlConfig); }, [intlConfig]); var decimalSeparator = _decimalSeparator || localeConfig.decimalSeparator || ""; var groupSeparator = _groupSeparator || localeConfig.groupSeparator || ""; if (decimalSeparator && groupSeparator && decimalSeparator === groupSeparator && disableGroupSeparators === false) { throw new Error("decimalSeparator cannot be the same as groupSeparator"); } var formatValueOptions = { decimalSeparator, groupSeparator, disableGroupSeparators, intlConfig, prefix: prefix || localeConfig.prefix, suffix }; var cleanValueOptions = { decimalSeparator, groupSeparator, allowDecimals, decimalsLimit: decimalsLimit || fixedDecimalLength || 2, allowNegativeValue, disableAbbreviations, prefix: prefix || localeConfig.prefix, transformRawValue }; var _h = useState(function() { return defaultValue != null ? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale, value: String(defaultValue) })) : userValue != null ? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale, value: String(userValue) })) : ""; }), stateValue = _h[0], setStateValue = _h[1]; var _j = useState(false), dirty = _j[0], setDirty = _j[1]; var _k = useState(0), cursor = _k[0], setCursor = _k[1]; var _l = useState(0), changeCount = _l[0], setChangeCount = _l[1]; var _m = useState(null), lastKeyStroke = _m[0], setLastKeyStroke = _m[1]; var inputRef = useRef(null); useImperativeHandle(ref, function() { return inputRef.current; }); var processChange = function(value, selectionStart) { setDirty(true); var _a2 = repositionCursor({ selectionStart, value, lastKeyStroke, stateValue, groupSeparator }), modifiedValue = _a2.modifiedValue, cursorPosition = _a2.cursorPosition; var stringValue = cleanValue(__assign({ value: modifiedValue }, cleanValueOptions)); if (userMaxLength && stringValue.replace(/-/g, "").length > userMaxLength) { return; } if (stringValue === "" || stringValue === "-" || stringValue === decimalSeparator) { onValueChange && onValueChange(void 0, name, { float: null, formatted: "", value: "" }); setStateValue(stringValue); setCursor(1); return; } var stringValueWithoutSeparator = decimalSeparator ? stringValue.replace(decimalSeparator, ".") : stringValue; var numberValue = parseFloat(stringValueWithoutSeparator); var formattedValue = formatValue(__assign({ value: stringValue }, formatValueOptions)); if (cursorPosition != null) { var newCursor = cursorPosition + (formattedValue.length - value.length); newCursor = newCursor <= 0 ? prefix ? prefix.length : 0 : newCursor; setCursor(newCursor); setChangeCount(changeCount + 1); } setStateValue(formattedValue); if (onValueChange) { var values = { float: numberValue, formatted: formattedValue, value: stringValue }; onValueChange(stringValue, name, values); } }; var handleOnChange = function(event) { var _a2 = event.target, value = _a2.value, selectionStart = _a2.selectionStart; processChange(value, selectionStart); onChange2 && onChange2(event); }; var handleOnFocus = function(event) { onFocus && onFocus(event); return stateValue ? stateValue.length : 0; }; var handleOnBlur = function(event) { var value = event.target.value; var valueOnly = cleanValue(__assign({ value }, cleanValueOptions)); if (valueOnly === "-" || valueOnly === decimalSeparator || !valueOnly) { setStateValue(""); onBlur && onBlur(event); return; } var fixedDecimals = fixedDecimalValue(valueOnly, decimalSeparator, fixedDecimalLength); var newValue = padTrimValue(fixedDecimals, decimalSeparator, decimalScale !== void 0 ? decimalScale : fixedDecimalLength); var stringValueWithoutSeparator = decimalSeparator ? newValue.replace(decimalSeparator, ".") : newValue; var numberValue = parseFloat(stringValueWithoutSeparator); var formattedValue = formatValue(__assign(__assign({}, formatValueOptions), { value: newValue })); if (onValueChange && formatValueOnBlur) { onValueChange(newValue, name, { float: numberValue, formatted: formattedValue, value: newValue }); } setStateValue(formattedValue); onBlur && onBlur(event); }; var handleOnKeyDown = function(event) { var key = event.key; setLastKeyStroke(key); if (step && (key === "ArrowUp" || key === "ArrowDown")) { event.preventDefault(); setCursor(stateValue.length); var stringValue = userValue != null ? String(userValue) : void 0; var stringValueWithoutSeparator = decimalSeparator && stringValue ? stringValue.replace(decimalSeparator, ".") : stringValue; var currentValue = parseFloat(stringValueWithoutSeparator != null ? stringValueWithoutSeparator : cleanValue(__assign({ value: stateValue }, cleanValueOptions))) || 0; var newValue = key === "ArrowUp" ? currentValue + step : currentValue - step; if (min !== void 0 && newValue < Number(min) || !allowNegativeValue && newValue < 0) { return; } if (max !== void 0 && newValue > Number(max)) { return; } var fixedLength = String(step).includes(".") ? Number(String(step).split(".")[1].length) : void 0; processChange(String(fixedLength ? newValue.toFixed(fixedLength) : newValue).replace(".", decimalSeparator)); } onKeyDown2 && onKeyDown2(event); }; var handleOnKeyUp = function(event) { var key = event.key, selectionStart = event.currentTarget.selectionStart; if (key !== "ArrowUp" && key !== "ArrowDown" && stateValue !== "-") { var suffix_1 = getSuffix(stateValue, { groupSeparator, decimalSeparator }); if (suffix_1 && selectionStart && selectionStart > stateValue.length - suffix_1.length) { if (inputRef.current) { var newCursor = stateValue.length - suffix_1.length; inputRef.current.setSelectionRange(newCursor, newCursor); } } } onKeyUp && onKeyUp(event); }; useEffect(function() { if (userValue == null && defaultValue == null) { setStateValue(""); } }, [defaultValue, userValue]); useEffect(function() { if (dirty && stateValue !== "-" && inputRef.current && document.activeElement === inputRef.current) { inputRef.current.setSelectionRange(cursor, cursor); } }, [stateValue, cursor, inputRef, dirty, changeCount]); var getRenderValue = function() { if (userValue != null && stateValue !== "-" && (!decimalSeparator || stateValue !== decimalSeparator)) { return formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: dirty ? void 0 : decimalScale, value: String(userValue) })); } return stateValue; }; var inputProps = __assign({ type: "text", inputMode: "decimal", id, name, className, onChange: handleOnChange, onBlur: handleOnBlur, onFocus: handleOnFocus, onKeyDown: handleOnKeyDown, onKeyUp: handleOnKeyUp, placeholder, disabled, value: getRenderValue(), ref: inputRef }, props); if (customInput) { var CustomInput = customInput; return React__default.createElement(CustomInput, __assign({}, inputProps)); } return React__default.createElement("input", __assign({}, inputProps)); }); CurrencyInput$1.displayName = "CurrencyInput"; const CurrencyInput = ({ id, value, prefix, placeholder, onChange: onChange2, className, readOnly }) => { return /* @__PURE__ */ jsx( CurrencyInput$1, { id, type: "text", prefix, decimalsLimit: 2, value, placeholder, className, onValueChange: onChange2, readOnly } ); }; function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$1(o); } function toPrimitive(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } function toPropertyKey(t) { var i = toPrimitive(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; } function _defineProperty$4(e, r, t) { return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } function getDefaultExportFromCjs$1(x) { return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x; } var invariant_1; var hasRequiredInvariant; function requireInvariant() { if (hasRequiredInvariant) return invariant_1; hasRequiredInvariant = 1; var NODE_ENV = process.env.NODE_ENV; var invariant2 = function invariant3(condition, format2, a, b, c, d, e, f) { if (NODE_ENV !== "production") { if (format2 === void 0) { throw new Error("invariant requires an error message argument"); } } if (!condition) { var error; if (format2 === void 0) { error = new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings."); } else { var args = [a, b, c, d, e, f]; var argIndex = 0; error = new Error(format2.replace(/%s/g, function() { return args[argIndex++]; })); error.name = "Invariant Violation"; } error.framesToPop = 1; throw error; } }; invariant_1 = invariant2; return invariant_1; } var invariantExports = requireInvariant(); var invariant = /* @__PURE__ */ getDefaultExportFromCjs$1(invariantExports); var MapContext = createContext(null); function useGoogleMap() { invariant(!!useContext, "useGoogleMap is React hook and requires React version 16.8+"); var map = useContext(MapContext); invariant(!!map, "useGoogleMap needs a GoogleMap available up in the tree"); return map; } function reduce(obj, fn, acc) { return Object.keys(obj).reduce(function reducer(newAcc, key) { return fn(newAcc, obj[key], key); }, acc); } function forEach(obj, fn) { Object.keys(obj).forEach((key) => { return fn(obj[key], key); }); } function applyUpdaterToNextProps(updaterMap2, prevProps, nextProps, instance) { var map = {}; var iter = (fn, key) => { var nextValue = nextProps[key]; if (nextValue !== prevProps[key]) { map[key] = nextValue; fn(instance, nextValue); } }; forEach(updaterMap2, iter); return map; } function registerEvents(props, instance, eventMap2) { var registeredList = reduce(eventMap2, function reducer(acc, googleEventName, onEventName) { if (typeof props[onEventName] === "function") { acc.push(google.maps.event.addListener(instance, googleEventName, props[onEventName])); } return acc; }, []); return registeredList; } function unregisterEvent(registered) { google.maps.event.removeListener(registered); } function unregisterEvents() { var events = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; events.forEach(unregisterEvent); } function applyUpdatersToPropsAndRegisterEvents(_ref) { var { updaterMap: updaterMap2, eventMap: eventMap2, prevProps, nextProps, instance } = _ref; var registeredEvents = registerEvents(nextProps, instance, eventMap2); applyUpdaterToNextProps(updaterMap2, prevProps, nextProps, instance); return registeredEvents; } function GoogleMapFunctional(_ref) { var { children, options, id, mapContainerStyle, mapContainerClassName, center, // clickableIcons, // extraMapTypes, // heading, // mapTypeId, onClick, onDblClick, onDrag, onDragEnd, onDragStart, onMouseMove, onMouseOut, onMouseOver, onMouseDown, onMouseUp, onRightClick, // onMapTypeIdChanged, // onTilesLoaded, // onBoundsChanged, onCenterChanged, // onHeadingChanged, // onIdle, // onProjectionChanged, // onResize, // onTiltChanged, // onZoomChanged, onLoad, onUnmount } = _ref; var [map, setMap] = useState(null); var ref = useRef(null); var [centerChangedListener, setCenterChangedListener] = useState(null); var [dblclickListener, setDblclickListener] = useState(null); var [dragendListener, setDragendListener] = useState(null); var [dragstartListener, setDragstartListener] = useState(null); var [mousedownListener, setMousedownListener] = useState(null); var [mousemoveListener, setMousemoveListener] = useState(null); var [mouseoutListener, setMouseoutListener] = useState(null); var [mouseoverListener, setMouseoverListener] = useState(null); var [mouseupListener, setMouseupListener] = useState(null); var [rightclickListener, setRightclickListener] = useState(null); var [clickListener, setClickListener] = useState(null); var [dragListener, setDragListener] = useState(null); useEffect(() => { if (options && map !== null) { map.setOptions(options); } }, [map, options]); useEffect(() => { if (map !== null && typeof center !== "undefined") { map.setCenter(center); } }, [map, center]); useEffect(() => { if (map && onDblClick) { if (dblclickListener !== null) { google.maps.event.removeListener(dblclickListener); } setDblclickListener(google.maps.event.addListener(map, "dblclick", onDblClick)); } }, [onDblClick]); useEffect(() => { if (map && onDragEnd) { if (dragendListener !== null) { google.maps.event.removeListener(dragendListener); } setDragendListener(google.maps.event.addListener(map, "dragend", onDragEnd)); } }, [onDragEnd]); useEffect(() => { if (map && onDragStart) { if (dragstartListener !== null) { google.maps.event.removeListener(dragstartListener); } setDragstartListener(google.maps.event.addListener(map, "dragstart", onDragStart)); } }, [onDragStart]); useEffect(() => { if (map && onMouseDown) { if (mousedownListener !== null) { google.maps.event.removeListener(mousedownListener); } setMousedownListener(google.maps.event.addListener(map, "mousedown", onMouseDown)); } }, [onMouseDown]); useEffect(() => { if (map && onMouseMove) { if (mousemoveListener !== null) { google.maps.event.removeListener(mousemoveListener); } setMousemoveListener(google.maps.event.addListener(map, "mousemove", onMouseMove)); } }, [onMouseMove]); useEffect(() => { if (map && onMouseOut) { if (mouseoutListener !== null) { google.maps.event.removeListener(mouseoutListener); } setMouseoutListener(google.maps.event.addListener(map, "mouseout", onMouseOut)); } }, [onMouseOut]); useEffect(() => { if (map && onMouseOver) { if (mouseoverListener !== null) { google.maps.event.removeListener(mouseoverListener); } setMouseoverListener(google.maps.event.addListener(map, "mouseover", onMouseOver)); } }, [onMouseOver]); useEffect(() => { if (map && onMouseUp) { if (mouseupListener !== null) { google.maps.event.removeListener(mouseupListener); } setMouseupListener(google.maps.event.addListener(map, "mouseup", onMouseUp)); } }, [onMouseUp]); useEffect(() => { if (map && onRightClick) { if (rightclickListener !== null) { google.maps.event.removeListener(rightclickListener); } setRightclickListener(google.maps.event.addListener(map, "rightclick", onRightClick)); } }, [onRightClick]); useEffect(() => { if (map && onClick) { if (clickListener !== null) { google.maps.event.removeListener(clickListener); } setClickListener(google.maps.event.addListener(map, "click", onClick)); } }, [onClick]); useEffect(() => { if (map && onDrag) { if (dragListener !== null) { google.maps.event.removeListener(dragListener); } setDragListener(google.maps.event.addListener(map, "drag", onDrag)); } }, [onDrag]); useEffect(() => { if (map && onCenterChanged) { if (centerChangedListener !== null) { google.maps.event.removeListener(centerChangedListener); } setCenterChangedListener(google.maps.event.addListener(map, "center_changed", onCenterChanged)); } }, [onClick]); useEffect(() => { var map2 = ref.current === null ? null : new google.maps.Map(ref.current, options); setMap(map2); if (map2 !== null && onLoad) { onLoad(map2); } return () => { if (map2 !== null) { if (onUnmount) { onUnmount(map2); } } }; }, []); return jsx("div", { id, ref, style: mapContainerStyle, className: mapContainerClassName, children: jsx(MapContext.Provider, { value: map, children: map !== null ? children : null }) }); } memo(GoogleMapFunctional); function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n2) { return void e(n2); } i.done ? t(u) : Promise.resolve(u).then(r, o); } function _asyncToGenerator(n) { return function() { var t = this, e = arguments; return new Promise(function(r, o) { var a = n.apply(t, e); function _next(n2) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n2); } function _throw(n2) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n2); } _next(void 0); }); }; } function makeLoadScriptUrl(_ref) { var { googleMapsApiKey, googleMapsClientId, version = "weekly", language, region, libraries, channel, mapIds, authReferrerPolicy, apiUrl = "https://maps.googleapis.com" } = _ref; var params = []; invariant(googleMapsApiKey && googleMapsClientId || !(googleMapsApiKey && googleMapsClientId), "You need to specify either googleMapsApiKey or googleMapsClientId for @react-google-maps/api load script to work. You cannot use both at the same time."); if (googleMapsApiKey) { params.push("key=".concat(googleMapsApiKey)); } else if (googleMapsClientId) { params.push("client=".concat(googleMapsClientId)); } if (version) { params.push("v=".concat(version)); } if (language) { params.push("language=".concat(language)); } if (region) { params.push("region=".concat(region)); } if (libraries && libraries.length) { params.push("libraries=".concat(libraries.sort().join(","))); } if (channel) { params.push("channel=".concat(channel)); } if (mapIds && mapIds.length) { params.push("map_ids=".concat(mapIds.join(","))); } if (authReferrerPolicy) { params.push("auth_referrer_policy=".concat(authReferrerPolicy)); } params.push("loading=async"); params.push("callback=initMap"); return "".concat(apiUrl, "/maps/api/js?").concat(params.join("&")); } var isBrowser = typeof document !== "undefined"; function injectScript(_ref) { var { url, id, nonce // eslint-disable-next-line @typescript-eslint/no-explicit-any } = _ref; if (!isBrowser) { return Promise.reject(new Error("document is undefined")); } return new Promise(function injectScriptCallback(resolve, reject) { var existingScript = document.getElementById(id); var windowWithGoogleMap = window; if (existingScript) { var dataStateAttribute = existingScript.getAttribute("data-state"); if (existingScript.src === url && dataStateAttribute !== "error") { if (dataStateAttribute === "ready") { return resolve(id); } else { var originalInitMap = windowWithGoogleMap.initMap; var originalErrorCallback = existingScript.onerror; windowWithGoogleMap.initMap = function initMap() { if (originalInitMap) { originalInitMap(); } resolve(id); }; existingScript.onerror = function(err) { if (originalErrorCallback) { originalErrorCallback(err); } reject(err); }; return; } } else { existingScript.remove(); } } var script = document.createElement("script"); script.type = "text/javascript"; script.src = url; script.id = id; script.async = true; script.nonce = nonce || ""; script.onerror = function onerror(err) { script.setAttribute("data-state", "error"); reject(err); }; windowWithGoogleMap.initMap = function onload() { script.setAttribute("data-state", "ready"); resolve(id); }; document.head.appendChild(script); }).catch((err) => { console.error("injectScript error: ", err); throw err; }); } function isGoogleFontStyle(element) { var href = element.href; if (href && (href.indexOf("https://fonts.googleapis.com/css?family=Roboto") === 0 || href.indexOf("https://fonts.googleapis.com/css?family=Google+Sans+Text") === 0)) { return true; } if ( // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.tagName.toLowerCase() === "style" && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.styleSheet && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.styleSheet.cssText && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.styleSheet.cssText.replace("\r\n", "").indexOf(".gm-style") === 0 ) { element.styleSheet.cssText = ""; return true; } if ( // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.tagName.toLowerCase() === "style" && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.innerHTML && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.innerHTML.replace("\r\n", "").indexOf(".gm-style") === 0 ) { element.innerHTML = ""; return true; } if ( // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore element.tagName.toLowerCase() === "style" && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore !element.styleSheet && // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore !element.innerHTML ) { return true; } return false; } function preventGoogleFonts() { var head = document.getElementsByTagName("head")[0]; if (head) { var trueInsertBefore = head.insertBefore.bind(head); head.insertBefore = function insertBefore(newElement, referenceElement) { if (!isGoogleFontStyle(newElement)) { Reflect.apply(trueInsertBefore, head, [newElement, referenceElement]); } return newElement; }; var trueAppend = head.appendChild.bind(head); head.appendChild = function appendChild(textNode) { if (!isGoogleFontStyle(textNode)) { Reflect.apply(trueAppend, head, [textNode]); } return textNode; }; } } var cleaningUp = false; function DefaultLoadingElement() { return jsx("div", { children: "Loading..." }); } var defaultLoadScriptProps = { id: "script-loader", version: "weekly" }; class LoadScript extends PureComponent { constructor() { super(...arguments); _defineProperty$4(this, "check", null); _defineProperty$4(this, "state", { loaded: false }); _defineProperty$4(this, "cleanupCallback", () => { delete window.google.maps; this.injectScript(); }); _defineProperty$4(this, "isCleaningUp", /* @__PURE__ */ _asyncToGenerator(function* () { function promiseCallback(resolve) { if (!cleaningUp) { resolve(); } else { if (isBrowser) { var timer = window.setInterval(function interval() { if (!cleaningUp) { window.clearInterval(timer); resolve(); } }, 1); } } return; } return new Promise(promiseCallback); })); _defineProperty$4(this, "cleanup", () => { cleaningUp = true; var script = document.getElementById(this.props.id); if (script && script.parentNode) { script.parentNode.removeChild(script); } Array.prototype.slice.call(document.getElementsByTagName("script")).filter(function filter(script2) { return typeof script2.src === "string" && script2.src.includes("maps.googleapis"); }).forEach(function forEach2(script2) { if (script2.parentNode) { script2.parentNode.removeChild(script2); } }); Array.prototype.slice.call(document.getElementsByTagName("link")).filter(function filter(link) { return link.href === "https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Google+Sans"; }).forEach(function forEach2(link) { if (link.parentNode) { link.parentNode.removeChild(link); } }); Array.prototype.slice.call(document.getElementsByTagName("style")).filter(function filter(style) { return style.innerText !== void 0 && style.innerText.length > 0 && style.innerText.includes(".gm-"); }).forEach(function forEach2(style) { if (style.parentNode) { style.parentNode.removeChild(style); } }); }); _defineProperty$4(this, "injectScript", () => { if (this.props.preventGoogleFontsLoading) { preventGoogleFonts(); } invariant(!!this.props.id, 'LoadScript requires "id" prop to be a string: %s', this.props.id); var injectScriptOptions = { id: this.props.id, nonce: this.props.nonce, url: makeLoadScriptUrl(this.props) }; injectScript(injectScriptOptions).then(() => { if (this.props.onLoad) { this.props.onLoad(); } this.setState(function setLoaded() { return { loaded: true }; }); return; }).catch((err) => { if (this.props.onError) { this.props.onError(err); } console.error("\n There has been an Error with loading Google Maps API script, please check that you provided correct google API key (".concat(this.props.googleMapsApiKey || "-", ") or Client ID (").concat(this.props.googleMapsClientId || "-", ") to <LoadScript />\n Otherwise it is a Network issue.\n ")); }); }); _defineProperty$4(this, "getRef", (el) => { this.check = el; }); } componentDidMount() { if (isBrowser) { if (window.google && window.google.maps && !cleaningUp) { console.error("google api is already presented"); return; } this.isCleaningUp().then(this.injectScript).catch(function error(err) { console.error("Error at injecting script after cleaning up: ", err); }); } } componentDidUpdate(prevProps) { if (this.props.libraries !== prevProps.libraries) { console.warn("Performance warning! LoadScript has been reloaded unintentionally! You should not pass `libraries` prop as new array. Please keep an array of libraries as static class property for Components and PureComponents, or just a const variable outside of component, or somewhere in config files or ENV variables"); } if (isBrowser && prevProps.language !== this.props.language) { this.cleanup(); this.setState(function setLoaded() { return { loaded: false }; }, this.cleanupCallback); } } componentWillUnmount() { if (isBrowser) { this.cleanup(); var timeoutCallback = () => { if (!this.check) { delete window.google; cleaningUp = false; } }; window.setTimeout(timeoutCallback, 1); if (this.props.onUnmount) { this.props.onUnmount(); } } } render() { return jsxs(Fragment, { children: [jsx("div", { ref: this.getRef }), this.state.loaded ? this.props.children : this.props.loadingElement || jsx(DefaultLoadingElement, {})] }); } } _defineProperty$4(LoadScript, "defaultProps", defaultLoadScriptProps); function _objectWithoutPropertiesLoose$6(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; } function _objectWithoutProperties$6(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose$6(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; } var previouslyLoadedUrl; function useLoadScript(_ref) { var { id = defaultLoadScriptProps.id, version = defaultLoadScriptProps.version, nonce, googleMapsApiKey, googleMapsClientId, language, region, libraries, preventGoogleFontsLoading, channel, mapIds, authReferrerPolicy, apiUrl = "https://maps.googleapis.com" } = _ref; var isMounted = useRef(false); var [isLoaded, setLoaded] = useState(false); var [loadError, setLoadError] = useState(void 0); useEffect(function trackMountedState() { isMounted.current = true; return () => { isMounted.current = false; }; }, []); useEffect(function applyPreventGoogleFonts() { if (isBrowser && preventGoogleFontsLoading) { preventGoogleFonts(); } }, [preventGoogleFontsLoading]); useEffect(function validateLoadedState() { if (isLoaded) { invariant(!!window.google, "useLoadScript was marked as loaded, but window.google is not present. Something went wrong."); } }, [isLoaded]); var url = makeLoadScriptUrl({ version, googleMapsApiKey, googleMapsClientId, language, region, libraries, channel, mapIds, authReferrerPolicy, apiUrl }); useEffect(function loadScriptAndModifyLoadedState() { if (!isBrowser) { return; } function setLoadedIfMounted() { if (isMounted.current) { setLoaded(true); previouslyLoadedUrl = url; } } if (window.google && window.google.maps && previouslyLoadedUrl === url) { setLoadedIfMounted(); return; } injectScript({ id, url, nonce }).then(setLoadedIfMounted).catch(function handleInjectError(err) { if (isMounted.current) { setLoadError(err); } console.warn("\n There has been an Error with loading Google Maps API script, please check that you provided correct google API key (".concat(googleMapsApiKey || "-", ") or Client ID (").concat(googleMapsClientId || "-", ")\n Otherwise it is a Network issue.\n ")); console.error(err); }); }, [id, url, nonce]); var prevLibraries = useRef(void 0); useEffect(function checkPerformance() { if (prevLibraries.current && libraries !== prevLibraries.current) { console.warn("Performance warning! LoadScript has been reloaded unintentionally! You should not pass `libraries` prop as new array. Please keep an array of libraries as static class property for Components and PureComponents, or just a const variable outside of component, or somewhere in config files or ENV variables"); } prevLibraries.current = libraries; }, [libraries]); return { isLoaded, loadError, url }; } var _excluded$1$1 = ["loadingElement", "onLoad", "onError", "onUnmount", "children"]; var defaultLoadingElement = jsx(DefaultLoadingElement, {}); function LoadScriptNext(_ref) { var { loadingElement, onLoad, onError, onUnmount, children } = _ref, hookOptions = _objectWithoutProperties$6(_ref, _excluded$1$1); var { isLoaded, loadError } = useLoadScript(hookOptions); useEffect(function handleOnLoad() { if (isLoaded && typeof onLoad === "function") { onLoad(); } }, [isLoaded, onLoad]); useEffect(function handleOnError() { if (loadError && typeof onError === "function") { onError(loadError); } }, [loadError, onError]); useEffect(function handleOnUnmount() { return () => { if (onUnmount) { onUnmount(); } }; }, [onUnmount]); return isLoaded ? children : loadingElement || defaultLoadingElement; } var LoadScriptNext$1 = memo(LoadScriptNext); typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) { var e = new Error(message); return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; var LoaderStatus; (function(LoaderStatus2) { LoaderStatus2[LoaderStatus2["INITIALIZED"] = 0] = "INITIALIZED"; LoaderStatus2[LoaderStatus2["LOADING"] = 1] = "LOADING"; LoaderStatus2[LoaderStatus2["SUCCESS"] = 2] = "SUCCESS"; LoaderStatus2[LoaderStatus2["FAILURE"] = 3] = "FAILURE"; })(LoaderStatus || (LoaderStatus = {})); function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function(r2) { return Object.getOwnPropertyDescriptor(e, r2).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), true).forEach(function(r2) { _defineProperty$4(e, r2, t[r2]); }) : Object.getOwnPr