@cloudscape-design/components 3.0.337 → 3.0.338
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.
- package/app-layout/styles.css.js +17 -17
- package/app-layout/styles.scoped.css +21 -21
- package/app-layout/styles.selectors.js +17 -17
- package/app-layout/visual-refresh/styles.css.js +69 -69
- package/app-layout/visual-refresh/styles.scoped.css +173 -169
- package/app-layout/visual-refresh/styles.selectors.js +69 -69
- package/area-chart/chart-container.d.ts +2 -2
- package/area-chart/chart-container.d.ts.map +1 -1
- package/area-chart/chart-container.js +1 -1
- package/area-chart/chart-container.js.map +1 -1
- package/area-chart/interfaces.d.ts +5 -1
- package/area-chart/interfaces.d.ts.map +1 -1
- package/area-chart/interfaces.js.map +1 -1
- package/area-chart/internal.d.ts +1 -1
- package/area-chart/internal.d.ts.map +1 -1
- package/area-chart/internal.js +2 -2
- package/area-chart/internal.js.map +1 -1
- package/attribute-editor/interfaces.d.ts +7 -0
- package/attribute-editor/interfaces.d.ts.map +1 -1
- package/attribute-editor/interfaces.js.map +1 -1
- package/attribute-editor/internal.d.ts.map +1 -1
- package/attribute-editor/internal.js +2 -2
- package/attribute-editor/internal.js.map +1 -1
- package/attribute-editor/row.d.ts +3 -2
- package/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +2 -2
- package/attribute-editor/row.js.map +1 -1
- package/box/styles.css.js +189 -189
- package/box/styles.scoped.css +257 -257
- package/box/styles.selectors.js +189 -189
- package/button/styles.css.js +20 -20
- package/button/styles.scoped.css +154 -154
- package/button/styles.selectors.js +20 -20
- package/button-dropdown/category-elements/styles.css.js +13 -13
- package/button-dropdown/category-elements/styles.scoped.css +25 -25
- package/button-dropdown/category-elements/styles.selectors.js +13 -13
- package/button-dropdown/item-element/styles.css.js +14 -14
- package/button-dropdown/item-element/styles.scoped.css +20 -20
- package/button-dropdown/item-element/styles.selectors.js +14 -14
- package/cards/styles.css.js +38 -38
- package/cards/styles.scoped.css +57 -62
- package/cards/styles.selectors.js +38 -38
- package/container/styles.css.js +28 -28
- package/container/styles.scoped.css +57 -54
- package/container/styles.selectors.js +28 -28
- package/content-layout/styles.css.js +7 -7
- package/content-layout/styles.scoped.css +13 -13
- package/content-layout/styles.selectors.js +7 -7
- package/expandable-section/styles.css.js +29 -29
- package/expandable-section/styles.scoped.css +61 -61
- package/expandable-section/styles.selectors.js +29 -29
- package/flashbar/styles.css.js +46 -46
- package/flashbar/styles.scoped.css +146 -146
- package/flashbar/styles.selectors.js +46 -46
- package/form-field/internal.js +3 -2
- package/form-field/internal.js.map +1 -1
- package/header/internal.d.ts.map +1 -1
- package/header/internal.js +5 -5
- package/header/internal.js.map +1 -1
- package/header/styles.css.js +33 -44
- package/header/styles.scoped.css +85 -91
- package/header/styles.selectors.js +33 -44
- package/help-panel/styles.css.js +4 -4
- package/help-panel/styles.scoped.css +80 -80
- package/help-panel/styles.selectors.js +4 -4
- package/icon/styles.css.js +21 -21
- package/icon/styles.scoped.css +54 -54
- package/icon/styles.selectors.js +21 -21
- package/internal/analytics/components/analytics-funnel.d.ts.map +1 -1
- package/internal/analytics/components/analytics-funnel.js +14 -13
- package/internal/analytics/components/analytics-funnel.js.map +1 -1
- package/internal/analytics/context/analytics-context.d.ts +6 -7
- package/internal/analytics/context/analytics-context.d.ts.map +1 -1
- package/internal/analytics/context/analytics-context.js +2 -6
- package/internal/analytics/context/analytics-context.js.map +1 -1
- package/internal/analytics/hooks/use-funnel.d.ts +4 -7
- package/internal/analytics/hooks/use-funnel.d.ts.map +1 -1
- package/internal/analytics/hooks/use-funnel.js +9 -7
- package/internal/analytics/hooks/use-funnel.js.map +1 -1
- package/internal/base-component/styles.scoped.css +45 -35
- package/internal/components/button-trigger/index.d.ts +2 -1
- package/internal/components/button-trigger/index.d.ts.map +1 -1
- package/internal/components/button-trigger/index.js +2 -2
- package/internal/components/button-trigger/index.js.map +1 -1
- package/internal/components/cartesian-chart/interfaces.d.ts +10 -2
- package/internal/components/cartesian-chart/interfaces.d.ts.map +1 -1
- package/internal/components/cartesian-chart/interfaces.js.map +1 -1
- package/internal/components/dropdown/index.d.ts +1 -1
- package/internal/components/dropdown/index.d.ts.map +1 -1
- package/internal/components/dropdown/index.js +4 -4
- package/internal/components/dropdown/index.js.map +1 -1
- package/internal/components/dropdown/interfaces.d.ts +8 -0
- package/internal/components/dropdown/interfaces.d.ts.map +1 -1
- package/internal/components/dropdown/interfaces.js.map +1 -1
- package/internal/components/menu-dropdown/styles.css.js +7 -7
- package/internal/components/menu-dropdown/styles.scoped.css +14 -14
- package/internal/components/menu-dropdown/styles.selectors.js +7 -7
- package/internal/environment.js +1 -1
- package/internal/generated/theming/index.cjs +153 -120
- package/internal/generated/theming/index.js +153 -120
- package/internal/manifest.json +1 -1
- package/link/internal.d.ts.map +1 -1
- package/link/internal.js +3 -2
- package/link/internal.js.map +1 -1
- package/link/styles.css.js +20 -20
- package/link/styles.scoped.css +83 -83
- package/link/styles.selectors.js +20 -20
- package/mixed-line-bar-chart/internal.d.ts +1 -1
- package/mixed-line-bar-chart/internal.d.ts.map +1 -1
- package/mixed-line-bar-chart/internal.js +2 -2
- package/mixed-line-bar-chart/internal.js.map +1 -1
- package/modal/styles.css.js +23 -23
- package/modal/styles.scoped.css +40 -40
- package/modal/styles.selectors.js +23 -23
- package/package.json +1 -1
- package/pagination/styles.css.js +9 -9
- package/pagination/styles.scoped.css +24 -24
- package/pagination/styles.selectors.js +9 -9
- package/popover/styles.css.js +50 -50
- package/popover/styles.scoped.css +65 -65
- package/popover/styles.selectors.js +50 -50
- package/property-filter/index.d.ts.map +1 -1
- package/property-filter/index.js +4 -3
- package/property-filter/index.js.map +1 -1
- package/property-filter/interfaces.d.ts +16 -5
- package/property-filter/interfaces.d.ts.map +1 -1
- package/property-filter/interfaces.js.map +1 -1
- package/s3-resource-selector/index.d.ts.map +1 -1
- package/s3-resource-selector/index.js +2 -2
- package/s3-resource-selector/index.js.map +1 -1
- package/s3-resource-selector/interfaces.d.ts +7 -0
- package/s3-resource-selector/interfaces.d.ts.map +1 -1
- package/s3-resource-selector/interfaces.js.map +1 -1
- package/s3-resource-selector/s3-in-context/index.d.ts +1 -0
- package/s3-resource-selector/s3-in-context/index.d.ts.map +1 -1
- package/s3-resource-selector/s3-in-context/index.js +2 -2
- package/s3-resource-selector/s3-in-context/index.js.map +1 -1
- package/segmented-control/styles.css.js +14 -14
- package/segmented-control/styles.scoped.css +35 -35
- package/segmented-control/styles.selectors.js +14 -14
- package/select/utils/use-select.d.ts +5 -7
- package/select/utils/use-select.d.ts.map +1 -1
- package/select/utils/use-select.js +6 -0
- package/select/utils/use-select.js.map +1 -1
- package/side-navigation/styles.css.js +28 -28
- package/side-navigation/styles.scoped.css +49 -49
- package/side-navigation/styles.selectors.js +28 -28
- package/spinner/styles.css.js +13 -13
- package/spinner/styles.scoped.css +22 -22
- package/spinner/styles.selectors.js +13 -13
- package/split-panel/styles.css.js +56 -56
- package/split-panel/styles.scoped.css +80 -80
- package/split-panel/styles.selectors.js +56 -56
- package/table/header-cell/styles.css.js +24 -24
- package/table/header-cell/styles.scoped.css +41 -41
- package/table/header-cell/styles.selectors.js +24 -24
- package/table/styles.css.js +34 -34
- package/table/styles.scoped.css +45 -52
- package/table/styles.selectors.js +34 -34
- package/tabs/styles.css.js +21 -21
- package/tabs/styles.scoped.css +41 -41
- package/tabs/styles.selectors.js +21 -21
- package/tag-editor/styles.css.js +3 -3
- package/tag-editor/styles.scoped.css +11 -11
- package/tag-editor/styles.selectors.js +3 -3
- package/text-content/styles.css.js +1 -1
- package/text-content/styles.scoped.css +71 -71
- package/text-content/styles.selectors.js +1 -1
- package/top-navigation/1.0-beta/styles.css.js +25 -25
- package/top-navigation/1.0-beta/styles.scoped.css +45 -45
- package/top-navigation/1.0-beta/styles.selectors.js +25 -25
- package/top-navigation/styles.css.js +47 -47
- package/top-navigation/styles.scoped.css +74 -74
- package/top-navigation/styles.selectors.js +47 -47
- package/tutorial-panel/components/tutorial-detail-view/styles.css.js +20 -20
- package/tutorial-panel/components/tutorial-detail-view/styles.scoped.css +22 -22
- package/tutorial-panel/components/tutorial-detail-view/styles.selectors.js +20 -20
- package/wizard/interfaces.d.ts +10 -3
- package/wizard/interfaces.d.ts.map +1 -1
- package/wizard/interfaces.js.map +1 -1
- package/wizard/internal.d.ts +1 -1
- package/wizard/internal.d.ts.map +1 -1
- package/wizard/internal.js +5 -5
- package/wizard/internal.js.map +1 -1
- package/wizard/wizard-form.d.ts +2 -1
- package/wizard/wizard-form.d.ts.map +1 -1
- package/wizard/wizard-form.js +2 -2
- package/wizard/wizard-form.js.map +1 -1
package/icon/styles.selectors.js
CHANGED
|
@@ -2,26 +2,26 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"icon": "
|
|
6
|
-
"icon-flex-height": "awsui_icon-flex-
|
|
7
|
-
"size-small": "awsui_size-
|
|
8
|
-
"size-small-mapped-height": "awsui_size-small-mapped-
|
|
9
|
-
"size-normal": "awsui_size-
|
|
10
|
-
"size-normal-mapped-height": "awsui_size-normal-mapped-
|
|
11
|
-
"size-medium": "awsui_size-
|
|
12
|
-
"size-medium-mapped-height": "awsui_size-medium-mapped-
|
|
13
|
-
"size-big": "awsui_size-
|
|
14
|
-
"size-big-mapped-height": "awsui_size-big-mapped-
|
|
15
|
-
"size-large": "awsui_size-
|
|
16
|
-
"size-large-mapped-height": "awsui_size-large-mapped-
|
|
17
|
-
"variant-normal": "awsui_variant-
|
|
18
|
-
"variant-disabled": "awsui_variant-
|
|
19
|
-
"variant-inverted": "awsui_variant-
|
|
20
|
-
"variant-subtle": "awsui_variant-
|
|
21
|
-
"variant-warning": "awsui_variant-
|
|
22
|
-
"variant-error": "awsui_variant-
|
|
23
|
-
"variant-success": "awsui_variant-
|
|
24
|
-
"variant-link": "awsui_variant-
|
|
25
|
-
"badge": "
|
|
5
|
+
"icon": "awsui_icon_h11ix_lj4f9_98",
|
|
6
|
+
"icon-flex-height": "awsui_icon-flex-height_h11ix_lj4f9_104",
|
|
7
|
+
"size-small": "awsui_size-small_h11ix_lj4f9_129",
|
|
8
|
+
"size-small-mapped-height": "awsui_size-small-mapped-height_h11ix_lj4f9_133",
|
|
9
|
+
"size-normal": "awsui_size-normal_h11ix_lj4f9_147",
|
|
10
|
+
"size-normal-mapped-height": "awsui_size-normal-mapped-height_h11ix_lj4f9_151",
|
|
11
|
+
"size-medium": "awsui_size-medium_h11ix_lj4f9_165",
|
|
12
|
+
"size-medium-mapped-height": "awsui_size-medium-mapped-height_h11ix_lj4f9_169",
|
|
13
|
+
"size-big": "awsui_size-big_h11ix_lj4f9_183",
|
|
14
|
+
"size-big-mapped-height": "awsui_size-big-mapped-height_h11ix_lj4f9_187",
|
|
15
|
+
"size-large": "awsui_size-large_h11ix_lj4f9_201",
|
|
16
|
+
"size-large-mapped-height": "awsui_size-large-mapped-height_h11ix_lj4f9_205",
|
|
17
|
+
"variant-normal": "awsui_variant-normal_h11ix_lj4f9_219",
|
|
18
|
+
"variant-disabled": "awsui_variant-disabled_h11ix_lj4f9_222",
|
|
19
|
+
"variant-inverted": "awsui_variant-inverted_h11ix_lj4f9_225",
|
|
20
|
+
"variant-subtle": "awsui_variant-subtle_h11ix_lj4f9_228",
|
|
21
|
+
"variant-warning": "awsui_variant-warning_h11ix_lj4f9_231",
|
|
22
|
+
"variant-error": "awsui_variant-error_h11ix_lj4f9_234",
|
|
23
|
+
"variant-success": "awsui_variant-success_h11ix_lj4f9_237",
|
|
24
|
+
"variant-link": "awsui_variant-link_h11ix_lj4f9_240",
|
|
25
|
+
"badge": "awsui_badge_h11ix_lj4f9_244"
|
|
26
26
|
};
|
|
27
27
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"analytics-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/components/analytics-funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
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,EAGvB,MAAM,8BAA8B,CAAC;AAQtC,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAW7D,eAAO,MAAM,cAAc,QAAQ,CAAC;AAEpC,KAAK,oBAAoB,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,GAAG,IAAI,CAC/D,WAAW,EACX,YAAY,GAAG,qBAAqB,GAAG,kBAAkB,CAC1D,CAAC;AAEF,eAAO,MAAM,eAAe,2BAA4B,oBAAoB,gBAkH3E,CAAC;AAEF,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,+CAAgD,wBAAwB,gBA2CvG,CAAC;AACF,UAAU,2BAA2B;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,sBAAsB,iBAAkB,2BAA2B,gBAmB/E,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { __rest } from "tslib";
|
|
2
2
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
|
-
import React, { useEffect, useRef, useState } from 'react';
|
|
4
|
+
import React, { useContext, useEffect, useRef, useState } from 'react';
|
|
5
5
|
import { FunnelStepContext, FunnelSubStepContext, FunnelContext, } from '../context/analytics-context';
|
|
6
|
-
import { useFunnel
|
|
6
|
+
import { useFunnel } 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';
|
|
@@ -145,22 +145,23 @@ export const AnalyticsFunnelStep = ({ children, stepNumber, stepNameSelector })
|
|
|
145
145
|
};
|
|
146
146
|
//eslint-disable-next-line react-hooks/exhaustive-deps
|
|
147
147
|
}, [funnelInteractionId, stepNumber, stepNameSelector]);
|
|
148
|
-
const contextValue = {
|
|
148
|
+
const contextValue = { stepNumber, stepNameSelector, funnelStepProps };
|
|
149
149
|
return (React.createElement(FunnelStepContext.Provider, { value: contextValue }, typeof children === 'function' ? children(contextValue) : children));
|
|
150
150
|
};
|
|
151
151
|
export const AnalyticsFunnelSubStep = ({ children }) => {
|
|
152
|
-
const { funnelInteractionId } = useFunnel();
|
|
153
|
-
const { stepNumber, stepNameSelector } = useFunnelStep();
|
|
154
152
|
const subStepId = useUniqueId('substep');
|
|
155
153
|
const subStepSelector = getSubStepSelector(subStepId);
|
|
156
154
|
const subStepNameSelector = getSubStepNameSelector(subStepId);
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
155
|
+
const subStepRef = useRef(null);
|
|
156
|
+
const newContext = {
|
|
157
|
+
subStepSelector,
|
|
158
|
+
subStepNameSelector,
|
|
159
|
+
subStepId,
|
|
160
|
+
subStepRef,
|
|
161
|
+
isNestedSubStep: false,
|
|
162
|
+
};
|
|
163
|
+
const inheritedContext = Object.assign(Object.assign({}, useContext(FunnelSubStepContext)), { isNestedSubStep: true });
|
|
164
|
+
const context = inheritedContext.subStepId ? inheritedContext : newContext;
|
|
165
|
+
return React.createElement(FunnelSubStepContext.Provider, { value: context }, children);
|
|
165
166
|
};
|
|
166
167
|
//# sourceMappingURL=analytics-funnel.js.map
|
|
@@ -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, { useEffect, useRef, useState } from 'react';\n\nimport {\n FunnelStepContext,\n FunnelSubStepContext,\n FunnelContext,\n FunnelContextValue,\n FunnelStepContextValue,\n FunnelState,\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 '../';\nimport { FunnelProps, FunnelStepProps } from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\n\nexport const FUNNEL_VERSION = '1.0';\n\ntype AnalyticsFunnelProps = { children?: React.ReactNode } & Pick<\n FunnelProps,\n 'funnelType' | 'optionalStepNumbers' | 'totalFunnelSteps'\n>;\n\nexport const AnalyticsFunnel = ({ children, ...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 errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\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 // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const funnelInteractionId = FunnelMetrics.funnelStart({\n funnelNameSelector: getFunnelNameSelector(),\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 });\n\n setFunnelInteractionId(funnelInteractionId);\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 if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n FunnelMetrics.funnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId });\n } else {\n FunnelMetrics.funnelCancelled({ 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 FunnelMetrics.funnelComplete({ 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 };\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 = ({ children, stepNumber, stepNameSelector }: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelState } = useFunnel();\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\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 const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelInteractionId && funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n return () => {\n //eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelInteractionId && funnelState.current === 'default') {\n FunnelMetrics.funnelStepComplete({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n //eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, stepNumber, stepNameSelector]);\n\n const contextValue: FunnelStepContextValue = { funnelInteractionId, stepNumber, stepNameSelector, funnelStepProps };\n return (\n <FunnelStepContext.Provider value={contextValue}>\n {typeof children === 'function' ? children(contextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n children?: React.ReactNode;\n}\n\nexport const AnalyticsFunnelSubStep = ({ children }: AnalyticsFunnelSubStepProps) => {\n const { funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const subStepId = useUniqueId('substep');\n const subStepSelector = getSubStepSelector(subStepId);\n const subStepNameSelector = getSubStepNameSelector(subStepId);\n\n return (\n <FunnelSubStepContext.Provider\n value={{\n funnelInteractionId,\n stepNumber,\n stepNameSelector,\n subStepSelector,\n subStepNameSelector,\n subStepId,\n }}\n >\n {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 } 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 '../';\nimport { FunnelProps, FunnelStepProps } from '../interfaces';\n\nimport {\n DATA_ATTR_FUNNEL_STEP,\n getFunnelNameSelector,\n getNameFromSelector,\n getSubStepAllSelector,\n getSubStepNameSelector,\n getSubStepSelector,\n} from '../selectors';\n\nexport const FUNNEL_VERSION = '1.0';\n\ntype AnalyticsFunnelProps = { children?: React.ReactNode } & Pick<\n FunnelProps,\n 'funnelType' | 'optionalStepNumbers' | 'totalFunnelSteps'\n>;\n\nexport const AnalyticsFunnel = ({ children, ...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 errorCount = useRef<number>(0);\n const loadingButtonCount = useRef<number>(0);\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 // Reset the state, in case the component was re-mounted.\n funnelState.current = 'default';\n\n const funnelInteractionId = FunnelMetrics.funnelStart({\n funnelNameSelector: getFunnelNameSelector(),\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 });\n\n setFunnelInteractionId(funnelInteractionId);\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 if (funnelState.current === 'validating') {\n // Finish the validation phase early.\n FunnelMetrics.funnelComplete({ funnelInteractionId });\n funnelState.current = 'complete';\n }\n\n if (funnelState.current === 'complete') {\n FunnelMetrics.funnelSuccessful({ funnelInteractionId });\n } else {\n FunnelMetrics.funnelCancelled({ 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 FunnelMetrics.funnelComplete({ 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 };\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 = ({ children, stepNumber, stepNameSelector }: AnalyticsFunnelStepProps) => {\n const { funnelInteractionId, funnelState } = useFunnel();\n\n const funnelStepProps = { [DATA_ATTR_FUNNEL_STEP]: stepNumber };\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 const stepName = getNameFromSelector(stepNameSelector);\n\n if (funnelInteractionId && funnelState.current === 'default') {\n FunnelMetrics.funnelStepStart({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n\n return () => {\n //eslint-disable-next-line react-hooks/exhaustive-deps\n if (funnelInteractionId && funnelState.current === 'default') {\n FunnelMetrics.funnelStepComplete({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n //eslint-disable-next-line react-hooks/exhaustive-deps\n }, [funnelInteractionId, stepNumber, stepNameSelector]);\n\n const contextValue: FunnelStepContextValue = { stepNumber, stepNameSelector, funnelStepProps };\n return (\n <FunnelStepContext.Provider value={contextValue}>\n {typeof children === 'function' ? children(contextValue) : children}\n </FunnelStepContext.Provider>\n );\n};\ninterface AnalyticsFunnelSubStepProps {\n children?: 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\n const newContext: FunnelSubStepContextValue = {\n subStepSelector,\n subStepNameSelector,\n subStepId,\n subStepRef,\n isNestedSubStep: false,\n };\n\n const inheritedContext = { ...useContext(FunnelSubStepContext), isNestedSubStep: true };\n\n const context = inheritedContext.subStepId ? inheritedContext : newContext;\n\n return <FunnelSubStepContext.Provider value={context}>{children}</FunnelSubStepContext.Provider>;\n};\n"]}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { MutableRefObject, RefObject } from 'react';
|
|
2
2
|
import { FunnelType } from '../interfaces';
|
|
3
|
-
export interface BaseContextProps {
|
|
4
|
-
funnelInteractionId: string | undefined;
|
|
5
|
-
}
|
|
6
3
|
export type FunnelState = 'default' | 'validating' | 'complete' | 'cancelled';
|
|
7
|
-
export interface FunnelContextValue
|
|
4
|
+
export interface FunnelContextValue {
|
|
5
|
+
funnelInteractionId: string | undefined;
|
|
8
6
|
funnelType: FunnelType;
|
|
9
7
|
optionalStepNumbers: number[];
|
|
10
8
|
totalFunnelSteps: number;
|
|
@@ -17,16 +15,17 @@ export interface FunnelContextValue extends BaseContextProps {
|
|
|
17
15
|
errorCount: MutableRefObject<number>;
|
|
18
16
|
loadingButtonCount: MutableRefObject<number>;
|
|
19
17
|
}
|
|
20
|
-
export interface FunnelStepContextValue
|
|
18
|
+
export interface FunnelStepContextValue {
|
|
21
19
|
stepNameSelector: string;
|
|
22
20
|
stepNumber: number;
|
|
23
21
|
funnelStepProps?: Record<string, string | number | boolean | undefined>;
|
|
24
22
|
}
|
|
25
|
-
export interface FunnelSubStepContextValue
|
|
23
|
+
export interface FunnelSubStepContextValue {
|
|
26
24
|
subStepId: string;
|
|
27
25
|
subStepSelector: string;
|
|
28
26
|
subStepNameSelector: string;
|
|
29
|
-
|
|
27
|
+
subStepRef: MutableRefObject<HTMLDivElement | null>;
|
|
28
|
+
isNestedSubStep: boolean;
|
|
30
29
|
funnelSubStepProps?: Record<string, string | number | boolean | undefined>;
|
|
31
30
|
}
|
|
32
31
|
export declare const FunnelContext: import("react").Context<FunnelContextValue>;
|
|
@@ -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,
|
|
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;CAC9C;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;CACzE;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,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,6CAaxB,CAAC;AAEH,eAAO,MAAM,iBAAiB,iDAG5B,CAAC;AAEH,eAAO,MAAM,oBAAoB,oDAM/B,CAAC"}
|
|
@@ -17,18 +17,14 @@ export const FunnelContext = createContext({
|
|
|
17
17
|
loadingButtonCount: { current: 0 },
|
|
18
18
|
});
|
|
19
19
|
export const FunnelStepContext = createContext({
|
|
20
|
-
funnelInteractionId: undefined,
|
|
21
20
|
stepNameSelector: '',
|
|
22
21
|
stepNumber: 0,
|
|
23
|
-
funnelStepProps: {},
|
|
24
22
|
});
|
|
25
23
|
export const FunnelSubStepContext = createContext({
|
|
26
|
-
funnelInteractionId: undefined,
|
|
27
24
|
subStepId: '',
|
|
28
|
-
stepNumber: 0,
|
|
29
|
-
stepNameSelector: '',
|
|
30
25
|
subStepSelector: '',
|
|
31
26
|
subStepNameSelector: '',
|
|
32
|
-
|
|
27
|
+
subStepRef: { current: null },
|
|
28
|
+
isNestedSubStep: false,
|
|
33
29
|
});
|
|
34
30
|
//# sourceMappingURL=analytics-context.js.map
|
|
@@ -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;
|
|
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;AAmCnE,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;CACnC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG,aAAa,CAAyB;IACrE,gBAAgB,EAAE,EAAE;IACpB,UAAU,EAAE,CAAC;CACd,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;CACvB,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}\n\nexport interface FunnelStepContextValue {\n stepNameSelector: string;\n stepNumber: number;\n funnelStepProps?: Record<string, string | number | boolean | undefined>;\n}\n\nexport interface FunnelSubStepContextValue {\n subStepId: string;\n subStepSelector: string;\n subStepNameSelector: string;\n subStepRef: MutableRefObject<HTMLDivElement | null>;\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});\n\nexport const FunnelStepContext = createContext<FunnelStepContextValue>({\n stepNameSelector: '',\n stepNumber: 0,\n});\n\nexport const FunnelSubStepContext = createContext<FunnelSubStepContextValue>({\n subStepId: '',\n subStepSelector: '',\n subStepNameSelector: '',\n subStepRef: { current: null },\n isNestedSubStep: false,\n});\n"]}
|
|
@@ -9,16 +9,13 @@
|
|
|
9
9
|
* The subStepId is a unique identifier for the funnel sub-step.
|
|
10
10
|
* The subStepRef is a reference to the DOM element of the funnel sub-step.
|
|
11
11
|
*/
|
|
12
|
-
export declare const useFunnelSubStep: () => {
|
|
12
|
+
export declare const useFunnelSubStep: () => import("../context/analytics-context").FunnelSubStepContextValue | {
|
|
13
13
|
subStepId: string;
|
|
14
14
|
subStepSelector: string;
|
|
15
15
|
subStepNameSelector: string;
|
|
16
|
-
stepNumber: number;
|
|
17
|
-
funnelSubStepProps: Record<string, any>;
|
|
18
|
-
stepNameSelector: string;
|
|
19
|
-
funnelStepProps?: Record<string, string | number | boolean | undefined> | undefined;
|
|
20
|
-
funnelInteractionId: string | undefined;
|
|
21
16
|
subStepRef: import("react").MutableRefObject<HTMLDivElement | null>;
|
|
17
|
+
isNestedSubStep: boolean;
|
|
18
|
+
funnelSubStepProps: Record<string, any>;
|
|
22
19
|
};
|
|
23
20
|
/**
|
|
24
21
|
* Custom React Hook to manage and interact with FunnelStep.
|
|
@@ -37,6 +34,7 @@ export declare const useFunnelStep: () => import("../context/analytics-context")
|
|
|
37
34
|
* The 'data-analytics-funnel-interaction-id' property of funnelProps is used to track the unique identifier of the current interaction with the funnel.
|
|
38
35
|
*/
|
|
39
36
|
export declare const useFunnel: () => {
|
|
37
|
+
funnelInteractionId: string | undefined;
|
|
40
38
|
funnelType: import("../interfaces").FunnelType;
|
|
41
39
|
optionalStepNumbers: number[];
|
|
42
40
|
totalFunnelSteps: number;
|
|
@@ -48,7 +46,6 @@ export declare const useFunnel: () => {
|
|
|
48
46
|
funnelState: import("react").RefObject<import("../context/analytics-context").FunnelState>;
|
|
49
47
|
errorCount: import("react").MutableRefObject<number>;
|
|
50
48
|
loadingButtonCount: import("react").MutableRefObject<number>;
|
|
51
|
-
funnelInteractionId: string | undefined;
|
|
52
49
|
funnelProps: Record<string, string | number | boolean | undefined>;
|
|
53
50
|
};
|
|
54
51
|
//# sourceMappingURL=use-funnel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAQA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB
|
|
1
|
+
{"version":3,"file":"use-funnel.d.ts","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":";AAQA;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;;;;;CAuD5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,qEAGzB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;CASrB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import { useContext
|
|
3
|
+
import { useContext } from 'react';
|
|
4
4
|
import { FunnelContext, FunnelStepContext, FunnelSubStepContext } from '../context/analytics-context';
|
|
5
5
|
import { DATA_ATTR_FUNNEL_INTERACTION_ID, DATA_ATTR_FUNNEL_SUBSTEP, getSubStepAllSelector } from '../selectors';
|
|
6
6
|
import { FunnelMetrics } from '../';
|
|
@@ -15,15 +15,17 @@ import { FunnelMetrics } from '../';
|
|
|
15
15
|
* The subStepRef is a reference to the DOM element of the funnel sub-step.
|
|
16
16
|
*/
|
|
17
17
|
export const useFunnelSubStep = () => {
|
|
18
|
-
const subStepRef = useRef(null);
|
|
19
18
|
const context = useContext(FunnelSubStepContext);
|
|
20
|
-
const { funnelInteractionId,
|
|
21
|
-
const {
|
|
19
|
+
const { funnelInteractionId, funnelState } = useFunnel();
|
|
20
|
+
const { stepNumber, stepNameSelector } = useFunnelStep();
|
|
21
|
+
const { subStepId, subStepSelector, subStepNameSelector, subStepRef, isNestedSubStep } = context;
|
|
22
|
+
if (isNestedSubStep) {
|
|
23
|
+
return context;
|
|
24
|
+
}
|
|
22
25
|
const onFocus = (event) => {
|
|
23
26
|
if (funnelInteractionId &&
|
|
24
27
|
subStepRef.current &&
|
|
25
|
-
(!event.relatedTarget || !subStepRef.current.contains(event.relatedTarget))
|
|
26
|
-
funnelState.current === 'default') {
|
|
28
|
+
(!event.relatedTarget || !subStepRef.current.contains(event.relatedTarget))) {
|
|
27
29
|
FunnelMetrics.funnelSubStepStart({
|
|
28
30
|
funnelInteractionId,
|
|
29
31
|
subStepSelector,
|
|
@@ -56,7 +58,7 @@ export const useFunnelSubStep = () => {
|
|
|
56
58
|
onBlur,
|
|
57
59
|
}
|
|
58
60
|
: {};
|
|
59
|
-
return Object.assign({ funnelSubStepProps
|
|
61
|
+
return Object.assign({ funnelSubStepProps }, context);
|
|
60
62
|
};
|
|
61
63
|
/**
|
|
62
64
|
* Custom React Hook to manage and interact with FunnelStep.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"use-funnel.js","sourceRoot":"lib/default/","sources":["internal/analytics/hooks/use-funnel.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACtG,OAAO,EAAE,+BAA+B,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAChH,OAAO,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC;AAEpC;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACjD,MAAM,EAAE,mBAAmB,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,CAAC;IACzD,MAAM,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,aAAa,EAAE,CAAC;IAEzD,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,mBAAmB,EAAE,UAAU,EAAE,eAAe,EAAE,GAAG,OAAO,CAAC;IAEjG,IAAI,eAAe,EAAE;QACnB,OAAO,OAAO,CAAC;KAChB;IAED,MAAM,OAAO,GAAG,CAAC,KAAuC,EAAE,EAAE;QAC1D,IACE,mBAAmB;YACnB,UAAU,CAAC,OAAO;YAClB,CAAC,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,CAAC,EACnF;YACA,aAAa,CAAC,kBAAkB,CAAC;gBAC/B,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,KAAuC,EAAE,EAAE;QACzD,IACE,mBAAmB;YACnB,UAAU,CAAC,OAAO;YAClB,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC;YACjD,WAAW,CAAC,OAAO,KAAK,SAAS,EACjC;YACA,aAAa,CAAC,qBAAqB,CAAC;gBAClC,mBAAmB;gBACnB,eAAe;gBACf,mBAAmB;gBACnB,UAAU;gBACV,gBAAgB;gBAChB,kBAAkB,EAAE,qBAAqB,EAAE;aAC5C,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAwB,mBAAmB;QACjE,CAAC,CAAC;YACE,CAAC,wBAAwB,CAAC,EAAE,SAAS;YACrC,OAAO;YACP,MAAM;SACP;QACH,CAAC,CAAC,EAAE,CAAC;IAEP,uBAAS,kBAAkB,IAAK,OAAO,EAAG;AAC5C,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,OAAO,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC9C,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IAC1C,MAAM,WAAW,GAA0D,OAAO,CAAC,mBAAmB;QACpG,CAAC,CAAC;YACE,CAAC,+BAA+B,CAAC,EAAE,OAAO,CAAC,mBAAmB;SAC/D;QACH,CAAC,CAAC,EAAE,CAAC;IAEP,uBAAS,WAAW,IAAK,OAAO,EAAG;AACrC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useContext } from 'react';\nimport { FunnelContext, FunnelStepContext, FunnelSubStepContext } from '../context/analytics-context';\nimport { DATA_ATTR_FUNNEL_INTERACTION_ID, DATA_ATTR_FUNNEL_SUBSTEP, getSubStepAllSelector } from '../selectors';\nimport { FunnelMetrics } from '../';\n\n/**\n * Custom React Hook to manage and interact with FunnelSubStep.\n * This hook will provide necessary properties and methods required\n * to track and manage interactions with a FunnelSubStep component.\n *\n * The `onFocus` method is used to track the beginning of interaction with the FunnelSubStep.\n * The `onBlur` method is used to track the completion of interaction with the FunnelSubStep.\n * The subStepId is a unique identifier for the funnel sub-step.\n * The subStepRef is a reference to the DOM element of the funnel sub-step.\n */\nexport const useFunnelSubStep = () => {\n const context = useContext(FunnelSubStepContext);\n const { funnelInteractionId, funnelState } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n\n const { subStepId, subStepSelector, subStepNameSelector, subStepRef, isNestedSubStep } = context;\n\n if (isNestedSubStep) {\n return context;\n }\n\n const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n if (\n funnelInteractionId &&\n subStepRef.current &&\n (!event.relatedTarget || !subStepRef.current.contains(event.relatedTarget as Node))\n ) {\n FunnelMetrics.funnelSubStepStart({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const onBlur = (event: React.FocusEvent<HTMLDivElement>) => {\n if (\n funnelInteractionId &&\n subStepRef.current &&\n !subStepRef.current.contains(event.relatedTarget) &&\n funnelState.current === 'default'\n ) {\n FunnelMetrics.funnelSubStepComplete({\n funnelInteractionId,\n subStepSelector,\n subStepNameSelector,\n stepNumber,\n stepNameSelector,\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n };\n\n const funnelSubStepProps: Record<string, any> = funnelInteractionId\n ? {\n [DATA_ATTR_FUNNEL_SUBSTEP]: subStepId,\n onFocus,\n onBlur,\n }\n : {};\n\n return { funnelSubStepProps, ...context };\n};\n\n/**\n * Custom React Hook to manage and interact with FunnelStep.\n * This hook will provide necessary properties required to track\n * and manage interactions with a FunnelStep component.\n *\n * The 'data-analytics-funnel-step' property of funnelStepProps is used to track the index of the current step in the funnel.\n * The context contains additional properties of the FunnelStep.\n */\nexport const useFunnelStep = () => {\n const context = useContext(FunnelStepContext);\n return context;\n};\n\n/**\n * Custom React Hook to manage and interact with Funnel.\n * This hook will provide necessary properties required to track\n * and manage interactions with a Funnel component.\n *\n * The 'data-analytics-funnel-interaction-id' property of funnelProps is used to track the unique identifier of the current interaction with the funnel.\n */\nexport const useFunnel = () => {\n const context = useContext(FunnelContext);\n const funnelProps: Record<string, string | number | boolean | undefined> = context.funnelInteractionId\n ? {\n [DATA_ATTR_FUNNEL_INTERACTION_ID]: context.funnelInteractionId,\n }\n : {};\n\n return { funnelProps, ...context };\n};\n"]}
|
|
@@ -375,11 +375,11 @@
|
|
|
375
375
|
--font-body-s-line-height-ga8tt7:16px;
|
|
376
376
|
--font-body-s-size-6jmxer:12px;
|
|
377
377
|
--font-button-letter-spacing-b8z34c:0.005em;
|
|
378
|
-
--font-button-weight-
|
|
378
|
+
--font-button-weight-44nug7:700;
|
|
379
379
|
--font-chart-detail-size-gtiv3j:12px;
|
|
380
380
|
--font-display-l-letter-spacing-38ceja:-0.03em;
|
|
381
|
-
--font-display-l-line-height-
|
|
382
|
-
--font-display-l-size-
|
|
381
|
+
--font-display-l-line-height-t013st:48px;
|
|
382
|
+
--font-display-l-size-mxgvv1:42px;
|
|
383
383
|
--font-display-label-weight-io22e5:700;
|
|
384
384
|
--font-expandable-heading-size-mkp9vq:16px;
|
|
385
385
|
--font-family-base-wn913o:"Open Sans", "Helvetica Neue", Roboto, Arial, sans-serif;
|
|
@@ -387,39 +387,39 @@
|
|
|
387
387
|
--font-header-h2-description-line-height-9j5c3z:20px;
|
|
388
388
|
--font-header-h2-description-size-nsq214:14px;
|
|
389
389
|
--font-heading-l-letter-spacing-usq225:-0.015em;
|
|
390
|
-
--font-heading-l-line-height-
|
|
391
|
-
--font-heading-l-size-
|
|
392
|
-
--font-heading-l-weight-
|
|
390
|
+
--font-heading-l-line-height-ig1b8t:24px;
|
|
391
|
+
--font-heading-l-size-5kjk8n:20px;
|
|
392
|
+
--font-heading-l-weight-klyszd:700;
|
|
393
393
|
--font-heading-m-letter-spacing-rsatez:-0.010em;
|
|
394
|
-
--font-heading-m-line-height-
|
|
395
|
-
--font-heading-m-size-
|
|
396
|
-
--font-heading-m-weight-
|
|
394
|
+
--font-heading-m-line-height-ust616:22px;
|
|
395
|
+
--font-heading-m-size-9serd6:18px;
|
|
396
|
+
--font-heading-m-weight-wrlbs5:700;
|
|
397
397
|
--font-heading-s-letter-spacing-j4vcrt:-0.005em;
|
|
398
398
|
--font-heading-s-line-height-uruujc:20px;
|
|
399
399
|
--font-heading-s-size-ep2ts9:16px;
|
|
400
|
-
--font-heading-s-weight-
|
|
400
|
+
--font-heading-s-weight-fzc30w:700;
|
|
401
401
|
--font-heading-xl-letter-spacing-zxoemo:-0.02em;
|
|
402
|
-
--font-heading-xl-line-height-
|
|
403
|
-
--font-heading-xl-size-
|
|
404
|
-
--font-heading-xl-weight-
|
|
402
|
+
--font-heading-xl-line-height-r72brj:30px;
|
|
403
|
+
--font-heading-xl-size-z2wrdj:24px;
|
|
404
|
+
--font-heading-xl-weight-icfx0r:700;
|
|
405
405
|
--font-heading-xs-line-height-yt5y4b:18px;
|
|
406
406
|
--font-heading-xs-size-2ai9la:14px;
|
|
407
|
-
--font-heading-xs-weight-
|
|
408
|
-
--font-box-value-large-weight-
|
|
407
|
+
--font-heading-xs-weight-xog3y8:700;
|
|
408
|
+
--font-box-value-large-weight-rm36ji:700;
|
|
409
409
|
--font-link-button-letter-spacing-2e8gx8:0.005em;
|
|
410
|
-
--font-link-button-weight-
|
|
410
|
+
--font-link-button-weight-xa7tgb:700;
|
|
411
411
|
--font-link-primary-decoration-gru46w:underline;
|
|
412
412
|
--font-link-primary-letter-spacing-zpfgrc:"inherit";
|
|
413
413
|
--font-link-primary-weight-tj5hoh:"inherit";
|
|
414
|
-
--font-panel-header-line-height-
|
|
415
|
-
--font-panel-header-size-
|
|
414
|
+
--font-panel-header-line-height-pqpwyv:22px;
|
|
415
|
+
--font-panel-header-size-ey4ywd:18px;
|
|
416
416
|
--font-smoothing-webkit-fyh4as:antialiased;
|
|
417
417
|
--font-smoothing-moz-osx-pa2uqe:grayscale;
|
|
418
|
-
--font-tabs-disabled-weight-
|
|
418
|
+
--font-tabs-disabled-weight-8w3z0i:700;
|
|
419
419
|
--font-tabs-line-height-hrscyg:20px;
|
|
420
420
|
--font-tabs-size-rcrn41:16px;
|
|
421
|
-
--font-wayfinding-link-active-weight-
|
|
422
|
-
--font-weight-heavy-
|
|
421
|
+
--font-wayfinding-link-active-weight-frdnvo:700;
|
|
422
|
+
--font-weight-heavy-gd0ixk:700;
|
|
423
423
|
--border-active-width-il32zr:4px;
|
|
424
424
|
--border-code-editor-status-divider-width-ku6xb1:2px;
|
|
425
425
|
--border-container-sticky-width-3mz641:0px;
|
|
@@ -506,18 +506,21 @@
|
|
|
506
506
|
--space-alert-message-right-221e5g:4px;
|
|
507
507
|
--space-alert-vertical-83u3il:8px;
|
|
508
508
|
--space-button-focus-outline-gutter-txnpcq:4px;
|
|
509
|
+
--space-button-horizontal-qj3pgb:20px;
|
|
509
510
|
--space-button-icon-focus-outline-gutter-vertical-omhhky:0px;
|
|
510
511
|
--space-button-icon-only-horizontal-k5a18g:6px;
|
|
511
512
|
--space-button-inline-icon-focus-outline-gutter-0bswpj:0px;
|
|
512
|
-
--space-button-modal-dismiss-vertical-
|
|
513
|
+
--space-button-modal-dismiss-vertical-nbiqb6:2px;
|
|
513
514
|
--space-calendar-grid-focus-outline-gutter-reev1c:-5px;
|
|
514
515
|
--space-calendar-grid-selected-focus-outline-gutter-u5weg4:-5px;
|
|
515
516
|
--space-card-horizontal-5nogdm:20px;
|
|
517
|
+
--space-card-vertical-c5n43f:16px;
|
|
516
518
|
--space-code-editor-status-focus-outline-gutter-m3gwa3:-7px;
|
|
517
|
-
--space-container-content-top-
|
|
518
|
-
--space-container-header-
|
|
519
|
+
--space-container-content-top-ezlmse:4px;
|
|
520
|
+
--space-container-header-top-a9tz2a:12px;
|
|
521
|
+
--space-container-header-bottom-f79ib3:8px;
|
|
519
522
|
--space-container-horizontal-jxdgil:20px;
|
|
520
|
-
--space-content-header-padding-bottom-
|
|
523
|
+
--space-content-header-padding-bottom-3kdnde:16px;
|
|
521
524
|
--space-dark-header-overlap-distance-l9lxfl:36px;
|
|
522
525
|
--space-expandable-section-icon-offset-top-qfofw6:4px;
|
|
523
526
|
--space-field-horizontal-8qo3uw:12px;
|
|
@@ -540,16 +543,16 @@
|
|
|
540
543
|
--space-panel-side-right-zzgkuy:24px;
|
|
541
544
|
--space-panel-split-top-yyup9h:20px;
|
|
542
545
|
--space-segmented-control-focus-outline-gutter-5rc7c3:4px;
|
|
543
|
-
--space-table-header-focus-outline-gutter-vket9r:0px;
|
|
544
546
|
--space-tabs-content-top-ql9865:12px;
|
|
545
|
-
--space-
|
|
546
|
-
--space-table-header-horizontal-gb3iyt:0px;
|
|
547
|
+
--space-tabs-focus-outline-gutter-tauev7:-8px;
|
|
547
548
|
--space-table-content-bottom-xssi3v:4px;
|
|
548
|
-
--space-table-content-top-7kuusn:12px;
|
|
549
|
-
--space-table-embedded-content-bottom-6xvajo:0px;
|
|
550
549
|
--space-table-embedded-header-top-mtzve4:0px;
|
|
551
550
|
--space-table-footer-horizontal-u2o8yq:0px;
|
|
552
|
-
--space-
|
|
551
|
+
--space-table-header-focus-outline-gutter-vket9r:0px;
|
|
552
|
+
--space-table-header-horizontal-gb3iyt:0px;
|
|
553
|
+
--space-table-header-tools-bottom-u3xvv0:0px;
|
|
554
|
+
--space-table-header-tools-full-page-bottom-4uhg4l:4px;
|
|
555
|
+
--space-table-horizontal-8ca8r3:20px;
|
|
553
556
|
--space-scaled-2x-xxs-0k2v6n:4px;
|
|
554
557
|
--space-scaled-2x-m-lwig8x:16px;
|
|
555
558
|
--space-scaled-2x-l-qun137:20px;
|
|
@@ -961,8 +964,12 @@
|
|
|
961
964
|
--size-vertical-input-pta06y:28px;
|
|
962
965
|
--size-vertical-panel-icon-offset-zd2rli:13px;
|
|
963
966
|
--space-alert-vertical-83u3il:4px;
|
|
967
|
+
--space-button-horizontal-qj3pgb:16px;
|
|
964
968
|
--space-button-icon-only-horizontal-k5a18g:4px;
|
|
965
|
-
--space-
|
|
969
|
+
--space-button-modal-dismiss-vertical-nbiqb6:0px;
|
|
970
|
+
--space-card-vertical-c5n43f:12px;
|
|
971
|
+
--space-container-header-bottom-f79ib3:4px;
|
|
972
|
+
--space-content-header-padding-bottom-3kdnde:12px;
|
|
966
973
|
--space-dark-header-overlap-distance-l9lxfl:32px;
|
|
967
974
|
--space-expandable-section-icon-offset-top-qfofw6:0px;
|
|
968
975
|
--space-grid-gutter-s46zha:16px;
|
|
@@ -971,9 +978,8 @@
|
|
|
971
978
|
--space-modal-content-bottom-4lprrr:8px;
|
|
972
979
|
--space-panel-side-right-zzgkuy:20px;
|
|
973
980
|
--space-panel-split-top-yyup9h:16px;
|
|
974
|
-
--space-table-header-focus-outline-gutter-vket9r:-1px;
|
|
975
981
|
--space-tabs-content-top-ql9865:8px;
|
|
976
|
-
--space-table-
|
|
982
|
+
--space-table-header-focus-outline-gutter-vket9r:-1px;
|
|
977
983
|
--space-scaled-2x-xxs-0k2v6n:0px;
|
|
978
984
|
--space-scaled-2x-m-lwig8x:8px;
|
|
979
985
|
--space-scaled-2x-l-qun137:12px;
|
|
@@ -1013,11 +1019,15 @@
|
|
|
1013
1019
|
.awsui-context-compact-table:not(#\9) {
|
|
1014
1020
|
--size-vertical-input-pta06y:28px;
|
|
1015
1021
|
--space-alert-vertical-83u3il:4px;
|
|
1022
|
+
--space-button-horizontal-qj3pgb:16px;
|
|
1023
|
+
--space-button-modal-dismiss-vertical-nbiqb6:0px;
|
|
1024
|
+
--space-card-vertical-c5n43f:12px;
|
|
1025
|
+
--space-container-header-bottom-f79ib3:4px;
|
|
1026
|
+
--space-content-header-padding-bottom-3kdnde:12px;
|
|
1016
1027
|
--space-layout-toggle-padding-dhzjwp:16px;
|
|
1017
1028
|
--space-panel-side-right-zzgkuy:20px;
|
|
1018
1029
|
--space-panel-split-top-yyup9h:16px;
|
|
1019
1030
|
--space-tabs-content-top-ql9865:8px;
|
|
1020
|
-
--space-table-content-top-7kuusn:8px;
|
|
1021
1031
|
--space-scaled-xxxs-jdgipl:0px;
|
|
1022
1032
|
--space-scaled-xxs-t2t62i:2px;
|
|
1023
1033
|
--space-scaled-xs-wbfgrv:4px;
|
|
@@ -9,7 +9,8 @@ export interface ButtonTriggerProps extends BaseComponentProps {
|
|
|
9
9
|
readOnly?: boolean;
|
|
10
10
|
invalid?: boolean;
|
|
11
11
|
inFilteringToken?: boolean;
|
|
12
|
-
ariaHasPopup?: 'true' | 'listbox';
|
|
12
|
+
ariaHasPopup?: 'true' | 'listbox' | 'dialog';
|
|
13
|
+
ariaControls?: string;
|
|
13
14
|
ariaLabel?: string;
|
|
14
15
|
ariaLabelledby?: string;
|
|
15
16
|
ariaDescribedby?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/button-trigger/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAGxE,OAAO,EAA0C,sBAAsB,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7G,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/button-trigger/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAGxE,OAAO,EAA0C,sBAAsB,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7G,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAChD,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,MAAM,CAAC,EAAE,sBAAsB,CAAC;QAAE,aAAa,EAAE,IAAI,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IAChE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAyED,yBAAiB,kBAAkB,CAAC;IAClC,UAAiB,GAAG;QAClB,KAAK,IAAI,IAAI,CAAC;KACf;CACF;;AAED,wBAA+C"}
|
|
@@ -8,9 +8,9 @@ import InternalIcon from '../../../icon/internal';
|
|
|
8
8
|
import styles from './styles.css.js';
|
|
9
9
|
import { fireKeyboardEvent, fireCancelableEvent } from '../../events';
|
|
10
10
|
const ButtonTrigger = (_a, ref) => {
|
|
11
|
-
var { children, pressed = false, hideCaret = false, disabled = false, readOnly = false, invalid = false, inFilteringToken, ariaHasPopup, ariaLabel, ariaLabelledby, ariaDescribedby, onKeyDown, onKeyUp, onMouseDown, onClick, onFocus, onBlur, autoFocus } = _a, restProps = __rest(_a, ["children", "pressed", "hideCaret", "disabled", "readOnly", "invalid", "inFilteringToken", "ariaHasPopup", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "onKeyDown", "onKeyUp", "onMouseDown", "onClick", "onFocus", "onBlur", "autoFocus"]);
|
|
11
|
+
var { children, pressed = false, hideCaret = false, disabled = false, readOnly = false, invalid = false, inFilteringToken, ariaHasPopup, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onKeyDown, onKeyUp, onMouseDown, onClick, onFocus, onBlur, autoFocus } = _a, restProps = __rest(_a, ["children", "pressed", "hideCaret", "disabled", "readOnly", "invalid", "inFilteringToken", "ariaHasPopup", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "ariaControls", "onKeyDown", "onKeyUp", "onMouseDown", "onClick", "onFocus", "onBlur", "autoFocus"]);
|
|
12
12
|
const baseProps = getBaseProps(restProps);
|
|
13
|
-
const attributes = Object.assign(Object.assign({}, baseProps), { type: 'button', className: clsx(styles['button-trigger'], baseProps.className, pressed && styles.pressed, disabled && styles.disabled, invalid && styles.invalid, !hideCaret && styles['has-caret'], readOnly && styles['read-only'], inFilteringToken && styles['in-filtering-token']), disabled: disabled || readOnly, 'aria-expanded': pressed, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, 'aria-haspopup': ariaHasPopup !== null && ariaHasPopup !== void 0 ? ariaHasPopup : 'listbox', onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)), onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)), onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)), onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)), onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)), onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)), autoFocus });
|
|
13
|
+
const attributes = Object.assign(Object.assign({}, baseProps), { type: 'button', className: clsx(styles['button-trigger'], baseProps.className, pressed && styles.pressed, disabled && styles.disabled, invalid && styles.invalid, !hideCaret && styles['has-caret'], readOnly && styles['read-only'], inFilteringToken && styles['in-filtering-token']), disabled: disabled || readOnly, 'aria-expanded': pressed, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, 'aria-haspopup': ariaHasPopup !== null && ariaHasPopup !== void 0 ? ariaHasPopup : 'listbox', 'aria-controls': ariaControls, onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)), onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)), onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)), onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)), onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)), onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)), autoFocus });
|
|
14
14
|
if (invalid) {
|
|
15
15
|
attributes['aria-invalid'] = invalid;
|
|
16
16
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/button-trigger/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAyC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/button-trigger/index.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, { ButtonHTMLAttributes } from 'react';\nimport clsx from 'clsx';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport InternalIcon from '../../../icon/internal';\nimport styles from './styles.css.js';\nimport { fireKeyboardEvent, fireCancelableEvent, CancelableEventHandler, BaseKeyDetail } from '../../events';\n\nexport interface ButtonTriggerProps extends BaseComponentProps {\n children?: React.ReactNode;\n pressed?: boolean;\n hideCaret?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n invalid?: boolean;\n inFilteringToken?: boolean;\n ariaHasPopup?: 'true' | 'listbox' | 'dialog';\n ariaControls?: string;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n onKeyDown?: CancelableEventHandler<BaseKeyDetail>;\n onKeyUp?: CancelableEventHandler<BaseKeyDetail>;\n onMouseDown?: CancelableEventHandler;\n onClick?: CancelableEventHandler;\n onFocus?: CancelableEventHandler;\n onBlur?: CancelableEventHandler<{ relatedTarget: Node | null }>;\n autoFocus?: boolean;\n}\n\nconst ButtonTrigger = (\n {\n children,\n pressed = false,\n hideCaret = false,\n disabled = false,\n readOnly = false,\n invalid = false,\n inFilteringToken,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaControls,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onClick,\n onFocus,\n onBlur,\n autoFocus,\n ...restProps\n }: ButtonTriggerProps,\n ref: React.Ref<HTMLButtonElement>\n) => {\n const baseProps = getBaseProps(restProps);\n const attributes: ButtonHTMLAttributes<HTMLButtonElement> = {\n ...baseProps,\n type: 'button',\n className: clsx(\n styles['button-trigger'],\n baseProps.className,\n pressed && styles.pressed,\n disabled && styles.disabled,\n invalid && styles.invalid,\n !hideCaret && styles['has-caret'],\n readOnly && styles['read-only'],\n inFilteringToken && styles['in-filtering-token']\n ),\n disabled: disabled || readOnly,\n 'aria-expanded': pressed,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-haspopup': ariaHasPopup ?? 'listbox',\n 'aria-controls': ariaControls,\n onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)),\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)),\n onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)),\n onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)),\n onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)),\n autoFocus,\n };\n\n if (invalid) {\n attributes['aria-invalid'] = invalid;\n }\n\n return (\n <button ref={ref} {...attributes}>\n {children}\n {!hideCaret && (\n <span className={styles.arrow}>\n <InternalIcon name=\"caret-down-filled\" variant={disabled ? 'disabled' : 'normal'} />\n </span>\n )}\n </button>\n );\n};\n\nexport namespace ButtonTriggerProps {\n export interface Ref {\n focus(): void;\n }\n}\n\nexport default React.forwardRef(ButtonTrigger);\n"]}
|