/**
 * ldesign v0.2.13
 * (c) 2022/10/31 18:13 built by swimly
 * @license MIT
 */

import VueCompositionAPI from '@vue/composition-api';
import { c as components } from './dep-ab0a895c.js';
import { withInstall } from '../utils/with-install.js';
import Vue from 'vue';
import { Button } from '../components/button/index.js';
import { Icon } from '../components/icon/index.js';
import '../components/loading/plugin.js';
import '../components/loading/index.js';
import '../components/radio/index.js';
import { Popup } from '../components/popup/index.js';
import { Avatar } from '../components/avatar/index.js';
import '../components/badge/index.js';
import '../components/comment/index.js';
import '../components/list/index.js';
import '../components/progress/index.js';
import '../components/skeleton/index.js';
import { Divider } from '../components/divider/index.js';
import { Row, Col } from '../components/grid/index.js';
import { Aside, Header, Footer, Layout, Content as Content$1 } from '../components/layout/index.js';
import '../components/checkbox/index.js';
import '../components/form/index.js';
import '../components/input/index.js';
import '../components/tag/index.js';
import '../components/tag-input/index.js';
import '../components/textarea/index.js';
import '../components/input-number/index.js';
import '../components/switch/index.js';
import '../components/input-adornment/index.js';
import '../components/slider/index.js';
import '../components/alert/index.js';
import '../components/dialog/plugin.js';
import '../components/dialog/index.js';
import { Drawer } from '../components/drawer/index.js';
import '../components/message/plugin.js';
import '../components/message/index.js';
import '../components/notification/plugin.js';
import '../components/notification/index.js';
import '../components/popconfirm/index.js';
import { Space } from '../components/space/index.js';
import '../components/affix/index.js';
import '../components/anchor/index.js';
import '../components/tooltip/index.js';
import '../components/breadcrumb/index.js';
import { Dropdown } from '../components/dropdown/index.js';
import { Submenu, MenuItem, Menu } from '../components/menu/index.js';
import '../components/tabs/index.js';
import '../components/select/index.js';
import '../components/select-input/index.js';
import { Pagination } from '../components/pagination/index.js';
import '../components/steps/index.js';
import '../components/link/index.js';
import '../components/tree/index.js';
import '../components/cascader/index.js';
import '../components/tree-select/index.js';
import '../components/transfer/index.js';
import '../components/upload/index.js';
import '../components/range-input/index.js';
import '../components/time-picker/interface.js';
import '../components/time-picker/index.js';
import '../components/date-picker/index.js';
import '../components/jumper/index.js';
import '../components/color-picker/index.js';
import '../components/calendar/index.js';
import '../components/collapse/index.js';
import '../components/swiper/index.js';
import '../components/card/index.js';
import '../components/config-provider/index.js';
import '../components/watermark/index.js';
import { Image } from '../components/image/index.js';
import '../components/image-viewer/index.js';
import '../components/rate/index.js';
import '../components/table/index.js';
import { ChevronDownIcon, ChevronUpIcon } from '@ldesign/icons-vue';
import mixins from '../utils/mixins.js';
import props$1 from '../templates/avatar/props.js';
import { h as helper } from './dep-9372b79b.js';
import { renderLNodeJSX, renderContent } from '../utils/render-node.js';
import { LdesignGridProps, LdesingGridItemProps } from '../templates/grid/props.js';
import { LdesignLogo } from '../templates/logo/index.js';
import props$2 from '../templates/setting/props.js';
import props$3 from '../templates/header/props.js';
import { isFunction } from 'lodash';
import { QueryContentProps, QueryButtonProps, QueryPreviewProps, QueryProps } from '../templates/query/props.js';
import props$4 from '../templates/layout/props.js';
import props$5 from '../templates/page/props.js';
import { LdesignQuickListItemProps, LdesignQuickListProps } from '../templates/quick-list/props.js';
import { MenuItemProps, MenuProps } from '../templates/menu/props.js';
import { hasChildren } from '../templates/menu/utils.js';
import props from '../templates/aside/props.js';

