"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StackWrapper = void 0;
var _react = _interopRequireDefault(require("react"));
var _t = require("../../shared/i18n/t");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/*
 * Copyright OpenSearch Contributors
 * SPDX-License-Identifier: Apache-2.0
 */

const StackWrapper = ({
  children,
  hiddenChildrenCount,
  stackSpacing = 6,
  maxVisibleStacks = 2,
  button,
  isFaded
}) => {
  // Create array for background stack layers
  const stackElements = Array.from({
    length: maxVisibleStacks
  }, (_, index) => index + 1);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "osd:relative",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "osd:grid osd:relative",
      children: [stackElements.map(i => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "osd:col-start-1 osd:row-start-1 osd:w-68 osd:min-h-24 osd:rounded-xl osd:border-2 osd:border-solid osd:border-status-default osd:bg-container-default/50",
        style: {
          transform: `translate(-${i * stackSpacing}px, -${i * stackSpacing}px)`,
          zIndex: maxVisibleStacks - i,
          opacity: isFaded ? '0.3' : '1'
        },
        "aria-hidden": "true"
      }, i)), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "osd:col-start-1 osd:row-start-1",
        style: {
          zIndex: maxVisibleStacks + 1
        },
        children: children
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "osd:absolute osd:top-0 osd:right-0 osd:bg-blue-600 osd:text-white osd:text-xs osd:font-semibold osd:rounded-full osd:w-6 osd:h-6 osd:flex osd:items-center osd:justify-center osd:shadow-lg",
      style: {
        transform: 'translate(8px, -8px)',
        zIndex: maxVisibleStacks + 2
      },
      title: (0, _t.t)('node.hiddenChildren', {
        count: String(hiddenChildrenCount)
      }),
      role: "status",
      "aria-label": (0, _t.t)('node.hiddenChildren', {
        count: String(hiddenChildrenCount)
      }),
      children: ["+", hiddenChildrenCount]
    }), button && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "osd:absolute osd:top-1/2 osd:-translate-y-1/2",
      style: {
        right: '-16px',
        // -right-4 equivalent
        zIndex: maxVisibleStacks + 2
      },
      children: button
    })]
  });
};
exports.StackWrapper = StackWrapper;