@oneblink/apps-react 5.12.0-beta.10 → 5.12.0-beta.11

package/dist/components/receipts/ReceiptList.js

@@ -1,11 +1,12 @@
 import * as React from 'react';
 import clsx from 'clsx';
+import MaterialIcon from '../MaterialIcon';
 function ReceiptList({ successIconClassName, warningIconClassName, warningMessageClassName, warningMessage, children, }) {
     return (React.createElement("div", { className: "ob-list has-dividers has-shadow has-margin-bottom-4" },
         React.createElement("div", { className: "ob-list__item" },
             React.createElement("div", { className: "ob-list__content-wrapper" },
-                React.createElement("div", { className: "ob-list__content" }, !warningMessage ? (React.createElement("i", { className: clsx('material-icons has-text-centered has-text-success icon-x-large', successIconClassName) }, "check_circle_outline")) : (React.createElement(React.Fragment, null,
-                    React.createElement("i", { className: clsx('material-icons has-text-centered has-text-danger icon-x-large', warningIconClassName) }, "warning"),
+                React.createElement("div", { className: "ob-list__content" }, !warningMessage ? (React.createElement(MaterialIcon, { className: clsx('has-text-centered has-text-success icon-x-large', successIconClassName) }, "check_circle_outline")) : (React.createElement(React.Fragment, null,
+                    React.createElement(MaterialIcon, { className: clsx('has-text-centered has-text-danger icon-x-large', warningIconClassName) }, "warning"),
                     React.createElement("p", { className: clsx('has-text-centered', warningMessageClassName) }, warningMessage)))))),
         children));
 }

package/dist/components/receipts/ReceiptList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReceiptList.js","sourceRoot":"","sources":["../../../src/components/receipts/ReceiptList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AAUvB,SAAS,WAAW,CAAC,EACnB,oBAAoB,EACpB,oBAAoB,EACpB,uBAAuB,EACvB,cAAc,EACd,QAAQ,GACF;IACN,OAAO,CACL,6BAAK,SAAS,EAAC,qDAAqD;QAClE,6BAAK,SAAS,EAAC,eAAe;YAC5B,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,6BAAK,SAAS,EAAC,kBAAkB,IAC9B,CAAC,cAAc,CAAC,CAAC,CAAC,CACjB,2BACE,SAAS,EAAE,IAAI,CACb,gEAAgE,EAChE,oBAAoB,CACrB,2BAGC,CACL,CAAC,CAAC,CAAC,CACF;oBACE,2BACE,SAAS,EAAE,IAAI,CACb,+DAA+D,EAC/D,oBAAoB,CACrB,cAGC;oBAEJ,2BACE,SAAS,EAAE,IAAI,CAAC,mBAAmB,EAAE,uBAAuB,CAAC,IAE5D,cAAc,CACb,CACH,CACJ,CACG,CACF,CACF;QACL,QAAQ,CACL,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\n\ntype Props = {\n  successIconClassName: string\n  warningIconClassName?: string\n  warningMessageClassName?: string\n  warningMessage?: string\n  children: React.ReactNode\n}\n\nfunction ReceiptList({\n  successIconClassName,\n  warningIconClassName,\n  warningMessageClassName,\n  warningMessage,\n  children,\n}: Props) {\n  return (\n    <div className=\"ob-list has-dividers has-shadow has-margin-bottom-4\">\n      <div className=\"ob-list__item\">\n        <div className=\"ob-list__content-wrapper\">\n          <div className=\"ob-list__content\">\n            {!warningMessage ? (\n              <i\n                className={clsx(\n                  'material-icons has-text-centered has-text-success icon-x-large',\n                  successIconClassName,\n                )}\n              >\n                check_circle_outline\n              </i>\n            ) : (\n              <>\n                <i\n                  className={clsx(\n                    'material-icons has-text-centered has-text-danger icon-x-large',\n                    warningIconClassName,\n                  )}\n                >\n                  warning\n                </i>\n\n                <p\n                  className={clsx('has-text-centered', warningMessageClassName)}\n                >\n                  {warningMessage}\n                </p>\n              </>\n            )}\n          </div>\n        </div>\n      </div>\n      {children}\n    </div>\n  )\n}\n\nexport default React.memo(ReceiptList)\n"]}
+{"version":3,"file":"ReceiptList.js","sourceRoot":"","sources":["../../../src/components/receipts/ReceiptList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAU1C,SAAS,WAAW,CAAC,EACnB,oBAAoB,EACpB,oBAAoB,EACpB,uBAAuB,EACvB,cAAc,EACd,QAAQ,GACF;IACN,OAAO,CACL,6BAAK,SAAS,EAAC,qDAAqD;QAClE,6BAAK,SAAS,EAAC,eAAe;YAC5B,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,6BAAK,SAAS,EAAC,kBAAkB,IAC9B,CAAC,cAAc,CAAC,CAAC,CAAC,CACjB,oBAAC,YAAY,IACX,SAAS,EAAE,IAAI,CACb,iDAAiD,EACjD,oBAAoB,CACrB,2BAGY,CAChB,CAAC,CAAC,CAAC,CACF;oBACE,oBAAC,YAAY,IACX,SAAS,EAAE,IAAI,CACb,gDAAgD,EAChD,oBAAoB,CACrB,cAGY;oBAEf,2BACE,SAAS,EAAE,IAAI,CAAC,mBAAmB,EAAE,uBAAuB,CAAC,IAE5D,cAAc,CACb,CACH,CACJ,CACG,CACF,CACF;QACL,QAAQ,CACL,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport MaterialIcon from '../MaterialIcon'\n\ntype Props = {\n  successIconClassName: string\n  warningIconClassName?: string\n  warningMessageClassName?: string\n  warningMessage?: string\n  children: React.ReactNode\n}\n\nfunction ReceiptList({\n  successIconClassName,\n  warningIconClassName,\n  warningMessageClassName,\n  warningMessage,\n  children,\n}: Props) {\n  return (\n    <div className=\"ob-list has-dividers has-shadow has-margin-bottom-4\">\n      <div className=\"ob-list__item\">\n        <div className=\"ob-list__content-wrapper\">\n          <div className=\"ob-list__content\">\n            {!warningMessage ? (\n              <MaterialIcon\n                className={clsx(\n                  'has-text-centered has-text-success icon-x-large',\n                  successIconClassName,\n                )}\n              >\n                check_circle_outline\n              </MaterialIcon>\n            ) : (\n              <>\n                <MaterialIcon\n                  className={clsx(\n                    'has-text-centered has-text-danger icon-x-large',\n                    warningIconClassName,\n                  )}\n                >\n                  warning\n                </MaterialIcon>\n\n                <p\n                  className={clsx('has-text-centered', warningMessageClassName)}\n                >\n                  {warningMessage}\n                </p>\n              </>\n            )}\n          </div>\n        </div>\n      </div>\n      {children}\n    </div>\n  )\n}\n\nexport default React.memo(ReceiptList)\n"]}

package/dist/components/receipts/ReceiptListItem.js

@@ -1,10 +1,11 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import utilsService from '../../services/utils-service';
+import MaterialIcon from '../MaterialIcon';
 function ReceiptListItem({ className, valueClassName, icon, label, value, allowCopyToClipboard, }) {
     return (React.createElement("div", { className: clsx('ob-list__item', className) },
         !!icon && (React.createElement("div", { className: "ob-list__avatar" },
-            React.createElement("i", { className: "material-icons icon-medium" }, icon))),
+            React.createElement(MaterialIcon, { className: "icon-medium" }, icon))),
         React.createElement("div", { className: "ob-list__content-wrapper" },
             React.createElement("div", { className: "ob-list__content" },
                 React.createElement("div", { className: "ob-list__text-secondary" }, label),
@@ -12,7 +13,7 @@ function ReceiptListItem({ className, valueClassName, icon, label, value, allowC
         allowCopyToClipboard && (React.createElement("div", { className: "ob-list__actions" },
             React.createElement("button", { type: "button", className: "button ob-button ob-list__button is-small is-white tooltip has-tooltip-left", onClick: () => utilsService.copyToClipboard(value), "data-tooltip": "Copy to clipboard" },
                 React.createElement("span", { className: "icon has-text-grey" },
-                    React.createElement("i", { className: "material-icons icon-small ob-icon__copy has-text" }, "file_copy")))))));
+                    React.createElement(MaterialIcon, { className: "icon-small ob-icon__copy has-text" }, "file_copy")))))));
 }
 export default React.memo(ReceiptListItem);
 //# sourceMappingURL=ReceiptListItem.js.map

