@cloudscape-design/components-themeable 3.0.976 → 3.0.977

package/lib/internal/template/form-field/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalGrid from '../grid/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\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  getSubStepAllSelector,\n  getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { joinStrings } from '../internal/utils/strings';\nimport InternalLiveRegion from '../live-region/internal';\nimport { InternalFormFieldProps } from './interfaces';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface FormFieldErrorProps {\n  id?: string;\n  children?: React.ReactNode;\n  errorIconAriaLabel?: string;\n}\n\ninterface FormFieldWarningProps {\n  id?: string;\n  children?: React.ReactNode;\n  warningIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n  const i18n = useInternalI18n('form-field');\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const i18nErrorIconAriaLabel = i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel);\n\n  return (\n    <>\n      <div id={id} className={styles.error}>\n        <div className={styles['error-icon-shake-wrapper']}>\n          <div className={styles['error-icon-scale-wrapper']}>\n            <InternalIcon name=\"status-negative\" size=\"small\" ariaLabel={i18nErrorIconAriaLabel} />\n          </div>\n        </div>\n        <span className={styles.error__message} ref={contentRef}>\n          {children}\n        </span>\n      </div>\n\n      <InternalLiveRegion assertive={true} tagName=\"span\" sources={[i18nErrorIconAriaLabel, contentRef]} />\n    </>\n  );\n}\n\nexport function FormFieldWarning({ id, children, warningIconAriaLabel }: FormFieldWarningProps) {\n  const i18n = useInternalI18n('form-field');\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const i18nWarningIconAriaLabel = i18n('i18nStrings.warningIconAriaLabel', warningIconAriaLabel);\n\n  return (\n    <>\n      <div id={id} className={styles.warning}>\n        <div className={styles['warning-icon-shake-wrapper']}>\n          <div className={styles['warning-icon-scale-wrapper']}>\n            <InternalIcon name=\"status-warning\" size=\"small\" ariaLabel={i18nWarningIconAriaLabel} />\n          </div>\n        </div>\n        <span className={styles.warning__message} ref={contentRef}>\n          {children}\n        </span>\n      </div>\n\n      <InternalLiveRegion assertive={true} tagName=\"span\" sources={[i18nWarningIconAriaLabel, contentRef]} />\n    </>\n  );\n}\n\nexport function ConstraintText({\n  id,\n  hasValidationText,\n  children,\n}: {\n  id?: string;\n  hasValidationText: boolean;\n  children: React.ReactNode;\n}) {\n  return (\n    <div id={id} className={clsx(styles.constraint, hasValidationText && styles['constraint-has-validation-text'])}>\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  warningText,\n  __hideLabel,\n  __internalRootRef = null,\n  __disableGutters = false,\n  __analyticsMetadata = undefined,\n  __style = {},\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 { funnelIdentifier, funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n  const { stepIdentifier, stepNumber, stepNameSelector } = useFunnelStep();\n  const { subStepErrorContext, subStepIdentifier, subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n  const showWarning = warningText && !errorText;\n\n  if (warningText && errorText) {\n    warnOnce('FileUpload', 'Both `errorText` and `warningText` exist. `warningText` will not be shown.');\n  }\n\n  const slotIds = getSlotIds(\n    formFieldId,\n    label,\n    description,\n    constraintText,\n    errorText,\n    showWarning ? warningText : undefined\n  );\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    warning: parentWarning,\n  } = useFormFieldContext({});\n\n  const contextValuesWithoutControlId = {\n    ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n    ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n    invalid: !!errorText || !!parentInvalid,\n    warning: (!!warningText && !errorText) || (!!parentWarning && !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 = getTextFromSelector(stepNameSelector);\n      const subStepName = getTextFromSelector(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          funnelIdentifier,\n          subStepSelector,\n          subStepName,\n          subStepNameSelector,\n          subStepIdentifier,\n          stepNumber,\n          stepName,\n          stepNameSelector,\n          stepIdentifier,\n          subStepErrorContext,\n          fieldErrorSelector: `${getFieldSlotSeletor(slotIds.error)} .${styles.error__message}`,\n          fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n          subStepAllSelector: getSubStepAllSelector(),\n          fieldIdentifier: __analyticsMetadata?.instanceIdentifier,\n          fieldErrorContext: __analyticsMetadata?.errorContext,\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      style={__style}\n      ref={__internalRootRef}\n      {...analyticsAttributes}\n      {...copyAnalyticsMetadataAttribute(rest)}\n    >\n      <div className={clsx(styles['label-wrapper'], __hideLabel && styles['visually-hidden'])}>\n        {label && (\n          <label\n            className={clsx(styles.label, analyticsSelectors.label)}\n            id={slotIds.label}\n            htmlFor={generatedControlId}\n          >\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 || warningText) && (\n        <div className={styles.hints}>\n          {errorText && (\n            <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n              {errorText}\n            </FormFieldError>\n          )}\n          {showWarning && (\n            <FormFieldWarning id={slotIds.warning} warningIconAriaLabel={i18nStrings?.warningIconAriaLabel}>\n              {warningText}\n            </FormFieldWarning>\n          )}\n          {constraintText && (\n            <ConstraintText id={slotIds.constraint} hasValidationText={!!errorText || !!warningText}>\n              {constraintText}\n            </ConstraintText>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalGrid from '../grid/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\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  getSubStepAllSelector,\n  getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport { FormFieldContext, useFormFieldContext } from '../internal/context/form-field-context';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { joinStrings } from '../internal/utils/strings';\nimport InternalLiveRegion from '../live-region/internal';\nimport { InternalFormFieldProps } from './interfaces';\nimport { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface FormFieldErrorProps {\n  id?: string;\n  children?: React.ReactNode;\n  errorIconAriaLabel?: string;\n}\n\ninterface FormFieldWarningProps {\n  id?: string;\n  children?: React.ReactNode;\n  warningIconAriaLabel?: string;\n}\n\nexport function FormFieldError({ id, children, errorIconAriaLabel }: FormFieldErrorProps) {\n  const i18n = useInternalI18n('form-field');\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const i18nErrorIconAriaLabel = i18n('i18nStrings.errorIconAriaLabel', errorIconAriaLabel);\n\n  return (\n    <>\n      <div id={id} className={styles.error}>\n        <div className={styles['error-icon-shake-wrapper']}>\n          <div className={styles['error-icon-scale-wrapper']}>\n            <InternalIcon name=\"status-negative\" size=\"small\" ariaLabel={i18nErrorIconAriaLabel} />\n          </div>\n        </div>\n        <span className={styles.error__message} ref={contentRef}>\n          {children}\n        </span>\n      </div>\n\n      <InternalLiveRegion assertive={true} tagName=\"span\" sources={[i18nErrorIconAriaLabel, contentRef]} />\n    </>\n  );\n}\n\nexport function FormFieldWarning({ id, children, warningIconAriaLabel }: FormFieldWarningProps) {\n  const i18n = useInternalI18n('form-field');\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const i18nWarningIconAriaLabel = i18n('i18nStrings.warningIconAriaLabel', warningIconAriaLabel);\n\n  return (\n    <>\n      <div id={id} className={styles.warning}>\n        <div className={styles['warning-icon-shake-wrapper']}>\n          <div className={styles['warning-icon-scale-wrapper']}>\n            <InternalIcon name=\"status-warning\" size=\"small\" ariaLabel={i18nWarningIconAriaLabel} />\n          </div>\n        </div>\n        <span className={styles.warning__message} ref={contentRef}>\n          {children}\n        </span>\n      </div>\n\n      <InternalLiveRegion assertive={true} tagName=\"span\" sources={[i18nWarningIconAriaLabel, contentRef]} />\n    </>\n  );\n}\n\nexport function ConstraintText({\n  id,\n  hasValidationText,\n  children,\n}: {\n  id?: string;\n  hasValidationText: boolean;\n  children: React.ReactNode;\n}) {\n  return (\n    <div id={id} className={clsx(styles.constraint, hasValidationText && styles['constraint-has-validation-text'])}>\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  warningText,\n  __hideLabel,\n  __internalRootRef = null,\n  __disableGutters = false,\n  __analyticsMetadata = undefined,\n  __style = {},\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 { funnelIdentifier, funnelInteractionId, submissionAttempt, funnelState, errorCount } = useFunnel();\n  const { stepIdentifier, stepNumber, stepNameSelector } = useFunnelStep();\n  const { subStepIdentifier, subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n  const showWarning = warningText && !errorText;\n\n  if (warningText && errorText) {\n    warnOnce('FileUpload', 'Both `errorText` and `warningText` exist. `warningText` will not be shown.');\n  }\n\n  const slotIds = getSlotIds(\n    formFieldId,\n    label,\n    description,\n    constraintText,\n    errorText,\n    showWarning ? warningText : undefined\n  );\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    warning: parentWarning,\n  } = useFormFieldContext({});\n\n  const contextValuesWithoutControlId = {\n    ariaLabelledby: joinStrings(parentAriaLabelledby, slotIds.label) || undefined,\n    ariaDescribedby: joinStrings(parentAriaDescribedby, ariaDescribedBy) || undefined,\n    invalid: !!errorText || !!parentInvalid,\n    warning: (!!warningText && !errorText) || (!!parentWarning && !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 = getTextFromSelector(stepNameSelector);\n      const subStepName = getTextFromSelector(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          funnelIdentifier,\n          subStepSelector,\n          subStepName,\n          subStepNameSelector,\n          subStepIdentifier,\n          stepNumber,\n          stepName,\n          stepNameSelector,\n          stepIdentifier,\n          fieldErrorSelector: `${getFieldSlotSeletor(slotIds.error)} .${styles.error__message}`,\n          fieldLabelSelector: getFieldSlotSeletor(slotIds.label),\n          subStepAllSelector: getSubStepAllSelector(),\n          fieldIdentifier: __analyticsMetadata?.instanceIdentifier,\n          errorContext: __analyticsMetadata?.errorContext,\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      style={__style}\n      ref={__internalRootRef}\n      {...analyticsAttributes}\n      {...copyAnalyticsMetadataAttribute(rest)}\n    >\n      <div className={clsx(styles['label-wrapper'], __hideLabel && styles['visually-hidden'])}>\n        {label && (\n          <label\n            className={clsx(styles.label, analyticsSelectors.label)}\n            id={slotIds.label}\n            htmlFor={generatedControlId}\n          >\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 || warningText) && (\n        <div className={styles.hints}>\n          {errorText && (\n            <FormFieldError id={slotIds.error} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n              {errorText}\n            </FormFieldError>\n          )}\n          {showWarning && (\n            <FormFieldWarning id={slotIds.warning} warningIconAriaLabel={i18nStrings?.warningIconAriaLabel}>\n              {warningText}\n            </FormFieldWarning>\n          )}\n          {constraintText && (\n            <ConstraintText id={slotIds.constraint} hasValidationText={!!errorText || !!warningText}>\n              {constraintText}\n            </ConstraintText>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}

package/lib/internal/template/internal/analytics/hooks/use-funnel.d.ts

@@ -12,7 +12,7 @@ import { FunnelContextValue } from '../context/analytics-context';
  */
 export declare const useFunnelSubStep: () => import("../context/analytics-context").FunnelSubStepContextValue | {
     subStepIdentifier?: string | undefined;
-    subStepErrorContext?: string | undefined;
+    subStepErrorContext?: import("../interfaces").ErrorContext | undefined;
     subStepId: string;
     subStepSelector: string;
     subStepNameSelector: string;

package/lib/internal/template/internal/analytics/interfaces.d.ts

@@ -1,9 +1,16 @@
 export type FunnelType = 'single-page' | 'multi-page' | 'modal';
 export type FlowType = 'create' | 'edit' | 'delete' | 'home' | 'dashboard' | 'view-resource';
+type ErrorSubCategory = 'data_format' | 'parameter_validation' | 'access_control' | 'identity_management' | 'resource_state' | 'resource_capacity' | 'connection' | 'network_config' | 'resource_limit' | 'service_quota' | 'service_integration' | 'resource_config' | 'service_operations' | 'api_request' | 'other';
+type ErrorCategory = 'input_validation' | 'permission' | 'resource_availability' | 'network' | 'service_limits' | 'configuration' | 'api_specific' | 'other';
+export interface ErrorContext {
+    errorCategory: ErrorCategory;
+    errorSubCategory: ErrorSubCategory;
+    errorMessage: string;
+}
 export interface AnalyticsMetadata {
     instanceIdentifier?: string;
     flowType?: FlowType;
-    errorContext?: string;
+    errorContext?: ErrorContext;
     resourceType?: string;
 }
 interface BaseFunnelProps {
@@ -12,7 +19,7 @@ interface BaseFunnelProps {
     currentDocument?: Document;
 }
 interface FunnelErrorProps extends BaseFunnelProps {
-    funnelErrorContext?: string;
+    errorContext?: AnalyticsMetadata['errorContext'];
 }
 export interface FunnelStartProps extends Omit<BaseFunnelProps, 'funnelInteractionId'> {
     flowType?: FlowType;
@@ -54,7 +61,7 @@ interface FunnelStepNavigationProps extends FunnelStepProps {
     totalSubSteps?: number;
 }
 interface FunnelStepErrorProps extends FunnelStepProps {
-    stepErrorContext?: string;
+    errorContext?: AnalyticsMetadata['errorContext'];
     stepErrorSelector: string;
 }
 interface FunnelSubStepProps extends FunnelStepProps {
@@ -65,9 +72,9 @@ interface FunnelSubStepProps extends FunnelStepProps {
     subStepNumber?: number;
 }
 interface OptionalFunnelSubStepErrorProps extends FunnelSubStepProps {
-    subStepErrorContext?: string;
+    subStepErrorContext?: AnalyticsMetadata['errorContext'];
     fieldIdentifier?: string;
-    fieldErrorContext?: string;
+    errorContext?: AnalyticsMetadata['errorContext'];
     fieldLabelSelector?: string;
     fieldErrorSelector?: string;
 }

package/lib/internal/template/internal/analytics/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/internal/analytics/interfaces.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/internal/analytics/interfaces.ts"],"names":[],"mappings":"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"}

package/lib/internal/template/internal/analytics/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/internal/analytics/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport type FunnelType = 'single-page' | 'multi-page' | 'modal';\nexport type FlowType = 'create' | 'edit' | 'delete' | 'home' | 'dashboard' | 'view-resource';\nexport interface AnalyticsMetadata {\n  instanceIdentifier?: string;\n  flowType?: FlowType;\n  errorContext?: string;\n  resourceType?: string;\n}\n\n// Common properties for all funnels\ninterface BaseFunnelProps {\n  funnelIdentifier?: string;\n  funnelInteractionId: string;\n  currentDocument?: Document;\n}\n\ninterface FunnelErrorProps extends BaseFunnelProps {\n  funnelErrorContext?: string;\n}\n\nexport interface FunnelStartProps extends Omit<BaseFunnelProps, 'funnelInteractionId'> {\n  flowType?: FlowType;\n  resourceType?: string;\n  funnelName: string;\n  funnelNameSelector: string;\n  totalFunnelSteps: number;\n  optionalStepNumbers: number[];\n  stepConfiguration?: StepConfiguration[];\n  funnelType: FunnelType;\n  funnelVersion: string;\n  componentVersion: string;\n  componentTheme: string;\n  funnelInteractionId?: string;\n}\n\n// A function type for a generic funnel method\ntype FunnelMethod<T extends BaseFunnelProps> = (props: T) => void;\n\n// Interface for table interaction method props\nexport interface TableInteractionProps {\n  // Time to render table in either no data state or with data after user actions like filtering, pagination.\n  // in milliseconds\n  interactionTime: number;\n  // User action like sorting, filtering, pagination which triggered new data load in table.\n  userAction: string;\n  // Unique instance identifier for the component.\n  // Default: ''\n  instanceIdentifier?: string;\n  // Component identifier like table header which can be used to identify the table\n  // Default: ''\n  componentIdentifier?: string;\n  // Number of resources in table after user action\n  // Default: 0\n  noOfResourcesInTable?: number;\n  // Additional metadata related to user interaction\n  interactionMetadata?: string;\n}\n\ntype TableInteractionMethod = (props: TableInteractionProps) => void;\n\n// A function type specifically for funnelStart\ntype FunnelStartMethod = (props: FunnelStartProps) => string;\n\n// Define individual method props by extending the base\nexport interface FunnelStepProps extends BaseFunnelProps {\n  stepIdentifier?: string;\n  stepNumber: number;\n  stepName?: string | undefined;\n  stepNameSelector?: string;\n  subStepAllSelector: string;\n  totalSubSteps?: number;\n  subStepConfiguration?: SubStepConfiguration[];\n}\n\ninterface FunnelStepNavigationProps extends FunnelStepProps {\n  destinationStepNumber: number;\n  navigationType: string;\n  totalSubSteps?: number;\n}\n\ninterface FunnelStepErrorProps extends FunnelStepProps {\n  stepErrorContext?: string;\n  stepErrorSelector: string;\n}\n\ninterface FunnelSubStepProps extends FunnelStepProps {\n  subStepIdentifier?: string;\n  subStepSelector: string;\n  subStepName?: string | undefined;\n  subStepNameSelector: string;\n  subStepNumber?: number;\n}\n\ninterface OptionalFunnelSubStepErrorProps extends FunnelSubStepProps {\n  subStepErrorContext?: string;\n  fieldIdentifier?: string;\n  fieldErrorContext?: string;\n  fieldLabelSelector?: string;\n  fieldErrorSelector?: string;\n}\n\ninterface FunnelLinkInteractionProps extends FunnelSubStepProps {\n  elementSelector: string;\n}\n\ninterface FunnelChangeProps extends BaseFunnelProps {\n  stepConfiguration: StepConfiguration[];\n}\n\nexport interface StepConfiguration {\n  number: number;\n  name: string;\n  isOptional: boolean;\n  stepIdentifier?: string;\n}\n\nexport interface SubStepConfiguration {\n  number: number;\n  name: string;\n  subStepIdentifier?: string;\n}\n\n// Define the interface using the method type\nexport interface IFunnelMetrics {\n  funnelStart: FunnelStartMethod;\n  funnelError: FunnelMethod<FunnelErrorProps>;\n  funnelComplete: FunnelMethod<BaseFunnelProps>;\n  funnelSuccessful: FunnelMethod<BaseFunnelProps>;\n  funnelCancelled: FunnelMethod<BaseFunnelProps>;\n  funnelChange: FunnelMethod<FunnelChangeProps>;\n\n  funnelStepStart: FunnelMethod<FunnelStepProps>;\n  funnelStepComplete: FunnelMethod<FunnelStepProps>;\n  funnelStepNavigation: FunnelMethod<FunnelStepNavigationProps>;\n  funnelStepError: FunnelMethod<FunnelStepErrorProps>;\n  funnelStepChange: FunnelMethod<FunnelStepProps>;\n\n  funnelSubStepStart: FunnelMethod<FunnelSubStepProps>;\n  funnelSubStepComplete: FunnelMethod<FunnelSubStepProps>;\n  funnelSubStepError: FunnelMethod<OptionalFunnelSubStepErrorProps>;\n\n  helpPanelInteracted: FunnelMethod<FunnelLinkInteractionProps>;\n  externalLinkInteracted: FunnelMethod<FunnelLinkInteractionProps>;\n}\n\n// Interface for task completion method props\nexport interface TaskCompletionDataProps {\n  // Time taken to respond to customers after customers submit the form\n  // in milliseconds\n  timeToRespondAfterFormSubmit: number;\n  // Unique identifier for the task aka funnelInteractionId.\n  // Default: ''\n  taskInteractionId: string;\n  // Task name identifier to identify the task aka funnelName\n  // Default: ''\n  taskIdentifier?: string;\n  // To identify create or edit flow\n  // Default: ''\n  taskFlowType?: string;\n  //\"single-page\" | \"multi-page\"\n  // Default: ''\n  taskType?: FunnelType;\n  // Additional metadata related to completion such as success or error\n  completionMetadata?: string;\n}\n\ntype TaskCompletionDataMethod = (props: TaskCompletionDataProps) => void;\n\nexport interface IPerformanceMetrics {\n  tableInteraction: TableInteractionMethod;\n  taskCompletionData: TaskCompletionDataMethod;\n  modalPerformanceData: ModalPerformanceDataMethod;\n}\n\ntype JSONValue = string | number | boolean | null | undefined;\nexport interface JSONObject {\n  [key: string]: JSONObject | JSONValue;\n}\n\ninterface ComponentMountedProps {\n  componentName: string;\n  taskInteractionId?: string;\n  componentConfiguration: JSONObject;\n}\n\ninterface ComponentUpdatedProps extends ComponentMountedProps {\n  taskInteractionId: string;\n  actionType: string;\n}\n\ntype ComponentMountedMethod = (props: ComponentMountedProps) => string;\ntype ComponentUpdatedMethod = (props: ComponentUpdatedProps) => void;\nexport interface IComponentMetrics {\n  componentMounted: ComponentMountedMethod;\n  componentUpdated: ComponentUpdatedMethod;\n}\n\n// Interface for modal metrics\nexport interface ModalPerformanceDataProps {\n  // Time span from when the modal begins loading to when the primary button or modal has finished loading.\n  // in milliseconds\n  timeToContentReadyInModal: number;\n  // Unique instance identifier for the component.\n  // Default: ''\n  instanceIdentifier?: string;\n  // Component identifier like modal header which can be used to identify the modal\n  // Default: ''\n  componentIdentifier?: string;\n  // Additional metadata related to modal\n  modalMetadata?: string;\n}\n\ntype ModalPerformanceDataMethod = (props: ModalPerformanceDataProps) => void;\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/internal/analytics/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport type FunnelType = 'single-page' | 'multi-page' | 'modal';\nexport type FlowType = 'create' | 'edit' | 'delete' | 'home' | 'dashboard' | 'view-resource';\n\ntype ErrorSubCategory =\n  | 'data_format'\n  | 'parameter_validation'\n  | 'access_control'\n  | 'identity_management'\n  | 'resource_state'\n  | 'resource_capacity'\n  | 'connection'\n  | 'network_config'\n  | 'resource_limit'\n  | 'service_quota'\n  | 'service_integration'\n  | 'resource_config'\n  | 'service_operations'\n  | 'api_request'\n  | 'other';\n\ntype ErrorCategory =\n  | 'input_validation'\n  | 'permission'\n  | 'resource_availability'\n  | 'network'\n  | 'service_limits'\n  | 'configuration'\n  | 'api_specific'\n  | 'other';\n\nexport interface ErrorContext {\n  errorCategory: ErrorCategory;\n  errorSubCategory: ErrorSubCategory;\n  errorMessage: string;\n}\n\nexport interface AnalyticsMetadata {\n  instanceIdentifier?: string;\n  flowType?: FlowType;\n  errorContext?: ErrorContext;\n  resourceType?: string;\n}\n\n// Common properties for all funnels\ninterface BaseFunnelProps {\n  funnelIdentifier?: string;\n  funnelInteractionId: string;\n  currentDocument?: Document;\n}\n\ninterface FunnelErrorProps extends BaseFunnelProps {\n  errorContext?: AnalyticsMetadata['errorContext'];\n}\n\nexport interface FunnelStartProps extends Omit<BaseFunnelProps, 'funnelInteractionId'> {\n  flowType?: FlowType;\n  resourceType?: string;\n  funnelName: string;\n  funnelNameSelector: string;\n  totalFunnelSteps: number;\n  optionalStepNumbers: number[];\n  stepConfiguration?: StepConfiguration[];\n  funnelType: FunnelType;\n  funnelVersion: string;\n  componentVersion: string;\n  componentTheme: string;\n  funnelInteractionId?: string;\n}\n\n// A function type for a generic funnel method\ntype FunnelMethod<T extends BaseFunnelProps> = (props: T) => void;\n\n// Interface for table interaction method props\nexport interface TableInteractionProps {\n  // Time to render table in either no data state or with data after user actions like filtering, pagination.\n  // in milliseconds\n  interactionTime: number;\n  // User action like sorting, filtering, pagination which triggered new data load in table.\n  userAction: string;\n  // Unique instance identifier for the component.\n  // Default: ''\n  instanceIdentifier?: string;\n  // Component identifier like table header which can be used to identify the table\n  // Default: ''\n  componentIdentifier?: string;\n  // Number of resources in table after user action\n  // Default: 0\n  noOfResourcesInTable?: number;\n  // Additional metadata related to user interaction\n  interactionMetadata?: string;\n}\n\ntype TableInteractionMethod = (props: TableInteractionProps) => void;\n\n// A function type specifically for funnelStart\ntype FunnelStartMethod = (props: FunnelStartProps) => string;\n\n// Define individual method props by extending the base\nexport interface FunnelStepProps extends BaseFunnelProps {\n  stepIdentifier?: string;\n  stepNumber: number;\n  stepName?: string | undefined;\n  stepNameSelector?: string;\n  subStepAllSelector: string;\n  totalSubSteps?: number;\n  subStepConfiguration?: SubStepConfiguration[];\n}\n\ninterface FunnelStepNavigationProps extends FunnelStepProps {\n  destinationStepNumber: number;\n  navigationType: string;\n  totalSubSteps?: number;\n}\n\ninterface FunnelStepErrorProps extends FunnelStepProps {\n  errorContext?: AnalyticsMetadata['errorContext'];\n  stepErrorSelector: string;\n}\n\ninterface FunnelSubStepProps extends FunnelStepProps {\n  subStepIdentifier?: string;\n  subStepSelector: string;\n  subStepName?: string | undefined;\n  subStepNameSelector: string;\n  subStepNumber?: number;\n}\n\ninterface OptionalFunnelSubStepErrorProps extends FunnelSubStepProps {\n  subStepErrorContext?: AnalyticsMetadata['errorContext'];\n  fieldIdentifier?: string;\n  errorContext?: AnalyticsMetadata['errorContext'];\n  fieldLabelSelector?: string;\n  fieldErrorSelector?: string;\n}\n\ninterface FunnelLinkInteractionProps extends FunnelSubStepProps {\n  elementSelector: string;\n}\n\ninterface FunnelChangeProps extends BaseFunnelProps {\n  stepConfiguration: StepConfiguration[];\n}\n\nexport interface StepConfiguration {\n  number: number;\n  name: string;\n  isOptional: boolean;\n  stepIdentifier?: string;\n}\n\nexport interface SubStepConfiguration {\n  number: number;\n  name: string;\n  subStepIdentifier?: string;\n}\n\n// Define the interface using the method type\nexport interface IFunnelMetrics {\n  funnelStart: FunnelStartMethod;\n  funnelError: FunnelMethod<FunnelErrorProps>;\n  funnelComplete: FunnelMethod<BaseFunnelProps>;\n  funnelSuccessful: FunnelMethod<BaseFunnelProps>;\n  funnelCancelled: FunnelMethod<BaseFunnelProps>;\n  funnelChange: FunnelMethod<FunnelChangeProps>;\n\n  funnelStepStart: FunnelMethod<FunnelStepProps>;\n  funnelStepComplete: FunnelMethod<FunnelStepProps>;\n  funnelStepNavigation: FunnelMethod<FunnelStepNavigationProps>;\n  funnelStepError: FunnelMethod<FunnelStepErrorProps>;\n  funnelStepChange: FunnelMethod<FunnelStepProps>;\n\n  funnelSubStepStart: FunnelMethod<FunnelSubStepProps>;\n  funnelSubStepComplete: FunnelMethod<FunnelSubStepProps>;\n  funnelSubStepError: FunnelMethod<OptionalFunnelSubStepErrorProps>;\n\n  helpPanelInteracted: FunnelMethod<FunnelLinkInteractionProps>;\n  externalLinkInteracted: FunnelMethod<FunnelLinkInteractionProps>;\n}\n\n// Interface for task completion method props\nexport interface TaskCompletionDataProps {\n  // Time taken to respond to customers after customers submit the form\n  // in milliseconds\n  timeToRespondAfterFormSubmit: number;\n  // Unique identifier for the task aka funnelInteractionId.\n  // Default: ''\n  taskInteractionId: string;\n  // Task name identifier to identify the task aka funnelName\n  // Default: ''\n  taskIdentifier?: string;\n  // To identify create or edit flow\n  // Default: ''\n  taskFlowType?: string;\n  //\"single-page\" | \"multi-page\"\n  // Default: ''\n  taskType?: FunnelType;\n  // Additional metadata related to completion such as success or error\n  completionMetadata?: string;\n}\n\ntype TaskCompletionDataMethod = (props: TaskCompletionDataProps) => void;\n\nexport interface IPerformanceMetrics {\n  tableInteraction: TableInteractionMethod;\n  taskCompletionData: TaskCompletionDataMethod;\n  modalPerformanceData: ModalPerformanceDataMethod;\n}\n\ntype JSONValue = string | number | boolean | null | undefined;\nexport interface JSONObject {\n  [key: string]: JSONObject | JSONValue;\n}\n\ninterface ComponentMountedProps {\n  componentName: string;\n  taskInteractionId?: string;\n  componentConfiguration: JSONObject;\n}\n\ninterface ComponentUpdatedProps extends ComponentMountedProps {\n  taskInteractionId: string;\n  actionType: string;\n}\n\ntype ComponentMountedMethod = (props: ComponentMountedProps) => string;\ntype ComponentUpdatedMethod = (props: ComponentUpdatedProps) => void;\nexport interface IComponentMetrics {\n  componentMounted: ComponentMountedMethod;\n  componentUpdated: ComponentUpdatedMethod;\n}\n\n// Interface for modal metrics\nexport interface ModalPerformanceDataProps {\n  // Time span from when the modal begins loading to when the primary button or modal has finished loading.\n  // in milliseconds\n  timeToContentReadyInModal: number;\n  // Unique instance identifier for the component.\n  // Default: ''\n  instanceIdentifier?: string;\n  // Component identifier like modal header which can be used to identify the modal\n  // Default: ''\n  componentIdentifier?: string;\n  // Additional metadata related to modal\n  modalMetadata?: string;\n}\n\ntype ModalPerformanceDataMethod = (props: ModalPerformanceDataProps) => void;\n"]}

package/lib/internal/template/internal/components/drag-handle/hooks/interfaces.d.ts

@@ -0,0 +1,66 @@
+export type UapActionInteractionStateValue = 'uap-action-start' | 'uap-action-end';
+export type DndInteractionStateValue = 'dnd-start' | 'dnd-active' | 'dnd-end';
+export type InteractionState = null | UapActionInteractionStateValue | DndInteractionStateValue;
+export type StateTransitionCallbacks<T = void> = {
+    type: 'onDndStart';
+    payload: PointerEvent;
+    metadata?: T;
+} | {
+    type: 'onDndActive';
+    payload: PointerEvent;
+} | {
+    type: 'onDndEnd';
+} | {
+    type: 'onUapActionStart';
+    metadata?: T;
+} | {
+    type: 'onUapActionEnd';
+};
+export interface DragHandleInteractionState<T = void> {
+    value: InteractionState;
+    eventData?: PointerEvent;
+    metadata?: T;
+    transitionCallbacks?: StateTransitionCallbacks<T>[];
+}
+export interface UseDragHandleInteractionStateProps<T = void> {
+    onDndStartAction?: (event: PointerEvent, metadata?: T) => void;
+    onDndActiveAction?: (event: PointerEvent) => void;
+    onDndEndAction?: () => void;
+    onUapActionStartAction?: (metadata?: T) => void;
+    onUapActionEndAction?: () => void;
+}
+interface DefaultActionPayload {
+    nativeEvent: PointerEvent;
+}
+interface PointerDownActionPayload<T = void> extends DefaultActionPayload {
+    metadata?: T;
+}
+interface KeyDownActionPayload<T = void> {
+    key: string;
+    metadata?: T;
+}
+export type Action<T = void> = {
+    type: 'POINTER_DOWN';
+    payload: PointerDownActionPayload<T>;
+} | {
+    type: 'POINTER_MOVE';
+    payload: DefaultActionPayload;
+} | {
+    type: 'POINTER_UP';
+    payload: DefaultActionPayload;
+} | {
+    type: 'POINTER_CANCEL';
+} | {
+    type: 'KEY_DOWN';
+    payload: KeyDownActionPayload<T>;
+} | {
+    type: 'FOCUS';
+} | {
+    type: 'BLUR';
+} | {
+    type: 'RESET_TO_IDLE';
+} | {
+    type: 'CLEAR_CALLBACKS';
+};
+export {};
+//# sourceMappingURL=interfaces.d.ts.map

package/lib/internal/template/internal/components/drag-handle/hooks/interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/drag-handle/hooks/interfaces.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,8BAA8B,GAAG,kBAAkB,GAAG,gBAAgB,CAAC;AACnF,MAAM,MAAM,wBAAwB,GAAG,WAAW,GAAG,YAAY,GAAG,SAAS,CAAC;AAC9E,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,8BAA8B,GAAG,wBAAwB,CAAC;AAEhG,MAAM,MAAM,wBAAwB,CAAC,CAAC,GAAG,IAAI,IACzC;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,YAAY,CAAC;IAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;CAAE,GAC3D;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,OAAO,EAAE,YAAY,CAAA;CAAE,GAC9C;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;CAAE,GAC1C;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,CAAC;AAE/B,MAAM,WAAW,0BAA0B,CAAC,CAAC,GAAG,IAAI;IAClD,KAAK,EAAE,gBAAgB,CAAC;IACxB,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,CAAC;IACb,mBAAmB,CAAC,EAAE,wBAAwB,CAAC,CAAC,CAAC,EAAE,CAAC;CACrD;AAED,MAAM,WAAW,kCAAkC,CAAC,CAAC,GAAG,IAAI;IAC1D,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,QAAQ,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/D,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAClD,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,sBAAsB,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;IAChD,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC;AAED,UAAU,oBAAoB;IAC5B,WAAW,EAAE,YAAY,CAAC;CAC3B;AAED,UAAU,wBAAwB,CAAC,CAAC,GAAG,IAAI,CAAE,SAAQ,oBAAoB;IACvE,QAAQ,CAAC,EAAE,CAAC,CAAC;CACd;AAED,UAAU,oBAAoB,CAAC,CAAC,GAAG,IAAI;IACrC,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,CAAC,CAAC;CACd;AAED,MAAM,MAAM,MAAM,CAAC,CAAC,GAAG,IAAI,IACvB;IAAE,IAAI,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC,CAAC,CAAA;CAAE,GAC9D;IAAE,IAAI,EAAE,cAAc,CAAC;IAAC,OAAO,EAAE,oBAAoB,CAAA;CAAE,GACvD;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,oBAAoB,CAAA;CAAE,GACrD;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,GAC1B;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,OAAO,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAA;CAAE,GACtD;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GACjB;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAChB;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,iBAAiB,CAAA;CAAE,CAAC"}

package/lib/internal/template/internal/components/drag-handle/hooks/interfaces.js

@@ -0,0 +1,4 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+export {};
+//# sourceMappingURL=interfaces.js.map

package/lib/internal/template/internal/components/drag-handle/hooks/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../../src/internal/components/drag-handle/hooks/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport type UapActionInteractionStateValue = 'uap-action-start' | 'uap-action-end';\nexport type DndInteractionStateValue = 'dnd-start' | 'dnd-active' | 'dnd-end';\nexport type InteractionState = null | UapActionInteractionStateValue | DndInteractionStateValue;\n\nexport type StateTransitionCallbacks<T = void> =\n  | { type: 'onDndStart'; payload: PointerEvent; metadata?: T }\n  | { type: 'onDndActive'; payload: PointerEvent }\n  | { type: 'onDndEnd' }\n  | { type: 'onUapActionStart'; metadata?: T }\n  | { type: 'onUapActionEnd' };\n\nexport interface DragHandleInteractionState<T = void> {\n  value: InteractionState;\n  eventData?: PointerEvent; // Only relevant for dnd states\n  metadata?: T;\n  transitionCallbacks?: StateTransitionCallbacks<T>[];\n}\n\nexport interface UseDragHandleInteractionStateProps<T = void> {\n  onDndStartAction?: (event: PointerEvent, metadata?: T) => void;\n  onDndActiveAction?: (event: PointerEvent) => void;\n  onDndEndAction?: () => void;\n  onUapActionStartAction?: (metadata?: T) => void;\n  onUapActionEndAction?: () => void;\n}\n\ninterface DefaultActionPayload {\n  nativeEvent: PointerEvent;\n}\n\ninterface PointerDownActionPayload<T = void> extends DefaultActionPayload {\n  metadata?: T;\n}\n\ninterface KeyDownActionPayload<T = void> {\n  key: string;\n  metadata?: T;\n}\n\nexport type Action<T = void> =\n  | { type: 'POINTER_DOWN'; payload: PointerDownActionPayload<T> }\n  | { type: 'POINTER_MOVE'; payload: DefaultActionPayload }\n  | { type: 'POINTER_UP'; payload: DefaultActionPayload }\n  | { type: 'POINTER_CANCEL' }\n  | { type: 'KEY_DOWN'; payload: KeyDownActionPayload<T> }\n  | { type: 'FOCUS' }\n  | { type: 'BLUR' }\n  | { type: 'RESET_TO_IDLE' }\n  | { type: 'CLEAR_CALLBACKS' };\n"]}

package/lib/internal/template/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { Action, DragHandleInteractionState, StateTransitionCallbacks, UseDragHandleInteractionStateProps } from './interfaces';
+export { UseDragHandleInteractionStateProps };
+export declare function calculateNextState<T = void>(state: DragHandleInteractionState<T>, action: Action<T>): DragHandleInteractionState<T>;
+export declare function getCallbacksForTransition<T = void>(prevState: DragHandleInteractionState<T>, nextState: DragHandleInteractionState<T>): StateTransitionCallbacks<T>[];
+/**
+ * Manages interaction states for drag handle components.
+ *
+ * The hook implements a state machine for drag handles that supports:
+ * - Pointer-based drag-and-drop (DnD) interactions
+ * - Keyboard-based universal access pattern (UAP) interactions
+ * - State transitions with appropriate callbacks
+ * - Metadata passing between states
+ *
+ * States:
+ * - null: Idle state with no active interaction
+ * - dnd-start: Initial pointer down, beginning of potential drag
+ * - dnd-active: Active dragging with pointer movement
+ * - dnd-end: Completed drag operation
+ * - uap-action-start: Keyboard/accessibility action initiated
+ * - uap-action-end: Keyboard/accessibility action completed
+ */
+export default function useDragHandleInteractionState<T = void>(props?: UseDragHandleInteractionStateProps<T>, options?: {
+    debug: boolean;
+}): {
+    interaction: DragHandleInteractionState<T>;
+    processPointerDown: (event: PointerEvent, metadata?: T) => void;
+    processPointerMove: (event: PointerEvent) => void;
+    processPointerUp: (event: PointerEvent) => void;
+    processPointerCancel: () => void;
+    processKeyDown: (event: React.KeyboardEvent<Element>, metadata?: T) => void;
+    processFocus: () => void;
+    processBlur: () => void;
+};
+//# sourceMappingURL=use-drag-handle-interaction-state.d.ts.map

package/lib/internal/template/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-drag-handle-interaction-state.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EACV,MAAM,EACN,0BAA0B,EAC1B,wBAAwB,EACxB,kCAAkC,EACnC,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,kCAAkC,EAAE,CAAC;AAE9C,wBAAgB,kBAAkB,CAAC,CAAC,GAAG,IAAI,EACzC,KAAK,EAAE,0BAA0B,CAAC,CAAC,CAAC,EACpC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAChB,0BAA0B,CAAC,CAAC,CAAC,CA6F/B;AAED,wBAAgB,yBAAyB,CAAC,CAAC,GAAG,IAAI,EAChD,SAAS,EAAE,0BAA0B,CAAC,CAAC,CAAC,EACxC,SAAS,EAAE,0BAA0B,CAAC,CAAC,CAAC,GACvC,wBAAwB,CAAC,CAAC,CAAC,EAAE,CA2C/B;AAwFD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,CAAC,GAAG,IAAI,EAC5D,KAAK,GAAE,kCAAkC,CAAC,CAAC,CAAM,EACjD,OAAO;;CAAmB;;gCAUI,YAAY,aAAa,CAAC;gCAM1B,YAAY;8BAMd,YAAY;;4BAWd,mBAAmB,CAAC,OAAO,CAAC,aAAa,CAAC;;;EAgBrE"}

package/lib/internal/template/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.js

@@ -0,0 +1,259 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { useEffect, useReducer, useRef } from 'react';
+export function calculateNextState(state, action) {
+    switch (action.type) {
+        case 'POINTER_DOWN': {
+            const { nativeEvent, metadata } = action.payload;
+            return {
+                value: 'dnd-start',
+                eventData: nativeEvent,
+                metadata,
+            };
+        }
+        case 'POINTER_MOVE': {
+            const { nativeEvent } = action.payload;
+            if (state.value === 'dnd-start' || state.value === 'dnd-active') {
+                return Object.assign(Object.assign({}, state), { value: 'dnd-active', eventData: nativeEvent });
+            }
+            return state;
+        }
+        case 'POINTER_UP': {
+            if (state.value === 'dnd-start' || state.value === 'dnd-active') {
+                const dndSubStateBeforeUp = state.value;
+                if (dndSubStateBeforeUp === 'dnd-start') {
+                    return {
+                        value: 'uap-action-start',
+                        metadata: state.metadata, // Preserve metadata when transitioning from dnd-start to uap-action-start
+                    };
+                }
+                else {
+                    return {
+                        value: 'dnd-end',
+                        eventData: state.eventData,
+                    };
+                }
+            }
+            return state;
+        }
+        case 'POINTER_CANCEL': {
+            if (state.value === 'dnd-start' || state.value === 'dnd-active') {
+                return {
+                    value: 'dnd-end',
+                };
+            }
+            return state;
+        }
+        case 'KEY_DOWN': {
+            const { key, metadata } = action.payload;
+            if (key === 'Enter' || key === ' ') {
+                if (state.value === null || state.value === 'uap-action-end' || state.value === 'dnd-end') {
+                    return {
+                        value: 'uap-action-start',
+                        metadata,
+                    };
+                }
+                else if (state.value === 'uap-action-start') {
+                    return {
+                        value: 'uap-action-end',
+                    };
+                }
+                else if (state.value === 'dnd-start' || state.value === 'dnd-active') {
+                    return {
+                        value: 'uap-action-start',
+                        metadata,
+                    };
+                }
+            }
+            else if (key === 'Escape') {
+                if (state.value === 'uap-action-start') {
+                    return {
+                        value: 'uap-action-end',
+                    };
+                }
+            }
+            return state;
+        }
+        case 'FOCUS':
+            return state;
+        case 'BLUR':
+            if (state.value === 'uap-action-start') {
+                return {
+                    value: 'uap-action-end',
+                };
+            }
+            return state;
+        default:
+            throw new Error(`The given action type [${action.type}] is not supported.`);
+    }
+}
+export function getCallbacksForTransition(prevState, nextState) {
+    const callbacks = [];
+    // Transitions from dnd-start or dnd-active to any other state
+    if ((prevState.value === 'dnd-start' || prevState.value === 'dnd-active') &&
+        nextState.value !== 'dnd-start' &&
+        nextState.value !== 'dnd-active') {
+        callbacks.push({ type: 'onDndEnd' });
+    }
+    // From uap-action-start to uap-action-end directly
+    if (prevState.value === 'uap-action-start' && nextState.value === 'uap-action-end') {
+        callbacks.push({ type: 'onUapActionEnd' });
+    }
+    // Transitions to dnd-start
+    if (nextState.value === 'dnd-start') {
+        callbacks.push({
+            type: 'onDndStart',
+            payload: nextState.eventData,
+            metadata: nextState.metadata,
+        });
+    }
+    // Transitions to dnd-active
+    if (nextState.value === 'dnd-active' && prevState.value === 'dnd-start') {
+        callbacks.push({
+            type: 'onDndActive',
+            payload: nextState.eventData,
+        });
+    }
+    // Transitions to uap-action-start
+    if (nextState.value === 'uap-action-start') {
+        callbacks.push({
+            type: 'onUapActionStart',
+            metadata: nextState.metadata,
+        });
+    }
+    return callbacks;
+}
+function interactionReducer(state, action) {
+    const nextState = calculateNextState(state, action);
+    // Special handling for POINTER_MOVE to always trigger onDndActive callback
+    if (action.type === 'POINTER_MOVE' && action.payload.nativeEvent) {
+        const transitionCallbacks = getCallbacksForTransition(state, nextState);
+        // Check if there's already an onDndActive callback from the transition
+        const hasOnDndActiveCallback = transitionCallbacks.some(callback => callback.type === 'onDndActive');
+        const callbacks = hasOnDndActiveCallback
+            ? transitionCallbacks
+            : [...transitionCallbacks, { type: 'onDndActive', payload: action.payload.nativeEvent }];
+        return Object.assign(Object.assign({}, nextState), { transitionCallbacks: callbacks });
+    }
+    // Return current state if state didn't change
+    const isDndState = (state) => {
+        return state.value === 'dnd-start' || state.value === 'dnd-active' || state.value === 'dnd-end';
+    };
+    if (nextState.value === state.value) {
+        if (isDndState(nextState) && isDndState(state)) {
+            if (nextState.eventData === state.eventData) {
+                return state;
+            }
+        }
+        else {
+            return state;
+        }
+    }
+    const callbacks = getCallbacksForTransition(state, nextState);
+    return Object.assign(Object.assign({}, nextState), { transitionCallbacks: callbacks.length > 0 ? callbacks : undefined });
+}
+function useStateLogger(state, isEnabled) {
+    const prevStateRef = useRef(state);
+    useEffect(() => {
+        if (state.value !== prevStateRef.current.value && isEnabled) {
+            console.log(`State transition: ${prevStateRef.current.value} -> ${state.value}`, {
+                prevState: prevStateRef.current,
+                nextState: state,
+            });
+        }
+        prevStateRef.current = state;
+    }, [state, isEnabled]);
+}
+function useCallbackHandler(pendingCallbacks, props, dispatch) {
+    useEffect(() => {
+        if (!(pendingCallbacks === null || pendingCallbacks === void 0 ? void 0 : pendingCallbacks.length)) {
+            return;
+        }
+        pendingCallbacks.forEach(callback => {
+            var _a, _b, _c, _d, _e;
+            switch (callback.type) {
+                case 'onDndStart':
+                    (_a = props.onDndStartAction) === null || _a === void 0 ? void 0 : _a.call(props, callback.payload, callback.metadata);
+                    break;
+                case 'onDndActive':
+                    (_b = props.onDndActiveAction) === null || _b === void 0 ? void 0 : _b.call(props, callback.payload);
+                    break;
+                case 'onDndEnd':
+                    (_c = props.onDndEndAction) === null || _c === void 0 ? void 0 : _c.call(props);
+                    break;
+                case 'onUapActionStart':
+                    (_d = props.onUapActionStartAction) === null || _d === void 0 ? void 0 : _d.call(props, callback.metadata);
+                    break;
+                case 'onUapActionEnd':
+                    (_e = props.onUapActionEndAction) === null || _e === void 0 ? void 0 : _e.call(props);
+                    break;
+            }
+        });
+    }, [pendingCallbacks, props, dispatch]);
+}
+/**
+ * Manages interaction states for drag handle components.
+ *
+ * The hook implements a state machine for drag handles that supports:
+ * - Pointer-based drag-and-drop (DnD) interactions
+ * - Keyboard-based universal access pattern (UAP) interactions
+ * - State transitions with appropriate callbacks
+ * - Metadata passing between states
+ *
+ * States:
+ * - null: Idle state with no active interaction
+ * - dnd-start: Initial pointer down, beginning of potential drag
+ * - dnd-active: Active dragging with pointer movement
+ * - dnd-end: Completed drag operation
+ * - uap-action-start: Keyboard/accessibility action initiated
+ * - uap-action-end: Keyboard/accessibility action completed
+ */
+export default function useDragHandleInteractionState(props = {}, options = { debug: false }) {
+    const propsRef = useRef(props);
+    propsRef.current = props;
+    const [interaction, dispatch] = useReducer((interactionReducer), { value: null });
+    useStateLogger(interaction, options.debug);
+    useCallbackHandler(interaction.transitionCallbacks, propsRef.current, dispatch);
+    return {
+        interaction,
+        processPointerDown: (event, metadata) => {
+            dispatch({
+                type: 'POINTER_DOWN',
+                payload: { nativeEvent: event, metadata },
+            });
+        },
+        processPointerMove: (event) => {
+            dispatch({
+                type: 'POINTER_MOVE',
+                payload: { nativeEvent: event },
+            });
+        },
+        processPointerUp: (event) => {
+            dispatch({
+                type: 'POINTER_UP',
+                payload: { nativeEvent: event },
+            });
+        },
+        processPointerCancel: () => {
+            dispatch({
+                type: 'POINTER_CANCEL',
+            });
+        },
+        processKeyDown: (event, metadata) => {
+            const key = event.key;
+            if (key === 'Enter' || key === 'Escape' || key === ' ') {
+                dispatch({
+                    type: 'KEY_DOWN',
+                    payload: { key, metadata },
+                });
+            }
+        },
+        processFocus: () => {
+            dispatch({ type: 'FOCUS' });
+        },
+        processBlur: () => {
+            dispatch({ type: 'BLUR' });
+        },
+    };
+}
+//# sourceMappingURL=use-drag-handle-interaction-state.js.map