@esportsplus/ui 0.9.2 → 0.9.3

package/dist/components/field/title.js

@@ -1,21 +0,0 @@
-import { html } from '@esportsplus/template';
-import tooltip from '../../components/tooltip/index.js';
-export default (data) => {
-    if (!data?.title) {
-        return '';
-    }
-    return html `
-        <div class='field-title --flex-horizontal-space-between --flex-vertical'>
-            ${data.title}
-
-            ${data?.required && html `
-                <div
-                    class='bubble --background-primary --margin-left'
-                    ${tooltip.onhover().attributes}
-                >
-                    <span class='tooltip-message tooltip-message--w'>Required</span>
-                </div>
-            `}
-        </div>
-    `;
-};

package/dist/components/footer/index.js

@@ -1,60 +0,0 @@
-import { html, svg } from '@esportsplus/template';
-import './scss/index.scss';
-function copy({ attributes, brand }) {
-    return html `
-        <div class='footer-copyright group-item --flex-center'>
-            <div
-                class='text --padding-vertical --padding-300 --text-300'
-                style='--color-default: var(--color-grey-500);'
-                ${attributes}
-            >
-                &copy; ${`${new Date().getFullYear()} ${brand}, All rights reserved`}
-            </div>
-        </div>
-    `;
-}
-export default ({ copyright, footer, nav, social }) => {
-    return html `
-        <footer class='footer' ${footer?.attributes}>
-            <div class='container'>
-                <div class='group group--offset-top --flex-center --margin-400'>
-
-                    ${nav
-        ? nav.links.map(({ text, url }) => html `
-                            <div class='group-item'>
-                                <a
-                                    class='link --color-white --padding-vertical-300 --text-300'
-                                    href='${url}'
-                                    style='--color-default: var(--color-grey-500);'
-                                    ${nav.attributes}
-                                >
-                                    ${text}
-                                </a>
-                            </div>
-                        `)
-        : copy(copyright)}
-
-                    <div class='footer-break'></div>
-
-                    ${social?.links && social.links.map(({ icon, url }) => html `
-                        <div class='group-item'>
-                            <a
-                                class='link --color-white --padding-0px'
-                                href='${url}'
-                                style='--color-default: var(--color-grey-500);'
-                                ${social.attributes}
-                            >
-                                <div class='icon --size-500'>
-                                    ${svg.sprite(icon)}
-                                </div>
-                            </a>
-                        </div>
-                    `)}
-
-                    ${nav && copy(copyright)}
-
-                </div>
-            </div>
-        </footer>
-    `;
-};

package/dist/components/footer/scss/index.scss

@@ -1,2 +0,0 @@
-.footer,.footer-break{width:100%}@media (max-width:640px){.footer-copyright:first-child{--width:100%}}@media (min-width:640px){.footer-copyright:first-child{margin-right:auto}}.footer-copyright:first-child+.footer-break{display:none}.footer-copyright:last-child{--width:100%}
-/*$vite$:1*/

package/dist/components/form/action.js

@@ -1,57 +0,0 @@
-import response from '@esportsplus/action';
-import input from './input.js';
-function parse(input) {
-    let data = {};
-    for (let [path, value] of input) {
-        let bucket = data, segments = path.indexOf('.') !== -1 ? path.split('.') : [path];
-        for (let i = 0; i < segments.length - 1; i++) {
-            bucket = bucket[segments[i]] = bucket[segments[i]] || {};
-        }
-        let key = segments.at(-1);
-        if (path.endsWith('[]')) {
-            if (typeof value === 'string' && value.trim() === '') {
-                continue;
-            }
-            bucket = bucket[key.substring(0, key.length - 2)] ??= [];
-            bucket.push(value);
-        }
-        else {
-            bucket[key] = value;
-        }
-    }
-    return data;
-}
-;
-export default function (action, s) {
-    return {
-        onclick: function (event) {
-            let trigger = event.target;
-            if (trigger?.type !== 'submit') {
-                return;
-            }
-            event.preventDefault();
-            this.dispatchEvent(new SubmitEvent('submit', { cancelable: true, bubbles: true, submitter: trigger }));
-        },
-        onsubmit: async function (event) {
-            event.preventDefault();
-            if (s) {
-                s.processing = true;
-            }
-            let { errors } = await action({
-                input: parse(new FormData(this).entries()),
-                response
-            });
-            for (let i = 0, n = errors.length; i < n; i++) {
-                let { message, path } = errors[i], reactive = input.get(this[path]);
-                if (!reactive) {
-                    continue;
-                }
-                reactive.error = `${message[0].toUpperCase()}${message.substring(1)}`;
-            }
-            if (s) {
-                s.processing = false;
-            }
-        }
-    };
-}
-;

