@digitalwalletcorp/vue-core 1.3.1 → 1.4.1

package/lib/warning-popper.vue_vue_type_style_index_0_lang-TYmLM_h9.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),S=require("@digitalwalletcorp/vue-svg-icons"),M=e.defineComponent({__name:"label-icon",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(l){const o=l,t=e.useSlots();return(n,a)=>(e.openBlock(),e.createElementBlock("span",{class:"dwui-label-icon",style:e.normalizeStyle(o.gap==null?void 0:{"--dwui-gap-label-icon":o.gap})},[e.renderSlot(n.$slots,"icon",{},()=>[o.preset!=null?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.preset.icon),e.mergeProps({key:0},o.preset.iconProps,{class:o.iconClass,style:o.iconStyle}),null,16,["class","style"])):e.createCommentVNode("",!0)]),t.default!=null||o.preset!=null?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["dwui-label",o.labelClass]),style:e.normalizeStyle(o.labelStyle)},[e.renderSlot(n.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(typeof o.preset?.label=="function"?o.preset.label():o.preset?.label),1)])],6)):e.createCommentVNode("",!0)],4))}}),Ce=70;function ee(l){const o=e.ref(!0);let t;return e.onMounted(()=>{const n=l.value;n!=null&&(t=new ResizeObserver(()=>{o.value=Ce<=n.scrollHeight}),t.observe(n))}),e.onBeforeUnmount(()=>{t?.disconnect()}),o}const _e=["disabled"],Se={class:"dwui-accordion-legend"},Ee=["aria-expanded"],$e=e.defineComponent({__name:"accordion-fieldset",props:e.mergeModels({legend:{},disabled:{type:Boolean},initialExpand:{type:Boolean}},{expanded:{type:Boolean,default:void 0},expandedModifiers:{}}),emits:["update:expanded"],setup(l){const o=l,t=e.useSlots(),n=e.ref(),a=e.useModel(l,"expanded"),r=e.ref(!!o.initialExpand),s=e.computed({get:()=>a.value??r.value,set:u=>{r.value=u,a.value=u}}),p=ee(n),d=()=>{s.value=!s.value};return(u,g)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"dwui-accordion-fieldset",disabled:o.disabled},[e.createElementVNode("legend",Se,[e.createElementVNode("button",{type:"button",class:"dwui-accordion-toggle","aria-expanded":s.value,onClick:d},[e.createVNode(e.unref(S.SvgTriangleButton),{direction:s.value?"up":"down"},null,8,["direction"]),o.legend!=null||t.legend!=null||t.icon!=null?(e.openBlock(),e.createBlock(M,{key:0},e.createSlots({_:2},[t.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(u.$slots,"icon")]),key:"0"}:void 0,o.legend!=null||t.legend!=null?{name:"default",fn:e.withCtx(()=>[e.renderSlot(u.$slots,"legend",{},()=>[e.createTextVNode(e.toDisplayString(o.legend),1)])]),key:"1"}:void 0]),1024)):e.createCommentVNode("",!0)],8,Ee)]),e.createElementVNode("div",{ref_key:"refContents",ref:n,class:e.normalizeClass(["dwui-accordion-contents",e.unref(p)?s.value?"dwui-expanded":"dwui-shrunk":""])},[e.renderSlot(u.$slots,"default")],2)],8,_e))}}),xe={class:"dwui-accordion-section"},Ne={key:0,class:"dwui-accordion-section-control"},Pe=["disabled","aria-expanded"],Ve=e.defineComponent({__name:"accordion-section",props:e.mergeModels({disabled:{type:Boolean},initialExpand:{type:Boolean},noGradient:{type:Boolean},expandLabel:{},collapseLabel:{},expandPreset:{},collapsePreset:{}},{expanded:{type:Boolean,default:void 0},expandedModifiers:{}}),emits:["update:expanded"],setup(l){const o=l,t=e.useSlots(),n=e.ref(),a=e.useModel(l,"expanded"),r=e.ref(!!o.initialExpand),s=e.computed({get:()=>a.value??r.value,set:k=>{r.value=k,a.value=k}}),p=ee(n),d=e.computed(()=>s.value?o.collapsePreset:o.expandPreset),u=()=>(s.value?t["collapse-icon"]:t["expand-icon"])??d.value?.icon,g=()=>(s.value?t["collapse-icon"]:t["expand-icon"])==null?d.value?.iconProps:void 0,v=e.computed(()=>{const k=s.value?o.collapseLabel:o.expandLabel;if(k!=null)return k;const C=d.value?.label;return typeof C=="function"?C():C}),m=()=>{s.value=!s.value};return(k,C)=>(e.openBlock(),e.createElementBlock("div",xe,[e.createElementVNode("div",{ref_key:"refContents",ref:n,class:e.normalizeClass(["dwui-accordion-section-contents",[e.unref(p)?s.value?"dwui-expanded":"dwui-shrunk":"",{"dwui-no-gradient":o.noGradient}]])},[e.renderSlot(k.$slots,"default")],2),e.unref(p)?(e.openBlock(),e.createElementBlock("div",Ne,[e.createElementVNode("button",{type:"button",class:"dwui-accordion-section-toggle",disabled:o.disabled,"aria-expanded":s.value,onClick:e.withModifiers(m,["stop"])},[u()!=null||v.value!=null?(e.openBlock(),e.createBlock(M,{key:0},e.createSlots({_:2},[u()!=null?{name:"icon",fn:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(u()),e.normalizeProps(e.guardReactiveProps(g())),null,16))]),key:"0"}:void 0,v.value!=null?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(v.value),1)]),key:"1"}:void 0]),1024)):(e.openBlock(),e.createBlock(e.unref(S.SvgTriangleButton),{key:1,direction:s.value?"up":"down"},null,8,["direction"]))],8,Pe)])):e.createCommentVNode("",!0)]))}}),Le=["aria-label"],Me=e.defineComponent({__name:"copy-button",props:{value:{},label:{default:"Copy"}},emits:["emit:copy","emit:error"],setup(l,{emit:o}){const t=l,n=o,a=e.useSlots(),r=async()=>{const s=String(typeof t.value=="function"?t.value():t.value);try{await navigator.clipboard.writeText(s)}catch(p){n("emit:error",p);return}n("emit:copy",s)};return(s,p)=>(e.openBlock(),e.createElementBlock("button",{type:"button",class:"dwui-copy-button","aria-label":a.default?void 0:t.label,onClick:r},[e.renderSlot(s.$slots,"default",{},()=>[e.createVNode(e.unref(S.SvgMemo))])],8,Le))}}),Te=["aria-label","aria-checked"],De={class:"dwui-dark-mode-selector-track"},ze={class:"dwui-dark-mode-selector-icon-light"},Ae={class:"dwui-dark-mode-selector-icon-dark"},Oe=e.defineComponent({__name:"dark-mode-selector",props:{storageKey:{default:"dwui-color-scheme"},label:{default:"Dark mode"}},emits:["emit:change"],setup(l,{emit:o}){const t=l,n=o,a=e.ref(!1);let r=null,s=null;const p=y=>y==="light"||y==="dark",d=()=>s?.matches?"dark":"light",u=()=>{try{const y=localStorage.getItem(t.storageKey);return p(y)?y:null}catch{return null}},g=y=>{const c=document.documentElement.classList;c.remove(y==="dark"?"light":"dark"),c.add(y),a.value=y==="dark",r!==y&&(r=y,n("emit:change",y))},v=y=>{try{localStorage.setItem(t.storageKey,y)}catch{}g(y)},m=()=>{v(a.value?"light":"dark")},k=y=>{v(y.matches?"dark":"light")},C=y=>{y.key===t.storageKey&&g(p(y.newValue)?y.newValue:d())};return e.onMounted(()=>{s=window.matchMedia("(prefers-color-scheme: dark)"),g(u()??d()),s.addEventListener("change",k),window.addEventListener("storage",C)}),e.onBeforeUnmount(()=>{s?.removeEventListener("change",k),window.removeEventListener("storage",C)}),(y,c)=>(e.openBlock(),e.createElementBlock("button",{type:"button",role:"switch",class:"dwui-dark-mode-selector","aria-label":t.label,"aria-checked":a.value,onClick:m},[e.createElementVNode("span",De,[e.createElementVNode("span",ze,[e.renderSlot(y.$slots,"icon-light",{},()=>[e.createVNode(e.unref(S.SvgHighBrightness))])]),e.createElementVNode("span",Ae,[e.renderSlot(y.$slots,"icon-dark",{},()=>[e.createVNode(e.unref(S.SvgMoonPhases),{"moon-age":3.85})])])]),c[0]||(c[0]=e.createElementVNode("span",{class:"dwui-dark-mode-selector-handle"},null,-1))],8,Te))}}),Ie={class:"dwui-pagination"},He={class:"dwui-pagination-list"},Re=["disabled","aria-label","title"],We=["disabled","aria-label","title"],je=["disabled","aria-label","title"],Fe=["aria-current","onClick"],Ke=["disabled","aria-label","title"],Ue=["disabled","aria-label","title"],Ge=["disabled","aria-label","title"],Xe={key:0,class:"dwui-pagination-select"},Ye=["value","disabled"],qe=["value"],Qe=e.defineComponent({__name:"pagination",props:{current:{},totalCount:{},limit:{},maxPagination:{},showPageSelect:{type:Boolean},labels:{}},emits:["emit:changePage"],setup(l,{emit:o}){const t=l,n=o,a=e.computed(()=>Math.ceil(t.totalCount/t.limit)),r=e.computed(()=>Math.min(Math.max(t.current,1),a.value)),s=e.ref(!1),p=e.computed(()=>a.value<1?[]:s.value?Array.from({length:a.value},(c,B)=>B+1):[r.value]),d=e.computed(()=>{if(a.value<1)return[];const c=Math.min(Math.max(r.value-Math.floor((t.maxPagination-1)/2),1),Math.max(a.value-t.maxPagination+1,1)),B=Math.min(c+t.maxPagination-1,a.value);return Array.from({length:B-c+1},(h,$)=>c+$)}),u=c=>{c!==t.current&&n("emit:changePage",c)},g=c=>{let B;c<0?B=Math.max(d.value[0]-t.maxPagination,1):B=Math.min(d.value[d.value.length-1]+t.maxPagination,a.value)-t.maxPagination+1,u(B+Math.round((t.maxPagination-1)/2))},v=c=>{u(Number(c.target.value))},m=()=>{s.value=!0},k=c=>{document.activeElement!==c.currentTarget&&(s.value=!1)},C=()=>{s.value=!0},y=()=>{s.value=!1};return(c,B)=>(e.openBlock(),e.createElementBlock("div",Ie,[e.createElementVNode("ul",He,[e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:r.value<=1,"aria-label":t.labels.firstPage,title:t.labels.firstPage,onClick:B[0]||(B[0]=h=>u(1))},[e.createVNode(e.unref(S.SvgChevronDouble),{direction:"left",size:"1em","stroke-width":8})],8,Re)]),e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:r.value<=1,"aria-label":t.labels.previousPage,title:t.labels.previousPage,onClick:B[1]||(B[1]=h=>u(r.value-1))},[e.createVNode(e.unref(S.SvgChevron),{direction:"left",size:"1em","stroke-width":8})],8,We)]),e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:d.value.length===0||d.value[0]===1,"aria-label":t.labels.previousPages,title:t.labels.previousPages,onClick:B[2]||(B[2]=h=>g(-1))},[e.createVNode(e.unref(S.SvgBlackArrow),{direction:"left",size:"1em"})],8,je)]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,h=>(e.openBlock(),e.createElementBlock("li",{key:h},[e.createElementVNode("button",{type:"button",class:e.normalizeClass(["dwui-pagination-page",{"dwui-current":h===r.value}]),"aria-current":h===r.value?"page":void 0,onClick:$=>u(h)},e.toDisplayString(h),11,Fe)]))),128)),e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:d.value.length===0||d.value[d.value.length-1]===a.value,"aria-label":t.labels.nextPages,title:t.labels.nextPages,onClick:B[3]||(B[3]=h=>g(1))},[e.createVNode(e.unref(S.SvgBlackArrow),{direction:"right",size:"1em"})],8,Ke)]),e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:a.value<=r.value,"aria-label":t.labels.nextPage,title:t.labels.nextPage,onClick:B[4]||(B[4]=h=>u(r.value+1))},[e.createVNode(e.unref(S.SvgChevron),{direction:"right",size:"1em","stroke-width":8})],8,Ue)]),e.createElementVNode("li",null,[e.createElementVNode("button",{type:"button",disabled:a.value<=r.value,"aria-label":t.labels.lastPage,title:t.labels.lastPage,onClick:B[5]||(B[5]=h=>u(a.value))},[e.createVNode(e.unref(S.SvgChevronDouble),{direction:"right",size:"1em","stroke-width":8})],8,Ge)])]),t.showPageSelect?(e.openBlock(),e.createElementBlock("label",Xe,[e.createElementVNode("span",null,e.toDisplayString(t.labels.pageNumber),1),e.createElementVNode("select",{value:r.value,disabled:a.value<=1,onPointerenter:m,onPointerleave:k,onFocus:C,onBlur:y,onChange:v},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,h=>(e.openBlock(),e.createElementBlock("option",{key:h,value:h},e.toDisplayString(h)+" ("+e.toDisplayString((h-1)*t.limit+1)+" - "+e.toDisplayString(Math.min(h*t.limit,t.totalCount))+") ",9,qe))),128))],40,Ye)])):e.createCommentVNode("",!0)]))}}),Je={class:"dwui-data-table-controls"},Ze={class:"dwui-data-table-tools"},et={key:0,class:"dwui-data-table-total"},tt={class:"dwui-data-table-total-count"},ot={key:1,class:"dwui-data-table-limit"},nt=["value","max"],lt=["title","aria-label"],at=["title","aria-label"],X=e.defineComponent({__name:"data-table-controls",props:{pagination:{type:Boolean},showTotal:{type:Boolean},showLimit:{type:Boolean},showPageSelect:{type:Boolean},showDownloadPage:{type:Boolean},showDownloadAll:{type:Boolean},current:{},limit:{},maxLimit:{},maxPagination:{},totalCount:{},labels:{},formatTotalCount:{type:Function}},emits:["emit:changePage","emit:changeLimit","emit:downloadPage","emit:downloadAll"],setup(l,{emit:o}){const t=l,n=o,a=new Intl.NumberFormat("en-US"),r=e.computed(()=>t.formatTotalCount?t.formatTotalCount(t.totalCount):a.format(t.totalCount)),s=p=>{const d=p.target,u=Math.min(Math.max(Math.trunc(Number(d.value))||1,1),t.maxLimit);d.value=String(u),u!==t.limit&&n("emit:changeLimit",u)};return(p,d)=>(e.openBlock(),e.createElementBlock("div",Je,[t.pagination?(e.openBlock(),e.createBlock(Qe,{key:0,current:t.current,"total-count":t.totalCount,limit:t.limit,"max-pagination":t.maxPagination,"show-page-select":t.showPageSelect,labels:t.labels,"onEmit:changePage":d[0]||(d[0]=u=>n("emit:changePage",u))},null,8,["current","total-count","limit","max-pagination","show-page-select","labels"])):e.createCommentVNode("",!0),e.createElementVNode("div",Ze,[t.showTotal?(e.openBlock(),e.createElementBlock("span",et,[e.createElementVNode("span",null,e.toDisplayString(t.labels.totalCount),1),e.createElementVNode("span",tt,e.toDisplayString(r.value),1),e.createElementVNode("span",null,e.toDisplayString(t.labels.totalUnit),1)])):e.createCommentVNode("",!0),t.showLimit?(e.openBlock(),e.createElementBlock("label",ot,[e.createElementVNode("span",null,e.toDisplayString(t.labels.limit),1),e.createElementVNode("input",{type:"number",value:t.limit,min:"1",max:t.maxLimit,step:"1",onChange:s},null,40,nt)])):e.createCommentVNode("",!0),t.showDownloadPage?(e.openBlock(),e.createElementBlock("button",{key:2,type:"button",title:t.labels.downloadPage,"aria-label":t.labels.downloadPage,onClick:d[1]||(d[1]=u=>n("emit:downloadPage"))},[e.createVNode(e.unref(S.SvgFolderDownload))],8,lt)):e.createCommentVNode("",!0),t.showDownloadAll?(e.openBlock(),e.createElementBlock("button",{key:3,type:"button",title:t.labels.downloadAll,"aria-label":t.labels.downloadAll,onClick:d[2]||(d[2]=u=>n("emit:downloadAll"))},[e.createVNode(e.unref(S.SvgCloudDownload))],8,at)):e.createCommentVNode("",!0)])]))}}),R=(l,o)=>{let t=l;for(const n of o.replace(/\[(\w+)\]/g,".$1").split(".")){if(t==null)return;t=t[n]}return t},W=l=>typeof l=="function"?l():l??"",Y=l=>l===!0||l==="true"||l==="1"||l==="on"||l===1,q=l=>typeof l=="number"?l:Number(String(l).replace(/[^+\-\d.]/g,"")),rt=(l,o,t)=>{if(l==null&&o==null)return 0;if(l==null)return-1;if(o==null)return 1;if(l===o)return 0;switch(t){case"boolean":return(Y(l)?1:0)-(Y(o)?1:0);case"number":{const n=q(l),a=q(o);return Number.isNaN(n)||Number.isNaN(a)?(Number.isNaN(n)?0:1)-(Number.isNaN(a)?0:1):n-a}case"object":return A(l).localeCompare(A(o));default:return String(l).localeCompare(String(o))}},A=l=>{try{return JSON.stringify(l,(o,t)=>typeof t=="bigint"?t.toString():t)??""}catch{return""}},st="$index",te=l=>{const o=[];for(const t of l)if(t.csv===!0)o.push({header:t,column:{}});else if(Array.isArray(t.csv))for(const n of t.csv)n.disabled||o.push({header:t,column:n});return o},it=l=>te(l).map(({header:o,column:t})=>W(t.label??o.label)),ct=(l,o,t)=>te(l).map(({header:n,column:a})=>{if(a.format)return a.format(o);const r=a.key??n.id;return r===st?t:R(o,r)}),oe=Symbol("dwui-vue-core-options"),dt=["rowspan","colspan","title","aria-sort"],ut={class:"dwui-data-table-header"},mt=["role","tabindex","onClick","onKeydown"],pt=["innerHTML"],ft={key:2},vt=["onPointerdown"],gt={key:0,class:"dwui-data-table-no-data"},ht=["colspan"],wt={key:0,class:"dwui-data-table-loading"},bt=e.defineComponent({__name:"data-table",props:{dataList:{},headers:{},loading:{type:Boolean,default:!1},totalCount:{default:void 0},current:{default:1},limit:{default:100},maxLimit:{default:void 0},maxPagination:{default:void 0},selectable:{type:Boolean,default:void 0},controls:{default:void 0},pagination:{default:void 0},showDownloadPage:{type:Boolean,default:void 0},showDownloadAll:{type:Boolean,default:void 0},showTotal:{type:Boolean,default:void 0},showLimit:{type:Boolean,default:void 0},showPageSelect:{type:Boolean,default:void 0},showNoData:{type:Boolean,default:void 0},resizable:{type:Boolean,default:void 0},sortable:{type:Boolean,default:void 0},sortMode:{default:void 0},contentClass:{type:[Boolean,null,String,Object,Array],default:void 0},contentStyle:{type:[Boolean,null,String,Object,Array],default:void 0},tableClass:{type:[Boolean,null,String,Object,Array],default:void 0},tableStyle:{type:[Boolean,null,String,Object,Array],default:void 0},labels:{default:void 0},formatTotalCount:{type:Function,default:void 0}},emits:["emit:selectRow","emit:changeSort","emit:updateHeader","emit:dblclickRow","emit:changeLimit","emit:changePage","emit:downloadPage","emit:downloadAll"],setup(l,{expose:o,emit:t}){const n=l,a=t,r=e.inject(oe,{}),s=e.ref(),p=e.ref(),d=e.ref(),u=e.ref({}),g=e.ref(""),v=e.ref(!1),m=e.ref();let k;const C=e.computed(()=>n.headers.map(i=>u.value[i.id]==null?i:{...i,width:u.value[i.id]})),y={maxLimit:9999,maxPagination:7,selectable:!0,controls:"both",pagination:"both",showDownloadPage:!0,showDownloadAll:!0,showTotal:!0,showLimit:!0,showPageSelect:!1,showNoData:!0,resizable:!0,sortable:!0,sortMode:"remote",contentClass:void 0,contentStyle:void 0,tableClass:void 0,tableStyle:void 0,formatTotalCount:void 0},c=e.computed(()=>{const i={...y};for(const f of[r.dataTable??{},n])for(const w of Object.keys(y))f[w]!==void 0&&Object.assign(i,{[w]:f[w]});return i}),B=e.computed(()=>{const i={totalCount:"Total",totalUnit:"",limit:"Rows per page",noData:"No data found",pageNumber:"Page",downloadPage:"Download this page",downloadAll:"Download all",firstPage:"First page",previousPage:"Previous page",previousPages:"Previous pages",nextPages:"Next pages",nextPage:"Next page",lastPage:"Last page",...r.dataTable?.labels,...n.labels},f={};for(const w of Object.keys(i)){const E=i[w];f[w]=typeof E=="function"?E():E}return f}),h=e.computed(()=>Math.min(n.limit,c.value.maxLimit)),$=e.computed(()=>({showTotal:c.value.showTotal,showLimit:c.value.showLimit,showPageSelect:c.value.showPageSelect,showDownloadPage:c.value.showDownloadPage,showDownloadAll:c.value.showDownloadAll,current:n.current,limit:h.value,maxLimit:c.value.maxLimit,maxPagination:c.value.maxPagination,totalCount:n.totalCount??n.dataList.length,formatTotalCount:c.value.formatTotalCount,labels:B.value})),b=e.shallowRef(void 0),x=e.computed(()=>{const i=c.value.sortMode==="page"?n.headers.find(w=>w.id===g.value):void 0;if(!i)return n.dataList;const f=i.compare??((w,E)=>{const N=i.sortKey??i.id;return rt(R(w,N),R(E,N),i.type??"string")});return[...n.dataList].sort((w,E)=>v.value?f(E,w):f(w,E))}),_=e.computed(()=>{const i=b.value;if(i==null)return-1;const f=x.value.indexOf(i);if(f!==-1)return f;const w=A(i);return w===""?-1:x.value.findIndex(E=>A(E)===w)}),V=e.computed(()=>n.headers.reduce((i,f)=>i+(f.colspan==null?1:Number(f.colspan)),0)),P=i=>{if(i!=null)return typeof i=="number"?`${i}px`:i},L=i=>({width:P(i.width),minWidth:P(i.minWidth),maxWidth:P(i.maxWidth)}),ve=i=>{if(g.value===i)return v.value?"descending":"ascending"},j=i=>{if(!(!c.value.sortable||g.value!==i))return v.value?"down":"up"},ge=i=>(n.current-1)*h.value+i+1,F=()=>Array.from(d.value?.children??[]).filter(i=>i.tagName==="TR"&&!i.classList.contains("dwui-data-table-no-data")),he=i=>Array.from(i.children).filter(f=>f.tagName==="TD"||f.tagName==="TH"),K=()=>{a("emit:updateHeader",C.value.map(i=>({...i})))},O=()=>{F().forEach((i,f)=>i.classList.toggle("dwui-selected",f===_.value))},we=()=>{const i=s.value,f=F()[_.value];if(!i||!f)return;const w=p.value?.offsetHeight??0,E=f.offsetTop,N=E+f.offsetHeight;E<i.scrollTop+w?i.scrollTop=E-w:i.scrollTop+i.clientHeight<N&&(i.scrollTop=N-i.clientHeight)},D=(i,f)=>{b.value=i,a("emit:selectRow",i,f)},U=(i,f)=>{c.value.selectable&&(f===_.value?D(void 0,-1):(D(i,f),s.value?.focus({preventScroll:!0})))},be=(i,f)=>{f!==_.value&&U(i,f),a("emit:dblclickRow",i,f)},ye=i=>{if(i.target!==i.currentTarget||_.value<0||i.key!=="ArrowUp"&&i.key!=="ArrowDown")return;const f=_.value+(i.key==="ArrowUp"?-1:1);f<0||x.value.length<=f||(i.preventDefault(),D(x.value[f],f))},I=i=>{!c.value.sortable||n.dataList.length===0||(v.value=g.value===i.id?!v.value:!1,g.value=i.id,a("emit:changeSort",{sortKey:g.value,descending:v.value}))},ke=(i,f)=>{if(!c.value.resizable)return;i.preventDefault();const w=p.value?.firstElementChild,E=w?he(w):[];for(const[N,T]of E.entries())u.value[n.headers[N].id]=T.getBoundingClientRect().width;m.value={index:f,x:i.clientX},i.currentTarget.setPointerCapture(i.pointerId),K()},Be=i=>{if(!m.value)return;const f=i.clientX-m.value.x;if(f===0)return;m.value.x=i.clientX;const w=m.value.index,E=n.headers.map(T=>T.id);u.value[E[w]]+=f;const N=f/(E.length-w-1);for(const T of E.slice(w+1))u.value[T]-=N},G=()=>{m.value&&(m.value=void 0,K())};return e.onMounted(()=>{k=new MutationObserver(O),d.value&&k.observe(d.value,{childList:!0}),O()}),e.onBeforeUnmount(()=>{k?.disconnect()}),e.watch(()=>n.headers,(i,f)=>{const w=i.map(N=>N.id),E=f.map(N=>N.id);(w.length!==E.length||w.some(N=>!E.includes(N)))&&(u.value={})}),e.watch(()=>n.loading,(i,f)=>{f&&!i&&(c.value.sortMode==="page"&&(g.value="",v.value=!1),b.value!=null&&D(void 0,-1))}),e.watch(_,i=>{0<=i&&we()},{flush:"post"}),e.watch(_,O,{flush:"post"}),o({getSortContext:()=>({sortKey:g.value,descending:v.value})}),(i,f)=>(e.openBlock(),e.createElementBlock("section",{class:e.normalizeClass(["dwui-data-table",{"dwui-selectable":c.value.selectable}])},[c.value.controls==="both"||c.value.controls==="top"?(e.openBlock(),e.createBlock(X,e.mergeProps({key:0},$.value,{pagination:c.value.pagination==="both"||c.value.pagination==="top","onEmit:changePage":f[0]||(f[0]=w=>a("emit:changePage",w)),"onEmit:changeLimit":f[1]||(f[1]=w=>a("emit:changeLimit",w)),"onEmit:downloadPage":f[2]||(f[2]=w=>a("emit:downloadPage")),"onEmit:downloadAll":f[3]||(f[3]=w=>a("emit:downloadAll"))}),null,16,["pagination"])):e.createCommentVNode("",!0),e.createElementVNode("div",{ref_key:"refContent",ref:s,class:e.normalizeClass(["dwui-data-table-content",[{"dwui-loading":n.loading},c.value.contentClass]]),style:e.normalizeStyle(c.value.contentStyle),tabindex:"-1",onKeydown:ye},[e.createElementVNode("table",{class:e.normalizeClass(c.value.tableClass),style:e.normalizeStyle(c.value.tableStyle)},[e.createElementVNode("thead",{ref_key:"refThead",ref:p},[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(C.value,(w,E)=>(e.openBlock(),e.createElementBlock("th",{key:w.id,rowspan:w.rowspan,colspan:w.colspan,title:w.title,style:e.normalizeStyle(L(w)),"aria-sort":ve(w.id),scope:"col"},[e.createElementVNode("div",ut,[e.createElementVNode("span",{class:"dwui-data-table-sort",role:c.value.sortable?"button":void 0,tabindex:c.value.sortable?0:void 0,onClick:N=>I(w),onKeydown:[e.withKeys(e.withModifiers(N=>I(w),["prevent"]),["enter"]),e.withKeys(e.withModifiers(N=>I(w),["prevent"]),["space"])]},[j(w.id)?(e.openBlock(),e.createBlock(e.unref(S.SvgPointingTriangle),{key:0,direction:j(w.id),size:"0.7em"},null,8,["direction"])):e.createCommentVNode("",!0),w.html?(e.openBlock(),e.createElementBlock("span",{key:1,innerHTML:e.unref(W)(w.label)},null,8,pt)):(e.openBlock(),e.createElementBlock("span",ft,e.toDisplayString(e.unref(W)(w.label)),1))],40,mt)]),c.value.resizable&&E<C.value.length-1?(e.openBlock(),e.createElementBlock("div",{key:0,class:"dwui-data-table-resizer",onPointerdown:N=>ke(N,E),onPointermove:Be,onPointerup:G,onPointercancel:G},null,40,vt)):e.createCommentVNode("",!0)],12,dt))),128))])],512),e.createElementVNode("tbody",{ref_key:"refTbody",ref:d},[n.loading?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.renderSlot(i.$slots,"default",{rows:x.value,clickRow:U,dblclickRow:be,rowNumber:ge,selectedIndex:_.value}),n.dataList.length===0&&c.value.showNoData?(e.openBlock(),e.createElementBlock("tr",gt,[e.createElementVNode("td",{colspan:V.value},e.toDisplayString(B.value.noData),9,ht)])):e.createCommentVNode("",!0)],64))],512)],6),n.loading?(e.openBlock(),e.createElementBlock("div",wt,[e.renderSlot(i.$slots,"loading",{},()=>[f[8]||(f[8]=e.createElementVNode("div",{class:"dwui-data-table-loading-spinner"},null,-1))])])):e.createCommentVNode("",!0)],38),c.value.controls==="both"||c.value.controls==="bottom"?(e.openBlock(),e.createBlock(X,e.mergeProps({key:1},$.value,{pagination:c.value.pagination==="both"||c.value.pagination==="bottom","onEmit:changePage":f[4]||(f[4]=w=>a("emit:changePage",w)),"onEmit:changeLimit":f[5]||(f[5]=w=>a("emit:changeLimit",w)),"onEmit:downloadPage":f[6]||(f[6]=w=>a("emit:downloadPage")),"onEmit:downloadAll":f[7]||(f[7]=w=>a("emit:downloadAll"))}),null,16,["pagination"])):e.createCommentVNode("",!0)],2))}}),Q={top:"bottom",bottom:"top",left:"right",right:"left"},H=(l,o,t)=>Math.min(Math.max(l,o),t),ne=(l,o,t,n)=>{const{offset:a,margin:r,arrowMargin:s}=n,[p,d="center"]=n.placement.split("-"),u=p==="top"||p==="bottom",g=l.top+l.height,v=l.left+l.width,m={top:l.top-r,bottom:t.height-g-r,left:l.left-r,right:t.width-v-r},y=(u?o.height:o.width)+a<=m[p]||m[Q[p]]<=m[p]?p:Q[p];let c;switch(y){case"top":c=l.top-a-o.height;break;case"bottom":c=g+a;break;case"left":c=l.left-a-o.width;break;default:c=v+a;break}const B=u?l.left:l.top,h=u?l.width:l.height,$=u?o.width:o.height;let b;switch(d){case"start":b=B;break;case"end":b=B+h-$;break;default:b=B+(h-$)/2;break}const x=H(u?c:b,r,Math.max(r,t.height-r-o.height)),_=H(u?b:c,r,Math.max(r,t.width-r-o.width)),V=B+h/2,L=H(V-(u?_:x),s,Math.max(s,$-s));return{top:x,left:_,side:y,arrow:L}},yt=["popover","data-side"],kt={class:"dwui-anchored-popover-content"},J=4,Bt=7,Ct=12,_t=8,le=e.defineComponent({__name:"anchored-popover",props:{anchor:{},placement:{},arrow:{type:Boolean},mode:{}},emits:["emit:open","emit:close"],setup(l,{expose:o,emit:t}){const n=l,a=t,r=e.ref(),s=e.ref(),p=()=>{r.value?.hidePopover()},d=()=>{r.value?.showPopover()},u=()=>{const m=r.value;if(!n.anchor||!m)return;const k={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight},C=ne(n.anchor.getBoundingClientRect(),m.getBoundingClientRect(),k,{placement:n.placement,offset:n.arrow?J+Bt:J,margin:_t,arrowMargin:Ct});s.value=C.side,m.style.top=`${C.top}px`,m.style.left=`${C.left}px`,m.style.setProperty("--dwui-offset-arrow",`${C.arrow}px`),m.style.visibility="visible"},g=m=>{r.value?.contains(m.target)||u()},v=m=>{m.newState==="open"?(u(),window.addEventListener("scroll",g,!0),window.addEventListener("resize",u),a("emit:open")):(r.value&&(r.value.style.visibility=""),window.removeEventListener("scroll",g,!0),window.removeEventListener("resize",u),a("emit:close"))};return e.onBeforeUnmount(()=>{window.removeEventListener("scroll",g,!0),window.removeEventListener("resize",u)}),o({element:r,show:d,hide:p}),(m,k)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"refPanel",ref:r,class:e.normalizeClass(["dwui-anchored-popover",{"dwui-arrow":n.arrow}]),popover:n.mode,"data-side":s.value,onToggle:v},[e.createElementVNode("div",kt,[e.renderSlot(m.$slots,"default")])],42,yt))}}),St=["aria-label"],Et=e.defineComponent({inheritAttrs:!1,__name:"help-button",props:{placement:{default:"bottom-start"},arrow:{type:Boolean,default:!1},label:{default:"Help"}},emits:["emit:open","emit:close"],setup(l,{emit:o}){const t=l,n=o,a=e.useAttrs(),r=e.ref(),s=e.ref();return e.onMounted(()=>{const p=s.value?.element;r.value&&p&&(r.value.popoverTargetElement=p)}),(p,d)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("button",e.mergeProps({ref_key:"refButton",ref:r,type:"button",class:"dwui-help-button","aria-label":t.label},e.unref(a)),[e.renderSlot(p.$slots,"icon",{},()=>[e.createVNode(e.unref(S.SvgQuestion))])],16,St),e.createVNode(le,{ref_key:"refPopover",ref:s,class:"dwui-help-button-popover",mode:"auto",anchor:r.value,placement:t.placement,arrow:t.arrow,"onEmit:open":d[0]||(d[0]=u=>n("emit:open")),"onEmit:close":d[1]||(d[1]=u=>n("emit:close"))},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},8,["anchor","placement","arrow"])],64))}}),$t=["aria-label","aria-describedby"],xt=150,ae=e.defineComponent({inheritAttrs:!1,__name:"icon-popper",props:{placement:{},arrow:{type:Boolean},popoverClass:{},label:{}},emits:["emit:open","emit:close"],setup(l,{emit:o}){const t=l,n=o,a=e.useAttrs(),r=e.ref(),s=e.ref(),p=e.ref(!1),d=e.useId();let u;const g=()=>{u!==void 0&&(clearTimeout(u),u=void 0)},v=()=>{g(),s.value?.show()},m=()=>{g(),s.value?.hide()},k=()=>{g(),u=setTimeout(()=>{u=void 0,s.value?.hide()},xt)},C=P=>{const L=P.target;!r.value?.contains(L)&&!s.value?.element?.contains(L)&&m()},y=P=>{P.pointerType!=="touch"&&v()},c=P=>{P.pointerType!=="touch"&&k()},B=P=>{P.pointerType!=="touch"&&g()},h=P=>{P.pointerType==="touch"&&(p.value?m():v())},$=()=>{v()},b=()=>{m()},x=()=>{m()},_=()=>{p.value=!0,document.addEventListener("pointerdown",C,!0),n("emit:open")},V=()=>{p.value=!1,document.removeEventListener("pointerdown",C,!0),n("emit:close")};return e.onBeforeUnmount(()=>{g(),document.removeEventListener("pointerdown",C,!0)}),(P,L)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("span",e.mergeProps({ref_key:"refTrigger",ref:r,class:"dwui-icon-popper",tabindex:"0","aria-label":t.label,"aria-describedby":e.unref(d)},e.unref(a),{onPointerenter:y,onPointerleave:c,onPointerdown:h,onFocus:$,onBlur:b,onKeydown:e.withKeys(x,["esc"])}),[e.renderSlot(P.$slots,"icon")],16,$t),e.createVNode(le,{ref_key:"refPopover",ref:s,id:e.unref(d),class:e.normalizeClass(["dwui-icon-popper-popover",t.popoverClass]),role:"tooltip",mode:"manual",anchor:r.value,placement:t.placement,arrow:t.arrow,onPointerenter:B,onPointerleave:c,"onEmit:open":_,"onEmit:close":V},{default:e.withCtx(()=>[e.renderSlot(P.$slots,"default")]),_:3},8,["id","class","anchor","placement","arrow"])],64))}}),Nt=e.defineComponent({__name:"help-popper",props:{placement:{default:"right"},arrow:{type:Boolean,default:!0},label:{default:"Help"}},emits:["emit:open","emit:close"],setup(l,{emit:o}){const t=l,n=o;return(a,r)=>(e.openBlock(),e.createBlock(ae,{class:"dwui-help-popper","popover-class":"dwui-help-popper-popover",placement:t.placement,arrow:t.arrow,label:t.label,"onEmit:open":r[0]||(r[0]=s=>n("emit:open")),"onEmit:close":r[1]||(r[1]=s=>n("emit:close"))},{icon:e.withCtx(()=>[e.renderSlot(a.$slots,"icon",{},()=>[e.createVNode(e.unref(S.SvgQuestion))])]),default:e.withCtx(()=>[e.renderSlot(a.$slots,"default")]),_:3},8,["placement","arrow","label"]))}}),Pt=e.defineComponent({__name:"hourglass-loading",props:{loading:{type:Boolean},duration:{},size:{default:"1.2em"}},setup(l){const o=l;return(t,n)=>o.loading?(e.openBlock(),e.createBlock(e.unref(S.SvgHourglass),{key:0,duration:o.duration,size:o.size,class:"dwui-hourglass-loading"},null,8,["duration","size"])):e.renderSlot(t.$slots,"default",{},void 0,void 0,1)}}),Vt=e.defineComponent({__name:"intersection-lazy-component",props:{root:{},rootMargin:{},threshold:{}},emits:["emit:visible"],setup(l,{emit:o}){const t=l,n=o,a=e.ref(),r=e.ref(!1);let s;const p=()=>{s?.disconnect(),s=void 0,!(!a.value||r.value)&&(s=new IntersectionObserver(d=>{d.some(u=>u.isIntersecting)&&(r.value=!0,s?.disconnect(),s=void 0,n("emit:visible"))},{root:t.root,rootMargin:t.rootMargin,threshold:t.threshold}),s.observe(a.value))};return e.onMounted(()=>{p()}),e.onBeforeUnmount(()=>{s?.disconnect()}),e.watch(()=>[t.root,t.rootMargin,t.threshold],()=>{p()},{flush:"post"}),(d,u)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"refTarget",ref:a,class:"dwui-intersection-lazy-component"},[r.value?e.renderSlot(d.$slots,"default",{},void 0,void 0,0):e.renderSlot(d.$slots,"placeholder",{},void 0,void 0,1)],512))}}),Lt={type:"button",class:"dwui-label-button"},Mt=e.defineComponent({__name:"label-button",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(l){const o=l,t=e.useSlots();return(n,a)=>(e.openBlock(),e.createElementBlock("button",Lt,[e.createVNode(M,{preset:o.preset,gap:o.gap,"icon-class":o.iconClass,"icon-style":o.iconStyle,"label-class":o.labelClass,"label-style":o.labelStyle},e.createSlots({_:2},[t.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"icon")]),key:"0"}:void 0,t.default!=null?{name:"default",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"default")]),key:"1"}:void 0]),1032,["preset","gap","icon-class","icon-style","label-class","label-style"])]))}}),Tt=["aria-labelledby","aria-describedby"],Dt={class:"dwui-modal-dialog-header"},zt={class:"dwui-modal-dialog-icon"},At=["id","innerHTML"],Ot=["id"],It=["id"],Ht=["innerHTML"],Rt={key:1},Wt={key:0,class:"dwui-modal-dialog-images"},jt=["src","alt"],Ft=["onClick"],Kt=e.defineComponent({__name:"modal-dialog",props:e.mergeModels({type:{default:"info"},title:{default:void 0},message:{default:void 0},html:{type:Boolean,default:!1},image:{default:void 0},buttons:{default:void 0},okLabel:{default:"OK"},yesLabel:{default:"Yes"},noLabel:{default:"No"},cancelLabel:{default:"Cancel"}},{open:{type:Boolean,default:!1},openModifiers:{}}),emits:e.mergeModels(["emit:close"],["update:open"]),setup(l,{emit:o}){const t=l,n=o,a=e.useModel(l,"open"),r=e.ref(),s=e.ref(),p=e.useId(),d=e.useId(),u={info:S.SvgInfo,confirm:S.SvgQuestion,warn:S.SvgWarningSign,error:S.SvgCritical},g=["cancel","no","yes","ok"],v=e.computed(()=>t.buttons??(t.type==="confirm"?["yes","no"]:["ok"])),m=e.computed(()=>({ok:t.okLabel,yes:t.yesLabel,no:t.noLabel,cancel:t.cancelLabel})),k=e.computed(()=>t.message==null?[]:[t.message].flat()),C=e.computed(()=>[t.image??[]].flat().map(b=>typeof b=="string"?{src:b,alt:""}:b)),y=b=>{$(b)},c=b=>{b.preventDefault(),$("cancel")},B=b=>{if(b.key!=="ArrowLeft"&&b.key!=="ArrowRight")return;const x=[...s.value?.children??[]],_=x.indexOf(document.activeElement);_<0||x[b.key==="ArrowRight"?_+1:_-1]?.focus()},h=()=>{r.value?.showModal();const b=g.find(_=>v.value.includes(_)),x=b?v.value.indexOf(b):-1;s.value?.children[x]?.focus()},$=b=>{r.value?.close(),a.value=!1,n("emit:close",b)};return e.onMounted(()=>{a.value&&h()}),e.watch(a,b=>{b?h():r.value?.close()},{flush:"post"}),(b,x)=>(e.openBlock(),e.createElementBlock("dialog",{ref_key:"refDialog",ref:r,class:e.normalizeClass(["dwui-modal-dialog",`dwui-modal-dialog-${t.type}`]),"aria-labelledby":t.title?e.unref(p):void 0,"aria-describedby":e.unref(d),onCancel:c,onKeydown:B},[e.createElementVNode("div",Dt,[e.createElementVNode("span",zt,[e.renderSlot(b.$slots,"icon",{},()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(u[t.type])))])]),t.title?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.html?(e.openBlock(),e.createElementBlock("span",{key:0,id:e.unref(p),class:"dwui-modal-dialog-title",innerHTML:t.title},null,8,At)):(e.openBlock(),e.createElementBlock("span",{key:1,id:e.unref(p),class:"dwui-modal-dialog-title"},e.toDisplayString(t.title),9,Ot))],64)):e.createCommentVNode("",!0)]),e.createElementVNode("div",{id:e.unref(d),class:"dwui-modal-dialog-body"},[e.renderSlot(b.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.value,(_,V)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:V},[t.html?(e.openBlock(),e.createElementBlock("p",{key:0,innerHTML:_},null,8,Ht)):(e.openBlock(),e.createElementBlock("p",Rt,e.toDisplayString(_),1))],64))),128)),C.value.length?(e.openBlock(),e.createElementBlock("div",Wt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(C.value,(_,V)=>(e.openBlock(),e.createElementBlock("img",{key:V,src:_.src,alt:_.alt},null,8,jt))),128))])):e.createCommentVNode("",!0)])],8,It),e.createElementVNode("div",{ref_key:"refButtons",ref:s,class:"dwui-modal-dialog-buttons"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,_=>(e.openBlock(),e.createElementBlock("button",{key:_,type:"button",class:e.normalizeClass(["dwui-modal-dialog-button",`dwui-modal-dialog-button-${_}`]),onClick:V=>y(_)},e.toDisplayString(m.value[_]),11,Ft))),128))],512)],42,Tt))}});function Ut(l){const o=l.minWidth??20,t=l.minHeight??20,n=e.ref(!1),a=e.ref(!1),r=e.reactive({x:0,y:0}),s=e.reactive({width:-1,height:-1});let p=null,d="bottom-right",u={x:0,y:0};const g=h=>{if(h.pointerId!==p)return;h.preventDefault();const $=h.clientX-u.x,b=h.clientY-u.y;if(u={x:h.clientX,y:h.clientY},n.value)r.x+=$,r.y+=b;else if(a.value){if(d.endsWith("left")){const x=Math.max(o,s.width-$);r.x+=s.width-x,s.width=x}else s.width=Math.max(o,s.width+$);if(d.startsWith("top")){const x=Math.max(t,s.height-b);r.y+=s.height-x,s.height=x}else s.height=Math.max(t,s.height+b)}},v=()=>{const h=l.target.value?.getBoundingClientRect().width||0;r.x<40-h&&(r.x=40-h),window.innerWidth-40<r.x&&(r.x=window.innerWidth-40),r.y<0&&(r.y=0),l.clampBottom&&window.innerHeight-20<r.y&&(r.y=window.innerHeight-20)},m=h=>{if(h.pointerId!==p)return;const $=n.value;k(),$&&v()},k=()=>{document.removeEventListener("pointermove",g,!0),document.removeEventListener("pointerup",m,!0),document.removeEventListener("pointercancel",m,!0),p=null,n.value=!1,a.value=!1},C=h=>{k(),p=h.pointerId,u={x:h.clientX,y:h.clientY},document.addEventListener("pointermove",g,!0),document.addEventListener("pointerup",m,!0),document.addEventListener("pointercancel",m,!0)},y=h=>{h.isPrimary&&l.dragMode()==="body"&&(C(h),n.value=!0)},c=h=>{h.isPrimary&&l.dragMode()==="header"&&(C(h),n.value=!0)},B=(h,$="bottom-right")=>{if(!h.isPrimary)return;d=$;const b=l.target.value?.getBoundingClientRect();b&&(s.width<0&&(s.width=b.width),s.height<0&&(s.height=b.height)),C(h),a.value=!0};return e.onBeforeUnmount(k),{moving:n,resizing:a,currentPosition:r,currentRect:s,onDragStart:y,onDragHeaderStart:c,onResizeStart:B,teardown:k}}const Gt=["aria-labelledby"],Xt=["id"],Yt=["aria-label"],qt=["onPointerdown"],re=e.defineComponent({__name:"movable-window",props:{name:{},dragMode:{},loading:{type:Boolean},closeLabel:{},clampBottom:{type:Boolean},headerClass:{type:[Boolean,null,String,Object,Array]},headerStyle:{type:[Boolean,null,String,Object,Array]}},emits:["emit:close"],setup(l,{expose:o,emit:t}){const n=l,a=t,r=e.ref(),s=e.useId(),p=["top-left","top-right","bottom-left"],d=Ut({target:r,dragMode:()=>n.dragMode,clampBottom:n.clampBottom}),u=e.computed(()=>{const{currentPosition:g,currentRect:v}=d;return{top:`${g.y}px`,left:`${g.x}px`,width:0<=v.width?`${v.width}px`:void 0,height:0<=v.height?`${v.height}px`:void 0}});return o({element:r,position:d.currentPosition,size:d.currentRect,teardown:d.teardown}),(g,v)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"refWindow",ref:r,class:"dwui-movable-window",role:"dialog","aria-labelledby":e.unref(s),style:e.normalizeStyle(u.value)},[e.createElementVNode("div",{class:"dwui-movable-window-frame",onPointerdown:v[2]||(v[2]=(...m)=>e.unref(d).onDragStart&&e.unref(d).onDragStart(...m))},[e.createElementVNode("div",{class:e.normalizeClass(["dwui-movable-window-header",[`${n.name}-header`,n.headerClass,{"dwui-movable":n.dragMode}]]),style:e.normalizeStyle(n.headerStyle),onPointerdown:v[1]||(v[1]=(...m)=>e.unref(d).onDragHeaderStart&&e.unref(d).onDragHeaderStart(...m))},[e.createElementVNode("div",{id:e.unref(s),class:e.normalizeClass(["dwui-movable-window-title",`${n.name}-title`])},[e.renderSlot(g.$slots,"title")],10,Xt),e.renderSlot(g.$slots,"actions"),e.createElementVNode("button",{type:"button",class:e.normalizeClass(["dwui-movable-window-close-button",`${n.name}-close-button`]),"aria-label":n.closeLabel,onClick:v[0]||(v[0]=m=>a("emit:close"))},[e.createVNode(e.unref(S.SvgNegativeSquaredCrossMark))],10,Yt)],38),e.createElementVNode("div",{class:e.normalizeClass(["dwui-movable-window-body",[`${n.name}-body`,{"dwui-movable":n.dragMode==="body"}]])},[e.renderSlot(g.$slots,"default")],2)],32),n.loading?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["dwui-movable-window-loading",`${n.name}-loading`])},[e.createElementVNode("div",{class:e.normalizeClass(["dwui-movable-window-spinner",`${n.name}-spinner`])},null,2)],2)):e.createCommentVNode("",!0),(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(p,m=>e.createElementVNode("div",{key:m,class:e.normalizeClass(["dwui-movable-window-corner",[`${n.name}-corner`,`dwui-${m}`]]),onPointerdown:e.withModifiers(k=>e.unref(d).onResizeStart(k,m),["prevent"])},null,42,qt)),64)),e.createElementVNode("div",{class:e.normalizeClass(["dwui-movable-window-resizer",`${n.name}-resizer`]),onPointerdown:v[3]||(v[3]=e.withModifiers(m=>e.unref(d).onResizeStart(m,"bottom-right"),["prevent"]))},[e.createVNode(e.unref(S.SvgCornerDiagonal),{direction:"bottom-right"})],34)],12,Gt))}});let Z=0;const se=()=>(Z+=1,Z);function ie(l,o,t){const n=document.createElement("div");document.body.appendChild(n);const a=e.ref(!0),r=e.ref(!1),s={close:()=>{a.value=!1},setLoading:u=>{r.value=u}},p=e.defineComponent(()=>()=>l({open:a.value,loading:r.value,"onUpdate:open":u=>{a.value=u},"onEmit:close":()=>{t.delete(s),e.render(null,n),n.remove(),o.onClosed?.(),o.onClose?.()}},s)),d=e.h(p);return o.appContext&&(d.appContext=o.appContext),e.render(d,n),t.add(s),s}function ce(l){const o=e.getCurrentInstance();if(!o)throw new Error(`${l}() must be called inside setup().`);const t=new Set;return e.onBeforeUnmount(()=>{for(const n of t)n.close()}),{appContext:o.appContext,own:n=>{const a=n(()=>{t.delete(a)});return t.add(a),a}}}const z=[],de=new Set,ue=(l,o,t,n)=>{const{appContext:a,onClose:r,...s}=t??{};return ie((p,d)=>e.h(me,{...s,...p},{default:()=>e.h(l,{...o,close:d.close,setLoading:d.setLoading})}),{appContext:a,onClose:r,onClosed:n},de)};function Qt(l,o,t){return ue(l,o,t)}function Jt(){for(const l of[...de])l.close()}function Zt(){const l=ce("useOverlayBox");return{showOverlayBox:(o,t,n)=>l.own(a=>ue(o,t,{appContext:l.appContext,...n},a))}}const me=e.defineComponent({__name:"overlay-box",props:e.mergeModels({title:{default:void 0},dragMode:{default:void 0},closeOnBackdrop:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},closeLabel:{default:"Close"}},{open:{type:Boolean,default:!1},openModifiers:{}}),emits:e.mergeModels(["emit:close"],["update:open"]),setup(l,{emit:o}){const t=l,n=o,a=e.useModel(l,"open"),r=e.ref(),s=e.ref(0),p=Symbol("dwui-overlay-box");let d=null;const u=()=>{t.closeOnBackdrop&&(a.value=!1)},g=()=>{a.value=!1},v=c=>{c.key!=="Escape"||!c.isTrusted||c.isComposing||c.target instanceof Element&&c.target.closest("dialog")||z.at(-1)===p&&(a.value=!1)},m=()=>{n("emit:close")},k=()=>{const c=z.indexOf(p);0<=c&&z.splice(c,1)},C=()=>{s.value=se();const c=r.value,B=c?.element?.getBoundingClientRect();c&&(c.position.x=(window.innerWidth-(B?.width||0))/2,c.position.y=Math.max(0,(window.innerHeight-(B?.height||0))/2)),d=document.activeElement instanceof HTMLElement?document.activeElement:null,c?.element?.focus(),z.push(p)},y=()=>{r.value?.teardown(),k(),d?.isConnected&&d.focus(),d=null};return e.onMounted(()=>{a.value&&C()}),e.onBeforeUnmount(()=>{k()}),e.watch(a,c=>{c?C():y()},{flush:"post"}),(c,B)=>(e.openBlock(),e.createBlock(e.Transition,{name:"dwui-overlay-box-fade",onAfterLeave:m},{default:e.withCtx(()=>[a.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"dwui-overlay-box",style:e.normalizeStyle({"--dwui-order-window":s.value})},[e.createElementVNode("div",{class:"dwui-overlay-box-backdrop",onClick:u}),e.createVNode(re,{ref_key:"refWindow",ref:r,class:"dwui-overlay-box-container",name:"dwui-overlay-box",tabindex:"-1","drag-mode":t.dragMode,loading:t.loading,"close-label":t.closeLabel,"clamp-bottom":"",onKeydown:v,"onEmit:close":g},{title:e.withCtx(()=>[e.renderSlot(c.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(t.title),1)])]),default:e.withCtx(()=>[e.renderSlot(c.$slots,"default")]),_:3},8,["drag-mode","loading","close-label"])],4)):e.createCommentVNode("",!0)]),_:3}))}}),eo={class:"dwui-page-section"},to={class:"dwui-page-section-content"},oo=e.defineComponent({__name:"page-section",props:{title:{},icon:{default:"diamond"},iconVariant:{},iconColor:{},titleClass:{type:[Boolean,null,String,Object,Array]},titleStyle:{type:[Boolean,null,String,Object,Array]}},setup(l){const o=l,t={diamond:{component:S.SvgDiamond,shape:!0,color:"#1a44b6"},circle:{component:S.SvgCircle,shape:!0,color:"#e78b2f"},square:{component:S.SvgSquare,shape:!0,color:"#d13a2b"},pushpin:{component:S.SvgPushpin,shape:!1},"round-pushpin":{component:S.SvgRoundPushpin,shape:!1}},n=e.computed(()=>{const a=t[o.icon];return{component:a.component,props:a.shape?{variant:o.iconVariant,color:o.iconColor??a.color}:{}}});return(a,r)=>(e.openBlock(),e.createElementBlock("section",eo,[o.title!=null?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["dwui-page-section-title",o.titleClass]),style:e.normalizeStyle(o.titleStyle)},[e.createVNode(M,null,{icon:e.withCtx(()=>[e.renderSlot(a.$slots,"icon",{},()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.value.component),e.normalizeProps(e.guardReactiveProps(n.value.props)),null,16))])]),default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(o.title),1)]),_:3})],6)):e.createCommentVNode("",!0),e.createElementVNode("div",to,[e.renderSlot(a.$slots,"default")])]))}}),no={class:"dwui-page-title"},lo={key:0,class:"dwui-page-title-actions"},ao=e.defineComponent({__name:"page-title",props:{title:{}},setup(l){const o=l,t=e.useSlots();return(n,a)=>(e.openBlock(),e.createElementBlock("section",no,[e.createVNode(M,{class:"dwui-page-title-label"},e.createSlots({default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(o.title),1)]),_:2},[t.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"icon")]),key:"0"}:void 0]),1024),t.default!=null?(e.openBlock(),e.createElementBlock("span",lo,[e.renderSlot(n.$slots,"default")])):e.createCommentVNode("",!0)]))}}),ro=e.defineComponent({__name:"screen-loading",props:{loading:{type:Boolean}},setup(l){const o=l,t=e.ref(null),n=()=>{const r=t.value;r&&!r.open&&r.showModal()},a=()=>{const r=t.value;r?.open&&r.close()};return e.onMounted(()=>{o.loading&&n()}),e.onBeforeUnmount(()=>{a()}),e.watch(()=>o.loading,r=>{r?n():a()},{flush:"post"}),(r,s)=>(e.openBlock(),e.createElementBlock("dialog",{ref_key:"refDialog",ref:t,class:"dwui-screen-loading",closedby:"none",onCancel:s[0]||(s[0]=e.withModifiers(()=>{},["prevent"]))},[...s[1]||(s[1]=[e.createElementVNode("div",{class:"dwui-screen-loading-spinner"},null,-1)])],544))}}),pe=Symbol("dwui-tab-group"),so=["id","aria-labelledby","aria-busy","hidden"],io={key:0,class:"dwui-tab-loading"},co={key:1,class:"dwui-tab-loading-spinner"},fe=e.defineComponent({__name:"tab-content",props:{tabId:{},label:{},disabled:{type:Boolean},status:{},headerClass:{type:[Boolean,null,String,Object,Array]},headerStyle:{type:[Boolean,null,String,Object,Array]}},setup(l){const o=l,t=e.inject(pe,void 0),n=e.ref(!1),a=()=>t?.loadingSlot(),r=e.computed(()=>t?.activeTabId.value===o.tabId),s=e.computed(()=>!!t?.mounted.value&&r.value),p=d=>{n.value=d};return(d,u)=>o.disabled?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,id:e.unref(t)?`${e.unref(t).groupName}-${o.tabId}-panel`:void 0,class:"dwui-tab-content",role:"tabpanel","aria-labelledby":e.unref(t)?`${e.unref(t).groupName}-${o.tabId}`:void 0,"aria-busy":n.value?"true":void 0,hidden:!r.value},[e.renderSlot(d.$slots,"default",{activated:s.value,setLoading:p}),n.value?(e.openBlock(),e.createElementBlock("div",io,[a()!=null?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a()),{key:0})):(e.openBlock(),e.createElementBlock("span",co))])):e.createCommentVNode("",!0)],8,so))}}),uo={class:"dwui-tab-group"},mo=["id","name","disabled","checked","aria-selected","aria-controls","onChange"],po=["for"],fo={class:"dwui-tab-items"},vo=e.defineComponent({__name:"tab-group",props:e.mergeModels({tabGroupName:{},selectFirstEnabled:{type:Boolean},headerClass:{type:[Boolean,null,String,Object,Array]},headerStyle:{type:[Boolean,null,String,Object,Array]},teleport:{}},{selectedTabId:{},selectedTabIdModifiers:{}}),emits:["update:selectedTabId"],setup(l){const o=l,t=e.useModel(l,"selectedTabId"),n=e.useSlots(),a=o.tabGroupName??e.useId(),r=g=>{if(g.type!==fe)return;const v=g.props??{},m=v.disabled;return{tabId:String(v["tab-id"]??v.tabId),label:v.label,disabled:m===""||!!m,status:v.status,headerClass:v["header-class"]??v.headerClass,headerStyle:v["header-style"]??v.headerStyle,icon:g.children?.icon}},s=e.computed(()=>{const g=[];for(const v of n.default?.()??[]){const m=Array.isArray(v.children)?v.children:[v];for(const k of m){const C=r(k);C&&g.push(C)}}return g}),p=e.computed(()=>t.value!=null?t.value:(o.selectFirstEnabled?s.value.find(v=>!v.disabled):s.value[0])?.tabId),d=e.ref(!1);e.provide(pe,{groupName:a,activeTabId:p,mounted:d,loadingSlot:()=>n.loading}),e.onMounted(()=>{d.value=!0});const u=g=>{t.value=g};return(g,v)=>(e.openBlock(),e.createElementBlock("div",uo,[(e.openBlock(),e.createBlock(e.Teleport,{to:o.teleport??"body",disabled:o.teleport==null},[e.createElementVNode("div",{class:e.normalizeClass(["dwui-tab-headers",o.headerClass]),role:"tablist",style:e.normalizeStyle(o.headerStyle)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,m=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:m.tabId},[e.createElementVNode("input",{id:`${e.unref(a)}-${m.tabId}`,type:"radio",class:"dwui-tab-radio",role:"tab",name:e.unref(a),disabled:m.disabled,checked:m.tabId===p.value,"aria-selected":m.tabId===p.value?"true":"false","aria-controls":`${e.unref(a)}-${m.tabId}-panel`,onChange:k=>u(m.tabId)},null,40,mo),e.createElementVNode("label",{for:`${e.unref(a)}-${m.tabId}`,class:e.normalizeClass(["dwui-tab-item",[m.status!=null?`dwui-tab-${m.status}`:void 0,m.headerClass]]),style:e.normalizeStyle(m.headerStyle)},[e.createVNode(M,null,e.createSlots({default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(m.label),1)]),_:2},[m.icon!=null?{name:"icon",fn:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(m.icon)))]),key:"0"}:void 0]),1024)],14,po)],64))),128))],6)],8,["to","disabled"])),e.createElementVNode("div",fo,[e.renderSlot(g.$slots,"default")])]))}}),go=e.defineComponent({__name:"warning-popper",props:{placement:{default:"right"},arrow:{type:Boolean,default:!0},label:{default:"Warning"}},emits:["emit:open","emit:close"],setup(l,{emit:o}){const t=l,n=o;return(a,r)=>(e.openBlock(),e.createBlock(ae,{class:"dwui-warning-popper","popover-class":"dwui-warning-popper-popover",placement:t.placement,arrow:t.arrow,label:t.label,"onEmit:open":r[0]||(r[0]=s=>n("emit:open")),"onEmit:close":r[1]||(r[1]=s=>n("emit:close"))},{icon:e.withCtx(()=>[e.renderSlot(a.$slots,"icon",{},()=>[e.createVNode(e.unref(S.SvgWarningSign))])]),default:e.withCtx(()=>[e.renderSlot(a.$slots,"default")]),_:3},8,["placement","arrow","label"]))}});exports._sfc_main=re;exports._sfc_main$1=Me;exports._sfc_main$10=Pt;exports._sfc_main$11=Vt;exports._sfc_main$12=Mt;exports._sfc_main$13=M;exports._sfc_main$14=me;exports._sfc_main$15=oo;exports._sfc_main$16=ao;exports._sfc_main$17=fe;exports._sfc_main$18=vo;exports._sfc_main$19=go;exports._sfc_main$2=Kt;exports._sfc_main$3=ro;exports._sfc_main$4=$e;exports._sfc_main$5=Ve;exports._sfc_main$6=Oe;exports._sfc_main$7=bt;exports._sfc_main$8=Et;exports._sfc_main$9=Nt;exports.closeAllOverlayBoxes=Jt;exports.computeAnchoredPosition=ne;exports.headersToCsvColumns=it;exports.mountWindow=ie;exports.nextWindowOrder=se;exports.rowToCsvColumns=ct;exports.showOverlayBox=Qt;exports.useOverlayBox=Zt;exports.useWindowOwner=ce;exports.vueCoreOptionsKey=oe;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digitalwalletcorp/vue-core",
-  "version": "1.3.1",
+  "version": "1.4.1",
   "type": "module",
   "description": "Basic UI components for Vue 3",
   "main": "lib/index.cjs",

