@oneblink/apps-react 8.2.1-beta.2 → 8.2.2-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+ import * as React from 'react';
2
+ export declare function Clickable(props: React.ComponentProps<'div'> & {
3
+ disabled?: boolean;
4
+ }): React.JSX.Element;
@@ -0,0 +1,16 @@
1
+ import * as React from 'react';
2
+ import clsx from 'clsx';
3
+ export function Clickable(props) {
4
+ const ref = React.useRef(null);
5
+ return (React.createElement("div", { ...props, role: "button", tabIndex: props.disabled ? -1 : 0, ref: ref, onKeyDown: (event) => {
6
+ var _a, _b;
7
+ if (ref.current === event.target &&
8
+ (event.key === 'Enter' || event.key === ' ')) {
9
+ (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, event);
10
+ }
11
+ (_b = props.onKeyDown) === null || _b === void 0 ? void 0 : _b.call(props, event);
12
+ }, className: clsx(props.className, {
13
+ 'is-clickable': !props.disabled,
14
+ }), "aria-disabled": props.disabled }));
15
+ }
16
+ //# sourceMappingURL=Clickable.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Clickable.js","sourceRoot":"","sources":["../../src/components/Clickable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,MAAM,UAAU,SAAS,CACvB,KAEC;IAED,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9C,OAAO,CACL,gCACM,KAAK,EACT,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACjC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE;;YACnB,IACE,GAAG,CAAC,OAAO,KAAK,KAAK,CAAC,MAAM;gBAC5B,CAAC,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,EAC5C,CAAC;gBACD,MAAA,KAAK,CAAC,OAAO,sDACX,KAAgE,CACjE,CAAA;YACH,CAAC;YACD,MAAA,KAAK,CAAC,SAAS,sDAAG,KAAK,CAAC,CAAA;QAC1B,CAAC,EACD,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;YAC/B,cAAc,EAAE,CAAC,KAAK,CAAC,QAAQ;SAChC,CAAC,mBACa,KAAK,CAAC,QAAQ,GAC7B,CACH,CAAA;AACH,CAAC","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\n\nexport function Clickable(\n props: React.ComponentProps<'div'> & {\n disabled?: boolean\n },\n) {\n const ref = React.useRef<HTMLDivElement>(null)\n return (\n <div\n {...props}\n role=\"button\"\n tabIndex={props.disabled ? -1 : 0}\n ref={ref}\n onKeyDown={(event) => {\n if (\n ref.current === event.target &&\n (event.key === 'Enter' || event.key === ' ')\n ) {\n props.onClick?.(\n event as unknown as React.MouseEvent<HTMLDivElement, MouseEvent>,\n )\n }\n props.onKeyDown?.(event)\n }}\n className={clsx(props.className, {\n 'is-clickable': !props.disabled,\n })}\n aria-disabled={props.disabled}\n />\n )\n}\n"]}
@@ -6,6 +6,7 @@ import clsx from 'clsx';
6
6
  import useFormDefinition from '../hooks/useFormDefinition';
7
7
  import ElementDOMId from '../utils/elementDOMIds';
8
8
  import scrollToElement from '../utils/scrollToElement';
9
+ import { Clickable } from './Clickable';
9
10
  const NO_PAGE_KEY = 'NO_PAGE';
