@lumal/datav 0.0.1-beta

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Lumal contributors
+
+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,128 @@
+# @lumal/datav
+
+面向 Lumal 驾驶舱的 Vue 3 DataV 组件包。当前版本以 DataV 2.10.0（MIT）为基准，完整重构其 38 个组件的默认几何、动效和 `config` 协议，同时提供更明确的现代 props API。
+
+## 安装
+
+```bash
+pnpm add @lumal/datav vue echarts
+```
+
+```ts
+import { createApp } from 'vue'
+import LumalDatav from '@lumal/datav'
+import '@lumal/datav/style.css'
+
+createApp(App).use(LumalDatav).mount('#app')
+```
+
+组件支持根入口和独立子入口按需导入：
+
+```ts
+import LumalBorderBox from '@lumal/datav/border-box'
+import LumalFlylineChart from '@lumal/datav/flyline-chart'
+import '@lumal/datav/style.css'
+```
+
+### DataV 原生 Charts 与 ECharts 扩展
+
+`config` 直接交给 DataV 2.10.0 使用的 `@jiaminghi/charts` Canvas 运行时：
+
+```vue
+<LumalCharts :config="{ xAxis: { data: ['一', '二'] }, yAxis: { data: 'value' }, series: [{ type: 'line', data: [10, 20] }] }" />
+```
+
+为兼容既有项目，未传 `config` 时仍可用 ECharts 原生 `option`：
+
+```vue
+<LumalCharts
+  :option="option"
+  theme="dark"
+  :init-options="{ renderer: 'canvas', devicePixelRatio: 2 }"
+  :set-option-options="{ notMerge: false, lazyUpdate: true }"
+  :events="{ legendselectchanged: handleLegendChange }"
+  @click="handleChartClick"
+/>
+```
+
+`autoResize` 对两种运行时都有效；`theme`、事件、loading 与 ECharts 实例方法仅属于 `option` 扩展模式。组件 ref 提供 `getInstance()`、`getNativeInstance()`、`setConfig()`、`setOption()` 与 `resize()`。
+
+## 两套 API
+
+DataV 原生配置可以直接迁移：
+
+```vue
+<LumalDigitalFlop :config="{ number: [1286], content: '{nt} 台', toFixed: 0 }" />
+<LumalScrollBoard :config="{ header: ['区域', '数量'], data: [['甲区', 20]], rowNum: 5 }" />
+```
+
+也可以使用类型更明确的现代 props：
+
+```vue
+<LumalBorderBox :variant="8" :duration="3000">
+  <LumalDigitalFlop :value="1286" suffix=" 台" />
+</LumalBorderBox>
+```
+
+同一字段同时出现时，优先级为：显式现代 props > DataV `config` > DataV 上游默认值。为了避免注入风险，滚动表中的 HTML 字符串按普通文本渲染，不恢复上游 `v-html`；除此之外保留上游公开视觉、几何、动画和事件语义。
+
+## 实现说明
+
+- BorderBox、Decoration、Loading、PercentPond、Flyline 等使用响应式 SVG、CSS 与 SMIL 重构。
+- `LumalWaterLevelPond` 使用响应式 SVG 波浪、裁剪与渐变实现，不依赖 Canvas 运行时。
+- `LumalCharts` 的 `config` 使用 DataV 官方 `@jiaminghi/charts`；既有 `option` API 保留为 ECharts 扩展，两套配置不互转。
+- `LumalActiveRingChart` 在 ECharts 兼容层中模拟每个数据项独立半径，保持上游固定线宽与切换几何。
+- 连续动画支持页面隐藏、离开视口、悬停、键盘焦点和 `prefers-reduced-motion` 暂停。
+- ResizeObserver 通过 `requestAnimationFrame` 合并；数字动画和定时器会在更新或卸载时立即清理。
+- 滚动组件使用循环窗口索引，不复制整份数据；现代单行滚动最多渲染 `visibleRows + 1` 行。
+
+## 38 个 DataV 组件映射
+
+| DataV 2.10.0 | @lumal/datav |
+| --- | --- |
+| borderBox1 | `LumalBorderBox variant=1` |
+| borderBox2 | `LumalBorderBox variant=2` |
+| borderBox3 | `LumalBorderBox variant=3` |
+| borderBox4 | `LumalBorderBox variant=4` |
+| borderBox5 | `LumalBorderBox variant=5` |
+| borderBox6 | `LumalBorderBox variant=6` |
+| borderBox7 | `LumalBorderBox variant=7` |
+| borderBox8 | `LumalBorderBox variant=8` |
+| borderBox9 | `LumalBorderBox variant=9` |
+| borderBox10 | `LumalBorderBox variant=10` |
+| borderBox11 | `LumalBorderBox variant=11` |
+| borderBox12 | `LumalBorderBox variant=12` |
+| borderBox13 | `LumalBorderBox variant=13` |
+| decoration1 | `LumalDecoration variant=1` |
+| decoration2 | `LumalDecoration variant=2` |
+| decoration3 | `LumalDecoration variant=3` |
+| decoration4 | `LumalDecoration variant=4` |
+| decoration5 | `LumalDecoration variant=5` |
+| decoration6 | `LumalDecoration variant=6` |
+| decoration7 | `LumalDecoration variant=7` |
+| decoration8 | `LumalDecoration variant=8` |
+| decoration9 | `LumalDecoration variant=9` |
+| decoration10 | `LumalDecoration variant=10` |
+| decoration11 | `LumalDecoration variant=11` |
+| decoration12 | `LumalDecoration variant=12` |
+| fullScreenContainer | `LumalFullScreenContainer` |
+| loading | `LumalLoading` |
+| charts | `LumalCharts` |
+| activeRingChart | `LumalActiveRingChart` |
+| capsuleChart | `LumalCapsuleChart` |
+| waterLevelPond | `LumalWaterLevelPond` |
+| percentPond | `LumalPercentPond` |
+| digitalFlop | `LumalDigitalFlop` |
+| flylineChart | `LumalFlylineChart` |
+| flylineChartEnhanced | `LumalFlylineChartEnhanced` |
+| conicalColumnChart | `LumalConicalColumnChart` |
+| scrollBoard | `LumalScrollBoard` |
+| scrollRankingBoard | `LumalScrollRankingBoard` |
+
+15 个独立入口分别为 `border-box`、`decoration`、`full-screen-container`、`loading`、`charts`、`active-ring-chart`、`capsule-chart`、`water-level-pond`、`percent-pond`、`digital-flop`、`flyline-chart`、`flyline-chart-enhanced`、`conical-column-chart`、`scroll-board` 和 `scroll-ranking-board`。
+
+## 主题变量
+
+组件默认值与 DataV 一致，应用仍可通过 `--lumal-datav-*` 语义变量调整现代 API 外观。Cockpit 应在应用层将这些变量映射到 `--lumal-cockpit-*` 浅色/深色主题。
+
+DataV 仅作为 MIT 许可下的源码、功能和视觉重构基准，版权声明见 [THIRD_PARTY_NOTICES.md](./THIRD_PARTY_NOTICES.md)。

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,37 @@
+# Third-party notices
+
+`@lumal/datav` contains Vue 3 refactors derived from the MIT-licensed DataV component geometry, animation definitions and calculation logic. `LumalCharts` also bundles the MIT-licensed `@jiaminghi/charts` runtime and its CRender dependency for DataV-native chart configuration.
+
+## DataV
+
+- Project: <https://github.com/DataV-Team/Datav>
+- License: MIT
+- Copyright: Copyright (c) 2019-present, DataV-Team
+
+The DataV project is distributed under the MIT license. Its required notice follows.
+
+The same notice applies to `@jiaminghi/charts`; `@jiaminghi/c-render` is MIT licensed, Copyright (c) 2019-present, JiaMing.
+
+```text
+The MIT License (MIT)
+
+Copyright (c) 2019-present, DataV-Team
+
+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/dist/LumalActiveRingChart-BZAnPotP.js

@@ -0,0 +1 @@
+import{t as e}from"./LumalCharts-Dzb92It8.js";import{t as a}from"./useElementSize-CKA7EtNB.js";import{t}from"./useReducedMotion-DrRe5YGn.js";import{t as i}from"./_plugin-vue_export-helper-DgLP3hnZ.js";import{t as l}from"./LumalDigitalFlop-BCwB_0xK.js";import{Fragment as n,computed as o,createElementBlock as u,createElementVNode as r,createVNode as v,defineComponent as c,mergeModels as s,normalizeStyle as m,onBeforeUnmount as f,onMounted as d,openBlock as p,renderList as g,shallowRef as b,toDisplayString as y,useModel as h,useTemplateRef as k,watch as x}from"vue";var F=["aria-label","data-active-index"],L={class:"active-ring-info"},S=["aria-label"],C=["aria-label","aria-selected","onClick"],_=/*#__PURE__*/i(/*@__PURE__*/c({__name:"LumalActiveRingChart",props:/*@__PURE__*/s({items:{default:void 0},config:{default:()=>({})},interval:{default:void 0},autoplay:{type:Boolean,default:!0},ariaLabel:{default:"活动环图"}},{activeKey:{},activeKeyModifiers:{}}),emits:/*@__PURE__*/s(["select"],["update:activeKey"]),setup(i,{emit:c}){const s=["#37a2da","#32c5e9","#67e0e3","#9fe6b8","#ffdb5c","#ff9f7f","#fb7293","#e062ae","#e690d1","#e7bcf3","#9d96f5","#8378ea","#96bfff"],_=i,$=c,j=h(i,"activeKey"),w=k("chartHostRef"),z=a(w),M=t(),R=b(0);let K;const T=o(()=>void 0!==_.items?_.items.map(e=>({data:{name:e.label,value:e.value},item:e})):(_.config.data??[{name:"",value:0}]).map((e,a)=>({data:{...e},item:{key:"string"==typeof e.key||"number"==typeof e.key?e.key:e.name||a,label:e.name,value:e.value}}))),I=o(()=>_.config.color??_.items?.map((e,a)=>e.color??s[a%s.length])??s),O=o(()=>_.config.lineWidth??20),H=o(()=>T.value[R.value]),U=o(()=>{const e=H.value?.data.value??0;if(_.config.showOriginValue)return e;const a=T.value.reduce((e,a)=>e+a.data.value,0);return a?e/a*100:0}),V=o(()=>({fill:"#fff",fontSize:25,..._.config.digitalFlopStyle})),A=o(()=>({animationCurve:_.config.animationCurve??"easeOutCubic",animationFrame:_.config.animationFrame??50,content:_.config.showOriginValue?`{nt}${_.config.digitalFlopUnit??""}`:`{nt}${_.config.digitalFlopUnit||"%"}`,number:[U.value],style:V.value,toFixed:_.config.digitalFlopToFixed??0})),B=o(()=>({fontSize:`${V.value.fontSize}px`}));function D(e,a){const t=e??a,i=Math.min(z.value.width,z.value.height)/2;return"number"==typeof t?t:Number.parseFloat(t)/100*i}const E=o(()=>{const e=D(_.config.radius,"50%"),a=D(_.config.activeRadius,"55%"),t=O.value/2,i=T.value.map((e,a)=>({name:e.data.name,value:e.data.value,itemStyle:{color:I.value[a%I.value.length],opacity:a===R.value?0:1}})),l=i.map((e,a)=>({...e,itemStyle:{...e.itemStyle,opacity:a===R.value?1:0}})),n={animation:!M.value,center:["50%","50%"],label:{show:!1},labelLine:{show:!1},silent:!0,type:"pie"};return{animation:!M.value,color:[...I.value],series:[{...n,data:i,radius:[Math.max(0,e-t),e+t]},{...n,data:l,radius:[Math.max(0,a-t),a+t],z:2}]}});function G(e,a=!1){const t=T.value[e];t&&(R.value=e,j.value=t.item.key,a&&$("select",t.item))}const N=o(()=>_.interval??_.config.activeTimeGap??3e3),W=o(()=>_.autoplay&&N.value>0&&T.value.length>1&&!M.value);function q(){void 0!==K&&clearTimeout(K),K=void 0}function J(){q(),W.value&&(K=setTimeout(()=>{T.value.length>1&&G((R.value+1)%T.value.length),J()},N.value))}return x(()=>j.value,e=>{const a=T.value.findIndex(a=>a.item.key===e);a>=0&&(R.value=a)}),x([()=>_.config,()=>_.items],function(){const e=T.value.findIndex(e=>e.item.key===j.value);R.value=e>=0?e:0}),x([W,N],J),d(J),f(q),(a,t)=>(p(),u("div",{class:"dv-active-ring-chart",role:"group","aria-label":i.ariaLabel,"data-active-index":R.value},[r("div",{ref_key:"chartHostRef",ref:w,class:"active-ring-chart-container"},[v(e,{option:E.value,"aria-label":i.ariaLabel},null,8,["option","aria-label"])],512),r("div",L,[v(l,{class:"dv-digital-flop",config:A.value},null,8,["config"]),r("div",{class:"active-ring-name",style:m(B.value)},y(H.value?.item.label??""),5)]),r("div",{class:"lumal-active-ring-controls",role:"listbox","aria-label":`${i.ariaLabel}数据项`},[(p(!0),u(n,null,g(T.value,(e,a)=>(p(),u("button",{key:e.item.key,type:"button",role:"option","aria-label":`${e.item.label} ${e.item.value}`,"aria-selected":a===R.value,onClick:e=>G(a,!0)},y(e.item.label),9,C))),128))],8,S)],8,F))}}),[["__scopeId","data-v-914d22a4"]]);export{_ as t};

package/dist/LumalActiveRingChart-DAgLadE-.cjs

@@ -0,0 +1 @@
+const e=require("./LumalCharts-6FM9fUmp.cjs"),a=require("./useElementSize-CZjD5sCp.cjs"),t=require("./useReducedMotion-B0VTSXyW.cjs"),l=require("./_plugin-vue_export-helper-BXystuG9.cjs"),i=require("./LumalDigitalFlop-D_s0BSsf.cjs");let o=require("vue");var n=["aria-label","data-active-index"],u={class:"active-ring-info"},c=["aria-label"],r=["aria-label","aria-selected","onClick"],d=(0,o.defineComponent)({__name:"LumalActiveRingChart",props:(0,o.mergeModels)({items:{default:void 0},config:{default:()=>({})},interval:{default:void 0},autoplay:{type:Boolean,default:!0},ariaLabel:{default:"活动环图"}},{activeKey:{},activeKeyModifiers:{}}),emits:(0,o.mergeModels)(["select"],["update:activeKey"]),setup(l,{emit:d}){const v=["#37a2da","#32c5e9","#67e0e3","#9fe6b8","#ffdb5c","#ff9f7f","#fb7293","#e062ae","#e690d1","#e7bcf3","#9d96f5","#8378ea","#96bfff"],m=l,s=d,f=(0,o.useModel)(l,"activeKey"),p=(0,o.useTemplateRef)("chartHostRef"),g=a.useElementSize(p),b=t.useReducedMotion(),y=(0,o.shallowRef)(0);let h;const k=(0,o.computed)(()=>void 0!==m.items?m.items.map(e=>({data:{name:e.label,value:e.value},item:e})):(m.config.data??[{name:"",value:0}]).map((e,a)=>({data:{...e},item:{key:"string"==typeof e.key||"number"==typeof e.key?e.key:e.name||a,label:e.name,value:e.value}}))),_=(0,o.computed)(()=>m.config.color??m.items?.map((e,a)=>e.color??v[a%v.length])??v),x=(0,o.computed)(()=>m.config.lineWidth??20),F=(0,o.computed)(()=>k.value[y.value]),L=(0,o.computed)(()=>{const e=F.value?.data.value??0;if(m.config.showOriginValue)return e;const a=k.value.reduce((e,a)=>e+a.data.value,0);return a?e/a*100:0}),S=(0,o.computed)(()=>({fill:"#fff",fontSize:25,...m.config.digitalFlopStyle})),C=(0,o.computed)(()=>({animationCurve:m.config.animationCurve??"easeOutCubic",animationFrame:m.config.animationFrame??50,content:m.config.showOriginValue?`{nt}${m.config.digitalFlopUnit??""}`:`{nt}${m.config.digitalFlopUnit||"%"}`,number:[L.value],style:S.value,toFixed:m.config.digitalFlopToFixed??0})),M=(0,o.computed)(()=>({fontSize:`${S.value.fontSize}px`}));function w(e,a){const t=e??a,l=Math.min(g.value.width,g.value.height)/2;return"number"==typeof t?t:Number.parseFloat(t)/100*l}const E=(0,o.computed)(()=>{const e=w(m.config.radius,"50%"),a=w(m.config.activeRadius,"55%"),t=x.value/2,l=k.value.map((e,a)=>({name:e.data.name,value:e.data.value,itemStyle:{color:_.value[a%_.value.length],opacity:a===y.value?0:1}})),i=l.map((e,a)=>({...e,itemStyle:{...e.itemStyle,opacity:a===y.value?1:0}})),o={animation:!b.value,center:["50%","50%"],label:{show:!1},labelLine:{show:!1},silent:!0,type:"pie"};return{animation:!b.value,color:[..._.value],series:[{...o,data:l,radius:[Math.max(0,e-t),e+t]},{...o,data:i,radius:[Math.max(0,a-t),a+t],z:2}]}});function R(e,a=!1){const t=k.value[e];t&&(y.value=e,f.value=t.item.key,a&&s("select",t.item))}const B=(0,o.computed)(()=>m.interval??m.config.activeTimeGap??3e3),V=(0,o.computed)(()=>m.autoplay&&B.value>0&&k.value.length>1&&!b.value);function z(){void 0!==h&&clearTimeout(h),h=void 0}function N(){z(),V.value&&(h=setTimeout(()=>{k.value.length>1&&R((y.value+1)%k.value.length),N()},B.value))}return(0,o.watch)(()=>f.value,e=>{const a=k.value.findIndex(a=>a.item.key===e);a>=0&&(y.value=a)}),(0,o.watch)([()=>m.config,()=>m.items],function(){const e=k.value.findIndex(e=>e.item.key===f.value);y.value=e>=0?e:0}),(0,o.watch)([V,B],N),(0,o.onMounted)(N),(0,o.onBeforeUnmount)(z),(a,t)=>((0,o.openBlock)(),(0,o.createElementBlock)("div",{class:"dv-active-ring-chart",role:"group","aria-label":l.ariaLabel,"data-active-index":y.value},[(0,o.createElementVNode)("div",{ref_key:"chartHostRef",ref:p,class:"active-ring-chart-container"},[(0,o.createVNode)(e.LumalCharts_default,{option:E.value,"aria-label":l.ariaLabel},null,8,["option","aria-label"])],512),(0,o.createElementVNode)("div",u,[(0,o.createVNode)(i.LumalDigitalFlop_default,{class:"dv-digital-flop",config:C.value},null,8,["config"]),(0,o.createElementVNode)("div",{class:"active-ring-name",style:(0,o.normalizeStyle)(M.value)},(0,o.toDisplayString)(F.value?.item.label??""),5)]),(0,o.createElementVNode)("div",{class:"lumal-active-ring-controls",role:"listbox","aria-label":`${l.ariaLabel}数据项`},[((0,o.openBlock)(!0),(0,o.createElementBlock)(o.Fragment,null,(0,o.renderList)(k.value,(e,a)=>((0,o.openBlock)(),(0,o.createElementBlock)("button",{key:e.item.key,type:"button",role:"option","aria-label":`${e.item.label} ${e.item.value}`,"aria-selected":a===y.value,onClick:e=>R(a,!0)},(0,o.toDisplayString)(e.item.label),9,r))),128))],8,c)],8,n))}}),v=l._plugin_vue_export_helper_default(d,[["__scopeId","data-v-914d22a4"]]);Object.defineProperty(exports,"LumalActiveRingChart_default",{enumerable:!0,get:function(){return v}});

package/dist/LumalBorderBox-DSHHbgJu.cjs

@@ -0,0 +1 @@
+const e=require("./useElementSize-CZjD5sCp.cjs"),l=require("./useReducedMotion-B0VTSXyW.cjs"),a=require("./useAnimationPause-DP4oaEoq.cjs");let t=require("vue");var o=0,u=["data-variant"],n=["height","width","viewBox","preserveAspectRatio"],r=["fill","points"],i=["fill","points"],v=["stroke","points"],s=["stroke","points"],$=["fill"],d=["fill","cx"],c=["fill","cx","cy"],p=["fill","cy"],m=["fill","points"],f=["stroke","points"],k=["stroke","points"],b=["stroke","points"],E=["stroke","points"],N=["fill","points"],V=["stroke","points"],y=["stroke","points"],h=["stroke","points"],g=["stroke"],x=["stroke"],_=["stroke"],B=["stroke"],L=["stroke"],w=["stroke","points"],W=["stroke","points"],C=["fill","points"],M=["stroke","points"],F=["stroke","points"],R=["stroke","points"],S=["stroke","points"],G=["stroke","points"],A=["stroke","points"],Q=["fill","points"],z=["fill"],j=["fill","cx"],q=["fill","cx","cy"],T=["fill","cy"],D=["stroke","points"],P=["stroke","points"],I=["stroke","points"],O=["stroke","points"],H=["stroke"],J=["stroke"],K=["stroke","points"],U=["stroke","points"],X=["stroke","points"],Y=["stroke","points"],Z=["stroke","points"],ee=["stroke","points"],le=["stroke"],ae=["stroke","points"],te=["stroke","points"],oe=["stroke","points"],ue=["stroke"],ne=["stroke","points"],re=["stroke","points"],ie=["stroke","points"],ve=["d"],se=["fill"],$e=["dur","path"],de=["fill","points"],ce=["href","stroke"],pe=["href","mask","stroke"],me=["dur","from","to"],fe=["dur"],ke=["dur"],be=["stop-color"],Ee=["dur","values"],Ne=["stop-color"],Ve=["dur","values"],ye=["points"],he=["points"],ge=["points"],xe=["points"],_e=["points"],Be=["points"],Le=["points"],we=["points"],We=["points"],Ce=["fill","points"],Me=["fill","height","mask","width"],Fe=["fill","points"],Re=["transform"],Se=["fill"],Ge=["flood-color"],Ae=["fill","points"],Qe=["filter","points","stroke"],ze=["points","stroke"],je=["points","stroke"],qe=["fill","filter","points","stroke"],Te=["fill","filter","opacity","points"],De=["dur","values"],Pe=["fill","filter","opacity","points"],Ie=["dur","values"],Oe=["x"],He=["fill","filter","points"],Je=["fill","filter","points"],Ke=["flood-color"],Ue=["dur"],Xe=["d","fill","stroke"],Ye=["filter","stroke"],Ze=["d","filter","stroke"],el=["d","filter","stroke"],ll=["d","filter","stroke"],al=["d","fill","stroke"],tl=["stroke"],ol=["stroke"],ul=["d","stroke"],nl=["fill"],rl=["dur","values"],il=["fill"],vl=["dur","values"],sl=["fill"],$l=["dur","values"],dl={class:"lumal-border-box__content"},cl=(0,t.defineComponent)({__name:"LumalBorderBox",props:{variant:{default:1},color:{},colors:{default:void 0},backgroundColor:{},background:{default:"transparent"},dur:{},duration:{default:void 0},reverse:{type:Boolean,default:!1},title:{default:""},titleWidth:{default:250}},setup(cl){const pl=cl,ml={1:["#4fd2dd","#235fa7"],2:["#fff","rgba(255, 255, 255, 0.6)"],3:["#2862b7","#2862b7"],4:["red","rgba(0,0,255,0.8)"],5:["rgba(255, 255, 255, 0.35)","rgba(255, 255, 255, 0.20)"],6:["rgba(255, 255, 255, 0.35)","gray"],7:["rgba(128,128,128,0.3)","rgba(128,128,128,0.5)"],8:["#235fa7","#4fd2dd"],9:["#11eefd","#0078d2"],10:["#1d48c4","#d3e1f8"],11:["#8aaafb","#1f33a2"],12:["#2e6099","#7ce7fd"],13:["#6586ec","#2cf7fe"]},fl={1:1e3,8:3e3,9:1e4,11:2e3,12:3e3},kl=(0,t.useTemplateRef)("rootRef"),bl=(0,t.useTemplateRef)("svgRef"),El=e.useElementSize(kl),Nl={4:[680,240]},Vl=(0,t.computed)(()=>pl.variant in Nl),yl=(0,t.computed)(()=>El.value.width),hl=(0,t.computed)(()=>El.value.height),gl=(0,t.computed)(()=>Nl[pl.variant]?.[0]??yl.value),xl=(0,t.computed)(()=>Nl[pl.variant]?.[1]??hl.value),_l=(0,t.computed)(()=>Vl.value?`0 0 ${gl.value} ${xl.value}`:void 0),Bl=(0,t.computed)(()=>Vl.value?"none":void 0),Ll=(0,t.shallowRef)(!1),wl=(0,t.shallowRef)(!1),Wl=a.useAnimationPause(kl),Cl=l.useReducedMotion(),Ml=(0,t.computed)(()=>Wl.value||Cl.value||Ll.value||wl.value),Fl=(0,t.computed)(()=>{const e=ml[pl.variant],l=pl.color??pl.colors;return[l?.[0]??e[0],l?.[1]??e[1]]}),Rl=(0,t.computed)(()=>Fl.value[0]),Sl=(0,t.computed)(()=>Fl.value[1]),Gl=(0,t.computed)(()=>pl.backgroundColor??pl.background),Al=(0,t.computed)(()=>Math.max(1,pl.duration??(8===pl.variant&&void 0!==pl.dur?1e3*pl.dur:void 0)??fl[pl.variant]??3e3)),Ql=(0,t.computed)(()=>Al.value/1e3+"s"),zl=(0,t.computed)(()=>Al.value/2e3+"s"),jl=(0,t.computed)(()=>2*(gl.value+xl.value-5)),ql=(0,t.computed)(()=>pl.reverse?`M 2.5, 2.5 L 2.5, ${xl.value-2.5} L ${gl.value-2.5}, ${xl.value-2.5} L ${gl.value-2.5}, 2.5 L 2.5, 2.5`:`M2.5, 2.5 L${gl.value-2.5}, 2.5 L${gl.value-2.5}, ${xl.value-2.5} L2.5, ${xl.value-2.5} L2.5, 2.5`),Tl=(Dl=(0,t.useId)(),o+=1,`lumal-border-box-${Dl.replace(/[^\w-]/g,"")}-${o}`);var Dl;const Pl=`${Tl}-path`,Il=`${Tl}-gradient`,Ol=`${Tl}-mask`,Hl=`${Tl}-filter`,Jl=(0,t.computed)(()=>{const e={"--lumal-datav-background":Gl.value,"--lumal-datav-duration":`${Al.value}ms`,"--lumal-datav-primary":Rl.value,"--lumal-datav-secondary":Sl.value};return 7===pl.variant?(e.backgroundColor=Gl.value,e.border=`1px solid ${Rl.value}`,e.boxShadow=`inset 0 0 40px ${Rl.value}`):10===pl.variant&&(e.boxShadow=`inset 0 0 25px 3px ${Rl.value}`),e}),Kl=(0,t.computed)(()=>["",`translate(${gl.value} 0) scale(-1 1)`,`translate(0 ${xl.value}) scale(1 -1)`,`translate(${gl.value} ${xl.value}) scale(-1 -1)`]),Ul=["left-top","right-top","left-bottom","right-bottom"];function Xl(e){return[1,.7,.5][e-1]??.5}function Yl(e){return[.7,.4,.2][e-1]??.2}function Zl(){Ll.value=!0}function ea(){Ll.value=!1}function la(){wl.value=!0}function aa(e){kl.value?.contains(e.relatedTarget)||(wl.value=!1)}function ta(e,l){l&&(e?l.pauseAnimations?.():l.unpauseAnimations?.())}return(0,t.watch)([Ml,bl],([e,l])=>{(0,t.nextTick)(()=>ta(e,l))},{flush:"post"}),(0,t.onMounted)(()=>{ta(Ml.value,bl.value)}),(e,l)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",{ref_key:"rootRef",ref:kl,class:(0,t.normalizeClass)(["lumal-border-box",{"is-animation-paused":Ml.value,"is-reverse":cl.reverse}]),"data-variant":cl.variant,style:(0,t.normalizeStyle)(Jl.value),onMouseenter:Zl,onMouseleave:ea,onFocusin:la,onFocusout:aa},[((0,t.openBlock)(),(0,t.createElementBlock)("svg",{ref_key:"svgRef",ref:bl,"aria-hidden":"true",class:(0,t.normalizeClass)(["lumal-border-box__svg",{"is-frame-reverse":cl.reverse&&(4===cl.variant||5===cl.variant)}]),focusable:"false",height:Vl.value?void 0:xl.value,width:Vl.value?void 0:gl.value,viewBox:_l.value,preserveAspectRatio:Bl.value},[1===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)("polygon",{key:0,fill:Gl.value,points:`10, 27 10, ${xl.value-27} 13, ${xl.value-24} 13, ${xl.value-21} 24, ${xl.value-11}\n          38, ${xl.value-11} 41, ${xl.value-8} 73, ${xl.value-8} 75, ${xl.value-10} 81, ${xl.value-10}\n          85, ${xl.value-6} ${gl.value-85}, ${xl.value-6} ${gl.value-81}, ${xl.value-10} ${gl.value-75}, ${xl.value-10}\n          ${gl.value-73}, ${xl.value-8} ${gl.value-41}, ${xl.value-8} ${gl.value-38}, ${xl.value-11}\n          ${gl.value-24}, ${xl.value-11} ${gl.value-13}, ${xl.value-21} ${gl.value-13}, ${xl.value-24}\n          ${gl.value-10}, ${xl.value-27} ${gl.value-10}, 27 ${gl.value-13}, 25 ${gl.value-13}, 21\n          ${gl.value-24}, 11 ${gl.value-38}, 11 ${gl.value-41}, 8 ${gl.value-73}, 8 ${gl.value-75}, 10\n          ${gl.value-81}, 10 ${gl.value-85}, 6 85, 6 81, 10 75, 10 73, 8 41, 8 38, 11 24, 11 13, 21 13, 24`},null,8,r)):2===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:1},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`7, 7 ${gl.value-7}, 7 ${gl.value-7}, ${xl.value-7} 7, ${xl.value-7}`},null,8,i),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`2, 2 ${gl.value-2}, 2 ${gl.value-2}, ${xl.value-2} 2, ${xl.value-2} 2, 2`},null,8,v),(0,t.createElementVNode)("polyline",{stroke:Sl.value,points:`6, 6 ${gl.value-6}, 6 ${gl.value-6}, ${xl.value-6} 6, ${xl.value-6} 6, 6`},null,8,s),(0,t.createElementVNode)("circle",{fill:Rl.value,cx:"11",cy:"11",r:"1"},null,8,$),(0,t.createElementVNode)("circle",{fill:Rl.value,cx:gl.value-11,cy:"11",r:"1"},null,8,d),(0,t.createElementVNode)("circle",{fill:Rl.value,cx:gl.value-11,cy:xl.value-11,r:"1"},null,8,c),(0,t.createElementVNode)("circle",{fill:Rl.value,cx:"11",cy:xl.value-11,r:"1"},null,8,p)],64)):3===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:2},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`23, 23 ${gl.value-24}, 23 ${gl.value-24}, ${xl.value-24} 23, ${xl.value-24}`},null,8,m),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb3-line1",stroke:Rl.value,points:`4, 4 ${gl.value-22}, 4 ${gl.value-22}, ${xl.value-22} 4, ${xl.value-22} 4, 4`},null,8,f),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb3-line2",stroke:Sl.value,points:`10, 10 ${gl.value-16}, 10 ${gl.value-16}, ${xl.value-16} 10, ${xl.value-16} 10, 10`},null,8,k),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb3-line2",stroke:Sl.value,points:`16, 16 ${gl.value-10}, 16 ${gl.value-10}, ${xl.value-10} 16, ${xl.value-10} 16, 16`},null,8,b),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb3-line2",stroke:Sl.value,points:`22, 22 ${gl.value-4}, 22 ${gl.value-4}, ${xl.value-4} 22, ${xl.value-4} 22, 22`},null,8,E)],64)):4===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:3},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`${gl.value-15}, 22 170, 22 150, 7 40, 7 28, 21 32, 24\n          16, 42 16, ${xl.value-32} 41, ${xl.value-7} ${gl.value-15}, ${xl.value-7}`},null,8,N),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line1",stroke:Rl.value,points:`145, ${xl.value-5} 40, ${xl.value-5} 10, ${xl.value-35} 10, 40 40, 5 150, 5 170, 20 ${gl.value-15}, 20`},null,8,V),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line2",stroke:Sl.value,points:`245, ${xl.value-1} 36, ${xl.value-1} 14, ${xl.value-23} 14, ${xl.value-100}`},null,8,y),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line3",stroke:Rl.value,points:`7, ${xl.value-40} 7, ${xl.value-75}`},null,8,h),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line4",stroke:Rl.value,points:"28, 24 13, 41 13, 64"},null,8,g),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line5",stroke:Rl.value,points:"5, 45 5, 140"},null,8,x),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line6",stroke:Sl.value,points:"14, 75 14, 180"},null,8,_),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line7",stroke:Sl.value,points:"55, 11 147, 11 167, 26 250, 26"},null,8,B),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line8",stroke:Sl.value,points:"158, 5 173, 16"},null,8,L),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line9",stroke:Rl.value,points:`200, 17 ${gl.value-10}, 17`},null,8,w),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb4-line10",stroke:Sl.value,points:`385, 17 ${gl.value-10}, 17`},null,8,W)],64)):5===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:4},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`10, 22 ${gl.value-22}, 22 ${gl.value-22}, ${xl.value-86} ${gl.value-84}, ${xl.value-24} 10, ${xl.value-24}`},null,8,C),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line1",stroke:Rl.value,points:`8, 5 ${gl.value-5}, 5 ${gl.value-5}, ${xl.value-100} ${gl.value-100}, ${xl.value-5} 8, ${xl.value-5} 8, 5`},null,8,M),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line2",stroke:Sl.value,points:`3, 5 ${gl.value-20}, 5 ${gl.value-20}, ${xl.value-60} ${gl.value-74}, ${xl.value-5} 3, ${xl.value-5} 3, 5`},null,8,F),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line3",stroke:Sl.value,points:`50, 13 ${gl.value-35}, 13`},null,8,R),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line4",stroke:Sl.value,points:`15, 20 ${gl.value-35}, 20`},null,8,S),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line5",stroke:Sl.value,points:`15, ${xl.value-20} ${gl.value-110}, ${xl.value-20}`},null,8,G),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb5-line6",stroke:Sl.value,points:`15, ${xl.value-13} ${gl.value-110}, ${xl.value-13}`},null,8,A)],64)):6===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:5},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`9, 7 ${gl.value-9}, 7 ${gl.value-9}, ${xl.value-7} 9, ${xl.value-7}`},null,8,Q),(0,t.createElementVNode)("circle",{fill:Sl.value,cx:"5",cy:"5",r:"2"},null,8,z),(0,t.createElementVNode)("circle",{fill:Sl.value,cx:gl.value-5,cy:"5",r:"2"},null,8,j),(0,t.createElementVNode)("circle",{fill:Sl.value,cx:gl.value-5,cy:xl.value-5,r:"2"},null,8,q),(0,t.createElementVNode)("circle",{fill:Sl.value,cx:"5",cy:xl.value-5,r:"2"},null,8,T),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`10, 4 ${gl.value-10}, 4`},null,8,D),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`10, ${xl.value-4} ${gl.value-10}, ${xl.value-4}`},null,8,P),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:"5, 70 5, "+(xl.value-70)},null,8,I),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`${gl.value-5}, 70 ${gl.value-5}, ${xl.value-70}`},null,8,O),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:"3, 10 3, 50"},null,8,H),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:"7, 30 7, 80"},null,8,J),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`${gl.value-3}, 10 ${gl.value-3}, 50`},null,8,K),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`${gl.value-7}, 30 ${gl.value-7}, 80`},null,8,U),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`3, ${xl.value-10} 3, ${xl.value-50}`},null,8,X),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`7, ${xl.value-30} 7, ${xl.value-80}`},null,8,Y),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`${gl.value-3}, ${xl.value-10} ${gl.value-3}, ${xl.value-50}`},null,8,Z),(0,t.createElementVNode)("polyline",{stroke:Rl.value,points:`${gl.value-7}, ${xl.value-30} ${gl.value-7}, ${xl.value-80}`},null,8,ee)],64)):7===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:6},[(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line2",stroke:Rl.value,points:"0, 25 0, 0 25, 0"},null,8,le),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line2",stroke:Rl.value,points:`${gl.value-25}, 0 ${gl.value}, 0 ${gl.value}, 25`},null,8,ae),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line2",stroke:Rl.value,points:`${gl.value-25}, ${xl.value} ${gl.value}, ${xl.value} ${gl.value}, ${xl.value-25}`},null,8,te),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line2",stroke:Rl.value,points:`0, ${xl.value-25} 0, ${xl.value} 25, ${xl.value}`},null,8,oe),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line5",stroke:Sl.value,points:"0, 10 0, 0 10, 0"},null,8,ue),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line5",stroke:Sl.value,points:`${gl.value-10}, 0 ${gl.value}, 0 ${gl.value}, 10`},null,8,ne),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line5",stroke:Sl.value,points:`${gl.value-10}, ${xl.value} ${gl.value}, ${xl.value} ${gl.value}, ${xl.value-10}`},null,8,re),(0,t.createElementVNode)("polyline",{class:"lumal-border-box__bb7-line5",stroke:Sl.value,points:`0, ${xl.value-10} 0, ${xl.value} 10, ${xl.value}`},null,8,ie)],64)):8===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:7},[(0,t.createElementVNode)("defs",null,[(0,t.createElementVNode)("path",{id:Pl,d:ql.value,fill:"transparent"},null,8,ve),(0,t.createElementVNode)("radialGradient",{id:Il,cx:"50%",cy:"50%",r:"50%"},[...l[0]||(l[0]=[(0,t.createElementVNode)("stop",{offset:"0%","stop-color":"#fff","stop-opacity":"1"},null,-1),(0,t.createElementVNode)("stop",{offset:"100%","stop-color":"#fff","stop-opacity":"0"},null,-1)])]),(0,t.createElementVNode)("mask",{id:Ol},[(0,t.createElementVNode)("circle",{cx:"0",cy:"0",r:"150",fill:`url(#${Il})`},[(0,t.createElementVNode)("animateMotion",{dur:Ql.value,path:ql.value,repeatCount:"indefinite",rotate:"auto"},null,8,$e)],8,se)])]),(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`5, 5 ${gl.value-5}, 5 ${gl.value-5}, ${xl.value-5} 5, ${xl.value-5}`},null,8,de),(0,t.createElementVNode)("use",{href:`#${Pl}`,stroke:Rl.value,"stroke-width":"1"},null,8,ce),(0,t.createElementVNode)("use",{href:`#${Pl}`,mask:`url(#${Ol})`,stroke:Sl.value,"stroke-width":"3"},[(0,t.createElementVNode)("animate",{attributeName:"stroke-dasharray",dur:Ql.value,from:`0, ${jl.value}`,repeatCount:"indefinite",to:`${jl.value}, 0`},null,8,me)],8,pe)],64)):9===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:8},[(0,t.createElementVNode)("defs",null,[(0,t.createElementVNode)("linearGradient",{id:Il,x1:"0%",x2:"100%",y1:"0%",y2:"100%"},[(0,t.createElementVNode)("animate",{attributeName:"x1",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:"0%;100%;0%"},null,8,fe),(0,t.createElementVNode)("animate",{attributeName:"x2",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:"100%;0%;100%"},null,8,ke),(0,t.createElementVNode)("stop",{offset:"0%","stop-color":Rl.value},[(0,t.createElementVNode)("animate",{attributeName:"stop-color",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:`${Rl.value};${Sl.value};${Rl.value}`},null,8,Ee)],8,be),(0,t.createElementVNode)("stop",{offset:"100%","stop-color":Sl.value},[(0,t.createElementVNode)("animate",{attributeName:"stop-color",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:`${Sl.value};${Rl.value};${Sl.value}`},null,8,Ve)],8,Ne)]),(0,t.createElementVNode)("mask",{id:Ol},[(0,t.createElementVNode)("polyline",{fill:"transparent",points:`8, ${.4*xl.value} 8, 3, ${.4*gl.value+7}, 3`,stroke:"#fff","stroke-width":"3"},null,8,ye),(0,t.createElementVNode)("polyline",{fill:"#fff",points:`8, ${.15*xl.value} 8, 3, ${.1*gl.value+7}, 3 ${.1*gl.value}, 8 14, 8 14, ${.15*xl.value-7}`},null,8,he),(0,t.createElementVNode)("polyline",{fill:"transparent",points:`${.5*gl.value}, 3 ${gl.value-3}, 3, ${gl.value-3}, ${.25*xl.value}`,stroke:"#fff","stroke-width":"3"},null,8,ge),(0,t.createElementVNode)("polyline",{fill:"#fff",points:`${.52*gl.value}, 3 ${.58*gl.value}, 3 ${.58*gl.value-7}, 9 ${.52*gl.value+7}, 9`},null,8,xe),(0,t.createElementVNode)("polyline",{fill:"#fff",points:`${.9*gl.value}, 3 ${gl.value-3}, 3 ${gl.value-3}, ${.1*xl.value} ${gl.value-9}, ${.1*xl.value-7} ${gl.value-9}, 9 ${.9*gl.value+7}, 9`},null,8,_e),(0,t.createElementVNode)("polyline",{fill:"transparent",points:`8, ${.5*xl.value} 8, ${xl.value-3} ${.3*gl.value+7}, ${xl.value-3}`,stroke:"#fff","stroke-width":"3"},null,8,Be),(0,t.createElementVNode)("polyline",{fill:"#fff",points:`8, ${.55*xl.value} 8, ${.7*xl.value} 2, ${.7*xl.value-7} 2, ${.55*xl.value+7}`},null,8,Le),(0,t.createElementVNode)("polyline",{fill:"transparent",points:`${.35*gl.value}, ${xl.value-3} ${gl.value-3}, ${xl.value-3} ${gl.value-3}, ${.35*xl.value}`,stroke:"#fff","stroke-width":"3"},null,8,we),(0,t.createElementVNode)("polyline",{fill:"#fff",points:`${.92*gl.value}, ${xl.value-3} ${gl.value-3}, ${xl.value-3} ${gl.value-3}, ${.8*xl.value} ${gl.value-9}, ${.8*xl.value+7} ${gl.value-9}, ${xl.value-9} ${.92*gl.value+7}, ${xl.value-9}`},null,8,We)])]),(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`15, 9 ${.1*gl.value+1}, 9 ${.1*gl.value+4}, 6 ${.52*gl.value+2}, 6\n          ${.52*gl.value+6}, 10 ${.58*gl.value-7}, 10 ${.58*gl.value-2}, 6\n          ${.9*gl.value+2}, 6 ${.9*gl.value+6}, 10 ${gl.value-10}, 10 ${gl.value-10}, ${.1*xl.value-6}\n          ${gl.value-6}, ${.1*xl.value-1} ${gl.value-6}, ${.8*xl.value+1} ${gl.value-10}, ${.8*xl.value+6}\n          ${gl.value-10}, ${xl.value-10} ${.92*gl.value+7}, ${xl.value-10} ${.92*gl.value+2}, ${xl.value-6}\n          11, ${xl.value-6} 11, ${.15*xl.value-2} 15, ${.15*xl.value-7}`},null,8,Ce),(0,t.createElementVNode)("rect",{fill:`url(#${Il})`,height:xl.value,mask:`url(#${Ol})`,width:gl.value,x:"0",y:"0"},null,8,Me)],64)):10===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:9},[(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`4, 0 ${gl.value-4}, 0 ${gl.value}, 4 ${gl.value}, ${xl.value-4} ${gl.value-4}, ${xl.value} 4, ${xl.value} 0, ${xl.value-4} 0, 4`},null,8,Fe),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(Kl.value,(e,l)=>((0,t.openBlock)(),(0,t.createElementBlock)("g",{key:l,transform:e||void 0},[(0,t.createElementVNode)("polygon",{fill:Sl.value,points:"40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"},null,8,Se)],8,Re))),128))],64)):11===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:10},[(0,t.createElementVNode)("defs",null,[(0,t.createElementVNode)("filter",{id:Hl,height:"150%",width:"150%",x:"-25%",y:"-25%"},[l[1]||(l[1]=(0,t.createElementVNode)("feMorphology",{in:"SourceAlpha",operator:"dilate",radius:"2",result:"thicken"},null,-1)),l[2]||(l[2]=(0,t.createElementVNode)("feGaussianBlur",{in:"thicken",result:"blurred",stdDeviation:"3"},null,-1)),(0,t.createElementVNode)("feFlood",{"flood-color":Sl.value,result:"glowColor"},null,8,Ge),l[3]||(l[3]=(0,t.createElementVNode)("feComposite",{in:"glowColor",in2:"blurred",operator:"in",result:"softGlowColored"},null,-1)),l[4]||(l[4]=(0,t.createElementVNode)("feMerge",null,[(0,t.createElementVNode)("feMergeNode",{in:"softGlowColored"}),(0,t.createElementVNode)("feMergeNode",{in:"SourceGraphic"})],-1))])]),(0,t.createElementVNode)("polygon",{fill:Gl.value,points:`20, 32 ${.5*gl.value-cl.titleWidth/2}, 32 ${.5*gl.value-cl.titleWidth/2+20}, 53\n          ${.5*gl.value+cl.titleWidth/2-20}, 53 ${.5*gl.value+cl.titleWidth/2}, 32\n          ${gl.value-20}, 32 ${gl.value-8}, 48 ${gl.value-8}, ${xl.value-25} ${gl.value-20}, ${xl.value-8}\n          20, ${xl.value-8} 8, ${xl.value-25} 8, 50`},null,8,Ae),(0,t.createElementVNode)("polyline",{fill:"none",filter:`url(#${Hl})`,points:`${(gl.value-cl.titleWidth)/2}, 30\n          20, 30 7, 50 7, ${50+(xl.value-167)/2}\n          13, ${55+(xl.value-167)/2} 13, ${135+(xl.value-167)/2}\n          7, ${140+(xl.value-167)/2} 7, ${xl.value-27}\n          20, ${xl.value-7} ${gl.value-20}, ${xl.value-7} ${gl.value-7}, ${xl.value-27}\n          ${gl.value-7}, ${140+(xl.value-167)/2} ${gl.value-13}, ${135+(xl.value-167)/2}\n          ${gl.value-13}, ${55+(xl.value-167)/2} ${gl.value-7}, ${50+(xl.value-167)/2}\n          ${gl.value-7}, 50 ${gl.value-20}, 30 ${(gl.value+cl.titleWidth)/2}, 30\n          ${(gl.value+cl.titleWidth)/2-20}, 7 ${(gl.value-cl.titleWidth)/2+20}, 7\n          ${(gl.value-cl.titleWidth)/2}, 30 ${(gl.value-cl.titleWidth)/2+20}, 52\n          ${(gl.value+cl.titleWidth)/2-20}, 52 ${(gl.value+cl.titleWidth)/2}, 30`,stroke:Rl.value,"stroke-width":"1"},null,8,Qe),(0,t.createElementVNode)("polygon",{fill:"transparent",points:`${(gl.value+cl.titleWidth)/2-5}, 30 ${(gl.value+cl.titleWidth)/2-21}, 11 ${(gl.value+cl.titleWidth)/2-27}, 11 ${(gl.value+cl.titleWidth)/2-8}, 34`,stroke:Rl.value},null,8,ze),(0,t.createElementVNode)("polygon",{fill:"transparent",points:`${(gl.value-cl.titleWidth)/2+5}, 30 ${(gl.value-cl.titleWidth)/2+22}, 49 ${(gl.value-cl.titleWidth)/2+28}, 49 ${(gl.value-cl.titleWidth)/2+8}, 26`,stroke:Rl.value},null,8,je),(0,t.createElementVNode)("polygon",{fill:Sl.value,"fill-opacity":"0.3",filter:`url(#${Hl})`,points:`${(gl.value+cl.titleWidth)/2-11}, 37 ${(gl.value+cl.titleWidth)/2-32}, 11\n          ${(gl.value-cl.titleWidth)/2+23}, 11 ${(gl.value-cl.titleWidth)/2+11}, 23\n          ${(gl.value-cl.titleWidth)/2+33}, 49 ${(gl.value+cl.titleWidth)/2-22}, 49`,stroke:Rl.value},null,8,qe),((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(3,e=>(0,t.createElementVNode)("polygon",{key:`left-${e}`,fill:Rl.value,filter:`url(#${Hl})`,opacity:Xl(e),points:`${(gl.value-cl.titleWidth)/2-10-30*(e-1)}, 37 ${(gl.value-cl.titleWidth)/2-31-30*(e-1)}, 37 ${(gl.value-cl.titleWidth)/2-25-30*(e-1)}, 46 ${(gl.value-cl.titleWidth)/2-4-30*(e-1)}, 46`},[(0,t.createElementVNode)("animate",{attributeName:"opacity",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:`${Xl(e)};${Yl(e)};${Xl(e)}`},null,8,De)],8,Te)),64)),((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(3,e=>(0,t.createElementVNode)("polygon",{key:`right-${e}`,fill:Rl.value,filter:`url(#${Hl})`,opacity:Xl(e),points:`${(gl.value+cl.titleWidth)/2+30+30*(e-1)}, 37 ${(gl.value+cl.titleWidth)/2+9+30*(e-1)}, 37 ${(gl.value+cl.titleWidth)/2+3+30*(e-1)}, 46 ${(gl.value+cl.titleWidth)/2+24+30*(e-1)}, 46`},[(0,t.createElementVNode)("animate",{attributeName:"opacity",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:`${Xl(e)};${Yl(e)};${Xl(e)}`},null,8,Ie)],8,Pe)),64)),(0,t.createElementVNode)("text",{x:gl.value/2,y:"32",fill:"#fff","font-size":"18","text-anchor":"middle","dominant-baseline":"middle"},(0,t.toDisplayString)(cl.title),9,Oe),(0,t.createElementVNode)("polygon",{fill:Rl.value,filter:`url(#${Hl})`,points:`7, ${53+(xl.value-167)/2} 11, ${57+(xl.value-167)/2} 11, ${133+(xl.value-167)/2} 7, ${137+(xl.value-167)/2}`},null,8,He),(0,t.createElementVNode)("polygon",{fill:Rl.value,filter:`url(#${Hl})`,points:`${gl.value-7}, ${53+(xl.value-167)/2} ${gl.value-11}, ${57+(xl.value-167)/2} ${gl.value-11}, ${133+(xl.value-167)/2} ${gl.value-7}, ${137+(xl.value-167)/2}`},null,8,Je)],64)):12===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:11},[(0,t.createElementVNode)("defs",null,[(0,t.createElementVNode)("filter",{id:Hl,height:"150%",width:"150%",x:"-25%",y:"-25%"},[l[5]||(l[5]=(0,t.createElementVNode)("feMorphology",{in:"SourceAlpha",operator:"dilate",radius:"1",result:"thicken"},null,-1)),l[6]||(l[6]=(0,t.createElementVNode)("feGaussianBlur",{in:"thicken",result:"blurred",stdDeviation:"2"},null,-1)),(0,t.createElementVNode)("feFlood",{"flood-color":Sl.value,"flood-opacity":"0.7",result:"glowColor"},[(0,t.createElementVNode)("animate",{attributeName:"flood-opacity",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:"0.7;0.3;0.7"},null,8,Ue)],8,Ke),l[7]||(l[7]=(0,t.createElementVNode)("feComposite",{in:"glowColor",in2:"blurred",operator:"in",result:"softGlowColored"},null,-1)),l[8]||(l[8]=(0,t.createElementVNode)("feMerge",null,[(0,t.createElementVNode)("feMergeNode",{in:"softGlowColored"}),(0,t.createElementVNode)("feMergeNode",{in:"SourceGraphic"})],-1))])]),gl.value&&xl.value?((0,t.openBlock)(),(0,t.createElementBlock)("path",{key:0,d:`M15 5 L ${gl.value-15} 5 Q ${gl.value-5} 5, ${gl.value-5} 15 L ${gl.value-5} ${xl.value-15} Q ${gl.value-5} ${xl.value-5}, ${gl.value-15} ${xl.value-5} L 15, ${xl.value-5} Q 5 ${xl.value-5} 5 ${xl.value-15} L 5 15 Q 5 5 15 5`,fill:Gl.value,stroke:Rl.value,"stroke-width":"2"},null,8,Xe)):(0,t.createCommentVNode)("",!0),(0,t.createElementVNode)("path",{d:"M 20 5 L 15 5 Q 5 5 5 15 L 5 20",fill:"transparent",filter:`url(#${Hl})`,"stroke-linecap":"round",stroke:Sl.value,"stroke-width":"2"},null,8,Ye),(0,t.createElementVNode)("path",{d:`M ${gl.value-20} 5 L ${gl.value-15} 5 Q ${gl.value-5} 5 ${gl.value-5} 15 L ${gl.value-5} 20`,fill:"transparent",filter:`url(#${Hl})`,"stroke-linecap":"round",stroke:Sl.value,"stroke-width":"2"},null,8,Ze),(0,t.createElementVNode)("path",{d:`M ${gl.value-20} ${xl.value-5} L ${gl.value-15} ${xl.value-5} Q ${gl.value-5} ${xl.value-5} ${gl.value-5} ${xl.value-15} L ${gl.value-5} ${xl.value-20}`,fill:"transparent",filter:`url(#${Hl})`,"stroke-linecap":"round",stroke:Sl.value,"stroke-width":"2"},null,8,el),(0,t.createElementVNode)("path",{d:`M 20 ${xl.value-5} L 15 ${xl.value-5} Q 5 ${xl.value-5} 5 ${xl.value-15} L 5 ${xl.value-20}`,fill:"transparent",filter:`url(#${Hl})`,"stroke-linecap":"round",stroke:Sl.value,"stroke-width":"2"},null,8,ll)],64)):((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:12},[(0,t.createElementVNode)("path",{d:`M 5 20 L 5 10 L 12 3 L 60 3 L 68 10 L ${gl.value-20} 10 L ${gl.value-5} 25 L ${gl.value-5} ${xl.value-5} L 20 ${xl.value-5} L 5 ${xl.value-20} L 5 20`,fill:Gl.value,stroke:Rl.value},null,8,al),(0,t.createElementVNode)("path",{d:"M 16 9 L 61 9",fill:"transparent","stroke-dasharray":"10, 5","stroke-linecap":"round",stroke:Rl.value,"stroke-width":"3"},null,8,tl),(0,t.createElementVNode)("path",{d:"M 5 20 L 5 10 L 12 3 L 60 3 L 68 10",fill:"transparent",stroke:Sl.value},null,8,ol),(0,t.createElementVNode)("path",{d:`M ${gl.value-5} ${xl.value-30} L ${gl.value-5} ${xl.value-5} L ${gl.value-30} ${xl.value-5}`,fill:"transparent",stroke:Sl.value},null,8,ul)],64))],10,n)),1===cl.variant?((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:0},(0,t.renderList)(Ul,e=>(0,t.createElementVNode)("svg",{key:e,"aria-hidden":"true",class:(0,t.normalizeClass)(["lumal-border-box__bb1-corner",`lumal-border-box__bb1-corner--${e}`]),focusable:"false",width:"150px",height:"150px"},[(0,t.createElementVNode)("polygon",{fill:Rl.value,points:"6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"},[(0,t.createElementVNode)("animate",{attributeName:"fill",begin:"0s",dur:zl.value,repeatCount:"indefinite",values:`${Rl.value};${Sl.value};${Rl.value}`},null,8,rl)],8,nl),(0,t.createElementVNode)("polygon",{fill:Sl.value,points:"27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8"},[(0,t.createElementVNode)("animate",{attributeName:"fill",begin:"0s",dur:zl.value,repeatCount:"indefinite",values:`${Sl.value};${Rl.value};${Sl.value}`},null,8,vl)],8,il),(0,t.createElementVNode)("polygon",{fill:Rl.value,points:"9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"},[(0,t.createElementVNode)("animate",{attributeName:"fill",begin:"0s",dur:Ql.value,repeatCount:"indefinite",values:`${Rl.value};${Sl.value};transparent`},null,8,$l)],8,sl)],2)),64)):(0,t.createCommentVNode)("",!0),(0,t.createElementVNode)("div",dl,[(0,t.renderSlot)(e.$slots,"default")])],46,u))}});Object.defineProperty(exports,"LumalBorderBox_default",{enumerable:!0,get:function(){return cl}});

package/dist/LumalBorderBox-DZJ3KW8d.js

@@ -0,0 +1 @@
+import{t as l}from"./useElementSize-CKA7EtNB.js";import{t as e}from"./useReducedMotion-DrRe5YGn.js";import{t as a}from"./useAnimationPause-DSOHlI2X.js";import{Fragment as u,computed as t,createCommentVNode as o,createElementBlock as i,createElementVNode as v,defineComponent as n,nextTick as r,normalizeClass as s,normalizeStyle as $,onMounted as p,openBlock as d,renderList as f,renderSlot as b,shallowRef as k,toDisplayString as c,useId as y,useTemplateRef as h,watch as m}from"vue";var g=0,x=["data-variant"],_=["height","width","viewBox","preserveAspectRatio"],L=["fill","points"],W=["fill","points"],w=["stroke","points"],C=["stroke","points"],M=["fill"],N=["fill","cx"],G=["fill","cx","cy"],Q=["fill","cy"],A=["fill","points"],B=["stroke","points"],R=["stroke","points"],S=["stroke","points"],F=["stroke","points"],j=["fill","points"],z=["stroke","points"],D=["stroke","points"],E=["stroke","points"],P=["stroke"],T=["stroke"],q=["stroke"],H=["stroke"],I=["stroke"],J=["stroke","points"],K=["stroke","points"],O=["fill","points"],U=["stroke","points"],V=["stroke","points"],X=["stroke","points"],Y=["stroke","points"],Z=["stroke","points"],ll=["stroke","points"],el=["fill","points"],al=["fill"],ul=["fill","cx"],tl=["fill","cx","cy"],ol=["fill","cy"],il=["stroke","points"],vl=["stroke","points"],nl=["stroke","points"],rl=["stroke","points"],sl=["stroke"],$l=["stroke"],pl=["stroke","points"],dl=["stroke","points"],fl=["stroke","points"],bl=["stroke","points"],kl=["stroke","points"],cl=["stroke","points"],yl=["stroke"],hl=["stroke","points"],ml=["stroke","points"],gl=["stroke","points"],xl=["stroke"],_l=["stroke","points"],Ll=["stroke","points"],Wl=["stroke","points"],wl=["d"],Cl=["fill"],Ml=["dur","path"],Nl=["fill","points"],Gl=["href","stroke"],Ql=["href","mask","stroke"],Al=["dur","from","to"],Bl=["dur"],Rl=["dur"],Sl=["stop-color"],Fl=["dur","values"],jl=["stop-color"],zl=["dur","values"],Dl=["points"],El=["points"],Pl=["points"],Tl=["points"],ql=["points"],Hl=["points"],Il=["points"],Jl=["points"],Kl=["points"],Ol=["fill","points"],Ul=["fill","height","mask","width"],Vl=["fill","points"],Xl=["transform"],Yl=["fill"],Zl=["flood-color"],le=["fill","points"],ee=["filter","points","stroke"],ae=["points","stroke"],ue=["points","stroke"],te=["fill","filter","points","stroke"],oe=["fill","filter","opacity","points"],ie=["dur","values"],ve=["fill","filter","opacity","points"],ne=["dur","values"],re=["x"],se=["fill","filter","points"],$e=["fill","filter","points"],pe=["flood-color"],de=["dur"],fe=["d","fill","stroke"],be=["filter","stroke"],ke=["d","filter","stroke"],ce=["d","filter","stroke"],ye=["d","filter","stroke"],he=["d","fill","stroke"],me=["stroke"],ge=["stroke"],xe=["d","stroke"],_e=["fill"],Le=["dur","values"],We=["fill"],we=["dur","values"],Ce=["fill"],Me=["dur","values"],Ne={class:"lumal-border-box__content"},Ge=/*@__PURE__*/n({__name:"LumalBorderBox",props:{variant:{default:1},color:{},colors:{default:void 0},backgroundColor:{},background:{default:"transparent"},dur:{},duration:{default:void 0},reverse:{type:Boolean,default:!1},title:{default:""},titleWidth:{default:250}},setup(n){const Ge=n,Qe={1:["#4fd2dd","#235fa7"],2:["#fff","rgba(255, 255, 255, 0.6)"],3:["#2862b7","#2862b7"],4:["red","rgba(0,0,255,0.8)"],5:["rgba(255, 255, 255, 0.35)","rgba(255, 255, 255, 0.20)"],6:["rgba(255, 255, 255, 0.35)","gray"],7:["rgba(128,128,128,0.3)","rgba(128,128,128,0.5)"],8:["#235fa7","#4fd2dd"],9:["#11eefd","#0078d2"],10:["#1d48c4","#d3e1f8"],11:["#8aaafb","#1f33a2"],12:["#2e6099","#7ce7fd"],13:["#6586ec","#2cf7fe"]},Ae={1:1e3,8:3e3,9:1e4,11:2e3,12:3e3},Be=h("rootRef"),Re=h("svgRef"),Se=l(Be),Fe={4:[680,240]},je=t(()=>Ge.variant in Fe),ze=t(()=>Se.value.width),De=t(()=>Se.value.height),Ee=t(()=>Fe[Ge.variant]?.[0]??ze.value),Pe=t(()=>Fe[Ge.variant]?.[1]??De.value),Te=t(()=>je.value?`0 0 ${Ee.value} ${Pe.value}`:void 0),qe=t(()=>je.value?"none":void 0),He=k(!1),Ie=k(!1),Je=a(Be),Ke=e(),Oe=t(()=>Je.value||Ke.value||He.value||Ie.value),Ue=t(()=>{const l=Qe[Ge.variant],e=Ge.color??Ge.colors;return[e?.[0]??l[0],e?.[1]??l[1]]}),Ve=t(()=>Ue.value[0]),Xe=t(()=>Ue.value[1]),Ye=t(()=>Ge.backgroundColor??Ge.background),Ze=t(()=>Math.max(1,Ge.duration??(8===Ge.variant&&void 0!==Ge.dur?1e3*Ge.dur:void 0)??Ae[Ge.variant]??3e3)),la=t(()=>Ze.value/1e3+"s"),ea=t(()=>Ze.value/2e3+"s"),aa=t(()=>2*(Ee.value+Pe.value-5)),ua=t(()=>Ge.reverse?`M 2.5, 2.5 L 2.5, ${Pe.value-2.5} L ${Ee.value-2.5}, ${Pe.value-2.5} L ${Ee.value-2.5}, 2.5 L 2.5, 2.5`:`M2.5, 2.5 L${Ee.value-2.5}, 2.5 L${Ee.value-2.5}, ${Pe.value-2.5} L2.5, ${Pe.value-2.5} L2.5, 2.5`),ta=(oa=y(),g+=1,`lumal-border-box-${oa.replace(/[^\w-]/g,"")}-${g}`);var oa;const ia=`${ta}-path`,va=`${ta}-gradient`,na=`${ta}-mask`,ra=`${ta}-filter`,sa=t(()=>{const l={"--lumal-datav-background":Ye.value,"--lumal-datav-duration":`${Ze.value}ms`,"--lumal-datav-primary":Ve.value,"--lumal-datav-secondary":Xe.value};return 7===Ge.variant?(l.backgroundColor=Ye.value,l.border=`1px solid ${Ve.value}`,l.boxShadow=`inset 0 0 40px ${Ve.value}`):10===Ge.variant&&(l.boxShadow=`inset 0 0 25px 3px ${Ve.value}`),l}),$a=t(()=>["",`translate(${Ee.value} 0) scale(-1 1)`,`translate(0 ${Pe.value}) scale(1 -1)`,`translate(${Ee.value} ${Pe.value}) scale(-1 -1)`]),pa=["left-top","right-top","left-bottom","right-bottom"];function da(l){return[1,.7,.5][l-1]??.5}function fa(l){return[.7,.4,.2][l-1]??.2}function ba(){He.value=!0}function ka(){He.value=!1}function ca(){Ie.value=!0}function ya(l){Be.value?.contains(l.relatedTarget)||(Ie.value=!1)}function ha(l,e){e&&(l?e.pauseAnimations?.():e.unpauseAnimations?.())}return m([Oe,Re],([l,e])=>{r(()=>ha(l,e))},{flush:"post"}),p(()=>{ha(Oe.value,Re.value)}),(l,e)=>(d(),i("div",{ref_key:"rootRef",ref:Be,class:s(["lumal-border-box",{"is-animation-paused":Oe.value,"is-reverse":n.reverse}]),"data-variant":n.variant,style:$(sa.value),onMouseenter:ba,onMouseleave:ka,onFocusin:ca,onFocusout:ya},[(d(),i("svg",{ref_key:"svgRef",ref:Re,"aria-hidden":"true",class:s(["lumal-border-box__svg",{"is-frame-reverse":n.reverse&&(4===n.variant||5===n.variant)}]),focusable:"false",height:je.value?void 0:Pe.value,width:je.value?void 0:Ee.value,viewBox:Te.value,preserveAspectRatio:qe.value},[1===n.variant?(d(),i("polygon",{key:0,fill:Ye.value,points:`10, 27 10, ${Pe.value-27} 13, ${Pe.value-24} 13, ${Pe.value-21} 24, ${Pe.value-11}\n          38, ${Pe.value-11} 41, ${Pe.value-8} 73, ${Pe.value-8} 75, ${Pe.value-10} 81, ${Pe.value-10}\n          85, ${Pe.value-6} ${Ee.value-85}, ${Pe.value-6} ${Ee.value-81}, ${Pe.value-10} ${Ee.value-75}, ${Pe.value-10}\n          ${Ee.value-73}, ${Pe.value-8} ${Ee.value-41}, ${Pe.value-8} ${Ee.value-38}, ${Pe.value-11}\n          ${Ee.value-24}, ${Pe.value-11} ${Ee.value-13}, ${Pe.value-21} ${Ee.value-13}, ${Pe.value-24}\n          ${Ee.value-10}, ${Pe.value-27} ${Ee.value-10}, 27 ${Ee.value-13}, 25 ${Ee.value-13}, 21\n          ${Ee.value-24}, 11 ${Ee.value-38}, 11 ${Ee.value-41}, 8 ${Ee.value-73}, 8 ${Ee.value-75}, 10\n          ${Ee.value-81}, 10 ${Ee.value-85}, 6 85, 6 81, 10 75, 10 73, 8 41, 8 38, 11 24, 11 13, 21 13, 24`},null,8,L)):2===n.variant?(d(),i(u,{key:1},[v("polygon",{fill:Ye.value,points:`7, 7 ${Ee.value-7}, 7 ${Ee.value-7}, ${Pe.value-7} 7, ${Pe.value-7}`},null,8,W),v("polyline",{stroke:Ve.value,points:`2, 2 ${Ee.value-2}, 2 ${Ee.value-2}, ${Pe.value-2} 2, ${Pe.value-2} 2, 2`},null,8,w),v("polyline",{stroke:Xe.value,points:`6, 6 ${Ee.value-6}, 6 ${Ee.value-6}, ${Pe.value-6} 6, ${Pe.value-6} 6, 6`},null,8,C),v("circle",{fill:Ve.value,cx:"11",cy:"11",r:"1"},null,8,M),v("circle",{fill:Ve.value,cx:Ee.value-11,cy:"11",r:"1"},null,8,N),v("circle",{fill:Ve.value,cx:Ee.value-11,cy:Pe.value-11,r:"1"},null,8,G),v("circle",{fill:Ve.value,cx:"11",cy:Pe.value-11,r:"1"},null,8,Q)],64)):3===n.variant?(d(),i(u,{key:2},[v("polygon",{fill:Ye.value,points:`23, 23 ${Ee.value-24}, 23 ${Ee.value-24}, ${Pe.value-24} 23, ${Pe.value-24}`},null,8,A),v("polyline",{class:"lumal-border-box__bb3-line1",stroke:Ve.value,points:`4, 4 ${Ee.value-22}, 4 ${Ee.value-22}, ${Pe.value-22} 4, ${Pe.value-22} 4, 4`},null,8,B),v("polyline",{class:"lumal-border-box__bb3-line2",stroke:Xe.value,points:`10, 10 ${Ee.value-16}, 10 ${Ee.value-16}, ${Pe.value-16} 10, ${Pe.value-16} 10, 10`},null,8,R),v("polyline",{class:"lumal-border-box__bb3-line2",stroke:Xe.value,points:`16, 16 ${Ee.value-10}, 16 ${Ee.value-10}, ${Pe.value-10} 16, ${Pe.value-10} 16, 16`},null,8,S),v("polyline",{class:"lumal-border-box__bb3-line2",stroke:Xe.value,points:`22, 22 ${Ee.value-4}, 22 ${Ee.value-4}, ${Pe.value-4} 22, ${Pe.value-4} 22, 22`},null,8,F)],64)):4===n.variant?(d(),i(u,{key:3},[v("polygon",{fill:Ye.value,points:`${Ee.value-15}, 22 170, 22 150, 7 40, 7 28, 21 32, 24\n          16, 42 16, ${Pe.value-32} 41, ${Pe.value-7} ${Ee.value-15}, ${Pe.value-7}`},null,8,j),v("polyline",{class:"lumal-border-box__bb4-line1",stroke:Ve.value,points:`145, ${Pe.value-5} 40, ${Pe.value-5} 10, ${Pe.value-35} 10, 40 40, 5 150, 5 170, 20 ${Ee.value-15}, 20`},null,8,z),v("polyline",{class:"lumal-border-box__bb4-line2",stroke:Xe.value,points:`245, ${Pe.value-1} 36, ${Pe.value-1} 14, ${Pe.value-23} 14, ${Pe.value-100}`},null,8,D),v("polyline",{class:"lumal-border-box__bb4-line3",stroke:Ve.value,points:`7, ${Pe.value-40} 7, ${Pe.value-75}`},null,8,E),v("polyline",{class:"lumal-border-box__bb4-line4",stroke:Ve.value,points:"28, 24 13, 41 13, 64"},null,8,P),v("polyline",{class:"lumal-border-box__bb4-line5",stroke:Ve.value,points:"5, 45 5, 140"},null,8,T),v("polyline",{class:"lumal-border-box__bb4-line6",stroke:Xe.value,points:"14, 75 14, 180"},null,8,q),v("polyline",{class:"lumal-border-box__bb4-line7",stroke:Xe.value,points:"55, 11 147, 11 167, 26 250, 26"},null,8,H),v("polyline",{class:"lumal-border-box__bb4-line8",stroke:Xe.value,points:"158, 5 173, 16"},null,8,I),v("polyline",{class:"lumal-border-box__bb4-line9",stroke:Ve.value,points:`200, 17 ${Ee.value-10}, 17`},null,8,J),v("polyline",{class:"lumal-border-box__bb4-line10",stroke:Xe.value,points:`385, 17 ${Ee.value-10}, 17`},null,8,K)],64)):5===n.variant?(d(),i(u,{key:4},[v("polygon",{fill:Ye.value,points:`10, 22 ${Ee.value-22}, 22 ${Ee.value-22}, ${Pe.value-86} ${Ee.value-84}, ${Pe.value-24} 10, ${Pe.value-24}`},null,8,O),v("polyline",{class:"lumal-border-box__bb5-line1",stroke:Ve.value,points:`8, 5 ${Ee.value-5}, 5 ${Ee.value-5}, ${Pe.value-100} ${Ee.value-100}, ${Pe.value-5} 8, ${Pe.value-5} 8, 5`},null,8,U),v("polyline",{class:"lumal-border-box__bb5-line2",stroke:Xe.value,points:`3, 5 ${Ee.value-20}, 5 ${Ee.value-20}, ${Pe.value-60} ${Ee.value-74}, ${Pe.value-5} 3, ${Pe.value-5} 3, 5`},null,8,V),v("polyline",{class:"lumal-border-box__bb5-line3",stroke:Xe.value,points:`50, 13 ${Ee.value-35}, 13`},null,8,X),v("polyline",{class:"lumal-border-box__bb5-line4",stroke:Xe.value,points:`15, 20 ${Ee.value-35}, 20`},null,8,Y),v("polyline",{class:"lumal-border-box__bb5-line5",stroke:Xe.value,points:`15, ${Pe.value-20} ${Ee.value-110}, ${Pe.value-20}`},null,8,Z),v("polyline",{class:"lumal-border-box__bb5-line6",stroke:Xe.value,points:`15, ${Pe.value-13} ${Ee.value-110}, ${Pe.value-13}`},null,8,ll)],64)):6===n.variant?(d(),i(u,{key:5},[v("polygon",{fill:Ye.value,points:`9, 7 ${Ee.value-9}, 7 ${Ee.value-9}, ${Pe.value-7} 9, ${Pe.value-7}`},null,8,el),v("circle",{fill:Xe.value,cx:"5",cy:"5",r:"2"},null,8,al),v("circle",{fill:Xe.value,cx:Ee.value-5,cy:"5",r:"2"},null,8,ul),v("circle",{fill:Xe.value,cx:Ee.value-5,cy:Pe.value-5,r:"2"},null,8,tl),v("circle",{fill:Xe.value,cx:"5",cy:Pe.value-5,r:"2"},null,8,ol),v("polyline",{stroke:Ve.value,points:`10, 4 ${Ee.value-10}, 4`},null,8,il),v("polyline",{stroke:Ve.value,points:`10, ${Pe.value-4} ${Ee.value-10}, ${Pe.value-4}`},null,8,vl),v("polyline",{stroke:Ve.value,points:"5, 70 5, "+(Pe.value-70)},null,8,nl),v("polyline",{stroke:Ve.value,points:`${Ee.value-5}, 70 ${Ee.value-5}, ${Pe.value-70}`},null,8,rl),v("polyline",{stroke:Ve.value,points:"3, 10 3, 50"},null,8,sl),v("polyline",{stroke:Ve.value,points:"7, 30 7, 80"},null,8,$l),v("polyline",{stroke:Ve.value,points:`${Ee.value-3}, 10 ${Ee.value-3}, 50`},null,8,pl),v("polyline",{stroke:Ve.value,points:`${Ee.value-7}, 30 ${Ee.value-7}, 80`},null,8,dl),v("polyline",{stroke:Ve.value,points:`3, ${Pe.value-10} 3, ${Pe.value-50}`},null,8,fl),v("polyline",{stroke:Ve.value,points:`7, ${Pe.value-30} 7, ${Pe.value-80}`},null,8,bl),v("polyline",{stroke:Ve.value,points:`${Ee.value-3}, ${Pe.value-10} ${Ee.value-3}, ${Pe.value-50}`},null,8,kl),v("polyline",{stroke:Ve.value,points:`${Ee.value-7}, ${Pe.value-30} ${Ee.value-7}, ${Pe.value-80}`},null,8,cl)],64)):7===n.variant?(d(),i(u,{key:6},[v("polyline",{class:"lumal-border-box__bb7-line2",stroke:Ve.value,points:"0, 25 0, 0 25, 0"},null,8,yl),v("polyline",{class:"lumal-border-box__bb7-line2",stroke:Ve.value,points:`${Ee.value-25}, 0 ${Ee.value}, 0 ${Ee.value}, 25`},null,8,hl),v("polyline",{class:"lumal-border-box__bb7-line2",stroke:Ve.value,points:`${Ee.value-25}, ${Pe.value} ${Ee.value}, ${Pe.value} ${Ee.value}, ${Pe.value-25}`},null,8,ml),v("polyline",{class:"lumal-border-box__bb7-line2",stroke:Ve.value,points:`0, ${Pe.value-25} 0, ${Pe.value} 25, ${Pe.value}`},null,8,gl),v("polyline",{class:"lumal-border-box__bb7-line5",stroke:Xe.value,points:"0, 10 0, 0 10, 0"},null,8,xl),v("polyline",{class:"lumal-border-box__bb7-line5",stroke:Xe.value,points:`${Ee.value-10}, 0 ${Ee.value}, 0 ${Ee.value}, 10`},null,8,_l),v("polyline",{class:"lumal-border-box__bb7-line5",stroke:Xe.value,points:`${Ee.value-10}, ${Pe.value} ${Ee.value}, ${Pe.value} ${Ee.value}, ${Pe.value-10}`},null,8,Ll),v("polyline",{class:"lumal-border-box__bb7-line5",stroke:Xe.value,points:`0, ${Pe.value-10} 0, ${Pe.value} 10, ${Pe.value}`},null,8,Wl)],64)):8===n.variant?(d(),i(u,{key:7},[v("defs",null,[v("path",{id:ia,d:ua.value,fill:"transparent"},null,8,wl),v("radialGradient",{id:va,cx:"50%",cy:"50%",r:"50%"},[...e[0]||(e[0]=[v("stop",{offset:"0%","stop-color":"#fff","stop-opacity":"1"},null,-1),v("stop",{offset:"100%","stop-color":"#fff","stop-opacity":"0"},null,-1)])]),v("mask",{id:na},[v("circle",{cx:"0",cy:"0",r:"150",fill:`url(#${va})`},[v("animateMotion",{dur:la.value,path:ua.value,repeatCount:"indefinite",rotate:"auto"},null,8,Ml)],8,Cl)])]),v("polygon",{fill:Ye.value,points:`5, 5 ${Ee.value-5}, 5 ${Ee.value-5}, ${Pe.value-5} 5, ${Pe.value-5}`},null,8,Nl),v("use",{href:`#${ia}`,stroke:Ve.value,"stroke-width":"1"},null,8,Gl),v("use",{href:`#${ia}`,mask:`url(#${na})`,stroke:Xe.value,"stroke-width":"3"},[v("animate",{attributeName:"stroke-dasharray",dur:la.value,from:`0, ${aa.value}`,repeatCount:"indefinite",to:`${aa.value}, 0`},null,8,Al)],8,Ql)],64)):9===n.variant?(d(),i(u,{key:8},[v("defs",null,[v("linearGradient",{id:va,x1:"0%",x2:"100%",y1:"0%",y2:"100%"},[v("animate",{attributeName:"x1",begin:"0s",dur:la.value,repeatCount:"indefinite",values:"0%;100%;0%"},null,8,Bl),v("animate",{attributeName:"x2",begin:"0s",dur:la.value,repeatCount:"indefinite",values:"100%;0%;100%"},null,8,Rl),v("stop",{offset:"0%","stop-color":Ve.value},[v("animate",{attributeName:"stop-color",begin:"0s",dur:la.value,repeatCount:"indefinite",values:`${Ve.value};${Xe.value};${Ve.value}`},null,8,Fl)],8,Sl),v("stop",{offset:"100%","stop-color":Xe.value},[v("animate",{attributeName:"stop-color",begin:"0s",dur:la.value,repeatCount:"indefinite",values:`${Xe.value};${Ve.value};${Xe.value}`},null,8,zl)],8,jl)]),v("mask",{id:na},[v("polyline",{fill:"transparent",points:`8, ${.4*Pe.value} 8, 3, ${.4*Ee.value+7}, 3`,stroke:"#fff","stroke-width":"3"},null,8,Dl),v("polyline",{fill:"#fff",points:`8, ${.15*Pe.value} 8, 3, ${.1*Ee.value+7}, 3 ${.1*Ee.value}, 8 14, 8 14, ${.15*Pe.value-7}`},null,8,El),v("polyline",{fill:"transparent",points:`${.5*Ee.value}, 3 ${Ee.value-3}, 3, ${Ee.value-3}, ${.25*Pe.value}`,stroke:"#fff","stroke-width":"3"},null,8,Pl),v("polyline",{fill:"#fff",points:`${.52*Ee.value}, 3 ${.58*Ee.value}, 3 ${.58*Ee.value-7}, 9 ${.52*Ee.value+7}, 9`},null,8,Tl),v("polyline",{fill:"#fff",points:`${.9*Ee.value}, 3 ${Ee.value-3}, 3 ${Ee.value-3}, ${.1*Pe.value} ${Ee.value-9}, ${.1*Pe.value-7} ${Ee.value-9}, 9 ${.9*Ee.value+7}, 9`},null,8,ql),v("polyline",{fill:"transparent",points:`8, ${.5*Pe.value} 8, ${Pe.value-3} ${.3*Ee.value+7}, ${Pe.value-3}`,stroke:"#fff","stroke-width":"3"},null,8,Hl),v("polyline",{fill:"#fff",points:`8, ${.55*Pe.value} 8, ${.7*Pe.value} 2, ${.7*Pe.value-7} 2, ${.55*Pe.value+7}`},null,8,Il),v("polyline",{fill:"transparent",points:`${.35*Ee.value}, ${Pe.value-3} ${Ee.value-3}, ${Pe.value-3} ${Ee.value-3}, ${.35*Pe.value}`,stroke:"#fff","stroke-width":"3"},null,8,Jl),v("polyline",{fill:"#fff",points:`${.92*Ee.value}, ${Pe.value-3} ${Ee.value-3}, ${Pe.value-3} ${Ee.value-3}, ${.8*Pe.value} ${Ee.value-9}, ${.8*Pe.value+7} ${Ee.value-9}, ${Pe.value-9} ${.92*Ee.value+7}, ${Pe.value-9}`},null,8,Kl)])]),v("polygon",{fill:Ye.value,points:`15, 9 ${.1*Ee.value+1}, 9 ${.1*Ee.value+4}, 6 ${.52*Ee.value+2}, 6\n          ${.52*Ee.value+6}, 10 ${.58*Ee.value-7}, 10 ${.58*Ee.value-2}, 6\n          ${.9*Ee.value+2}, 6 ${.9*Ee.value+6}, 10 ${Ee.value-10}, 10 ${Ee.value-10}, ${.1*Pe.value-6}\n          ${Ee.value-6}, ${.1*Pe.value-1} ${Ee.value-6}, ${.8*Pe.value+1} ${Ee.value-10}, ${.8*Pe.value+6}\n          ${Ee.value-10}, ${Pe.value-10} ${.92*Ee.value+7}, ${Pe.value-10} ${.92*Ee.value+2}, ${Pe.value-6}\n          11, ${Pe.value-6} 11, ${.15*Pe.value-2} 15, ${.15*Pe.value-7}`},null,8,Ol),v("rect",{fill:`url(#${va})`,height:Pe.value,mask:`url(#${na})`,width:Ee.value,x:"0",y:"0"},null,8,Ul)],64)):10===n.variant?(d(),i(u,{key:9},[v("polygon",{fill:Ye.value,points:`4, 0 ${Ee.value-4}, 0 ${Ee.value}, 4 ${Ee.value}, ${Pe.value-4} ${Ee.value-4}, ${Pe.value} 4, ${Pe.value} 0, ${Pe.value-4} 0, 4`},null,8,Vl),(d(!0),i(u,null,f($a.value,(l,e)=>(d(),i("g",{key:e,transform:l||void 0},[v("polygon",{fill:Xe.value,points:"40, 0 5, 0 0, 5 0, 16 3, 19 3, 7 7, 3 35, 3"},null,8,Yl)],8,Xl))),128))],64)):11===n.variant?(d(),i(u,{key:10},[v("defs",null,[v("filter",{id:ra,height:"150%",width:"150%",x:"-25%",y:"-25%"},[e[1]||(e[1]=v("feMorphology",{in:"SourceAlpha",operator:"dilate",radius:"2",result:"thicken"},null,-1)),e[2]||(e[2]=v("feGaussianBlur",{in:"thicken",result:"blurred",stdDeviation:"3"},null,-1)),v("feFlood",{"flood-color":Xe.value,result:"glowColor"},null,8,Zl),e[3]||(e[3]=v("feComposite",{in:"glowColor",in2:"blurred",operator:"in",result:"softGlowColored"},null,-1)),e[4]||(e[4]=v("feMerge",null,[v("feMergeNode",{in:"softGlowColored"}),v("feMergeNode",{in:"SourceGraphic"})],-1))])]),v("polygon",{fill:Ye.value,points:`20, 32 ${.5*Ee.value-n.titleWidth/2}, 32 ${.5*Ee.value-n.titleWidth/2+20}, 53\n          ${.5*Ee.value+n.titleWidth/2-20}, 53 ${.5*Ee.value+n.titleWidth/2}, 32\n          ${Ee.value-20}, 32 ${Ee.value-8}, 48 ${Ee.value-8}, ${Pe.value-25} ${Ee.value-20}, ${Pe.value-8}\n          20, ${Pe.value-8} 8, ${Pe.value-25} 8, 50`},null,8,le),v("polyline",{fill:"none",filter:`url(#${ra})`,points:`${(Ee.value-n.titleWidth)/2}, 30\n          20, 30 7, 50 7, ${50+(Pe.value-167)/2}\n          13, ${55+(Pe.value-167)/2} 13, ${135+(Pe.value-167)/2}\n          7, ${140+(Pe.value-167)/2} 7, ${Pe.value-27}\n          20, ${Pe.value-7} ${Ee.value-20}, ${Pe.value-7} ${Ee.value-7}, ${Pe.value-27}\n          ${Ee.value-7}, ${140+(Pe.value-167)/2} ${Ee.value-13}, ${135+(Pe.value-167)/2}\n          ${Ee.value-13}, ${55+(Pe.value-167)/2} ${Ee.value-7}, ${50+(Pe.value-167)/2}\n          ${Ee.value-7}, 50 ${Ee.value-20}, 30 ${(Ee.value+n.titleWidth)/2}, 30\n          ${(Ee.value+n.titleWidth)/2-20}, 7 ${(Ee.value-n.titleWidth)/2+20}, 7\n          ${(Ee.value-n.titleWidth)/2}, 30 ${(Ee.value-n.titleWidth)/2+20}, 52\n          ${(Ee.value+n.titleWidth)/2-20}, 52 ${(Ee.value+n.titleWidth)/2}, 30`,stroke:Ve.value,"stroke-width":"1"},null,8,ee),v("polygon",{fill:"transparent",points:`${(Ee.value+n.titleWidth)/2-5}, 30 ${(Ee.value+n.titleWidth)/2-21}, 11 ${(Ee.value+n.titleWidth)/2-27}, 11 ${(Ee.value+n.titleWidth)/2-8}, 34`,stroke:Ve.value},null,8,ae),v("polygon",{fill:"transparent",points:`${(Ee.value-n.titleWidth)/2+5}, 30 ${(Ee.value-n.titleWidth)/2+22}, 49 ${(Ee.value-n.titleWidth)/2+28}, 49 ${(Ee.value-n.titleWidth)/2+8}, 26`,stroke:Ve.value},null,8,ue),v("polygon",{fill:Xe.value,"fill-opacity":"0.3",filter:`url(#${ra})`,points:`${(Ee.value+n.titleWidth)/2-11}, 37 ${(Ee.value+n.titleWidth)/2-32}, 11\n          ${(Ee.value-n.titleWidth)/2+23}, 11 ${(Ee.value-n.titleWidth)/2+11}, 23\n          ${(Ee.value-n.titleWidth)/2+33}, 49 ${(Ee.value+n.titleWidth)/2-22}, 49`,stroke:Ve.value},null,8,te),(d(),i(u,null,f(3,l=>v("polygon",{key:`left-${l}`,fill:Ve.value,filter:`url(#${ra})`,opacity:da(l),points:`${(Ee.value-n.titleWidth)/2-10-30*(l-1)}, 37 ${(Ee.value-n.titleWidth)/2-31-30*(l-1)}, 37 ${(Ee.value-n.titleWidth)/2-25-30*(l-1)}, 46 ${(Ee.value-n.titleWidth)/2-4-30*(l-1)}, 46`},[v("animate",{attributeName:"opacity",begin:"0s",dur:la.value,repeatCount:"indefinite",values:`${da(l)};${fa(l)};${da(l)}`},null,8,ie)],8,oe)),64)),(d(),i(u,null,f(3,l=>v("polygon",{key:`right-${l}`,fill:Ve.value,filter:`url(#${ra})`,opacity:da(l),points:`${(Ee.value+n.titleWidth)/2+30+30*(l-1)}, 37 ${(Ee.value+n.titleWidth)/2+9+30*(l-1)}, 37 ${(Ee.value+n.titleWidth)/2+3+30*(l-1)}, 46 ${(Ee.value+n.titleWidth)/2+24+30*(l-1)}, 46`},[v("animate",{attributeName:"opacity",begin:"0s",dur:la.value,repeatCount:"indefinite",values:`${da(l)};${fa(l)};${da(l)}`},null,8,ne)],8,ve)),64)),v("text",{x:Ee.value/2,y:"32",fill:"#fff","font-size":"18","text-anchor":"middle","dominant-baseline":"middle"},c(n.title),9,re),v("polygon",{fill:Ve.value,filter:`url(#${ra})`,points:`7, ${53+(Pe.value-167)/2} 11, ${57+(Pe.value-167)/2} 11, ${133+(Pe.value-167)/2} 7, ${137+(Pe.value-167)/2}`},null,8,se),v("polygon",{fill:Ve.value,filter:`url(#${ra})`,points:`${Ee.value-7}, ${53+(Pe.value-167)/2} ${Ee.value-11}, ${57+(Pe.value-167)/2} ${Ee.value-11}, ${133+(Pe.value-167)/2} ${Ee.value-7}, ${137+(Pe.value-167)/2}`},null,8,$e)],64)):12===n.variant?(d(),i(u,{key:11},[v("defs",null,[v("filter",{id:ra,height:"150%",width:"150%",x:"-25%",y:"-25%"},[e[5]||(e[5]=v("feMorphology",{in:"SourceAlpha",operator:"dilate",radius:"1",result:"thicken"},null,-1)),e[6]||(e[6]=v("feGaussianBlur",{in:"thicken",result:"blurred",stdDeviation:"2"},null,-1)),v("feFlood",{"flood-color":Xe.value,"flood-opacity":"0.7",result:"glowColor"},[v("animate",{attributeName:"flood-opacity",begin:"0s",dur:la.value,repeatCount:"indefinite",values:"0.7;0.3;0.7"},null,8,de)],8,pe),e[7]||(e[7]=v("feComposite",{in:"glowColor",in2:"blurred",operator:"in",result:"softGlowColored"},null,-1)),e[8]||(e[8]=v("feMerge",null,[v("feMergeNode",{in:"softGlowColored"}),v("feMergeNode",{in:"SourceGraphic"})],-1))])]),Ee.value&&Pe.value?(d(),i("path",{key:0,d:`M15 5 L ${Ee.value-15} 5 Q ${Ee.value-5} 5, ${Ee.value-5} 15 L ${Ee.value-5} ${Pe.value-15} Q ${Ee.value-5} ${Pe.value-5}, ${Ee.value-15} ${Pe.value-5} L 15, ${Pe.value-5} Q 5 ${Pe.value-5} 5 ${Pe.value-15} L 5 15 Q 5 5 15 5`,fill:Ye.value,stroke:Ve.value,"stroke-width":"2"},null,8,fe)):o("",!0),v("path",{d:"M 20 5 L 15 5 Q 5 5 5 15 L 5 20",fill:"transparent",filter:`url(#${ra})`,"stroke-linecap":"round",stroke:Xe.value,"stroke-width":"2"},null,8,be),v("path",{d:`M ${Ee.value-20} 5 L ${Ee.value-15} 5 Q ${Ee.value-5} 5 ${Ee.value-5} 15 L ${Ee.value-5} 20`,fill:"transparent",filter:`url(#${ra})`,"stroke-linecap":"round",stroke:Xe.value,"stroke-width":"2"},null,8,ke),v("path",{d:`M ${Ee.value-20} ${Pe.value-5} L ${Ee.value-15} ${Pe.value-5} Q ${Ee.value-5} ${Pe.value-5} ${Ee.value-5} ${Pe.value-15} L ${Ee.value-5} ${Pe.value-20}`,fill:"transparent",filter:`url(#${ra})`,"stroke-linecap":"round",stroke:Xe.value,"stroke-width":"2"},null,8,ce),v("path",{d:`M 20 ${Pe.value-5} L 15 ${Pe.value-5} Q 5 ${Pe.value-5} 5 ${Pe.value-15} L 5 ${Pe.value-20}`,fill:"transparent",filter:`url(#${ra})`,"stroke-linecap":"round",stroke:Xe.value,"stroke-width":"2"},null,8,ye)],64)):(d(),i(u,{key:12},[v("path",{d:`M 5 20 L 5 10 L 12 3 L 60 3 L 68 10 L ${Ee.value-20} 10 L ${Ee.value-5} 25 L ${Ee.value-5} ${Pe.value-5} L 20 ${Pe.value-5} L 5 ${Pe.value-20} L 5 20`,fill:Ye.value,stroke:Ve.value},null,8,he),v("path",{d:"M 16 9 L 61 9",fill:"transparent","stroke-dasharray":"10, 5","stroke-linecap":"round",stroke:Ve.value,"stroke-width":"3"},null,8,me),v("path",{d:"M 5 20 L 5 10 L 12 3 L 60 3 L 68 10",fill:"transparent",stroke:Xe.value},null,8,ge),v("path",{d:`M ${Ee.value-5} ${Pe.value-30} L ${Ee.value-5} ${Pe.value-5} L ${Ee.value-30} ${Pe.value-5}`,fill:"transparent",stroke:Xe.value},null,8,xe)],64))],10,_)),1===n.variant?(d(),i(u,{key:0},f(pa,l=>v("svg",{key:l,"aria-hidden":"true",class:s(["lumal-border-box__bb1-corner",`lumal-border-box__bb1-corner--${l}`]),focusable:"false",width:"150px",height:"150px"},[v("polygon",{fill:Ve.value,points:"6,66 6,18 12,12 18,12 24,6 27,6 30,9 36,9 39,6 84,6 81,9 75,9 73.2,7 40.8,7 37.8,10.2 24,10.2 12,21 12,24 9,27 9,51 7.8,54 7.8,63"},[v("animate",{attributeName:"fill",begin:"0s",dur:ea.value,repeatCount:"indefinite",values:`${Ve.value};${Xe.value};${Ve.value}`},null,8,Le)],8,_e),v("polygon",{fill:Xe.value,points:"27.599999999999998,4.8 38.4,4.8 35.4,7.8 30.599999999999998,7.8"},[v("animate",{attributeName:"fill",begin:"0s",dur:ea.value,repeatCount:"indefinite",values:`${Xe.value};${Ve.value};${Xe.value}`},null,8,we)],8,We),v("polygon",{fill:Ve.value,points:"9,54 9,63 7.199999999999999,66 7.199999999999999,75 7.8,78 7.8,110 8.4,110 8.4,66 9.6,66 9.6,54"},[v("animate",{attributeName:"fill",begin:"0s",dur:la.value,repeatCount:"indefinite",values:`${Ve.value};${Xe.value};transparent`},null,8,Me)],8,Ce)],2)),64)):o("",!0),v("div",Ne,[b(l.$slots,"default")])],46,x))}});export{Ge as t};

package/dist/LumalCapsuleChart-BUfj4j3C.cjs

@@ -0,0 +1 @@
+const e=require("./_plugin-vue_export-helper-BXystuG9.cjs");let l=require("vue");var a=["aria-label"],t={class:"label-column"},o={class:"capsule-container"},u={key:0,class:"capsule-item-value"},c={class:"unit-label"},n={key:0,class:"unit-text"},r=(0,l.defineComponent)({__name:"LumalCapsuleChart",props:{items:{default:void 0},config:{default:()=>({})},colors:{default:void 0},max:{default:void 0},unit:{default:void 0},sort:{type:[Boolean,String],default:!1},showValue:{type:Boolean,default:void 0},ariaLabel:{default:"胶囊图"}},setup(e){const r=["#37a2da","#32c5e9","#67e0e3","#9fe6b8","#ffdb5c","#ff9f7f","#fb7293"],i=e,m=(0,l.computed)(()=>void 0!==i.items?i.items.map(e=>({...e})):(i.config.data??[]).map((e,l)=>({key:e.name||l,label:e.name,value:e.value}))),s=(0,l.computed)(()=>i.sort?[...m.value].sort((e,l)=>"asc"===i.sort?e.value-l.value:l.value-e.value):m.value),d=(0,l.computed)(()=>{const e=i.colors??i.config.colors??(i.items?.some(e=>e.color)?i.items.map(e=>e.color):void 0),l=[...r];return e?.forEach((e,a)=>{e&&(l[a]=e)}),l}),v=(0,l.computed)(()=>i.showValue??i.config.showValue??!1),p=(0,l.computed)(()=>i.unit??i.config.unit??""),f=(0,l.computed)(()=>i.max??(s.value.length?Math.max(...s.value.map(e=>e.value)):0)),k=(0,l.computed)(()=>s.value.map(e=>f.value?e.value/f.value:0)),g=(0,l.computed)(()=>{const e=f.value/5;return Array.from(new Set(new Array(6).fill(0).map((l,a)=>Math.ceil(a*e))))});function B(e,l){return{backgroundColor:d.value[l%d.value.length]??r[0],width:100*e+"%"}}return(r,i)=>((0,l.openBlock)(),(0,l.createElementBlock)("div",{class:"dv-capsule-chart",role:"img","aria-label":e.ariaLabel},[(0,l.createElementVNode)("div",t,[((0,l.openBlock)(!0),(0,l.createElementBlock)(l.Fragment,null,(0,l.renderList)(s.value,e=>((0,l.openBlock)(),(0,l.createElementBlock)("div",{key:e.key},(0,l.toDisplayString)(e.label),1))),128)),i[0]||(i[0]=(0,l.createElementVNode)("div",null," ",-1))]),(0,l.createElementVNode)("div",o,[((0,l.openBlock)(!0),(0,l.createElementBlock)(l.Fragment,null,(0,l.renderList)(k.value,(e,a)=>((0,l.openBlock)(),(0,l.createElementBlock)("div",{key:s.value[a]?.key??a,class:"capsule-item"},[(0,l.createElementVNode)("div",{class:"capsule-item-column",style:(0,l.normalizeStyle)(B(e,a))},[v.value?((0,l.openBlock)(),(0,l.createElementBlock)("div",u,(0,l.toDisplayString)(s.value[a]?.value),1)):(0,l.createCommentVNode)("",!0)],4)]))),128)),(0,l.createElementVNode)("div",c,[((0,l.openBlock)(!0),(0,l.createElementBlock)(l.Fragment,null,(0,l.renderList)(g.value,(e,a)=>((0,l.openBlock)(),(0,l.createElementBlock)("div",{key:`${e}-${a}`},(0,l.toDisplayString)(e),1))),128))])]),p.value?((0,l.openBlock)(),(0,l.createElementBlock)("div",n,(0,l.toDisplayString)(p.value),1)):(0,l.createCommentVNode)("",!0)],8,a))}}),i=e._plugin_vue_export_helper_default(r,[["__scopeId","data-v-4cfbb59b"]]);Object.defineProperty(exports,"LumalCapsuleChart_default",{enumerable:!0,get:function(){return i}});

package/dist/LumalCapsuleChart-DxUDrb_Q.js

@@ -0,0 +1 @@
+import{t as a}from"./_plugin-vue_export-helper-DgLP3hnZ.js";import{Fragment as e,computed as l,createCommentVNode as u,createElementBlock as t,createElementVNode as o,defineComponent as v,normalizeStyle as i,openBlock as s,renderList as r,toDisplayString as c}from"vue";var n=["aria-label"],d={class:"label-column"},m={class:"capsule-container"},f={key:0,class:"capsule-item-value"},p={class:"unit-label"},b={key:0,class:"unit-text"},y=/*#__PURE__*/a(/*@__PURE__*/v({__name:"LumalCapsuleChart",props:{items:{default:void 0},config:{default:()=>({})},colors:{default:void 0},max:{default:void 0},unit:{default:void 0},sort:{type:[Boolean,String],default:!1},showValue:{type:Boolean,default:void 0},ariaLabel:{default:"胶囊图"}},setup(a){const v=["#37a2da","#32c5e9","#67e0e3","#9fe6b8","#ffdb5c","#ff9f7f","#fb7293"],y=a,h=l(()=>void 0!==y.items?y.items.map(a=>({...a})):(y.config.data??[]).map((a,e)=>({key:a.name||e,label:a.name,value:a.value}))),g=l(()=>y.sort?[...h.value].sort((a,e)=>"asc"===y.sort?a.value-e.value:e.value-a.value):h.value),k=l(()=>{const a=y.colors??y.config.colors??(y.items?.some(a=>a.color)?y.items.map(a=>a.color):void 0),e=[...v];return a?.forEach((a,l)=>{a&&(e[l]=a)}),e}),w=l(()=>y.showValue??y.config.showValue??!1),x=l(()=>y.unit??y.config.unit??""),_=l(()=>y.max??(g.value.length?Math.max(...g.value.map(a=>a.value)):0)),C=l(()=>g.value.map(a=>_.value?a.value/_.value:0)),L=l(()=>{const a=_.value/5;return Array.from(new Set(new Array(6).fill(0).map((e,l)=>Math.ceil(l*a))))});function V(a,e){return{backgroundColor:k.value[e%k.value.length]??v[0],width:100*a+"%"}}return(l,v)=>(s(),t("div",{class:"dv-capsule-chart",role:"img","aria-label":a.ariaLabel},[o("div",d,[(s(!0),t(e,null,r(g.value,a=>(s(),t("div",{key:a.key},c(a.label),1))),128)),v[0]||(v[0]=o("div",null," ",-1))]),o("div",m,[(s(!0),t(e,null,r(C.value,(a,e)=>(s(),t("div",{key:g.value[e]?.key??e,class:"capsule-item"},[o("div",{class:"capsule-item-column",style:i(V(a,e))},[w.value?(s(),t("div",f,c(g.value[e]?.value),1)):u("",!0)],4)]))),128)),o("div",p,[(s(!0),t(e,null,r(L.value,(a,e)=>(s(),t("div",{key:`${a}-${e}`},c(a),1))),128))])]),x.value?(s(),t("div",b,c(x.value),1)):u("",!0)],8,n))}}),[["__scopeId","data-v-4cfbb59b"]]);export{y as t};