package/src/accordion-section.vue

@@ -56,7 +56,7 @@ import type { Component, Slot } from 'vue';
 import { SvgTriangleButton } from '@digitalwalletcorp/vue-svg-icons';
 import LabelIcon from '@/label-icon.vue';
 import { useShrinkable } from '@/internal/use-shrinkable';
-import type { LabelPreset } from '@/types/label-preset';
+import type { LabelPreset } from '@/label-icon.vue';
 
 // 開閉ボタンのアイコンとラベルは別々に決める。どちらも、スロット/ラベルの指定 > プリセット の順で使う
 // 何も指定が無い場合だけ、既定の三角を表示する

package/src/data-table.vue

@@ -19,12 +19,12 @@
 <template>
   <section
     class="dwui-data-table"
-    :class="{ 'dwui-selectable': props.selectable }"
+    :class="{ 'dwui-selectable': settings.selectable }"
   >
     <DataTableControls
-      v-if="props.controls === 'both' || props.controls === 'top'"
+      v-if="settings.controls === 'both' || settings.controls === 'top'"
       v-bind="controlProps"
-      :pagination="props.pagination === 'both' || props.pagination === 'top'"
+      :pagination="settings.pagination === 'both' || settings.pagination === 'top'"
       @emit:change-page="emit('emit:changePage', $event)"
       @emit:change-limit="emit('emit:changeLimit', $event)"
       @emit:download-page="emit('emit:downloadPage')"