package/dist/components/form/index.js

@@ -1,3 +0,0 @@
-import action from './action.js';
-import input from './input.js';
-export default { action, input };

package/dist/components/form/input.js

@@ -1,10 +0,0 @@
-let key = Symbol();
-const get = (element) => {
-    return element ? element[key] : undefined;
-};
-const onrender = (reactive) => {
-    return (element) => {
-        element[key] = reactive;
-    };
-};
-export default { get, onrender };

package/dist/components/form/types.js

@@ -1 +0,0 @@
-export {};

package/dist/components/frame/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/frame/scss/index.scss

@@ -1,2 +0,0 @@
-.frame{flex-wrap:wrap;justify-content:flex-start;width:100%;display:none;position:relative}.frame.--active{display:flex}
-/*$vite$:1*/

package/dist/components/grid/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/grid/scss/index.scss

@@ -1,2 +0,0 @@
-.grid{--margin-horizontal:var(--size-400);--margin-vertical:var(--size-400);--max-width:1fr;--min-width:200px;grid-gap:var(--margin-horizontal)var(--margin-vertical);grid-template-columns:repeat(auto-fit,minmax(var(--min-width),var(--max-width)));display:grid;position:relative}.grid .grid-item{width:100%}
-/*$vite$:1*/

package/dist/components/group/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/group/scss/index.scss

@@ -1,2 +0,0 @@
-.group{--margin-horizontal:var(--size-400);--width:auto}.group.--flex-column .group-item{--width:100%}.group--scroller .group-item{--margin-vertical:0px}.group{margin:0 calc(var(--margin-horizontal)/-2);width:calc(100% + var(--margin-horizontal));flex-wrap:wrap;justify-content:flex-start;display:flex;position:relative}.group--offset-bottom{margin-bottom:calc(var(--margin-vertical)*-1)}.group--offset-top{margin-top:calc(var(--margin-vertical)*-1)}.group--scroller{margin-bottom:calc(var(--scrollbar-width)*-1);padding-bottom:var(--scrollbar-width);flex-flow:row;overflow-y:hidden}.group-item{margin:var(--margin-vertical)calc(var(--margin-horizontal)/2)0;width:var(--width);display:flex;position:relative}.group-item[class*=--width]{width:calc(var(--width) - var(--margin-horizontal))}
-/*$vite$:1*/

package/dist/components/highlight/index.js

@@ -1,40 +0,0 @@
-import { reactive } from '@esportsplus/reactivity';
-import './scss/index.scss';
-let key = Symbol(), observer = null;
-export default (background) => {
-    if (observer === null) {
-        observer = new IntersectionObserver((entries) => {
-            let disconnected = 0, n = entries.length;
-            for (let i = 0; i < n; i++) {
-                let { isIntersecting, target } = entries[i];
-                if (target.isConnected) {
-                    target[key].highlight = +isIntersecting;
-                }
-                else {
-                    disconnected++;
-                    observer.unobserve(target);
-                }
-            }
-            if (n - disconnected === 0) {
-                observer.disconnect();
-                observer = null;
-            }
-        }, { threshold: 1 });
-    }
-    let state = reactive({
-        highlight: 0
-    });
-    return {
-        attributes: {
-            class: 'highlight',
-            onrender: function (element) {
-                element[key] = state;
-                observer.observe(element);
-            },
-            style: [
-                () => `--highlight: ${state.highlight}`,
-                `--background: ${background}`,
-            ]
-        }
-    };
-};