var _LdesignMenuItem = Vue.extend({
  name: "LdesignMenuItem",
  props: {
    ...MenuItemProps
  },
  render() {
    const h = arguments[0];
    return h("div", [this.list.map(item => {
      if (item.children) {
        return h(Submenu, {
          "attrs": {
            "title": item.meta.title,
            "value": item.path
          }
        }, [h(_LdesignMenuItem, {
          "attrs": {
            "list": item.children
          }
        })]);
      } else {
        return h(MenuItem, {
          "attrs": {
            "value": item.path,
            "to": item.path
          }
        }, [item.meta.title]);
      }
    })]);
  }
});

var _LdesignMenu = mixins(Vue).extend({
  name: "LdesignMenu",
  props: {
    ...MenuProps
  },
  inject: {
    page: {
      default: void 0
    }
  },
  computed: {
    dataList() {
      var _this$page, _this$page$menuProps;
      return this.page.menuProps ? (_this$page = this.page) === null || _this$page === void 0 ? void 0 : (_this$page$menuProps = _this$page.menuProps) === null || _this$page$menuProps === void 0 ? void 0 : _this$page$menuProps.list : this.list;
    },
    activePath() {
      var _this$page2, _this$page2$menuProps;
      return this.page.menuProps ? (_this$page2 = this.page) === null || _this$page2 === void 0 ? void 0 : (_this$page2$menuProps = _this$page2.menuProps) === null || _this$page2$menuProps === void 0 ? void 0 : _this$page2$menuProps.active : this.active;
    },
    expandedPaths() {
      var _this$page3, _this$page3$menuProps;
      return this.page.menuProps ? (_this$page3 = this.page) === null || _this$page3 === void 0 ? void 0 : (_this$page3$menuProps = _this$page3.menuProps) === null || _this$page3$menuProps === void 0 ? void 0 : _this$page3$menuProps.expanded : this.expanded;
    }
  },
  watch: {},
  render(h) {
    return h(Menu, {
      "attrs": {
        "defaultValue": this.activePath,
        "defaultExpanded": this.expandedPaths
      }
    }, [this.dataList.map(item => {
      if (hasChildren(item)) {
        return h(Submenu, {
          "attrs": {
            "title": item.meta.title,
            "value": item.path
          }
        }, [h("template", {
          "slot": "icon"
        }, [typeof item.icon === "string" && h("span", {
          "class": "ldesign-menu__icon",
          "domProps": {
            "innerHTML": item.icon
          }
        })]), h(_LdesignMenuItem, {
          "attrs": {
            "list": item.children
          }
        })]);
      } else {
        return h(MenuItem, {
          "attrs": {
            "value": item.path,
            "to": item.path
          }
        }, [h("template", {
          "slot": "icon"
        }, [typeof item.icon === "string" && h("span", {
          "class": "ldesign-menu__icon",
          "domProps": {
            "innerHTML": item.icon
          }
        })]), h("span", [item.meta.title])]);
      }
    })]);
  }
});

const LdesignMenu = withInstall(_LdesignMenu);
const LdesignMenuItem = withInstall(_LdesignMenuItem);

var _LdesignAside = Vue.extend({
  name: "LdesignAside",
  props: {
    ...props
  },
  render() {
    const h = arguments[0];
    return h("div", [h(LdesignMenu)]);
  }
});

const LdesignAside = withInstall(_LdesignAside);

var _LdesignAvatar = mixins(Vue).extend({
  name: "LdesignLogo",
  inject: {
    page: {
      default: void 0
    }
  },
  computed: {
    _isInject() {
      return this.page.avatarProps !== void 0;
    },
    _image() {
      var _this$page, _this$page$avatarProp;
      return (this === null || this === void 0 ? void 0 : (_this$page = this.page) === null || _this$page === void 0 ? void 0 : (_this$page$avatarProp = _this$page.avatarProps) === null || _this$page$avatarProp === void 0 ? void 0 : _this$page$avatarProp.image) || this.image;
    },
    _nickname() {
      var _this$page2, _this$page2$avatarPro;
      return (this === null || this === void 0 ? void 0 : (_this$page2 = this.page) === null || _this$page2 === void 0 ? void 0 : (_this$page2$avatarPro = _this$page2.avatarProps) === null || _this$page2$avatarPro === void 0 ? void 0 : _this$page2$avatarPro.nickname) || this.nickname;
    },
    _menu() {
      var _this$page3, _this$page3$avatarPro;
      return (this === null || this === void 0 ? void 0 : (_this$page3 = this.page) === null || _this$page3 === void 0 ? void 0 : (_this$page3$avatarPro = _this$page3.avatarProps) === null || _this$page3$avatarPro === void 0 ? void 0 : _this$page3$avatarPro.menu) || this.menu;
    }
  },
  props: {
    ...props$1
  },
  render() {
    const h = arguments[0];
    this.page.logoProps;
    return h(Dropdown, {
      "attrs": {
        "options": this._menu
      }
    }, [h(Button, {
      "attrs": {
        "variant": "text"
      }
    }, [h(Space, {
      "attrs": {
        "align": "center",
        "size": "6px"
      }
    }, [h(Avatar, {
      "attrs": {
        "image": this._image && this._image
      }
    }, [!this._image && this._nickname]), h("span", [this._nickname]), h(ChevronDownIcon)])])]);
  }
});