@@ -33,14 +33,14 @@
     <div
       ref="refContent"
       class="dwui-data-table-content"
-      :class="[{ 'dwui-loading': props.loading }, props.contentClass]"
-      :style="props.contentStyle"
+      :class="[{ 'dwui-loading': props.loading }, settings.contentClass]"
+      :style="settings.contentStyle"
       tabindex="-1"
       @keydown="onKeyDown"
     >
       <table
-        :class="props.tableClass"
-        :style="props.tableStyle"
+        :class="settings.tableClass"
+        :style="settings.tableStyle"
       >
         <thead ref="refThead">
           <tr>
@@ -57,8 +57,8 @@
               <div class="dwui-data-table-header">
                 <span
                   class="dwui-data-table-sort"
-                  :role="props.sortable ? 'button' : undefined"
-                  :tabindex="props.sortable ? 0 : undefined"
+                  :role="settings.sortable ? 'button' : undefined"
+                  :tabindex="settings.sortable ? 0 : undefined"
                   @click="onClickSort(header)"
                   @keydown.enter.prevent="onClickSort(header)"
                   @keydown.space.prevent="onClickSort(header)"
@@ -76,7 +76,7 @@
                 </span>
               </div>
               <div
-                v-if="props.resizable && index < innerHeaders.length - 1"
+                v-if="settings.resizable && index < innerHeaders.length - 1"
                 class="dwui-data-table-resizer"
                 @pointerdown="onResizeStart($event, index)"
                 @pointermove="onResizing"
