@cloudscape-design/components 3.0.410 → 3.0.411

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.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAoBrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAiB1E"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAWzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAsBrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,OAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,eAe1E"}
package/form/index.js CHANGED
@@ -8,7 +8,8 @@ import useBaseComponent from '../internal/hooks/use-base-component';
8
8
  import { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';
9
9
  import { ButtonContext } from '../internal/context/button-context';
10
10
  import { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';
11
- import styles from './styles.css.js';
11
+ import formStyles from './styles.css.js';
12
+ import headerStyles from '../header/styles.css.js';
12
13
  const FormWithAnalytics = (_a) => {
13
14
  var { variant = 'full-page', actions } = _a, props = __rest(_a, ["variant", "actions"]);
14
15
  const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();
@@ -19,17 +20,17 @@ const FormWithAnalytics = (_a) => {
19
20
  funnelSubmit();
20
21
  }
21
22
  };
22
- return (React.createElement(ButtonContext.Provider, { value: { onClick: handleActionButtonClick } },
23
- React.createElement(InternalForm, Object.assign({ variant: variant, actions: actions }, props, funnelProps, funnelStepProps))));
23
+ return (React.createElement(AnalyticsFunnelStep, { stepNumber: 1 },
24
+ React.createElement(ButtonContext.Provider, { value: { onClick: handleActionButtonClick } },
25
+ React.createElement(InternalForm, Object.assign({ variant: variant, actions: actions }, props, funnelProps, funnelStepProps)))));
24
26
  };
25
27
  export default function Form(_a) {
26
28
  var { variant = 'full-page' } = _a, props = __rest(_a, ["variant"]);
27
29
  const baseComponentProps = useBaseComponent('Form');
28
30
  const inheritedFunnelNameSelector = useFunnelNameSelector();
29
- const funnelNameSelector = inheritedFunnelNameSelector || `.${styles.header}`;
30
- return (React.createElement(AnalyticsFunnel, { funnelType: "single-page", optionalStepNumbers: [], totalFunnelSteps: 1, funnelNameSelector: funnelNameSelector },
31
- React.createElement(AnalyticsFunnelStep, { stepNumber: 1, stepNameSelector: funnelNameSelector },
32
- React.createElement(FormWithAnalytics, Object.assign({ variant: variant }, props, baseComponentProps)))));
31
+ const funnelNameSelector = inheritedFunnelNameSelector || `.${headerStyles['heading-text']}`;
32
+ return (React.createElement(AnalyticsFunnel, { funnelType: "single-page", optionalStepNumbers: [], totalFunnelSteps: 1, funnelNameSelectors: [funnelNameSelector, `.${formStyles.header}`] },
33
+ React.createElement(FormWithAnalytics, Object.assign({ variant: variant }, props, baseComponentProps))));
33
34
  }
34
35
  applyDisplayName(Form, 'Form');
35
36
  //# sourceMappingURL=index.js.map
package/form/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,YAAY,MAAM,YAAY,CAAC;AACtC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACzG,OAAO,EAAE,aAAa,EAAsB,MAAM,oCAAoC,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEzG,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,iBAAiB,GAAG,CAAC,EAAuD,EAAE,EAAE;QAA3D,EAAE,OAAO,GAAG,WAAW,EAAE,OAAO,OAAuB,EAAlB,KAAK,cAA1C,sBAA4C,CAAF;IACnE,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,yBAAyB,EAAE,GAAG,SAAS,EAAE,CAAC;IAC7E,MAAM,EAAE,eAAe,EAAE,GAAG,aAAa,EAAE,CAAC;IAE5C,MAAM,uBAAuB,GAAkC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QAC7E,IAAI,OAAO,KAAK,SAAS,EAAE;YACzB,yBAAyB,EAAE,CAAC;YAC5B,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,uBAAuB,EAAE;QACjE,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,WAAW,EAAM,eAAe,EAAI,CAC9E,CAC1B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAA8C;QAA9C,EAAE,OAAO,GAAG,WAAW,OAAuB,EAAlB,KAAK,cAAjC,WAAmC,CAAF;IAC5D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACpD,MAAM,2BAA2B,GAAG,qBAAqB,EAAE,CAAC;IAC5D,MAAM,kBAAkB,GAAG,2BAA2B,IAAI,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC;IAE9E,OAAO,CACL,oBAAC,eAAe,IACd,UAAU,EAAC,aAAa,EACxB,mBAAmB,EAAE,EAAE,EACvB,gBAAgB,EAAE,CAAC,EACnB,kBAAkB,EAAE,kBAAkB;QAEtC,oBAAC,mBAAmB,IAAC,UAAU,EAAE,CAAC,EAAE,gBAAgB,EAAE,kBAAkB;YACtE,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CACtD,CACN,CACnB,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nimport { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';\n\nimport styles from './styles.css.js';\n\nexport { FormProps };\n\nconst FormWithAnalytics = ({ variant = 'full-page', actions, ...props }: FormProps) => {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n\n const handleActionButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <ButtonContext.Provider value={{ onClick: handleActionButtonClick }}>\n <InternalForm variant={variant} actions={actions} {...props} {...funnelProps} {...funnelStepProps} />\n </ButtonContext.Provider>\n );\n};\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const baseComponentProps = useBaseComponent('Form');\n const inheritedFunnelNameSelector = useFunnelNameSelector();\n const funnelNameSelector = inheritedFunnelNameSelector || `.${styles.header}`;\n\n return (\n <AnalyticsFunnel\n funnelType=\"single-page\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelector={funnelNameSelector}\n >\n <AnalyticsFunnelStep stepNumber={1} stepNameSelector={funnelNameSelector}>\n <FormWithAnalytics variant={variant} {...props} {...baseComponentProps} />\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\napplyDisplayName(Form, 'Form');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["form/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,YAAY,MAAM,YAAY,CAAC;AACtC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACzG,OAAO,EAAE,aAAa,EAAsB,MAAM,oCAAoC,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEzG,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAInD,MAAM,iBAAiB,GAAG,CAAC,EAAuD,EAAE,EAAE;QAA3D,EAAE,OAAO,GAAG,WAAW,EAAE,OAAO,OAAuB,EAAlB,KAAK,cAA1C,sBAA4C,CAAF;IACnE,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,yBAAyB,EAAE,GAAG,SAAS,EAAE,CAAC;IAC7E,MAAM,EAAE,eAAe,EAAE,GAAG,aAAa,EAAE,CAAC;IAE5C,MAAM,uBAAuB,GAAkC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QAC7E,IAAI,OAAO,KAAK,SAAS,EAAE;YACzB,yBAAyB,EAAE,CAAC;YAC5B,YAAY,EAAE,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,IAAC,UAAU,EAAE,CAAC;QAChC,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,uBAAuB,EAAE;YACjE,oBAAC,YAAY,kBAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,WAAW,EAAM,eAAe,EAAI,CAC9E,CACL,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAA8C;QAA9C,EAAE,OAAO,GAAG,WAAW,OAAuB,EAAlB,KAAK,cAAjC,WAAmC,CAAF;IAC5D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACpD,MAAM,2BAA2B,GAAG,qBAAqB,EAAE,CAAC;IAC5D,MAAM,kBAAkB,GAAG,2BAA2B,IAAI,IAAI,YAAY,CAAC,cAAc,CAAC,EAAE,CAAC;IAE7F,OAAO,CACL,oBAAC,eAAe,IACd,UAAU,EAAC,aAAa,EACxB,mBAAmB,EAAE,EAAE,EACvB,gBAAgB,EAAE,CAAC,EACnB,mBAAmB,EAAE,CAAC,kBAAkB,EAAE,IAAI,UAAU,CAAC,MAAM,EAAE,CAAC;QAElE,oBAAC,iBAAiB,kBAAC,OAAO,EAAE,OAAO,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAC1D,CACnB,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { FormProps } from './interfaces';\nimport InternalForm from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nimport { AnalyticsFunnel, AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { useFunnel, useFunnelNameSelector, useFunnelStep } from '../internal/analytics/hooks/use-funnel';\n\nimport formStyles from './styles.css.js';\nimport headerStyles from '../header/styles.css.js';\n\nexport { FormProps };\n\nconst FormWithAnalytics = ({ variant = 'full-page', actions, ...props }: FormProps) => {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n\n const handleActionButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <AnalyticsFunnelStep stepNumber={1}>\n <ButtonContext.Provider value={{ onClick: handleActionButtonClick }}>\n <InternalForm variant={variant} actions={actions} {...props} {...funnelProps} {...funnelStepProps} />\n </ButtonContext.Provider>\n </AnalyticsFunnelStep>\n );\n};\n\nexport default function Form({ variant = 'full-page', ...props }: FormProps) {\n const baseComponentProps = useBaseComponent('Form');\n const inheritedFunnelNameSelector = useFunnelNameSelector();\n const funnelNameSelector = inheritedFunnelNameSelector || `.${headerStyles['heading-text']}`;\n\n return (\n <AnalyticsFunnel\n funnelType=\"single-page\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelectors={[funnelNameSelector, `.${formStyles.header}`]}\n >\n <FormWithAnalytics variant={variant} {...props} {...baseComponentProps} />\n </AnalyticsFunnel>\n );\n}\n\napplyDisplayName(Form, 'Form');\n"]}
@@ -68,7 +68,7 @@ export default function InternalFormField(_a) {
68
68
  stepNumber,
69
69
  stepName,
70
70
  stepNameSelector,
71
- fieldErrorSelector: getFieldSlotSeletor(slotIds.error),
71
+ fieldErrorSelector: `${getFieldSlotSeletor(slotIds.error)} .${styles.error__message}`,
72
72
  fieldLabelSelector: getFieldSlotSeletor(slotIds.label),
73
73
  subStepAllSelector: getSubStepAllSelector(),
74
74
  });
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FIELD_ERROR,\n DATA_ATTR_FIELD_LABEL,\n getFieldSlotSeletor,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const { funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n const analyticsAttributes = {\n [DATA_ATTR_FIELD_LABEL]: slotIds.label ? getFieldSlotSeletor(slotIds.label) : undefined,\n [DATA_ATTR_FIELD_ERROR]: slotIds.error ? getFieldSlotSeletor(slotIds.error) : undefined,\n };\n\n useEffect(() => {\n if (funnelInteractionId && errorText && funnelState.current !== 'complete') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n errorCount.current++;\n\n // We don't want to report an error if it is hidden, e.g. inside an Expandable Section.\n const errorIsVisible = (__internalRootRef?.current?.getBoundingClientRect()?.width ?? 0) > 0;\n\n if (errorIsVisible) {\n FunnelMetrics.funnelSubStepError({\n funnelInteractionId,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n stepNumber,\n stepName,\n stepNameSelector,\n fieldErrorSelector: getFieldSlotSeletor(slotIds.error),\n fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n errorCount.current--;\n };\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, errorText, submissionAttempt, errorCount]);\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n {...analyticsAttributes}\n >\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n <InfoLinkLabelContext.Provider value={slotIds.label}>\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nimport InternalGrid from '../grid/internal';\nimport InternalIcon from '../icon/internal';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport styles from './styles.css.js';\nimport { InternalFormFieldProps } from './interfaces';\nimport { joinStrings } from '../internal/utils/strings';\nimport { useInternalI18n } from '../i18n/context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FIELD_ERROR,\n DATA_ATTR_FIELD_LABEL,\n getFieldSlotSeletor,\n getNameFromSelector,\n getSubStepAllSelector,\n} from '../internal/analytics/selectors';\n\ninterface FormFieldErrorProps {\n id?: string;\n children?: React.ReactNode;\n errorIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n const i18n = useInternalI18n('form-field');\n\n return (\n <div id={id} className={styles.error}>\n <div className={styles['error-icon-shake-wrapper']}>\n <div\n role=\"img\"\n aria-label={i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel)}\n className={styles['error-icon-scale-wrapper']}\n >\n <InternalIcon name=\"status-warning\" size=\"small\" />\n </div>\n </div>\n <span className={styles.error__message}>{children}</span>\n </div>\n );\n}\n\nexport function ConstraintText({\n id,\n hasError,\n children,\n}: {\n id?: string;\n hasError: boolean;\n children: React.ReactNode;\n}) {\n return (\n <div id={id} className={clsx(styles.constraint, hasError && styles['constraint-has-error'])}>\n {children}\n </div>\n );\n}\n\nexport default function InternalFormField({\n controlId,\n stretch = false,\n label,\n info,\n i18nStrings,\n children,\n secondaryControl,\n description,\n constraintText,\n errorText,\n __hideLabel,\n __internalRootRef = null,\n __disableGutters = false,\n ...rest\n}: InternalFormFieldProps) {\n const baseProps = getBaseProps(rest);\n const isRefresh = useVisualRefresh();\n\n const instanceUniqueId = useUniqueId('formField');\n const generatedControlId = controlId || instanceUniqueId;\n const formFieldId = controlId || generatedControlId;\n\n const { funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const slotIds = getSlotIds(formFieldId, label, description, constraintText, errorText);\n\n const ariaDescribedBy = getAriaDescribedBy(slotIds);\n\n const gridDefinition = getGridDefinition(stretch, !!secondaryControl, isRefresh);\n\n const {\n ariaLabelledby: parentAriaLabelledby,\n ariaDescribedby: parentAriaDescribedby,\n invalid: parentInvalid,\n } = useFormFieldContext({});\n\n const contextValuesWithoutControlId = {\n ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n invalid: !!errorText || !!parentInvalid,\n };\n\n const analyticsAttributes = {\n [DATA_ATTR_FIELD_LABEL]: slotIds.label ? getFieldSlotSeletor(slotIds.label) : undefined,\n [DATA_ATTR_FIELD_ERROR]: slotIds.error ? getFieldSlotSeletor(slotIds.error) : undefined,\n };\n\n useEffect(() => {\n if (funnelInteractionId && errorText && funnelState.current !== 'complete') {\n const stepName = getNameFromSelector(stepNameSelector);\n const subStepName = getNameFromSelector(subStepNameSelector);\n\n errorCount.current++;\n\n // We don't want to report an error if it is hidden, e.g. inside an Expandable Section.\n const errorIsVisible = (__internalRootRef?.current?.getBoundingClientRect()?.width ?? 0) > 0;\n\n if (errorIsVisible) {\n FunnelMetrics.funnelSubStepError({\n funnelInteractionId,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n stepNumber,\n stepName,\n stepNameSelector,\n fieldErrorSelector: `${getFieldSlotSeletor(slotIds.error)} .${styles.error__message}`,\n fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n errorCount.current--;\n };\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, errorText, submissionAttempt, errorCount]);\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n {...analyticsAttributes}\n >\n <div className={clsx(__hideLabel && styles['visually-hidden'])}>\n {label && (\n <label className={styles.label} id={slotIds.label} htmlFor={generatedControlId}>\n {label}\n </label>\n )}\n <InfoLinkLabelContext.Provider value={slotIds.label}>\n {!__hideLabel && info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </div>\n\n {description && (\n <div className={styles.description} id={slotIds.description}>\n {description}\n </div>\n )}\n\n <div className={clsx(styles.controls, __hideLabel && styles['label-hidden'])}>\n <InternalGrid gridDefinition={gridDefinition} disableGutters={__disableGutters}>\n <FormFieldContext.Provider\n value={{\n controlId: generatedControlId,\n ...contextValuesWithoutControlId,\n }}\n >\n {children && <div className={styles.control}>{children}</div>}\n </FormFieldContext.Provider>\n\n {secondaryControl && (\n <FormFieldContext.Provider value={contextValuesWithoutControlId}>\n <div className={styles['secondary-control']}>{secondaryControl}</div>\n </FormFieldContext.Provider>\n )}\n </InternalGrid>\n </div>\n\n {(constraintText || errorText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {constraintText && (\n <ConstraintText id={slotIds.constraint} hasError={!!errorText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </div>\n );\n}\n"]}
@@ -1,16 +1,22 @@
1
1
  import React from 'react';
2
2
  import { FunnelStepContextValue, FunnelSubStepContextValue } from '../context/analytics-context';
3
3
  import { FunnelProps, FunnelStepProps, StepConfiguration } from '../interfaces';
4
- export declare const FUNNEL_VERSION = "1.3";
5
- type AnalyticsFunnelProps = {
4
+ export declare const FUNNEL_VERSION = "1.4";
5
+ interface AnalyticsFunnelProps {
6
6
  children?: React.ReactNode;
7
7
  stepConfiguration?: StepConfiguration[];
8
- } & Pick<FunnelProps, 'funnelNameSelector' | 'funnelType' | 'optionalStepNumbers' | 'totalFunnelSteps'>;
8
+ funnelNameSelectors?: string[];
9
+ funnelType: FunnelProps['funnelType'];
10
+ optionalStepNumbers: FunnelProps['optionalStepNumbers'];
11
+ totalFunnelSteps: FunnelProps['totalFunnelSteps'];
12
+ }
9
13
  export declare const AnalyticsFunnel: (props: AnalyticsFunnelProps) => JSX.Element;
10
14
  export declare const CREATION_EDIT_FLOW_DONE_EVENT_NAME = "awsui-creation-edit-flow-done";
11
- type AnalyticsFunnelStepProps = {
15
+ interface AnalyticsFunnelStepProps {
12
16
  children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);
13
- } & Pick<FunnelStepProps, 'stepNumber' | 'stepNameSelector'>;
17
+ stepNameSelector?: FunnelStepProps['stepNameSelector'];
18
+ stepNumber: FunnelStepProps['stepNumber'];
19
+ }
14
20
  export declare const AnalyticsFunnelStep: (props: AnalyticsFunnelStepProps) => JSX.Element;
15
21
  interface AnalyticsFunnelSubStepProps {
16
22
  children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);
@@ -1 +1 @@
1
- {"version":3,"file":"analytics-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAKL,sBAAsB,EAEtB,yBAAyB,EAC1B,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,iBAAiB,EAAwB,MAAM,eAAe,CAAC;AAatG,eAAO,MAAM,cAAc,QAAQ,CAAC;AAEpC,KAAK,oBAAoB,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,iBAAiB,CAAC,EAAE,iBAAiB,EAAE,CAAA;CAAE,GAAG,IAAI,CACxG,WAAW,EACX,oBAAoB,GAAG,YAAY,GAAG,qBAAqB,GAAG,kBAAkB,CACjF,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAa1D,CAAC;AACF,eAAO,MAAM,kCAAkC,kCAAkC,CAAC;AA4JlF,KAAK,wBAAwB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACnF,GAAG,IAAI,CAAC,eAAe,EAAE,YAAY,GAAG,kBAAkB,CAAC,CAAC;AAE7D,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,gBAMlE,CAAC;AAyJF,UAAU,2BAA2B;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACtF;AAED,eAAO,MAAM,sBAAsB,iBAAkB,2BAA2B,gBAiG/E,CAAC"}
1
+ {"version":3,"file":"analytics-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAKL,sBAAsB,EAEtB,yBAAyB,EAC1B,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,iBAAiB,EAAwB,MAAM,eAAe,CAAC;AAatG,eAAO,MAAM,cAAc,QAAQ,CAAC;AAEpC,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iBAAiB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IACxC,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,UAAU,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;IACtC,mBAAmB,EAAE,WAAW,CAAC,qBAAqB,CAAC,CAAC;IACxD,gBAAgB,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC;CACnD;AAED,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAa1D,CAAC;AACF,eAAO,MAAM,kCAAkC,kCAAkC,CAAC;AA0KlF,UAAU,wBAAwB;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IAClF,gBAAgB,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAC;IACvD,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CAC3C;AAED,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,gBAMlE,CAAC;AA0JF,UAAU,2BAA2B;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,yBAAyB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACtF;AAED,eAAO,MAAM,sBAAsB,iBAAkB,2BAA2B,gBAiG/E,CAAC"}
@@ -3,7 +3,7 @@ import { __awaiter, __rest } from "tslib";
3
3
  // SPDX-License-Identifier: Apache-2.0
4
4
  import React, { useContext, useEffect, useRef, useState } from 'react';
5
5
  import { FunnelStepContext, FunnelSubStepContext, FunnelContext, } from '../context/analytics-context';
6
- import { useFunnel, useFunnelNameSelector, useFunnelStep } from '../hooks/use-funnel';
6
+ import { useFunnel, useFunnelStep } from '../hooks/use-funnel';
7
7
  import { useUniqueId } from '../../hooks/use-unique-id';
8
8
  import { useVisualRefresh } from '../../hooks/use-visual-mode';
9
9
  import { PACKAGE_VERSION } from '../../environment';
@@ -11,7 +11,7 @@ import { FunnelMetrics } from '../index';
11
11
  import { DATA_ATTR_FUNNEL_STEP, getFunnelNameSelector, getNameFromSelector, getSubStepAllSelector, getSubStepNameSelector, getSubStepSelector, } from '../selectors';
12
12
  import { useDebounceCallback } from '../../hooks/use-debounce-callback';
13
13
  import { nodeBelongs } from '../../utils/node-belongs';
14
- export const FUNNEL_VERSION = '1.3';
14
+ export const FUNNEL_VERSION = '1.4';
15
15
  export const AnalyticsFunnel = (props) => {
16
16
  const { isInFunnel } = useFunnel();
17
17
  /*
@@ -34,14 +34,22 @@ const onFunnelComplete = ({ funnelInteractionId }) => {
34
34
  FunnelMetrics.funnelComplete({ funnelInteractionId });
35
35
  document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));
36
36
  };
37
+ function evaluateSelectors(selectors, defaultSelector) {
38
+ for (const selector of selectors) {
39
+ const element = document.querySelector(selector);
40
+ if (element) {
41
+ return selector;
42
+ }
43
+ }
44
+ return defaultSelector;
45
+ }
37
46
  const InnerAnalyticsFunnel = (_a) => {
38
47
  var { children, stepConfiguration } = _a, props = __rest(_a, ["children", "stepConfiguration"]);
39
48
  const [funnelInteractionId, setFunnelInteractionId] = useState('');
40
49
  const [submissionAttempt, setSubmissionAttempt] = useState(0);
41
50
  const isVisualRefresh = useVisualRefresh();
42
- const inheritedFunnelNameSelector = useFunnelNameSelector();
43
- const funnelNameSelector = props.funnelNameSelector || inheritedFunnelNameSelector || getFunnelNameSelector();
44
51
  const funnelState = useRef('default');
52
+ const funnelNameSelector = useRef(getFunnelNameSelector());
45
53
  const errorCount = useRef(0);
46
54
  const loadingButtonCount = useRef(0);
47
55
  const wizardCount = useRef(0);
@@ -62,18 +70,20 @@ const InnerAnalyticsFunnel = (_a) => {
62
70
  If it does contain a Wizard, that Wizard should take precedence for handling the funnel, and
63
71
  this current funnel component should do nothing.
64
72
  */
73
+ let funnelInteractionId;
65
74
  const handle = setTimeout(() => {
66
75
  var _a;
76
+ funnelNameSelector.current = evaluateSelectors(props.funnelNameSelectors || [], getFunnelNameSelector());
67
77
  if (props.funnelType === 'single-page' && wizardCount.current > 0) {
68
78
  return;
69
79
  }
70
80
  // Reset the state, in case the component was re-mounted.
71
81
  funnelState.current = 'default';
72
82
  const singleStepFlowStepConfiguration = [
73
- { number: 1, isOptional: false, name: (_a = getNameFromSelector(funnelNameSelector)) !== null && _a !== void 0 ? _a : '' },
83
+ { number: 1, isOptional: false, name: (_a = getNameFromSelector(funnelNameSelector.current)) !== null && _a !== void 0 ? _a : '' },
74
84
  ];
75
- const funnelInteractionId = FunnelMetrics.funnelStart({
76
- funnelNameSelector: funnelNameSelector,
85
+ funnelInteractionId = FunnelMetrics.funnelStart({
86
+ funnelNameSelector: funnelNameSelector.current,
77
87
  optionalStepNumbers: props.optionalStepNumbers,
78
88
  funnelType: props.funnelType,
79
89
  totalFunnelSteps: props.totalFunnelSteps,
@@ -150,6 +160,7 @@ const InnerAnalyticsFunnel = (_a) => {
150
160
  funnelType: props.funnelType,
151
161
  optionalStepNumbers: props.optionalStepNumbers,
152
162
  totalFunnelSteps: props.totalFunnelSteps,
163
+ funnelNameSelector: funnelNameSelector.current,
153
164
  funnelSubmit,
154
165
  funnelCancel,
155
166
  submissionAttempt,
@@ -208,13 +219,15 @@ function useStepChangeListener(handler) {
208
219
  }, SUBSTEP_CHANGE_DEBOUNCE);
209
220
  return stepChangeCallback;
210
221
  }
211
- const InnerAnalyticsFunnelStep = ({ children, stepNumber, stepNameSelector }) => {
212
- const { funnelInteractionId, funnelState, funnelType } = useFunnel();
222
+ const InnerAnalyticsFunnelStep = (_a) => {
223
+ var { children, stepNumber } = _a, rest = __rest(_a, ["children", "stepNumber"]);
224
+ const { funnelInteractionId, funnelNameSelector, funnelState, funnelType } = useFunnel();
213
225
  const parentStep = useFunnelStep();
214
226
  const parentStepExists = parentStep.isInStep;
215
227
  const parentStepFunnelInteractionId = parentStep.funnelInteractionId;
216
228
  const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };
217
229
  const subStepCount = useRef(0);
230
+ const stepNameSelector = rest.stepNameSelector || funnelNameSelector;
218
231
  const onStepChange = useStepChangeListener(subStepConfiguration => {
219
232
  var _a;
220
233
  if (!funnelInteractionId) {
@@ -1 +1 @@
1
- {"version":3,"file":"analytics-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport {\n FunnelStepContext,\n FunnelSubStepContext,\n FunnelContext,\n FunnelContextValue,\n FunnelStepContextValue,\n FunnelState,\n FunnelSubStepContextValue,\n} from '../context/analytics-context';\nimport { useFunnel, useFunnelNameSelector, useFunnelStep } from '../hooks/use-funnel';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\n\nimport { PACKAGE_VERSION } from '../../environment';\n\nimport { FunnelMetrics } from '../index';\nimport { FunnelProps, FunnelStepProps, StepConfiguration, SubStepConfiguration } from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\nimport { useDebounceCallback } from '../../hooks/use-debounce-callback';\nimport { nodeBelongs } from '../../utils/node-belongs';\n\nexport const FUNNEL_VERSION = '1.3';\n\ntype AnalyticsFunnelProps = { children?: React.ReactNode; stepConfiguration?: StepConfiguration[] } & Pick<\n FunnelProps,\n 'funnelNameSelector' | 'funnelType' | 'optionalStepNumbers' | 'totalFunnelSteps'\n>;\n\nexport const AnalyticsFunnel = (props: AnalyticsFunnelProps) => {\n const { isInFunnel } = useFunnel();\n /*\n If the current funnel component is a Form (i.e. single-page funnel), it should\n defer its funnel-handling to a parent Form element, if present.\n Wizards (i.e. multi-page funnels) always take highest precedence for handling funnels,\n and do not defer to any other element.\n */\n if (isInFunnel && props.funnelType === 'single-page') {\n return <>{props.children}</>;\n }\n\n return <InnerAnalyticsFunnel {...props} />;\n};\nexport const CREATION_EDIT_FLOW_DONE_EVENT_NAME = 'awsui-creation-edit-flow-done';\n\nconst onFunnelCancelled = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelCancelled({ funnelInteractionId });\n document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n};\n\nconst onFunnelComplete = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelComplete({ funnelInteractionId });\n document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n};\n\nconst InnerAnalyticsFunnel = ({ children, stepConfiguration, ...props }: AnalyticsFunnelProps) => {\n const [funnelInteractionId, setFunnelInteractionId] = useState<string>('');\n const [submissionAttempt, setSubmissionAttempt] = useState(0);\n const isVisualRefresh = useVisualRefresh();\n const inheritedFunnelNameSelector = useFunnelNameSelector();\n const funnelNameSelector = props.funnelNameSelector || inheritedFunnelNameSelector || getFunnelNameSelector();\n const funnelState = useRef<FunnelState>('default');\n const errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\n const wizardCount = useRef<number>(0);\n const latestFocusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n\n // This useEffect hook is run once on component mount to initiate the funnel analytics.\n // It first calls the 'funnelStart' method from FunnelMetrics, providing all necessary details\n // about the funnel, and receives a unique interaction id.\n // This unique interaction id is then stored in the state for further use.\n //\n // On component unmount, it checks whether the funnel was successfully completed.\n // Based on this, it either calls 'funnelComplete' or 'funnelCancelled' method from FunnelMetrics.\n //\n // The eslint-disable is required as we deliberately want this effect to run only once on mount and unmount,\n // hence we do not provide any dependencies.\n useEffect(() => {\n /*\n We run this effect with a delay, in order to detect whether this funnel contains a Wizard.\n If it does contain a Wizard, that Wizard should take precedence for handling the funnel, and\n this current funnel component should do nothing.\n */\n const handle = setTimeout(() => {\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const singleStepFlowStepConfiguration = [\n { number: 1, isOptional: false, name: getNameFromSelector(funnelNameSelector) ?? '' },\n ];\n\n const funnelInteractionId = FunnelMetrics.funnelStart({\n funnelNameSelector: funnelNameSelector,\n optionalStepNumbers: props.optionalStepNumbers,\n funnelType: props.funnelType,\n totalFunnelSteps: props.totalFunnelSteps,\n componentVersion: PACKAGE_VERSION,\n theme: isVisualRefresh ? 'vr' : 'classic',\n funnelVersion: FUNNEL_VERSION,\n stepConfiguration: stepConfiguration ?? singleStepFlowStepConfiguration,\n });\n\n setFunnelInteractionId(funnelInteractionId);\n }, 1);\n\n /*\n A funnel counts as \"successful\" if it is unmounted after being \"complete\".\n */\n /* eslint-disable react-hooks/exhaustive-deps */\n return () => {\n clearTimeout(handle);\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId });\n } else {\n onFunnelCancelled({ funnelInteractionId });\n funnelState.current = 'cancelled';\n }\n };\n }, []);\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const funnelSubmit = () => {\n funnelState.current = 'validating';\n\n /*\n When the user attempts to submit the form, we wait for 50 milliseconds before checking\n if any form validation errors are present. This value was chosen to give enough time\n for validation and rerendering to occur, but be low enough that the user will not\n be able to take further action in the meantime.\n */\n const VALIDATION_WAIT_DELAY = 50;\n /*\n Loading is expected to take longer than validation, so we can keep the pressure on the CPU low.\n */\n const LOADING_WAIT_DELAY = 100;\n\n const checkForCompleteness = () => {\n if (funnelState.current === 'complete') {\n return;\n }\n\n if (loadingButtonCount.current > 0) {\n setTimeout(checkForCompleteness, LOADING_WAIT_DELAY);\n return;\n }\n\n if (errorCount.current === 0) {\n /*\n If no validation errors are rendered, we treat the funnel as complete.\n */\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n } else {\n funnelState.current = 'default';\n }\n };\n\n setTimeout(checkForCompleteness, VALIDATION_WAIT_DELAY);\n };\n\n const funnelNextOrSubmitAttempt = () => setSubmissionAttempt(i => i + 1);\n\n const funnelCancel = () => {};\n\n const funnelContextValue: FunnelContextValue = {\n funnelInteractionId,\n setFunnelInteractionId,\n funnelType: props.funnelType,\n optionalStepNumbers: props.optionalStepNumbers,\n totalFunnelSteps: props.totalFunnelSteps,\n funnelSubmit,\n funnelCancel,\n submissionAttempt,\n funnelNextOrSubmitAttempt,\n funnelState,\n errorCount,\n loadingButtonCount,\n latestFocusCleanupFunction,\n isInFunnel: true,\n wizardCount,\n };\n\n return <FunnelContext.Provider value={funnelContextValue}>{children}</FunnelContext.Provider>;\n};\n\ntype AnalyticsFunnelStepProps = {\n children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);\n} & Pick<FunnelStepProps, 'stepNumber' | 'stepNameSelector'>;\n\nexport const AnalyticsFunnelStep = (props: AnalyticsFunnelStepProps) => {\n /*\n This wrapper is used to apply a `key` property to the actual (inner) AnalyticsFunnelStep\n element. This allows us to keep the state and effects separate per step.\n */\n return <InnerAnalyticsFunnelStep {...props} key={props.stepNumber} />;\n};\n\nfunction getSubStepConfiguration() {\n const subSteps = Array.from(document.querySelectorAll<HTMLElement>(getSubStepAllSelector()));\n\n const subStepConfiguration = subSteps.map((substep, index) => {\n const name = substep.querySelector<HTMLElement>(getSubStepNameSelector())?.innerText?.trim() ?? '';\n return {\n name,\n number: index + 1,\n };\n });\n return subStepConfiguration;\n}\n\nfunction useStepChangeListener(handler: (stepConfiguration: SubStepConfiguration[]) => void) {\n /*\n Chosen so that it's hopefully shorter than a user interaction, but gives enough time for the\n amount of containers to stabilise.\n */\n const SUBSTEP_CHANGE_DEBOUNCE = 50;\n\n const listenForSubStepChanges = useRef(false);\n useEffect(() => {\n // We prevent emitting the event on the first render.\n const handle = setTimeout(() => (listenForSubStepChanges.current = true), SUBSTEP_CHANGE_DEBOUNCE);\n\n return () => {\n clearTimeout(handle);\n listenForSubStepChanges.current = false;\n };\n }, []);\n\n /* We debounce this handler, so that multiple containers can change at once without causing \n too many events. */\n const stepChangeCallback = useDebounceCallback(() => {\n // We don't want to emit the event after the component has been unmounted.\n if (!listenForSubStepChanges.current) {\n return;\n }\n\n handler(getSubStepConfiguration());\n }, SUBSTEP_CHANGE_DEBOUNCE);\n\n return stepChangeCallback;\n}\n\nconst InnerAnalyticsFunnelStep = ({ children, stepNumber, stepNameSelector }: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelState, funnelType } = useFunnel();\n const parentStep = useFunnelStep();\n const parentStepExists = parentStep.isInStep;\n const parentStepFunnelInteractionId = parentStep.funnelInteractionId;\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\n\n const subStepCount = useRef<number>(0);\n\n const onStepChange = useStepChangeListener(subStepConfiguration => {\n if (!funnelInteractionId) {\n return;\n }\n const stepName = getNameFromSelector(stepNameSelector) ?? '';\n\n FunnelMetrics.funnelStepChange({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration,\n });\n });\n\n // This useEffect hook is used to track the start and completion of interaction with the step.\n // On mount, if there is a valid funnel interaction id, it calls the 'funnelStepStart' method from FunnelMetrics\n // to record the beginning of the interaction with the current step.\n // On unmount, it does a similar thing but this time calling 'funnelStepComplete' to record the completion of the interaction.\n useEffect(() => {\n if (!funnelInteractionId) {\n // This step is not inside an active funnel.\n return;\n }\n if (parentStepExists && parentStepFunnelInteractionId) {\n /*\n This step is inside another step, which already reports events as\n part of an active funnel (i.e. that step is not a parent of a Wizard).\n Thus, this current step does not need to report any events.\n */\n return;\n }\n\n const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration: getSubStepConfiguration(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelState.current !== 'cancelled') {\n FunnelMetrics.funnelStepComplete({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n totalSubSteps: subStepCount.current,\n });\n }\n };\n }, [\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n funnelState,\n parentStepExists,\n funnelType,\n parentStepFunnelInteractionId,\n ]);\n\n const contextValue: FunnelStepContextValue = {\n stepNumber,\n stepNameSelector,\n funnelStepProps,\n subStepCount,\n isInStep: true,\n funnelInteractionId,\n onStepChange,\n };\n\n /*\n If this step is inside another step which already reports events as part of an active\n funnel (i.e. that step is not a parent of a Wizard), the current step becomes invisible\n in the hierarchy by passing the context of its parent through.\n */\n const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;\n\n return (\n <FunnelStepContext.Provider value={effectiveContextValue}>\n {typeof children === 'function' ? children(effectiveContextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);\n}\n\nexport const AnalyticsFunnelSubStep = ({ children }: AnalyticsFunnelSubStepProps) => {\n const subStepId = useUniqueId('substep');\n const subStepSelector = getSubStepSelector(subStepId);\n const subStepNameSelector = getSubStepNameSelector(subStepId);\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const { subStepCount, onStepChange } = useFunnelStep();\n const mousePressed = useRef<boolean>(false);\n const isFocusedSubStep = useRef<boolean>(false);\n const focusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n const { funnelState, funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const newContext: FunnelSubStepContextValue = {\n subStepSelector,\n subStepNameSelector,\n subStepId,\n subStepRef,\n mousePressed,\n isFocusedSubStep,\n focusCleanupFunction,\n isNestedSubStep: false,\n };\n\n const inheritedContext = { ...useContext(FunnelSubStepContext), isNestedSubStep: true };\n\n const isNested = Boolean(inheritedContext.subStepId);\n\n useEffect(() => {\n if (!isNested) {\n subStepCount.current++;\n onStepChange();\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n subStepCount.current--;\n onStepChange();\n };\n }\n }, [isNested, subStepCount, onStepChange]);\n\n const context = isNested ? inheritedContext : newContext;\n\n useEffect(() => {\n if (isNested || !subStepRef.current) {\n return;\n }\n\n const onMouseDown = () => (mousePressed.current = true);\n\n const onMouseUp = async () => {\n mousePressed.current = false;\n\n if (!isFocusedSubStep.current) {\n return;\n }\n\n /*\n Some mouse events result in an element being focused. However,\n this happens only _after_ the onMouseUp event. We yield the\n event loop here, so that `document.activeElement` has the\n correct new value. \n */\n await new Promise(r => setTimeout(r, 1));\n\n if (!subStepRef.current || !document.activeElement || !nodeBelongs(subStepRef.current, document.activeElement)) {\n isFocusedSubStep.current = false;\n\n /*\n Run this substep's own focus cleanup function if another substep\n hasn't already done it for us.\n */\n focusCleanupFunction.current?.();\n }\n };\n window.addEventListener('mousedown', onMouseDown);\n window.addEventListener('mouseup', onMouseUp);\n return () => {\n window.removeEventListener('mousedown', onMouseDown);\n window.removeEventListener('mouseup', onMouseUp);\n };\n }, [\n funnelInteractionId,\n funnelState,\n stepNameSelector,\n stepNumber,\n subStepNameSelector,\n subStepSelector,\n focusCleanupFunction,\n isNested,\n subStepRef,\n ]);\n\n return (\n <FunnelSubStepContext.Provider value={context}>\n {typeof children === 'function' ? children(context) : children}\n </FunnelSubStepContext.Provider>\n );\n};\n"]}
1
+ {"version":3,"file":"analytics-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport {\n FunnelStepContext,\n FunnelSubStepContext,\n FunnelContext,\n FunnelContextValue,\n FunnelStepContextValue,\n FunnelState,\n FunnelSubStepContextValue,\n} from '../context/analytics-context';\nimport { useFunnel, useFunnelStep } from '../hooks/use-funnel';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\n\nimport { PACKAGE_VERSION } from '../../environment';\n\nimport { FunnelMetrics } from '../index';\nimport { FunnelProps, FunnelStepProps, StepConfiguration, SubStepConfiguration } from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\nimport { useDebounceCallback } from '../../hooks/use-debounce-callback';\nimport { nodeBelongs } from '../../utils/node-belongs';\n\nexport const FUNNEL_VERSION = '1.4';\n\ninterface AnalyticsFunnelProps {\n children?: React.ReactNode;\n stepConfiguration?: StepConfiguration[];\n funnelNameSelectors?: string[];\n funnelType: FunnelProps['funnelType'];\n optionalStepNumbers: FunnelProps['optionalStepNumbers'];\n totalFunnelSteps: FunnelProps['totalFunnelSteps'];\n}\n\nexport const AnalyticsFunnel = (props: AnalyticsFunnelProps) => {\n const { isInFunnel } = useFunnel();\n /*\n If the current funnel component is a Form (i.e. single-page funnel), it should\n defer its funnel-handling to a parent Form element, if present.\n Wizards (i.e. multi-page funnels) always take highest precedence for handling funnels,\n and do not defer to any other element.\n */\n if (isInFunnel && props.funnelType === 'single-page') {\n return <>{props.children}</>;\n }\n\n return <InnerAnalyticsFunnel {...props} />;\n};\nexport const CREATION_EDIT_FLOW_DONE_EVENT_NAME = 'awsui-creation-edit-flow-done';\n\nconst onFunnelCancelled = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelCancelled({ funnelInteractionId });\n document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n};\n\nconst onFunnelComplete = ({ funnelInteractionId }: { funnelInteractionId: string }) => {\n FunnelMetrics.funnelComplete({ funnelInteractionId });\n document.dispatchEvent(new Event(CREATION_EDIT_FLOW_DONE_EVENT_NAME));\n};\n\nfunction evaluateSelectors(selectors: string[], defaultSelector: string) {\n for (const selector of selectors) {\n const element = document.querySelector(selector);\n if (element) {\n return selector;\n }\n }\n\n return defaultSelector;\n}\n\nconst InnerAnalyticsFunnel = ({ children, stepConfiguration, ...props }: AnalyticsFunnelProps) => {\n const [funnelInteractionId, setFunnelInteractionId] = useState<string>('');\n const [submissionAttempt, setSubmissionAttempt] = useState(0);\n const isVisualRefresh = useVisualRefresh();\n const funnelState = useRef<FunnelState>('default');\n const funnelNameSelector = useRef<string>(getFunnelNameSelector());\n const errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\n const wizardCount = useRef<number>(0);\n const latestFocusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n\n // This useEffect hook is run once on component mount to initiate the funnel analytics.\n // It first calls the 'funnelStart' method from FunnelMetrics, providing all necessary details\n // about the funnel, and receives a unique interaction id.\n // This unique interaction id is then stored in the state for further use.\n //\n // On component unmount, it checks whether the funnel was successfully completed.\n // Based on this, it either calls 'funnelComplete' or 'funnelCancelled' method from FunnelMetrics.\n //\n // The eslint-disable is required as we deliberately want this effect to run only once on mount and unmount,\n // hence we do not provide any dependencies.\n useEffect(() => {\n /*\n We run this effect with a delay, in order to detect whether this funnel contains a Wizard.\n If it does contain a Wizard, that Wizard should take precedence for handling the funnel, and\n this current funnel component should do nothing.\n */\n let funnelInteractionId: string;\n const handle = setTimeout(() => {\n funnelNameSelector.current = evaluateSelectors(props.funnelNameSelectors || [], getFunnelNameSelector());\n\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const singleStepFlowStepConfiguration = [\n { number: 1, isOptional: false, name: getNameFromSelector(funnelNameSelector.current) ?? '' },\n ];\n\n funnelInteractionId = FunnelMetrics.funnelStart({\n funnelNameSelector: funnelNameSelector.current,\n optionalStepNumbers: props.optionalStepNumbers,\n funnelType: props.funnelType,\n totalFunnelSteps: props.totalFunnelSteps,\n componentVersion: PACKAGE_VERSION,\n theme: isVisualRefresh ? 'vr' : 'classic',\n funnelVersion: FUNNEL_VERSION,\n stepConfiguration: stepConfiguration ?? singleStepFlowStepConfiguration,\n });\n\n setFunnelInteractionId(funnelInteractionId);\n }, 1);\n\n /*\n A funnel counts as \"successful\" if it is unmounted after being \"complete\".\n */\n /* eslint-disable react-hooks/exhaustive-deps */\n return () => {\n clearTimeout(handle);\n if (props.funnelType === 'single-page' && wizardCount.current > 0) {\n return;\n }\n\n if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId });\n } else {\n onFunnelCancelled({ funnelInteractionId });\n funnelState.current = 'cancelled';\n }\n };\n }, []);\n /* eslint-enable react-hooks/exhaustive-deps */\n\n const funnelSubmit = () => {\n funnelState.current = 'validating';\n\n /*\n When the user attempts to submit the form, we wait for 50 milliseconds before checking\n if any form validation errors are present. This value was chosen to give enough time\n for validation and rerendering to occur, but be low enough that the user will not\n be able to take further action in the meantime.\n */\n const VALIDATION_WAIT_DELAY = 50;\n /*\n Loading is expected to take longer than validation, so we can keep the pressure on the CPU low.\n */\n const LOADING_WAIT_DELAY = 100;\n\n const checkForCompleteness = () => {\n if (funnelState.current === 'complete') {\n return;\n }\n\n if (loadingButtonCount.current > 0) {\n setTimeout(checkForCompleteness, LOADING_WAIT_DELAY);\n return;\n }\n\n if (errorCount.current === 0) {\n /*\n If no validation errors are rendered, we treat the funnel as complete.\n */\n onFunnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n } else {\n funnelState.current = 'default';\n }\n };\n\n setTimeout(checkForCompleteness, VALIDATION_WAIT_DELAY);\n };\n\n const funnelNextOrSubmitAttempt = () => setSubmissionAttempt(i => i + 1);\n\n const funnelCancel = () => {};\n\n const funnelContextValue: FunnelContextValue = {\n funnelInteractionId,\n setFunnelInteractionId,\n funnelType: props.funnelType,\n optionalStepNumbers: props.optionalStepNumbers,\n totalFunnelSteps: props.totalFunnelSteps,\n funnelNameSelector: funnelNameSelector.current,\n funnelSubmit,\n funnelCancel,\n submissionAttempt,\n funnelNextOrSubmitAttempt,\n funnelState,\n errorCount,\n loadingButtonCount,\n latestFocusCleanupFunction,\n isInFunnel: true,\n wizardCount,\n };\n\n return <FunnelContext.Provider value={funnelContextValue}>{children}</FunnelContext.Provider>;\n};\n\ninterface AnalyticsFunnelStepProps {\n children?: React.ReactNode | ((props: FunnelStepContextValue) => React.ReactNode);\n stepNameSelector?: FunnelStepProps['stepNameSelector'];\n stepNumber: FunnelStepProps['stepNumber'];\n}\n\nexport const AnalyticsFunnelStep = (props: AnalyticsFunnelStepProps) => {\n /*\n This wrapper is used to apply a `key` property to the actual (inner) AnalyticsFunnelStep\n element. This allows us to keep the state and effects separate per step.\n */\n return <InnerAnalyticsFunnelStep {...props} key={props.stepNumber} />;\n};\n\nfunction getSubStepConfiguration() {\n const subSteps = Array.from(document.querySelectorAll<HTMLElement>(getSubStepAllSelector()));\n\n const subStepConfiguration = subSteps.map((substep, index) => {\n const name = substep.querySelector<HTMLElement>(getSubStepNameSelector())?.innerText?.trim() ?? '';\n return {\n name,\n number: index + 1,\n };\n });\n return subStepConfiguration;\n}\n\nfunction useStepChangeListener(handler: (stepConfiguration: SubStepConfiguration[]) => void) {\n /*\n Chosen so that it's hopefully shorter than a user interaction, but gives enough time for the\n amount of containers to stabilise.\n */\n const SUBSTEP_CHANGE_DEBOUNCE = 50;\n\n const listenForSubStepChanges = useRef(false);\n useEffect(() => {\n // We prevent emitting the event on the first render.\n const handle = setTimeout(() => (listenForSubStepChanges.current = true), SUBSTEP_CHANGE_DEBOUNCE);\n\n return () => {\n clearTimeout(handle);\n listenForSubStepChanges.current = false;\n };\n }, []);\n\n /* We debounce this handler, so that multiple containers can change at once without causing \n too many events. */\n const stepChangeCallback = useDebounceCallback(() => {\n // We don't want to emit the event after the component has been unmounted.\n if (!listenForSubStepChanges.current) {\n return;\n }\n\n handler(getSubStepConfiguration());\n }, SUBSTEP_CHANGE_DEBOUNCE);\n\n return stepChangeCallback;\n}\n\nconst InnerAnalyticsFunnelStep = ({ children, stepNumber, ...rest }: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelNameSelector, funnelState, funnelType } = useFunnel();\n const parentStep = useFunnelStep();\n const parentStepExists = parentStep.isInStep;\n const parentStepFunnelInteractionId = parentStep.funnelInteractionId;\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\n\n const subStepCount = useRef<number>(0);\n\n const stepNameSelector = rest.stepNameSelector || funnelNameSelector;\n const onStepChange = useStepChangeListener(subStepConfiguration => {\n if (!funnelInteractionId) {\n return;\n }\n const stepName = getNameFromSelector(stepNameSelector) ?? '';\n\n FunnelMetrics.funnelStepChange({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration,\n });\n });\n\n // This useEffect hook is used to track the start and completion of interaction with the step.\n // On mount, if there is a valid funnel interaction id, it calls the 'funnelStepStart' method from FunnelMetrics\n // to record the beginning of the interaction with the current step.\n // On unmount, it does a similar thing but this time calling 'funnelStepComplete' to record the completion of the interaction.\n useEffect(() => {\n if (!funnelInteractionId) {\n // This step is not inside an active funnel.\n return;\n }\n if (parentStepExists && parentStepFunnelInteractionId) {\n /*\n This step is inside another step, which already reports events as\n part of an active funnel (i.e. that step is not a parent of a Wizard).\n Thus, this current step does not need to report any events.\n */\n return;\n }\n\n const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n totalSubSteps: subStepCount.current,\n subStepConfiguration: getSubStepConfiguration(),\n });\n }\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelState.current !== 'cancelled') {\n FunnelMetrics.funnelStepComplete({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n totalSubSteps: subStepCount.current,\n });\n }\n };\n }, [\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n funnelState,\n parentStepExists,\n funnelType,\n parentStepFunnelInteractionId,\n ]);\n\n const contextValue: FunnelStepContextValue = {\n stepNumber,\n stepNameSelector,\n funnelStepProps,\n subStepCount,\n isInStep: true,\n funnelInteractionId,\n onStepChange,\n };\n\n /*\n If this step is inside another step which already reports events as part of an active\n funnel (i.e. that step is not a parent of a Wizard), the current step becomes invisible\n in the hierarchy by passing the context of its parent through.\n */\n const effectiveContextValue = parentStepExists && parentStepFunnelInteractionId ? parentStep : contextValue;\n\n return (\n <FunnelStepContext.Provider value={effectiveContextValue}>\n {typeof children === 'function' ? children(effectiveContextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n children?: React.ReactNode | ((props: FunnelSubStepContextValue) => React.ReactNode);\n}\n\nexport const AnalyticsFunnelSubStep = ({ children }: AnalyticsFunnelSubStepProps) => {\n const subStepId = useUniqueId('substep');\n const subStepSelector = getSubStepSelector(subStepId);\n const subStepNameSelector = getSubStepNameSelector(subStepId);\n const subStepRef = useRef<HTMLDivElement | null>(null);\n const { subStepCount, onStepChange } = useFunnelStep();\n const mousePressed = useRef<boolean>(false);\n const isFocusedSubStep = useRef<boolean>(false);\n const focusCleanupFunction = useRef<undefined | (() => void)>(undefined);\n const { funnelState, funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const newContext: FunnelSubStepContextValue = {\n subStepSelector,\n subStepNameSelector,\n subStepId,\n subStepRef,\n mousePressed,\n isFocusedSubStep,\n focusCleanupFunction,\n isNestedSubStep: false,\n };\n\n const inheritedContext = { ...useContext(FunnelSubStepContext), isNestedSubStep: true };\n\n const isNested = Boolean(inheritedContext.subStepId);\n\n useEffect(() => {\n if (!isNested) {\n subStepCount.current++;\n onStepChange();\n\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n subStepCount.current--;\n onStepChange();\n };\n }\n }, [isNested, subStepCount, onStepChange]);\n\n const context = isNested ? inheritedContext : newContext;\n\n useEffect(() => {\n if (isNested || !subStepRef.current) {\n return;\n }\n\n const onMouseDown = () => (mousePressed.current = true);\n\n const onMouseUp = async () => {\n mousePressed.current = false;\n\n if (!isFocusedSubStep.current) {\n return;\n }\n\n /*\n Some mouse events result in an element being focused. However,\n this happens only _after_ the onMouseUp event. We yield the\n event loop here, so that `document.activeElement` has the\n correct new value. \n */\n await new Promise(r => setTimeout(r, 1));\n\n if (!subStepRef.current || !document.activeElement || !nodeBelongs(subStepRef.current, document.activeElement)) {\n isFocusedSubStep.current = false;\n\n /*\n Run this substep's own focus cleanup function if another substep\n hasn't already done it for us.\n */\n focusCleanupFunction.current?.();\n }\n };\n window.addEventListener('mousedown', onMouseDown);\n window.addEventListener('mouseup', onMouseUp);\n return () => {\n window.removeEventListener('mousedown', onMouseDown);\n window.removeEventListener('mouseup', onMouseUp);\n };\n }, [\n funnelInteractionId,\n funnelState,\n stepNameSelector,\n stepNumber,\n subStepNameSelector,\n subStepSelector,\n focusCleanupFunction,\n isNested,\n subStepRef,\n ]);\n\n return (\n <FunnelSubStepContext.Provider value={context}>\n {typeof children === 'function' ? children(context) : children}\n </FunnelSubStepContext.Provider>\n );\n};\n"]}
@@ -4,6 +4,7 @@ export type FunnelState = 'default' | 'validating' | 'complete' | 'cancelled';
4
4
  export interface FunnelContextValue {
5
5
  funnelInteractionId: string | undefined;
6
6
  funnelType: FunnelType;
7
+ funnelNameSelector: string;
7
8
  optionalStepNumbers: number[];
8
9
  totalFunnelSteps: number;
9
10
  funnelSubmit: () => void;
@@ -1 +1 @@
1
- {"version":3,"file":"analytics-context.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/context/analytics-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAiB,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9E,MAAM,WAAW,kBAAkB;IACjC,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,UAAU,EAAE,UAAU,CAAC;IACvB,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,sBAAsB,EAAE,CAAC,mBAAmB,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,WAAW,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACpC,UAAU,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC7C,0BAA0B,EAAE,gBAAgB,CAAC,SAAS,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC;IACvE,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACvC;AAED,MAAM,WAAW,sBAAsB;IACrC,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;IACxE,YAAY,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,+EAA+E;IAC/E,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,UAAU,EAAE,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACpD,YAAY,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC;;;;;OAKG;IACH,gBAAgB,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAE5C;;OAEG;IACH,oBAAoB,EAAE,gBAAgB,CAAC,SAAS,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC;IACjE,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;CAC5E;AAGD,eAAO,MAAM,aAAa,6CAgBxB,CAAC;AAEH,eAAO,MAAM,iBAAiB,iDAO5B,CAAC;AAEH,eAAO,MAAM,oBAAoB,oDAS/B,CAAC;AAEH,eAAO,MAAM,yBAAyB,6CAA+C,CAAC"}
1
+ {"version":3,"file":"analytics-context.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/context/analytics-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAiB,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAG3C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9E,MAAM,WAAW,kBAAkB;IACjC,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,UAAU,EAAE,UAAU,CAAC;IACvB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,sBAAsB,EAAE,CAAC,mBAAmB,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,WAAW,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IACpC,UAAU,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC7C,0BAA0B,EAAE,gBAAgB,CAAC,SAAS,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC;IACvE,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACvC;AAED,MAAM,WAAW,sBAAsB;IACrC,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;IACxE,YAAY,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,+EAA+E;IAC/E,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,UAAU,EAAE,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACpD,YAAY,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC;;;;;OAKG;IACH,gBAAgB,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAE5C;;OAEG;IACH,oBAAoB,EAAE,gBAAgB,CAAC,SAAS,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC;IACjE,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;CAC5E;AAGD,eAAO,MAAM,aAAa,6CAiBxB,CAAC;AAEH,eAAO,MAAM,iBAAiB,iDAO5B,CAAC;AAEH,eAAO,MAAM,oBAAoB,oDAS/B,CAAC;AAEH,eAAO,MAAM,yBAAyB,6CAA+C,CAAC"}
@@ -1,9 +1,11 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import { createContext } from 'react';
4
+ import { getFunnelNameSelector } from '../selectors';
4
5
  /* istanbul ignore next */
5
6
  export const FunnelContext = createContext({
6
7
  funnelInteractionId: undefined,
8
+ funnelNameSelector: getFunnelNameSelector(),
7
9
  setFunnelInteractionId: () => { },
8
10
  funnelType: 'single-page',
9
11
  optionalStepNumbers: [],
@@ -1 +1 @@
1
- {"version":3,"file":"analytics-context.js","sourceRoot":"lib/default/","sources":["internal/analytics/context/analytics-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAA+B,aAAa,EAAE,MAAM,OAAO,CAAC;AAwDnE,0BAA0B;AAC1B,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAqB;IAC7D,mBAAmB,EAAE,SAAS;IAC9B,sBAAsB,EAAE,GAAG,EAAE,GAAE,CAAC;IAChC,UAAU,EAAE,aAAa;IACzB,mBAAmB,EAAE,EAAE;IACvB,gBAAgB,EAAE,CAAC;IACnB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,iBAAiB,EAAE,CAAC;IACpB,yBAAyB,EAAE,GAAG,EAAE,GAAE,CAAC;IACnC,WAAW,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;IACnC,UAAU,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAC1B,kBAAkB,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAClC,0BAA0B,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;IAClD,UAAU,EAAE,KAAK;IACjB,WAAW,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG,aAAa,CAAyB;IACrE,gBAAgB,EAAE,EAAE;IACpB,UAAU,EAAE,CAAC;IACb,YAAY,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAC5B,QAAQ,EAAE,KAAK;IACf,mBAAmB,EAAE,SAAS;IAC9B,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAA4B;IAC3E,SAAS,EAAE,EAAE;IACb,eAAe,EAAE,EAAE;IACnB,mBAAmB,EAAE,EAAE;IACvB,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;IAC7B,eAAe,EAAE,KAAK;IACtB,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;IAChC,gBAAgB,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;IACpC,oBAAoB,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;CAC7C,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,yBAAyB,GAAG,aAAa,CAAqB,SAAS,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { MutableRefObject, RefObject, createContext } from 'react';\nimport { FunnelType } from '../interfaces';\n\nexport type FunnelState = 'default' | 'validating' | 'complete' | 'cancelled';\n\nexport interface FunnelContextValue {\n funnelInteractionId: string | undefined;\n funnelType: FunnelType;\n optionalStepNumbers: number[];\n totalFunnelSteps: number;\n funnelSubmit: () => void;\n funnelCancel: () => void;\n setFunnelInteractionId: (funnelInteractionId: string) => void;\n submissionAttempt: number;\n funnelNextOrSubmitAttempt: () => void;\n funnelState: RefObject<FunnelState>;\n errorCount: MutableRefObject<number>;\n loadingButtonCount: MutableRefObject<number>;\n latestFocusCleanupFunction: MutableRefObject<undefined | (() => void)>;\n isInFunnel: boolean;\n wizardCount: MutableRefObject<number>;\n}\n\nexport interface FunnelStepContextValue {\n stepNameSelector: string;\n stepNumber: number;\n funnelStepProps?: Record<string, string | number | boolean | undefined>;\n subStepCount: MutableRefObject<number>;\n isInStep: boolean;\n funnelInteractionId: string | undefined;\n /** This function is called when the list of substeps in this step changes. */\n onStepChange: () => void;\n}\n\nexport interface FunnelSubStepContextValue {\n subStepId: string;\n subStepSelector: string;\n subStepNameSelector: string;\n subStepRef: MutableRefObject<HTMLDivElement | null>;\n mousePressed: MutableRefObject<boolean>;\n /**\n * `isFocusedSubStep` is almost the same as checking if document.activeElement\n * is a child of the curren substep. However, `isFocusedSubStep` stays true\n * while the mouse button is pressed down, even though some browsers move the focus\n * to the body element during that time.\n */\n isFocusedSubStep: MutableRefObject<boolean>;\n\n /**\n * The focus cleanup function should be run when the user leaves the substep.\n */\n focusCleanupFunction: MutableRefObject<undefined | (() => void)>;\n isNestedSubStep: boolean;\n funnelSubStepProps?: Record<string, string | number | boolean | undefined>;\n}\n\n/* istanbul ignore next */\nexport const FunnelContext = createContext<FunnelContextValue>({\n funnelInteractionId: undefined,\n setFunnelInteractionId: () => {},\n funnelType: 'single-page',\n optionalStepNumbers: [],\n totalFunnelSteps: 0,\n funnelSubmit: () => {},\n funnelCancel: () => {},\n submissionAttempt: 0,\n funnelNextOrSubmitAttempt: () => {},\n funnelState: { current: 'default' },\n errorCount: { current: 0 },\n loadingButtonCount: { current: 0 },\n latestFocusCleanupFunction: { current: undefined },\n isInFunnel: false,\n wizardCount: { current: 0 },\n});\n\nexport const FunnelStepContext = createContext<FunnelStepContextValue>({\n stepNameSelector: '',\n stepNumber: 0,\n subStepCount: { current: 0 },\n isInStep: false,\n funnelInteractionId: undefined,\n onStepChange: () => {},\n});\n\nexport const FunnelSubStepContext = createContext<FunnelSubStepContextValue>({\n subStepId: '',\n subStepSelector: '',\n subStepNameSelector: '',\n subStepRef: { current: null },\n isNestedSubStep: false,\n mousePressed: { current: false },\n isFocusedSubStep: { current: false },\n focusCleanupFunction: { current: undefined },\n});\n\nexport const FunnelNameSelectorContext = createContext<string | undefined>(undefined);\n"]}
1
+ {"version":3,"file":"analytics-context.js","sourceRoot":"lib/default/","sources":["internal/analytics/context/analytics-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAA+B,aAAa,EAAE,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAwDrD,0BAA0B;AAC1B,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAqB;IAC7D,mBAAmB,EAAE,SAAS;IAC9B,kBAAkB,EAAE,qBAAqB,EAAE;IAC3C,sBAAsB,EAAE,GAAG,EAAE,GAAE,CAAC;IAChC,UAAU,EAAE,aAAa;IACzB,mBAAmB,EAAE,EAAE;IACvB,gBAAgB,EAAE,CAAC;IACnB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,iBAAiB,EAAE,CAAC;IACpB,yBAAyB,EAAE,GAAG,EAAE,GAAE,CAAC;IACnC,WAAW,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;IACnC,UAAU,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAC1B,kBAAkB,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAClC,0BAA0B,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;IAClD,UAAU,EAAE,KAAK;IACjB,WAAW,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG,aAAa,CAAyB;IACrE,gBAAgB,EAAE,EAAE;IACpB,UAAU,EAAE,CAAC;IACb,YAAY,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;IAC5B,QAAQ,EAAE,KAAK;IACf,mBAAmB,EAAE,SAAS;IAC9B,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAA4B;IAC3E,SAAS,EAAE,EAAE;IACb,eAAe,EAAE,EAAE;IACnB,mBAAmB,EAAE,EAAE;IACvB,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;IAC7B,eAAe,EAAE,KAAK;IACtB,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;IAChC,gBAAgB,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;IACpC,oBAAoB,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;CAC7C,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,yBAAyB,GAAG,aAAa,CAAqB,SAAS,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { MutableRefObject, RefObject, createContext } from 'react';\nimport { FunnelType } from '../interfaces';\nimport { getFunnelNameSelector } from '../selectors';\n\nexport type FunnelState = 'default' | 'validating' | 'complete' | 'cancelled';\n\nexport interface FunnelContextValue {\n funnelInteractionId: string | undefined;\n funnelType: FunnelType;\n funnelNameSelector: string;\n optionalStepNumbers: number[];\n totalFunnelSteps: number;\n funnelSubmit: () => void;\n funnelCancel: () => void;\n setFunnelInteractionId: (funnelInteractionId: string) => void;\n submissionAttempt: number;\n funnelNextOrSubmitAttempt: () => void;\n funnelState: RefObject<FunnelState>;\n errorCount: MutableRefObject<number>;\n loadingButtonCount: MutableRefObject<number>;\n latestFocusCleanupFunction: MutableRefObject<undefined | (() => void)>;\n isInFunnel: boolean;\n wizardCount: MutableRefObject<number>;\n}\n\nexport interface FunnelStepContextValue {\n stepNameSelector: string;\n stepNumber: number;\n funnelStepProps?: Record<string, string | number | boolean | undefined>;\n subStepCount: MutableRefObject<number>;\n isInStep: boolean;\n funnelInteractionId: string | undefined;\n /** This function is called when the list of substeps in this step changes. */\n onStepChange: () => void;\n}\n\nexport interface FunnelSubStepContextValue {\n subStepId: string;\n subStepSelector: string;\n subStepNameSelector: string;\n subStepRef: MutableRefObject<HTMLDivElement | null>;\n mousePressed: MutableRefObject<boolean>;\n /**\n * `isFocusedSubStep` is almost the same as checking if document.activeElement\n * is a child of the curren substep. However, `isFocusedSubStep` stays true\n * while the mouse button is pressed down, even though some browsers move the focus\n * to the body element during that time.\n */\n isFocusedSubStep: MutableRefObject<boolean>;\n\n /**\n * The focus cleanup function should be run when the user leaves the substep.\n */\n focusCleanupFunction: MutableRefObject<undefined | (() => void)>;\n isNestedSubStep: boolean;\n funnelSubStepProps?: Record<string, string | number | boolean | undefined>;\n}\n\n/* istanbul ignore next */\nexport const FunnelContext = createContext<FunnelContextValue>({\n funnelInteractionId: undefined,\n funnelNameSelector: getFunnelNameSelector(),\n setFunnelInteractionId: () => {},\n funnelType: 'single-page',\n optionalStepNumbers: [],\n totalFunnelSteps: 0,\n funnelSubmit: () => {},\n funnelCancel: () => {},\n submissionAttempt: 0,\n funnelNextOrSubmitAttempt: () => {},\n funnelState: { current: 'default' },\n errorCount: { current: 0 },\n loadingButtonCount: { current: 0 },\n latestFocusCleanupFunction: { current: undefined },\n isInFunnel: false,\n wizardCount: { current: 0 },\n});\n\nexport const FunnelStepContext = createContext<FunnelStepContextValue>({\n stepNameSelector: '',\n stepNumber: 0,\n subStepCount: { current: 0 },\n isInStep: false,\n funnelInteractionId: undefined,\n onStepChange: () => {},\n});\n\nexport const FunnelSubStepContext = createContext<FunnelSubStepContextValue>({\n subStepId: '',\n subStepSelector: '',\n subStepNameSelector: '',\n subStepRef: { current: null },\n isNestedSubStep: false,\n mousePressed: { current: false },\n isFocusedSubStep: { current: false },\n focusCleanupFunction: { current: undefined },\n});\n\nexport const FunnelNameSelectorContext = createContext<string | undefined>(undefined);\n"]}
@@ -39,6 +39,7 @@ export declare const useFunnelStep: () => import("../context/analytics-context")
39
39
  export declare const useFunnel: () => {
40
40
  funnelInteractionId: string | undefined;
41
41
  funnelType: import("../interfaces").FunnelType;
42
+ funnelNameSelector: string;
42
43
  optionalStepNumbers: number[];
43
44
  totalFunnelSteps: number;
44
45
  funnelSubmit: () => void;
@@ -1 +1 @@
1
- {"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAmBA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;CA0H5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,qEAGzB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;CASrB,CAAC;AAEF,eAAO,MAAM,qBAAqB,0BAGjC,CAAC"}
1
+ {"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAmBA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;CA0H5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,qEAGzB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;CASrB,CAAC;AAEF,eAAO,MAAM,qBAAqB,0BAGjC,CAAC"}
@@ -1,4 +1,4 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (3f1ffdcb)";
2
+ export var PACKAGE_VERSION = "3.0.0 (7fa1db81)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "components",
3
- "PACKAGE_VERSION": "3.0.0 (3f1ffdcb)",
3
+ "PACKAGE_VERSION": "3.0.0 (7fa1db81)",
4
4
  "THEME": "default",
5
5
  "ALWAYS_VISUAL_REFRESH": false
6
6
  }
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "3f1ffdcb3f6e19899f0534d4f5cd0bf89a469271"
2
+ "commit": "7fa1db81e78164671003df2c78c02d1b865e7011"
3
3
  }
package/package.json CHANGED
@@ -112,7 +112,7 @@
112
112
  "./internal/base-component/index.js",
113
113
  "./internal/base-component/styles.css.js"
114
114
  ],
115
- "version": "3.0.410",
115
+ "version": "3.0.411",
116
116
  "repository": {
117
117
  "type": "git",
118
118
  "url": "https://github.com/cloudscape-design/components.git"
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["wizard/internal.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAWlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAK3C,KAAK,mBAAmB,GAAG,WAAW,GAAG,0BAA0B,CAAC;AAEpE,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,KAAK,EACL,eAAe,EAAE,yBAAyB,EAC1C,gBAAgB,EAChB,iBAAyB,EACzB,WAAmB,EACnB,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eAgJrB"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["wizard/internal.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAWlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAK3C,KAAK,mBAAmB,GAAG,WAAW,GAAG,0BAA0B,CAAC;AAEpE,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,KAAK,EACL,eAAe,EAAE,yBAAyB,EAC1C,gBAAgB,EAChB,iBAAyB,EACzB,WAAmB,EACnB,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eA+IrB"}
@@ -14,7 +14,7 @@ import { useInternalI18n } from '../i18n/context';
14
14
  import { FunnelMetrics } from '../internal/analytics';
15
15
  import { useFunnel } from '../internal/analytics/hooks/use-funnel';
16
16
  import { getNameFromSelector, getSubStepAllSelector } from '../internal/analytics/selectors';
17
- import WizardForm from './wizard-form';
17
+ import WizardForm, { STEP_NAME_SELECTOR } from './wizard-form';
18
18
  import WizardNavigation from './wizard-navigation';
19
19
  import styles from './styles.css.js';
20
20
  import { useFunnelChangeEvent } from './analytics';
@@ -38,14 +38,13 @@ export default function InternalWizard(_a) {
38
38
  const isLastStep = actualActiveStepIndex >= steps.length - 1;
39
39
  const navigationEvent = (requestedStepIndex, reason) => {
40
40
  if (funnelInteractionId) {
41
- const stepNameSelector = `.${styles['form-header-component-wrapper']}`;
42
- const stepName = getNameFromSelector(stepNameSelector);
41
+ const stepName = getNameFromSelector(STEP_NAME_SELECTOR);
43
42
  FunnelMetrics.funnelStepNavigation({
44
43
  navigationType: reason,
45
44
  funnelInteractionId,
46
45
  stepNumber: actualActiveStepIndex + 1,
47
46
  stepName,
48
- stepNameSelector,
47
+ stepNameSelector: STEP_NAME_SELECTOR,
49
48
  destinationStepNumber: requestedStepIndex + 1,
50
49
  subStepAllSelector: getSubStepAllSelector(),
51
50
  });
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["wizard/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nimport { useInternalI18n } from '../i18n/context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport { getNameFromSelector, getSubStepAllSelector } from '../internal/analytics/selectors';\n\nimport WizardForm from './wizard-form';\nimport WizardNavigation from './wizard-navigation';\n\nimport { WizardProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport { useFunnelChangeEvent } from './analytics';\n\ntype InternalWizardProps = WizardProps & InternalBaseComponentProps;\n\nexport default function InternalWizard({\n steps,\n activeStepIndex: controlledActiveStepIndex,\n submitButtonText,\n isLoadingNextStep = false,\n allowSkipTo = false,\n secondaryActions,\n onCancel,\n onSubmit,\n onNavigate,\n __internalRootRef,\n ...rest\n}: InternalWizardProps) {\n const baseProps = getBaseProps(rest);\n\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n const ref = useMergeRefs(breakpointsRef, __internalRootRef);\n\n const smallContainer = breakpoint === 'default';\n\n const [activeStepIndex, setActiveStepIndex] = useControllable(controlledActiveStepIndex, onNavigate, 0, {\n componentName: 'Wizard',\n controlledProp: 'activeStepIndex',\n changeHandler: 'onNavigate',\n });\n const { funnelInteractionId, funnelSubmit, funnelCancel, funnelProps, funnelNextOrSubmitAttempt } = useFunnel();\n const actualActiveStepIndex = activeStepIndex ? Math.min(activeStepIndex, steps.length - 1) : 0;\n\n const farthestStepIndex = useRef<number>(actualActiveStepIndex);\n farthestStepIndex.current = Math.max(farthestStepIndex.current, actualActiveStepIndex);\n\n const isVisualRefresh = useVisualRefresh();\n const isLastStep = actualActiveStepIndex >= steps.length - 1;\n\n const navigationEvent = (requestedStepIndex: number, reason: WizardProps.NavigationReason) => {\n if (funnelInteractionId) {\n const stepNameSelector = `.${styles['form-header-component-wrapper']}`;\n const stepName = getNameFromSelector(stepNameSelector);\n\n FunnelMetrics.funnelStepNavigation({\n navigationType: reason,\n funnelInteractionId,\n stepNumber: actualActiveStepIndex + 1,\n stepName,\n stepNameSelector,\n destinationStepNumber: requestedStepIndex + 1,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n setActiveStepIndex(requestedStepIndex);\n fireNonCancelableEvent(onNavigate, { requestedStepIndex, reason });\n };\n const onStepClick = (stepIndex: number) => navigationEvent(stepIndex, 'step');\n const onSkipToClick = (stepIndex: number) => navigationEvent(stepIndex, 'skip');\n const onCancelClick = () => {\n funnelCancel();\n fireNonCancelableEvent(onCancel);\n };\n const onPreviousClick = () => navigationEvent(actualActiveStepIndex - 1, 'previous');\n const onPrimaryClick = () => {\n funnelNextOrSubmitAttempt();\n\n if (isLastStep) {\n funnelSubmit();\n fireNonCancelableEvent(onSubmit);\n } else {\n navigationEvent(actualActiveStepIndex + 1, 'next');\n }\n };\n\n useFunnelChangeEvent(funnelInteractionId, steps);\n\n const i18n = useInternalI18n('wizard');\n const skipToButtonLabel = i18n(\n 'i18nStrings.skipToButtonLabel',\n rest.i18nStrings?.skipToButtonLabel,\n format => task => format({ task__title: task.title })\n );\n\n const i18nStrings: WizardProps.I18nStrings = {\n ...rest.i18nStrings,\n skipToButtonLabel,\n stepNumberLabel: i18n(\n 'i18nStrings.stepNumberLabel',\n rest.i18nStrings?.stepNumberLabel,\n format => stepNumber => format({ stepNumber })\n ),\n collapsedStepsLabel: i18n(\n 'i18nStrings.collapsedStepsLabel',\n rest.i18nStrings?.collapsedStepsLabel,\n format => (stepNumber, stepsCount) => format({ stepNumber, stepsCount })\n ),\n navigationAriaLabel: i18n('i18nStrings.navigationAriaLabel', rest.i18nStrings?.navigationAriaLabel),\n cancelButton: i18n('i18nStrings.cancelButton', rest.i18nStrings?.cancelButton),\n previousButton: i18n('i18nStrings.previousButton', rest.i18nStrings?.previousButton),\n nextButton: i18n('i18nStrings.nextButton', rest.i18nStrings?.nextButton),\n optional: i18n('i18nStrings.optional', rest.i18nStrings?.optional),\n };\n\n if (activeStepIndex && activeStepIndex >= steps.length) {\n warnOnce(\n 'Wizard',\n `You have set \\`activeStepIndex\\` to ${activeStepIndex} but you have provided only ${\n steps.length\n } steps. Its value is ignored and the component uses ${steps.length - 1} instead.`\n );\n }\n\n if (allowSkipTo && !skipToButtonLabel) {\n warnOnce(\n 'Wizard',\n `You have set \\`allowSkipTo\\` but you have not provided \\`i18nStrings.skipToButtonLabel\\`. The skip-to button will not be rendered.`\n );\n }\n\n return (\n <div {...baseProps} {...funnelProps} ref={ref} className={clsx(styles.root, baseProps.className)}>\n <div\n className={clsx(styles.wizard, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardNavigation\n activeStepIndex={actualActiveStepIndex}\n farthestStepIndex={farthestStepIndex.current}\n allowSkipTo={allowSkipTo}\n hidden={smallContainer}\n i18nStrings={i18nStrings}\n isVisualRefresh={isVisualRefresh}\n isLoadingNextStep={isLoadingNextStep}\n onStepClick={onStepClick}\n onSkipToClick={onSkipToClick}\n steps={steps}\n />\n <div\n className={clsx(styles.form, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n {isVisualRefresh && <div className={clsx(styles.background, 'awsui-context-content-header')} />}\n <WizardForm\n steps={steps}\n isVisualRefresh={isVisualRefresh}\n showCollapsedSteps={smallContainer}\n i18nStrings={i18nStrings}\n submitButtonText={submitButtonText}\n activeStepIndex={actualActiveStepIndex}\n isPrimaryLoading={isLoadingNextStep}\n allowSkipTo={allowSkipTo}\n secondaryActions={secondaryActions}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onSkipToClick={onSkipToClick}\n onPrimaryClick={onPrimaryClick}\n />\n </div>\n </div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["wizard/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nimport { useInternalI18n } from '../i18n/context';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport { getNameFromSelector, getSubStepAllSelector } from '../internal/analytics/selectors';\n\nimport WizardForm, { STEP_NAME_SELECTOR } from './wizard-form';\nimport WizardNavigation from './wizard-navigation';\n\nimport { WizardProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport { useFunnelChangeEvent } from './analytics';\n\ntype InternalWizardProps = WizardProps & InternalBaseComponentProps;\n\nexport default function InternalWizard({\n steps,\n activeStepIndex: controlledActiveStepIndex,\n submitButtonText,\n isLoadingNextStep = false,\n allowSkipTo = false,\n secondaryActions,\n onCancel,\n onSubmit,\n onNavigate,\n __internalRootRef,\n ...rest\n}: InternalWizardProps) {\n const baseProps = getBaseProps(rest);\n\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n const ref = useMergeRefs(breakpointsRef, __internalRootRef);\n\n const smallContainer = breakpoint === 'default';\n\n const [activeStepIndex, setActiveStepIndex] = useControllable(controlledActiveStepIndex, onNavigate, 0, {\n componentName: 'Wizard',\n controlledProp: 'activeStepIndex',\n changeHandler: 'onNavigate',\n });\n const { funnelInteractionId, funnelSubmit, funnelCancel, funnelProps, funnelNextOrSubmitAttempt } = useFunnel();\n const actualActiveStepIndex = activeStepIndex ? Math.min(activeStepIndex, steps.length - 1) : 0;\n\n const farthestStepIndex = useRef<number>(actualActiveStepIndex);\n farthestStepIndex.current = Math.max(farthestStepIndex.current, actualActiveStepIndex);\n\n const isVisualRefresh = useVisualRefresh();\n const isLastStep = actualActiveStepIndex >= steps.length - 1;\n\n const navigationEvent = (requestedStepIndex: number, reason: WizardProps.NavigationReason) => {\n if (funnelInteractionId) {\n const stepName = getNameFromSelector(STEP_NAME_SELECTOR);\n\n FunnelMetrics.funnelStepNavigation({\n navigationType: reason,\n funnelInteractionId,\n stepNumber: actualActiveStepIndex + 1,\n stepName,\n stepNameSelector: STEP_NAME_SELECTOR,\n destinationStepNumber: requestedStepIndex + 1,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n setActiveStepIndex(requestedStepIndex);\n fireNonCancelableEvent(onNavigate, { requestedStepIndex, reason });\n };\n const onStepClick = (stepIndex: number) => navigationEvent(stepIndex, 'step');\n const onSkipToClick = (stepIndex: number) => navigationEvent(stepIndex, 'skip');\n const onCancelClick = () => {\n funnelCancel();\n fireNonCancelableEvent(onCancel);\n };\n const onPreviousClick = () => navigationEvent(actualActiveStepIndex - 1, 'previous');\n const onPrimaryClick = () => {\n funnelNextOrSubmitAttempt();\n\n if (isLastStep) {\n funnelSubmit();\n fireNonCancelableEvent(onSubmit);\n } else {\n navigationEvent(actualActiveStepIndex + 1, 'next');\n }\n };\n\n useFunnelChangeEvent(funnelInteractionId, steps);\n\n const i18n = useInternalI18n('wizard');\n const skipToButtonLabel = i18n(\n 'i18nStrings.skipToButtonLabel',\n rest.i18nStrings?.skipToButtonLabel,\n format => task => format({ task__title: task.title })\n );\n\n const i18nStrings: WizardProps.I18nStrings = {\n ...rest.i18nStrings,\n skipToButtonLabel,\n stepNumberLabel: i18n(\n 'i18nStrings.stepNumberLabel',\n rest.i18nStrings?.stepNumberLabel,\n format => stepNumber => format({ stepNumber })\n ),\n collapsedStepsLabel: i18n(\n 'i18nStrings.collapsedStepsLabel',\n rest.i18nStrings?.collapsedStepsLabel,\n format => (stepNumber, stepsCount) => format({ stepNumber, stepsCount })\n ),\n navigationAriaLabel: i18n('i18nStrings.navigationAriaLabel', rest.i18nStrings?.navigationAriaLabel),\n cancelButton: i18n('i18nStrings.cancelButton', rest.i18nStrings?.cancelButton),\n previousButton: i18n('i18nStrings.previousButton', rest.i18nStrings?.previousButton),\n nextButton: i18n('i18nStrings.nextButton', rest.i18nStrings?.nextButton),\n optional: i18n('i18nStrings.optional', rest.i18nStrings?.optional),\n };\n\n if (activeStepIndex && activeStepIndex >= steps.length) {\n warnOnce(\n 'Wizard',\n `You have set \\`activeStepIndex\\` to ${activeStepIndex} but you have provided only ${\n steps.length\n } steps. Its value is ignored and the component uses ${steps.length - 1} instead.`\n );\n }\n\n if (allowSkipTo && !skipToButtonLabel) {\n warnOnce(\n 'Wizard',\n `You have set \\`allowSkipTo\\` but you have not provided \\`i18nStrings.skipToButtonLabel\\`. The skip-to button will not be rendered.`\n );\n }\n\n return (\n <div {...baseProps} {...funnelProps} ref={ref} className={clsx(styles.root, baseProps.className)}>\n <div\n className={clsx(styles.wizard, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n <WizardNavigation\n activeStepIndex={actualActiveStepIndex}\n farthestStepIndex={farthestStepIndex.current}\n allowSkipTo={allowSkipTo}\n hidden={smallContainer}\n i18nStrings={i18nStrings}\n isVisualRefresh={isVisualRefresh}\n isLoadingNextStep={isLoadingNextStep}\n onStepClick={onStepClick}\n onSkipToClick={onSkipToClick}\n steps={steps}\n />\n <div\n className={clsx(styles.form, isVisualRefresh && styles.refresh, smallContainer && styles['small-container'])}\n >\n {isVisualRefresh && <div className={clsx(styles.background, 'awsui-context-content-header')} />}\n <WizardForm\n steps={steps}\n isVisualRefresh={isVisualRefresh}\n showCollapsedSteps={smallContainer}\n i18nStrings={i18nStrings}\n submitButtonText={submitButtonText}\n activeStepIndex={actualActiveStepIndex}\n isPrimaryLoading={isLoadingNextStep}\n allowSkipTo={allowSkipTo}\n secondaryActions={secondaryActions}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onSkipToClick={onSkipToClick}\n onPrimaryClick={onPrimaryClick}\n />\n </div>\n </div>\n </div>\n );\n}\n"]}
@@ -15,6 +15,7 @@ interface WizardFormProps {
15
15
  onPrimaryClick: () => void;
16
16
  onSkipToClick: (stepIndex: number) => void;
17
17
  }
18
+ export declare const STEP_NAME_SELECTOR: string;
18
19
  export default function WizardForm({ steps, activeStepIndex, isVisualRefresh, showCollapsedSteps, i18nStrings, submitButtonText, isPrimaryLoading, allowSkipTo, secondaryActions, onCancelClick, onPreviousClick, onPrimaryClick, onSkipToClick, }: WizardFormProps): JSX.Element;
19
20
  export {};
20
21
  //# sourceMappingURL=wizard-form.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"wizard-form.d.ts","sourceRoot":"lib/default/","sources":["wizard/wizard-form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAO3C,UAAU,eAAe;IACvB,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACvC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,eAAe,EACf,cAAc,EACd,aAAa,GACd,EAAE,eAAe,eAiFjB"}
1
+ {"version":3,"file":"wizard-form.d.ts","sourceRoot":"lib/default/","sources":["wizard/wizard-form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAO3C,UAAU,eAAe;IACvB,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACvC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,eAAO,MAAM,kBAAkB,QAAsD,CAAC;AAEtF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,eAAe,EACf,cAAc,EACd,aAAa,GACd,EAAE,eAAe,eAyEjB"}
@@ -11,6 +11,7 @@ import styles from './styles.css.js';
11
11
  import { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';
12
12
  import { AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';
13
13
  import { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_STEP_NAME } from '../internal/analytics/selectors';
14
+ export const STEP_NAME_SELECTOR = `[${DATA_ATTR_FUNNEL_KEY}=${FUNNEL_KEY_STEP_NAME}]`;
14
15
  export default function WizardForm({ steps, activeStepIndex, isVisualRefresh, showCollapsedSteps, i18nStrings, submitButtonText, isPrimaryLoading, allowSkipTo, secondaryActions, onCancelClick, onPreviousClick, onPrimaryClick, onSkipToClick, }) {
15
16
  const { title, info, description, content, errorText, isOptional } = steps[activeStepIndex] || {};
16
17
  const isLastStep = activeStepIndex >= steps.length - 1;
@@ -28,14 +29,14 @@ export default function WizardForm({ steps, activeStepIndex, isVisualRefresh, sh
28
29
  ? i18nStrings.skipToButtonLabel(steps[skipToTargetIndex], skipToTargetIndex + 1)
29
30
  : undefined;
30
31
  return (React.createElement(React.Fragment, null,
31
- React.createElement(AnalyticsFunnelStep, { stepNameSelector: `.${styles['form-header-component-wrapper']}`, stepNumber: activeStepIndex + 1 }, ({ funnelStepProps }) => {
32
+ React.createElement(AnalyticsFunnelStep, { stepNameSelector: STEP_NAME_SELECTOR, stepNumber: activeStepIndex + 1 }, ({ funnelStepProps }) => {
32
33
  var _a;
33
34
  return (React.createElement(React.Fragment, null,
34
35
  React.createElement(WizardFormHeader, { isMobile: isMobile || showCollapsedSteps, isVisualRefresh: isVisualRefresh },
35
36
  React.createElement("div", { className: clsx(styles['collapsed-steps'], !showCollapsedSteps && styles['collapsed-steps-hidden']) }, (_a = i18nStrings.collapsedStepsLabel) === null || _a === void 0 ? void 0 : _a.call(i18nStrings, activeStepIndex + 1, steps.length)),
36
37
  React.createElement(InternalHeader, { className: styles['form-header-component'], variant: "h1", description: description, info: info },
37
- React.createElement("span", Object.assign({}, { [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_STEP_NAME }, { className: styles['form-header-component-wrapper'], tabIndex: -1, ref: stepHeaderRef }),
38
- title,
38
+ React.createElement("span", { className: styles['form-header-component-wrapper'], tabIndex: -1, ref: stepHeaderRef },
39
+ React.createElement("span", Object.assign({}, { [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_STEP_NAME }), title),
39
40
  isOptional && React.createElement("i", null, ` - ${i18nStrings.optional}`)))),
40
41
  React.createElement(InternalForm, Object.assign({ className: clsx(styles['form-component']), actions: React.createElement(WizardActions, { cancelButtonText: i18nStrings.cancelButton, primaryButtonText: isLastStep ? submitButtonText !== null && submitButtonText !== void 0 ? submitButtonText : i18nStrings.submitButton : i18nStrings.nextButton, primaryButtonLoadingText: isLastStep ? i18nStrings.submitButtonLoadingAnnouncement : i18nStrings.nextButtonLoadingAnnouncement, previousButtonText: i18nStrings.previousButton, onCancelClick: onCancelClick, onPreviousClick: onPreviousClick, onPrimaryClick: onPrimaryClick, onSkipToClick: () => onSkipToClick(skipToTargetIndex), showPrevious: activeStepIndex !== 0, isPrimaryLoading: isPrimaryLoading, showSkipTo: showSkipTo, skipToButtonText: skipToButtonText }), secondaryActions: secondaryActions, errorText: errorText, errorIconAriaLabel: i18nStrings.errorIconAriaLabel }, funnelStepProps), content)));
41
42
  })));
@@ -1 +1 @@
1
- {"version":3,"file":"wizard-form.js","sourceRoot":"lib/default/","sources":["wizard/wizard-form.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport InternalForm from '../form/internal';\nimport InternalHeader from '../header/internal';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport WizardActions from './wizard-actions';\nimport { WizardProps } from './interfaces';\nimport WizardFormHeader from './wizard-form-header';\nimport styles from './styles.css.js';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\nimport { AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_STEP_NAME } from '../internal/analytics/selectors';\n\ninterface WizardFormProps {\n steps: ReadonlyArray<WizardProps.Step>;\n activeStepIndex: number;\n isVisualRefresh: boolean;\n showCollapsedSteps: boolean;\n i18nStrings: WizardProps.I18nStrings;\n submitButtonText?: string;\n isPrimaryLoading: boolean;\n allowSkipTo: boolean;\n secondaryActions?: React.ReactNode;\n onCancelClick: () => void;\n onPreviousClick: () => void;\n onPrimaryClick: () => void;\n onSkipToClick: (stepIndex: number) => void;\n}\n\nexport default function WizardForm({\n steps,\n activeStepIndex,\n isVisualRefresh,\n showCollapsedSteps,\n i18nStrings,\n submitButtonText,\n isPrimaryLoading,\n allowSkipTo,\n secondaryActions,\n onCancelClick,\n onPreviousClick,\n onPrimaryClick,\n onSkipToClick,\n}: WizardFormProps) {\n const { title, info, description, content, errorText, isOptional } = steps[activeStepIndex] || {};\n const isLastStep = activeStepIndex >= steps.length - 1;\n const skipToTargetIndex = findSkipToTargetIndex(steps, activeStepIndex);\n const isMobile = useMobile();\n const stepHeaderRef = useRef<HTMLDivElement | null>(null);\n\n useEffectOnUpdate(() => {\n if (stepHeaderRef && stepHeaderRef.current) {\n stepHeaderRef.current?.focus();\n }\n }, [activeStepIndex]);\n\n const showSkipTo = allowSkipTo && skipToTargetIndex !== -1;\n const skipToButtonText =\n skipToTargetIndex !== -1 && i18nStrings.skipToButtonLabel\n ? i18nStrings.skipToButtonLabel(steps[skipToTargetIndex], skipToTargetIndex + 1)\n : undefined;\n\n return (\n <>\n <AnalyticsFunnelStep\n stepNameSelector={`.${styles['form-header-component-wrapper']}`}\n stepNumber={activeStepIndex + 1}\n >\n {({ funnelStepProps }) => (\n <>\n <WizardFormHeader isMobile={isMobile || showCollapsedSteps} isVisualRefresh={isVisualRefresh}>\n <div className={clsx(styles['collapsed-steps'], !showCollapsedSteps && styles['collapsed-steps-hidden'])}>\n {i18nStrings.collapsedStepsLabel?.(activeStepIndex + 1, steps.length)}\n </div>\n <InternalHeader\n className={styles['form-header-component']}\n variant=\"h1\"\n description={description}\n info={info}\n >\n <span\n {...{ [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_STEP_NAME }}\n className={styles['form-header-component-wrapper']}\n tabIndex={-1}\n ref={stepHeaderRef}\n >\n {title}\n {isOptional && <i>{` - ${i18nStrings.optional}`}</i>}\n </span>\n </InternalHeader>\n </WizardFormHeader>\n\n <InternalForm\n className={clsx(styles['form-component'])}\n actions={\n <WizardActions\n cancelButtonText={i18nStrings.cancelButton}\n primaryButtonText={isLastStep ? submitButtonText ?? i18nStrings.submitButton : i18nStrings.nextButton}\n primaryButtonLoadingText={\n isLastStep ? i18nStrings.submitButtonLoadingAnnouncement : i18nStrings.nextButtonLoadingAnnouncement\n }\n previousButtonText={i18nStrings.previousButton}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onPrimaryClick={onPrimaryClick}\n onSkipToClick={() => onSkipToClick(skipToTargetIndex)}\n showPrevious={activeStepIndex !== 0}\n isPrimaryLoading={isPrimaryLoading}\n showSkipTo={showSkipTo}\n skipToButtonText={skipToButtonText}\n />\n }\n secondaryActions={secondaryActions}\n errorText={errorText}\n errorIconAriaLabel={i18nStrings.errorIconAriaLabel}\n {...funnelStepProps}\n >\n {content}\n </InternalForm>\n </>\n )}\n </AnalyticsFunnelStep>\n </>\n );\n}\n\nfunction findSkipToTargetIndex(steps: ReadonlyArray<WizardProps.Step>, activeStepIndex: number): number {\n let nextRequiredStepIndex = activeStepIndex;\n do {\n nextRequiredStepIndex++;\n } while (nextRequiredStepIndex < steps.length - 1 && steps[nextRequiredStepIndex].isOptional);\n\n return nextRequiredStepIndex > activeStepIndex + 1 ? nextRequiredStepIndex : -1;\n}\n"]}
1
+ {"version":3,"file":"wizard-form.js","sourceRoot":"lib/default/","sources":["wizard/wizard-form.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport InternalForm from '../form/internal';\nimport InternalHeader from '../header/internal';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport WizardActions from './wizard-actions';\nimport { WizardProps } from './interfaces';\nimport WizardFormHeader from './wizard-form-header';\nimport styles from './styles.css.js';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\nimport { AnalyticsFunnelStep } from '../internal/analytics/components/analytics-funnel';\nimport { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_STEP_NAME } from '../internal/analytics/selectors';\n\ninterface WizardFormProps {\n steps: ReadonlyArray<WizardProps.Step>;\n activeStepIndex: number;\n isVisualRefresh: boolean;\n showCollapsedSteps: boolean;\n i18nStrings: WizardProps.I18nStrings;\n submitButtonText?: string;\n isPrimaryLoading: boolean;\n allowSkipTo: boolean;\n secondaryActions?: React.ReactNode;\n onCancelClick: () => void;\n onPreviousClick: () => void;\n onPrimaryClick: () => void;\n onSkipToClick: (stepIndex: number) => void;\n}\n\nexport const STEP_NAME_SELECTOR = `[${DATA_ATTR_FUNNEL_KEY}=${FUNNEL_KEY_STEP_NAME}]`;\n\nexport default function WizardForm({\n steps,\n activeStepIndex,\n isVisualRefresh,\n showCollapsedSteps,\n i18nStrings,\n submitButtonText,\n isPrimaryLoading,\n allowSkipTo,\n secondaryActions,\n onCancelClick,\n onPreviousClick,\n onPrimaryClick,\n onSkipToClick,\n}: WizardFormProps) {\n const { title, info, description, content, errorText, isOptional } = steps[activeStepIndex] || {};\n const isLastStep = activeStepIndex >= steps.length - 1;\n const skipToTargetIndex = findSkipToTargetIndex(steps, activeStepIndex);\n const isMobile = useMobile();\n const stepHeaderRef = useRef<HTMLDivElement | null>(null);\n\n useEffectOnUpdate(() => {\n if (stepHeaderRef && stepHeaderRef.current) {\n stepHeaderRef.current?.focus();\n }\n }, [activeStepIndex]);\n\n const showSkipTo = allowSkipTo && skipToTargetIndex !== -1;\n const skipToButtonText =\n skipToTargetIndex !== -1 && i18nStrings.skipToButtonLabel\n ? i18nStrings.skipToButtonLabel(steps[skipToTargetIndex], skipToTargetIndex + 1)\n : undefined;\n\n return (\n <>\n <AnalyticsFunnelStep stepNameSelector={STEP_NAME_SELECTOR} stepNumber={activeStepIndex + 1}>\n {({ funnelStepProps }) => (\n <>\n <WizardFormHeader isMobile={isMobile || showCollapsedSteps} isVisualRefresh={isVisualRefresh}>\n <div className={clsx(styles['collapsed-steps'], !showCollapsedSteps && styles['collapsed-steps-hidden'])}>\n {i18nStrings.collapsedStepsLabel?.(activeStepIndex + 1, steps.length)}\n </div>\n <InternalHeader\n className={styles['form-header-component']}\n variant=\"h1\"\n description={description}\n info={info}\n >\n <span className={styles['form-header-component-wrapper']} tabIndex={-1} ref={stepHeaderRef}>\n <span {...{ [DATA_ATTR_FUNNEL_KEY]: FUNNEL_KEY_STEP_NAME }}>{title}</span>\n {isOptional && <i>{` - ${i18nStrings.optional}`}</i>}\n </span>\n </InternalHeader>\n </WizardFormHeader>\n\n <InternalForm\n className={clsx(styles['form-component'])}\n actions={\n <WizardActions\n cancelButtonText={i18nStrings.cancelButton}\n primaryButtonText={isLastStep ? submitButtonText ?? i18nStrings.submitButton : i18nStrings.nextButton}\n primaryButtonLoadingText={\n isLastStep ? i18nStrings.submitButtonLoadingAnnouncement : i18nStrings.nextButtonLoadingAnnouncement\n }\n previousButtonText={i18nStrings.previousButton}\n onCancelClick={onCancelClick}\n onPreviousClick={onPreviousClick}\n onPrimaryClick={onPrimaryClick}\n onSkipToClick={() => onSkipToClick(skipToTargetIndex)}\n showPrevious={activeStepIndex !== 0}\n isPrimaryLoading={isPrimaryLoading}\n showSkipTo={showSkipTo}\n skipToButtonText={skipToButtonText}\n />\n }\n secondaryActions={secondaryActions}\n errorText={errorText}\n errorIconAriaLabel={i18nStrings.errorIconAriaLabel}\n {...funnelStepProps}\n >\n {content}\n </InternalForm>\n </>\n )}\n </AnalyticsFunnelStep>\n </>\n );\n}\n\nfunction findSkipToTargetIndex(steps: ReadonlyArray<WizardProps.Step>, activeStepIndex: number): number {\n let nextRequiredStepIndex = activeStepIndex;\n do {\n nextRequiredStepIndex++;\n } while (nextRequiredStepIndex < steps.length - 1 && steps[nextRequiredStepIndex].isOptional);\n\n return nextRequiredStepIndex > activeStepIndex + 1 ? nextRequiredStepIndex : -1;\n}\n"]}