package/dist/components/highlight/scss/index.scss

@@ -1,2 +0,0 @@
-.highlight{--background:transparent;--highlight:1;background:linear-gradient(90deg,var(--background)50%,transparent 50%)110% 0/200% 100% no-repeat;background-position:calc((1 - var(--highlight))*110%)0;transition:background-position .32s}
-/*$vite$:1*/

package/dist/components/icon/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/icon/scss/index.scss

@@ -1,2 +0,0 @@
-.icon{--color:inherit;--height:var(--size);--margin-horizontal:var(--size-300);--size:var(--size-400);--width:var(--size);color:var(--color);flex:0 0 var(--width);height:var(--height);width:var(--width);display:flex;position:relative}.icon svg{color:currentColor;fill:currentColor;width:100%;height:100%}
-/*$vite$:1*/

package/dist/components/index.js

@@ -1,38 +0,0 @@
-export * as accordion from './accordion/index.js';
-export * as anchor from './anchor/index.js';
-export * as banner from './banner/index.js';
-export * as border from './border/index.js';
-export * as bubble from './bubble/index.js';
-export * as button from './button/index.js';
-export * as card from './card/index.js';
-export * as clipboard from './clipboard/index.js';
-export * as container from './container/index.js';
-export * as counter from './counter/index.js';
-export * as ellipsis from './ellipsis/index.js';
-export * as field from './field/index.js';
-export * as footer from './footer/index.js';
-export * as form from './form/index.js';
-export * as frame from './frame/index.js';
-export * as grid from './grid/index.js';
-export * as group from './group/index.js';
-export * as highlight from './highlight/index.js';
-export * as icon from './icon/index.js';
-export * as json from './json/index.js';
-export * as link from './link/index.js';
-export * as loader from './loader/index.js';
-export * as loading from './loading/index.js';
-export * as magnet from './magnet/index.js';
-export * as modal from './modal/index.js';
-export * as normalize from './normalize/index.js';
-export * as number from './number/index.js';
-export * as page from './page/index.js';
-export * as root from './root/index.js';
-export * as row from './row/index.js';
-export * as scrollbar from './scrollbar/index.js';
-export * as sidebar from './sidebar/index.js';
-export * as site from './site/index.js';
-export * as text from './text/index.js';
-export * as thumbnail from './thumbnail/index.js';
-export * as tooltip from './tooltip/index.js';
-export * as truncate from './truncate/index.js';
-export * as typewriter from './typewriter/index.js';

package/dist/components/json/download.js

@@ -1,8 +0,0 @@
-export default (content, name) => {
-    let link = document.createElement('a');
-    link.download = name + '.json';
-    link.href = window.URL.createObjectURL(new Blob([JSON.stringify(content)], { type: 'application/json' }));
-    document.body.appendChild(link);
-    link.click();
-    document.body.removeChild(link);
-};

package/dist/components/json/index.js

@@ -1,2 +0,0 @@
-import download from './download.js';
-export default { download };

package/dist/components/link/hover.js

@@ -1,17 +0,0 @@
-import { html } from '@esportsplus/template';
-export default ({ attributes, content }) => {
-    return {
-        attributes: {
-            class: 'link--hover'
-        },
-        html: html `
-            <span class='link-hover link-hover--one' ${attributes}>
-                ${content}
-            </span>
-
-            <span class='link-hover link-hover--two' ${attributes}>
-                ${content}
-            </span>
-        `
-    };
-};

package/dist/components/link/index.js

@@ -1,3 +0,0 @@
-import hover from './hover.js';
-import './scss/index.scss';
-export default { hover };

package/dist/components/link/scss/index.scss