const LdesignAvatar = withInstall(_LdesignAvatar);

var _LdesignGrid = Vue.extend({
  name: "LdesignGrid",
  props: {
    ...LdesignGridProps
  },
  render() {
    const h = arguments[0];
    return h(Row, helper([{
      "class": "ldesign-grid"
    }, {
      "props": this.rowProps
    }]), [renderLNodeJSX(this, "default")]);
  }
});

var _LdesignGridItem = Vue.extend({
  name: "LdesignGridItem",
  props: {
    ...LdesingGridItemProps
  },
  render() {
    const h = arguments[0];
    return h(Col, helper([{}, {
      "props": this.colProps
    }, {
      "class": "ldesign-grid__item"
    }]), [h("div", {
      "class": "ldesign-panel"
    }, [h("div", {
      "class": "ldesign-panel__header"
    }), h("div", {
      "class": "ldesign-panel__body"
    }, [renderLNodeJSX(this, "default")])])]);
  }
});

const LdesignGrid = withInstall(_LdesignGrid);
const LdesignGridItem = withInstall(_LdesignGridItem);
var index$1 = {
  LdesignGrid,
  LdesignGridItem
};

var _LdesignSetting = Vue.extend({
  name: "LdesignSetting",
  props: {
    ...props$2
  },
  data() {
    return {
      visible: false
    };
  },
  methods: {
    onClick() {
      this.visible = !this.visible;
    }
  },
  render() {
    const h = arguments[0];
    const listeners = {
      "update:visible": v => {
        this.visible = v;
      }
    };
    return h("div", [h(Button, {
      "attrs": {
        "variant": "text",
        "shape": "square"
      },
      "on": {
        "click": this.onClick
      }
    }, [h(Icon, {
      "slot": "icon",
      "attrs": {
        "name": "setting"
      }
    })]), h(Drawer, {
      "attrs": {
        "header": "\u7CFB\u7EDF\u8BBE\u7F6E",
        "visible": this.visible,
        "size": "500px"
      },
      "on": {
        ...listeners,
        "overlayClick": this.onClick
      }
    }, [h("p", ["3333"])])]);
  }
});

const LdesignSetting = withInstall(_LdesignSetting);

var _LdesignHeader = Vue.extend({
  name: "LdesignHeader",
  props: {
    ...props$3
  },
  render() {
    const h = arguments[0];
    return h("div", {
      "class": "ldesign-header"
    }, [h("div", {
      "class": "ldesign-header__prefix"
    }, [h(LdesignLogo)]), h("div", {
      "class": "ldesign-header__content"
    }), h("div", {
      "class": "ldesign-header__suffix"
    }, [h(Space, {
      "attrs": {
        "size": "8px"
      }
    }, [h(LdesignAvatar), h(LdesignSetting)])])]);
  }
});

const LdesignHeader = withInstall(_LdesignHeader);

