generated from VLADIMIR/template_frontend
109 lines
15 KiB
JavaScript
109 lines
15 KiB
JavaScript
import{A as e,E as t,H as n,I as r,N as i,k as a,ot as o,rt as s,v as c}from"./vue-router-CyfP71JJ.js";import{B as l,G as u,I as d,J as f,K as p,M as m,N as h,V as g,X as _,Y as v,Z as y,a as b,i as x,o as S,r as C,z as w}from"./light-CPiNeYrP.js";import{n as T,t as E}from"./call-ChHlm4-m.js";import{a as D,n as O}from"./resolve-slot-A17u0Glq.js";import{A as k,K as A,M as j,O as M,R as N,d as P,v as F}from"./index-CqdSAiqM.js";var I=typeof document<`u`&&typeof window<`u`,L=w(`n-form-item`);function R(t,{defaultSize:i=`medium`,mergedSize:a,mergedDisabled:o}={}){let s=e(L,null);n(L,null);let l=c(a?()=>a(s):()=>{let{size:e}=t;if(e)return e;if(s){let{mergedSize:e}=s;if(e.value!==void 0)return e.value}return i}),u=c(o?()=>o(s):()=>{let{disabled:e}=t;return e===void 0?s?s.disabled.value:!1:e}),d=c(()=>{let{status:e}=t;return e||s?.mergedValidationStatus.value});return r(()=>{s&&s.restoreValidation()}),{mergedSizeRef:l,mergedDisabledRef:u,mergedStatusRef:d,nTriggerFormBlur(){s&&s.handleContentBlur()},nTriggerFormChange(){s&&s.handleContentChange()},nTriggerFormFocus(){s&&s.handleContentFocus()},nTriggerFormInput(){s&&s.handleContentInput()}}}var{cubicBezierEaseInOut:z}=b;function B({duration:e=`.2s`,delay:t=`.1s`}={}){return[u(`&.fade-in-width-expand-transition-leave-from, &.fade-in-width-expand-transition-enter-to`,{opacity:1}),u(`&.fade-in-width-expand-transition-leave-to, &.fade-in-width-expand-transition-enter-from`,`
|
|
opacity: 0!important;
|
|
margin-left: 0!important;
|
|
margin-right: 0!important;
|
|
`),u(`&.fade-in-width-expand-transition-leave-active`,`
|
|
overflow: hidden;
|
|
transition:
|
|
opacity ${e} ${z},
|
|
max-width ${e} ${z} ${t},
|
|
margin-left ${e} ${z} ${t},
|
|
margin-right ${e} ${z} ${t};
|
|
`),u(`&.fade-in-width-expand-transition-enter-active`,`
|
|
overflow: hidden;
|
|
transition:
|
|
opacity ${e} ${z} ${t},
|
|
max-width ${e} ${z},
|
|
margin-left ${e} ${z},
|
|
margin-right ${e} ${z};
|
|
`)]}var V=p(`base-wave`,`
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
border-radius: inherit;
|
|
`),H=t({name:`BaseWave`,props:{clsPrefix:{type:String,required:!0}},setup(e){x(`-base-wave`,V,o(e,`clsPrefix`));let t=s(null),n=s(!1),a=null;return r(()=>{a!==null&&window.clearTimeout(a)}),{active:n,selfRef:t,play(){a!==null&&(window.clearTimeout(a),n.value=!1,a=null),i(()=>{var e;(e=t.value)==null||e.offsetHeight,n.value=!0,a=window.setTimeout(()=>{n.value=!1,a=null},1e3)})}}},render(){let{clsPrefix:e}=this;return a(`div`,{ref:`selfRef`,"aria-hidden":!0,class:[`${e}-base-wave`,this.active&&`${e}-base-wave--active`]})}}),U=I&&`chrome`in window;I&&navigator.userAgent.includes(`Firefox`);var W=I&&navigator.userAgent.includes(`Safari`)&&!U;function G(e){return g(e,[255,255,255,.16])}function K(e){return g(e,[0,0,0,.12])}var q=w(`n-button-group`),J=u([p(`button`,`
|
|
margin: 0;
|
|
font-weight: var(--n-font-weight);
|
|
line-height: 1;
|
|
font-family: inherit;
|
|
padding: var(--n-padding);
|
|
height: var(--n-height);
|
|
font-size: var(--n-font-size);
|
|
border-radius: var(--n-border-radius);
|
|
color: var(--n-text-color);
|
|
background-color: var(--n-color);
|
|
width: var(--n-width);
|
|
white-space: nowrap;
|
|
outline: none;
|
|
position: relative;
|
|
z-index: auto;
|
|
border: none;
|
|
display: inline-flex;
|
|
flex-wrap: nowrap;
|
|
flex-shrink: 0;
|
|
align-items: center;
|
|
justify-content: center;
|
|
user-select: none;
|
|
-webkit-user-select: none;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
transition:
|
|
color .3s var(--n-bezier),
|
|
background-color .3s var(--n-bezier),
|
|
opacity .3s var(--n-bezier),
|
|
border-color .3s var(--n-bezier);
|
|
`,[v(`color`,[f(`border`,{borderColor:`var(--n-border-color)`}),v(`disabled`,[f(`border`,{borderColor:`var(--n-border-color-disabled)`})]),_(`disabled`,[u(`&:focus`,[f(`state-border`,{borderColor:`var(--n-border-color-focus)`})]),u(`&:hover`,[f(`state-border`,{borderColor:`var(--n-border-color-hover)`})]),u(`&:active`,[f(`state-border`,{borderColor:`var(--n-border-color-pressed)`})]),v(`pressed`,[f(`state-border`,{borderColor:`var(--n-border-color-pressed)`})])])]),v(`disabled`,{backgroundColor:`var(--n-color-disabled)`,color:`var(--n-text-color-disabled)`},[f(`border`,{border:`var(--n-border-disabled)`})]),_(`disabled`,[u(`&:focus`,{backgroundColor:`var(--n-color-focus)`,color:`var(--n-text-color-focus)`},[f(`state-border`,{border:`var(--n-border-focus)`})]),u(`&:hover`,{backgroundColor:`var(--n-color-hover)`,color:`var(--n-text-color-hover)`},[f(`state-border`,{border:`var(--n-border-hover)`})]),u(`&:active`,{backgroundColor:`var(--n-color-pressed)`,color:`var(--n-text-color-pressed)`},[f(`state-border`,{border:`var(--n-border-pressed)`})]),v(`pressed`,{backgroundColor:`var(--n-color-pressed)`,color:`var(--n-text-color-pressed)`},[f(`state-border`,{border:`var(--n-border-pressed)`})])]),v(`loading`,`cursor: wait;`),p(`base-wave`,`
|
|
pointer-events: none;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
animation-iteration-count: 1;
|
|
animation-duration: var(--n-ripple-duration);
|
|
animation-timing-function: var(--n-bezier-ease-out), var(--n-bezier-ease-out);
|
|
`,[v(`active`,{zIndex:1,animationName:`button-wave-spread, button-wave-opacity`})]),I&&`MozBoxSizing`in document.createElement(`div`).style?u(`&::moz-focus-inner`,{border:0}):null,f(`border, state-border`,`
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
border-radius: inherit;
|
|
transition: border-color .3s var(--n-bezier);
|
|
pointer-events: none;
|
|
`),f(`border`,`
|
|
border: var(--n-border);
|
|
`),f(`state-border`,`
|
|
border: var(--n-border);
|
|
border-color: #0000;
|
|
z-index: 1;
|
|
`),f(`icon`,`
|
|
margin: var(--n-icon-margin);
|
|
margin-left: 0;
|
|
height: var(--n-icon-size);
|
|
width: var(--n-icon-size);
|
|
max-width: var(--n-icon-size);
|
|
font-size: var(--n-icon-size);
|
|
position: relative;
|
|
flex-shrink: 0;
|
|
`,[p(`icon-slot`,`
|
|
height: var(--n-icon-size);
|
|
width: var(--n-icon-size);
|
|
position: absolute;
|
|
left: 0;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
`,[j({top:`50%`,originalTransform:`translateY(-50%)`})]),B()]),f(`content`,`
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: nowrap;
|
|
min-width: 0;
|
|
`,[u(`~`,[f(`icon`,{margin:`var(--n-icon-margin)`,marginRight:0})])]),v(`block`,`
|
|
display: flex;
|
|
width: 100%;
|
|
`),v(`dashed`,[f(`border, state-border`,{borderStyle:`dashed !important`})]),v(`disabled`,{cursor:`not-allowed`,opacity:`var(--n-opacity-disabled)`})]),u(`@keyframes button-wave-spread`,{from:{boxShadow:`0 0 0.5px 0 var(--n-ripple-color)`},to:{boxShadow:`0 0 0.5px 4.5px var(--n-ripple-color)`}}),u(`@keyframes button-wave-opacity`,{from:{opacity:`var(--n-wave-opacity)`},to:{opacity:0}})]),Y=t({name:`Button`,props:Object.assign(Object.assign({},C.props),{color:String,textColor:String,text:Boolean,block:Boolean,loading:Boolean,disabled:Boolean,circle:Boolean,size:String,ghost:Boolean,round:Boolean,secondary:Boolean,tertiary:Boolean,quaternary:Boolean,strong:Boolean,focusable:{type:Boolean,default:!0},keyboard:{type:Boolean,default:!0},tag:{type:String,default:`button`},type:{type:String,default:`default`},dashed:Boolean,renderIcon:Function,iconPlacement:{type:String,default:`left`},attrType:{type:String,default:`button`},bordered:{type:Boolean,default:!0},onClick:[Function,Array],nativeFocusBehavior:{type:Boolean,default:!W},spinProps:Object}),slots:Object,setup(t){let n=s(null),r=s(null),i=s(!1),a=A(()=>!t.quaternary&&!t.tertiary&&!t.secondary&&!t.text&&(!t.color||t.ghost||t.dashed)&&t.bordered),o=e(q,{}),{inlineThemeDisabled:u,mergedClsPrefixRef:d,mergedRtlRef:f,mergedComponentPropsRef:p}=h(t),{mergedSizeRef:g}=R({},{defaultSize:`medium`,mergedSize:e=>{let{size:n}=t;if(n)return n;let{size:r}=o;if(r)return r;let{mergedSize:i}=e||{};return i?i.value:p?.value?.Button?.size||`medium`}}),_=c(()=>t.focusable&&!t.disabled),v=e=>{var r;_.value||e.preventDefault(),!t.nativeFocusBehavior&&(e.preventDefault(),!t.disabled&&_.value&&((r=n.value)==null||r.focus({preventScroll:!0})))},b=e=>{var n;if(!t.disabled&&!t.loading){let{onClick:i}=t;i&&E(i,e),t.text||(n=r.value)==null||n.play()}},x=e=>{switch(e.key){case`Enter`:if(!t.keyboard)return;i.value=!1}},w=e=>{switch(e.key){case`Enter`:if(!t.keyboard||t.loading){e.preventDefault();return}i.value=!0}},D=()=>{i.value=!1},O=C(`Button`,`-button`,J,F,t,d),k=S(`Button`,f,d),j=c(()=>{let{common:{cubicBezierEaseInOut:e,cubicBezierEaseOut:n},self:r}=O.value,{rippleDuration:i,opacityDisabled:a,fontWeight:o,fontWeightStrong:s}=r,c=g.value,{dashed:u,type:d,ghost:f,text:p,color:m,round:h,circle:_,textColor:v,secondary:b,tertiary:x,quaternary:S,strong:C}=t,w={"--n-font-weight":C?s:o},T={"--n-color":`initial`,"--n-color-hover":`initial`,"--n-color-pressed":`initial`,"--n-color-focus":`initial`,"--n-color-disabled":`initial`,"--n-ripple-color":`initial`,"--n-text-color":`initial`,"--n-text-color-hover":`initial`,"--n-text-color-pressed":`initial`,"--n-text-color-focus":`initial`,"--n-text-color-disabled":`initial`},E=d===`tertiary`,D=d==="default",k=E?`default`:d;if(p){let e=v||m;T={"--n-color":`#0000`,"--n-color-hover":`#0000`,"--n-color-pressed":`#0000`,"--n-color-focus":`#0000`,"--n-color-disabled":`#0000`,"--n-ripple-color":`#0000`,"--n-text-color":e||r[y(`textColorText`,k)],"--n-text-color-hover":e?G(e):r[y(`textColorTextHover`,k)],"--n-text-color-pressed":e?K(e):r[y(`textColorTextPressed`,k)],"--n-text-color-focus":e?G(e):r[y(`textColorTextHover`,k)],"--n-text-color-disabled":e||r[y(`textColorTextDisabled`,k)]}}else if(f||u){let e=v||m;T={"--n-color":`#0000`,"--n-color-hover":`#0000`,"--n-color-pressed":`#0000`,"--n-color-focus":`#0000`,"--n-color-disabled":`#0000`,"--n-ripple-color":m||r[y(`rippleColor`,k)],"--n-text-color":e||r[y(`textColorGhost`,k)],"--n-text-color-hover":e?G(e):r[y(`textColorGhostHover`,k)],"--n-text-color-pressed":e?K(e):r[y(`textColorGhostPressed`,k)],"--n-text-color-focus":e?G(e):r[y(`textColorGhostHover`,k)],"--n-text-color-disabled":e||r[y(`textColorGhostDisabled`,k)]}}else if(b){let e=D?r.textColor:E?r.textColorTertiary:r[y(`color`,k)],t=m||e,n=d!=="default"&&d!==`tertiary`;T={"--n-color":n?l(t,{alpha:Number(r.colorOpacitySecondary)}):r.colorSecondary,"--n-color-hover":n?l(t,{alpha:Number(r.colorOpacitySecondaryHover)}):r.colorSecondaryHover,"--n-color-pressed":n?l(t,{alpha:Number(r.colorOpacitySecondaryPressed)}):r.colorSecondaryPressed,"--n-color-focus":n?l(t,{alpha:Number(r.colorOpacitySecondaryHover)}):r.colorSecondaryHover,"--n-color-disabled":r.colorSecondary,"--n-ripple-color":`#0000`,"--n-text-color":t,"--n-text-color-hover":t,"--n-text-color-pressed":t,"--n-text-color-focus":t,"--n-text-color-disabled":t}}else if(x||S){let e=D?r.textColor:E?r.textColorTertiary:r[y(`color`,k)],t=m||e;x?(T[`--n-color`]=r.colorTertiary,T[`--n-color-hover`]=r.colorTertiaryHover,T[`--n-color-pressed`]=r.colorTertiaryPressed,T[`--n-color-focus`]=r.colorSecondaryHover,T[`--n-color-disabled`]=r.colorTertiary):(T[`--n-color`]=r.colorQuaternary,T[`--n-color-hover`]=r.colorQuaternaryHover,T[`--n-color-pressed`]=r.colorQuaternaryPressed,T[`--n-color-focus`]=r.colorQuaternaryHover,T[`--n-color-disabled`]=r.colorQuaternary),T[`--n-ripple-color`]=`#0000`,T[`--n-text-color`]=t,T[`--n-text-color-hover`]=t,T[`--n-text-color-pressed`]=t,T[`--n-text-color-focus`]=t,T[`--n-text-color-disabled`]=t}else T={"--n-color":m||r[y(`color`,k)],"--n-color-hover":m?G(m):r[y(`colorHover`,k)],"--n-color-pressed":m?K(m):r[y(`colorPressed`,k)],"--n-color-focus":m?G(m):r[y(`colorFocus`,k)],"--n-color-disabled":m||r[y(`colorDisabled`,k)],"--n-ripple-color":m||r[y(`rippleColor`,k)],"--n-text-color":v||(m?r.textColorPrimary:E?r.textColorTertiary:r[y(`textColor`,k)]),"--n-text-color-hover":v||(m?r.textColorHoverPrimary:r[y(`textColorHover`,k)]),"--n-text-color-pressed":v||(m?r.textColorPressedPrimary:r[y(`textColorPressed`,k)]),"--n-text-color-focus":v||(m?r.textColorFocusPrimary:r[y(`textColorFocus`,k)]),"--n-text-color-disabled":v||(m?r.textColorDisabledPrimary:r[y(`textColorDisabled`,k)])};let A={"--n-border":`initial`,"--n-border-hover":`initial`,"--n-border-pressed":`initial`,"--n-border-focus":`initial`,"--n-border-disabled":`initial`};A=p?{"--n-border":`none`,"--n-border-hover":`none`,"--n-border-pressed":`none`,"--n-border-focus":`none`,"--n-border-disabled":`none`}:{"--n-border":r[y(`border`,k)],"--n-border-hover":r[y(`borderHover`,k)],"--n-border-pressed":r[y(`borderPressed`,k)],"--n-border-focus":r[y(`borderFocus`,k)],"--n-border-disabled":r[y(`borderDisabled`,k)]};let{[y(`height`,c)]:j,[y(`fontSize`,c)]:M,[y(`padding`,c)]:N,[y(`paddingRound`,c)]:P,[y(`iconSize`,c)]:F,[y(`borderRadius`,c)]:I,[y(`iconMargin`,c)]:L,waveOpacity:R}=r,z={"--n-width":_&&!p?j:`initial`,"--n-height":p?`initial`:j,"--n-font-size":M,"--n-padding":_||p?`initial`:h?P:N,"--n-icon-size":F,"--n-icon-margin":L,"--n-border-radius":p?`initial`:_||h?j:I};return Object.assign(Object.assign(Object.assign(Object.assign({"--n-bezier":e,"--n-bezier-ease-out":n,"--n-ripple-duration":i,"--n-opacity-disabled":a,"--n-wave-opacity":R},w),T),A),z)}),M=u?m(`button`,c(()=>{let e=``,{dashed:n,type:r,ghost:i,text:a,color:o,round:s,circle:c,textColor:l,secondary:u,tertiary:d,quaternary:f,strong:p}=t;n&&(e+=`a`),i&&(e+=`b`),a&&(e+=`c`),s&&(e+=`d`),c&&(e+=`e`),u&&(e+=`f`),d&&(e+=`g`),f&&(e+=`h`),p&&(e+=`i`),o&&(e+=`j${T(o)}`),l&&(e+=`k${T(l)}`);let{value:m}=g;return e+=`l${m[0]}`,e+=`m${r[0]}`,e}),j,t):void 0;return{selfElRef:n,waveElRef:r,mergedClsPrefix:d,mergedFocusable:_,mergedSize:g,showBorder:a,enterPressed:i,rtlEnabled:k,handleMousedown:v,handleKeydown:w,handleBlur:D,handleKeyup:x,handleClick:b,customColorCssVars:c(()=>{let{color:e}=t;if(!e)return null;let n=G(e);return{"--n-border-color":e,"--n-border-color-hover":n,"--n-border-color-pressed":K(e),"--n-border-color-focus":n,"--n-border-color-disabled":e}}),cssVars:u?void 0:j,themeClass:M?.themeClass,onRender:M?.onRender}},render(){let{mergedClsPrefix:e,tag:t,onRender:n}=this;n?.();let r=D(this.$slots.default,t=>t&&a(`span`,{class:`${e}-button__content`},t));return a(t,{ref:`selfElRef`,class:[this.themeClass,`${e}-button`,`${e}-button--${this.type}-type`,`${e}-button--${this.mergedSize}-type`,this.rtlEnabled&&`${e}-button--rtl`,this.disabled&&`${e}-button--disabled`,this.block&&`${e}-button--block`,this.enterPressed&&`${e}-button--pressed`,!this.text&&this.dashed&&`${e}-button--dashed`,this.color&&`${e}-button--color`,this.secondary&&`${e}-button--secondary`,this.loading&&`${e}-button--loading`,this.ghost&&`${e}-button--ghost`],tabindex:this.mergedFocusable?0:-1,type:this.attrType,style:this.cssVars,disabled:this.disabled,onClick:this.handleClick,onBlur:this.handleBlur,onMousedown:this.handleMousedown,onKeyup:this.handleKeyup,onKeydown:this.handleKeydown},this.iconPlacement===`right`&&r,a(k,{width:!0},{default:()=>D(this.$slots.icon,t=>(this.loading||this.renderIcon||t)&&a(`span`,{class:`${e}-button__icon`,style:{margin:O(this.$slots.default)?`0`:``}},a(N,null,{default:()=>this.loading?a(M,Object.assign({clsPrefix:e,key:`loading`,class:`${e}-icon-slot`,strokeWidth:20},this.spinProps)):a(`div`,{key:`icon`,class:`${e}-icon-slot`,role:`none`},this.renderIcon?this.renderIcon():t)})))}),this.iconPlacement===`left`&&r,this.text?null:a(H,{ref:`waveElRef`,clsPrefix:e}),this.showBorder?a(`div`,{"aria-hidden":!0,class:`${e}-button__border`,style:this.customColorCssVars}):null,this.showBorder?a(`div`,{"aria-hidden":!0,class:`${e}-button__state-border`,style:this.customColorCssVars}):null)}}),X=Y;function Z(){let t=e(P,null);return t===null&&d(`use-message`,"No outer <n-message-provider /> founded. See prerequisite in https://www.naiveui.com/en-US/os-theme/components/message for more details. If you want to use `useMessage` outside setup, please check https://www.naiveui.com/zh-CN/os-theme/components/message#Q-&-A."),t}export{W as a,I as c,q as i,Y as n,L as o,X as r,R as s,Z as t}; |