@@ -96,7 +96,7 @@
               :selected-index="selectedIndex"
             />
             <tr
-              v-if="props.dataList.length === 0 && props.showNoData"
+              v-if="props.dataList.length === 0 && settings.showNoData"
               class="dwui-data-table-no-data"
             >
               <td :colspan="totalColSize">
@@ -116,9 +116,9 @@
       </div>
     </div>
     <DataTableControls
-      v-if="props.controls === 'both' || props.controls === 'bottom'"
+      v-if="settings.controls === 'both' || settings.controls === 'bottom'"
       v-bind="controlProps"
-      :pagination="props.pagination === 'both' || props.pagination === 'bottom'"
+      :pagination="settings.pagination === 'both' || settings.pagination === 'bottom'"
       @emit:change-page="emit('emit:changePage', $event)"
       @emit:change-limit="emit('emit:changeLimit', $event)"
       @emit:download-page="emit('emit:downloadPage')"
@@ -128,32 +128,130 @@
 </template>
 
 <script setup lang="ts" generic="T">
-import { computed, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue';
-import type { StyleValue } from 'vue';
+import { computed, inject, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue';
+import type { ClassValue, StyleValue } from 'vue';
 import { SvgPointingTriangle } from '@digitalwalletcorp/vue-svg-icons';
 import DataTableControls from '@/internal/data-table-controls.vue';
-import { compareValues, getValueByPath, resolveLabel, stringifyValue } from '@/internal/data-table-value';
-import type { DataTableEmits, DataTableHeader, DataTableLabels, DataTableProps, DataTableResolvedLabels, DataTableSlots, DataTableSortContext } from '@/types/data-table';
+import { compareValues, getValueByPath, resolveLabel, stringifyValue } from '@/helpers/data-table';
+import { vueCoreOptionsKey } from '@/helpers/vue-core-options';
+import type { DataTableOptions } from '@/helpers/vue-core-options';
+import type { DataTableControlsPlacement, DataTableHeader, DataTableLabels, DataTableResolvedLabels, DataTableSortContext, DataTableSortMode } from '@/helpers/data-table';
 
-const props = withDefaults(defineProps<DataTableProps<T>>(), {
+/**
+ * DataTable の props
+ */
+export interface Props<T = unknown> {
+  /** 表示している行のデータ。スロットで描画する行と同じ順に並んでいること */
+  dataList: T[];
+  /** ヘッダ。id は一意であること */
+  headers: DataTableHeader<T>[];
+  /** 読み込み中。true の間は行を描画せず読み込み中の表示を出す */
+  loading?: boolean;
+  /** 総件数。未指定なら dataList の件数 */
+  totalCount?: number;
+  /** 現在ページ(1起点) */
+  current?: number;
+  /** 1ページあたりの表示件数 */
+  limit?: number;
+  /** 1ページあたりの表示件数の上限 */
+  maxLimit?: number;
+  /** ページネーションに並べるページ番号の最大数 */
+  maxPagination?: number;
+  /** 行をクリックで選択できるか */
+  selectable?: boolean;
+  /** コントロールを出す位置 */
+  controls?: DataTableControlsPlacement;
+  /** ページネーションを出す位置。controls が無い側には出ない */
+  pagination?: DataTableControlsPlacement;
+  /** ページダウンロードボタンを表示するか */
+  showDownloadPage?: boolean;
+  /** 全件ダウンロードボタンを表示するか */
+  showDownloadAll?: boolean;
+  /** 総件数を表示するか */
+  showTotal?: boolean;
+  /** 1ページあたりの表示件数の入力を表示するか */
+  showLimit?: boolean;
+  /** ページネーションにページ番号の選択を表示するか */
+  showPageSelect?: boolean;
+  /** dataList が空のときにデータが無い旨の行を表示するか */
+  showNoData?: boolean;
+  /** ヘッダの境界のドラッグで列幅を変えられるか */
+  resizable?: boolean;
+  /** ヘッダのクリックでソートできるか */
+  sortable?: boolean;
+  /** ソートの方式。未指定なら remote */
+  sortMode?: DataTableSortMode;
+  /** テーブルをスクロールする領域に付ける class */
+  contentClass?: ClassValue;
+  /** テーブルをスクロールする領域に付ける style */
+  contentStyle?: StyleValue;
+  /** table に付ける class */
+  tableClass?: ClassValue;
+  /** table に付ける style */
+  tableStyle?: StyleValue;
+  /** 表示する文言。未指定の項目は英語 */
+  labels?: DataTableLabels;
+  /** 総件数の整形。未指定なら en-US の桁区切り。SSR とクライアントで同じ文字列を返すこと */
+  formatTotalCount?: (count: number) => string;
+}
+
+/**
+ * DataTable が発行するイベント
+ */
+export interface Emits<T = unknown> {
+  /** 選択が変わった。クリックでの選択・解除、カーソルキーでの移動、読み込み完了時の解除で発行する。解除は undefined と -1 */
+  (e: 'emit:selectRow', value: T | undefined, index: number): void;
+  /** ソートの条件が変わった。sortMode に関わらず発行する */
+  (e: 'emit:changeSort', context: DataTableSortContext): void;
+  (e: 'emit:updateHeader', headers: DataTableHeader<T>[]): void;
+  (e: 'emit:dblclickRow', value: T, index: number): void;
+  (e: 'emit:changeLimit', limit: number): void;
+  (e: 'emit:changePage', page: number): void;
+  (e: 'emit:downloadPage'): void;
+  (e: 'emit:downloadAll'): void;
+}
+
+/**
+ * DataTable のスロット
+ */
+export interface Slots<T = unknown> {
+  /** 行。tr を rows と同じ順に並べ、tr の click で clickRow(row, index) を呼ぶ */
+  default?(props: {
+    /** 表示する行。sortMode が page のときはソートした順、それ以外は dataList そのもの */
+    rows: T[];
+    /** 行を選択する。選択している行なら選択を解除する */
+    clickRow: (row: T, index: number) => void;
+    /** 行を選択してダブルクリックを通知する */
+    dblclickRow: (row: T, index: number) => void;
+    /** 行のインデックスから、ページをまたいだ1起点の行番号を返す */
+    rowNumber: (index: number) => number;
+    /** 選択している行のインデックス。選択していなければ -1 */
+    selectedIndex: number;
+  }): unknown;
+  /** 読み込み中の表示。未指定なら既定のスピナー */
+  loading?(): unknown;
+}
+
+// 設定の props は未指定を undefined のまま受け、vueCoreOptionsKey の値とライブラリ既定で埋める(boolean が false にならないよう既定を明示する)
+const props = withDefaults(defineProps<Props<T>>(), {
   loading: false,
   totalCount: undefined,
   current: 1,
   limit: 100,
-  maxLimit: 9999,
-  maxPagination: 7,
-  selectable: true,
-  controls: 'both',
-  pagination: 'both',
-  showDownloadPage: true,
-  showDownloadAll: true,
-  showTotal: true,
-  showLimit: true,
-  showPageSelect: false,
-  showNoData: true,
-  resizable: true,
-  sortable: true,
-  sortMode: 'remote',
+  maxLimit: undefined,
+  maxPagination: undefined,
+  selectable: undefined,
+  controls: undefined,
+  pagination: undefined,
+  showDownloadPage: undefined,
+  showDownloadAll: undefined,
+  showTotal: undefined,
+  showLimit: undefined,
+  showPageSelect: undefined,
+  showNoData: undefined,
+  resizable: undefined,
+  sortable: undefined,
+  sortMode: undefined,
   formatTotalCount: undefined,
   contentClass: undefined,
   contentStyle: undefined,
@@ -162,9 +260,11 @@ const props = withDefaults(defineProps<DataTableProps<T>>(), {
   labels: undefined
 });
 
-const emit = defineEmits<DataTableEmits<T>>();
+const emit = defineEmits<Emits<T>>();
 
-defineSlots<DataTableSlots<T>>();
+defineSlots<Slots<T>>();
+
+const appOptions = inject(vueCoreOptionsKey, {});
 
 const refContent = ref<HTMLDivElement>();
 const refThead = ref<HTMLTableSectionElement>();
@@ -186,6 +286,45 @@ const innerHeaders = computed((): DataTableHeader<T>[] => {
   return props.headers.map(header => widths.value[header.id] == null ? header : { ...header, width: widths.value[header.id] });
 });
 
+/** 設定のライブラリ既定。labels は項目ごとに合わせるため別に持つ */
+const DEFAULT_SETTINGS: Omit<DataTableOptions, 'labels'> = {
+  maxLimit: 9999,
+  maxPagination: 7,
+  selectable: true,
+  controls: 'both',
+  pagination: 'both',
+  showDownloadPage: true,
+  showDownloadAll: true,
+  showTotal: true,
+  showLimit: true,
+  showPageSelect: false,
+  showNoData: true,
+  resizable: true,
+  sortable: true,
+  sortMode: 'remote',
+  contentClass: undefined,
+  contentStyle: undefined,
+  tableClass: undefined,
+  tableStyle: undefined,
+  formatTotalCount: undefined
+};
+
+type OptionalSettingKey = 'contentClass' | 'contentStyle' | 'tableClass' | 'tableStyle' | 'formatTotalCount';
+type DataTableSettings = Required<Omit<DataTableOptions, 'labels' | OptionalSettingKey>> & Pick<DataTableOptions, OptionalSettingKey>;
+
+/** 設定。props、vueCoreOptionsKey の dataTable、ライブラリ既定の順に、指定のあるものを使う */
+const settings = computed((): DataTableSettings => {
+  const resolved = { ...DEFAULT_SETTINGS } as DataTableSettings;
+  for (const source of [appOptions.dataTable ?? {}, props]) {
+    for (const key of Object.keys(DEFAULT_SETTINGS) as (keyof typeof DEFAULT_SETTINGS)[]) {
+      if (source[key] !== undefined) {
+        Object.assign(resolved, { [key]: source[key] });
+      }
+    }
+  }
+  return resolved;
+});
+
 const labels = computed((): DataTableResolvedLabels => {
   const merged: Required<DataTableLabels> = {
     totalCount: 'Total',
@@ -201,6 +340,7 @@ const labels = computed((): DataTableResolvedLabels => {
     nextPages: 'Next pages',
     nextPage: 'Next page',
     lastPage: 'Last page',
+    ...appOptions.dataTable?.labels,
     ...props.labels
   };
   const resolved = {} as DataTableResolvedLabels;
@@ -212,22 +352,22 @@ const labels = computed((): DataTableResolvedLabels => {
 });
 
 const limit = computed((): number => {
-  return Math.min(props.limit, props.maxLimit);
+  return Math.min(props.limit, settings.value.maxLimit);
 });
 
 const controlProps = computed(() => {
   return {
-    showTotal: props.showTotal,
-    showLimit: props.showLimit,
-    showPageSelect: props.showPageSelect,
-    showDownloadPage: props.showDownloadPage,
-    showDownloadAll: props.showDownloadAll,
+    showTotal: settings.value.showTotal,
+    showLimit: settings.value.showLimit,
+    showPageSelect: settings.value.showPageSelect,
+    showDownloadPage: settings.value.showDownloadPage,
+    showDownloadAll: settings.value.showDownloadAll,
     current: props.current,
     limit: limit.value,
-    maxLimit: props.maxLimit,
-    maxPagination: props.maxPagination,
+    maxLimit: settings.value.maxLimit,
+    maxPagination: settings.value.maxPagination,
     totalCount: props.totalCount ?? props.dataList.length,
-    formatTotalCount: props.formatTotalCount,
+    formatTotalCount: settings.value.formatTotalCount,
     labels: labels.value
   };
 });
@@ -237,7 +377,7 @@ const selectedRow = shallowRef<T | undefined>(undefined);
 
 /** 表示する行。ページ内ソート中は dataList を並べ替えたコピー、それ以外は dataList そのもの */
 const rows = computed((): T[] => {
-  const header = props.sortMode === 'page' ? props.headers.find(header => header.id === sortKey.value) : undefined;
+  const header = settings.value.sortMode === 'page' ? props.headers.find(header => header.id === sortKey.value) : undefined;
   if (!header) {
     return props.dataList;
   }
@@ -293,7 +433,7 @@ const ariaSort = (id: string): 'ascending' | 'descending' | undefined => {
 };
 
 const caretDirection = (id: string): 'up' | 'down' | undefined => {
-  if (!props.sortable || sortKey.value !== id) {
+  if (!settings.value.sortable || sortKey.value !== id) {
     return undefined;
   }
   return descending.value ? 'down' : 'up';
@@ -356,7 +496,7 @@ const select = (row: T | undefined, index: number): void => {
  * 行を選択する。選択している行なら選択を解除する
  */
 const clickRow = (row: T, index: number): void => {
-  if (!props.selectable) {
+  if (!settings.value.selectable) {
     return;
   }
   if (index === selectedIndex.value) {
@@ -395,7 +535,7 @@ const onKeyDown = (event: KeyboardEvent): void => {
 };
 
 const onClickSort = (header: DataTableHeader<T>): void => {
-  if (!props.sortable || props.dataList.length === 0) {
+  if (!settings.value.sortable || props.dataList.length === 0) {
     return;
   }
   descending.value = sortKey.value === header.id ? !descending.value : false;
@@ -410,7 +550,7 @@ const onClickSort = (header: DataTableHeader<T>): void => {
  * 列幅の変更を始める。すべての列の幅を今の表示幅で固定してから変更する
  */
 const onResizeStart = (event: PointerEvent, index: number): void => {
-  if (!props.resizable) {
+  if (!settings.value.resizable) {
     return;
   }
   event.preventDefault();
@@ -478,7 +618,7 @@ watch(() => props.loading, (newValue, oldValue) => {
   // 読み込みが終わったら、前のデータに対する選択は引き継がない。
   // ページ内ソートも同様だが、remote のソート条件は再取得後も有効なので保つ
   if (oldValue && !newValue) {
-    if (props.sortMode === 'page') {
+    if (settings.value.sortMode === 'page') {
       sortKey.value = '';
       descending.value = false;
     }