var Content = mixins(Vue).extend({
  name: "LdesignQueryContent",
  props: {
    ...QueryContentProps
  },
  inject: {
    query: {
      default: void 0
    }
  },
  computed: {
    itemStyle() {
      return item => {
        const grid = item.grid ? item.grid : 1;
        return {
          width: `${this.itemWidth * grid}%`
        };
      };
    },
    lastItemStyle() {
      const grids = this.conditions.map(item => item.grid || 1);
      const total = grids.reduce((a, b) => a + b, 0);
      const last = this.query.grid - total % this.query.grid;
      return {
        width: `${100 / this.query.grid * last}%`
      };
    },
    styles() {
      return this.query.theme === "popup" ? {
        display: "flex"
      } : null;
    }
  },
  render(h) {
    return h("div", {
      "class": "ldesign-query__content",
      "style": this.styles
    }, [this.conditions.map((item, index) => {
      return h("div", {
        "class": "ldesign-query__item",
        "key": index,
        "style": this.itemStyle(item)
      }, [h("div", {
        "class": "ldesign-query__wrap"
      }, [h("h2", {
        "class": "ldesign-query__title"
      }, [item.title]), h("div", {
        "class": "ldesign-query__value"
      }, [h(item.component, {
        props: item.props,
        on: {
          ...item.on
        }
      })])])]);
    }), this.query.isExpanded && h("div", {
      "class": "ldesign-query__item",
      "style": this.lastItemStyle
    }, [h(Buttons)])]);
  }
});

var Buttons = mixins(Vue).extend({
  name: "LdesignPage",
  props: {
    ...QueryButtonProps
  },
  inject: {
    query: {
      default: void 0
    }
  },
  computed: {
    label() {
      return this.query.isExpanded ? "\u6536\u8D77" : "\u5C55\u5F00";
    },
    icon() {
      return !this.query.isExpanded ? ChevronDownIcon : ChevronUpIcon;
    }
  },
  render(h) {
    return h("div", {
      "class": "ldesign-query__buttons"
    }, [this.query.theme === "expand" && h(Button, {
      "attrs": {
        "variant": "text"
      },
      "on": {
        "click": this.query.toggleExpand
      }
    }, [h("template", {
      "slot": "icon"
    }, [h(this.icon)]), this.label]), this.options.map(item => {
      return h(Button, {
        "props": {
          ...item
        }
      }, [item.label]);
    }), this.query.theme === "popup" && h(Popup, {
      "attrs": {
        "trigger": "click",
        "placement": "bottom-right",
        "overlayInnerStyle": {
          width: `${this.query.width}px`,
          padding: "16px"
        }
      }
    }, [h(Button, {
      "attrs": {
        "variant": "text"
      }
    }, [h("template", {
      "slot": "icon"
    }, [h(this.icon)]), this.label]), h("template", {
      "slot": "content"
    }, [h(Content, {
      "attrs": {
        "conditions": this.query.contentConditions,
        "itemWidth": this.query.itemWidth
      }
    })])])]);
  }
});

var Preview = mixins(Vue).extend({
  name: "LdesignQueryPreview",
  props: {
    ...QueryPreviewProps
  },
  inject: {
    query: {
      default: void 0
    }
  },
  computed: {
    itemStyle() {
      return item => {
        const grid = item.grid ? item.grid : 1;
        return {
          width: `${this.itemWidth * grid}%`
        };
      };
    }
  },
  render(h) {
    return h("div", {
      "class": "ldesign-query__preview"
    }, [this.conditions.map((item, index) => {
      return h("div", {
        "class": "ldesign-query__item",
        "key": index,
        "style": this.itemStyle(item)
      }, [h("div", {
        "class": "ldesign-query__wrap"
      }, [h("h2", {
        "class": "ldesign-query__title"
      }, [item.title]), h("div", {
        "class": "ldesign-query__value"
      }, [h(item.component, {
        props: item.props,
        on: {
          ...item.on
        }
      })])])]);
    }), !this.query.isExpanded && h("div", {
      "class": "ldesign-query__item",
      "style": this.itemStyle({})
    }, [h(Buttons)])]);
  }
});