@@ -1,2 +0,0 @@
-.link{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--border-width:0px;--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default);--font-size:var(--font-size-400);--font-weight:var(--font-weight-500);--line-height:var(--line-height-400);--padding-horizontal:0px;--padding-vertical:var(--size-400);--width:auto}.link.--active{--background:var(--background-active);--border-color:var(--border-color-active);--color:var(--color-active)}.link:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--color:var(--color-hover)}.link:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--color:var(--color-pressed)}.link{background:var(--background);color:var(--color);cursor:pointer;font-size:var(--font-size);line-height:var(--line-height);padding:calc(var(--padding-vertical) - var(--border-width))calc(var(--padding-horizontal) - var(--border-width));transition:background var(--transition-duration)ease-in-out,border-color var(--transition-duration)ease-in-out,color var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;width:var(--width);flex-wrap:wrap;place-content:center flex-start;display:flex;position:relative}.link--hover.tooltip:hover .link-hover--one,.link--hover:not(.--active):hover .link-hover--one{opacity:0;transform:translateY(-75%)}.link--hover.tooltip:hover .link-hover--two,.link--hover:not(.--active):hover .link-hover--two{opacity:1;transform:translate(50%,50%)}.link--underline.--active,.link--underline:not(.--active):hover{text-decoration:underline}.link-hover{transition:opacity .3s ease-in-out,all .3s cubic-bezier(.23,.65,.74,1.09)}.link-hover--one{transform:translateY(0)}.link-hover--two{opacity:0;padding:0 var(--padding-horizontal);white-space:nowrap;position:absolute;bottom:50%;right:50%;transform:translate(50%,125%)}
-/*$vite$:1*/

package/dist/components/loader/index.js

@@ -1,39 +0,0 @@
-import { html } from '@esportsplus/template';
-import { reactive } from '@esportsplus/reactivity';
-import './scss/index.scss';
-export default ({ attributes, content }) => {
-    let state = reactive({
-        load: false,
-        scale: false
-    });
-    setTimeout(() => {
-        state.scale = true;
-    }, 300);
-    return html `
-        <div class='loader ${() => state.load && 'loader--load'}'>
-            <div class='loader ${() => state.load && 'loader--load'}'>
-                <div class='loader-content'>
-                    <div
-                        class='
-                            ${() => state.scale && 'loader-logo--scale'}
-                            loader-logo
-                            text
-                            --flex-center
-                            --text-uppercase
-                            --text-600
-                        '
-                        style='color: var(--color-grey-500);'
-                        onanimationend='${({ animationName: name }) => {
-        if (name === 'scale') {
-            state.load = true;
-        }
-    }}'
-                        ${attributes}
-                    >
-                        ${content}
-                    </div>
-                </div>
-            </div>
-        </div>
-    `;
-};

package/dist/components/loader/scss/index.scss

