@activecollab/components 1.0.183 → 1.0.184
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/dist/cjs/components/Wizard/Step.js +5 -3
- package/dist/cjs/components/Wizard/Step.js.map +1 -1
- package/dist/cjs/components/Wizard/Wizard.js +31 -9
- package/dist/cjs/components/Wizard/Wizard.js.map +1 -1
- package/dist/cjs/components/Wizard/context/index.js.map +1 -1
- package/dist/esm/components/Wizard/Step.d.ts +1 -0
- package/dist/esm/components/Wizard/Step.d.ts.map +1 -1
- package/dist/esm/components/Wizard/Step.js +5 -3
- package/dist/esm/components/Wizard/Step.js.map +1 -1
- package/dist/esm/components/Wizard/Wizard.d.ts.map +1 -1
- package/dist/esm/components/Wizard/Wizard.js +23 -9
- package/dist/esm/components/Wizard/Wizard.js.map +1 -1
- package/dist/esm/components/Wizard/context/index.d.ts +2 -0
- package/dist/esm/components/Wizard/context/index.d.ts.map +1 -1
- package/dist/esm/components/Wizard/context/index.js.map +1 -1
- package/dist/index.js +28 -12
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -39,7 +39,9 @@ var Step = function Step(_ref) {
|
|
|
39
39
|
_ref$shouldRenderNext = _ref.shouldRenderNextButton,
|
|
40
40
|
shouldRenderNextButton = _ref$shouldRenderNext === void 0 ? true : _ref$shouldRenderNext,
|
|
41
41
|
_ref$changingStepInPr = _ref.changingStepInProgress,
|
|
42
|
-
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr
|
|
42
|
+
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr,
|
|
43
|
+
_ref$skip = _ref.skip,
|
|
44
|
+
skip = _ref$skip === void 0 ? false : _ref$skip;
|
|
43
45
|
var onActionButtonClick = (0, _react.useCallback)(function () {
|
|
44
46
|
if (isLast && onClose) {
|
|
45
47
|
return onClose();
|
|
@@ -47,7 +49,7 @@ var Step = function Step(_ref) {
|
|
|
47
49
|
|
|
48
50
|
return onNextButtonClick && onNextButtonClick();
|
|
49
51
|
}, [isLast, onClose, onNextButtonClick]);
|
|
50
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledStepHeader, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/_react.default.createElement(_Button.Button, {
|
|
52
|
+
return !skip ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledStepHeader, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/_react.default.createElement(_Button.Button, {
|
|
51
53
|
onClick: onPreviousButtonClick,
|
|
52
54
|
variant: "text gray",
|
|
53
55
|
className: "tw--ml-3 tw-mr-2",
|
|
@@ -60,7 +62,7 @@ var Step = function Step(_ref) {
|
|
|
60
62
|
isLast: isLast,
|
|
61
63
|
actionLabel: actionLabel,
|
|
62
64
|
onNextButtonClick: onActionButtonClick
|
|
63
|
-
}))) : /*#__PURE__*/_react.default.createElement(_Styles.StyledCustomStep, null, children));
|
|
65
|
+
}))) : /*#__PURE__*/_react.default.createElement(_Styles.StyledCustomStep, null, children)) : null;
|
|
64
66
|
};
|
|
65
67
|
|
|
66
68
|
exports.Step = Step;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Wizard/Step.tsx"],"names":["Step","index","isLast","subtitle","title","onNextButtonClick","onPreviousButtonClick","onClose","children","actionLabel","shouldRenderNextButton","changingStepInProgress","onActionButtonClick","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Wizard/Step.tsx"],"names":["Step","index","isLast","subtitle","title","onNextButtonClick","onPreviousButtonClick","onClose","children","actionLabel","shouldRenderNextButton","changingStepInProgress","skip","onActionButtonClick","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAsBO,IAAMA,IAAe,GAAG,SAAlBA,IAAkB,OAazB;AAAA,MAZJC,KAYI,QAZJA,KAYI;AAAA,MAXJC,MAWI,QAXJA,MAWI;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,KASI,QATJA,KASI;AAAA,MARJC,iBAQI,QARJA,iBAQI;AAAA,MAPJC,qBAOI,QAPJA,qBAOI;AAAA,MANJC,OAMI,QANJA,OAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,8BAJJC,WAII;AAAA,MAJJA,WAII,iCAJU,SAIV;AAAA,mCAHJC,sBAGI;AAAA,MAHJA,sBAGI,sCAHqB,IAGrB;AAAA,mCAFJC,sBAEI;AAAA,MAFJA,sBAEI,sCAFqB,KAErB;AAAA,uBADJC,IACI;AAAA,MADJA,IACI,0BADG,KACH;AACJ,MAAMC,mBAAmB,GAAG,wBAAY,YAAM;AAC5C,QAAIX,MAAM,IAAIK,OAAd,EAAuB;AACrB,aAAOA,OAAO,EAAd;AACD;;AAED,WAAOF,iBAAiB,IAAIA,iBAAiB,EAA7C;AACD,GAN2B,EAMzB,CAACH,MAAD,EAASK,OAAT,EAAkBF,iBAAlB,CANyB,CAA5B;AAQA,SAAO,CAACO,IAAD,gBACL,yEACE,6BAAC,wBAAD,qBACE,6BAAC,4BAAD,QACGX,KAAK,IAAIA,KAAK,GAAG,CAAjB,gBACC,6BAAC,cAAD;AACE,IAAA,OAAO,EAAEK,qBADX;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,SAAS,EAAC,kBAHZ;AAIE,IAAA,QAAQ,EAAEK;AAJZ,kBAME,6BAAC,0BAAD,OANF,CADD,GASG,IAVN,eAWE,6BAAC,uBAAD,qBACE,6BAAC,oBAAD,QAAWP,KAAX,CADF,eAEE,6BAAC,mBAAD,QAAUD,QAAV,CAFF,CAXF,CADF,eAiBE,6BAAC,cAAD;AACE,IAAA,OAAO,EAAEI,OADX;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,QAAQ,EAAEI;AAHZ,kBAKE,6BAAC,sBAAD,OALF,CAjBF,CADF,eA0BE,6BAAC,4BAAD,OA1BF,EA2BGD,sBAAsB,gBACrB,yEACE,6BAAC,qBAAD,QAAgBF,QAAhB,CADF,eAEE,6BAAC,4BAAD,OAFF,eAGE,6BAAC,qBAAD,qBACE,6BAAC,kCAAD;AACE,IAAA,MAAM,EAAEN,MADV;AAEE,IAAA,WAAW,EAAEO,WAFf;AAGE,IAAA,iBAAiB,EAAEI;AAHrB,IADF,CAHF,CADqB,gBAarB,6BAAC,wBAAD,QAAmBL,QAAnB,CAxCJ,CADK,GA4CH,IA5CJ;AA6CD,CAnEM;;;AAqEPR,IAAI,CAACc,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { FC, ReactNode, useCallback } from \"react\";\nimport { Button } from \"../Button\";\nimport { ArrowBackMobileIcon, CancelCrossIcon } from \"../Icons\";\nimport { StepActionButton } from \"./StepActionButton\";\nimport { DialogActions, DialogContent, DialogContentDivider } from \"../Dialog\";\nimport { Caption2, Header3 } from \"../Typography\";\nimport {\n StyledStepTitle,\n StyledStepHeaderLeft,\n StyledStepHeader,\n StyledCustomStep,\n} from \"./Styles\";\n\nexport interface IStep {\n index?: number;\n isLast?: boolean;\n subtitle: string;\n title?: string;\n onNextButtonClick?: () => void;\n onPreviousButtonClick?: () => void;\n onClose?: () => void;\n children: ReactNode;\n actionLabel?: string;\n shouldRenderNextButton?: boolean;\n changingStepInProgress?: boolean;\n skip?: boolean;\n}\n\nexport const Step: FC<IStep> = ({\n index,\n isLast,\n subtitle,\n title,\n onNextButtonClick,\n onPreviousButtonClick,\n onClose,\n children,\n actionLabel = \"Proceed\",\n shouldRenderNextButton = true,\n changingStepInProgress = false,\n skip = false,\n}) => {\n const onActionButtonClick = useCallback(() => {\n if (isLast && onClose) {\n return onClose();\n }\n\n return onNextButtonClick && onNextButtonClick();\n }, [isLast, onClose, onNextButtonClick]);\n\n return !skip ? (\n <>\n <StyledStepHeader>\n <StyledStepHeaderLeft>\n {index && index > 0 ? (\n <Button\n onClick={onPreviousButtonClick}\n variant=\"text gray\"\n className=\"tw--ml-3 tw-mr-2\"\n disabled={changingStepInProgress}\n >\n <ArrowBackMobileIcon />\n </Button>\n ) : null}\n <StyledStepTitle>\n <Caption2>{title}</Caption2>\n <Header3>{subtitle}</Header3>\n </StyledStepTitle>\n </StyledStepHeaderLeft>\n <Button\n onClick={onClose}\n variant=\"text gray\"\n disabled={changingStepInProgress}\n >\n <CancelCrossIcon />\n </Button>\n </StyledStepHeader>\n <DialogContentDivider />\n {shouldRenderNextButton ? (\n <>\n <DialogContent>{children}</DialogContent>\n <DialogContentDivider />\n <DialogActions>\n <StepActionButton\n isLast={isLast}\n actionLabel={actionLabel}\n onNextButtonClick={onActionButtonClick}\n />\n </DialogActions>\n </>\n ) : (\n <StyledCustomStep>{children}</StyledCustomStep>\n )}\n </>\n ) : null;\n};\n\nStep.displayName = \"Step\";\n"],"file":"Step.js"}
|
|
@@ -19,6 +19,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
19
19
|
|
|
20
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
21
|
|
|
22
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
23
|
+
|
|
24
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
25
|
+
|
|
26
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
27
|
+
|
|
28
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
29
|
+
|
|
22
30
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
23
31
|
|
|
24
32
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
@@ -55,12 +63,24 @@ var Wizard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
55
63
|
setActiveStep(0);
|
|
56
64
|
}
|
|
57
65
|
}, [open]);
|
|
58
|
-
var
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
66
|
+
var goNext = (0, _react.useCallback)(function () {
|
|
67
|
+
var index = childrenCollection.findIndex(function (step, index) {
|
|
68
|
+
var _stepEl$props;
|
|
69
|
+
|
|
70
|
+
var stepEl = step;
|
|
71
|
+
return !(stepEl !== null && stepEl !== void 0 && (_stepEl$props = stepEl.props) !== null && _stepEl$props !== void 0 && _stepEl$props.skip) && index > activeStep;
|
|
72
|
+
});
|
|
73
|
+
setActiveStep(index);
|
|
74
|
+
}, [activeStep, childrenCollection]);
|
|
75
|
+
var goPrevious = (0, _react.useCallback)(function () {
|
|
76
|
+
var index = [_toConsumableArray(childrenCollection).reverse()].findIndex(function (step, index) {
|
|
77
|
+
var _stepEl$props2;
|
|
78
|
+
|
|
79
|
+
var stepEl = step;
|
|
80
|
+
return !(stepEl !== null && stepEl !== void 0 && (_stepEl$props2 = stepEl.props) !== null && _stepEl$props2 !== void 0 && _stepEl$props2.skip) && index < activeStep;
|
|
81
|
+
});
|
|
82
|
+
setActiveStep(index);
|
|
83
|
+
}, [activeStep, childrenCollection]);
|
|
64
84
|
var renderActiveStep = (0, _react.useMemo)(function () {
|
|
65
85
|
var element = childrenCollection[activeStep];
|
|
66
86
|
|
|
@@ -69,19 +89,21 @@ var Wizard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
69
89
|
index: activeStep,
|
|
70
90
|
isLast: childrenCollection.length - 1 === activeStep,
|
|
71
91
|
title: title,
|
|
72
|
-
onNextButtonClick:
|
|
73
|
-
onPreviousButtonClick:
|
|
92
|
+
onNextButtonClick: goNext,
|
|
93
|
+
onPreviousButtonClick: goPrevious,
|
|
74
94
|
onClose: onClose,
|
|
75
95
|
changingStepInProgress: changingStepInProgress
|
|
76
96
|
});
|
|
77
97
|
}
|
|
78
98
|
|
|
79
99
|
return null;
|
|
80
|
-
}, [activeStep, changingStepInProgress, childrenCollection,
|
|
100
|
+
}, [activeStep, changingStepInProgress, childrenCollection, goNext, goPrevious, onClose, title]);
|
|
81
101
|
return /*#__PURE__*/_react.default.createElement(_context.WizardContextProvider, {
|
|
82
102
|
value: {
|
|
83
103
|
activeStep: activeStep,
|
|
84
104
|
setActiveStep: setActiveStep,
|
|
105
|
+
goNext: goNext,
|
|
106
|
+
goPrevious: goPrevious,
|
|
85
107
|
close: onClose,
|
|
86
108
|
setChangingStepInProgress: setChangingStepInProgress
|
|
87
109
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":["Wizard","ref","title","open","onClose","children","childrenCollection","React","Children","toArray","activeStep","setActiveStep","changingStepInProgress","setChangingStepInProgress","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":["Wizard","ref","title","open","onClose","children","childrenCollection","React","Children","toArray","activeStep","setActiveStep","changingStepInProgress","setChangingStepInProgress","goNext","index","findIndex","step","stepEl","props","skip","goPrevious","reverse","renderActiveStep","element","type","Step","cloneElement","isLast","length","onNextButtonClick","onPreviousButtonClick","close","displayName"],"mappings":"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","sourcesContent":["import React, {\n forwardRef,\n ReactChild,\n ReactElement,\n ReactFragment,\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from \"react\";\nimport { Dialog } from \"../Dialog\";\nimport { WizardContextProvider } from \"./context\";\nimport { Step } from \"./Step\";\n\nexport interface IWizard {\n title: string;\n open: boolean;\n onClose: () => void;\n children: ReactNode;\n}\n\nexport const Wizard = forwardRef<HTMLDivElement, IWizard>(\n ({ title, open, onClose, children }, ref) => {\n const childrenCollection = useMemo(\n () => React.Children.toArray(children),\n [children]\n );\n\n const [activeStep, setActiveStep] = useState(0);\n const [changingStepInProgress, setChangingStepInProgress] = useState(false);\n\n useEffect(() => {\n if (open) {\n setActiveStep(0);\n }\n }, [open]);\n\n const goNext = useCallback(() => {\n const index = childrenCollection.findIndex(\n (step: ReactChild | ReactFragment, index) => {\n const stepEl = step as ReactElement;\n return !stepEl?.props?.skip && index > activeStep;\n }\n );\n setActiveStep(index);\n }, [activeStep, childrenCollection]);\n\n const goPrevious = useCallback(() => {\n const index = [[...childrenCollection].reverse()].findIndex(\n (step: ReactChild | ReactFragment, index) => {\n const stepEl = step as ReactElement;\n return !stepEl?.props?.skip && index < activeStep;\n }\n );\n setActiveStep(index);\n }, [activeStep, childrenCollection]);\n\n const renderActiveStep = useMemo(() => {\n const element = childrenCollection[activeStep] as ReactElement;\n\n if (element?.type === Step) {\n return React.cloneElement(element, {\n index: activeStep,\n isLast: childrenCollection.length - 1 === activeStep,\n title: title,\n onNextButtonClick: goNext,\n onPreviousButtonClick: goPrevious,\n onClose,\n changingStepInProgress: changingStepInProgress,\n });\n }\n\n return null;\n }, [\n activeStep,\n changingStepInProgress,\n childrenCollection,\n goNext,\n goPrevious,\n onClose,\n title,\n ]);\n\n return (\n <WizardContextProvider\n value={{\n activeStep,\n setActiveStep,\n goNext,\n goPrevious,\n close: onClose,\n setChangingStepInProgress,\n }}\n >\n <Dialog ref={ref} open={open} onClose={onClose}>\n {renderActiveStep}\n </Dialog>\n </WizardContextProvider>\n );\n }\n);\n\nWizard.displayName = \"Wizard\";\n"],"file":"Wizard.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Wizard/context/index.ts"],"names":["WizardContext","WizardContextProvider","Provider","WizardContextConsumer","Consumer","useWizardContext"],"mappings":";;;;;;;AAAA;;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Wizard/context/index.ts"],"names":["WizardContext","WizardContextProvider","Provider","WizardContextConsumer","Consumer","useWizardContext"],"mappings":";;;;;;;AAAA;;AAWA,IAAMA,aAAa,gBAAG,0BAA8B,EAA9B,CAAtB;AAEO,IAAMC,qBAAqB,GAAGD,aAAa,CAACE,QAA5C;;AACA,IAAMC,qBAAqB,GAAGH,aAAa,CAACI,QAA5C;;;AAEA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,SAAsB,uBAAWL,aAAX,CAAtB;AAAA,CAAzB;;;eAEQA,a","sourcesContent":["import { createContext, useContext } from \"react\";\n\ninterface IWizardContext {\n activeStep?: number;\n setActiveStep?: (integer) => void;\n goNext?: () => void;\n goPrevious?: () => void;\n close?: () => void;\n setChangingStepInProgress?: (boolean) => void;\n}\n\nconst WizardContext = createContext<IWizardContext>({});\n\nexport const WizardContextProvider = WizardContext.Provider;\nexport const WizardContextConsumer = WizardContext.Consumer;\n\nexport const useWizardContext = (): IWizardContext => useContext(WizardContext);\n\nexport default WizardContext;\n"],"file":"index.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Step.d.ts","sourceRoot":"","sources":["../../../../src/components/Wizard/Step.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAa1D,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,sBAAsB,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Step.d.ts","sourceRoot":"","sources":["../../../../src/components/Wizard/Step.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAa1D,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,KAAK,CAmE1B,CAAC"}
|
|
@@ -19,7 +19,9 @@ export var Step = function Step(_ref) {
|
|
|
19
19
|
_ref$shouldRenderNext = _ref.shouldRenderNextButton,
|
|
20
20
|
shouldRenderNextButton = _ref$shouldRenderNext === void 0 ? true : _ref$shouldRenderNext,
|
|
21
21
|
_ref$changingStepInPr = _ref.changingStepInProgress,
|
|
22
|
-
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr
|
|
22
|
+
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr,
|
|
23
|
+
_ref$skip = _ref.skip,
|
|
24
|
+
skip = _ref$skip === void 0 ? false : _ref$skip;
|
|
23
25
|
var onActionButtonClick = useCallback(function () {
|
|
24
26
|
if (isLast && onClose) {
|
|
25
27
|
return onClose();
|
|
@@ -27,7 +29,7 @@ export var Step = function Step(_ref) {
|
|
|
27
29
|
|
|
28
30
|
return onNextButtonClick && onNextButtonClick();
|
|
29
31
|
}, [isLast, onClose, onNextButtonClick]);
|
|
30
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledStepHeader, null, /*#__PURE__*/React.createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React.createElement(Button, {
|
|
32
|
+
return !skip ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledStepHeader, null, /*#__PURE__*/React.createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React.createElement(Button, {
|
|
31
33
|
onClick: onPreviousButtonClick,
|
|
32
34
|
variant: "text gray",
|
|
33
35
|
className: "tw--ml-3 tw-mr-2",
|
|
@@ -40,7 +42,7 @@ export var Step = function Step(_ref) {
|
|
|
40
42
|
isLast: isLast,
|
|
41
43
|
actionLabel: actionLabel,
|
|
42
44
|
onNextButtonClick: onActionButtonClick
|
|
43
|
-
}))) : /*#__PURE__*/React.createElement(StyledCustomStep, null, children));
|
|
45
|
+
}))) : /*#__PURE__*/React.createElement(StyledCustomStep, null, children)) : null;
|
|
44
46
|
};
|
|
45
47
|
Step.displayName = "Step";
|
|
46
48
|
//# sourceMappingURL=Step.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Wizard/Step.tsx"],"names":["React","useCallback","Button","ArrowBackMobileIcon","CancelCrossIcon","StepActionButton","DialogActions","DialogContent","DialogContentDivider","Caption2","Header3","StyledStepTitle","StyledStepHeaderLeft","StyledStepHeader","StyledCustomStep","Step","index","isLast","subtitle","title","onNextButtonClick","onPreviousButtonClick","onClose","children","actionLabel","shouldRenderNextButton","changingStepInProgress","onActionButtonClick","displayName"],"mappings":"AAAA,OAAOA,KAAP,IAA+BC,WAA/B,QAAkD,OAAlD;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,mBAAT,EAA8BC,eAA9B,QAAqD,UAArD;AACA,SAASC,gBAAT,QAAiC,oBAAjC;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,oBAAvC,QAAmE,WAAnE;AACA,SAASC,QAAT,EAAmBC,OAAnB,QAAkC,eAAlC;AACA,SACEC,eADF,EAEEC,oBAFF,EAGEC,gBAHF,EAIEC,gBAJF,QAKO,UALP;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Wizard/Step.tsx"],"names":["React","useCallback","Button","ArrowBackMobileIcon","CancelCrossIcon","StepActionButton","DialogActions","DialogContent","DialogContentDivider","Caption2","Header3","StyledStepTitle","StyledStepHeaderLeft","StyledStepHeader","StyledCustomStep","Step","index","isLast","subtitle","title","onNextButtonClick","onPreviousButtonClick","onClose","children","actionLabel","shouldRenderNextButton","changingStepInProgress","skip","onActionButtonClick","displayName"],"mappings":"AAAA,OAAOA,KAAP,IAA+BC,WAA/B,QAAkD,OAAlD;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,mBAAT,EAA8BC,eAA9B,QAAqD,UAArD;AACA,SAASC,gBAAT,QAAiC,oBAAjC;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,oBAAvC,QAAmE,WAAnE;AACA,SAASC,QAAT,EAAmBC,OAAnB,QAAkC,eAAlC;AACA,SACEC,eADF,EAEEC,oBAFF,EAGEC,gBAHF,EAIEC,gBAJF,QAKO,UALP;AAsBA,OAAO,IAAMC,IAAe,GAAG,SAAlBA,IAAkB,OAazB;AAAA,MAZJC,KAYI,QAZJA,KAYI;AAAA,MAXJC,MAWI,QAXJA,MAWI;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,KASI,QATJA,KASI;AAAA,MARJC,iBAQI,QARJA,iBAQI;AAAA,MAPJC,qBAOI,QAPJA,qBAOI;AAAA,MANJC,OAMI,QANJA,OAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,8BAJJC,WAII;AAAA,MAJJA,WAII,iCAJU,SAIV;AAAA,mCAHJC,sBAGI;AAAA,MAHJA,sBAGI,sCAHqB,IAGrB;AAAA,mCAFJC,sBAEI;AAAA,MAFJA,sBAEI,sCAFqB,KAErB;AAAA,uBADJC,IACI;AAAA,MADJA,IACI,0BADG,KACH;AACJ,MAAMC,mBAAmB,GAAG3B,WAAW,CAAC,YAAM;AAC5C,QAAIgB,MAAM,IAAIK,OAAd,EAAuB;AACrB,aAAOA,OAAO,EAAd;AACD;;AAED,WAAOF,iBAAiB,IAAIA,iBAAiB,EAA7C;AACD,GANsC,EAMpC,CAACH,MAAD,EAASK,OAAT,EAAkBF,iBAAlB,CANoC,CAAvC;AAQA,SAAO,CAACO,IAAD,gBACL,uDACE,oBAAC,gBAAD,qBACE,oBAAC,oBAAD,QACGX,KAAK,IAAIA,KAAK,GAAG,CAAjB,gBACC,oBAAC,MAAD;AACE,IAAA,OAAO,EAAEK,qBADX;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,SAAS,EAAC,kBAHZ;AAIE,IAAA,QAAQ,EAAEK;AAJZ,kBAME,oBAAC,mBAAD,OANF,CADD,GASG,IAVN,eAWE,oBAAC,eAAD,qBACE,oBAAC,QAAD,QAAWP,KAAX,CADF,eAEE,oBAAC,OAAD,QAAUD,QAAV,CAFF,CAXF,CADF,eAiBE,oBAAC,MAAD;AACE,IAAA,OAAO,EAAEI,OADX;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,QAAQ,EAAEI;AAHZ,kBAKE,oBAAC,eAAD,OALF,CAjBF,CADF,eA0BE,oBAAC,oBAAD,OA1BF,EA2BGD,sBAAsB,gBACrB,uDACE,oBAAC,aAAD,QAAgBF,QAAhB,CADF,eAEE,oBAAC,oBAAD,OAFF,eAGE,oBAAC,aAAD,qBACE,oBAAC,gBAAD;AACE,IAAA,MAAM,EAAEN,MADV;AAEE,IAAA,WAAW,EAAEO,WAFf;AAGE,IAAA,iBAAiB,EAAEI;AAHrB,IADF,CAHF,CADqB,gBAarB,oBAAC,gBAAD,QAAmBL,QAAnB,CAxCJ,CADK,GA4CH,IA5CJ;AA6CD,CAnEM;AAqEPR,IAAI,CAACc,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { FC, ReactNode, useCallback } from \"react\";\nimport { Button } from \"../Button\";\nimport { ArrowBackMobileIcon, CancelCrossIcon } from \"../Icons\";\nimport { StepActionButton } from \"./StepActionButton\";\nimport { DialogActions, DialogContent, DialogContentDivider } from \"../Dialog\";\nimport { Caption2, Header3 } from \"../Typography\";\nimport {\n StyledStepTitle,\n StyledStepHeaderLeft,\n StyledStepHeader,\n StyledCustomStep,\n} from \"./Styles\";\n\nexport interface IStep {\n index?: number;\n isLast?: boolean;\n subtitle: string;\n title?: string;\n onNextButtonClick?: () => void;\n onPreviousButtonClick?: () => void;\n onClose?: () => void;\n children: ReactNode;\n actionLabel?: string;\n shouldRenderNextButton?: boolean;\n changingStepInProgress?: boolean;\n skip?: boolean;\n}\n\nexport const Step: FC<IStep> = ({\n index,\n isLast,\n subtitle,\n title,\n onNextButtonClick,\n onPreviousButtonClick,\n onClose,\n children,\n actionLabel = \"Proceed\",\n shouldRenderNextButton = true,\n changingStepInProgress = false,\n skip = false,\n}) => {\n const onActionButtonClick = useCallback(() => {\n if (isLast && onClose) {\n return onClose();\n }\n\n return onNextButtonClick && onNextButtonClick();\n }, [isLast, onClose, onNextButtonClick]);\n\n return !skip ? (\n <>\n <StyledStepHeader>\n <StyledStepHeaderLeft>\n {index && index > 0 ? (\n <Button\n onClick={onPreviousButtonClick}\n variant=\"text gray\"\n className=\"tw--ml-3 tw-mr-2\"\n disabled={changingStepInProgress}\n >\n <ArrowBackMobileIcon />\n </Button>\n ) : null}\n <StyledStepTitle>\n <Caption2>{title}</Caption2>\n <Header3>{subtitle}</Header3>\n </StyledStepTitle>\n </StyledStepHeaderLeft>\n <Button\n onClick={onClose}\n variant=\"text gray\"\n disabled={changingStepInProgress}\n >\n <CancelCrossIcon />\n </Button>\n </StyledStepHeader>\n <DialogContentDivider />\n {shouldRenderNextButton ? (\n <>\n <DialogContent>{children}</DialogContent>\n <DialogContentDivider />\n <DialogActions>\n <StepActionButton\n isLast={isLast}\n actionLabel={actionLabel}\n onNextButtonClick={onActionButtonClick}\n />\n </DialogActions>\n </>\n ) : (\n <StyledCustomStep>{children}</StyledCustomStep>\n )}\n </>\n ) : null;\n};\n\nStep.displayName = \"Step\";\n"],"file":"Step.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Wizard.d.ts","sourceRoot":"","sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Wizard.d.ts","sourceRoot":"","sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,MAAM,gFA+ElB,CAAC"}
|
|
@@ -24,12 +24,24 @@ export var Wizard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
24
24
|
setActiveStep(0);
|
|
25
25
|
}
|
|
26
26
|
}, [open]);
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
27
|
+
var goNext = useCallback(function () {
|
|
28
|
+
var index = childrenCollection.findIndex(function (step, index) {
|
|
29
|
+
var _stepEl$props;
|
|
30
|
+
|
|
31
|
+
var stepEl = step;
|
|
32
|
+
return !(stepEl != null && (_stepEl$props = stepEl.props) != null && _stepEl$props.skip) && index > activeStep;
|
|
33
|
+
});
|
|
34
|
+
setActiveStep(index);
|
|
35
|
+
}, [activeStep, childrenCollection]);
|
|
36
|
+
var goPrevious = useCallback(function () {
|
|
37
|
+
var index = [[].concat(childrenCollection).reverse()].findIndex(function (step, index) {
|
|
38
|
+
var _stepEl$props2;
|
|
39
|
+
|
|
40
|
+
var stepEl = step;
|
|
41
|
+
return !(stepEl != null && (_stepEl$props2 = stepEl.props) != null && _stepEl$props2.skip) && index < activeStep;
|
|
42
|
+
});
|
|
43
|
+
setActiveStep(index);
|
|
44
|
+
}, [activeStep, childrenCollection]);
|
|
33
45
|
var renderActiveStep = useMemo(function () {
|
|
34
46
|
var element = childrenCollection[activeStep];
|
|
35
47
|
|
|
@@ -38,19 +50,21 @@ export var Wizard = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
38
50
|
index: activeStep,
|
|
39
51
|
isLast: childrenCollection.length - 1 === activeStep,
|
|
40
52
|
title: title,
|
|
41
|
-
onNextButtonClick:
|
|
42
|
-
onPreviousButtonClick:
|
|
53
|
+
onNextButtonClick: goNext,
|
|
54
|
+
onPreviousButtonClick: goPrevious,
|
|
43
55
|
onClose: onClose,
|
|
44
56
|
changingStepInProgress: changingStepInProgress
|
|
45
57
|
});
|
|
46
58
|
}
|
|
47
59
|
|
|
48
60
|
return null;
|
|
49
|
-
}, [activeStep, changingStepInProgress, childrenCollection,
|
|
61
|
+
}, [activeStep, changingStepInProgress, childrenCollection, goNext, goPrevious, onClose, title]);
|
|
50
62
|
return /*#__PURE__*/React.createElement(WizardContextProvider, {
|
|
51
63
|
value: {
|
|
52
64
|
activeStep: activeStep,
|
|
53
65
|
setActiveStep: setActiveStep,
|
|
66
|
+
goNext: goNext,
|
|
67
|
+
goPrevious: goPrevious,
|
|
54
68
|
close: onClose,
|
|
55
69
|
setChangingStepInProgress: setChangingStepInProgress
|
|
56
70
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":["React","forwardRef","useCallback","useEffect","useMemo","useState","Dialog","WizardContextProvider","Step","Wizard","ref","title","open","onClose","children","childrenCollection","Children","toArray","activeStep","setActiveStep","changingStepInProgress","setChangingStepInProgress","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Wizard/Wizard.tsx"],"names":["React","forwardRef","useCallback","useEffect","useMemo","useState","Dialog","WizardContextProvider","Step","Wizard","ref","title","open","onClose","children","childrenCollection","Children","toArray","activeStep","setActiveStep","changingStepInProgress","setChangingStepInProgress","goNext","index","findIndex","step","stepEl","props","skip","goPrevious","reverse","renderActiveStep","element","type","cloneElement","isLast","length","onNextButtonClick","onPreviousButtonClick","close","displayName"],"mappings":"AAAA,OAAOA,KAAP,IACEC,UADF,EAMEC,WANF,EAOEC,SAPF,EAQEC,OARF,EASEC,QATF,QAUO,OAVP;AAWA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,qBAAT,QAAsC,WAAtC;AACA,SAASC,IAAT,QAAqB,QAArB;AASA,OAAO,IAAMC,MAAM,gBAAGR,UAAU,CAC9B,gBAAqCS,GAArC,EAA6C;AAAA,MAA1CC,KAA0C,QAA1CA,KAA0C;AAAA,MAAnCC,IAAmC,QAAnCA,IAAmC;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAC3C,MAAMC,kBAAkB,GAAGX,OAAO,CAChC;AAAA,WAAMJ,KAAK,CAACgB,QAAN,CAAeC,OAAf,CAAuBH,QAAvB,CAAN;AAAA,GADgC,EAEhC,CAACA,QAAD,CAFgC,CAAlC;;AAKA,kBAAoCT,QAAQ,CAAC,CAAD,CAA5C;AAAA,MAAOa,UAAP;AAAA,MAAmBC,aAAnB;;AACA,mBAA4Dd,QAAQ,CAAC,KAAD,CAApE;AAAA,MAAOe,sBAAP;AAAA,MAA+BC,yBAA/B;;AAEAlB,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIS,IAAJ,EAAU;AACRO,MAAAA,aAAa,CAAC,CAAD,CAAb;AACD;AACF,GAJQ,EAIN,CAACP,IAAD,CAJM,CAAT;AAMA,MAAMU,MAAM,GAAGpB,WAAW,CAAC,YAAM;AAC/B,QAAMqB,KAAK,GAAGR,kBAAkB,CAACS,SAAnB,CACZ,UAACC,IAAD,EAAmCF,KAAnC,EAA6C;AAAA;;AAC3C,UAAMG,MAAM,GAAGD,IAAf;AACA,aAAO,EAACC,MAAD,6BAACA,MAAM,CAAEC,KAAT,aAAC,cAAeC,IAAhB,KAAwBL,KAAK,GAAGL,UAAvC;AACD,KAJW,CAAd;AAMAC,IAAAA,aAAa,CAACI,KAAD,CAAb;AACD,GARyB,EAQvB,CAACL,UAAD,EAAaH,kBAAb,CARuB,CAA1B;AAUA,MAAMc,UAAU,GAAG3B,WAAW,CAAC,YAAM;AACnC,QAAMqB,KAAK,GAAG,CAAC,UAAIR,kBAAJ,EAAwBe,OAAxB,EAAD,EAAoCN,SAApC,CACZ,UAACC,IAAD,EAAmCF,KAAnC,EAA6C;AAAA;;AAC3C,UAAMG,MAAM,GAAGD,IAAf;AACA,aAAO,EAACC,MAAD,8BAACA,MAAM,CAAEC,KAAT,aAAC,eAAeC,IAAhB,KAAwBL,KAAK,GAAGL,UAAvC;AACD,KAJW,CAAd;AAMAC,IAAAA,aAAa,CAACI,KAAD,CAAb;AACD,GAR6B,EAQ3B,CAACL,UAAD,EAAaH,kBAAb,CAR2B,CAA9B;AAUA,MAAMgB,gBAAgB,GAAG3B,OAAO,CAAC,YAAM;AACrC,QAAM4B,OAAO,GAAGjB,kBAAkB,CAACG,UAAD,CAAlC;;AAEA,QAAI,CAAAc,OAAO,QAAP,YAAAA,OAAO,CAAEC,IAAT,MAAkBzB,IAAtB,EAA4B;AAC1B,0BAAOR,KAAK,CAACkC,YAAN,CAAmBF,OAAnB,EAA4B;AACjCT,QAAAA,KAAK,EAAEL,UAD0B;AAEjCiB,QAAAA,MAAM,EAAEpB,kBAAkB,CAACqB,MAAnB,GAA4B,CAA5B,KAAkClB,UAFT;AAGjCP,QAAAA,KAAK,EAAEA,KAH0B;AAIjC0B,QAAAA,iBAAiB,EAAEf,MAJc;AAKjCgB,QAAAA,qBAAqB,EAAET,UALU;AAMjChB,QAAAA,OAAO,EAAPA,OANiC;AAOjCO,QAAAA,sBAAsB,EAAEA;AAPS,OAA5B,CAAP;AASD;;AAED,WAAO,IAAP;AACD,GAhB+B,EAgB7B,CACDF,UADC,EAEDE,sBAFC,EAGDL,kBAHC,EAIDO,MAJC,EAKDO,UALC,EAMDhB,OANC,EAODF,KAPC,CAhB6B,CAAhC;AA0BA,sBACE,oBAAC,qBAAD;AACE,IAAA,KAAK,EAAE;AACLO,MAAAA,UAAU,EAAVA,UADK;AAELC,MAAAA,aAAa,EAAbA,aAFK;AAGLG,MAAAA,MAAM,EAANA,MAHK;AAILO,MAAAA,UAAU,EAAVA,UAJK;AAKLU,MAAAA,KAAK,EAAE1B,OALF;AAMLQ,MAAAA,yBAAyB,EAAzBA;AANK;AADT,kBAUE,oBAAC,MAAD;AAAQ,IAAA,GAAG,EAAEX,GAAb;AAAkB,IAAA,IAAI,EAAEE,IAAxB;AAA8B,IAAA,OAAO,EAAEC;AAAvC,KACGkB,gBADH,CAVF,CADF;AAgBD,CA9E6B,CAAzB;AAiFPtB,MAAM,CAAC+B,WAAP,GAAqB,QAArB","sourcesContent":["import React, {\n forwardRef,\n ReactChild,\n ReactElement,\n ReactFragment,\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from \"react\";\nimport { Dialog } from \"../Dialog\";\nimport { WizardContextProvider } from \"./context\";\nimport { Step } from \"./Step\";\n\nexport interface IWizard {\n title: string;\n open: boolean;\n onClose: () => void;\n children: ReactNode;\n}\n\nexport const Wizard = forwardRef<HTMLDivElement, IWizard>(\n ({ title, open, onClose, children }, ref) => {\n const childrenCollection = useMemo(\n () => React.Children.toArray(children),\n [children]\n );\n\n const [activeStep, setActiveStep] = useState(0);\n const [changingStepInProgress, setChangingStepInProgress] = useState(false);\n\n useEffect(() => {\n if (open) {\n setActiveStep(0);\n }\n }, [open]);\n\n const goNext = useCallback(() => {\n const index = childrenCollection.findIndex(\n (step: ReactChild | ReactFragment, index) => {\n const stepEl = step as ReactElement;\n return !stepEl?.props?.skip && index > activeStep;\n }\n );\n setActiveStep(index);\n }, [activeStep, childrenCollection]);\n\n const goPrevious = useCallback(() => {\n const index = [[...childrenCollection].reverse()].findIndex(\n (step: ReactChild | ReactFragment, index) => {\n const stepEl = step as ReactElement;\n return !stepEl?.props?.skip && index < activeStep;\n }\n );\n setActiveStep(index);\n }, [activeStep, childrenCollection]);\n\n const renderActiveStep = useMemo(() => {\n const element = childrenCollection[activeStep] as ReactElement;\n\n if (element?.type === Step) {\n return React.cloneElement(element, {\n index: activeStep,\n isLast: childrenCollection.length - 1 === activeStep,\n title: title,\n onNextButtonClick: goNext,\n onPreviousButtonClick: goPrevious,\n onClose,\n changingStepInProgress: changingStepInProgress,\n });\n }\n\n return null;\n }, [\n activeStep,\n changingStepInProgress,\n childrenCollection,\n goNext,\n goPrevious,\n onClose,\n title,\n ]);\n\n return (\n <WizardContextProvider\n value={{\n activeStep,\n setActiveStep,\n goNext,\n goPrevious,\n close: onClose,\n setChangingStepInProgress,\n }}\n >\n <Dialog ref={ref} open={open} onClose={onClose}>\n {renderActiveStep}\n </Dialog>\n </WizardContextProvider>\n );\n }\n);\n\nWizard.displayName = \"Wizard\";\n"],"file":"Wizard.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Wizard/context/index.ts"],"names":[],"mappings":";AAEA,UAAU,cAAc;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,yBAAyB,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;CAC/C;AAED,QAAA,MAAM,aAAa,yCAAoC,CAAC;AAExD,eAAO,MAAM,qBAAqB,0CAAyB,CAAC;AAC5D,eAAO,MAAM,qBAAqB,0CAAyB,CAAC;AAE5D,eAAO,MAAM,gBAAgB,QAAO,cAA2C,CAAC;AAEhF,eAAe,aAAa,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Wizard/context/index.ts"],"names":[],"mappings":";AAEA,UAAU,cAAc;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,yBAAyB,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;CAC/C;AAED,QAAA,MAAM,aAAa,yCAAoC,CAAC;AAExD,eAAO,MAAM,qBAAqB,0CAAyB,CAAC;AAC5D,eAAO,MAAM,qBAAqB,0CAAyB,CAAC;AAE5D,eAAO,MAAM,gBAAgB,QAAO,cAA2C,CAAC;AAEhF,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Wizard/context/index.ts"],"names":["createContext","useContext","WizardContext","WizardContextProvider","Provider","WizardContextConsumer","Consumer","useWizardContext"],"mappings":"AAAA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,OAA1C;
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Wizard/context/index.ts"],"names":["createContext","useContext","WizardContext","WizardContextProvider","Provider","WizardContextConsumer","Consumer","useWizardContext"],"mappings":"AAAA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,OAA1C;AAWA,IAAMC,aAAa,gBAAGF,aAAa,CAAiB,EAAjB,CAAnC;AAEA,OAAO,IAAMG,qBAAqB,GAAGD,aAAa,CAACE,QAA5C;AACP,OAAO,IAAMC,qBAAqB,GAAGH,aAAa,CAACI,QAA5C;AAEP,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,SAAsBN,UAAU,CAACC,aAAD,CAAhC;AAAA,CAAzB;AAEP,eAAeA,aAAf","sourcesContent":["import { createContext, useContext } from \"react\";\n\ninterface IWizardContext {\n activeStep?: number;\n setActiveStep?: (integer) => void;\n goNext?: () => void;\n goPrevious?: () => void;\n close?: () => void;\n setChangingStepInProgress?: (boolean) => void;\n}\n\nconst WizardContext = createContext<IWizardContext>({});\n\nexport const WizardContextProvider = WizardContext.Provider;\nexport const WizardContextConsumer = WizardContext.Consumer;\n\nexport const useWizardContext = (): IWizardContext => useContext(WizardContext);\n\nexport default WizardContext;\n"],"file":"index.js"}
|
package/dist/index.js
CHANGED
|
@@ -12624,7 +12624,9 @@
|
|
|
12624
12624
|
_ref$shouldRenderNext = _ref.shouldRenderNextButton,
|
|
12625
12625
|
shouldRenderNextButton = _ref$shouldRenderNext === void 0 ? true : _ref$shouldRenderNext,
|
|
12626
12626
|
_ref$changingStepInPr = _ref.changingStepInProgress,
|
|
12627
|
-
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr
|
|
12627
|
+
changingStepInProgress = _ref$changingStepInPr === void 0 ? false : _ref$changingStepInPr,
|
|
12628
|
+
_ref$skip = _ref.skip,
|
|
12629
|
+
skip = _ref$skip === void 0 ? false : _ref$skip;
|
|
12628
12630
|
var onActionButtonClick = React.useCallback(function () {
|
|
12629
12631
|
if (isLast && onClose) {
|
|
12630
12632
|
return onClose();
|
|
@@ -12632,7 +12634,7 @@
|
|
|
12632
12634
|
|
|
12633
12635
|
return onNextButtonClick && onNextButtonClick();
|
|
12634
12636
|
}, [isLast, onClose, onNextButtonClick]);
|
|
12635
|
-
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeader, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React__default["default"].createElement(Button, {
|
|
12637
|
+
return !skip ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeader, null, /*#__PURE__*/React__default["default"].createElement(StyledStepHeaderLeft, null, index && index > 0 ? /*#__PURE__*/React__default["default"].createElement(Button, {
|
|
12636
12638
|
onClick: onPreviousButtonClick,
|
|
12637
12639
|
variant: "text gray",
|
|
12638
12640
|
className: "tw--ml-3 tw-mr-2",
|
|
@@ -12645,7 +12647,7 @@
|
|
|
12645
12647
|
isLast: isLast,
|
|
12646
12648
|
actionLabel: actionLabel,
|
|
12647
12649
|
onNextButtonClick: onActionButtonClick
|
|
12648
|
-
}))) : /*#__PURE__*/React__default["default"].createElement(StyledCustomStep, null, children));
|
|
12650
|
+
}))) : /*#__PURE__*/React__default["default"].createElement(StyledCustomStep, null, children)) : null;
|
|
12649
12651
|
};
|
|
12650
12652
|
Step.displayName = "Step";
|
|
12651
12653
|
|
|
@@ -12673,12 +12675,24 @@
|
|
|
12673
12675
|
setActiveStep(0);
|
|
12674
12676
|
}
|
|
12675
12677
|
}, [open]);
|
|
12676
|
-
var
|
|
12677
|
-
|
|
12678
|
-
|
|
12679
|
-
|
|
12680
|
-
|
|
12681
|
-
|
|
12678
|
+
var goNext = React.useCallback(function () {
|
|
12679
|
+
var index = childrenCollection.findIndex(function (step, index) {
|
|
12680
|
+
var _stepEl$props;
|
|
12681
|
+
|
|
12682
|
+
var stepEl = step;
|
|
12683
|
+
return !(stepEl !== null && stepEl !== void 0 && (_stepEl$props = stepEl.props) !== null && _stepEl$props !== void 0 && _stepEl$props.skip) && index > activeStep;
|
|
12684
|
+
});
|
|
12685
|
+
setActiveStep(index);
|
|
12686
|
+
}, [activeStep, childrenCollection]);
|
|
12687
|
+
var goPrevious = React.useCallback(function () {
|
|
12688
|
+
var index = [_toConsumableArray(childrenCollection).reverse()].findIndex(function (step, index) {
|
|
12689
|
+
var _stepEl$props2;
|
|
12690
|
+
|
|
12691
|
+
var stepEl = step;
|
|
12692
|
+
return !(stepEl !== null && stepEl !== void 0 && (_stepEl$props2 = stepEl.props) !== null && _stepEl$props2 !== void 0 && _stepEl$props2.skip) && index < activeStep;
|
|
12693
|
+
});
|
|
12694
|
+
setActiveStep(index);
|
|
12695
|
+
}, [activeStep, childrenCollection]);
|
|
12682
12696
|
var renderActiveStep = React.useMemo(function () {
|
|
12683
12697
|
var element = childrenCollection[activeStep];
|
|
12684
12698
|
|
|
@@ -12687,19 +12701,21 @@
|
|
|
12687
12701
|
index: activeStep,
|
|
12688
12702
|
isLast: childrenCollection.length - 1 === activeStep,
|
|
12689
12703
|
title: title,
|
|
12690
|
-
onNextButtonClick:
|
|
12691
|
-
onPreviousButtonClick:
|
|
12704
|
+
onNextButtonClick: goNext,
|
|
12705
|
+
onPreviousButtonClick: goPrevious,
|
|
12692
12706
|
onClose: onClose,
|
|
12693
12707
|
changingStepInProgress: changingStepInProgress
|
|
12694
12708
|
});
|
|
12695
12709
|
}
|
|
12696
12710
|
|
|
12697
12711
|
return null;
|
|
12698
|
-
}, [activeStep, changingStepInProgress, childrenCollection,
|
|
12712
|
+
}, [activeStep, changingStepInProgress, childrenCollection, goNext, goPrevious, onClose, title]);
|
|
12699
12713
|
return /*#__PURE__*/React__default["default"].createElement(WizardContextProvider, {
|
|
12700
12714
|
value: {
|
|
12701
12715
|
activeStep: activeStep,
|
|
12702
12716
|
setActiveStep: setActiveStep,
|
|
12717
|
+
goNext: goNext,
|
|
12718
|
+
goPrevious: goPrevious,
|
|
12703
12719
|
close: onClose,
|
|
12704
12720
|
setChangingStepInProgress: setChangingStepInProgress
|
|
12705
12721
|
}
|