/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
import _extends from "@babel/runtime/helpers/extends";
import "./index.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React from 'react';
import { CustomBlock } from '../../../../FlexibleCard/components/blocks';
import ActionGroup from '../../../../FlexibleCard/components/blocks/action-group';
import { LoadingSkeleton } from '../../../../FlexibleCard/components/common/loading-skeleton';
import { BaseIconElement } from '../../../../FlexibleCard/components/elements/common';
import { CARD_WIDTH_REM } from '../../../styled';
const loadingViewContainer = null;
const skeletonContainer = null;
const titleStyle = null;
const titleBlockStyles = null;
const HoverCardLoadingView = ({
  titleBlockProps
}) => {
  const testId = 'hover-card-loading-view';
  const lineHeightRem = 1.25;
  const skeletonWidth = CARD_WIDTH_REM - 2;
  const {
    size,
    actions
  } = titleBlockProps;
  const actionGroup = (actions === null || actions === void 0 ? void 0 : actions.length) && (actions === null || actions === void 0 ? void 0 : actions.length) > 0 && /*#__PURE__*/React.createElement(ActionGroup, {
    items: actions,
    visibleButtonsNum: 2
  });
  return /*#__PURE__*/React.createElement("div", {
    "data-testid": testId,
    className: ax(["_1e0c1txw _2lx21bp4 _ca0q1e9d _u5f31e9d _n3td1e9d _19bv1e9d"])
  }, /*#__PURE__*/React.createElement("div", {
    className: ax(["_zulpud5o _1e0c1txw _2lx21bp4 _4cvr1h6o"])
  }, /*#__PURE__*/React.createElement(CustomBlock, _extends({}, titleBlockProps, {
    testId: `${testId}-title-block`,
    className: ax(["_zulpcxkx _1bsb1osq"])
  }), /*#__PURE__*/React.createElement(BaseIconElement, {
    render: () => /*#__PURE__*/React.createElement(LoadingSkeleton, null),
    size: size
  }), /*#__PURE__*/React.createElement("span", {
    "data-testid": `${testId}-title`,
    className: ax(["_16jlkb7n _1o9zidpf _i0dl1wug _4t3i1k92 _e2oo1osq"])
  }, /*#__PURE__*/React.createElement(LoadingSkeleton, {
    height: `${lineHeightRem}rem`
  })), actionGroup), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LoadingSkeleton, {
    width: `${skeletonWidth}rem`,
    height: `${lineHeightRem}rem`
  }), /*#__PURE__*/React.createElement(LoadingSkeleton, {
    width: `${skeletonWidth}rem`,
    height: `${lineHeightRem * 3}rem`
  }), /*#__PURE__*/React.createElement(LoadingSkeleton, {
    width: `${skeletonWidth}rem`,
    height: `${lineHeightRem}rem`
  }))));
};
export default HoverCardLoadingView;