You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
7.9 KiB
41 lines
7.9 KiB
import{u as D}from"./use-rtl-CRyak7TN.js";import{c as f,d as x,a as l,b as z,e as H,u as T,f as k,h as O,v as V}from"./light-Cua7cqmF.js";import{f as W}from"./fade-in-height-expand.cssr-Bx380MfO.js";import{u as q}from"./use-merged-state-CzrzZJbg.js";import{c as K}from"./light-BIogERFh.js";import{c as G}from"./context-KbjOeZY_.js";import{c as I}from"./call-f2ri57Kd.js";import{d as P,G as i,s as Z,c as N,P as J,O as F,y as Q,z as X,i as Y}from"./index-bVOhw2NF.js";import{u as ee}from"./use-false-until-truthy-BNJRTcsy.js";import{N as re}from"./Button-B7xQqa1N.js";import{c as te}from"./index-L98eAIry.js";import{u as ae}from"./use-memo-BgHp9YyU.js";import{h as $}from"./happens-in-CM8LO42l.js";import{b as A,c as oe}from"./resolve-slot-Dzko3qih.js";import{N as le}from"./Icon-Ck7Ij_E6.js";import{C as ie}from"./ChevronRight-DjG_plXV.js";const ne=P({name:"ChevronLeft",render(){return i("svg",{viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M10.3536 3.14645C10.5488 3.34171 10.5488 3.65829 10.3536 3.85355L6.20711 8L10.3536 12.1464C10.5488 12.3417 10.5488 12.6583 10.3536 12.8536C10.1583 13.0488 9.84171 13.0488 9.64645 12.8536L5.14645 8.35355C4.95118 8.15829 4.95118 7.84171 5.14645 7.64645L9.64645 3.14645C9.84171 2.95118 10.1583 2.95118 10.3536 3.14645Z",fill:"currentColor"}))}}),se=f("collapse","width: 100%;",[f("collapse-item",`
|
|
font-size: var(--n-font-size);
|
|
color: var(--n-text-color);
|
|
transition:
|
|
color .3s var(--n-bezier),
|
|
border-color .3s var(--n-bezier);
|
|
margin: var(--n-item-margin);
|
|
`,[x("disabled",[l("header","cursor: not-allowed;",[l("header-main",`
|
|
color: var(--n-title-text-color-disabled);
|
|
`),f("collapse-item-arrow",`
|
|
color: var(--n-arrow-color-disabled);
|
|
`)])]),f("collapse-item","margin-left: 32px;"),z("&:first-child","margin-top: 0;"),z("&:first-child >",[l("header","padding-top: 0;")]),x("left-arrow-placement",[l("header",[f("collapse-item-arrow","margin-right: 4px;")])]),x("right-arrow-placement",[l("header",[f("collapse-item-arrow","margin-left: 4px;")])]),l("content-wrapper",[l("content-inner","padding-top: 16px;"),W({duration:"0.15s"})]),x("active",[l("header",[x("active",[f("collapse-item-arrow","transform: rotate(90deg);")])])]),z("&:not(:first-child)","border-top: 1px solid var(--n-divider-color);"),H("disabled",[x("trigger-area-main",[l("header",[l("header-main","cursor: pointer;"),f("collapse-item-arrow","cursor: default;")])]),x("trigger-area-arrow",[l("header",[f("collapse-item-arrow","cursor: pointer;")])]),x("trigger-area-extra",[l("header",[l("header-extra","cursor: pointer;")])])]),l("header",`
|
|
font-size: var(--n-title-font-size);
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
transition: color .3s var(--n-bezier);
|
|
position: relative;
|
|
padding: var(--n-title-padding);
|
|
color: var(--n-title-text-color);
|
|
`,[l("header-main",`
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
font-weight: var(--n-title-font-weight);
|
|
transition: color .3s var(--n-bezier);
|
|
flex: 1;
|
|
color: var(--n-title-text-color);
|
|
`),l("header-extra",`
|
|
display: flex;
|
|
align-items: center;
|
|
transition: color .3s var(--n-bezier);
|
|
color: var(--n-text-color);
|
|
`),f("collapse-item-arrow",`
|
|
display: flex;
|
|
transition:
|
|
transform .15s var(--n-bezier),
|
|
color .3s var(--n-bezier);
|
|
font-size: 18px;
|
|
color: var(--n-arrow-color);
|
|
`)])])]),de=Object.assign(Object.assign({},k.props),{defaultExpandedNames:{type:[Array,String],default:null},expandedNames:[Array,String],arrowPlacement:{type:String,default:"left"},accordion:{type:Boolean,default:!1},displayDirective:{type:String,default:"if"},triggerAreas:{type:Array,default:()=>["main","extra","arrow"]},onItemHeaderClick:[Function,Array],"onUpdate:expandedNames":[Function,Array],onUpdateExpandedNames:[Function,Array],onExpandedNamesChange:{type:[Function,Array],validator:()=>!0,default:void 0}}),B=G("n-collapse"),Pe=P({name:"Collapse",props:de,setup(e,{slots:s}){const{mergedClsPrefixRef:n,inlineThemeDisabled:o,mergedRtlRef:d}=T(e),t=Z(e.defaultExpandedNames),h=N(()=>e.expandedNames),v=q(h,t),w=k("Collapse","-collapse",se,K,e,n);function c(p){const{"onUpdate:expandedNames":a,onUpdateExpandedNames:m,onExpandedNamesChange:b}=e;m&&I(m,p),a&&I(a,p),b&&I(b,p),t.value=p}function g(p){const{onItemHeaderClick:a}=e;a&&I(a,p)}function r(p,a,m){const{accordion:b}=e,{value:E}=v;if(b)p?(c([a]),g({name:a,expanded:!0,event:m})):(c([]),g({name:a,expanded:!1,event:m}));else if(!Array.isArray(E))c([a]),g({name:a,expanded:!0,event:m});else{const C=E.slice(),_=C.findIndex(S=>a===S);~_?(C.splice(_,1),c(C),g({name:a,expanded:!1,event:m})):(C.push(a),c(C),g({name:a,expanded:!0,event:m}))}}J(B,{props:e,mergedClsPrefixRef:n,expandedNamesRef:v,slots:s,toggleItem:r});const u=D("Collapse",d,n),R=N(()=>{const{common:{cubicBezierEaseInOut:p},self:{titleFontWeight:a,dividerColor:m,titlePadding:b,titleTextColor:E,titleTextColorDisabled:C,textColor:_,arrowColor:S,fontSize:L,titleFontSize:U,arrowColorDisabled:M,itemMargin:j}}=w.value;return{"--n-font-size":L,"--n-bezier":p,"--n-text-color":_,"--n-divider-color":m,"--n-title-padding":b,"--n-title-font-size":U,"--n-title-text-color":E,"--n-title-text-color-disabled":C,"--n-title-font-weight":a,"--n-arrow-color":S,"--n-arrow-color-disabled":M,"--n-item-margin":j}}),y=o?O("collapse",void 0,R,e):void 0;return{rtlEnabled:u,mergedTheme:w,mergedClsPrefix:n,cssVars:o?void 0:R,themeClass:y==null?void 0:y.themeClass,onRender:y==null?void 0:y.onRender}},render(){var e;return(e=this.onRender)===null||e===void 0||e.call(this),i("div",{class:[`${this.mergedClsPrefix}-collapse`,this.rtlEnabled&&`${this.mergedClsPrefix}-collapse--rtl`,this.themeClass],style:this.cssVars},this.$slots)}}),ce=P({name:"CollapseItemContent",props:{displayDirective:{type:String,required:!0},show:Boolean,clsPrefix:{type:String,required:!0}},setup(e){return{onceTrue:ee(F(e,"show"))}},render(){return i(re,null,{default:()=>{const{show:e,displayDirective:s,onceTrue:n,clsPrefix:o}=this,d=s==="show"&&n,t=i("div",{class:`${o}-collapse-item__content-wrapper`},i("div",{class:`${o}-collapse-item__content-inner`},this.$slots));return d?Q(t,[[X,e]]):e?t:null}})}}),pe={title:String,name:[String,Number],disabled:Boolean,displayDirective:String},Se=P({name:"CollapseItem",props:pe,setup(e){const{mergedRtlRef:s}=T(e),n=te(),o=ae(()=>{var r;return(r=e.name)!==null&&r!==void 0?r:n}),d=Y(B);d||V("collapse-item","`n-collapse-item` must be placed inside `n-collapse`.");const{expandedNamesRef:t,props:h,mergedClsPrefixRef:v,slots:w}=d,c=N(()=>{const{value:r}=t;if(Array.isArray(r)){const{value:u}=o;return!~r.findIndex(R=>R===u)}else if(r){const{value:u}=o;return u!==r}return!0});return{rtlEnabled:D("Collapse",s,v),collapseSlots:w,randomName:n,mergedClsPrefix:v,collapsed:c,triggerAreas:F(h,"triggerAreas"),mergedDisplayDirective:N(()=>{const{displayDirective:r}=e;return r||h.displayDirective}),arrowPlacement:N(()=>h.arrowPlacement),handleClick(r){let u="main";$(r,"arrow")&&(u="arrow"),$(r,"extra")&&(u="extra"),h.triggerAreas.includes(u)&&d&&!e.disabled&&d.toggleItem(c.value,o.value,r)}}},render(){const{collapseSlots:e,$slots:s,arrowPlacement:n,collapsed:o,mergedDisplayDirective:d,mergedClsPrefix:t,disabled:h,triggerAreas:v}=this,w=A(s.header,{collapsed:o},()=>[this.title]),c=s["header-extra"]||e["header-extra"],g=s.arrow||e.arrow;return i("div",{class:[`${t}-collapse-item`,`${t}-collapse-item--${n}-arrow-placement`,h&&`${t}-collapse-item--disabled`,!o&&`${t}-collapse-item--active`,v.map(r=>`${t}-collapse-item--trigger-area-${r}`)]},i("div",{class:[`${t}-collapse-item__header`,!o&&`${t}-collapse-item__header--active`]},i("div",{class:`${t}-collapse-item__header-main`,onClick:this.handleClick},n==="right"&&w,i("div",{class:`${t}-collapse-item-arrow`,key:this.rtlEnabled?0:1,"data-arrow":!0},A(g,{collapsed:o},()=>{var r;return[i(le,{clsPrefix:t},{default:(r=e.expandIcon)!==null&&r!==void 0?r:()=>this.rtlEnabled?i(ne,null):i(ie,null)})]})),n==="left"&&w),oe(c,{collapsed:o},r=>i("div",{class:`${t}-collapse-item__header-extra`,onClick:this.handleClick,"data-extra":!0},r))),i(ce,{clsPrefix:t,displayDirective:d,show:!o},s))}});export{Se as _,Pe as a};
|