package/dist/components/receipts/ReceiptListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReceiptListItem.js","sourceRoot":"","sources":["../../../src/components/receipts/ReceiptListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,YAAY,MAAM,8BAA8B,CAAA;AAWvD,SAAS,eAAe,CAAC,EACvB,SAAS,EACT,cAAc,EACd,IAAI,EACJ,KAAK,EACL,KAAK,EACL,oBAAoB,GACd;IACN,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC;QAC7C,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,iBAAiB;YAC9B,2BAAG,SAAS,EAAC,4BAA4B,IAAE,IAAI,CAAK,CAChD,CACP;QACD,6BAAK,SAAS,EAAC,0BAA0B;YACvC,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,yBAAyB,IAAE,KAAK,CAAO;gBACtD,6BAAK,SAAS,EAAE,IAAI,CAAC,uBAAuB,EAAE,cAAc,CAAC,IAC1D,KAAK,CACF,CACF,CACF;QACL,oBAAoB,IAAI,CACvB,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,6EAA6E,EACvF,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,CAAC,kBACrC,mBAAmB;gBAEhC,8BAAM,SAAS,EAAC,oBAAoB;oBAClC,2BAAG,SAAS,EAAC,kDAAkD,gBAE3D,CACC,CACA,CACL,CACP,CACG,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport utilsService from '../../services/utils-service'\n\ntype Props = {\n  className: string\n  valueClassName: string\n  icon?: string\n  label: string\n  value: string\n  allowCopyToClipboard?: boolean\n}\n\nfunction ReceiptListItem({\n  className,\n  valueClassName,\n  icon,\n  label,\n  value,\n  allowCopyToClipboard,\n}: Props) {\n  return (\n    <div className={clsx('ob-list__item', className)}>\n      {!!icon && (\n        <div className=\"ob-list__avatar\">\n          <i className=\"material-icons icon-medium\">{icon}</i>\n        </div>\n      )}\n      <div className=\"ob-list__content-wrapper\">\n        <div className=\"ob-list__content\">\n          <div className=\"ob-list__text-secondary\">{label}</div>\n          <div className={clsx('ob-list__text-primary', valueClassName)}>\n            {value}\n          </div>\n        </div>\n      </div>\n      {allowCopyToClipboard && (\n        <div className=\"ob-list__actions\">\n          <button\n            type=\"button\"\n            className=\"button ob-button ob-list__button is-small is-white tooltip has-tooltip-left\"\n            onClick={() => utilsService.copyToClipboard(value)}\n            data-tooltip=\"Copy to clipboard\"\n          >\n            <span className=\"icon has-text-grey\">\n              <i className=\"material-icons icon-small ob-icon__copy has-text\">\n                file_copy\n              </i>\n            </span>\n          </button>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default React.memo(ReceiptListItem)\n"]}
+{"version":3,"file":"ReceiptListItem.js","sourceRoot":"","sources":["../../../src/components/receipts/ReceiptListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,YAAY,MAAM,8BAA8B,CAAA;AACvD,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAW1C,SAAS,eAAe,CAAC,EACvB,SAAS,EACT,cAAc,EACd,IAAI,EACJ,KAAK,EACL,KAAK,EACL,oBAAoB,GACd;IACN,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC;QAC7C,CAAC,CAAC,IAAI,IAAI,CACT,6BAAK,SAAS,EAAC,iBAAiB;YAC9B,oBAAC,YAAY,IAAC,SAAS,EAAC,aAAa,IAAE,IAAI,CAAgB,CACvD,CACP;QACD,6BAAK,SAAS,EAAC,0BAA0B;YACvC,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,yBAAyB,IAAE,KAAK,CAAO;gBACtD,6BAAK,SAAS,EAAE,IAAI,CAAC,uBAAuB,EAAE,cAAc,CAAC,IAC1D,KAAK,CACF,CACF,CACF;QACL,oBAAoB,IAAI,CACvB,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,6EAA6E,EACvF,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,CAAC,kBACrC,mBAAmB;gBAEhC,8BAAM,SAAS,EAAC,oBAAoB;oBAClC,oBAAC,YAAY,IAAC,SAAS,EAAC,mCAAmC,gBAE5C,CACV,CACA,CACL,CACP,CACG,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport utilsService from '../../services/utils-service'\nimport MaterialIcon from '../MaterialIcon'\n\ntype Props = {\n  className: string\n  valueClassName: string\n  icon?: string\n  label: string\n  value: string\n  allowCopyToClipboard?: boolean\n}\n\nfunction ReceiptListItem({\n  className,\n  valueClassName,\n  icon,\n  label,\n  value,\n  allowCopyToClipboard,\n}: Props) {\n  return (\n    <div className={clsx('ob-list__item', className)}>\n      {!!icon && (\n        <div className=\"ob-list__avatar\">\n          <MaterialIcon className=\"icon-medium\">{icon}</MaterialIcon>\n        </div>\n      )}\n      <div className=\"ob-list__content-wrapper\">\n        <div className=\"ob-list__content\">\n          <div className=\"ob-list__text-secondary\">{label}</div>\n          <div className={clsx('ob-list__text-primary', valueClassName)}>\n            {value}\n          </div>\n        </div>\n      </div>\n      {allowCopyToClipboard && (\n        <div className=\"ob-list__actions\">\n          <button\n            type=\"button\"\n            className=\"button ob-button ob-list__button is-small is-white tooltip has-tooltip-left\"\n            onClick={() => utilsService.copyToClipboard(value)}\n            data-tooltip=\"Copy to clipboard\"\n          >\n            <span className=\"icon has-text-grey\">\n              <MaterialIcon className=\"icon-small ob-icon__copy has-text\">\n                file_copy\n              </MaterialIcon>\n            </span>\n          </button>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default React.memo(ReceiptListItem)\n"]}

package/dist/components/renderer/AutocompleteDropdown.js

@@ -3,6 +3,7 @@ import clsx from 'clsx';
 import { Sentry } from '@oneblink/apps';
 import useBooleanState from '../../hooks/useBooleanState';
 import { LookupNotificationContext } from '../../hooks/useLookupNotification';
+import MaterialIcon from '../MaterialIcon';
 function AutocompleteDropdown({ id, label, value, placeholder, required, disabled, validationMessage, displayValidationMessage, searchDebounceMs, searchMinCharacters, isLoading, hasError, onChangeValue, onChangeLabel, onSearch, isDirty, setIsDirty, ...props }) {
     const optionsContainerElement = React.useRef(null);
     const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] = React.useState(0);
@@ -161,9 +162,9 @@ function AutocompleteDropdown({ id, label, value, placeholder, required, disable
                     }) },
                     React.createElement("input", { type: "text", placeholder: placeholder, id: id, autoComplete: "off", className: "cypress-autocomplete-control input ob-input", required: required, value: label, disabled: disabled, onFocus: onFocus, onBlur: () => handleBlur({ label, value }), onKeyDown: onKeyDown, onChange: handleChangeLabel, "aria-describedby": props['aria-describedby'] }),
                     isShowingValid && (React.createElement("span", { className: " ob-input-icon icon is-small is-right" },
-                        React.createElement("i", { className: "material-icons is-size-5 has-text-success" }, "check"))),
+                        React.createElement(MaterialIcon, { className: "is-size-5 has-text-success" }, "check"))),
                     isShowingError && (React.createElement("span", { className: " ob-input-icon icon is-small is-right" },
-                        React.createElement("i", { className: "material-icons is-size-5 has-text-danger" }, "error"))))),
+                        React.createElement(MaterialIcon, { className: "is-size-5 has-text-danger" }, "error"))))),
             React.createElement("div", { className: "dropdown-menu" },
                 React.createElement("div", { ref: optionsContainerElement, className: "ob-autocomplete__dropdown-content dropdown-content cypress-autocomplete-dropdown-content" }, error ? (React.createElement("a", { className: "dropdown-item cypress-autocomplete-error ob-autocomplete__drop-down-item-error" },
                     React.createElement("span", { className: "has-text-danger" }, error.message))) : label.length < searchMinCharacters ? (React.createElement("a", { className: "dropdown-item cypress-max-characters ob-autocomplete__drop-down-item-max-characters" },

package/dist/components/renderer/AutocompleteDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteDropdown.js","sourceRoot":"","sources":["../../../src/components/renderer/AutocompleteDropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Sentry } from '@oneblink/apps'\n\nimport useBooleanState from '../../hooks/useBooleanState'\nimport { IsDirtyProps } from '../../types/form'\nimport { LookupNotificationContext } from '../../hooks/useLookupNotification'\n\ntype AutocompleteOption<T> = {\n  label: string\n  value: string\n  data?: T\n}\n\ntype Props<T> = {\n  id: string\n  label: string\n  value: unknown | undefined\n  placeholder: string | undefined\n  required: boolean | undefined\n  disabled: boolean | undefined\n  isLoading?: boolean\n  hasError?: boolean\n  validationMessage: string | undefined\n  displayValidationMessage: boolean\n  searchDebounceMs: number\n  searchMinCharacters: number\n  onChangeValue: (\n    newValue: string | undefined,\n    data?: T,\n  ) => Promise<void> | void\n  onChangeLabel: (newLabel: string) => void\n  onSearch: (\n    label: string,\n    abortSignal: AbortSignal,\n  ) => Promise<AutocompleteOption<T>[]>\n  'aria-describedby'?: string\n} & IsDirtyProps\n\nfunction AutocompleteDropdown<T>({\n  id,\n  label,\n  value,\n  placeholder,\n  required,\n  disabled,\n  validationMessage,\n  displayValidationMessage,\n  searchDebounceMs,\n  searchMinCharacters,\n  isLoading,\n  hasError,\n  onChangeValue,\n  onChangeLabel,\n  onSearch,\n  isDirty,\n  setIsDirty,\n  ...props\n}: Props<T>) {\n  const optionsContainerElement = React.useRef<HTMLDivElement>(null)\n  const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] =\n    React.useState(0)\n  const [options, setOptions] = React.useState<AutocompleteOption<T>[]>([])\n  const [error, setError] = React.useState<Error | null>(null)\n  const [isFetchingOptions, setIsFetchingOptions] = React.useState(false)\n  const [isOpen, onOpen, onClose] = useBooleanState(false)\n\n  const onSelectOption = React.useCallback(\n    (option: AutocompleteOption<T>) => {\n      onChangeLabel(option.label)\n      onChangeValue(option.value, option.data)\n      onClose()\n    },\n    [onChangeLabel, onChangeValue, onClose],\n  )\n\n  const handleClickOption = React.useCallback(\n    (\n      event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n      option: AutocompleteOption<T>,\n    ) => {\n      console.log('Selected element option in autocomplete', option)\n\n      event.preventDefault()\n      event.stopPropagation()\n\n      onSelectOption(option)\n    },\n    [onSelectOption],\n  )\n\n  const onFocus = React.useCallback(() => {\n    setCurrentFocusedOptionIndex(0)\n    onOpen()\n  }, [onOpen])\n\n  // When moving away from the input, if this is no value remove\n  // the label to show the user they have not selected a value\n  const handleBlur = React.useCallback(\n    (inputOption: { label: string; value: unknown | undefined }) => {\n      setIsDirty()\n      setError(null)\n      onClose()\n\n      if (Array.isArray(options)) {\n        // If there is a label that resembles an option, set that option to be the new value.\n        // UNLESS it was the previously selected label. Else, clear the label and the value.\n        if (inputOption.label) {\n          const lowerCase = inputOption.label.toLowerCase()\n          const option = options.find(\n            (option) => option.label.toLowerCase() === lowerCase,\n          )\n          if (option) {\n            // If the new option is not equal to the option that is currently selected,\n            // we want to update to the new option to ensure that it gets changed.\n            if (inputOption.value !== option.value) {\n              console.log('Setting value after blurring away from autocomplete')\n              onSelectOption(option)\n            }\n            return\n          }\n        }\n\n        console.log('Removing label after blurring away from autocomplete')\n        onChangeValue(undefined)\n        onChangeLabel('')\n      }\n    },\n    [\n      onChangeLabel,\n      onChangeValue,\n      onClose,\n      onSelectOption,\n      options,\n      setIsDirty,\n    ],\n  )\n\n  const onKeyDown = React.useCallback<\n    React.KeyboardEventHandler<HTMLInputElement>\n  >(\n    (event) => {\n      if (!options) {\n        return\n      }\n      const enterPressed = event.keyCode === 13\n      const upArrowPressed = event.keyCode === 38\n      const downArrowPressed = event.keyCode === 40\n      if (!upArrowPressed && !downArrowPressed && !enterPressed) {\n        return\n      }\n\n      event.preventDefault()\n\n      const previousFocusedOptionIndex = currentFocusedOptionIndex\n      let nextFocusedOptionIndex = currentFocusedOptionIndex\n      if (upArrowPressed) {\n        nextFocusedOptionIndex = Math.max(0, currentFocusedOptionIndex - 1)\n      } else if (downArrowPressed) {\n        nextFocusedOptionIndex = Math.min(\n          options.length - 1,\n          currentFocusedOptionIndex + 1,\n        )\n      } else if (enterPressed) {\n        const option = options[nextFocusedOptionIndex]\n        if (option) {\n          onSelectOption(option)\n        }\n      }\n\n      // If the index has changed, need to ensure the active option is visible\n      if (\n        previousFocusedOptionIndex !== nextFocusedOptionIndex &&\n        optionsContainerElement.current\n      ) {\n        const activeStepElement = optionsContainerElement.current.querySelector(\n          `.ob-autocomplete__drop-down-item-${nextFocusedOptionIndex}`,\n        )\n        if (activeStepElement) {\n          activeStepElement.scrollIntoView({\n            behavior: 'smooth',\n            block: 'nearest',\n            inline: 'start',\n          })\n        }\n        setCurrentFocusedOptionIndex(nextFocusedOptionIndex)\n      }\n    },\n    [currentFocusedOptionIndex, options, onSelectOption],\n  )\n\n  const handleChangeLabel = React.useCallback<\n    React.ChangeEventHandler<HTMLInputElement>\n  >(\n    (e) => {\n      const newLabel = e.target.value\n      onOpen()\n      setCurrentFocusedOptionIndex(0)\n\n      onChangeLabel(newLabel)\n    },\n    [onChangeLabel, onOpen],\n  )\n\n  React.useEffect(() => {\n    setError(null)\n\n    if (!isOpen || label.length < searchMinCharacters) {\n      setIsFetchingOptions(false)\n      return\n    }\n\n    setIsFetchingOptions(true)\n\n    let ignore = false\n    const abortController = new AbortController()\n\n    const timeoutId = setTimeout(async () => {\n      let newOptions: AutocompleteOption<T>[] = []\n      let newError = null\n\n      try {\n        newOptions = await onSearch(label, abortController.signal)\n      } catch (error) {\n        // Cancelling will throw an error.\n        if (!abortController.signal.aborted) {\n          console.warn('Error while fetching autocomplete options', error)\n          Sentry.captureException(error)\n          newError = error as Error\n        }\n      }\n      if (!ignore) {\n        setError(newError)\n        setOptions(newOptions)\n        setIsFetchingOptions(false)\n      }\n    }, searchDebounceMs)\n\n    return () => {\n      ignore = true\n      clearTimeout(timeoutId)\n      abortController.abort()\n    }\n  }, [isOpen, label, onSearch, searchDebounceMs, searchMinCharacters])\n\n  React.useEffect(() => {\n    //If there is no value set, we want to clear the label\n    //This is to satisfy lookups that return undefined.\n    if (!value) {\n      onChangeLabel('')\n    }\n  }, [onChangeLabel, value])\n  const { isLookingUp } = React.useContext(LookupNotificationContext)\n\n  const isShowingLoading = isFetchingOptions || !!isLoading\n  const isShowingValid = !isShowingLoading && value !== undefined\n  const isShowingError = !isShowingLoading && !isLookingUp && !!hasError\n\n  return (\n    <>\n      <div\n        className={clsx('dropdown', {\n          'is-active': isOpen && Array.isArray(options),\n        })}\n      >\n        <div className=\"field\">\n          <div\n            className={clsx(\n              'cypress-autocomplete-field-control control is-expanded',\n              {\n                'is-loading': isShowingLoading,\n                'has-icons-right': isShowingValid || isShowingError,\n              },\n            )}\n          >\n            <input\n              type=\"text\"\n              placeholder={placeholder}\n              id={id}\n              autoComplete=\"off\"\n              className=\"cypress-autocomplete-control input ob-input\"\n              required={required}\n              value={label}\n              disabled={disabled}\n              onFocus={onFocus}\n              onBlur={() => handleBlur({ label, value })}\n              onKeyDown={onKeyDown}\n              onChange={handleChangeLabel}\n              aria-describedby={props['aria-describedby']}\n            />\n            {isShowingValid && (\n              <span className=\" ob-input-icon icon is-small is-right\">\n                <i className=\"material-icons is-size-5 has-text-success\">\n                  check\n                </i>\n              </span>\n            )}\n            {isShowingError && (\n              <span className=\" ob-input-icon icon is-small is-right\">\n                <i className=\"material-icons is-size-5 has-text-danger\">\n                  error\n                </i>\n              </span>\n            )}\n          </div>\n        </div>\n\n        <div className=\"dropdown-menu\">\n          <div\n            ref={optionsContainerElement}\n            className=\"ob-autocomplete__dropdown-content dropdown-content cypress-autocomplete-dropdown-content\"\n          >\n            {error ? (\n              <a className=\"dropdown-item cypress-autocomplete-error ob-autocomplete__drop-down-item-error\">\n                <span className=\"has-text-danger\">{error.message}</span>\n              </a>\n            ) : label.length < searchMinCharacters ? (\n              <a className=\"dropdown-item cypress-max-characters ob-autocomplete__drop-down-item-max-characters\">\n                <i>\n                  Enter at least {searchMinCharacters} character(s) to search\n                </i>\n              </a>\n            ) : isShowingLoading ? (\n              <a className=\"dropdown-item cypress-searching-options ob-autocomplete__drop-down-item-searching\">\n                <i>Searching...</i>\n              </a>\n            ) : options && options.length ? (\n              options.map((option, index) => (\n                <a\n                  key={option.value}\n                  className={clsx(\n                    `dropdown-item cypress-autocomplete-dropdown-item ob-autocomplete__drop-down-item-${index}`,\n                    {\n                      'is-active': currentFocusedOptionIndex === index,\n                    },\n                  )}\n                  onMouseDown={(e) => handleClickOption(e, option)}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{\n                    __html: highlightLabel(option.label, label),\n                  }}\n                />\n              ))\n            ) : (\n              <a className=\"dropdown-item cypress-no-matches-found ob-autocomplete__drop-down-item-no-matches\">\n                <i>No matches found</i>\n              </a>\n            )}\n          </div>\n        </div>\n      </div>\n\n      {(isDirty || displayValidationMessage) &&\n        !!validationMessage &&\n        !isShowingLoading && (\n          <div role=\"alert\" className=\"has-margin-top-8\">\n            <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n              {validationMessage}\n            </div>\n          </div>\n        )}\n    </>\n  )\n}\n\nexport default React.memo(AutocompleteDropdown) as typeof AutocompleteDropdown\n\nfunction highlightLabel(text: string, phrase: string) {\n  if (phrase) {\n    text = text.replace(\n      new RegExp(\n        '(' +\n          phrase.replace(\n            /[`~!@#$%^&*()_|+\\-=?;:'\",.<>{}[\\]\\\\/]/gi,\n            (char: string) => `\\\\${char}`,\n          ) +\n          ')',\n        'gi',\n      ),\n      '<b>$1</b>',\n    )\n  }\n\n  return text\n}\n"]}
+{"version":3,"file":"AutocompleteDropdown.js","sourceRoot":"","sources":["../../../src/components/renderer/AutocompleteDropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Sentry } from '@oneblink/apps'\n\nimport useBooleanState from '../../hooks/useBooleanState'\nimport { IsDirtyProps } from '../../types/form'\nimport { LookupNotificationContext } from '../../hooks/useLookupNotification'\nimport MaterialIcon from '../MaterialIcon'\n\ntype AutocompleteOption<T> = {\n  label: string\n  value: string\n  data?: T\n}\n\ntype Props<T> = {\n  id: string\n  label: string\n  value: unknown | undefined\n  placeholder: string | undefined\n  required: boolean | undefined\n  disabled: boolean | undefined\n  isLoading?: boolean\n  hasError?: boolean\n  validationMessage: string | undefined\n  displayValidationMessage: boolean\n  searchDebounceMs: number\n  searchMinCharacters: number\n  onChangeValue: (\n    newValue: string | undefined,\n    data?: T,\n  ) => Promise<void> | void\n  onChangeLabel: (newLabel: string) => void\n  onSearch: (\n    label: string,\n    abortSignal: AbortSignal,\n  ) => Promise<AutocompleteOption<T>[]>\n  'aria-describedby'?: string\n} & IsDirtyProps\n\nfunction AutocompleteDropdown<T>({\n  id,\n  label,\n  value,\n  placeholder,\n  required,\n  disabled,\n  validationMessage,\n  displayValidationMessage,\n  searchDebounceMs,\n  searchMinCharacters,\n  isLoading,\n  hasError,\n  onChangeValue,\n  onChangeLabel,\n  onSearch,\n  isDirty,\n  setIsDirty,\n  ...props\n}: Props<T>) {\n  const optionsContainerElement = React.useRef<HTMLDivElement>(null)\n  const [currentFocusedOptionIndex, setCurrentFocusedOptionIndex] =\n    React.useState(0)\n  const [options, setOptions] = React.useState<AutocompleteOption<T>[]>([])\n  const [error, setError] = React.useState<Error | null>(null)\n  const [isFetchingOptions, setIsFetchingOptions] = React.useState(false)\n  const [isOpen, onOpen, onClose] = useBooleanState(false)\n\n  const onSelectOption = React.useCallback(\n    (option: AutocompleteOption<T>) => {\n      onChangeLabel(option.label)\n      onChangeValue(option.value, option.data)\n      onClose()\n    },\n    [onChangeLabel, onChangeValue, onClose],\n  )\n\n  const handleClickOption = React.useCallback(\n    (\n      event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n      option: AutocompleteOption<T>,\n    ) => {\n      console.log('Selected element option in autocomplete', option)\n\n      event.preventDefault()\n      event.stopPropagation()\n\n      onSelectOption(option)\n    },\n    [onSelectOption],\n  )\n\n  const onFocus = React.useCallback(() => {\n    setCurrentFocusedOptionIndex(0)\n    onOpen()\n  }, [onOpen])\n\n  // When moving away from the input, if this is no value remove\n  // the label to show the user they have not selected a value\n  const handleBlur = React.useCallback(\n    (inputOption: { label: string; value: unknown | undefined }) => {\n      setIsDirty()\n      setError(null)\n      onClose()\n\n      if (Array.isArray(options)) {\n        // If there is a label that resembles an option, set that option to be the new value.\n        // UNLESS it was the previously selected label. Else, clear the label and the value.\n        if (inputOption.label) {\n          const lowerCase = inputOption.label.toLowerCase()\n          const option = options.find(\n            (option) => option.label.toLowerCase() === lowerCase,\n          )\n          if (option) {\n            // If the new option is not equal to the option that is currently selected,\n            // we want to update to the new option to ensure that it gets changed.\n            if (inputOption.value !== option.value) {\n              console.log('Setting value after blurring away from autocomplete')\n              onSelectOption(option)\n            }\n            return\n          }\n        }\n\n        console.log('Removing label after blurring away from autocomplete')\n        onChangeValue(undefined)\n        onChangeLabel('')\n      }\n    },\n    [\n      onChangeLabel,\n      onChangeValue,\n      onClose,\n      onSelectOption,\n      options,\n      setIsDirty,\n    ],\n  )\n\n  const onKeyDown = React.useCallback<\n    React.KeyboardEventHandler<HTMLInputElement>\n  >(\n    (event) => {\n      if (!options) {\n        return\n      }\n      const enterPressed = event.keyCode === 13\n      const upArrowPressed = event.keyCode === 38\n      const downArrowPressed = event.keyCode === 40\n      if (!upArrowPressed && !downArrowPressed && !enterPressed) {\n        return\n      }\n\n      event.preventDefault()\n\n      const previousFocusedOptionIndex = currentFocusedOptionIndex\n      let nextFocusedOptionIndex = currentFocusedOptionIndex\n      if (upArrowPressed) {\n        nextFocusedOptionIndex = Math.max(0, currentFocusedOptionIndex - 1)\n      } else if (downArrowPressed) {\n        nextFocusedOptionIndex = Math.min(\n          options.length - 1,\n          currentFocusedOptionIndex + 1,\n        )\n      } else if (enterPressed) {\n        const option = options[nextFocusedOptionIndex]\n        if (option) {\n          onSelectOption(option)\n        }\n      }\n\n      // If the index has changed, need to ensure the active option is visible\n      if (\n        previousFocusedOptionIndex !== nextFocusedOptionIndex &&\n        optionsContainerElement.current\n      ) {\n        const activeStepElement = optionsContainerElement.current.querySelector(\n          `.ob-autocomplete__drop-down-item-${nextFocusedOptionIndex}`,\n        )\n        if (activeStepElement) {\n          activeStepElement.scrollIntoView({\n            behavior: 'smooth',\n            block: 'nearest',\n            inline: 'start',\n          })\n        }\n        setCurrentFocusedOptionIndex(nextFocusedOptionIndex)\n      }\n    },\n    [currentFocusedOptionIndex, options, onSelectOption],\n  )\n\n  const handleChangeLabel = React.useCallback<\n    React.ChangeEventHandler<HTMLInputElement>\n  >(\n    (e) => {\n      const newLabel = e.target.value\n      onOpen()\n      setCurrentFocusedOptionIndex(0)\n\n      onChangeLabel(newLabel)\n    },\n    [onChangeLabel, onOpen],\n  )\n\n  React.useEffect(() => {\n    setError(null)\n\n    if (!isOpen || label.length < searchMinCharacters) {\n      setIsFetchingOptions(false)\n      return\n    }\n\n    setIsFetchingOptions(true)\n\n    let ignore = false\n    const abortController = new AbortController()\n\n    const timeoutId = setTimeout(async () => {\n      let newOptions: AutocompleteOption<T>[] = []\n      let newError = null\n\n      try {\n        newOptions = await onSearch(label, abortController.signal)\n      } catch (error) {\n        // Cancelling will throw an error.\n        if (!abortController.signal.aborted) {\n          console.warn('Error while fetching autocomplete options', error)\n          Sentry.captureException(error)\n          newError = error as Error\n        }\n      }\n      if (!ignore) {\n        setError(newError)\n        setOptions(newOptions)\n        setIsFetchingOptions(false)\n      }\n    }, searchDebounceMs)\n\n    return () => {\n      ignore = true\n      clearTimeout(timeoutId)\n      abortController.abort()\n    }\n  }, [isOpen, label, onSearch, searchDebounceMs, searchMinCharacters])\n\n  React.useEffect(() => {\n    //If there is no value set, we want to clear the label\n    //This is to satisfy lookups that return undefined.\n    if (!value) {\n      onChangeLabel('')\n    }\n  }, [onChangeLabel, value])\n  const { isLookingUp } = React.useContext(LookupNotificationContext)\n\n  const isShowingLoading = isFetchingOptions || !!isLoading\n  const isShowingValid = !isShowingLoading && value !== undefined\n  const isShowingError = !isShowingLoading && !isLookingUp && !!hasError\n\n  return (\n    <>\n      <div\n        className={clsx('dropdown', {\n          'is-active': isOpen && Array.isArray(options),\n        })}\n      >\n        <div className=\"field\">\n          <div\n            className={clsx(\n              'cypress-autocomplete-field-control control is-expanded',\n              {\n                'is-loading': isShowingLoading,\n                'has-icons-right': isShowingValid || isShowingError,\n              },\n            )}\n          >\n            <input\n              type=\"text\"\n              placeholder={placeholder}\n              id={id}\n              autoComplete=\"off\"\n              className=\"cypress-autocomplete-control input ob-input\"\n              required={required}\n              value={label}\n              disabled={disabled}\n              onFocus={onFocus}\n              onBlur={() => handleBlur({ label, value })}\n              onKeyDown={onKeyDown}\n              onChange={handleChangeLabel}\n              aria-describedby={props['aria-describedby']}\n            />\n            {isShowingValid && (\n              <span className=\" ob-input-icon icon is-small is-right\">\n                <MaterialIcon className=\"is-size-5 has-text-success\">\n                  check\n                </MaterialIcon>\n              </span>\n            )}\n            {isShowingError && (\n              <span className=\" ob-input-icon icon is-small is-right\">\n                <MaterialIcon className=\"is-size-5 has-text-danger\">\n                  error\n                </MaterialIcon>\n              </span>\n            )}\n          </div>\n        </div>\n\n        <div className=\"dropdown-menu\">\n          <div\n            ref={optionsContainerElement}\n            className=\"ob-autocomplete__dropdown-content dropdown-content cypress-autocomplete-dropdown-content\"\n          >\n            {error ? (\n              <a className=\"dropdown-item cypress-autocomplete-error ob-autocomplete__drop-down-item-error\">\n                <span className=\"has-text-danger\">{error.message}</span>\n              </a>\n            ) : label.length < searchMinCharacters ? (\n              <a className=\"dropdown-item cypress-max-characters ob-autocomplete__drop-down-item-max-characters\">\n                <i>\n                  Enter at least {searchMinCharacters} character(s) to search\n                </i>\n              </a>\n            ) : isShowingLoading ? (\n              <a className=\"dropdown-item cypress-searching-options ob-autocomplete__drop-down-item-searching\">\n                <i>Searching...</i>\n              </a>\n            ) : options && options.length ? (\n              options.map((option, index) => (\n                <a\n                  key={option.value}\n                  className={clsx(\n                    `dropdown-item cypress-autocomplete-dropdown-item ob-autocomplete__drop-down-item-${index}`,\n                    {\n                      'is-active': currentFocusedOptionIndex === index,\n                    },\n                  )}\n                  onMouseDown={(e) => handleClickOption(e, option)}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{\n                    __html: highlightLabel(option.label, label),\n                  }}\n                />\n              ))\n            ) : (\n              <a className=\"dropdown-item cypress-no-matches-found ob-autocomplete__drop-down-item-no-matches\">\n                <i>No matches found</i>\n              </a>\n            )}\n          </div>\n        </div>\n      </div>\n\n      {(isDirty || displayValidationMessage) &&\n        !!validationMessage &&\n        !isShowingLoading && (\n          <div role=\"alert\" className=\"has-margin-top-8\">\n            <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n              {validationMessage}\n            </div>\n          </div>\n        )}\n    </>\n  )\n}\n\nexport default React.memo(AutocompleteDropdown) as typeof AutocompleteDropdown\n\nfunction highlightLabel(text: string, phrase: string) {\n  if (phrase) {\n    text = text.replace(\n      new RegExp(\n        '(' +\n          phrase.replace(\n            /[`~!@#$%^&*()_|+\\-=?;:'\",.<>{}[\\]\\\\/]/gi,\n            (char: string) => `\\\\${char}`,\n          ) +\n          ')',\n        'gi',\n      ),\n      '<b>$1</b>',\n    )\n  }\n\n  return text\n}\n"]}

package/dist/components/renderer/CopyToClipboardButton.js

@@ -1,6 +1,7 @@
 import { Tooltip } from '@mui/material';
 import * as React from 'react';
 import utilsService from '../../services/utils-service';
+import MaterialIcon from '../MaterialIcon';
 function CopyToClipboardButton({ className, text }) {
     const copy = React.useCallback(() => {
         utilsService.copyToClipboard(text);
@@ -8,7 +9,7 @@ function CopyToClipboardButton({ className, text }) {
     return (React.createElement(Tooltip, { title: "Copy to clipboard" },
         React.createElement("button", { onClick: copy, className: className, type: "button" },
             React.createElement("span", { className: "icon" },
-                React.createElement("i", { className: "material-icons" }, "file_copy")))));
+                React.createElement(MaterialIcon, null, "file_copy")))));
 }
 export default React.memo(CopyToClipboardButton);
 //# sourceMappingURL=CopyToClipboardButton.js.map

package/dist/components/renderer/CopyToClipboardButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyToClipboardButton.js","sourceRoot":"","sources":["../../../src/components/renderer/CopyToClipboardButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,YAAY,MAAM,8BAA8B,CAAA;AAOvD,SAAS,qBAAqB,CAAC,EAAE,SAAS,EAAE,IAAI,EAAS;IACvD,MAAM,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClC,YAAY,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;IACpC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IACV,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,mBAAmB;QAChC,gCAAQ,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAC,QAAQ;YACxD,8BAAM,SAAS,EAAC,MAAM;gBACpB,2BAAG,SAAS,EAAC,gBAAgB,gBAAc,CACtC,CACA,CACD,CACX,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA","sourcesContent":["import { Tooltip } from '@mui/material'\nimport * as React from 'react'\n\nimport utilsService from '../../services/utils-service'\n\ntype Props = {\n  text: string\n  className?: string\n}\n\nfunction CopyToClipboardButton({ className, text }: Props) {\n  const copy = React.useCallback(() => {\n    utilsService.copyToClipboard(text)\n  }, [text])\n  return (\n    <Tooltip title=\"Copy to clipboard\">\n      <button onClick={copy} className={className} type=\"button\">\n        <span className=\"icon\">\n          <i className=\"material-icons\">file_copy</i>\n        </span>\n      </button>\n    </Tooltip>\n  )\n}\n\nexport default React.memo(CopyToClipboardButton)\n"]}
+{"version":3,"file":"CopyToClipboardButton.js","sourceRoot":"","sources":["../../../src/components/renderer/CopyToClipboardButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,YAAY,MAAM,8BAA8B,CAAA;AACvD,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAO1C,SAAS,qBAAqB,CAAC,EAAE,SAAS,EAAE,IAAI,EAAS;IACvD,MAAM,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAClC,YAAY,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;IACpC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IACV,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,mBAAmB;QAChC,gCAAQ,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAC,QAAQ;YACxD,8BAAM,SAAS,EAAC,MAAM;gBACpB,oBAAC,YAAY,oBAAyB,CACjC,CACA,CACD,CACX,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA","sourcesContent":["import { Tooltip } from '@mui/material'\nimport * as React from 'react'\n\nimport utilsService from '../../services/utils-service'\nimport MaterialIcon from '../MaterialIcon'\n\ntype Props = {\n  text: string\n  className?: string\n}\n\nfunction CopyToClipboardButton({ className, text }: Props) {\n  const copy = React.useCallback(() => {\n    utilsService.copyToClipboard(text)\n  }, [text])\n  return (\n    <Tooltip title=\"Copy to clipboard\">\n      <button onClick={copy} className={className} type=\"button\">\n        <span className=\"icon\">\n          <MaterialIcon>file_copy</MaterialIcon>\n        </span>\n      </button>\n    </Tooltip>\n  )\n}\n\nexport default React.memo(CopyToClipboardButton)\n"]}

package/dist/components/renderer/CustomisableButtonInner.js

@@ -1,8 +1,9 @@
 import * as React from 'react';
+import MaterialIcon from '../MaterialIcon';
 const CustomisableButton = ({ label, icon }) => {
     return (React.createElement(React.Fragment, null,
         React.createElement("span", { className: "ob-customisable-button-inner" },
-            !!icon && React.createElement("i", { className: "material-icons" }, icon),
+            !!icon && React.createElement(MaterialIcon, null, icon),
             React.createElement("span", null, label))));
 };
 export default React.memo(CustomisableButton);

package/dist/components/renderer/CustomisableButtonInner.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomisableButtonInner.js","sourceRoot":"","sources":["../../../src/components/renderer/CustomisableButtonInner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,kBAAkB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAS,EAAE,EAAE;IACpD,OAAO,CACL;QACE,8BAAM,SAAS,EAAC,8BAA8B;YAC3C,CAAC,CAAC,IAAI,IAAI,2BAAG,SAAS,EAAC,gBAAgB,IAAE,IAAI,CAAK;YACnD,kCAAO,KAAK,CAAQ,CACf,CACN,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAC,IAAI,CAAQ,kBAAkB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\ntype Props = {\n  label: string\n  icon?: string\n}\n\nconst CustomisableButton = ({ label, icon }: Props) => {\n  return (\n    <>\n      <span className=\"ob-customisable-button-inner\">\n        {!!icon && <i className=\"material-icons\">{icon}</i>}\n        <span>{label}</span>\n      </span>\n    </>\n  )\n}\n\nexport default React.memo<Props>(CustomisableButton)\n"]}
+{"version":3,"file":"CustomisableButtonInner.js","sourceRoot":"","sources":["../../../src/components/renderer/CustomisableButtonInner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAO1C,MAAM,kBAAkB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAS,EAAE,EAAE;IACpD,OAAO,CACL;QACE,8BAAM,SAAS,EAAC,8BAA8B;YAC3C,CAAC,CAAC,IAAI,IAAI,oBAAC,YAAY,QAAE,IAAI,CAAgB;YAC9C,kCAAO,KAAK,CAAQ,CACf,CACN,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAC,IAAI,CAAQ,kBAAkB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport MaterialIcon from '../MaterialIcon'\n\ntype Props = {\n  label: string\n  icon?: string\n}\n\nconst CustomisableButton = ({ label, icon }: Props) => {\n  return (\n    <>\n      <span className=\"ob-customisable-button-inner\">\n        {!!icon && <MaterialIcon>{icon}</MaterialIcon>}\n        <span>{label}</span>\n      </span>\n    </>\n  )\n}\n\nexport default React.memo<Props>(CustomisableButton)\n"]}

package/dist/components/renderer/FormElementLabelContainer.js

@@ -3,6 +3,7 @@ import { Tooltip } from '@mui/material';
 import clsx from 'clsx';
 import useReplaceableText from '../../hooks/useReplaceableText';
 import QuillHTML from '../QuillHTML';
+import MaterialIcon from '../MaterialIcon';
 function FormElementLabelContainer({ className, element, id, required, children, leading, }) {
     return (React.createElement("div", { className: clsx('ob-form__element', className) },
         React.createElement("div", { className: "label ob-label__container" },
@@ -19,7 +20,7 @@ function FormElementLabelContainer({ className, element, id, required, children,
 export function HintTooltip({ hint, inputId, }) {
     const html = useReplaceableText(hint);
     return (React.createElement(Tooltip, { title: React.createElement(QuillHTML, { html: html, className: "ob-hint-tooltip" }), arrow: true, enterTouchDelay: 0, leaveTouchDelay: 10000, id: `${inputId}-hint` },
-        React.createElement("i", { className: "material-icons has-text-grey ob-label__hint" }, "info")));
+        React.createElement(MaterialIcon, { className: "has-text-grey ob-label__hint" }, "info")));
 }
 export function HintBelowLabel({ hint, inputId, }) {
     const html = useReplaceableText(hint);

package/dist/components/renderer/FormElementLabelContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormElementLabelContainer.js","sourceRoot":"","sources":["../../../src/components/renderer/FormElementLabelContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,OAAO,kBAAkB,MAAM,gCAAgC,CAAA;AAC/D,OAAO,SAAS,MAAM,cAAc,CAAA;AAEpC,SAAS,yBAAyB,CAAC,EACjC,SAAS,EACT,OAAO,EACP,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,GAQR;IACC,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC;QACjD,6BAAK,SAAS,EAAC,2BAA2B;YACvC,OAAO;YACR,+BACE,SAAS,EAAE,IAAI,CAAC,UAAU,EAAE;oBAC1B,gCAAgC,EAAE,QAAQ;iBAC3C,CAAC,EACF,OAAO,EAAE,EAAE,IAEV,OAAO,CAAC,KAAK,CACR;YACP,OAAO,CAAC,IAAI;gBACX,CAAC,OAAO,CAAC,YAAY,KAAK,SAAS,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAC/D,oBAAC,WAAW,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,GAAI,CACjD,CACC;QACL,OAAO,CAAC,IAAI,IAAI,OAAO,CAAC,YAAY,KAAK,aAAa,IAAI,CACzD,6BAAK,SAAS,EAAC,yBAAyB;YACtC,oBAAC,cAAc,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,GAAI,CAC/C,CACP;QACA,QAAQ,CACL,CACP,CAAA;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAO,GAIR;IACC,MAAM,IAAI,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAErC,OAAO,CACL,oBAAC,OAAO,IACN,KAAK,EAAE,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,iBAAiB,GAAG,EAC5D,KAAK,QACL,eAAe,EAAE,CAAC,EAClB,eAAe,EAAE,KAAK,EACtB,EAAE,EAAE,GAAG,OAAO,OAAO;QAErB,2BAAG,SAAS,EAAC,6CAA6C,WAAS,CAC3D,CACX,CAAA;AACH,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAC7B,IAAI,EACJ,OAAO,GAIR;IACC,MAAM,IAAI,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAErC,OAAO,CACL,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,cAAc,EAAC,EAAE,EAAE,GAAG,OAAO,OAAO,GAAI,CAC1E,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Tooltip } from '@mui/material'\nimport clsx from 'clsx'\nimport { FormTypes } from '@oneblink/types'\nimport useReplaceableText from '../../hooks/useReplaceableText'\nimport QuillHTML from '../QuillHTML'\n\nfunction FormElementLabelContainer({\n  className,\n  element,\n  id,\n  required,\n  children,\n  leading,\n}: {\n  className: string\n  element: FormTypes.FormElementBase\n  id: string\n  required: boolean\n  children: React.ReactNode\n  leading?: React.ReactNode\n}) {\n  return (\n    <div className={clsx('ob-form__element', className)}>\n      <div className=\"label ob-label__container\">\n        {leading}\n        <label\n          className={clsx('ob-label', {\n            'ob-label__required is-required': required,\n          })}\n          htmlFor={id}\n        >\n          {element.label}\n        </label>\n        {element.hint &&\n          (element.hintPosition === 'TOOLTIP' || !element.hintPosition) && (\n            <HintTooltip hint={element.hint} inputId={id} />\n          )}\n      </div>\n      {element.hint && element.hintPosition === 'BELOW_LABEL' && (\n        <div className=\"ob-hint-text__container\">\n          <HintBelowLabel hint={element.hint} inputId={id} />\n        </div>\n      )}\n      {children}\n    </div>\n  )\n}\n\nexport function HintTooltip({\n  hint,\n  inputId,\n}: {\n  hint: string\n  inputId: string\n}) {\n  const html = useReplaceableText(hint)\n\n  return (\n    <Tooltip\n      title={<QuillHTML html={html} className=\"ob-hint-tooltip\" />}\n      arrow\n      enterTouchDelay={0}\n      leaveTouchDelay={10000}\n      id={`${inputId}-hint`}\n    >\n      <i className=\"material-icons has-text-grey ob-label__hint\">info</i>\n    </Tooltip>\n  )\n}\n\nexport function HintBelowLabel({\n  hint,\n  inputId,\n}: {\n  hint: string\n  inputId: string\n}) {\n  const html = useReplaceableText(hint)\n\n  return (\n    <QuillHTML html={html} className=\"ob-hint-text\" id={`${inputId}-hint`} />\n  )\n}\n\nexport default React.memo(FormElementLabelContainer)\n"]}
+{"version":3,"file":"FormElementLabelContainer.js","sourceRoot":"","sources":["../../../src/components/renderer/FormElementLabelContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,OAAO,kBAAkB,MAAM,gCAAgC,CAAA;AAC/D,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAE1C,SAAS,yBAAyB,CAAC,EACjC,SAAS,EACT,OAAO,EACP,EAAE,EACF,QAAQ,EACR,QAAQ,EACR,OAAO,GAQR;IACC,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC;QACjD,6BAAK,SAAS,EAAC,2BAA2B;YACvC,OAAO;YACR,+BACE,SAAS,EAAE,IAAI,CAAC,UAAU,EAAE;oBAC1B,gCAAgC,EAAE,QAAQ;iBAC3C,CAAC,EACF,OAAO,EAAE,EAAE,IAEV,OAAO,CAAC,KAAK,CACR;YACP,OAAO,CAAC,IAAI;gBACX,CAAC,OAAO,CAAC,YAAY,KAAK,SAAS,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAC/D,oBAAC,WAAW,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,GAAI,CACjD,CACC;QACL,OAAO,CAAC,IAAI,IAAI,OAAO,CAAC,YAAY,KAAK,aAAa,IAAI,CACzD,6BAAK,SAAS,EAAC,yBAAyB;YACtC,oBAAC,cAAc,IAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,GAAI,CAC/C,CACP;QACA,QAAQ,CACL,CACP,CAAA;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAO,GAIR;IACC,MAAM,IAAI,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAErC,OAAO,CACL,oBAAC,OAAO,IACN,KAAK,EAAE,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,iBAAiB,GAAG,EAC5D,KAAK,QACL,eAAe,EAAE,CAAC,EAClB,eAAe,EAAE,KAAK,EACtB,EAAE,EAAE,GAAG,OAAO,OAAO;QAErB,oBAAC,YAAY,IAAC,SAAS,EAAC,8BAA8B,WAAoB,CAClE,CACX,CAAA;AACH,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAC7B,IAAI,EACJ,OAAO,GAIR;IACC,MAAM,IAAI,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAErC,OAAO,CACL,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,cAAc,EAAC,EAAE,EAAE,GAAG,OAAO,OAAO,GAAI,CAC1E,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Tooltip } from '@mui/material'\nimport clsx from 'clsx'\nimport { FormTypes } from '@oneblink/types'\nimport useReplaceableText from '../../hooks/useReplaceableText'\nimport QuillHTML from '../QuillHTML'\nimport MaterialIcon from '../MaterialIcon'\n\nfunction FormElementLabelContainer({\n  className,\n  element,\n  id,\n  required,\n  children,\n  leading,\n}: {\n  className: string\n  element: FormTypes.FormElementBase\n  id: string\n  required: boolean\n  children: React.ReactNode\n  leading?: React.ReactNode\n}) {\n  return (\n    <div className={clsx('ob-form__element', className)}>\n      <div className=\"label ob-label__container\">\n        {leading}\n        <label\n          className={clsx('ob-label', {\n            'ob-label__required is-required': required,\n          })}\n          htmlFor={id}\n        >\n          {element.label}\n        </label>\n        {element.hint &&\n          (element.hintPosition === 'TOOLTIP' || !element.hintPosition) && (\n            <HintTooltip hint={element.hint} inputId={id} />\n          )}\n      </div>\n      {element.hint && element.hintPosition === 'BELOW_LABEL' && (\n        <div className=\"ob-hint-text__container\">\n          <HintBelowLabel hint={element.hint} inputId={id} />\n        </div>\n      )}\n      {children}\n    </div>\n  )\n}\n\nexport function HintTooltip({\n  hint,\n  inputId,\n}: {\n  hint: string\n  inputId: string\n}) {\n  const html = useReplaceableText(hint)\n\n  return (\n    <Tooltip\n      title={<QuillHTML html={html} className=\"ob-hint-tooltip\" />}\n      arrow\n      enterTouchDelay={0}\n      leaveTouchDelay={10000}\n      id={`${inputId}-hint`}\n    >\n      <MaterialIcon className=\"has-text-grey ob-label__hint\">info</MaterialIcon>\n    </Tooltip>\n  )\n}\n\nexport function HintBelowLabel({\n  hint,\n  inputId,\n}: {\n  hint: string\n  inputId: string\n}) {\n  const html = useReplaceableText(hint)\n\n  return (\n    <QuillHTML html={html} className=\"ob-hint-text\" id={`${inputId}-hint`} />\n  )\n}\n\nexport default React.memo(FormElementLabelContainer)\n"]}

package/dist/components/renderer/LookupButton.js

@@ -3,6 +3,7 @@ import clsx from 'clsx';
 import useLookupNotification from '../../hooks/useLookupNotification';
 import { generateLookupValidationMessage } from '../../services/form-validation';
 import useFormIsReadOnly from '../../hooks/useFormIsReadOnly';
+import MaterialIcon from '../MaterialIcon';
 function LookupButton({ value, validationMessage, hasMarginTop, isInputButton, lookupButtonConfig, }) {
     var _a, _b;
     const { isLookup, onLookup, isDisabled, isLoading, allowLookupOnEmptyValue } = useLookupNotification(value);
@@ -26,7 +27,7 @@ function LookupButton({ value, validationMessage, hasMarginTop, isInputButton, l
                     generateLookupValidationMessage(lookupButtonConfig)) },
         isInputButton && React.createElement("span", null),
         React.createElement("span", { className: "icon" },
-            React.createElement("i", { className: "material-icons" }, (_a = lookupButtonConfig === null || lookupButtonConfig === void 0 ? void 0 : lookupButtonConfig.icon) !== null && _a !== void 0 ? _a : 'search')),
+            React.createElement(MaterialIcon, null, (_a = lookupButtonConfig === null || lookupButtonConfig === void 0 ? void 0 : lookupButtonConfig.icon) !== null && _a !== void 0 ? _a : 'search')),
         React.createElement("span", { className: isInputButton ? 'is-hidden-mobile' : undefined },
             "\u00A0", (_b = lookupButtonConfig === null || lookupButtonConfig === void 0 ? void 0 : lookupButtonConfig.label) !== null && _b !== void 0 ? _b : 'Lookup')));
     if (isInputButton) {

package/dist/components/renderer/LookupButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"LookupButton.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,qBAAqB,MAAM,mCAAmC,CAAA;AACrE,OAAO,EAAE,+BAA+B,EAAE,MAAM,gCAAgC,CAAA;AAChF,OAAO,iBAAiB,MAAM,+BAA+B,CAAA;AAU7D,SAAS,YAAY,CAAC,EACpB,KAAK,EACL,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,kBAAkB,GACZ;;IACN,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,uBAAuB,EAAE,GAC1E,qBAAqB,CAAC,KAAK,CAAC,CAAA;IAC9B,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAA;IAC1C,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,MAAM,YAAY,GAAG,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,CAAA;IAE1D,MAAM,MAAM,GAAG,CACb,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CACb,2DAA2D,EAC3D;YACE,YAAY,EAAE,SAAS;YACvB,gBAAgB,EAAE,aAAa;YAC/B,WAAW,EAAE,CAAC,aAAa;YAC3B,kBAAkB,EAAE,YAAY;SACjC,CACF,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,EACzB,QAAQ,EACN,cAAc;YACd,UAAU;YACV,SAAS;YACT,CAAC,YAAY,IAAI,CAAC,uBAAuB,CAAC;YAC1C,CAAC,CAAC,YAAY;gBACZ,CAAC,CAAC,iBAAiB;gBACnB,iBAAiB;oBACf,+BAA+B,CAAC,kBAAkB,CAAC,CAAC;QAGzD,aAAa,IAAI,iCAAa;QAC/B,8BAAM,SAAS,EAAC,MAAM;YACpB,2BAAG,SAAS,EAAC,gBAAgB,IAAE,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,IAAI,mCAAI,QAAQ,CAAK,CACnE;QACP,8BAAM,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS;sBACtD,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,KAAK,mCAAI,QAAQ,CACvC,CACA,CACV,CAAA;IAED,IAAI,aAAa,EAAE;QACjB,OAAO,6BAAK,SAAS,EAAC,SAAS,IAAE,MAAM,CAAO,CAAA;KAC/C;IAED,OAAO,MAAM,CAAA;AACf,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport useLookupNotification from '../../hooks/useLookupNotification'\nimport { generateLookupValidationMessage } from '../../services/form-validation'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport { FormsAppsTypes } from '@oneblink/types'\ntype Props = {\n  value: unknown | undefined\n  validationMessage: string | undefined\n  hasMarginTop?: boolean\n  isInputButton?: boolean\n  lookupButtonConfig?: FormsAppsTypes.ButtonConfiguration\n}\n\nfunction LookupButton({\n  value,\n  validationMessage,\n  hasMarginTop,\n  isInputButton,\n  lookupButtonConfig,\n}: Props) {\n  const { isLookup, onLookup, isDisabled, isLoading, allowLookupOnEmptyValue } =\n    useLookupNotification(value)\n  const formIsReadOnly = useFormIsReadOnly()\n  if (!isLookup) {\n    return null\n  }\n\n  const isEmptyValue = value === undefined || value === null\n\n  const button = (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button is-primary ob-lookup__button cypress-lookup-button',\n        {\n          'is-loading': isLoading,\n          'is-input-addon': isInputButton,\n          'ob-button': !isInputButton,\n          'has-margin-top-8': hasMarginTop,\n        },\n      )}\n      onClick={() => onLookup()}\n      disabled={\n        formIsReadOnly ||\n        isDisabled ||\n        isLoading ||\n        (isEmptyValue && !allowLookupOnEmptyValue) ||\n        (!isEmptyValue &&\n          !!validationMessage &&\n          validationMessage !==\n            generateLookupValidationMessage(lookupButtonConfig))\n      }\n    >\n      {isInputButton && <span></span>}\n      <span className=\"icon\">\n        <i className=\"material-icons\">{lookupButtonConfig?.icon ?? 'search'}</i>\n      </span>\n      <span className={isInputButton ? 'is-hidden-mobile' : undefined}>\n        &nbsp;{lookupButtonConfig?.label ?? 'Lookup'}\n      </span>\n    </button>\n  )\n\n  if (isInputButton) {\n    return <div className=\"control\">{button}</div>\n  }\n\n  return button\n}\n\nexport default React.memo(LookupButton)\n"]}
+{"version":3,"file":"LookupButton.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,qBAAqB,MAAM,mCAAmC,CAAA;AACrE,OAAO,EAAE,+BAA+B,EAAE,MAAM,gCAAgC,CAAA;AAChF,OAAO,iBAAiB,MAAM,+BAA+B,CAAA;AAE7D,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAU1C,SAAS,YAAY,CAAC,EACpB,KAAK,EACL,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,kBAAkB,GACZ;;IACN,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,uBAAuB,EAAE,GAC1E,qBAAqB,CAAC,KAAK,CAAC,CAAA;IAC9B,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAA;IAC1C,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,MAAM,YAAY,GAAG,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,CAAA;IAE1D,MAAM,MAAM,GAAG,CACb,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CACb,2DAA2D,EAC3D;YACE,YAAY,EAAE,SAAS;YACvB,gBAAgB,EAAE,aAAa;YAC/B,WAAW,EAAE,CAAC,aAAa;YAC3B,kBAAkB,EAAE,YAAY;SACjC,CACF,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,EACzB,QAAQ,EACN,cAAc;YACd,UAAU;YACV,SAAS;YACT,CAAC,YAAY,IAAI,CAAC,uBAAuB,CAAC;YAC1C,CAAC,CAAC,YAAY;gBACZ,CAAC,CAAC,iBAAiB;gBACnB,iBAAiB;oBACf,+BAA+B,CAAC,kBAAkB,CAAC,CAAC;QAGzD,aAAa,IAAI,iCAAa;QAC/B,8BAAM,SAAS,EAAC,MAAM;YACpB,oBAAC,YAAY,QAAE,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,IAAI,mCAAI,QAAQ,CAAgB,CAC9D;QACP,8BAAM,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS;sBACtD,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,KAAK,mCAAI,QAAQ,CACvC,CACA,CACV,CAAA;IAED,IAAI,aAAa,EAAE;QACjB,OAAO,6BAAK,SAAS,EAAC,SAAS,IAAE,MAAM,CAAO,CAAA;KAC/C;IAED,OAAO,MAAM,CAAA;AACf,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport useLookupNotification from '../../hooks/useLookupNotification'\nimport { generateLookupValidationMessage } from '../../services/form-validation'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport { FormsAppsTypes } from '@oneblink/types'\nimport MaterialIcon from '../MaterialIcon'\n\ntype Props = {\n  value: unknown | undefined\n  validationMessage: string | undefined\n  hasMarginTop?: boolean\n  isInputButton?: boolean\n  lookupButtonConfig?: FormsAppsTypes.ButtonConfiguration\n}\n\nfunction LookupButton({\n  value,\n  validationMessage,\n  hasMarginTop,\n  isInputButton,\n  lookupButtonConfig,\n}: Props) {\n  const { isLookup, onLookup, isDisabled, isLoading, allowLookupOnEmptyValue } =\n    useLookupNotification(value)\n  const formIsReadOnly = useFormIsReadOnly()\n  if (!isLookup) {\n    return null\n  }\n\n  const isEmptyValue = value === undefined || value === null\n\n  const button = (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button is-primary ob-lookup__button cypress-lookup-button',\n        {\n          'is-loading': isLoading,\n          'is-input-addon': isInputButton,\n          'ob-button': !isInputButton,\n          'has-margin-top-8': hasMarginTop,\n        },\n      )}\n      onClick={() => onLookup()}\n      disabled={\n        formIsReadOnly ||\n        isDisabled ||\n        isLoading ||\n        (isEmptyValue && !allowLookupOnEmptyValue) ||\n        (!isEmptyValue &&\n          !!validationMessage &&\n          validationMessage !==\n            generateLookupValidationMessage(lookupButtonConfig))\n      }\n    >\n      {isInputButton && <span></span>}\n      <span className=\"icon\">\n        <MaterialIcon>{lookupButtonConfig?.icon ?? 'search'}</MaterialIcon>\n      </span>\n      <span className={isInputButton ? 'is-hidden-mobile' : undefined}>\n        &nbsp;{lookupButtonConfig?.label ?? 'Lookup'}\n      </span>\n    </button>\n  )\n\n  if (isInputButton) {\n    return <div className=\"control\">{button}</div>\n  }\n\n  return button\n}\n\nexport default React.memo(LookupButton)\n"]}

package/dist/components/renderer/LookupNotification.js

@@ -14,6 +14,7 @@ import useIsMounted from '../../hooks/useIsMounted';
 import useFormElementLookups from '../../hooks/useFormElementLookups';
 import mergeExecutedLookups from '../../utils/merge-executed-lookups';
 import ErrorMessage from '../messages/ErrorMessage';
+import MaterialIcon from '../MaterialIcon';
 function LookupNotificationComponent({ autoLookupValue, stringifyAutoLookupValue, element, onLookup, children, }) {
     const isMounted = useIsMounted();
     const isOffline = useIsOffline();
@@ -250,15 +251,15 @@ function LookupNotificationComponent({ autoLookupValue, stringifyAutoLookupValue
                 hasLookupFailed && (React.createElement(React.Fragment, null,
                     React.createElement("button", { type: "button", className: "delete fade-in", onClick: () => setIsLookingUp(false), "aria-label": "lookup-failure-close-button" }),
                     React.createElement("div", null, isOffline && isNotStaticLookup ? (React.createElement("div", null,
-                        React.createElement("i", { className: "material-icons fade-in has-text-warning" }, "wifi_off"),
+                        React.createElement(MaterialIcon, { className: "fade-in has-text-warning" }, "wifi_off"),
                         React.createElement("p", { className: "fade-in" }, "It looks like you're offline. Please try again when connectivity is restored."))) : (React.createElement("div", null,
-                        React.createElement("i", { className: "material-icons fade-in has-text-danger" }, "error_outline"),
+                        React.createElement(MaterialIcon, { className: "fade-in has-text-danger" }, "error_outline"),
                         React.createElement("p", { className: "fade-in", 
                             // eslint-disable-next-line react/no-danger
                             dangerouslySetInnerHTML: {
                                 __html: lookupErrorHTML || '',
                             } })))))),
-                hasLookupSucceeded && (React.createElement("i", { className: "material-icons has-text-success fade-in" }, "check_circle_outline")),
+                hasLookupSucceeded && (React.createElement(MaterialIcon, { className: "has-text-success fade-in" }, "check_circle_outline")),
                 !hasLookupSucceeded && !hasLookupFailed && React.createElement(OnLoading, { small: true }),
                 isCancellable && !hasLookupSucceeded && !hasLookupFailed && (React.createElement("div", { className: "has-margin-top-5 fade-in" },
                     React.createElement("p", null, "Taking longer than expected?"),

package/dist/components/renderer/LookupNotification.js.map

@@ -1 +1 @@
-{"version":3,"file":"LookupNotification.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupNotification.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\nimport { Sentry, formService } from '@oneblink/apps'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\n\nimport useIsOffline from '../../hooks/useIsOffline'\nimport OnLoading from './OnLoading'\nimport generateDefaultData from '../../services/generate-default-data'\nimport {\n  LookupNotificationContext,\n  LookupNotificationContextValue,\n} from '../../hooks/useLookupNotification'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport useInjectPages from '../../hooks/useInjectPages'\nimport useFormSubmissionModel from '../../hooks/useFormSubmissionModelContext'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport useIsMounted from '../../hooks/useIsMounted'\nimport useFormElementLookups from '../../hooks/useFormElementLookups'\nimport mergeExecutedLookups from '../../utils/merge-executed-lookups'\n\nimport { FormElementLookupHandler, ExecutedLookups } from '../../types/form'\nimport ErrorMessage from '../messages/ErrorMessage'\n\ntype FetchLookupPayload = {\n  element: FormTypes.LookupFormElement\n  definition?: FormTypes.Form\n  submission: SubmissionTypes.S3SubmissionData['submission']\n}\ntype Props = {\n  autoLookupValue?: unknown\n  stringifyAutoLookupValue?: (autoLookupValue: unknown) => string\n  element: FormTypes.LookupFormElement\n  onLookup: FormElementLookupHandler\n  children: React.ReactNode\n}\n\nfunction LookupNotificationComponent({\n  autoLookupValue,\n  stringifyAutoLookupValue,\n  element,\n  onLookup,\n  children,\n}: Props) {\n  const isMounted = useIsMounted()\n  const isOffline = useIsOffline()\n  const definition = useFormDefinition()\n  const injectPagesAfter = useInjectPages()\n  const { isLoading, formElementLookups, loadError, onTryAgain } =\n    useFormElementLookups()\n\n  const [onCancelLookup, setOnCancelLookup] = React.useState<\n    (() => void) | undefined\n  >(undefined)\n  const [isLookingUp, setIsLookingUp] = React.useState(false)\n  const [hasLookupFailed, setHasLookupFailed] = React.useState(false)\n  const [hasLookupSucceeded, setHasLookupSucceeded] = React.useState(false)\n  const [isCancellable, setIsCancellable] = React.useState(false)\n  const [isDisabled, setIsDisabled] = React.useState(false)\n  const [lookupErrorHTML, setLookupErrorHTML] = React.useState<string | null>(\n    null,\n  )\n  const formIsReadOnly = useFormIsReadOnly()\n  const { formSubmissionModel: model } = useFormSubmissionModel()\n\n  const formElementElementLookup = React.useMemo(() => {\n    return formElementLookups.find(\n      ({ id }) => element.isElementLookup && id === element.elementLookupId,\n    )\n  }, [element.elementLookupId, element.isElementLookup, formElementLookups])\n\n  const formElementDataLookup = React.useMemo(() => {\n    return formElementLookups.find(\n      ({ id }) => element.isDataLookup && id === element.dataLookupId,\n    )\n  }, [element.dataLookupId, element.isDataLookup, formElementLookups])\n\n  const runLookupOnClear = React.useMemo<boolean>(() => {\n    return !!(\n      formElementDataLookup?.runLookupOnClear ||\n      formElementElementLookup?.runLookupOnClear\n    )\n  }, [\n    formElementDataLookup?.runLookupOnClear,\n    formElementElementLookup?.runLookupOnClear,\n  ])\n\n  const excludeDefinition = React.useMemo(() => {\n    return !!(\n      (formElementDataLookup?.type !== 'STATIC_DATA' &&\n        formElementDataLookup?.excludeDefinition) ||\n      (formElementElementLookup?.type !== 'STATIC_DATA' &&\n        formElementElementLookup?.excludeDefinition)\n    )\n  }, [formElementDataLookup, formElementElementLookup])\n\n  const mergeLookupData = React.useCallback(\n    ({\n      newValue,\n      dataLookupResult,\n      elementLookupResult,\n      executedLookup,\n    }: {\n      newValue: unknown\n      dataLookupResult:\n        | SubmissionTypes.S3SubmissionData['submission']\n        | undefined\n      elementLookupResult: FormTypes.FormElement[] | undefined\n      executedLookup: ExecutedLookups\n    }) => {\n      const executedLookupResult = executedLookup?.[element.name]\n      if (elementLookupResult && executedLookupResult !== false) {\n        if (elementLookupResult[0] && elementLookupResult[0].type === 'page') {\n          injectPagesAfter(\n            element,\n            elementLookupResult as FormTypes.PageElement[],\n            dataLookupResult,\n          )\n          return\n        }\n      }\n\n      onLookup(({ submission, elements, executedLookups }) => {\n        let allElements: FormTypes.FormElement[] = elements\n        if (\n          Array.isArray(elementLookupResult) &&\n          executedLookupResult !== false\n        ) {\n          const indexOfElement = elements.findIndex(\n            ({ id }) => id === element.id,\n          )\n          if (indexOfElement === -1) {\n            console.log('Could not find element', element)\n          } else {\n            // Filter out already injected elements if lookup was successful\n            allElements = elements.filter(\n              // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n              (e) => e.injectedByElementId !== element.id,\n            )\n            allElements.splice(\n              indexOfElement + 1,\n              0,\n              ...elementLookupResult.map((e) => {\n                // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n                e.injectedByElementId = element.id\n                return e\n              }),\n            )\n          }\n        }\n\n        return {\n          elements: allElements,\n          submission: generateDefaultData(allElements, {\n            ...submission,\n            [element.name]: newValue,\n            ...dataLookupResult,\n          }),\n          executedLookups: mergeExecutedLookups({\n            dataLookupResult,\n            currentSubmission: submission,\n            executedLookups: {\n              ...executedLookups,\n              ...executedLookup,\n            },\n          }),\n        }\n      })\n    },\n    [element, injectPagesAfter, onLookup],\n  )\n\n  const isNotStaticLookup = React.useMemo(() => {\n    return (\n      (formElementDataLookup && formElementDataLookup.type !== 'STATIC_DATA') ||\n      (formElementElementLookup &&\n        formElementElementLookup.type !== 'STATIC_DATA')\n    )\n  }, [formElementDataLookup, formElementElementLookup])\n\n  const triggerLookup = React.useCallback<\n    LookupNotificationContextValue['onLookup']\n  >(\n    async ({ newValue, abortController, continueLookupOnAbort }) => {\n      // No lookups for read only forms\n      if (formIsReadOnly) return\n\n      setIsLookingUp(true)\n\n      if (isOffline && isNotStaticLookup) {\n        setHasLookupFailed(true)\n        return\n      }\n\n      setIsDisabled(true)\n      setIsCancellable(false)\n      setHasLookupFailed(false)\n      setHasLookupSucceeded(false)\n      setLookupErrorHTML(null)\n      setOnCancelLookup(() => () => {\n        if (isMounted.current) {\n          setIsLookingUp(false)\n        }\n        abortController.abort()\n      })\n\n      // After certain amount of time, show the cancel button\n      const isCancellableTimeout = setTimeout(() => {\n        setIsCancellable(!abortController.signal.aborted)\n      }, 5000)\n\n      const payload: FetchLookupPayload = {\n        element,\n        definition: !excludeDefinition ? definition : undefined,\n        submission: {\n          ...model,\n          [element.name]: newValue,\n        },\n      }\n\n      try {\n        const [dataLookupResult, elementLookupResult] = await Promise.all([\n          fetchLookup(formElementDataLookup, payload, abortController.signal),\n          fetchLookup(\n            formElementElementLookup,\n            payload,\n            abortController.signal,\n          ),\n        ])\n\n        mergeLookupData({\n          newValue,\n          dataLookupResult: dataLookupResult as\n            | SubmissionTypes.S3SubmissionData['submission']\n            | undefined,\n          elementLookupResult: elementLookupResult as\n            | FormTypes.FormElement[]\n            | undefined,\n          executedLookup: { [element.name]: true },\n        })\n\n        if (isMounted.current) {\n          setHasLookupSucceeded(true)\n        }\n\n        // After certain amount of time, hide the lookup succeeded message\n        setTimeout(() => {\n          if (isMounted.current) {\n            setIsLookingUp(false)\n          }\n        }, 750)\n      } catch (error) {\n        if (!isMounted.current) {\n          return\n        }\n\n        if (abortController.signal.aborted) {\n          console.log('Fetch aborted')\n          if (!continueLookupOnAbort) {\n            setIsLookingUp(false)\n          }\n          return\n        }\n\n        setHasLookupFailed(true)\n        mergeLookupData({\n          newValue: model[element.name],\n          dataLookupResult: {},\n          elementLookupResult: [],\n          executedLookup: { [element.name]: false },\n        })\n        setLookupErrorHTML(\n          typeof error === 'string'\n            ? error\n            : 'It looks like something went wrong.<br/>Please try again.<br />If the issue continues, please contact support.',\n        )\n      } finally {\n        clearTimeout(isCancellableTimeout)\n        if (isMounted.current) {\n          setIsDisabled(false)\n          setOnCancelLookup(undefined)\n        }\n      }\n    },\n    [\n      definition,\n      element,\n      excludeDefinition,\n      formElementDataLookup,\n      formElementElementLookup,\n      formIsReadOnly,\n      isMounted,\n      isNotStaticLookup,\n      isOffline,\n      mergeLookupData,\n      model,\n    ],\n  )\n\n  // For certain elements, do not add click event\n  // instead, watch model for changes and trigger lookup function.\n  // We add this stringify function here to allow the value to be\n  // an object which may have a reference change, but the values\n  // have not changed. e.g. the 'location' element's value\n  const autoLookupValueString = stringifyAutoLookupValue\n    ? stringifyAutoLookupValue(autoLookupValue)\n    : autoLookupValue\n  React.useEffect(() => {\n    if (isLoading || loadError) {\n      return\n    }\n    const hasLookupRan = hasLookupFailed || hasLookupSucceeded\n\n    // For lookups configured with `runLookupOnClear` set to true, we want to\n    // allow empty values for `autoLookupValue`, but only if the lookup has\n    // been ran previously. This prevents the lookup running on load with an empty value.\n    if (\n      (autoLookupValue === undefined || autoLookupValue === null) &&\n      (!runLookupOnClear || !hasLookupRan)\n    ) {\n      setIsLookingUp(false)\n      return\n    }\n    const abortController = new AbortController()\n    triggerLookup({\n      newValue: autoLookupValue,\n      abortController,\n      continueLookupOnAbort: true,\n    })\n    return () => {\n      abortController.abort()\n    }\n    // Wants to use \"triggerLookup\" as a dependency,\n    // however, this will change on any change made on any\n    // element. Checking if \"value\" has changed is enough\n    // to trigger a lookup when the correct dependencies change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [autoLookupValueString, isLoading])\n\n  const contextValue = React.useMemo(\n    () => ({\n      isLookup: true,\n      isDisabled,\n      isLoading,\n      onLookup: triggerLookup,\n      allowLookupOnEmptyValue: runLookupOnClear,\n      isLookingUp,\n    }),\n    [isDisabled, isLoading, runLookupOnClear, triggerLookup, isLookingUp],\n  )\n\n  return (\n    <LookupNotificationContext.Provider value={contextValue}>\n      {children}\n\n      {loadError && (\n        <ErrorMessage\n          title=\"Error Loading Configuration\"\n          onTryAgain={onTryAgain}\n        >\n          <span className=\"cypress-lookup-notification-loading-error\">\n            {loadError.message}\n          </span>\n        </ErrorMessage>\n      )}\n\n      <div\n        className={clsx('ob-lookup__notification', {\n          'is-looking-up': isLookingUp,\n          'is-extended':\n            hasLookupFailed || (isCancellable && !hasLookupSucceeded),\n        })}\n      >\n        <div className=\"notification has-margin-top-7 has-text-centered\">\n          {hasLookupFailed && (\n            <>\n              <button\n                type=\"button\"\n                className=\"delete fade-in\"\n                onClick={() => setIsLookingUp(false)}\n                aria-label=\"lookup-failure-close-button\"\n              />\n\n              <div>\n                {isOffline && isNotStaticLookup ? (\n                  <div>\n                    <i className=\"material-icons fade-in has-text-warning\">\n                      wifi_off\n                    </i>\n                    <p className=\"fade-in\">\n                      It looks like you&apos;re offline. Please try again when\n                      connectivity is restored.\n                    </p>\n                  </div>\n                ) : (\n                  <div>\n                    <i className=\"material-icons fade-in has-text-danger\">\n                      error_outline\n                    </i>\n                    <p\n                      className=\"fade-in\"\n                      // eslint-disable-next-line react/no-danger\n                      dangerouslySetInnerHTML={{\n                        __html: lookupErrorHTML || '',\n                      }}\n                    />\n                  </div>\n                )}\n              </div>\n            </>\n          )}\n\n          {hasLookupSucceeded && (\n            <i className=\"material-icons has-text-success fade-in\">\n              check_circle_outline\n            </i>\n          )}\n\n          {!hasLookupSucceeded && !hasLookupFailed && <OnLoading small />}\n\n          {isCancellable && !hasLookupSucceeded && !hasLookupFailed && (\n            <div className=\"has-margin-top-5 fade-in\">\n              <p>Taking longer than expected?</p>\n              <button\n                type=\"button\"\n                className=\"button has-margin-top-8\"\n                onClick={onCancelLookup}\n              >\n                Cancel\n              </button>\n            </div>\n          )}\n        </div>\n      </div>\n    </LookupNotificationContext.Provider>\n  )\n}\n\nexport default function LookupNotification(props: Props) {\n  if (props.element.isDataLookup || props.element.isElementLookup) {\n    return <LookupNotificationComponent {...props} />\n  }\n\n  return <>{props.children}</>\n}\n\nasync function fetchLookup(\n  formElementLookup: formService.FormElementLookupResult | undefined,\n  payload: FetchLookupPayload,\n  abortSignal: AbortSignal,\n): Promise<\n  | SubmissionTypes.S3SubmissionData['submission']\n  | FormTypes.FormElement[]\n  | undefined\n> {\n  if (!formElementLookup) {\n    return\n  }\n\n  if (formElementLookup.records) {\n    const elementName = payload.element.name\n    const inputValue = payload.submission[elementName]\n\n    const matchingRecord = formElementLookup.records.find(\n      (r) =>\n        (r.inputType === 'UNDEFINED' && !inputValue) ||\n        (r.inputType !== 'UNDEFINED' && r.inputValue === inputValue),\n    )\n\n    // insert prefill values\n    return matchingRecord?.preFills.reduce<\n      SubmissionTypes.S3SubmissionData['submission']\n    >((lookupResult, prefill) => {\n      switch (prefill.type) {\n        case 'TEXT':\n          lookupResult[prefill.formElementName] = prefill.text\n          break\n        case 'NUMBER':\n          lookupResult[prefill.formElementName] = prefill.number\n          break\n        case 'CLEAR':\n          lookupResult[prefill.formElementName] = undefined\n          break\n      }\n      return lookupResult\n    }, {})\n  }\n\n  if (!formElementLookup.url) {\n    console.log(\n      'Could not find dynamic URL or static records for form element lookup:',\n      formElementLookup,\n    )\n    throw new Error('Could not find element lookup configuration')\n  }\n\n  const headers = await generateHeaders()\n  console.log(\n    `Attempting a ${formElementLookup.type} lookup request to:`,\n    formElementLookup.url,\n  )\n  const response = await fetch(formElementLookup.url, {\n    method: 'POST',\n    headers,\n    body: JSON.stringify(payload),\n    signal: abortSignal,\n  })\n\n  const data = await response.json()\n  console.log(\n    'Response from lookup to: POST',\n    formElementLookup.url,\n    response.status,\n    data,\n  )\n\n  if (!response.ok) {\n    Sentry.captureException(\n      new Error(`Received ${response.status} status code from lookup`),\n    )\n    if (response.status === 400 && data && data.message) {\n      throw data.message\n    }\n    throw new Error('Invalid response from lookup')\n  }\n\n  return data as FormTypes.FormElement[]\n}\n"]}
+{"version":3,"file":"LookupNotification.js","sourceRoot":"","sources":["../../../src/components/renderer/LookupNotification.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\nimport { Sentry, formService } from '@oneblink/apps'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\n\nimport useIsOffline from '../../hooks/useIsOffline'\nimport OnLoading from './OnLoading'\nimport generateDefaultData from '../../services/generate-default-data'\nimport {\n  LookupNotificationContext,\n  LookupNotificationContextValue,\n} from '../../hooks/useLookupNotification'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport useInjectPages from '../../hooks/useInjectPages'\nimport useFormSubmissionModel from '../../hooks/useFormSubmissionModelContext'\nimport useFormIsReadOnly from '../../hooks/useFormIsReadOnly'\nimport useIsMounted from '../../hooks/useIsMounted'\nimport useFormElementLookups from '../../hooks/useFormElementLookups'\nimport mergeExecutedLookups from '../../utils/merge-executed-lookups'\n\nimport { FormElementLookupHandler, ExecutedLookups } from '../../types/form'\nimport ErrorMessage from '../messages/ErrorMessage'\nimport MaterialIcon from '../MaterialIcon'\n\ntype FetchLookupPayload = {\n  element: FormTypes.LookupFormElement\n  definition?: FormTypes.Form\n  submission: SubmissionTypes.S3SubmissionData['submission']\n}\ntype Props = {\n  autoLookupValue?: unknown\n  stringifyAutoLookupValue?: (autoLookupValue: unknown) => string\n  element: FormTypes.LookupFormElement\n  onLookup: FormElementLookupHandler\n  children: React.ReactNode\n}\n\nfunction LookupNotificationComponent({\n  autoLookupValue,\n  stringifyAutoLookupValue,\n  element,\n  onLookup,\n  children,\n}: Props) {\n  const isMounted = useIsMounted()\n  const isOffline = useIsOffline()\n  const definition = useFormDefinition()\n  const injectPagesAfter = useInjectPages()\n  const { isLoading, formElementLookups, loadError, onTryAgain } =\n    useFormElementLookups()\n\n  const [onCancelLookup, setOnCancelLookup] = React.useState<\n    (() => void) | undefined\n  >(undefined)\n  const [isLookingUp, setIsLookingUp] = React.useState(false)\n  const [hasLookupFailed, setHasLookupFailed] = React.useState(false)\n  const [hasLookupSucceeded, setHasLookupSucceeded] = React.useState(false)\n  const [isCancellable, setIsCancellable] = React.useState(false)\n  const [isDisabled, setIsDisabled] = React.useState(false)\n  const [lookupErrorHTML, setLookupErrorHTML] = React.useState<string | null>(\n    null,\n  )\n  const formIsReadOnly = useFormIsReadOnly()\n  const { formSubmissionModel: model } = useFormSubmissionModel()\n\n  const formElementElementLookup = React.useMemo(() => {\n    return formElementLookups.find(\n      ({ id }) => element.isElementLookup && id === element.elementLookupId,\n    )\n  }, [element.elementLookupId, element.isElementLookup, formElementLookups])\n\n  const formElementDataLookup = React.useMemo(() => {\n    return formElementLookups.find(\n      ({ id }) => element.isDataLookup && id === element.dataLookupId,\n    )\n  }, [element.dataLookupId, element.isDataLookup, formElementLookups])\n\n  const runLookupOnClear = React.useMemo<boolean>(() => {\n    return !!(\n      formElementDataLookup?.runLookupOnClear ||\n      formElementElementLookup?.runLookupOnClear\n    )\n  }, [\n    formElementDataLookup?.runLookupOnClear,\n    formElementElementLookup?.runLookupOnClear,\n  ])\n\n  const excludeDefinition = React.useMemo(() => {\n    return !!(\n      (formElementDataLookup?.type !== 'STATIC_DATA' &&\n        formElementDataLookup?.excludeDefinition) ||\n      (formElementElementLookup?.type !== 'STATIC_DATA' &&\n        formElementElementLookup?.excludeDefinition)\n    )\n  }, [formElementDataLookup, formElementElementLookup])\n\n  const mergeLookupData = React.useCallback(\n    ({\n      newValue,\n      dataLookupResult,\n      elementLookupResult,\n      executedLookup,\n    }: {\n      newValue: unknown\n      dataLookupResult:\n        | SubmissionTypes.S3SubmissionData['submission']\n        | undefined\n      elementLookupResult: FormTypes.FormElement[] | undefined\n      executedLookup: ExecutedLookups\n    }) => {\n      const executedLookupResult = executedLookup?.[element.name]\n      if (elementLookupResult && executedLookupResult !== false) {\n        if (elementLookupResult[0] && elementLookupResult[0].type === 'page') {\n          injectPagesAfter(\n            element,\n            elementLookupResult as FormTypes.PageElement[],\n            dataLookupResult,\n          )\n          return\n        }\n      }\n\n      onLookup(({ submission, elements, executedLookups }) => {\n        let allElements: FormTypes.FormElement[] = elements\n        if (\n          Array.isArray(elementLookupResult) &&\n          executedLookupResult !== false\n        ) {\n          const indexOfElement = elements.findIndex(\n            ({ id }) => id === element.id,\n          )\n          if (indexOfElement === -1) {\n            console.log('Could not find element', element)\n          } else {\n            // Filter out already injected elements if lookup was successful\n            allElements = elements.filter(\n              // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n              (e) => e.injectedByElementId !== element.id,\n            )\n            allElements.splice(\n              indexOfElement + 1,\n              0,\n              ...elementLookupResult.map((e) => {\n                // @ts-expect-error Sorry typescript, we need to check a property you don't approve of :(\n                e.injectedByElementId = element.id\n                return e\n              }),\n            )\n          }\n        }\n\n        return {\n          elements: allElements,\n          submission: generateDefaultData(allElements, {\n            ...submission,\n            [element.name]: newValue,\n            ...dataLookupResult,\n          }),\n          executedLookups: mergeExecutedLookups({\n            dataLookupResult,\n            currentSubmission: submission,\n            executedLookups: {\n              ...executedLookups,\n              ...executedLookup,\n            },\n          }),\n        }\n      })\n    },\n    [element, injectPagesAfter, onLookup],\n  )\n\n  const isNotStaticLookup = React.useMemo(() => {\n    return (\n      (formElementDataLookup && formElementDataLookup.type !== 'STATIC_DATA') ||\n      (formElementElementLookup &&\n        formElementElementLookup.type !== 'STATIC_DATA')\n    )\n  }, [formElementDataLookup, formElementElementLookup])\n\n  const triggerLookup = React.useCallback<\n    LookupNotificationContextValue['onLookup']\n  >(\n    async ({ newValue, abortController, continueLookupOnAbort }) => {\n      // No lookups for read only forms\n      if (formIsReadOnly) return\n\n      setIsLookingUp(true)\n\n      if (isOffline && isNotStaticLookup) {\n        setHasLookupFailed(true)\n        return\n      }\n\n      setIsDisabled(true)\n      setIsCancellable(false)\n      setHasLookupFailed(false)\n      setHasLookupSucceeded(false)\n      setLookupErrorHTML(null)\n      setOnCancelLookup(() => () => {\n        if (isMounted.current) {\n          setIsLookingUp(false)\n        }\n        abortController.abort()\n      })\n\n      // After certain amount of time, show the cancel button\n      const isCancellableTimeout = setTimeout(() => {\n        setIsCancellable(!abortController.signal.aborted)\n      }, 5000)\n\n      const payload: FetchLookupPayload = {\n        element,\n        definition: !excludeDefinition ? definition : undefined,\n        submission: {\n          ...model,\n          [element.name]: newValue,\n        },\n      }\n\n      try {\n        const [dataLookupResult, elementLookupResult] = await Promise.all([\n          fetchLookup(formElementDataLookup, payload, abortController.signal),\n          fetchLookup(\n            formElementElementLookup,\n            payload,\n            abortController.signal,\n          ),\n        ])\n\n        mergeLookupData({\n          newValue,\n          dataLookupResult: dataLookupResult as\n            | SubmissionTypes.S3SubmissionData['submission']\n            | undefined,\n          elementLookupResult: elementLookupResult as\n            | FormTypes.FormElement[]\n            | undefined,\n          executedLookup: { [element.name]: true },\n        })\n\n        if (isMounted.current) {\n          setHasLookupSucceeded(true)\n        }\n\n        // After certain amount of time, hide the lookup succeeded message\n        setTimeout(() => {\n          if (isMounted.current) {\n            setIsLookingUp(false)\n          }\n        }, 750)\n      } catch (error) {\n        if (!isMounted.current) {\n          return\n        }\n\n        if (abortController.signal.aborted) {\n          console.log('Fetch aborted')\n          if (!continueLookupOnAbort) {\n            setIsLookingUp(false)\n          }\n          return\n        }\n\n        setHasLookupFailed(true)\n        mergeLookupData({\n          newValue: model[element.name],\n          dataLookupResult: {},\n          elementLookupResult: [],\n          executedLookup: { [element.name]: false },\n        })\n        setLookupErrorHTML(\n          typeof error === 'string'\n            ? error\n            : 'It looks like something went wrong.<br/>Please try again.<br />If the issue continues, please contact support.',\n        )\n      } finally {\n        clearTimeout(isCancellableTimeout)\n        if (isMounted.current) {\n          setIsDisabled(false)\n          setOnCancelLookup(undefined)\n        }\n      }\n    },\n    [\n      definition,\n      element,\n      excludeDefinition,\n      formElementDataLookup,\n      formElementElementLookup,\n      formIsReadOnly,\n      isMounted,\n      isNotStaticLookup,\n      isOffline,\n      mergeLookupData,\n      model,\n    ],\n  )\n\n  // For certain elements, do not add click event\n  // instead, watch model for changes and trigger lookup function.\n  // We add this stringify function here to allow the value to be\n  // an object which may have a reference change, but the values\n  // have not changed. e.g. the 'location' element's value\n  const autoLookupValueString = stringifyAutoLookupValue\n    ? stringifyAutoLookupValue(autoLookupValue)\n    : autoLookupValue\n  React.useEffect(() => {\n    if (isLoading || loadError) {\n      return\n    }\n    const hasLookupRan = hasLookupFailed || hasLookupSucceeded\n\n    // For lookups configured with `runLookupOnClear` set to true, we want to\n    // allow empty values for `autoLookupValue`, but only if the lookup has\n    // been ran previously. This prevents the lookup running on load with an empty value.\n    if (\n      (autoLookupValue === undefined || autoLookupValue === null) &&\n      (!runLookupOnClear || !hasLookupRan)\n    ) {\n      setIsLookingUp(false)\n      return\n    }\n    const abortController = new AbortController()\n    triggerLookup({\n      newValue: autoLookupValue,\n      abortController,\n      continueLookupOnAbort: true,\n    })\n    return () => {\n      abortController.abort()\n    }\n    // Wants to use \"triggerLookup\" as a dependency,\n    // however, this will change on any change made on any\n    // element. Checking if \"value\" has changed is enough\n    // to trigger a lookup when the correct dependencies change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [autoLookupValueString, isLoading])\n\n  const contextValue = React.useMemo(\n    () => ({\n      isLookup: true,\n      isDisabled,\n      isLoading,\n      onLookup: triggerLookup,\n      allowLookupOnEmptyValue: runLookupOnClear,\n      isLookingUp,\n    }),\n    [isDisabled, isLoading, runLookupOnClear, triggerLookup, isLookingUp],\n  )\n\n  return (\n    <LookupNotificationContext.Provider value={contextValue}>\n      {children}\n\n      {loadError && (\n        <ErrorMessage\n          title=\"Error Loading Configuration\"\n          onTryAgain={onTryAgain}\n        >\n          <span className=\"cypress-lookup-notification-loading-error\">\n            {loadError.message}\n          </span>\n        </ErrorMessage>\n      )}\n\n      <div\n        className={clsx('ob-lookup__notification', {\n          'is-looking-up': isLookingUp,\n          'is-extended':\n            hasLookupFailed || (isCancellable && !hasLookupSucceeded),\n        })}\n      >\n        <div className=\"notification has-margin-top-7 has-text-centered\">\n          {hasLookupFailed && (\n            <>\n              <button\n                type=\"button\"\n                className=\"delete fade-in\"\n                onClick={() => setIsLookingUp(false)}\n                aria-label=\"lookup-failure-close-button\"\n              />\n\n              <div>\n                {isOffline && isNotStaticLookup ? (\n                  <div>\n                    <MaterialIcon className=\"fade-in has-text-warning\">\n                      wifi_off\n                    </MaterialIcon>\n                    <p className=\"fade-in\">\n                      It looks like you&apos;re offline. Please try again when\n                      connectivity is restored.\n                    </p>\n                  </div>\n                ) : (\n                  <div>\n                    <MaterialIcon className=\"fade-in has-text-danger\">\n                      error_outline\n                    </MaterialIcon>\n                    <p\n                      className=\"fade-in\"\n                      // eslint-disable-next-line react/no-danger\n                      dangerouslySetInnerHTML={{\n                        __html: lookupErrorHTML || '',\n                      }}\n                    />\n                  </div>\n                )}\n              </div>\n            </>\n          )}\n\n          {hasLookupSucceeded && (\n            <MaterialIcon className=\"has-text-success fade-in\">\n              check_circle_outline\n            </MaterialIcon>\n          )}\n\n          {!hasLookupSucceeded && !hasLookupFailed && <OnLoading small />}\n\n          {isCancellable && !hasLookupSucceeded && !hasLookupFailed && (\n            <div className=\"has-margin-top-5 fade-in\">\n              <p>Taking longer than expected?</p>\n              <button\n                type=\"button\"\n                className=\"button has-margin-top-8\"\n                onClick={onCancelLookup}\n              >\n                Cancel\n              </button>\n            </div>\n          )}\n        </div>\n      </div>\n    </LookupNotificationContext.Provider>\n  )\n}\n\nexport default function LookupNotification(props: Props) {\n  if (props.element.isDataLookup || props.element.isElementLookup) {\n    return <LookupNotificationComponent {...props} />\n  }\n\n  return <>{props.children}</>\n}\n\nasync function fetchLookup(\n  formElementLookup: formService.FormElementLookupResult | undefined,\n  payload: FetchLookupPayload,\n  abortSignal: AbortSignal,\n): Promise<\n  | SubmissionTypes.S3SubmissionData['submission']\n  | FormTypes.FormElement[]\n  | undefined\n> {\n  if (!formElementLookup) {\n    return\n  }\n\n  if (formElementLookup.records) {\n    const elementName = payload.element.name\n    const inputValue = payload.submission[elementName]\n\n    const matchingRecord = formElementLookup.records.find(\n      (r) =>\n        (r.inputType === 'UNDEFINED' && !inputValue) ||\n        (r.inputType !== 'UNDEFINED' && r.inputValue === inputValue),\n    )\n\n    // insert prefill values\n    return matchingRecord?.preFills.reduce<\n      SubmissionTypes.S3SubmissionData['submission']\n    >((lookupResult, prefill) => {\n      switch (prefill.type) {\n        case 'TEXT':\n          lookupResult[prefill.formElementName] = prefill.text\n          break\n        case 'NUMBER':\n          lookupResult[prefill.formElementName] = prefill.number\n          break\n        case 'CLEAR':\n          lookupResult[prefill.formElementName] = undefined\n          break\n      }\n      return lookupResult\n    }, {})\n  }\n\n  if (!formElementLookup.url) {\n    console.log(\n      'Could not find dynamic URL or static records for form element lookup:',\n      formElementLookup,\n    )\n    throw new Error('Could not find element lookup configuration')\n  }\n\n  const headers = await generateHeaders()\n  console.log(\n    `Attempting a ${formElementLookup.type} lookup request to:`,\n    formElementLookup.url,\n  )\n  const response = await fetch(formElementLookup.url, {\n    method: 'POST',\n    headers,\n    body: JSON.stringify(payload),\n    signal: abortSignal,\n  })\n\n  const data = await response.json()\n  console.log(\n    'Response from lookup to: POST',\n    formElementLookup.url,\n    response.status,\n    data,\n  )\n\n  if (!response.ok) {\n    Sentry.captureException(\n      new Error(`Received ${response.status} status code from lookup`),\n    )\n    if (response.status === 400 && data && data.message) {\n      throw data.message\n    }\n    throw new Error('Invalid response from lookup')\n  }\n\n  return data as FormTypes.FormElement[]\n}\n"]}

package/dist/components/renderer/attachments/AttachmentStatus.js

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { Tooltip } from '@mui/material';
 import useIsOffline from '../../../hooks/useIsOffline';
+import MaterialIcon from '../../MaterialIcon';
 const AttachmentStatus = ({ isUploading, isUploadPaused, uploadError, loadImageUrlError, isLoadingImageUrl, imageUrl, progress, }) => {
     const isOffline = useIsOffline();
     const tooltip = React.useMemo(() => {
@@ -15,17 +16,17 @@ const AttachmentStatus = ({ isUploading, isUploadPaused, uploadError, loadImageU
     if (uploadError) {
         return (React.createElement(Tooltip, { title: uploadError.message },
             React.createElement("span", { className: "attachment__status-wrapper" },
-                React.createElement("i", { className: "material-icons has-text-danger" }, "error"))));
+                React.createElement(MaterialIcon, { className: "has-text-danger" }, "error"))));
     }
     if (isUploading) {
         if (isUploadPaused) {
             return (React.createElement("span", { className: "attachment__status-wrapper" },
-                React.createElement("i", { className: "material-icons" }, "pause")));
+                React.createElement(MaterialIcon, null, "pause")));
         }
         if (isOffline) {
             return (React.createElement(Tooltip, { title: "Upload will start when you connect to the internet" },
                 React.createElement("div", { className: "cypress-attachment-uploading" },
-                    React.createElement("i", { className: "material-icons has-text-warning" }, "wifi_off"))));
+                    React.createElement(MaterialIcon, { className: "has-text-warning" }, "wifi_off"))));
         }
         return (React.createElement(Tooltip, { title: "Uploading" },
             React.createElement("div", { className: "cypress-attachment-uploading" },
@@ -34,7 +35,7 @@ const AttachmentStatus = ({ isUploading, isUploadPaused, uploadError, loadImageU
     }
     return (React.createElement(Tooltip, { title: tooltip },
         React.createElement("span", { className: "attachment__status-wrapper" },
-            React.createElement("i", { className: "material-icons has-text-success" }, "check_circle"))));
+            React.createElement(MaterialIcon, { className: "has-text-success" }, "check_circle"))));
 };
 export default React.memo(AttachmentStatus);
 //# sourceMappingURL=AttachmentStatus.js.map

package/dist/components/renderer/attachments/AttachmentStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"AttachmentStatus.js","sourceRoot":"","sources":["../../../../src/components/renderer/attachments/AttachmentStatus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,YAAY,MAAM,6BAA6B,CAAA;AAEtD,MAAM,gBAAgB,GAAG,CAAC,EACxB,WAAW,EACX,cAAc,EACd,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,QAAQ,EACR,QAAQ,GAST,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAEhC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjC,IAAI,iBAAiB,IAAI,CAAC,QAAQ,EAAE;YAClC,OAAO,kEAAkE,CAAA;SAC1E;QACD,IAAI,iBAAiB,IAAI,CAAC,QAAQ,EAAE;YAClC,OAAO,qEAAqE,CAAA;SAC7E;QAED,OAAO,yBAAyB,CAAA;IAClC,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,CAAA;IAEpD,IAAI,WAAW,EAAE;QACf,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAE,WAAW,CAAC,OAAO;YACjC,8BAAM,SAAS,EAAC,4BAA4B;gBAC1C,2BAAG,SAAS,EAAC,gCAAgC,YAAU,CAClD,CACC,CACX,CAAA;KACF;IAED,IAAI,WAAW,EAAE;QACf,IAAI,cAAc,EAAE;YAClB,OAAO,CACL,8BAAM,SAAS,EAAC,4BAA4B;gBAC1C,2BAAG,SAAS,EAAC,gBAAgB,YAAU,CAClC,CACR,CAAA;SACF;QACD,IAAI,SAAS,EAAE;YACb,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,oDAAoD;gBACjE,6BAAK,SAAS,EAAC,8BAA8B;oBAC3C,2BAAG,SAAS,EAAC,iCAAiC,eAAa,CACvD,CACE,CACX,CAAA;SACF;QACD,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,WAAW;YACxB,6BAAK,SAAS,EAAC,8BAA8B;gBAC1C,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAC;oBACtB,CACE,CACX,CAAA;KACF;IAED,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAE,OAAO;QACrB,8BAAM,SAAS,EAAC,4BAA4B;YAC1C,2BAAG,SAAS,EAAC,iCAAiC,mBAAiB,CAC1D,CACC,CACX,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Tooltip } from '@mui/material'\nimport useIsOffline from '../../../hooks/useIsOffline'\n\nconst AttachmentStatus = ({\n  isUploading,\n  isUploadPaused,\n  uploadError,\n  loadImageUrlError,\n  isLoadingImageUrl,\n  imageUrl,\n  progress,\n}: {\n  isUploading?: boolean\n  isUploadPaused?: boolean\n  uploadError?: Error\n  loadImageUrlError?: Error\n  isLoadingImageUrl?: boolean\n  imageUrl: string | null | undefined\n  progress: number | undefined\n}) => {\n  const isOffline = useIsOffline()\n\n  const tooltip = React.useMemo(() => {\n    if (isLoadingImageUrl && !imageUrl) {\n      return 'Attempting to load file preview. File is synced with submission.'\n    }\n    if (loadImageUrlError && !imageUrl) {\n      return 'File preview not available, however file is synced with submission.'\n    }\n\n    return 'Synced with submission.'\n  }, [imageUrl, isLoadingImageUrl, loadImageUrlError])\n\n  if (uploadError) {\n    return (\n      <Tooltip title={uploadError.message}>\n        <span className=\"attachment__status-wrapper\">\n          <i className=\"material-icons has-text-danger\">error</i>\n        </span>\n      </Tooltip>\n    )\n  }\n\n  if (isUploading) {\n    if (isUploadPaused) {\n      return (\n        <span className=\"attachment__status-wrapper\">\n          <i className=\"material-icons\">pause</i>\n        </span>\n      )\n    }\n    if (isOffline) {\n      return (\n        <Tooltip title=\"Upload will start when you connect to the internet\">\n          <div className=\"cypress-attachment-uploading\">\n            <i className=\"material-icons has-text-warning\">wifi_off</i>\n          </div>\n        </Tooltip>\n      )\n    }\n    return (\n      <Tooltip title=\"Uploading\">\n        <div className=\"cypress-attachment-uploading\">\n          {Math.round(progress || 0)}%\n        </div>\n      </Tooltip>\n    )\n  }\n\n  return (\n    <Tooltip title={tooltip}>\n      <span className=\"attachment__status-wrapper\">\n        <i className=\"material-icons has-text-success\">check_circle</i>\n      </span>\n    </Tooltip>\n  )\n}\n\nexport default React.memo(AttachmentStatus)\n"]}
+{"version":3,"file":"AttachmentStatus.js","sourceRoot":"","sources":["../../../../src/components/renderer/attachments/AttachmentStatus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,YAAY,MAAM,oBAAoB,CAAA;AAE7C,MAAM,gBAAgB,GAAG,CAAC,EACxB,WAAW,EACX,cAAc,EACd,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,QAAQ,EACR,QAAQ,GAST,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAEhC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjC,IAAI,iBAAiB,IAAI,CAAC,QAAQ,EAAE;YAClC,OAAO,kEAAkE,CAAA;SAC1E;QACD,IAAI,iBAAiB,IAAI,CAAC,QAAQ,EAAE;YAClC,OAAO,qEAAqE,CAAA;SAC7E;QAED,OAAO,yBAAyB,CAAA;IAClC,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,CAAA;IAEpD,IAAI,WAAW,EAAE;QACf,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAE,WAAW,CAAC,OAAO;YACjC,8BAAM,SAAS,EAAC,4BAA4B;gBAC1C,oBAAC,YAAY,IAAC,SAAS,EAAC,iBAAiB,YAAqB,CACzD,CACC,CACX,CAAA;KACF;IAED,IAAI,WAAW,EAAE;QACf,IAAI,cAAc,EAAE;YAClB,OAAO,CACL,8BAAM,SAAS,EAAC,4BAA4B;gBAC1C,oBAAC,YAAY,gBAAqB,CAC7B,CACR,CAAA;SACF;QACD,IAAI,SAAS,EAAE;YACb,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,oDAAoD;gBACjE,6BAAK,SAAS,EAAC,8BAA8B;oBAC3C,oBAAC,YAAY,IAAC,SAAS,EAAC,kBAAkB,eAAwB,CAC9D,CACE,CACX,CAAA;SACF;QACD,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAC,WAAW;YACxB,6BAAK,SAAS,EAAC,8BAA8B;gBAC1C,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAC;oBACtB,CACE,CACX,CAAA;KACF;IAED,OAAO,CACL,oBAAC,OAAO,IAAC,KAAK,EAAE,OAAO;QACrB,8BAAM,SAAS,EAAC,4BAA4B;YAC1C,oBAAC,YAAY,IAAC,SAAS,EAAC,kBAAkB,mBAA4B,CACjE,CACC,CACX,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Tooltip } from '@mui/material'\nimport useIsOffline from '../../../hooks/useIsOffline'\nimport MaterialIcon from '../../MaterialIcon'\n\nconst AttachmentStatus = ({\n  isUploading,\n  isUploadPaused,\n  uploadError,\n  loadImageUrlError,\n  isLoadingImageUrl,\n  imageUrl,\n  progress,\n}: {\n  isUploading?: boolean\n  isUploadPaused?: boolean\n  uploadError?: Error\n  loadImageUrlError?: Error\n  isLoadingImageUrl?: boolean\n  imageUrl: string | null | undefined\n  progress: number | undefined\n}) => {\n  const isOffline = useIsOffline()\n\n  const tooltip = React.useMemo(() => {\n    if (isLoadingImageUrl && !imageUrl) {\n      return 'Attempting to load file preview. File is synced with submission.'\n    }\n    if (loadImageUrlError && !imageUrl) {\n      return 'File preview not available, however file is synced with submission.'\n    }\n\n    return 'Synced with submission.'\n  }, [imageUrl, isLoadingImageUrl, loadImageUrlError])\n\n  if (uploadError) {\n    return (\n      <Tooltip title={uploadError.message}>\n        <span className=\"attachment__status-wrapper\">\n          <MaterialIcon className=\"has-text-danger\">error</MaterialIcon>\n        </span>\n      </Tooltip>\n    )\n  }\n\n  if (isUploading) {\n    if (isUploadPaused) {\n      return (\n        <span className=\"attachment__status-wrapper\">\n          <MaterialIcon>pause</MaterialIcon>\n        </span>\n      )\n    }\n    if (isOffline) {\n      return (\n        <Tooltip title=\"Upload will start when you connect to the internet\">\n          <div className=\"cypress-attachment-uploading\">\n            <MaterialIcon className=\"has-text-warning\">wifi_off</MaterialIcon>\n          </div>\n        </Tooltip>\n      )\n    }\n    return (\n      <Tooltip title=\"Uploading\">\n        <div className=\"cypress-attachment-uploading\">\n          {Math.round(progress || 0)}%\n        </div>\n      </Tooltip>\n    )\n  }\n\n  return (\n    <Tooltip title={tooltip}>\n      <span className=\"attachment__status-wrapper\">\n        <MaterialIcon className=\"has-text-success\">check_circle</MaterialIcon>\n      </span>\n    </Tooltip>\n  )\n}\n\nexport default React.memo(AttachmentStatus)\n"]}

package/dist/components/renderer/attachments/DropdownMenu.js

@@ -2,6 +2,7 @@ import * as React from 'react';
 import clsx from 'clsx';
 import useBooleanState from '../../../hooks/useBooleanState';
 import useClickOutsideElement from '../../../hooks/useClickOutsideElement';
+import MaterialIcon from '../../MaterialIcon';
 const DropdownMenu = ({ element, onRemove, onDownload, onRetry }) => {
     const dropDownRef = React.useRef(null);
     const [isShowingMore, showMore, hideMore] = useBooleanState(false);
@@ -15,7 +16,7 @@ const DropdownMenu = ({ element, onRemove, onDownload, onRetry }) => {
         }), ref: dropDownRef },
         React.createElement("div", { className: "dropdown-trigger" },
             React.createElement("button", { type: "button", className: "button ob-files__menu-button cypress-file-menu-button", "aria-haspopup": "true", "aria-controls": "dropdown-menu", onClick: isShowingMore ? hideMore : showMore },
-                React.createElement("i", { className: "material-icons ob-files__menu-icon" }, "more_vert"))),
+                React.createElement(MaterialIcon, { className: "ob-files__menu-icon" }, "more_vert"))),
         React.createElement("div", { className: "dropdown-menu", role: "menu" },
             React.createElement("div", { className: "dropdown-content" },
                 onRetry && (React.createElement("a", { className: "dropdown-item cypress-file-retry-button", onClick: () => {