var _LdesignQuery = Vue.extend({
  name: "LdesignQuery",
  provide() {
    return {
      query: this
    };
  },
  props: {
    ...QueryProps
  },
  data() {
    return {
      isExpanded: this.expand,
      width: 0
    };
  },
  computed: {
    point() {
      return this.isExpanded ? this.grid : this.grid - 1;
    },
    previewConditions() {
      const {
        grid,
        conditions
      } = this;
      return conditions.slice(0, this.point);
    },
    contentConditions() {
      const {
        grid,
        conditions
      } = this;
      return conditions.slice(this.point);
    },
    itemWidth() {
      return 100 / this.grid;
    }
  },
  mounted() {
    this.listenSize();
  },
  methods: {
    toggleExpand() {
      this.isExpanded = !this.isExpanded;
    },
    listenSize() {
      const content = this.$refs.query;
      const resizer = new ResizeObserver(entries => {
        const rect = entries[0].contentRect;
        const {
          width
        } = rect;
        this.width = width;
      });
      resizer.observe(content);
    }
  },
  render() {
    const h = arguments[0];
    return h("div", {
      "class": {
        "ldesign-query": true,
        "is-expand": this.isExpanded
      },
      "ref": "query"
    }, [h(Preview, {
      "ref": "preview",
      "attrs": {
        "conditions": this.previewConditions,
        "itemWidth": this.itemWidth
      }
    }), this.theme === "expand" && h(Content, {
      "attrs": {
        "conditions": this.contentConditions,
        "itemWidth": this.itemWidth
      }
    })]);
  }
});

const LdesignQuery = withInstall(_LdesignQuery);

var _LdesignLayout = Vue.extend({
  name: "LdesignLayout",
  props: {
    ...props$4
  },
  data() {
    return {
      height: 0
    };
  },
  computed: {
    styles() {
      return {
        backgroundColor: this.background ? this.background : ""
      };
    },
    mainContent() {
      const h = this.$createElement;
      return renderContent(this, "default", "content", {
        defaultNode: h("span", ["ddddd"]),
        params: {
          height: this.height
        }
      });
    },
    asideContent() {
      const h = this.$createElement;
      const defaultContent = h(Aside);
      return renderLNodeJSX(this, "aside", defaultContent);
    },
    headerContent() {
      const h = this.$createElement;
      if (typeof this.header === "boolean" && !this.header) return null;
      if (typeof this.header === "object") {
        return h(Header, [h(LdesignQuery, {
          "props": {
            ...this.header
          }
        })]);
      }
      return renderLNodeJSX(this, "header");
    },
    footerContent() {
      const h = this.$createElement;
      if (typeof this.footer === "boolean" && !this.footer) return null;
      if (typeof this.footer === "boolean" && this.footer || typeof this.footer === "object") {
        return h(Footer, [h(Pagination, {
          "props": {
            ...this.footer
          }
        })]);
      }
      return renderLNodeJSX(this, "footer");
    }
  },
  mounted() {
    this.listenSize();
  },
  methods: {
    listenSize() {
      const content = this.$refs.content;
      const resizer = new ResizeObserver(entries => {
        const rect = entries[0].contentRect;
        const {
          height
        } = rect;
        this.height = height;
        if (this.onReady && isFunction(this.onReady)) {
          this.onReady(content.$el, {
            height
          });
        }
      });
      resizer.observe(content.$el);
    }
  },
  render() {
    const h = arguments[0];
    return h(Layout, {
      "class": {
        "ldesign-layout": true,
        "ldesign-layout--strict": ["transparent", "rgba(0, 0, 0, 0)"].includes(this.background)
      },
      "style": this.styles
    }, [this.asideContent, h(Layout, [this.headerContent, this.header && h(Divider, {
      "attrs": {
        "size": "medium"
      }
    }), h(Content$1, {
      "ref": "content"
    }, [this.mainContent]), this.footer && h(Divider, {
      "attrs": {
        "size": "medium"
      }
    }), this.footerContent])]);
  }
});

const LdesignLayout = withInstall(_LdesignLayout);

var _LdesignPage = Vue.extend({
  name: "LdesignPage",
  provide() {
    return {
      page: this
    };
  },
  props: {
    ...props$5
  },
  render() {
    const h = arguments[0];
    const {
      layout,
      asideProps
    } = this;
    return h("div", {
      "class": {
        "ldesign-page": true,
        [`ldesign-layout--${layout}`]: layout
      },
      "attrs": {
        "layout": layout
      }
    }, [layout === "normal" && h(Layout, [h(Aside, [h(LdesignAside, {
      "attrs": {
        "menuList": asideProps.menu
      }
    })]), h(Layout, [h(Header, [h(LdesignHeader)]), h(Content$1, [h("div", {
      "class": "ldesign-page__content"
    }, [h("div", {
      "class": "ldesign-page__content_view"
    }, [renderLNodeJSX(this, "default")])])])])]), layout === "mix" && h(Layout, [h(Header, [h(LdesignHeader)]), h(Layout, [h(Aside, [h(LdesignAside, {
      "attrs": {
        "menuList": asideProps.menu
      }
    })]), h(Content$1, [h("div", {
      "class": "ldesign-page__content"
    }, [h("div", {
      "class": "ldesign-page__content_view"
    }, [renderLNodeJSX(this, "default")])])])])]), layout === "origin" && h(Layout, [h(Header, [h(LdesignHeader)]), h(Content$1, [h("div", {
      "class": "ldesign-page__content"
    }, [h("div", {
      "class": "ldesign-page__content_view"
    }, [renderLNodeJSX(this, "default")])])])])]);
  }
});

