import { s as script$1 } from './headerText-0fd3adc1.mjs';
import { s as script$2 } from './paragraphText-9913c76e.mjs';
import { s as script$3 } from './normalText-66005fcf.mjs';
import { resolveComponent, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, Fragment, renderList, createTextVNode, toDisplayString, createBlock, normalizeClass } from 'vue';

var script = {
    components: {
        TsHeaderText: script$1,
        TsParagraphText: script$2,
        TsNormalText: script$3,
    },
    props: {
        data: {
            type: Array,
            required: true,
        },
    },
    name: "TsTransactionHistory",
};

const _hoisted_1 = { class: "flex flex-col w-full col-span-full space-y-2" };
const _hoisted_2 = { class: "mdlg:!px-3 mdlg:!py-3 px-2 py-2 border-[1px] mdlg:!space-y-0 space-y-1 border-gray-200 rounded flex mdlg:!flex-row flex-col mdlg:!items-center items-start" };
const _hoisted_3 = { class: "mdlg:!w-[20%] w-full flex mdlg:!flex-row flex-row justify-between" };
const _hoisted_4 = /*#__PURE__*/createTextVNode(" Date ");
const _hoisted_5 = /*#__PURE__*/createTextVNode(" Amount ");
const _hoisted_6 = { class: "mdlg:!w-[65%] w-full flex mdlg:!flex-row flex-col mdlg:!justify-between items-start mdlg:!space-y-0 space-y-1" };
const _hoisted_7 = /*#__PURE__*/createTextVNode(" Details ");
const _hoisted_8 = { class: "mdlg:!w-[15%] w-[50%] flex-row justify-end mdlg:!flex hidden" };
const _hoisted_9 = /*#__PURE__*/createTextVNode(" Amount ");
const _hoisted_10 = { class: "mdlg:!w-[20%] w-full flex mdlg:!flex-row flex-row mdlg:!justify-start justify-between" };
const _hoisted_11 = { class: "mdlg:!w-[65%] w-full flex flex-row space-x-2 items-center" };
const _hoisted_12 = /*#__PURE__*/createElementVNode("span", {
  class: /*#__PURE__*/normalizeClass(`h-[4px] mr-2 w-[4px] bg-paragraphTextLight rounded-full`)
}, null, -1 /* HOISTED */);
const _hoisted_13 = { class: "mdlg:!w-[15%] w-[10%] mdlg:!flex hidden flex-row justify-end" };

function render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ts_header_text = resolveComponent("ts-header-text");
  const _component_ts_paragraph_text = resolveComponent("ts-paragraph-text");
  const _component_ts_normal_text = resolveComponent("ts-normal-text");

  return (openBlock(), createElementBlock("div", _hoisted_1, [
    createElementVNode("div", _hoisted_2, [
      createElementVNode("div", _hoisted_3, [
        createVNode(_component_ts_header_text, { size: 'base' }, {
          default: withCtx(() => [
            _hoisted_4
          ]),
          _: 1 /* STABLE */
        }),
        createVNode(_component_ts_header_text, {
          size: 'base',
          customClass: 'inline mdlg:!hidden'
        }, {
          default: withCtx(() => [
            _hoisted_5
          ]),
          _: 1 /* STABLE */
        })
      ]),
      createElementVNode("div", _hoisted_6, [
        createVNode(_component_ts_header_text, { size: 'base' }, {
          default: withCtx(() => [
            _hoisted_7
          ]),
          _: 1 /* STABLE */
        })
      ]),
      createElementVNode("div", _hoisted_8, [
        createVNode(_component_ts_header_text, { size: 'base' }, {
          default: withCtx(() => [
            _hoisted_9
          ]),
          _: 1 /* STABLE */
        })
      ])
    ]),
    (openBlock(true), createElementBlock(Fragment, null, renderList($props.data, (transaction, index) => {
      return (openBlock(), createElementBlock("div", {
        class: "mdlg:!px-3 mdlg:!py-3 px-2 py-2 border-[1px] border-gray-200 rounded flex mdlg:!flex-row mdlg:!space-y-0 space-y-1 flex-col mdlg:!items-center items-start",
        key: index
      }, [
        createElementVNode("div", _hoisted_10, [
          createVNode(_component_ts_paragraph_text, { faded: true }, {
            default: withCtx(() => [
              createTextVNode(toDisplayString(transaction.date), 1 /* TEXT */)
            ]),
            _: 2 /* DYNAMIC */
          }, 1024 /* DYNAMIC_SLOTS */),
          createVNode(_component_ts_normal_text, {
            customClass: 'inline-block mdlg:!hidden',
            color: `${
            transaction.type == 'credit' ? 'text-primaryGreen' : 'text-errorColor'
          }`
          }, {
            default: withCtx(() => [
              createTextVNode(toDisplayString(transaction.amount), 1 /* TEXT */)
            ]),
            _: 2 /* DYNAMIC */
          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["color"])
        ]),
        createElementVNode("div", _hoisted_11, [
          (openBlock(true), createElementBlock(Fragment, null, renderList(transaction.content, (name, index) => {
            return (openBlock(), createBlock(_component_ts_normal_text, {
              key: index,
              color: 'text-paragraphTextLight'
            }, {
              default: withCtx(() => [
                (index == 0)
                  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
                      createTextVNode(toDisplayString(name), 1 /* TEXT */)
                    ], 64 /* STABLE_FRAGMENT */))
                  : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
                      _hoisted_12,
                      createTextVNode(" " + toDisplayString(name), 1 /* TEXT */)
                    ], 64 /* STABLE_FRAGMENT */))
              ]),
              _: 2 /* DYNAMIC */
            }, 1024 /* DYNAMIC_SLOTS */))
          }), 128 /* KEYED_FRAGMENT */))
        ]),
        createElementVNode("div", _hoisted_13, [
          createVNode(_component_ts_normal_text, {
            color: `${
            transaction.type == 'credit' ? 'text-primaryGreen' : 'text-errorColor'
          }`
          }, {
            default: withCtx(() => [
              createTextVNode(toDisplayString(transaction.amount), 1 /* TEXT */)
            ]),
            _: 2 /* DYNAMIC */
          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["color"])
        ])
      ]))
    }), 128 /* KEYED_FRAGMENT */))
  ]))
}

script.render = render;
script.__file = "src/components/TsTransactionHistory/index.vue";

export { script as default };
