import { useProp, useEvent, h } from 'atomico';
import { g as getComponentOrDefine } from './chunks/65ef80fe.js';

var style = ":host {\n}\n";

const _jsxFileName = "/Users/rang/rang/frond_ng/packages/six/src/components/kun-load-more/kun-load-more.tsx";
const KunLoadMore = ({ }) => {
  const [loading] = useProp("loading");
  const [hasMore] = useProp("hasMore");
  const myClick = useEvent("MyClick", {
    composed: true,
    bubbles: true,
  });

  return (
    h('host', {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 16}}
      , h('style', {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 17}}, style)
      , h('div', { class: "my-4", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 18}}
        , loading && (
        h('div', { className: "flex flex-row items-center justify-center border cursor-pointer leading-8 rounded border-gray-400 mx-auto text-center h-12 items-center"            , __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 20}}, "..."

        )
        )
        , 
                    !loading && hasMore && (
                    h('div', {
                      class: "flex flex-row items-center justify-center border cursor-pointer leading-8 rounded border-gray-400 mx-auto text-center h-12 items-center"            ,
                      onclick: () => myClick({}), __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 26}}
                    , "加载更多"

                    )
                    )
                
      )
    )
  );
};

KunLoadMore.props = {
  hasMore: {
    type: Boolean,
    value: true,
  },
  loading: {
    type: Boolean,
    value: false,
    reflect: true,
    event: {
      type: "changeMessage",
    },
  },
};

var kunLoadMore = getComponentOrDefine("kun-load-more", KunLoadMore);

export default kunLoadMore;
