import { h } from './chunks/d4789960.js';
import './chunks/456564be.js';
import { u as useProp } from './chunks/c26036df.js';
import './chunks/4ccc6eeb.js';
import { g as getComponentOrDefine, r as redirect } from './chunks/071ed725.js';
import './chunks/23e44913.js';
import './chunks/a02c5734.js';
import { M as Maybe_3 } from './chunks/d76d6172.js';
import './kun-icon.js';
import './chunks/cd857e99.js';
import './kun-image-or-default.js';
import './chunks/e5702756.js';
import './kun-image.js';
import { g as getKunImageUrl } from './chunks/8c68f334.js';
import './kun-avatar-dropdown.js';
import './chunks/1c3fc91c.js';
import { R as ROUTES } from './chunks/31c885ba.js';
import { G as GlobalConfig } from './chunks/88bb1718.js';

var style = ".fixed-header {\n  width: 100%;\n  height: 56px;\n  display: flex;\n  justify-content: center;\n  background-color: white;\n  align-items: center;\n  border-bottom-color: rgba(234,234,234,1);\n  border-bottom-style: solid;\n  border-bottom-width: 1px;\n}\n\n.arrow-dropdown {\n  display: flex;\n  margin-right: 5px;\n  cursor: pointer;\n  align-items: center;\n}\n\n.right-handler {\n  display: flex;\n  height: 56px;\n  align-items: center;\n  justify-content: flex-end;\n}\n\n.centered {\n  height: 55px;\n  max-height: 55px;\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  background-color: white;\n  align-items: center;\n}\n\n.icon-edit {\n  background-image: url(\"data:image/svg+xml,%3Csvg t='1573746674663' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='6420' width='200' height='200'%3E%3Cpath d='M541.354667 235.588267l254.293333 253.815466c-2.798933 1.6384-7.099733 3.208533-10.103467 6.144-126.088533 124.791467-252.381867 249.4464-377.856 374.920534-16.384 16.384-33.9968 26.8288-56.1152 33.109333-86.016 24.439467-171.758933 50.107733-257.6384 75.229867-19.114667 5.597867-34.133333 0.546133-43.8272-14.336-6.3488-9.762133-6.3488-20.48-3.208533-31.1296 27.374933-93.934933 54.8864-187.733333 82.7392-281.531734 2.048-6.826667 6.3488-13.653333 11.400533-18.6368C271.837867 503.3984 402.909867 373.896533 533.845333 244.3264c2.798933-2.730667 5.256533-6.075733 7.509334-8.738133z m-349.866667 456.704c-1.365333 3.959467-2.389333 6.7584-3.208533 9.6256-11.605333 39.3216-21.777067 79.189333-35.293867 117.828266-7.031467 20.138667-5.051733 34.269867 12.4928 46.2848a38.843733 38.843733 0 0 1 8.533333 8.465067c3.822933 4.983467 8.123733 5.12 13.789867 3.413333 32.085333-9.693867 64.375467-19.114667 96.6656-28.603733l49.493333-14.472533c-2.730667-3.072-4.164267-5.461333-6.280533-7.031467a41.028267 41.028267 0 0 1-17.954133-38.775467c0.477867-6.144-0.341333-12.288-0.682667-18.432l-3.2768-51.882666c-23.620267-1.911467-46.011733-4.232533-68.471467-5.393067-16.384-0.8192-31.812267-2.4576-41.847466-17.749333-0.682667-0.955733-1.8432-1.570133-3.959467-3.2768zM919.552 346.794667L678.843733 106.2912c19.456-17.6128 35.089067-40.7552 60.6208-53.0432 30.72-14.813867 68.949333-7.850667 96.256 18.978133 39.594667 38.980267 79.121067 78.165333 117.896534 117.9648 35.84 36.795733 35.293867 86.4256-0.477867 123.221334-11.127467 11.4688-22.7328 22.528-33.518933 33.314133z m-32.768 47.3088l-54.818133 51.4048-251.426134-251.357867 54.8864-51.473067 251.426134 251.426134z' fill='%23ffffff' p-id='6421'%3E%3C/path%3E%3C/svg%3E\");\n  background-size: cover;\n}\n\n.logo-avatar {\n  --deckgo-lazy-img-border-radius: 50%;\n  --deckgo-lazy-img-height: 41px;\n  --deckgo-lazy-img-width: 41px;\n  --deckgo-lazy-img-border:1px solid rgba(234,234,234,1);\n}\n\n.icon-menu {\n  width: 24px;\n  height: 24px;\n  margin-right: 4px;\n}\n\n.navigator-menu {\n  cursor: pointer;\n  margin-right: 40px;\n  font-size: 20px;\n  color:rgba(159,159,159,1);\n  line-height:28px;\n}\n\n.navigator {\n  display: flex;\n  justify-content: flex-start;\n}\n\n.icon-with-name {\n  margin-right: 50px;\n  color: rgba(137, 137, 137, 1);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n\n.icon {\n  width: 24px;\n  height: 24px;\n}\n\n.logo {\n  cursor: pointer;\n  margin-right: 50px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n\n.img-logo {\n  width: 56px;\n  height: 56px;\n}\n\n.menu {\n  display: flex;\n  align-items: center;\n}\n\n.message-icon {\n  background-size: cover;\n  background-image: url(\"data:image/svg+xml,%3Csvg t='1573745253123' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='6248' width='200' height='200'%3E%3Cpath d='M633 798.1c0 66.5-53.9 120.5-120.5 120.5S392 864.6 392 798.1h241zM809.4 674.2c-43.7-54.7-69.1-95.6-71.7-165.5l-7.2-193.2c0-26.5-0.4-203.8-222.7-194.4-97 0-178.9 64.3-205.6 152.6-5.7 15.4-10.2 66.6-10.2 69l-5.5 165.6c-2.3 70.4-28.1 111.6-71.8 166.9-7.3 9.2-13.6 18.8-19 28.7-18.2 34 6.1 75.1 44.7 75.1h543.9c38.6 0 62.9-41.2 44.7-75.1-5.4-10.2-12-20.2-19.6-29.7z' fill='%23898989' p-id='6249'%3E%3C/path%3E%3C/svg%3E\");\n}\n\n.create-menu:hover {\n  opacity: 0.7;\n}\n\n.logo-title {\n  font-weight:800;\n  font-size:24px;\n  color:rgba(0,33,64,1);\n}\n\n.create-menu {\n  align-items:center;\n  cursor: pointer;\n  height:41px;\n  width:138px;\n  background:rgba(255,167,47,1);\n  border-radius:31px;\n  justify-content: center;\n  display: flex;\n  line-height: 41px;\n  color: white;\n}\n";