10
11
  const getValidationErrors = ({ formElementsValidation, elements, page, idPrefix, }) => {
11
12
  return elements.reduce((memo, el) => {
@@ -39,7 +40,7 @@ const getValidationErrors = ({ formElementsValidation, elements, page, idPrefix,
39
40
  });
40
41
  if (validationData.set) {
41
42
  memo.push({
42
- id: elementDOMId.elementContainerDOMId,
43
+ elementDOMId,
43
44
  errorMessage: validationData.set,
44
45
  label: el.label,
45
46
  page,
@@ -87,7 +88,7 @@ const getValidationErrors = ({ formElementsValidation, elements, page, idPrefix,
87
88
  idPrefix,
88
89
  });
89
90
  memo.push({
90
- id: elementDOMId.elementContainerDOMId,
91
+ elementDOMId,
91
92
  label: el.label,
92
93
  page,
93
94
  errorMessage: validationMessage,
@@ -161,10 +162,10 @@ const ValidationErrorsCard = ({ formElementsValidation, currentPage, setPageId,
161
162
  page && (React.createElement("p", { className: clsx('ob-validation-notification-card-page-label ob-validation-color-transition', {
162
163
  'is-not-first': isNotFirstPage,
163
164
  }) }, page.label)),
164
- React.createElement("div", { className: "ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition" }, errors.map(({ errorMessage, label, id }, index, list) => {
165
+ React.createElement("div", { className: "ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition" }, errors.map(({ errorMessage, label, elementDOMId }, index, list) => {
165
166
  const isFirst = index === 0;
166
167
  const isLast = index === list.length - 1;
167
- return (React.createElement("div", { key: index, className: clsx('ob-list__item is-clickable ob-validation-notification-card-item', {
168
+ return (React.createElement(Clickable, { key: index, className: clsx('ob-list__item is-clickable ob-validation-notification-card-item', {
168
169
  'is-first': isFirst,
169
170
  'is-last': isLast,
170
171
  }), onClick: () => {
@@ -172,7 +173,7 @@ const ValidationErrorsCard = ({ formElementsValidation, currentPage, setPageId,
172
173
  setPageId(page.id);
173
174
  }
174
175
  scrollToElement({
175
- id,
176
+ elementDOMId,
176
177
  navigationTopOffset,
177
178
  scrollableContainerId,
178
179
  });
@@ -1 +1 @@
1
- {"version":3,"file":"ValidationErrorsCard.js","sourceRoot":"","sources":["../../src/components/ValidationErrorsCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconButton, Collapse, Tooltip } from '@mui/material'\nimport * as React from 'react'\nimport MaterialIcon from './MaterialIcon'\nimport { FormElementsValidation } from '../types/form'\nimport useBooleanState from '../hooks/useBooleanState'\nimport clsx from 'clsx'\nimport useFormDefinition from '../hooks/useFormDefinition'\nimport { FormTypes } from '@oneblink/types'\nimport usePages from '../hooks/usePages'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport scrollToElement from '../utils/scrollToElement'\n\nconst NO_PAGE_KEY = 'NO_PAGE'\ntype ValidationErrorMetaData = {\n id: string\n label: string\n page?: {\n label: string\n id: string\n }\n errorMessage: string\n}\nconst getValidationErrors = ({\n formElementsValidation,\n elements,\n page,\n idPrefix,\n}: {\n formElementsValidation: FormElementsValidation\n elements: FormTypes.FormElement[]\n page?: ValidationErrorMetaData['page']\n idPrefix: string\n}) => {\n return elements.reduce<Array<ValidationErrorMetaData>>((memo, el) => {\n switch (el.type) {\n case 'page': {\n memo.push(\n ...getValidationErrors({\n formElementsValidation,\n elements: el.elements,\n page: el,\n idPrefix,\n }),\n )\n break\n }\n case 'section': {\n memo.push(\n ...getValidationErrors({\n formElementsValidation,\n elements: el.elements,\n page,\n idPrefix,\n }),\n )\n break\n }\n case 'repeatableSet': {\n const validationData = formElementsValidation[el.name]\n if (\n !!validationData &&\n typeof validationData !== 'string' &&\n validationData.type === 'repeatableSet'\n ) {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n if (validationData.set) {\n memo.push({\n id: elementDOMId.elementContainerDOMId,\n errorMessage: validationData.set,\n label: el.label,\n page,\n })\n }\n for (const [key, entry] of Object.entries(validationData.entries)) {\n if (!entry) continue\n memo.push(\n ...getValidationErrors({\n formElementsValidation: entry,\n elements: el.elements,\n page,\n idPrefix: elementDOMId.repeatableSetEntryDOMIdPrefix(key),\n }),\n )\n }\n }\n break\n }\n case 'infoPage':\n case 'form': {\n const validationData = formElementsValidation[el.name]\n if (\n !!validationData &&\n typeof validationData !== 'string' &&\n validationData.type === 'formElements'\n ) {\n if (validationData.formElements && el.elements) {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n memo.push(\n ...getValidationErrors({\n formElementsValidation: validationData.formElements,\n elements: el.elements,\n page,\n idPrefix: elementDOMId.subFormDOMIdPrefix,\n }),\n )\n }\n }\n break\n }\n default: {\n const validationMessage = formElementsValidation[el.name]\n if (typeof validationMessage === 'string') {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n memo.push({\n id: elementDOMId.elementContainerDOMId,\n label: el.label,\n page,\n errorMessage: validationMessage,\n })\n }\n }\n }\n return memo\n }, [])\n}\n\nconst ValidationErrorsCard = ({\n formElementsValidation,\n currentPage,\n setPageId,\n navigationTopOffset,\n scrollableContainerId,\n}: {\n formElementsValidation: FormElementsValidation | undefined\n currentPage: FormTypes.PageElement\n setPageId: ReturnType<typeof usePages>['setPageId']\n navigationTopOffset: number | 'CALCULATE'\n scrollableContainerId?: string\n}) => {\n const [isExpanded, expand, contract] = useBooleanState(false)\n\n const form = useFormDefinition()\n\n const pagesWithValidationErrors = React.useMemo(() => {\n if (!formElementsValidation) return []\n const flatErrors = getValidationErrors({\n formElementsValidation,\n elements: form.elements,\n idPrefix: '',\n })\n\n // Organise into pages\n const pages = new Map<\n string,\n {\n page: ValidationErrorMetaData['page']\n errors: ValidationErrorMetaData[]\n }\n >()\n for (const error of flatErrors) {\n if (error.page) {\n // If error belongs to a page\n const existingSetEntry = pages.get(error.page.id)\n const errors = [...(existingSetEntry?.errors || []), error]\n const page = error.page\n\n pages.set(page.id, {\n page,\n errors,\n })\n } else {\n // No page associated with error\n const existingSetEntry = pages.get(NO_PAGE_KEY)\n const errors = [...(existingSetEntry?.errors || []), error]\n pages.set(NO_PAGE_KEY, {\n page: undefined,\n errors,\n })\n }\n }\n return Array.from(pages.values())\n }, [form.elements, formElementsValidation])\n\n return (\n <div className=\"ob-validation-notification-wrapper\">\n <div\n className={clsx(\n 'ob-validation-notification-card cypress-invalid-submit-attempt',\n {\n 'is-clickable': !isExpanded,\n 'is-contracted': !isExpanded,\n 'is-expanded': isExpanded,\n },\n )}\n onClick={!isExpanded ? expand : undefined}\n >\n <div className=\"ob-validation-notification-card-content\">\n <div className=\"ob-validation-notification-card-header-wrapper\">\n <div className=\"ob-validation-notification-card-header-title-wrapper\">\n <MaterialIcon\n className={clsx(\n 'ob-validation-notification-card-header-title-icon ob-validation-color-transition',\n {\n 'has-text-danger': isExpanded,\n 'has-text-white': !isExpanded,\n },\n )}\n >\n error\n </MaterialIcon>\n <p\n className={clsx(\n 'ob-validation-color-transition ob-validation-notification-card-header-title-text',\n {\n 'has-text-danger': isExpanded,\n 'has-text-white': !isExpanded,\n },\n )}\n >\n Validation Errors\n </p>\n </div>\n <div className=\"ob-validation-notification-card-header-collapse-icon-wrapper\">\n {isExpanded ? (\n <IconButton onClick={contract}>\n <MaterialIcon className=\"icon-small\">\n expand_more\n </MaterialIcon>\n </IconButton>\n ) : (\n <IconButton>\n <MaterialIcon className=\"icon-small has-text-white\">\n expand_less\n </MaterialIcon>\n </IconButton>\n )}\n </div>\n </div>\n <div className=\"ob-validation-notification-card-collapse-wrapper\">\n <Collapse in={isExpanded}>\n {pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {\n const isNotFirstPage = pageIndex > 0\n return (\n <React.Fragment key={pageIndex}>\n {page && (\n <p\n className={clsx(\n 'ob-validation-notification-card-page-label ob-validation-color-transition',\n {\n 'is-not-first': isNotFirstPage,\n },\n )}\n >\n {page.label}\n </p>\n )}\n <div className=\"ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition\">\n {errors.map(\n ({ errorMessage, label, id }, index, list) => {\n const isFirst = index === 0\n const isLast = index === list.length - 1\n return (\n <div\n key={index}\n className={clsx(\n 'ob-list__item is-clickable ob-validation-notification-card-item',\n {\n 'is-first': isFirst,\n 'is-last': isLast,\n },\n )}\n onClick={() => {\n if (page && page.id !== currentPage.id) {\n setPageId(page.id)\n }\n\n scrollToElement({\n id,\n navigationTopOffset,\n scrollableContainerId,\n })\n }}\n >\n <div className=\"ob-validation-notification-card-item-text\">\n <p>{label}</p>\n <Tooltip\n title={errorMessage}\n placement=\"left\"\n arrow\n >\n <p className=\"ob-validation-notification-card-item-text-error-message has-text-danger\">\n {errorMessage}\n </p>\n </Tooltip>\n </div>\n <MaterialIcon className=\"has-text-grey icon-small ob-validation-notification-card-item-icon\">\n chevron_right\n </MaterialIcon>\n </div>\n )\n },\n )}\n </div>\n </React.Fragment>\n )\n })}\n </Collapse>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default React.memo(ValidationErrorsCard)\n"]}
1
+ {"version":3,"file":"ValidationErrorsCard.js","sourceRoot":"","sources":["../../src/components/ValidationErrorsCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconButton, Collapse, Tooltip } from '@mui/material'\nimport * as React from 'react'\nimport MaterialIcon from './MaterialIcon'\nimport { FormElementsValidation } from '../types/form'\nimport useBooleanState from '../hooks/useBooleanState'\nimport clsx from 'clsx'\nimport useFormDefinition from '../hooks/useFormDefinition'\nimport { FormTypes } from '@oneblink/types'\nimport usePages from '../hooks/usePages'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport scrollToElement from '../utils/scrollToElement'\nimport { Clickable } from './Clickable'\n\nconst NO_PAGE_KEY = 'NO_PAGE'\ntype ValidationErrorMetaData = {\n elementDOMId: ElementDOMId\n label: string\n page?: {\n label: string\n id: string\n }\n errorMessage: string\n}\nconst getValidationErrors = ({\n formElementsValidation,\n elements,\n page,\n idPrefix,\n}: {\n formElementsValidation: FormElementsValidation\n elements: FormTypes.FormElement[]\n page?: ValidationErrorMetaData['page']\n idPrefix: string\n}) => {\n return elements.reduce<Array<ValidationErrorMetaData>>((memo, el) => {\n switch (el.type) {\n case 'page': {\n memo.push(\n ...getValidationErrors({\n formElementsValidation,\n elements: el.elements,\n page: el,\n idPrefix,\n }),\n )\n break\n }\n case 'section': {\n memo.push(\n ...getValidationErrors({\n formElementsValidation,\n elements: el.elements,\n page,\n idPrefix,\n }),\n )\n break\n }\n case 'repeatableSet': {\n const validationData = formElementsValidation[el.name]\n if (\n !!validationData &&\n typeof validationData !== 'string' &&\n validationData.type === 'repeatableSet'\n ) {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n if (validationData.set) {\n memo.push({\n elementDOMId,\n errorMessage: validationData.set,\n label: el.label,\n page,\n })\n }\n for (const [key, entry] of Object.entries(validationData.entries)) {\n if (!entry) continue\n memo.push(\n ...getValidationErrors({\n formElementsValidation: entry,\n elements: el.elements,\n page,\n idPrefix: elementDOMId.repeatableSetEntryDOMIdPrefix(key),\n }),\n )\n }\n }\n break\n }\n case 'infoPage':\n case 'form': {\n const validationData = formElementsValidation[el.name]\n if (\n !!validationData &&\n typeof validationData !== 'string' &&\n validationData.type === 'formElements'\n ) {\n if (validationData.formElements && el.elements) {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n memo.push(\n ...getValidationErrors({\n formElementsValidation: validationData.formElements,\n elements: el.elements,\n page,\n idPrefix: elementDOMId.subFormDOMIdPrefix,\n }),\n )\n }\n }\n break\n }\n default: {\n const validationMessage = formElementsValidation[el.name]\n if (typeof validationMessage === 'string') {\n const elementDOMId = new ElementDOMId({\n element: el,\n idPrefix,\n })\n memo.push({\n elementDOMId,\n label: el.label,\n page,\n errorMessage: validationMessage,\n })\n }\n }\n }\n return memo\n }, [])\n}\n\nconst ValidationErrorsCard = ({\n formElementsValidation,\n currentPage,\n setPageId,\n navigationTopOffset,\n scrollableContainerId,\n}: {\n formElementsValidation: FormElementsValidation | undefined\n currentPage: FormTypes.PageElement\n setPageId: ReturnType<typeof usePages>['setPageId']\n navigationTopOffset: number | 'CALCULATE'\n scrollableContainerId?: string\n}) => {\n const [isExpanded, expand, contract] = useBooleanState(false)\n\n const form = useFormDefinition()\n\n const pagesWithValidationErrors = React.useMemo(() => {\n if (!formElementsValidation) return []\n const flatErrors = getValidationErrors({\n formElementsValidation,\n elements: form.elements,\n idPrefix: '',\n })\n\n // Organise into pages\n const pages = new Map<\n string,\n {\n page: ValidationErrorMetaData['page']\n errors: ValidationErrorMetaData[]\n }\n >()\n for (const error of flatErrors) {\n if (error.page) {\n // If error belongs to a page\n const existingSetEntry = pages.get(error.page.id)\n const errors = [...(existingSetEntry?.errors || []), error]\n const page = error.page\n\n pages.set(page.id, {\n page,\n errors,\n })\n } else {\n // No page associated with error\n const existingSetEntry = pages.get(NO_PAGE_KEY)\n const errors = [...(existingSetEntry?.errors || []), error]\n pages.set(NO_PAGE_KEY, {\n page: undefined,\n errors,\n })\n }\n }\n return Array.from(pages.values())\n }, [form.elements, formElementsValidation])\n\n return (\n <div className=\"ob-validation-notification-wrapper\">\n <div\n className={clsx(\n 'ob-validation-notification-card cypress-invalid-submit-attempt',\n {\n 'is-clickable': !isExpanded,\n 'is-contracted': !isExpanded,\n 'is-expanded': isExpanded,\n },\n )}\n onClick={!isExpanded ? expand : undefined}\n >\n <div className=\"ob-validation-notification-card-content\">\n <div className=\"ob-validation-notification-card-header-wrapper\">\n <div className=\"ob-validation-notification-card-header-title-wrapper\">\n <MaterialIcon\n className={clsx(\n 'ob-validation-notification-card-header-title-icon ob-validation-color-transition',\n {\n 'has-text-danger': isExpanded,\n 'has-text-white': !isExpanded,\n },\n )}\n >\n error\n </MaterialIcon>\n <p\n className={clsx(\n 'ob-validation-color-transition ob-validation-notification-card-header-title-text',\n {\n 'has-text-danger': isExpanded,\n 'has-text-white': !isExpanded,\n },\n )}\n >\n Validation Errors\n </p>\n </div>\n <div className=\"ob-validation-notification-card-header-collapse-icon-wrapper\">\n {isExpanded ? (\n <IconButton onClick={contract}>\n <MaterialIcon className=\"icon-small\">\n expand_more\n </MaterialIcon>\n </IconButton>\n ) : (\n <IconButton>\n <MaterialIcon className=\"icon-small has-text-white\">\n expand_less\n </MaterialIcon>\n </IconButton>\n )}\n </div>\n </div>\n <div className=\"ob-validation-notification-card-collapse-wrapper\">\n <Collapse in={isExpanded}>\n {pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {\n const isNotFirstPage = pageIndex > 0\n return (\n <React.Fragment key={pageIndex}>\n {page && (\n <p\n className={clsx(\n 'ob-validation-notification-card-page-label ob-validation-color-transition',\n {\n 'is-not-first': isNotFirstPage,\n },\n )}\n >\n {page.label}\n </p>\n )}\n <div className=\"ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition\">\n {errors.map(\n (\n { errorMessage, label, elementDOMId },\n index,\n list,\n ) => {\n const isFirst = index === 0\n const isLast = index === list.length - 1\n return (\n <Clickable\n key={index}\n className={clsx(\n 'ob-list__item is-clickable ob-validation-notification-card-item',\n {\n 'is-first': isFirst,\n 'is-last': isLast,\n },\n )}\n onClick={() => {\n if (page && page.id !== currentPage.id) {\n setPageId(page.id)\n }\n\n scrollToElement({\n elementDOMId,\n navigationTopOffset,\n scrollableContainerId,\n })\n }}\n >\n <div className=\"ob-validation-notification-card-item-text\">\n <p>{label}</p>\n <Tooltip\n title={errorMessage}\n placement=\"left\"\n arrow\n >\n <p className=\"ob-validation-notification-card-item-text-error-message has-text-danger\">\n {errorMessage}\n </p>\n </Tooltip>\n </div>\n <MaterialIcon className=\"has-text-grey icon-small ob-validation-notification-card-item-icon\">\n chevron_right\n </MaterialIcon>\n </Clickable>\n )\n },\n )}\n </div>\n </React.Fragment>\n )\n })}\n </Collapse>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default React.memo(ValidationErrorsCard)\n"]}
@@ -95,7 +95,7 @@ function FormElementLocation({ id, element, value, onChange, validationMessage,
95
95
  'is-loading': isReverseGeocoding,
96
96
  }), onClick: onConfirm, disabled: element.readOnly || !location || isReverseGeocoding }, "Confirm"))) : (React.createElement(React.Fragment, null,
97
97
  React.createElement("button", { type: "button", className: "is-light button ob-button ob-button__clear ob-button-clear ob-location__button ob-location__button-clear cypress-clear-location-button", onClick: onClear, disabled: element.readOnly }, "Clear"),
98
- React.createElement("button", { type: "button", className: "is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button", onClick: onLocate, disabled: element.readOnly, onBlur: setIsDirty }, "Locate"))))),
98
+ React.createElement("button", { type: "button", className: "is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button", onClick: onLocate, disabled: element.readOnly, onBlur: setIsDirty, id: id }, "Locate"))))),
99
99
  isDisplayingValidationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
100
100
  React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, validationMessage))),
101
101
  reverseGeocodingErrorMsg && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
@@ -1 +1 @@
1
- {"version":3,"file":"FormElementLocation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementLocation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport clsx from 'clsx'\nimport { GoogleMap, Marker } from '@react-google-maps/api'\nimport queryString from 'query-string'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport useIsOffline from '../hooks/useIsOffline'\nimport * as geolocation from '../services/geolocation'\nimport OnLoading from '../components/renderer/OnLoading'\nimport defaultCoords from '../services/defaultCoordinates'\nimport useGoogle from '../hooks/useGoogle'\nimport useGoogleMapsApiKey from '../hooks/useGoogleMapsApiKey'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport { useReverseGeocodeContext } from '../components/renderer/ReverseGeocode'\n\ntype Props = {\n id: string\n element: FormTypes.LocationElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<Coords>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\ntype Coords = {\n latitude: number\n longitude: number\n zoom?: number\n}\n\nexport const stringifyLocation = (location: Coords | undefined) => {\n if (location) {\n return `${location.latitude},${location.longitude}`\n }\n}\n\nexport function parseLocationValue(value: unknown): Coords | undefined {\n if (!value || typeof value !== 'object') {\n return\n }\n\n const { latitude, longitude, zoom } = value as Record<string, unknown>\n if (typeof latitude !== 'number' || typeof longitude !== 'number') {\n return\n }\n\n return {\n latitude,\n longitude,\n zoom: typeof zoom === 'number' ? zoom : initialMapZoom,\n }\n}\n\nconst mapHeight = 300\nconst initialMapZoom = 15\nconst apiUrl = 'https://maps.googleapis.com/maps/api/staticmap'\n\nfunction FormElementLocation({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isLocationPickerOpen, showLocationPicker, hideLocationPicker] =\n useBooleanState(false)\n\n const [location, setLocation] = React.useState<Coords | undefined>(undefined)\n const onClear = React.useCallback(() => {\n hideLocationPicker()\n onChange(element, {\n value: undefined,\n })\n setLocation(undefined)\n }, [element, hideLocationPicker, onChange])\n\n const onCancel = React.useCallback(() => {\n hideLocationPicker()\n setLocation(parseLocationValue(value))\n }, [hideLocationPicker, value])\n\n const onLocate = React.useCallback(async () => {\n showLocationPicker()\n\n if (location) {\n return\n }\n\n let currentLocation = null\n try {\n const result = await geolocation.getCurrentPosition()\n currentLocation = result.coords\n } catch (err) {\n console.error(\n 'Error while attempting to find the users current location',\n err,\n )\n Sentry.captureException(err)\n } finally {\n setLocation(parseLocationValue(currentLocation || defaultCoords()))\n }\n }, [location, showLocationPicker])\n\n const isLoadingLocation = !location && isLocationPickerOpen\n\n const onConfirm = React.useCallback(() => {\n setIsDirty()\n hideLocationPicker()\n onChange(element, {\n value: location,\n })\n }, [element, hideLocationPicker, location, onChange, setIsDirty])\n\n // SET DEFAULT/PREFILL DATA\n React.useEffect(() => {\n const newValue = parseLocationValue(value)\n if (newValue) {\n setLocation(newValue)\n }\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n const { isReverseGeocoding, reverseGeocodingErrorMsg } =\n useReverseGeocodeContext()\n\n return (\n <div className=\"cypress-location-element\">\n <FormElementLabelContainer\n className=\"ob-location\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n <LocationDisplay\n isOpen={isLocationPickerOpen}\n isLoading={isLoadingLocation}\n location={location}\n onChange={setLocation}\n />\n\n <div className=\"buttons ob-buttons ob-location__buttons\">\n {isLocationPickerOpen || isReverseGeocoding ? (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__cancel ob-location__button ob-location__button-cancel cypress-cancel-location-button\"\n onClick={onCancel}\n disabled={element.readOnly || isReverseGeocoding}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className={clsx(\n 'is-primary button ob-button ob-button__confirm ob-location__button ob-location__button-confirm cypress-confirm-location-button',\n {\n 'is-loading': isReverseGeocoding,\n },\n )}\n onClick={onConfirm}\n disabled={element.readOnly || !location || isReverseGeocoding}\n >\n Confirm\n </button>\n </>\n ) : (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__clear ob-button-clear ob-location__button ob-location__button-clear cypress-clear-location-button\"\n onClick={onClear}\n disabled={element.readOnly}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button\"\n onClick={onLocate}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n >\n Locate\n </button>\n </>\n )}\n </div>\n </div>\n\n {isDisplayingValidationMessage && (\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 {reverseGeocodingErrorMsg && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {reverseGeocodingErrorMsg}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nconst LocationDisplay = React.memo(function LocationDisplay({\n isLoading,\n isOpen,\n location,\n onChange,\n}: {\n isLoading: boolean\n isOpen: boolean\n location: Coords | undefined\n onChange: (location: Coords) => void\n}) {\n const isOffline = useIsOffline()\n\n if (isLoading) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <OnLoading small></OnLoading>\n </div>\n </figure>\n )\n }\n\n if (isOffline) {\n return <LocationIsOffline location={location} isOpen={isOpen} />\n }\n\n if (isOpen) {\n if (!location) {\n // There is no location to display while user is attempting to pick a location.\n // This should never happen, if loading has finished a default should be set.\n // Fail fast!!!\n // https://en.wikipedia.org/wiki/Fail-fast\n throw new Error(\n 'Default location was not set for \"location\" form element',\n )\n }\n\n return <LocationPicker location={location} onChange={onChange} />\n }\n\n if (location) {\n return <LocationImage location={location} />\n }\n\n return null\n})\n\nfunction LocationIsOfflineFigureContent({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <h4 className=\"title is-4\" role=\"alert\">\n You are currently offline\n </h4>\n {children}\n </div>\n </figure>\n )\n}\n\nconst LocationIsOffline = React.memo(function LocationIsOffline({\n location,\n isOpen,\n}: {\n location: Coords | undefined\n isOpen: boolean\n}) {\n if (isOpen) {\n if (location) {\n // If user is offline and attempting to pick a location and there is one set already\n return (\n <LocationIsOfflineFigureContent>\n <p>\n Click the <b>Confirm</b> button below to set the location to your\n current position.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and attempting to pick a location and there is one nothing set yet\n return (\n <LocationIsOfflineFigureContent>\n <p>\n We could not find your current location. Click the <b>Cancel</b>{' '}\n button below to try again.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and has confirmed a location\n if (location) {\n return (\n <LocationIsOfflineFigureContent>\n <h3 className=\"title is-3 ob-location__latitude\">Latitude</h3>\n <p>\n <b>{location.latitude}</b>\n </p>\n <h3 className=\"title is-3 ob-location__longitude\">Longitude</h3>\n <p>\n <b>{location.longitude}</b>\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // User is offline with no location set and not attempting to pick a location\n return null\n})\n\nconst LocationImage = React.memo(function LocationImage({\n location,\n}: {\n location: Coords\n}) {\n const googleMapsApiKey = useGoogleMapsApiKey()\n\n const staticUrl = React.useMemo(() => {\n const center = `${location.latitude},${location.longitude}`\n const queries = {\n key: googleMapsApiKey,\n size: `${mapHeight}x${mapHeight}`,\n zoom: location.zoom,\n center,\n markers: `color:red|${center}`,\n }\n return `${apiUrl}?${queryString.stringify(queries)}`\n }, [googleMapsApiKey, location])\n\n return (\n <figure className=\"ob-figure\">\n <img\n className=\"ob-location__map\"\n alt={`map with center at ${location.latitude} latitude, ${location.longitude} longitude`}\n src={staticUrl}\n height={mapHeight}\n width={mapHeight}\n />\n </figure>\n )\n})\n\nconst LocationPicker = React.memo(function LocationPicker({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const { isLoaded } = useGoogle()\n\n return (\n <figure className=\"ob-figure\">\n {isLoaded && (\n <GoogleLocationPicker location={location} onChange={onChange} />\n )}\n </figure>\n )\n})\n\nconst GoogleLocationPicker = React.memo(function GoogleLocationPicker({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const [map, setMap] = React.useState<google.maps.Map | null>(null)\n const [marker, setMarker] = React.useState<google.maps.Marker | null>(null)\n\n const originalCenter = React.useRef<{ lat: number; lng: number }>({\n lat: location.latitude,\n lng: location.longitude,\n })\n\n const markerAnimation = React.useMemo(() => google.maps.Animation.DROP, [])\n\n const onZoomChanged = React.useCallback(() => {\n if (!map) {\n return\n }\n\n onChange({\n latitude: location.latitude,\n longitude: location.longitude,\n zoom: map.getZoom(),\n })\n }, [location.latitude, location.longitude, map, onChange])\n\n const handleDragEnd = React.useCallback(\n (e: google.maps.MapMouseEvent) => {\n if (!e.latLng) {\n return\n }\n const { lat, lng } = e.latLng.toJSON()\n onChange({\n latitude: lat,\n longitude: lng,\n zoom: location.zoom,\n })\n if (map) {\n map.panTo(e.latLng)\n }\n },\n [location.zoom, map, onChange],\n )\n\n const handleClick = React.useCallback(\n (e: google.maps.MapMouseEvent) => {\n handleDragEnd(e)\n\n if (!e.latLng || !marker) {\n return\n }\n\n marker.setPosition(e.latLng)\n // this enables the marker to animate after moving it\n marker.setMap(null)\n marker.setAnimation(markerAnimation)\n marker.setMap(map)\n },\n [handleDragEnd, map, marker, markerAnimation],\n )\n\n return (\n <GoogleMap\n onLoad={(map) => setMap(map)}\n onUnmount={() => setMap(null)}\n mapContainerStyle={{\n height: 300,\n }}\n center={originalCenter.current}\n zoom={location.zoom}\n onZoomChanged={onZoomChanged}\n onClick={handleClick}\n options={{ draggableCursor: 'pointer' }}\n >\n <Marker\n onLoad={(marker) => setMarker(marker)}\n onUnmount={() => setMarker(null)}\n animation={markerAnimation}\n position={originalCenter.current}\n draggable\n onDragEnd={handleDragEnd}\n ></Marker>\n </GoogleMap>\n )\n})\n\nexport default React.memo(FormElementLocation)\n"]}
1
+ {"version":3,"file":"FormElementLocation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementLocation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport clsx from 'clsx'\nimport { GoogleMap, Marker } from '@react-google-maps/api'\nimport queryString from 'query-string'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport useIsOffline from '../hooks/useIsOffline'\nimport * as geolocation from '../services/geolocation'\nimport OnLoading from '../components/renderer/OnLoading'\nimport defaultCoords from '../services/defaultCoordinates'\nimport useGoogle from '../hooks/useGoogle'\nimport useGoogleMapsApiKey from '../hooks/useGoogleMapsApiKey'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { LookupNotificationContext } from '../hooks/useLookupNotification'\nimport { useReverseGeocodeContext } from '../components/renderer/ReverseGeocode'\n\ntype Props = {\n id: string\n element: FormTypes.LocationElement\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<Coords>\n displayValidationMessage: boolean\n validationMessage: string | undefined\n} & IsDirtyProps\n\ntype Coords = {\n latitude: number\n longitude: number\n zoom?: number\n}\n\nexport const stringifyLocation = (location: Coords | undefined) => {\n if (location) {\n return `${location.latitude},${location.longitude}`\n }\n}\n\nexport function parseLocationValue(value: unknown): Coords | undefined {\n if (!value || typeof value !== 'object') {\n return\n }\n\n const { latitude, longitude, zoom } = value as Record<string, unknown>\n if (typeof latitude !== 'number' || typeof longitude !== 'number') {\n return\n }\n\n return {\n latitude,\n longitude,\n zoom: typeof zoom === 'number' ? zoom : initialMapZoom,\n }\n}\n\nconst mapHeight = 300\nconst initialMapZoom = 15\nconst apiUrl = 'https://maps.googleapis.com/maps/api/staticmap'\n\nfunction FormElementLocation({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isLocationPickerOpen, showLocationPicker, hideLocationPicker] =\n useBooleanState(false)\n\n const [location, setLocation] = React.useState<Coords | undefined>(undefined)\n const onClear = React.useCallback(() => {\n hideLocationPicker()\n onChange(element, {\n value: undefined,\n })\n setLocation(undefined)\n }, [element, hideLocationPicker, onChange])\n\n const onCancel = React.useCallback(() => {\n hideLocationPicker()\n setLocation(parseLocationValue(value))\n }, [hideLocationPicker, value])\n\n const onLocate = React.useCallback(async () => {\n showLocationPicker()\n\n if (location) {\n return\n }\n\n let currentLocation = null\n try {\n const result = await geolocation.getCurrentPosition()\n currentLocation = result.coords\n } catch (err) {\n console.error(\n 'Error while attempting to find the users current location',\n err,\n )\n Sentry.captureException(err)\n } finally {\n setLocation(parseLocationValue(currentLocation || defaultCoords()))\n }\n }, [location, showLocationPicker])\n\n const isLoadingLocation = !location && isLocationPickerOpen\n\n const onConfirm = React.useCallback(() => {\n setIsDirty()\n hideLocationPicker()\n onChange(element, {\n value: location,\n })\n }, [element, hideLocationPicker, location, onChange, setIsDirty])\n\n // SET DEFAULT/PREFILL DATA\n React.useEffect(() => {\n const newValue = parseLocationValue(value)\n if (newValue) {\n setLocation(newValue)\n }\n }, [value])\n\n const { isLookingUp } = React.useContext(LookupNotificationContext)\n const isDisplayingValidationMessage =\n (isDirty || displayValidationMessage) && !!validationMessage && !isLookingUp\n\n const { isReverseGeocoding, reverseGeocodingErrorMsg } =\n useReverseGeocodeContext()\n\n return (\n <div className=\"cypress-location-element\">\n <FormElementLabelContainer\n className=\"ob-location\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n <LocationDisplay\n isOpen={isLocationPickerOpen}\n isLoading={isLoadingLocation}\n location={location}\n onChange={setLocation}\n />\n\n <div className=\"buttons ob-buttons ob-location__buttons\">\n {isLocationPickerOpen || isReverseGeocoding ? (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__cancel ob-location__button ob-location__button-cancel cypress-cancel-location-button\"\n onClick={onCancel}\n disabled={element.readOnly || isReverseGeocoding}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className={clsx(\n 'is-primary button ob-button ob-button__confirm ob-location__button ob-location__button-confirm cypress-confirm-location-button',\n {\n 'is-loading': isReverseGeocoding,\n },\n )}\n onClick={onConfirm}\n disabled={element.readOnly || !location || isReverseGeocoding}\n >\n Confirm\n </button>\n </>\n ) : (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__clear ob-button-clear ob-location__button ob-location__button-clear cypress-clear-location-button\"\n onClick={onClear}\n disabled={element.readOnly}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button\"\n onClick={onLocate}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n id={id}\n >\n Locate\n </button>\n </>\n )}\n </div>\n </div>\n\n {isDisplayingValidationMessage && (\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 {reverseGeocodingErrorMsg && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {reverseGeocodingErrorMsg}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nconst LocationDisplay = React.memo(function LocationDisplay({\n isLoading,\n isOpen,\n location,\n onChange,\n}: {\n isLoading: boolean\n isOpen: boolean\n location: Coords | undefined\n onChange: (location: Coords) => void\n}) {\n const isOffline = useIsOffline()\n\n if (isLoading) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <OnLoading small></OnLoading>\n </div>\n </figure>\n )\n }\n\n if (isOffline) {\n return <LocationIsOffline location={location} isOpen={isOpen} />\n }\n\n if (isOpen) {\n if (!location) {\n // There is no location to display while user is attempting to pick a location.\n // This should never happen, if loading has finished a default should be set.\n // Fail fast!!!\n // https://en.wikipedia.org/wiki/Fail-fast\n throw new Error(\n 'Default location was not set for \"location\" form element',\n )\n }\n\n return <LocationPicker location={location} onChange={onChange} />\n }\n\n if (location) {\n return <LocationImage location={location} />\n }\n\n return null\n})\n\nfunction LocationIsOfflineFigureContent({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <h4 className=\"title is-4\" role=\"alert\">\n You are currently offline\n </h4>\n {children}\n </div>\n </figure>\n )\n}\n\nconst LocationIsOffline = React.memo(function LocationIsOffline({\n location,\n isOpen,\n}: {\n location: Coords | undefined\n isOpen: boolean\n}) {\n if (isOpen) {\n if (location) {\n // If user is offline and attempting to pick a location and there is one set already\n return (\n <LocationIsOfflineFigureContent>\n <p>\n Click the <b>Confirm</b> button below to set the location to your\n current position.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and attempting to pick a location and there is one nothing set yet\n return (\n <LocationIsOfflineFigureContent>\n <p>\n We could not find your current location. Click the <b>Cancel</b>{' '}\n button below to try again.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and has confirmed a location\n if (location) {\n return (\n <LocationIsOfflineFigureContent>\n <h3 className=\"title is-3 ob-location__latitude\">Latitude</h3>\n <p>\n <b>{location.latitude}</b>\n </p>\n <h3 className=\"title is-3 ob-location__longitude\">Longitude</h3>\n <p>\n <b>{location.longitude}</b>\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // User is offline with no location set and not attempting to pick a location\n return null\n})\n\nconst LocationImage = React.memo(function LocationImage({\n location,\n}: {\n location: Coords\n}) {\n const googleMapsApiKey = useGoogleMapsApiKey()\n\n const staticUrl = React.useMemo(() => {\n const center = `${location.latitude},${location.longitude}`\n const queries = {\n key: googleMapsApiKey,\n size: `${mapHeight}x${mapHeight}`,\n zoom: location.zoom,\n center,\n markers: `color:red|${center}`,\n }\n return `${apiUrl}?${queryString.stringify(queries)}`\n }, [googleMapsApiKey, location])\n\n return (\n <figure className=\"ob-figure\">\n <img\n className=\"ob-location__map\"\n alt={`map with center at ${location.latitude} latitude, ${location.longitude} longitude`}\n src={staticUrl}\n height={mapHeight}\n width={mapHeight}\n />\n </figure>\n )\n})\n\nconst LocationPicker = React.memo(function LocationPicker({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const { isLoaded } = useGoogle()\n\n return (\n <figure className=\"ob-figure\">\n {isLoaded && (\n <GoogleLocationPicker location={location} onChange={onChange} />\n )}\n </figure>\n )\n})\n\nconst GoogleLocationPicker = React.memo(function GoogleLocationPicker({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const [map, setMap] = React.useState<google.maps.Map | null>(null)\n const [marker, setMarker] = React.useState<google.maps.Marker | null>(null)\n\n const originalCenter = React.useRef<{ lat: number; lng: number }>({\n lat: location.latitude,\n lng: location.longitude,\n })\n\n const markerAnimation = React.useMemo(() => google.maps.Animation.DROP, [])\n\n const onZoomChanged = React.useCallback(() => {\n if (!map) {\n return\n }\n\n onChange({\n latitude: location.latitude,\n longitude: location.longitude,\n zoom: map.getZoom(),\n })\n }, [location.latitude, location.longitude, map, onChange])\n\n const handleDragEnd = React.useCallback(\n (e: google.maps.MapMouseEvent) => {\n if (!e.latLng) {\n return\n }\n const { lat, lng } = e.latLng.toJSON()\n onChange({\n latitude: lat,\n longitude: lng,\n zoom: location.zoom,\n })\n if (map) {\n map.panTo(e.latLng)\n }\n },\n [location.zoom, map, onChange],\n )\n\n const handleClick = React.useCallback(\n (e: google.maps.MapMouseEvent) => {\n handleDragEnd(e)\n\n if (!e.latLng || !marker) {\n return\n }\n\n marker.setPosition(e.latLng)\n // this enables the marker to animate after moving it\n marker.setMap(null)\n marker.setAnimation(markerAnimation)\n marker.setMap(map)\n },\n [handleDragEnd, map, marker, markerAnimation],\n )\n\n return (\n <GoogleMap\n onLoad={(map) => setMap(map)}\n onUnmount={() => setMap(null)}\n mapContainerStyle={{\n height: 300,\n }}\n center={originalCenter.current}\n zoom={location.zoom}\n onZoomChanged={onZoomChanged}\n onClick={handleClick}\n options={{ draggableCursor: 'pointer' }}\n >\n <Marker\n onLoad={(marker) => setMarker(marker)}\n onUnmount={() => setMarker(null)}\n animation={markerAnimation}\n position={originalCenter.current}\n draggable\n onDragEnd={handleDragEnd}\n ></Marker>\n </GoogleMap>\n )\n})\n\nexport default React.memo(FormElementLocation)\n"]}
@@ -154,13 +154,13 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
154
154
  }, [element.layout]);
155
155
  return (React.createElement("div", { className: clsx('cypress-repeatable-set-element', validationClassName), "aria-labelledby": `${id}-label`, "aria-describedby": ariaDescribedby, role: "region" },
156
156
  React.createElement(FormElementLabelContainer, { className: clsx('ob-repeatable-set', isEven ? 'even' : 'odd', repeatableSetContainerClass), element: element, id: id, required: !!minSetEntries && minSetEntries > 0 },
157
- element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(0), element: element, classes: ['ob-button-repeatable-set-layout__multiple-add-buttons'] })),
157
+ element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(0), element: element, id: id, classes: ['ob-button-repeatable-set-layout__multiple-add-buttons'] })),
158
158
  entries.map((entry, index) => {
159
159
  return (React.createElement(RepeatableSetEntry, { key: entry[ENTRY_ID_PROPERTY_NAME], formId: formId, index: index, id: id, isEven: isEven, entry: entry, element: element, showAddButton: element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton, onChange: handleNestedChange, onLookup: onLookup, onAdd: handleAddEntry, onRemove: handleRemoveEntry, formElementsConditionallyShown: repeatableSetEntriesConditionallyShown[index.toString()], formElementsValidation: repeatableSetValidation &&
160
160
  repeatableSetValidation.entries[index.toString()], displayValidationMessages: displayValidationMessage, onUpdateFormElements: onUpdateFormElements }));
161
161
  }),
162
162
  (!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&
163
- showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(entries.length), element: element })),
163
+ showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(entries.length), element: element, id: id })),
164
164
  (isDirty || displayValidationMessage) &&
165
165
  !!repeatableSetValidation &&
166
166
  !!repeatableSetValidation.set && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
@@ -272,8 +272,8 @@ const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id,
272
272
  'ob-button-repeatable-set-layout__multiple-add-buttons',
273
273
  ] }))))));