@@ -1,2 +0,0 @@
-.loader-logo{--size:10svh;--translateY:8px}.loader{background-color:var(--color-black-500);opacity:1;pointer-events:none;visibility:visible;z-index:9999;transition:all .3s ease-in-out;position:fixed;inset:0}.loader--load{animation:.6s ease-in-out .2s both move}.loader--load .loader--load{animation:.6s ease-in-out both move}@keyframes move{0%{transform:translateY(0)}80%{transform:translateY(-102%)}to{transform:translateY(-102%)}}.loader .loader{background-color:var(--color-black-400)}.loader-content{position:absolute;inset:50% auto auto 50%;transform:translate(-50%)translateY(-50%)}.loader-logo{color:#fff}.loader-logo--scale{animation:.32s both scale}@keyframes scale{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale3d(1.8,1.8,1.8)}}
-/*$vite$:1*/

package/dist/components/loading/index.js

@@ -1,12 +0,0 @@
-import { html } from '@esportsplus/template';
-import './scss/index.scss';
-export default (attributes) => {
-    return html `
-        <div
-            class='loading --border-width-700 --size-800'
-            style='--border-color: var(--color-border-500);'
-            ${attributes}
-        >
-        </div>
-    `;
-};

package/dist/components/loading/scss/index.scss

@@ -1,2 +0,0 @@
-.loading{--animation-duration:.64s;--border-color:var(--color);--border-width:var(--border-width-400);--size:var(--size-400);animation:loading var(--animation-duration)linear infinite;border:var(--border-width)solid color-mix(in srgb,var(--border-color),transparent 90%);border-left-color:var(--border-color);height:var(--size);width:var(--size);border-radius:100%}@keyframes loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
-/*$vite$:1*/

package/dist/components/magnet/index.js

@@ -1,47 +0,0 @@
-import { reactive } from '@esportsplus/reactivity';
-import { html } from '@esportsplus/template';
-import './scss/index.scss';
-export default ({ attributes, hide }) => {
-    let active = false, events = {
-        onmouseover: function () {
-            let { offsetHeight, offsetLeft, offsetTop, offsetWidth } = this;
-            active = true;
-            state.height = offsetHeight;
-            state.left = offsetLeft;
-            state.opacity = 1;
-            state.top = offsetTop;
-            state.width = offsetWidth;
-        }
-    }, state = reactive({
-        height: null,
-        hide: true,
-        left: 0,
-        opacity: 0,
-        top: 0,
-        width: 0
-    });
-    if (hide === true) {
-        events.onmouseout = () => {
-            active = false;
-            setTimeout(() => {
-                if (active === true) {
-                    return;
-                }
-                state.opacity = 0;
-            }, 50);
-        };
-    }
-    return {
-        html: html `
-            <div class='magnet' style='${() => `
-                height: ${state.height ? `${state.height}px` : '100%'};
-                opacity: ${state.opacity};
-                transform: translate(${state.left}px, ${state.top}px);
-                width: ${state.width}px;
-            `}' ${attributes}></div>
-        `,
-        sibling: {
-            attributes: events
-        }
-    };
-};

package/dist/components/magnet/scss/index.scss

@@ -1,2 +0,0 @@
-.magnet{--background:transparent;--border-radius:var(--border-radius-400);--timing-function:var(--timing-circ);background:var(--background);border-radius:var(--border-radius);opacity:0;height:0;transition:height var(--transition-duration)var(--timing-function),opacity var(--transition-duration)var(--timing-function),transform var(--transition-duration)var(--timing-function),width var(--transition-duration)var(--timing-function);z-index:-1;width:0;position:absolute;top:0;left:0}
-/*$vite$:1*/

package/dist/components/modal/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/modal/scss/index.scss

@@ -1,2 +0,0 @@
-.modal{--margin-horizontal:0px;--margin-vertical:0px;--max-height:calc(100svh - (var(--margin-vertical)*2));--max-width:320px;max-height:var(--max-height);transition:opacity var(--transition-duration)ease-in-out,transform var(--transition-duration)ease-in-out;transform-origin:50%;width:min(var(--max-width),100svw - var(--margin-horizontal)*2);z-index:2;position:fixed;bottom:50%;right:50%;overflow:hidden;transform:translate(50%,50%)}.modal:not(.--active){opacity:0;pointer-events:none;transform:translate(50%,50%)scale(.8)}.modal:not(.--active) input[type=password]{display:none}.modal-frame{transition:opacity var(--transition-duration)ease-in-out,transform var(--transition-duration)ease-in-out;transform-origin:50%}.modal-frame:not(.--active){display:none}
-/*$vite$:1*/

package/dist/components/normalize/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/normalize/scss/index.scss

@@ -1,3 +0,0 @@
-/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
-*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;tab-size:4;font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;line-height:1.15}body{margin:0}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{border-color:currentColor}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}
-/*$vite$:1*/

package/dist/components/number/index.js

@@ -1,2 +0,0 @@
-import { number } from '@esportsplus/utilities';
-export default number;

package/dist/components/page/index.js

@@ -1,11 +0,0 @@
-import './scss/index.scss';
-const subtitle = {
-    class: 'page-subtitle --margin-200 --text-crop-bottom'
-};
-const suptitle = {
-    class: 'page-suptitle --text-bold-600 --text-crop --text-uppercase --text-300'
-};
-const title = {
-    class: 'page-title --line-height-200 --margin-400 --text-crop'
-};
-export default { subtitle, suptitle, title };

package/dist/components/page/scss/index.scss

