import { h } from './chunks/d4789960.js';
import './chunks/456564be.js';
import { u as useProp } from './chunks/c26036df.js';
import { u as useEvent } from './chunks/d4058887.js';
import './chunks/4ccc6eeb.js';
import './chunks/34f18ef7.js';
import { g as getComponentOrDefine } from './chunks/071ed725.js';
import './chunks/23e44913.js';
import { M as Maybe_3 } from './chunks/d76d6172.js';
import './kun-icon.js';
import './kun-button-puer.js';

var style = ":host {\n}\n\n.kun-dialog-bg {\n  z-index: 99;\n  background-color: rgba(0,0,0,.3);\n}\n\n.fixed {\n  width: 300px;\n  position: fixed;\n  margin-left: auto;\n  margin-right: auto;\n  left: 0;\n  right: 0;\n  top: 15%;\n}\n\n.content {\n  min-height: 100px;\n}\n\n.kun-dialog-header {\n  height: 65px;\n  border-bottom-color: #80808047;\n  border-bottom-style: solid;\n  border-bottom-width: 1px;\n}";

const KunDialog = () => {
  const [title] = useProp("kunTitle");
  const [kunWidth] = useProp("kunWidth");
  const [hasButtonProp] = useProp("hasButton");
  const hasButton = Maybe_3.fromNullable(hasButtonProp).orDefault(true);
  const width = Maybe_3.fromNullable(kunWidth).orDefault(500);
  const [open, setOpen] = useProp("open");
  const onClose = useEvent("MyClose", {
    composed: true,
    bubbles: true
  });

  const close = () => {
    setOpen(false);
    onClose({});
  };

  return h("host", {
    shadowDom: true
  }, h("style", null, style), open && h("div", {
    class: "flex fixed w-screen h-screen kun-dialog-bg top-0 left-0 "
  }, h("div", {
    style: {
      width: `${width}px`
    },
    class: "z-10 fixed rounded bg-white overflow-hidden shadow-lg px-4 border-r border-b border-l border-gray-400 lg:border-l-0 lg:border-t lg:border-gray-400 bg-white rounded-b lg:rounded-b-none lg:rounded-r "
  }, h("div", {
    class: "flex-row flex justify-between items-center kun-dialog-header"
  }, h("div", {
    className: "text-3xl"
  }, title), h("kun-icon", {
    iconType: "close",
    onclick: close,
    iconWidth: 18,
    iconHeight: 18
  })), h("div", {
    class: "content py-2"
  }, h("slot", {
    name: "content"
  })), hasButton && h("div", {
    className: "flex py-4"
  }, h("kun-button-puer", {
    needleContent: "\u5173\u95ED",
    onMyClick: close
  })))), h("global-style", null));
};

KunDialog.props = {
  hasButton: {
    type: Boolean
  },
  kunWidth: {
    type: Number
  },
  open: {
    type: Boolean
  },
  kunTitle: {
    type: String
  }
};
var kunDialog = getComponentOrDefine("kun-dialog", KunDialog);

export default kunDialog;
//# sourceMappingURL=kun-dialog.js.map
