UNPKG

ranui

Version:

A framework-agnostic Web Components UI library built on native custom elements, with TypeScript types, light/dark theming, SSR and PWA support.

2 lines (1 loc) 3.67 kB
const o=require("./rolldown-runtime-DGqZhkpL.cjs"),i=require("./builder-Cb6jFd2B.cjs");var t=".ran-loading .circle{width:var(--loading-circle-width, 4em);height:var(--loading-circle-height, 4em);position:var(--loading-circle-position, relative)}.ran-loading .circle-container{position:var(--loading-circle-container-position, absolute);width:var(--loading-circle-container-width, 100%);height:var(--loading-circle-container-height, 100%)}.ran-loading .circle-container div{width:var(--loading-circle-container-div-width, 1em);height:var(--loading-circle-container-div-height, 1em);background:var(--loading-circle-container-div-background, var(--ran-color-primary, #4096ff));border-radius:var(--loading-circle-container-div-border-radius, 100%);position:var(--loading-circle-container-div-position, absolute);animation:var(--loading-circle-container-div-animation, ran-loading-circle 1.2s infinite ease-in-out);animation-play-state:var(--loading-circle-container-div-animation-play-state, running);animation-fill-mode:var(--loading-circle-container-div-animation-fill-mode, both)}.ran-loading .circle .container1 .circle2{animation-delay:var(--loading-circle-container1-circle2-animation-delay, -.9s)}.ran-loading .circle .container1 .circle3{animation-delay:var(--loading-circle-container1-circle3-animation-delay, -.6s)}.ran-loading .circle .container1 .circle4{animation-delay:var(--loading-circle-container1-circle4-animation-delay, -.3s)}.ran-loading .circle .container2{transform:var(--loading-circle-container2-transform, rotateZ(45deg))}.ran-loading .circle .container2 .circle1{animation-delay:var(--loading-circle-container2-circle1-animation-delay, -1.1s)}.ran-loading .circle .container2 .circle2{animation-delay:var(--loading-circle-container2-circle2-animation-delay, -.8s)}.ran-loading .circle .container2 .circle3{animation-delay:var(--loading-circle-container2-circle3-animation-delay, -.5s)}.ran-loading .circle .container2 .circle4{animation-delay:var(--loading-circle-container2-circle4-animation-delay, -.2s)}.ran-loading .circle .container3{transform:var(--loading-circle-container3-transform, rotateZ(90deg))}.ran-loading .circle .container3 .circle1{animation-delay:var(--loading-circle-container3-circle1-transform, -1s)}.ran-loading .circle .container3 .circle2{animation-delay:var(--loading-circle-container3-circle2-transform, -.7s)}.ran-loading .circle .container3 .circle3{animation-delay:var(--loading-circle-container3-circle3-transform, -.4s)}.ran-loading .circle .container3 .circle4{animation-delay:var(--loading-circle-container3-circle4-transform, -.1s)}.ran-loading .circle .circle1{top:var(--loading-circle1-top, 0);left:var(--loading-circle1-left, 0)}.ran-loading .circle .circle2{top:var(--loading-circle2-top, 0);right:var(--loading-circle2-right, 0)}.ran-loading .circle .circle3{right:var(--loading-circle3-right, 0);bottom:var(--loading-circle3-bottom, 0)}.ran-loading .circle .circle4{left:var(--loading-circle3-left, 0);bottom:var(--loading-circle3-bottom, 0)}@keyframes ran-loading-circle{0%,80%,to{transform:var(--loading-circle-keyframes-0, scale(0))}40%{transform:var(--loading-circle-keyframes-40, scale(1))}}",d=o.__exportAll({default:()=>a}),g=()=>{const r=i.Div().class("circle").part("circle").build();return Array(3).fill(1).map(()=>Array(4).fill(1)).forEach((n,c)=>{const e=i.Div().class(`circle-container container${c+1}`).children(...n.map((v,l)=>i.Div().class(`circle${l+1}`))).build();r.appendChild(e)}),r},a={css:t,render:g};Object.defineProperty(exports,"circle_default",{enumerable:!0,get:function(){return a}});Object.defineProperty(exports,"circle_exports",{enumerable:!0,get:function(){return d}});