ranui/dist/square-DUjZUNBe.js

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

import { i as a } from "./factory-WDxu11V0.js";
import "./builder-EH76YCFS.js";
var r = "@keyframes square-box1{0%{transform:var(--loading-square-box1-keyframes-0, rotate(0))}25%{transform:var(--loading-square-box1-keyframes-25, rotate(90deg))}50%{transform:var(--loading-square-box1-keyframes-50, rotate(180deg))}75%{transform:var(--loading-square-box1-keyframes-75, rotate(270deg))}to{transform:var(--loading-square-box1-keyframes-100, rotate(360deg))}}@keyframes square-box2{0%{transform:var(--loading-square-box2-keyframes-0, rotate(45deg))}25%{transform:var(--loading-square-box2-keyframes-25, rotate(-45deg))}50%{transform:var(--loading-square-box2-keyframes-50, rotate(-135deg))}75%{transform:var(--loading-square-box2-keyframes-75, rotate(-225deg))}to{transform:var(--loading-square-box2-keyframes-100, rotate(-315deg))}}.ran-loading .square-box1{width:var(--loading-square-box1-width, 50px);height:var(--loading-square-box1-height, 50px);padding:var(--loading-square-box1-padding, 3px);position:var(--loading-square-box1-position, absolute);display:var(--loading-square-box1-display, flex);justify-content:var(--loading-square-box1-justify-content, center);align-items:var(--loading-square-box1-align-items, center);background:var(--loading-square-box1-background, #ffab91);animation:var(--loading-square-box1-animation, square-box1 3s ease-in-out 0s infinite alternate);animation-play-state:var(--loading-square-box1-animation-play-state, running)}.ran-loading .square-box2{width:var(--loading-square-box2-width, 50px);height:var(--loading-square-box2-height, 50px);padding:var(--loading-square-box2-padding, 3px);left:var(--loading-square-box2-left, -50px);display:var(--loading-square-box2-display, flex);justify-content:var(--loading-square-box2-justify-content, center);align-items:var(--loading-square-box2-align-items, center);background:var(--loading-square-box2-background, #3ff9dc);transform:var(--loading-square-box2-transform, rotate(45deg));animation:var(--loading-square-box2-animation, square-box2 3s ease-in-out 0s infinite alternate);animation-play-state:var(--loading-square-box2-animation-play-state, running)}.ran-loading .square-core{width:var(--loading-square-core-width, 100%);height:var(--loading-square-core-height, 100%);background:var(--loading-square-core-background, #37474f)}", e = () => a().class("square").part("square").children(a().class("square-box1").children(a().class("square-core")), a().class("square-box2").children(a().class("square-core"))).build(), s = {
  css: r,
  render: e
};
export {
  s as default
};