const LdesignPage = withInstall(_LdesignPage);

var LQuickItem = Vue.extend({
  name: "LDesignQuickItem",
  props: {
    ...LdesignQuickListItemProps
  },
  computed: {
    iconContent() {
      const h = this.$createElement;
      if (!this.icon) return;
      const defaultIcon = h(Icon, {
        "attrs": {
          "name": this.icon
        }
      });
      return renderLNodeJSX(this, "icon", defaultIcon);
    },
    imageContent() {
      const h = this.$createElement;
      if (!this.image) return;
      if (typeof this.image === "string") return h(Image, {
        "attrs": {
          "src": this.image
        }
      });
      return renderLNodeJSX(this, "image");
    }
  },
  render() {
    const h = arguments[0];
    return h("div", {
      "class": "ldesign-quick-list__item"
    }, [h("div", {
      "class": "ldesign-quick-list__icon"
    }, [this.iconContent, this.imageContent]), h("h2", [this.label])]);
  }
});

var _LdesignQuickList = Vue.extend({
  name: "LdesignQuickList",
  components: {
    LQuickItem
  },
  props: {
    ...LdesignQuickListProps
  },
  render() {
    const h = arguments[0];
    return h("div", {
      "class": "ldesign-quick-list"
    }, [this.options.map((item, index) => h("l-quick-item", {
      "key": index,
      "attrs": {
        "label": item.label,
        "icon": item.icon,
        "image": item.image,
        "url": item.url
      }
    }))]);
  }
});

const LdesignQuickList = withInstall(_LdesignQuickList);

var templates = /*#__PURE__*/Object.freeze({
  __proto__: null,
  LdesignAside: LdesignAside,
  LdesignAvatar: LdesignAvatar,
  LdesignGrid: LdesignGrid,
  LdesignGridItem: LdesignGridItem,
  LdesignHeader: LdesignHeader,
  LdesignLayout: LdesignLayout,
  LdesignLogo: LdesignLogo,
  LdesignMenu: LdesignMenu,
  LdesignMenuItem: LdesignMenuItem,
  LdesignPage: LdesignPage,
  LdesignQuery: LdesignQuery,
  LdesignQuickList: LdesignQuickList,
  LdesignSetting: LdesignSetting
});

function install(Vue, config) {
  if (!Vue._installedPlugins.includes(VueCompositionAPI)) Vue.use(VueCompositionAPI);
  Object.keys(components).forEach(key => {
    if (components[key]) /plugin/i.test(key) ? Vue.use(components[key]) : Vue.use(components[key], config);
  });
  Object.keys(templates).forEach(key => {
    if (templates[key]) /plugin/i.test(key) ? Vue.use(templates[key]) : Vue.use(templates[key], config);
  });
}
if (typeof window !== "undefined" && window.Vue) install(window.Vue);
var index = {
  install
};

export { Buttons as B, Content as C, LdesignMenu as L, Preview as P, _LdesignMenuItem as _, _LdesignMenu as a, LdesignMenuItem as b, _LdesignAside as c, LdesignAside as d, _LdesignAvatar as e, LdesignAvatar as f, _LdesignGrid as g, _LdesignGridItem as h, LdesignGrid as i, LdesignGridItem as j, index$1 as k, _LdesignSetting as l, LdesignSetting as m, _LdesignHeader as n, LdesignHeader as o, _LdesignQuery as p, LdesignQuery as q, _LdesignLayout as r, LdesignLayout as s, _LdesignPage as t, LdesignPage as u, LQuickItem as v, _LdesignQuickList as w, LdesignQuickList as x, index as y };
//# sourceMappingURL=dep-fcb80c87.js.map
