@dnb/eufemia/cjs/components/progress-indicator/ProgressIndicatorLinear.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _componentHelper = require("../../shared/component-helper.js");
var _jsxRuntime = require("react/jsx-runtime");
function usePrevious(value) {
  const ref = (0, _react.useRef)(undefined);
  (0, _react.useEffect)(() => {
    ref.current = value;
  }, [value]);
  return [ref.current, value];
}
function ProgressIndicatorLine(props) {
  const {
    size,
    title,
    progress,
    show,
    onComplete,
    callOnCompleteHandler,
    customColors,
    style,
    ...rest
  } = props;
  const onCompleteIsFn = typeof onComplete === 'function' && typeof callOnCompleteHandler === 'function';
  const [showCurrent, showPrev] = usePrevious(show);
  if (onCompleteIsFn && !showCurrent && showPrev) {
    callOnCompleteHandler();
  }
  const hasProgressValue = progress > -1;
  const transform = `translateX(${(progress || 0) - 100}%)`;
  if (hasProgressValue) {
    rest.role = 'progressbar';
    rest['aria-label'] = title;
    rest['title'] = title;
  } else {
    rest.role = 'alert';
    rest['aria-busy'] = true;
  }
  const remainingDOMAttributes = (0, _componentHelper.validateDOMAttributes)(props, {
    ...rest
  });
  return (0, _jsxRuntime.jsxs)("span", {
    className: 'dnb-progress-indicator__linear' + (size ? ` dnb-progress-indicator__linear--${size}` : ""),
    style: {
      ...style,
      ...((customColors === null || customColors === void 0 ? void 0 : customColors.shaft) && {
        backgroundColor: customColors === null || customColors === void 0 ? void 0 : customColors.shaft
      })
    },
    ...remainingDOMAttributes,
    children: [(0, _jsxRuntime.jsx)("span", {
      className: "dnb-progress-indicator__linear__bar " + (hasProgressValue ? 'dnb-progress-indicator__linear__bar-transition' : 'dnb-progress-indicator__linear__bar1-animation'),
      style: {
        backgroundColor: customColors === null || customColors === void 0 ? void 0 : customColors.line,
        transform: hasProgressValue ? transform : undefined
      }
    }), !hasProgressValue && (0, _jsxRuntime.jsx)("span", {
      className: "dnb-progress-indicator__linear__bar dnb-progress-indicator__linear__bar2-animation",
      style: {
        backgroundColor: customColors === null || customColors === void 0 ? void 0 : customColors.line
      }
    })]
  });
}
var _default = exports.default = ProgressIndicatorLine;
//# sourceMappingURL=ProgressIndicatorLinear.js.map