@dnb/eufemia/cjs/extensions/forms/Wizard/Step/Step.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
exports.handleDeprecatedProps = handleDeprecatedProps;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _WizardContext = _interopRequireDefault(require("../Context/WizardContext.js"));
var _StepContext = _interopRequireDefault(require("./StepContext.js"));
var _Flex = _interopRequireDefault(require("../../../../components/flex/Flex.js"));
var _componentHelper = require("../../../../shared/component-helper.js");
var _index = _interopRequireDefault(require("../../Field/Provider/index.js"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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 _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function handleDeprecatedProps({
  active,
  activeWhen,
  include,
  includeWhen,
  ...rest
}) {
  return {
    include: include !== null && include !== void 0 ? include : active,
    includeWhen: includeWhen !== null && includeWhen !== void 0 ? includeWhen : activeWhen,
    ...rest
  };
}
function Step(props) {
  const {
    id,
    className,
    title,
    index: indexProp,
    inactive,
    include = true,
    includeWhen,
    required,
    keepInDOM: keepInDOMProp,
    prerenderFieldProps,
    children,
    ...restProps
  } = handleDeprecatedProps(props);
  const {
    check,
    enableMapOverChildren,
    activeIndex,
    totalStepsRef,
    stepElementRef,
    stepIndexRef,
    stepsRef,
    keepInDOM
  } = (0, _react.useContext)(_WizardContext.default) || {};
  const wizardStepContext = (0, _react.useContext)(_StepContext.default) || {};
  const indexFromContext = wizardStepContext.index;
  const totalSteps = totalStepsRef === null || totalStepsRef === void 0 ? void 0 : totalStepsRef.current;
  const ariaLabel = (0, _react.useMemo)(() => (0, _componentHelper.convertJsxToString)(title), [title]);
  const index = (0, _react.useMemo)(() => {
    if (indexProp !== undefined) {
      return indexProp;
    }
    if (indexFromContext !== undefined) {
      return indexFromContext;
    }
    if (stepsRef !== null && stepsRef !== void 0 && stepsRef.current) {
      const {
        index
      } = Array.from(stepsRef.current.values()).find(({
        id: currentId,
        title: originalTitleProp,
        stringifiedTitle
      }) => {
        var _originalTitleProp$pr;
        if (id !== undefined) {
          return id === currentId;
        }
        const translationId = originalTitleProp === null || originalTitleProp === void 0 || (_originalTitleProp$pr = originalTitleProp['props']) === null || _originalTitleProp$pr === void 0 ? void 0 : _originalTitleProp$pr.id;
        if (translationId) {
          var _title$props;
          return translationId === (title === null || title === void 0 || (_title$props = title['props']) === null || _title$props === void 0 ? void 0 : _title$props.id);
        }
        if (stringifiedTitle) {
          return stringifiedTitle === ariaLabel;
        }
        return originalTitleProp === title;
      }) || {};
      if (index !== undefined) {
        return index;
      }
    }
    if (totalSteps && stepIndexRef) {
      stepIndexRef.current += 1;
    }
    return stepIndexRef === null || stepIndexRef === void 0 ? void 0 : stepIndexRef.current;
  }, [indexProp, stepsRef, totalSteps, stepIndexRef, indexFromContext, title, id, ariaLabel]);
  if (!prerenderFieldProps && index >= totalSteps) {
    enableMapOverChildren();
  }
  if (include === false) {
    return null;
  }
  if (includeWhen && !check({
    visibleWhen: includeWhen
  })) {
    return null;
  }
  const fieldProps = typeof required === 'boolean' ? {
    required
  } : undefined;
  const childrenWithFieldProvider = fieldProps ? _react.default.createElement(_index.default, fieldProps, children) : children;
  if (prerenderFieldProps) {
    return _react.default.createElement(_StepContext.default.Provider, {
      value: {
        index
      }
    }, childrenWithFieldProvider);
  }
  const innerRef = activeIndex === index ? stepElementRef : null;
  const childrenWithFlex = _react.default.createElement(_StepContext.default.Provider, {
    value: {
      index
    }
  }, _react.default.createElement(_Flex.default.Stack, _extends({
    className: (0, _classnames.default)('dnb-forms-step', className),
    element: "section",
    "aria-label": ariaLabel,
    innerRef: innerRef,
    tabIndex: -1
  }, restProps), childrenWithFieldProvider));
  if (activeIndex !== index || includeWhen && !check({
    visibleWhen: includeWhen
  })) {
    if (keepInDOMProp !== null && keepInDOMProp !== void 0 ? keepInDOMProp : keepInDOM) {
      return _react.default.createElement("div", {
        title: "Wizard Step",
        hidden: true
      }, childrenWithFlex);
    }
    return null;
  }
  return childrenWithFlex;
}
Step._supportsSpacingProps = true;
var _default = exports.default = Step;
//# sourceMappingURL=Step.js.map