const convertEmptyString = data => {
  if (data === "undefined") return undefined;
  if (data == null) return undefined;
  if (data.length === 0) return undefined;
  return data;
};

function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }const menus = [{
  content: "我的资料",
  href: ROUTES.ProfileAvatar
}, {
  content: "我的学习",
  href: ROUTES.LearningPlan
}, {
  content: "创作中心",
  href: ROUTES.MyCreatedSeries
}, {
  content: "帮助文档",
  href: ROUTES.HelpDocs
}];

const KunSimpleHeader = () => {
  const [hasMenu] = useProp("hasMenu");
  const [maxWidht] = useProp("maxWidth");

  const click2Home = () => {
    redirect("/web/plume/moment");
  };

  const click2Message = () => {
    redirect(ROUTES.Messages);
  };

  const defaultAvatar = "https://img13.360buyimg.com/n7/18448/2e13ced5-2e14-4c3a-b83e-8ae02c97c0aa.jpg";
  const avatar = Maybe_3.fromNullable(convertEmptyString(localStorage.getItem("userAvatar"))).map(getKunImageUrl).orDefault(defaultAvatar);
  const style1 = `
  .header-page {
    max-width: ${_nullishCoalesce(maxWidht, () => ( GlobalConfig.maxWidth))}px;
  }
  ${style}
`;
  return h("host", null, h("style", null, style1), h("div", {
    className: "fixed-header"
  }, h("div", {
    className: "centered header-page "
  }, h("div", {
    className: "navigator"
  }, h("div", {
    className: "logo",
    onclick: click2Home,
    role: "presentation"
  }, h("kun-icon", {
    iconType: "logo",
    class: "header-img-logo",
    iconWidth: 100,
    iconHeight: 100
  }))), hasMenu && h("div", {
    className: "right-handler"
  }, h("div", {
    className: "icon-with-name",
    onclick: click2Message
  }, h("div", {
    className: "header-message-icon icon"
  }), "\u6D88\u606F"), h("kun-avatar-dropdown", {
    "seek-menus": menus,
    "seek-avatar": avatar
  })))));
};

KunSimpleHeader.props = {
  maxWidth: {
    type: Number,
    reflect: true
  },
  hasMenu: {
    type: Boolean,
    value: true,
    reflect: true
  },
  message: {
    type: String,
    value: "kun-simple-header",
    reflect: true,
    event: {
      type: "changeMessage"
    }
  }
};
var kunSimpleHeader = getComponentOrDefine("kun-simple-header", KunSimpleHeader);

export default kunSimpleHeader;
//# sourceMappingURL=kun-simple-header.js.map