274
274
  });
275
- function AddButton({ onAdd, element, classes, }) {
276
- return (React.createElement("button", { type: "button", className: clsx('button ob-button ob-button__add cypress-add-repeatable-set is-primary', classes), onClick: onAdd, disabled: element.readOnly, "aria-label": element.addSetEntryLabel ? undefined : 'Add Entry' },
275
+ function AddButton({ id, onAdd, element, classes, }) {
276
+ return (React.createElement("button", { type: "button", className: clsx('button ob-button ob-button__add cypress-add-repeatable-set is-primary', classes), onClick: onAdd, disabled: element.readOnly, "aria-label": element.addSetEntryLabel ? undefined : 'Add Entry', id: id },
277
277
  React.createElement("span", { className: "icon" },
278
278
  React.createElement(MaterialIcon, null, "add")),
279
279
  !!element.addSetEntryLabel && React.createElement("span", null, element.addSetEntryLabel)));
@@ -1 +1 @@
1
- {"version":3,"file":"FormElementRepeatableSet.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRepeatableSet.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport useBooleanState from '../hooks/useBooleanState'\nimport generateDefaultData, {\n ENTRY_ID_PROPERTY_NAME,\n generateNewRepeatableSetEntry,\n} from '../services/generate-default-data'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport Modal from '../components/renderer/Modal'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useValidationClass from '../hooks/useValidationClass'\nimport {\n ExecutedLookups,\n FormElementConditionallyShown,\n FormElementLookupHandler,\n FormElementsConditionallyShown,\n FormElementsValidation,\n FormElementValidation,\n NestedFormElementValueChangeHandler,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport useFormElementRepeatableSetEntries from '../hooks/useFormElementRepeatableSetEntries'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport { Collapse } from '@mui/material'\n\ntype Props = {\n formId: number\n id: string\n isEven: boolean\n element: FormTypes.RepeatableSetElement\n value: Array<SubmissionTypes.S3SubmissionData['submission']> | undefined\n onChange: NestedFormElementValueChangeHandler<\n SubmissionTypes.S3SubmissionData['submission'][]\n >\n onLookup: FormElementLookupHandler\n formElementConditionallyShown: FormElementConditionallyShown | undefined\n formElementValidation: FormElementValidation | undefined\n displayValidationMessage: boolean\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nconst RepeatableSetIndexContext = React.createContext<number>(0)\n\nfunction RepeatableSetEntryProvider({\n index,\n isAnimated,\n onRemove,\n children,\n}: {\n isAnimated: boolean\n index: number\n onRemove: (index: number) => void\n children: (renderProps: { onRemove: () => void }) => React.ReactNode\n}) {\n const [isExpanded, setIsExpanded] = React.useState(true)\n\n const handleRemove = React.useCallback(() => {\n if (isAnimated) {\n setIsExpanded(false)\n } else {\n onRemove(index)\n }\n }, [index, isAnimated, onRemove])\n\n const node = (\n <RepeatableSetIndexContext.Provider value={index}>\n {children({\n onRemove: handleRemove,\n })}\n </RepeatableSetIndexContext.Provider>\n )\n\n if (!isAnimated) {\n return node\n }\n\n return (\n <Collapse\n in={isExpanded}\n appear\n onExited={() => {\n onRemove(index)\n }}\n classes={{\n root: 'ob-repeatable-set__collapsible',\n wrapper: 'ob-repeatable-set__collapsible-wrapper',\n wrapperInner: 'ob-repeatable-set__collapsible-wrapper-inner',\n }}\n >\n {node}\n </Collapse>\n )\n}\n\nexport function useRepeatableSetIndexText(text: string) {\n const index = React.useContext(RepeatableSetIndexContext)\n return React.useMemo(\n () => text.replace('{INDEX}', (index + 1).toString()),\n [index, text],\n )\n}\n\nfunction FormElementRepeatableSet({\n formId,\n element,\n value,\n formElementValidation,\n id,\n isEven,\n displayValidationMessage,\n formElementConditionallyShown,\n onChange,\n onLookup,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const entries = React.useMemo(\n () => (Array.isArray(value) ? value : []),\n [value],\n )\n\n const handleAddEntry = React.useCallback(\n (index: number) => {\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = [...(existingEntries || [])]\n const entry = generateDefaultData(\n element.elements,\n generateNewRepeatableSetEntry(),\n )\n\n newEntries.splice(index, 0, entry)\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n if (\n existingExecutedLookups !== undefined &&\n !Array.isArray(existingExecutedLookups)\n ) {\n return []\n }\n\n const newExistingExecutedLookups = [\n ...((existingExecutedLookups as ExecutedLookups[]) ??\n Array.from(Array(entries.length))),\n ]\n newExistingExecutedLookups.push({})\n return newExistingExecutedLookups\n },\n })\n setIsDirty()\n },\n [element, onChange, setIsDirty, entries],\n )\n\n const handleRemoveEntry = React.useCallback(\n (index: number) => {\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = [...(existingEntries || [])]\n newEntries.splice(index, 1)\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n if (!Array.isArray(existingExecutedLookups)) {\n return []\n }\n const newExistingExecutedLookups = [...existingExecutedLookups]\n\n newExistingExecutedLookups.splice(index, 1)\n return newExistingExecutedLookups\n },\n })\n setIsDirty()\n },\n [element, onChange, setIsDirty],\n )\n\n const handleNestedChange = React.useCallback(\n (\n index: number,\n nestedElement: FormTypes.FormElement,\n {\n value,\n executedLookups,\n }: Parameters<NestedFormElementValueChangeHandler>[1],\n ) => {\n if (!('name' in nestedElement)) {\n return\n }\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = (existingEntries || []).map((entry, i) => {\n if (i === index) {\n return {\n ...entry,\n [nestedElement.name]:\n typeof value === 'function'\n ? value(entry[nestedElement.name])\n : value,\n }\n } else {\n return entry\n }\n })\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n const elementExecutedLookups = existingExecutedLookups ?? []\n if (!Array.isArray(elementExecutedLookups)) {\n return elementExecutedLookups\n }\n const newExecutedLookups = elementExecutedLookups.map(\n (executedLookup, i) => {\n if (i === index) {\n const updatedExecutedLookups =\n typeof executedLookups === 'function'\n ? executedLookups(executedLookup?.[nestedElement.name])\n : executedLookups\n return {\n ...executedLookup,\n [nestedElement.name]: updatedExecutedLookups,\n }\n }\n return executedLookup\n },\n )\n return newExecutedLookups\n },\n })\n },\n [element, onChange],\n )\n\n const { minSetEntries, maxSetEntries } =\n useFormElementRepeatableSetEntries(element)\n\n const repeatableSetValidation = React.useMemo(\n () =>\n !formElementValidation ||\n typeof formElementValidation === 'string' ||\n formElementValidation.type !== 'repeatableSet'\n ? undefined\n : formElementValidation,\n [formElementValidation],\n )\n\n const repeatableSetEntriesConditionallyShown =\n formElementConditionallyShown &&\n formElementConditionallyShown.type === 'repeatableSet'\n ? formElementConditionallyShown.entries\n : {}\n\n const { validationClassName } = useValidationClass({\n formElementsValid: !repeatableSetValidation,\n displayInvalidClassName: isDirty || displayValidationMessage,\n validClassName: 'ob-repeatable-set-element__valid',\n invalidClassName: 'ob-repeatable-set-element__invalid',\n })\n\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const showAddButton = React.useMemo(\n () => !maxSetEntries || entries.length < maxSetEntries,\n [maxSetEntries, entries.length],\n )\n\n const repeatableSetContainerClass = React.useMemo(() => {\n const prefix = 'ob-repeatable-set-container-layout__'\n switch (element.layout) {\n case 'MULTIPLE_ADD_BUTTONS':\n return prefix + 'multiple-add-buttons'\n default:\n return 'single-add-button'\n }\n }, [element.layout])\n\n return (\n <div\n className={clsx('cypress-repeatable-set-element', validationClassName)}\n aria-labelledby={`${id}-label`}\n aria-describedby={ariaDescribedby}\n role=\"region\"\n >\n {/* */}\n <FormElementLabelContainer\n className={clsx(\n 'ob-repeatable-set',\n isEven ? 'even' : 'odd',\n repeatableSetContainerClass,\n )}\n element={element}\n id={id}\n required={!!minSetEntries && minSetEntries > 0}\n >\n {element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (\n <AddButton\n onAdd={() => handleAddEntry(0)}\n element={element}\n classes={['ob-button-repeatable-set-layout__multiple-add-buttons']}\n />\n )}\n {entries.map((entry, index) => {\n return (\n <RepeatableSetEntry\n key={entry[ENTRY_ID_PROPERTY_NAME] as string}\n formId={formId}\n index={index}\n id={id}\n isEven={isEven}\n entry={entry}\n element={element}\n showAddButton={\n element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton\n }\n onChange={handleNestedChange}\n onLookup={onLookup}\n onAdd={handleAddEntry}\n onRemove={handleRemoveEntry}\n formElementsConditionallyShown={\n repeatableSetEntriesConditionallyShown[index.toString()]\n }\n formElementsValidation={\n repeatableSetValidation &&\n repeatableSetValidation.entries[index.toString()]\n }\n displayValidationMessages={displayValidationMessage}\n onUpdateFormElements={onUpdateFormElements}\n />\n )\n })}\n {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&\n showAddButton && (\n <AddButton\n onAdd={() => handleAddEntry(entries.length)}\n element={element}\n />\n )}\n {(isDirty || displayValidationMessage) &&\n !!repeatableSetValidation &&\n !!repeatableSetValidation.set && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {repeatableSetValidation.set}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementRepeatableSet)\n\ntype RepeatableSetEntryProps = {\n formId: number\n id: string\n index: number\n isEven: boolean\n entry: SubmissionTypes.S3SubmissionData['submission']\n element: FormTypes.RepeatableSetElement\n formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n formElementsValidation: FormElementsValidation | undefined\n displayValidationMessages: boolean\n showAddButton: boolean\n onChange: (\n index: number,\n formElement: FormTypes.FormElement,\n {\n value,\n executedLookups,\n }: Parameters<NestedFormElementValueChangeHandler>[1],\n ) => void\n onLookup: FormElementLookupHandler\n onAdd: (index: number) => unknown\n onRemove: (index: number) => unknown\n onUpdateFormElements: UpdateFormElementsHandler\n}\n\nconst RepeatableSetEntry = React.memo<RepeatableSetEntryProps>(\n function RepeatableSetEntry({\n formId,\n id,\n index,\n isEven,\n entry,\n element,\n formElementsConditionallyShown,\n displayValidationMessages,\n formElementsValidation,\n onChange,\n onLookup,\n onAdd,\n onRemove,\n onUpdateFormElements,\n showAddButton,\n }: RepeatableSetEntryProps) {\n const [isConfirmingRemove, confirmRemove, cancelRemove] =\n useBooleanState(false)\n\n const handleChange: NestedFormElementValueChangeHandler = React.useCallback(\n (nestedElement, { value, executedLookups }) => {\n onChange(index, nestedElement, {\n value,\n executedLookups,\n })\n },\n [index, onChange],\n )\n\n const handleLookup = React.useCallback<FormElementLookupHandler>(\n (mergeLookupResults) => {\n onLookup((currentFormSubmission) => {\n let newEntry = {}\n const entries = currentFormSubmission.submission[\n element.name\n ] as Array<SubmissionTypes.S3SubmissionData['submission']>\n const repeatableSetExecutedLookups =\n (currentFormSubmission.executedLookups?.[\n element.name\n ] as ExecutedLookups[]) ?? Array.from(Array(entries.length))\n // if the repeatable set is prefilled or has minimum entries then executed lookups exists,\n // but is an empty array\n for (let i = 0; i < entries.length; i++) {\n if (!repeatableSetExecutedLookups[index]) {\n repeatableSetExecutedLookups[index] = {}\n }\n }\n let newExecutedLookups: ExecutedLookups = {}\n const elements = currentFormSubmission.elements.map((formElement) => {\n if (\n formElement.type === 'repeatableSet' &&\n formElement.name === element.name\n ) {\n const { elements, submission, executedLookups } =\n mergeLookupResults({\n elements: formElement.elements,\n submission: entries[index],\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n executedLookups: repeatableSetExecutedLookups[index] ?? {},\n })\n newEntry = submission\n newExecutedLookups = executedLookups as ExecutedLookups\n return {\n ...formElement,\n elements,\n }\n }\n return formElement\n })\n\n const submission = {\n ...currentFormSubmission.submission,\n [element.name]: entries.map((entry, i) => {\n if (i === index) {\n return newEntry\n }\n return entry\n }),\n }\n\n let updatedExecutedLookups = currentFormSubmission.executedLookups\n if (Array.isArray(repeatableSetExecutedLookups)) {\n updatedExecutedLookups = {\n ...currentFormSubmission.executedLookups,\n [element.name]: repeatableSetExecutedLookups.map((entry, i) => {\n if (i == index) {\n return newExecutedLookups\n }\n return entry\n }),\n }\n }\n\n return {\n elements,\n submission,\n executedLookups: updatedExecutedLookups,\n }\n })\n },\n [element.name, index, onLookup],\n )\n\n const { validationClassName } = useValidationClass({\n formElementsValid: !formElementsValidation,\n displayInvalidClassName: displayValidationMessages,\n validClassName: 'ob-repeatable-set__valid',\n invalidClassName: 'ob-repeatable-set__invalid',\n })\n\n const handleUpdateNestedFormElements =\n React.useCallback<UpdateFormElementsHandler>(\n (setter) => {\n onUpdateFormElements((formElements) => {\n return formElements.map((formElement) => {\n if (\n formElement.id === element.id &&\n formElement.type === 'repeatableSet'\n ) {\n return {\n ...formElement,\n elements: setter(formElement.elements),\n }\n }\n return formElement\n })\n })\n },\n [element.id, onUpdateFormElements],\n )\n\n const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n return (\n <RepeatableSetEntryProvider\n index={index}\n onRemove={onRemove}\n isAnimated={element.layout === 'MULTIPLE_ADD_BUTTONS'}\n >\n {({ onRemove }) => (\n <>\n <Modal\n isOpen={isConfirmingRemove}\n className=\"cypress-repeatable-set-prompt\"\n titleClassName=\"cypress-repeatable-set-remove-entry-header\"\n title={element.removeSetEntryLabel || 'Remove Entry'}\n actions={\n <>\n <button\n type=\"button\"\n className=\"button ob-button is-light cypress-cancel-repeatable-set\"\n onClick={cancelRemove}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-confirm-repeatable-set\"\n onClick={() => {\n cancelRemove()\n onRemove()\n }}\n autoFocus\n >\n Yes\n </button>\n </>\n }\n >\n Are you sure you want to remove this entry?\n </Modal>\n\n <div\n className={clsx(\n 'ob-repeatable-set__container cypress-repeatable-set-container',\n validationClassName,\n )}\n >\n {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') && (\n <RemoveButton\n onConfirmRemove={confirmRemove}\n element={element}\n className=\"ob-repeatable-set__button-remove-top\"\n index={index}\n />\n )}\n\n <OneBlinkFormElements\n formId={formId}\n idPrefix={elementDOMId.repeatableSetEntryDOMIdPrefix(\n index.toString(),\n )}\n isEven={isEven}\n formElementsValidation={formElementsValidation}\n displayValidationMessages={displayValidationMessages}\n elements={element.elements}\n onChange={handleChange}\n onLookup={handleLookup}\n model={entry}\n parentElement={element}\n formElementsConditionallyShown={formElementsConditionallyShown}\n onUpdateFormElements={handleUpdateNestedFormElements}\n />\n {element.layout === 'MULTIPLE_ADD_BUTTONS' && (\n <RemoveButton\n onConfirmRemove={confirmRemove}\n element={element}\n index={index}\n className=\"ob-repeatable-set__button-remove-bottom\"\n />\n )}\n </div>\n {showAddButton && (\n <AddButton\n onAdd={() => onAdd(index + 1)}\n element={element}\n classes={[\n 'ob-button-repeatable-set-layout__multiple-add-buttons',\n ]}\n />\n )}\n </>\n )}\n </RepeatableSetEntryProvider>\n )\n },\n)\n\nfunction AddButton({\n onAdd,\n element,\n classes,\n}: {\n onAdd: () => void\n element: FormTypes.RepeatableSetElement\n isPrimary?: boolean\n classes?: string[]\n}) {\n return (\n <button\n type=\"button\"\n className={clsx(\n 'button ob-button ob-button__add cypress-add-repeatable-set is-primary',\n classes,\n )}\n onClick={onAdd}\n disabled={element.readOnly}\n aria-label={element.addSetEntryLabel ? undefined : 'Add Entry'}\n >\n <span className=\"icon\">\n <MaterialIcon>add</MaterialIcon>\n </span>\n {!!element.addSetEntryLabel && <span>{element.addSetEntryLabel}</span>}\n </button>\n )\n}\n\nfunction RemoveButton({\n onConfirmRemove,\n element,\n className,\n index,\n}: {\n onConfirmRemove: () => void\n element: FormTypes.RepeatableSetElement\n className?: string\n index: number\n}) {\n return (\n <button\n type=\"button\"\n className={clsx(\n 'button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry',\n className,\n )}\n onClick={onConfirmRemove}\n disabled={element.readOnly}\n aria-label={`${element.removeSetEntryLabel ?? 'Remove Entry'} ${index + 1}`}\n >\n <span className=\"icon\">\n <MaterialIcon>delete_outline</MaterialIcon>\n </span>\n {!!element.removeSetEntryLabel && (\n <span>{element.removeSetEntryLabel}</span>\n )}\n </button>\n )\n}\n"]}
1
+ {"version":3,"file":"FormElementRepeatableSet.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRepeatableSet.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport useBooleanState from '../hooks/useBooleanState'\nimport generateDefaultData, {\n ENTRY_ID_PROPERTY_NAME,\n generateNewRepeatableSetEntry,\n} from '../services/generate-default-data'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport Modal from '../components/renderer/Modal'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useValidationClass from '../hooks/useValidationClass'\nimport {\n ExecutedLookups,\n FormElementConditionallyShown,\n FormElementLookupHandler,\n FormElementsConditionallyShown,\n FormElementsValidation,\n FormElementValidation,\n NestedFormElementValueChangeHandler,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport useFormElementRepeatableSetEntries from '../hooks/useFormElementRepeatableSetEntries'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport { Collapse } from '@mui/material'\n\ntype Props = {\n formId: number\n id: string\n isEven: boolean\n element: FormTypes.RepeatableSetElement\n value: Array<SubmissionTypes.S3SubmissionData['submission']> | undefined\n onChange: NestedFormElementValueChangeHandler<\n SubmissionTypes.S3SubmissionData['submission'][]\n >\n onLookup: FormElementLookupHandler\n formElementConditionallyShown: FormElementConditionallyShown | undefined\n formElementValidation: FormElementValidation | undefined\n displayValidationMessage: boolean\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nconst RepeatableSetIndexContext = React.createContext<number>(0)\n\nfunction RepeatableSetEntryProvider({\n index,\n isAnimated,\n onRemove,\n children,\n}: {\n isAnimated: boolean\n index: number\n onRemove: (index: number) => void\n children: (renderProps: { onRemove: () => void }) => React.ReactNode\n}) {\n const [isExpanded, setIsExpanded] = React.useState(true)\n\n const handleRemove = React.useCallback(() => {\n if (isAnimated) {\n setIsExpanded(false)\n } else {\n onRemove(index)\n }\n }, [index, isAnimated, onRemove])\n\n const node = (\n <RepeatableSetIndexContext.Provider value={index}>\n {children({\n onRemove: handleRemove,\n })}\n </RepeatableSetIndexContext.Provider>\n )\n\n if (!isAnimated) {\n return node\n }\n\n return (\n <Collapse\n in={isExpanded}\n appear\n onExited={() => {\n onRemove(index)\n }}\n classes={{\n root: 'ob-repeatable-set__collapsible',\n wrapper: 'ob-repeatable-set__collapsible-wrapper',\n wrapperInner: 'ob-repeatable-set__collapsible-wrapper-inner',\n }}\n >\n {node}\n </Collapse>\n )\n}\n\nexport function useRepeatableSetIndexText(text: string) {\n const index = React.useContext(RepeatableSetIndexContext)\n return React.useMemo(\n () => text.replace('{INDEX}', (index + 1).toString()),\n [index, text],\n )\n}\n\nfunction FormElementRepeatableSet({\n formId,\n element,\n value,\n formElementValidation,\n id,\n isEven,\n displayValidationMessage,\n formElementConditionallyShown,\n onChange,\n onLookup,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const entries = React.useMemo(\n () => (Array.isArray(value) ? value : []),\n [value],\n )\n\n const handleAddEntry = React.useCallback(\n (index: number) => {\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = [...(existingEntries || [])]\n const entry = generateDefaultData(\n element.elements,\n generateNewRepeatableSetEntry(),\n )\n\n newEntries.splice(index, 0, entry)\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n if (\n existingExecutedLookups !== undefined &&\n !Array.isArray(existingExecutedLookups)\n ) {\n return []\n }\n\n const newExistingExecutedLookups = [\n ...((existingExecutedLookups as ExecutedLookups[]) ??\n Array.from(Array(entries.length))),\n ]\n newExistingExecutedLookups.push({})\n return newExistingExecutedLookups\n },\n })\n setIsDirty()\n },\n [element, onChange, setIsDirty, entries],\n )\n\n const handleRemoveEntry = React.useCallback(\n (index: number) => {\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = [...(existingEntries || [])]\n newEntries.splice(index, 1)\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n if (!Array.isArray(existingExecutedLookups)) {\n return []\n }\n const newExistingExecutedLookups = [...existingExecutedLookups]\n\n newExistingExecutedLookups.splice(index, 1)\n return newExistingExecutedLookups\n },\n })\n setIsDirty()\n },\n [element, onChange, setIsDirty],\n )\n\n const handleNestedChange = React.useCallback(\n (\n index: number,\n nestedElement: FormTypes.FormElement,\n {\n value,\n executedLookups,\n }: Parameters<NestedFormElementValueChangeHandler>[1],\n ) => {\n if (!('name' in nestedElement)) {\n return\n }\n onChange(element, {\n value: (existingEntries) => {\n const newEntries = (existingEntries || []).map((entry, i) => {\n if (i === index) {\n return {\n ...entry,\n [nestedElement.name]:\n typeof value === 'function'\n ? value(entry[nestedElement.name])\n : value,\n }\n } else {\n return entry\n }\n })\n return newEntries\n },\n executedLookups: (existingExecutedLookups) => {\n const elementExecutedLookups = existingExecutedLookups ?? []\n if (!Array.isArray(elementExecutedLookups)) {\n return elementExecutedLookups\n }\n const newExecutedLookups = elementExecutedLookups.map(\n (executedLookup, i) => {\n if (i === index) {\n const updatedExecutedLookups =\n typeof executedLookups === 'function'\n ? executedLookups(executedLookup?.[nestedElement.name])\n : executedLookups\n return {\n ...executedLookup,\n [nestedElement.name]: updatedExecutedLookups,\n }\n }\n return executedLookup\n },\n )\n return newExecutedLookups\n },\n })\n },\n [element, onChange],\n )\n\n const { minSetEntries, maxSetEntries } =\n useFormElementRepeatableSetEntries(element)\n\n const repeatableSetValidation = React.useMemo(\n () =>\n !formElementValidation ||\n typeof formElementValidation === 'string' ||\n formElementValidation.type !== 'repeatableSet'\n ? undefined\n : formElementValidation,\n [formElementValidation],\n )\n\n const repeatableSetEntriesConditionallyShown =\n formElementConditionallyShown &&\n formElementConditionallyShown.type === 'repeatableSet'\n ? formElementConditionallyShown.entries\n : {}\n\n const { validationClassName } = useValidationClass({\n formElementsValid: !repeatableSetValidation,\n displayInvalidClassName: isDirty || displayValidationMessage,\n validClassName: 'ob-repeatable-set-element__valid',\n invalidClassName: 'ob-repeatable-set-element__invalid',\n })\n\n const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n const showAddButton = React.useMemo(\n () => !maxSetEntries || entries.length < maxSetEntries,\n [maxSetEntries, entries.length],\n )\n\n const repeatableSetContainerClass = React.useMemo(() => {\n const prefix = 'ob-repeatable-set-container-layout__'\n switch (element.layout) {\n case 'MULTIPLE_ADD_BUTTONS':\n return prefix + 'multiple-add-buttons'\n default:\n return 'single-add-button'\n }\n }, [element.layout])\n\n return (\n <div\n className={clsx('cypress-repeatable-set-element', validationClassName)}\n aria-labelledby={`${id}-label`}\n aria-describedby={ariaDescribedby}\n role=\"region\"\n >\n {/* */}\n <FormElementLabelContainer\n className={clsx(\n 'ob-repeatable-set',\n isEven ? 'even' : 'odd',\n repeatableSetContainerClass,\n )}\n element={element}\n id={id}\n required={!!minSetEntries && minSetEntries > 0}\n >\n {element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (\n <AddButton\n onAdd={() => handleAddEntry(0)}\n element={element}\n id={id}\n classes={['ob-button-repeatable-set-layout__multiple-add-buttons']}\n />\n )}\n {entries.map((entry, index) => {\n return (\n <RepeatableSetEntry\n key={entry[ENTRY_ID_PROPERTY_NAME] as string}\n formId={formId}\n index={index}\n id={id}\n isEven={isEven}\n entry={entry}\n element={element}\n showAddButton={\n element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton\n }\n onChange={handleNestedChange}\n onLookup={onLookup}\n onAdd={handleAddEntry}\n onRemove={handleRemoveEntry}\n formElementsConditionallyShown={\n repeatableSetEntriesConditionallyShown[index.toString()]\n }\n formElementsValidation={\n repeatableSetValidation &&\n repeatableSetValidation.entries[index.toString()]\n }\n displayValidationMessages={displayValidationMessage}\n onUpdateFormElements={onUpdateFormElements}\n />\n )\n })}\n {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&\n showAddButton && (\n <AddButton\n onAdd={() => handleAddEntry(entries.length)}\n element={element}\n id={id}\n />\n )}\n {(isDirty || displayValidationMessage) &&\n !!repeatableSetValidation &&\n !!repeatableSetValidation.set && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {repeatableSetValidation.set}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementRepeatableSet)\n\ntype RepeatableSetEntryProps = {\n formId: number\n id: string\n index: number\n isEven: boolean\n entry: SubmissionTypes.S3SubmissionData['submission']\n element: FormTypes.RepeatableSetElement\n formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n formElementsValidation: FormElementsValidation | undefined\n displayValidationMessages: boolean\n showAddButton: boolean\n onChange: (\n index: number,\n formElement: FormTypes.FormElement,\n {\n value,\n executedLookups,\n }: Parameters<NestedFormElementValueChangeHandler>[1],\n ) => void\n onLookup: FormElementLookupHandler\n onAdd: (index: number) => unknown\n onRemove: (index: number) => unknown\n onUpdateFormElements: UpdateFormElementsHandler\n}\n\nconst RepeatableSetEntry = React.memo<RepeatableSetEntryProps>(\n function RepeatableSetEntry({\n formId,\n id,\n index,\n isEven,\n entry,\n element,\n formElementsConditionallyShown,\n displayValidationMessages,\n formElementsValidation,\n onChange,\n onLookup,\n onAdd,\n onRemove,\n onUpdateFormElements,\n showAddButton,\n }: RepeatableSetEntryProps) {\n const [isConfirmingRemove, confirmRemove, cancelRemove] =\n useBooleanState(false)\n\n const handleChange: NestedFormElementValueChangeHandler = React.useCallback(\n (nestedElement, { value, executedLookups }) => {\n onChange(index, nestedElement, {\n value,\n executedLookups,\n })\n },\n [index, onChange],\n )\n\n const handleLookup = React.useCallback<FormElementLookupHandler>(\n (mergeLookupResults) => {\n onLookup((currentFormSubmission) => {\n let newEntry = {}\n const entries = currentFormSubmission.submission[\n element.name\n ] as Array<SubmissionTypes.S3SubmissionData['submission']>\n const repeatableSetExecutedLookups =\n (currentFormSubmission.executedLookups?.[\n element.name\n ] as ExecutedLookups[]) ?? Array.from(Array(entries.length))\n // if the repeatable set is prefilled or has minimum entries then executed lookups exists,\n // but is an empty array\n for (let i = 0; i < entries.length; i++) {\n if (!repeatableSetExecutedLookups[index]) {\n repeatableSetExecutedLookups[index] = {}\n }\n }\n let newExecutedLookups: ExecutedLookups = {}\n const elements = currentFormSubmission.elements.map((formElement) => {\n if (\n formElement.type === 'repeatableSet' &&\n formElement.name === element.name\n ) {\n const { elements, submission, executedLookups } =\n mergeLookupResults({\n elements: formElement.elements,\n submission: entries[index],\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n executedLookups: repeatableSetExecutedLookups[index] ?? {},\n })\n newEntry = submission\n newExecutedLookups = executedLookups as ExecutedLookups\n return {\n ...formElement,\n elements,\n }\n }\n return formElement\n })\n\n const submission = {\n ...currentFormSubmission.submission,\n [element.name]: entries.map((entry, i) => {\n if (i === index) {\n return newEntry\n }\n return entry\n }),\n }\n\n let updatedExecutedLookups = currentFormSubmission.executedLookups\n if (Array.isArray(repeatableSetExecutedLookups)) {\n updatedExecutedLookups = {\n ...currentFormSubmission.executedLookups,\n [element.name]: repeatableSetExecutedLookups.map((entry, i) => {\n if (i == index) {\n return newExecutedLookups\n }\n return entry\n }),\n }\n }\n\n return {\n elements,\n submission,\n executedLookups: updatedExecutedLookups,\n }\n })\n },\n [element.name, index, onLookup],\n )\n\n const { validationClassName } = useValidationClass({\n formElementsValid: !formElementsValidation,\n displayInvalidClassName: displayValidationMessages,\n validClassName: 'ob-repeatable-set__valid',\n invalidClassName: 'ob-repeatable-set__invalid',\n })\n\n const handleUpdateNestedFormElements =\n React.useCallback<UpdateFormElementsHandler>(\n (setter) => {\n onUpdateFormElements((formElements) => {\n return formElements.map((formElement) => {\n if (\n formElement.id === element.id &&\n formElement.type === 'repeatableSet'\n ) {\n return {\n ...formElement,\n elements: setter(formElement.elements),\n }\n }\n return formElement\n })\n })\n },\n [element.id, onUpdateFormElements],\n )\n\n const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n return (\n <RepeatableSetEntryProvider\n index={index}\n onRemove={onRemove}\n isAnimated={element.layout === 'MULTIPLE_ADD_BUTTONS'}\n >\n {({ onRemove }) => (\n <>\n <Modal\n isOpen={isConfirmingRemove}\n className=\"cypress-repeatable-set-prompt\"\n titleClassName=\"cypress-repeatable-set-remove-entry-header\"\n title={element.removeSetEntryLabel || 'Remove Entry'}\n actions={\n <>\n <button\n type=\"button\"\n className=\"button ob-button is-light cypress-cancel-repeatable-set\"\n onClick={cancelRemove}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-confirm-repeatable-set\"\n onClick={() => {\n cancelRemove()\n onRemove()\n }}\n autoFocus\n >\n Yes\n </button>\n </>\n }\n >\n Are you sure you want to remove this entry?\n </Modal>\n\n <div\n className={clsx(\n 'ob-repeatable-set__container cypress-repeatable-set-container',\n validationClassName,\n )}\n >\n {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') && (\n <RemoveButton\n onConfirmRemove={confirmRemove}\n element={element}\n className=\"ob-repeatable-set__button-remove-top\"\n index={index}\n />\n )}\n\n <OneBlinkFormElements\n formId={formId}\n idPrefix={elementDOMId.repeatableSetEntryDOMIdPrefix(\n index.toString(),\n )}\n isEven={isEven}\n formElementsValidation={formElementsValidation}\n displayValidationMessages={displayValidationMessages}\n elements={element.elements}\n onChange={handleChange}\n onLookup={handleLookup}\n model={entry}\n parentElement={element}\n formElementsConditionallyShown={formElementsConditionallyShown}\n onUpdateFormElements={handleUpdateNestedFormElements}\n />\n {element.layout === 'MULTIPLE_ADD_BUTTONS' && (\n <RemoveButton\n onConfirmRemove={confirmRemove}\n element={element}\n index={index}\n className=\"ob-repeatable-set__button-remove-bottom\"\n />\n )}\n </div>\n {showAddButton && (\n <AddButton\n onAdd={() => onAdd(index + 1)}\n element={element}\n classes={[\n 'ob-button-repeatable-set-layout__multiple-add-buttons',\n ]}\n />\n )}\n </>\n )}\n </RepeatableSetEntryProvider>\n )\n },\n)\n\nfunction AddButton({\n id,\n onAdd,\n element,\n classes,\n}: {\n id?: string\n onAdd: () => void\n element: FormTypes.RepeatableSetElement\n isPrimary?: boolean\n classes?: string[]\n}) {\n return (\n <button\n type=\"button\"\n className={clsx(\n 'button ob-button ob-button__add cypress-add-repeatable-set is-primary',\n classes,\n )}\n onClick={onAdd}\n disabled={element.readOnly}\n aria-label={element.addSetEntryLabel ? undefined : 'Add Entry'}\n id={id}\n >\n <span className=\"icon\">\n <MaterialIcon>add</MaterialIcon>\n </span>\n {!!element.addSetEntryLabel && <span>{element.addSetEntryLabel}</span>}\n </button>\n )\n}\n\nfunction RemoveButton({\n onConfirmRemove,\n element,\n className,\n index,\n}: {\n onConfirmRemove: () => void\n element: FormTypes.RepeatableSetElement\n className?: string\n index: number\n}) {\n return (\n <button\n type=\"button\"\n className={clsx(\n 'button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry',\n className,\n )}\n onClick={onConfirmRemove}\n disabled={element.readOnly}\n aria-label={`${element.removeSetEntryLabel ?? 'Remove Entry'} ${index + 1}`}\n >\n <span className=\"icon\">\n <MaterialIcon>delete_outline</MaterialIcon>\n </span>\n {!!element.removeSetEntryLabel && (\n <span>{element.removeSetEntryLabel}</span>\n )}\n </button>\n )\n}\n"]}
@@ -88,7 +88,6 @@ $validation-errors-border-radius: 8px;
88
88
  transition-duration: inherit;
89
89
  transition-timing-function: inherit;
90
90
  white-space: nowrap;
91
- overflow-x: hidden;
92
91
  }
93
92
 
94
93
  .ob-validation-notification-wrapper .MuiCollapse-root {
package/dist/styles.css CHANGED
@@ -9953,7 +9953,6 @@ textarea:disabled {
9953
9953
  transition-duration: inherit;
9954
9954
  transition-timing-function: inherit;
9955
9955
  white-space: nowrap;
9956
- overflow-x: hidden;
9957
9956
  }
9958
9957
 
9959
9958
  .ob-validation-notification-wrapper .MuiCollapse-root {
@@ -1,5 +1,6 @@
1
- declare const scrollToElement: ({ id, navigationTopOffset, scrollableContainerId, }: {
2
- id: string;
1
+ import ElementDOMId from './elementDOMIds';
2
+ declare const scrollToElement: ({ elementDOMId, navigationTopOffset, scrollableContainerId, }: {
3
+ elementDOMId: ElementDOMId;
3
4
  /** We allow an offset to cater for any headers */
4
5
  navigationTopOffset: number | "CALCULATE";
5
6
  scrollableContainerId?: string;
@@ -84,13 +84,13 @@ const findScrollPointOfVisibleAncestorElement = (element) => {
84
84
  };
85
85
  }
86
86
  };
87
- const scrollToElement = ({ id, navigationTopOffset, scrollableContainerId, }) => {
88
- const element = document.getElementById(id);
87
+ const scrollToElement = ({ elementDOMId, navigationTopOffset, scrollableContainerId, }) => {
88
+ const element = document.getElementById(elementDOMId.elementContainerDOMId);
89
89
  if (element) {
90
90
  const getScrollPoint = findScrollPointOfVisibleAncestorElement(element);
91
91
  if (getScrollPoint) {
92
92
  window.requestAnimationFrame(() => {
93
- var _a, _b;
93
+ var _a, _b, _c;
94
94
  if (scrollableContainerId) {
95
95
  const scrollContainer = document.getElementById(scrollableContainerId);
96
96
  // Account for any top padding on the scrollable container
@@ -126,6 +126,7 @@ const scrollToElement = ({ id, navigationTopOffset, scrollableContainerId, }) =>
126
126
  }
127
127
  }
128
128
  }
129
+ (_c = document.getElementById(elementDOMId.value)) === null || _c === void 0 ? void 0 : _c.focus();
129
130
  });
130
131
  }
131
132
  }
@@ -1 +1 @@
1
- {"version":3,"file":"scrollToElement.js","sourceRoot":"","sources":["../../src/utils/scrollToElement.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Recursively traverses ancestors to find the first visible ancestor element\n * and allow getting its scroll point. It handles the case of ancestor elements\n * being hidden by `is-hidden` or an ancestor section being collapsed.\n *\n * @param element - The element for which to find its first visible ancestor or\n * ancestor sibling.\n * @returns A callback that returns the scroll point of the first visible\n * ancestor element, or undefined if none is found.\n */\nconst findScrollPointOfVisibleAncestorElement = (\n element: HTMLElement,\n): ((scrollableContainerId?: string) => number) | undefined => {\n const isVisible = element.checkVisibility()\n if (!isVisible) {\n const OBHiddenElement = element.closest('.is-hidden')\n if (OBHiddenElement && OBHiddenElement instanceof HTMLElement) {\n const parentOfHiddenElement = OBHiddenElement.parentElement\n if (\n !parentOfHiddenElement ||\n !(parentOfHiddenElement instanceof HTMLElement)\n ) {\n return\n }\n // In the case of a hidden ancestor element we will navigate to the bottom of the previous visible sibling.\n const parentIsVisible = parentOfHiddenElement.checkVisibility()\n if (!parentIsVisible) {\n if (OBHiddenElement.id === element.id) {\n // If the hidden element was not an ancestor, but instead the current element,\n // we need to go recursive with the parent instead of the same element\n return findScrollPointOfVisibleAncestorElement(\n OBHiddenElement.parentElement,\n )\n }\n return findScrollPointOfVisibleAncestorElement(OBHiddenElement)\n }\n let previousSibling = OBHiddenElement.previousElementSibling\n while (previousSibling && previousSibling instanceof HTMLElement) {\n if (previousSibling.checkVisibility()) {\n // Have to reasign for TS, because it does not recognise the typeguard in the `while` inside the callback function\n const sib = previousSibling\n return (scrollableContainerId?: string) => {\n if (scrollableContainerId) {\n return sib.offsetTop + sib.clientHeight\n }\n return sib.getBoundingClientRect().bottom\n }\n }\n previousSibling = previousSibling.previousElementSibling\n }\n // Revert to parent if no sibling is visible\n if (OBHiddenElement.parentElement instanceof HTMLElement) {\n return findScrollPointOfVisibleAncestorElement(\n OBHiddenElement.parentElement,\n )\n }\n }\n\n // Collapsed section ancestor\n const ancestorCollapsedSection = element.closest('.ob-section__collapsed')\n if (ancestorCollapsedSection) {\n const ancestorSectionRoot =\n ancestorCollapsedSection.closest('.ob-section')\n return ancestorSectionRoot && ancestorSectionRoot instanceof HTMLElement\n ? findScrollPointOfVisibleAncestorElement(ancestorSectionRoot)\n : undefined\n }\n\n // Not visible for some other reason\n return\n } else {\n return (scrollableContainerId?: string) => {\n if (scrollableContainerId) {\n let top = 0\n let el: HTMLElement | null = element\n while (el) {\n const offsetParent: Element | null = el.offsetParent\n if (offsetParent instanceof HTMLElement) {\n const offsetParentIsInsideScrollableContainer =\n offsetParent.closest(`#${scrollableContainerId}`)\n\n // Only process the offset of the current element if the offset parent\n // (offsetTop is derived from distance between element and top of `offsetParent)\n // is inside the scrollable container (or is the scrollable container).\n if (offsetParentIsInsideScrollableContainer) {\n top += el.offsetTop\n el = offsetParent\n continue\n }\n }\n el = null\n }\n return top\n }\n return element.getBoundingClientRect().top\n }\n }\n}\n\nconst scrollToElement = ({\n id,\n navigationTopOffset,\n scrollableContainerId,\n}: {\n id: string\n /** We allow an offset to cater for any headers */\n navigationTopOffset: number | 'CALCULATE'\n scrollableContainerId?: string\n}) => {\n const element = document.getElementById(id)\n if (element) {\n const getScrollPoint = findScrollPointOfVisibleAncestorElement(element)\n if (getScrollPoint) {\n window.requestAnimationFrame(() => {\n if (scrollableContainerId) {\n const scrollContainer = document.getElementById(scrollableContainerId)\n // Account for any top padding on the scrollable container\n const topPadding = parseFloat(\n scrollContainer\n ?.computedStyleMap()\n .get('padding-top')\n ?.toString() ?? '',\n )\n const scrollTo =\n getScrollPoint(scrollableContainerId) +\n topPadding -\n // We allow an offset to cater for any headers\n (typeof navigationTopOffset === 'number' ? navigationTopOffset : 0)\n scrollContainer?.scrollTo({\n top: scrollTo,\n behavior: 'smooth',\n })\n // We do not currently attempt to `CALCULATE` the top scroll offset for form containers,\n // as we have no guarantee that the container element is currently in the viewport, so this is more complicated.\n } else {\n const scrollTo =\n getScrollPoint() +\n window.scrollY -\n // We allow an offset to cater for any headers\n (typeof navigationTopOffset === 'number' ? navigationTopOffset : 0)\n window.scrollTo({\n top: scrollTo,\n behavior: 'smooth',\n })\n\n // Calculate Offset\n if (navigationTopOffset === 'CALCULATE') {\n const calculatedNavigationTopOffset =\n calculateDesiredOffsetAfterInitialScroll(element)\n if (calculatedNavigationTopOffset) {\n window.scrollTo({\n top: scrollTo - calculatedNavigationTopOffset,\n behavior: 'smooth',\n })\n }\n }\n }\n })\n }\n }\n}\n\nexport default scrollToElement\n\n/**\n * Attempts to calculate the top scroll offset necessary to see the desired\n * element if it is being covered by any fixed, sticky or absolute elements,\n * after initial scroll.\n *\n * @param element - The element which we want to make visible. NOTE: This\n * element should already be scrolled to the 0 `Y` co-ordinate of the viewport\n * when calling this function for best results with sticky and absolute\n * elements.\n * @returns A number that can be subtracted from the scroll point that would\n * otherwise show the desired element at the 0 `Y` co-ordinate of the\n * viewport.\n */\nconst calculateDesiredOffsetAfterInitialScroll = (element: HTMLElement) => {\n const elementLeft = element.getBoundingClientRect().left\n let offset = 0\n // Get element in the front-most position, right at the top of the page (where our element should be located currently)\n let elementFromPoint = document.elementFromPoint(elementLeft, offset)\n if (!elementFromPoint) {\n return offset\n }\n let position = window.getComputedStyle(elementFromPoint).position\n\n while (\n position === 'fixed' ||\n position === 'absolute' ||\n position === 'sticky'\n ) {\n // Get next elementFromPoint\n offset = elementFromPoint.getBoundingClientRect().bottom + 1\n elementFromPoint = document.elementFromPoint(elementLeft, offset)\n if (!elementFromPoint) {\n return offset\n }\n position = window.getComputedStyle(elementFromPoint).position\n }\n return offset\n}\n"]}
1
+ {"version":3,"file":"scrollToElement.js","sourceRoot":"","sources":["../../src/utils/scrollToElement.ts"],"names":[],"mappings":"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","sourcesContent":["import ElementDOMId from './elementDOMIds'\n\n/**\n * Recursively traverses ancestors to find the first visible ancestor element\n * and allow getting its scroll point. It handles the case of ancestor elements\n * being hidden by `is-hidden` or an ancestor section being collapsed.\n *\n * @param element - The element for which to find its first visible ancestor or\n * ancestor sibling.\n * @returns A callback that returns the scroll point of the first visible\n * ancestor element, or undefined if none is found.\n */\nconst findScrollPointOfVisibleAncestorElement = (\n element: HTMLElement,\n): ((scrollableContainerId?: string) => number) | undefined => {\n const isVisible = element.checkVisibility()\n if (!isVisible) {\n const OBHiddenElement = element.closest('.is-hidden')\n if (OBHiddenElement && OBHiddenElement instanceof HTMLElement) {\n const parentOfHiddenElement = OBHiddenElement.parentElement\n if (\n !parentOfHiddenElement ||\n !(parentOfHiddenElement instanceof HTMLElement)\n ) {\n return\n }\n // In the case of a hidden ancestor element we will navigate to the bottom of the previous visible sibling.\n const parentIsVisible = parentOfHiddenElement.checkVisibility()\n if (!parentIsVisible) {\n if (OBHiddenElement.id === element.id) {\n // If the hidden element was not an ancestor, but instead the current element,\n // we need to go recursive with the parent instead of the same element\n return findScrollPointOfVisibleAncestorElement(\n OBHiddenElement.parentElement,\n )\n }\n return findScrollPointOfVisibleAncestorElement(OBHiddenElement)\n }\n let previousSibling = OBHiddenElement.previousElementSibling\n while (previousSibling && previousSibling instanceof HTMLElement) {\n if (previousSibling.checkVisibility()) {\n // Have to reasign for TS, because it does not recognise the typeguard in the `while` inside the callback function\n const sib = previousSibling\n return (scrollableContainerId?: string) => {\n if (scrollableContainerId) {\n return sib.offsetTop + sib.clientHeight\n }\n return sib.getBoundingClientRect().bottom\n }\n }\n previousSibling = previousSibling.previousElementSibling\n }\n // Revert to parent if no sibling is visible\n if (OBHiddenElement.parentElement instanceof HTMLElement) {\n return findScrollPointOfVisibleAncestorElement(\n OBHiddenElement.parentElement,\n )\n }\n }\n\n // Collapsed section ancestor\n const ancestorCollapsedSection = element.closest('.ob-section__collapsed')\n if (ancestorCollapsedSection) {\n const ancestorSectionRoot =\n ancestorCollapsedSection.closest('.ob-section')\n return ancestorSectionRoot && ancestorSectionRoot instanceof HTMLElement\n ? findScrollPointOfVisibleAncestorElement(ancestorSectionRoot)\n : undefined\n }\n\n // Not visible for some other reason\n return\n } else {\n return (scrollableContainerId?: string) => {\n if (scrollableContainerId) {\n let top = 0\n let el: HTMLElement | null = element\n while (el) {\n const offsetParent: Element | null = el.offsetParent\n if (offsetParent instanceof HTMLElement) {\n const offsetParentIsInsideScrollableContainer =\n offsetParent.closest(`#${scrollableContainerId}`)\n\n // Only process the offset of the current element if the offset parent\n // (offsetTop is derived from distance between element and top of `offsetParent)\n // is inside the scrollable container (or is the scrollable container).\n if (offsetParentIsInsideScrollableContainer) {\n top += el.offsetTop\n el = offsetParent\n continue\n }\n }\n el = null\n }\n return top\n }\n return element.getBoundingClientRect().top\n }\n }\n}\n\nconst scrollToElement = ({\n elementDOMId,\n navigationTopOffset,\n scrollableContainerId,\n}: {\n elementDOMId: ElementDOMId\n /** We allow an offset to cater for any headers */\n navigationTopOffset: number | 'CALCULATE'\n scrollableContainerId?: string\n}) => {\n const element = document.getElementById(elementDOMId.elementContainerDOMId)\n if (element) {\n const getScrollPoint = findScrollPointOfVisibleAncestorElement(element)\n if (getScrollPoint) {\n window.requestAnimationFrame(() => {\n if (scrollableContainerId) {\n const scrollContainer = document.getElementById(scrollableContainerId)\n // Account for any top padding on the scrollable container\n const topPadding = parseFloat(\n scrollContainer\n ?.computedStyleMap()\n .get('padding-top')\n ?.toString() ?? '',\n )\n const scrollTo =\n getScrollPoint(scrollableContainerId) +\n topPadding -\n // We allow an offset to cater for any headers\n (typeof navigationTopOffset === 'number' ? navigationTopOffset : 0)\n scrollContainer?.scrollTo({\n top: scrollTo,\n behavior: 'smooth',\n })\n // We do not currently attempt to `CALCULATE` the top scroll offset for form containers,\n // as we have no guarantee that the container element is currently in the viewport, so this is more complicated.\n } else {\n const scrollTo =\n getScrollPoint() +\n window.scrollY -\n // We allow an offset to cater for any headers\n (typeof navigationTopOffset === 'number' ? navigationTopOffset : 0)\n window.scrollTo({\n top: scrollTo,\n behavior: 'smooth',\n })\n\n // Calculate Offset\n if (navigationTopOffset === 'CALCULATE') {\n const calculatedNavigationTopOffset =\n calculateDesiredOffsetAfterInitialScroll(element)\n if (calculatedNavigationTopOffset) {\n window.scrollTo({\n top: scrollTo - calculatedNavigationTopOffset,\n behavior: 'smooth',\n })\n }\n }\n }\n\n document.getElementById(elementDOMId.value)?.focus()\n })\n }\n }\n}\n\nexport default scrollToElement\n\n/**\n * Attempts to calculate the top scroll offset necessary to see the desired\n * element if it is being covered by any fixed, sticky or absolute elements,\n * after initial scroll.\n *\n * @param element - The element which we want to make visible. NOTE: This\n * element should already be scrolled to the 0 `Y` co-ordinate of the viewport\n * when calling this function for best results with sticky and absolute\n * elements.\n * @returns A number that can be subtracted from the scroll point that would\n * otherwise show the desired element at the 0 `Y` co-ordinate of the\n * viewport.\n */\nconst calculateDesiredOffsetAfterInitialScroll = (element: HTMLElement) => {\n const elementLeft = element.getBoundingClientRect().left\n let offset = 0\n // Get element in the front-most position, right at the top of the page (where our element should be located currently)\n let elementFromPoint = document.elementFromPoint(elementLeft, offset)\n if (!elementFromPoint) {\n return offset\n }\n let position = window.getComputedStyle(elementFromPoint).position\n\n while (\n position === 'fixed' ||\n position === 'absolute' ||\n position === 'sticky'\n ) {\n // Get next elementFromPoint\n offset = elementFromPoint.getBoundingClientRect().bottom + 1\n elementFromPoint = document.elementFromPoint(elementLeft, offset)\n if (!elementFromPoint) {\n return offset\n }\n position = window.getComputedStyle(elementFromPoint).position\n }\n return offset\n}\n"]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@oneblink/apps-react",
3
3
  "description": "Helper functions for OneBlink apps in ReactJS.",
4
- "version": "8.2.1-beta.2",
4
+ "version": "8.2.2-beta.1",
5
5
  "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
6
6
  "bugs": {
7
7
  "url": "https://github.com/oneblink/apps-react/issues"