easy-component-ui 2.0.5 → 2.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 LuminaQAQ
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,90 @@
+# Easy-ui
+
+Easy-ui 是一个轻量级的 UI 框架，基于 `Web Components` 构建。[文档地址](https://luminaqaq.github.io/ea-ui-component/)
+
+![](./public/logo.png)
+
+> 该框架参考了[Element-ui](https://element.eleme.cn/#/zh-CN/component/installation) , 所以不能说是很像吧, 但可以说是一模一样 😂(打算有时间把所有的都模仿一遍)。
+> 独狼一个, 如果有大佬看到, 还请指点一下 😭 如果有一起学习的就更好了 😭
+
+## 框架进度
+
+- 基础组件
+  
+  - [x] Icon 图标
+  - [x] Button 按钮
+  - [x] Link 文字链接
+
+- 表单组件
+  
+  - [x] Radio 单选框
+  - [x] Checkbox 多选框
+  - [x] Input 输入框
+  - [x] Textarea 文本域
+  - [x] InputNumber 计数器
+  - [x] Switch 开关
+  - [x] Rate 评分
+
+- Data
+  
+  - [x] Tag 标签
+  - [x] Progress 进度条
+  - [x] Pagination 分页
+  - [x] Badge 标记
+  - [x] Avatar 头像
+  - [x] Skeleton 骨架屏
+  - [x] Empty 空状态
+  - [x] Descriptions 描述列表
+  - [x] Result 结果
+
+- Notice
+  
+  - [x] Alert 警告
+  - [x] Loading 加载
+  - [x] Message 消息提示
+  - [x] MessageBox 弹框
+
+- Others
+  
+  - [x] Card 卡片
+  - [x] Carousel 走马灯
+  - [x] TimeLine 时间线
+  - [x] Backtop 回到顶部
+  - [x] Collapse 折叠面板
+  - [x] Calendar 日历
+  - [x] Image 图片
+  - [x] InfiniteScroll 无限滚动
+
+- 表单组件
+  
+  - [x] Select 选择框
+  - [x] TimePicker 时间选择器
+  - [x] DatePicker 日期选择器
+  - [ ] Upload 上传
+  - [ ] Transfer 穿梭框
+  - [ ] Form 表单
+
+- Data
+  
+  - [x] Table 表格
+  - [ ] Tree 树形控件
+  - [ ] Statistic 统计数字
+
+- Navigation
+  
+  - [x] NavMenu 导航菜单
+  - [x] Tabs 标签页
+  - [x] Breadcrumb 面包屑
+  - [x] Tabs 标签页
+  - [x] PageHeader 页头
+  - [x] Dropdown 下拉菜单
+  - [x] Steps 步骤条
+  - [x] Drawer 抽屉
+
+- Others
+  
+  - [ ] Popconfirm 气泡确认框
+  - [ ] Dialog 对话框
+  - [ ] Tooltip 文字提示
+  - [ ] Popover 弹出框
+  - [ ] Divider 分割线

package/build/components/Base.js

@@ -0,0 +1 @@
+import setStyle from"../utils/setStyle.js";export default class Base extends HTMLElement{constructor(){super(),this.isProduction=!1,this.isProduction=!0}toggleAttribute(t,e,s){e?(this.setAttribute(t,e),s&&this.dom.classList.add(s)):(this.hasAttribute(t)&&this.removeAttribute(t),s&&this.dom.classList.remove(s))}toggleAttr(t,e){e?this.setAttribute(t,e):this.removeAttribute(t)}getAttrBoolean(t){const e=this.getAttribute(t);return"true"===e||""===e}getAttrNumber(t){const e=this.getAttribute(t);return e?Number(e):0}build(t,e){if(this.isProduction){const t=document.createElement("style");t.innerHTML=e,this.shadowRoot.appendChild(t)}else setStyle(t,new URL(this.nodeName.toLowerCase()+"/index.css",import.meta.url).href)}}

package/build/components/ea-alert/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{handleDefaultAttrIsTrue}from"../../utils/handleDefaultAttrIsTrue.js";import{createElement}from"../../utils/createElement.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaAlert extends Base{#t;#e;#s;#i;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n      <div class='ea-alert_wrap' part='container'>\n        <div class=\"ea-alert_content\" part='content-wrap'>\n          <span class=\"ea-alert_title\" part='title'></span>\n          <ea-icon class=\"ea-alert_close-icon\" part='icon'></ea-icon>\n        </div>\n      </div>\n    ",this.#t=t.querySelector(".ea-alert_wrap"),this.#e=t.querySelector(".ea-alert_content"),this.#s=t.querySelector(".ea-alert_title"),this.#i=t.querySelector(".ea-alert_close-icon"),this.build(t,stylesheet)}get type(){return this.getAttribute("type")||"info"}set type(t){this.setAttribute("type",t),this.#t.classList.add(`ea-alert--${t}`)}get title(){return this.getAttribute("title")||""}set title(t){this.setAttribute("title",t),this.#s.innerText=t}get closable(){return handleDefaultAttrIsTrue("closable")}set closable(t){this.setAttribute("closable",t),this.#i.style.display=t?"block":"none"}get closeText(){return this.getAttribute("close-text")||""}set closeText(t){this.setAttribute("close-text",t)}get effect(){return this.getAttribute("effect")||"light"}set effect(t){this.setAttribute("effect",t),this.#t.classList.toggle("ea-alert--dark","dark"===t)}get showIcon(){return this.getAttrBoolean("show-icon")||!1}set showIcon(t){this.setAttribute("show-icon",t)}get center(){return this.getAttrBoolean("center")||!1}set center(t){this.setAttribute("center",t),this.#e.classList.toggle("ea-alert--center",t)}get description(){return this.getAttribute("description")||""}set description(t){this.setAttribute("description",t)}#r(){this.closable&&(!0===this.closable&&""===this.closeText?this.#i.icon="icon-cancel":this.#i.innerText=this.closeText,this.#i.addEventListener("click",(()=>{this.#t.style.opacity=0,this.dispatchEvent(new CustomEvent("close",{detail:{target:this.#i}}))})),this.#t.addEventListener("transitionend",(()=>{this.remove()})))}get iconList(){return{success:"ok-circled",info:"info",warning:"attention-alt",error:"cancel-circled"}}#n(){if(!this.showIcon)return;const t=createElement("ea-icon");t.icon=`icon-${this.iconList[this.type]}`,t.classList.add(`ea-alert--${this.type}`),this.#s.insertBefore(t,this.#s.firstChild)}#l(){if(!this.description)return;const t=createElement("p","ea-alert_description");t.part="description",this.#t.style.flexDirection="column",t.innerText=this.description,this.#t.appendChild(t)}connectedCallback(){this.type=this.type,this.title=this.title,this.closable=this.closable,this.closeText=this.closeText,this.effect=this.effect,this.center=this.center,this.#r(),this.#n(),this.#l()}}customElements.get("ea-alert")||customElements.define("ea-alert",EaAlert);

package/build/components/ea-alert/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-alert_wrap {\n  position: relative;\n  box-sizing: border-box;\n  overflow: hidden;\n  border-radius: 4px;\n  padding: 8px 16px;\n  margin: 20px 0 0;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  opacity: 1;\n  transition: opacity 0.2s;\n}\n.ea-alert_wrap .ea-alert_content {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ea-alert_wrap .ea-alert_content .ea-alert_title {\n  display: flex;\n  align-items: center;\n}\n.ea-alert_wrap .ea-alert_content .ea-alert_title i {\n  margin-right: 0.5rem;\n}\n.ea-alert_wrap .ea-alert_content .ea-alert_close-icon {\n  color: #c0c4cc;\n  cursor: pointer;\n}\n.ea-alert_wrap .ea-alert_content.ea-alert--center .ea-alert_title,\n.ea-alert_wrap .ea-alert_content.ea-alert--center .ea-alert_close-icon {\n  margin-left: auto;\n}\n.ea-alert_wrap .ea-alert_description {\n  width: 100%;\n  margin: 5px 0 0;\n  font-size: 12px;\n}\n.ea-alert_wrap.ea-alert--success {\n  background-color: #f0f9eb;\n  color: #67c23a;\n}\n.ea-alert_wrap.ea-alert--success.ea-alert--dark {\n  color: #fff;\n  background-color: #67c23a;\n}\n.ea-alert_wrap.ea-alert--success.ea-alert--dark .ea-alert_close-icon {\n  color: #fff;\n}\n.ea-alert_wrap.ea-alert--info {\n  background-color: #f4f4f5;\n  color: #909399;\n}\n.ea-alert_wrap.ea-alert--info.ea-alert--dark {\n  color: #fff;\n  background-color: #909399;\n}\n.ea-alert_wrap.ea-alert--info.ea-alert--dark .ea-alert_close-icon {\n  color: #fff;\n}\n.ea-alert_wrap.ea-alert--warning {\n  background-color: #fdf6ec;\n  color: #e6a23c;\n}\n.ea-alert_wrap.ea-alert--warning.ea-alert--dark {\n  color: #fff;\n  background-color: #e6a23c;\n}\n.ea-alert_wrap.ea-alert--warning.ea-alert--dark .ea-alert_close-icon {\n  color: #fff;\n}\n.ea-alert_wrap.ea-alert--error {\n  background-color: #fef0f0;\n  color: #f56c6c;\n}\n.ea-alert_wrap.ea-alert--error.ea-alert--dark {\n  color: #fff;\n  background-color: #f56c6c;\n}\n.ea-alert_wrap.ea-alert--error.ea-alert--dark .ea-alert_close-icon {\n  color: #fff;\n}\n";

package/build/components/ea-aside/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";const stylesheet="\n.ea-aside_wrap {\n  height: 100%;\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n}\n.ea-aside_wrap ::slotted(ea-main) {\n  overflow: auto;\n}\n";export class EaAside extends Base{#e;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n            <aside class="ea-aside_wrap" part="container">\n                <slot></slot>\n            </aside>\n        ',this.#e=e.querySelector(".ea-aside_wrap"),this.build(e,stylesheet)}get width(){return this.getAttrNumber("width")||200}set width(e){this.setAttribute("width",e),this.#e.style.width=`${e}px`}connectedCallback(){this.width=this.width}}customElements.get("ea-aside")||customElements.define("ea-aside",EaAside);

package/build/components/ea-avatar/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{errorAvatar}from"./src/assets/errorAvatar.js";import{iconAvatar,textAvatar}from"./src/assets/iconAndTextAvatar.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaAvatar extends Base{#t;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML='\n            <div class="ea-avatar_wrap" part=\'container\'>\n                <span class="ea-avatar" part="avatar">\n                    <slot></slot>\n                </span>\n            </div>\n        ',this.#t=t.querySelector(".ea-avatar"),this.build(t,stylesheet)}get size(){const t=this.getAttrNumber("size"),s=this.getAttribute("size");return 0!==t&&t?this.getAttrNumber("size"):["large","medium","small"].includes(s)?s:"normal"}set size(t){this.setAttribute("size",t),"number"==typeof t?(this.#t.style.width=`${t}px`,this.#t.style.height=`${t}px`,this.#t.style.lineHeight=`${t}px`):"string"==typeof t&&this.#t.classList.add(`ea-avatar--${t}`)}get shape(){const t=this.getAttribute("shape");return["circle","square"].includes(t)?t:"circle"}set shape(t){this.setAttribute("shape",t),this.#t.classList.add(`ea-avatar--${this.shape}`)}get src(){return this.getAttribute("src")}set src(t){if(!t)return;this.setAttribute("src",t);const s=new Image;s.src=t,s.onload=()=>{this.#t.innerHTML=`<img class="ea-avatar--img" src="${t}" alt="头像">`},s.onerror=t=>{this.#t.innerHTML=errorAvatar,this.dispatchEvent(new CustomEvent("error",{detail:{error:t}}))}}get icon(){return this.getAttribute("icon")||""}set icon(t){this.setAttribute("icon",t),this.#t.innerHTML=iconAvatar(t)}get fit(){return this.getAttribute("fit")||"cover"}set fit(t){this.setAttribute("fit",t),this.#t.classList.add(`ea-avatar-fill--${t}`)}connectedCallback(){this.size=this.size,this.shape=this.shape,this.src=this.src,this.src&&(this.fit=this.fit),!this.src&&this.icon&&(this.icon=this.icon),""===this.innerHTML||this.icon||this.src||(this.#t.innerHTML=textAvatar(this.innerHTML))}}customElements.get("ea-avatar")||customElements.define("ea-avatar",EaAvatar);

package/build/components/ea-avatar/src/assets/defaultAvatar.js

@@ -0,0 +1 @@
+export const defaultAvatar='\n    <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">\n        <defs>\n            <clipPath id="a">\n                <path d="M0 40h90v45H0z" />\n            </clipPath>\n        </defs>\n        <path fill="#c0c4cc" d="M0 0h100v100H0z" />\n        <circle cx="50" cy="35" r="20" fill="#fff" />\n        <circle cx="50" cy="97" r="40" fill="#fff" clip-path="url(#a)" />\n    </svg>\n';

package/build/components/ea-avatar/src/assets/errorAvatar.js

@@ -0,0 +1 @@
+export const errorAvatar='\n    <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">\n        <path fill="#c0c4cc" d="M0 0h100v100H0z" />\n        <path fill="#fff" d="M15 20h70v60H15z" />\n        <circle r="8" cx="32" cy="35" fill="#c0c4cc" />\n        <path d="M60 42.5L39 75h42z" fill="#c0c4cc" />\n        <path d="M35 52.5L20 75h-4 32z" fill="#c0c4cc" />\n    </svg>\n';

package/build/components/ea-avatar/src/assets/iconAndTextAvatar.js

@@ -0,0 +1 @@
+const background='\n<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">\n    <path fill="#c0c4cc" d="M0 0h100v100H0z" />\n</svg>\n';export const iconAvatar=a=>`\n        ${background}\n        <ea-icon class="fa ea-avatar--text" icon="${a}"></ea-icon>\n    `;export const textAvatar=a=>`\n        ${background}\n        <span class="ea-avatar--text">${a}</span>\n    `;

package/build/components/ea-avatar/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-avatar_wrap .ea-avatar {\n  position: relative;\n  display: inline-block;\n  overflow: hidden;\n  color: #ffffff;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar-fill--fill img {\n  object-fit: fill;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar-fill--contain img {\n  object-fit: contain;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar-fill--cover img {\n  object-fit: cover;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar-fill--none img {\n  object-fit: none;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar-fill--scale-down img {\n  object-fit: scale-down;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--normal {\n  width: 50px;\n  height: 50px;\n  line-height: 50px;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--large {\n  width: 40px;\n  height: 40px;\n  line-height: 40px;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--medium {\n  width: 36px;\n  height: 36px;\n  line-height: 36px;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--small {\n  width: 28px;\n  height: 28px;\n  line-height: 28px;\n}\n.ea-avatar_wrap .ea-avatar .ea-avatar--text {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--circle {\n  border-radius: 50%;\n}\n.ea-avatar_wrap .ea-avatar.ea-avatar--square {\n  border-radius: 5px;\n}\n.ea-avatar_wrap .ea-avatar .ea-avatar--img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n";

package/build/components/ea-backtop/index.js

@@ -0,0 +1 @@
+import{timeout}from"../../utils/timeout.js";import Base from"../Base.js";import"../ea-icon/index.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaBacktop extends Base{#t;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n            <div class=\"ea-backtop_wrap\" part='container' style='display: none'>\n                <slot></slot>\n            </div>\n        ",this.#t=t.querySelector(".ea-backtop_wrap"),this.build(t,stylesheet)}get target(){return this.getAttribute("target")||""}set target(t){this.setAttribute("target",t)}get right(){return this.getAttribute("right")||"40px"}set right(t){this.setAttribute("right",t),this.#t.style.right=t}get bottom(){return this.getAttribute("bottom")||"40px"}set bottom(t){this.setAttribute("bottom",t),this.#t.style.bottom=t}get icon(){return this.getAttribute("icon")||"icon-angle-up"}set icon(t){this.setAttribute("icon",t),this.#t.innerHTML=`\n            <ea-icon icon="${t}" part='icon'></ea-icon>\n        `}get visibilityHeight(){return this.getAttribute("visibility-height")||200}set visibilityHeight(t){this.setAttribute("visibility-height",t)}#e(t){let e=null,i=null;return"null"===t||""===t||null==t||"undefined"===t?(e=document,i=document.documentElement):(e=document.querySelector(t),i=document.querySelector(t)),{dom:e,scrollDom:i}}#i(t){t.scrollTop>this.visibilityHeight?(this.#t.style.display="flex",this.#t.ontransitionend=null,timeout((()=>{this.#t.style.opacity=1}),10)):(this.#t.style.opacity=0,this.#t.ontransitionend=()=>{this.#t.style.display="none"})}#s(){const{dom:t,scrollDom:e}=this.#e(this.target);this.#i(e),t.addEventListener("scroll",(()=>{this.#i(e)})),this.#t.addEventListener("click",(function(){let t=10,i=setInterval((()=>{t+=5,e.scrollTop-=t,e.scrollTop<=0&&(e.scrollTop=0,clearInterval(i),i=null,this.dispatchEvent(new CustomEvent("reachedTop",{})))}),12);this.dispatchEvent(new CustomEvent("backtop",{}))}))}connectedCallback(){this.target=this.target,this.right=this.right,this.bottom=this.bottom,this.visibilityHeight=this.visibilityHeight,this.icon=this.icon,this.#s()}}customElements.get("ea-backtop")||customElements.define("ea-backtop",EaBacktop);

package/build/components/ea-backtop/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-backtop_wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  right: 40px;\n  bottom: 40px;\n  cursor: pointer;\n  background-color: #fff;\n  border-radius: 50%;\n  color: #409eff;\n  font-size: 14px;\n  box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);\n  opacity: 1;\n  z-index: 5;\n  transition: opacity 0.3s ease-in-out;\n}\n";

package/build/components/ea-badge/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaBadge extends Base{#t;#e;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n        <div class=\"ea-badge_wrap\" part='container'>\n            <slot></slot>\n            <sup class=\"ea-badge_content\" part='content'></sup>\n        </div>\n    ",this.#t=t.querySelector(".ea-badge_wrap"),this.#e=t.querySelector(".ea-badge_content"),this.build(t,stylesheet)}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t),this.#e.innerHTML=t}get type(){return this.getAttribute("type")||"normal"}set type(t){this.setAttribute("type",t),this.#e.classList.add(t)}get max(){return this.getAttrNumber("max")||1/0}set max(t){t!==1/0&&(t=parseInt(t),this.setAttribute("max",t),this.value>t&&(this.value=t+"+"))}get isDot(){return this.getAttrBoolean("is-dot")||!1}set isDot(t){this.toggleAttr("is-dot",t),this.#e.innerText=t?"":this.value,this.#e.classList.toggle("dot",t)}connectedCallback(){this.value=this.value,this.type=this.type,this.max=this.max,this.isDot=this.isDot}}customElements.get("ea-badge")||customElements.define("ea-badge",EaBadge);

package/build/components/ea-badge/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-badge_wrap {\n  position: relative;\n  vertical-align: middle;\n  display: inline-block;\n}\n.ea-badge_wrap .ea-badge_content {\n  display: inline-block;\n  padding: 0 0.375rem;\n  border-radius: 0.625rem;\n  border: 1px solid #fff;\n  height: 1.125rem;\n  line-height: 1.125rem;\n  position: absolute;\n  right: 0.625rem;\n  top: 0;\n  transform: translate(100%, -50%);\n  color: #fff;\n  font-size: 0.75rem;\n  text-align: center;\n  white-space: nowrap;\n  background-color: #f56c6c;\n}\n.ea-badge_wrap .ea-badge_content.primary {\n  background-color: #409eff;\n}\n.ea-badge_wrap .ea-badge_content.success {\n  background-color: #67c23a;\n}\n.ea-badge_wrap .ea-badge_content.warning {\n  background-color: #e6a23c;\n}\n.ea-badge_wrap .ea-badge_content.info {\n  background-color: #909399;\n}\n.ea-badge_wrap .ea-badge_content.dot {\n  right: 0.3125rem;\n  padding: 0;\n  border-radius: 50%;\n  width: 0.5rem;\n  height: 0.5rem;\n}\n";

package/build/components/ea-breadcrumb/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import"../ea-breadcrumb-item/index.js";import{stylesheet}from"./src/style/stylesheet.js";import{createElement}from"../../utils/createElement.js";export class EaBreadcrumb extends Base{constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n            <div class=\"ea-breadcrumb_wrap\" part='container'>\n                <slot></slot>\n            </div>\n        ",this.build(t,stylesheet)}get separator(){return this.getAttribute("separator")||"/"}set separator(t){this.setAttribute("separator",t)}get separatorClass(){return this.getAttribute("separator-class")||""}set separatorClass(t){this.setAttribute("separator-class",t)}get separatorColor(){return this.getAttribute("separator-color")||"#c0c4cc"}set separatorColor(t){this.setAttribute("separator-color",t)}#t(){const t=this.querySelectorAll("ea-breadcrumb-item");t.forEach(((e,r)=>{if(r<t.length-1){const t=createElement("ea-icon");t.color=this.separatorColor,this.separatorClass?t.icon=this.separatorClass:(t.style.margin="0 10px",t.innerText=this.separator),e.appendChild(t)}}))}connectedCallback(){this.separator=this.separator,this.separatorClass=this.separatorClass,this.separatorColor=this.separatorColor,this.#t()}}customElements.get("ea-breadcrumb")||customElements.define("ea-breadcrumb",EaBreadcrumb);

package/build/components/ea-breadcrumb/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-breadcrumb_wrap {\n  display: flex;\n}\n.ea-breadcrumb_wrap .separator {\n  margin: 0 10px;\n}\n";

package/build/components/ea-breadcrumb-item/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{stylesheet}from"./src/style/style.js";export class EaBreadcrumbItem extends Base{constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML="\n            <span class=\"ea-breadcrumb-item_wrap\" part='container'>\n                <slot></slot>\n            </span>\n        ",this.build(e,stylesheet)}}customElements.get("ea-breadcrumb-item")||customElements.define("ea-breadcrumb-item",EaBreadcrumbItem);

package/build/components/ea-breadcrumb-item/src/style/style.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-breadcrumb-item_wrap {\n  font-size: 14px;\n  color: #606266;\n  line-height: 1;\n}\n.ea-breadcrumb-item_wrap ::slotted(a) {\n  text-decoration: none;\n  font-weight: 600;\n  color: #303133;\n}\n";

package/build/components/ea-button/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{ButtonComm}from"./src/components/ButtonComm.js";import{HrefComm}from"./src/components/HrefComm.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaButton extends Base{#t="button";#e;constructor(){super();const t=this.attachShadow({mode:"open"});this.getAttribute("href")?(t.innerHTML=HrefComm,this.#t="a"):(t.innerHTML=ButtonComm,this.#t="button"),this.#e=t.querySelector(".ea-button"),this.build(t,stylesheet)}get BUTTON_STYLE(){return["plain","round"]}get BUTTON_TYPE(){return["normal","primary","success","warning","danger","text"]}get BUTTON_SIZE(){return["medium","small","mini"]}get disabled(){return this.getAttrBoolean("disabled")}set disabled(t){this.toggleAttr("disabled",t),this.#e.classList.toggle("disabled",t),this.style.cursor=t?"not-allowed":"pointer",t&&this.#e.setAttribute("disabled",t)}get plain(){return this.getAttrBoolean("plain")}set plain(t){this.toggleAttr("plain",t),this.#e.classList.toggle("plain",t)}get round(){return this.getAttrBoolean("round")}set round(t){this.toggleAttr("round",t),this.#e.classList.toggle("round",t)}get type(){const t=this.getAttribute("type");return this.BUTTON_TYPE.includes(t)?t:"normal"}set type(t){this.setAttribute("type",t),this.#e.classList.add(t)}get size(){const t=this.getAttribute("size");return this.BUTTON_SIZE.includes(t)?t:"medium"}set size(t){this.toggleAttr("size",t),this.#e.classList.add(t)}get loading(){return this.getAttrBoolean("loading")}set loading(t){if(this.toggleAttr("loading",t),this.disabled=t,t){const t=document.createElement("ea-icon");t.id="ea-loading-icon",t.icon="icon-spin6 animate-spin",this.#e.insertBefore(t,this.#e.firstChild)}else{const t=this.#e?.querySelectorAll("#ea-loading-icon");t?.length>0&&t?.forEach((t=>t.remove()))}}get icon(){return this.getAttribute("icon")||""}set icon(t){if(this.setAttribute("icon",t),t&&!this.#e.querySelector("ea-icon")){const e=document.createElement("ea-icon");e.icon=t,e.part="icon",this.#e.insertBefore(e,this.#e.firstChild)}}get href(){return this.getAttribute("href")||""}set href(t){"button"!==this.#t&&(this.setAttribute("href",t),this.#e.setAttribute("href",t))}connectedCallback(){this.plain=this.plain,this.round=this.round,this.type=this.type,this.size=this.size,this.icon=this.icon,this.disabled=this.disabled,this.href=this.href,this.loading&&(this.loading=this.loading)}}window.customElements.get("ea-button")||window.customElements.define("ea-button",EaButton);

package/build/components/ea-button/src/components/ButtonComm.js

@@ -0,0 +1 @@
+export const ButtonComm='\n<button class="ea-button" part="container">\n    <slot></slot>\n</button>\n';

package/build/components/ea-button/src/components/HrefComm.js

@@ -0,0 +1 @@
+export const HrefComm='\n<a class="ea-button" part="container">\n    <slot></slot>\n</a>\n';

package/build/components/ea-button/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n:host {\n  --border-radius: 6px;\n}\n\n.ea-button {\n  box-sizing: border-box;\n  padding: 0.5rem;\n  border-radius: var(--border-radius);\n  cursor: pointer;\n  font-size: 1rem;\n  line-height: 1.25;\n  font-weight: 500;\n  transition: background-color 0.1s, color 0.1s;\n  text-decoration: none;\n  will-change: width;\n}\n.ea-button.normal {\n  border: 1px solid #dcdfe6;\n  color: #606266;\n  background-color: transparent;\n}\n.ea-button.normal.disabled {\n  background-color: rgba(64, 64, 64, 0) !important;\n  border-color: white !important;\n  color: white !important;\n  pointer-events: none;\n  border-color: #ebedf1 !important;\n  color: #babcbe !important;\n}\n.ea-button.normal.plain {\n  background-color: rgba(92, 92, 92, 0);\n  border-color: white;\n  color: transparent;\n  background-color: transparent;\n  color: #606266;\n  border-color: #dcdfe6;\n}\n.ea-button.normal.plain:hover {\n  background-color: transparent;\n}\n.ea-button.normal:hover {\n  border-color: rgba(160, 207, 255, 0.4);\n  color: #3a9bff;\n  background-color: rgba(160, 207, 255, 0.05);\n}\n.ea-button.normal:active {\n  background-color: rgba(7, 130, 255, 0.05);\n}\n.ea-button.primary {\n  border: 1px solid #409eff;\n  color: #fff;\n  background-color: #409eff;\n}\n.ea-button.primary.disabled {\n  background-color: #c0dfff !important;\n  border-color: #c0dfff !important;\n  color: white !important;\n  pointer-events: none;\n}\n.ea-button.primary.plain {\n  background-color: #f8fbff;\n  border-color: #c0dfff;\n  color: #409eff;\n}\n.ea-button.primary:hover {\n  border-color: #73b8ff;\n  color: white;\n  background-color: #73b8ff;\n}\n.ea-button.primary:active {\n  background-color: #006bd9;\n}\n.ea-button.success {\n  border: 1px solid #67c23a;\n  color: #fff;\n  background-color: #67c23a;\n}\n.ea-button.success.disabled {\n  background-color: #b2e19b !important;\n  border-color: #b2e19b !important;\n  color: white !important;\n  pointer-events: none;\n}\n.ea-button.success.plain {\n  background-color: #d3eec6;\n  border-color: #b2e19b;\n  color: #67c23a;\n}\n.ea-button.success:hover {\n  border-color: #85cf60;\n  color: white;\n  background-color: #85cf60;\n}\n.ea-button.success:active {\n  background-color: #3d7323;\n}\n.ea-button.info {\n  border: 1px solid #909399;\n  color: #fff;\n  background-color: #909399;\n}\n.ea-button.info.disabled {\n  background-color: #d2d4d6 !important;\n  border-color: #d2d4d6 !important;\n  color: white !important;\n  pointer-events: none;\n}\n.ea-button.info.plain {\n  background-color: #f0f0f1;\n  border-color: #d2d4d6;\n  color: #909399;\n}\n.ea-button.info:hover {\n  border-color: #abadb1;\n  color: white;\n  background-color: #abadb1;\n}\n.ea-button.info:active {\n  background-color: #5d6066;\n}\n.ea-button.warning {\n  border: 1px solid #e6a23c;\n  color: #fff;\n  background-color: #e6a23c;\n}\n.ea-button.warning.disabled {\n  background-color: #f4d8ad !important;\n  border-color: #f4d8ad !important;\n  color: white !important;\n  pointer-events: none;\n}\n.ea-button.warning.plain {\n  background-color: #fbf0df;\n  border-color: #f4d8ad;\n  color: #e6a23c;\n}\n.ea-button.warning:hover {\n  border-color: #ecb869;\n  color: white;\n  background-color: #ecb869;\n}\n.ea-button.warning:active {\n  background-color: #a76d15;\n}\n.ea-button.danger {\n  border: 1px solid #f56c6c;\n  color: #fff;\n  background-color: #f56c6c;\n}\n.ea-button.danger.disabled {\n  background-color: #fde3e3 !important;\n  border-color: #fde3e3 !important;\n  color: white !important;\n  pointer-events: none;\n}\n.ea-button.danger.plain {\n  background-color: white;\n  border-color: #fde3e3;\n  color: #f56c6c;\n  background-color: #fde8e8;\n}\n.ea-button.danger:hover {\n  border-color: #f89c9c;\n  color: white;\n  background-color: #f89c9c;\n}\n.ea-button.danger:active {\n  background-color: #eb1010;\n}\n.ea-button.text {\n  border: 1px solid transparent;\n  color: #409eff;\n  background-color: transparent;\n}\n.ea-button.text.disabled {\n  background-color: rgba(64, 64, 64, 0) !important;\n  border-color: rgba(64, 64, 64, 0) !important;\n  color: white !important;\n  pointer-events: none;\n  color: #c0c4cc !important;\n}\n.ea-button.text.plain {\n  background-color: rgba(92, 92, 92, 0);\n  border-color: rgba(64, 64, 64, 0);\n  color: transparent;\n}\n.ea-button.text:hover {\n  border-color: rgba(26, 26, 26, 0);\n  color: #73b8ff;\n  background-color: rgba(26, 26, 26, 0);\n}\n.ea-button.text:active {\n  background-color: rgba(0, 0, 0, 0);\n}\n.ea-button.round {\n  border-radius: 999px;\n}\n.ea-button.medium {\n  font-size: 14px;\n}\n.ea-button.small {\n  font-size: 12px;\n}\n.ea-button.mini {\n  font-size: 10px;\n}\n";

package/build/components/ea-button-group/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaButtonGroup extends Base{constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML='\n      <div class="ea-button-group">\n        <slot></slot>\n      </div>\n    ',this.build(t,stylesheet)}get disabled(){return this.getAttrBoolean("disabled")}set disabled(t){this.toggleAttr("disabled",t),Array.from(this.children).forEach((e=>{e.disabled=t}))}connectedCallback(){this.disabled=this.disabled}}window.customElements.get("ea-button-group")||window.customElements.define("ea-button-group",EaButtonGroup);

package/build/components/ea-button-group/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-button-group {\n  display: flex;\n  align-items: center;\n}\n.ea-button-group ::slotted(ea-button) {\n  --border-radius: 0;\n}\n.ea-button-group ::slotted(ea-button:not([type=normal])) {\n  border-right: 1px solid rgba(255, 255, 255, 0.3);\n}\n.ea-button-group ::slotted(ea-button:first-of-type) {\n  --border-radius: 4px 0 0 4px;\n}\n.ea-button-group ::slotted(ea-button:last-of-type) {\n  --border-radius: 0 4px 4px 0;\n}\n";

package/build/components/ea-calendar/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{createElement,createSlotElement}from"../../utils/createElement.js";import"../ea-button-group/index.js";import"../ea-button/index.js";import{createChangerElement}from"./src/utils/createChangerElement.js";import{createThead}from"./src/utils/createThead.js";import{getToday,getUserToday}from"./src/utils/getDate.js";import{getUserWeekStart}from"./src/utils/getUserWeekStart.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCalendar extends Base{#e;#t;#a;#n;#r;#s;#l;#d;#h;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML="\n            <div class='ea-calendar_wrap' part='container'>\n                <div class='ea-calendar-header_wrap' part='header-wrap'>\n                    <span class='ea-calendar-header_content' part='header-content'></span>\n                    <ea-button-group class='ea-calendar-header_changer' part='header-changer'>\n                        <ea-button class='ea-calendar-header_sg-changer ea-calendar-header_changer-lastMonth' part='header-changer-lastMonth' size=\"small\">上个月</ea-button>\n                        <ea-button class='ea-calendar-header_sg-changer ea-calendar-header_changer-today' part='header-changer-today' size=\"small\">今天</ea-button>\n                        <ea-button class='ea-calendar-header_sg-changer ea-calendar-header_changer-nextMonth' part='header-changer-nextMonth' size=\"small\">下个月</ea-button>\n                    </ea-button-group>\n                </div>\n                <div class='ea-calendar_calendar-wrap' part='calendar-wrap'>\n                    <table class='ea-calendar_table' part='table'>\n                        <thead class='ea-calendar_table-head' part='table-head'></thead>\n                        <tbody class='ea-calendar_table-body' part='table-body'></tbody>\n                    </table>\n                </div>\n            </div>\n        ",this.#e=this.shadowRoot.querySelector(".ea-calendar_wrap"),this.#a=e.querySelector(".ea-calendar-header_content"),this.#t=e.querySelector(".ea-calendar-header_wrap"),this.#n=e.querySelector(".ea-calendar-header_changer"),this.#r=e.querySelector(".ea-calendar-header_changer-lastMonth"),this.#s=e.querySelector(".ea-calendar-header_changer-today"),this.#l=e.querySelector(".ea-calendar-header_changer-nextMonth"),this.#d=e.querySelector(".ea-calendar_table-head"),this.#h=e.querySelector(".ea-calendar_table-body"),this.build(e,stylesheet)}get weekStart(){return this.getAttribute("week-start")||"一"}set weekStart(e){this.setAttribute("week-start",e),this.#d.innerHTML=createThead(getUserWeekStart(this.week,e)).innerHTML}get date(){new Date;return this.getAttribute("date")||getToday()}set date(e){this.setAttribute("date",e),this.#a.innerHTML=e=isNaN(new Date(e))?getToday():getUserToday(e),this.#i(this.#h,e,this.weekStart)}get size(){const e=this.getAttribute("size");return["mini"].includes(e)?e:"medium"}set size(e){if(this.setAttribute("size",e),this.#e.classList.add(e),"mini"===e){const e=createElement("span","prev-btn");e.innerText="<";const t=createElement("span","next-btn");t.innerText=">",this.#r=e,this.#l=t,this.#t.insertBefore(e,this.#t.firstChild),this.#t.appendChild(t)}}get week(){return["日","一","二","三","四","五","六"]}#c(e){e.addEventListener("click",(t=>{this.#h.querySelectorAll("td").forEach((e=>{e.classList.remove("is-selected")})),e.classList.contains("is-selected")?e.classList.remove("is-selected"):e.classList.add("is-selected");const a=new Date(this.date);this.dispatchEvent(new CustomEvent("select",{detail:{year:a.getFullYear(),month:a.getMonth()+1,date:Number(e.innerText),day:this.week[Number(e.innerText)%7]}}))}))}#o(e){const t=new Date(this.date);t.setMonth(t.getMonth()+("next"===e?1:-1)),this.date=`${t.getFullYear()}-${t.getMonth()+1}-${t.getDate()}`}#i(e,t,a="一"){t=isNaN(new Date(t))?new Date:new Date(t),e.innerHTML="";const n=new Date(t),r=n.getMonth()+1,s=new Date(t);s.setDate(1);const l=new Date(t);l.setMonth(r),l.setDate(0);const d=new Date(t);d.setMonth(r),d.setDate(1);const h=getUserWeekStart(this.week,a);for(let t=0;t<6;t++){const t=createElement("tr");t.part="table-body-row";for(let e=0;e<7;e++){const{length:a}=t.children,d=createElement("td");d.part="table-body-cell";const i=createElement("span");i.part="table-body-cell-content";const c=s.getDay(),o=new Date;if(h[a]===this.week[c]&&r===s.getMonth()+1)i.innerText=s.getDate(),s.setDate(s.getDate()+1),this.#c(d);else if(r==s.getMonth())i.innerText=s.getDate(),s.setDate(s.getDate()+1),d.classList.add("is-disabled"),d.part="table-body-cell-disabled";else{const t=e-c+2,n=h.findIndex(((e,t)=>{if("一"===e)return t}));l.setMonth(r-1),l.setDate(t>0?c+a-n:t),i.innerText=l.getDate(),d.part="table-body-cell-disabled",d.classList.add("is-disabled")}new Date(this.date);s.getFullYear()===o.getFullYear()&&s.getMonth()===o.getMonth()&&s.getDate()===o.getDate()+1&&(d.part="table-body-cell-today",d.classList.add("is-today")),s.getFullYear()===n.getFullYear()&&s.getMonth()===n.getMonth()&&s.getDate()===n.getDate()+1&&(d.part="table-body-cell-selected",d.classList.add("is-selected")),d.appendChild(i),t.appendChild(d)}e.appendChild(t)}}connectedCallback(){this.weekStart=this.weekStart,this.date=this.date,this.size=this.size,this.#r.addEventListener("click",(()=>{this.#o("last")})),this.#s.addEventListener("click",(()=>{this.date=`${(new Date).getFullYear()}-${(new Date).getMonth()+1}-${(new Date).getDate()}`})),this.#l.addEventListener("click",(()=>{this.#o("next")}))}}customElements.get("ea-calendar")||customElements.define("ea-calendar",EaCalendar);

package/build/components/ea-calendar/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-calendar_wrap {\n  padding: 12px 20px 35px;\n}\n.ea-calendar_wrap .ea-calendar-header_wrap {\n  border-bottom: 1px solid #ebeef5;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding-bottom: 0.5rem;\n}\n.ea-calendar_wrap .ea-calendar-header_wrap .ea-calendar-header_changer .ea-calendar-header_sg-changer {\n  border: 1px solid #ebeef5;\n  border-left: 0px none transparent;\n}\n.ea-calendar_wrap .ea-calendar-header_wrap .ea-calendar-header_changer .ea-calendar-header_sg-changer:first-child {\n  border-left: 1px solid #ebeef5;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table {\n  width: 100%;\n  table-layout: fixed;\n  border-collapse: collapse;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table th {\n  font-weight: 400;\n  color: #606266;\n  padding: 12px 0;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td {\n  border-right: 1px solid #ebeef5;\n  border-bottom: 1px solid #ebeef5;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td.is-selected {\n  color: #1989fa;\n  background-color: #f2f8fe;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td.is-today {\n  color: #1989fa;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td.is-disabled {\n  pointer-events: none;\n  color: #c0c4cc;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td span {\n  display: block;\n  box-sizing: border-box;\n  height: 85px;\n  padding: 8px;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table td span .calendar-description {\n  margin-top: auto;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table tr:first-child td {\n  border-top: 1px solid #ebeef5;\n}\n.ea-calendar_wrap .ea-calendar_calendar-wrap .ea-calendar_table tr td:first-child {\n  border-left: 1px solid #ebeef5;\n  border-top: 1px solid #ebeef5;\n}\n.ea-calendar_wrap.mini {\n  font-size: 10px;\n  text-align: center;\n}\n.ea-calendar_wrap.mini .ea-calendar-header_wrap {\n  justify-content: space-around;\n}\n.ea-calendar_wrap.mini .ea-calendar-header_wrap .ea-calendar-header_changer {\n  display: none;\n}\n.ea-calendar_wrap.mini .ea-calendar_calendar-wrap .ea-calendar_table td span {\n  height: 20px;\n  padding: 4px;\n}\n";

package/build/components/ea-calendar/src/utils/createChangerElement.js

@@ -0,0 +1 @@
+import{createElement}from"../../../../utils/createElement.js";export const createChangerElement=(e,a)=>{const r=createElement("ea-button",`ea-calendar-header_sg-changer ea-calendar-header_changer-${a}`);return r.innerText=e,r.size="small",r};

package/build/components/ea-calendar/src/utils/createThead.js

@@ -0,0 +1 @@
+import{createElement}from"../../../../utils/createElement.js";export const createThead=(e=["一","二","三","四","五","六","日"])=>{const t=createElement("tr");t.part="table-head-row";const r=e.map((e=>{const t=createElement("th");return t.part="table-head-item",t.innerText=e,t}));return t.append(...r),t};

package/build/components/ea-calendar/src/utils/getDate.js

@@ -0,0 +1 @@
+export function getToday(){const t=new Date;return`${t.getFullYear()}-${t.getMonth()+1}`}export function getUserToday(t){const e=new Date(t);return`${e.getFullYear()}-${e.getMonth()+1}`}

package/build/components/ea-calendar/src/utils/getUserWeekStart.js

@@ -0,0 +1 @@
+export function getUserWeekStart(e,n){if(!e.includes(n))return e;const t=e.findIndex(((e,t)=>{if(e===n)return t}));return 0===t||-1===t?e:e.slice(t).concat(e.slice(0,t))}

package/build/components/ea-card/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";class EaCard extends Base{#s;constructor(){super();const s=this.attachShadow({mode:"open"});s.innerHTML='\n      <div class="ea-card_wrap" part="container">\n        <div class="ea-card_header" part="header-wrap">\n          <slot name="header"></slot>\n        </div>\n        <div class="ea-card_content" part="content-wrap">\n          <slot></slot>\n        </div>\n      </div>\n    ',this.#s=s.querySelector(".ea-card_wrap"),this.build(s,stylesheet)}get shadow(){return this.getAttribute("shadow")||"always"}set shadow(s){this.setAttribute("shadow",s),this.#s.classList.add(`is-${s}-shadow`)}connectedCallback(){this.shadow=this.shadow}}customElements.get("ea-card")||customElements.define("ea-card",EaCard);

package/build/components/ea-card/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-card_wrap {\n  border-radius: 4px;\n  border: 1px solid #ebeef5;\n  background-color: #fff;\n  overflow: hidden;\n  color: #303133;\n  transition: box-shadow 0.3s;\n}\n.ea-card_wrap.is-always-shadow, .ea-card_wrap.is-hover-shadow:hover {\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);\n}\n.ea-card_wrap.is-never-shadow {\n  box-shadow: none;\n}\n.ea-card_wrap .ea-card_content {\n  padding: 20px;\n}\n";

package/build/components/ea-carousel/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-carousel-item/index.js";import{createElement}from"../../utils/createElement.js";import{handleIndexOverflow}from"./src/utils/handleIndexOverflow.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCarousel extends Base{#t;#e;#i;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n            <div class='ea-carousel_wrap' part='container'>\n                <div class='ea-carousel_content-container' part='content-wrap'>\n                    <slot></slot>\n                </div>\n                <div class='ea-carousel-indicator_wrap' part='indicator-wrap'></div>\n            </div>\n        ",this.#t=t.querySelector(".ea-carousel_wrap"),this.#e=t.querySelector(".ea-carousel_content-container"),this.#i=t.querySelector(".ea-carousel-indicator_wrap"),this.build(t,stylesheet)}get direction(){const t=this.getAttribute("direction");return["horizontal","vertical"].includes(t)?t:"horizontal"}set direction(t){this.setAttribute("direction",t),this.#t.classList.add(`ea-carousel--${t}`)}get index(){return this.getAttrNumber("index")||0}set index(t){const e=this.querySelectorAll("ea-carousel-item").length-1,i=handleIndexOverflow(e,t);this.setAttribute("index",i);const r=this.#t.getBoundingClientRect(),a="horizontal"===this.direction?"X":"Y",s="horizontal"===this.direction?r.width:r.height;this.#e.style.transform=`translate${a}(-${i*s}px)`;try{const t=this.#i.querySelectorAll(".ea-carousel-item_indicator");t.forEach((t=>{t.classList.remove("ea-carousel-item_indicator--active")})),t[i].classList.add("ea-carousel-item_indicator--active")}catch(t){}}get trigger(){const t=this.getAttribute("trigger")||"hover";return["click","hover"].includes(t)?t:"click"}set trigger(t){this.setAttribute("trigger",t)}get interval(){return this.getAttrNumber("interval")||3}set interval(t){this.setAttribute("interval",t)}get arrow(){const t=this.getAttribute("arrow")||"hover";return["always","hover","never"].includes(t)?t:"hover"}set arrow(t){this.setAttribute("arrow",t)}#r(){const t=this.querySelectorAll("ea-carousel-item").length;for(let e=0;e<t;e++){const t=createElement("div","ea-carousel-item_indicator");t.part="indicator",this.#i.appendChild(t)}const e=this.#i.querySelectorAll(".ea-carousel-item_indicator");e[0].classList.add("ea-carousel-item_indicator--active"),e.forEach(((t,i)=>{t.addEventListener("click"===this.trigger?"click":"mouseenter",(()=>{this.index=i,e.forEach((t=>{t.classList.remove("ea-carousel-item_active")})),t.classList.add("ea-carousel-item_active")}))}))}#a(){let t=setInterval((()=>{this.index=this.index+1}),1e3*this.interval);this.addEventListener("mouseenter",(()=>{clearInterval(t),t=null})),this.addEventListener("mouseleave",(()=>{t=setInterval((()=>{this.index=this.index+1}),1e3*this.interval)}))}#s(t){let e=!1;const i=createElement("div",`ea-carousel-item_arrow ea-carousel-item_arrow--${t}`);switch(i.part="arrow",i.innerHTML="left"===t?"&lt;":"&gt;",this.arrow){case"always":this.#t.classList.add("always-show-arrow");break;case"hover":this.#t.classList.add("hover-trigger")}return i.addEventListener("click",(()=>{e||(this.index="left"===t?--this.index:++this.index)})),this.#e.addEventListener("transitionstart",(()=>{e=!0})),this.#e.addEventListener("transitionend",(()=>{e=!1})),i}connectedCallback(){if(this.direction=this.direction,this.trigger=this.trigger,this.interval=this.interval,this.arrow=this.arrow,this.index=this.index,this.#r(),this.#a(),"never"!==this.arrow||"vertical"!==this.direction){const t=this.#s("left"),e=this.#s("right");this.#t.appendChild(t),this.#t.appendChild(e)}window.addEventListener("resize",(()=>{this.index=this.index}))}}customElements.get("ea-carousel")||customElements.define("ea-carousel",EaCarousel);

package/build/components/ea-carousel/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-carousel_wrap {\n  position: relative;\n  overflow: hidden;\n}\n.ea-carousel_wrap .ea-carousel_content-container {\n  position: relative;\n  display: flex;\n  color: #fff;\n  text-align: center;\n  height: 300px;\n  transition: transform 0.5s;\n}\n.ea-carousel_wrap .ea-carousel_content-container ::slotted(ea-carousel-item) {\n  flex: 0 0 100%;\n  width: 100%;\n}\n.ea-carousel_wrap .ea-carousel-item_arrow {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  opacity: 0;\n  width: 1.5rem;\n  height: 1.5rem;\n  line-height: 1.5;\n  font-weight: 800;\n  text-align: center;\n  border-radius: 50%;\n  background-color: rgba(31, 45, 61, 0.11);\n  color: #fff;\n  cursor: pointer;\n  user-select: none;\n  transition: background-color 0.3s, transform 0.3s, opacity 0.3s;\n}\n.ea-carousel_wrap .ea-carousel-item_arrow.ea-carousel-item_arrow--left {\n  left: 0;\n  transform: translate(-100%, -50%);\n}\n.ea-carousel_wrap .ea-carousel-item_arrow.ea-carousel-item_arrow--right {\n  right: 0;\n  transform: translate(100%, -50%);\n}\n.ea-carousel_wrap .ea-carousel-item_arrow:hover {\n  background-color: rgba(31, 45, 61, 0.3);\n}\n.ea-carousel_wrap .ea-carousel-indicator_wrap {\n  position: absolute;\n  bottom: 1rem;\n  left: 50%;\n  transform: translateX(-50%);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  cursor: pointer;\n}\n.ea-carousel_wrap .ea-carousel-indicator_wrap .ea-carousel-item_indicator {\n  width: 0.5rem;\n  height: 0.5rem;\n  border-radius: 50%;\n  background-color: rgba(255, 255, 255, 0.4);\n  margin: 0.25rem;\n  transition: background-color 0.3s;\n}\n.ea-carousel_wrap .ea-carousel-indicator_wrap .ea-carousel-item_indicator.ea-carousel-item_indicator--active {\n  background-color: #fff;\n}\n.ea-carousel_wrap ::slotted(ea-carousel-item:nth-child(odd)) {\n  --odd-bgc: #d3dce6;\n}\n.ea-carousel_wrap.hover-trigger:hover .ea-carousel-item_arrow.ea-carousel-item_arrow--left {\n  left: 0;\n  transform: translate(50%, -50%);\n  opacity: 1;\n}\n.ea-carousel_wrap.hover-trigger:hover .ea-carousel-item_arrow.ea-carousel-item_arrow--right {\n  right: 0;\n  transform: translate(-50%, -50%);\n  opacity: 1;\n}\n.ea-carousel_wrap.always-show-arrow .ea-carousel-item_arrow.ea-carousel-item_arrow--left {\n  left: 0;\n  transform: translate(50%, -50%);\n  opacity: 1;\n}\n.ea-carousel_wrap.always-show-arrow .ea-carousel-item_arrow.ea-carousel-item_arrow--right {\n  right: 0;\n  transform: translate(-50%, -50%);\n  opacity: 1;\n}\n.ea-carousel_wrap.ea-carousel--horizontal .ea-carousel_content-container {\n  flex-direction: row;\n}\n.ea-carousel_wrap.ea-carousel--vertical .ea-carousel_content-container {\n  flex-direction: column;\n}\n.ea-carousel_wrap.ea-carousel--vertical .ea-carousel-item_arrow {\n  display: none;\n}\n.ea-carousel_wrap.ea-carousel--vertical .ea-carousel-indicator_wrap {\n  left: 100%;\n  bottom: 50%;\n  flex-direction: column;\n  transform: translate(-200%, 50%);\n}\n";

package/build/components/ea-carousel/src/utils/handleIndexOverflow.js

@@ -0,0 +1 @@
+export function handleIndexOverflow(e,n){return n<0?n=e:n>e&&(n=0),n}

package/build/components/ea-carousel-item/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCarouselItem extends Base{constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML="\n            <div class='ea-carousel-item_wrap' part='container'>\n                <slot></slot>\n            </div>\n        ",this.build(e,stylesheet)}}customElements.get("ea-carousel-item")||customElements.define("ea-carousel-item",EaCarouselItem);

package/build/components/ea-carousel-item/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n:host {\n  --odd-bgc: #99a9bf;\n}\n\n.ea-carousel-item_wrap {\n  display: inline-block;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  z-index: 0;\n  background-color: var(--odd-bgc);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.ea-carousel-item_wrap ::slotted(img) {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n";

package/build/components/ea-checkbox/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCheckbox extends Base{#e;#t;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n      <label class="ea-checkbox_wrap" part="container">\n        <input type="checkbox" class="ea-checkbox-input_input"/>\n        <span class="ea-checkbox-input_wrap" part="input-container">\n          <span class="ea-checkbox-input_inner" part="input"></span>\n        </span>\n        <span class="ea-checkbox-label_desc" part="label-container">\n          <slot></slot>\n        </span>\n      </label>\n    ',this.#t=e.querySelector(".ea-checkbox_wrap"),this.#e=e.querySelector(".ea-checkbox-input_input"),this.build(e,stylesheet)}get checked(){return this.getAttrBoolean("checked")}set checked(e){this.setAttribute("checked",e),this.#e.checked=e}get name(){return this.getAttribute("name")||""}set name(e){this.setAttribute("name",e),this.#e.setAttribute("name",e)}get value(){return this.getAttribute("value")}set value(e){this.setAttribute("value",e),this.#t.setAttribute("for",e),this.#e.setAttribute("id",e),this.#e.setAttribute("value",e)}get disabled(){return this.getAttrBoolean("disabled")}set disabled(e){this.setAttribute("disabled",e),this.#e.disabled=e}get border(){return this.getAttrBoolean("border")}set border(e){this.#t.classList.toggle("border",e)}get indeterminate(){return this.getAttrBoolean("indeterminate")}set indeterminate(e){this.setAttribute("indeterminate",e),this.#e.setAttribute("indeterminate",e),e&&(this.checked=!1,this.#t.classList.remove("checked"),this.setAttribute("indeterminate",!0),this.#e.setAttribute("indeterminate",!0))}connectedCallback(){this.checked=this.checked,this.name=this.name,this.value=this.value,this.disabled=this.disabled,this.border=this.border,this.indeterminate=this.indeterminate,this.#e.addEventListener("change",(e=>{e.preventDefault(),this.indeterminate=!1,this.checked=e.target.checked,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{checked:this.checked,value:this.value,name:this.name}}))}))}}window.customElements.get("ea-checkbox")||window.customElements.define("ea-checkbox",EaCheckbox);

package/build/components/ea-checkbox/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet='\n:host {\n  --margin-right: 1rem;\n}\n\n.ea-checkbox_wrap {\n  display: inline-flex;\n  align-items: center;\n  white-space: nowrap;\n  user-select: none;\n  margin-right: var(--margin-right);\n}\n.ea-checkbox_wrap input {\n  display: none;\n}\n.ea-checkbox_wrap .ea-checkbox-input_wrap {\n  line-height: 1;\n  margin-right: 0.5rem;\n}\n.ea-checkbox_wrap .ea-checkbox-input_wrap .ea-checkbox-input_inner {\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  width: 0.8125rem;\n  height: 0.8125rem;\n  line-height: 0.8125;\n  border-radius: 3px;\n  border: 1px solid #ccc;\n  transition: background-color 0.2s, border-color 0.2s;\n}\n.ea-checkbox_wrap .ea-checkbox-input_wrap .ea-checkbox-input_inner::after {\n  content: "";\n  position: absolute;\n  left: 52.5%;\n  top: 45%;\n  transform: translate(-50%, -50%) rotate(-135deg);\n  display: block;\n  width: 3px;\n  height: 7px;\n  opacity: 0;\n  transition: opacity 0.2s;\n}\n.ea-checkbox_wrap .ea-checkbox-input_wrap .ea-checkbox-input_input {\n  display: none;\n}\n.ea-checkbox_wrap .ea-checkbox-label_desc {\n  line-height: 1;\n  transition: color 0.2s;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=true] + .ea-checkbox-input_wrap .ea-checkbox-input_inner {\n  border-color: #409eff;\n  background-color: #409eff;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=true] + .ea-checkbox-input_wrap .ea-checkbox-input_inner::after {\n  opacity: 1;\n  left: 50%;\n  top: 50%;\n  width: 80%;\n  height: 3px;\n  background-color: white;\n  transform: translate(-50%, -50%) rotate(0deg);\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=true]:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=false]:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner {\n  border-color: #409eff;\n  background-color: #409eff;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner::after,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=true]:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner::after,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=false]:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner::after {\n  opacity: 1;\n  border-left: 2px solid white;\n  border-top: 2px solid white;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:checked + .ea-checkbox-input_wrap + .ea-checkbox-label_desc,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=true]:checked + .ea-checkbox-input_wrap + .ea-checkbox-label_desc,\n.ea-checkbox_wrap .ea-checkbox-input_input[indeterminate=false]:checked + .ea-checkbox-input_wrap + .ea-checkbox-label_desc {\n  color: #409eff;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled {\n  pointer-events: none;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled + .ea-checkbox-input_wrap {\n  cursor: not-allowed;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled + .ea-checkbox-input_wrap .ea-checkbox-input_inner {\n  border-color: #eeeeee;\n  background-color: #eeeeee;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled + .ea-checkbox-input_wrap .ea-checkbox-input_inner::before {\n  background-color: transparent;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled + .ea-checkbox-input_wrap + .ea-checkbox-label_desc {\n  cursor: not-allowed;\n  color: #c0c4cc;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner {\n  border-color: #eeeeee;\n  background-color: #eeeeee;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled:checked + .ea-checkbox-input_wrap .ea-checkbox-input_inner::before {\n  opacity: 1;\n  border-left: 2px solid white;\n  border-top: 2px solid white;\n}\n.ea-checkbox_wrap .ea-checkbox-input_input:disabled:checked + .ea-checkbox-input_wrap + .ea-checkbox-label_desc {\n  color: #c0c4cc;\n}\n';

package/build/components/ea-checkbox-group/index.js

@@ -0,0 +1 @@
+import{timeout}from"../../utils/timeout.js";import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCheckboxGroup extends Base{#e=!1;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n            <div class="ea-checkbox-group_wrap" part="container">\n                <slot></slot>\n            </div>\n        ',this.build(e,stylesheet)}get name(){return this.getAttribute("name")||"ea-checkbox"}set name(e){this.setAttribute("name",e),this.querySelectorAll("ea-checkbox").forEach((t=>{t.setAttribute("name",e),t.name=e}))}get value(){return this.getAttribute("value")||""}set value(e){this.setAttribute("value",e);try{const t=e.split(",").map((e=>e.trimStart()));t.map((e=>{this.querySelector(`ea-checkbox[value="${e}"]`).checked="true"})),this.dispatchEvent(new CustomEvent("change",{detail:t}))}catch(e){}}get disabled(){return this.getAttrBoolean("disabled")}set disabled(e){if(!e&&!this.#e)return;this.querySelectorAll("ea-checkbox").forEach((t=>{t.disabled=e}))}#t(e){let t=[];Array.from(e).filter((e=>!!e.checked&&t.push(e.value))),this.value=t.join(",")}connectedCallback(){this.setAttribute("data-ea-component",!0),setTimeout((()=>{this.name=this.name,this.value=this.value,this.disabled=this.disabled;const e=this.querySelectorAll("ea-checkbox");e.forEach((t=>{t.addEventListener("change",(t=>{this.#t(e)}))})),this.#t(e),this.#e=!0}),50)}}window.customElements.get("ea-checkbox-group")||window.customElements.define("ea-checkbox-group",EaCheckboxGroup);

package/build/components/ea-checkbox-group/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-checkbox-group {\n  display: flex;\n}\n.ea-checkbox-group ::slotted(ea-checkbox) {\n  margin-right: 1.5rem;\n}\n";

package/build/components/ea-collapse/index.js

@@ -0,0 +1 @@
+import{timeout}from"../../utils/timeout.js";import Base from"../Base.js";import"../ea-collapse-item/index.js";export class EaCollapse extends Base{constructor(){super();this.attachShadow({mode:"open"}).innerHTML='\n            <div class="ea-collapse_wrap" part="container">\n                <slot></slot>\n            </div>\n        '}get active(){return this.getAttribute("active")||1}set active(t){this.setAttribute("active",t),timeout((()=>{this.#t(this.accordion,t)}),20)}get accordion(){return this.getAttrBoolean("accordion")||!1}set accordion(t){this.setAttribute("accordion",t),timeout((()=>{this.#t(t,this.active)}),20)}#t(t,e){const a=Array.from(this.querySelectorAll("ea-collapse-item"));let i=t?"":[];a.forEach((e=>{e.addEventListener("change",(i=>{t&&a.forEach((t=>{t.isOpen=!1})),e.isOpen=!i.detail.isOpen}))})),t?(i=e.toString().trim()[0],a.forEach((t=>{t.isOpen=t.name===i}))):(i=e.split(",").map((t=>t.trim())).concat(),a.forEach((t=>{t.isOpen=i.includes(t.name)})))}connectedCallback(){this.accordion=this.accordion,this.active=this.active}}customElements.get("ea-collapse")||customElements.define("ea-collapse",EaCollapse);

package/build/components/ea-collapse-item/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaCollapseItem extends Base{#t;#e;#s;#i;#n;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML='\n            <div class="ea-collapse-item_wrap" part="container">\n                <div class="ea-collapse-item_title" part="title-wrap">\n                    <span class="ea-collapse-item_title-content" part="title-content"></span>\n                    <span class="ea-collapse-item_title-icon" part="title-icon"></span>\n                </div>\n                <div class="ea-collapse-item_content" part="content-wrap">\n                    <slot></slot>\n                </div>\n            </div>\n        ',this.#t=t.querySelector(".ea-collapse-item_wrap"),this.#e=t.querySelector(".ea-collapse-item_title"),this.#s=t.querySelector(".ea-collapse-item_title-content"),this.#i=t.querySelector(".ea-collapse-item_title-icon"),this.#n=t.querySelector(".ea-collapse-item_content"),this.build(t,stylesheet)}get title(){return this.getAttribute("title")}set title(t){this.setAttribute("title",t),this.#s.innerHTML=t}get name(){return this.getAttribute("name")}set name(t){this.setAttribute("name",t)}get isOpen(){return this.getAttrBoolean("is-open")||!1}set isOpen(t){if(t===this.isOpen)return;this.toggleAttr("is-open",t);const e=this.#n.scrollHeight;this.isOpen?(this.#n.style.height=`${e}px`,this.#n.style.paddingBottom="20px",this.#i.style.rotate="45deg"):(this.#n.style.height="0px",this.#n.style.paddingBottom="0px",this.#i.style.rotate="-45deg")}connectedCallback(){this.title=this.title,this.name=this.name,this.#e.addEventListener("click",(t=>{this.dispatchEvent(new CustomEvent("change",{detail:{name:this.name,isOpen:this.isOpen},bubbles:!0,composed:!0}))}))}}customElements.get("ea-collapse-item")||customElements.define("ea-collapse-item",EaCollapseItem);

package/build/components/ea-collapse-item/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-collapse-item_wrap .ea-collapse-item_title {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-bottom: 1px solid #ebeef5;\n  height: 48px;\n  line-height: 48px;\n  font-size: 13px;\n  font-weight: 700;\n  color: #303133;\n  cursor: pointer;\n}\n.ea-collapse-item_wrap .ea-collapse-item_title .ea-collapse-item_title-icon {\n  width: 0.35rem;\n  height: 0.35rem;\n  margin-right: 1rem;\n  border: 3px solid #9ca0a5;\n  border-left-color: transparent;\n  border-top-color: transparent;\n  rotate: -45deg;\n  transition: rotate 0.3s;\n}\n.ea-collapse-item_wrap .ea-collapse-item_content {\n  will-change: height;\n  overflow: hidden;\n  height: 0;\n  padding-bottom: 0;\n  transition: height 0.3s, padding-bottom 0.3s;\n  font-size: 13px;\n  color: #303133;\n}\n";

package/build/components/ea-container/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";const stylesheet="\n.ea-container_wrap {\n  display: flex;\n  flex-direction: row;\n  box-sizing: border-box;\n  width: 100%;\n  height: 100%;\n}\n.ea-container_wrap.is-vertical {\n  flex-direction: column;\n}\n.ea-container_wrap ::slotted(ea-main) {\n  flex: 1;\n  overflow: auto;\n}\n";export class EaContainer extends Base{#e;get CONTAINER_TYPE(){return["ea-header","ea-main","ea-footer","ea-container","ea-aside"]}constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n            <div class="ea-container_wrap" part="container">\n                <slot></slot>\n            </div>\n        ',this.#e=e.querySelector(".ea-container_wrap"),this.build(e,stylesheet)}get direction(){return["horizontal","vertical"].includes(this.getAttribute("direction"))||"horizontal"}set direction(e){this.setAttribute("direction",e),this.#e.classList.toggle("is-vertical","horizontal"===e)}#t(e){const t=e.map((e=>e.tagName.toLowerCase()));e.forEach((e=>{this.CONTAINER_TYPE.includes(e.tagName.toLowerCase())||e.remove(),"ea-container"===e.tagName.toLowerCase()&&(e.style.flex="1")})),t.includes("ea-header")||t.includes("ea-footer")?this.direction="horizontal":this.direction=this.direction}connectedCallback(){const e=Array.from(this.children);this.#t(e)}}customElements.get("ea-container")||customElements.define("ea-container",EaContainer);

package/build/components/ea-date-picker/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import"../ea-calendar/index.js";import"../ea-input/index.js";import{stylesheet}from"./src/style/stylesheet.js";import{timeout}from"../../utils/timeout.js";export class EaDatePicker extends Base{#e;#t;#a;#i;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML="\n            <div class='ea-date-picker_wrap' part='container'>\n                <div class='ea-date-picker_input-wrap' part='input-wrap'>\n                    <ea-input class=\"ea-date-picker_input\" part='input' prefix-icon=\"icon-calendar-times-o\" readonly></ea-input>\n                </div>\n                <div class='ea-date-picker_dropdown-wrap' part='dropdown-wrap'>\n                    <ea-calendar class=\"ea-date-picker_calendar\" size=\"mini\" part='calendar'></ea-calendar>\n                </div>\n            </div>\n        ",this.#e=e.querySelector(".ea-date-picker_wrap"),this.#t=e.querySelector(".ea-date-picker_dropdown-wrap"),this.#a=e.querySelector(".ea-date-picker_calendar"),this.#i=e.querySelector(".ea-date-picker_input"),this.build(e,stylesheet)}get name(){return this.getAttribute("name")||"datePicker"}set name(e){this.setAttribute("name",e)}get width(){return this.getAttribute("width")||"200px"}set width(e){this.setAttribute("width",e),this.#e.style.width=e,this.#t.style.width=e,this.style.display="inline-block",this.style.width=e}get value(){return this.getAttribute("value")||""}set value(e){if(isNaN(new Date(e))&&""!==e){const t=new Date(Date.now());e=`${t.getFullYear()}-${t.getMonth()+1}-${t.getDate()}`}this.setAttribute("value",e),this.#i.value=e}get placeholder(){return this.getAttribute("placeholder")||""}set placeholder(e){this.setAttribute("placeholder",e),this.#i.placeholder=e}get disabled(){return this.getAttrBoolean("disabled")||!1}set disabled(e){this.toggleAttr("disabled",e),this.#i.disabled=e}get align(){return this.getAttribute("align")||"left"}set align(e){this.setAttribute("align",e),this.#i.shadowRoot.querySelector("input").style.textAlign=e}#n(){this.#a.addEventListener("select",(e=>{const{year:t,month:a,date:i,day:n}=e.detail;this.value=`${t}-${a}-${i}`,this.#i.value=`${t}-${a}-${i}`,this.dispatchEvent(new CustomEvent("change",{detail:{fulllDate:`${t}-${a}-${i}`,year:t,month:a,date:i,week:n}}))}))}#s(){this.#i.addEventListener("focus",(()=>{this.#e.classList.add("is-open")})),window.addEventListener("click",(e=>{this.contains(e.target)?this.#i.shadowRoot.querySelector(".ea-input_inner").focus():this.#e.classList.remove("is-open")}))}connectedCallback(){this.setAttribute("data-ea-component",!0),this.name=this.name,this.width=this.width,this.value=this.value,this.placeholder=this.placeholder,this.disabled=this.disabled,this.align=this.align,this.#n(),this.#s(),timeout((()=>{this.#e.classList.add("with-transition")}),300)}}customElements.get("ea-date-picker")||customElements.define("ea-date-picker",EaDatePicker);

package/build/components/ea-date-picker/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-date-picker_wrap .ea-date-picker_input-wrap {\n  position: relative;\n}\n.ea-date-picker_wrap .ea-date-picker_dropdown-wrap {\n  position: absolute;\n  background-color: #fff;\n  transform-origin: top center;\n  transform: scaleY(0);\n  box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);\n  z-index: 2;\n}\n.ea-date-picker_wrap.is-open .ea-date-picker_dropdown-wrap {\n  transform: scaleY(1);\n}\n.ea-date-picker_wrap.with-transition .ea-date-picker_dropdown-wrap {\n  transition: transform 0.3s;\n}\n";

package/build/components/ea-descriptions/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import"../ea-descriptions-item/index.js";import{getThTemplate_direction}from"./src/components/getThTemplate_direction.js";import{getTdTemplate_direction}from"./src/components/getTdTemplate_direction.js";import{contentTemplate}from"./src/components/contentTemplate.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaDescriptions extends Base{#t;#e;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML='\n            <div class="ea-descriptions_wrap" part="container">\n                <div class="ea-descriptions_header" part="header-wrap"></div>\n                <div class="ea-descriptions_body" part="body-wrap">\n                    <table class="ea-descriptions_table" part="table-wrap"></table>\n                </div>\n            </div>\n        ',this.#t=t.querySelector(".ea-descriptions_table"),this.#e=t.querySelector(".ea-descriptions_header"),this.build(t,stylesheet)}get title(){return this.getAttribute("title")||""}set title(t){this.setAttribute("title",t),this.#e.innerHTML=t}get col(){return this.getAttrNumber("col")||3}set col(t){this.setAttribute("col",t)}get border(){return this.getAttrBoolean("border")}set border(t){this.toggleAttr("border",t)}get direction(){return this.getAttribute("direction")||"horizontal"}set direction(t){this.setAttribute("direction",t)}#i(t){const e=Number(t.length);for(let i=0;i<e;i+=3){let e=0;const r=document.createElement("tbody");switch(r.part="table-tbody",this.direction){case"horizontal":{const s=document.createElement("tr");s.part="table-tr";for(let r=i;r<this.col+i;r++){const i=Number(t[r]?.getAttribute("span"))||1;if(e+i>this.col||!t[r])break;s.innerHTML+=contentTemplate(t[r],i,this.border)}r.appendChild(s);break}case"vertical":{const s=document.createElement("tr"),o=document.createElement("tr");s.part="table-tr",o.part="table-tr";for(let r=i;r<this.col+i;r++){const i=Number(t[r]?.getAttribute("span"))||1;if(e+i>this.col||!t[r])break;s.innerHTML+=getThTemplate_direction(t[r].getAttribute("label"),this.border),o.innerHTML+=getTdTemplate_direction(t[r].innerHTML,this.border,i)}r.appendChild(s),r.appendChild(o);break}}this.#t.appendChild(r)}t.forEach((t=>{t.remove()})),this.shadowRoot?.querySelectorAll("[slot]").forEach((t=>{t.remove()}))}#r(){const t=this.shadowRoot?.querySelector("ea-icon");t&&(this.shadowRoot.innerHTML+=`\n                <link rel="stylesheet" href="${new URL("../ea-icon/index.css",import.meta.url).href}">\n            `)}connectedCallback(){this.title=this.title,this.col=this.col,this.border=this.border,this.direction=this.direction;const t=this.querySelectorAll("ea-descriptions-item");this.#i(t),this.#r()}}customElements.get("ea-descriptions")||customElements.define("ea-descriptions",EaDescriptions);

package/build/components/ea-descriptions/src/components/contentTemplate.js

@@ -0,0 +1 @@
+import{getTdTemplate_border}from"./getTdTemplate_border.js";import{getThTemplate_normal}from"./getThTemplate_normal.js";export const contentTemplate=(e,t,r)=>{let l=e.getAttribute("label"),o=e.innerHTML;return l||(l=e.querySelector('[slot="label"]')?.innerHTML||""),r?getTdTemplate_border(l,o,t):getThTemplate_normal(l,o,t)};

package/build/components/ea-descriptions/src/components/getTdTemplate_border.js

@@ -0,0 +1 @@
+export const getTdTemplate_border=(e,t,s)=>`\n        <th class="ea-descriptions-item_label ea-descriptions-item_cell is-border" colspan="1" part="table-th">${e}</th>\n        <td class="ea-descriptions-item_content ea-descriptions-item_cell is-border" colspan="${s}" part="table-td">${t}</td>\n    `;

package/build/components/ea-descriptions/src/components/getTdTemplate_direction.js

@@ -0,0 +1 @@
+export const getTdTemplate_direction=(t,e,n)=>`\n        <td class="ea-descriptions-item_content ea-descriptions-item_cell ${e?"is-border":""}" colspan="${n}" part="table-td">\n            ${t}\n        </td>\n    `;

package/build/components/ea-descriptions/src/components/getThTemplate_direction.js

@@ -0,0 +1 @@
+export const getThTemplate_direction=(e,t)=>`\n        <th class="ea-descriptions-item_label ea-descriptions-item_cell ${t?"is-border":""}" colspan="1" part="table-th">\n            ${e}${t?"":":"}\n        </th>\n    `;

package/build/components/ea-descriptions/src/components/getThTemplate_normal.js

@@ -0,0 +1 @@
+export const getThTemplate_normal=(t,a,e)=>`\n        <td class="ea-descriptions-item" colspan="${e}" part="table-td">\n            <span class="ea-descriptions-item_label" part="table-td-label">${t}:</span>\n            <span class="ea-descriptions-item_content" part="table-td-content">${a}</span>\n        </td>\n    `;

package/build/components/ea-descriptions/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-descriptions_wrap {\n  font-size: 14px;\n}\n.ea-descriptions_wrap .ea-descriptions_header {\n  font-size: 1rem;\n  font-weight: 700;\n  margin-bottom: 20px;\n}\n.ea-descriptions_wrap .ea-descriptions_body table {\n  width: 100%;\n  border-collapse: collapse;\n  table-layout: fixed;\n}\n.ea-descriptions_wrap .ea-descriptions_body table th {\n  background-color: #fafafa;\n}\n.ea-descriptions_wrap .ea-descriptions_body table td {\n  vertical-align: baseline;\n}\n.ea-descriptions_wrap .ea-descriptions-item_label,\n.ea-descriptions_wrap .ea-descriptions-item_content {\n  font-weight: normal;\n  font-size: 14px;\n  vertical-align: middle;\n}\n.ea-descriptions_wrap .ea-descriptions-item_label.is-border,\n.ea-descriptions_wrap .ea-descriptions-item_content.is-border {\n  border: 1px solid #ebeef5;\n}\n.ea-descriptions_wrap .ea-descriptions-item_cell {\n  text-align: left;\n  padding: 12px 10px;\n}\n";

package/build/components/ea-descriptions-item/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{stylesheet}from"./src/stylesheet.js";export class EaDescriptionsItem extends Base{#e;#t;#s;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n        <td class="ea-descriptions-item_wrap" part="container">\n            <span class="ea-descriptions-item_label" part="label-wrap">\n                <slot slot="label"></slot>\n            </span>\n            <span class="ea-descriptions-item_content" part="content-wrap">\n                <slot></slot>\n            </span>\n        </td>\n    ',this.#e=e.querySelector(".ea-descriptions-item_wrap"),this.#t=e.querySelector(".ea-descriptions-item_label"),this.#s=e.querySelector('slot[name="label"]'),this.build(e,stylesheet)}get label(){return this.getAttribute("label")||""}set label(e){e&&(this.setAttribute("label",e),this.#t.innerHTML=e)}get span(){return this.getAttrNumber("span")||1}set span(e){this.setAttribute("span",e)}connectedCallback(){this.label=this.label,this.span=this.span}}customElements.get("ea-descriptions-item")||customElements.define("ea-descriptions-item",EaDescriptionsItem);

package/build/components/ea-descriptions-item/src/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet='\n.ea-descriptions-item_wrap {\n  display: inline-flex;\n  text-align: left;\n  padding-bottom: 1rem;\n  line-height: 1.5;\n}\n.ea-descriptions-item_wrap .ea-descriptions-item_label {\n  margin-right: 10px;\n}\n.ea-descriptions-item_wrap .ea-descriptions-item_label::after {\n  content: ":";\n}\n.ea-descriptions-item_wrap .ea-descriptions-item_content {\n  display: inline-flex;\n  flex: 1;\n  align-items: baseline;\n}\n.ea-descriptions-item_wrap .ea-descriptions-item_label.is-border,\n.ea-descriptions-item_wrap .ea-descriptions-item_content.is-border {\n  border: 1px solid #ebeef5;\n}\n';

package/build/components/ea-drawer/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{timeout}from"../../utils/timeout.js";import{handleDefaultAttrIsTrue}from"../../utils/handleDefaultAttrIsTrue.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaDrawer extends Base{#e;#t;#r;#s;#i;#a;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n      <div class="ea-drawer_wrap" part="container">\n        <div class="ea-drawer_drawer-wrap" part="drawer-wrap">\n          <div class="ea-drawer_header-wrap" part="header-wrap">\n            <span class="ea-drawer_title" part="title-wrap">\n              <slot name="title"></slot>\n            </span>\n            <ea-icon class="ea-drawer_icon" icon="icon-cancel" part="icon"></ea-icon>\n          </div>\n          <div class="ea-drawer_main-wrap" part="main-wrap">\n            <slot></slot>\n          </div>\n          <div class="ea-drawer_mask-wrap" part="mask-wrap"></div>\n        </div>\n      </div>\n    ',this.#e=e.querySelector(".ea-drawer_wrap"),this.#t=e.querySelector(".ea-drawer_drawer-wrap"),this.#r=e.querySelector(".ea-drawer_mask-wrap"),this.#s=e.querySelector(".ea-drawer_header-wrap"),this.#i=e.querySelector(".ea-drawer_title"),this.#a=e.querySelector(".ea-drawer_icon"),this.build(e,stylesheet)}get directionType(){return["ltr","rtl","ttb","btt"]}get direction(){const e=this.getAttribute("direction");return this.directionType.includes(e)?e:"ltr"}set direction(e){this.setAttribute("direction",e),this.#e.classList.toggle("direction-ltr","ltr"===e),this.#e.classList.toggle("direction-rtl","rtl"===e),this.#e.classList.toggle("direction-ttb","ttb"===e),this.#e.classList.toggle("direction-btt","btt"===e),this.#l(this.size)}get open(){return this.getAttrBoolean("open")||!1}set open(e){this.toggleAttr("open",e),timeout((()=>{this.#e.classList.toggle("is-open",e)}),20)}get size(){return this.getAttribute("size")||"30%"}set size(e){this.setAttribute("size",e),this.#l(e)}get withHeader(){return handleDefaultAttrIsTrue(this.getAttribute("with-header"))}set withHeader(e){this.toggleAttr("with-header",e),this.#s.style.display=e?"flex":"none"}get title(){return this.getAttribute("title")}set title(e){this.setAttribute("title",e),e&&(this.#i.innerText=e)}get showClose(){return handleDefaultAttrIsTrue(this.getAttribute("show-close"))}set showClose(e){this.toggleAttr("show-close",e),this.#a.style.display=e?"block":"none"}get modal(){return handleDefaultAttrIsTrue(this.getAttribute("modal"))}set modal(e){this.toggleAttr("modal",e),this.#r.style.display=e?"block":"none"}get wrapperClosable(){return handleDefaultAttrIsTrue(this.getAttribute("wrapper-closable"))}set wrapperClosable(e){this.setAttribute("wrapper-closable",e)}#l(e){const t="ltr"===this.direction||"rtl"===this.direction?"width":"height";this.#t.style.height="inherit",this.#t.style.width="inherit",this.#t.style[t]=e}#o(){const e=()=>{this.open=!1,this.#e.classList.remove("will-close"),this.#t.removeEventListener("transitionend",e)},t=()=>{this.#e.classList.add("will-close"),this.#t.addEventListener("transitionend",e),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))};this.wrapperClosable&&this.modal&&this.#r.addEventListener("click",(()=>{t()})),this.showClose&&this.#a.addEventListener("click",(()=>{t()}))}connectedCallback(){this.direction=this.direction,this.size=this.size,this.withHeader=this.withHeader,this.withHeader&&(this.showClose=this.showClose,this.title=this.title),this.modal=this.modal,this.wrapperClosable=this.wrapperClosable,this.open=!1,this.#o()}}customElements.get("ea-drawer")||customElements.define("ea-drawer",EaDrawer);

package/build/components/ea-drawer/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-drawer_wrap {\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  z-index: 2001;\n}\n.ea-drawer_wrap .ea-drawer_drawer-wrap {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  background-color: #fff;\n  transition: left 0.3s, right 0.3s, top 0.3s, bottom 0.3s;\n}\n.ea-drawer_wrap .ea-drawer_drawer-wrap .ea-drawer_header-wrap {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-sizing: border-box;\n  margin-bottom: 32px;\n  padding: 20px 20px 0;\n  color: #72767b;\n}\n.ea-drawer_wrap .ea-drawer_drawer-wrap .ea-drawer_header-wrap .ea-drawer_icon {\n  cursor: pointer;\n}\n.ea-drawer_wrap .ea-drawer_drawer-wrap .ea-drawer_main-wrap {\n  flex: 1;\n  box-sizing: border-box;\n  padding: 20px;\n  overflow: auto;\n}\n.ea-drawer_wrap .ea-drawer_drawer-wrap .ea-drawer_mask-wrap {\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.4);\n  z-index: -1;\n  opacity: 0;\n  scale: 0;\n  transition: opacity 0.3s, left 0.3s, right 0.3s, top 0.3s, bottom 0.3s;\n}\n.ea-drawer_wrap.direction-ltr, .ea-drawer_wrap.direction-rtl {\n  top: 0;\n}\n.ea-drawer_wrap.direction-ltr .ea-drawer_drawer-wrap, .ea-drawer_wrap.direction-rtl .ea-drawer_drawer-wrap {\n  top: 0;\n  height: 100%;\n}\n.ea-drawer_wrap.direction-ttb, .ea-drawer_wrap.direction-btt {\n  left: 0;\n}\n.ea-drawer_wrap.direction-ttb .ea-drawer_drawer-wrap, .ea-drawer_wrap.direction-btt .ea-drawer_drawer-wrap {\n  left: 0;\n  width: 100%;\n}\n.ea-drawer_wrap.direction-ttb .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-btt .ea-drawer_mask-wrap {\n  left: 0;\n}\n.ea-drawer_wrap.direction-ltr.is-open .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-rtl.is-open .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-ttb.is-open .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-btt.is-open .ea-drawer_mask-wrap {\n  opacity: 1;\n  scale: 1;\n}\n.ea-drawer_wrap.direction-ltr.will-close .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-rtl.will-close .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-ttb.will-close .ea-drawer_mask-wrap, .ea-drawer_wrap.direction-btt.will-close .ea-drawer_mask-wrap {\n  opacity: 0;\n  scale: 0;\n}\n.ea-drawer_wrap.direction-ltr {\n  left: -100%;\n}\n.ea-drawer_wrap.direction-ltr .ea-drawer_drawer-wrap {\n  left: -100%;\n}\n.ea-drawer_wrap.direction-ltr .ea-drawer_mask-wrap {\n  left: 0;\n}\n.ea-drawer_wrap.direction-ltr.is-open {\n  left: 0;\n}\n.ea-drawer_wrap.direction-ltr.is-open .ea-drawer_drawer-wrap {\n  left: 0;\n}\n.ea-drawer_wrap.direction-ltr.will-close .ea-drawer_drawer-wrap {\n  left: -100%;\n}\n.ea-drawer_wrap.direction-rtl {\n  right: -100%;\n}\n.ea-drawer_wrap.direction-rtl .ea-drawer_drawer-wrap {\n  right: -100%;\n}\n.ea-drawer_wrap.direction-rtl .ea-drawer_mask-wrap {\n  right: 0;\n}\n.ea-drawer_wrap.direction-rtl.is-open {\n  right: 0;\n}\n.ea-drawer_wrap.direction-rtl.is-open .ea-drawer_drawer-wrap {\n  right: 0;\n}\n.ea-drawer_wrap.direction-rtl.will-close .ea-drawer_drawer-wrap {\n  right: -100%;\n}\n.ea-drawer_wrap.direction-ttb {\n  bottom: -100%;\n}\n.ea-drawer_wrap.direction-ttb .ea-drawer_drawer-wrap {\n  bottom: -100%;\n}\n.ea-drawer_wrap.direction-ttb .ea-drawer_mask-wrap {\n  bottom: 0;\n}\n.ea-drawer_wrap.direction-ttb.is-open {\n  bottom: 0;\n}\n.ea-drawer_wrap.direction-ttb.is-open .ea-drawer_drawer-wrap {\n  bottom: 0;\n}\n.ea-drawer_wrap.direction-ttb.will-close .ea-drawer_drawer-wrap {\n  bottom: -100%;\n}\n.ea-drawer_wrap.direction-btt {\n  top: -100%;\n}\n.ea-drawer_wrap.direction-btt .ea-drawer_drawer-wrap {\n  top: -100%;\n}\n.ea-drawer_wrap.direction-btt .ea-drawer_mask-wrap {\n  top: 0;\n}\n.ea-drawer_wrap.direction-btt.is-open {\n  top: 0;\n}\n.ea-drawer_wrap.direction-btt.is-open .ea-drawer_drawer-wrap {\n  top: 0;\n}\n.ea-drawer_wrap.direction-btt.will-close .ea-drawer_drawer-wrap {\n  top: -100%;\n}\n";

package/build/components/ea-empty/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import{emptyStatusSVG}from"./src/assets/emptyStatusSVG.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaEmpty extends Base{#t;#e;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML=`\n            <div class="ea-empty_wrap" part="container">\n                <div class="ea-empty_image" part="image-wrap">\n                    ${emptyStatusSVG}\n                </div>\n                <div class="ea-empty_description" part="description-wrap">\n                    暂无数据\n                </div>\n                <div class="ea-empty_bottom" part="bottom-wrap">\n                    <slot></slot>\n                </div>\n            </div>\n        `,this.#t=t.querySelector(".ea-empty_image"),this.#e=t.querySelector(".ea-empty_description"),this.build(t,stylesheet)}get description(){return this.getAttribute("description")||"暂无数据"}set description(t){this.setAttribute("description",t),this.#e.innerHTML=t}get image(){return this.getAttribute("image")||""}set image(t){if(!t)return;this.setAttribute("image",t);const e=new Image;e.src=t,e.onload=()=>{this.#t.innerHTML=`<img src="${t}" />`}}get imageSize(){return this.getAttribute("image-size")||"128"}set imageSize(t){t&&(this.setAttribute("image-size",t),this.#t.style.width=t+"px")}connectedCallback(){this.description=this.description,this.image=this.image,this.imageSize=this.imageSize}}customElements.get("ea-empty")||customElements.define("ea-empty",EaEmpty);

package/build/components/ea-empty/src/assets/emptyStatusSVG.js

@@ -0,0 +1 @@
+export const emptyStatusSVG='\n<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">\n    <path d="M30 50v21.5a2 2 0 0 0 1 1h39a2 2 0 0 0 1-1V50H61a10 10 0 0 1-20 0h-6.5z" fill="#6E6E6F" />\n    <path d="M30.5 50.5L34 39h32.5l4 11.5" fill="none" stroke="#6E6E6F" />\n</svg>\n';

package/build/components/ea-empty/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet="\n.ea-empty_wrap {\n  padding: 40px 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n}\n.ea-empty_wrap .ea-empty_image {\n  width: 8rem;\n  object-fit: cover;\n}\n.ea-empty_wrap .ea-empty_image svg,\n.ea-empty_wrap .ea-empty_image img {\n  width: 100%;\n  height: 100%;\n}\n.ea-empty_wrap .ea-empty_description {\n  margin-top: 20px;\n}\n.ea-empty_wrap .ea-empty_bottom {\n  margin-top: 20px;\n}\n";

package/build/components/ea-footer/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";const stylesheet="\n.ea-footer_wrap {\n  box-sizing: border-box;\n  padding: 0 20px;\n\n  height: 60px;\n\n  color: #333;\n\n  overflow: hidden;\n}\n";export class EaFooter extends Base{#e;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n            <footer class="ea-footer_wrap" part="container">\n                <slot></slot>\n            </footer>\n        ',this.#e=e.querySelector(".ea-footer_wrap"),this.build(e,stylesheet)}get height(){return this.getAttrNumber("height")||60}set height(e){this.setAttribute("height",e),this.#e.style.height=`${e}px`,this.#e.style.lineHeight=`${e}px`}connectedCallback(){this.height=this.height}}customElements.get("ea-footer")||customElements.define("ea-footer",EaFooter);

package/build/components/ea-form/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{Validator}from"../../utils/Validator.js";import{timeout}from"../../utils/timeout.js";import"../ea-form-item/index.js";import"../ea-button/index.js";export class EaForm extends Base{#e;constructor(){super();this.attachShadow({mode:"open"}).innerHTML="\n            <form class='ea-form_wrap' part='container'>\n                <slot></slot>\n            </form>\n        "}get data(){const e={};return this.querySelectorAll("[data-ea-component]").forEach((t=>{e[t.name]=t.value})),e}get rules(){return this.#e||{}}set rules(e){this.#e=e;const t=this.querySelectorAll("ea-form-item");this.querySelectorAll("[data-ea-component]").forEach(((r,a)=>{t[a].rule=e[r.name],t[a].validateEvent(),t[a].isRequired=!!e[r.name]?.required}))}validate(){const e=this.querySelectorAll("ea-form-item"),t=this.querySelectorAll("[data-ea-component]");let r=[];return t.forEach(((t,a)=>{if(this.#e[t.name])for(const o in e[a].rule)if(Validator[o]){if(!Validator[o](t.value,e[a].rule[o])){e[a].isInvalid=!0,t.isInvalid=!0,r.push(t.name);break}e[a].isInvalid=!1,t.isInvalid=!1}})),new Promise(((e,t)=>{r.length>0?t(r):e(!0)}))}reset(){const e=this.querySelectorAll("ea-form-item");this.querySelectorAll("[data-ea-component]").forEach(((t,r)=>{t.value="",t.isInvalid=!1,e[r].isInvalid=!1}))}connectedCallback(){timeout((()=>{const e=this.querySelectorAll("ea-form-item"),t=Array.from(e).map((e=>e.label.length)),r=Math.max(...t);e.forEach((e=>{const t=e.shadowRoot.querySelector(".ea-form-item_label-wrap");t&&(t.style.width=20*r+"px")})),this.dispatchEvent(new CustomEvent("ready",{bubbles:!0}))}),50)}}customElements.get("ea-form")||customElements.define("ea-form",EaForm);

package/build/components/ea-form-item/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";import{withTransitionTimeOut}from"../../utils/timeout.js";import{Validator}from"../../utils/Validator.js";import{stylesheet}from"./src/style/stylesheet.js";export class EaFromItem extends Base{#t;#e;#i;#r;constructor(){super();const t=this.attachShadow({mode:"open"});t.innerHTML="\n            <div class='ea-form-item_wrap' part='container'>\n                <label class=\"ea-form-item_label-wrap\" part='label-wrap'>\n                    <slot name='label'></slot>\n                </label>\n                <div class=\"ea-form-item_content-wrap\" part='content-wrap'> \n                    <slot></slot>\n                    <span class=\"ea-form-item_invalid-wrap\" part='invalid-wrap'>\n                        <slot name='invalid-text'></slot>\n                    </span>\n                </div>\n            </div>\n        ",this.#e=t.querySelector(".ea-form-item_wrap"),this.#i=t.querySelector(".ea-form-item_label-wrap"),this.#r=t.querySelector(".ea-form-item_invalid-wrap"),this.build(t,stylesheet)}get label(){return this.getAttribute("label")}set label(t){this.setAttribute("label",t);const e=this.#i.querySelector("slot");try{0===e.assignedNodes().length&&(this.#i.innerHTML=t)}catch(t){}}get trigger(){const t=this.getAttribute("trigger");return["blur","change"].includes(t)?t:"blur"}set trigger(t){this.setAttribute("trigger",t)}get isInvalid(){return"true"===this.getAttribute("is-invalid")}set isInvalid(t){this.setAttribute("is-invalid",t),this.#e.classList.toggle("is-required",t)}get rule(){return this.#t}set rule(t){this.#t=t;for(const e in t)this[e]=t[e]}get isRequired(){return this.getAttrBoolean("is-required")}set isRequired(t){this.setAttribute("is-required",t),this.#e.classList.toggle("is-required-star",t)}validateEvent(){const t=this.querySelector("[data-ea-component]");try{t.addEventListener(this.trigger,(e=>{for(const e in this.#t)if(Validator[e]){if(!Validator[e](t.value,this.#t[e])){t.isInvalid=!0,this.#e.classList.add("is-required");break}t.isInvalid=!1,this.#e.classList.remove("is-required")}}))}catch(t){}}connectedCallback(){this.label=this.label,this.trigger=this.trigger,withTransitionTimeOut(this.#e,50)}}customElements.get("ea-form-item")||customElements.define("ea-form-item",EaFromItem);

package/build/components/ea-form-item/src/style/stylesheet.js

@@ -0,0 +1 @@
+export const stylesheet='\n.ea-form-item_wrap {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  margin-bottom: 22px;\n}\n.ea-form-item_wrap .ea-form-item_label-wrap {\n  text-align: right;\n  float: left;\n  font-size: 14px;\n  color: #606266;\n  line-height: 40px;\n  padding: 0 12px 0 0;\n  box-sizing: border-box;\n}\n.ea-form-item_wrap .ea-form-item_content-wrap {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n}\n.ea-form-item_wrap .ea-form-item_content-wrap .ea-form-item_invalid-wrap {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  transform-origin: top center;\n  transform: translateY(100%) scaleY(0);\n  font-size: 12px;\n  color: #f56c6c;\n  white-space: nowrap;\n}\n.ea-form-item_wrap.is-required-star .ea-form-item_label-wrap::before {\n  content: "*";\n  color: #f56c6c;\n  margin-right: 4px;\n}\n.ea-form-item_wrap.is-required .ea-form-item_content-wrap .ea-form-item_invalid-wrap {\n  transform: translateY(100%) scaleY(1);\n}\n.ea-form-item_wrap.is-required .ea-form-item_label-wrap {\n  color: #f56c6c;\n}\n.ea-form-item_wrap.is-required ::slotted(ea-input),\n.ea-form-item_wrap.is-required ::slotted(ea-select),\n.ea-form-item_wrap.is-required ::slotted(ea-textarea),\n.ea-form-item_wrap.is-required ::slotted(ea-time-picker),\n.ea-form-item_wrap.is-required ::slotted(ea-date-picker) {\n  border-color: #f56c6c;\n}\n.ea-form-item_wrap ::slotted(ea-input),\n.ea-form-item_wrap ::slotted(ea-select),\n.ea-form-item_wrap ::slotted(ea-textarea),\n.ea-form-item_wrap ::slotted(ea-time-picker),\n.ea-form-item_wrap ::slotted(ea-date-picker) {\n  border: 1px solid transparent;\n  border-radius: 3px;\n}\n.ea-form-item_wrap.with-transition .ea-form-item_content-wrap .ea-form-item_invalid-wrap {\n  transition: transform 0.3s;\n}\n.ea-form-item_wrap.with-transition .ea-form-item_label-wrap {\n  transition: color 0.3s;\n}\n';

package/build/components/ea-header/index.js

@@ -0,0 +1 @@
+import Base from"../Base.js";import"../ea-icon/index.js";const stylesheet="\n.ea-header_wrap {\n  box-sizing: border-box;\n  padding: 0 20px;\n\n  height: 60px;\n\n  color: #333;\n\n  overflow: hidden;\n}\n";export class EaHeader extends Base{#e;constructor(){super();const e=this.attachShadow({mode:"open"});e.innerHTML='\n            <header class="ea-header_wrap" part="container">\n                <slot></slot>\n            </header>\n        ',this.#e=e.querySelector(".ea-header_wrap"),this.build(e,stylesheet)}get height(){return this.getAttrNumber("height")||60}set height(e){this.setAttribute("height",e),this.#e.style.height=`${e}px`,this.#e.style.lineHeight=`${e}px`}connectedCallback(){this.height=this.height}}customElements.get("ea-header")||customElements.define("ea-header",EaHeader);