@@ -1,2 +0,0 @@
-.page-subtitle,.page-suptitle{--color:var(--color-default);--color-default:var(--color-text-400);--font-size:var(--font-size-400);--line-height:var(--line-height-400)}.page-title{--color:var(--color-default);--color-default:var(--color-text-500);--line-height:var(--line-height-400)}.page{width:100vw;min-height:100svh;position:relative}.page-subtitle,.page-suptitle,.page-title{color:var(--color);line-height:var(--line-height);z-index:1;width:100%;display:block;position:relative}.page-subtitle,.page-suptitle{font-size:var(--font-size)}.page-suptitle+.page-title,.page-title+.page-subtitle{margin-top:var(--margin-vertical)}.page-title{text-wrap:balance}
-/*$vite$:1*/

package/dist/components/root/index.js

@@ -1,3 +0,0 @@
-import onclick from './onclick.js';
-export default { onclick };
-export { onclick };

package/dist/components/root/onclick.js

@@ -1,14 +0,0 @@
-let queue = [];
-const onclick = async () => {
-    if (queue.length === 0) {
-        return;
-    }
-    let item;
-    while (item = queue.pop()) {
-        await item();
-    }
-};
-onclick.push = (fn) => {
-    queue.push(fn);
-};
-export default onclick;

package/dist/components/root/scss/index.scss

@@ -1,2 +0,0 @@
-body,html{width:100%;height:100%;overflow-x:hidden}body{background-color:var(--background);color:var(--color);font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);min-width:var(--min-width);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:after,:before{box-sizing:border-box;transition:inherit}section{width:var(--width);flex-wrap:wrap;place-content:flex-start;display:flex;position:relative}h1,h2,h3,h4,h5{color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);text-wrap:balance;word-wrap:break-word;width:100%;margin:0;padding:0;position:relative}h1 sub,h1 sup,h2 sub,h2 sup,h3 sub,h3 sup,h4 sub,h4 sup,h5 sub,h5 sup{font-size:.64em}a{color:var(--color,inherit);cursor:pointer;outline:none;text-decoration:none}b,strong{color:var(--color,inherit);font-weight:var(--font-weight)}p{word-wrap:break-word;width:100%;margin:0;padding:0}pre{overflow-wrap:break-word;white-space:break-spaces;width:100%;margin:0;padding:0}sub,sup{font-size:.8em}sub{bottom:-.48em}sup{top:-.48em}
-/*$vite$:1*/

package/dist/components/row/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/row/scss/index.scss

@@ -1,2 +0,0 @@
-.row{flex-wrap:wrap;justify-content:flex-start;width:100%;display:flex;position:relative}
-/*$vite$:1*/

package/dist/components/scrollbar/index.js

@@ -1,42 +0,0 @@
-import { reactive } from '@esportsplus/reactivity';
-import { html } from '@esportsplus/template';
-import './scss/index.scss';
-let root = document.body, width;
-export default ({ attributes, fixed } = {}) => {
-    let state = reactive({
-        height: 100,
-        translate: 0
-    });
-    return {
-        html: html `
-            <div
-                class='
-                    ${fixed && 'scrollbar--fixed'}
-                    ${() => state.height >= 100 && 'scrollbar--hidden'}
-                    scrollbar
-                '
-                style='${() => `
-                    --translate: translate3d(0, ${state.translate}%, 0);
-                    --height: ${state.height}%;
-                `}'
-                ${attributes}
-            >
-            </div>
-        `,
-        parent: {
-            attributes: {
-                class: 'scrollbar-content',
-                onscroll: function () {
-                    if (width === undefined) {
-                        width = this.offsetWidth - this.clientWidth;
-                        if (width && width !== 17) {
-                            root.style.setProperty('--scrollbar-width', `${width}px`);
-                        }
-                    }
-                    state.height = (this.clientHeight / this.scrollHeight) * 100;
-                    state.translate = (this.scrollTop / this.clientHeight) * 100;
-                }
-            }
-        }
-    };
-};

package/dist/components/scrollbar/scss/index.scss

