@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
124 lines (123 loc) • 5.83 kB
JavaScript
;
"use client";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.StepIndicatorProvider = StepIndicatorProvider;
exports.default = void 0;
var _parse = _interopRequireDefault(require("core-js-pure/stable/json/parse.js"));
var _push = _interopRequireDefault(require("core-js-pure/stable/instance/push.js"));
var _react = _interopRequireWildcard(require("react"));
var _Context = _interopRequireDefault(require("../../shared/Context.js"));
var _StepIndicatorProps = require("./StepIndicatorProps.js");
var _componentHelper = require("../../shared/component-helper.js");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const filterAttributes = Object.keys(_StepIndicatorProps.stepIndicatorDefaultProps).filter(item => {
return !['class', 'className'].includes(item);
}).concat(['internalId', 'mainTitle', 'stepsLabel', 'listOfReachedSteps', 'setActiveStep', 'activeStep', 'countSteps', 'openState', 'openHandler', 'closeHandler', 'innerRef', 'hasSkeletonData', 'filterAttributes']);
const StepIndicatorContext = _react.default.createContext(null);
var _default = exports.default = StepIndicatorContext;
function StepIndicatorProvider(props) {
const data = (0, _react.useMemo)(() => {
if (typeof props.data === 'string') {
return props.data[0] === '[' ? (0, _parse.default)(props.data) : [];
}
return props.data || [];
}, [props]);
const [openState, setOpenState] = (0, _react.useState)(props.expandedInitially);
const openHandler = (0, _react.useCallback)(() => {
setOpenState(true);
}, []);
const closeHandler = (0, _react.useCallback)(() => {
setOpenState(false);
}, []);
const getActiveStepFromProps = (0, _react.useCallback)(() => {
if (typeof data[0] === 'string') {
return props.current_step;
}
const dataWithItems = data;
const itemWithCurrentStep = dataWithItems.find(item => item.is_current);
return itemWithCurrentStep ? dataWithItems.indexOf(itemWithCurrentStep) : props.current_step;
}, [data, props.current_step]);
const countSteps = data.length;
const activeStepRef = (0, _react.useRef)(getActiveStepFromProps());
const [, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
const setActiveStep = (0, _react.useCallback)(step => {
activeStepRef.current = step;
forceUpdate();
}, []);
const listOfReachedSteps = (0, _react.useRef)([activeStepRef.current].filter(Boolean)).current;
const context = (0, _react.useContext)(_Context.default);
const updateStepTitle = (0, _react.useCallback)(title => {
return title === null || title === void 0 ? void 0 : title.replace('%step', String((activeStepRef.current || 0) + 1)).replace('%count', String((data === null || data === void 0 ? void 0 : data.length) || 1));
}, [data === null || data === void 0 ? void 0 : data.length]);
const makeContextValue = (0, _react.useCallback)(() => {
const globalContext = (0, _componentHelper.extendPropsWithContext)(props, _StepIndicatorProps.stepIndicatorDefaultProps, {
skeleton: context === null || context === void 0 ? void 0 : context.skeleton
}, context.getTranslation(context).StepIndicator, context.StepIndicator);
const value = extendSafe({
filterAttributes
}, globalContext, {
defaultProps: _StepIndicatorProps.stepIndicatorDefaultProps,
props
}, {
activeStep: activeStepRef.current,
openState,
listOfReachedSteps,
data,
countSteps,
stepsLabel: updateStepTitle(globalContext.step_title)
}, {
setActiveStep,
openHandler,
closeHandler
});
return value;
}, [closeHandler, context, countSteps, data, listOfReachedSteps, openHandler, openState, props, setActiveStep, updateStepTitle]);
const contextValue = makeContextValue();
(0, _react.useEffect)(() => {
const currentStepFromProps = getActiveStepFromProps();
if (currentStepFromProps !== activeStepRef.current) {
setActiveStep(currentStepFromProps);
}
}, [props.current_step, data, getActiveStepFromProps, setActiveStep]);
const activeStep = activeStepRef.current;
(0, _react.useEffect)(() => {
if (!listOfReachedSteps.includes(activeStep)) {
(0, _push.default)(listOfReachedSteps).call(listOfReachedSteps, activeStep);
}
}, [activeStep, listOfReachedSteps]);
if (typeof window !== 'undefined' && window['IS_TEST']) {
contextValue['no_animation'] = true;
}
const contextValueKeys = Object.keys(contextValue);
contextValueKeys.forEach(key => {
if (key.startsWith('_')) {
delete contextValue[key];
}
});
return _react.default.createElement(StepIndicatorContext.Provider, {
value: contextValue
}, props.children);
}
function extendSafe(...objects) {
const obj = {};
objects.forEach(itm => {
if (itm.defaultProps && itm.props) {
itm = Object.entries(itm.props).reduce((acc, [k, v]) => {
if (itm.defaultProps[k] !== v) {
acc[k] = v;
}
return acc;
}, {});
}
Object.entries(itm).forEach(([k, v]) => {
if (!obj[k] || obj[k] && v) {
obj[k] = v;
}
});
});
return obj;
}
//# sourceMappingURL=StepIndicatorContext.js.map