@@ -1,2 +0,0 @@
-.scrollbar{--background-default:transparent;--height:0;--translate:translate3d(0,0,0);--width:4px}::-webkit-scrollbar{box-shadow:unset;background:0 0}::-webkit-scrollbar-track{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb:window-inactive{box-shadow:unset;background:0 0}.scrollbar{z-index:9;height:100%}.scrollbar,.scrollbar:before{transition:opacity var(--transition-duration)ease-in-out;width:var(--width);position:absolute;top:0;right:0}.scrollbar:before{background:var(--background-default);content:"";height:var(--height);transform:var(--translate);transform-origin:top;border-radius:1px 0 0 1px}.scrollbar--fixed{position:fixed}.scrollbar--hidden{opacity:0}.scrollbar-container{flex-flow:column;display:flex;position:relative;overflow:hidden}.scrollbar-content{height:100%;margin-right:calc(var(--scrollbar-width)*-1);scrollbar-gutter:stable;scroll-behavior:smooth;width:calc(100% + var(--scrollbar-width));overflow:hidden scroll}.scrollbar-content--snap{scroll-snap-type:both mandatory;overscroll-behavior-x:contain;overflow:auto}.scrollbar-content--snap>*{scroll-snap-stop:normal;scroll-snap-align:center}
-/*$vite$:1*/

package/dist/components/sidebar/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/sidebar/scss/index.scss

@@ -1,2 +0,0 @@
-.sidebar{--margin-horizontal:0px;--margin-vertical:0px;--width:var(--width-default);--width-closed:var(--width-default);--width-default:320px}.sidebar:not(.--active):not(:hover){--width:var(--width-closed)}.sidebar--floating{--margin-horizontal:var(--size-100);--margin-vertical:var(--size-100)}.sidebar{top:var(--margin-vertical);bottom:var(--margin-vertical);cursor:default;height:calc(100% - var(--margin-vertical)*2);transition:max-width var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out,transform var(--transition-duration)ease-in-out;width:min(var(--width),100% - var(--margin-horizontal)*2);z-index:1;position:absolute;overflow:hidden}.sidebar:not(.--active) input[type=password]{display:none}.sidebar--e{right:var(--margin-horizontal)}.sidebar--e.sidebar--offscreen:not(.--active){transform:translateX(var(--width))}.sidebar--w{left:var(--margin-horizontal)}.sidebar--w.sidebar--offscreen:not(.--active){transform:translateX(calc(var(--width)*-1))}.sidebar-content{flex:0 0 var(--width-default);width:var(--width-default)}
-/*$vite$:1*/

package/dist/components/site/index.js

@@ -1,17 +0,0 @@
-import { html } from '@esportsplus/template';
-import { onclick } from '../../components/root/index.js';
-import scrollbar from '../../components/scrollbar/index.js';
-import './scss/index.scss';
-export default ({ attributes, content, scrollbar: sb }) => {
-    sb ??= {};
-    sb.attributes ??= {};
-    sb.attributes.style ??= '--background-default: var(--color-black-400);';
-    sb.fixed ??= true;
-    let { html: h, parent } = scrollbar(sb);
-    return html `
-        <section class='site' ${attributes} ${{ onclick }} ${parent.attributes}>
-            ${content || ''}
-            ${h}
-        </section>
-    `;
-};

package/dist/components/site/scss/index.scss

@@ -1,2 +0,0 @@
-.site{z-index:0}
-/*$vite$:1*/

package/dist/components/text/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/text/scss/index.scss

@@ -1,2 +0,0 @@
-.text{--color:var(--color-default);--color-default:inherit;--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--line-height:var(--line-height-400);--width:auto;color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);transition:color var(--transition-duration)ease-in-out;width:var(--width);position:relative}
-/*$vite$:1*/

package/dist/components/thumbnail/index.js

@@ -1 +0,0 @@
-import './scss/index.scss';

package/dist/components/thumbnail/scss/index.scss

@@ -1,2 +0,0 @@
-.thumbnail{--background:transparent;--border-radius:var(--border-radius-300);--height:var(--size);--size:var(--size-700);--width:var(--size);background:var(--background);border-radius:var(--border-radius);height:var(--height);width:var(--width);position:relative}
-/*$vite$:1*/