From 3ec7e49ffd32976b96e60dfdb3a1926bfcb16e55 Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Fri, 17 May 2024 23:30:22 +0100 Subject: [PATCH 01/11] grid component test --- docs-src/components/grid/Grid.css | 7 + docs-src/components/grid/Grid.svelte | 67 + docs-src/components/grid/index.js | 1 + docs-src/components/index.js | 1 + docs-src/nav/Nav.svelte | 1 + docs/docs.css | 629 +- docs/docs.js | 83548 ++++++++++++++++++++++++- docs/index.html | 2 +- docs/ui.css | 2731 +- src/grid/Grid.css | 78 + src/grid/Grid.svelte | 222 + src/grid/index.js | 1 + src/grid/parts/GridBody.svelte | 12 + src/grid/parts/GridFoot.svelte | 21 + src/grid/parts/GridHead.svelte | 32 + src/grid/parts/GridHeadTH.svelte | 59 + src/grid/parts/GridRow.svelte | 31 + src/grid/parts/index.js | 3 + src/grid/store/columns.js | 16 + src/grid/store/data.js | 91 + src/grid/store/index.js | 2 + src/grid/utils.js | 31 + src/index.js | 1 + src/table/Table.css | 2 +- 24 files changed, 87405 insertions(+), 184 deletions(-) create mode 100644 docs-src/components/grid/Grid.css create mode 100644 docs-src/components/grid/Grid.svelte create mode 100644 docs-src/components/grid/index.js create mode 100644 src/grid/Grid.css create mode 100644 src/grid/Grid.svelte create mode 100644 src/grid/index.js create mode 100644 src/grid/parts/GridBody.svelte create mode 100644 src/grid/parts/GridFoot.svelte create mode 100644 src/grid/parts/GridHead.svelte create mode 100644 src/grid/parts/GridHeadTH.svelte create mode 100644 src/grid/parts/GridRow.svelte create mode 100644 src/grid/parts/index.js create mode 100644 src/grid/store/columns.js create mode 100644 src/grid/store/data.js create mode 100644 src/grid/store/index.js create mode 100644 src/grid/utils.js diff --git a/docs-src/components/grid/Grid.css b/docs-src/components/grid/Grid.css new file mode 100644 index 00000000..9e24cd82 --- /dev/null +++ b/docs-src/components/grid/Grid.css @@ -0,0 +1,7 @@ +.table-viewport { + width: 500px; + max-width: 100%; + height: 500px; + border: 2px dashed red; + padding: 5px; +} diff --git a/docs-src/components/grid/Grid.svelte b/docs-src/components/grid/Grid.svelte new file mode 100644 index 00000000..5ce1c8d6 --- /dev/null +++ b/docs-src/components/grid/Grid.svelte @@ -0,0 +1,67 @@ +

Grid

+

Grid component is basically a table on steroids.

+
+ +
+ + + + + + + + + + + diff --git a/docs-src/components/grid/index.js b/docs-src/components/grid/index.js new file mode 100644 index 00000000..1fc7e2aa --- /dev/null +++ b/docs-src/components/grid/index.js @@ -0,0 +1 @@ +export { default as Grid } from './Grid.svelte'; diff --git a/docs-src/components/index.js b/docs-src/components/index.js index 9680760e..0d599f35 100644 --- a/docs-src/components/index.js +++ b/docs-src/components/index.js @@ -13,6 +13,7 @@ export { Dialog } from './dialog'; export { Drawer } from './drawer'; export { Panel } from './panel'; export { Popover } from './popover'; +export { Grid } from './grid'; export { Table } from './table'; export { Tree } from './tree'; diff --git a/docs-src/nav/Nav.svelte b/docs-src/nav/Nav.svelte index 0cc5ec1c..edb1c4aa 100644 --- a/docs-src/nav/Nav.svelte +++ b/docs-src/nav/Nav.svelte @@ -45,6 +45,7 @@

Containers

+ diff --git a/docs/docs.css b/docs/docs.css index b9656c0f..ad68c022 100644 --- a/docs/docs.css +++ b/docs/docs.css @@ -1 +1,628 @@ -.api-table{height:unset;overflow:auto visible;overscroll-behavior-y:unset}.api-table table{min-width:900px}.api-table tr td{vertical-align:top;padding-block:0.5rem}.api-table tr td:first-child,.api-table tr th:first-child{width:200px}.api-table tr td:nth-child(2),.api-table tr th:nth-child(2){width:200px}.api-table tr td:last-child,.api-table tr th:last-child{min-width:400px}body,html{margin:0;background-color:var(--ui-color-background);color:var(--ui-color-text);--sidebar-width:220px}@font-face{font-family:'Prime Light';src:url('prime_light-webfont.woff2') format('woff2'),url('prime_light-webfont.woff') format('woff');font-weight:light;font-style:normal}a{color:inherit}a:hover{text-decoration-color:var(--ui-color-accent);text-decoration-thickness:2px;text-underline-offset:0.3rem}main{padding:0 2rem 8rem;margin-left:var(--sidebar-width)}h1,h2,h3{font-weight:500;margin:2rem 0 1.2rem;width:100%}h1:first-child,h2:first-child,h3:first-of-type{margin-top:0}p{line-height:1.7;margin-block:1.5rem;max-width:120ch}p b{font-weight:700;letter-spacing:.5px}ul{line-height:1.7;margin:0;padding-left:2rem}ul li{margin-block:0.5rem}p+ul{margin-top:-1rem}em{color:var(--ui-color-accent);font-style:normal}hr{width:100%;height:0;border:0;border-top:1px solid var(--ui-color-border-2);margin:3em 0 2em}.docs-overflow-box{border:2px dotted var(--ui-color-accent);background-color:var(--ui-color-background);padding:1em;overflow:hidden;z-index:1;position:relative}.docs-buttons-row{display:flex;flex-flow:wrap row;align-items:flex-start;justify-content:flex-start;gap:.5rem;flex-shrink:0}@media (1px <= width <= 700px){main{margin-left:0}}code,main pre[class]{background-color:#1a1a1a;color:#ccc;border-radius:var(--ui-border-radius);font-size:var(--ui-font-s)}code{display:block;width:100%;padding:1em;margin-block:1em;line-height:2;white-space:pre;overflow:auto}code[class*=language-]{padding:0;margin:0}.dark-mode-switch{min-width:7rem;position:fixed;top:.5rem;right:.6rem;z-index:55}aside{border-right:1px solid var(--ui-color-border-2);overflow-y:auto;background:var(--ui-color-background);position:fixed;width:var(--sidebar-width);left:0;top:0;height:100lvh;padding:0 1rem calc(100lvh - 100svh);overscroll-behavior:contain}menu{width:100%;display:flex;flex-flow:column;padding:1rem 0 0;margin:0 0 2rem}menu h3{margin:0 -1rem;padding:var(--ui-margin-m) var(--ui-margin-l);white-space:nowrap;font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:var(--ui-font-xl)}menu h3:not(:first-child){margin-top:var(--ui-margin-l)}menu a{color:var(--ui-color-text);text-decoration:none;display:block;margin:var(--ui-margin-s) 0;padding:var(--ui-margin-m) 1.4rem;border-radius:var(--ui-border-radius);white-space:nowrap;touch-action:manipulation}menu a:hover{background-color:var(--ui-color-highlight-1)}menu a.active{background-color:var(--ui-color-highlight)}.nav-toggler{--ui-button-size:1.1em;position:fixed;left:0;top:.4rem;z-index:65;color:var(--ui-color-text-1);display:none;transform:translateX(10px)}.nav-toggler:hover{color:var(--ui-color-text);background:0 0}.btn-scroll-top{position:fixed;bottom:1rem;right:1rem;z-index:999}.btn-scroll-top.hidden{display:none}@media (1px <= width <= 700px){.nav-toggler{display:flex}.nav-toggler.expanded{transform:translateX(calc(var(--sidebar-width) - 40px))}aside{box-shadow:2px 1px 10px #0006;transform:translateX(calc(var(--sidebar-width) * -1));z-index:60;--sidebar-elastic-padding:80px;width:calc(var(--sidebar-width) + var(--sidebar-elastic-padding));left:calc(var(--sidebar-elastic-padding) * -1);padding-left:calc(var(--sidebar-elastic-padding) + 1rem)}aside.expanded{transform:translateX(0)}.nav-toggler:not(.swiping),aside:not(.swiping){transition:transform .3s cubic-bezier(.5, .2, .5, 1.2)}}.banner{height:clamp(100px,40vw,360px);padding-top:60px;display:flex;align-items:flex-start;justify-content:center}.banner a{display:inline-flex;align-items:center;justify-content:center;gap:2vw;margin:auto;padding:0;text-decoration:none}.logo{width:clamp(42px,10vw,160px);height:clamp(42px,10vw,160px);opacity:.9;filter:drop-shadow(0 1px 1px #000)}.logotype{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:clamp(28px, 6vw, 90px);font-weight:100;margin:0;padding:0 4px 0 0;display:flex;flex-flow:row;white-space:nowrap;line-height:1;width:auto}.logotype em{font-weight:500}.logotype sub{font-size:var(--ui-font-m);font-weight:300;color:var(--ui-color-text-semi);margin:-1rem 0 0 -63px;width:60px;text-align:right}.banner a:hover .logotype em,.banner a:hover .logotype span{text-decoration:underline;text-decoration-thickness:1px;text-decoration-skip-ink:none;text-underline-offset:8px}.banner a:hover .logotype span{text-decoration-color:var(--ui-color-accent)}.banner a:hover .logotype em{text-decoration-color:var(--ui-color-text)}.footer-links{display:flex;align-items:center;justify-content:center;gap:5vw;margin:6rem 0 0;height:2rem}.footer-links a,.footer-links a:hover{text-decoration:none;height:100%;display:flex;align-items:center;color:var(--ui-color-text-semi);transition:color .1s}.footer-links a:hover{color:var(--ui-color-text)}.footer-links a svg{height:2rem;width:2rem;margin:0}.footer-links a.npm svg{width:5rem}.sticky-block{background:var(--ui-color-background);margin:0;padding:0}.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;margin:2rem -2rem 1rem;padding:.5rem 100px .5rem 2rem}.prime-light{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif}.sticky-block>h2,main>h2{font-size:1.8rem;width:auto;border-bottom:1px solid var(--ui-color-border-2);position:sticky;top:0;z-index:50;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}main>h2 em{color:var(--ui-color-text-semi);font-size:1.2rem;line-height:1.8rem;margin-left:.5rem;vertical-align:text-top}main>p code,main>ul li code{display:inline;padding:0;margin:0;background:0 0;color:var(--ui-color-accent);font:inherit;white-space:break-spaces}@media (1px <= width <= 700px){.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{padding-left:54px}}.button-demo-props{display:flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem;width:clamp(300px,600px,100%)}.button-demo-props .input{display:flex;flex-flow:row;width:100%}.button-demo-props .input .label{width:5rem;flex-shrink:0}.button-demo-props .input .input-text-inner{flex:1}.button-demo-props .toggle{display:flex;flex-flow:row;width:100%}.button-demo-props .toggle .label{width:5rem;flex-shrink:0}@media (1px <= width <= 700px){.button-demo-props{width:100%}}.group{background:var(--ui-color-background-2);padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-gap:6px;border-radius:var(--ui-border-radius-m)}.palette-box{padding:10px 0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(var(--ui-border-radius-m) - 3px);background-color:var(--ui-color-background-2)}.icons{margin-bottom:2em}.icon-block{float:left;width:128px;height:128px;margin:0 1em 1em 0;display:flex;flex-flow:column;align-items:stretch;justify-content:stretch;background-color:var(--ui-color-background-semi);padding:0 10px 10px;border-radius:5px;border:1px solid var(--ui-color-border)}.icon-block-icon{flex:1;display:flex;align-items:center;justify-content:center}.icon-block-icon svg{width:32px;height:32px}.icon-block-name{height:20px;text-align:center;overflow-wrap:break-word;font-size:var(--ui-font-s)}.div{border:1px dashed red;height:100px;width:200px;display:inline-grid;place-items:center;margin:1rem 1rem 1rem 0;-webkit-user-select:none;user-select:none}.docs-menu-align-right{padding:2rem 0;border:1px dashed var(--ui-color-accent);text-align:right}.notification-center-header{margin-bottom:1rem;display:flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:2rem}.notification-center-header h2{display:inline-block;width:auto;padding:0;margin:0}.prop-row{padding:1rem 0;display:flex;align-items:center;justify-content:flex-start;gap:1rem}.panel p{margin:0}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.split-wrap{width:400px;height:200px;border:1px solid red;display:flex;flex-flow:row;position:relative}.split-wrap-v{flex-flow:column}.split-box{border:1px solid green;flex:1}.min-w{min-width:20px;max-width:220px}.min-h{min-height:50px;max-height:150px}.table-viewport{width:500px;max-width:100%;height:500px;border:2px dashed red;padding:5px}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.section-utils{--nav-sidebar-width:240px}.section-utils .dark-mode-switch{right:calc(var(--nav-sidebar-width) + 20px)}.section-utils .sticky-block{padding-bottom:3rem;margin-right:var(--nav-sidebar-width)}.section-utils .sticky-block .utility h3{scroll-margin-top:4.2rem;font-size:1.1rem;color:var(--ui-color-accent);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace}.section-utils .utilities-nav{position:fixed;right:0;top:0;bottom:0;z-index:52;margin:0;padding:1rem 2rem;overflow-y:auto;width:var(--nav-sidebar-width);border-left:1px solid var(--ui-color-border-2);background-color:var(--ui-color-background-input)}.section-utils .utility{margin:0 -2rem;padding:1rem 2rem;border-bottom:1px solid var(--ui-color-border-2)}.section-utils .btn-scroll-top{right:calc(var(--nav-sidebar-width) + 20px)}@media (1px <= width <= 900px){.section-utils .dark-mode-switch{right:.6rem}.section-utils .btn-scroll-top{right:1rem}.section-utils .sticky-block{margin-right:0}.section-utils .utilities-nav{position:static;border-left:none;width:auto;z-index:initial;margin-top:2rem;background-color:unset}}.button-toggle-wrapper-wide{width:400px;max-width:100%}.button-toggle-wrapper-wide .button-toggle{width:100%}.toggle-box{margin:10px 0 0;line-height:2.4em;display:none}.toggle-box.visible{display:block} \ No newline at end of file +.api-table { + height: unset; + overflow: auto visible; + overscroll-behavior-y: unset; +} +.api-table table { min-width: 900px; } + +.api-table tr td { vertical-align: top; padding-block: 0.5rem;} + +.api-table tr th:first-child, +.api-table tr td:first-child { width: 200px; } + +.api-table tr th:nth-child(2), +.api-table tr td:nth-child(2) { width: 200px; } + +.api-table tr th:last-child, +.api-table tr td:last-child { min-width: 400px; } + +html, +body { + margin: 0; + background-color: var(--ui-color-background); + color: var(--ui-color-text); + + --sidebar-width: 220px; +} + + +@font-face { + font-family: 'Prime Light'; + src: url('prime_light-webfont.woff2') format('woff2'), + url('prime_light-webfont.woff') format('woff'); + font-weight: light; + font-style: normal; +} + + +a { color: inherit; } +a:hover { + text-decoration-color: var(--ui-color-accent); + text-decoration-thickness: 2px; + text-underline-offset: 0.3rem; +} + +main { + padding: 0 2rem 8rem; + margin-left: var(--sidebar-width); +} + +h1, +h2, +h3 { font-weight: 500; margin: 2rem 0 1.2rem; width: 100%; } + +h1:first-child, +h2:first-child, +h3:first-of-type { margin-top: 0; } + +p { line-height: 1.7; margin-block: 1.5rem; max-width: 120ch; } +p b { font-weight: 700; letter-spacing: 0.5px; } + +ul { line-height: 1.7; margin: 0; padding-left: 2rem; } +ul li { margin-block: 0.5rem; } + +p + ul { margin-top: -1rem } + +em { color: var(--ui-color-accent); font-style: normal; } + + +hr { + width: 100%; + height: 0; + border: 0; + border-top: 1px solid var(--ui-color-border-2); + margin: 3em 0 2em; +} + + +.docs-overflow-box { + border: 2px dotted var(--ui-color-accent); + background-color: var(--ui-color-background); + padding: 1em; + overflow: hidden; + z-index: 1; + position: relative; +} + +.docs-buttons-row { + display: flex; + flex-flow: wrap row; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + flex-shrink: 0; +} + + + +@media (1px <= width <= 700px) { + main { margin-left: 0; } +} + +main pre[class], +code { + background-color: #1a1a1a; + color: #ccc; + border-radius: var(--ui-border-radius); + font-size: var(--ui-font-s) +} + +code { + display: block; + width: 100%; + padding: 1em; + margin-block: 1em; + line-height: 2; + white-space: pre; + overflow: auto; +} + +code[class*=language-] { padding: 0; margin: 0; } + +.dark-mode-switch { + min-width: 7rem; + position: fixed; + top: 0.5rem; + right: 0.6rem; + z-index: 55; +} + +aside { + border-right: 1px solid var(--ui-color-border-2); + overflow-y: auto; + background: var(--ui-color-background); + position: fixed; + width: var(--sidebar-width); + + left: 0; + top: 0; + height: 100lvh; + padding: 0 1rem calc(100lvh - 100svh); + + overscroll-behavior: contain; +} + +menu { + width: 100%; + display: flex; + flex-flow: column; + padding: 1rem 0 0; + margin: 0 0 2rem; +} + +menu h3 { + margin: 0 -1rem; + padding: var(--ui-margin-m) var(--ui-margin-l); + white-space: nowrap; + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-size: var(--ui-font-xl); +} + +menu h3:not(:first-child) { margin-top: var(--ui-margin-l); } + +menu a { + color: var(--ui-color-text); + text-decoration: none; + display: block; + margin: var(--ui-margin-s) 0; + padding: var(--ui-margin-m) 1.4rem; + border-radius: var(--ui-border-radius); + white-space: nowrap; + touch-action: manipulation; +} + +menu a:hover { background-color: var(--ui-color-highlight-1); } +menu a.active { background-color: var(--ui-color-highlight); } + + +.nav-toggler { + --ui-button-size: 1.1em; + position: fixed; + left: 0; + top: 0.4rem; + z-index: 65; + color: var(--ui-color-text-1); + display: none; + transform: translateX(10px); +} +.nav-toggler:hover { color: var(--ui-color-text); background: none; } + +.btn-scroll-top { + position: fixed; + bottom: 1rem; + right: 1rem; + z-index: 999; +} +.btn-scroll-top.hidden { display: none; } + + +@media (1px <= width <= 700px) { + .nav-toggler { display: flex; } + .nav-toggler.expanded { transform: translateX(calc(var(--sidebar-width) - 40px)); } + + aside { + box-shadow: 2px 1px 10px #0006; + transform: translateX(calc(var(--sidebar-width) * -1)); + z-index: 60; + + --sidebar-elastic-padding: 80px; + width: calc(var(--sidebar-width) + var(--sidebar-elastic-padding)); + left: calc(var(--sidebar-elastic-padding) * -1); + padding-left: calc(var(--sidebar-elastic-padding) + 1rem); + + } + aside.expanded { transform: translateX(0); } + + .nav-toggler:not(.swiping), + aside:not(.swiping) { transition: transform .3s cubic-bezier(.5, .2, .5, 1.2); } +} + +.banner { + height: clamp(100px, 40vw, 360px); + padding-top: 60px; + display: flex; + align-items: flex-start; + justify-content: center; +} + +.banner a { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 2vw; + margin: auto; + padding: 0; + text-decoration: none; +} + +.logo { + width: clamp(42px, 10vw, 160px); + height: clamp(42px, 10vw, 160px); + opacity: 0.9; + filter: drop-shadow(0 1px 1px #000); +} + + +.logotype { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-size: clamp(28px, 6vw, 90px); + font-weight: 100; + margin: 0; + padding: 0 4px 0 0; + display: flex; + flex-flow: row; + white-space: nowrap; + line-height: 1; + width: auto; +} + +.logotype em { font-weight: 500; } +.logotype sub { + font-size: var(--ui-font-m); + font-weight: 300; + color: var(--ui-color-text-semi); + margin: -1rem 0 0 -63px; + width: 60px; + text-align: right; +} + + +.banner a:hover .logotype span, +.banner a:hover .logotype em { + text-decoration: underline; + text-decoration-thickness: 1px; + text-decoration-skip-ink: none; + text-underline-offset: 8px; +} +.banner a:hover .logotype span { text-decoration-color: var(--ui-color-accent); } +.banner a:hover .logotype em { text-decoration-color: var(--ui-color-text); } + + + + + +.footer-links { + display: flex; + align-items: center; + justify-content: center; + gap: 5vw; + margin: 6rem 0 0; + height: 2rem; +} + +.footer-links a, +.footer-links a:hover { + text-decoration: none; + height: 100%; + display: flex; + align-items: center; + color: var(--ui-color-text-semi); + transition: color 0.1s; +} + +.footer-links a:hover { color: var(--ui-color-text); } + +.footer-links a svg { height: 2rem; width: 2rem; margin: 0; } +.footer-links a.npm svg { width: 5rem; } + + + + +.sticky-block { + background: var(--ui-color-background); + margin: 0; + padding: 0; +} + +main>h1, +main>h2, +.sticky-block>h1, +.sticky-block>h2 { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + margin: 2rem -2rem 1rem; + padding: 0.5rem 100px 0.5rem 2rem; +} + +.prime-light { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; +} + +/* stylelint-disable-next-line no-descending-specificity */ +main>h2, +.sticky-block>h2 { + font-size: 1.8rem; + width: auto; + border-bottom: 1px solid var(--ui-color-border-2); + position: sticky; + top: 0; + z-index: 50; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + -webkit-backdrop-filter: blur(15px); + backdrop-filter: blur(15px); +} + + + +/* stylelint-disable-next-line no-descending-specificity */ +main>h2 em { + color: var(--ui-color-text-semi); + font-size: 1.2rem; + line-height: 1.8rem; + margin-left: 0.5rem; + vertical-align: text-top; +} + +main>p code, +main>ul li code { + display: inline; + padding: 0; + margin: 0; + background: none; + color: var(--ui-color-accent); + font: inherit; + white-space: break-spaces; +} + + +@media (1px <= width <= 700px) { + main>h1, + main>h2, + .sticky-block>h1, + .sticky-block>h2 { padding-left: 54px; } +} + +.button-demo-props { + display: flex; + flex-flow: column; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + width: clamp(300px, 600px, 100%); +} + +.button-demo-props .input { display: flex; flex-flow: row; width: 100%; } +.button-demo-props .input .label { width: 5rem; flex-shrink: 0; } +.button-demo-props .input .input-text-inner { flex: 1; } + + +.button-demo-props .toggle { display: flex; flex-flow: row; width: 100%; } +.button-demo-props .toggle .label { width: 5rem; flex-shrink: 0; } + +@media (1px <= width <= 700px) { + .button-demo-props { + width: 100%; + } +} + +.group { + background: var(--ui-color-background-2); + padding: 6px; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); + grid-gap: 6px; + border-radius: var(--ui-border-radius-m); +} + +.palette-box { + padding: 10px 0; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; + border-radius: calc(var(--ui-border-radius-m) - 3px); + background-color: var(--ui-color-background-2); +} + +.table-viewport { + width: 500px; + max-width: 100%; + height: 500px; + border: 2px dashed red; + padding: 5px; +} + +.icons { margin-bottom: 2em; } + +.icon-block { + float: left; + width: 128px; + height: 128px; + margin: 0 1em 1em 0; + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: stretch; + background-color: var(--ui-color-background-semi); + padding: 0 10px 10px; + border-radius: 5px; + border: 1px solid var(--ui-color-border); +} + +.icon-block-icon { + flex: 1; + display: flex; + align-items: center; + justify-content: center; +} + +.icon-block-icon svg { + width: 32px; + height: 32px; +} + +.icon-block-name { + height: 20px; + text-align: center; + overflow-wrap: break-word; + font-size: var(--ui-font-s) +} + +.div { + border: 1px dashed red; + height: 100px; + width: 200px; + display: inline-grid; + place-items: center; + margin: 1rem 1rem 1rem 0; + -webkit-user-select: none; + user-select: none; +} + + +.docs-menu-align-right { + padding: 2rem 0; + border: 1px dashed var(--ui-color-accent); + text-align: right; +} + +.notification-center-header { + margin-bottom: 1rem; + display: flex; + flex-flow: row; + align-items: center; + justify-content: flex-start; + gap: 2rem; +} + +.notification-center-header h2 { + display: inline-block; + width: auto; + padding: 0; + margin: 0; +} + + +.prop-row { + padding: 1rem 0; + display: flex; + align-items: center; + justify-content: flex-start; + gap: 1rem; +} + +.panel p { margin: 0; } + +.tooltip-box { + display: inline-block; + margin: 10px 0 0; + line-height: 2.4em; + padding: 1em; + border: 1px solid #ccc; + min-width: 6em; + text-align: center; +} + +.tooltip-html h1, +.tooltip-html p { margin: 0; } +.tooltip-html b { color: var(--ui-color-accent); } +.tooltip-html a:hover { text-decoration: none; } + +.split-wrap { + width: 400px; + height: 200px; + border: 1px solid red; + display: flex; + flex-flow: row; + position: relative; +} + +.split-wrap-v { flex-flow: column; } +.split-box { border: 1px solid green; flex: 1; } + +.min-w { min-width: 20px; max-width: 220px; } +.min-h { min-height: 50px; max-height: 150px; } + +.table-viewport { + width: 500px; + max-width: 100%; + height: 500px; + border: 2px dashed red; + padding: 5px; +} + +.tooltip-box { + display: inline-block; + margin: 10px 0 0; + line-height: 2.4em; + padding: 1em; + border: 1px solid #ccc; + min-width: 6em; + text-align: center; +} + +.tooltip-html h1, +.tooltip-html p { margin: 0; } +.tooltip-html b { color: var(--ui-color-accent); } +.tooltip-html a:hover { text-decoration: none; } + +.section-utils { + --nav-sidebar-width: 240px; +} +.section-utils .dark-mode-switch { right: calc(var(--nav-sidebar-width) + 20px); } + +.section-utils .sticky-block { padding-bottom: 3rem; margin-right: var(--nav-sidebar-width); } + + +.section-utils .sticky-block .utility h3 { + scroll-margin-top: 4.2rem; + font-size: 1.1rem; + color: var(--ui-color-accent); + font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace; +} + + +.section-utils .utilities-nav { + position: fixed; + right: 0; + top: 0; + bottom: 0; + z-index: 52; + margin: 0; + padding: 1rem 2rem; + overflow-y: auto; + width: var(--nav-sidebar-width); + border-left: 1px solid var(--ui-color-border-2); + background-color: var(--ui-color-background-input); +} + +.section-utils .utility { + margin: 0 -2rem; + padding: 1rem 2rem; + border-bottom: 1px solid var(--ui-color-border-2); +} + + +.section-utils .btn-scroll-top { right: calc(var(--nav-sidebar-width) + 20px); } + + +@media (1px <= width <= 900px) { + .section-utils .dark-mode-switch { right: 0.6rem; } + .section-utils .btn-scroll-top { right: 1rem; } + .section-utils .sticky-block { margin-right: 0; } + .section-utils .utilities-nav { + position: static; + border-left: none; + width: auto; + z-index: initial; + margin-top: 2rem; + background-color: unset; + } + +} + +.button-toggle-wrapper-wide { width: 400px; max-width: 100%; } +.button-toggle-wrapper-wide .button-toggle { width: 100%; } + +.toggle-box { + margin: 10px 0 0; + line-height: 2.4em; + display: none; +} + +.toggle-box.visible { + display: block; +} +/*# sourceMappingURL=docs.css.map */ diff --git a/docs/docs.js b/docs/docs.js index c6156412..91c98738 100644 --- a/docs/docs.js +++ b/docs/docs.js @@ -1,68 +1,50828 @@ -var h2=Object.create;var hd=Object.defineProperty;var g2=Object.getOwnPropertyDescriptor;var b2=Object.getOwnPropertyNames;var _2=Object.getPrototypeOf,v2=Object.prototype.hasOwnProperty;var Kt=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),gd=(t,e)=>{for(var n in e)hd(t,n,{get:e[n],enumerable:!0})},$2=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of b2(e))!v2.call(t,l)&&l!==n&&hd(t,l,{get:()=>e[l],enumerable:!(i=g2(e,l))||i.enumerable});return t};var bd=(t,e,n)=>(n=t!=null?h2(_2(t)):{},$2(e||!t||!t.__esModule?hd(n,"default",{value:t,enumerable:!0}):n,t));var Ri=Kt(ei=>{"use strict";Object.defineProperty(ei,"__esModule",{value:!0});ei.TraceDirectionKey=ei.Direction=ei.Axis=void 0;var Yc;ei.TraceDirectionKey=Yc;(function(t){t.NEGATIVE="NEGATIVE",t.POSITIVE="POSITIVE",t.NONE="NONE"})(Yc||(ei.TraceDirectionKey=Yc={}));var Gc;ei.Direction=Gc;(function(t){t.TOP="TOP",t.LEFT="LEFT",t.RIGHT="RIGHT",t.BOTTOM="BOTTOM",t.NONE="NONE"})(Gc||(ei.Direction=Gc={}));var Kc;ei.Axis=Kc;(function(t){t.X="x",t.Y="y"})(Kc||(ei.Axis=Kc={}))});var Jc=Kt(Zc=>{"use strict";Object.defineProperty(Zc,"__esModule",{value:!0});Zc.calculateDirection=dw;var Xc=Ri();function dw(t){var e,n=Xc.TraceDirectionKey.NEGATIVE,i=Xc.TraceDirectionKey.POSITIVE,l=t[t.length-1],r=t[t.length-2]||0;return t.every(function(a){return a===0})?Xc.TraceDirectionKey.NONE:(e=l>r?i:n,l===0&&(e=r<0?i:n),e)}});var Ga=Kt(di=>{"use strict";Object.defineProperty(di,"__esModule",{value:!0});di.resolveAxisDirection=di.getDirectionValue=di.getDirectionKey=di.getDifference=void 0;var Dn=Ri(),cw=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},n=Object.keys(e).toString();switch(n){case Dn.TraceDirectionKey.POSITIVE:return Dn.TraceDirectionKey.POSITIVE;case Dn.TraceDirectionKey.NEGATIVE:return Dn.TraceDirectionKey.NEGATIVE;default:return Dn.TraceDirectionKey.NONE}};di.getDirectionKey=cw;var pw=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return e[e.length-1]||0};di.getDirectionValue=pw;var hw=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;return Math.abs(e-n)};di.getDifference=hw;var gw=function(e,n){var i=Dn.Direction.LEFT,l=Dn.Direction.RIGHT,r=Dn.Direction.NONE;return e===Dn.Axis.Y&&(i=Dn.Direction.BOTTOM,l=Dn.Direction.TOP),n===Dn.TraceDirectionKey.NEGATIVE&&(r=i),n===Dn.TraceDirectionKey.POSITIVE&&(r=l),r};di.resolveAxisDirection=gw});var ep=Kt(Qc=>{"use strict";Object.defineProperty(Qc,"__esModule",{value:!0});Qc.calculateDirectionDelta=_w;var bw=Ri(),as=Ga();function _w(t){for(var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,n=t.length,i=n-1,l=bw.TraceDirectionKey.NONE;i>=0;i--){var r=t[i],a=(0,as.getDirectionKey)(r),u=(0,as.getDirectionValue)(r[a]),m=t[i-1]||{},f=(0,as.getDirectionKey)(m),c=(0,as.getDirectionValue)(m[f]),g=(0,as.getDifference)(u,c);if(g>=e){l=a;break}else l=f}return l}});var np=Kt(tp=>{"use strict";Object.defineProperty(tp,"__esModule",{value:!0});tp.calculateDuration=vw;function vw(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;return t?e-t:0}});var C_=Kt(ip=>{"use strict";Object.defineProperty(ip,"__esModule",{value:!0});ip.calculateMovingPosition=$w;function $w(t){if("changedTouches"in t){var e=t.changedTouches&&t.changedTouches[0];return{x:e&&e.clientX,y:e&&e.clientY}}return{x:t.clientX,y:t.clientY}}});var sp=Kt(op=>{"use strict";Object.defineProperty(op,"__esModule",{value:!0});op.updateTrace=ww;function ww(t,e){var n=t[t.length-1];return n!==e&&t.push(e),t}});var rp=Kt(lp=>{"use strict";Object.defineProperty(lp,"__esModule",{value:!0});lp.calculateTraceDirections=yw;var Ka=Ri();function S_(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function yw(){for(var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],e=[],n=Ka.TraceDirectionKey.POSITIVE,i=Ka.TraceDirectionKey.NEGATIVE,l=0,r=[],a=Ka.TraceDirectionKey.NONE;lm?n:i;a===Ka.TraceDirectionKey.NONE&&(a=f),f===a?r.push(u):(e.push(S_({},a,r.slice())),r=[],r.push(u),a=f)}else u!==0&&(a=u>0?n:i),r.push(u)}return r.length&&e.push(S_({},a,r)),e}});var up=Kt(ap=>{"use strict";Object.defineProperty(ap,"__esModule",{value:!0});ap.resolveDirection=Cw;var kw=Jc(),Tw=rp(),Mw=ep(),L_=Ga(),Ew=Ri();function Cw(t){var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Ew.Axis.X,n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:0;if(n){var i=(0,Tw.calculateTraceDirections)(t),l=(0,Mw.calculateDirectionDelta)(i,n);return(0,L_.resolveAxisDirection)(e,l)}var r=(0,kw.calculateDirection)(t);return(0,L_.resolveAxisDirection)(e,r)}});var mp=Kt(fp=>{"use strict";Object.defineProperty(fp,"__esModule",{value:!0});fp.calculateVelocity=Sw;function Sw(t,e,n){var i=Math.sqrt(t*t+e*e);return i/(n||1)}});var O_=Kt(dp=>{"use strict";Object.defineProperty(dp,"__esModule",{value:!0});dp.calculatePosition=Aw;var D_=sp(),A_=up(),Lw=np(),Dw=mp(),I_=Ri();function Aw(t,e){var n=t.start,i=t.x,l=t.y,r=t.traceX,a=t.traceY,u=e.rotatePosition,m=e.directionDelta,f=u.x-i,c=l-u.y,g=Math.abs(f),b=Math.abs(c);(0,D_.updateTrace)(r,f),(0,D_.updateTrace)(a,c);var h=(0,A_.resolveDirection)(r,I_.Axis.X,m),v=(0,A_.resolveDirection)(a,I_.Axis.Y,m),w=(0,Lw.calculateDuration)(n,Date.now()),k=(0,Dw.calculateVelocity)(g,b,w);return{absX:g,absY:b,deltaX:f,deltaY:c,directionX:h,directionY:v,duration:w,positionX:u.x,positionY:u.y,velocity:k}}});var x_=Kt(Xa=>{"use strict";Object.defineProperty(Xa,"__esModule",{value:!0});Xa.checkIsMoreThanSingleTouches=void 0;var Iw=function(e){return!!(e.touches&&e.touches.length>1)};Xa.checkIsMoreThanSingleTouches=Iw});var pp=Kt(cp=>{"use strict";Object.defineProperty(cp,"__esModule",{value:!0});cp.createOptions=Ow;function Ow(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return Object.defineProperty(t,"passive",{get:function(){return this.isPassiveSupported=!0,!0},enumerable:!0}),t}});var H_=Kt(us=>{"use strict";Object.defineProperty(us,"__esModule",{value:!0});us.checkIsPassiveSupported=Hw;us.noop=void 0;var xw=pp();function Hw(t){if(typeof t=="boolean")return t;var e={isPassiveSupported:t};try{var n=(0,xw.createOptions)(e);window.addEventListener("checkIsPassiveSupported",hp,n),window.removeEventListener("checkIsPassiveSupported",hp,n)}catch{}return e.isPassiveSupported}var hp=function(){};us.noop=hp});var P_=Kt(Za=>{"use strict";Object.defineProperty(Za,"__esModule",{value:!0});Za.checkIsTouchEventsSupported=void 0;function gp(t){"@babel/helpers - typeof";return gp=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},gp(t)}var Pw=function(){return(typeof window>"u"?"undefined":gp(window))==="object"&&("ontouchstart"in window||!!window.navigator.maxTouchPoints)};Za.checkIsTouchEventsSupported=Pw});var F_=Kt(Ja=>{"use strict";Object.defineProperty(Ja,"__esModule",{value:!0});Ja.getInitialState=void 0;function N_(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter(function(l){return Object.getOwnPropertyDescriptor(t,l).enumerable})),n.push.apply(n,i)}return n}function Nw(t){for(var e=1;e0&&arguments[0]!==void 0?arguments[0]:{};return Nw({x:0,y:0,start:0,isSwiping:!1,traceX:[],traceY:[]},e)};Ja.getInitialState=qw});var B_=Kt(Qa=>{"use strict";Object.defineProperty(Qa,"__esModule",{value:!0});Qa.getInitialProps=void 0;function q_(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter(function(l){return Object.getOwnPropertyDescriptor(t,l).enumerable})),n.push.apply(n,i)}return n}function Bw(t){for(var e=1;e0&&arguments[0]!==void 0?arguments[0]:{};return Bw({element:null,target:null,delta:10,directionDelta:0,rotationAngle:0,mouseTrackingEnabled:!1,touchTrackingEnabled:!0,preventDefaultTouchmoveEvent:!1,preventTrackingOnMouseleave:!1},e)};Qa.getInitialProps=jw});var R_=Kt(bp=>{"use strict";Object.defineProperty(bp,"__esModule",{value:!0});bp.getOptions=zw;function zw(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:!1;return t?{passive:!1}:{}}});var j_=Kt(_p=>{"use strict";Object.defineProperty(_p,"__esModule",{value:!0});_p.rotateByAngle=Ww;function Ww(t){var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;if(e===0)return t;var n=t.x,i=t.y,l=Math.PI/180*e,r=n*Math.cos(l)+i*Math.sin(l),a=i*Math.cos(l)-n*Math.sin(l);return{x:r,y:a}}});var z_=Kt(et=>{"use strict";Object.defineProperty(et,"__esModule",{value:!0});var vp=Jc();Object.keys(vp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===vp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return vp[t]}})});var $p=ep();Object.keys($p).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===$p[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return $p[t]}})});var wp=np();Object.keys(wp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===wp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return wp[t]}})});var yp=C_();Object.keys(yp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===yp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return yp[t]}})});var kp=O_();Object.keys(kp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===kp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return kp[t]}})});var Tp=rp();Object.keys(Tp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Tp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Tp[t]}})});var Mp=mp();Object.keys(Mp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Mp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Mp[t]}})});var Ep=x_();Object.keys(Ep).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Ep[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Ep[t]}})});var Cp=H_();Object.keys(Cp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Cp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Cp[t]}})});var Sp=P_();Object.keys(Sp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Sp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Sp[t]}})});var Lp=Ga();Object.keys(Lp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Lp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Lp[t]}})});var Dp=pp();Object.keys(Dp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Dp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Dp[t]}})});var Ap=F_();Object.keys(Ap).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Ap[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Ap[t]}})});var Ip=B_();Object.keys(Ip).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Ip[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Ip[t]}})});var Op=R_();Object.keys(Op).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Op[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Op[t]}})});var xp=up();Object.keys(xp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===xp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return xp[t]}})});var Hp=j_();Object.keys(Hp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Hp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Hp[t]}})});var Pp=sp();Object.keys(Pp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Pp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Pp[t]}})})});var Y_=Kt(fo=>{"use strict";function Fp(t){"@babel/helpers - typeof";return Fp=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Fp(t)}Object.defineProperty(fo,"__esModule",{value:!0});var Vw={};fo.default=void 0;var fn=Uw(z_()),Np=Ri();Object.keys(Np).forEach(function(t){t==="default"||t==="__esModule"||Object.prototype.hasOwnProperty.call(Vw,t)||t in fo&&fo[t]===Np[t]||Object.defineProperty(fo,t,{enumerable:!0,get:function(){return Np[t]}})});function U_(t){if(typeof WeakMap!="function")return null;var e=new WeakMap,n=new WeakMap;return(U_=function(l){return l?n:e})(t)}function Uw(t,e){if(!e&&t&&t.__esModule)return t;if(t===null||Fp(t)!=="object"&&typeof t!="function")return{default:t};var n=U_(e);if(n&&n.has(t))return n.get(t);var i={},l=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var r in t)if(r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)){var a=l?Object.getOwnPropertyDescriptor(t,r):null;a&&(a.get||a.set)?Object.defineProperty(i,r,a):i[r]=t[r]}return i.default=t,n&&n.set(t,i),i}function Yw(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function W_(t,e){for(var n=0;n1&&arguments[1]!==void 0?arguments[1]:{directionDelta:0},l=this.props.rotationAngle,r=i.directionDelta,a=fn.calculateMovingPosition(n),u=fn.rotateByAngle(a,l);return fn.calculatePosition(this.state,{rotatePosition:u,directionDelta:r})}},{key:"handleSwipeStart",value:function(n){if(!fn.checkIsMoreThanSingleTouches(n)){var i=this.props.rotationAngle,l=fn.calculateMovingPosition(n),r=fn.rotateByAngle(l,i),a=r.x,u=r.y;this.state=fn.getInitialState({isSwiping:!1,start:Date.now(),x:a,y:u})}}},{key:"handleSwipeMove",value:function(n){var i=this.state,l=i.x,r=i.y,a=i.isSwiping;if(!(!l||!r||fn.checkIsMoreThanSingleTouches(n))){var u=this.props.directionDelta||0,m=this.getEventData(n,{directionDelta:u}),f=m.absX,c=m.absY,g=m.deltaX,b=m.deltaY,h=m.directionX,v=m.directionY,w=m.duration,k=m.velocity,_=this.props,M=_.delta,O=_.preventDefaultTouchmoveEvent,D=_.onSwipeStart,L=_.onSwiping;n.cancelable&&O&&n.preventDefault(),!(f{var X6=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var Ze=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},l={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function w(k){return k instanceof r?new r(k.type,w(k.content),k.alias):Array.isArray(k)?k.map(w):k.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document&&1<2)return document.currentScript;try{throw new Error}catch(M){var w=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(M.stack)||[])[1];if(w){var k=document.getElementsByTagName("script");for(var _ in k)if(k[_].src==w)return k[_]}return null}},isActive:function(w,k,_){for(var M="no-"+k;w;){var O=w.classList;if(O.contains(k))return!0;if(O.contains(M))return!1;w=w.parentElement}return!!_}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(w,k){var _=l.util.clone(l.languages[w]);for(var M in k)_[M]=k[M];return _},insertBefore:function(w,k,_,M){M=M||l.languages;var O=M[w],D={};for(var L in O)if(O.hasOwnProperty(L)){if(L==k)for(var T in _)_.hasOwnProperty(T)&&(D[T]=_[T]);_.hasOwnProperty(L)||(D[L]=O[L])}var A=M[w];return M[w]=D,l.languages.DFS(l.languages,function(H,I){I===A&&H!=w&&(this[H]=D)}),D},DFS:function w(k,_,M,O){O=O||{};var D=l.util.objId;for(var L in k)if(k.hasOwnProperty(L)){_.call(k,L,k[L],M||L);var T=k[L],A=l.util.type(T);A==="Object"&&!O[D(T)]?(O[D(T)]=!0,w(T,_,null,O)):A==="Array"&&!O[D(T)]&&(O[D(T)]=!0,w(T,_,L,O))}}},plugins:{},highlightAll:function(w,k){l.highlightAllUnder(document,w,k)},highlightAllUnder:function(w,k,_){var M={callback:_,container:w,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};l.hooks.run("before-highlightall",M),M.elements=Array.prototype.slice.apply(M.container.querySelectorAll(M.selector)),l.hooks.run("before-all-elements-highlight",M);for(var O=0,D;D=M.elements[O++];)l.highlightElement(D,k===!0,M.callback)},highlightElement:function(w,k,_){var M=l.util.getLanguage(w),O=l.languages[M];l.util.setLanguage(w,M);var D=w.parentElement;D&&D.nodeName.toLowerCase()==="pre"&&l.util.setLanguage(D,M);var L=w.textContent,T={element:w,language:M,grammar:O,code:L};function A(I){T.highlightedCode=I,l.hooks.run("before-insert",T),T.element.innerHTML=T.highlightedCode,l.hooks.run("after-highlight",T),l.hooks.run("complete",T),_&&_.call(T.element)}if(l.hooks.run("before-sanity-check",T),D=T.element.parentElement,D&&D.nodeName.toLowerCase()==="pre"&&!D.hasAttribute("tabindex")&&D.setAttribute("tabindex","0"),!T.code){l.hooks.run("complete",T),_&&_.call(T.element);return}if(l.hooks.run("before-highlight",T),!T.grammar){A(l.util.encode(T.code));return}if(k&&t.Worker){var H=new Worker(l.filename);H.onmessage=function(I){A(I.data)},H.postMessage(JSON.stringify({language:T.language,code:T.code,immediateClose:!0}))}else A(l.highlight(T.code,T.grammar,T.language))},highlight:function(w,k,_){var M={code:w,grammar:k,language:_};if(l.hooks.run("before-tokenize",M),!M.grammar)throw new Error('The language "'+M.language+'" has no grammar.');return M.tokens=l.tokenize(M.code,M.grammar),l.hooks.run("after-tokenize",M),r.stringify(l.util.encode(M.tokens),M.language)},tokenize:function(w,k){var _=k.rest;if(_){for(var M in _)k[M]=_[M];delete k.rest}var O=new m;return f(O,O.head,w),u(w,O,k,O.head,0),g(O)},hooks:{all:{},add:function(w,k){var _=l.hooks.all;_[w]=_[w]||[],_[w].push(k)},run:function(w,k){var _=l.hooks.all[w];if(!(!_||!_.length))for(var M=0,O;O=_[M++];)O(k)}},Token:r};t.Prism=l;function r(w,k,_,M){this.type=w,this.content=k,this.alias=_,this.length=(M||"").length|0}r.stringify=function w(k,_){if(typeof k=="string")return k;if(Array.isArray(k)){var M="";return k.forEach(function(A){M+=w(A,_)}),M}var O={type:k.type,content:w(k.content,_),tag:"span",classes:["token",k.type],attributes:{},language:_},D=k.alias;D&&(Array.isArray(D)?Array.prototype.push.apply(O.classes,D):O.classes.push(D)),l.hooks.run("wrap",O);var L="";for(var T in O.attributes)L+=" "+T+'="'+(O.attributes[T]||"").replace(/"/g,""")+'"';return"<"+O.tag+' class="'+O.classes.join(" ")+'"'+L+">"+O.content+""};function a(w,k,_,M){w.lastIndex=k;var O=w.exec(_);if(O&&M&&O[1]){var D=O[1].length;O.index+=D,O[0]=O[0].slice(D)}return O}function u(w,k,_,M,O,D){for(var L in _)if(!(!_.hasOwnProperty(L)||!_[L])){var T=_[L];T=Array.isArray(T)?T:[T];for(var A=0;A=D.reach);F+=G.value.length,G=G.next){var z=G.value;if(k.length>w.length)return;if(!(z instanceof r)){var V=1,Q;if(N){if(Q=a(U,F,w,P),!Q||Q.index>=w.length)break;var Z=Q.index,le=Q.index+Q[0].length,ee=F;for(ee+=G.value.length;Z>=ee;)G=G.next,ee+=G.value.length;if(ee-=G.value.length,F=ee,G.value instanceof r)continue;for(var X=G;X!==k.tail&&(eeD.reach&&(D.reach=Y);var J=G.prev;he&&(J=f(k,J,he),F+=he.length),c(k,J,V);var pe=new r(L,I?l.tokenize(ge,I):ge,j,ge);if(G=f(k,J,pe),W&&f(k,G,W),V>1){var we={cause:L+","+A,reach:Y};u(w,k,_,G.prev,F,we),D&&we.reach>D.reach&&(D.reach=we.reach)}}}}}}function m(){var w={value:null,prev:null,next:null},k={value:null,prev:w,next:null};w.next=k,this.head=w,this.tail=k,this.length=0}function f(w,k,_){var M=k.next,O={value:_,prev:k,next:M};return k.next=O,M.prev=O,w.length++,O}function c(w,k,_){for(var M=k.next,O=0;O<_&&M!==w.tail;O++)M=M.next;k.next=M,M.prev=k,w.length-=O}function g(w){for(var k=[],_=w.head.next;_!==w.tail;)k.push(_.value),_=_.next;return k}if(!t.document)return t.addEventListener&&(l.disableWorkerMessageHandler||t.addEventListener("message",function(w){var k=JSON.parse(w.data),_=k.language,M=k.code,O=k.immediateClose;t.postMessage(l.highlight(M,l.languages[_],_)),O&&t.close()},!1)),l;var b=l.util.currentScript();b&&(l.filename=b.src,b.hasAttribute("data-manual")&&(l.manual=!0));function h(){l.manual||l.highlightAll()}if(!l.manual){var v=document.readyState;v==="loading"||v==="interactive"&&b&&b.defer?document.addEventListener("DOMContentLoaded",h):window.requestAnimationFrame?window.requestAnimationFrame(h):window.setTimeout(h,16)}return l}(X6);typeof eu<"u"&&eu.exports&&(eu.exports=Ze);typeof global<"u"&&(global.Prism=Ze);Ze.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};Ze.languages.markup.tag.inside["attr-value"].inside.entity=Ze.languages.markup.entity;Ze.languages.markup.doctype.inside["internal-subset"].inside=Ze.languages.markup;Ze.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(Ze.languages.markup.tag,"addInlined",{value:function(e,n){var i={};i["language-"+n]={pattern:/(^$)/i,lookbehind:!0,inside:Ze.languages[n]},i.cdata=/^$/i;var l={"included-cdata":{pattern://i,inside:i}};l["language-"+n]={pattern:/[\s\S]+/,inside:Ze.languages[n]};var r={};r[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:l},Ze.languages.insertBefore("markup","cdata",r)}});Object.defineProperty(Ze.languages.markup.tag,"addAttribute",{value:function(t,e){Ze.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Ze.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});Ze.languages.html=Ze.languages.markup;Ze.languages.mathml=Ze.languages.markup;Ze.languages.svg=Ze.languages.markup;Ze.languages.xml=Ze.languages.extend("markup",{});Ze.languages.ssml=Ze.languages.xml;Ze.languages.atom=Ze.languages.xml;Ze.languages.rss=Ze.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))})(Ze);Ze.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};Ze.languages.javascript=Ze.languages.extend("clike",{"class-name":[Ze.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});Ze.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;Ze.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Ze.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Ze.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Ze.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Ze.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Ze.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});Ze.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Ze.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});Ze.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});Ze.languages.markup&&(Ze.languages.markup.tag.addInlined("script","javascript"),Ze.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));Ze.languages.js=Ze.languages.javascript;(function(){if(typeof Ze>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(b,h){return"\u2716 Error "+b+" while fetching file: "+h},n="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},l="data-src-status",r="loading",a="loaded",u="failed",m="pre[data-src]:not(["+l+'="'+a+'"]):not(['+l+'="'+r+'"])';function f(b,h,v){var w=new XMLHttpRequest;w.open("GET",b,!0),w.onreadystatechange=function(){w.readyState==4&&(w.status<400&&w.responseText?h(w.responseText):w.status>=400?v(e(w.status,w.statusText)):v(n))},w.send(null)}function c(b){var h=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(b||"");if(h){var v=Number(h[1]),w=h[2],k=h[3];return w?k?[v,Number(k)]:[v,void 0]:[v,v]}}Ze.hooks.add("before-highlightall",function(b){b.selector+=", "+m}),Ze.hooks.add("before-sanity-check",function(b){var h=b.element;if(h.matches(m)){b.code="",h.setAttribute(l,r);var v=h.appendChild(document.createElement("CODE"));v.textContent=t;var w=h.getAttribute("data-src"),k=b.language;if(k==="none"){var _=(/\.(\w+)$/.exec(w)||[,"none"])[1];k=i[_]||_}Ze.util.setLanguage(v,k),Ze.util.setLanguage(h,k);var M=Ze.plugins.autoloader;M&&M.loadLanguages(k),f(w,function(O){h.setAttribute(l,a);var D=c(h.getAttribute("data-range"));if(D){var L=O.split(/\r\n?|\n/g),T=D[0],A=D[1]==null?L.length:D[1];T<0&&(T+=L.length),T=Math.max(0,Math.min(T-1,L.length)),A<0&&(A+=L.length),A=Math.max(0,Math.min(A,L.length)),O=L.slice(T,A).join(` -`),h.hasAttribute("data-start")||h.setAttribute("data-start",String(T+1))}v.textContent=O,Ze.highlightElement(v)},function(O){h.setAttribute(l,u),v.textContent=O})}}),Ze.plugins.fileHighlight={highlight:function(h){for(var v=(h||document).querySelectorAll(m),w=0,k;k=v[w++];)Ze.highlightElement(k)}};var g=!1;Ze.fileHighlight=function(){g||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),g=!0),Ze.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var p2=Kt((rz,tu)=>{(function(){if(typeof Prism>"u")return;var t=Object.assign||function(r,a){for(var u in a)a.hasOwnProperty(u)&&(r[u]=a[u]);return r};function e(r){this.defaults=t({},r)}function n(r){return r.replace(/-(\w)/g,function(a,u){return u.toUpperCase()})}function i(r){for(var a=0,u=0;ua&&(f[g]=` -`+f[g],c=b)}u[m]=f.join("")}return u.join(` -`)}},typeof tu<"u"&&tu.exports&&(tu.exports=e),Prism.plugins.NormalizeWhitespace=new e({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",function(r){var a=Prism.plugins.NormalizeWhitespace;if(!(r.settings&&r.settings["whitespace-normalization"]===!1)&&Prism.util.isActive(r.element,"whitespace-normalization",!0)){if((!r.element||!r.element.parentNode)&&r.code){r.code=a.normalize(r.code,r.settings);return}var u=r.element.parentNode;if(!(!r.code||!u||u.nodeName.toLowerCase()!=="pre")){r.settings==null&&(r.settings={});for(var m in l)if(Object.hasOwnProperty.call(l,m)){var f=l[m];if(u.hasAttribute("data-"+m))try{var c=JSON.parse(u.getAttribute("data-"+m)||"true");typeof c===f&&(r.settings[m]=c)}catch{}}for(var g=u.childNodes,b="",h="",v=!1,w=0;wt;function tt(t,e){for(let n in e)t[n]=e[n];return t}function _d(t){return t()}function ma(){return Object.create(null)}function Re(t){t.forEach(_d)}function _t(t){return typeof t=="function"}function me(t,e){return t!=t?e==e:t!==e||t&&typeof t=="object"||typeof t=="function"}var fa;function Sg(t,e){return t===e?!0:(fa||(fa=document.createElement("a")),fa.href=e,t===fa.href)}function Lg(t){return Object.keys(t).length===0}function vd(t,...e){if(t==null){for(let i of e)i(void 0);return Le}let n=t.subscribe(...e);return n.unsubscribe?()=>n.unsubscribe():n}function ho(t){let e;return vd(t,n=>e=n)(),e}function un(t,e,n){t.$$.on_destroy.push(vd(e,n))}function Dt(t,e,n,i){if(t){let l=Dg(t,e,n,i);return t[0](l)}}function Dg(t,e,n,i){return t[1]&&i?tt(n.ctx.slice(),t[1](i(e))):n.ctx}function At(t,e,n,i){if(t[2]&&i){let l=t[2](i(n));if(e.dirty===void 0)return l;if(typeof l=="object"){let r=[],a=Math.max(e.dirty.length,l.length);for(let u=0;u32){let e=[],n=t.ctx.length/32;for(let i=0;iwindow.performance.now():()=>Date.now(),Fo=Og?t=>requestAnimationFrame(t):Le;var bo=new Set;function xg(t){bo.forEach(e=>{e.c(t)||(bo.delete(e),e.f())}),bo.size!==0&&Fo(xg)}function _o(t){let e;return bo.size===0&&Fo(xg),{promise:new Promise(n=>{bo.add(e={c:t,f:n})}),abort(){bo.delete(e)}}}var qo=typeof window<"u"?window:typeof globalThis<"u"?globalThis:global;var ca=class t{_listeners="WeakMap"in qo?new WeakMap:void 0;_observer=void 0;options;constructor(e){this.options=e}observe(e,n){return this._listeners.set(e,n),this._getObserver().observe(e,this.options),()=>{this._listeners.delete(e),this._observer.unobserve(e)}}_getObserver(){return this._observer??(this._observer=new ResizeObserver(e=>{for(let n of e)t.entries.set(n.target,n),this._listeners.get(n.target)?.(n)}))}};ca.entries="WeakMap"in qo?new WeakMap:void 0;var Hg=!1;function Pg(){Hg=!0}function Ng(){Hg=!1}function q(t,e){t.appendChild(e)}function wd(t){if(!t)return document;let e=t.getRootNode?t.getRootNode():t.ownerDocument;return e&&e.host?e:t.ownerDocument}function Fg(t){let e=p("style");return e.textContent="/* empty */",y2(wd(t),e),e.sheet}function y2(t,e){return q(t.head||t,e),e.sheet}function s(t,e,n){t.insertBefore(e,n||null)}function o(t){t.parentNode&&t.parentNode.removeChild(t)}function St(t,e){for(let n=0;nt.removeEventListener(e,n,i)}function Un(t){return function(e){return e.preventDefault(),t.call(this,e)}}function pa(t){return function(e){return e.stopPropagation(),t.call(this,e)}}function x(t,e,n){n==null?t.removeAttribute(e):t.getAttribute(e)!==n&&t.setAttribute(e,n)}var k2=["width","height"];function Ct(t,e){let n=Object.getOwnPropertyDescriptors(t.__proto__);for(let i in e)e[i]==null?t.removeAttribute(i):i==="style"?t.style.cssText=e[i]:i==="__value"?t.value=t[i]=e[i]:n[i]&&n[i].set&&k2.indexOf(i)===-1?t[i]=e[i]:x(t,i,e[i])}function qg(t){return t===""?null:+t}function Bg(t){return Array.from(t.childNodes)}function je(t,e){e=""+e,t.data!==e&&(t.data=e)}function ct(t,e){t.value=e??""}function Pt(t,e,n,i){n==null?t.style.removeProperty(e):t.style.setProperty(e,n,i?"important":"")}function yd(t,e,n){for(let i=0;i{e[n.slot||"default"]=!0}),e}function Di(t,e){return new t(e)}var ha=new Map,ga=0;function T2(t){let e=5381,n=t.length;for(;n--;)e=(e<<5)-e^t.charCodeAt(n);return e>>>0}function M2(t,e){let n={stylesheet:Fg(e),rules:{}};return ha.set(t,n),n}function Wi(t,e,n,i,l,r,a,u=0){let m=16.666/i,f=`{ -`;for(let k=0;k<=1;k+=m){let _=e+(n-e)*r(k);f+=k*100+`%{${a(_,1-_)}} -`}let c=f+`100% {${a(n,1-n)}} -}`,g=`__svelte_${T2(c)}_${u}`,b=wd(t),{stylesheet:h,rules:v}=ha.get(b)||M2(b,t);v[g]||(v[g]=!0,h.insertRule(`@keyframes ${g} ${c}`,h.cssRules.length));let w=t.style.animation||"";return t.style.animation=`${w?`${w}, `:""}${g} ${i}ms linear ${l}ms 1 both`,ga+=1,g}function Vi(t,e){let n=(t.style.animation||"").split(", "),i=n.filter(e?r=>r.indexOf(e)<0:r=>r.indexOf("__svelte")===-1),l=n.length-i.length;l&&(t.style.animation=i.join(", "),ga-=l,ga||E2())}function E2(){Fo(()=>{ga||(ha.forEach(t=>{let{ownerNode:e}=t.stylesheet;e&&o(e)}),ha.clear())})}function ba(t,e,n,i){if(!e)return Le;let l=t.getBoundingClientRect();if(e.left===l.left&&e.right===l.right&&e.top===l.top&&e.bottom===l.bottom)return Le;let{delay:r=0,duration:a=300,easing:u=Si,start:m=go()+r,end:f=m+a,tick:c=Le,css:g}=n(t,{from:e,to:l},i),b=!0,h=!1,v;function w(){g&&(v=Wi(t,0,1,a,r,u,g)),r||(h=!0)}function k(){g&&Vi(t,v),b=!1}return _o(_=>{if(!h&&_>=m&&(h=!0),h&&_>=f&&(c(1,0),k()),!b)return!1;if(h){let M=_-m,O=0+1*u(M/a);c(O,1-O)}return!0}),w(),c(0,1),k}function _a(t){let e=getComputedStyle(t);if(e.position!=="absolute"&&e.position!=="fixed"){let{width:n,height:i}=e,l=t.getBoundingClientRect();t.style.position="absolute",t.style.width=n,t.style.height=i,jo(t,l)}}function jo(t,e){let n=t.getBoundingClientRect();if(e.left!==n.left||e.top!==n.top){let i=getComputedStyle(t),l=i.transform==="none"?"":i.transform;t.style.transform=`${l} translate(${e.left-n.left}px, ${e.top-n.top}px)`}}var Ai;function _i(t){Ai=t}function Ii(){if(!Ai)throw new Error("Function called outside component initialization");return Ai}function kd(t){Ii().$$.before_update.push(t)}function Nt(t){Ii().$$.on_mount.push(t)}function Cn(t){Ii().$$.after_update.push(t)}function on(t){Ii().$$.on_destroy.push(t)}function rt(){let t=Ii();return(e,n,{cancelable:i=!1}={})=>{let l=t.$$.callbacks[e];if(l){let r=Ro(e,n,{cancelable:i});return l.slice().forEach(a=>{a.call(t,r)}),!r.defaultPrevented}return!0}}function Td(t,e){return Ii().$$.context.set(t,e),e}function Md(t){return Ii().$$.context.get(t)}function Qe(t,e){let n=t.$$.callbacks[e.type];n&&n.slice().forEach(i=>i.call(this,e))}var Ui=[];var _e=[],$o=[],Cd=[],C2=Promise.resolve(),Sd=!1;function zg(){Sd||(Sd=!0,C2.then(Mt))}function en(t){$o.push(t)}function Ue(t){Cd.push(t)}var Ed=new Set,vo=0;function Mt(){if(vo!==0)return;let t=Ai;do{try{for(;vot.indexOf(i)===-1?e.push(i):n.push(i)),n.forEach(i=>i()),$o=e}var zo;function Ld(){return zo||(zo=Promise.resolve(),zo.then(()=>{zo=null})),zo}function Yi(t,e,n){t.dispatchEvent(Ro(`${e?"intro":"outro"}${n}`))}var va=new Set,si;function We(){si={r:0,c:[],p:si}}function Ve(){si.r||Re(si.c),si=si.p}function $(t,e){t&&t.i&&(va.delete(t),t.i(e))}function y(t,e,n,i){if(t&&t.o){if(va.has(t))return;va.add(t),si.c.push(()=>{va.delete(t),i&&(n&&t.d(1),i())}),t.o(e)}else i&&i()}var Dd={duration:0};function wo(t,e,n){let i={direction:"in"},l=e(t,n,i),r=!1,a,u,m=0;function f(){a&&Vi(t,a)}function c(){let{delay:b=0,duration:h=300,easing:v=Si,tick:w=Le,css:k}=l||Dd;k&&(a=Wi(t,0,1,h,b,v,k,m++)),w(0,1);let _=go()+b,M=_+h;u&&u.abort(),r=!0,en(()=>Yi(t,!0,"start")),u=_o(O=>{if(r){if(O>=M)return w(1,0),Yi(t,!0,"end"),f(),r=!1;if(O>=_){let D=v((O-_)/h);w(D,1-D)}}return r})}let g=!1;return{start(){g||(g=!0,Vi(t),_t(l)?(l=l(i),Ld().then(c)):c())},invalidate(){g=!1},end(){r&&(f(),r=!1)}}}function yo(t,e,n){let i={direction:"out"},l=e(t,n,i),r=!0,a,u=si;u.r+=1;let m;function f(){let{delay:c=0,duration:g=300,easing:b=Si,tick:h=Le,css:v}=l||Dd;v&&(a=Wi(t,1,0,g,c,b,v));let w=go()+c,k=w+g;en(()=>Yi(t,!1,"start")),"inert"in t&&(m=t.inert,t.inert=!0),_o(_=>{if(r){if(_>=k)return h(0,1),Yi(t,!1,"end"),--u.r||Re(u.c),!1;if(_>=w){let M=b((_-w)/g);h(1-M,M)}}return r})}return _t(l)?Ld().then(()=>{l=l(i),f()}):f(),{end(c){c&&"inert"in t&&(t.inert=m),c&&l.tick&&l.tick(1,0),r&&(a&&Vi(t,a),r=!1)}}}function Ad(t,e,n,i){let r=e(t,n,{direction:"both"}),a=i?0:1,u=null,m=null,f=null,c;function g(){f&&Vi(t,f)}function b(v,w){let k=v.b-a;return w*=Math.abs(k),{a,b:v.b,d:k,duration:w,start:v.start,end:v.start+w,group:v.group}}function h(v){let{delay:w=0,duration:k=300,easing:_=Si,tick:M=Le,css:O}=r||Dd,D={start:go()+w,b:v};v||(D.group=si,si.r+=1),"inert"in t&&(v?c!==void 0&&(t.inert=c):(c=t.inert,t.inert=!0)),u||m?m=D:(O&&(g(),f=Wi(t,a,v,k,w,_,O)),v&&M(0,1),u=b(D,k),en(()=>Yi(t,v,"start")),_o(L=>{if(m&&L>m.start&&(u=b(m,k),m=null,Yi(t,u.b,"start"),O&&(g(),f=Wi(t,a,u.b,u.duration,0,_,r.css))),u){if(L>=u.end)M(a=u.b,1-a),Yi(t,u.b,"end"),m||(u.b?g():--u.group.r||Re(u.group.c)),u=null;else if(L>=u.start){let T=L-u.start;a=u.a+u.d*_(T/u.duration),M(a,1-a)}}return!!(u||m)}))}return{run(v){_t(r)?Ld().then(()=>{r=r({direction:v?"in":"out"}),h(v)}):h(v)},end(){g(),u=m=null}}}function Ye(t){return t?.length!==void 0?t:Array.from(t)}function Vg(t,e){t.d(1),e.delete(t.key)}function Wo(t,e){y(t,1,1,()=>{e.delete(t.key)})}function $a(t,e){t.f(),Wo(t,e)}function li(t,e,n,i,l,r,a,u,m,f,c,g){let b=t.length,h=r.length,v=b,w={};for(;v--;)w[t[v].key]=v;let k=[],_=new Map,M=new Map,O=[];for(v=h;v--;){let A=g(l,r,v),H=n(A),I=a.get(H);I?i&&O.push(()=>I.p(A,e)):(I=f(H,A),I.c()),_.set(H,k[v]=I),H in w&&M.set(H,Math.abs(v-w[H]))}let D=new Set,L=new Set;function T(A){$(A,1),A.m(u,c),a.set(A.key,A),c=A.first,h--}for(;b&&h;){let A=k[h-1],H=t[b-1],I=A.key,P=H.key;A===H?(c=A.first,b--,h--):_.has(P)?!a.has(I)||D.has(I)?T(A):L.has(P)?b--:M.get(I)>M.get(P)?(L.add(I),T(A)):(D.add(P),b--):(m(H,a),b--)}for(;b--;){let A=t[b];_.has(A.key)||m(A,a)}for(;h;)T(k[h-1]);return Re(O),k}function jt(t,e){let n={},i={},l={$$scope:1},r=t.length;for(;r--;){let a=t[r],u=e[r];if(u){for(let m in a)m in u||(i[m]=1);for(let m in u)l[m]||(n[m]=u[m],l[m]=1);t[r]=u}else for(let m in a)l[m]=1}for(let a in i)a in n||(n[a]=void 0);return n}function ko(t){return typeof t=="object"&&t!==null?t:{}}var L2=["allowfullscreen","allowpaymentrequest","async","autofocus","autoplay","checked","controls","default","defer","disabled","formnovalidate","hidden","inert","ismap","loop","multiple","muted","nomodule","novalidate","open","playsinline","readonly","required","reversed","selected"],D2=new Set([...L2]);function Ge(t,e,n){let i=t.$$.props[e];i!==void 0&&(t.$$.bound[i]=n,n(t.$$.ctx[i]))}function S(t){t&&t.c()}function E(t,e,n){let{fragment:i,after_update:l}=t.$$;i&&i.m(e,n),en(()=>{let r=t.$$.on_mount.map(_d).filter(_t);t.$$.on_destroy?t.$$.on_destroy.push(...r):Re(r),t.$$.on_mount=[]}),l.forEach(en)}function C(t,e){let n=t.$$;n.fragment!==null&&(Wg(n.after_update),Re(n.on_destroy),n.fragment&&n.fragment.d(e),n.on_destroy=n.fragment=null,n.ctx=[])}function I2(t,e){t.$$.dirty[0]===-1&&(Ui.push(t),zg(),t.$$.dirty.fill(0)),t.$$.dirty[e/31|0]|=1<{let v=h.length?h[0]:b;return f.ctx&&l(f.ctx[g],f.ctx[g]=v)&&(!f.skip_bound&&f.bound[g]&&f.bound[g](v),c&&I2(t,g)),b}):[],f.update(),c=!0,Re(f.before_update),f.fragment=i?i(f.ctx):!1,e.target){if(e.hydrate){Pg();let g=Bg(e.target);f.fragment&&f.fragment.l(g),g.forEach(o)}else f.fragment&&f.fragment.c();e.intro&&$(t.$$.fragment),E(t,e.target,e.anchor),Ng(),Mt()}_i(m)}var O2;typeof HTMLElement=="function"&&(O2=class extends HTMLElement{$$ctor;$$s;$$c;$$cn=!1;$$d={};$$r=!1;$$p_d={};$$l={};$$l_u=new Map;constructor(t,e,n){super(),this.$$ctor=t,this.$$s=e,n&&this.attachShadow({mode:"open"})}addEventListener(t,e,n){if(this.$$l[t]=this.$$l[t]||[],this.$$l[t].push(e),this.$$c){let i=this.$$c.$on(t,e);this.$$l_u.set(e,i)}super.addEventListener(t,e,n)}removeEventListener(t,e,n){if(super.removeEventListener(t,e,n),this.$$c){let i=this.$$l_u.get(e);i&&(i(),this.$$l_u.delete(e))}}async connectedCallback(){if(this.$$cn=!0,!this.$$c){let t=function(l){return()=>{let r;return{c:function(){r=p("slot"),l!=="default"&&x(r,"name",l)},m:function(m,f){s(m,r,f)},d:function(m){m&&o(r)}}}};if(await Promise.resolve(),!this.$$cn||this.$$c)return;let e={},n=jg(this);for(let l of this.$$s)l in n&&(e[l]=[t(l)]);for(let l of this.attributes){let r=this.$$g_p(l.name);r in this.$$d||(this.$$d[r]=Id(r,l.value,this.$$p_d,"toProp"))}for(let l in this.$$p_d)!(l in this.$$d)&&this[l]!==void 0&&(this.$$d[l]=this[l],delete this[l]);this.$$c=new this.$$ctor({target:this.shadowRoot||this,props:{...this.$$d,$$slots:e,$$scope:{ctx:[]}}});let i=()=>{this.$$r=!0;for(let l in this.$$p_d)if(this.$$d[l]=this.$$c.$$.ctx[this.$$c.$$.props[l]],this.$$p_d[l].reflect){let r=Id(l,this.$$d[l],this.$$p_d,"toAttribute");r==null?this.removeAttribute(this.$$p_d[l].attribute||l):this.setAttribute(this.$$p_d[l].attribute||l,r)}this.$$r=!1};this.$$c.$$.after_update.push(i),i();for(let l in this.$$l)for(let r of this.$$l[l]){let a=this.$$c.$on(l,r);this.$$l_u.set(r,a)}this.$$l={}}}attributeChangedCallback(t,e,n){this.$$r||(t=this.$$g_p(t),this.$$d[t]=Id(t,n,this.$$p_d,"toProp"),this.$$c?.$set({[t]:this.$$d[t]}))}disconnectedCallback(){this.$$cn=!1,Promise.resolve().then(()=>{!this.$$cn&&this.$$c&&(this.$$c.$destroy(),this.$$c=void 0)})}$$g_p(t){return Object.keys(this.$$p_d).find(e=>this.$$p_d[e].attribute===t||!this.$$p_d[e].attribute&&e.toLowerCase()===t)||t}});function Id(t,e,n,i){let l=n[t]?.type;if(e=l==="Boolean"&&typeof e!="boolean"?e!=null:e,!i||!n[t])return e;if(i==="toAttribute")switch(l){case"Object":case"Array":return e==null?null:JSON.stringify(e);case"Boolean":return e?"":null;case"Number":return e??null;default:return e}else switch(l){case"Object":case"Array":return e&&JSON.parse(e);case"Boolean":return e;case"Number":return e!=null?+e:e;default:return e}}var fe=class{$$=void 0;$$set=void 0;$destroy(){C(this,1),this.$destroy=Le}$on(e,n){if(!_t(n))return Le;let i=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return i.push(n),()=>{let l=i.indexOf(n);l!==-1&&i.splice(l,1)}}$set(e){this.$$set&&!Lg(e)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}};var Ug="4";typeof window<"u"&&(window.__svelte||(window.__svelte={v:new Set})).v.add(Ug);function x2(t){let e,n,i,l,r,a=t[4].default,u=Dt(a,t,t[3],null);return{c(){e=p("div"),n=p("div"),i=p("div"),u&&u.c(),x(i,"class","button-group-inner"),x(i,"role","group"),x(n,"class","button-group-scroller"),x(e,"class",l="button-group "+t[1]),ie(e,"round",t[2])},m(m,f){s(m,e,f),q(e,n),q(n,i),u&&u.m(i,null),t[5](e),r=!0},p(m,[f]){u&&u.p&&(!r||f&8)&&It(u,a,m,m[3],r?At(a,m[3],f,null):Ot(m[3]),null),(!r||f&2&&l!==(l="button-group "+m[1]))&&x(e,"class",l),(!r||f&6)&&ie(e,"round",m[2])},i(m){r||($(u,m),r=!0)},o(m){y(u,m),r=!1},d(m){m&&o(e),u&&u.d(m),t[5](null)}}}function H2(t,e,n){let{$$slots:i={},$$scope:l}=e,{class:r=""}=e,{round:a=void 0}=e,{element:u=void 0}=e;function m(f){_e[f?"unshift":"push"](()=>{u=f,n(0,u)})}return t.$$set=f=>{"class"in f&&n(1,r=f.class),"round"in f&&n(2,a=f.round),"element"in f&&n(0,u=f.element),"$$scope"in f&&n(3,l=f.$$scope)},[u,r,a,l,i,m]}var Od=class extends fe{constructor(e){super(),de(this,e,H2,x2,me,{class:1,round:2,element:0})}},jn=Od;var P2='",Vo={adjustments:'adjustments-horizontal">`}function Gg(t,e){Gi[t]||(Gi[t]=e)}function F2(t){let e,n;return{c(){e=new Li(!1),n=Tt(),e.a=n},m(i,l){e.m(t[0],i,l),s(i,n,l)},p(i,[l]){l&1&&e.p(i[0])},i:Le,o:Le,d(i){i&&(o(n),e.d())}}}function q2(t,e,n){let i,{name:l=""}=e;return t.$$set=r=>{"name"in r&&n(1,l=r.name)},t.$$.update=()=>{t.$$.dirty&2&&n(0,i=Ki(l))},[i,l]}var xd=class extends fe{constructor(e){super(),de(this,e,q2,F2,me,{name:1})}},zt=xd;function Kg(t){let e,n;return e=new zt({props:{name:t[10]}}),{c(){S(e.$$.fragment)},m(i,l){E(e,i,l),n=!0},p(i,l){let r={};l&1024&&(r.name=i[10]),e.$set(r)},i(i){n||($(e.$$.fragment,i),n=!0)},o(i){y(e.$$.fragment,i),n=!1},d(i){C(e,i)}}}function B2(t){let e,n,i,l,r,a,u,m=t[10]&&Kg(t),f=t[17].default,c=Dt(f,t,t[16],null),g=[{type:i=t[6]?"submit":"button"},{class:l="button "+t[12]},t[15]],b={};for(let h=0;h{m=null}),Ve()),c&&c.p&&(!r||v&65536)&&It(c,f,h,h[16],r?At(f,h[16],v,null):Ot(h[16]),null),Ct(e,b=jt(g,[(!r||v&64&&i!==(i=h[6]?"submit":"button"))&&{type:i},(!r||v&4096&&l!==(l="button "+h[12]))&&{class:l},v&32768&&h[15]])),ie(e,"button-normal",!h[8]&&!h[9]&&!h[7]),ie(e,"button-outline",h[7]),ie(e,"button-link",h[8]),ie(e,"button-text",h[9]),ie(e,"button-has-text",h[14].default),ie(e,"round",h[11]),ie(e,"info",h[1]),ie(e,"success",h[2]),ie(e,"warning",h[3]),ie(e,"danger",h[4]),ie(e,"error",h[5]),ie(e,"touching",h[13])},i(h){r||($(m),$(c,h),r=!0)},o(h){y(m),y(c,h),r=!1},d(h){h&&o(e),m&&m.d(),c&&c.d(h),t[26](null),a=!1,Re(u)}}}function R2(t,e,n){let i=["element","info","success","warning","danger","error","submit","outline","link","text","icon","round","class"],l=kt(e,i),{$$slots:r={},$$scope:a}=e,u=da(r),{element:m=void 0}=e,{info:f=!1}=e,{success:c=!1}=e,{warning:g=!1}=e,{danger:b=!1}=e,{error:h=!1}=e,{submit:v=!1}=e,{outline:w=!1}=e,{link:k=!1}=e,{text:_=!1}=e,{icon:M=void 0}=e,{round:O=void 0}=e,{class:D=""}=e,L=!1;function T(z){Qe.call(this,t,z)}function A(z){Qe.call(this,t,z)}function H(z){Qe.call(this,t,z)}function I(z){Qe.call(this,t,z)}function P(z){Qe.call(this,t,z)}function N(z){Qe.call(this,t,z)}function j(z){Qe.call(this,t,z)}function K(z){Qe.call(this,t,z)}function U(z){_e[z?"unshift":"push"](()=>{m=z,n(0,m)})}let G=()=>n(13,L=!0),F=()=>n(13,L=!1);return t.$$set=z=>{e=tt(tt({},e),Zt(z)),n(15,l=kt(e,i)),"element"in z&&n(0,m=z.element),"info"in z&&n(1,f=z.info),"success"in z&&n(2,c=z.success),"warning"in z&&n(3,g=z.warning),"danger"in z&&n(4,b=z.danger),"error"in z&&n(5,h=z.error),"submit"in z&&n(6,v=z.submit),"outline"in z&&n(7,w=z.outline),"link"in z&&n(8,k=z.link),"text"in z&&n(9,_=z.text),"icon"in z&&n(10,M=z.icon),"round"in z&&n(11,O=z.round),"class"in z&&n(12,D=z.class),"$$scope"in z&&n(16,a=z.$$scope)},[m,f,c,g,b,h,v,w,k,_,M,O,D,L,u,l,a,r,T,A,H,I,P,N,j,K,U,G,F]}var Hd=class extends fe{constructor(e){super(),de(this,e,R2,B2,me,{element:0,info:1,success:2,warning:3,danger:4,error:5,submit:6,outline:7,link:8,text:9,icon:10,round:11,class:12})}},De=Hd;var To=[];function Yn(t,e=Le){let n,i=new Set;function l(u){if(me(t,u)&&(t=u,n)){let m=!To.length;for(let f of i)f[1](),To.push(f,t);if(m){for(let f=0;f{i.delete(f),i.size===0&&n&&(n(),n=null)}}return{set:l,update:r,subscribe:a}}var Xi=["a[href]:not([disabled])","button:not([disabled])","iframe:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","[contentEditable]","[tabindex]:not(.focus-trap)"].join(","),sn=Yn(300),Pd=Yn(!1),Xg=t=>sn.set(!t||t.matches?0:200),Zg=t=>Pd.set(t&&t.matches);if(window.matchMedia){let t=window.matchMedia("(prefers-reduced-motion: reduce)");Xg(t),t.addEventListener("change",Xg);let e=window.matchMedia("(prefers-color-scheme: dark)");Zg(e),e.addEventListener("change",Zg)}function wa(t,e,n,i={}){let l={duration:ho(sn),easing:"ease-out",fill:"forwards"},r=Object.assign({},l,i);return new Promise(a=>{requestAnimationFrame(()=>{let u=t.animate([e,n],r);u.oncancel=a,u.onfinish=a})})}function Qg(t,e=160){return wa(t,{opacity:1},{opacity:.5},{duration:e/2,fill:"backwards"})}function Uo(t){return structuredClone(t)}function Mo(t,e=300){let n;return(...i)=>{n&&clearTimeout(n),n=setTimeout(()=>t.apply(this,i),e)}}function ya(t,e=300){let n=0;return(...i)=>{let l=new Date().getTime();if(!(l-nt.length)return!1;if(e===t)return!0;t=t.toLowerCase(),e=e.toLowerCase();let n=-1;for(let i of e)if(!~(n=t.indexOf(i,n+1)))return!1;return!0}function Xe(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,t=>{let e=Math.random()*16|0;return(t==="x"?e:e&3|8).toString(16)})}function Oi(t){return t.type.includes("touch")?t.changedTouches[0].clientX:t.clientX}function Yo(t){return t.type.includes("touch")?t.changedTouches[0].clientY:t.clientY}function Gn(){let t=navigator.userAgent,e=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i;return!!(e.test(t)||(e=/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i,e.test(t.slice(0,4))))}function j2(t,e){if(e in t)return t[e]}function z2(t,e){let n={};return e.forEach(i=>{i in t&&(n[i]=t[i])}),n}function t1(t,e){return t?Array.isArray(e)?z2(t,e):j2(t,e):{}}function n1(t,e=2){let n=Math.pow(10,e);return Math.round(t*n)/n}function W2(t){let e=t.getFullYear(),n=("0"+(t.getMonth()+1)).slice(-2),i=("0"+t.getDate()).slice(-2),l=("0"+t.getHours()).slice(-2),r=("0"+t.getMinutes()).slice(-2);return`${e}-${n}-${i} ${l}:${r}`}function Nd(t,e){if(!t)return"";e=e||new Date().getTime();let n=(e-+t)/1e3,i=[{label:"year",seconds:31536e3},{label:"month",seconds:2592e3},{label:"day",seconds:86400},{label:"hour",seconds:3600},{label:"minute",seconds:60}],l=[];for(;n>60;){let r=i.find(u=>u.secondsw.height||vc.top?"bottom":"top"}function V2(t,e){let n=e.getBoundingClientRect(),i=t.left+t.width/2,l=n.left+n.width/2,r=n.width?n.width/100:1,a=50+(i-l)/r,u=Math.max(8,Math.min(93,a));return`${Math.round(u*r-1)}px`}function Jg(t){let e=getComputedStyle(t,null),n=e.overflowX||e.overflow;return/(auto|scroll)/.test(n)?t.scrollWidth>t.clientWidth:!1}function i1(t){if(t instanceof HTMLElement||t instanceof SVGElement){if(Jg(t))return!0;for(;t=t.parentElement;)if(Jg(t))return!0;return!1}}function Go(t){if(t=t[0]==="#"?t.slice(1):t,t.length===3&&(t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]),t.length!==6)return!1;let e=parseInt(t.substring(0,2),16),n=parseInt(t.substring(2,4),16),i=parseInt(t.substring(4,6),16);if(isNaN(e)||isNaN(n)||isNaN(i))return!1;let l=(e*299+n*587+i*114)/1e3;return isNaN(l)?!1:l<140}var U2=t=>({}),o1=t=>({});function Y2(t){let e,n,i,l,r,a,u,m,f,c,g,b,h,v,w,k,_=t[16].default,M=Dt(_,t,t[15],null),O=t[16].footer,D=Dt(O,t,t[15],o1);return{c(){e=p("div"),n=p("div"),i=p("div"),l=d(),r=p("h1"),a=ne(t[3]),u=d(),m=p("div"),M&&M.c(),f=d(),c=p("div"),D&&D.c(),g=d(),b=p("div"),x(i,"tabindex","0"),x(i,"class","focus-trap focus-trap-top"),x(r,"class","dialog-header"),x(m,"class","dialog-content"),x(c,"class","dialog-footer"),x(b,"tabindex","0"),x(b,"class","focus-trap focus-trap-bottom"),x(n,"class","dialog"),ie(n,"no-title",!t[3]),x(e,"role","dialog"),x(e,"aria-modal","true"),x(e,"aria-label",t[3]),x(e,"class",h="dialog-backdrop "+t[2]),ie(e,"opened",t[0])},m(L,T){s(L,e,T),q(e,n),q(n,i),q(n,l),q(n,r),q(r,a),q(n,u),q(n,m),M&&M.m(m,null),t[17](m),q(n,f),q(n,c),D&&D.m(c,null),t[18](c),q(n,g),q(n,b),t[19](n),t[20](e),v=!0,w||(k=[ye(i,"focus",t[8]),ye(b,"focus",t[7]),ye(e,"mousedown",t[9]),ye(e,"click",t[10])],w=!0)},p(L,[T]){(!v||T&8)&&je(a,L[3]),M&&M.p&&(!v||T&32768)&&It(M,_,L,L[15],v?At(_,L[15],T,null):Ot(L[15]),null),D&&D.p&&(!v||T&32768)&&It(D,O,L,L[15],v?At(O,L[15],T,U2):Ot(L[15]),o1),(!v||T&8)&&ie(n,"no-title",!L[3]),(!v||T&8)&&x(e,"aria-label",L[3]),(!v||T&4&&h!==(h="dialog-backdrop "+L[2]))&&x(e,"class",h),(!v||T&5)&&ie(e,"opened",L[0])},i(L){v||($(M,L),$(D,L),v=!0)},o(L){y(M,L),y(D,L),v=!1},d(L){L&&o(e),M&&M.d(L),t[17](null),D&&D.d(L),t[18](null),t[19](null),t[20](null),w=!1,Re(k)}}}function G2(t,e){let i={ArrowLeft:"nextElementSibling",ArrowRight:"previousElementSibling"}[e],l=t[i];for(;l&&l.tagName!=="BUTTON";)l=l[i];l&&l.focus()}function K2(t,e,n){let i;un(t,sn,z=>n(25,i=z));let{$$slots:l={},$$scope:r}=e,{class:a=""}=e,{title:u=""}=e,{opened:m=!1}=e,{skipFirstFocus:f=!1}=e,{modal:c=!1}=e,{element:g}=e,b=rt(),h,v,w,k,_,M,O;Nt(()=>{document.body.appendChild(g)});function D(){let z=T().shift(),V=T().pop();!z&&!V&&(v.setAttribute("tabindex",0),z=v),V&&V.scrollIntoView({block:"end"}),z&&z.focus()}function L(){let z=T().shift(),V=T().pop();!z&&!V&&(v.setAttribute("tabindex",0),V=v),z&&z.scrollIntoView({block:"end"}),V&&V.focus()}function T(){let z=Array.from(v.querySelectorAll(Xi)),V=Array.from(w.querySelectorAll(Xi));return[...z,...V]}function A(z){c&&(z.stopPropagation(),z.preventDefault())}function H(z){!h.contains(z.target)&&!c&&(z.stopPropagation(),j())}function I(z){if(!m)return;let V=g.contains(document.activeElement);if(z.key==="Tab"&&!V)return D();if(z.key==="Escape"&&!c)return z.stopPropagation(),j();let Q=z.target?.closest("button");Q&&(z.key==="ArrowLeft"||z.key==="ArrowRight")&&G2(Q,z.key)}function P(z){z?(O=window.scrollY,document.body.classList.add("has-dialog"),document.body.style.top=`-${O}px`):(document.body.classList.remove("has-dialog"),document.scrollingElement.scrollTop=O,document.body.style.top="")}function N(z){m||(z instanceof Event&&(z=z.target),k=z||document.activeElement,k&&k!==document.body&&(k.setAttribute("aria-haspopup","true"),k.setAttribute("aria-expanded","true")),n(1,g.style.display="flex",g),_&&clearTimeout(_),_=setTimeout(()=>{n(0,m=!0),n(1,g.style.display="flex",g),f!==!0&&f!=="true"&&D(),document.addEventListener("keydown",I),P(!0),b("open")},100))}function j(){m&&(n(0,m=!1),k&&k.focus&&k.focus(),M&&clearTimeout(M),M=setTimeout(()=>{n(0,m=!1),n(1,g.style.display="none",g),document.removeEventListener("keydown",I),k&&k!==document.body&&k.removeAttribute("aria-expanded"),P(!1),b("close")},i))}function K(z){_e[z?"unshift":"push"](()=>{v=z,n(5,v)})}function U(z){_e[z?"unshift":"push"](()=>{w=z,n(6,w)})}function G(z){_e[z?"unshift":"push"](()=>{h=z,n(4,h)})}function F(z){_e[z?"unshift":"push"](()=>{g=z,n(1,g)})}return t.$$set=z=>{"class"in z&&n(2,a=z.class),"title"in z&&n(3,u=z.title),"opened"in z&&n(0,m=z.opened),"skipFirstFocus"in z&&n(11,f=z.skipFirstFocus),"modal"in z&&n(12,c=z.modal),"element"in z&&n(1,g=z.element),"$$scope"in z&&n(15,r=z.$$scope)},[m,g,a,u,h,v,w,D,L,A,H,f,c,N,j,r,l,K,U,G,F]}var Fd=class extends fe{constructor(e){super(),de(this,e,K2,Y2,me,{class:2,title:3,opened:0,skipFirstFocus:11,modal:12,element:1,open:13,close:14})}get class(){return this.$$.ctx[2]}set class(e){this.$$set({class:e}),Mt()}get title(){return this.$$.ctx[3]}set title(e){this.$$set({title:e}),Mt()}get opened(){return this.$$.ctx[0]}set opened(e){this.$$set({opened:e}),Mt()}get skipFirstFocus(){return this.$$.ctx[11]}set skipFirstFocus(e){this.$$set({skipFirstFocus:e}),Mt()}get modal(){return this.$$.ctx[12]}set modal(e){this.$$set({modal:e}),Mt()}get element(){return this.$$.ctx[1]}set element(e){this.$$set({element:e}),Mt()}get open(){return this.$$.ctx[13]}get close(){return this.$$.ctx[14]}},vi=Fd;function Ko(t){let e=t-1;return e*e*e+1}function Zi(t,{delay:e=0,duration:n=400,easing:i=Ko,x:l=0,y:r=0,opacity:a=0}={}){let u=getComputedStyle(t),m=+u.opacity,f=u.transform==="none"?"":u.transform,c=m*(1-a),[g,b]=$d(l),[h,v]=$d(r);return{delay:e,duration:n,easing:i,css:(w,k)=>` - transform: ${f} translate(${(1-w)*g}${b}, ${(1-w)*h}${v}); - opacity: ${m-c*k}`}}function s1({fallback:t,...e}){let n=new Map,i=new Map;function l(a,u,m){let{delay:f=0,duration:c=T=>Math.sqrt(T)*30,easing:g=Ko}=tt(tt({},e),m),b=a.getBoundingClientRect(),h=u.getBoundingClientRect(),v=b.left-h.left,w=b.top-h.top,k=b.width/h.width,_=b.height/h.height,M=Math.sqrt(v*v+w*w),O=getComputedStyle(u),D=O.transform==="none"?"":O.transform,L=+O.opacity;return{delay:f,duration:_t(c)?c(M):c,easing:g,css:(T,A)=>` - opacity: ${T*L}; +var __create = Object.create; +var __defProp = Object.defineProperty; +var __getOwnPropDesc = Object.getOwnPropertyDescriptor; +var __getOwnPropNames = Object.getOwnPropertyNames; +var __getProtoOf = Object.getPrototypeOf; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __commonJS = (cb, mod) => function __require() { + return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; +}; +var __export = (target, all) => { + for (var name2 in all) + __defProp(target, name2, { get: all[name2], enumerable: true }); +}; +var __copyProps = (to, from, except, desc) => { + if (from && typeof from === "object" || typeof from === "function") { + for (let key of __getOwnPropNames(from)) + if (!__hasOwnProp.call(to, key) && key !== except) + __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); + } + return to; +}; +var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( + // If the importer is in node compatibility mode or this is not an ESM + // file that has been converted to a CommonJS file using a Babel- + // compatible transform (i.e. "__esModule" has not been set), then set + // "default" to the CommonJS "module.exports" for node compatibility. + isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, + mod +)); + +// node_modules/vanilla-swipe/lib/types/index.js +var require_types = __commonJS({ + "node_modules/vanilla-swipe/lib/types/index.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.TraceDirectionKey = exports.Direction = exports.Axis = void 0; + var TraceDirectionKey; + exports.TraceDirectionKey = TraceDirectionKey; + (function(TraceDirectionKey2) { + TraceDirectionKey2["NEGATIVE"] = "NEGATIVE"; + TraceDirectionKey2["POSITIVE"] = "POSITIVE"; + TraceDirectionKey2["NONE"] = "NONE"; + })(TraceDirectionKey || (exports.TraceDirectionKey = TraceDirectionKey = {})); + var Direction; + exports.Direction = Direction; + (function(Direction2) { + Direction2["TOP"] = "TOP"; + Direction2["LEFT"] = "LEFT"; + Direction2["RIGHT"] = "RIGHT"; + Direction2["BOTTOM"] = "BOTTOM"; + Direction2["NONE"] = "NONE"; + })(Direction || (exports.Direction = Direction = {})); + var Axis; + exports.Axis = Axis; + (function(Axis2) { + Axis2["X"] = "x"; + Axis2["Y"] = "y"; + })(Axis || (exports.Axis = Axis = {})); + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDirection.js +var require_calculateDirection = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDirection.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDirection = calculateDirection; + var _types = require_types(); + function calculateDirection(trace) { + var direction; + var negative = _types.TraceDirectionKey.NEGATIVE; + var positive = _types.TraceDirectionKey.POSITIVE; + var current = trace[trace.length - 1]; + var previous = trace[trace.length - 2] || 0; + if (trace.every(function(i) { + return i === 0; + })) { + return _types.TraceDirectionKey.NONE; + } + direction = current > previous ? positive : negative; + if (current === 0) { + direction = previous < 0 ? positive : negative; + } + return direction; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/common.js +var require_common = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/common.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.resolveAxisDirection = exports.getDirectionValue = exports.getDirectionKey = exports.getDifference = void 0; + var _types = require_types(); + var getDirectionKey = function getDirectionKey2() { + var object = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + var key = Object.keys(object).toString(); + switch (key) { + case _types.TraceDirectionKey.POSITIVE: + return _types.TraceDirectionKey.POSITIVE; + case _types.TraceDirectionKey.NEGATIVE: + return _types.TraceDirectionKey.NEGATIVE; + default: + return _types.TraceDirectionKey.NONE; + } + }; + exports.getDirectionKey = getDirectionKey; + var getDirectionValue = function getDirectionValue2() { + var values = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; + return values[values.length - 1] || 0; + }; + exports.getDirectionValue = getDirectionValue; + var getDifference = function getDifference2() { + var x = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; + var y = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + return Math.abs(x - y); + }; + exports.getDifference = getDifference; + var resolveAxisDirection = function resolveAxisDirection2(axis, key) { + var negative = _types.Direction.LEFT; + var positive = _types.Direction.RIGHT; + var direction = _types.Direction.NONE; + if (axis === _types.Axis.Y) { + negative = _types.Direction.BOTTOM; + positive = _types.Direction.TOP; + } + if (key === _types.TraceDirectionKey.NEGATIVE) { + direction = negative; + } + if (key === _types.TraceDirectionKey.POSITIVE) { + direction = positive; + } + return direction; + }; + exports.resolveAxisDirection = resolveAxisDirection; + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js +var require_calculateDirectionDelta = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDirectionDelta = calculateDirectionDelta; + var _types = require_types(); + var _common = require_common(); + function calculateDirectionDelta(traceDirections) { + var delta = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + var length = traceDirections.length; + var i = length - 1; + var direction = _types.TraceDirectionKey.NONE; + for (; i >= 0; i--) { + var current = traceDirections[i]; + var currentKey = (0, _common.getDirectionKey)(current); + var currentValue = (0, _common.getDirectionValue)(current[currentKey]); + var prev = traceDirections[i - 1] || {}; + var prevKey = (0, _common.getDirectionKey)(prev); + var prevValue = (0, _common.getDirectionValue)(prev[prevKey]); + var difference = (0, _common.getDifference)(currentValue, prevValue); + if (difference >= delta) { + direction = currentKey; + break; + } else { + direction = prevKey; + } + } + return direction; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDuration.js +var require_calculateDuration = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDuration.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDuration = calculateDuration; + function calculateDuration() { + var prevTime = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; + var nextTime = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + return prevTime ? nextTime - prevTime : 0; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js +var require_calculateMovingPosition = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateMovingPosition = calculateMovingPosition; + function calculateMovingPosition(e) { + if ("changedTouches" in e) { + var touches = e.changedTouches && e.changedTouches[0]; + return { + x: touches && touches.clientX, + y: touches && touches.clientY + }; + } + return { + x: e.clientX, + y: e.clientY + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/updateTrace.js +var require_updateTrace = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/updateTrace.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.updateTrace = updateTrace; + function updateTrace(trace, value2) { + var last = trace[trace.length - 1]; + if (last !== value2) { + trace.push(value2); + } + return trace; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js +var require_calculateTraceDirections = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateTraceDirections = calculateTraceDirections; + var _types = require_types(); + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + function calculateTraceDirections() { + var trace = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; + var ticks = []; + var positive = _types.TraceDirectionKey.POSITIVE; + var negative = _types.TraceDirectionKey.NEGATIVE; + var i = 0; + var tick2 = []; + var direction = _types.TraceDirectionKey.NONE; + for (; i < trace.length; i++) { + var current = trace[i]; + var prev = trace[i - 1]; + if (tick2.length) { + var currentDirection = current > prev ? positive : negative; + if (direction === _types.TraceDirectionKey.NONE) { + direction = currentDirection; + } + if (currentDirection === direction) { + tick2.push(current); + } else { + ticks.push(_defineProperty({}, direction, tick2.slice())); + tick2 = []; + tick2.push(current); + direction = currentDirection; + } + } else { + if (current !== 0) { + direction = current > 0 ? positive : negative; + } + tick2.push(current); + } + } + if (tick2.length) { + ticks.push(_defineProperty({}, direction, tick2)); + } + return ticks; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/resolveDirection.js +var require_resolveDirection = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/resolveDirection.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.resolveDirection = resolveDirection; + var _calculateDirection = require_calculateDirection(); + var _calculateTraceDirections = require_calculateTraceDirections(); + var _calculateDirectionDelta = require_calculateDirectionDelta(); + var _common = require_common(); + var _types = require_types(); + function resolveDirection(trace) { + var axis = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : _types.Axis.X; + var directionDelta = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 0; + if (directionDelta) { + var directions = (0, _calculateTraceDirections.calculateTraceDirections)(trace); + var _direction = (0, _calculateDirectionDelta.calculateDirectionDelta)(directions, directionDelta); + return (0, _common.resolveAxisDirection)(axis, _direction); + } + var direction = (0, _calculateDirection.calculateDirection)(trace); + return (0, _common.resolveAxisDirection)(axis, direction); + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateVelocity.js +var require_calculateVelocity = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateVelocity.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateVelocity = calculateVelocity; + function calculateVelocity(x, y, time) { + var magnitude = Math.sqrt(x * x + y * y); + return magnitude / (time || 1); + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculatePosition.js +var require_calculatePosition = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculatePosition.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculatePosition = calculatePosition; + var _updateTrace = require_updateTrace(); + var _resolveDirection = require_resolveDirection(); + var _calculateDuration = require_calculateDuration(); + var _calculateVelocity = require_calculateVelocity(); + var _types = require_types(); + function calculatePosition(state, options) { + var start = state.start, x = state.x, y = state.y, traceX = state.traceX, traceY = state.traceY; + var rotatePosition = options.rotatePosition, directionDelta = options.directionDelta; + var deltaX = rotatePosition.x - x; + var deltaY = y - rotatePosition.y; + var absX = Math.abs(deltaX); + var absY = Math.abs(deltaY); + (0, _updateTrace.updateTrace)(traceX, deltaX); + (0, _updateTrace.updateTrace)(traceY, deltaY); + var directionX = (0, _resolveDirection.resolveDirection)(traceX, _types.Axis.X, directionDelta); + var directionY = (0, _resolveDirection.resolveDirection)(traceY, _types.Axis.Y, directionDelta); + var duration2 = (0, _calculateDuration.calculateDuration)(start, Date.now()); + var velocity = (0, _calculateVelocity.calculateVelocity)(absX, absY, duration2); + return { + absX, + absY, + deltaX, + deltaY, + directionX, + directionY, + duration: duration2, + positionX: rotatePosition.x, + positionY: rotatePosition.y, + velocity + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js +var require_checkIsMoreThanSingleTouches = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsMoreThanSingleTouches = void 0; + var checkIsMoreThanSingleTouches = function checkIsMoreThanSingleTouches2(e) { + return Boolean(e.touches && e.touches.length > 1); + }; + exports.checkIsMoreThanSingleTouches = checkIsMoreThanSingleTouches; + } +}); + +// node_modules/vanilla-swipe/lib/utils/createOptions.js +var require_createOptions = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/createOptions.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.createOptions = createOptions; + function createOptions() { + var proxy = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + Object.defineProperty(proxy, "passive", { + get: function get() { + this.isPassiveSupported = true; + return true; + }, + enumerable: true + }); + return proxy; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js +var require_checkIsPassiveSupported = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsPassiveSupported = checkIsPassiveSupported; + exports.noop = void 0; + var _createOptions = require_createOptions(); + function checkIsPassiveSupported(isPassiveSupported) { + if (typeof isPassiveSupported === "boolean") { + return isPassiveSupported; + } + var proxy = { + isPassiveSupported + }; + try { + var options = (0, _createOptions.createOptions)(proxy); + window.addEventListener("checkIsPassiveSupported", noop2, options); + window.removeEventListener("checkIsPassiveSupported", noop2, options); + } catch (err) { + } + return proxy.isPassiveSupported; + } + var noop2 = function noop3() { + }; + exports.noop = noop2; + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js +var require_checkIsTouchEventsSupported = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsTouchEventsSupported = void 0; + function _typeof(obj) { + "@babel/helpers - typeof"; + return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { + return typeof obj2; + } : function(obj2) { + return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; + }, _typeof(obj); + } + var checkIsTouchEventsSupported = function checkIsTouchEventsSupported2() { + return (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object" && ("ontouchstart" in window || Boolean(window.navigator.maxTouchPoints)); + }; + exports.checkIsTouchEventsSupported = checkIsTouchEventsSupported; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getInitialState.js +var require_getInitialState = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getInitialState.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getInitialState = void 0; + function ownKeys(object, enumerableOnly) { + var keys = Object.keys(object); + if (Object.getOwnPropertySymbols) { + var symbols = Object.getOwnPropertySymbols(object); + enumerableOnly && (symbols = symbols.filter(function(sym) { + return Object.getOwnPropertyDescriptor(object, sym).enumerable; + })), keys.push.apply(keys, symbols); + } + return keys; + } + function _objectSpread(target) { + for (var i = 1; i < arguments.length; i++) { + var source = null != arguments[i] ? arguments[i] : {}; + i % 2 ? ownKeys(Object(source), true).forEach(function(key) { + _defineProperty(target, key, source[key]); + }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { + Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); + }); + } + return target; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var getInitialState = function getInitialState2() { + var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + return _objectSpread({ + x: 0, + y: 0, + start: 0, + isSwiping: false, + traceX: [], + traceY: [] + }, options); + }; + exports.getInitialState = getInitialState; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getInitialProps.js +var require_getInitialProps = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getInitialProps.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getInitialProps = void 0; + function ownKeys(object, enumerableOnly) { + var keys = Object.keys(object); + if (Object.getOwnPropertySymbols) { + var symbols = Object.getOwnPropertySymbols(object); + enumerableOnly && (symbols = symbols.filter(function(sym) { + return Object.getOwnPropertyDescriptor(object, sym).enumerable; + })), keys.push.apply(keys, symbols); + } + return keys; + } + function _objectSpread(target) { + for (var i = 1; i < arguments.length; i++) { + var source = null != arguments[i] ? arguments[i] : {}; + i % 2 ? ownKeys(Object(source), true).forEach(function(key) { + _defineProperty(target, key, source[key]); + }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { + Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); + }); + } + return target; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var getInitialProps = function getInitialProps2() { + var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + return _objectSpread({ + element: null, + target: null, + delta: 10, + directionDelta: 0, + rotationAngle: 0, + mouseTrackingEnabled: false, + touchTrackingEnabled: true, + preventDefaultTouchmoveEvent: false, + preventTrackingOnMouseleave: false + }, props); + }; + exports.getInitialProps = getInitialProps; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getOptions.js +var require_getOptions = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getOptions.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getOptions = getOptions; + function getOptions() { + var isPassiveSupported = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false; + if (isPassiveSupported) { + return { + passive: false + }; + } + return {}; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/rotateByAngle.js +var require_rotateByAngle = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/rotateByAngle.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.rotateByAngle = rotateByAngle; + function rotateByAngle(position) { + var angle = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + if (angle === 0) { + return position; + } + var x = position.x, y = position.y; + var angleInRadians = Math.PI / 180 * angle; + var rotatedX = x * Math.cos(angleInRadians) + y * Math.sin(angleInRadians); + var rotatedY = y * Math.cos(angleInRadians) - x * Math.sin(angleInRadians); + return { + x: rotatedX, + y: rotatedY + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/index.js +var require_utils = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/index.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + var _calculateDirection = require_calculateDirection(); + Object.keys(_calculateDirection).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDirection[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDirection[key]; + } + }); + }); + var _calculateDirectionDelta = require_calculateDirectionDelta(); + Object.keys(_calculateDirectionDelta).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDirectionDelta[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDirectionDelta[key]; + } + }); + }); + var _calculateDuration = require_calculateDuration(); + Object.keys(_calculateDuration).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDuration[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDuration[key]; + } + }); + }); + var _calculateMovingPosition = require_calculateMovingPosition(); + Object.keys(_calculateMovingPosition).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateMovingPosition[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateMovingPosition[key]; + } + }); + }); + var _calculatePosition = require_calculatePosition(); + Object.keys(_calculatePosition).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculatePosition[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculatePosition[key]; + } + }); + }); + var _calculateTraceDirections = require_calculateTraceDirections(); + Object.keys(_calculateTraceDirections).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateTraceDirections[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateTraceDirections[key]; + } + }); + }); + var _calculateVelocity = require_calculateVelocity(); + Object.keys(_calculateVelocity).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateVelocity[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateVelocity[key]; + } + }); + }); + var _checkIsMoreThanSingleTouches = require_checkIsMoreThanSingleTouches(); + Object.keys(_checkIsMoreThanSingleTouches).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsMoreThanSingleTouches[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsMoreThanSingleTouches[key]; + } + }); + }); + var _checkIsPassiveSupported = require_checkIsPassiveSupported(); + Object.keys(_checkIsPassiveSupported).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsPassiveSupported[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsPassiveSupported[key]; + } + }); + }); + var _checkIsTouchEventsSupported = require_checkIsTouchEventsSupported(); + Object.keys(_checkIsTouchEventsSupported).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsTouchEventsSupported[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsTouchEventsSupported[key]; + } + }); + }); + var _common = require_common(); + Object.keys(_common).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _common[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _common[key]; + } + }); + }); + var _createOptions = require_createOptions(); + Object.keys(_createOptions).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _createOptions[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _createOptions[key]; + } + }); + }); + var _getInitialState = require_getInitialState(); + Object.keys(_getInitialState).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getInitialState[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getInitialState[key]; + } + }); + }); + var _getInitialProps = require_getInitialProps(); + Object.keys(_getInitialProps).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getInitialProps[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getInitialProps[key]; + } + }); + }); + var _getOptions = require_getOptions(); + Object.keys(_getOptions).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getOptions[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getOptions[key]; + } + }); + }); + var _resolveDirection = require_resolveDirection(); + Object.keys(_resolveDirection).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _resolveDirection[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _resolveDirection[key]; + } + }); + }); + var _rotateByAngle = require_rotateByAngle(); + Object.keys(_rotateByAngle).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _rotateByAngle[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _rotateByAngle[key]; + } + }); + }); + var _updateTrace = require_updateTrace(); + Object.keys(_updateTrace).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _updateTrace[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _updateTrace[key]; + } + }); + }); + } +}); + +// node_modules/vanilla-swipe/lib/index.js +var require_lib = __commonJS({ + "node_modules/vanilla-swipe/lib/index.js"(exports) { + "use strict"; + function _typeof(obj) { + "@babel/helpers - typeof"; + return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { + return typeof obj2; + } : function(obj2) { + return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; + }, _typeof(obj); + } + Object.defineProperty(exports, "__esModule", { + value: true + }); + var _exportNames = {}; + exports["default"] = void 0; + var Utils2 = _interopRequireWildcard(require_utils()); + var _types = require_types(); + Object.keys(_types).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (Object.prototype.hasOwnProperty.call(_exportNames, key)) + return; + if (key in exports && exports[key] === _types[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _types[key]; + } + }); + }); + function _getRequireWildcardCache(nodeInterop) { + if (typeof WeakMap !== "function") + return null; + var cacheBabelInterop = /* @__PURE__ */ new WeakMap(); + var cacheNodeInterop = /* @__PURE__ */ new WeakMap(); + return (_getRequireWildcardCache = function _getRequireWildcardCache2(nodeInterop2) { + return nodeInterop2 ? cacheNodeInterop : cacheBabelInterop; + })(nodeInterop); + } + function _interopRequireWildcard(obj, nodeInterop) { + if (!nodeInterop && obj && obj.__esModule) { + return obj; + } + if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { + return { "default": obj }; + } + var cache = _getRequireWildcardCache(nodeInterop); + if (cache && cache.has(obj)) { + return cache.get(obj); + } + var newObj = {}; + var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; + for (var key in obj) { + if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { + var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; + if (desc && (desc.get || desc.set)) { + Object.defineProperty(newObj, key, desc); + } else { + newObj[key] = obj[key]; + } + } + } + newObj["default"] = obj; + if (cache) { + cache.set(obj, newObj); + } + return newObj; + } + function _classCallCheck(instance122, Constructor) { + if (!(instance122 instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + function _defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ("value" in descriptor) + descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } + } + function _createClass(Constructor, protoProps, staticProps) { + if (protoProps) + _defineProperties(Constructor.prototype, protoProps); + if (staticProps) + _defineProperties(Constructor, staticProps); + Object.defineProperty(Constructor, "prototype", { writable: false }); + return Constructor; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var VanillaSwipe2 = /* @__PURE__ */ function() { + function VanillaSwipe3(props) { + _classCallCheck(this, VanillaSwipe3); + _defineProperty(this, "state", void 0); + _defineProperty(this, "props", void 0); + this.state = Utils2.getInitialState(); + this.props = Utils2.getInitialProps(props); + this.handleSwipeStart = this.handleSwipeStart.bind(this); + this.handleSwipeMove = this.handleSwipeMove.bind(this); + this.handleSwipeEnd = this.handleSwipeEnd.bind(this); + this.handleMouseDown = this.handleMouseDown.bind(this); + this.handleMouseMove = this.handleMouseMove.bind(this); + this.handleMouseUp = this.handleMouseUp.bind(this); + this.handleMouseLeave = this.handleMouseLeave.bind(this); + } + _createClass(VanillaSwipe3, [{ + key: "init", + value: function init3() { + this.setupTouchListeners(); + this.setupMouseListeners(); + } + }, { + key: "update", + value: function update2(props) { + var prevProps = this.props; + var nextProps = Object.assign({}, prevProps, props); + if (prevProps.element !== nextProps.element || prevProps.target !== nextProps.target) { + this.destroy(); + this.props = nextProps; + this.init(); + return; + } + this.props = nextProps; + if (prevProps.mouseTrackingEnabled !== nextProps.mouseTrackingEnabled || prevProps.preventTrackingOnMouseleave !== nextProps.preventTrackingOnMouseleave) { + this.cleanupMouseListeners(); + nextProps.mouseTrackingEnabled ? this.setupMouseListeners() : this.cleanupMouseListeners(); + } + if (prevProps.touchTrackingEnabled !== nextProps.touchTrackingEnabled) { + this.cleanupTouchListeners(); + nextProps.touchTrackingEnabled ? this.setupTouchListeners() : this.cleanupTouchListeners(); + } + } + }, { + key: "destroy", + value: function destroy() { + this.cleanupMouseListeners(); + this.cleanupTouchListeners(); + this.state = Utils2.getInitialState(); + this.props = Utils2.getInitialProps(); + } + }, { + key: "setupTouchListeners", + value: function setupTouchListeners() { + var _this$props = this.props, element3 = _this$props.element, target = _this$props.target, touchTrackingEnabled = _this$props.touchTrackingEnabled; + if (element3 && touchTrackingEnabled) { + var listener = target || element3; + var isPassiveSupported = Utils2.checkIsPassiveSupported(); + var options = Utils2.getOptions(isPassiveSupported); + listener.addEventListener("touchstart", this.handleSwipeStart, options); + listener.addEventListener("touchmove", this.handleSwipeMove, options); + listener.addEventListener("touchend", this.handleSwipeEnd, options); + } + } + }, { + key: "cleanupTouchListeners", + value: function cleanupTouchListeners() { + var _this$props2 = this.props, element3 = _this$props2.element, target = _this$props2.target; + var listener = target || element3; + if (listener) { + listener.removeEventListener("touchstart", this.handleSwipeStart); + listener.removeEventListener("touchmove", this.handleSwipeMove); + listener.removeEventListener("touchend", this.handleSwipeEnd); + } + } + }, { + key: "setupMouseListeners", + value: function setupMouseListeners() { + var _this$props3 = this.props, element3 = _this$props3.element, mouseTrackingEnabled = _this$props3.mouseTrackingEnabled, preventTrackingOnMouseleave = _this$props3.preventTrackingOnMouseleave; + if (mouseTrackingEnabled && element3) { + element3.addEventListener("mousedown", this.handleMouseDown); + element3.addEventListener("mousemove", this.handleMouseMove); + element3.addEventListener("mouseup", this.handleMouseUp); + if (preventTrackingOnMouseleave) { + element3.addEventListener("mouseleave", this.handleMouseLeave); + } + } + } + }, { + key: "cleanupMouseListeners", + value: function cleanupMouseListeners() { + var element3 = this.props.element; + if (element3) { + element3.removeEventListener("mousedown", this.handleMouseDown); + element3.removeEventListener("mousemove", this.handleMouseMove); + element3.removeEventListener("mouseup", this.handleMouseUp); + element3.removeEventListener("mouseleave", this.handleMouseLeave); + } + } + }, { + key: "getEventData", + value: function getEventData(e) { + var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : { + directionDelta: 0 + }; + var rotationAngle = this.props.rotationAngle; + var directionDelta = options.directionDelta; + var movingPosition = Utils2.calculateMovingPosition(e); + var rotatePosition = Utils2.rotateByAngle(movingPosition, rotationAngle); + return Utils2.calculatePosition(this.state, { + rotatePosition, + directionDelta + }); + } + }, { + key: "handleSwipeStart", + value: function handleSwipeStart(e) { + if (Utils2.checkIsMoreThanSingleTouches(e)) + return; + var rotationAngle = this.props.rotationAngle; + var movingPosition = Utils2.calculateMovingPosition(e); + var _Utils$rotateByAngle = Utils2.rotateByAngle(movingPosition, rotationAngle), x = _Utils$rotateByAngle.x, y = _Utils$rotateByAngle.y; + this.state = Utils2.getInitialState({ + isSwiping: false, + start: Date.now(), + x, + y + }); + } + }, { + key: "handleSwipeMove", + value: function handleSwipeMove(e) { + var _this$state = this.state, x = _this$state.x, y = _this$state.y, isSwiping = _this$state.isSwiping; + if (!x || !y || Utils2.checkIsMoreThanSingleTouches(e)) + return; + var directionDelta = this.props.directionDelta || 0; + var _this$getEventData = this.getEventData(e, { + directionDelta + }), absX = _this$getEventData.absX, absY = _this$getEventData.absY, deltaX = _this$getEventData.deltaX, deltaY = _this$getEventData.deltaY, directionX = _this$getEventData.directionX, directionY = _this$getEventData.directionY, duration2 = _this$getEventData.duration, velocity = _this$getEventData.velocity; + var _this$props4 = this.props, delta = _this$props4.delta, preventDefaultTouchmoveEvent = _this$props4.preventDefaultTouchmoveEvent, onSwipeStart = _this$props4.onSwipeStart, onSwiping = _this$props4.onSwiping; + if (e.cancelable && preventDefaultTouchmoveEvent) + e.preventDefault(); + if (absX < Number(delta) && absY < Number(delta) && !isSwiping) + return; + if (onSwipeStart && !isSwiping) { + onSwipeStart(e, { + deltaX, + deltaY, + absX, + absY, + directionX, + directionY, + duration: duration2, + velocity + }); + } + this.state.isSwiping = true; + if (onSwiping) { + onSwiping(e, { + deltaX, + deltaY, + absX, + absY, + directionX, + directionY, + duration: duration2, + velocity + }); + } + } + }, { + key: "handleSwipeEnd", + value: function handleSwipeEnd(e) { + var _this$props5 = this.props, onSwiped = _this$props5.onSwiped, onTap = _this$props5.onTap; + if (this.state.isSwiping) { + var directionDelta = this.props.directionDelta || 0; + var position = this.getEventData(e, { + directionDelta + }); + onSwiped && onSwiped(e, position); + } else { + var _position = this.getEventData(e); + onTap && onTap(e, _position); + } + this.state = Utils2.getInitialState(); + } + }, { + key: "handleMouseDown", + value: function handleMouseDown(e) { + var target = this.props.target; + if (target) { + if (target === e.target) { + this.handleSwipeStart(e); + } + } else { + this.handleSwipeStart(e); + } + } + }, { + key: "handleMouseMove", + value: function handleMouseMove(e) { + this.handleSwipeMove(e); + } + }, { + key: "handleMouseUp", + value: function handleMouseUp(e) { + var isSwiping = this.state.isSwiping; + var target = this.props.target; + if (target) { + if (target === e.target || isSwiping) { + this.handleSwipeEnd(e); + } + } else { + this.handleSwipeEnd(e); + } + } + }, { + key: "handleMouseLeave", + value: function handleMouseLeave(e) { + var isSwiping = this.state.isSwiping; + if (isSwiping) { + this.handleSwipeEnd(e); + } + } + }], [{ + key: "isTouchEventsSupported", + value: function isTouchEventsSupported() { + return Utils2.checkIsTouchEventsSupported(); + } + }]); + return VanillaSwipe3; + }(); + exports["default"] = VanillaSwipe2; + } +}); + +// node_modules/prismjs/prism.js +var require_prism = __commonJS({ + "node_modules/prismjs/prism.js"(exports, module) { + var _self = typeof window !== "undefined" ? window : typeof WorkerGlobalScope !== "undefined" && self instanceof WorkerGlobalScope ? self : {}; + var Prism2 = function(_self2) { + var lang = /(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i; + var uniqueId = 0; + var plainTextGrammar = {}; + var _ = { + /** + * By default, Prism will attempt to highlight all code elements (by calling {@link Prism.highlightAll}) on the + * current page after the page finished loading. This might be a problem if e.g. you wanted to asynchronously load + * additional languages or plugins yourself. + * + * By setting this value to `true`, Prism will not automatically highlight all code elements on the page. + * + * You obviously have to change this value before the automatic highlighting started. To do this, you can add an + * empty Prism object into the global scope before loading the Prism script like this: + * + * ```js + * window.Prism = window.Prism || {}; + * Prism.manual = true; + * // add a new - + diff --git a/docs/ui.css b/docs/ui.css index 5b5bd692..70e689e6 100644 --- a/docs/ui.css +++ b/docs/ui.css @@ -1 +1,2730 @@ -:root{--ui-border-radius:0.375rem;--ui-border-radius-m:0.6877rem;--ui-border-radius-l:1rem;--ui-border-radius-xl:5rem;--ui-margin:0.375rem;--ui-margin-xs:0.125rem;--ui-margin-s:0.25rem;--ui-margin-m:0.5rem;--ui-margin-l:1rem;--ui-animation-speed:.25s;--ui-button-height:2.25rem;--ui-font-system:system-ui,'Segoe UI','Roboto','Helvetica','Arial','sans-serif','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--ui-font-xs:0.875rem;--ui-font-s:0.9375rem;--ui-font-m:1rem;--ui-font-l:1.0625rem;--ui-font-xl:1.375rem;--ui-shadow-focus:0 0 2px 1px var(--ui-color-accent);--ui-shadow-danger:0 0 2px 1px var(--ui-color-danger);--ui-shadow-small:0 0 0 0.5px #fff4,0 3px 10px #0006;--ui-shadow-large:0 0 0 1px #0003,0 5px 20px #000a;--ui-shadow-fancy:0 0 0 0.5px #111,0 1px 5px rgb(0 0 0 / 30%),0 4px 10px rgb(0 0 0 / 10%),0 10px 25px rgb(0 0 0 / 8%);--ui-z-index-elevated:9;--ui-z-index-popup:999}body{font-weight:300;font-size:100%;font-family:var(--ui-font-system),sans-serif;box-sizing:border-box}body *{box-sizing:inherit}.icon-tabler{width:1.5rem;height:1.5rem}.icon-tabler-dots-vertical{margin-left:-1px}.flex-spacer{flex:1}.icon-tabler-alert-triangle{transform:translateY(1px)}.icon-tabler-logout{transform:translateX(3px)}.mobile .prevent-scrolling-on-focus:focus{animation:prevent-scrolling-on-focus 10ms}@keyframes prevent-scrolling-on-focus{0%{opacity:0}100%{opacity:1}}.theme-dark,:root{color-scheme:dark;--ui-color-accent:#bb7a00;--ui-color-accent-semi:#bb7a0066;--ui-color-highlight:#1859a3;--ui-color-highlight-semi:#1859a366;--ui-color-highlight-1:#1e4572;--ui-color-secondary:#5a5956;--ui-color-secondary-semi:#5a595666;--ui-color-info:#30506a;--ui-color-info-semi:#30506a99;--ui-color-success:#33624d;--ui-color-success-semi:#33624d99;--ui-color-warning:#795001;--ui-color-warning-semi:#79500199;--ui-color-danger:#943737;--ui-color-danger-semi:#94373799;--ui-color-border:#1b1b1b;--ui-color-border-1:#131313;--ui-color-border-2:#0c0c0c;--ui-color-background:#2f2f2f;--ui-color-background-semi:#2f2f2f66;--ui-color-background-input:#222;--ui-color-background-1:#535353;--ui-color-background-2:#1a1a1a;--ui-color-text:#fff;--ui-color-text-semi:#fff6;--ui-color-text-1:#bbb;--ui-color-text-2:#888;--ui-popup-border:1px solid #fff3;--ui-popup-background:var(--ui-color-background);--ui-shadow-button:0 1px 0 #000c;--ui-shadow-tooltip:0 0 0 1px #000,0 0 5px #0006}.theme-light{color-scheme:light;--ui-color-accent:#b37400;--ui-color-accent-semi:#b3740066;--ui-color-highlight:#8ec6ff;--ui-color-highlight-semi:#8ec6ff66;--ui-color-highlight-1:#6ba0de;--ui-color-secondary:#c0beb4;--ui-color-secondary-semi:#c0beb466;--ui-color-info:#bbd3f0;--ui-color-info-semi:#bbd3f099;--ui-color-success:#7bd7ae;--ui-color-success-semi:#7bd7ae99;--ui-color-warning:#eec64e;--ui-color-warning-semi:#eec64e99;--ui-color-danger:#eb6e6f;--ui-color-danger-semi:#eb6e6f99;--ui-color-border:#bbb;--ui-color-border-1:#aaa;--ui-color-border-2:#999;--ui-color-background:#eee;--ui-color-background-semi:#eee6;--ui-color-background-input:#c2c2c2;--ui-color-background-1:#f0f0f0;--ui-color-background-2:#ccc;--ui-color-text:#000;--ui-color-text-semi:#0006;--ui-color-text-1:#222;--ui-color-text-2:#666;--ui-popup-border:1px solid #ccc;--ui-popup-background:var(--ui-color-background);--ui-shadow-button:0 1px 0 #000c;--ui-shadow-tooltip:0 0 1px #0002,0 0 5px #0006}.button-link{background:0 0;border:none;cursor:pointer;min-width:0}.button.button-link{margin:calc(var(--ui-margin) * -1);padding:var(--ui-margin);vertical-align:baseline;text-decoration:underline}.button.button-link:focus-visible,.button.button-link:hover{text-decoration:underline;text-underline-offset:0.2rem}.button-link.info:focus-visible,.button-link.info:hover{text-decoration-color:var(--ui-color-info)}.button-link.success:focus-visible,.button-link.success:hover{text-decoration-color:var(--ui-color-success)}.button-link.warning:focus-visible,.button-link.warning:hover{text-decoration-color:var(--ui-color-warning)}.button-link.danger:focus-visible,.button-link.danger:hover,.button-link.error:focus-visible,.button-link.error:hover{text-decoration-color:var(--ui-color-danger)}.button-normal{background:var(--ui-color-secondary);border:.5px solid #0006;border-bottom-color:#000c;box-shadow:var(--ui-shadow-button);min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2)}.button-normal.info{background:var(--ui-color-info)}.button-normal.success{background:var(--ui-color-success)}.button-normal.warning{background:var(--ui-color-warning)}.button-normal.danger,.button-normal.error{background:var(--ui-color-danger)}.button-outline{background:0 0;border:2px solid var(--ui-color-secondary);min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2)}.button-outline:focus-visible,.button-outline:hover{background-color:var(--ui-color-secondary-semi)}.button-outline.info{border-color:var(--ui-color-info)}.button-outline.info:focus-visible,.button-outline.info:hover{background-color:var(--ui-color-info-semi)}.button-outline.success{border-color:var(--ui-color-success)}.button-outline.success:focus-visible,.button-outline.success:hover{background-color:var(--ui-color-success-semi)}.button-outline.warning{border-color:var(--ui-color-warning)}.button-outline.warning:focus-visible,.button-outline.warning:hover{background-color:var(--ui-color-warning-semi)}.button-outline.danger,.button-outline.error{border-color:var(--ui-color-danger)}.button-outline.danger:focus-visible,.button-outline.danger:hover,.button-outline.error:focus-visible,.button-outline.error:hover{background-color:var(--ui-color-danger-semi)}.button-text{background:0 0;border:none;min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2);box-shadow:none}.button-text:focus-visible,.button-text:hover{background-color:var(--ui-color-secondary)}.button-text.info:focus-visible,.button-text.info:hover{background-color:var(--ui-color-info)}.button-text.success:focus-visible,.button-text.success:hover{background-color:var(--ui-color-success)}.button-text.warning:focus-visible,.button-text.warning:hover{background-color:var(--ui-color-warning)}.button-text.danger:focus-visible,.button-text.danger:hover,.button-text.error:focus-visible,.button-text.error:hover{background-color:var(--ui-color-danger)}button{-ms-touch-action:manipulation;touch-action:manipulation}.button{--ui-button-size:1rem;font:inherit;line-height:1.4;font-weight:400;font-size:var(--ui-button-size);display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-margin-m);min-width:var(--ui-button-height);min-height:var(--ui-button-height);height:auto;margin:0;padding:0 var(--ui-margin-l);color:var(--ui-color-text);-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;border-radius:var(--ui-border-radius);text-decoration:none}.button:hover{text-decoration:none}.button:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:1px solid transparent}.button[disabled]{pointer-events:none;opacity:.6;box-shadow:none}.button svg{min-height:calc(var(--ui-button-size) * 1.25);max-height:calc(var(--ui-button-size) * 1.25);height:calc(var(--ui-button-size) * 1.25);min-width:var(--ui-button-size);width:auto;pointer-events:none}.button:not(.button-has-text){padding:0 var(--ui-margin-m)}.button:not(.button-has-text) svg{min-height:calc(var(--ui-button-size) * 1.4)}.button.round{padding:var(--ui-margin);border-radius:var(--ui-border-radius-xl)}.button.round:not(.button-has-text){aspect-ratio:1/1}.button-has-text.round{padding-inline:var(--ui-margin-l)}.button.touching,.button:active{outline:1px solid transparent;transform:translateY(1px);filter:brightness(.85)}.button:not(.push-button).touching,.button:not(.push-button):active{box-shadow:none}.button-group{border-radius:var(--ui-border-radius);max-width:100%;overflow:hidden}.button-group-scroller{width:100%;overflow:auto hidden;overscroll-behavior-x:contain;scrollbar-width:none;scrollbar-gutter:none;z-index:0;border-radius:var(--ui-border-radius)}.button-group-scroller::-webkit-scrollbar{width:0;height:0}.button-group-inner{padding:0 0 2px;display:inline-flex;flex-flow:row;align-items:center;justify-content:stretch;position:relative;z-index:1;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background)}.button-group-inner .button{flex-shrink:0;flex-grow:10;border-radius:0;position:relative;overflow:hidden}.button-group-inner .button:focus{z-index:2}.button-group .button-normal[disabled]{box-shadow:var(--ui-shadow-button)}.button-group .button:first-of-type{border-top-left-radius:var(--ui-border-radius);border-bottom-left-radius:var(--ui-border-radius)}.button-group .button:last-of-type{border-top-right-radius:var(--ui-border-radius);border-bottom-right-radius:var(--ui-border-radius)}.button-group .button-outline:not(:first-of-type){margin-left:-2px}.button-group.round{border-radius:var(--ui-border-radius-xl)}.button-group.round .button:first-of-type{border-top-left-radius:var(--ui-border-radius-xl);border-bottom-left-radius:var(--ui-border-radius-xl)}.button-group.round .button:last-of-type{border-top-right-radius:var(--ui-border-radius-xl);border-bottom-right-radius:var(--ui-border-radius-xl)}.button-group .button:not(.button-has-text):first-of-type{padding-left:9px}.button-group .button:not(.button-has-text):last-of-type{padding-right:9px}.button-group.round .button:not(.button-has-text):first-of-type{padding-right:6px;padding-left:11px}.button-group.round .button:not(.button-has-text):last-of-type{padding-left:6px;padding-right:11px}.has-dialog{position:fixed;width:100%;inset:0;overflow:hidden}.dialog-backdrop{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:calc(var(--ui-z-index-popup) - 1);background-color:rgba(0 0 0 / 0);transition:all var(--ui-animation-speed) ease-out;transform:translateZ(1px)}.dialog-backdrop.opened{background-color:rgba(0 0 0 / .6)}.dialog{--ui-dialog-border-radius:var(--ui-border-radius-m);--ui-dialog-inner-border-radius:calc(var(--ui-dialog-border-radius) - 1px);opacity:0;transform:scale(.8);transition:opacity var(--ui-animation-speed) ease-out,transform var(--ui-animation-speed) ease-out;max-height:90vh;min-width:15rem;max-width:95vw;color:var(--ui-color-text);border-radius:var(--ui-dialog-border-radius);background:var(--ui-popup-background);border:var(--ui-popup-border);box-shadow:var(--ui-shadow-large);display:flex;flex-flow:column;align-items:stretch;justify-content:stretch}.opened .dialog{opacity:1;transform:scale(1)}.dialog-footer,.dialog-header{background:var(--ui-color-background-input);padding:.7rem 1rem}.dialog-header{text-align:center;font-size:var(--ui-font-xl);font-weight:300;margin:0;border-bottom:.5px solid var(--ui-color-border)}.dialog-content{margin:0;padding:1rem;min-width:200px;flex:1;overflow-y:auto;overscroll-behavior-y:contain;outline:1px solid transparent;min-height:3rem}.dialog-content:focus{outline:0}.dialog-content:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus) inset}.dialog-footer{border-top:.5px solid var(--ui-color-border);border-bottom-left-radius:var(--ui-dialog-inner-border-radius);border-bottom-right-radius:var(--ui-dialog-inner-border-radius)}.dialog-footer [slot=footer]{width:100%;display:flex;align-items:center;justify-content:center;flex-flow:row-reverse;gap:.5rem}.dialog-footer .button-has-text{min-width:9ch}.dialog-header,.dialog.no-title .dialog-content{border-top-left-radius:var(--ui-dialog-inner-border-radius);border-top-right-radius:var(--ui-dialog-inner-border-radius)}.dialog-header:empty{display:none}.mobile .dialog-backdrop .dialog{min-height:0;min-width:0;max-height:100%;max-width:100%;box-shadow:none}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.dialog-backdrop.opened{-webkit-backdrop-filter:contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px);backdrop-filter:contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px)}}.drawer{position:fixed;background-color:var(--ui-popup-background);border-left:var(--ui-popup-border);top:0;right:0;bottom:0;width:24rem;min-height:20rem;box-shadow:var(--ui-shadow-large);z-index:calc(var(--ui-z-index-popup) - 2);color:var(--ui-color-text);padding:0;overflow-y:auto;overscroll-behavior-y:contain;transform:translateZ(1px)}.drawer:focus{outline:0}.drawer-header{position:sticky;position:-webkit-sticky;background-color:inherit;top:0;width:100%;margin:0 0 1rem;padding:0 1rem 0 1.4rem;display:flex;align-items:center;justify-content:space-between}.drawer-header h2{margin:0;padding:.5rem 0}.drawer-content{padding:0 1.4rem}.info-bar{width:100%;display:flex;align-items:flex-start;justify-content:flex-start;gap:.5rem;padding:.4rem .6rem .4rem .3rem;margin:0 0 .75rem;border-radius:var(--ui-border-radius);border-width:1px;border-style:solid}.info-bar p{margin:0;font-size:var(--ui-font-s);line-height:1.5rem}.info-bar .icon{flex-shrink:0}.info-bar-error{background-color:var(--ui-color-danger-semi);border-color:var(--ui-color-danger)}.info-bar-info{background-color:var(--ui-color-info-semi);border-color:var(--ui-color-info)}.info-bar-success{background-color:var(--ui-color-success-semi);border-color:var(--ui-color-success)}.info-bar-warning{background-color:var(--ui-color-warning-semi);border-color:var(--ui-color-warning)}input,label,select,textarea{-ms-touch-action:manipulation;touch-action:manipulation}.theme-dark input{color-scheme:dark}.theme-light input{color-scheme:light}input::placeholder,textarea::placeholder{color:var(--ui-color-text-1);font-style:italic}:where(input:not([type=radio],[type=checkbox])){font:inherit;height:calc(var(--ui-button-height) - 2px);border:1px solid transparent;line-height:1;color:var(--ui-color-text);background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius);padding:0 var(--ui-margin-m);width:25ch}:where(input:focus){outline:0;border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}:where(input:invalid){border-color:var(--ui-color-danger);box-shadow:var(--ui-shadow-danger)}input[type=color]{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;border:none;padding:0;cursor:pointer}:where(input:disabled){opacity:.75;cursor:default}.check-and-radio input{appearance:none;width:1.4rem;height:1.4rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.3em;background:var(--ui-color-background-input);border:1px solid var(--ui-color-text-2);color:var(--ui-color-text-1);font:inherit;flex-shrink:0;-ms-touch-action:manipulation;touch-action:manipulation}.check-and-radio input::after{content:" ";display:block;opacity:0;font-size:var(--ui-font-m);line-height:1;align-self:center;color:inherit;margin:0;transition:opacity calc(var(--ui-animation-speed) / 2) ease-out}.check-and-radio input:checked::after{opacity:1}.input{width:25ch;vertical-align:middle}.input .input-inner{display:flex;flex-flow:column;align-items:stretch;justify-content:stretch;border-radius:var(--ui-border-radius);background:var(--ui-color-background-input);border:1px solid var(--ui-color-border)}.button-toggle.input.label-on-the-left,.input.label-on-the-left,.radio.label-on-the-left,.range.label-on-the-left,.textarea.label-on-the-left,.toggle.label-on-the-left{display:inline-flex;flex-flow:row;align-items:center;width:100%;gap:1rem}.label-on-the-left .input-inner,.label-on-the-left .range-inner{flex:1}.input-inner:focus-within,.input-inner:has(:active):not(.disabled){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.input,.input input:disabled,.input select:disabled,.range input:disabled,.textarea textarea:disabled{opacity:1;color:var(--ui-color-text)}.input .input-inner:has(:disabled),.range .range-inner:has(:disabled),.textarea .textarea-inner:has(:disabled){opacity:.7}.input input:not([type=radio]){width:100%;border:none}.input input:not([type=radio]):focus,.input input:not([type=radio]):invalid{box-shadow:none;border:none}.input-row{width:100%;display:flex;flex-flow:row;align-items:center;justify-content:space-between;position:relative;border-radius:inherit}.input-row>.button,.input-row>.icon{position:absolute;height:100%;z-index:1}.input-row>.button{color:var(--ui-color-text-1);right:2px}.input-row>.icon{color:var(--ui-color-text-2);left:.3rem;width:1.5rem;pointer-events:none}.menu{position:absolute;padding:.25rem;margin:0;display:flex;width:auto;flex-flow:column;align-items:stretch;list-style:none;overflow:hidden auto;cursor:default;z-index:var(--ui-z-index-popup);max-height:calc(100vh - 4px);-webkit-user-select:none;user-select:none;overscroll-behavior-y:contain;color:var(--ui-color-text);border:var(--ui-popup-border);border-radius:calc(var(--ui-border-radius) + 2px);background:var(--ui-popup-background);box-shadow:var(--ui-shadow-fancy);transform:translateZ(1px)}.menu:focus{outline:0}.menu-item{font:inherit;font-size:var(--ui-font-s);align-items:center;border-radius:var(--ui-border-radius);color:inherit;background:0 0;border:none;display:flex;flex-shrink:0;letter-spacing:.1px;justify-content:space-between;margin:0;overflow:hidden;padding:.5rem .9rem;position:relative;text-align:left;white-space:nowrap;width:100%}.menu-item-shortcut{margin:-.1rem 0 -.1rem auto;letter-spacing:.1rem;line-height:1.35;opacity:.5}.menu-item-shortcut:empty{visibility:hidden}.menu-item.disabled{pointer-events:none;opacity:.6}.menu-item:focus{background-color:var(--ui-color-highlight);outline:1px solid transparent}.menu-item:focus.success{background-color:var(--ui-color-success)}.menu-item:focus.warning{background-color:var(--ui-color-warning)}.menu-item:focus.danger{background-color:var(--ui-color-danger)}.menu-item:focus .menu-item-shortcut{opacity:1}.menu-item svg{width:1.1rem;height:1.1rem;margin:0 .5rem 0 0}.menu-item-content{display:flex;min-width:0;align-items:center;justify-content:space-between;margin-right:1rem}.menu-item-text{overflow:hidden;text-overflow:ellipsis;line-height:1.35}.menu-separator{height:0;width:auto;padding:0;margin:var(--ui-margin) .8rem;border-bottom:var(--ui-popup-border)}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.menu{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.message-box .dialog-content{display:flex;flex-flow:row;gap:1rem;font-size:var(--ui-font-l);padding:1rem}.message-box .dialog-content .message{display:flex;align-items:center;min-height:fit-content}.message-box .dialog-content .message-content{margin:0;line-height:1.5}.message-box .dialog-content .icon,.message-box .dialog-content svg{height:3rem}.message-box .dialog-content svg:empty{width:0}.message-box .dialog-content:has(svg:empty){gap:0}.message-box .dialog-content:has(svg:empty) .message{flex:1;justify-content:center}.message-box .dialog-content .icon{width:3rem;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;position:sticky;top:0}.message-info .dialog-content{background-color:var(--ui-color-info-semi)}.message-warning .dialog-content{background-color:var(--ui-color-warning-semi)}.message-error .dialog-content{background-color:var(--ui-color-danger-semi)}.message-success .dialog-content{background-color:var(--ui-color-success-semi)}.panel{overflow:hidden;will-change:height;position:relative;border:2px solid var(--ui-color-border);background:var(--ui-color-background-2);margin-bottom:1rem}.panel details{margin:1px}.panel-header{color:var(--ui-color-text);text-align:left;border:none;display:flex;align-items:center;justify-content:space-between;font-weight:300;font-size:var(--ui-font-m);padding:0 .6rem 0 1rem;height:2.5rem;line-height:1;-webkit-user-select:none;user-select:none}.collapsible .panel-header{cursor:pointer}.panel-header::-webkit-details-marker{display:none}.panel-content{background:var(--ui-color-background);padding:1rem}.panel-content>*{opacity:0;transition:opacity var(--ui-animation-speed) ease-out}.panel.expanded .panel-content>*{opacity:1}.panel .chevron{height:1.2rem;transform:rotate(0);transition:transform var(--ui-animation-speed) ease-out}.panel .chevron svg{width:1.2rem;height:1.2rem}.panel.expanded .chevron{transform:rotate(90deg)}.panel.round{border-radius:var(--ui-border-radius)}.panel.round .panel-content{border-radius:calc(var(--ui-border-radius) - 2px)}.panel.disabled{opacity:.5}.panel-header:focus{outline:0}.panel:has(.panel-header:focus-visible){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);z-index:2}.panel.info{border-color:var(--ui-color-info);background:var(--ui-color-info-semi)}.panel.success{border-color:var(--ui-color-success);background:var(--ui-color-success-semi)}.panel.warning{border-color:var(--ui-color-warning);background:var(--ui-color-warning-semi)}.panel.danger{border-color:var(--ui-color-danger);background:var(--ui-color-danger-semi)}.popover-plate{--popover-tip-size:14px;--popover-color:var(--ui-popup-background);--popover-border:var(--ui-popup-border);--tip-offset:50%;position:absolute;transform:translateZ(1px);z-index:var(--ui-z-index-popup)}.popover-plate.opening{opacity:0}.popover{position:relative;border-radius:var(--ui-border-radius-m);box-shadow:var(--ui-shadow-tooltip)}.popover-plate.hide-tip .popover{box-shadow:var(--ui-shadow-fancy)}.popover-plate:not(.hide-tip) .popover-content::before,.popover-plate:not(.hide-tip) .popover::before{content:'';position:absolute;display:block;width:var(--popover-tip-size);height:var(--popover-tip-size);transform:rotate(45deg) skew(8deg,8deg);left:var(--tip-offset);margin-left:calc(var(--popover-tip-size)/ -2)}.popover-plate:not(.hide-tip) .popover::before{box-shadow:var(--ui-shadow-tooltip);background-color:var(--popover-color);border:var(--popover-border);border-width:1.5px;margin-left:calc(var(--popover-tip-size)/ -2 - .5px)}.popover-content{padding:1rem;text-align:center;position:relative;border-radius:inherit;z-index:1;background-color:var(--popover-color);border:var(--popover-border)}.popover-content>*{position:relative}.popover-plate:not(.hide-tip) .popover-content::before{background-color:inherit;z-index:-1}.popover-content:focus,.popover-plate .popover:focus,.popover-plate:focus{outline:0}.popover-top:not(.hide-tip){padding-bottom:var(--popover-tip-size)}.popover-top:not(.hide-tip) .popover::before{border-radius:0 0 3px;bottom:calc(var(--popover-tip-size)/ -2)}.popover-top:not(.hide-tip) .popover-content::before{border-radius:0 0 2px;bottom:calc(var(--popover-tip-size)/ -2)}.popover-bottom:not(.hide-tip){padding-top:var(--popover-tip-size)}.popover-bottom:not(.hide-tip) .popover::before{border-radius:3px 0 0;top:calc(var(--popover-tip-size)/ -2)}.popover-bottom:not(.hide-tip) .popover-content::before{border-radius:2px 0 0;top:calc(var(--popover-tip-size)/ -2)}.theme-light .popover-plate{--popover-color:#fff}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.popover-plate.hide-tip .popover-content{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.push-button.touching,.push-button:active,.push-button[aria-pressed=true]{filter:brightness(.85) contrast(1.1);transform:translateY(1px);box-shadow:0 1px 0 rgb(0 0 0/.8) inset}.push-button[aria-pressed=true]:focus-visible{box-shadow:0 1px 0 rgb(0 0 0/.8) inset,var(--ui-shadow-focus)}.push-button[aria-pressed=true].button-outline{background-color:var(--ui-color-secondary-semi)}.push-button[aria-pressed=true].button-outline.info{background-color:var(--ui-color-info-semi)}.push-button[aria-pressed=true].button-outline.success{background-color:var(--ui-color-success-semi)}.push-button[aria-pressed=true].button-outline.warning{background-color:var(--ui-color-warning-semi)}.push-button[aria-pressed=true].button-outline.danger{background-color:var(--ui-color-danger-semi)}.push-button.button-outline.touching,.push-button.button-outline:active,.push-button.button-outline[aria-pressed=true]{box-shadow:none}.splitter{position:absolute;height:100%;width:16px;z-index:90;cursor:ew-resize}.splitter::after{content:" ";display:block;width:6px;height:100%;margin:0 auto}.splitter.vertical{width:100%;height:16px;cursor:ns-resize}.splitter.vertical::after{width:100%;height:6px;margin:auto 0}.splitter.is-dragging::after,.splitter:hover::after{background-color:var(--ui-color-background-1)}.table{width:100%;height:100%;overflow:auto;overscroll-behavior-y:contain;position:relative;border:2px solid var(--ui-color-border)}.table table{border-spacing:0;width:100%;table-layout:fixed}.table.round{border-radius:var(--ui-border-radius)}.table.selectable{cursor:default;-webkit-user-select:none;user-select:none}.table tfoot,.table thead{position:sticky;z-index:2}.table thead{top:0}.table tfoot{bottom:0}.table tfoot td,.table thead th{padding:var(--ui-margin-m);font-weight:400;text-align:left;vertical-align:middle;background:var(--ui-color-background-input)}.table tbody:focus,.table tbody:focus tr,.table tr:focus,.table tr:focus-within{outline:1px solid transparent;background-color:var(--ui-color-highlight-1)}.table tbody td{padding:var(--ui-margin) var(--ui-margin-m) calc(var(--ui-margin) + 1px);border-bottom:1px solid var(--ui-color-border);vertical-align:middle;line-height:1.5rem}.table td:first-child,.table th:first-child{padding-left:var(--ui-margin-l)}.table td:last-child,.table th:last-child{padding-right:var(--ui-margin-l)}.table tbody:last-of-type tr:last-child td{border-bottom:none}.ui-tag{border:1px solid var(--ui-color-border);background:var(--ui-color-secondary);border-radius:var(--ui-border-radius);padding:.4rem .7rem;display:inline-flex;align-items:center;gap:.2rem;height:2rem;cursor:default;color:var(--ui-color-text);-webkit-user-select:none;user-select:none}.ui-tag.clickable{touch-action:manipulation;cursor:pointer}.ui-tag.clickable:not(.disabled):active{transform:translateY(1px);filter:brightness(.85)}.ui-tag .icon{width:1rem;height:1rem;margin-left:-4px;transform:translateZ(1px)}.ui-tag:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:1px solid transparent}.ui-tag .ui-tag-label{padding-bottom:2px}.ui-tag.dark{color:#fff}.ui-tag.light{color:#000}.ui-tag.disabled{opacity:.5}.ui-tag.round{border-radius:var(--ui-border-radius-xl)}.ui-tag.info{background-color:var(--ui-color-info)}.ui-tag.success{background-color:var(--ui-color-success)}.ui-tag.danger{background-color:var(--ui-color-danger)}.ui-tag.warning{background-color:var(--ui-color-warning)}.ui-tag.danger,.ui-tag.info,.ui-tag.success,.ui-tag.warning{color:var(--ui-color-text)}.tooltip-plate{--popover-tip-size:10px;--popover-color:#292929}.tooltip{border-radius:5px;max-width:75vw}.tooltip-content{padding:.5rem .7rem}.info .tooltip{--popover-color:var(--ui-color-info)}.success .tooltip{--popover-color:var(--ui-color-success)}.danger .tooltip{--popover-color:var(--ui-color-danger)}.warning .tooltip{--popover-color:var(--ui-color-warning)}.tree,.tree ul{padding:0;margin:0;list-style:none}.tree ul li,.tree>li{display:block;width:100%;padding:0;margin:0}.tree{display:flex;flex-flow:column;align-items:stretch;overflow:hidden;position:relative;margin:0;padding:.3rem;border-radius:var(--ui-border-radius)}.tree:focus{outline:0}.tree:focus-visible{box-shadow:0 0 0 1px var(--ui-color-accent),var(--ui-shadow-focus)}.tree-node{cursor:pointer;display:flex;align-items:center;border-radius:var(--ui-border-radius);padding:0 .5rem;height:var(--ui-button-height);-ms-touch-action:manipulation;touch-action:manipulation}.tree-node.selected{background-color:var(--ui-color-highlight-1)}.tree-node:hover{background-color:var(--ui-color-highlight)}.tree-icon{display:inline-block;width:1.5rem;height:1.5rem;margin-right:.5rem;background-color:var(--ui-color-text-2);-webkit-mask-size:1.5rem;-webkit-mask-repeat:no-repeat;-webkit-mask-position:0 center;mask-size:1.5rem;mask-repeat:no-repeat;mask-position:0 center}.tree-label{line-height:2}.tree-indent{display:block;width:.8rem;margin-right:1rem;height:100%;border-right:1px solid transparent}.tree .tree-indent{border-right-color:var(--ui-color-border-1)}.tree-file-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E")}.tree-folder-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E")}.expanded .tree-folder-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E")}.button-toggle.input{width:min-content;max-width:100%;padding:0;flex-flow:column;align-items:flex-start;justify-content:flex-start;border-radius:calc(var(--ui-border-radius) + 1px)}.button-toggle .input-inner{width:100%;overflow:hidden;border-radius:calc(var(--ui-border-radius) + 1px)}.button-toggle .input-scroller{width:100%;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background-input);overflow:auto hidden;overscroll-behavior-x:contain;scrollbar-width:none}.button-toggle .input-scroller::-webkit-scrollbar{width:0;height:0}.button-toggle .input-row{min-width:100%;width:min-content}.button-toggle .input-row .button{position:static;color:var(--ui-color-text);box-shadow:none;min-height:calc(var(--ui-button-height) - 2px);background:var(--ui-color-background-input);border:none;border-radius:0;flex:1;border-left:1px solid var(--ui-color-border);min-width:min-content}.button-toggle .button:has(:checked){background-color:var(--ui-color-highlight)}.button-toggle .input-row .button:first-child{border-left:none;border-top-left-radius:var(--ui-border-radius);border-bottom-left-radius:var(--ui-border-radius)}.button-toggle .input-row .button:last-child{border-top-right-radius:var(--ui-border-radius);border-bottom-right-radius:var(--ui-border-radius)}.button-toggle .button input{position:absolute;top:-100px;opacity:0;pointer-events:none}.button-toggle.round{border-radius:var(--ui-border-radius-xl)}.button-toggle.round:not(.has-error) .input-inner{border-radius:var(--ui-border-radius-xl)}.button-toggle.round .input-row .button:first-child{border-top-left-radius:var(--ui-border-radius-xl);border-bottom-left-radius:var(--ui-border-radius-xl)}.button-toggle.round .input-row .button:last-child{border-top-right-radius:var(--ui-border-radius-xl);border-bottom-right-radius:var(--ui-border-radius-xl)}.checkbox{display:inline-flex;flex-flow:column;align-items:stretch;justify-content:flex-start;gap:.5rem}.checkbox-row{display:inline-flex;align-items:center;justify-content:flex-start;gap:.5rem}.checkbox input:focus{border-color:var(--ui-color-accent)}.checkbox input::after{content:"✕";font-family:Arial,Helvetica,sans-serif;line-height:1.1}.checkbox.indeterminate input::after{content:" ";opacity:1;background:var(--ui-color-text-1);width:65%;height:65%;border-radius:.2rem}.checkbox input:checked::after{opacity:1}.checkbox.disabled{opacity:.5}.checkbox.disabled input{opacity:1}.checkbox.has-error input{border-color:var(--ui-color-danger)}.checkbox.has-error input:focus{box-shadow:var(--ui-shadow-danger)}.checkbox.label-on-the-left .checkbox-row{flex-flow:row-reverse}.combobox .input-inner{position:relative}.combobox input{padding-right:36px}.multiselect input{text-overflow:ellipsis}.combobox-button:focus{box-shadow:none}.combobox-list{position:absolute;z-index:var(--ui-z-index-popup);overflow-y:auto;overscroll-behavior-y:contain;padding:.2rem;min-height:0;max-height:26rem;-webkit-user-select:none;user-select:none;transform:translateZ(1px);color:var(--ui-color-text);border:var(--ui-popup-border);border-radius:calc(var(--ui-border-radius) + .2rem);background:var(--ui-popup-background);box-shadow:var(--ui-shadow-fancy)}.combobox-list.empty{padding:0;box-shadow:none;border:none}.combobox-list:not(.empty){min-height:2rem}.combobox-list.hidden{display:none}.combobox-list-header,.combobox-list-item{height:var(--ui-button-height);line-height:1;display:flex;align-items:center;white-space:nowrap;text-overflow:ellipsis;overflow-x:hidden;padding:0 1rem}.combobox-list-header{margin:.5rem 0 0;color:var(--ui-color-text-2);font-weight:500;cursor:default}.combobox-list-header:last-child{display:none}.combobox-list-empty{padding:.6rem 1.2rem;color:var(--ui-color-text-semi);cursor:default;white-space:nowrap}.combobox-list-item{color:var(--ui-color-text);cursor:pointer;border-radius:var(--ui-border-radius);-ms-touch-action:manipulation;touch-action:manipulation}.combobox-list-item svg{margin-right:.5rem}.combobox-list-item .tick{display:none}.combobox-list-item.checked .tick{display:block}.combobox-list:not(.multiselect) .combobox-list-item.in-group{padding-left:2rem}.mobile .combobox-list-item{transition:background-color .3s ease-out}.mobile .combobox-list-item.blinking{transition:background-color .1s;background-color:var(--ui-color-highlight-1)}.desktop .combobox-list-item.checked{background-color:var(--ui-color-highlight-semi)}.desktop .combobox-list-item.selected{background-color:var(--ui-color-highlight-1)}.desktop .combobox-list-item:hover{background-color:var(--ui-color-highlight)}.combobox-list-item b{color:var(--ui-color-accent)}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.combobox-list{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.input-date .input-text-inner{position:relative;overflow:unset}.input-date input{flex:1;width:100%;padding-right:36px}.input-date.native .input-date-button{pointer-events:none}.datepicker{display:none;transform:translateZ(1px)}.datepicker.active{display:block}.datepicker-dropdown{position:absolute;top:0;left:0;z-index:var(--ui-z-index-popup);padding-top:.2rem}.datepicker-dropdown.datepicker-orient-top{padding-top:0;padding-bottom:4px}.datepicker-picker{display:inline-block;overflow:hidden;border-radius:.4em;background-color:var(--ui-color-background);border:var(--ui-popup-border);box-shadow:var(--ui-shadow-fancy)}.datepicker-picker span{display:block;flex:1;border:0;border-radius:6px;cursor:default;text-align:center;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.datepicker-main{padding:var(--ui-margin-s)}.datepicker-controls,.datepicker-grid,.datepicker-view,.datepicker-view .days-of-week{display:flex}.datepicker-grid{flex-wrap:wrap;width:15.75rem}.datepicker-cell{-ms-touch-action:manipulation;touch-action:manipulation}.datepicker-cell,.datepicker-view .week{height:2.25rem;line-height:2.25rem}.datepicker-view .days .datepicker-cell,.datepicker-view .dow{flex-basis:14.2857142857%}.datepicker-view.datepicker-grid .datepicker-cell{flex-basis:25%;height:4.5rem;line-height:4.5rem}.datepicker-title{padding:.375rem .75rem;text-align:center}.datepicker-footer .datepicker-controls,.datepicker-header .datepicker-controls{padding:.2rem}.datepicker-controls .button{padding:0;width:2.5rem;min-width:2.5rem;text-align:center}.datepicker-controls .button svg{margin:0;height:1.4rem}.datepicker-controls .button.disabled{visibility:hidden}.datepicker-controls .button.view-switch{flex:auto;width:auto}.datepicker-footer .datepicker-controls .button{width:100%}.datepicker-view .dow{height:1.5rem;line-height:1.5rem;font-size:var(--ui-font-xs)}.datepicker-view .week{width:2.25rem;font-size:.75rem}.datepicker-cell.next:not(.disabled),.datepicker-cell.prev:not(.disabled){color:var(--ui-color-text-2)}.datepicker-cell.selected.next:not(.disabled),.datepicker-cell.selected.prev:not(.disabled){color:var(--ui-color-text-1)}.datepicker-cell.selected{background-color:var(--ui-color-highlight);color:var(--ui-color-text)}.datepicker-cell.disabled{color:var(--ui-color-text-2)}.datepicker-cell.today:not(.selected){background-color:var(--ui-color-secondary-semi);color:var(--ui-color-text)}.datepicker-cell.focused,.datepicker-cell.highlighted:not(.range).focused,.datepicker-cell.highlighted:not(.range,.disabled):hover,.datepicker-cell.today.focused,.datepicker-cell:not(.disabled):hover{background-color:var(--ui-color-highlight);color:var(--ui-color-text);cursor:pointer}.datepicker-cell.range-start{border-radius:4px 0 0 4px}.datepicker-cell.range-end{border-radius:0 4px 4px 0}.datepicker-cell.range{border-radius:0;background-color:#dbdbdb}.datepicker-cell.range-end:not(.selected),.datepicker-cell.range-start:not(.selected){background-color:#b5b5b5;color:#fff}.datepicker-cell.range-end.focused:not(.selected),.datepicker-cell.range-start.focused:not(.selected){background-color:#afafaf}.datepicker-cell.range:not(.disabled,.focused,.today):hover{background-color:#d5d5d5}.datepicker-cell.range.disabled{color:#c2c2c2}.datepicker-cell.range.focused{background-color:#cfcfcf}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.datepicker-picker{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.checkbox .error-wrap,.input .error-wrap,.radio .error-wrap{display:flex;flex-flow:row;align-items:stretch;justify-content:flex-start}.checkbox .error-wrap,.radio .error-wrap{overflow:hidden}.input .info-bar-error,.radio .info-bar-error,.textarea .info-bar-error{padding-bottom:calc(.4rem + 10px);margin-bottom:-10px;border:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.checkbox .info-bar{margin:0}.textarea .info-bar-error{grid-area:1/1/2/2}.has-error.input .input-inner,.has-error.textarea .textarea-inner{background-color:var(--ui-color-danger-semi)}.has-error.input .input-inner{border-color:var(--ui-color-danger)}.has-error.input .input-inner:focus-within,.has-error.input .input-inner:has(:active):not(.disabled){box-shadow:var(--ui-shadow-danger)}.has-error.input .info-bar-error,.has-error.textarea .info-bar-error{background-color:transparent}.input-math{position:relative;display:inline-flex;flex-flow:column;align-items:stretch;justify-content:space-between}.input-math input{padding-left:30px;text-align:right}.input-password{position:relative;display:inline-flex;flex-flow:column;align-items:stretch;justify-content:space-between}.input-password input{font-family:verdana,sans-serif;width:100%;padding-right:36px}.input-password.visible input{font-family:inherit}.input-password.visible .input-password-button{color:var(--ui-color-danger)}.input-password.visible .input-password-button svg{stroke-width:2}.password-strength{width:calc(100% - 6px);height:3px;margin:-7px 3px 0;border-radius:10px;background-color:var(--ui-color-background-input);cursor:default}.password-strength-progress{height:100%;border-radius:inherit;transition:width var(--ui-animation-speed) ease-out;background-color:var(--ui-color-danger)}.password-strength-progress.warning{background-color:var(--ui-color-warning)}.password-strength-progress.info{background-color:var(--ui-color-info)}.password-strength-progress.success{background-color:var(--ui-color-success)}.password-strength-info{position:absolute;top:0;display:none;cursor:default;width:calc(100% - 2px);flex-flow:column;align-items:stretch;gap:1rem;font-size:.8rem;margin:.2rem 1px 0;padding:.8rem;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background-input);border:1px solid var(--ui-color-danger);z-index:var(--ui-z-index-elevated)}.input-password:focus-within .password-strength-info{display:flex}.password-strength-info.warning{border-color:var(--ui-color-warning)}.password-strength-info.info{border-color:var(--ui-color-info)}.password-strength-info.success{border-color:var(--ui-color-success)}.password-strength-info h2{font-size:var(--ui-font-s);text-align:left;margin-bottom:0}.password-strength-info small{font-size:var(--ui-font-xs);margin:0;line-height:1.4}.password-strength-info small:empty{display:none}.input-rating{min-width:fit-content}.input-rating .input-inner,.input-rating .input-inner:focus{outline:0}.input-rating .input-row{align-items:stretch;justify-content:flex-start;height:var(--ui-button-height);background-color:var(--ui-color-background-input)}.input-rating .button{position:static;right:unset;cursor:default;user-select:none;-ms-touch-action:manipulation;touch-action:manipulation;font-size:1.2rem;margin:0}.input-rating .button:focus-visible{box-shadow:none}.input-rating .btn-reset{margin-left:auto}.input-rating .btn-reset:focus-visible{color:var(--ui-color-accent)}.input-rating .button.active svg{color:var(--ui-color-accent);fill:var(--ui-color-accent)}.input-rating .button.button-link,.input-rating .button.button-link:focus-visible,.input-rating .button.button-link:hover{text-decoration:none}.input-rating.light:not(.has-error) .input-inner,.input-rating.light:not(.has-error) .input-row{background-color:transparent;border:none}.input-search input{padding-left:calc(2rem + 6px);padding-right:2rem;appearance:none;-webkit-appearance:none}::-webkit-search-cancel-button{display:none}.input-search .input-row>.icon{top:1px}.input-search-button{display:none}.input-search-button.visible{display:inline-flex}.input-tag .input-inner{touch-action:manipulation}.input-tag .input-inner:focus{outline:0}.input-tag .input-inner[aria-expanded=true]{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.input-tag .input-row{min-height:calc(var(--ui-button-height) - 2px);padding:4px .3rem 3px;align-items:flex-start;justify-content:flex-start;gap:.2rem;flex-wrap:wrap}.input-tag .input-row>.icon{position:static;flex-shrink:0;margin-top:.14rem}.input-tag .ui-tag{height:1.7rem}.input-tag-popover{width:25ch}.input-tag-popover .popover-content{padding:.5rem}.input-tag-list-tags{display:flex;flex-flow:row wrap;gap:.2rem;flex:1;max-height:10rem;overflow-y:auto}.input-tag-list-add-row{display:flex;align-items:center;gap:.5rem}.input-tag-list-add-row .input{width:100px;flex:1}.input-tag-list-add-row .input input{background:var(--ui-color-background-semi)}.input-tag-list-tags:not(:empty){margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:var(--ui-popup-border)}.input-text .input-inner{overflow:hidden}.input-time .input-row{border-radius:inherit;background:var(--ui-color-background-input)}.input-time input{margin-left:calc(2rem - 2px)}.label{height:var(--ui-button-height);line-height:1.6;padding:0;display:inline-flex;align-items:center;-ms-touch-action:manipulation;touch-action:manipulation}.label.disabled{pointer-events:none;-webkit-user-select:none;user-select:none}.input .label{padding-inline:1px}.label-on-the-left .label{padding-inline:0;padding-top:1px;width:max-content;white-space:nowrap}.input-tag.label-on-the-left,.radio.label-on-the-left,.textarea.label-on-the-left{align-items:flex-start}.input-tag.label-on-the-left .label,.radio.label-on-the-left>.label,.textarea.label-on-the-left .label{height:calc(var(--ui-button-height) + 2px)}.radio.label-on-the-left>.label{margin-block:var(--ui-margin-s)}.radio{min-width:26ch;width:min-content;max-width:100%;--ui-radio-padding:var(--ui-margin-s)}.radio input{border-radius:10rem;width:1.3rem;height:1.3rem}.radio input:focus{box-shadow:none}.radio input::after{background:var(--ui-color-text-1);width:65%;height:65%;border-radius:inherit}.radio-inner{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:100%;padding:0;border:1px solid var(--ui-color-border);border-radius:calc(var(--ui-border-radius) + var(--ui-radio-padding));background-color:var(--ui-color-background-input);overflow:hidden}.radio-items{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;gap:var(--ui-radio-padding);width:100%;padding:var(--ui-radio-padding) 0;background-color:var(--ui-color-background-input);border-radius:inherit}.radio-item{display:flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:.5rem;width:calc(100% - calc(var(--ui-radio-padding) * 2));margin:0 var(--ui-radio-padding);padding:0 var(--ui-margin);border-radius:var(--ui-border-radius)}.radio-item.disabled{opacity:.5}.radio-item.disabled input{opacity:1}.radio-item:not(.disabled):focus-within,.radio-item:not(.disabled):hover{background-color:var(--ui-color-highlight-1)}.radio-inner:focus-within,.radio-inner:has(:active):not(.disabled){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.radio.has-error .radio-inner{border-color:var(--ui-color-danger);background-color:var(--ui-color-danger-semi)}.radio.has-error .info-bar-error{background-color:transparent}.has-error .radio-inner:focus-within,.has-error .radio-inner:has(:active):not(.disabled){box-shadow:var(--ui-shadow-danger);border-color:var(--ui-color-danger)}.range{position:relative;width:25ch;vertical-align:top;--range-size:calc(var(--ui-button-height) / 3 * 2)}.range .range-inner{display:flex;flex-flow:column;gap:.5rem;flex:1;padding:0 0 .5rem;position:relative;height:100%}.range input{-webkit-appearance:none;appearance:none;margin:0;width:100%;height:.5rem;border-radius:5rem;padding-inline:0;border:1px solid var(--ui-color-border);background:var(--ui-color-background-input);background-image:linear-gradient(var(--ui-color-highlight),var(--ui-color-highlight));background-size:70% 100%;background-repeat:no-repeat;background-clip:padding-box}.range input::-webkit-slider-runnable-track{-webkit-appearance:none;display:block;height:.5rem;border-radius:.5rem}.range input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--ui-color-text);height:var(--range-size);width:var(--range-size);border-radius:5rem;box-shadow:0 1px 3px #000c;transform:translateY(calc(-50% + .25rem - 1px));transform-origin:center 25%}.range input::-moz-range-track{display:flex;align-items:center;background-color:var(--ui-color-background-input);height:.5rem;border-radius:.5rem}.range input::-moz-range-thumb{background-color:var(--ui-color-text);height:var(--range-size);width:var(--range-size);border-radius:5rem;box-shadow:0 1px 3px #000c}.range:not(.disabled) input::-webkit-slider-thumb:active{scale:0.9}.range:not(.disabled) input::-moz-slider-thumb:active{scale:0.9}.range-ticks{display:flex;justify-content:space-between;margin:0 -.1rem .4rem;cursor:default}.range-ticks span{width:3ch;text-align:center}.range:not(.disabled) .range-ticks span{cursor:pointer}.range.label-on-the-left{align-items:flex-end}.range.label-on-the-left .label{height:1.8rem}.select{font:inherit;position:relative}.select select{-moz-appearance:none;-webkit-appearance:none;appearance:none;font-size:1rem;font-family:inherit;background:0 0;padding:0 30px 0 var(--ui-margin-m);width:100%;border:1px solid transparent;height:calc(var(--ui-button-height) - 2px);line-height:1.2;color:var(--ui-color-text);background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius)}.select select:focus{outline:0}.select optgroup{font-weight:500}.select .input-row::after{content:"";position:absolute;width:2rem;right:0;top:0;bottom:0;opacity:.6;pointer-events:none;background-repeat:no-repeat;background-position:right .7rem center;background-size:.6rem .8rem;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23bbb' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")}.theme-light .select .input-row::after{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23222' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")}.textarea{position:relative;width:25ch;vertical-align:top}.textarea textarea,.textarea.autogrow .textarea-inner::after{font:inherit;line-height:1.3;border:1px solid transparent;margin:0;width:100%;padding:var(--ui-margin-m);grid-area:2/1/2/2}.textarea .textarea-inner{width:100%;display:inline-grid;align-items:stretch;background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius);border:1px solid var(--ui-color-border)}.textarea textarea{resize:vertical;color:var(--ui-color-text);border-radius:var(--ui-border-radius);border:none;min-height:2.6rem;background-color:var(--ui-color-background-input)}.textarea .textarea-inner:focus-within{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.textarea textarea:focus{outline:0;box-shadow:none;border:none}.textarea textarea:invalid{border:none;box-shadow:none}.textarea textarea:disabled{opacity:.5}.textarea.autogrow .textarea-inner::after{content:attr(data-value) " ";visibility:hidden;white-space:pre-wrap;min-width:1rem;resize:none;background:0 0;appearance:none}.textarea.autogrow textarea{resize:none}.textarea.has-error .textarea-inner{border-color:var(--ui-color-danger)}.textarea.has-error .textarea-inner:focus-within{box-shadow:var(--ui-shadow-danger)}.toggle{--toggle-width:60px;--toggle-padding:2px;--border-radius:var(--ui-border-radius-xl);--toggle-height:calc(var(--toggle-width) / 2.5);--knob-size:var(--toggle-height);display:inline-flex;flex-flow:column;align-items:flex-start;position:relative;vertical-align:middle;-webkit-user-select:none;user-select:none;border-radius:var(--border-radius)}.toggle-inner{border:1px solid var(--ui-color-text-2);padding:var(--toggle-padding);border-radius:inherit;background-color:var(--ui-color-background-2);position:relative;margin-block:3px}.toggle:has(:disabled){pointer-events:none;opacity:.6}.toggle:focus{outline:0}.toggle:focus-visible .toggle-inner{box-shadow:var(--ui-shadow-focus);border-color:var(--ui-color-accent)}.toggle-input{display:none}.toggle-label{width:var(--toggle-width);height:var(--toggle-height);border-radius:calc(var(--border-radius) - var(--toggle-padding));display:flex;align-items:center;justify-content:flex-start;flex-shrink:0;overflow:hidden;cursor:pointer}.toggle-scroller{height:100%;border-radius:inherit;display:inline-flex;align-items:center;justify-content:center;transition:margin-left .2s cubic-bezier(.85, .05, .18, 1.4);flex-shrink:0;width:calc(200% - var(--toggle-height));margin-left:calc(var(--toggle-height) - var(--toggle-width) - var(--toggle-padding))}.toggle-option{width:50%;height:100%;border-radius:inherit;background-color:green;display:inline-flex;align-items:center;justify-content:center;background-repeat:no-repeat;background-position:center;background-size:calc(var(--toggle-width)/ 5)}.toggle-option:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--ui-color-highlight);background-position:41% 47%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E")}.toggle-option:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0;background-color:var(--ui-color-background-input);background-position:62% 55%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E")}.theme-light .toggle-option:first-of-type{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E")}.theme-light .toggle-option:last-of-type{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E")}.toggle-handle{width:0;height:0;position:absolute;transition:left .2s cubic-bezier(.85, .05, .18, 1.4);border-radius:inherit;left:calc(var(--toggle-height)/ 2 + var(--toggle-padding))}.toggle-knob{width:var(--knob-size);height:var(--knob-size);background:var(--ui-color-text-1);border:1px solid var(--ui-color-text-2);transform:translate(-50%,-50%);border-radius:inherit}.notification-archive{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:100%;z-index:5;transform:translateX(calc(var(--ui-notification-width) + var(--ui-notification-gap) + 1rem));transition:transform var(--ui-animation-speed) ease-out}.notification-archive .notification{z-index:1}.notification-archive header{display:flex;align-items:center;justify-content:space-between;margin:var(--ui-notification-gap) var(--ui-notification-gap) 0;color:var(--ui-color-text);z-index:1;background-color:var(--ui-color-background-input);padding:.75rem .5rem .75rem 1rem;border-radius:var(--ui-border-radius)}.notification-archive button{color:inherit;font-size:var(--ui-font-l);font-weight:300;min-width:1.8rem;min-height:1.8rem}.notification-archive h2{color:inherit;font-size:var(--ui-font-l);margin:0;padding:0;border:none}.notification-archive h2 .button{padding-inline:var(--ui-margin-m);margin-left:-.5rem}.notification-archive h2 .button svg{transform:rotate(0);transition:transform var(--ui-animation-speed) ease-out}.notification-archive.expanded h2 .button svg{transform:rotate(90deg)}.notification-archive.inert{pointer-events:none}.notification-archive-buttons{white-space:nowrap;display:flex;align-items:center;justify-content:space-between;gap:.2rem}.notification-archive-buttons .btn-close{font-size:1.4rem;height:1.8rem;width:1.7rem;padding-bottom:.15rem}.notification.archived{filter:saturate(.3)}.notification-timestamp{color:var(--ui-color-text-semi);font-size:var(--ui-font-xs);margin-inline:0.5rem}.show-archive .notification-archive{transform:translateX(0);margin-bottom:1rem;height:auto;overflow:visible}.notification-center{--ui-notification-border-radius:var(--ui-border-radius);--ui-notification-gap:0.75rem;--ui-notification-width:30rem;position:fixed;transform:translateZ(1px);display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:calc(var(--ui-notification-width) + var(--ui-notification-gap) * 2);top:0;right:0;z-index:-1;max-height:100vh;overflow:hidden auto;overscroll-behavior:contain}.notification-center.archive-is-visible,.notification-center.has-active-notifications{z-index:var(--ui-z-index-popup)}.notification{font-size:var(--ui-font-m);position:relative;overflow:hidden;flex-grow:0;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;min-height:2rem;border:none;margin:var(--ui-notification-gap) var(--ui-notification-gap) 0;box-shadow:var(--ui-shadow-fancy);border-radius:var(--ui-notification-border-radius);z-index:var(--ui-z-index-popup)}.notification:last-child{margin-bottom:calc(var(--ui-notification-gap) + 10px)}.notification button{background:0 0;color:var(--ui-color-text);height:1.8rem;min-width:1.6rem;font-size:inherit;padding:0 var(--ui-margin-m);margin:0 var(--ui-margin-m) 0 0;display:flex;align-items:center;justify-content:center;border-radius:var(--ui-border-radius);border:1px solid transparent}.notification button:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.notification button:hover{color:var(--ui-color-text-2);background:#2228}.notification button:active{color:var(--ui-color-text-1);background:#0008}.notification .notification-close{font-size:1.4rem;font-weight:200;position:relative;padding-bottom:.15rem}.notification-buttons,.notification-icon{min-height:100%;display:flex;align-items:center;justify-content:flex-end}.notification-icon{width:var(--ui-button-height)}.notification-msg{color:var(--ui-color-text);flex:1;display:flex;align-items:center;justify-content:flex-start;padding:.8rem;line-height:1.4;font-weight:400}.notification-progressbar{position:absolute;inset:0;border-radius:inherit;z-index:-1}.notification-progress{height:100%;border-radius:inherit;background-color:#ffffff15;border:1px solid #ffffff25;margin:0;width:0;transition:width .2s}.notification:focus{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.notification-center-button svg{stroke:var(--ui-color-secondary)}.notification-center-button.has-notifications svg{stroke:var(--ui-color-text)}.notification-center-button.has-notifications svg>path:nth-child(2){fill:var(--ui-color-text)}@media (1px <= width <= 700px){.notification-center{--ui-notification-width:calc(100vw - var(--ui-notification-gap) * 2)}}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.notification{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.notification-info{background-color:var(--ui-color-info-semi)}.notification-success{background-color:var(--ui-color-success-semi)}.notification-warning{background-color:var(--ui-color-warning-semi)}.notification-error{background-color:var(--ui-color-danger-semi)}} \ No newline at end of file +:root { + + /* BORDERS */ + --ui-border-radius: 0.375rem; /* 6px */ + --ui-border-radius-m: 0.6877rem;/* 11px */ + --ui-border-radius-l: 1rem; /* 16px */ + --ui-border-radius-xl: 5rem; /* 80px */ + + /* MARGIN & PADDING */ + --ui-margin: 0.375rem; /* 6px */ + --ui-margin-xs: 0.125rem; /* 2px */ + --ui-margin-s: 0.25rem; /* 4px */ + --ui-margin-m: 0.5rem; /* 8px */ + --ui-margin-l: 1rem; /* 16px */ + + + --ui-animation-speed: .25s; + --ui-button-height: 2.25rem; /* 36px */ + + + /* FONTS */ + --ui-font-system: system-ui, 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'sans-serif', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; + --ui-font-xs: 0.875rem; /* 14px */ + --ui-font-s: 0.9375rem; /* 15px */ + --ui-font-m: 1rem; /* 16px */ + --ui-font-l: 1.0625rem; /* 17px */ + --ui-font-xl: 1.375rem; /* 22px */ + + + /* SHADOWS */ + --ui-shadow-focus: 0 0 2px 1px var(--ui-color-accent); + --ui-shadow-danger: 0 0 2px 1px var(--ui-color-danger); + --ui-shadow-small: 0 0 0 0.5px #fff4, 0 3px 10px #0006; + --ui-shadow-large: 0 0 0 1px #0003, 0 5px 20px #000a; + --ui-shadow-fancy: + 0 0 0 0.5px #111, + 0 1px 5px rgb(0 0 0 / 30%), + 0 4px 10px rgb(0 0 0 / 10%), + 0 10px 25px rgb(0 0 0 / 8%); + + + /* Z-INDEX */ + --ui-z-index-elevated: 9; + --ui-z-index-popup: 999; +} + + +body { + font-weight: 300; + font-size: 100%; + font-family: var(--ui-font-system), sans-serif; + box-sizing: border-box; +} +body * { box-sizing: inherit; } + + +.icon-tabler { width: 1.5rem; height: 1.5rem; } + +/* meatballs icon is misaligned */ +.icon-tabler-dots-vertical { margin-left: -1px; } + +.flex-spacer { flex: 1; } + +/* Icon visual alignment corrections */ +.icon-tabler-alert-triangle { transform: translateY(1px); } +.icon-tabler-logout { transform: translateX(3px); } + +/* adding this class to input elements will prevent scrolling on focus in mobile safari */ +.mobile .prevent-scrolling-on-focus:focus { animation: prevent-scrolling-on-focus 10ms; } + +@keyframes prevent-scrolling-on-focus { + 0% { opacity: 0; } + 100% { opacity: 1; } +} + +:root, +.theme-dark { + color-scheme: dark; + + --ui-color-accent: #bb7a00; + --ui-color-accent-semi: #bb7a0066; + + --ui-color-highlight: #1859a3; + --ui-color-highlight-semi: #1859a366; + --ui-color-highlight-1: #1e4572; + + --ui-color-secondary: #5a5956; + --ui-color-secondary-semi: #5a595666; + + + --ui-color-info: #30506a; + --ui-color-info-semi: #30506a99; + + --ui-color-success: #33624d; + --ui-color-success-semi: #33624d99; + + --ui-color-warning: #795001; + --ui-color-warning-semi: #79500199; + + --ui-color-danger: #943737; + --ui-color-danger-semi: #94373799; + + --ui-color-border: #1b1b1b; + --ui-color-border-1: #131313; + --ui-color-border-2: #0c0c0c; + + --ui-color-background: #2f2f2f; + --ui-color-background-semi: #2f2f2f66; + --ui-color-background-input: #222; + + --ui-color-background-1: #535353; + --ui-color-background-2: #1a1a1a; + + + + --ui-color-text: #fff; + --ui-color-text-semi: #fff6; + --ui-color-text-1: #bbb; + --ui-color-text-2: #888; + + + --ui-popup-border: 1px solid #fff3; + --ui-popup-background: var(--ui-color-background); + + --ui-shadow-button: 0 1px 0 #000c; + --ui-shadow-tooltip: 0 0 0 1px #000, 0 0 5px #0006; +} + +.theme-light { + color-scheme: light; + + --ui-color-accent: #b37400; + --ui-color-accent-semi: #b3740066; + + --ui-color-highlight: #8ec6ff; + --ui-color-highlight-semi: #8ec6ff66; + --ui-color-highlight-1: #6ba0de; + + --ui-color-secondary: #c0beb4; + --ui-color-secondary-semi: #c0beb466; + + + --ui-color-info: #bbd3f0; + --ui-color-info-semi: #bbd3f099; + + --ui-color-success: #7bd7ae; + --ui-color-success-semi: #7bd7ae99; + + --ui-color-warning: #eec64e; + --ui-color-warning-semi: #eec64e99; + + --ui-color-danger: #eb6e6f; + --ui-color-danger-semi: #eb6e6f99; + + --ui-color-border: #bbb; + --ui-color-border-1: #aaa; + --ui-color-border-2: #999; + + --ui-color-background: #eee; + --ui-color-background-semi: #eee6; + --ui-color-background-input: #c2c2c2; + + --ui-color-background-1: #f0f0f0; + --ui-color-background-2: #ccc; + + + + --ui-color-text: #000; + --ui-color-text-semi: #0006; + --ui-color-text-1: #222; + --ui-color-text-2: #666; + + + --ui-popup-border: 1px solid #ccc; + --ui-popup-background: var(--ui-color-background); + + --ui-shadow-button: 0 1px 0 #000c; + --ui-shadow-tooltip: 0 0 1px #0002, 0 0 5px #0006; +} + +.button-link { + background: none; + border: none; + cursor: pointer; + min-width: 0; +} + +.button.button-link { + margin: calc(var(--ui-margin) * -1); + padding: var(--ui-margin); + vertical-align: baseline; + text-decoration: underline; +} + +.button.button-link:focus-visible, +.button.button-link:hover { text-decoration: underline; text-underline-offset: 0.2rem; } + + +.button-link.info:focus-visible, +.button-link.info:hover { text-decoration-color: var(--ui-color-info); } + +.button-link.success:focus-visible, +.button-link.success:hover { text-decoration-color: var(--ui-color-success); } + +.button-link.warning:focus-visible, +.button-link.warning:hover { text-decoration-color: var(--ui-color-warning); } + +.button-link.error:focus-visible, +.button-link.error:hover, +.button-link.danger:focus-visible, +.button-link.danger:hover { text-decoration-color: var(--ui-color-danger); } + +.button-normal { + background: var(--ui-color-secondary); + border: 0.5px solid #0006; + border-bottom-color: #000c; + box-shadow: var(--ui-shadow-button); + min-width: calc(var(--ui-button-size) * 4); + min-height: calc(var(--ui-button-size) * 2); +} + +.button-normal.info { background: var(--ui-color-info); } +.button-normal.success { background: var(--ui-color-success); } +.button-normal.warning { background: var(--ui-color-warning); } +.button-normal.error, +.button-normal.danger { background: var(--ui-color-danger); } + +.button-outline { + background: transparent; + border: 2px solid var(--ui-color-secondary); + min-width: calc(var(--ui-button-size) * 4); + min-height: calc(var(--ui-button-size) * 2); +} + +.button-outline:focus-visible, +.button-outline:hover { background-color: var(--ui-color-secondary-semi); } + +.button-outline.info { border-color: var(--ui-color-info); } +.button-outline.info:focus-visible, +.button-outline.info:hover { background-color: var(--ui-color-info-semi); } + +.button-outline.success { border-color: var(--ui-color-success); } +.button-outline.success:focus-visible, +.button-outline.success:hover { background-color: var(--ui-color-success-semi); } + +.button-outline.warning { border-color: var(--ui-color-warning); } +.button-outline.warning:focus-visible, +.button-outline.warning:hover { background-color: var(--ui-color-warning-semi); } + +.button-outline.error, +.button-outline.danger { border-color: var(--ui-color-danger); } + +.button-outline.error:focus-visible, +.button-outline.error:hover, +.button-outline.danger:focus-visible, +.button-outline.danger:hover { background-color: var(--ui-color-danger-semi); } + +.button-text { + background: transparent; + border: none; + min-width: calc(var(--ui-button-size) * 4); + min-height: calc(var(--ui-button-size) * 2); + box-shadow: none; +} + +.button-text:focus-visible, +.button-text:hover { background-color: var(--ui-color-secondary); } + +.button-text.info:focus-visible, +.button-text.info:hover { background-color: var(--ui-color-info); } + +.button-text.success:focus-visible, +.button-text.success:hover { background-color: var(--ui-color-success); } + +.button-text.warning:focus-visible, +.button-text.warning:hover { background-color: var(--ui-color-warning); } + +.button-text.error:focus-visible, +.button-text.error:hover, +.button-text.danger:focus-visible, +.button-text.danger:hover { background-color: var(--ui-color-danger); } + +button { -ms-touch-action: manipulation; touch-action: manipulation; } + +.button { + --ui-button-size: 1rem; + + font: inherit; + line-height: 1.4; + font-weight: 400; + font-size: var(--ui-button-size); + + display: inline-flex; + align-items: center; + justify-content: center; + gap: var(--ui-margin-m); + + min-width: var(--ui-button-height); + min-height: var(--ui-button-height); + height: auto; + + margin: 0; + padding: 0 var(--ui-margin-l); + color: var(--ui-color-text); + -webkit-user-select: none; + user-select: none; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + vertical-align: middle; + border-radius: var(--ui-border-radius); + text-decoration: none; +} + + +.button:hover { text-decoration: none; } +.button:focus-visible { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + outline: 1px solid transparent; +} + +.button[disabled] { + pointer-events: none; + opacity: 0.6; + box-shadow: none; +} + +.button svg { + min-height: calc(var(--ui-button-size) * 1.25); + max-height: calc(var(--ui-button-size) * 1.25); + height: calc(var(--ui-button-size) * 1.25); + min-width: var(--ui-button-size); + width: auto; + pointer-events: none; +} + + +.button:not(.button-has-text) { padding: 0 var(--ui-margin-m); } +.button:not(.button-has-text) svg { min-height: calc(var(--ui-button-size) * 1.4); } + +.button.round { + padding: var(--ui-margin); + border-radius: var(--ui-border-radius-xl); +} +.button.round:not(.button-has-text) { aspect-ratio: 1/1; } + +.button-has-text.round { padding-inline: var(--ui-margin-l); } + + +.button.touching, +.button:active { + outline: 1px solid transparent; + transform: translateY(1px); + filter: brightness(0.85); +} + +.button:not(.push-button):active, +.button:not(.push-button).touching { box-shadow: none; } + +.button-group { + border-radius: var(--ui-border-radius); + max-width: 100%; + overflow: hidden; +} + +.button-group-scroller { + width: 100%; + overflow: auto hidden; + overscroll-behavior-x: contain; + scrollbar-width: none; + scrollbar-gutter: none; + z-index: 0; + border-radius: var(--ui-border-radius); +} + +.button-group-scroller::-webkit-scrollbar { width: 0; height: 0; } + + +.button-group-inner { + padding: 0 0 2px; + display: inline-flex; + flex-flow: row; + align-items: center; + justify-content: stretch; + position: relative; + z-index: 1; + border-radius: var(--ui-border-radius); + background-color: var(--ui-color-background); +} + +.button-group-inner .button { + flex-shrink: 0; + flex-grow: 10; + border-radius: 0; + position: relative; + overflow: hidden; +} + +.button-group-inner .button:focus { z-index: 2; } + +.button-group .button-normal[disabled] { box-shadow: var(--ui-shadow-button); } + +.button-group .button:first-of-type { + border-top-left-radius: var(--ui-border-radius); + border-bottom-left-radius: var(--ui-border-radius); +} + +.button-group .button:last-of-type { + border-top-right-radius: var(--ui-border-radius); + border-bottom-right-radius: var(--ui-border-radius); +} + +.button-group .button-outline:not(:first-of-type) { margin-left: -2px; } + + +.button-group.round { border-radius: var(--ui-border-radius-xl); } + +.button-group.round .button:first-of-type { + border-top-left-radius: var(--ui-border-radius-xl); + border-bottom-left-radius: var(--ui-border-radius-xl); +} + +.button-group.round .button:last-of-type { + border-top-right-radius: var(--ui-border-radius-xl); + border-bottom-right-radius: var(--ui-border-radius-xl); +} + + +.button-group .button:not(.button-has-text):first-of-type { padding-left: 9px; } +.button-group .button:not(.button-has-text):last-of-type { padding-right: 9px; } +.button-group.round .button:not(.button-has-text):first-of-type { padding-right: 6px; padding-left: 11px; } +.button-group.round .button:not(.button-has-text):last-of-type { padding-left: 6px; padding-right: 11px; } + +.has-dialog { + position: fixed; + width: 100%; + inset: 0; + overflow: hidden; +} + +.dialog-backdrop { + position: fixed; + inset: 0; + display: none; + align-items: center; + justify-content: center; + z-index: calc(var(--ui-z-index-popup) - 1); + background-color: rgba(0 0 0 / 0); + transition: all var(--ui-animation-speed) ease-out; + transform: translateZ(1px); +} + +.dialog-backdrop.opened { background-color: rgba(0 0 0 / .6); } + + +.dialog { + --ui-dialog-border-radius: var(--ui-border-radius-m); + --ui-dialog-inner-border-radius: calc(var(--ui-dialog-border-radius) - 1px); + + opacity: 0; + transform: scale(0.8); + transition: + opacity var(--ui-animation-speed) ease-out, + transform var(--ui-animation-speed) ease-out; + max-height: 90vh; + min-width: 15rem; + max-width: 95vw; + color: var(--ui-color-text); + border-radius: var(--ui-dialog-border-radius); + background: var(--ui-popup-background); + border: var(--ui-popup-border); + box-shadow: var(--ui-shadow-large); + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: stretch; +} + +.opened .dialog { opacity: 1; transform: scale(1); } + +.dialog-header, +.dialog-footer { background: var(--ui-color-background-input); padding: 0.7rem 1rem; } + +.dialog-header { + text-align: center; + font-size: var(--ui-font-xl); + font-weight: 300; + margin: 0; + border-bottom: 0.5px solid var(--ui-color-border); +} + +.dialog-content { + margin: 0; + padding: 1rem; + min-width: 200px; + flex: 1; + overflow-y: auto; + overscroll-behavior-y: contain; + outline: 1px solid transparent; + min-height: 3rem; +} + +.dialog-content:focus { outline: none; } +.dialog-content:focus-visible { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus) inset; +} + +.dialog-footer { + border-top: 0.5px solid var(--ui-color-border); + border-bottom-left-radius: var(--ui-dialog-inner-border-radius); + border-bottom-right-radius: var(--ui-dialog-inner-border-radius); +} + +.dialog-footer [slot="footer"] { + width: 100%; + display: flex; + align-items: center; + justify-content: center; + flex-flow: row-reverse; + gap: 0.5rem; +} + +.dialog-footer .button-has-text { min-width: 9ch; } + + +.dialog-header, +.dialog.no-title .dialog-content { + border-top-left-radius: var(--ui-dialog-inner-border-radius); + border-top-right-radius: var(--ui-dialog-inner-border-radius); +} + +.dialog-header:empty { display: none; } + + +.mobile .dialog-backdrop .dialog { + min-height: 0; + min-width: 0; + max-height: 100%; + max-width: 100%; + box-shadow: none; +} + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .dialog-backdrop.opened { + -webkit-backdrop-filter: contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px); + backdrop-filter: contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px); + } +} + +.drawer { + position: fixed; + background-color: var(--ui-popup-background); + border-left: var(--ui-popup-border); + top: 0; + right: 0; + bottom: 0; + width: 24rem; + min-height: 20rem; + box-shadow: var(--ui-shadow-large); + z-index: calc(var(--ui-z-index-popup) - 2); + color: var(--ui-color-text); + padding: 0; + overflow-y: auto; + overscroll-behavior-y: contain; + transform: translateZ(1px); +} + +.drawer:focus { outline: none; } + +.drawer-header { + position: sticky; + /* stylelint-disable-next-line declaration-block-no-duplicate-properties */ + position: -webkit-sticky; + background-color: inherit; + top: 0; + width: 100%; + margin: 0 0 1rem; + padding: 0 1rem 0 1.4rem; + display: flex; + align-items: center; + justify-content: space-between; +} + +.drawer-header h2 { margin: 0; padding: 0.5rem 0; } + +.drawer-content { padding: 0 1.4rem; } + +.grid-title { + font-size: 1.4rem; + font-weight: 300; + margin: 0 0 1px; + padding: 0.5rem 1rem; + background: var(--ui-color-background-input); + border-bottom: 1px solid var(--ui-color-border); + box-shadow: 0 .5px 0 var(--ui-color-background-1); + z-index: 5; + position: relative; +} + +.grid { + -webkit-user-select: none; + user-select: none; + cursor: default; +} + +.grid table { table-layout: fixed; } +.grid-item { content-visibility: auto; } + +.grid .column-check { width: 3em; padding: 0 0.5em; } +.grid .column-check .checkbox { pointer-events: none; } +.grid .column-check .checkbox input { border-color: var(--ui-color-background-1); } + +.grid .column-date { width: 110px; } +.grid .column-number { width: 110px; } + + +.grid thead { top: -2px; } +.grid thead th { padding-top: 0.75em; padding-bottom: 0.75em; } + +.grid tbody { background-color: var(--ui-color-background); } +.grid tbody td { padding: 0.3rem 0.5rem; } + +.grid tfoot { bottom: -2px; } +.grid tfoot td { padding: 0.75rem 0.5rem; } +.grid tfoot .button { --button-size: 0.9em; font-size: 0.9em; margin: 0; } + + +.grid td:not(.column-check) { + white-space: nowrap; + overflow-x: hidden; + text-overflow: ellipsis; +} + +.grid .cell-aligner { + width: 100%; + height: 100%; + display: flex; + align-items: center; + gap: 0.5em; +} + + +/*** SORTABLE TABLE *******************************************************************************/ +.grid-sortable thead th { cursor: pointer; } +.grid-sortable thead th span:hover { text-decoration: underline; } +.grid-sortable thead th .cell-aligner { min-height: 20px; } +.grid-sortable thead th .cell-aligner span { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + flex: 1; +} +.grid-sortable thead th.sortasc svg, +.grid-sortable thead th.sortdesc svg { + width: 20px; + height: 20px; + color: var(--ui-color-text-2); +} + +.grid-sortable .th-sortable:focus-visible { + outline: 1px solid var(--ui-color-accent); + outline-offset: -1px; +} + +/*** SORTABLE TABLE *******************************************************************************/ + +.info-bar { + width: 100%; + display: flex; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + padding: 0.4rem 0.6rem 0.4rem 0.3rem; + margin: 0 0 0.75rem; + border-radius: var(--ui-border-radius); + border-width: 1px; + border-style: solid; +} + +.info-bar p { + margin: 0; + font-size: var(--ui-font-s); + line-height: 1.5rem; +} +.info-bar .icon { flex-shrink: 0; } + + + +.info-bar-error { + background-color: var(--ui-color-danger-semi); + border-color: var(--ui-color-danger); +} + +.info-bar-info { + background-color: var(--ui-color-info-semi); + border-color: var(--ui-color-info); +} + +.info-bar-success { + background-color: var(--ui-color-success-semi); + border-color: var(--ui-color-success); +} + +.info-bar-warning { + background-color: var(--ui-color-warning-semi); + border-color: var(--ui-color-warning); +} + +input, select, textarea, label { + -ms-touch-action: manipulation; + touch-action: manipulation; +} + + +.theme-dark input { color-scheme: dark; } +.theme-light input { color-scheme: light; } + + +textarea::placeholder, +input::placeholder { + color: var(--ui-color-text-1); + font-style: italic; +} + + +:where(input:not([type=radio],[type=checkbox])) { + font: inherit; + height: calc(var(--ui-button-height) - 2px); + border: 1px solid transparent; + line-height: 1; + color: var(--ui-color-text); + background-color: var(--ui-color-background-input); + border-radius: var(--ui-border-radius); + padding: 0 var(--ui-margin-m); + width: 25ch; +} + +:where(input:focus) { + outline: 0; + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); +} + +:where(input:invalid) { + border-color: var(--ui-color-danger); + box-shadow: var(--ui-shadow-danger); +} + + +input[type=color] { + -moz-appearance: none; + -webkit-appearance: none; + appearance: none; + background: none; + border: none; + padding: 0; + cursor: pointer; +} + + +:where(input:disabled) { opacity: 0.75; cursor: default; } + + + + +.check-and-radio input { + appearance: none; + width: 1.4rem; + height: 1.4rem; + display: inline-flex; + align-items: center; + justify-content: center; + border-radius: 0.3em; + background: var(--ui-color-background-input); + border: 1px solid var(--ui-color-text-2); + color: var(--ui-color-text-1); + font: inherit; /* required for proper sizing */ + flex-shrink: 0; + -ms-touch-action: manipulation; + touch-action: manipulation; +} + +.check-and-radio input::after { + content: " "; + display: block; + opacity: 0; + font-size: var(--ui-font-m); + line-height: 1; + align-self: center; + color: inherit; + margin: 0; + transition: opacity calc(var(--ui-animation-speed) / 2) ease-out; +} + +.check-and-radio input:checked::after { opacity: 1; } + + + +.input { width: 25ch; vertical-align: middle; } +.input .input-inner { + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: stretch; + border-radius: var(--ui-border-radius); + background: var(--ui-color-background-input); + border: 1px solid var(--ui-color-border); +} + + + /* label on the left */ +.radio.label-on-the-left, +.button-toggle.input.label-on-the-left, +.textarea.label-on-the-left, +.toggle.label-on-the-left, +.range.label-on-the-left, +.input.label-on-the-left { + display: inline-flex; + flex-flow: row; + align-items: center; + width: 100%; + gap: 1rem; +} +.label-on-the-left .range-inner, +.label-on-the-left .input-inner { flex: 1; } + + +.input-inner:focus-within, +.input-inner:has(:active):not(.disabled) { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); +} + + + +.input, +.textarea textarea:disabled, +.range input:disabled, +.input select:disabled, +.input input:disabled { opacity: 1; color: var(--ui-color-text); } + +.input .input-inner:has(:disabled), +.range .range-inner:has(:disabled), +.textarea .textarea-inner:has(:disabled) { opacity: 0.7; } + +.input input:not([type=radio]) { width: 100%; border: none; } +.input input:not([type=radio]):focus, +.input input:not([type=radio]):invalid { box-shadow: none; border: none; } + + + + +.input-row { + width: 100%; + display: flex; + flex-flow: row; + align-items: center; + justify-content: space-between; + position: relative; + border-radius: inherit; +} + +.input-row > .button, +.input-row > .icon { position: absolute; height: 100%; z-index: 1; } + +.input-row > .button { color: var(--ui-color-text-1); right: 2px; } + +.input-row>.icon { + color: var(--ui-color-text-2); + left: 0.3rem; + width: 1.5rem; + pointer-events: none; +} + +.menu { + position: absolute; + padding: 0.25rem; + margin: 0; + display: flex; + width: auto; + flex-flow: column; + align-items: stretch; + list-style: none; + overflow: hidden auto; + cursor: default; + z-index: var(--ui-z-index-popup); + max-height: calc(100vh - 4px); + -webkit-user-select: none; + user-select: none; + overscroll-behavior-y: contain; + + color: var(--ui-color-text); + border: var(--ui-popup-border); + border-radius: calc(var(--ui-border-radius) + 2px); + background: var(--ui-popup-background); + box-shadow: var(--ui-shadow-fancy); + transform: translateZ(1px); +} + +.menu:focus { outline: none; } + + +.menu-item { + font: inherit; + font-size: var(--ui-font-s); + align-items: center; + border-radius: var(--ui-border-radius); + color: inherit; + background: none; + border: none; + display: flex; + flex-shrink: 0; + letter-spacing: 0.1px; + justify-content: space-between; + margin: 0; + overflow: hidden; + padding: 0.5rem 0.9rem; + position: relative; + text-align: left; + white-space: nowrap; + width: 100%; +} + +.menu-item-shortcut { + margin: -0.1rem 0 -0.1rem auto; + letter-spacing: 0.1rem; + line-height: 1.35; + opacity: 0.5; +} +.menu-item-shortcut:empty { visibility: hidden; } + +.menu-item.disabled { pointer-events: none; opacity: 0.6; } + +.menu-item:focus { background-color: var(--ui-color-highlight); outline: 1px solid transparent; } + +.menu-item:focus.success { background-color: var(--ui-color-success); } +.menu-item:focus.warning { background-color: var(--ui-color-warning); } +.menu-item:focus.danger { background-color: var(--ui-color-danger); } + +.menu-item:focus .menu-item-shortcut { opacity: 1; } + +.menu-item svg { width: 1.1rem; height: 1.1rem; margin: 0 0.5rem 0 0; } + +.menu-item-content { + display: flex; + min-width: 0; + align-items: center; + justify-content: space-between; + margin-right: 1rem; +} + +.menu-item-text { + overflow: hidden; + text-overflow: ellipsis; + line-height: 1.35; +} + + +.menu-separator { + height: 0; + width: auto; + padding: 0; + margin: var(--ui-margin) 0.8rem; + border-bottom: var(--ui-popup-border); +} + + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .menu { + background-color: var(--ui-color-background-semi); + -webkit-backdrop-filter: blur(30px); + backdrop-filter: blur(30px); + } +} + +.message-box .dialog-content { + display: flex; + flex-flow: row; + gap: 1rem; + font-size: var(--ui-font-l); + padding: 1rem; +} + +.message-box .dialog-content .message { + display: flex; + align-items: center; + min-height: fit-content; +} +.message-box .dialog-content .message-content { margin: 0; line-height: 1.5; } + +.message-box .dialog-content svg, +.message-box .dialog-content .icon { height: 3rem; } + +.message-box .dialog-content svg:empty { width: 0; } +.message-box .dialog-content:has(svg:empty) { gap: 0; } +.message-box .dialog-content:has(svg:empty) .message { flex: 1; justify-content: center; } + + +.message-box .dialog-content .icon { + width: 3rem; + flex-shrink: 0; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + position: sticky; + top: 0; +} + + +/* stylelint-disable no-descending-specificity */ +.message-info .dialog-content { background-color: var(--ui-color-info-semi); } +.message-warning .dialog-content { background-color: var(--ui-color-warning-semi); } +.message-error .dialog-content { background-color: var(--ui-color-danger-semi); } +.message-success .dialog-content { background-color: var(--ui-color-success-semi); } + +.panel { + overflow: hidden; + will-change: height; + position: relative; + border: 2px solid var(--ui-color-border); + background: var(--ui-color-background-2); + margin-bottom: 1rem; +} + + +.panel details { margin: 1px; } + +.panel-header { + color: var(--ui-color-text); + text-align: left; + border: none; + display: flex; + align-items: center; + justify-content: space-between; + font-weight: 300; + font-size: var(--ui-font-m); + padding: 0 0.6rem 0 1rem; + height: 2.5rem; + line-height: 1; + -webkit-user-select: none; + user-select: none; +} + +.collapsible .panel-header { cursor: pointer; } + +.panel-header::-webkit-details-marker { display: none; } + +.panel-content { + background: var(--ui-color-background); + padding: 1rem; +} +.panel-content > * { opacity: 0; transition: opacity var(--ui-animation-speed) ease-out; } +.panel.expanded .panel-content > * { opacity: 1; } + + +.panel .chevron { + height: 1.2rem; + transform: rotate(0deg); + transition: transform var(--ui-animation-speed) ease-out; +} +.panel .chevron svg { width: 1.2rem; height: 1.2rem; } +.panel.expanded .chevron { transform: rotate(90deg); } + + + +.panel.round { border-radius: var(--ui-border-radius); } +.panel.round .panel-content { border-radius: calc(var(--ui-border-radius) - 2px); } + + +.panel.disabled { opacity: 0.5; } + + +.panel-header:focus { outline: none; } +.panel:has(.panel-header:focus-visible) { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + z-index: 2; +} + + +.panel.info { + border-color: var(--ui-color-info); + background: var(--ui-color-info-semi); +} +.panel.success { + border-color: var(--ui-color-success); + background: var(--ui-color-success-semi); +} +.panel.warning { + border-color: var(--ui-color-warning); + background: var(--ui-color-warning-semi); +} +.panel.danger { + border-color: var(--ui-color-danger); + background: var(--ui-color-danger-semi); +} + +.popover-plate { + --popover-tip-size: 14px; + --popover-color: var(--ui-popup-background); + --popover-border: var(--ui-popup-border); + --tip-offset: 50%; + + position: absolute; + transform: translateZ(1px); + z-index: var(--ui-z-index-popup); +} + +.popover-plate.opening { + opacity: 0; +} + +.popover { + position: relative; + border-radius: var(--ui-border-radius-m); + box-shadow: var(--ui-shadow-tooltip); +} + +.popover-plate.hide-tip .popover { + box-shadow: var(--ui-shadow-fancy); +} + +.popover-plate:not(.hide-tip) .popover::before, +.popover-plate:not(.hide-tip) .popover-content::before { + content: ''; + position: absolute; + display: block; + width: var(--popover-tip-size); + height: var(--popover-tip-size); + transform: rotate(45deg) skew(8deg, 8deg); + left: var(--tip-offset); + margin-left: calc(var(--popover-tip-size) / -2); +} + + +.popover-plate:not(.hide-tip) .popover::before { + box-shadow: var(--ui-shadow-tooltip); + background-color: var(--popover-color); + border: var(--popover-border); + border-width: 1.5px; + margin-left: calc(var(--popover-tip-size) / -2 - 0.5px); +} + +.popover-content { + padding: 1rem; + text-align: center; + position: relative; + border-radius: inherit; + z-index: 1; + background-color: var(--popover-color); + border: var(--popover-border); +} + +.popover-content > * { + position: relative; +} + +.popover-plate:not(.hide-tip) .popover-content::before { + background-color: inherit; + z-index: -1; +} + + +.popover-plate:focus, +.popover-plate .popover:focus, +.popover-content:focus { + outline: none; +} + + +.popover-top:not(.hide-tip) { + padding-bottom: var(--popover-tip-size); +} + +.popover-top:not(.hide-tip) .popover::before { + border-radius: 0 0 3px; + bottom: calc(var(--popover-tip-size) / -2); +} + +.popover-top:not(.hide-tip) .popover-content::before { + border-radius: 0 0 2px; + bottom: calc(var(--popover-tip-size) / -2); +} + +.popover-bottom:not(.hide-tip) { + padding-top: var(--popover-tip-size); +} + +.popover-bottom:not(.hide-tip) .popover::before { + border-radius: 3px 0 0; + top: calc(var(--popover-tip-size) / -2); +} + +.popover-bottom:not(.hide-tip) .popover-content::before { + border-radius: 2px 0 0; + top: calc(var(--popover-tip-size) / -2); +} + + +/* THEME LIGHT */ +.theme-light .popover-plate { + --popover-color: #fff; +} + + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .popover-plate.hide-tip .popover-content { + background-color: var(--ui-color-background-semi); + -webkit-backdrop-filter: blur(30px); + backdrop-filter: blur(30px); + } +} + +.push-button:active, +.push-button.touching, +.push-button[aria-pressed="true"] { + filter: brightness(0.85) contrast(1.1); + transform: translateY(1px); + box-shadow: 0 1px 0 rgb(0 0 0/0.8) inset; +} + +.push-button[aria-pressed="true"]:focus-visible { + box-shadow: 0 1px 0 rgb(0 0 0/0.8) inset, var(--ui-shadow-focus); +} + +.push-button[aria-pressed="true"].button-outline { background-color: var(--ui-color-secondary-semi); } +.push-button[aria-pressed="true"].button-outline.info { background-color: var(--ui-color-info-semi); } +.push-button[aria-pressed="true"].button-outline.success { background-color: var(--ui-color-success-semi); } +.push-button[aria-pressed="true"].button-outline.warning { background-color: var(--ui-color-warning-semi); } +.push-button[aria-pressed="true"].button-outline.danger { background-color: var(--ui-color-danger-semi); } + + +.push-button.button-outline:active, +.push-button.button-outline.touching, +.push-button.button-outline[aria-pressed="true"] { box-shadow: none; } + +.splitter { + position: absolute; + height: 100%; + width: 16px; + z-index: 90; + cursor: ew-resize; +} + +.splitter::after { + content: " "; + display: block; + width: 6px; + height: 100%; + margin: 0 auto; +} + +.splitter.vertical { width: 100%; height: 16px; cursor: ns-resize; } + +.splitter.vertical::after { width: 100%; height: 6px; margin: auto 0; } + +.splitter.is-dragging::after, +.splitter:hover::after { background-color: var(--ui-color-background-1); } + +.table { + width: 100%; + max-height: 100%; + overflow: auto; + overscroll-behavior-y: contain; + position: relative; + border: 2px solid var(--ui-color-border); +} + + +.table table { border-spacing: 0; width: 100%; table-layout: fixed; } + +.table.round { border-radius: var(--ui-border-radius); } +.table.selectable { cursor: default; -webkit-user-select: none; user-select: none; } + +.table thead, +.table tfoot { position: sticky; z-index: 2; } +.table thead { top: 0; } +.table tfoot { bottom: 0; } + +.table thead th, +.table tfoot td { + padding: var(--ui-margin-m); + font-weight: 400; + text-align: left; + vertical-align: middle; + background: var(--ui-color-background-input); +} + +.table tr:focus-within, +.table tr:focus, +.table tbody:focus, +.table tbody:focus tr { + outline: 1px solid transparent; + background-color: var(--ui-color-highlight-1); +} + +.table tbody td { + padding: var(--ui-margin) var(--ui-margin-m) calc(var(--ui-margin) + 1px); + border-bottom: 1px solid var(--ui-color-border); + vertical-align: middle; + line-height: 1.5rem; +} + +.table th:first-child, +.table td:first-child { padding-left: var(--ui-margin-l); } + +.table th:last-child, +.table td:last-child { padding-right: var(--ui-margin-l); } + +.table tbody:last-of-type tr:last-child td { border-bottom: none; } + +.ui-tag { + border: 1px solid var(--ui-color-border); + background: var(--ui-color-secondary); + border-radius: var(--ui-border-radius); + padding: 0.4rem 0.7rem; + display: inline-flex; + align-items: center; + gap: 0.2rem; + height: 2rem; + cursor: default; + color: var(--ui-color-text); + -webkit-user-select: none; + user-select: none; +} + +.ui-tag.clickable { + touch-action: manipulation; + cursor: pointer; +} +.ui-tag.clickable:not(.disabled):active { + transform: translateY(1px); + filter: brightness(0.85); +} + + +.ui-tag .icon { + width: 1rem; + height: 1rem; + margin-left: -4px; + /* a fix safari rendering issue */ + /* when tag was pressed, the icon would slide to the left */ + transform: translateZ(1px); +} + +.ui-tag:focus-visible { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + outline: 1px solid transparent; +} +.ui-tag .ui-tag-label { padding-bottom: 2px; } + +.ui-tag.dark { color: #fff; } +.ui-tag.light { color: #000; } + +.ui-tag.disabled { opacity: 0.5; } +.ui-tag.round { border-radius: var(--ui-border-radius-xl); } + +.ui-tag.info { background-color: var(--ui-color-info); } +.ui-tag.success { background-color: var(--ui-color-success); } +.ui-tag.danger { background-color: var(--ui-color-danger); } +.ui-tag.warning { background-color: var(--ui-color-warning); } + +.ui-tag.info, +.ui-tag.success, +.ui-tag.danger, +.ui-tag.warning { color: var(--ui-color-text); } + +.tooltip-plate { + --popover-tip-size: 10px; + --popover-color: #292929; +} + +.tooltip { border-radius: 5px; max-width: 75vw; } +.tooltip-content { padding: 0.5rem 0.7rem; } + +/* COLOR VARIATIONS */ +.info .tooltip { --popover-color: var(--ui-color-info); } +.success .tooltip { --popover-color: var(--ui-color-success); } +.danger .tooltip { --popover-color: var(--ui-color-danger); } +.warning .tooltip { --popover-color: var(--ui-color-warning); } + +.tree, +.tree ul { padding: 0; margin: 0; list-style: none; } +.tree>li, +.tree ul li { + display: block; + width: 100%; + padding: 0; + margin: 0; +} + +.tree { + display: flex; + flex-flow: column; + align-items: stretch; + overflow: hidden; + position: relative; + margin: 0; + padding: .3rem; + border-radius: var(--ui-border-radius); +} +.tree:focus { outline: none; } +.tree:focus-visible { + box-shadow: + 0 0 0 1px var(--ui-color-accent), + var(--ui-shadow-focus); +} + + +.tree-node { + cursor: pointer; + display: flex; + align-items: center; + border-radius: var(--ui-border-radius); + padding: 0 0.5rem; + height: var(--ui-button-height); + -ms-touch-action: manipulation; + touch-action: manipulation; +} + +.tree-node.selected { background-color: var(--ui-color-highlight-1); } +.tree-node:hover { background-color: var(--ui-color-highlight); } + +.tree-icon { + display: inline-block; + width: 1.5rem; + height: 1.5rem; + margin-right: 0.5rem; + background-color: var(--ui-color-text-2); + -webkit-mask-size: 1.5rem; + -webkit-mask-repeat: no-repeat; + -webkit-mask-position: 0 center; + mask-size: 1.5rem; + mask-repeat: no-repeat; + mask-position: 0 center; +} + + +.tree-label { line-height: 2; } + +.tree-indent { + display: block; + width: 0.8rem; + margin-right: 1rem; + height: 100%; + border-right: 1px solid transparent; +} +.tree .tree-indent { border-right-color: var(--ui-color-border-1); } + + + +.tree-file-icon { + -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E"); + mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E"); +} +.tree-folder-icon { + -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); + mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); +} +.expanded .tree-folder-icon { + -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); + mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); +} + +.button-toggle.input { + width: min-content; + max-width: 100%; + padding: 0; + flex-flow: column; + align-items: flex-start; + justify-content: flex-start; + border-radius: calc(var(--ui-border-radius) + 1px); +} + +.button-toggle .input-inner { + width: 100%; + overflow: hidden; + border-radius: calc(var(--ui-border-radius) + 1px); +} + +.button-toggle .input-scroller { + width: 100%; + border-radius: var(--ui-border-radius); + background-color: var(--ui-color-background-input); + overflow: auto hidden; + overscroll-behavior-x: contain; + scrollbar-width: none; +} + +.button-toggle .input-scroller::-webkit-scrollbar { width: 0; height: 0; } + +.button-toggle .input-row { min-width: 100%; width: min-content; } + +.button-toggle .input-row .button { + position: static; + color: var(--ui-color-text); + box-shadow: none; + min-height: calc(var(--ui-button-height) - 2px); + background: var(--ui-color-background-input); + border: none; + border-radius: 0; + flex: 1; + border-left: 1px solid var(--ui-color-border); + min-width: min-content; +} + +.button-toggle .button:has(:checked) { background-color: var(--ui-color-highlight); } + +.button-toggle .input-row .button:first-child { + border-left: none; + border-top-left-radius: var(--ui-border-radius); + border-bottom-left-radius: var(--ui-border-radius); +} + +.button-toggle .input-row .button:last-child { + border-top-right-radius: var(--ui-border-radius); + border-bottom-right-radius: var(--ui-border-radius); +} + +.button-toggle .button input { + position: absolute; + top: -100px; + opacity: 0; + pointer-events: none; +} + + + +/* round buttons */ +.button-toggle.round { border-radius: var(--ui-border-radius-xl); } + +.button-toggle.round:not(.has-error) .input-inner { border-radius: var(--ui-border-radius-xl); } + +.button-toggle.round .input-row .button:first-child { + border-top-left-radius: var(--ui-border-radius-xl); + border-bottom-left-radius: var(--ui-border-radius-xl); +} + +.button-toggle.round .input-row .button:last-child { + border-top-right-radius: var(--ui-border-radius-xl); + border-bottom-right-radius: var(--ui-border-radius-xl); +} + +/* more styling defined in ../check-and-radio.css */ + +.checkbox { + display: inline-flex; + flex-flow: column; + align-items: stretch; + justify-content: flex-start; + gap: 0.5rem; +} + +.checkbox-row { + display: inline-flex; + align-items: center; + justify-content: flex-start; + gap: 0.5rem; +} + + +.checkbox input:focus { border-color: var(--ui-color-accent); } +.checkbox input::after { + content: "✕"; + font-family: Arial, Helvetica, sans-serif; + line-height: 1.1; +} + +.checkbox.indeterminate input::after { + content: " "; + opacity: 1; + background: var(--ui-color-text-1); + width: 65%; + height: 65%; + border-radius: 0.2rem; +} + +.checkbox input:checked::after { opacity: 1; } + +.checkbox.disabled { opacity: 0.5; } +.checkbox.disabled input { opacity: 1; } + + +.checkbox.has-error input { border-color: var(--ui-color-danger); } +.checkbox.has-error input:focus { box-shadow: var(--ui-shadow-danger); } + +.checkbox.label-on-the-left .checkbox-row { flex-flow: row-reverse; } + +.combobox .input-inner { position: relative; } + +.combobox input { padding-right: 36px; } +.multiselect input { text-overflow: ellipsis; } + +.combobox-button:focus { box-shadow: none; } + +.combobox-list { + position: absolute; + z-index: var(--ui-z-index-popup); + overflow-y: auto; + overscroll-behavior-y: contain; + padding: 0.2rem; + min-height: 0; + max-height: 26rem; + -webkit-user-select: none; + user-select: none; + transform: translateZ(1px); + + color: var(--ui-color-text); + border: var(--ui-popup-border); + border-radius: calc(var(--ui-border-radius) + 0.2rem); + background: var(--ui-popup-background); + box-shadow: var(--ui-shadow-fancy); +} + +.combobox-list.empty { padding: 0; box-shadow: none; border: none; } +.combobox-list:not(.empty) { min-height: 2rem; } +.combobox-list.hidden { display: none; } + +.combobox-list-header, +.combobox-list-item { + height: var(--ui-button-height); + line-height: 1; + display: flex; + align-items: center; + white-space: nowrap; + text-overflow: ellipsis; + overflow-x: hidden; + padding: 0 1rem; +} + +.combobox-list-header { + margin: 0.5rem 0 0; + color: var(--ui-color-text-2); + font-weight: 500; + cursor: default; +} + +.combobox-list-header:last-child { display: none; } + +.combobox-list-empty { + padding: 0.6rem 1.2rem; + color: var(--ui-color-text-semi); + cursor: default; + white-space: nowrap; +} + +.combobox-list-item { + color: var(--ui-color-text); + cursor: pointer; + border-radius: var(--ui-border-radius); + -ms-touch-action: manipulation; + touch-action: manipulation; +} + +.combobox-list-item svg { margin-right: 0.5rem; } +.combobox-list-item .tick { display: none; } +.combobox-list-item.checked .tick { display: block; } + +.combobox-list:not(.multiselect) .combobox-list-item.in-group { padding-left: 2rem; } + + +.mobile .combobox-list-item { transition: background-color 0.3s ease-out; } +.mobile .combobox-list-item.blinking { + transition: background-color 0.1s; + background-color: var(--ui-color-highlight-1); +} + +.desktop .combobox-list-item.checked { background-color: var(--ui-color-highlight-semi); } +.desktop .combobox-list-item.selected { background-color: var(--ui-color-highlight-1); } +.desktop .combobox-list-item:hover { background-color: var(--ui-color-highlight); } + +.combobox-list-item b { color: var(--ui-color-accent); } + + + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .combobox-list { + background-color: var(--ui-color-background-semi); + -webkit-backdrop-filter: blur(30px); + backdrop-filter: blur(30px); + } +} + +.input-date .input-text-inner { position: relative; overflow: unset; } + +.input-date input { flex: 1; width: 100%; padding-right: 36px; } + + +.input-date.native .input-date-button { pointer-events: none; } + +.datepicker { display: none; transform: translateZ(1px); } +.datepicker.active { display: block; } + +.datepicker-dropdown { + position: absolute; + top: 0; + left: 0; + z-index: var(--ui-z-index-popup); + padding-top: 0.2rem; +} + +.datepicker-dropdown.datepicker-orient-top { padding-top: 0; padding-bottom: 4px; } + +.datepicker-picker { + display: inline-block; + overflow: hidden; + border-radius: 0.4em; + background-color: var(--ui-color-background); + border: var(--ui-popup-border); + box-shadow: var(--ui-shadow-fancy); +} + + +.datepicker-picker span { + display: block; + flex: 1; + border: 0; + border-radius: 6px; + cursor: default; + text-align: center; + -webkit-touch-callout: none; + -webkit-user-select: none; + user-select: none; +} + +.datepicker-main { padding: var(--ui-margin-s); } + + +.datepicker-grid, +.datepicker-view .days-of-week, +.datepicker-view, +.datepicker-controls { display: flex; } + +.datepicker-grid { flex-wrap: wrap; width: 15.75rem; } + +.datepicker-cell { -ms-touch-action: manipulation; touch-action: manipulation; } + +.datepicker-cell, +.datepicker-view .week { height: 2.25rem; line-height: 2.25rem; } + +.datepicker-view .days .datepicker-cell, +.datepicker-view .dow { flex-basis: 14.2857142857%; } + +.datepicker-view.datepicker-grid .datepicker-cell { + flex-basis: 25%; + height: 4.5rem; + line-height: 4.5rem; +} + + +.datepicker-title { padding: 0.375rem 0.75rem; text-align: center; } + +.datepicker-header .datepicker-controls, +.datepicker-footer .datepicker-controls { padding: 0.2rem; } + +.datepicker-controls .button { + padding: 0; + width: 2.5rem; + min-width: 2.5rem; + text-align: center; +} + +.datepicker-controls .button svg { margin: 0; height: 1.4rem; } +.datepicker-controls .button.disabled { visibility: hidden; } + +.datepicker-controls .button.view-switch { flex: auto; width: auto; } + + +.datepicker-footer .datepicker-controls .button { width: 100%; } + +.datepicker-view .dow { height: 1.5rem; line-height: 1.5rem; font-size: var(--ui-font-xs); } +.datepicker-view .week { width: 2.25rem; font-size: 0.75rem; } + +.datepicker-cell.prev:not(.disabled), +.datepicker-cell.next:not(.disabled) { color: var(--ui-color-text-2); } + + +.datepicker-cell.selected.prev:not(.disabled), +.datepicker-cell.selected.next:not(.disabled) { color: var(--ui-color-text-1); } + + +.datepicker-cell.selected { + background-color: var(--ui-color-highlight); + color: var(--ui-color-text); +} + +.datepicker-cell.disabled { color: var(--ui-color-text-2); } + + + +/* today */ +.datepicker-cell.today:not(.selected) { + background-color: var(--ui-color-secondary-semi); + color: var(--ui-color-text); +} + + +/* hover/focus */ +.datepicker-cell.focused, +.datepicker-cell.today.focused, +.datepicker-cell.highlighted:not(.range,.disabled):hover, +.datepicker-cell.highlighted:not(.range).focused, +.datepicker-cell:not(.disabled):hover { + background-color: var(--ui-color-highlight); + color: var(--ui-color-text); + cursor: pointer; +} + + +.datepicker-cell.range-start { border-radius: 4px 0 0 4px; } +.datepicker-cell.range-end { border-radius: 0 4px 4px 0; } +.datepicker-cell.range { border-radius: 0; background-color: #dbdbdb; } +.datepicker-cell.range-end:not(.selected), +.datepicker-cell.range-start:not(.selected) { background-color: #b5b5b5; color: #fff; } +.datepicker-cell.range-end.focused:not(.selected), +.datepicker-cell.range-start.focused:not(.selected) { background-color: #afafaf; } +.datepicker-cell.range:not(.disabled,.focused,.today):hover { background-color: #d5d5d5; } +.datepicker-cell.range.disabled { color: #c2c2c2; } +.datepicker-cell.range.focused { background-color: #cfcfcf; } + + + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .datepicker-picker { + background-color: var(--ui-color-background-semi); + -webkit-backdrop-filter: blur(30px); + backdrop-filter: blur(30px); + } +} + +.input .error-wrap, +.radio .error-wrap, +.checkbox .error-wrap { + display: flex; + flex-flow: row; + align-items: stretch; + justify-content: flex-start; +} + +.checkbox .error-wrap, +.radio .error-wrap { overflow: hidden; } + + +.input .info-bar-error, +.radio .info-bar-error, +.textarea .info-bar-error { + padding-bottom: calc(0.4rem + 10px); + margin-bottom: -10px; + border: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +.checkbox .info-bar { margin: 0; } + +.textarea .info-bar-error { grid-area: 1 / 1 / 2 / 2; } + + + +/* Highlight whole inner div in red, to avoid rendering leaks in corners (safari) */ +.has-error.input .input-inner, +.has-error.textarea .textarea-inner { background-color: var(--ui-color-danger-semi); } + +.has-error.input .input-inner { border-color: var(--ui-color-danger); } + +.has-error.input .input-inner:focus-within, +.has-error.input .input-inner:has(:active):not(.disabled) { box-shadow: var(--ui-shadow-danger); } + +.has-error.input .info-bar-error, +.has-error.textarea .info-bar-error { background-color: transparent; } + +.input-math { + position: relative; + display: inline-flex; + flex-flow: column; + align-items: stretch; + justify-content: space-between; +} + +.input-math input { padding-left: 30px; text-align: right; } + +.input-password { + position: relative; + display: inline-flex; + flex-flow: column; + align-items: stretch; + justify-content: space-between; +} + +.input-password input { + font-family: verdana, sans-serif; + width: 100%; + padding-right: 36px; +} + + +.input-password.visible input { font-family: inherit; } +.input-password.visible .input-password-button { color: var(--ui-color-danger); } +.input-password.visible .input-password-button svg { stroke-width: 2; } + + + +/* PASSWORD STRENGTH */ +.password-strength { + width: calc(100% - 6px); + height: 3px; + margin: -7px 3px 0; + border-radius: 10px; + background-color: var(--ui-color-background-input); + cursor: default; +} + +.password-strength-progress { + height: 100%; + border-radius: inherit; + transition: width var(--ui-animation-speed) ease-out; + background-color: var(--ui-color-danger); +} + +.password-strength-progress.warning { background-color: var(--ui-color-warning); } +.password-strength-progress.info { background-color: var(--ui-color-info); } +.password-strength-progress.success { background-color: var(--ui-color-success); } + + +.password-strength-info { + position: absolute; + top: 0; + display: none; + cursor: default; + width: calc(100% - 2px); + flex-flow: column; + align-items: stretch; + gap: 1rem; + font-size: 0.8rem; + margin: 0.2rem 1px 0; + padding: 0.8rem; + border-radius: var(--ui-border-radius); + background-color: var(--ui-color-background-input); + border: 1px solid var(--ui-color-danger); + z-index: var(--ui-z-index-elevated); +} + +.input-password:focus-within .password-strength-info { display: flex; } + +.password-strength-info.warning { border-color: var(--ui-color-warning); } +.password-strength-info.info { border-color: var(--ui-color-info); } +.password-strength-info.success { border-color: var(--ui-color-success); } + +.password-strength-info h2 { font-size: var(--ui-font-s); text-align: left; margin-bottom: 0; } +.password-strength-info small { font-size: var(--ui-font-xs); margin: 0; line-height: 1.4; } +.password-strength-info small:empty { display: none; } + +.input-rating { min-width: fit-content; } + +.input-rating .input-inner, +.input-rating .input-inner:focus { outline: none; } + +.input-rating .input-row { + align-items: stretch; + justify-content: flex-start; + height: var(--ui-button-height); + background-color: var(--ui-color-background-input); +} + +.input-rating .button { + position: static; + right: unset; + cursor: default; + user-select: none; + -ms-touch-action: manipulation; + touch-action: manipulation; + font-size: 1.2rem; + margin: 0; +} + +.input-rating .button:focus-visible { box-shadow: none; } + +.input-rating .btn-reset { margin-left: auto; } +.input-rating .btn-reset:focus-visible { color: var(--ui-color-accent); } + +.input-rating .button.active svg { color: var(--ui-color-accent); fill: var(--ui-color-accent); } + +.input-rating .button.button-link, +.input-rating .button.button-link:focus-visible, +.input-rating .button.button-link:hover { text-decoration: none; } + +.input-rating.light:not(.has-error) .input-inner, +.input-rating.light:not(.has-error) .input-row { background-color: transparent; border: none; } + +.input-search input { + padding-left: calc(2rem + 6px); + padding-right: 2rem; + appearance: none; + -webkit-appearance: none; +} +::-webkit-search-cancel-button { display: none; } + +.input-search .input-row>.icon { top: 1px; } + +.input-search-button { display: none; } +.input-search-button.visible { display: inline-flex; } + +.input-tag .input-inner { touch-action: manipulation; } +.input-tag .input-inner:focus { outline: none; } +.input-tag .input-inner[aria-expanded="true"] { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); +} + + +.input-tag .input-row { + min-height: calc(var(--ui-button-height) - 2px); + padding: 4px 0.3rem 3px; + align-items: flex-start; + justify-content: flex-start; + gap: 0.2rem; + flex-wrap: wrap; +} + +.input-tag .input-row > .icon { position: static; flex-shrink: 0; margin-top: 0.14rem; } + +.input-tag .ui-tag { height: 1.7rem; } + +.input-tag-popover { width: 25ch; } +.input-tag-popover .popover-content { padding: 0.5rem; } + +.input-tag-list-tags { + display: flex; + flex-flow: row wrap; + gap: 0.2rem; + flex: 1; + max-height: 10rem; + overflow-y: auto; +} + +.input-tag-list-add-row { display: flex; align-items: center; gap: 0.5rem; } +.input-tag-list-add-row .input { width: 100px; flex: 1; } +.input-tag-list-add-row .input input { background: var(--ui-color-background-semi); } + + +.input-tag-list-tags:not(:empty) { + margin-bottom: 0.5rem; + padding-bottom: 0.5rem; + border-bottom: var(--ui-popup-border); +} + +.input-text .input-inner { + overflow: hidden; +} + +.input-time .input-row { + border-radius: inherit; + background: var(--ui-color-background-input); +} + +.input-time input { margin-left: calc(2rem - 2px); } + +.label { + height: var(--ui-button-height); + line-height: 1.6; + padding: 0; + display: inline-flex; + align-items: center; + -ms-touch-action: manipulation; + touch-action: manipulation; +} + +.label.disabled { + pointer-events: none; + -webkit-user-select: none; + user-select: none; +} + +/* to offset input's border (visually) */ +.input .label { padding-inline: 1px; } + + +.label-on-the-left .label { + padding-inline: 0; + padding-top: 1px; + width: max-content; + white-space: nowrap; +} + + +.radio.label-on-the-left, +.input-tag.label-on-the-left, +.textarea.label-on-the-left { align-items: flex-start; } + +.radio.label-on-the-left>.label, +.input-tag.label-on-the-left .label, +.textarea.label-on-the-left .label { height: calc(var(--ui-button-height) + 2px); } + +.radio.label-on-the-left>.label { margin-block: var(--ui-margin-s); } + +/* more styling defined in ../check-and-radio.css */ + +.radio { + min-width: 26ch; + width: min-content; + max-width: 100%; + + --ui-radio-padding: var(--ui-margin-s); +} + + +.radio input { + border-radius: 10rem; + width: 1.3rem; + height: 1.3rem; +} +.radio input:focus { box-shadow: none } +.radio input::after { + background: var(--ui-color-text-1); + width: 65%; + height: 65%; + border-radius: inherit; +} + + +.radio-inner { + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: flex-start; + width: 100%; + padding: 0; + border: 1px solid var(--ui-color-border); + border-radius: calc(var(--ui-border-radius) + var(--ui-radio-padding)); + background-color: var(--ui-color-background-input); + overflow: hidden; +} + + +.radio-items { + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: flex-start; + gap: var(--ui-radio-padding); + width: 100%; + padding: var(--ui-radio-padding) 0; + background-color: var(--ui-color-background-input); + border-radius: inherit; +} + + +.radio-item { + display: flex; + flex-flow: row; + align-items: center; + justify-content: flex-start; + gap: 0.5rem; + width: calc(100% - calc(var(--ui-radio-padding) * 2)); + margin: 0 var(--ui-radio-padding); + padding: 0 var(--ui-margin); + border-radius: var(--ui-border-radius); +} + +.radio-item.disabled { opacity: 0.5; } +.radio-item.disabled input { opacity: 1; } + +.radio-item:not(.disabled):focus-within, +.radio-item:not(.disabled):hover { background-color: var(--ui-color-highlight-1); } + + + +.radio-inner:focus-within, +.radio-inner:has(:active):not(.disabled) { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); +} + +.radio.has-error .radio-inner { + border-color: var(--ui-color-danger); + background-color: var(--ui-color-danger-semi); +} +.radio.has-error .info-bar-error { background-color: transparent; } + + +.has-error .radio-inner:focus-within, +.has-error .radio-inner:has(:active):not(.disabled) { + box-shadow: var(--ui-shadow-danger); + border-color: var(--ui-color-danger); +} + +.range { + position: relative; + width: 25ch; + vertical-align: top; + --range-size: calc(var(--ui-button-height) / 3 * 2); +} + +.range .range-inner { + display: flex; + flex-flow: column; + gap: 0.5rem; + flex: 1; + padding: 0 0 0.5rem; + position: relative; + height: 100%; +} + + +.range input { + -webkit-appearance: none; + appearance: none; + margin: 0; + width: 100%; + height: 0.5rem; + border-radius: 5rem; + padding-inline: 0; + border: 1px solid var(--ui-color-border); + background: var(--ui-color-background-input); + background-image: linear-gradient(var(--ui-color-highlight), var(--ui-color-highlight)); + background-size: 70% 100%; + background-repeat: no-repeat; + background-clip: padding-box; +} + + + + +.range input::-webkit-slider-runnable-track { + -webkit-appearance: none; + display: block; + height: 0.5rem; + border-radius: 0.5rem; +} + +.range input::-webkit-slider-thumb { + -webkit-appearance: none; + appearance: none; + background-color: var(--ui-color-text); + height: var(--range-size); + width: var(--range-size); + border-radius: 5rem; + box-shadow: 0 1px 3px #000c; + transform: translateY(calc(-50% + 0.25rem - 1px)); + transform-origin: center 25%; +} + + +.range input::-moz-range-track { + display: flex; + align-items: center; + background-color: var(--ui-color-background-input); + height: 0.5rem; + border-radius: 0.5rem; +} + +.range input::-moz-range-thumb { + background-color: var(--ui-color-text); + height: var(--range-size); + width: var(--range-size); + border-radius: 5rem; + box-shadow: 0 1px 3px #000c; +} + + +/* Cannot be merged, as it won't work in safari */ +.range:not(.disabled) input::-webkit-slider-thumb:active { scale: 0.9; } +.range:not(.disabled) input::-moz-slider-thumb:active { scale: 0.9; } + + + +.range-ticks { + display: flex; + justify-content: space-between; + margin: 0 -0.1rem 0.4rem; + cursor: default; +} +.range-ticks span { width: 3ch; text-align: center; } +.range:not(.disabled) .range-ticks span { cursor: pointer; } + + +.range.label-on-the-left { align-items: flex-end; } +.range.label-on-the-left .label { height: 1.8rem; } + +.select { font: inherit; position: relative; } + +.select select { + -moz-appearance: none; + -webkit-appearance: none; + appearance: none; + + font-size: 1rem; + font-family: inherit; + background: none; + padding: 0 30px 0 var(--ui-margin-m); + width: 100%; + + border: 1px solid transparent; + height: calc(var(--ui-button-height) - 2px); + line-height: 1.2; + color: var(--ui-color-text); + background-color: var(--ui-color-background-input); + border-radius: var(--ui-border-radius); +} + +.select select:focus { outline: 0; } + +.select optgroup { font-weight: 500; } + +.select .input-row::after { + content: ""; + position: absolute; + width: 2rem; + right: 0; + top: 0; + bottom: 0; + opacity: 0.6; + pointer-events: none; + background-repeat: no-repeat; + background-position: right 0.7rem center; + background-size: 0.6rem 0.8rem; + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23bbb' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"); +} + +.theme-light .select .input-row::after { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23222' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"); +} + +.textarea { position: relative; width: 25ch; vertical-align: top; } + +.textarea.autogrow .textarea-inner::after, +.textarea textarea { + font: inherit; + line-height: 1.3; + border: 1px solid transparent; + margin: 0; + width: 100%; + padding: var(--ui-margin-m); + grid-area: 2 / 1 / 2 / 2; +} + + +.textarea .textarea-inner { + width: 100%; + display: inline-grid; + align-items: stretch; + background-color: var(--ui-color-background-input); + border-radius: var(--ui-border-radius); + border: 1px solid var(--ui-color-border); +} + +.textarea textarea { + resize: vertical; + color: var(--ui-color-text); + border-radius: var(--ui-border-radius); + border: none; + min-height: 2.6rem; + background-color: var(--ui-color-background-input); +} + + +.textarea .textarea-inner:focus-within { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + outline: 0; +} + +.textarea textarea:focus { outline: none; box-shadow: none; border: none; } +.textarea textarea:invalid { border: none; box-shadow: none; } +.textarea textarea:disabled { opacity: 0.5; } + + +.textarea.autogrow .textarea-inner::after { + content: attr(data-value) " "; + visibility: hidden; + white-space: pre-wrap; + min-width: 1rem; + resize: none; + background: none; + appearance: none; +} + +.textarea.autogrow textarea { resize: none; } + + +.textarea.has-error .textarea-inner { border-color: var(--ui-color-danger); } +.textarea.has-error .textarea-inner:focus-within { box-shadow: var(--ui-shadow-danger); } + +.toggle { + --toggle-width: 60px; + --toggle-padding: 2px; + --border-radius: var(--ui-border-radius-xl); + --toggle-height: calc(var(--toggle-width) / 2.5); + --knob-size: var(--toggle-height); + + display: inline-flex; + flex-flow: column; + align-items: flex-start; + position: relative; + vertical-align: middle; + -webkit-user-select: none; + user-select: none; + + border-radius: var(--border-radius); +} + +.toggle-inner { + border: 1px solid var(--ui-color-text-2); + padding: var(--toggle-padding); + border-radius: inherit; + background-color: var(--ui-color-background-2); + position: relative; + margin-block: 3px; +} + +.toggle:has(:disabled) { pointer-events: none; opacity: 0.6; } + +.toggle:focus { outline: none; } +.toggle:focus-visible .toggle-inner { + box-shadow: var(--ui-shadow-focus); + border-color: var(--ui-color-accent); +} + +.toggle-input { display: none; } + +.toggle-label { + width: var(--toggle-width); + height: var(--toggle-height); + border-radius: calc(var(--border-radius) - var(--toggle-padding)); + display: flex; + align-items: center; + justify-content: flex-start; + flex-shrink: 0; + overflow: hidden; + cursor: pointer; +} + +.toggle-scroller { + height: 100%; + border-radius: inherit; + display: inline-flex; + align-items: center; + justify-content: center; + transition: margin-left .2s cubic-bezier(.85, .05, .18, 1.4); + flex-shrink: 0; + width: calc(200% - var(--toggle-height)); + margin-left: calc(var(--toggle-height) - var(--toggle-width) - var(--toggle-padding)); +} + +.toggle-option { + width: 50%; + height: 100%; + border-radius: inherit; + background-color: green; + display: inline-flex; + align-items: center; + justify-content: center; + background-repeat: no-repeat; + background-position: center; + background-size: calc(var(--toggle-width) / 5); +} +.toggle-option:first-of-type { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + background-color: var(--ui-color-highlight); + background-position: 41% 47%; + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"); +} +.toggle-option:last-of-type { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + background-color: var(--ui-color-background-input); + background-position: 62% 55%; + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"); +} + +.theme-light .toggle-option:first-of-type { + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E"); +} + +.theme-light .toggle-option:last-of-type { + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E"); +} + +.toggle-handle { + width: 0; + height: 0; + position: absolute; + transition: left .2s cubic-bezier(.85, .05, .18, 1.4); + border-radius: inherit; + left: calc(var(--toggle-height) / 2 + var(--toggle-padding)); + +} + +.toggle-knob { + width: var(--knob-size); + height: var(--knob-size); + background: var(--ui-color-text-1); + border: 1px solid var(--ui-color-text-2); + transform: translate(-50%, -50%); + border-radius: inherit; +} + +/* this is calculated in js +.checked .toggle-scroller { margin-left: 0; } +.checked .toggle-handle { left: calc(var(--toggle-width) + var(--toggle-padding) - var(--toggle-height) / 2); } +*/ + +.notification-archive { + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: flex-start; + width: 100%; + z-index: 5; + transform: translateX(calc(var(--ui-notification-width) + var(--ui-notification-gap) + 1rem)); + transition: transform var(--ui-animation-speed) ease-out; +} + +.notification-archive .notification { z-index: 1; } +.notification-archive header { + display: flex; + align-items: center; + justify-content: space-between; + margin: var(--ui-notification-gap) var(--ui-notification-gap) 0; + color: var(--ui-color-text); + z-index: 1; + background-color: var(--ui-color-background-input); + padding: 0.75rem 0.5rem 0.75rem 1rem; + border-radius: var(--ui-border-radius); +} + +.notification-archive button { + color: inherit; + font-size: var(--ui-font-l); + font-weight: 300; + min-width: 1.8rem; + min-height: 1.8rem; +} + + +.notification-archive h2 { + color: inherit; + font-size: var(--ui-font-l); + margin: 0; + padding: 0; + border: none; +} +.notification-archive h2 .button { padding-inline: var(--ui-margin-m); margin-left: -0.5rem; } +.notification-archive h2 .button svg { transform: rotate(0deg); transition: transform var(--ui-animation-speed) ease-out; } + +.notification-archive.expanded h2 .button svg { transform: rotate(90deg); } + +.notification-archive.inert { pointer-events: none; } + +.notification-archive-buttons { + white-space: nowrap; + display: flex; + align-items: center; + justify-content: space-between; + gap: 0.2rem; +} + +.notification-archive-buttons .btn-close { + font-size: 1.4rem; + height: 1.8rem; + width: 1.7rem; + padding-bottom: 0.15rem; +} + + +.notification.archived { filter: saturate(0.3); } + +.notification-timestamp { + color: var(--ui-color-text-semi); + font-size: var(--ui-font-xs); + margin-inline: 0.5rem; +} +.show-archive .notification-archive { + transform: translateX(0); + margin-bottom: 1rem; + height: auto; + overflow: visible; +} + +.notification-center { + --ui-notification-border-radius: var(--ui-border-radius); + --ui-notification-gap: 0.75rem; + --ui-notification-width: 30rem; + + position: fixed; + transform: translateZ(1px); + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: flex-start; + width: calc(var(--ui-notification-width) + var(--ui-notification-gap) * 2); + top: 0; + right: 0; + z-index: -1; + max-height: 100vh; + overflow: hidden auto; + overscroll-behavior: contain; +} + +.notification-center.archive-is-visible, +.notification-center.has-active-notifications { z-index: var(--ui-z-index-popup); } + + +.notification { + font-size: var(--ui-font-m); + position: relative; + overflow: hidden; + flex-grow: 0; + flex-shrink: 0; + display: flex; + align-items: center; + justify-content: space-between; + min-height: 2rem; + border: none; + margin: var(--ui-notification-gap) var(--ui-notification-gap) 0; + box-shadow: var(--ui-shadow-fancy); + border-radius: var(--ui-notification-border-radius); + z-index: var(--ui-z-index-popup); +} + +.notification:last-child { margin-bottom: calc(var(--ui-notification-gap) + 10px); } + +.notification button { + background: none; + color: var(--ui-color-text); + height: 1.8rem; + min-width: 1.6rem; + font-size: inherit; + padding: 0 var(--ui-margin-m); + margin: 0 var(--ui-margin-m) 0 0; + display: flex; + align-items: center; + justify-content: center; + border-radius: var(--ui-border-radius); + border: 1px solid transparent; +} + +.notification button:focus-visible { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + outline: none; +} + +.notification button:hover { color: var(--ui-color-text-2); background: #2228; } +.notification button:active { color: var(--ui-color-text-1); background: #0008; } + +.notification .notification-close { + font-size: 1.4rem; + font-weight: 200; + position: relative; + padding-bottom: 0.15rem; +} + + +.notification-buttons, +.notification-icon { + min-height: 100%; + display: flex; + align-items: center; + justify-content: flex-end; +} +.notification-icon { width: var(--ui-button-height); } + + +.notification-msg { + color: var(--ui-color-text); + flex: 1; + display: flex; + align-items: center; + justify-content: flex-start; + padding: 0.8rem; + line-height: 1.4; + font-weight: 400; +} + +.notification-progressbar { + position: absolute; + inset: 0; + border-radius: inherit; + z-index: -1; +} + +.notification-progress { + height: 100%; + border-radius: inherit; + background-color: #ffffff15; + border: 1px solid #ffffff25; + margin: 0; + width: 0; + transition: width .2s; +} + + +.notification:focus { + border-color: var(--ui-color-accent); + box-shadow: var(--ui-shadow-focus); + outline: none; +} + + + +.notification-center-button svg { stroke: var(--ui-color-secondary); } +.notification-center-button.has-notifications svg { stroke: var(--ui-color-text); } +.notification-center-button.has-notifications svg>path:nth-child(2) { fill: var(--ui-color-text); } + + +@media (1px <= width <= 700px) { + .notification-center { + --ui-notification-width: calc(100vw - var(--ui-notification-gap) * 2); + } +} + + +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .notification { + -webkit-backdrop-filter: blur(15px); + backdrop-filter: blur(15px); + } + + .notification-info { background-color: var(--ui-color-info-semi); } + .notification-success { background-color: var(--ui-color-success-semi); } + .notification-warning { background-color: var(--ui-color-warning-semi); } + .notification-error { background-color: var(--ui-color-danger-semi); } +} +/*# sourceMappingURL=ui.css.map */ diff --git a/src/grid/Grid.css b/src/grid/Grid.css new file mode 100644 index 00000000..9b80366d --- /dev/null +++ b/src/grid/Grid.css @@ -0,0 +1,78 @@ +.grid-title { + font-size: 1.4rem; + font-weight: 300; + margin: 0 0 1px; + padding: 0.5rem 1rem; + background: var(--ui-color-background-input); + border-bottom: 1px solid var(--ui-color-border); + box-shadow: 0 .5px 0 var(--ui-color-background-1); + z-index: 5; + position: relative; +} + +.grid { + -webkit-user-select: none; + user-select: none; + cursor: default; +} + +.grid table { table-layout: fixed; } +.grid-item { content-visibility: auto; } + +.grid .column-check { width: 3em; padding: 0 0.5em; } +.grid .column-check .checkbox { pointer-events: none; } +.grid .column-check .checkbox input { border-color: var(--ui-color-background-1); } + +.grid .column-date { width: 110px; } +.grid .column-number { width: 110px; } + + +.grid thead { top: -2px; } +.grid thead th { padding-top: 0.75em; padding-bottom: 0.75em; } + +.grid tbody { background-color: var(--ui-color-background); } +.grid tbody td { padding: 0.3rem 0.5rem; } + +.grid tfoot { bottom: -2px; } +.grid tfoot td { padding: 0.75rem 0.5rem; } +.grid tfoot .button { --button-size: 0.9em; font-size: 0.9em; margin: 0; } + + +.grid td:not(.column-check) { + white-space: nowrap; + overflow-x: hidden; + text-overflow: ellipsis; +} + +.grid .cell-aligner { + width: 100%; + height: 100%; + display: flex; + align-items: center; + gap: 0.5em; +} + + +/*** SORTABLE TABLE *******************************************************************************/ +.grid-sortable thead th { cursor: pointer; } +.grid-sortable thead th span:hover { text-decoration: underline; } +.grid-sortable thead th .cell-aligner { min-height: 20px; } +.grid-sortable thead th .cell-aligner span { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + flex: 1; +} +.grid-sortable thead th.sortasc svg, +.grid-sortable thead th.sortdesc svg { + width: 20px; + height: 20px; + color: var(--ui-color-text-2); +} + +.grid-sortable .th-sortable:focus-visible { + outline: 1px solid var(--ui-color-accent); + outline-offset: -1px; +} + +/*** SORTABLE TABLE *******************************************************************************/ diff --git a/src/grid/Grid.svelte b/src/grid/Grid.svelte new file mode 100644 index 00000000..d15fb134 --- /dev/null +++ b/src/grid/Grid.svelte @@ -0,0 +1,222 @@ + +
+ {#if title} +

{title}

+ {/if} + + + + +
+
+ + diff --git a/src/grid/index.js b/src/grid/index.js new file mode 100644 index 00000000..1fc7e2aa --- /dev/null +++ b/src/grid/index.js @@ -0,0 +1 @@ +export { default as Grid } from './Grid.svelte'; diff --git a/src/grid/parts/GridBody.svelte b/src/grid/parts/GridBody.svelte new file mode 100644 index 00000000..7596ad39 --- /dev/null +++ b/src/grid/parts/GridBody.svelte @@ -0,0 +1,12 @@ +{#each $Data as item} + +{/each} + + diff --git a/src/grid/parts/GridFoot.svelte b/src/grid/parts/GridFoot.svelte new file mode 100644 index 00000000..0fef10da --- /dev/null +++ b/src/grid/parts/GridFoot.svelte @@ -0,0 +1,21 @@ + + + {#if multiselect} + + {/if} + {#each $Columns as column} + {column.total ? sumColumn(column) : ''} + {/each} + + + + diff --git a/src/grid/parts/GridHead.svelte b/src/grid/parts/GridHead.svelte new file mode 100644 index 00000000..9b189f48 --- /dev/null +++ b/src/grid/parts/GridHead.svelte @@ -0,0 +1,32 @@ + + + {#if multiselect} + + + + {/if} + {#if $Columns} + {#each $Columns as column} + + {/each} + {/if} + + + + diff --git a/src/grid/parts/GridHeadTH.svelte b/src/grid/parts/GridHeadTH.svelte new file mode 100644 index 00000000..0a9f63ed --- /dev/null +++ b/src/grid/parts/GridHeadTH.svelte @@ -0,0 +1,59 @@ + +
+ {column.label || column.field} + {#if sortasc} + {:else if sortdesc} + {/if} +
+ + + diff --git a/src/grid/parts/GridRow.svelte b/src/grid/parts/GridRow.svelte new file mode 100644 index 00000000..b11b887f --- /dev/null +++ b/src/grid/parts/GridRow.svelte @@ -0,0 +1,31 @@ + + + + {#if multiselect} + + + + {/if} + {#each $Columns as column} + + {item[column.field] || ''} + + {/each} + + + + diff --git a/src/grid/parts/index.js b/src/grid/parts/index.js new file mode 100644 index 00000000..ab87cc38 --- /dev/null +++ b/src/grid/parts/index.js @@ -0,0 +1,3 @@ +export { default as GridHead } from './GridHead.svelte'; +export { default as GridBody } from './GridBody.svelte'; +export { default as GridFoot } from './GridFoot.svelte'; diff --git a/src/grid/store/columns.js b/src/grid/store/columns.js new file mode 100644 index 00000000..ec0accbe --- /dev/null +++ b/src/grid/store/columns.js @@ -0,0 +1,16 @@ +import { writable, get } from 'svelte/store'; + + +export function ColumnsStore () { + const { subscribe, set } = writable([]); + + return { + subscribe, + set, + get () { + return get(this); + }, + reset: () => set([]) + }; +} + diff --git a/src/grid/store/data.js b/src/grid/store/data.js new file mode 100644 index 00000000..188e39e2 --- /dev/null +++ b/src/grid/store/data.js @@ -0,0 +1,91 @@ +import { writable, get } from 'svelte/store'; + + +export function DataStore () { + const _this = writable([]); + const { subscribe, set } = _this; + + const allSelected = writable(false); + const someSelected = writable(false); + const sortField = writable(''); + const sortOrder = writable('ASC'); + + + function toggleSelection (item, /* e */) { + let count = 0; + const unselectOthers = false; + const $Data = get(this); + $Data.forEach(_item => { + if (item.id === _item.id) { + _item.selected = !_item.selected; + } + else if (unselectOthers) _item.selected = false; + if (_item.selected) count += 1; + }); + allSelected.set($Data.length === count); + someSelected.set(count > 0 && !get(allSelected)); + set($Data); + // onSelectionChange(); + } + + function toggleSelectAll (forceState = null) { + if (typeof forceState === 'boolean') allSelected.set(forceState); + else { + if (get(someSelected)) allSelected.set(false); + else allSelected.set(!get(allSelected)); + } + someSelected.set(false); + const selected = get(allSelected); + const $Data = get(this); + $Data.forEach(_item => _item.selected = selected); + set($Data); + // onSelectionChange(); + } + + + sortField.subscribe(field => { + if (field) set(sortData(get(_this), field, get(sortOrder))); + }); + sortOrder.subscribe(order => { + if (order) set(sortData(get(_this), get(sortField), order)); + }); + + + return { + subscribe, + set, + get: () => _this, + allSelected, + someSelected, + sortField, + sortOrder, + toggleSelection, + toggleSelectAll, + reset: () => set([]) + }; +} + + + +function sortData (items, field, order) { + if (!items || !items.length) return []; + if (field === '') return items.sort(numberSort('id', order)); + + // const numFields = ['amount_in', 'amount_out']; + // if (numFields.includes(field)) return items.sort(numberSort(field, order)); + + return items.sort(stringSort(field, order)); +} + + + +export function numberSort (field, order = 'ASC') { + if (order === 'ASC') return (a, b) => Math.abs(a[field]) - Math.abs(b[field]); + return (a, b) => Math.abs(b[field]) - Math.abs(a[field]); +} + + +export function stringSort (field, order = 'ASC') { + if (order === 'ASC') return (a, b) => ('' + a[field]).localeCompare('' + b[field]); + return (a, b) => ('' + b[field]).localeCompare('' + a[field]); +} diff --git a/src/grid/store/index.js b/src/grid/store/index.js new file mode 100644 index 00000000..eb29ba7e --- /dev/null +++ b/src/grid/store/index.js @@ -0,0 +1,2 @@ +export * from './columns.js'; +export * from './data.js'; diff --git a/src/grid/utils.js b/src/grid/utils.js new file mode 100644 index 00000000..0464f791 --- /dev/null +++ b/src/grid/utils.js @@ -0,0 +1,31 @@ + +function isActiveElement (element) { + const skipEventFor = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON']; + if (skipEventFor.includes(element.tagName)) return true; +} + +function isInsidePopup (element) { + const skipEventIfInside = '.dialog,.drawer,.popover,.menu'; + return element.closest(skipEventIfInside); +} + + +// ignores navigation when event happened inside a form control +// or inside dialog, drawer, popover, menu +export function shouldSkipNav (e, element) { + const target = e && e.target; + if (!target || target === document) return false; + const notInElem = !element || !element.contains(target); + return (notInElem || isActiveElement(target) || isInsidePopup(target)); +} + + +/** + * Finds all selectable rows in all tables on the page. + */ +export function getSelectableItems (element) { + const rootEl = element.parentElement || document; + const rows = rootEl.querySelectorAll('.table tbody'); + if (rows && rows.length) return Array.from(rows); + return []; +} diff --git a/src/index.js b/src/index.js index dab424a3..6995d085 100644 --- a/src/index.js +++ b/src/index.js @@ -2,6 +2,7 @@ export * from './button-group/index.js'; export * from './button/index.js'; export * from './dialog/index.js'; export * from './drawer/index.js'; +export * from './grid/index.js'; export * from './icon/index.js'; export * from './info-bar/index.js'; export * from './input/index.js'; diff --git a/src/table/Table.css b/src/table/Table.css index e5bacaf3..05b2637e 100644 --- a/src/table/Table.css +++ b/src/table/Table.css @@ -1,6 +1,6 @@ .table { width: 100%; - height: 100%; + max-height: 100%; overflow: auto; overscroll-behavior-y: contain; position: relative; From eb9c124c5171194282a1568ce82510ca36ad75cc Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Sat, 18 May 2024 22:17:22 +0100 Subject: [PATCH 02/11] sync with master --- src/input/combobox/Combobox.css | 10 ++++++++++ src/input/combobox/Combobox.svelte | 5 ++--- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/src/input/combobox/Combobox.css b/src/input/combobox/Combobox.css index 0fa7b04d..834d9468 100644 --- a/src/input/combobox/Combobox.css +++ b/src/input/combobox/Combobox.css @@ -83,6 +83,16 @@ .combobox-list-item b { color: var(--ui-color-accent); } +/* has checked element before */ +.combobox-list-item.checked + .combobox-list-item.checked { + border-top-left-radius: 0; + border-top-right-radius: 0; +} +/* has checked element after it */ +.combobox-list-item.checked:has(+ .combobox-list-item.checked) { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { diff --git a/src/input/combobox/Combobox.svelte b/src/input/combobox/Combobox.svelte index 5cb69c39..d57cd09c 100644 --- a/src/input/combobox/Combobox.svelte +++ b/src/input/combobox/Combobox.svelte @@ -79,7 +79,7 @@ aria-selected="{item.idx === highlightIndex}" class:selected="{item.idx === highlightIndex}" - aria-checked="{isChecked}" + aria-checked="{!!isChecked}" class:checked="{isChecked}" on:click="{e => onclick(item, e)}" @@ -184,7 +184,7 @@ onDestroy(() => { afterUpdate(() => { if (!opened && items.length) { - if (!originalItems) originalItems = deepCopy(items); + originalItems = deepCopy(items); if (items.length && typeof items[0] === 'string') { items = items.map(item => ({ name: item })); } @@ -235,7 +235,6 @@ function open (e) { const mousedownOnDesktop = !isMobile() && type === 'mousedown'; const typing = type === 'typing'; const navigating = type === 'navigating'; - if (!clickOnMobile && !mousedownOnDesktop && !typing && !navigating) return; if (mousedownOnDesktop && opened) return close(); if (opened) return; From 6e8f15f69249993d9baa517f8289fadedbbd21a2 Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Sat, 18 May 2024 23:08:42 +0100 Subject: [PATCH 03/11] grid --- docs/docs.js | 272 +++++++++++++++++++++---------- docs/ui.css | 14 ++ src/grid/Grid.css | 4 + src/grid/parts/GridBody.svelte | 2 +- src/grid/parts/GridFoot.svelte | 8 +- src/grid/parts/GridHeadTH.svelte | 4 +- src/grid/parts/GridRow.svelte | 7 +- src/grid/store/data.js | 5 +- 8 files changed, 223 insertions(+), 93 deletions(-) diff --git a/docs/docs.js b/docs/docs.js index 91c98738..40318ca6 100644 --- a/docs/docs.js +++ b/docs/docs.js @@ -7354,6 +7354,9 @@ function sortData(items, field, order) { return []; if (field === "") return items.sort(numberSort("id", order)); + if (typeof items[0][field] === "number") { + return items.sort(numberSort(field, order)); + } return items.sort(stringSort(field, order)); } function numberSort(field, order = "ASC") { @@ -9171,7 +9174,7 @@ function create_if_block_6(ctx) { div = element2("div"); div.textContent = "No items found"; attr_dev(div, "class", "combobox-list-empty"); - add_location(div, file8, 103, 3, 2993); + add_location(div, file8, 103, 3, 2995); }, m: function mount(target, anchor) { insert_dev(target, div, anchor); @@ -9375,10 +9378,10 @@ function create_if_block_4(ctx) { attr_dev(rect, "width", "16"); attr_dev(rect, "height", "16"); attr_dev(rect, "rx", "3"); - add_location(rect, file8, 93, 9, 2716); + add_location(rect, file8, 93, 9, 2718); attr_dev(path, "class", "tick"); attr_dev(path, "d", "M8 12l3 3l5.5 -5.5"); - add_location(path, file8, 94, 9, 2781); + add_location(path, file8, 94, 9, 2783); attr_dev(svg, "xmlns", "http://www.w3.org/2000/svg"); attr_dev(svg, "viewBox", "0 0 24 24"); attr_dev(svg, "stroke-width", "1.5"); @@ -9387,7 +9390,7 @@ function create_if_block_4(ctx) { attr_dev(svg, "stroke-linecap", "round"); attr_dev(svg, "stroke-linejoin", "round"); attr_dev(svg, "class", "icon icon-tabler icon-tabler-square-check"); - add_location(svg, file8, 92, 8, 2496); + add_location(svg, file8, 92, 8, 2498); }, m: function mount(target, anchor) { insert_dev(target, svg, anchor); @@ -9464,13 +9467,13 @@ function create_each_block_1(ctx) { t0 = space(); span = element2("span"); t1 = space(); - add_location(span, file8, 97, 7, 2866); + add_location(span, file8, 97, 7, 2868); attr_dev(div, "role", "option"); attr_dev(div, "class", "combobox-list-item"); attr_dev(div, "aria-selected", div_aria_selected_value = /*item*/ ctx[77].idx === /*highlightIndex*/ ctx[17]); - attr_dev(div, "aria-checked", div_aria_checked_value = /*isChecked*/ + attr_dev(div, "aria-checked", div_aria_checked_value = !!/*isChecked*/ ctx[78]); toggle_class(div, "in-group", !!/*item*/ ctx[77].group); @@ -9541,7 +9544,7 @@ function create_each_block_1(ctx) { attr_dev(div, "aria-selected", div_aria_selected_value); } if (dirty[0] & /*multiselect, selectedItems, groupedData*/ - 270338 && div_aria_checked_value !== (div_aria_checked_value = /*isChecked*/ + 270338 && div_aria_checked_value !== (div_aria_checked_value = !!/*isChecked*/ ctx[78])) { attr_dev(div, "aria-checked", div_aria_checked_value); } @@ -9688,7 +9691,7 @@ function create_if_block_1(ctx) { ctx[19] ); attr_dev(div0, "class", "combobox-list-header"); - add_location(div0, file8, 107, 2, 3084); + add_location(div0, file8, 107, 2, 3086); attr_dev(div1, "role", "option"); attr_dev(div1, "class", "combobox-list-item"); attr_dev(div1, "aria-selected", div1_aria_selected_value = /*highlightIndex*/ @@ -9701,7 +9704,7 @@ function create_if_block_1(ctx) { ctx[17] === /*filteredData*/ ctx[14].length ); - add_location(div1, file8, 108, 3, 3143); + add_location(div1, file8, 108, 3, 3145); }, m: function mount(target, anchor) { insert_dev(target, div0, anchor); @@ -10338,8 +10341,7 @@ function instance13($$self2, $$props2, $$invalidate2) { }); afterUpdate(() => { if (!opened && items.length) { - if (!originalItems) - originalItems = deepCopy(items); + originalItems = deepCopy(items); if (items.length && typeof items[0] === "string") { $$invalidate2(34, items = items.map((item) => ({ name: item }))); } @@ -28212,6 +28214,7 @@ function create_fragment32(ctx) { let current_block_type_index; let if_block; let th_title_value; + let th_class_value; let current; let mounted; let dispose; @@ -28220,12 +28223,12 @@ function create_fragment32(ctx) { function select_block_type(ctx2, dirty) { if ( /*sortasc*/ - ctx2[1] + ctx2[2] ) return 0; if ( /*sortdesc*/ - ctx2[2] + ctx2[3] ) return 1; return -1; @@ -28242,24 +28245,25 @@ function create_fragment32(ctx) { t1 = space(); if (if_block) if_block.c(); - add_location(span, file27, 9, 3, 195); + add_location(span, file27, 9, 3, 205); attr_dev(div, "class", "cell-aligner"); - add_location(div, file27, 8, 2, 165); + add_location(div, file27, 8, 2, 175); attr_dev(th, "title", th_title_value = /*column*/ ctx[0].label); - attr_dev(th, "class", "th-sortable"); + attr_dev(th, "class", th_class_value = "th-sortable th-" + /*type*/ + ctx[4]); attr_dev(th, "tabindex", "0"); toggle_class( th, "sortasc", /*sortasc*/ - ctx[1] + ctx[2] ); toggle_class( th, "sortdesc", /*sortdesc*/ - ctx[2] + ctx[3] ); add_location(th, file27, 0, 0, 0); }, @@ -28282,7 +28286,7 @@ function create_fragment32(ctx) { th, "keydown", /*keydown_handler*/ - ctx[11], + ctx[13], false, false, false, @@ -28292,7 +28296,7 @@ function create_fragment32(ctx) { th, "click", /*sort*/ - ctx[5], + ctx[7], false, false, false, @@ -28336,22 +28340,27 @@ function create_fragment32(ctx) { ctx2[0].label)) { attr_dev(th, "title", th_title_value); } - if (!current || dirty & /*sortasc*/ - 2) { + if (!current || dirty & /*type*/ + 16 && th_class_value !== (th_class_value = "th-sortable th-" + /*type*/ + ctx2[4])) { + attr_dev(th, "class", th_class_value); + } + if (!current || dirty & /*type, sortasc*/ + 20) { toggle_class( th, "sortasc", /*sortasc*/ - ctx2[1] + ctx2[2] ); } - if (!current || dirty & /*sortdesc*/ - 4) { + if (!current || dirty & /*type, sortdesc*/ + 24) { toggle_class( th, "sortdesc", /*sortdesc*/ - ctx2[2] + ctx2[3] ); } }, @@ -28390,14 +28399,19 @@ function instance32($$self2, $$props2, $$invalidate2) { let sortOrder; let isDateField; let isASC; - let $sortOrder, $$unsubscribe_sortOrder = noop, $$subscribe_sortOrder = () => ($$unsubscribe_sortOrder(), $$unsubscribe_sortOrder = subscribe(sortOrder, ($$value) => $$invalidate2(9, $sortOrder = $$value)), sortOrder); - let $sortField, $$unsubscribe_sortField = noop, $$subscribe_sortField = () => ($$unsubscribe_sortField(), $$unsubscribe_sortField = subscribe(sortField, ($$value) => $$invalidate2(10, $sortField = $$value)), sortField); + let type; + let $sortOrder, $$unsubscribe_sortOrder = noop, $$subscribe_sortOrder = () => ($$unsubscribe_sortOrder(), $$unsubscribe_sortOrder = subscribe(sortOrder, ($$value) => $$invalidate2(10, $sortOrder = $$value)), sortOrder); + let $sortField, $$unsubscribe_sortField = noop, $$subscribe_sortField = () => ($$unsubscribe_sortField(), $$unsubscribe_sortField = subscribe(sortField, ($$value) => $$invalidate2(11, $sortField = $$value)), sortField); + let $Data, $$unsubscribe_Data = noop, $$subscribe_Data = () => ($$unsubscribe_Data(), $$unsubscribe_Data = subscribe(Data, ($$value) => $$invalidate2(12, $Data = $$value)), Data); $$self2.$$.on_destroy.push(() => $$unsubscribe_sortOrder()); $$self2.$$.on_destroy.push(() => $$unsubscribe_sortField()); + $$self2.$$.on_destroy.push(() => $$unsubscribe_Data()); let { $$slots: slots2 = {}, $$scope: $$scope2 } = $$props2; validate_slots("GridHeadTH", slots2, []); let { column = {} } = $$props2; let { Data = [] } = $$props2; + validate_store(Data, "Data"); + $$subscribe_Data(); let sortasc = false; let sortdesc = false; function sort() { @@ -28418,7 +28432,7 @@ function instance32($$self2, $$props2, $$invalidate2) { if ("column" in $$props3) $$invalidate2(0, column = $$props3.column); if ("Data" in $$props3) - $$invalidate2(6, Data = $$props3.Data); + $$subscribe_Data($$invalidate2(1, Data = $$props3.Data)); }; $$self2.$capture_state = () => ({ Icon: Icon_default, @@ -28429,69 +28443,78 @@ function instance32($$self2, $$props2, $$invalidate2) { sort, isDateField, isASC, + type, sortOrder, sortField, $sortOrder, - $sortField + $sortField, + $Data }); $$self2.$inject_state = ($$props3) => { if ("column" in $$props3) $$invalidate2(0, column = $$props3.column); if ("Data" in $$props3) - $$invalidate2(6, Data = $$props3.Data); + $$subscribe_Data($$invalidate2(1, Data = $$props3.Data)); if ("sortasc" in $$props3) - $$invalidate2(1, sortasc = $$props3.sortasc); + $$invalidate2(2, sortasc = $$props3.sortasc); if ("sortdesc" in $$props3) - $$invalidate2(2, sortdesc = $$props3.sortdesc); + $$invalidate2(3, sortdesc = $$props3.sortdesc); if ("isDateField" in $$props3) - $$invalidate2(7, isDateField = $$props3.isDateField); + $$invalidate2(8, isDateField = $$props3.isDateField); if ("isASC" in $$props3) - $$invalidate2(8, isASC = $$props3.isASC); + $$invalidate2(9, isASC = $$props3.isASC); + if ("type" in $$props3) + $$invalidate2(4, type = $$props3.type); if ("sortOrder" in $$props3) - $$subscribe_sortOrder($$invalidate2(3, sortOrder = $$props3.sortOrder)); + $$subscribe_sortOrder($$invalidate2(5, sortOrder = $$props3.sortOrder)); if ("sortField" in $$props3) - $$subscribe_sortField($$invalidate2(4, sortField = $$props3.sortField)); + $$subscribe_sortField($$invalidate2(6, sortField = $$props3.sortField)); }; if ($$props2 && "$$inject" in $$props2) { $$self2.$inject_state($$props2.$$inject); } $$self2.$$.update = () => { if ($$self2.$$.dirty & /*Data*/ - 64) { + 2) { $: - $$subscribe_sortField($$invalidate2(4, sortField = Data.sortField)); + $$subscribe_sortField($$invalidate2(6, sortField = Data.sortField)); } if ($$self2.$$.dirty & /*Data*/ - 64) { + 2) { $: - $$subscribe_sortOrder($$invalidate2(3, sortOrder = Data.sortOrder)); + $$subscribe_sortOrder($$invalidate2(5, sortOrder = Data.sortOrder)); } if ($$self2.$$.dirty & /*column*/ 1) { $: - $$invalidate2(7, isDateField = column.field.includes("date")); + $$invalidate2(8, isDateField = column.field.includes("date")); } if ($$self2.$$.dirty & /*$sortOrder*/ - 512) { + 1024) { $: - $$invalidate2(8, isASC = $sortOrder === "ASC"); + $$invalidate2(9, isASC = $sortOrder === "ASC"); + } + if ($$self2.$$.dirty & /*$Data, column*/ + 4097) { + $: + $$invalidate2(4, type = typeof $Data[0][column.field]); } if ($$self2.$$.dirty & /*$sortField, column, isDateField, isASC*/ - 1409) { + 2817) { $: { - $$invalidate2(1, sortasc = false); - $$invalidate2(2, sortdesc = false); + $$invalidate2(2, sortasc = false); + $$invalidate2(3, sortdesc = false); if ($sortField === column.field) { if (isDateField) { if (isASC) - $$invalidate2(2, sortdesc = true); + $$invalidate2(3, sortdesc = true); else - $$invalidate2(1, sortasc = true); + $$invalidate2(2, sortasc = true); } else { if (isASC) - $$invalidate2(1, sortasc = true); + $$invalidate2(2, sortasc = true); else - $$invalidate2(2, sortdesc = true); + $$invalidate2(3, sortdesc = true); } } } @@ -28499,23 +28522,25 @@ function instance32($$self2, $$props2, $$invalidate2) { }; return [ column, + Data, sortasc, sortdesc, + type, sortOrder, sortField, sort, - Data, isDateField, isASC, $sortOrder, $sortField, + $Data, keydown_handler ]; } var GridHeadTH = class extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance32, create_fragment32, safe_not_equal, { column: 0, Data: 6 }); + init(this, options, instance32, create_fragment32, safe_not_equal, { column: 0, Data: 1 }); dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "GridHeadTH", @@ -29013,7 +29038,7 @@ var GridHead_default = GridHead; var file29 = "src/grid/parts/GridRow.svelte"; function get_each_context9(ctx, list, i) { const child_ctx = ctx.slice(); - child_ctx[6] = list[i]; + child_ctx[9] = list[i]; return child_ctx; } function create_if_block16(ctx) { @@ -29022,7 +29047,7 @@ function create_if_block16(ctx) { let updating_checked; let current; function checkbox_checked_binding(value2) { - ctx[5](value2); + ctx[7](value2); } let checkbox_props = { tabindex: "-1" }; if ( @@ -29089,16 +29114,22 @@ function create_each_block9(ctx) { /*item*/ (ctx[0][ /*column*/ - ctx[6].field + ctx[9].field ] || "") + "" ); let t0; let t1; + let td_class_value; const block = { c: function create() { td = element2("td"); t0 = text(t0_value); t1 = space(); + attr_dev(td, "class", td_class_value = "td-" + /*getType*/ + ctx[6]( + /*column*/ + ctx[9] + )); add_location(td, file29, 14, 3, 321); }, m: function mount(target, anchor) { @@ -29108,12 +29139,20 @@ function create_each_block9(ctx) { }, p: function update2(ctx2, dirty) { if (dirty & /*item, $Columns*/ - 17 && t0_value !== (t0_value = /*item*/ + 33 && t0_value !== (t0_value = /*item*/ (ctx2[0][ /*column*/ - ctx2[6].field + ctx2[9].field ] || "") + "")) set_data_dev(t0, t0_value); + if (dirty & /*$Columns*/ + 32 && td_class_value !== (td_class_value = "td-" + /*getType*/ + ctx2[6]( + /*column*/ + ctx2[9] + ))) { + attr_dev(td, "class", td_class_value); + } }, d: function destroy(detaching) { if (detaching) { @@ -29142,7 +29181,7 @@ function create_fragment34(ctx) { ); let each_value = ensure_array_like_dev( /*$Columns*/ - ctx[4] + ctx[5] ); let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { @@ -29163,10 +29202,10 @@ function create_fragment34(ctx) { tbody, "data-id", /*id*/ - ctx[3] + ctx[4] ); attr_dev(tbody, "class", tbody_class_value = "item item-" + /*id*/ - ctx[3]); + ctx[4]); attr_dev(tbody, "tabindex", "0"); toggle_class( tbody, @@ -29216,11 +29255,11 @@ function create_fragment34(ctx) { }); check_outros(); } - if (dirty & /*item, $Columns*/ - 17) { + if (dirty & /*getType, $Columns, item*/ + 97) { each_value = ensure_array_like_dev( /*$Columns*/ - ctx2[4] + ctx2[5] ); let i; for (i = 0; i < each_value.length; i += 1) { @@ -29239,21 +29278,21 @@ function create_fragment34(ctx) { each_blocks.length = each_value.length; } if (!current || dirty & /*id*/ - 8) { + 16) { attr_dev( tbody, "data-id", /*id*/ - ctx2[3] + ctx2[4] ); } if (!current || dirty & /*id*/ - 8 && tbody_class_value !== (tbody_class_value = "item item-" + /*id*/ - ctx2[3])) { + 16 && tbody_class_value !== (tbody_class_value = "item item-" + /*id*/ + ctx2[4])) { attr_dev(tbody, "class", tbody_class_value); } if (!current || dirty & /*id, item*/ - 9) { + 17) { toggle_class( tbody, "row-selected", @@ -29292,7 +29331,9 @@ function create_fragment34(ctx) { } function instance34($$self2, $$props2, $$invalidate2) { let id2; - let $Columns, $$unsubscribe_Columns = noop, $$subscribe_Columns = () => ($$unsubscribe_Columns(), $$unsubscribe_Columns = subscribe(Columns, ($$value) => $$invalidate2(4, $Columns = $$value)), Columns); + let $Data, $$unsubscribe_Data = noop, $$subscribe_Data = () => ($$unsubscribe_Data(), $$unsubscribe_Data = subscribe(Data, ($$value) => $$invalidate2(8, $Data = $$value)), Data); + let $Columns, $$unsubscribe_Columns = noop, $$subscribe_Columns = () => ($$unsubscribe_Columns(), $$unsubscribe_Columns = subscribe(Columns, ($$value) => $$invalidate2(5, $Columns = $$value)), Columns); + $$self2.$$.on_destroy.push(() => $$unsubscribe_Data()); $$self2.$$.on_destroy.push(() => $$unsubscribe_Columns()); let { $$slots: slots2 = {}, $$scope: $$scope2 } = $$props2; validate_slots("GridRow", slots2, []); @@ -29301,7 +29342,13 @@ function instance34($$self2, $$props2, $$invalidate2) { let { Columns = [] } = $$props2; validate_store(Columns, "Columns"); $$subscribe_Columns(); - const writable_props = ["item", "multiselect", "Columns"]; + let { Data = [] } = $$props2; + validate_store(Data, "Data"); + $$subscribe_Data(); + function getType(column) { + return typeof $Data[0][column.field]; + } + const writable_props = ["item", "multiselect", "Columns", "Data"]; Object.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); @@ -29319,13 +29366,18 @@ function instance34($$self2, $$props2, $$invalidate2) { $$invalidate2(1, multiselect = $$props3.multiselect); if ("Columns" in $$props3) $$subscribe_Columns($$invalidate2(2, Columns = $$props3.Columns)); + if ("Data" in $$props3) + $$subscribe_Data($$invalidate2(3, Data = $$props3.Data)); }; $$self2.$capture_state = () => ({ Checkbox: Checkbox_default, item, multiselect, Columns, + Data, + getType, id: id2, + $Data, $Columns }); $$self2.$inject_state = ($$props3) => { @@ -29335,8 +29387,10 @@ function instance34($$self2, $$props2, $$invalidate2) { $$invalidate2(1, multiselect = $$props3.multiselect); if ("Columns" in $$props3) $$subscribe_Columns($$invalidate2(2, Columns = $$props3.Columns)); + if ("Data" in $$props3) + $$subscribe_Data($$invalidate2(3, Data = $$props3.Data)); if ("id" in $$props3) - $$invalidate2(3, id2 = $$props3.id); + $$invalidate2(4, id2 = $$props3.id); }; if ($$props2 && "$$inject" in $$props2) { $$self2.$inject_state($$props2.$$inject); @@ -29345,15 +29399,29 @@ function instance34($$self2, $$props2, $$invalidate2) { if ($$self2.$$.dirty & /*item*/ 1) { $: - $$invalidate2(3, id2 = item.id || item.field); + $$invalidate2(4, id2 = item.id || item.field); } }; - return [item, multiselect, Columns, id2, $Columns, checkbox_checked_binding]; + return [ + item, + multiselect, + Columns, + Data, + id2, + $Columns, + getType, + checkbox_checked_binding + ]; } var GridRow = class extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance34, create_fragment34, safe_not_equal, { item: 0, multiselect: 1, Columns: 2 }); + init(this, options, instance34, create_fragment34, safe_not_equal, { + item: 0, + multiselect: 1, + Columns: 2, + Data: 3 + }); dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "GridRow", @@ -29379,6 +29447,12 @@ var GridRow = class extends SvelteComponentDev { set Columns(value2) { throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } + get Data() { + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + } + set Data(value2) { + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + } }; var GridRow_default = GridRow; @@ -29404,6 +29478,10 @@ function create_each_block10(ctx) { Columns: ( /*Columns*/ ctx[2] + ), + Data: ( + /*Data*/ + ctx[1] ) }, $$inline: true @@ -29430,6 +29508,10 @@ function create_each_block10(ctx) { 4) gridrow_changes.Columns = /*Columns*/ ctx2[2]; + if (dirty & /*Data*/ + 2) + gridrow_changes.Data = /*Data*/ + ctx2[1]; gridrow.$set(gridrow_changes); }, i: function intro(local) { @@ -29489,8 +29571,8 @@ function create_fragment35(ctx) { current = true; }, p: function update2(ctx2, [dirty]) { - if (dirty & /*$Data, multiselect, Columns*/ - 13) { + if (dirty & /*$Data, multiselect, Columns, Data*/ + 15) { each_value = ensure_array_like_dev( /*$Data*/ ctx2[3] @@ -29625,7 +29707,7 @@ var GridBody_default = GridBody; var file30 = "src/grid/parts/GridFoot.svelte"; function get_each_context11(ctx, list, i) { const child_ctx = ctx.slice(); - child_ctx[6] = list[i]; + child_ctx[7] = list[i]; return child_ctx; } function create_if_block17(ctx) { @@ -29657,19 +29739,25 @@ function create_each_block11(ctx) { let td; let t_value = ( /*column*/ - (ctx[6].total ? ( + (ctx[7].total ? ( /*sumColumn*/ ctx[4]( /*column*/ - ctx[6] + ctx[7] ) ) : "") + "" ); let t; + let td_class_value; const block = { c: function create() { td = element2("td"); t = text(t_value); + attr_dev(td, "class", td_class_value = "td-" + /*getType*/ + ctx[5]( + /*column*/ + ctx[7] + )); add_location(td, file30, 6, 3, 87); }, m: function mount(target, anchor) { @@ -29679,14 +29767,22 @@ function create_each_block11(ctx) { p: function update2(ctx2, dirty) { if (dirty & /*$Columns*/ 8 && t_value !== (t_value = /*column*/ - (ctx2[6].total ? ( + (ctx2[7].total ? ( /*sumColumn*/ ctx2[4]( /*column*/ - ctx2[6] + ctx2[7] ) ) : "") + "")) set_data_dev(t, t_value); + if (dirty & /*$Columns*/ + 8 && td_class_value !== (td_class_value = "td-" + /*getType*/ + ctx2[5]( + /*column*/ + ctx2[7] + ))) { + attr_dev(td, "class", td_class_value); + } }, d: function destroy(detaching) { if (detaching) { @@ -29762,8 +29858,8 @@ function create_fragment36(ctx) { if_block.d(1); if_block = null; } - if (dirty & /*$Columns, sumColumn*/ - 24) { + if (dirty & /*getType, $Columns, sumColumn*/ + 56) { each_value = ensure_array_like_dev( /*$Columns*/ ctx2[3] @@ -29806,7 +29902,7 @@ function create_fragment36(ctx) { return block; } function instance36($$self2, $$props2, $$invalidate2) { - let $Data, $$unsubscribe_Data = noop, $$subscribe_Data = () => ($$unsubscribe_Data(), $$unsubscribe_Data = subscribe(Data, ($$value) => $$invalidate2(5, $Data = $$value)), Data); + let $Data, $$unsubscribe_Data = noop, $$subscribe_Data = () => ($$unsubscribe_Data(), $$unsubscribe_Data = subscribe(Data, ($$value) => $$invalidate2(6, $Data = $$value)), Data); let $Columns, $$unsubscribe_Columns = noop, $$subscribe_Columns = () => ($$unsubscribe_Columns(), $$unsubscribe_Columns = subscribe(Columns, ($$value) => $$invalidate2(3, $Columns = $$value)), Columns); $$self2.$$.on_destroy.push(() => $$unsubscribe_Data()); $$self2.$$.on_destroy.push(() => $$unsubscribe_Columns()); @@ -29822,6 +29918,9 @@ function instance36($$self2, $$props2, $$invalidate2) { function sumColumn(column) { return $Data.reduce((acc, row) => acc + +row[column.field], 0); } + function getType(column) { + return typeof $Data[0][column.field]; + } const writable_props = ["multiselect", "Data", "Columns"]; Object.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") @@ -29840,6 +29939,7 @@ function instance36($$self2, $$props2, $$invalidate2) { Data, Columns, sumColumn, + getType, $Data, $Columns }); @@ -29854,7 +29954,7 @@ function instance36($$self2, $$props2, $$invalidate2) { if ($$props2 && "$$inject" in $$props2) { $$self2.$inject_state($$props2.$$inject); } - return [multiselect, Data, Columns, $Columns, sumColumn]; + return [multiselect, Data, Columns, $Columns, sumColumn, getType]; } var GridFoot = class extends SvelteComponentDev { constructor(options) { diff --git a/docs/ui.css b/docs/ui.css index 70e689e6..8f7fa2ff 100644 --- a/docs/ui.css +++ b/docs/ui.css @@ -642,6 +642,10 @@ button { -ms-touch-action: manipulation; touch-action: manipulation; } } +.grid .th-number, +.grid .td-number { text-align: right; } + + /*** SORTABLE TABLE *******************************************************************************/ .grid-sortable thead th { cursor: pointer; } .grid-sortable thead th span:hover { text-decoration: underline; } @@ -1675,6 +1679,16 @@ input[type=color] { .combobox-list-item b { color: var(--ui-color-accent); } +/* has checked element before */ +.combobox-list-item.checked + .combobox-list-item.checked { + border-top-left-radius: 0; + border-top-right-radius: 0; +} +/* has checked element after it */ +.combobox-list-item.checked:has(+ .combobox-list-item.checked) { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { diff --git a/src/grid/Grid.css b/src/grid/Grid.css index 9b80366d..5c8bb290 100644 --- a/src/grid/Grid.css +++ b/src/grid/Grid.css @@ -53,6 +53,10 @@ } +.grid .th-number, +.grid .td-number { text-align: right; } + + /*** SORTABLE TABLE *******************************************************************************/ .grid-sortable thead th { cursor: pointer; } .grid-sortable thead th span:hover { text-decoration: underline; } diff --git a/src/grid/parts/GridBody.svelte b/src/grid/parts/GridBody.svelte index 7596ad39..e13603fe 100644 --- a/src/grid/parts/GridBody.svelte +++ b/src/grid/parts/GridBody.svelte @@ -1,5 +1,5 @@ {#each $Data as item} - + {/each} diff --git a/src/grid/parts/GridHeadTH.svelte b/src/grid/parts/GridHeadTH.svelte index 0a9f63ed..089ecd10 100644 --- a/src/grid/parts/GridHeadTH.svelte +++ b/src/grid/parts/GridHeadTH.svelte @@ -1,6 +1,6 @@ {/if} {#each $Columns as column} - + {item[column.field] || ''} {/each} @@ -24,8 +24,13 @@ import { Checkbox } from '../../input'; export let item = {}; export let multiselect = false; export let Columns = []; +export let Data = []; + $:id = item.id || item.field; +function getType (column) { + return typeof $Data[0][column.field]; +} diff --git a/src/grid/store/data.js b/src/grid/store/data.js index 188e39e2..3d441bc9 100644 --- a/src/grid/store/data.js +++ b/src/grid/store/data.js @@ -71,8 +71,9 @@ function sortData (items, field, order) { if (!items || !items.length) return []; if (field === '') return items.sort(numberSort('id', order)); - // const numFields = ['amount_in', 'amount_out']; - // if (numFields.includes(field)) return items.sort(numberSort(field, order)); + if (typeof items[0][field] === 'number') { + return items.sort(numberSort(field, order)); + } return items.sort(stringSort(field, order)); } From cb3b52bdcfd13aff49c7738da4d2fdac5498ad64 Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Mon, 20 May 2024 16:25:30 +0100 Subject: [PATCH 04/11] deps upds --- eslint.config.js | 5 ++++ package-lock.json | 60 +++++++++++++++++++++++------------------------ package.json | 14 +++++------ 3 files changed, 42 insertions(+), 37 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index b8ce5ecb..886a8d29 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -54,6 +54,11 @@ export default [ 'prefer-promise-reject-errors': 'error', 'svelte/no-at-html-tags': 0, + // 'import/no-unresolved': [2, { 'commonjs': true, 'amd': true }], + // 'import/named': 2, + // 'import/namespace': 2, + // 'import/default': 2, + // 'import/export': 2, } } ]; diff --git a/package-lock.json b/package-lock.json index 8d501595..8d5ea4b1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "@babel/plugin-transform-runtime": "^7.24.3", "@babel/preset-env": "^7.24.5", "@esbuild-plugins/node-resolve": "^0.2.2", - "@eslint/js": "^9.2.0", + "@eslint/js": "^9.3.0", "@stylistic/eslint-plugin-js": "^2.1.0", "@testing-library/dom": "^10.1.0", "@testing-library/jest-dom": "^6.4.5", @@ -27,11 +27,11 @@ "@types/jest": "^29.5.12", "babel-jest": "^29.7.0", "del": "^7.1.0", - "esbuild-svelte": "^0.8.0", - "eslint": "^9.2.0", + "esbuild-svelte": "^0.8.1", + "eslint": "^9.3.0", "eslint-formatter-pretty": "^6.0.1", "eslint-plugin-svelte": "^2.39.0", - "globals": "^15.2.0", + "globals": "^15.3.0", "gulp": "^5.0.0", "gulp-cached": "^1.1.1", "gulp-cleaner-css": "^4.3.2", @@ -54,7 +54,7 @@ "stylelint": "^16.5.0", "stylelint-config-standard": "^36.0.0", "stylelint-formatter-pretty": "^4.0.0", - "svelte": "^4.2.16", + "svelte": "^4.2.17", "svelte-jester": "^3.0.0", "ts-jest": "^29.1.2" } @@ -2392,9 +2392,9 @@ } }, "node_modules/@eslint/eslintrc": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.0.2.tgz", - "integrity": "sha512-wV19ZEGEMAC1eHgrS7UQPqsdEiCIbTKTasEfcXAigzoXICcqZSjBZEHlZwNVvKg6UBCjSlos84XiLqsRJnIcIg==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.1.0.tgz", + "integrity": "sha512-4Bfj15dVJdoy3RfZmmo86RK1Fwzn6SstsvK9JS+BaVKqC6QQQQyXekNaC+g+LKNgkQ+2VhGAzm6hO40AhMR3zQ==", "dev": true, "dependencies": { "ajv": "^6.12.4", @@ -2445,9 +2445,9 @@ } }, "node_modules/@eslint/js": { - "version": "9.2.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.2.0.tgz", - "integrity": "sha512-ESiIudvhoYni+MdsI8oD7skpprZ89qKocwRM2KEvhhBJ9nl5MRh7BXU5GTod7Mdygq+AUl+QzId6iWJKR/wABA==", + "version": "9.3.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.3.0.tgz", + "integrity": "sha512-niBqk8iwv96+yuTwjM6bWg8ovzAPF9qkICsGtcoa5/dmqcEMfdwNAX7+/OHcJHc7wj7XqPxH98oAHytFYlw6Sw==", "dev": true, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -2508,9 +2508,9 @@ "dev": true }, "node_modules/@humanwhocodes/retry": { - "version": "0.2.3", - "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.2.3.tgz", - "integrity": "sha512-X38nUbachlb01YMlvPFojKoiXq+LzZvuSce70KPMPdeM1Rj03k4dR7lDslhbqXn3Ang4EU3+EAmwEAsbrjHW3g==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.3.0.tgz", + "integrity": "sha512-d2CGZR2o7fS6sWB7DG/3a95bGKQyHMACZ5aW8qGkkqQpUoZV6C0X7Pc7l4ZNMZkfNBf4VWNe9E1jRsf0G146Ew==", "dev": true, "engines": { "node": ">=18.18" @@ -5984,9 +5984,9 @@ } }, "node_modules/esbuild-svelte": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/esbuild-svelte/-/esbuild-svelte-0.8.0.tgz", - "integrity": "sha512-uKcPf1kl2UGMjrfHChv4dLxGAvCNhf9s72mHo19ZhKP+LrVOuQkOM/g8GE7MiGpoqjpk8UHqL08uLRbSKXhmhw==", + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/esbuild-svelte/-/esbuild-svelte-0.8.1.tgz", + "integrity": "sha512-iswZSetqRxYaQoWMd38Gu6AanIL6KFsVj8/unei7qTaxjAkRDulW62/Bc5nmeogKBWekBvrPOE106wui7gYARQ==", "dev": true, "dependencies": { "@jridgewell/trace-mapping": "^0.3.19" @@ -5996,7 +5996,7 @@ }, "peerDependencies": { "esbuild": ">=0.9.6", - "svelte": ">=3.43.0 <5" + "svelte": ">=3.43.0 <6" } }, "node_modules/escalade": { @@ -6048,18 +6048,18 @@ } }, "node_modules/eslint": { - "version": "9.2.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.2.0.tgz", - "integrity": "sha512-0n/I88vZpCOzO+PQpt0lbsqmn9AsnsJAQseIqhZFI8ibQT0U1AkEKRxA3EVMos0BoHSXDQvCXY25TUjB5tr8Og==", + "version": "9.3.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.3.0.tgz", + "integrity": "sha512-5Iv4CsZW030lpUqHBapdPo3MJetAPtejVW8B84GIcIIv8+ohFaddXsrn1Gn8uD9ijDb+kcYKFUVmC8qG8B2ORQ==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", - "@eslint/eslintrc": "^3.0.2", - "@eslint/js": "9.2.0", + "@eslint/eslintrc": "^3.1.0", + "@eslint/js": "9.3.0", "@humanwhocodes/config-array": "^0.13.0", "@humanwhocodes/module-importer": "^1.0.1", - "@humanwhocodes/retry": "^0.2.3", + "@humanwhocodes/retry": "^0.3.0", "@nodelib/fs.walk": "^1.2.8", "ajv": "^6.12.4", "chalk": "^4.0.0", @@ -7193,9 +7193,9 @@ } }, "node_modules/globals": { - "version": "15.2.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-15.2.0.tgz", - "integrity": "sha512-FQ5YwCHZM3nCmtb5FzEWwdUc9K5d3V/w9mzcz8iGD1gC/aOTHc6PouYu0kkKipNJqHAT7m51sqzQjEjIP+cK0A==", + "version": "15.3.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-15.3.0.tgz", + "integrity": "sha512-cCdyVjIUVTtX8ZsPkq1oCsOsLmGIswqnjZYMJJTGaNApj1yHtLSymKhwH51ttirREn75z3p4k051clwg7rvNKA==", "dev": true, "engines": { "node": ">=18" @@ -14621,9 +14621,9 @@ } }, "node_modules/svelte": { - "version": "4.2.16", - "resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.16.tgz", - "integrity": "sha512-mQwHpqHD2PmFcCyHaZ7XiTqposaLvJ75WpYcyY5/ce3qxbYtwQpZ+M7ZKP+2CG5U6kfnBZBpPLyofhlE6ROrnQ==", + "version": "4.2.17", + "resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.17.tgz", + "integrity": "sha512-N7m1YnoXtRf5wya5Gyx3TWuTddI4nAyayyIWFojiWV5IayDYNV5i2mRp/7qNGol4DtxEYxljmrbgp1HM6hUbmQ==", "dev": true, "dependencies": { "@ampproject/remapping": "^2.2.1", diff --git a/package.json b/package.json index 61949efc..2a771c06 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,7 @@ "@babel/plugin-transform-runtime": "^7.24.3", "@babel/preset-env": "^7.24.5", "@esbuild-plugins/node-resolve": "^0.2.2", - "@eslint/js": "^9.2.0", + "@eslint/js": "^9.3.0", "@stylistic/eslint-plugin-js": "^2.1.0", "@testing-library/dom": "^10.1.0", "@testing-library/jest-dom": "^6.4.5", @@ -46,22 +46,22 @@ "@types/jest": "^29.5.12", "babel-jest": "^29.7.0", "del": "^7.1.0", - "esbuild-svelte": "^0.8.0", - "eslint": "^9.2.0", + "esbuild-svelte": "^0.8.1", + "eslint": "^9.3.0", "eslint-formatter-pretty": "^6.0.1", "eslint-plugin-svelte": "^2.39.0", - "globals": "^15.2.0", + "globals": "^15.3.0", "gulp": "^5.0.0", "gulp-cached": "^1.1.1", "gulp-cleaner-css": "^4.3.2", "gulp-concat": "^2.6.1", "gulp-esbuild": "^0.12.0", "gulp-eslint-new": "^2.0.0", - "gulp-inject-string": "^1.1.2", "gulp-if": "^3.0.0", + "gulp-inject-string": "^1.1.2", "gulp-livereload": "^4.0.2", - "gulp-stylelint-esm": "^2.0.0", "gulp-size": "^5.0.0", + "gulp-stylelint-esm": "^2.0.0", "gulp-webserver": "^0.9.1", "husky": "^9.0.11", "jest": "^29.7.0", @@ -73,7 +73,7 @@ "stylelint": "^16.5.0", "stylelint-config-standard": "^36.0.0", "stylelint-formatter-pretty": "^4.0.0", - "svelte": "^4.2.16", + "svelte": "^4.2.17", "svelte-jester": "^3.0.0", "ts-jest": "^29.1.2" } From e9e86061e6655c87e0152ba7a3e61c59d9405192 Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Wed, 22 May 2024 22:00:40 +0100 Subject: [PATCH 05/11] fix #202, fix #204; - rename utils in docs to be lowercase (same as their actual names) --- .github/workflows/node.js.yml | 8 +- .../utils/functions/align-item.svelte | 2 +- .../components/utils/functions/animate.svelte | 2 +- .../components/utils/functions/blink.svelte | 2 +- .../utils/functions/debounce.svelte | 2 +- .../utils/functions/deep-copy.svelte | 19 - .../components/utils/functions/empty.svelte | 2 +- .../utils/functions/format-date.svelte | 2 +- .../components/utils/functions/fuzzy.svelte | 2 +- .../utils/functions/get-mouse-x.svelte.svelte | 2 +- .../functions/get-mouse-xy.svelte.svelte | 2 +- .../utils/functions/get-mouse-y.svelte.svelte | 2 +- .../components/utils/functions/guid.svelte | 2 +- docs-src/components/utils/functions/index.js | 38 +- .../utils/functions/is-color-dark.svelte | 2 +- .../utils/functions/is-in-scrollable.svelte | 2 +- .../utils/functions/is-mobile.svelte | 2 +- .../components/utils/functions/isset.svelte | 20 + .../components/utils/functions/pluck.svelte | 2 +- .../utils/functions/round-amount.svelte | 2 +- .../utils/functions/throttle.svelte | 2 +- .../utils/functions/time-ago.svelte | 2 +- docs/docs.css | 629 +- docs/docs.js | 83683 +--------------- docs/index.html | 2 +- docs/ui.css | 2745 +- src/grid/Grid.svelte | 7 +- src/grid/parts/GridHead.svelte | 2 +- src/grid/store/data.js | 68 +- src/input/combobox/Combobox.svelte | 10 +- src/utils.js | 21 +- tests/utils.spec.js | 55 +- 32 files changed, 389 insertions(+), 86954 deletions(-) delete mode 100644 docs-src/components/utils/functions/deep-copy.svelte create mode 100644 docs-src/components/utils/functions/isset.svelte diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml index 5693897e..e054f378 100644 --- a/.github/workflows/node.js.yml +++ b/.github/workflows/node.js.yml @@ -16,15 +16,15 @@ jobs: strategy: matrix: - node-version: [18.x] + node-version: [20.x] steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Use Node.js ${{ matrix.node-version }} - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 with: node-version: ${{ matrix.node-version }} cache: 'npm' - run: npm ci - # - run: npm run build --if-present +# - run: npm run dist --if-present - run: npm test diff --git a/docs-src/components/utils/functions/align-item.svelte b/docs-src/components/utils/functions/align-item.svelte index c796d62d..ca8a5abe 100644 --- a/docs-src/components/utils/functions/align-item.svelte +++ b/docs-src/components/utils/functions/align-item.svelte @@ -1,4 +1,4 @@ - +

Aligns an element to another element, ensuring that the aligned element remains within the viewport.

diff --git a/docs-src/components/utils/functions/animate.svelte b/docs-src/components/utils/functions/animate.svelte index 5507ef62..3fb947e1 100644 --- a/docs-src/components/utils/functions/animate.svelte +++ b/docs-src/components/utils/functions/animate.svelte @@ -1,4 +1,4 @@ - +

Animates an element from one state to another. Shortcut & wrapper for the native javascript animation.

Returns a promise which resolves when the animation finishes.

 diff --git a/docs-src/components/utils/functions/blink.svelte b/docs-src/components/utils/functions/blink.svelte index c23a3ed7..c1c1d9f4 100644 --- a/docs-src/components/utils/functions/blink.svelte +++ b/docs-src/components/utils/functions/blink.svelte @@ -1,4 +1,4 @@ - +

Animates an element by changing its opacity from 0.5 to 1.

  • element - HTMLElement to animate diff --git a/docs-src/components/utils/functions/debounce.svelte b/docs-src/components/utils/functions/debounce.svelte index cd88dd6b..b79634ef 100644 --- a/docs-src/components/utils/functions/debounce.svelte +++ b/docs-src/components/utils/functions/debounce.svelte @@ -1,4 +1,4 @@ - +

    The "debounced" function will only be called after it has not been called for timeout milliseconds.

    • fn - function to debounce. diff --git a/docs-src/components/utils/functions/deep-copy.svelte b/docs-src/components/utils/functions/deep-copy.svelte deleted file mode 100644 index ab809dce..00000000 --- a/docs-src/components/utils/functions/deep-copy.svelte +++ /dev/null @@ -1,19 +0,0 @@ - -

      This is just an alias for an oddly-named native function: structuredClone.

      -
        -
      • object - any object or array to clone. -
      -       - - - diff --git a/docs-src/components/utils/functions/empty.svelte b/docs-src/components/utils/functions/empty.svelte index ce9cabc6..d210a3aa 100644 --- a/docs-src/components/utils/functions/empty.svelte +++ b/docs-src/components/utils/functions/empty.svelte @@ -1,4 +1,4 @@ - +

      Similar to PHP's empty - returns true if a value is empty.

      • value - any data type. diff --git a/docs-src/components/utils/functions/format-date.svelte b/docs-src/components/utils/functions/format-date.svelte index 72b28d69..b8c3a68d 100644 --- a/docs-src/components/utils/functions/format-date.svelte +++ b/docs-src/components/utils/functions/format-date.svelte @@ -1,4 +1,4 @@ - +

        Converts date to a string in the format: YYYY-MM-DD HH:mm.

         diff --git a/docs-src/components/utils/functions/fuzzy.svelte b/docs-src/components/utils/functions/fuzzy.svelte index 5cb6db25..d5926f28 100644 --- a/docs-src/components/utils/functions/fuzzy.svelte +++ b/docs-src/components/utils/functions/fuzzy.svelte @@ -1,4 +1,4 @@ - +

        Fuzzy finds if haystack contains characters from the needle in the same order.

        • haystack - a string to be searched in. diff --git a/docs-src/components/utils/functions/get-mouse-x.svelte.svelte b/docs-src/components/utils/functions/get-mouse-x.svelte.svelte index 060db4ce..b97f864e 100644 --- a/docs-src/components/utils/functions/get-mouse-x.svelte.svelte +++ b/docs-src/components/utils/functions/get-mouse-x.svelte.svelte @@ -1,4 +1,4 @@ - +

          Returns the mouse X position. Event is standardised across platforms (touch & pointer)

           diff --git a/docs-src/components/utils/functions/get-mouse-xy.svelte.svelte b/docs-src/components/utils/functions/get-mouse-xy.svelte.svelte index eae09242..dc49e700 100644 --- a/docs-src/components/utils/functions/get-mouse-xy.svelte.svelte +++ b/docs-src/components/utils/functions/get-mouse-xy.svelte.svelte @@ -1,4 +1,4 @@ - +

          Returns the mouse XY position (as an array: [x, y]). Event is standardised across platforms (touch & pointer)

           diff --git a/docs-src/components/utils/functions/get-mouse-y.svelte.svelte b/docs-src/components/utils/functions/get-mouse-y.svelte.svelte index 95522f1b..c46ec05b 100644 --- a/docs-src/components/utils/functions/get-mouse-y.svelte.svelte +++ b/docs-src/components/utils/functions/get-mouse-y.svelte.svelte @@ -1,4 +1,4 @@ - +

          Returns the mouse Y position. Event is standardised across platforms (touch & pointer)

           diff --git a/docs-src/components/utils/functions/guid.svelte b/docs-src/components/utils/functions/guid.svelte index c5a2fdf3..8c5b0cab 100644 --- a/docs-src/components/utils/functions/guid.svelte +++ b/docs-src/components/utils/functions/guid.svelte @@ -1,4 +1,4 @@ - +

          Generates a globally unique identifier.

           diff --git a/docs-src/components/utils/functions/index.js b/docs-src/components/utils/functions/index.js index 1f9d39a2..173ace93 100644 --- a/docs-src/components/utils/functions/index.js +++ b/docs-src/components/utils/functions/index.js @@ -1,19 +1,19 @@ -export { default as AlignItem } from './align-item.svelte'; -export { default as Animate } from './animate.svelte'; -export { default as Blink } from './blink.svelte'; -export { default as Debounce } from './debounce.svelte'; -export { default as DeepCopy } from './deep-copy.svelte'; -export { default as Empty } from './empty.svelte'; -export { default as FormatDate } from './format-date.svelte'; -export { default as Fuzzy } from './fuzzy.svelte'; -export { default as GetMouseX } from './get-mouse-x.svelte.svelte'; -export { default as GetMouseXY } from './get-mouse-xy.svelte.svelte'; -export { default as GetMouseY } from './get-mouse-y.svelte.svelte'; -export { default as Guid } from './guid.svelte'; -export { default as IsInScrollable } from './is-in-scrollable.svelte'; -export { default as IsMobile } from './is-mobile.svelte'; -export { default as IsColorDark } from './is-color-dark.svelte'; -export { default as Pluck } from './pluck.svelte'; -export { default as RoundAmount } from './round-amount.svelte'; -export { default as Throttle } from './throttle.svelte'; -export { default as TimeAgo } from './time-ago.svelte'; +export { default as alignItem } from './align-item.svelte'; +export { default as animate } from './animate.svelte'; +export { default as blink } from './blink.svelte'; +export { default as debounce } from './debounce.svelte'; +export { default as empty } from './empty.svelte'; +export { default as isset } from './isset.svelte'; +export { default as formatDate } from './format-date.svelte'; +export { default as fuzzy } from './fuzzy.svelte'; +export { default as getMouseX } from './get-mouse-x.svelte.svelte'; +export { default as getMouseXY } from './get-mouse-xy.svelte.svelte'; +export { default as getMouseY } from './get-mouse-y.svelte.svelte'; +export { default as guid } from './guid.svelte'; +export { default as isInScrollable } from './is-in-scrollable.svelte'; +export { default as isMobile } from './is-mobile.svelte'; +export { default as isColorDark } from './is-color-dark.svelte'; +export { default as pluck } from './pluck.svelte'; +export { default as roundAmount } from './round-amount.svelte'; +export { default as throttle } from './throttle.svelte'; +export { default as timeAgo } from './time-ago.svelte'; diff --git a/docs-src/components/utils/functions/is-color-dark.svelte b/docs-src/components/utils/functions/is-color-dark.svelte index b836a8ad..991368d1 100644 --- a/docs-src/components/utils/functions/is-color-dark.svelte +++ b/docs-src/components/utils/functions/is-color-dark.svelte @@ -1,4 +1,4 @@ - +

          Checks if a colour is dark or light (so that e.g. a text colour can have a better contrast against the background).

           diff --git a/docs-src/components/utils/functions/is-in-scrollable.svelte b/docs-src/components/utils/functions/is-in-scrollable.svelte index ab157516..65e09ffe 100644 --- a/docs-src/components/utils/functions/is-in-scrollable.svelte +++ b/docs-src/components/utils/functions/is-in-scrollable.svelte @@ -1,4 +1,4 @@ - +

          Checks whether the given node is inside a scrollable element.

          This function is useful when determining whether a swipe event should be allowed to start on a given element.
          diff --git a/docs-src/components/utils/functions/is-mobile.svelte b/docs-src/components/utils/functions/is-mobile.svelte index 0a954f1c..0634d9b8 100644 --- a/docs-src/components/utils/functions/is-mobile.svelte +++ b/docs-src/components/utils/functions/is-mobile.svelte @@ -1,4 +1,4 @@ - +

          Checks if the current platform is mobile.

           diff --git a/docs-src/components/utils/functions/isset.svelte b/docs-src/components/utils/functions/isset.svelte new file mode 100644 index 00000000..27846783 --- /dev/null +++ b/docs-src/components/utils/functions/isset.svelte @@ -0,0 +1,20 @@ + +

          Checks if a variable is defined and not null.

          +           + + + + diff --git a/docs-src/components/utils/functions/pluck.svelte b/docs-src/components/utils/functions/pluck.svelte index 142d2e81..41b51dd3 100644 --- a/docs-src/components/utils/functions/pluck.svelte +++ b/docs-src/components/utils/functions/pluck.svelte @@ -1,4 +1,4 @@ - +

          Creates a new object with only the plucked properties from the original object..

          • object - object to pluck from. diff --git a/docs-src/components/utils/functions/round-amount.svelte b/docs-src/components/utils/functions/round-amount.svelte index 691eed5e..fddd636c 100644 --- a/docs-src/components/utils/functions/round-amount.svelte +++ b/docs-src/components/utils/functions/round-amount.svelte @@ -1,4 +1,4 @@ - +

            Rounds a number to 2 decimal places (by default).

             diff --git a/docs-src/components/utils/functions/throttle.svelte b/docs-src/components/utils/functions/throttle.svelte index ffa9462f..30300ac0 100644 --- a/docs-src/components/utils/functions/throttle.svelte +++ b/docs-src/components/utils/functions/throttle.svelte @@ -1,4 +1,4 @@ - +

            The "throttled" function will only be called once every timeout milliseconds.

            • fn - function to debounce. diff --git a/docs-src/components/utils/functions/time-ago.svelte b/docs-src/components/utils/functions/time-ago.svelte index aeeec3f1..b63d2ab8 100644 --- a/docs-src/components/utils/functions/time-ago.svelte +++ b/docs-src/components/utils/functions/time-ago.svelte @@ -1,4 +1,4 @@ - +

              Converts date to a string describing how long time ago was the given date.

               diff --git a/docs/docs.css b/docs/docs.css index ad68c022..78fc13fa 100644 --- a/docs/docs.css +++ b/docs/docs.css @@ -1,628 +1 @@ -.api-table { - height: unset; - overflow: auto visible; - overscroll-behavior-y: unset; -} -.api-table table { min-width: 900px; } - -.api-table tr td { vertical-align: top; padding-block: 0.5rem;} - -.api-table tr th:first-child, -.api-table tr td:first-child { width: 200px; } - -.api-table tr th:nth-child(2), -.api-table tr td:nth-child(2) { width: 200px; } - -.api-table tr th:last-child, -.api-table tr td:last-child { min-width: 400px; } - -html, -body { - margin: 0; - background-color: var(--ui-color-background); - color: var(--ui-color-text); - - --sidebar-width: 220px; -} - - -@font-face { - font-family: 'Prime Light'; - src: url('prime_light-webfont.woff2') format('woff2'), - url('prime_light-webfont.woff') format('woff'); - font-weight: light; - font-style: normal; -} - - -a { color: inherit; } -a:hover { - text-decoration-color: var(--ui-color-accent); - text-decoration-thickness: 2px; - text-underline-offset: 0.3rem; -} - -main { - padding: 0 2rem 8rem; - margin-left: var(--sidebar-width); -} - -h1, -h2, -h3 { font-weight: 500; margin: 2rem 0 1.2rem; width: 100%; } - -h1:first-child, -h2:first-child, -h3:first-of-type { margin-top: 0; } - -p { line-height: 1.7; margin-block: 1.5rem; max-width: 120ch; } -p b { font-weight: 700; letter-spacing: 0.5px; } - -ul { line-height: 1.7; margin: 0; padding-left: 2rem; } -ul li { margin-block: 0.5rem; } - -p + ul { margin-top: -1rem } - -em { color: var(--ui-color-accent); font-style: normal; } - - -hr { - width: 100%; - height: 0; - border: 0; - border-top: 1px solid var(--ui-color-border-2); - margin: 3em 0 2em; -} - - -.docs-overflow-box { - border: 2px dotted var(--ui-color-accent); - background-color: var(--ui-color-background); - padding: 1em; - overflow: hidden; - z-index: 1; - position: relative; -} - -.docs-buttons-row { - display: flex; - flex-flow: wrap row; - align-items: flex-start; - justify-content: flex-start; - gap: 0.5rem; - flex-shrink: 0; -} - - - -@media (1px <= width <= 700px) { - main { margin-left: 0; } -} - -main pre[class], -code { - background-color: #1a1a1a; - color: #ccc; - border-radius: var(--ui-border-radius); - font-size: var(--ui-font-s) -} - -code { - display: block; - width: 100%; - padding: 1em; - margin-block: 1em; - line-height: 2; - white-space: pre; - overflow: auto; -} - -code[class*=language-] { padding: 0; margin: 0; } - -.dark-mode-switch { - min-width: 7rem; - position: fixed; - top: 0.5rem; - right: 0.6rem; - z-index: 55; -} - -aside { - border-right: 1px solid var(--ui-color-border-2); - overflow-y: auto; - background: var(--ui-color-background); - position: fixed; - width: var(--sidebar-width); - - left: 0; - top: 0; - height: 100lvh; - padding: 0 1rem calc(100lvh - 100svh); - - overscroll-behavior: contain; -} - -menu { - width: 100%; - display: flex; - flex-flow: column; - padding: 1rem 0 0; - margin: 0 0 2rem; -} - -menu h3 { - margin: 0 -1rem; - padding: var(--ui-margin-m) var(--ui-margin-l); - white-space: nowrap; - font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-size: var(--ui-font-xl); -} - -menu h3:not(:first-child) { margin-top: var(--ui-margin-l); } - -menu a { - color: var(--ui-color-text); - text-decoration: none; - display: block; - margin: var(--ui-margin-s) 0; - padding: var(--ui-margin-m) 1.4rem; - border-radius: var(--ui-border-radius); - white-space: nowrap; - touch-action: manipulation; -} - -menu a:hover { background-color: var(--ui-color-highlight-1); } -menu a.active { background-color: var(--ui-color-highlight); } - - -.nav-toggler { - --ui-button-size: 1.1em; - position: fixed; - left: 0; - top: 0.4rem; - z-index: 65; - color: var(--ui-color-text-1); - display: none; - transform: translateX(10px); -} -.nav-toggler:hover { color: var(--ui-color-text); background: none; } - -.btn-scroll-top { - position: fixed; - bottom: 1rem; - right: 1rem; - z-index: 999; -} -.btn-scroll-top.hidden { display: none; } - - -@media (1px <= width <= 700px) { - .nav-toggler { display: flex; } - .nav-toggler.expanded { transform: translateX(calc(var(--sidebar-width) - 40px)); } - - aside { - box-shadow: 2px 1px 10px #0006; - transform: translateX(calc(var(--sidebar-width) * -1)); - z-index: 60; - - --sidebar-elastic-padding: 80px; - width: calc(var(--sidebar-width) + var(--sidebar-elastic-padding)); - left: calc(var(--sidebar-elastic-padding) * -1); - padding-left: calc(var(--sidebar-elastic-padding) + 1rem); - - } - aside.expanded { transform: translateX(0); } - - .nav-toggler:not(.swiping), - aside:not(.swiping) { transition: transform .3s cubic-bezier(.5, .2, .5, 1.2); } -} - -.banner { - height: clamp(100px, 40vw, 360px); - padding-top: 60px; - display: flex; - align-items: flex-start; - justify-content: center; -} - -.banner a { - display: inline-flex; - align-items: center; - justify-content: center; - gap: 2vw; - margin: auto; - padding: 0; - text-decoration: none; -} - -.logo { - width: clamp(42px, 10vw, 160px); - height: clamp(42px, 10vw, 160px); - opacity: 0.9; - filter: drop-shadow(0 1px 1px #000); -} - - -.logotype { - font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-size: clamp(28px, 6vw, 90px); - font-weight: 100; - margin: 0; - padding: 0 4px 0 0; - display: flex; - flex-flow: row; - white-space: nowrap; - line-height: 1; - width: auto; -} - -.logotype em { font-weight: 500; } -.logotype sub { - font-size: var(--ui-font-m); - font-weight: 300; - color: var(--ui-color-text-semi); - margin: -1rem 0 0 -63px; - width: 60px; - text-align: right; -} - - -.banner a:hover .logotype span, -.banner a:hover .logotype em { - text-decoration: underline; - text-decoration-thickness: 1px; - text-decoration-skip-ink: none; - text-underline-offset: 8px; -} -.banner a:hover .logotype span { text-decoration-color: var(--ui-color-accent); } -.banner a:hover .logotype em { text-decoration-color: var(--ui-color-text); } - - - - - -.footer-links { - display: flex; - align-items: center; - justify-content: center; - gap: 5vw; - margin: 6rem 0 0; - height: 2rem; -} - -.footer-links a, -.footer-links a:hover { - text-decoration: none; - height: 100%; - display: flex; - align-items: center; - color: var(--ui-color-text-semi); - transition: color 0.1s; -} - -.footer-links a:hover { color: var(--ui-color-text); } - -.footer-links a svg { height: 2rem; width: 2rem; margin: 0; } -.footer-links a.npm svg { width: 5rem; } - - - - -.sticky-block { - background: var(--ui-color-background); - margin: 0; - padding: 0; -} - -main>h1, -main>h2, -.sticky-block>h1, -.sticky-block>h2 { - font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; - margin: 2rem -2rem 1rem; - padding: 0.5rem 100px 0.5rem 2rem; -} - -.prime-light { - font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; -} - -/* stylelint-disable-next-line no-descending-specificity */ -main>h2, -.sticky-block>h2 { - font-size: 1.8rem; - width: auto; - border-bottom: 1px solid var(--ui-color-border-2); - position: sticky; - top: 0; - z-index: 50; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - - -webkit-backdrop-filter: blur(15px); - backdrop-filter: blur(15px); -} - - - -/* stylelint-disable-next-line no-descending-specificity */ -main>h2 em { - color: var(--ui-color-text-semi); - font-size: 1.2rem; - line-height: 1.8rem; - margin-left: 0.5rem; - vertical-align: text-top; -} - -main>p code, -main>ul li code { - display: inline; - padding: 0; - margin: 0; - background: none; - color: var(--ui-color-accent); - font: inherit; - white-space: break-spaces; -} - - -@media (1px <= width <= 700px) { - main>h1, - main>h2, - .sticky-block>h1, - .sticky-block>h2 { padding-left: 54px; } -} - -.button-demo-props { - display: flex; - flex-flow: column; - align-items: flex-start; - justify-content: flex-start; - gap: 0.5rem; - width: clamp(300px, 600px, 100%); -} - -.button-demo-props .input { display: flex; flex-flow: row; width: 100%; } -.button-demo-props .input .label { width: 5rem; flex-shrink: 0; } -.button-demo-props .input .input-text-inner { flex: 1; } - - -.button-demo-props .toggle { display: flex; flex-flow: row; width: 100%; } -.button-demo-props .toggle .label { width: 5rem; flex-shrink: 0; } - -@media (1px <= width <= 700px) { - .button-demo-props { - width: 100%; - } -} - -.group { - background: var(--ui-color-background-2); - padding: 6px; - display: grid; - grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); - grid-gap: 6px; - border-radius: var(--ui-border-radius-m); -} - -.palette-box { - padding: 10px 0; - display: flex; - align-items: center; - justify-content: center; - overflow: hidden; - border-radius: calc(var(--ui-border-radius-m) - 3px); - background-color: var(--ui-color-background-2); -} - -.table-viewport { - width: 500px; - max-width: 100%; - height: 500px; - border: 2px dashed red; - padding: 5px; -} - -.icons { margin-bottom: 2em; } - -.icon-block { - float: left; - width: 128px; - height: 128px; - margin: 0 1em 1em 0; - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: stretch; - background-color: var(--ui-color-background-semi); - padding: 0 10px 10px; - border-radius: 5px; - border: 1px solid var(--ui-color-border); -} - -.icon-block-icon { - flex: 1; - display: flex; - align-items: center; - justify-content: center; -} - -.icon-block-icon svg { - width: 32px; - height: 32px; -} - -.icon-block-name { - height: 20px; - text-align: center; - overflow-wrap: break-word; - font-size: var(--ui-font-s) -} - -.div { - border: 1px dashed red; - height: 100px; - width: 200px; - display: inline-grid; - place-items: center; - margin: 1rem 1rem 1rem 0; - -webkit-user-select: none; - user-select: none; -} - - -.docs-menu-align-right { - padding: 2rem 0; - border: 1px dashed var(--ui-color-accent); - text-align: right; -} - -.notification-center-header { - margin-bottom: 1rem; - display: flex; - flex-flow: row; - align-items: center; - justify-content: flex-start; - gap: 2rem; -} - -.notification-center-header h2 { - display: inline-block; - width: auto; - padding: 0; - margin: 0; -} - - -.prop-row { - padding: 1rem 0; - display: flex; - align-items: center; - justify-content: flex-start; - gap: 1rem; -} - -.panel p { margin: 0; } - -.tooltip-box { - display: inline-block; - margin: 10px 0 0; - line-height: 2.4em; - padding: 1em; - border: 1px solid #ccc; - min-width: 6em; - text-align: center; -} - -.tooltip-html h1, -.tooltip-html p { margin: 0; } -.tooltip-html b { color: var(--ui-color-accent); } -.tooltip-html a:hover { text-decoration: none; } - -.split-wrap { - width: 400px; - height: 200px; - border: 1px solid red; - display: flex; - flex-flow: row; - position: relative; -} - -.split-wrap-v { flex-flow: column; } -.split-box { border: 1px solid green; flex: 1; } - -.min-w { min-width: 20px; max-width: 220px; } -.min-h { min-height: 50px; max-height: 150px; } - -.table-viewport { - width: 500px; - max-width: 100%; - height: 500px; - border: 2px dashed red; - padding: 5px; -} - -.tooltip-box { - display: inline-block; - margin: 10px 0 0; - line-height: 2.4em; - padding: 1em; - border: 1px solid #ccc; - min-width: 6em; - text-align: center; -} - -.tooltip-html h1, -.tooltip-html p { margin: 0; } -.tooltip-html b { color: var(--ui-color-accent); } -.tooltip-html a:hover { text-decoration: none; } - -.section-utils { - --nav-sidebar-width: 240px; -} -.section-utils .dark-mode-switch { right: calc(var(--nav-sidebar-width) + 20px); } - -.section-utils .sticky-block { padding-bottom: 3rem; margin-right: var(--nav-sidebar-width); } - - -.section-utils .sticky-block .utility h3 { - scroll-margin-top: 4.2rem; - font-size: 1.1rem; - color: var(--ui-color-accent); - font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace; -} - - -.section-utils .utilities-nav { - position: fixed; - right: 0; - top: 0; - bottom: 0; - z-index: 52; - margin: 0; - padding: 1rem 2rem; - overflow-y: auto; - width: var(--nav-sidebar-width); - border-left: 1px solid var(--ui-color-border-2); - background-color: var(--ui-color-background-input); -} - -.section-utils .utility { - margin: 0 -2rem; - padding: 1rem 2rem; - border-bottom: 1px solid var(--ui-color-border-2); -} - - -.section-utils .btn-scroll-top { right: calc(var(--nav-sidebar-width) + 20px); } - - -@media (1px <= width <= 900px) { - .section-utils .dark-mode-switch { right: 0.6rem; } - .section-utils .btn-scroll-top { right: 1rem; } - .section-utils .sticky-block { margin-right: 0; } - .section-utils .utilities-nav { - position: static; - border-left: none; - width: auto; - z-index: initial; - margin-top: 2rem; - background-color: unset; - } - -} - -.button-toggle-wrapper-wide { width: 400px; max-width: 100%; } -.button-toggle-wrapper-wide .button-toggle { width: 100%; } - -.toggle-box { - margin: 10px 0 0; - line-height: 2.4em; - display: none; -} - -.toggle-box.visible { - display: block; -} -/*# sourceMappingURL=docs.css.map */ +.api-table{height:unset;overflow:auto visible;overscroll-behavior-y:unset}.api-table table{min-width:900px}.api-table tr td{vertical-align:top;padding-block:0.5rem}.api-table tr td:first-child,.api-table tr th:first-child{width:200px}.api-table tr td:nth-child(2),.api-table tr th:nth-child(2){width:200px}.api-table tr td:last-child,.api-table tr th:last-child{min-width:400px}body,html{margin:0;background-color:var(--ui-color-background);color:var(--ui-color-text);--sidebar-width:220px}@font-face{font-family:'Prime Light';src:url('prime_light-webfont.woff2') format('woff2'),url('prime_light-webfont.woff') format('woff');font-weight:light;font-style:normal}a{color:inherit}a:hover{text-decoration-color:var(--ui-color-accent);text-decoration-thickness:2px;text-underline-offset:0.3rem}main{padding:0 2rem 8rem;margin-left:var(--sidebar-width)}h1,h2,h3{font-weight:500;margin:2rem 0 1.2rem;width:100%}h1:first-child,h2:first-child,h3:first-of-type{margin-top:0}p{line-height:1.7;margin-block:1.5rem;max-width:120ch}p b{font-weight:700;letter-spacing:.5px}ul{line-height:1.7;margin:0;padding-left:2rem}ul li{margin-block:0.5rem}p+ul{margin-top:-1rem}em{color:var(--ui-color-accent);font-style:normal}hr{width:100%;height:0;border:0;border-top:1px solid var(--ui-color-border-2);margin:3em 0 2em}.docs-overflow-box{border:2px dotted var(--ui-color-accent);background-color:var(--ui-color-background);padding:1em;overflow:hidden;z-index:1;position:relative}.docs-buttons-row{display:flex;flex-flow:wrap row;align-items:flex-start;justify-content:flex-start;gap:.5rem;flex-shrink:0}@media (1px <= width <= 700px){main{margin-left:0}}code,main pre[class]{background-color:#1a1a1a;color:#ccc;border-radius:var(--ui-border-radius);font-size:var(--ui-font-s)}code{display:block;width:100%;padding:1em;margin-block:1em;line-height:2;white-space:pre;overflow:auto}code[class*=language-]{padding:0;margin:0}.dark-mode-switch{min-width:7rem;position:fixed;top:.5rem;right:.6rem;z-index:55}aside{border-right:1px solid var(--ui-color-border-2);overflow-y:auto;background:var(--ui-color-background);position:fixed;width:var(--sidebar-width);left:0;top:0;height:100lvh;padding:0 1rem calc(100lvh - 100svh);overscroll-behavior:contain}menu{width:100%;display:flex;flex-flow:column;padding:1rem 0 0;margin:0 0 2rem}menu h3{margin:0 -1rem;padding:var(--ui-margin-m) var(--ui-margin-l);white-space:nowrap;font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:var(--ui-font-xl)}menu h3:not(:first-child){margin-top:var(--ui-margin-l)}menu a{color:var(--ui-color-text);text-decoration:none;display:block;margin:var(--ui-margin-s) 0;padding:var(--ui-margin-m) 1.4rem;border-radius:var(--ui-border-radius);white-space:nowrap;touch-action:manipulation}menu a:hover{background-color:var(--ui-color-highlight-1)}menu a.active{background-color:var(--ui-color-highlight)}.nav-toggler{--ui-button-size:1.1em;position:fixed;left:0;top:.4rem;z-index:65;color:var(--ui-color-text-1);display:none;transform:translateX(10px)}.nav-toggler:hover{color:var(--ui-color-text);background:0 0}.btn-scroll-top{position:fixed;bottom:1rem;right:1rem;z-index:999}.btn-scroll-top.hidden{display:none}@media (1px <= width <= 700px){.nav-toggler{display:flex}.nav-toggler.expanded{transform:translateX(calc(var(--sidebar-width) - 40px))}aside{box-shadow:2px 1px 10px #0006;transform:translateX(calc(var(--sidebar-width) * -1));z-index:60;--sidebar-elastic-padding:80px;width:calc(var(--sidebar-width) + var(--sidebar-elastic-padding));left:calc(var(--sidebar-elastic-padding) * -1);padding-left:calc(var(--sidebar-elastic-padding) + 1rem)}aside.expanded{transform:translateX(0)}.nav-toggler:not(.swiping),aside:not(.swiping){transition:transform .3s cubic-bezier(.5, .2, .5, 1.2)}}.banner{height:clamp(100px,40vw,360px);padding-top:60px;display:flex;align-items:flex-start;justify-content:center}.banner a{display:inline-flex;align-items:center;justify-content:center;gap:2vw;margin:auto;padding:0;text-decoration:none}.logo{width:clamp(42px,10vw,160px);height:clamp(42px,10vw,160px);opacity:.9;filter:drop-shadow(0 1px 1px #000)}.logotype{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:clamp(28px, 6vw, 90px);font-weight:100;margin:0;padding:0 4px 0 0;display:flex;flex-flow:row;white-space:nowrap;line-height:1;width:auto}.logotype em{font-weight:500}.logotype sub{font-size:var(--ui-font-m);font-weight:300;color:var(--ui-color-text-semi);margin:-1rem 0 0 -63px;width:60px;text-align:right}.banner a:hover .logotype em,.banner a:hover .logotype span{text-decoration:underline;text-decoration-thickness:1px;text-decoration-skip-ink:none;text-underline-offset:8px}.banner a:hover .logotype span{text-decoration-color:var(--ui-color-accent)}.banner a:hover .logotype em{text-decoration-color:var(--ui-color-text)}.footer-links{display:flex;align-items:center;justify-content:center;gap:5vw;margin:6rem 0 0;height:2rem}.footer-links a,.footer-links a:hover{text-decoration:none;height:100%;display:flex;align-items:center;color:var(--ui-color-text-semi);transition:color .1s}.footer-links a:hover{color:var(--ui-color-text)}.footer-links a svg{height:2rem;width:2rem;margin:0}.footer-links a.npm svg{width:5rem}.sticky-block{background:var(--ui-color-background);margin:0;padding:0}.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;margin:2rem -2rem 1rem;padding:.5rem 100px .5rem 2rem}.prime-light{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif}.sticky-block>h2,main>h2{font-size:1.8rem;width:auto;border-bottom:1px solid var(--ui-color-border-2);position:sticky;top:0;z-index:50;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}main>h2 em{color:var(--ui-color-text-semi);font-size:1.2rem;line-height:1.8rem;margin-left:.5rem;vertical-align:text-top}main>p code,main>ul li code{display:inline;padding:0;margin:0;background:0 0;color:var(--ui-color-accent);font:inherit;white-space:break-spaces}@media (1px <= width <= 700px){.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{padding-left:54px}}.button-demo-props{display:flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem;width:clamp(300px,600px,100%)}.button-demo-props .input{display:flex;flex-flow:row;width:100%}.button-demo-props .input .label{width:5rem;flex-shrink:0}.button-demo-props .input .input-text-inner{flex:1}.button-demo-props .toggle{display:flex;flex-flow:row;width:100%}.button-demo-props .toggle .label{width:5rem;flex-shrink:0}@media (1px <= width <= 700px){.button-demo-props{width:100%}}.group{background:var(--ui-color-background-2);padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-gap:6px;border-radius:var(--ui-border-radius-m)}.palette-box{padding:10px 0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(var(--ui-border-radius-m) - 3px);background-color:var(--ui-color-background-2)}.table-viewport{width:500px;max-width:100%;height:500px;border:2px dashed red;padding:5px}.icons{margin-bottom:2em}.icon-block{float:left;width:128px;height:128px;margin:0 1em 1em 0;display:flex;flex-flow:column;align-items:stretch;justify-content:stretch;background-color:var(--ui-color-background-semi);padding:0 10px 10px;border-radius:5px;border:1px solid var(--ui-color-border)}.icon-block-icon{flex:1;display:flex;align-items:center;justify-content:center}.icon-block-icon svg{width:32px;height:32px}.icon-block-name{height:20px;text-align:center;overflow-wrap:break-word;font-size:var(--ui-font-s)}.div{border:1px dashed red;height:100px;width:200px;display:inline-grid;place-items:center;margin:1rem 1rem 1rem 0;-webkit-user-select:none;user-select:none}.docs-menu-align-right{padding:2rem 0;border:1px dashed var(--ui-color-accent);text-align:right}.notification-center-header{margin-bottom:1rem;display:flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:2rem}.notification-center-header h2{display:inline-block;width:auto;padding:0;margin:0}.prop-row{padding:1rem 0;display:flex;align-items:center;justify-content:flex-start;gap:1rem}.panel p{margin:0}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.split-wrap{width:400px;height:200px;border:1px solid red;display:flex;flex-flow:row;position:relative}.split-wrap-v{flex-flow:column}.split-box{border:1px solid green;flex:1}.min-w{min-width:20px;max-width:220px}.min-h{min-height:50px;max-height:150px}.table-viewport{width:500px;max-width:100%;height:500px;border:2px dashed red;padding:5px}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.section-utils{--nav-sidebar-width:240px}.section-utils .dark-mode-switch{right:calc(var(--nav-sidebar-width) + 20px)}.section-utils .sticky-block{padding-bottom:3rem;margin-right:var(--nav-sidebar-width)}.section-utils .sticky-block .utility h3{scroll-margin-top:4.2rem;font-size:1.1rem;color:var(--ui-color-accent);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace}.section-utils .utilities-nav{position:fixed;right:0;top:0;bottom:0;z-index:52;margin:0;padding:1rem 2rem;overflow-y:auto;width:var(--nav-sidebar-width);border-left:1px solid var(--ui-color-border-2);background-color:var(--ui-color-background-input)}.section-utils .utility{margin:0 -2rem;padding:1rem 2rem;border-bottom:1px solid var(--ui-color-border-2)}.section-utils .btn-scroll-top{right:calc(var(--nav-sidebar-width) + 20px)}@media (1px <= width <= 900px){.section-utils .dark-mode-switch{right:.6rem}.section-utils .btn-scroll-top{right:1rem}.section-utils .sticky-block{margin-right:0}.section-utils .utilities-nav{position:static;border-left:none;width:auto;z-index:initial;margin-top:2rem;background-color:unset}}.button-toggle-wrapper-wide{width:400px;max-width:100%}.button-toggle-wrapper-wide .button-toggle{width:100%}.toggle-box{margin:10px 0 0;line-height:2.4em;display:none}.toggle-box.visible{display:block} \ No newline at end of file diff --git a/docs/docs.js b/docs/docs.js index 40318ca6..39c392dc 100644 --- a/docs/docs.js +++ b/docs/docs.js @@ -1,50928 +1,68 @@ -var __create = Object.create; -var __defProp = Object.defineProperty; -var __getOwnPropDesc = Object.getOwnPropertyDescriptor; -var __getOwnPropNames = Object.getOwnPropertyNames; -var __getProtoOf = Object.getPrototypeOf; -var __hasOwnProp = Object.prototype.hasOwnProperty; -var __commonJS = (cb, mod) => function __require() { - return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; -}; -var __export = (target, all) => { - for (var name2 in all) - __defProp(target, name2, { get: all[name2], enumerable: true }); -}; -var __copyProps = (to, from, except, desc) => { - if (from && typeof from === "object" || typeof from === "function") { - for (let key of __getOwnPropNames(from)) - if (!__hasOwnProp.call(to, key) && key !== except) - __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); - } - return to; -}; -var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( - // If the importer is in node compatibility mode or this is not an ESM - // file that has been converted to a CommonJS file using a Babel- - // compatible transform (i.e. "__esModule" has not been set), then set - // "default" to the CommonJS "module.exports" for node compatibility. - isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, - mod -)); - -// node_modules/vanilla-swipe/lib/types/index.js -var require_types = __commonJS({ - "node_modules/vanilla-swipe/lib/types/index.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.TraceDirectionKey = exports.Direction = exports.Axis = void 0; - var TraceDirectionKey; - exports.TraceDirectionKey = TraceDirectionKey; - (function(TraceDirectionKey2) { - TraceDirectionKey2["NEGATIVE"] = "NEGATIVE"; - TraceDirectionKey2["POSITIVE"] = "POSITIVE"; - TraceDirectionKey2["NONE"] = "NONE"; - })(TraceDirectionKey || (exports.TraceDirectionKey = TraceDirectionKey = {})); - var Direction; - exports.Direction = Direction; - (function(Direction2) { - Direction2["TOP"] = "TOP"; - Direction2["LEFT"] = "LEFT"; - Direction2["RIGHT"] = "RIGHT"; - Direction2["BOTTOM"] = "BOTTOM"; - Direction2["NONE"] = "NONE"; - })(Direction || (exports.Direction = Direction = {})); - var Axis; - exports.Axis = Axis; - (function(Axis2) { - Axis2["X"] = "x"; - Axis2["Y"] = "y"; - })(Axis || (exports.Axis = Axis = {})); - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateDirection.js -var require_calculateDirection = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateDirection.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateDirection = calculateDirection; - var _types = require_types(); - function calculateDirection(trace) { - var direction; - var negative = _types.TraceDirectionKey.NEGATIVE; - var positive = _types.TraceDirectionKey.POSITIVE; - var current = trace[trace.length - 1]; - var previous = trace[trace.length - 2] || 0; - if (trace.every(function(i) { - return i === 0; - })) { - return _types.TraceDirectionKey.NONE; - } - direction = current > previous ? positive : negative; - if (current === 0) { - direction = previous < 0 ? positive : negative; - } - return direction; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/common.js -var require_common = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/common.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.resolveAxisDirection = exports.getDirectionValue = exports.getDirectionKey = exports.getDifference = void 0; - var _types = require_types(); - var getDirectionKey = function getDirectionKey2() { - var object = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; - var key = Object.keys(object).toString(); - switch (key) { - case _types.TraceDirectionKey.POSITIVE: - return _types.TraceDirectionKey.POSITIVE; - case _types.TraceDirectionKey.NEGATIVE: - return _types.TraceDirectionKey.NEGATIVE; - default: - return _types.TraceDirectionKey.NONE; - } - }; - exports.getDirectionKey = getDirectionKey; - var getDirectionValue = function getDirectionValue2() { - var values = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; - return values[values.length - 1] || 0; - }; - exports.getDirectionValue = getDirectionValue; - var getDifference = function getDifference2() { - var x = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; - var y = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; - return Math.abs(x - y); - }; - exports.getDifference = getDifference; - var resolveAxisDirection = function resolveAxisDirection2(axis, key) { - var negative = _types.Direction.LEFT; - var positive = _types.Direction.RIGHT; - var direction = _types.Direction.NONE; - if (axis === _types.Axis.Y) { - negative = _types.Direction.BOTTOM; - positive = _types.Direction.TOP; - } - if (key === _types.TraceDirectionKey.NEGATIVE) { - direction = negative; - } - if (key === _types.TraceDirectionKey.POSITIVE) { - direction = positive; - } - return direction; - }; - exports.resolveAxisDirection = resolveAxisDirection; - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js -var require_calculateDirectionDelta = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateDirectionDelta = calculateDirectionDelta; - var _types = require_types(); - var _common = require_common(); - function calculateDirectionDelta(traceDirections) { - var delta = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; - var length = traceDirections.length; - var i = length - 1; - var direction = _types.TraceDirectionKey.NONE; - for (; i >= 0; i--) { - var current = traceDirections[i]; - var currentKey = (0, _common.getDirectionKey)(current); - var currentValue = (0, _common.getDirectionValue)(current[currentKey]); - var prev = traceDirections[i - 1] || {}; - var prevKey = (0, _common.getDirectionKey)(prev); - var prevValue = (0, _common.getDirectionValue)(prev[prevKey]); - var difference = (0, _common.getDifference)(currentValue, prevValue); - if (difference >= delta) { - direction = currentKey; - break; - } else { - direction = prevKey; - } - } - return direction; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateDuration.js -var require_calculateDuration = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateDuration.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateDuration = calculateDuration; - function calculateDuration() { - var prevTime = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; - var nextTime = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; - return prevTime ? nextTime - prevTime : 0; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js -var require_calculateMovingPosition = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateMovingPosition = calculateMovingPosition; - function calculateMovingPosition(e) { - if ("changedTouches" in e) { - var touches = e.changedTouches && e.changedTouches[0]; - return { - x: touches && touches.clientX, - y: touches && touches.clientY - }; - } - return { - x: e.clientX, - y: e.clientY - }; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/updateTrace.js -var require_updateTrace = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/updateTrace.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.updateTrace = updateTrace; - function updateTrace(trace, value2) { - var last = trace[trace.length - 1]; - if (last !== value2) { - trace.push(value2); - } - return trace; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js -var require_calculateTraceDirections = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateTraceDirections = calculateTraceDirections; - var _types = require_types(); - function _defineProperty(obj, key, value2) { - if (key in obj) { - Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); - } else { - obj[key] = value2; - } - return obj; - } - function calculateTraceDirections() { - var trace = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; - var ticks = []; - var positive = _types.TraceDirectionKey.POSITIVE; - var negative = _types.TraceDirectionKey.NEGATIVE; - var i = 0; - var tick2 = []; - var direction = _types.TraceDirectionKey.NONE; - for (; i < trace.length; i++) { - var current = trace[i]; - var prev = trace[i - 1]; - if (tick2.length) { - var currentDirection = current > prev ? positive : negative; - if (direction === _types.TraceDirectionKey.NONE) { - direction = currentDirection; - } - if (currentDirection === direction) { - tick2.push(current); - } else { - ticks.push(_defineProperty({}, direction, tick2.slice())); - tick2 = []; - tick2.push(current); - direction = currentDirection; - } - } else { - if (current !== 0) { - direction = current > 0 ? positive : negative; - } - tick2.push(current); - } - } - if (tick2.length) { - ticks.push(_defineProperty({}, direction, tick2)); - } - return ticks; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/resolveDirection.js -var require_resolveDirection = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/resolveDirection.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.resolveDirection = resolveDirection; - var _calculateDirection = require_calculateDirection(); - var _calculateTraceDirections = require_calculateTraceDirections(); - var _calculateDirectionDelta = require_calculateDirectionDelta(); - var _common = require_common(); - var _types = require_types(); - function resolveDirection(trace) { - var axis = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : _types.Axis.X; - var directionDelta = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 0; - if (directionDelta) { - var directions = (0, _calculateTraceDirections.calculateTraceDirections)(trace); - var _direction = (0, _calculateDirectionDelta.calculateDirectionDelta)(directions, directionDelta); - return (0, _common.resolveAxisDirection)(axis, _direction); - } - var direction = (0, _calculateDirection.calculateDirection)(trace); - return (0, _common.resolveAxisDirection)(axis, direction); - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculateVelocity.js -var require_calculateVelocity = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculateVelocity.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculateVelocity = calculateVelocity; - function calculateVelocity(x, y, time) { - var magnitude = Math.sqrt(x * x + y * y); - return magnitude / (time || 1); - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/calculatePosition.js -var require_calculatePosition = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/calculatePosition.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.calculatePosition = calculatePosition; - var _updateTrace = require_updateTrace(); - var _resolveDirection = require_resolveDirection(); - var _calculateDuration = require_calculateDuration(); - var _calculateVelocity = require_calculateVelocity(); - var _types = require_types(); - function calculatePosition(state, options) { - var start = state.start, x = state.x, y = state.y, traceX = state.traceX, traceY = state.traceY; - var rotatePosition = options.rotatePosition, directionDelta = options.directionDelta; - var deltaX = rotatePosition.x - x; - var deltaY = y - rotatePosition.y; - var absX = Math.abs(deltaX); - var absY = Math.abs(deltaY); - (0, _updateTrace.updateTrace)(traceX, deltaX); - (0, _updateTrace.updateTrace)(traceY, deltaY); - var directionX = (0, _resolveDirection.resolveDirection)(traceX, _types.Axis.X, directionDelta); - var directionY = (0, _resolveDirection.resolveDirection)(traceY, _types.Axis.Y, directionDelta); - var duration2 = (0, _calculateDuration.calculateDuration)(start, Date.now()); - var velocity = (0, _calculateVelocity.calculateVelocity)(absX, absY, duration2); - return { - absX, - absY, - deltaX, - deltaY, - directionX, - directionY, - duration: duration2, - positionX: rotatePosition.x, - positionY: rotatePosition.y, - velocity - }; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js -var require_checkIsMoreThanSingleTouches = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.checkIsMoreThanSingleTouches = void 0; - var checkIsMoreThanSingleTouches = function checkIsMoreThanSingleTouches2(e) { - return Boolean(e.touches && e.touches.length > 1); - }; - exports.checkIsMoreThanSingleTouches = checkIsMoreThanSingleTouches; - } -}); - -// node_modules/vanilla-swipe/lib/utils/createOptions.js -var require_createOptions = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/createOptions.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.createOptions = createOptions; - function createOptions() { - var proxy = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; - Object.defineProperty(proxy, "passive", { - get: function get() { - this.isPassiveSupported = true; - return true; - }, - enumerable: true - }); - return proxy; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js -var require_checkIsPassiveSupported = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.checkIsPassiveSupported = checkIsPassiveSupported; - exports.noop = void 0; - var _createOptions = require_createOptions(); - function checkIsPassiveSupported(isPassiveSupported) { - if (typeof isPassiveSupported === "boolean") { - return isPassiveSupported; - } - var proxy = { - isPassiveSupported - }; - try { - var options = (0, _createOptions.createOptions)(proxy); - window.addEventListener("checkIsPassiveSupported", noop2, options); - window.removeEventListener("checkIsPassiveSupported", noop2, options); - } catch (err) { - } - return proxy.isPassiveSupported; - } - var noop2 = function noop3() { - }; - exports.noop = noop2; - } -}); - -// node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js -var require_checkIsTouchEventsSupported = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.checkIsTouchEventsSupported = void 0; - function _typeof(obj) { - "@babel/helpers - typeof"; - return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { - return typeof obj2; - } : function(obj2) { - return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; - }, _typeof(obj); - } - var checkIsTouchEventsSupported = function checkIsTouchEventsSupported2() { - return (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object" && ("ontouchstart" in window || Boolean(window.navigator.maxTouchPoints)); - }; - exports.checkIsTouchEventsSupported = checkIsTouchEventsSupported; - } -}); - -// node_modules/vanilla-swipe/lib/utils/getInitialState.js -var require_getInitialState = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/getInitialState.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.getInitialState = void 0; - function ownKeys(object, enumerableOnly) { - var keys = Object.keys(object); - if (Object.getOwnPropertySymbols) { - var symbols = Object.getOwnPropertySymbols(object); - enumerableOnly && (symbols = symbols.filter(function(sym) { - return Object.getOwnPropertyDescriptor(object, sym).enumerable; - })), keys.push.apply(keys, symbols); - } - return keys; - } - function _objectSpread(target) { - for (var i = 1; i < arguments.length; i++) { - var source = null != arguments[i] ? arguments[i] : {}; - i % 2 ? ownKeys(Object(source), true).forEach(function(key) { - _defineProperty(target, key, source[key]); - }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { - Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); - }); - } - return target; - } - function _defineProperty(obj, key, value2) { - if (key in obj) { - Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); - } else { - obj[key] = value2; - } - return obj; - } - var getInitialState = function getInitialState2() { - var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; - return _objectSpread({ - x: 0, - y: 0, - start: 0, - isSwiping: false, - traceX: [], - traceY: [] - }, options); - }; - exports.getInitialState = getInitialState; - } -}); - -// node_modules/vanilla-swipe/lib/utils/getInitialProps.js -var require_getInitialProps = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/getInitialProps.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.getInitialProps = void 0; - function ownKeys(object, enumerableOnly) { - var keys = Object.keys(object); - if (Object.getOwnPropertySymbols) { - var symbols = Object.getOwnPropertySymbols(object); - enumerableOnly && (symbols = symbols.filter(function(sym) { - return Object.getOwnPropertyDescriptor(object, sym).enumerable; - })), keys.push.apply(keys, symbols); - } - return keys; - } - function _objectSpread(target) { - for (var i = 1; i < arguments.length; i++) { - var source = null != arguments[i] ? arguments[i] : {}; - i % 2 ? ownKeys(Object(source), true).forEach(function(key) { - _defineProperty(target, key, source[key]); - }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { - Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); - }); - } - return target; - } - function _defineProperty(obj, key, value2) { - if (key in obj) { - Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); - } else { - obj[key] = value2; - } - return obj; - } - var getInitialProps = function getInitialProps2() { - var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; - return _objectSpread({ - element: null, - target: null, - delta: 10, - directionDelta: 0, - rotationAngle: 0, - mouseTrackingEnabled: false, - touchTrackingEnabled: true, - preventDefaultTouchmoveEvent: false, - preventTrackingOnMouseleave: false - }, props); - }; - exports.getInitialProps = getInitialProps; - } -}); - -// node_modules/vanilla-swipe/lib/utils/getOptions.js -var require_getOptions = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/getOptions.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.getOptions = getOptions; - function getOptions() { - var isPassiveSupported = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false; - if (isPassiveSupported) { - return { - passive: false - }; - } - return {}; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/rotateByAngle.js -var require_rotateByAngle = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/rotateByAngle.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - exports.rotateByAngle = rotateByAngle; - function rotateByAngle(position) { - var angle = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; - if (angle === 0) { - return position; - } - var x = position.x, y = position.y; - var angleInRadians = Math.PI / 180 * angle; - var rotatedX = x * Math.cos(angleInRadians) + y * Math.sin(angleInRadians); - var rotatedY = y * Math.cos(angleInRadians) - x * Math.sin(angleInRadians); - return { - x: rotatedX, - y: rotatedY - }; - } - } -}); - -// node_modules/vanilla-swipe/lib/utils/index.js -var require_utils = __commonJS({ - "node_modules/vanilla-swipe/lib/utils/index.js"(exports) { - "use strict"; - Object.defineProperty(exports, "__esModule", { - value: true - }); - var _calculateDirection = require_calculateDirection(); - Object.keys(_calculateDirection).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateDirection[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateDirection[key]; - } - }); - }); - var _calculateDirectionDelta = require_calculateDirectionDelta(); - Object.keys(_calculateDirectionDelta).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateDirectionDelta[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateDirectionDelta[key]; - } - }); - }); - var _calculateDuration = require_calculateDuration(); - Object.keys(_calculateDuration).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateDuration[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateDuration[key]; - } - }); - }); - var _calculateMovingPosition = require_calculateMovingPosition(); - Object.keys(_calculateMovingPosition).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateMovingPosition[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateMovingPosition[key]; - } - }); - }); - var _calculatePosition = require_calculatePosition(); - Object.keys(_calculatePosition).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculatePosition[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculatePosition[key]; - } - }); - }); - var _calculateTraceDirections = require_calculateTraceDirections(); - Object.keys(_calculateTraceDirections).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateTraceDirections[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateTraceDirections[key]; - } - }); - }); - var _calculateVelocity = require_calculateVelocity(); - Object.keys(_calculateVelocity).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _calculateVelocity[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _calculateVelocity[key]; - } - }); - }); - var _checkIsMoreThanSingleTouches = require_checkIsMoreThanSingleTouches(); - Object.keys(_checkIsMoreThanSingleTouches).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _checkIsMoreThanSingleTouches[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _checkIsMoreThanSingleTouches[key]; - } - }); - }); - var _checkIsPassiveSupported = require_checkIsPassiveSupported(); - Object.keys(_checkIsPassiveSupported).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _checkIsPassiveSupported[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _checkIsPassiveSupported[key]; - } - }); - }); - var _checkIsTouchEventsSupported = require_checkIsTouchEventsSupported(); - Object.keys(_checkIsTouchEventsSupported).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _checkIsTouchEventsSupported[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _checkIsTouchEventsSupported[key]; - } - }); - }); - var _common = require_common(); - Object.keys(_common).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _common[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _common[key]; - } - }); - }); - var _createOptions = require_createOptions(); - Object.keys(_createOptions).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _createOptions[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _createOptions[key]; - } - }); - }); - var _getInitialState = require_getInitialState(); - Object.keys(_getInitialState).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _getInitialState[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _getInitialState[key]; - } - }); - }); - var _getInitialProps = require_getInitialProps(); - Object.keys(_getInitialProps).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _getInitialProps[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _getInitialProps[key]; - } - }); - }); - var _getOptions = require_getOptions(); - Object.keys(_getOptions).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _getOptions[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _getOptions[key]; - } - }); - }); - var _resolveDirection = require_resolveDirection(); - Object.keys(_resolveDirection).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _resolveDirection[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _resolveDirection[key]; - } - }); - }); - var _rotateByAngle = require_rotateByAngle(); - Object.keys(_rotateByAngle).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _rotateByAngle[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _rotateByAngle[key]; - } - }); - }); - var _updateTrace = require_updateTrace(); - Object.keys(_updateTrace).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (key in exports && exports[key] === _updateTrace[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _updateTrace[key]; - } - }); - }); - } -}); - -// node_modules/vanilla-swipe/lib/index.js -var require_lib = __commonJS({ - "node_modules/vanilla-swipe/lib/index.js"(exports) { - "use strict"; - function _typeof(obj) { - "@babel/helpers - typeof"; - return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { - return typeof obj2; - } : function(obj2) { - return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; - }, _typeof(obj); - } - Object.defineProperty(exports, "__esModule", { - value: true - }); - var _exportNames = {}; - exports["default"] = void 0; - var Utils2 = _interopRequireWildcard(require_utils()); - var _types = require_types(); - Object.keys(_types).forEach(function(key) { - if (key === "default" || key === "__esModule") - return; - if (Object.prototype.hasOwnProperty.call(_exportNames, key)) - return; - if (key in exports && exports[key] === _types[key]) - return; - Object.defineProperty(exports, key, { - enumerable: true, - get: function get() { - return _types[key]; - } - }); - }); - function _getRequireWildcardCache(nodeInterop) { - if (typeof WeakMap !== "function") - return null; - var cacheBabelInterop = /* @__PURE__ */ new WeakMap(); - var cacheNodeInterop = /* @__PURE__ */ new WeakMap(); - return (_getRequireWildcardCache = function _getRequireWildcardCache2(nodeInterop2) { - return nodeInterop2 ? cacheNodeInterop : cacheBabelInterop; - })(nodeInterop); - } - function _interopRequireWildcard(obj, nodeInterop) { - if (!nodeInterop && obj && obj.__esModule) { - return obj; - } - if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { - return { "default": obj }; - } - var cache = _getRequireWildcardCache(nodeInterop); - if (cache && cache.has(obj)) { - return cache.get(obj); - } - var newObj = {}; - var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; - for (var key in obj) { - if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { - var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; - if (desc && (desc.get || desc.set)) { - Object.defineProperty(newObj, key, desc); - } else { - newObj[key] = obj[key]; - } - } - } - newObj["default"] = obj; - if (cache) { - cache.set(obj, newObj); - } - return newObj; - } - function _classCallCheck(instance122, Constructor) { - if (!(instance122 instanceof Constructor)) { - throw new TypeError("Cannot call a class as a function"); - } - } - function _defineProperties(target, props) { - for (var i = 0; i < props.length; i++) { - var descriptor = props[i]; - descriptor.enumerable = descriptor.enumerable || false; - descriptor.configurable = true; - if ("value" in descriptor) - descriptor.writable = true; - Object.defineProperty(target, descriptor.key, descriptor); - } - } - function _createClass(Constructor, protoProps, staticProps) { - if (protoProps) - _defineProperties(Constructor.prototype, protoProps); - if (staticProps) - _defineProperties(Constructor, staticProps); - Object.defineProperty(Constructor, "prototype", { writable: false }); - return Constructor; - } - function _defineProperty(obj, key, value2) { - if (key in obj) { - Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); - } else { - obj[key] = value2; - } - return obj; - } - var VanillaSwipe2 = /* @__PURE__ */ function() { - function VanillaSwipe3(props) { - _classCallCheck(this, VanillaSwipe3); - _defineProperty(this, "state", void 0); - _defineProperty(this, "props", void 0); - this.state = Utils2.getInitialState(); - this.props = Utils2.getInitialProps(props); - this.handleSwipeStart = this.handleSwipeStart.bind(this); - this.handleSwipeMove = this.handleSwipeMove.bind(this); - this.handleSwipeEnd = this.handleSwipeEnd.bind(this); - this.handleMouseDown = this.handleMouseDown.bind(this); - this.handleMouseMove = this.handleMouseMove.bind(this); - this.handleMouseUp = this.handleMouseUp.bind(this); - this.handleMouseLeave = this.handleMouseLeave.bind(this); - } - _createClass(VanillaSwipe3, [{ - key: "init", - value: function init3() { - this.setupTouchListeners(); - this.setupMouseListeners(); - } - }, { - key: "update", - value: function update2(props) { - var prevProps = this.props; - var nextProps = Object.assign({}, prevProps, props); - if (prevProps.element !== nextProps.element || prevProps.target !== nextProps.target) { - this.destroy(); - this.props = nextProps; - this.init(); - return; - } - this.props = nextProps; - if (prevProps.mouseTrackingEnabled !== nextProps.mouseTrackingEnabled || prevProps.preventTrackingOnMouseleave !== nextProps.preventTrackingOnMouseleave) { - this.cleanupMouseListeners(); - nextProps.mouseTrackingEnabled ? this.setupMouseListeners() : this.cleanupMouseListeners(); - } - if (prevProps.touchTrackingEnabled !== nextProps.touchTrackingEnabled) { - this.cleanupTouchListeners(); - nextProps.touchTrackingEnabled ? this.setupTouchListeners() : this.cleanupTouchListeners(); - } - } - }, { - key: "destroy", - value: function destroy() { - this.cleanupMouseListeners(); - this.cleanupTouchListeners(); - this.state = Utils2.getInitialState(); - this.props = Utils2.getInitialProps(); - } - }, { - key: "setupTouchListeners", - value: function setupTouchListeners() { - var _this$props = this.props, element3 = _this$props.element, target = _this$props.target, touchTrackingEnabled = _this$props.touchTrackingEnabled; - if (element3 && touchTrackingEnabled) { - var listener = target || element3; - var isPassiveSupported = Utils2.checkIsPassiveSupported(); - var options = Utils2.getOptions(isPassiveSupported); - listener.addEventListener("touchstart", this.handleSwipeStart, options); - listener.addEventListener("touchmove", this.handleSwipeMove, options); - listener.addEventListener("touchend", this.handleSwipeEnd, options); - } - } - }, { - key: "cleanupTouchListeners", - value: function cleanupTouchListeners() { - var _this$props2 = this.props, element3 = _this$props2.element, target = _this$props2.target; - var listener = target || element3; - if (listener) { - listener.removeEventListener("touchstart", this.handleSwipeStart); - listener.removeEventListener("touchmove", this.handleSwipeMove); - listener.removeEventListener("touchend", this.handleSwipeEnd); - } - } - }, { - key: "setupMouseListeners", - value: function setupMouseListeners() { - var _this$props3 = this.props, element3 = _this$props3.element, mouseTrackingEnabled = _this$props3.mouseTrackingEnabled, preventTrackingOnMouseleave = _this$props3.preventTrackingOnMouseleave; - if (mouseTrackingEnabled && element3) { - element3.addEventListener("mousedown", this.handleMouseDown); - element3.addEventListener("mousemove", this.handleMouseMove); - element3.addEventListener("mouseup", this.handleMouseUp); - if (preventTrackingOnMouseleave) { - element3.addEventListener("mouseleave", this.handleMouseLeave); - } - } - } - }, { - key: "cleanupMouseListeners", - value: function cleanupMouseListeners() { - var element3 = this.props.element; - if (element3) { - element3.removeEventListener("mousedown", this.handleMouseDown); - element3.removeEventListener("mousemove", this.handleMouseMove); - element3.removeEventListener("mouseup", this.handleMouseUp); - element3.removeEventListener("mouseleave", this.handleMouseLeave); - } - } - }, { - key: "getEventData", - value: function getEventData(e) { - var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : { - directionDelta: 0 - }; - var rotationAngle = this.props.rotationAngle; - var directionDelta = options.directionDelta; - var movingPosition = Utils2.calculateMovingPosition(e); - var rotatePosition = Utils2.rotateByAngle(movingPosition, rotationAngle); - return Utils2.calculatePosition(this.state, { - rotatePosition, - directionDelta - }); - } - }, { - key: "handleSwipeStart", - value: function handleSwipeStart(e) { - if (Utils2.checkIsMoreThanSingleTouches(e)) - return; - var rotationAngle = this.props.rotationAngle; - var movingPosition = Utils2.calculateMovingPosition(e); - var _Utils$rotateByAngle = Utils2.rotateByAngle(movingPosition, rotationAngle), x = _Utils$rotateByAngle.x, y = _Utils$rotateByAngle.y; - this.state = Utils2.getInitialState({ - isSwiping: false, - start: Date.now(), - x, - y - }); - } - }, { - key: "handleSwipeMove", - value: function handleSwipeMove(e) { - var _this$state = this.state, x = _this$state.x, y = _this$state.y, isSwiping = _this$state.isSwiping; - if (!x || !y || Utils2.checkIsMoreThanSingleTouches(e)) - return; - var directionDelta = this.props.directionDelta || 0; - var _this$getEventData = this.getEventData(e, { - directionDelta - }), absX = _this$getEventData.absX, absY = _this$getEventData.absY, deltaX = _this$getEventData.deltaX, deltaY = _this$getEventData.deltaY, directionX = _this$getEventData.directionX, directionY = _this$getEventData.directionY, duration2 = _this$getEventData.duration, velocity = _this$getEventData.velocity; - var _this$props4 = this.props, delta = _this$props4.delta, preventDefaultTouchmoveEvent = _this$props4.preventDefaultTouchmoveEvent, onSwipeStart = _this$props4.onSwipeStart, onSwiping = _this$props4.onSwiping; - if (e.cancelable && preventDefaultTouchmoveEvent) - e.preventDefault(); - if (absX < Number(delta) && absY < Number(delta) && !isSwiping) - return; - if (onSwipeStart && !isSwiping) { - onSwipeStart(e, { - deltaX, - deltaY, - absX, - absY, - directionX, - directionY, - duration: duration2, - velocity - }); - } - this.state.isSwiping = true; - if (onSwiping) { - onSwiping(e, { - deltaX, - deltaY, - absX, - absY, - directionX, - directionY, - duration: duration2, - velocity - }); - } - } - }, { - key: "handleSwipeEnd", - value: function handleSwipeEnd(e) { - var _this$props5 = this.props, onSwiped = _this$props5.onSwiped, onTap = _this$props5.onTap; - if (this.state.isSwiping) { - var directionDelta = this.props.directionDelta || 0; - var position = this.getEventData(e, { - directionDelta - }); - onSwiped && onSwiped(e, position); - } else { - var _position = this.getEventData(e); - onTap && onTap(e, _position); - } - this.state = Utils2.getInitialState(); - } - }, { - key: "handleMouseDown", - value: function handleMouseDown(e) { - var target = this.props.target; - if (target) { - if (target === e.target) { - this.handleSwipeStart(e); - } - } else { - this.handleSwipeStart(e); - } - } - }, { - key: "handleMouseMove", - value: function handleMouseMove(e) { - this.handleSwipeMove(e); - } - }, { - key: "handleMouseUp", - value: function handleMouseUp(e) { - var isSwiping = this.state.isSwiping; - var target = this.props.target; - if (target) { - if (target === e.target || isSwiping) { - this.handleSwipeEnd(e); - } - } else { - this.handleSwipeEnd(e); - } - } - }, { - key: "handleMouseLeave", - value: function handleMouseLeave(e) { - var isSwiping = this.state.isSwiping; - if (isSwiping) { - this.handleSwipeEnd(e); - } - } - }], [{ - key: "isTouchEventsSupported", - value: function isTouchEventsSupported() { - return Utils2.checkIsTouchEventsSupported(); - } - }]); - return VanillaSwipe3; - }(); - exports["default"] = VanillaSwipe2; - } -}); - -// node_modules/prismjs/prism.js -var require_prism = __commonJS({ - "node_modules/prismjs/prism.js"(exports, module) { - var _self = typeof window !== "undefined" ? window : typeof WorkerGlobalScope !== "undefined" && self instanceof WorkerGlobalScope ? self : {}; - var Prism2 = function(_self2) { - var lang = /(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i; - var uniqueId = 0; - var plainTextGrammar = {}; - var _ = { - /** - * By default, Prism will attempt to highlight all code elements (by calling {@link Prism.highlightAll}) on the - * current page after the page finished loading. This might be a problem if e.g. you wanted to asynchronously load - * additional languages or plugins yourself. - * - * By setting this value to `true`, Prism will not automatically highlight all code elements on the page. - * - * You obviously have to change this value before the automatic highlighting started. To do this, you can add an - * empty Prism object into the global scope before loading the Prism script like this: - * - * ```js - * window.Prism = window.Prism || {}; - * Prism.manual = true; - * // add a new - + diff --git a/docs/ui.css b/docs/ui.css index 8f7fa2ff..aef0a390 100644 --- a/docs/ui.css +++ b/docs/ui.css @@ -1,2744 +1 @@ -:root { - - /* BORDERS */ - --ui-border-radius: 0.375rem; /* 6px */ - --ui-border-radius-m: 0.6877rem;/* 11px */ - --ui-border-radius-l: 1rem; /* 16px */ - --ui-border-radius-xl: 5rem; /* 80px */ - - /* MARGIN & PADDING */ - --ui-margin: 0.375rem; /* 6px */ - --ui-margin-xs: 0.125rem; /* 2px */ - --ui-margin-s: 0.25rem; /* 4px */ - --ui-margin-m: 0.5rem; /* 8px */ - --ui-margin-l: 1rem; /* 16px */ - - - --ui-animation-speed: .25s; - --ui-button-height: 2.25rem; /* 36px */ - - - /* FONTS */ - --ui-font-system: system-ui, 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'sans-serif', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; - --ui-font-xs: 0.875rem; /* 14px */ - --ui-font-s: 0.9375rem; /* 15px */ - --ui-font-m: 1rem; /* 16px */ - --ui-font-l: 1.0625rem; /* 17px */ - --ui-font-xl: 1.375rem; /* 22px */ - - - /* SHADOWS */ - --ui-shadow-focus: 0 0 2px 1px var(--ui-color-accent); - --ui-shadow-danger: 0 0 2px 1px var(--ui-color-danger); - --ui-shadow-small: 0 0 0 0.5px #fff4, 0 3px 10px #0006; - --ui-shadow-large: 0 0 0 1px #0003, 0 5px 20px #000a; - --ui-shadow-fancy: - 0 0 0 0.5px #111, - 0 1px 5px rgb(0 0 0 / 30%), - 0 4px 10px rgb(0 0 0 / 10%), - 0 10px 25px rgb(0 0 0 / 8%); - - - /* Z-INDEX */ - --ui-z-index-elevated: 9; - --ui-z-index-popup: 999; -} - - -body { - font-weight: 300; - font-size: 100%; - font-family: var(--ui-font-system), sans-serif; - box-sizing: border-box; -} -body * { box-sizing: inherit; } - - -.icon-tabler { width: 1.5rem; height: 1.5rem; } - -/* meatballs icon is misaligned */ -.icon-tabler-dots-vertical { margin-left: -1px; } - -.flex-spacer { flex: 1; } - -/* Icon visual alignment corrections */ -.icon-tabler-alert-triangle { transform: translateY(1px); } -.icon-tabler-logout { transform: translateX(3px); } - -/* adding this class to input elements will prevent scrolling on focus in mobile safari */ -.mobile .prevent-scrolling-on-focus:focus { animation: prevent-scrolling-on-focus 10ms; } - -@keyframes prevent-scrolling-on-focus { - 0% { opacity: 0; } - 100% { opacity: 1; } -} - -:root, -.theme-dark { - color-scheme: dark; - - --ui-color-accent: #bb7a00; - --ui-color-accent-semi: #bb7a0066; - - --ui-color-highlight: #1859a3; - --ui-color-highlight-semi: #1859a366; - --ui-color-highlight-1: #1e4572; - - --ui-color-secondary: #5a5956; - --ui-color-secondary-semi: #5a595666; - - - --ui-color-info: #30506a; - --ui-color-info-semi: #30506a99; - - --ui-color-success: #33624d; - --ui-color-success-semi: #33624d99; - - --ui-color-warning: #795001; - --ui-color-warning-semi: #79500199; - - --ui-color-danger: #943737; - --ui-color-danger-semi: #94373799; - - --ui-color-border: #1b1b1b; - --ui-color-border-1: #131313; - --ui-color-border-2: #0c0c0c; - - --ui-color-background: #2f2f2f; - --ui-color-background-semi: #2f2f2f66; - --ui-color-background-input: #222; - - --ui-color-background-1: #535353; - --ui-color-background-2: #1a1a1a; - - - - --ui-color-text: #fff; - --ui-color-text-semi: #fff6; - --ui-color-text-1: #bbb; - --ui-color-text-2: #888; - - - --ui-popup-border: 1px solid #fff3; - --ui-popup-background: var(--ui-color-background); - - --ui-shadow-button: 0 1px 0 #000c; - --ui-shadow-tooltip: 0 0 0 1px #000, 0 0 5px #0006; -} - -.theme-light { - color-scheme: light; - - --ui-color-accent: #b37400; - --ui-color-accent-semi: #b3740066; - - --ui-color-highlight: #8ec6ff; - --ui-color-highlight-semi: #8ec6ff66; - --ui-color-highlight-1: #6ba0de; - - --ui-color-secondary: #c0beb4; - --ui-color-secondary-semi: #c0beb466; - - - --ui-color-info: #bbd3f0; - --ui-color-info-semi: #bbd3f099; - - --ui-color-success: #7bd7ae; - --ui-color-success-semi: #7bd7ae99; - - --ui-color-warning: #eec64e; - --ui-color-warning-semi: #eec64e99; - - --ui-color-danger: #eb6e6f; - --ui-color-danger-semi: #eb6e6f99; - - --ui-color-border: #bbb; - --ui-color-border-1: #aaa; - --ui-color-border-2: #999; - - --ui-color-background: #eee; - --ui-color-background-semi: #eee6; - --ui-color-background-input: #c2c2c2; - - --ui-color-background-1: #f0f0f0; - --ui-color-background-2: #ccc; - - - - --ui-color-text: #000; - --ui-color-text-semi: #0006; - --ui-color-text-1: #222; - --ui-color-text-2: #666; - - - --ui-popup-border: 1px solid #ccc; - --ui-popup-background: var(--ui-color-background); - - --ui-shadow-button: 0 1px 0 #000c; - --ui-shadow-tooltip: 0 0 1px #0002, 0 0 5px #0006; -} - -.button-link { - background: none; - border: none; - cursor: pointer; - min-width: 0; -} - -.button.button-link { - margin: calc(var(--ui-margin) * -1); - padding: var(--ui-margin); - vertical-align: baseline; - text-decoration: underline; -} - -.button.button-link:focus-visible, -.button.button-link:hover { text-decoration: underline; text-underline-offset: 0.2rem; } - - -.button-link.info:focus-visible, -.button-link.info:hover { text-decoration-color: var(--ui-color-info); } - -.button-link.success:focus-visible, -.button-link.success:hover { text-decoration-color: var(--ui-color-success); } - -.button-link.warning:focus-visible, -.button-link.warning:hover { text-decoration-color: var(--ui-color-warning); } - -.button-link.error:focus-visible, -.button-link.error:hover, -.button-link.danger:focus-visible, -.button-link.danger:hover { text-decoration-color: var(--ui-color-danger); } - -.button-normal { - background: var(--ui-color-secondary); - border: 0.5px solid #0006; - border-bottom-color: #000c; - box-shadow: var(--ui-shadow-button); - min-width: calc(var(--ui-button-size) * 4); - min-height: calc(var(--ui-button-size) * 2); -} - -.button-normal.info { background: var(--ui-color-info); } -.button-normal.success { background: var(--ui-color-success); } -.button-normal.warning { background: var(--ui-color-warning); } -.button-normal.error, -.button-normal.danger { background: var(--ui-color-danger); } - -.button-outline { - background: transparent; - border: 2px solid var(--ui-color-secondary); - min-width: calc(var(--ui-button-size) * 4); - min-height: calc(var(--ui-button-size) * 2); -} - -.button-outline:focus-visible, -.button-outline:hover { background-color: var(--ui-color-secondary-semi); } - -.button-outline.info { border-color: var(--ui-color-info); } -.button-outline.info:focus-visible, -.button-outline.info:hover { background-color: var(--ui-color-info-semi); } - -.button-outline.success { border-color: var(--ui-color-success); } -.button-outline.success:focus-visible, -.button-outline.success:hover { background-color: var(--ui-color-success-semi); } - -.button-outline.warning { border-color: var(--ui-color-warning); } -.button-outline.warning:focus-visible, -.button-outline.warning:hover { background-color: var(--ui-color-warning-semi); } - -.button-outline.error, -.button-outline.danger { border-color: var(--ui-color-danger); } - -.button-outline.error:focus-visible, -.button-outline.error:hover, -.button-outline.danger:focus-visible, -.button-outline.danger:hover { background-color: var(--ui-color-danger-semi); } - -.button-text { - background: transparent; - border: none; - min-width: calc(var(--ui-button-size) * 4); - min-height: calc(var(--ui-button-size) * 2); - box-shadow: none; -} - -.button-text:focus-visible, -.button-text:hover { background-color: var(--ui-color-secondary); } - -.button-text.info:focus-visible, -.button-text.info:hover { background-color: var(--ui-color-info); } - -.button-text.success:focus-visible, -.button-text.success:hover { background-color: var(--ui-color-success); } - -.button-text.warning:focus-visible, -.button-text.warning:hover { background-color: var(--ui-color-warning); } - -.button-text.error:focus-visible, -.button-text.error:hover, -.button-text.danger:focus-visible, -.button-text.danger:hover { background-color: var(--ui-color-danger); } - -button { -ms-touch-action: manipulation; touch-action: manipulation; } - -.button { - --ui-button-size: 1rem; - - font: inherit; - line-height: 1.4; - font-weight: 400; - font-size: var(--ui-button-size); - - display: inline-flex; - align-items: center; - justify-content: center; - gap: var(--ui-margin-m); - - min-width: var(--ui-button-height); - min-height: var(--ui-button-height); - height: auto; - - margin: 0; - padding: 0 var(--ui-margin-l); - color: var(--ui-color-text); - -webkit-user-select: none; - user-select: none; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - vertical-align: middle; - border-radius: var(--ui-border-radius); - text-decoration: none; -} - - -.button:hover { text-decoration: none; } -.button:focus-visible { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - outline: 1px solid transparent; -} - -.button[disabled] { - pointer-events: none; - opacity: 0.6; - box-shadow: none; -} - -.button svg { - min-height: calc(var(--ui-button-size) * 1.25); - max-height: calc(var(--ui-button-size) * 1.25); - height: calc(var(--ui-button-size) * 1.25); - min-width: var(--ui-button-size); - width: auto; - pointer-events: none; -} - - -.button:not(.button-has-text) { padding: 0 var(--ui-margin-m); } -.button:not(.button-has-text) svg { min-height: calc(var(--ui-button-size) * 1.4); } - -.button.round { - padding: var(--ui-margin); - border-radius: var(--ui-border-radius-xl); -} -.button.round:not(.button-has-text) { aspect-ratio: 1/1; } - -.button-has-text.round { padding-inline: var(--ui-margin-l); } - - -.button.touching, -.button:active { - outline: 1px solid transparent; - transform: translateY(1px); - filter: brightness(0.85); -} - -.button:not(.push-button):active, -.button:not(.push-button).touching { box-shadow: none; } - -.button-group { - border-radius: var(--ui-border-radius); - max-width: 100%; - overflow: hidden; -} - -.button-group-scroller { - width: 100%; - overflow: auto hidden; - overscroll-behavior-x: contain; - scrollbar-width: none; - scrollbar-gutter: none; - z-index: 0; - border-radius: var(--ui-border-radius); -} - -.button-group-scroller::-webkit-scrollbar { width: 0; height: 0; } - - -.button-group-inner { - padding: 0 0 2px; - display: inline-flex; - flex-flow: row; - align-items: center; - justify-content: stretch; - position: relative; - z-index: 1; - border-radius: var(--ui-border-radius); - background-color: var(--ui-color-background); -} - -.button-group-inner .button { - flex-shrink: 0; - flex-grow: 10; - border-radius: 0; - position: relative; - overflow: hidden; -} - -.button-group-inner .button:focus { z-index: 2; } - -.button-group .button-normal[disabled] { box-shadow: var(--ui-shadow-button); } - -.button-group .button:first-of-type { - border-top-left-radius: var(--ui-border-radius); - border-bottom-left-radius: var(--ui-border-radius); -} - -.button-group .button:last-of-type { - border-top-right-radius: var(--ui-border-radius); - border-bottom-right-radius: var(--ui-border-radius); -} - -.button-group .button-outline:not(:first-of-type) { margin-left: -2px; } - - -.button-group.round { border-radius: var(--ui-border-radius-xl); } - -.button-group.round .button:first-of-type { - border-top-left-radius: var(--ui-border-radius-xl); - border-bottom-left-radius: var(--ui-border-radius-xl); -} - -.button-group.round .button:last-of-type { - border-top-right-radius: var(--ui-border-radius-xl); - border-bottom-right-radius: var(--ui-border-radius-xl); -} - - -.button-group .button:not(.button-has-text):first-of-type { padding-left: 9px; } -.button-group .button:not(.button-has-text):last-of-type { padding-right: 9px; } -.button-group.round .button:not(.button-has-text):first-of-type { padding-right: 6px; padding-left: 11px; } -.button-group.round .button:not(.button-has-text):last-of-type { padding-left: 6px; padding-right: 11px; } - -.has-dialog { - position: fixed; - width: 100%; - inset: 0; - overflow: hidden; -} - -.dialog-backdrop { - position: fixed; - inset: 0; - display: none; - align-items: center; - justify-content: center; - z-index: calc(var(--ui-z-index-popup) - 1); - background-color: rgba(0 0 0 / 0); - transition: all var(--ui-animation-speed) ease-out; - transform: translateZ(1px); -} - -.dialog-backdrop.opened { background-color: rgba(0 0 0 / .6); } - - -.dialog { - --ui-dialog-border-radius: var(--ui-border-radius-m); - --ui-dialog-inner-border-radius: calc(var(--ui-dialog-border-radius) - 1px); - - opacity: 0; - transform: scale(0.8); - transition: - opacity var(--ui-animation-speed) ease-out, - transform var(--ui-animation-speed) ease-out; - max-height: 90vh; - min-width: 15rem; - max-width: 95vw; - color: var(--ui-color-text); - border-radius: var(--ui-dialog-border-radius); - background: var(--ui-popup-background); - border: var(--ui-popup-border); - box-shadow: var(--ui-shadow-large); - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: stretch; -} - -.opened .dialog { opacity: 1; transform: scale(1); } - -.dialog-header, -.dialog-footer { background: var(--ui-color-background-input); padding: 0.7rem 1rem; } - -.dialog-header { - text-align: center; - font-size: var(--ui-font-xl); - font-weight: 300; - margin: 0; - border-bottom: 0.5px solid var(--ui-color-border); -} - -.dialog-content { - margin: 0; - padding: 1rem; - min-width: 200px; - flex: 1; - overflow-y: auto; - overscroll-behavior-y: contain; - outline: 1px solid transparent; - min-height: 3rem; -} - -.dialog-content:focus { outline: none; } -.dialog-content:focus-visible { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus) inset; -} - -.dialog-footer { - border-top: 0.5px solid var(--ui-color-border); - border-bottom-left-radius: var(--ui-dialog-inner-border-radius); - border-bottom-right-radius: var(--ui-dialog-inner-border-radius); -} - -.dialog-footer [slot="footer"] { - width: 100%; - display: flex; - align-items: center; - justify-content: center; - flex-flow: row-reverse; - gap: 0.5rem; -} - -.dialog-footer .button-has-text { min-width: 9ch; } - - -.dialog-header, -.dialog.no-title .dialog-content { - border-top-left-radius: var(--ui-dialog-inner-border-radius); - border-top-right-radius: var(--ui-dialog-inner-border-radius); -} - -.dialog-header:empty { display: none; } - - -.mobile .dialog-backdrop .dialog { - min-height: 0; - min-width: 0; - max-height: 100%; - max-width: 100%; - box-shadow: none; -} - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .dialog-backdrop.opened { - -webkit-backdrop-filter: contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px); - backdrop-filter: contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px); - } -} - -.drawer { - position: fixed; - background-color: var(--ui-popup-background); - border-left: var(--ui-popup-border); - top: 0; - right: 0; - bottom: 0; - width: 24rem; - min-height: 20rem; - box-shadow: var(--ui-shadow-large); - z-index: calc(var(--ui-z-index-popup) - 2); - color: var(--ui-color-text); - padding: 0; - overflow-y: auto; - overscroll-behavior-y: contain; - transform: translateZ(1px); -} - -.drawer:focus { outline: none; } - -.drawer-header { - position: sticky; - /* stylelint-disable-next-line declaration-block-no-duplicate-properties */ - position: -webkit-sticky; - background-color: inherit; - top: 0; - width: 100%; - margin: 0 0 1rem; - padding: 0 1rem 0 1.4rem; - display: flex; - align-items: center; - justify-content: space-between; -} - -.drawer-header h2 { margin: 0; padding: 0.5rem 0; } - -.drawer-content { padding: 0 1.4rem; } - -.grid-title { - font-size: 1.4rem; - font-weight: 300; - margin: 0 0 1px; - padding: 0.5rem 1rem; - background: var(--ui-color-background-input); - border-bottom: 1px solid var(--ui-color-border); - box-shadow: 0 .5px 0 var(--ui-color-background-1); - z-index: 5; - position: relative; -} - -.grid { - -webkit-user-select: none; - user-select: none; - cursor: default; -} - -.grid table { table-layout: fixed; } -.grid-item { content-visibility: auto; } - -.grid .column-check { width: 3em; padding: 0 0.5em; } -.grid .column-check .checkbox { pointer-events: none; } -.grid .column-check .checkbox input { border-color: var(--ui-color-background-1); } - -.grid .column-date { width: 110px; } -.grid .column-number { width: 110px; } - - -.grid thead { top: -2px; } -.grid thead th { padding-top: 0.75em; padding-bottom: 0.75em; } - -.grid tbody { background-color: var(--ui-color-background); } -.grid tbody td { padding: 0.3rem 0.5rem; } - -.grid tfoot { bottom: -2px; } -.grid tfoot td { padding: 0.75rem 0.5rem; } -.grid tfoot .button { --button-size: 0.9em; font-size: 0.9em; margin: 0; } - - -.grid td:not(.column-check) { - white-space: nowrap; - overflow-x: hidden; - text-overflow: ellipsis; -} - -.grid .cell-aligner { - width: 100%; - height: 100%; - display: flex; - align-items: center; - gap: 0.5em; -} - - -.grid .th-number, -.grid .td-number { text-align: right; } - - -/*** SORTABLE TABLE *******************************************************************************/ -.grid-sortable thead th { cursor: pointer; } -.grid-sortable thead th span:hover { text-decoration: underline; } -.grid-sortable thead th .cell-aligner { min-height: 20px; } -.grid-sortable thead th .cell-aligner span { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - flex: 1; -} -.grid-sortable thead th.sortasc svg, -.grid-sortable thead th.sortdesc svg { - width: 20px; - height: 20px; - color: var(--ui-color-text-2); -} - -.grid-sortable .th-sortable:focus-visible { - outline: 1px solid var(--ui-color-accent); - outline-offset: -1px; -} - -/*** SORTABLE TABLE *******************************************************************************/ - -.info-bar { - width: 100%; - display: flex; - align-items: flex-start; - justify-content: flex-start; - gap: 0.5rem; - padding: 0.4rem 0.6rem 0.4rem 0.3rem; - margin: 0 0 0.75rem; - border-radius: var(--ui-border-radius); - border-width: 1px; - border-style: solid; -} - -.info-bar p { - margin: 0; - font-size: var(--ui-font-s); - line-height: 1.5rem; -} -.info-bar .icon { flex-shrink: 0; } - - - -.info-bar-error { - background-color: var(--ui-color-danger-semi); - border-color: var(--ui-color-danger); -} - -.info-bar-info { - background-color: var(--ui-color-info-semi); - border-color: var(--ui-color-info); -} - -.info-bar-success { - background-color: var(--ui-color-success-semi); - border-color: var(--ui-color-success); -} - -.info-bar-warning { - background-color: var(--ui-color-warning-semi); - border-color: var(--ui-color-warning); -} - -input, select, textarea, label { - -ms-touch-action: manipulation; - touch-action: manipulation; -} - - -.theme-dark input { color-scheme: dark; } -.theme-light input { color-scheme: light; } - - -textarea::placeholder, -input::placeholder { - color: var(--ui-color-text-1); - font-style: italic; -} - - -:where(input:not([type=radio],[type=checkbox])) { - font: inherit; - height: calc(var(--ui-button-height) - 2px); - border: 1px solid transparent; - line-height: 1; - color: var(--ui-color-text); - background-color: var(--ui-color-background-input); - border-radius: var(--ui-border-radius); - padding: 0 var(--ui-margin-m); - width: 25ch; -} - -:where(input:focus) { - outline: 0; - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); -} - -:where(input:invalid) { - border-color: var(--ui-color-danger); - box-shadow: var(--ui-shadow-danger); -} - - -input[type=color] { - -moz-appearance: none; - -webkit-appearance: none; - appearance: none; - background: none; - border: none; - padding: 0; - cursor: pointer; -} - - -:where(input:disabled) { opacity: 0.75; cursor: default; } - - - - -.check-and-radio input { - appearance: none; - width: 1.4rem; - height: 1.4rem; - display: inline-flex; - align-items: center; - justify-content: center; - border-radius: 0.3em; - background: var(--ui-color-background-input); - border: 1px solid var(--ui-color-text-2); - color: var(--ui-color-text-1); - font: inherit; /* required for proper sizing */ - flex-shrink: 0; - -ms-touch-action: manipulation; - touch-action: manipulation; -} - -.check-and-radio input::after { - content: " "; - display: block; - opacity: 0; - font-size: var(--ui-font-m); - line-height: 1; - align-self: center; - color: inherit; - margin: 0; - transition: opacity calc(var(--ui-animation-speed) / 2) ease-out; -} - -.check-and-radio input:checked::after { opacity: 1; } - - - -.input { width: 25ch; vertical-align: middle; } -.input .input-inner { - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: stretch; - border-radius: var(--ui-border-radius); - background: var(--ui-color-background-input); - border: 1px solid var(--ui-color-border); -} - - - /* label on the left */ -.radio.label-on-the-left, -.button-toggle.input.label-on-the-left, -.textarea.label-on-the-left, -.toggle.label-on-the-left, -.range.label-on-the-left, -.input.label-on-the-left { - display: inline-flex; - flex-flow: row; - align-items: center; - width: 100%; - gap: 1rem; -} -.label-on-the-left .range-inner, -.label-on-the-left .input-inner { flex: 1; } - - -.input-inner:focus-within, -.input-inner:has(:active):not(.disabled) { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); -} - - - -.input, -.textarea textarea:disabled, -.range input:disabled, -.input select:disabled, -.input input:disabled { opacity: 1; color: var(--ui-color-text); } - -.input .input-inner:has(:disabled), -.range .range-inner:has(:disabled), -.textarea .textarea-inner:has(:disabled) { opacity: 0.7; } - -.input input:not([type=radio]) { width: 100%; border: none; } -.input input:not([type=radio]):focus, -.input input:not([type=radio]):invalid { box-shadow: none; border: none; } - - - - -.input-row { - width: 100%; - display: flex; - flex-flow: row; - align-items: center; - justify-content: space-between; - position: relative; - border-radius: inherit; -} - -.input-row > .button, -.input-row > .icon { position: absolute; height: 100%; z-index: 1; } - -.input-row > .button { color: var(--ui-color-text-1); right: 2px; } - -.input-row>.icon { - color: var(--ui-color-text-2); - left: 0.3rem; - width: 1.5rem; - pointer-events: none; -} - -.menu { - position: absolute; - padding: 0.25rem; - margin: 0; - display: flex; - width: auto; - flex-flow: column; - align-items: stretch; - list-style: none; - overflow: hidden auto; - cursor: default; - z-index: var(--ui-z-index-popup); - max-height: calc(100vh - 4px); - -webkit-user-select: none; - user-select: none; - overscroll-behavior-y: contain; - - color: var(--ui-color-text); - border: var(--ui-popup-border); - border-radius: calc(var(--ui-border-radius) + 2px); - background: var(--ui-popup-background); - box-shadow: var(--ui-shadow-fancy); - transform: translateZ(1px); -} - -.menu:focus { outline: none; } - - -.menu-item { - font: inherit; - font-size: var(--ui-font-s); - align-items: center; - border-radius: var(--ui-border-radius); - color: inherit; - background: none; - border: none; - display: flex; - flex-shrink: 0; - letter-spacing: 0.1px; - justify-content: space-between; - margin: 0; - overflow: hidden; - padding: 0.5rem 0.9rem; - position: relative; - text-align: left; - white-space: nowrap; - width: 100%; -} - -.menu-item-shortcut { - margin: -0.1rem 0 -0.1rem auto; - letter-spacing: 0.1rem; - line-height: 1.35; - opacity: 0.5; -} -.menu-item-shortcut:empty { visibility: hidden; } - -.menu-item.disabled { pointer-events: none; opacity: 0.6; } - -.menu-item:focus { background-color: var(--ui-color-highlight); outline: 1px solid transparent; } - -.menu-item:focus.success { background-color: var(--ui-color-success); } -.menu-item:focus.warning { background-color: var(--ui-color-warning); } -.menu-item:focus.danger { background-color: var(--ui-color-danger); } - -.menu-item:focus .menu-item-shortcut { opacity: 1; } - -.menu-item svg { width: 1.1rem; height: 1.1rem; margin: 0 0.5rem 0 0; } - -.menu-item-content { - display: flex; - min-width: 0; - align-items: center; - justify-content: space-between; - margin-right: 1rem; -} - -.menu-item-text { - overflow: hidden; - text-overflow: ellipsis; - line-height: 1.35; -} - - -.menu-separator { - height: 0; - width: auto; - padding: 0; - margin: var(--ui-margin) 0.8rem; - border-bottom: var(--ui-popup-border); -} - - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .menu { - background-color: var(--ui-color-background-semi); - -webkit-backdrop-filter: blur(30px); - backdrop-filter: blur(30px); - } -} - -.message-box .dialog-content { - display: flex; - flex-flow: row; - gap: 1rem; - font-size: var(--ui-font-l); - padding: 1rem; -} - -.message-box .dialog-content .message { - display: flex; - align-items: center; - min-height: fit-content; -} -.message-box .dialog-content .message-content { margin: 0; line-height: 1.5; } - -.message-box .dialog-content svg, -.message-box .dialog-content .icon { height: 3rem; } - -.message-box .dialog-content svg:empty { width: 0; } -.message-box .dialog-content:has(svg:empty) { gap: 0; } -.message-box .dialog-content:has(svg:empty) .message { flex: 1; justify-content: center; } - - -.message-box .dialog-content .icon { - width: 3rem; - flex-shrink: 0; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - position: sticky; - top: 0; -} - - -/* stylelint-disable no-descending-specificity */ -.message-info .dialog-content { background-color: var(--ui-color-info-semi); } -.message-warning .dialog-content { background-color: var(--ui-color-warning-semi); } -.message-error .dialog-content { background-color: var(--ui-color-danger-semi); } -.message-success .dialog-content { background-color: var(--ui-color-success-semi); } - -.panel { - overflow: hidden; - will-change: height; - position: relative; - border: 2px solid var(--ui-color-border); - background: var(--ui-color-background-2); - margin-bottom: 1rem; -} - - -.panel details { margin: 1px; } - -.panel-header { - color: var(--ui-color-text); - text-align: left; - border: none; - display: flex; - align-items: center; - justify-content: space-between; - font-weight: 300; - font-size: var(--ui-font-m); - padding: 0 0.6rem 0 1rem; - height: 2.5rem; - line-height: 1; - -webkit-user-select: none; - user-select: none; -} - -.collapsible .panel-header { cursor: pointer; } - -.panel-header::-webkit-details-marker { display: none; } - -.panel-content { - background: var(--ui-color-background); - padding: 1rem; -} -.panel-content > * { opacity: 0; transition: opacity var(--ui-animation-speed) ease-out; } -.panel.expanded .panel-content > * { opacity: 1; } - - -.panel .chevron { - height: 1.2rem; - transform: rotate(0deg); - transition: transform var(--ui-animation-speed) ease-out; -} -.panel .chevron svg { width: 1.2rem; height: 1.2rem; } -.panel.expanded .chevron { transform: rotate(90deg); } - - - -.panel.round { border-radius: var(--ui-border-radius); } -.panel.round .panel-content { border-radius: calc(var(--ui-border-radius) - 2px); } - - -.panel.disabled { opacity: 0.5; } - - -.panel-header:focus { outline: none; } -.panel:has(.panel-header:focus-visible) { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - z-index: 2; -} - - -.panel.info { - border-color: var(--ui-color-info); - background: var(--ui-color-info-semi); -} -.panel.success { - border-color: var(--ui-color-success); - background: var(--ui-color-success-semi); -} -.panel.warning { - border-color: var(--ui-color-warning); - background: var(--ui-color-warning-semi); -} -.panel.danger { - border-color: var(--ui-color-danger); - background: var(--ui-color-danger-semi); -} - -.popover-plate { - --popover-tip-size: 14px; - --popover-color: var(--ui-popup-background); - --popover-border: var(--ui-popup-border); - --tip-offset: 50%; - - position: absolute; - transform: translateZ(1px); - z-index: var(--ui-z-index-popup); -} - -.popover-plate.opening { - opacity: 0; -} - -.popover { - position: relative; - border-radius: var(--ui-border-radius-m); - box-shadow: var(--ui-shadow-tooltip); -} - -.popover-plate.hide-tip .popover { - box-shadow: var(--ui-shadow-fancy); -} - -.popover-plate:not(.hide-tip) .popover::before, -.popover-plate:not(.hide-tip) .popover-content::before { - content: ''; - position: absolute; - display: block; - width: var(--popover-tip-size); - height: var(--popover-tip-size); - transform: rotate(45deg) skew(8deg, 8deg); - left: var(--tip-offset); - margin-left: calc(var(--popover-tip-size) / -2); -} - - -.popover-plate:not(.hide-tip) .popover::before { - box-shadow: var(--ui-shadow-tooltip); - background-color: var(--popover-color); - border: var(--popover-border); - border-width: 1.5px; - margin-left: calc(var(--popover-tip-size) / -2 - 0.5px); -} - -.popover-content { - padding: 1rem; - text-align: center; - position: relative; - border-radius: inherit; - z-index: 1; - background-color: var(--popover-color); - border: var(--popover-border); -} - -.popover-content > * { - position: relative; -} - -.popover-plate:not(.hide-tip) .popover-content::before { - background-color: inherit; - z-index: -1; -} - - -.popover-plate:focus, -.popover-plate .popover:focus, -.popover-content:focus { - outline: none; -} - - -.popover-top:not(.hide-tip) { - padding-bottom: var(--popover-tip-size); -} - -.popover-top:not(.hide-tip) .popover::before { - border-radius: 0 0 3px; - bottom: calc(var(--popover-tip-size) / -2); -} - -.popover-top:not(.hide-tip) .popover-content::before { - border-radius: 0 0 2px; - bottom: calc(var(--popover-tip-size) / -2); -} - -.popover-bottom:not(.hide-tip) { - padding-top: var(--popover-tip-size); -} - -.popover-bottom:not(.hide-tip) .popover::before { - border-radius: 3px 0 0; - top: calc(var(--popover-tip-size) / -2); -} - -.popover-bottom:not(.hide-tip) .popover-content::before { - border-radius: 2px 0 0; - top: calc(var(--popover-tip-size) / -2); -} - - -/* THEME LIGHT */ -.theme-light .popover-plate { - --popover-color: #fff; -} - - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .popover-plate.hide-tip .popover-content { - background-color: var(--ui-color-background-semi); - -webkit-backdrop-filter: blur(30px); - backdrop-filter: blur(30px); - } -} - -.push-button:active, -.push-button.touching, -.push-button[aria-pressed="true"] { - filter: brightness(0.85) contrast(1.1); - transform: translateY(1px); - box-shadow: 0 1px 0 rgb(0 0 0/0.8) inset; -} - -.push-button[aria-pressed="true"]:focus-visible { - box-shadow: 0 1px 0 rgb(0 0 0/0.8) inset, var(--ui-shadow-focus); -} - -.push-button[aria-pressed="true"].button-outline { background-color: var(--ui-color-secondary-semi); } -.push-button[aria-pressed="true"].button-outline.info { background-color: var(--ui-color-info-semi); } -.push-button[aria-pressed="true"].button-outline.success { background-color: var(--ui-color-success-semi); } -.push-button[aria-pressed="true"].button-outline.warning { background-color: var(--ui-color-warning-semi); } -.push-button[aria-pressed="true"].button-outline.danger { background-color: var(--ui-color-danger-semi); } - - -.push-button.button-outline:active, -.push-button.button-outline.touching, -.push-button.button-outline[aria-pressed="true"] { box-shadow: none; } - -.splitter { - position: absolute; - height: 100%; - width: 16px; - z-index: 90; - cursor: ew-resize; -} - -.splitter::after { - content: " "; - display: block; - width: 6px; - height: 100%; - margin: 0 auto; -} - -.splitter.vertical { width: 100%; height: 16px; cursor: ns-resize; } - -.splitter.vertical::after { width: 100%; height: 6px; margin: auto 0; } - -.splitter.is-dragging::after, -.splitter:hover::after { background-color: var(--ui-color-background-1); } - -.table { - width: 100%; - max-height: 100%; - overflow: auto; - overscroll-behavior-y: contain; - position: relative; - border: 2px solid var(--ui-color-border); -} - - -.table table { border-spacing: 0; width: 100%; table-layout: fixed; } - -.table.round { border-radius: var(--ui-border-radius); } -.table.selectable { cursor: default; -webkit-user-select: none; user-select: none; } - -.table thead, -.table tfoot { position: sticky; z-index: 2; } -.table thead { top: 0; } -.table tfoot { bottom: 0; } - -.table thead th, -.table tfoot td { - padding: var(--ui-margin-m); - font-weight: 400; - text-align: left; - vertical-align: middle; - background: var(--ui-color-background-input); -} - -.table tr:focus-within, -.table tr:focus, -.table tbody:focus, -.table tbody:focus tr { - outline: 1px solid transparent; - background-color: var(--ui-color-highlight-1); -} - -.table tbody td { - padding: var(--ui-margin) var(--ui-margin-m) calc(var(--ui-margin) + 1px); - border-bottom: 1px solid var(--ui-color-border); - vertical-align: middle; - line-height: 1.5rem; -} - -.table th:first-child, -.table td:first-child { padding-left: var(--ui-margin-l); } - -.table th:last-child, -.table td:last-child { padding-right: var(--ui-margin-l); } - -.table tbody:last-of-type tr:last-child td { border-bottom: none; } - -.ui-tag { - border: 1px solid var(--ui-color-border); - background: var(--ui-color-secondary); - border-radius: var(--ui-border-radius); - padding: 0.4rem 0.7rem; - display: inline-flex; - align-items: center; - gap: 0.2rem; - height: 2rem; - cursor: default; - color: var(--ui-color-text); - -webkit-user-select: none; - user-select: none; -} - -.ui-tag.clickable { - touch-action: manipulation; - cursor: pointer; -} -.ui-tag.clickable:not(.disabled):active { - transform: translateY(1px); - filter: brightness(0.85); -} - - -.ui-tag .icon { - width: 1rem; - height: 1rem; - margin-left: -4px; - /* a fix safari rendering issue */ - /* when tag was pressed, the icon would slide to the left */ - transform: translateZ(1px); -} - -.ui-tag:focus-visible { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - outline: 1px solid transparent; -} -.ui-tag .ui-tag-label { padding-bottom: 2px; } - -.ui-tag.dark { color: #fff; } -.ui-tag.light { color: #000; } - -.ui-tag.disabled { opacity: 0.5; } -.ui-tag.round { border-radius: var(--ui-border-radius-xl); } - -.ui-tag.info { background-color: var(--ui-color-info); } -.ui-tag.success { background-color: var(--ui-color-success); } -.ui-tag.danger { background-color: var(--ui-color-danger); } -.ui-tag.warning { background-color: var(--ui-color-warning); } - -.ui-tag.info, -.ui-tag.success, -.ui-tag.danger, -.ui-tag.warning { color: var(--ui-color-text); } - -.tooltip-plate { - --popover-tip-size: 10px; - --popover-color: #292929; -} - -.tooltip { border-radius: 5px; max-width: 75vw; } -.tooltip-content { padding: 0.5rem 0.7rem; } - -/* COLOR VARIATIONS */ -.info .tooltip { --popover-color: var(--ui-color-info); } -.success .tooltip { --popover-color: var(--ui-color-success); } -.danger .tooltip { --popover-color: var(--ui-color-danger); } -.warning .tooltip { --popover-color: var(--ui-color-warning); } - -.tree, -.tree ul { padding: 0; margin: 0; list-style: none; } -.tree>li, -.tree ul li { - display: block; - width: 100%; - padding: 0; - margin: 0; -} - -.tree { - display: flex; - flex-flow: column; - align-items: stretch; - overflow: hidden; - position: relative; - margin: 0; - padding: .3rem; - border-radius: var(--ui-border-radius); -} -.tree:focus { outline: none; } -.tree:focus-visible { - box-shadow: - 0 0 0 1px var(--ui-color-accent), - var(--ui-shadow-focus); -} - - -.tree-node { - cursor: pointer; - display: flex; - align-items: center; - border-radius: var(--ui-border-radius); - padding: 0 0.5rem; - height: var(--ui-button-height); - -ms-touch-action: manipulation; - touch-action: manipulation; -} - -.tree-node.selected { background-color: var(--ui-color-highlight-1); } -.tree-node:hover { background-color: var(--ui-color-highlight); } - -.tree-icon { - display: inline-block; - width: 1.5rem; - height: 1.5rem; - margin-right: 0.5rem; - background-color: var(--ui-color-text-2); - -webkit-mask-size: 1.5rem; - -webkit-mask-repeat: no-repeat; - -webkit-mask-position: 0 center; - mask-size: 1.5rem; - mask-repeat: no-repeat; - mask-position: 0 center; -} - - -.tree-label { line-height: 2; } - -.tree-indent { - display: block; - width: 0.8rem; - margin-right: 1rem; - height: 100%; - border-right: 1px solid transparent; -} -.tree .tree-indent { border-right-color: var(--ui-color-border-1); } - - - -.tree-file-icon { - -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E"); - mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E"); -} -.tree-folder-icon { - -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); - mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); -} -.expanded .tree-folder-icon { - -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); - mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E"); -} - -.button-toggle.input { - width: min-content; - max-width: 100%; - padding: 0; - flex-flow: column; - align-items: flex-start; - justify-content: flex-start; - border-radius: calc(var(--ui-border-radius) + 1px); -} - -.button-toggle .input-inner { - width: 100%; - overflow: hidden; - border-radius: calc(var(--ui-border-radius) + 1px); -} - -.button-toggle .input-scroller { - width: 100%; - border-radius: var(--ui-border-radius); - background-color: var(--ui-color-background-input); - overflow: auto hidden; - overscroll-behavior-x: contain; - scrollbar-width: none; -} - -.button-toggle .input-scroller::-webkit-scrollbar { width: 0; height: 0; } - -.button-toggle .input-row { min-width: 100%; width: min-content; } - -.button-toggle .input-row .button { - position: static; - color: var(--ui-color-text); - box-shadow: none; - min-height: calc(var(--ui-button-height) - 2px); - background: var(--ui-color-background-input); - border: none; - border-radius: 0; - flex: 1; - border-left: 1px solid var(--ui-color-border); - min-width: min-content; -} - -.button-toggle .button:has(:checked) { background-color: var(--ui-color-highlight); } - -.button-toggle .input-row .button:first-child { - border-left: none; - border-top-left-radius: var(--ui-border-radius); - border-bottom-left-radius: var(--ui-border-radius); -} - -.button-toggle .input-row .button:last-child { - border-top-right-radius: var(--ui-border-radius); - border-bottom-right-radius: var(--ui-border-radius); -} - -.button-toggle .button input { - position: absolute; - top: -100px; - opacity: 0; - pointer-events: none; -} - - - -/* round buttons */ -.button-toggle.round { border-radius: var(--ui-border-radius-xl); } - -.button-toggle.round:not(.has-error) .input-inner { border-radius: var(--ui-border-radius-xl); } - -.button-toggle.round .input-row .button:first-child { - border-top-left-radius: var(--ui-border-radius-xl); - border-bottom-left-radius: var(--ui-border-radius-xl); -} - -.button-toggle.round .input-row .button:last-child { - border-top-right-radius: var(--ui-border-radius-xl); - border-bottom-right-radius: var(--ui-border-radius-xl); -} - -/* more styling defined in ../check-and-radio.css */ - -.checkbox { - display: inline-flex; - flex-flow: column; - align-items: stretch; - justify-content: flex-start; - gap: 0.5rem; -} - -.checkbox-row { - display: inline-flex; - align-items: center; - justify-content: flex-start; - gap: 0.5rem; -} - - -.checkbox input:focus { border-color: var(--ui-color-accent); } -.checkbox input::after { - content: "✕"; - font-family: Arial, Helvetica, sans-serif; - line-height: 1.1; -} - -.checkbox.indeterminate input::after { - content: " "; - opacity: 1; - background: var(--ui-color-text-1); - width: 65%; - height: 65%; - border-radius: 0.2rem; -} - -.checkbox input:checked::after { opacity: 1; } - -.checkbox.disabled { opacity: 0.5; } -.checkbox.disabled input { opacity: 1; } - - -.checkbox.has-error input { border-color: var(--ui-color-danger); } -.checkbox.has-error input:focus { box-shadow: var(--ui-shadow-danger); } - -.checkbox.label-on-the-left .checkbox-row { flex-flow: row-reverse; } - -.combobox .input-inner { position: relative; } - -.combobox input { padding-right: 36px; } -.multiselect input { text-overflow: ellipsis; } - -.combobox-button:focus { box-shadow: none; } - -.combobox-list { - position: absolute; - z-index: var(--ui-z-index-popup); - overflow-y: auto; - overscroll-behavior-y: contain; - padding: 0.2rem; - min-height: 0; - max-height: 26rem; - -webkit-user-select: none; - user-select: none; - transform: translateZ(1px); - - color: var(--ui-color-text); - border: var(--ui-popup-border); - border-radius: calc(var(--ui-border-radius) + 0.2rem); - background: var(--ui-popup-background); - box-shadow: var(--ui-shadow-fancy); -} - -.combobox-list.empty { padding: 0; box-shadow: none; border: none; } -.combobox-list:not(.empty) { min-height: 2rem; } -.combobox-list.hidden { display: none; } - -.combobox-list-header, -.combobox-list-item { - height: var(--ui-button-height); - line-height: 1; - display: flex; - align-items: center; - white-space: nowrap; - text-overflow: ellipsis; - overflow-x: hidden; - padding: 0 1rem; -} - -.combobox-list-header { - margin: 0.5rem 0 0; - color: var(--ui-color-text-2); - font-weight: 500; - cursor: default; -} - -.combobox-list-header:last-child { display: none; } - -.combobox-list-empty { - padding: 0.6rem 1.2rem; - color: var(--ui-color-text-semi); - cursor: default; - white-space: nowrap; -} - -.combobox-list-item { - color: var(--ui-color-text); - cursor: pointer; - border-radius: var(--ui-border-radius); - -ms-touch-action: manipulation; - touch-action: manipulation; -} - -.combobox-list-item svg { margin-right: 0.5rem; } -.combobox-list-item .tick { display: none; } -.combobox-list-item.checked .tick { display: block; } - -.combobox-list:not(.multiselect) .combobox-list-item.in-group { padding-left: 2rem; } - - -.mobile .combobox-list-item { transition: background-color 0.3s ease-out; } -.mobile .combobox-list-item.blinking { - transition: background-color 0.1s; - background-color: var(--ui-color-highlight-1); -} - -.desktop .combobox-list-item.checked { background-color: var(--ui-color-highlight-semi); } -.desktop .combobox-list-item.selected { background-color: var(--ui-color-highlight-1); } -.desktop .combobox-list-item:hover { background-color: var(--ui-color-highlight); } - -.combobox-list-item b { color: var(--ui-color-accent); } - -/* has checked element before */ -.combobox-list-item.checked + .combobox-list-item.checked { - border-top-left-radius: 0; - border-top-right-radius: 0; -} -/* has checked element after it */ -.combobox-list-item.checked:has(+ .combobox-list-item.checked) { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; -} - - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .combobox-list { - background-color: var(--ui-color-background-semi); - -webkit-backdrop-filter: blur(30px); - backdrop-filter: blur(30px); - } -} - -.input-date .input-text-inner { position: relative; overflow: unset; } - -.input-date input { flex: 1; width: 100%; padding-right: 36px; } - - -.input-date.native .input-date-button { pointer-events: none; } - -.datepicker { display: none; transform: translateZ(1px); } -.datepicker.active { display: block; } - -.datepicker-dropdown { - position: absolute; - top: 0; - left: 0; - z-index: var(--ui-z-index-popup); - padding-top: 0.2rem; -} - -.datepicker-dropdown.datepicker-orient-top { padding-top: 0; padding-bottom: 4px; } - -.datepicker-picker { - display: inline-block; - overflow: hidden; - border-radius: 0.4em; - background-color: var(--ui-color-background); - border: var(--ui-popup-border); - box-shadow: var(--ui-shadow-fancy); -} - - -.datepicker-picker span { - display: block; - flex: 1; - border: 0; - border-radius: 6px; - cursor: default; - text-align: center; - -webkit-touch-callout: none; - -webkit-user-select: none; - user-select: none; -} - -.datepicker-main { padding: var(--ui-margin-s); } - - -.datepicker-grid, -.datepicker-view .days-of-week, -.datepicker-view, -.datepicker-controls { display: flex; } - -.datepicker-grid { flex-wrap: wrap; width: 15.75rem; } - -.datepicker-cell { -ms-touch-action: manipulation; touch-action: manipulation; } - -.datepicker-cell, -.datepicker-view .week { height: 2.25rem; line-height: 2.25rem; } - -.datepicker-view .days .datepicker-cell, -.datepicker-view .dow { flex-basis: 14.2857142857%; } - -.datepicker-view.datepicker-grid .datepicker-cell { - flex-basis: 25%; - height: 4.5rem; - line-height: 4.5rem; -} - - -.datepicker-title { padding: 0.375rem 0.75rem; text-align: center; } - -.datepicker-header .datepicker-controls, -.datepicker-footer .datepicker-controls { padding: 0.2rem; } - -.datepicker-controls .button { - padding: 0; - width: 2.5rem; - min-width: 2.5rem; - text-align: center; -} - -.datepicker-controls .button svg { margin: 0; height: 1.4rem; } -.datepicker-controls .button.disabled { visibility: hidden; } - -.datepicker-controls .button.view-switch { flex: auto; width: auto; } - - -.datepicker-footer .datepicker-controls .button { width: 100%; } - -.datepicker-view .dow { height: 1.5rem; line-height: 1.5rem; font-size: var(--ui-font-xs); } -.datepicker-view .week { width: 2.25rem; font-size: 0.75rem; } - -.datepicker-cell.prev:not(.disabled), -.datepicker-cell.next:not(.disabled) { color: var(--ui-color-text-2); } - - -.datepicker-cell.selected.prev:not(.disabled), -.datepicker-cell.selected.next:not(.disabled) { color: var(--ui-color-text-1); } - - -.datepicker-cell.selected { - background-color: var(--ui-color-highlight); - color: var(--ui-color-text); -} - -.datepicker-cell.disabled { color: var(--ui-color-text-2); } - - - -/* today */ -.datepicker-cell.today:not(.selected) { - background-color: var(--ui-color-secondary-semi); - color: var(--ui-color-text); -} - - -/* hover/focus */ -.datepicker-cell.focused, -.datepicker-cell.today.focused, -.datepicker-cell.highlighted:not(.range,.disabled):hover, -.datepicker-cell.highlighted:not(.range).focused, -.datepicker-cell:not(.disabled):hover { - background-color: var(--ui-color-highlight); - color: var(--ui-color-text); - cursor: pointer; -} - - -.datepicker-cell.range-start { border-radius: 4px 0 0 4px; } -.datepicker-cell.range-end { border-radius: 0 4px 4px 0; } -.datepicker-cell.range { border-radius: 0; background-color: #dbdbdb; } -.datepicker-cell.range-end:not(.selected), -.datepicker-cell.range-start:not(.selected) { background-color: #b5b5b5; color: #fff; } -.datepicker-cell.range-end.focused:not(.selected), -.datepicker-cell.range-start.focused:not(.selected) { background-color: #afafaf; } -.datepicker-cell.range:not(.disabled,.focused,.today):hover { background-color: #d5d5d5; } -.datepicker-cell.range.disabled { color: #c2c2c2; } -.datepicker-cell.range.focused { background-color: #cfcfcf; } - - - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .datepicker-picker { - background-color: var(--ui-color-background-semi); - -webkit-backdrop-filter: blur(30px); - backdrop-filter: blur(30px); - } -} - -.input .error-wrap, -.radio .error-wrap, -.checkbox .error-wrap { - display: flex; - flex-flow: row; - align-items: stretch; - justify-content: flex-start; -} - -.checkbox .error-wrap, -.radio .error-wrap { overflow: hidden; } - - -.input .info-bar-error, -.radio .info-bar-error, -.textarea .info-bar-error { - padding-bottom: calc(0.4rem + 10px); - margin-bottom: -10px; - border: none; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; -} - -.checkbox .info-bar { margin: 0; } - -.textarea .info-bar-error { grid-area: 1 / 1 / 2 / 2; } - - - -/* Highlight whole inner div in red, to avoid rendering leaks in corners (safari) */ -.has-error.input .input-inner, -.has-error.textarea .textarea-inner { background-color: var(--ui-color-danger-semi); } - -.has-error.input .input-inner { border-color: var(--ui-color-danger); } - -.has-error.input .input-inner:focus-within, -.has-error.input .input-inner:has(:active):not(.disabled) { box-shadow: var(--ui-shadow-danger); } - -.has-error.input .info-bar-error, -.has-error.textarea .info-bar-error { background-color: transparent; } - -.input-math { - position: relative; - display: inline-flex; - flex-flow: column; - align-items: stretch; - justify-content: space-between; -} - -.input-math input { padding-left: 30px; text-align: right; } - -.input-password { - position: relative; - display: inline-flex; - flex-flow: column; - align-items: stretch; - justify-content: space-between; -} - -.input-password input { - font-family: verdana, sans-serif; - width: 100%; - padding-right: 36px; -} - - -.input-password.visible input { font-family: inherit; } -.input-password.visible .input-password-button { color: var(--ui-color-danger); } -.input-password.visible .input-password-button svg { stroke-width: 2; } - - - -/* PASSWORD STRENGTH */ -.password-strength { - width: calc(100% - 6px); - height: 3px; - margin: -7px 3px 0; - border-radius: 10px; - background-color: var(--ui-color-background-input); - cursor: default; -} - -.password-strength-progress { - height: 100%; - border-radius: inherit; - transition: width var(--ui-animation-speed) ease-out; - background-color: var(--ui-color-danger); -} - -.password-strength-progress.warning { background-color: var(--ui-color-warning); } -.password-strength-progress.info { background-color: var(--ui-color-info); } -.password-strength-progress.success { background-color: var(--ui-color-success); } - - -.password-strength-info { - position: absolute; - top: 0; - display: none; - cursor: default; - width: calc(100% - 2px); - flex-flow: column; - align-items: stretch; - gap: 1rem; - font-size: 0.8rem; - margin: 0.2rem 1px 0; - padding: 0.8rem; - border-radius: var(--ui-border-radius); - background-color: var(--ui-color-background-input); - border: 1px solid var(--ui-color-danger); - z-index: var(--ui-z-index-elevated); -} - -.input-password:focus-within .password-strength-info { display: flex; } - -.password-strength-info.warning { border-color: var(--ui-color-warning); } -.password-strength-info.info { border-color: var(--ui-color-info); } -.password-strength-info.success { border-color: var(--ui-color-success); } - -.password-strength-info h2 { font-size: var(--ui-font-s); text-align: left; margin-bottom: 0; } -.password-strength-info small { font-size: var(--ui-font-xs); margin: 0; line-height: 1.4; } -.password-strength-info small:empty { display: none; } - -.input-rating { min-width: fit-content; } - -.input-rating .input-inner, -.input-rating .input-inner:focus { outline: none; } - -.input-rating .input-row { - align-items: stretch; - justify-content: flex-start; - height: var(--ui-button-height); - background-color: var(--ui-color-background-input); -} - -.input-rating .button { - position: static; - right: unset; - cursor: default; - user-select: none; - -ms-touch-action: manipulation; - touch-action: manipulation; - font-size: 1.2rem; - margin: 0; -} - -.input-rating .button:focus-visible { box-shadow: none; } - -.input-rating .btn-reset { margin-left: auto; } -.input-rating .btn-reset:focus-visible { color: var(--ui-color-accent); } - -.input-rating .button.active svg { color: var(--ui-color-accent); fill: var(--ui-color-accent); } - -.input-rating .button.button-link, -.input-rating .button.button-link:focus-visible, -.input-rating .button.button-link:hover { text-decoration: none; } - -.input-rating.light:not(.has-error) .input-inner, -.input-rating.light:not(.has-error) .input-row { background-color: transparent; border: none; } - -.input-search input { - padding-left: calc(2rem + 6px); - padding-right: 2rem; - appearance: none; - -webkit-appearance: none; -} -::-webkit-search-cancel-button { display: none; } - -.input-search .input-row>.icon { top: 1px; } - -.input-search-button { display: none; } -.input-search-button.visible { display: inline-flex; } - -.input-tag .input-inner { touch-action: manipulation; } -.input-tag .input-inner:focus { outline: none; } -.input-tag .input-inner[aria-expanded="true"] { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); -} - - -.input-tag .input-row { - min-height: calc(var(--ui-button-height) - 2px); - padding: 4px 0.3rem 3px; - align-items: flex-start; - justify-content: flex-start; - gap: 0.2rem; - flex-wrap: wrap; -} - -.input-tag .input-row > .icon { position: static; flex-shrink: 0; margin-top: 0.14rem; } - -.input-tag .ui-tag { height: 1.7rem; } - -.input-tag-popover { width: 25ch; } -.input-tag-popover .popover-content { padding: 0.5rem; } - -.input-tag-list-tags { - display: flex; - flex-flow: row wrap; - gap: 0.2rem; - flex: 1; - max-height: 10rem; - overflow-y: auto; -} - -.input-tag-list-add-row { display: flex; align-items: center; gap: 0.5rem; } -.input-tag-list-add-row .input { width: 100px; flex: 1; } -.input-tag-list-add-row .input input { background: var(--ui-color-background-semi); } - - -.input-tag-list-tags:not(:empty) { - margin-bottom: 0.5rem; - padding-bottom: 0.5rem; - border-bottom: var(--ui-popup-border); -} - -.input-text .input-inner { - overflow: hidden; -} - -.input-time .input-row { - border-radius: inherit; - background: var(--ui-color-background-input); -} - -.input-time input { margin-left: calc(2rem - 2px); } - -.label { - height: var(--ui-button-height); - line-height: 1.6; - padding: 0; - display: inline-flex; - align-items: center; - -ms-touch-action: manipulation; - touch-action: manipulation; -} - -.label.disabled { - pointer-events: none; - -webkit-user-select: none; - user-select: none; -} - -/* to offset input's border (visually) */ -.input .label { padding-inline: 1px; } - - -.label-on-the-left .label { - padding-inline: 0; - padding-top: 1px; - width: max-content; - white-space: nowrap; -} - - -.radio.label-on-the-left, -.input-tag.label-on-the-left, -.textarea.label-on-the-left { align-items: flex-start; } - -.radio.label-on-the-left>.label, -.input-tag.label-on-the-left .label, -.textarea.label-on-the-left .label { height: calc(var(--ui-button-height) + 2px); } - -.radio.label-on-the-left>.label { margin-block: var(--ui-margin-s); } - -/* more styling defined in ../check-and-radio.css */ - -.radio { - min-width: 26ch; - width: min-content; - max-width: 100%; - - --ui-radio-padding: var(--ui-margin-s); -} - - -.radio input { - border-radius: 10rem; - width: 1.3rem; - height: 1.3rem; -} -.radio input:focus { box-shadow: none } -.radio input::after { - background: var(--ui-color-text-1); - width: 65%; - height: 65%; - border-radius: inherit; -} - - -.radio-inner { - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: flex-start; - width: 100%; - padding: 0; - border: 1px solid var(--ui-color-border); - border-radius: calc(var(--ui-border-radius) + var(--ui-radio-padding)); - background-color: var(--ui-color-background-input); - overflow: hidden; -} - - -.radio-items { - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: flex-start; - gap: var(--ui-radio-padding); - width: 100%; - padding: var(--ui-radio-padding) 0; - background-color: var(--ui-color-background-input); - border-radius: inherit; -} - - -.radio-item { - display: flex; - flex-flow: row; - align-items: center; - justify-content: flex-start; - gap: 0.5rem; - width: calc(100% - calc(var(--ui-radio-padding) * 2)); - margin: 0 var(--ui-radio-padding); - padding: 0 var(--ui-margin); - border-radius: var(--ui-border-radius); -} - -.radio-item.disabled { opacity: 0.5; } -.radio-item.disabled input { opacity: 1; } - -.radio-item:not(.disabled):focus-within, -.radio-item:not(.disabled):hover { background-color: var(--ui-color-highlight-1); } - - - -.radio-inner:focus-within, -.radio-inner:has(:active):not(.disabled) { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); -} - -.radio.has-error .radio-inner { - border-color: var(--ui-color-danger); - background-color: var(--ui-color-danger-semi); -} -.radio.has-error .info-bar-error { background-color: transparent; } - - -.has-error .radio-inner:focus-within, -.has-error .radio-inner:has(:active):not(.disabled) { - box-shadow: var(--ui-shadow-danger); - border-color: var(--ui-color-danger); -} - -.range { - position: relative; - width: 25ch; - vertical-align: top; - --range-size: calc(var(--ui-button-height) / 3 * 2); -} - -.range .range-inner { - display: flex; - flex-flow: column; - gap: 0.5rem; - flex: 1; - padding: 0 0 0.5rem; - position: relative; - height: 100%; -} - - -.range input { - -webkit-appearance: none; - appearance: none; - margin: 0; - width: 100%; - height: 0.5rem; - border-radius: 5rem; - padding-inline: 0; - border: 1px solid var(--ui-color-border); - background: var(--ui-color-background-input); - background-image: linear-gradient(var(--ui-color-highlight), var(--ui-color-highlight)); - background-size: 70% 100%; - background-repeat: no-repeat; - background-clip: padding-box; -} - - - - -.range input::-webkit-slider-runnable-track { - -webkit-appearance: none; - display: block; - height: 0.5rem; - border-radius: 0.5rem; -} - -.range input::-webkit-slider-thumb { - -webkit-appearance: none; - appearance: none; - background-color: var(--ui-color-text); - height: var(--range-size); - width: var(--range-size); - border-radius: 5rem; - box-shadow: 0 1px 3px #000c; - transform: translateY(calc(-50% + 0.25rem - 1px)); - transform-origin: center 25%; -} - - -.range input::-moz-range-track { - display: flex; - align-items: center; - background-color: var(--ui-color-background-input); - height: 0.5rem; - border-radius: 0.5rem; -} - -.range input::-moz-range-thumb { - background-color: var(--ui-color-text); - height: var(--range-size); - width: var(--range-size); - border-radius: 5rem; - box-shadow: 0 1px 3px #000c; -} - - -/* Cannot be merged, as it won't work in safari */ -.range:not(.disabled) input::-webkit-slider-thumb:active { scale: 0.9; } -.range:not(.disabled) input::-moz-slider-thumb:active { scale: 0.9; } - - - -.range-ticks { - display: flex; - justify-content: space-between; - margin: 0 -0.1rem 0.4rem; - cursor: default; -} -.range-ticks span { width: 3ch; text-align: center; } -.range:not(.disabled) .range-ticks span { cursor: pointer; } - - -.range.label-on-the-left { align-items: flex-end; } -.range.label-on-the-left .label { height: 1.8rem; } - -.select { font: inherit; position: relative; } - -.select select { - -moz-appearance: none; - -webkit-appearance: none; - appearance: none; - - font-size: 1rem; - font-family: inherit; - background: none; - padding: 0 30px 0 var(--ui-margin-m); - width: 100%; - - border: 1px solid transparent; - height: calc(var(--ui-button-height) - 2px); - line-height: 1.2; - color: var(--ui-color-text); - background-color: var(--ui-color-background-input); - border-radius: var(--ui-border-radius); -} - -.select select:focus { outline: 0; } - -.select optgroup { font-weight: 500; } - -.select .input-row::after { - content: ""; - position: absolute; - width: 2rem; - right: 0; - top: 0; - bottom: 0; - opacity: 0.6; - pointer-events: none; - background-repeat: no-repeat; - background-position: right 0.7rem center; - background-size: 0.6rem 0.8rem; - background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23bbb' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"); -} - -.theme-light .select .input-row::after { - background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23222' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"); -} - -.textarea { position: relative; width: 25ch; vertical-align: top; } - -.textarea.autogrow .textarea-inner::after, -.textarea textarea { - font: inherit; - line-height: 1.3; - border: 1px solid transparent; - margin: 0; - width: 100%; - padding: var(--ui-margin-m); - grid-area: 2 / 1 / 2 / 2; -} - - -.textarea .textarea-inner { - width: 100%; - display: inline-grid; - align-items: stretch; - background-color: var(--ui-color-background-input); - border-radius: var(--ui-border-radius); - border: 1px solid var(--ui-color-border); -} - -.textarea textarea { - resize: vertical; - color: var(--ui-color-text); - border-radius: var(--ui-border-radius); - border: none; - min-height: 2.6rem; - background-color: var(--ui-color-background-input); -} - - -.textarea .textarea-inner:focus-within { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - outline: 0; -} - -.textarea textarea:focus { outline: none; box-shadow: none; border: none; } -.textarea textarea:invalid { border: none; box-shadow: none; } -.textarea textarea:disabled { opacity: 0.5; } - - -.textarea.autogrow .textarea-inner::after { - content: attr(data-value) " "; - visibility: hidden; - white-space: pre-wrap; - min-width: 1rem; - resize: none; - background: none; - appearance: none; -} - -.textarea.autogrow textarea { resize: none; } - - -.textarea.has-error .textarea-inner { border-color: var(--ui-color-danger); } -.textarea.has-error .textarea-inner:focus-within { box-shadow: var(--ui-shadow-danger); } - -.toggle { - --toggle-width: 60px; - --toggle-padding: 2px; - --border-radius: var(--ui-border-radius-xl); - --toggle-height: calc(var(--toggle-width) / 2.5); - --knob-size: var(--toggle-height); - - display: inline-flex; - flex-flow: column; - align-items: flex-start; - position: relative; - vertical-align: middle; - -webkit-user-select: none; - user-select: none; - - border-radius: var(--border-radius); -} - -.toggle-inner { - border: 1px solid var(--ui-color-text-2); - padding: var(--toggle-padding); - border-radius: inherit; - background-color: var(--ui-color-background-2); - position: relative; - margin-block: 3px; -} - -.toggle:has(:disabled) { pointer-events: none; opacity: 0.6; } - -.toggle:focus { outline: none; } -.toggle:focus-visible .toggle-inner { - box-shadow: var(--ui-shadow-focus); - border-color: var(--ui-color-accent); -} - -.toggle-input { display: none; } - -.toggle-label { - width: var(--toggle-width); - height: var(--toggle-height); - border-radius: calc(var(--border-radius) - var(--toggle-padding)); - display: flex; - align-items: center; - justify-content: flex-start; - flex-shrink: 0; - overflow: hidden; - cursor: pointer; -} - -.toggle-scroller { - height: 100%; - border-radius: inherit; - display: inline-flex; - align-items: center; - justify-content: center; - transition: margin-left .2s cubic-bezier(.85, .05, .18, 1.4); - flex-shrink: 0; - width: calc(200% - var(--toggle-height)); - margin-left: calc(var(--toggle-height) - var(--toggle-width) - var(--toggle-padding)); -} - -.toggle-option { - width: 50%; - height: 100%; - border-radius: inherit; - background-color: green; - display: inline-flex; - align-items: center; - justify-content: center; - background-repeat: no-repeat; - background-position: center; - background-size: calc(var(--toggle-width) / 5); -} -.toggle-option:first-of-type { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - background-color: var(--ui-color-highlight); - background-position: 41% 47%; - background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"); -} -.toggle-option:last-of-type { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - background-color: var(--ui-color-background-input); - background-position: 62% 55%; - background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"); -} - -.theme-light .toggle-option:first-of-type { - background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E"); -} - -.theme-light .toggle-option:last-of-type { - background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E"); -} - -.toggle-handle { - width: 0; - height: 0; - position: absolute; - transition: left .2s cubic-bezier(.85, .05, .18, 1.4); - border-radius: inherit; - left: calc(var(--toggle-height) / 2 + var(--toggle-padding)); - -} - -.toggle-knob { - width: var(--knob-size); - height: var(--knob-size); - background: var(--ui-color-text-1); - border: 1px solid var(--ui-color-text-2); - transform: translate(-50%, -50%); - border-radius: inherit; -} - -/* this is calculated in js -.checked .toggle-scroller { margin-left: 0; } -.checked .toggle-handle { left: calc(var(--toggle-width) + var(--toggle-padding) - var(--toggle-height) / 2); } -*/ - -.notification-archive { - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: flex-start; - width: 100%; - z-index: 5; - transform: translateX(calc(var(--ui-notification-width) + var(--ui-notification-gap) + 1rem)); - transition: transform var(--ui-animation-speed) ease-out; -} - -.notification-archive .notification { z-index: 1; } -.notification-archive header { - display: flex; - align-items: center; - justify-content: space-between; - margin: var(--ui-notification-gap) var(--ui-notification-gap) 0; - color: var(--ui-color-text); - z-index: 1; - background-color: var(--ui-color-background-input); - padding: 0.75rem 0.5rem 0.75rem 1rem; - border-radius: var(--ui-border-radius); -} - -.notification-archive button { - color: inherit; - font-size: var(--ui-font-l); - font-weight: 300; - min-width: 1.8rem; - min-height: 1.8rem; -} - - -.notification-archive h2 { - color: inherit; - font-size: var(--ui-font-l); - margin: 0; - padding: 0; - border: none; -} -.notification-archive h2 .button { padding-inline: var(--ui-margin-m); margin-left: -0.5rem; } -.notification-archive h2 .button svg { transform: rotate(0deg); transition: transform var(--ui-animation-speed) ease-out; } - -.notification-archive.expanded h2 .button svg { transform: rotate(90deg); } - -.notification-archive.inert { pointer-events: none; } - -.notification-archive-buttons { - white-space: nowrap; - display: flex; - align-items: center; - justify-content: space-between; - gap: 0.2rem; -} - -.notification-archive-buttons .btn-close { - font-size: 1.4rem; - height: 1.8rem; - width: 1.7rem; - padding-bottom: 0.15rem; -} - - -.notification.archived { filter: saturate(0.3); } - -.notification-timestamp { - color: var(--ui-color-text-semi); - font-size: var(--ui-font-xs); - margin-inline: 0.5rem; -} -.show-archive .notification-archive { - transform: translateX(0); - margin-bottom: 1rem; - height: auto; - overflow: visible; -} - -.notification-center { - --ui-notification-border-radius: var(--ui-border-radius); - --ui-notification-gap: 0.75rem; - --ui-notification-width: 30rem; - - position: fixed; - transform: translateZ(1px); - display: flex; - flex-flow: column; - align-items: stretch; - justify-content: flex-start; - width: calc(var(--ui-notification-width) + var(--ui-notification-gap) * 2); - top: 0; - right: 0; - z-index: -1; - max-height: 100vh; - overflow: hidden auto; - overscroll-behavior: contain; -} - -.notification-center.archive-is-visible, -.notification-center.has-active-notifications { z-index: var(--ui-z-index-popup); } - - -.notification { - font-size: var(--ui-font-m); - position: relative; - overflow: hidden; - flex-grow: 0; - flex-shrink: 0; - display: flex; - align-items: center; - justify-content: space-between; - min-height: 2rem; - border: none; - margin: var(--ui-notification-gap) var(--ui-notification-gap) 0; - box-shadow: var(--ui-shadow-fancy); - border-radius: var(--ui-notification-border-radius); - z-index: var(--ui-z-index-popup); -} - -.notification:last-child { margin-bottom: calc(var(--ui-notification-gap) + 10px); } - -.notification button { - background: none; - color: var(--ui-color-text); - height: 1.8rem; - min-width: 1.6rem; - font-size: inherit; - padding: 0 var(--ui-margin-m); - margin: 0 var(--ui-margin-m) 0 0; - display: flex; - align-items: center; - justify-content: center; - border-radius: var(--ui-border-radius); - border: 1px solid transparent; -} - -.notification button:focus-visible { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - outline: none; -} - -.notification button:hover { color: var(--ui-color-text-2); background: #2228; } -.notification button:active { color: var(--ui-color-text-1); background: #0008; } - -.notification .notification-close { - font-size: 1.4rem; - font-weight: 200; - position: relative; - padding-bottom: 0.15rem; -} - - -.notification-buttons, -.notification-icon { - min-height: 100%; - display: flex; - align-items: center; - justify-content: flex-end; -} -.notification-icon { width: var(--ui-button-height); } - - -.notification-msg { - color: var(--ui-color-text); - flex: 1; - display: flex; - align-items: center; - justify-content: flex-start; - padding: 0.8rem; - line-height: 1.4; - font-weight: 400; -} - -.notification-progressbar { - position: absolute; - inset: 0; - border-radius: inherit; - z-index: -1; -} - -.notification-progress { - height: 100%; - border-radius: inherit; - background-color: #ffffff15; - border: 1px solid #ffffff25; - margin: 0; - width: 0; - transition: width .2s; -} - - -.notification:focus { - border-color: var(--ui-color-accent); - box-shadow: var(--ui-shadow-focus); - outline: none; -} - - - -.notification-center-button svg { stroke: var(--ui-color-secondary); } -.notification-center-button.has-notifications svg { stroke: var(--ui-color-text); } -.notification-center-button.has-notifications svg>path:nth-child(2) { fill: var(--ui-color-text); } - - -@media (1px <= width <= 700px) { - .notification-center { - --ui-notification-width: calc(100vw - var(--ui-notification-gap) * 2); - } -} - - -@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { - .notification { - -webkit-backdrop-filter: blur(15px); - backdrop-filter: blur(15px); - } - - .notification-info { background-color: var(--ui-color-info-semi); } - .notification-success { background-color: var(--ui-color-success-semi); } - .notification-warning { background-color: var(--ui-color-warning-semi); } - .notification-error { background-color: var(--ui-color-danger-semi); } -} -/*# sourceMappingURL=ui.css.map */ +:root{--ui-border-radius:0.375rem;--ui-border-radius-m:0.6877rem;--ui-border-radius-l:1rem;--ui-border-radius-xl:5rem;--ui-margin:0.375rem;--ui-margin-xs:0.125rem;--ui-margin-s:0.25rem;--ui-margin-m:0.5rem;--ui-margin-l:1rem;--ui-animation-speed:.25s;--ui-button-height:2.25rem;--ui-font-system:system-ui,'Segoe UI','Roboto','Helvetica','Arial','sans-serif','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--ui-font-xs:0.875rem;--ui-font-s:0.9375rem;--ui-font-m:1rem;--ui-font-l:1.0625rem;--ui-font-xl:1.375rem;--ui-shadow-focus:0 0 2px 1px var(--ui-color-accent);--ui-shadow-danger:0 0 2px 1px var(--ui-color-danger);--ui-shadow-small:0 0 0 0.5px #fff4,0 3px 10px #0006;--ui-shadow-large:0 0 0 1px #0003,0 5px 20px #000a;--ui-shadow-fancy:0 0 0 0.5px #111,0 1px 5px rgb(0 0 0 / 30%),0 4px 10px rgb(0 0 0 / 10%),0 10px 25px rgb(0 0 0 / 8%);--ui-z-index-elevated:9;--ui-z-index-popup:999}body{font-weight:300;font-size:100%;font-family:var(--ui-font-system),sans-serif;box-sizing:border-box}body *{box-sizing:inherit}.icon-tabler{width:1.5rem;height:1.5rem}.icon-tabler-dots-vertical{margin-left:-1px}.flex-spacer{flex:1}.icon-tabler-alert-triangle{transform:translateY(1px)}.icon-tabler-logout{transform:translateX(3px)}.mobile .prevent-scrolling-on-focus:focus{animation:prevent-scrolling-on-focus 10ms}@keyframes prevent-scrolling-on-focus{0%{opacity:0}100%{opacity:1}}.theme-dark,:root{color-scheme:dark;--ui-color-accent:#bb7a00;--ui-color-accent-semi:#bb7a0066;--ui-color-highlight:#1859a3;--ui-color-highlight-semi:#1859a366;--ui-color-highlight-1:#1e4572;--ui-color-secondary:#5a5956;--ui-color-secondary-semi:#5a595666;--ui-color-info:#30506a;--ui-color-info-semi:#30506a99;--ui-color-success:#33624d;--ui-color-success-semi:#33624d99;--ui-color-warning:#795001;--ui-color-warning-semi:#79500199;--ui-color-danger:#943737;--ui-color-danger-semi:#94373799;--ui-color-border:#1b1b1b;--ui-color-border-1:#131313;--ui-color-border-2:#0c0c0c;--ui-color-background:#2f2f2f;--ui-color-background-semi:#2f2f2f66;--ui-color-background-input:#222;--ui-color-background-1:#535353;--ui-color-background-2:#1a1a1a;--ui-color-text:#fff;--ui-color-text-semi:#fff6;--ui-color-text-1:#bbb;--ui-color-text-2:#888;--ui-popup-border:1px solid #fff3;--ui-popup-background:var(--ui-color-background);--ui-shadow-button:0 1px 0 #000c;--ui-shadow-tooltip:0 0 0 1px #000,0 0 5px #0006}.theme-light{color-scheme:light;--ui-color-accent:#b37400;--ui-color-accent-semi:#b3740066;--ui-color-highlight:#8ec6ff;--ui-color-highlight-semi:#8ec6ff66;--ui-color-highlight-1:#6ba0de;--ui-color-secondary:#c0beb4;--ui-color-secondary-semi:#c0beb466;--ui-color-info:#bbd3f0;--ui-color-info-semi:#bbd3f099;--ui-color-success:#7bd7ae;--ui-color-success-semi:#7bd7ae99;--ui-color-warning:#eec64e;--ui-color-warning-semi:#eec64e99;--ui-color-danger:#eb6e6f;--ui-color-danger-semi:#eb6e6f99;--ui-color-border:#bbb;--ui-color-border-1:#aaa;--ui-color-border-2:#999;--ui-color-background:#eee;--ui-color-background-semi:#eee6;--ui-color-background-input:#c2c2c2;--ui-color-background-1:#f0f0f0;--ui-color-background-2:#ccc;--ui-color-text:#000;--ui-color-text-semi:#0006;--ui-color-text-1:#222;--ui-color-text-2:#666;--ui-popup-border:1px solid #ccc;--ui-popup-background:var(--ui-color-background);--ui-shadow-button:0 1px 0 #000c;--ui-shadow-tooltip:0 0 1px #0002,0 0 5px #0006}.button-link{background:0 0;border:none;cursor:pointer;min-width:0}.button.button-link{margin:calc(var(--ui-margin) * -1);padding:var(--ui-margin);vertical-align:baseline;text-decoration:underline}.button.button-link:focus-visible,.button.button-link:hover{text-decoration:underline;text-underline-offset:0.2rem}.button-link.info:focus-visible,.button-link.info:hover{text-decoration-color:var(--ui-color-info)}.button-link.success:focus-visible,.button-link.success:hover{text-decoration-color:var(--ui-color-success)}.button-link.warning:focus-visible,.button-link.warning:hover{text-decoration-color:var(--ui-color-warning)}.button-link.danger:focus-visible,.button-link.danger:hover,.button-link.error:focus-visible,.button-link.error:hover{text-decoration-color:var(--ui-color-danger)}.button-normal{background:var(--ui-color-secondary);border:.5px solid #0006;border-bottom-color:#000c;box-shadow:var(--ui-shadow-button);min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2)}.button-normal.info{background:var(--ui-color-info)}.button-normal.success{background:var(--ui-color-success)}.button-normal.warning{background:var(--ui-color-warning)}.button-normal.danger,.button-normal.error{background:var(--ui-color-danger)}.button-outline{background:0 0;border:2px solid var(--ui-color-secondary);min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2)}.button-outline:focus-visible,.button-outline:hover{background-color:var(--ui-color-secondary-semi)}.button-outline.info{border-color:var(--ui-color-info)}.button-outline.info:focus-visible,.button-outline.info:hover{background-color:var(--ui-color-info-semi)}.button-outline.success{border-color:var(--ui-color-success)}.button-outline.success:focus-visible,.button-outline.success:hover{background-color:var(--ui-color-success-semi)}.button-outline.warning{border-color:var(--ui-color-warning)}.button-outline.warning:focus-visible,.button-outline.warning:hover{background-color:var(--ui-color-warning-semi)}.button-outline.danger,.button-outline.error{border-color:var(--ui-color-danger)}.button-outline.danger:focus-visible,.button-outline.danger:hover,.button-outline.error:focus-visible,.button-outline.error:hover{background-color:var(--ui-color-danger-semi)}.button-text{background:0 0;border:none;min-width:calc(var(--ui-button-size) * 4);min-height:calc(var(--ui-button-size) * 2);box-shadow:none}.button-text:focus-visible,.button-text:hover{background-color:var(--ui-color-secondary)}.button-text.info:focus-visible,.button-text.info:hover{background-color:var(--ui-color-info)}.button-text.success:focus-visible,.button-text.success:hover{background-color:var(--ui-color-success)}.button-text.warning:focus-visible,.button-text.warning:hover{background-color:var(--ui-color-warning)}.button-text.danger:focus-visible,.button-text.danger:hover,.button-text.error:focus-visible,.button-text.error:hover{background-color:var(--ui-color-danger)}button{-ms-touch-action:manipulation;touch-action:manipulation}.button{--ui-button-size:1rem;font:inherit;line-height:1.4;font-weight:400;font-size:var(--ui-button-size);display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-margin-m);min-width:var(--ui-button-height);min-height:var(--ui-button-height);height:auto;margin:0;padding:0 var(--ui-margin-l);color:var(--ui-color-text);-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;border-radius:var(--ui-border-radius);text-decoration:none}.button:hover{text-decoration:none}.button:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:1px solid transparent}.button[disabled]{pointer-events:none;opacity:.6;box-shadow:none}.button svg{min-height:calc(var(--ui-button-size) * 1.25);max-height:calc(var(--ui-button-size) * 1.25);height:calc(var(--ui-button-size) * 1.25);min-width:var(--ui-button-size);width:auto;pointer-events:none}.button:not(.button-has-text){padding:0 var(--ui-margin-m)}.button:not(.button-has-text) svg{min-height:calc(var(--ui-button-size) * 1.4)}.button.round{padding:var(--ui-margin);border-radius:var(--ui-border-radius-xl)}.button.round:not(.button-has-text){aspect-ratio:1/1}.button-has-text.round{padding-inline:var(--ui-margin-l)}.button.touching,.button:active{outline:1px solid transparent;transform:translateY(1px);filter:brightness(.85)}.button:not(.push-button).touching,.button:not(.push-button):active{box-shadow:none}.button-group{border-radius:var(--ui-border-radius);max-width:100%;overflow:hidden}.button-group-scroller{width:100%;overflow:auto hidden;overscroll-behavior-x:contain;scrollbar-width:none;scrollbar-gutter:none;z-index:0;border-radius:var(--ui-border-radius)}.button-group-scroller::-webkit-scrollbar{width:0;height:0}.button-group-inner{padding:0 0 2px;display:inline-flex;flex-flow:row;align-items:center;justify-content:stretch;position:relative;z-index:1;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background)}.button-group-inner .button{flex-shrink:0;flex-grow:10;border-radius:0;position:relative;overflow:hidden}.button-group-inner .button:focus{z-index:2}.button-group .button-normal[disabled]{box-shadow:var(--ui-shadow-button)}.button-group .button:first-of-type{border-top-left-radius:var(--ui-border-radius);border-bottom-left-radius:var(--ui-border-radius)}.button-group .button:last-of-type{border-top-right-radius:var(--ui-border-radius);border-bottom-right-radius:var(--ui-border-radius)}.button-group .button-outline:not(:first-of-type){margin-left:-2px}.button-group.round{border-radius:var(--ui-border-radius-xl)}.button-group.round .button:first-of-type{border-top-left-radius:var(--ui-border-radius-xl);border-bottom-left-radius:var(--ui-border-radius-xl)}.button-group.round .button:last-of-type{border-top-right-radius:var(--ui-border-radius-xl);border-bottom-right-radius:var(--ui-border-radius-xl)}.button-group .button:not(.button-has-text):first-of-type{padding-left:9px}.button-group .button:not(.button-has-text):last-of-type{padding-right:9px}.button-group.round .button:not(.button-has-text):first-of-type{padding-right:6px;padding-left:11px}.button-group.round .button:not(.button-has-text):last-of-type{padding-left:6px;padding-right:11px}.has-dialog{position:fixed;width:100%;inset:0;overflow:hidden}.dialog-backdrop{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:calc(var(--ui-z-index-popup) - 1);background-color:rgba(0 0 0 / 0);transition:all var(--ui-animation-speed) ease-out;transform:translateZ(1px)}.dialog-backdrop.opened{background-color:rgba(0 0 0 / .6)}.dialog{--ui-dialog-border-radius:var(--ui-border-radius-m);--ui-dialog-inner-border-radius:calc(var(--ui-dialog-border-radius) - 1px);opacity:0;transform:scale(.8);transition:opacity var(--ui-animation-speed) ease-out,transform var(--ui-animation-speed) ease-out;max-height:90vh;min-width:15rem;max-width:95vw;color:var(--ui-color-text);border-radius:var(--ui-dialog-border-radius);background:var(--ui-popup-background);border:var(--ui-popup-border);box-shadow:var(--ui-shadow-large);display:flex;flex-flow:column;align-items:stretch;justify-content:stretch}.opened .dialog{opacity:1;transform:scale(1)}.dialog-footer,.dialog-header{background:var(--ui-color-background-input);padding:.7rem 1rem}.dialog-header{text-align:center;font-size:var(--ui-font-xl);font-weight:300;margin:0;border-bottom:.5px solid var(--ui-color-border)}.dialog-content{margin:0;padding:1rem;min-width:200px;flex:1;overflow-y:auto;overscroll-behavior-y:contain;outline:1px solid transparent;min-height:3rem}.dialog-content:focus{outline:0}.dialog-content:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus) inset}.dialog-footer{border-top:.5px solid var(--ui-color-border);border-bottom-left-radius:var(--ui-dialog-inner-border-radius);border-bottom-right-radius:var(--ui-dialog-inner-border-radius)}.dialog-footer [slot=footer]{width:100%;display:flex;align-items:center;justify-content:center;flex-flow:row-reverse;gap:.5rem}.dialog-footer .button-has-text{min-width:9ch}.dialog-header,.dialog.no-title .dialog-content{border-top-left-radius:var(--ui-dialog-inner-border-radius);border-top-right-radius:var(--ui-dialog-inner-border-radius)}.dialog-header:empty{display:none}.mobile .dialog-backdrop .dialog{min-height:0;min-width:0;max-height:100%;max-width:100%;box-shadow:none}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.dialog-backdrop.opened{-webkit-backdrop-filter:contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px);backdrop-filter:contrast(0.8) grayscale(0.5) brightness(0.5) blur(1px)}}.drawer{position:fixed;background-color:var(--ui-popup-background);border-left:var(--ui-popup-border);top:0;right:0;bottom:0;width:24rem;min-height:20rem;box-shadow:var(--ui-shadow-large);z-index:calc(var(--ui-z-index-popup) - 2);color:var(--ui-color-text);padding:0;overflow-y:auto;overscroll-behavior-y:contain;transform:translateZ(1px)}.drawer:focus{outline:0}.drawer-header{position:sticky;position:-webkit-sticky;background-color:inherit;top:0;width:100%;margin:0 0 1rem;padding:0 1rem 0 1.4rem;display:flex;align-items:center;justify-content:space-between}.drawer-header h2{margin:0;padding:.5rem 0}.drawer-content{padding:0 1.4rem}.grid-title{font-size:1.4rem;font-weight:300;margin:0 0 1px;padding:.5rem 1rem;background:var(--ui-color-background-input);border-bottom:1px solid var(--ui-color-border);box-shadow:0 .5px 0 var(--ui-color-background-1);z-index:5;position:relative}.grid{-webkit-user-select:none;user-select:none;cursor:default}.grid table{table-layout:fixed}.grid-item{content-visibility:auto}.grid .column-check{width:3em;padding:0 .5em}.grid .column-check .checkbox{pointer-events:none}.grid .column-check .checkbox input{border-color:var(--ui-color-background-1)}.grid .column-date{width:110px}.grid .column-number{width:110px}.grid thead{top:-2px}.grid thead th{padding-top:.75em;padding-bottom:.75em}.grid tbody{background-color:var(--ui-color-background)}.grid tbody td{padding:.3rem .5rem}.grid tfoot{bottom:-2px}.grid tfoot td{padding:.75rem .5rem}.grid tfoot .button{--button-size:0.9em;font-size:.9em;margin:0}.grid td:not(.column-check){white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis}.grid .cell-aligner{width:100%;height:100%;display:flex;align-items:center;gap:.5em}.grid .td-number,.grid .th-number{text-align:right}.grid-sortable thead th{cursor:pointer}.grid-sortable thead th span:hover{text-decoration:underline}.grid-sortable thead th .cell-aligner{min-height:20px}.grid-sortable thead th .cell-aligner span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.grid-sortable thead th.sortasc svg,.grid-sortable thead th.sortdesc svg{width:20px;height:20px;color:var(--ui-color-text-2)}.grid-sortable .th-sortable:focus-visible{outline:1px solid var(--ui-color-accent);outline-offset:-1px}.info-bar{width:100%;display:flex;align-items:flex-start;justify-content:flex-start;gap:.5rem;padding:.4rem .6rem .4rem .3rem;margin:0 0 .75rem;border-radius:var(--ui-border-radius);border-width:1px;border-style:solid}.info-bar p{margin:0;font-size:var(--ui-font-s);line-height:1.5rem}.info-bar .icon{flex-shrink:0}.info-bar-error{background-color:var(--ui-color-danger-semi);border-color:var(--ui-color-danger)}.info-bar-info{background-color:var(--ui-color-info-semi);border-color:var(--ui-color-info)}.info-bar-success{background-color:var(--ui-color-success-semi);border-color:var(--ui-color-success)}.info-bar-warning{background-color:var(--ui-color-warning-semi);border-color:var(--ui-color-warning)}input,label,select,textarea{-ms-touch-action:manipulation;touch-action:manipulation}.theme-dark input{color-scheme:dark}.theme-light input{color-scheme:light}input::placeholder,textarea::placeholder{color:var(--ui-color-text-1);font-style:italic}:where(input:not([type=radio],[type=checkbox])){font:inherit;height:calc(var(--ui-button-height) - 2px);border:1px solid transparent;line-height:1;color:var(--ui-color-text);background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius);padding:0 var(--ui-margin-m);width:25ch}:where(input:focus){outline:0;border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}:where(input:invalid){border-color:var(--ui-color-danger);box-shadow:var(--ui-shadow-danger)}input[type=color]{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;border:none;padding:0;cursor:pointer}:where(input:disabled){opacity:.75;cursor:default}.check-and-radio input{appearance:none;width:1.4rem;height:1.4rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.3em;background:var(--ui-color-background-input);border:1px solid var(--ui-color-text-2);color:var(--ui-color-text-1);font:inherit;flex-shrink:0;-ms-touch-action:manipulation;touch-action:manipulation}.check-and-radio input::after{content:" ";display:block;opacity:0;font-size:var(--ui-font-m);line-height:1;align-self:center;color:inherit;margin:0;transition:opacity calc(var(--ui-animation-speed) / 2) ease-out}.check-and-radio input:checked::after{opacity:1}.input{width:25ch;vertical-align:middle}.input .input-inner{display:flex;flex-flow:column;align-items:stretch;justify-content:stretch;border-radius:var(--ui-border-radius);background:var(--ui-color-background-input);border:1px solid var(--ui-color-border)}.button-toggle.input.label-on-the-left,.input.label-on-the-left,.radio.label-on-the-left,.range.label-on-the-left,.textarea.label-on-the-left,.toggle.label-on-the-left{display:inline-flex;flex-flow:row;align-items:center;width:100%;gap:1rem}.label-on-the-left .input-inner,.label-on-the-left .range-inner{flex:1}.input-inner:focus-within,.input-inner:has(:active):not(.disabled){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.input,.input input:disabled,.input select:disabled,.range input:disabled,.textarea textarea:disabled{opacity:1;color:var(--ui-color-text)}.input .input-inner:has(:disabled),.range .range-inner:has(:disabled),.textarea .textarea-inner:has(:disabled){opacity:.7}.input input:not([type=radio]){width:100%;border:none}.input input:not([type=radio]):focus,.input input:not([type=radio]):invalid{box-shadow:none;border:none}.input-row{width:100%;display:flex;flex-flow:row;align-items:center;justify-content:space-between;position:relative;border-radius:inherit}.input-row>.button,.input-row>.icon{position:absolute;height:100%;z-index:1}.input-row>.button{color:var(--ui-color-text-1);right:2px}.input-row>.icon{color:var(--ui-color-text-2);left:.3rem;width:1.5rem;pointer-events:none}.menu{position:absolute;padding:.25rem;margin:0;display:flex;width:auto;flex-flow:column;align-items:stretch;list-style:none;overflow:hidden auto;cursor:default;z-index:var(--ui-z-index-popup);max-height:calc(100vh - 4px);-webkit-user-select:none;user-select:none;overscroll-behavior-y:contain;color:var(--ui-color-text);border:var(--ui-popup-border);border-radius:calc(var(--ui-border-radius) + 2px);background:var(--ui-popup-background);box-shadow:var(--ui-shadow-fancy);transform:translateZ(1px)}.menu:focus{outline:0}.menu-item{font:inherit;font-size:var(--ui-font-s);align-items:center;border-radius:var(--ui-border-radius);color:inherit;background:0 0;border:none;display:flex;flex-shrink:0;letter-spacing:.1px;justify-content:space-between;margin:0;overflow:hidden;padding:.5rem .9rem;position:relative;text-align:left;white-space:nowrap;width:100%}.menu-item-shortcut{margin:-.1rem 0 -.1rem auto;letter-spacing:.1rem;line-height:1.35;opacity:.5}.menu-item-shortcut:empty{visibility:hidden}.menu-item.disabled{pointer-events:none;opacity:.6}.menu-item:focus{background-color:var(--ui-color-highlight);outline:1px solid transparent}.menu-item:focus.success{background-color:var(--ui-color-success)}.menu-item:focus.warning{background-color:var(--ui-color-warning)}.menu-item:focus.danger{background-color:var(--ui-color-danger)}.menu-item:focus .menu-item-shortcut{opacity:1}.menu-item svg{width:1.1rem;height:1.1rem;margin:0 .5rem 0 0}.menu-item-content{display:flex;min-width:0;align-items:center;justify-content:space-between;margin-right:1rem}.menu-item-text{overflow:hidden;text-overflow:ellipsis;line-height:1.35}.menu-separator{height:0;width:auto;padding:0;margin:var(--ui-margin) .8rem;border-bottom:var(--ui-popup-border)}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.menu{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.message-box .dialog-content{display:flex;flex-flow:row;gap:1rem;font-size:var(--ui-font-l);padding:1rem}.message-box .dialog-content .message{display:flex;align-items:center;min-height:fit-content}.message-box .dialog-content .message-content{margin:0;line-height:1.5}.message-box .dialog-content .icon,.message-box .dialog-content svg{height:3rem}.message-box .dialog-content svg:empty{width:0}.message-box .dialog-content:has(svg:empty){gap:0}.message-box .dialog-content:has(svg:empty) .message{flex:1;justify-content:center}.message-box .dialog-content .icon{width:3rem;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;position:sticky;top:0}.message-info .dialog-content{background-color:var(--ui-color-info-semi)}.message-warning .dialog-content{background-color:var(--ui-color-warning-semi)}.message-error .dialog-content{background-color:var(--ui-color-danger-semi)}.message-success .dialog-content{background-color:var(--ui-color-success-semi)}.panel{overflow:hidden;will-change:height;position:relative;border:2px solid var(--ui-color-border);background:var(--ui-color-background-2);margin-bottom:1rem}.panel details{margin:1px}.panel-header{color:var(--ui-color-text);text-align:left;border:none;display:flex;align-items:center;justify-content:space-between;font-weight:300;font-size:var(--ui-font-m);padding:0 .6rem 0 1rem;height:2.5rem;line-height:1;-webkit-user-select:none;user-select:none}.collapsible .panel-header{cursor:pointer}.panel-header::-webkit-details-marker{display:none}.panel-content{background:var(--ui-color-background);padding:1rem}.panel-content>*{opacity:0;transition:opacity var(--ui-animation-speed) ease-out}.panel.expanded .panel-content>*{opacity:1}.panel .chevron{height:1.2rem;transform:rotate(0);transition:transform var(--ui-animation-speed) ease-out}.panel .chevron svg{width:1.2rem;height:1.2rem}.panel.expanded .chevron{transform:rotate(90deg)}.panel.round{border-radius:var(--ui-border-radius)}.panel.round .panel-content{border-radius:calc(var(--ui-border-radius) - 2px)}.panel.disabled{opacity:.5}.panel-header:focus{outline:0}.panel:has(.panel-header:focus-visible){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);z-index:2}.panel.info{border-color:var(--ui-color-info);background:var(--ui-color-info-semi)}.panel.success{border-color:var(--ui-color-success);background:var(--ui-color-success-semi)}.panel.warning{border-color:var(--ui-color-warning);background:var(--ui-color-warning-semi)}.panel.danger{border-color:var(--ui-color-danger);background:var(--ui-color-danger-semi)}.popover-plate{--popover-tip-size:14px;--popover-color:var(--ui-popup-background);--popover-border:var(--ui-popup-border);--tip-offset:50%;position:absolute;transform:translateZ(1px);z-index:var(--ui-z-index-popup)}.popover-plate.opening{opacity:0}.popover{position:relative;border-radius:var(--ui-border-radius-m);box-shadow:var(--ui-shadow-tooltip)}.popover-plate.hide-tip .popover{box-shadow:var(--ui-shadow-fancy)}.popover-plate:not(.hide-tip) .popover-content::before,.popover-plate:not(.hide-tip) .popover::before{content:'';position:absolute;display:block;width:var(--popover-tip-size);height:var(--popover-tip-size);transform:rotate(45deg) skew(8deg,8deg);left:var(--tip-offset);margin-left:calc(var(--popover-tip-size)/ -2)}.popover-plate:not(.hide-tip) .popover::before{box-shadow:var(--ui-shadow-tooltip);background-color:var(--popover-color);border:var(--popover-border);border-width:1.5px;margin-left:calc(var(--popover-tip-size)/ -2 - .5px)}.popover-content{padding:1rem;text-align:center;position:relative;border-radius:inherit;z-index:1;background-color:var(--popover-color);border:var(--popover-border)}.popover-content>*{position:relative}.popover-plate:not(.hide-tip) .popover-content::before{background-color:inherit;z-index:-1}.popover-content:focus,.popover-plate .popover:focus,.popover-plate:focus{outline:0}.popover-top:not(.hide-tip){padding-bottom:var(--popover-tip-size)}.popover-top:not(.hide-tip) .popover::before{border-radius:0 0 3px;bottom:calc(var(--popover-tip-size)/ -2)}.popover-top:not(.hide-tip) .popover-content::before{border-radius:0 0 2px;bottom:calc(var(--popover-tip-size)/ -2)}.popover-bottom:not(.hide-tip){padding-top:var(--popover-tip-size)}.popover-bottom:not(.hide-tip) .popover::before{border-radius:3px 0 0;top:calc(var(--popover-tip-size)/ -2)}.popover-bottom:not(.hide-tip) .popover-content::before{border-radius:2px 0 0;top:calc(var(--popover-tip-size)/ -2)}.theme-light .popover-plate{--popover-color:#fff}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.popover-plate.hide-tip .popover-content{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.push-button.touching,.push-button:active,.push-button[aria-pressed=true]{filter:brightness(.85) contrast(1.1);transform:translateY(1px);box-shadow:0 1px 0 rgb(0 0 0/.8) inset}.push-button[aria-pressed=true]:focus-visible{box-shadow:0 1px 0 rgb(0 0 0/.8) inset,var(--ui-shadow-focus)}.push-button[aria-pressed=true].button-outline{background-color:var(--ui-color-secondary-semi)}.push-button[aria-pressed=true].button-outline.info{background-color:var(--ui-color-info-semi)}.push-button[aria-pressed=true].button-outline.success{background-color:var(--ui-color-success-semi)}.push-button[aria-pressed=true].button-outline.warning{background-color:var(--ui-color-warning-semi)}.push-button[aria-pressed=true].button-outline.danger{background-color:var(--ui-color-danger-semi)}.push-button.button-outline.touching,.push-button.button-outline:active,.push-button.button-outline[aria-pressed=true]{box-shadow:none}.splitter{position:absolute;height:100%;width:16px;z-index:90;cursor:ew-resize}.splitter::after{content:" ";display:block;width:6px;height:100%;margin:0 auto}.splitter.vertical{width:100%;height:16px;cursor:ns-resize}.splitter.vertical::after{width:100%;height:6px;margin:auto 0}.splitter.is-dragging::after,.splitter:hover::after{background-color:var(--ui-color-background-1)}.table{width:100%;max-height:100%;overflow:auto;overscroll-behavior-y:contain;position:relative;border:2px solid var(--ui-color-border)}.table table{border-spacing:0;width:100%;table-layout:fixed}.table.round{border-radius:var(--ui-border-radius)}.table.selectable{cursor:default;-webkit-user-select:none;user-select:none}.table tfoot,.table thead{position:sticky;z-index:2}.table thead{top:0}.table tfoot{bottom:0}.table tfoot td,.table thead th{padding:var(--ui-margin-m);font-weight:400;text-align:left;vertical-align:middle;background:var(--ui-color-background-input)}.table tbody:focus,.table tbody:focus tr,.table tr:focus,.table tr:focus-within{outline:1px solid transparent;background-color:var(--ui-color-highlight-1)}.table tbody td{padding:var(--ui-margin) var(--ui-margin-m) calc(var(--ui-margin) + 1px);border-bottom:1px solid var(--ui-color-border);vertical-align:middle;line-height:1.5rem}.table td:first-child,.table th:first-child{padding-left:var(--ui-margin-l)}.table td:last-child,.table th:last-child{padding-right:var(--ui-margin-l)}.table tbody:last-of-type tr:last-child td{border-bottom:none}.ui-tag{border:1px solid var(--ui-color-border);background:var(--ui-color-secondary);border-radius:var(--ui-border-radius);padding:.4rem .7rem;display:inline-flex;align-items:center;gap:.2rem;height:2rem;cursor:default;color:var(--ui-color-text);-webkit-user-select:none;user-select:none}.ui-tag.clickable{touch-action:manipulation;cursor:pointer}.ui-tag.clickable:not(.disabled):active{transform:translateY(1px);filter:brightness(.85)}.ui-tag .icon{width:1rem;height:1rem;margin-left:-4px;transform:translateZ(1px)}.ui-tag:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:1px solid transparent}.ui-tag .ui-tag-label{padding-bottom:2px}.ui-tag.dark{color:#fff}.ui-tag.light{color:#000}.ui-tag.disabled{opacity:.5}.ui-tag.round{border-radius:var(--ui-border-radius-xl)}.ui-tag.info{background-color:var(--ui-color-info)}.ui-tag.success{background-color:var(--ui-color-success)}.ui-tag.danger{background-color:var(--ui-color-danger)}.ui-tag.warning{background-color:var(--ui-color-warning)}.ui-tag.danger,.ui-tag.info,.ui-tag.success,.ui-tag.warning{color:var(--ui-color-text)}.tooltip-plate{--popover-tip-size:10px;--popover-color:#292929}.tooltip{border-radius:5px;max-width:75vw}.tooltip-content{padding:.5rem .7rem}.info .tooltip{--popover-color:var(--ui-color-info)}.success .tooltip{--popover-color:var(--ui-color-success)}.danger .tooltip{--popover-color:var(--ui-color-danger)}.warning .tooltip{--popover-color:var(--ui-color-warning)}.tree,.tree ul{padding:0;margin:0;list-style:none}.tree ul li,.tree>li{display:block;width:100%;padding:0;margin:0}.tree{display:flex;flex-flow:column;align-items:stretch;overflow:hidden;position:relative;margin:0;padding:.3rem;border-radius:var(--ui-border-radius)}.tree:focus{outline:0}.tree:focus-visible{box-shadow:0 0 0 1px var(--ui-color-accent),var(--ui-shadow-focus)}.tree-node{cursor:pointer;display:flex;align-items:center;border-radius:var(--ui-border-radius);padding:0 .5rem;height:var(--ui-button-height);-ms-touch-action:manipulation;touch-action:manipulation}.tree-node.selected{background-color:var(--ui-color-highlight-1)}.tree-node:hover{background-color:var(--ui-color-highlight)}.tree-icon{display:inline-block;width:1.5rem;height:1.5rem;margin-right:.5rem;background-color:var(--ui-color-text-2);-webkit-mask-size:1.5rem;-webkit-mask-repeat:no-repeat;-webkit-mask-position:0 center;mask-size:1.5rem;mask-repeat:no-repeat;mask-position:0 center}.tree-label{line-height:2}.tree-indent{display:block;width:.8rem;margin-right:1rem;height:100%;border-right:1px solid transparent}.tree .tree-indent{border-right-color:var(--ui-color-border-1)}.tree-file-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M14 3v4a1 1 0 0 0 1 1h4' /%3E%3Cpath d='M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z' /%3E%3C/svg%3E")}.tree-folder-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='12' y1='10' x2='12' y2='16' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E")}.expanded .tree-folder-icon{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' stroke-width='1.5' stroke='white' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2' /%3E%3Cline x1='9' y1='13' x2='15' y2='13' /%3E%3C/svg%3E")}.button-toggle.input{width:min-content;max-width:100%;padding:0;flex-flow:column;align-items:flex-start;justify-content:flex-start;border-radius:calc(var(--ui-border-radius) + 1px)}.button-toggle .input-inner{width:100%;overflow:hidden;border-radius:calc(var(--ui-border-radius) + 1px)}.button-toggle .input-scroller{width:100%;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background-input);overflow:auto hidden;overscroll-behavior-x:contain;scrollbar-width:none}.button-toggle .input-scroller::-webkit-scrollbar{width:0;height:0}.button-toggle .input-row{min-width:100%;width:min-content}.button-toggle .input-row .button{position:static;color:var(--ui-color-text);box-shadow:none;min-height:calc(var(--ui-button-height) - 2px);background:var(--ui-color-background-input);border:none;border-radius:0;flex:1;border-left:1px solid var(--ui-color-border);min-width:min-content}.button-toggle .button:has(:checked){background-color:var(--ui-color-highlight)}.button-toggle .input-row .button:first-child{border-left:none;border-top-left-radius:var(--ui-border-radius);border-bottom-left-radius:var(--ui-border-radius)}.button-toggle .input-row .button:last-child{border-top-right-radius:var(--ui-border-radius);border-bottom-right-radius:var(--ui-border-radius)}.button-toggle .button input{position:absolute;top:-100px;opacity:0;pointer-events:none}.button-toggle.round{border-radius:var(--ui-border-radius-xl)}.button-toggle.round:not(.has-error) .input-inner{border-radius:var(--ui-border-radius-xl)}.button-toggle.round .input-row .button:first-child{border-top-left-radius:var(--ui-border-radius-xl);border-bottom-left-radius:var(--ui-border-radius-xl)}.button-toggle.round .input-row .button:last-child{border-top-right-radius:var(--ui-border-radius-xl);border-bottom-right-radius:var(--ui-border-radius-xl)}.checkbox{display:inline-flex;flex-flow:column;align-items:stretch;justify-content:flex-start;gap:.5rem}.checkbox-row{display:inline-flex;align-items:center;justify-content:flex-start;gap:.5rem}.checkbox input:focus{border-color:var(--ui-color-accent)}.checkbox input::after{content:"✕";font-family:Arial,Helvetica,sans-serif;line-height:1.1}.checkbox.indeterminate input::after{content:" ";opacity:1;background:var(--ui-color-text-1);width:65%;height:65%;border-radius:.2rem}.checkbox input:checked::after{opacity:1}.checkbox.disabled{opacity:.5}.checkbox.disabled input{opacity:1}.checkbox.has-error input{border-color:var(--ui-color-danger)}.checkbox.has-error input:focus{box-shadow:var(--ui-shadow-danger)}.checkbox.label-on-the-left .checkbox-row{flex-flow:row-reverse}.combobox .input-inner{position:relative}.combobox input{padding-right:36px}.multiselect input{text-overflow:ellipsis}.combobox-button:focus{box-shadow:none}.combobox-list{position:absolute;z-index:var(--ui-z-index-popup);overflow-y:auto;overscroll-behavior-y:contain;padding:.2rem;min-height:0;max-height:26rem;-webkit-user-select:none;user-select:none;transform:translateZ(1px);color:var(--ui-color-text);border:var(--ui-popup-border);border-radius:calc(var(--ui-border-radius) + .2rem);background:var(--ui-popup-background);box-shadow:var(--ui-shadow-fancy)}.combobox-list.empty{padding:0;box-shadow:none;border:none}.combobox-list:not(.empty){min-height:2rem}.combobox-list.hidden{display:none}.combobox-list-header,.combobox-list-item{height:var(--ui-button-height);line-height:1;display:flex;align-items:center;white-space:nowrap;text-overflow:ellipsis;overflow-x:hidden;padding:0 1rem}.combobox-list-header{margin:.5rem 0 0;color:var(--ui-color-text-2);font-weight:500;cursor:default}.combobox-list-header:last-child{display:none}.combobox-list-empty{padding:.6rem 1.2rem;color:var(--ui-color-text-semi);cursor:default;white-space:nowrap}.combobox-list-item{color:var(--ui-color-text);cursor:pointer;border-radius:var(--ui-border-radius);-ms-touch-action:manipulation;touch-action:manipulation}.combobox-list-item svg{margin-right:.5rem}.combobox-list-item .tick{display:none}.combobox-list-item.checked .tick{display:block}.combobox-list:not(.multiselect) .combobox-list-item.in-group{padding-left:2rem}.mobile .combobox-list-item{transition:background-color .3s ease-out}.mobile .combobox-list-item.blinking{transition:background-color .1s;background-color:var(--ui-color-highlight-1)}.desktop .combobox-list-item.checked{background-color:var(--ui-color-highlight-semi)}.desktop .combobox-list-item.selected{background-color:var(--ui-color-highlight-1)}.desktop .combobox-list-item:hover{background-color:var(--ui-color-highlight)}.combobox-list-item b{color:var(--ui-color-accent)}.combobox-list-item.checked+.combobox-list-item.checked{border-top-left-radius:0;border-top-right-radius:0}.combobox-list-item.checked:has(+ .combobox-list-item.checked){border-bottom-left-radius:0;border-bottom-right-radius:0}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.combobox-list{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.input-date .input-text-inner{position:relative;overflow:unset}.input-date input{flex:1;width:100%;padding-right:36px}.input-date.native .input-date-button{pointer-events:none}.datepicker{display:none;transform:translateZ(1px)}.datepicker.active{display:block}.datepicker-dropdown{position:absolute;top:0;left:0;z-index:var(--ui-z-index-popup);padding-top:.2rem}.datepicker-dropdown.datepicker-orient-top{padding-top:0;padding-bottom:4px}.datepicker-picker{display:inline-block;overflow:hidden;border-radius:.4em;background-color:var(--ui-color-background);border:var(--ui-popup-border);box-shadow:var(--ui-shadow-fancy)}.datepicker-picker span{display:block;flex:1;border:0;border-radius:6px;cursor:default;text-align:center;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.datepicker-main{padding:var(--ui-margin-s)}.datepicker-controls,.datepicker-grid,.datepicker-view,.datepicker-view .days-of-week{display:flex}.datepicker-grid{flex-wrap:wrap;width:15.75rem}.datepicker-cell{-ms-touch-action:manipulation;touch-action:manipulation}.datepicker-cell,.datepicker-view .week{height:2.25rem;line-height:2.25rem}.datepicker-view .days .datepicker-cell,.datepicker-view .dow{flex-basis:14.2857142857%}.datepicker-view.datepicker-grid .datepicker-cell{flex-basis:25%;height:4.5rem;line-height:4.5rem}.datepicker-title{padding:.375rem .75rem;text-align:center}.datepicker-footer .datepicker-controls,.datepicker-header .datepicker-controls{padding:.2rem}.datepicker-controls .button{padding:0;width:2.5rem;min-width:2.5rem;text-align:center}.datepicker-controls .button svg{margin:0;height:1.4rem}.datepicker-controls .button.disabled{visibility:hidden}.datepicker-controls .button.view-switch{flex:auto;width:auto}.datepicker-footer .datepicker-controls .button{width:100%}.datepicker-view .dow{height:1.5rem;line-height:1.5rem;font-size:var(--ui-font-xs)}.datepicker-view .week{width:2.25rem;font-size:.75rem}.datepicker-cell.next:not(.disabled),.datepicker-cell.prev:not(.disabled){color:var(--ui-color-text-2)}.datepicker-cell.selected.next:not(.disabled),.datepicker-cell.selected.prev:not(.disabled){color:var(--ui-color-text-1)}.datepicker-cell.selected{background-color:var(--ui-color-highlight);color:var(--ui-color-text)}.datepicker-cell.disabled{color:var(--ui-color-text-2)}.datepicker-cell.today:not(.selected){background-color:var(--ui-color-secondary-semi);color:var(--ui-color-text)}.datepicker-cell.focused,.datepicker-cell.highlighted:not(.range).focused,.datepicker-cell.highlighted:not(.range,.disabled):hover,.datepicker-cell.today.focused,.datepicker-cell:not(.disabled):hover{background-color:var(--ui-color-highlight);color:var(--ui-color-text);cursor:pointer}.datepicker-cell.range-start{border-radius:4px 0 0 4px}.datepicker-cell.range-end{border-radius:0 4px 4px 0}.datepicker-cell.range{border-radius:0;background-color:#dbdbdb}.datepicker-cell.range-end:not(.selected),.datepicker-cell.range-start:not(.selected){background-color:#b5b5b5;color:#fff}.datepicker-cell.range-end.focused:not(.selected),.datepicker-cell.range-start.focused:not(.selected){background-color:#afafaf}.datepicker-cell.range:not(.disabled,.focused,.today):hover{background-color:#d5d5d5}.datepicker-cell.range.disabled{color:#c2c2c2}.datepicker-cell.range.focused{background-color:#cfcfcf}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.datepicker-picker{background-color:var(--ui-color-background-semi);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px)}}.checkbox .error-wrap,.input .error-wrap,.radio .error-wrap{display:flex;flex-flow:row;align-items:stretch;justify-content:flex-start}.checkbox .error-wrap,.radio .error-wrap{overflow:hidden}.input .info-bar-error,.radio .info-bar-error,.textarea .info-bar-error{padding-bottom:calc(.4rem + 10px);margin-bottom:-10px;border:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.checkbox .info-bar{margin:0}.textarea .info-bar-error{grid-area:1/1/2/2}.has-error.input .input-inner,.has-error.textarea .textarea-inner{background-color:var(--ui-color-danger-semi)}.has-error.input .input-inner{border-color:var(--ui-color-danger)}.has-error.input .input-inner:focus-within,.has-error.input .input-inner:has(:active):not(.disabled){box-shadow:var(--ui-shadow-danger)}.has-error.input .info-bar-error,.has-error.textarea .info-bar-error{background-color:transparent}.input-math{position:relative;display:inline-flex;flex-flow:column;align-items:stretch;justify-content:space-between}.input-math input{padding-left:30px;text-align:right}.input-password{position:relative;display:inline-flex;flex-flow:column;align-items:stretch;justify-content:space-between}.input-password input{font-family:verdana,sans-serif;width:100%;padding-right:36px}.input-password.visible input{font-family:inherit}.input-password.visible .input-password-button{color:var(--ui-color-danger)}.input-password.visible .input-password-button svg{stroke-width:2}.password-strength{width:calc(100% - 6px);height:3px;margin:-7px 3px 0;border-radius:10px;background-color:var(--ui-color-background-input);cursor:default}.password-strength-progress{height:100%;border-radius:inherit;transition:width var(--ui-animation-speed) ease-out;background-color:var(--ui-color-danger)}.password-strength-progress.warning{background-color:var(--ui-color-warning)}.password-strength-progress.info{background-color:var(--ui-color-info)}.password-strength-progress.success{background-color:var(--ui-color-success)}.password-strength-info{position:absolute;top:0;display:none;cursor:default;width:calc(100% - 2px);flex-flow:column;align-items:stretch;gap:1rem;font-size:.8rem;margin:.2rem 1px 0;padding:.8rem;border-radius:var(--ui-border-radius);background-color:var(--ui-color-background-input);border:1px solid var(--ui-color-danger);z-index:var(--ui-z-index-elevated)}.input-password:focus-within .password-strength-info{display:flex}.password-strength-info.warning{border-color:var(--ui-color-warning)}.password-strength-info.info{border-color:var(--ui-color-info)}.password-strength-info.success{border-color:var(--ui-color-success)}.password-strength-info h2{font-size:var(--ui-font-s);text-align:left;margin-bottom:0}.password-strength-info small{font-size:var(--ui-font-xs);margin:0;line-height:1.4}.password-strength-info small:empty{display:none}.input-rating{min-width:fit-content}.input-rating .input-inner,.input-rating .input-inner:focus{outline:0}.input-rating .input-row{align-items:stretch;justify-content:flex-start;height:var(--ui-button-height);background-color:var(--ui-color-background-input)}.input-rating .button{position:static;right:unset;cursor:default;user-select:none;-ms-touch-action:manipulation;touch-action:manipulation;font-size:1.2rem;margin:0}.input-rating .button:focus-visible{box-shadow:none}.input-rating .btn-reset{margin-left:auto}.input-rating .btn-reset:focus-visible{color:var(--ui-color-accent)}.input-rating .button.active svg{color:var(--ui-color-accent);fill:var(--ui-color-accent)}.input-rating .button.button-link,.input-rating .button.button-link:focus-visible,.input-rating .button.button-link:hover{text-decoration:none}.input-rating.light:not(.has-error) .input-inner,.input-rating.light:not(.has-error) .input-row{background-color:transparent;border:none}.input-search input{padding-left:calc(2rem + 6px);padding-right:2rem;appearance:none;-webkit-appearance:none}::-webkit-search-cancel-button{display:none}.input-search .input-row>.icon{top:1px}.input-search-button{display:none}.input-search-button.visible{display:inline-flex}.input-tag .input-inner{touch-action:manipulation}.input-tag .input-inner:focus{outline:0}.input-tag .input-inner[aria-expanded=true]{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.input-tag .input-row{min-height:calc(var(--ui-button-height) - 2px);padding:4px .3rem 3px;align-items:flex-start;justify-content:flex-start;gap:.2rem;flex-wrap:wrap}.input-tag .input-row>.icon{position:static;flex-shrink:0;margin-top:.14rem}.input-tag .ui-tag{height:1.7rem}.input-tag-popover{width:25ch}.input-tag-popover .popover-content{padding:.5rem}.input-tag-list-tags{display:flex;flex-flow:row wrap;gap:.2rem;flex:1;max-height:10rem;overflow-y:auto}.input-tag-list-add-row{display:flex;align-items:center;gap:.5rem}.input-tag-list-add-row .input{width:100px;flex:1}.input-tag-list-add-row .input input{background:var(--ui-color-background-semi)}.input-tag-list-tags:not(:empty){margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:var(--ui-popup-border)}.input-text .input-inner{overflow:hidden}.input-time .input-row{border-radius:inherit;background:var(--ui-color-background-input)}.input-time input{margin-left:calc(2rem - 2px)}.label{height:var(--ui-button-height);line-height:1.6;padding:0;display:inline-flex;align-items:center;-ms-touch-action:manipulation;touch-action:manipulation}.label.disabled{pointer-events:none;-webkit-user-select:none;user-select:none}.input .label{padding-inline:1px}.label-on-the-left .label{padding-inline:0;padding-top:1px;width:max-content;white-space:nowrap}.input-tag.label-on-the-left,.radio.label-on-the-left,.textarea.label-on-the-left{align-items:flex-start}.input-tag.label-on-the-left .label,.radio.label-on-the-left>.label,.textarea.label-on-the-left .label{height:calc(var(--ui-button-height) + 2px)}.radio.label-on-the-left>.label{margin-block:var(--ui-margin-s)}.radio{min-width:26ch;width:min-content;max-width:100%;--ui-radio-padding:var(--ui-margin-s)}.radio input{border-radius:10rem;width:1.3rem;height:1.3rem}.radio input:focus{box-shadow:none}.radio input::after{background:var(--ui-color-text-1);width:65%;height:65%;border-radius:inherit}.radio-inner{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:100%;padding:0;border:1px solid var(--ui-color-border);border-radius:calc(var(--ui-border-radius) + var(--ui-radio-padding));background-color:var(--ui-color-background-input);overflow:hidden}.radio-items{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;gap:var(--ui-radio-padding);width:100%;padding:var(--ui-radio-padding) 0;background-color:var(--ui-color-background-input);border-radius:inherit}.radio-item{display:flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:.5rem;width:calc(100% - calc(var(--ui-radio-padding) * 2));margin:0 var(--ui-radio-padding);padding:0 var(--ui-margin);border-radius:var(--ui-border-radius)}.radio-item.disabled{opacity:.5}.radio-item.disabled input{opacity:1}.radio-item:not(.disabled):focus-within,.radio-item:not(.disabled):hover{background-color:var(--ui-color-highlight-1)}.radio-inner:focus-within,.radio-inner:has(:active):not(.disabled){border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus)}.radio.has-error .radio-inner{border-color:var(--ui-color-danger);background-color:var(--ui-color-danger-semi)}.radio.has-error .info-bar-error{background-color:transparent}.has-error .radio-inner:focus-within,.has-error .radio-inner:has(:active):not(.disabled){box-shadow:var(--ui-shadow-danger);border-color:var(--ui-color-danger)}.range{position:relative;width:25ch;vertical-align:top;--range-size:calc(var(--ui-button-height) / 3 * 2)}.range .range-inner{display:flex;flex-flow:column;gap:.5rem;flex:1;padding:0 0 .5rem;position:relative;height:100%}.range input{-webkit-appearance:none;appearance:none;margin:0;width:100%;height:.5rem;border-radius:5rem;padding-inline:0;border:1px solid var(--ui-color-border);background:var(--ui-color-background-input);background-image:linear-gradient(var(--ui-color-highlight),var(--ui-color-highlight));background-size:70% 100%;background-repeat:no-repeat;background-clip:padding-box}.range input::-webkit-slider-runnable-track{-webkit-appearance:none;display:block;height:.5rem;border-radius:.5rem}.range input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--ui-color-text);height:var(--range-size);width:var(--range-size);border-radius:5rem;box-shadow:0 1px 3px #000c;transform:translateY(calc(-50% + .25rem - 1px));transform-origin:center 25%}.range input::-moz-range-track{display:flex;align-items:center;background-color:var(--ui-color-background-input);height:.5rem;border-radius:.5rem}.range input::-moz-range-thumb{background-color:var(--ui-color-text);height:var(--range-size);width:var(--range-size);border-radius:5rem;box-shadow:0 1px 3px #000c}.range:not(.disabled) input::-webkit-slider-thumb:active{scale:0.9}.range:not(.disabled) input::-moz-slider-thumb:active{scale:0.9}.range-ticks{display:flex;justify-content:space-between;margin:0 -.1rem .4rem;cursor:default}.range-ticks span{width:3ch;text-align:center}.range:not(.disabled) .range-ticks span{cursor:pointer}.range.label-on-the-left{align-items:flex-end}.range.label-on-the-left .label{height:1.8rem}.select{font:inherit;position:relative}.select select{-moz-appearance:none;-webkit-appearance:none;appearance:none;font-size:1rem;font-family:inherit;background:0 0;padding:0 30px 0 var(--ui-margin-m);width:100%;border:1px solid transparent;height:calc(var(--ui-button-height) - 2px);line-height:1.2;color:var(--ui-color-text);background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius)}.select select:focus{outline:0}.select optgroup{font-weight:500}.select .input-row::after{content:"";position:absolute;width:2rem;right:0;top:0;bottom:0;opacity:.6;pointer-events:none;background-repeat:no-repeat;background-position:right .7rem center;background-size:.6rem .8rem;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23bbb' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")}.theme-light .select .input-row::after{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23222' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E")}.textarea{position:relative;width:25ch;vertical-align:top}.textarea textarea,.textarea.autogrow .textarea-inner::after{font:inherit;line-height:1.3;border:1px solid transparent;margin:0;width:100%;padding:var(--ui-margin-m);grid-area:2/1/2/2}.textarea .textarea-inner{width:100%;display:inline-grid;align-items:stretch;background-color:var(--ui-color-background-input);border-radius:var(--ui-border-radius);border:1px solid var(--ui-color-border)}.textarea textarea{resize:vertical;color:var(--ui-color-text);border-radius:var(--ui-border-radius);border:none;min-height:2.6rem;background-color:var(--ui-color-background-input)}.textarea .textarea-inner:focus-within{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.textarea textarea:focus{outline:0;box-shadow:none;border:none}.textarea textarea:invalid{border:none;box-shadow:none}.textarea textarea:disabled{opacity:.5}.textarea.autogrow .textarea-inner::after{content:attr(data-value) " ";visibility:hidden;white-space:pre-wrap;min-width:1rem;resize:none;background:0 0;appearance:none}.textarea.autogrow textarea{resize:none}.textarea.has-error .textarea-inner{border-color:var(--ui-color-danger)}.textarea.has-error .textarea-inner:focus-within{box-shadow:var(--ui-shadow-danger)}.toggle{--toggle-width:60px;--toggle-padding:2px;--border-radius:var(--ui-border-radius-xl);--toggle-height:calc(var(--toggle-width) / 2.5);--knob-size:var(--toggle-height);display:inline-flex;flex-flow:column;align-items:flex-start;position:relative;vertical-align:middle;-webkit-user-select:none;user-select:none;border-radius:var(--border-radius)}.toggle-inner{border:1px solid var(--ui-color-text-2);padding:var(--toggle-padding);border-radius:inherit;background-color:var(--ui-color-background-2);position:relative;margin-block:3px}.toggle:has(:disabled){pointer-events:none;opacity:.6}.toggle:focus{outline:0}.toggle:focus-visible .toggle-inner{box-shadow:var(--ui-shadow-focus);border-color:var(--ui-color-accent)}.toggle-input{display:none}.toggle-label{width:var(--toggle-width);height:var(--toggle-height);border-radius:calc(var(--border-radius) - var(--toggle-padding));display:flex;align-items:center;justify-content:flex-start;flex-shrink:0;overflow:hidden;cursor:pointer}.toggle-scroller{height:100%;border-radius:inherit;display:inline-flex;align-items:center;justify-content:center;transition:margin-left .2s cubic-bezier(.85, .05, .18, 1.4);flex-shrink:0;width:calc(200% - var(--toggle-height));margin-left:calc(var(--toggle-height) - var(--toggle-width) - var(--toggle-padding))}.toggle-option{width:50%;height:100%;border-radius:inherit;background-color:green;display:inline-flex;align-items:center;justify-content:center;background-repeat:no-repeat;background-position:center;background-size:calc(var(--toggle-width)/ 5)}.toggle-option:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--ui-color-highlight);background-position:41% 47%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E")}.toggle-option:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0;background-color:var(--ui-color-background-input);background-position:62% 55%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E")}.theme-light .toggle-option:first-of-type{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 17.5714286 9.6 9.4285714 22.4-22' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E")}.theme-light .toggle-option:last-of-type{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m27.5352.4648-27.0704 27.0704m-.4648-27.5352 28 28' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E")}.toggle-handle{width:0;height:0;position:absolute;transition:left .2s cubic-bezier(.85, .05, .18, 1.4);border-radius:inherit;left:calc(var(--toggle-height)/ 2 + var(--toggle-padding))}.toggle-knob{width:var(--knob-size);height:var(--knob-size);background:var(--ui-color-text-1);border:1px solid var(--ui-color-text-2);transform:translate(-50%,-50%);border-radius:inherit}.notification-archive{display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:100%;z-index:5;transform:translateX(calc(var(--ui-notification-width) + var(--ui-notification-gap) + 1rem));transition:transform var(--ui-animation-speed) ease-out}.notification-archive .notification{z-index:1}.notification-archive header{display:flex;align-items:center;justify-content:space-between;margin:var(--ui-notification-gap) var(--ui-notification-gap) 0;color:var(--ui-color-text);z-index:1;background-color:var(--ui-color-background-input);padding:.75rem .5rem .75rem 1rem;border-radius:var(--ui-border-radius)}.notification-archive button{color:inherit;font-size:var(--ui-font-l);font-weight:300;min-width:1.8rem;min-height:1.8rem}.notification-archive h2{color:inherit;font-size:var(--ui-font-l);margin:0;padding:0;border:none}.notification-archive h2 .button{padding-inline:var(--ui-margin-m);margin-left:-.5rem}.notification-archive h2 .button svg{transform:rotate(0);transition:transform var(--ui-animation-speed) ease-out}.notification-archive.expanded h2 .button svg{transform:rotate(90deg)}.notification-archive.inert{pointer-events:none}.notification-archive-buttons{white-space:nowrap;display:flex;align-items:center;justify-content:space-between;gap:.2rem}.notification-archive-buttons .btn-close{font-size:1.4rem;height:1.8rem;width:1.7rem;padding-bottom:.15rem}.notification.archived{filter:saturate(.3)}.notification-timestamp{color:var(--ui-color-text-semi);font-size:var(--ui-font-xs);margin-inline:0.5rem}.show-archive .notification-archive{transform:translateX(0);margin-bottom:1rem;height:auto;overflow:visible}.notification-center{--ui-notification-border-radius:var(--ui-border-radius);--ui-notification-gap:0.75rem;--ui-notification-width:30rem;position:fixed;transform:translateZ(1px);display:flex;flex-flow:column;align-items:stretch;justify-content:flex-start;width:calc(var(--ui-notification-width) + var(--ui-notification-gap) * 2);top:0;right:0;z-index:-1;max-height:100vh;overflow:hidden auto;overscroll-behavior:contain}.notification-center.archive-is-visible,.notification-center.has-active-notifications{z-index:var(--ui-z-index-popup)}.notification{font-size:var(--ui-font-m);position:relative;overflow:hidden;flex-grow:0;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;min-height:2rem;border:none;margin:var(--ui-notification-gap) var(--ui-notification-gap) 0;box-shadow:var(--ui-shadow-fancy);border-radius:var(--ui-notification-border-radius);z-index:var(--ui-z-index-popup)}.notification:last-child{margin-bottom:calc(var(--ui-notification-gap) + 10px)}.notification button{background:0 0;color:var(--ui-color-text);height:1.8rem;min-width:1.6rem;font-size:inherit;padding:0 var(--ui-margin-m);margin:0 var(--ui-margin-m) 0 0;display:flex;align-items:center;justify-content:center;border-radius:var(--ui-border-radius);border:1px solid transparent}.notification button:focus-visible{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.notification button:hover{color:var(--ui-color-text-2);background:#2228}.notification button:active{color:var(--ui-color-text-1);background:#0008}.notification .notification-close{font-size:1.4rem;font-weight:200;position:relative;padding-bottom:.15rem}.notification-buttons,.notification-icon{min-height:100%;display:flex;align-items:center;justify-content:flex-end}.notification-icon{width:var(--ui-button-height)}.notification-msg{color:var(--ui-color-text);flex:1;display:flex;align-items:center;justify-content:flex-start;padding:.8rem;line-height:1.4;font-weight:400}.notification-progressbar{position:absolute;inset:0;border-radius:inherit;z-index:-1}.notification-progress{height:100%;border-radius:inherit;background-color:#ffffff15;border:1px solid #ffffff25;margin:0;width:0;transition:width .2s}.notification:focus{border-color:var(--ui-color-accent);box-shadow:var(--ui-shadow-focus);outline:0}.notification-center-button svg{stroke:var(--ui-color-secondary)}.notification-center-button.has-notifications svg{stroke:var(--ui-color-text)}.notification-center-button.has-notifications svg>path:nth-child(2){fill:var(--ui-color-text)}@media (1px <= width <= 700px){.notification-center{--ui-notification-width:calc(100vw - var(--ui-notification-gap) * 2)}}@supports ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.notification{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.notification-info{background-color:var(--ui-color-info-semi)}.notification-success{background-color:var(--ui-color-success-semi)}.notification-warning{background-color:var(--ui-color-warning-semi)}.notification-error{background-color:var(--ui-color-danger-semi)}} \ No newline at end of file diff --git a/src/grid/Grid.svelte b/src/grid/Grid.svelte index d15fb134..de9ccd5b 100644 --- a/src/grid/Grid.svelte +++ b/src/grid/Grid.svelte @@ -164,7 +164,12 @@ function onDblClick (e) { if (shouldSkipNav(e, element)) return; if (clickTimer) clearTimeout(clickTimer); - onClick(e); + // onClick(e); + const rowEl = e.target.closest(rowSelector); + if (!rowEl) return; + const item = { id: +rowEl.dataset.id }; + Data.toggleSelection(item, e.detail.event, false); + requestAnimationFrame(() => { const selectedItem = getSelectableItems(element)[selectedIdx]; dispatch('dblclick', { event: e, selectedItem }); diff --git a/src/grid/parts/GridHead.svelte b/src/grid/parts/GridHead.svelte index 9b189f48..7207eb4c 100644 --- a/src/grid/parts/GridHead.svelte +++ b/src/grid/parts/GridHead.svelte @@ -27,6 +27,6 @@ $:checked = Data.allSelected; $:indeterminate = Data.someSelected; function toggleSelectAll () { - Data.toggleSelectAll(!$checked); + Data.toggleSelectAll(!$checked && !$indeterminate); } diff --git a/src/grid/store/data.js b/src/grid/store/data.js index 3d441bc9..b3806294 100644 --- a/src/grid/store/data.js +++ b/src/grid/store/data.js @@ -1,4 +1,5 @@ import { writable, get } from 'svelte/store'; +import { isset } from '../../utils.js'; export function DataStore () { @@ -9,22 +10,25 @@ export function DataStore () { const someSelected = writable(false); const sortField = writable(''); const sortOrder = writable('ASC'); + let lastSelectedItemId = null; - function toggleSelection (item, /* e */) { - let count = 0; - const unselectOthers = false; - const $Data = get(this); - $Data.forEach(_item => { - if (item.id === _item.id) { - _item.selected = !_item.selected; - } - else if (unselectOthers) _item.selected = false; - if (_item.selected) count += 1; - }); - allSelected.set($Data.length === count); - someSelected.set(count > 0 && !get(allSelected)); + function getById (id) { + return get(_this).find(i => i.id === id); + } + + function toggleSelection (item, event , forceState) { + if (event.shiftKey && lastSelectedItemId) return selectRange(event); + + const $Data = get(_this); + const _item = getById(item.id); + if (!isset(forceState)) _item.selected = !_item.selected; + else _item.selected = forceState; + + if (_item.selected) lastSelectedItemId = _item.id; + set($Data); + updateSelectedCounters(); // onSelectionChange(); } @@ -34,14 +38,46 @@ export function DataStore () { if (get(someSelected)) allSelected.set(false); else allSelected.set(!get(allSelected)); } + const $Data = get(_this); + $Data.forEach(_item => _item.selected = allSelected); + set($Data); someSelected.set(false); - const selected = get(allSelected); - const $Data = get(this); - $Data.forEach(_item => _item.selected = selected); + // onSelectionChange(); + } + + function selectRange (event) { + const rowEl = event.target.closest('.item'); + const gridEl = rowEl.closest('.grid'); + const lastSelectedRowEl = gridEl.querySelector(`.item[data-id="${lastSelectedItemId}"]`); + if (!rowEl || !lastSelectedRowEl) return; + + const $Data = get(_this); + const rows = gridEl.querySelectorAll('.item'); + // find rows between last selected and current + const rowsToSelect = [rowEl, lastSelectedRowEl]; + let start = false; + for (let i = 0; i < rows.length; i++) { + if (rows[i] === rowEl || rows[i] === lastSelectedRowEl) { + if (start) break; + start = true; + } + if (start) rowsToSelect.push(rows[i]); + } + rowsToSelect.forEach(id => { + getById(+id.dataset.id).selected = true; + }); + set($Data); + updateSelectedCounters(); // onSelectionChange(); } + function updateSelectedCounters () { + const $Data = get(_this); + const countSelected = $Data.filter(t => t.selected).length; + allSelected.set($Data.length === countSelected); + someSelected.set(countSelected > 0 && !allSelected); + } sortField.subscribe(field => { if (field) set(sortData(get(_this), field, get(sortOrder))); diff --git a/src/input/combobox/Combobox.svelte b/src/input/combobox/Combobox.svelte index d57cd09c..6c266a94 100644 --- a/src/input/combobox/Combobox.svelte +++ b/src/input/combobox/Combobox.svelte @@ -123,7 +123,7 @@ import { afterUpdate, createEventDispatcher, onDestroy } from 'svelte'; import { emphasize, scrollToSelectedItem, groupData, findValueInSource, getInputValue, alignDropdown, hasValueChanged } from './utils'; -import { deepCopy, fuzzy, guid, isMobile } from '../../utils'; +import { fuzzy, guid, isMobile } from '../../utils'; import { Button } from '../../button'; import { Info } from '../../info-bar'; import { InputError } from '../input-error'; @@ -184,7 +184,7 @@ onDestroy(() => { afterUpdate(() => { if (!opened && items.length) { - originalItems = deepCopy(items); + originalItems = structuredClone(items); if (items.length && typeof items[0] === 'string') { items = items.map(item => ({ name: item })); } @@ -196,7 +196,7 @@ afterUpdate(() => { function filter () { - let filtered = deepCopy(items); + let filtered = structuredClone(items); if (hasEdited && inputElement.value) { const q = inputElement.value.toLowerCase().trim(); filtered = filtered @@ -274,7 +274,7 @@ function close () { function selectSingle (item) { if (multiselect || hasSetValue) return; - const oldValue = deepCopy(value); + const oldValue = structuredClone(value); if (!item) { if (filteredData[highlightIndex]) item = filteredData[highlightIndex]; @@ -296,7 +296,7 @@ function selectSingle (item) { } function selectMultiselect (item) { - const oldValue = deepCopy(value); + const oldValue = structuredClone(value); selectedItems = selectedItems || []; const itemId = item.id || item.name || item; const itemIndex = selectedItems.findIndex(i => (i?.id || i?.name || i) === itemId); diff --git a/src/utils.js b/src/utils.js index 1779af07..d7c2ec61 100644 --- a/src/utils.js +++ b/src/utils.js @@ -54,12 +54,6 @@ export function blink (el, duration = 160) { } -export function deepCopy (o) { - return structuredClone(o); -} - - - export function debounce (func, timeout = 300) { let timer; return (...args) => { @@ -79,6 +73,7 @@ export function throttle (fn, delay = 300) { }; } + export function empty (v) { if (v === null || typeof v === 'undefined') return true; if (v === '') return true; @@ -88,6 +83,11 @@ export function empty (v) { } +export function isset (v) { + return typeof v !== 'undefined' && v !== null; +} + + export function fuzzy (hay = '', s = '') { if (s.length === 0) return true; if (hay.length === 0) return false; @@ -314,10 +314,13 @@ function isScrollable (node) { * @returns boolean */ export function isInScrollable (node) { - if (!(node instanceof HTMLElement || node instanceof SVGElement)) return; + if (!(node instanceof HTMLElement || node instanceof SVGElement)) return false; if (isScrollable(node)) return true; - while (node = node.parentElement) { - if (isScrollable(node)) return true; + + let parent = node.parentElement; + while (parent) { + if (isScrollable(parent)) return true; + parent = parent.parentElement; } return false; } diff --git a/tests/utils.spec.js b/tests/utils.spec.js index e0d28fc2..0ea6b8ea 100644 --- a/tests/utils.spec.js +++ b/tests/utils.spec.js @@ -32,12 +32,55 @@ test('utils - blink', () => { }); -test('utils - deepCopy', () => { - const obj = { a: 1, b: { c: 2 } }; - const obj2 = utils.deepCopy(obj); - expect(obj2).toEqual(obj); - expect(obj2).not.toBe(obj); - expect(obj2.b).not.toBe(obj.b); +test('utils - debounce', async () => { + const fn = jest.fn(); + const debounced = utils.debounce(fn, 100); + debounced(); + debounced(); + debounced(); + expect(fn).toHaveBeenCalledTimes(0); + await new Promise(resolve => setTimeout(resolve, 200)); + expect(fn).toHaveBeenCalledTimes(1); +}); + + +test('utils - throttle', async () => { + const fn = jest.fn(); + const throttled = utils.throttle(fn, 100); + throttled(); + throttled(); + throttled(); + expect(fn).toHaveBeenCalledTimes(1); + await new Promise(resolve => setTimeout(resolve, 200)); + expect(fn).toHaveBeenCalledTimes(1); +}); + + +test('utils - empty', () => { + expect(utils.empty()).toBe(true); + expect(utils.empty('')).toBe(true); + expect(utils.empty([])).toBe(true); + expect(utils.empty({})).toBe(true); + expect(utils.empty(null)).toBe(true); + expect(utils.empty(undefined)).toBe(true); + expect(utils.empty(0)).toBe(false); + expect(utils.empty('a')).toBe(false); + expect(utils.empty([1])).toBe(false); + expect(utils.empty({ a: 1 })).toBe(false); +}); + + +test('utils - isset', () => { + expect(utils.isset()).toBe(false); + expect(utils.isset('')).toBe(true); + expect(utils.isset([])).toBe(true); + expect(utils.isset({})).toBe(true); + expect(utils.isset(null)).toBe(false); + expect(utils.isset(undefined)).toBe(false); + expect(utils.isset(0)).toBe(true); + expect(utils.isset('a')).toBe(true); + expect(utils.isset([1])).toBe(true); + expect(utils.isset({ a: 1 })).toBe(true); }); From dc77a7441999414c3a43bc5ad0f5602c83df232a Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Wed, 22 May 2024 22:18:16 +0100 Subject: [PATCH 06/11] merge master --- CHANGELOG.md | 4 + docs/docs.css | 629 +- docs/docs.js | 83672 +++++++++++++++++++++++++++++++++++++++++++++++- docs/ui.css | 2745 +- 4 files changed, 86867 insertions(+), 183 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8166222d..4e1501d5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,10 @@ Changelog ========= +## v10.0.0 *(2024-05-15)* +- Breaking change: Dropped `deepCopy` in favour of the native (and unwrapped) `structuredClone`. +- New component: `Grid`. + ## v9.5.3 *(2024-05-18)* - Fix `Combobox` issue for some edge cases. diff --git a/docs/docs.css b/docs/docs.css index 78fc13fa..ad68c022 100644 --- a/docs/docs.css +++ b/docs/docs.css @@ -1 +1,628 @@ -.api-table{height:unset;overflow:auto visible;overscroll-behavior-y:unset}.api-table table{min-width:900px}.api-table tr td{vertical-align:top;padding-block:0.5rem}.api-table tr td:first-child,.api-table tr th:first-child{width:200px}.api-table tr td:nth-child(2),.api-table tr th:nth-child(2){width:200px}.api-table tr td:last-child,.api-table tr th:last-child{min-width:400px}body,html{margin:0;background-color:var(--ui-color-background);color:var(--ui-color-text);--sidebar-width:220px}@font-face{font-family:'Prime Light';src:url('prime_light-webfont.woff2') format('woff2'),url('prime_light-webfont.woff') format('woff');font-weight:light;font-style:normal}a{color:inherit}a:hover{text-decoration-color:var(--ui-color-accent);text-decoration-thickness:2px;text-underline-offset:0.3rem}main{padding:0 2rem 8rem;margin-left:var(--sidebar-width)}h1,h2,h3{font-weight:500;margin:2rem 0 1.2rem;width:100%}h1:first-child,h2:first-child,h3:first-of-type{margin-top:0}p{line-height:1.7;margin-block:1.5rem;max-width:120ch}p b{font-weight:700;letter-spacing:.5px}ul{line-height:1.7;margin:0;padding-left:2rem}ul li{margin-block:0.5rem}p+ul{margin-top:-1rem}em{color:var(--ui-color-accent);font-style:normal}hr{width:100%;height:0;border:0;border-top:1px solid var(--ui-color-border-2);margin:3em 0 2em}.docs-overflow-box{border:2px dotted var(--ui-color-accent);background-color:var(--ui-color-background);padding:1em;overflow:hidden;z-index:1;position:relative}.docs-buttons-row{display:flex;flex-flow:wrap row;align-items:flex-start;justify-content:flex-start;gap:.5rem;flex-shrink:0}@media (1px <= width <= 700px){main{margin-left:0}}code,main pre[class]{background-color:#1a1a1a;color:#ccc;border-radius:var(--ui-border-radius);font-size:var(--ui-font-s)}code{display:block;width:100%;padding:1em;margin-block:1em;line-height:2;white-space:pre;overflow:auto}code[class*=language-]{padding:0;margin:0}.dark-mode-switch{min-width:7rem;position:fixed;top:.5rem;right:.6rem;z-index:55}aside{border-right:1px solid var(--ui-color-border-2);overflow-y:auto;background:var(--ui-color-background);position:fixed;width:var(--sidebar-width);left:0;top:0;height:100lvh;padding:0 1rem calc(100lvh - 100svh);overscroll-behavior:contain}menu{width:100%;display:flex;flex-flow:column;padding:1rem 0 0;margin:0 0 2rem}menu h3{margin:0 -1rem;padding:var(--ui-margin-m) var(--ui-margin-l);white-space:nowrap;font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:var(--ui-font-xl)}menu h3:not(:first-child){margin-top:var(--ui-margin-l)}menu a{color:var(--ui-color-text);text-decoration:none;display:block;margin:var(--ui-margin-s) 0;padding:var(--ui-margin-m) 1.4rem;border-radius:var(--ui-border-radius);white-space:nowrap;touch-action:manipulation}menu a:hover{background-color:var(--ui-color-highlight-1)}menu a.active{background-color:var(--ui-color-highlight)}.nav-toggler{--ui-button-size:1.1em;position:fixed;left:0;top:.4rem;z-index:65;color:var(--ui-color-text-1);display:none;transform:translateX(10px)}.nav-toggler:hover{color:var(--ui-color-text);background:0 0}.btn-scroll-top{position:fixed;bottom:1rem;right:1rem;z-index:999}.btn-scroll-top.hidden{display:none}@media (1px <= width <= 700px){.nav-toggler{display:flex}.nav-toggler.expanded{transform:translateX(calc(var(--sidebar-width) - 40px))}aside{box-shadow:2px 1px 10px #0006;transform:translateX(calc(var(--sidebar-width) * -1));z-index:60;--sidebar-elastic-padding:80px;width:calc(var(--sidebar-width) + var(--sidebar-elastic-padding));left:calc(var(--sidebar-elastic-padding) * -1);padding-left:calc(var(--sidebar-elastic-padding) + 1rem)}aside.expanded{transform:translateX(0)}.nav-toggler:not(.swiping),aside:not(.swiping){transition:transform .3s cubic-bezier(.5, .2, .5, 1.2)}}.banner{height:clamp(100px,40vw,360px);padding-top:60px;display:flex;align-items:flex-start;justify-content:center}.banner a{display:inline-flex;align-items:center;justify-content:center;gap:2vw;margin:auto;padding:0;text-decoration:none}.logo{width:clamp(42px,10vw,160px);height:clamp(42px,10vw,160px);opacity:.9;filter:drop-shadow(0 1px 1px #000)}.logotype{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:clamp(28px, 6vw, 90px);font-weight:100;margin:0;padding:0 4px 0 0;display:flex;flex-flow:row;white-space:nowrap;line-height:1;width:auto}.logotype em{font-weight:500}.logotype sub{font-size:var(--ui-font-m);font-weight:300;color:var(--ui-color-text-semi);margin:-1rem 0 0 -63px;width:60px;text-align:right}.banner a:hover .logotype em,.banner a:hover .logotype span{text-decoration:underline;text-decoration-thickness:1px;text-decoration-skip-ink:none;text-underline-offset:8px}.banner a:hover .logotype span{text-decoration-color:var(--ui-color-accent)}.banner a:hover .logotype em{text-decoration-color:var(--ui-color-text)}.footer-links{display:flex;align-items:center;justify-content:center;gap:5vw;margin:6rem 0 0;height:2rem}.footer-links a,.footer-links a:hover{text-decoration:none;height:100%;display:flex;align-items:center;color:var(--ui-color-text-semi);transition:color .1s}.footer-links a:hover{color:var(--ui-color-text)}.footer-links a svg{height:2rem;width:2rem;margin:0}.footer-links a.npm svg{width:5rem}.sticky-block{background:var(--ui-color-background);margin:0;padding:0}.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif;margin:2rem -2rem 1rem;padding:.5rem 100px .5rem 2rem}.prime-light{font-family:'Prime Light','Helvetica Neue',Helvetica,Arial,sans-serif}.sticky-block>h2,main>h2{font-size:1.8rem;width:auto;border-bottom:1px solid var(--ui-color-border-2);position:sticky;top:0;z-index:50;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}main>h2 em{color:var(--ui-color-text-semi);font-size:1.2rem;line-height:1.8rem;margin-left:.5rem;vertical-align:text-top}main>p code,main>ul li code{display:inline;padding:0;margin:0;background:0 0;color:var(--ui-color-accent);font:inherit;white-space:break-spaces}@media (1px <= width <= 700px){.sticky-block>h1,.sticky-block>h2,main>h1,main>h2{padding-left:54px}}.button-demo-props{display:flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem;width:clamp(300px,600px,100%)}.button-demo-props .input{display:flex;flex-flow:row;width:100%}.button-demo-props .input .label{width:5rem;flex-shrink:0}.button-demo-props .input .input-text-inner{flex:1}.button-demo-props .toggle{display:flex;flex-flow:row;width:100%}.button-demo-props .toggle .label{width:5rem;flex-shrink:0}@media (1px <= width <= 700px){.button-demo-props{width:100%}}.group{background:var(--ui-color-background-2);padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-gap:6px;border-radius:var(--ui-border-radius-m)}.palette-box{padding:10px 0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:calc(var(--ui-border-radius-m) - 3px);background-color:var(--ui-color-background-2)}.table-viewport{width:500px;max-width:100%;height:500px;border:2px dashed red;padding:5px}.icons{margin-bottom:2em}.icon-block{float:left;width:128px;height:128px;margin:0 1em 1em 0;display:flex;flex-flow:column;align-items:stretch;justify-content:stretch;background-color:var(--ui-color-background-semi);padding:0 10px 10px;border-radius:5px;border:1px solid var(--ui-color-border)}.icon-block-icon{flex:1;display:flex;align-items:center;justify-content:center}.icon-block-icon svg{width:32px;height:32px}.icon-block-name{height:20px;text-align:center;overflow-wrap:break-word;font-size:var(--ui-font-s)}.div{border:1px dashed red;height:100px;width:200px;display:inline-grid;place-items:center;margin:1rem 1rem 1rem 0;-webkit-user-select:none;user-select:none}.docs-menu-align-right{padding:2rem 0;border:1px dashed var(--ui-color-accent);text-align:right}.notification-center-header{margin-bottom:1rem;display:flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:2rem}.notification-center-header h2{display:inline-block;width:auto;padding:0;margin:0}.prop-row{padding:1rem 0;display:flex;align-items:center;justify-content:flex-start;gap:1rem}.panel p{margin:0}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.split-wrap{width:400px;height:200px;border:1px solid red;display:flex;flex-flow:row;position:relative}.split-wrap-v{flex-flow:column}.split-box{border:1px solid green;flex:1}.min-w{min-width:20px;max-width:220px}.min-h{min-height:50px;max-height:150px}.table-viewport{width:500px;max-width:100%;height:500px;border:2px dashed red;padding:5px}.tooltip-box{display:inline-block;margin:10px 0 0;line-height:2.4em;padding:1em;border:1px solid #ccc;min-width:6em;text-align:center}.tooltip-html h1,.tooltip-html p{margin:0}.tooltip-html b{color:var(--ui-color-accent)}.tooltip-html a:hover{text-decoration:none}.section-utils{--nav-sidebar-width:240px}.section-utils .dark-mode-switch{right:calc(var(--nav-sidebar-width) + 20px)}.section-utils .sticky-block{padding-bottom:3rem;margin-right:var(--nav-sidebar-width)}.section-utils .sticky-block .utility h3{scroll-margin-top:4.2rem;font-size:1.1rem;color:var(--ui-color-accent);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace}.section-utils .utilities-nav{position:fixed;right:0;top:0;bottom:0;z-index:52;margin:0;padding:1rem 2rem;overflow-y:auto;width:var(--nav-sidebar-width);border-left:1px solid var(--ui-color-border-2);background-color:var(--ui-color-background-input)}.section-utils .utility{margin:0 -2rem;padding:1rem 2rem;border-bottom:1px solid var(--ui-color-border-2)}.section-utils .btn-scroll-top{right:calc(var(--nav-sidebar-width) + 20px)}@media (1px <= width <= 900px){.section-utils .dark-mode-switch{right:.6rem}.section-utils .btn-scroll-top{right:1rem}.section-utils .sticky-block{margin-right:0}.section-utils .utilities-nav{position:static;border-left:none;width:auto;z-index:initial;margin-top:2rem;background-color:unset}}.button-toggle-wrapper-wide{width:400px;max-width:100%}.button-toggle-wrapper-wide .button-toggle{width:100%}.toggle-box{margin:10px 0 0;line-height:2.4em;display:none}.toggle-box.visible{display:block} \ No newline at end of file +.api-table { + height: unset; + overflow: auto visible; + overscroll-behavior-y: unset; +} +.api-table table { min-width: 900px; } + +.api-table tr td { vertical-align: top; padding-block: 0.5rem;} + +.api-table tr th:first-child, +.api-table tr td:first-child { width: 200px; } + +.api-table tr th:nth-child(2), +.api-table tr td:nth-child(2) { width: 200px; } + +.api-table tr th:last-child, +.api-table tr td:last-child { min-width: 400px; } + +html, +body { + margin: 0; + background-color: var(--ui-color-background); + color: var(--ui-color-text); + + --sidebar-width: 220px; +} + + +@font-face { + font-family: 'Prime Light'; + src: url('prime_light-webfont.woff2') format('woff2'), + url('prime_light-webfont.woff') format('woff'); + font-weight: light; + font-style: normal; +} + + +a { color: inherit; } +a:hover { + text-decoration-color: var(--ui-color-accent); + text-decoration-thickness: 2px; + text-underline-offset: 0.3rem; +} + +main { + padding: 0 2rem 8rem; + margin-left: var(--sidebar-width); +} + +h1, +h2, +h3 { font-weight: 500; margin: 2rem 0 1.2rem; width: 100%; } + +h1:first-child, +h2:first-child, +h3:first-of-type { margin-top: 0; } + +p { line-height: 1.7; margin-block: 1.5rem; max-width: 120ch; } +p b { font-weight: 700; letter-spacing: 0.5px; } + +ul { line-height: 1.7; margin: 0; padding-left: 2rem; } +ul li { margin-block: 0.5rem; } + +p + ul { margin-top: -1rem } + +em { color: var(--ui-color-accent); font-style: normal; } + + +hr { + width: 100%; + height: 0; + border: 0; + border-top: 1px solid var(--ui-color-border-2); + margin: 3em 0 2em; +} + + +.docs-overflow-box { + border: 2px dotted var(--ui-color-accent); + background-color: var(--ui-color-background); + padding: 1em; + overflow: hidden; + z-index: 1; + position: relative; +} + +.docs-buttons-row { + display: flex; + flex-flow: wrap row; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + flex-shrink: 0; +} + + + +@media (1px <= width <= 700px) { + main { margin-left: 0; } +} + +main pre[class], +code { + background-color: #1a1a1a; + color: #ccc; + border-radius: var(--ui-border-radius); + font-size: var(--ui-font-s) +} + +code { + display: block; + width: 100%; + padding: 1em; + margin-block: 1em; + line-height: 2; + white-space: pre; + overflow: auto; +} + +code[class*=language-] { padding: 0; margin: 0; } + +.dark-mode-switch { + min-width: 7rem; + position: fixed; + top: 0.5rem; + right: 0.6rem; + z-index: 55; +} + +aside { + border-right: 1px solid var(--ui-color-border-2); + overflow-y: auto; + background: var(--ui-color-background); + position: fixed; + width: var(--sidebar-width); + + left: 0; + top: 0; + height: 100lvh; + padding: 0 1rem calc(100lvh - 100svh); + + overscroll-behavior: contain; +} + +menu { + width: 100%; + display: flex; + flex-flow: column; + padding: 1rem 0 0; + margin: 0 0 2rem; +} + +menu h3 { + margin: 0 -1rem; + padding: var(--ui-margin-m) var(--ui-margin-l); + white-space: nowrap; + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-size: var(--ui-font-xl); +} + +menu h3:not(:first-child) { margin-top: var(--ui-margin-l); } + +menu a { + color: var(--ui-color-text); + text-decoration: none; + display: block; + margin: var(--ui-margin-s) 0; + padding: var(--ui-margin-m) 1.4rem; + border-radius: var(--ui-border-radius); + white-space: nowrap; + touch-action: manipulation; +} + +menu a:hover { background-color: var(--ui-color-highlight-1); } +menu a.active { background-color: var(--ui-color-highlight); } + + +.nav-toggler { + --ui-button-size: 1.1em; + position: fixed; + left: 0; + top: 0.4rem; + z-index: 65; + color: var(--ui-color-text-1); + display: none; + transform: translateX(10px); +} +.nav-toggler:hover { color: var(--ui-color-text); background: none; } + +.btn-scroll-top { + position: fixed; + bottom: 1rem; + right: 1rem; + z-index: 999; +} +.btn-scroll-top.hidden { display: none; } + + +@media (1px <= width <= 700px) { + .nav-toggler { display: flex; } + .nav-toggler.expanded { transform: translateX(calc(var(--sidebar-width) - 40px)); } + + aside { + box-shadow: 2px 1px 10px #0006; + transform: translateX(calc(var(--sidebar-width) * -1)); + z-index: 60; + + --sidebar-elastic-padding: 80px; + width: calc(var(--sidebar-width) + var(--sidebar-elastic-padding)); + left: calc(var(--sidebar-elastic-padding) * -1); + padding-left: calc(var(--sidebar-elastic-padding) + 1rem); + + } + aside.expanded { transform: translateX(0); } + + .nav-toggler:not(.swiping), + aside:not(.swiping) { transition: transform .3s cubic-bezier(.5, .2, .5, 1.2); } +} + +.banner { + height: clamp(100px, 40vw, 360px); + padding-top: 60px; + display: flex; + align-items: flex-start; + justify-content: center; +} + +.banner a { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 2vw; + margin: auto; + padding: 0; + text-decoration: none; +} + +.logo { + width: clamp(42px, 10vw, 160px); + height: clamp(42px, 10vw, 160px); + opacity: 0.9; + filter: drop-shadow(0 1px 1px #000); +} + + +.logotype { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-size: clamp(28px, 6vw, 90px); + font-weight: 100; + margin: 0; + padding: 0 4px 0 0; + display: flex; + flex-flow: row; + white-space: nowrap; + line-height: 1; + width: auto; +} + +.logotype em { font-weight: 500; } +.logotype sub { + font-size: var(--ui-font-m); + font-weight: 300; + color: var(--ui-color-text-semi); + margin: -1rem 0 0 -63px; + width: 60px; + text-align: right; +} + + +.banner a:hover .logotype span, +.banner a:hover .logotype em { + text-decoration: underline; + text-decoration-thickness: 1px; + text-decoration-skip-ink: none; + text-underline-offset: 8px; +} +.banner a:hover .logotype span { text-decoration-color: var(--ui-color-accent); } +.banner a:hover .logotype em { text-decoration-color: var(--ui-color-text); } + + + + + +.footer-links { + display: flex; + align-items: center; + justify-content: center; + gap: 5vw; + margin: 6rem 0 0; + height: 2rem; +} + +.footer-links a, +.footer-links a:hover { + text-decoration: none; + height: 100%; + display: flex; + align-items: center; + color: var(--ui-color-text-semi); + transition: color 0.1s; +} + +.footer-links a:hover { color: var(--ui-color-text); } + +.footer-links a svg { height: 2rem; width: 2rem; margin: 0; } +.footer-links a.npm svg { width: 5rem; } + + + + +.sticky-block { + background: var(--ui-color-background); + margin: 0; + padding: 0; +} + +main>h1, +main>h2, +.sticky-block>h1, +.sticky-block>h2 { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; + margin: 2rem -2rem 1rem; + padding: 0.5rem 100px 0.5rem 2rem; +} + +.prime-light { + font-family: 'Prime Light', 'Helvetica Neue', Helvetica, Arial, sans-serif; +} + +/* stylelint-disable-next-line no-descending-specificity */ +main>h2, +.sticky-block>h2 { + font-size: 1.8rem; + width: auto; + border-bottom: 1px solid var(--ui-color-border-2); + position: sticky; + top: 0; + z-index: 50; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + -webkit-backdrop-filter: blur(15px); + backdrop-filter: blur(15px); +} + + + +/* stylelint-disable-next-line no-descending-specificity */ +main>h2 em { + color: var(--ui-color-text-semi); + font-size: 1.2rem; + line-height: 1.8rem; + margin-left: 0.5rem; + vertical-align: text-top; +} + +main>p code, +main>ul li code { + display: inline; + padding: 0; + margin: 0; + background: none; + color: var(--ui-color-accent); + font: inherit; + white-space: break-spaces; +} + + +@media (1px <= width <= 700px) { + main>h1, + main>h2, + .sticky-block>h1, + .sticky-block>h2 { padding-left: 54px; } +} + +.button-demo-props { + display: flex; + flex-flow: column; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + width: clamp(300px, 600px, 100%); +} + +.button-demo-props .input { display: flex; flex-flow: row; width: 100%; } +.button-demo-props .input .label { width: 5rem; flex-shrink: 0; } +.button-demo-props .input .input-text-inner { flex: 1; } + + +.button-demo-props .toggle { display: flex; flex-flow: row; width: 100%; } +.button-demo-props .toggle .label { width: 5rem; flex-shrink: 0; } + +@media (1px <= width <= 700px) { + .button-demo-props { + width: 100%; + } +} + +.group { + background: var(--ui-color-background-2); + padding: 6px; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); + grid-gap: 6px; + border-radius: var(--ui-border-radius-m); +} + +.palette-box { + padding: 10px 0; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; + border-radius: calc(var(--ui-border-radius-m) - 3px); + background-color: var(--ui-color-background-2); +} + +.table-viewport { + width: 500px; + max-width: 100%; + height: 500px; + border: 2px dashed red; + padding: 5px; +} + +.icons { margin-bottom: 2em; } + +.icon-block { + float: left; + width: 128px; + height: 128px; + margin: 0 1em 1em 0; + display: flex; + flex-flow: column; + align-items: stretch; + justify-content: stretch; + background-color: var(--ui-color-background-semi); + padding: 0 10px 10px; + border-radius: 5px; + border: 1px solid var(--ui-color-border); +} + +.icon-block-icon { + flex: 1; + display: flex; + align-items: center; + justify-content: center; +} + +.icon-block-icon svg { + width: 32px; + height: 32px; +} + +.icon-block-name { + height: 20px; + text-align: center; + overflow-wrap: break-word; + font-size: var(--ui-font-s) +} + +.div { + border: 1px dashed red; + height: 100px; + width: 200px; + display: inline-grid; + place-items: center; + margin: 1rem 1rem 1rem 0; + -webkit-user-select: none; + user-select: none; +} + + +.docs-menu-align-right { + padding: 2rem 0; + border: 1px dashed var(--ui-color-accent); + text-align: right; +} + +.notification-center-header { + margin-bottom: 1rem; + display: flex; + flex-flow: row; + align-items: center; + justify-content: flex-start; + gap: 2rem; +} + +.notification-center-header h2 { + display: inline-block; + width: auto; + padding: 0; + margin: 0; +} + + +.prop-row { + padding: 1rem 0; + display: flex; + align-items: center; + justify-content: flex-start; + gap: 1rem; +} + +.panel p { margin: 0; } + +.tooltip-box { + display: inline-block; + margin: 10px 0 0; + line-height: 2.4em; + padding: 1em; + border: 1px solid #ccc; + min-width: 6em; + text-align: center; +} + +.tooltip-html h1, +.tooltip-html p { margin: 0; } +.tooltip-html b { color: var(--ui-color-accent); } +.tooltip-html a:hover { text-decoration: none; } + +.split-wrap { + width: 400px; + height: 200px; + border: 1px solid red; + display: flex; + flex-flow: row; + position: relative; +} + +.split-wrap-v { flex-flow: column; } +.split-box { border: 1px solid green; flex: 1; } + +.min-w { min-width: 20px; max-width: 220px; } +.min-h { min-height: 50px; max-height: 150px; } + +.table-viewport { + width: 500px; + max-width: 100%; + height: 500px; + border: 2px dashed red; + padding: 5px; +} + +.tooltip-box { + display: inline-block; + margin: 10px 0 0; + line-height: 2.4em; + padding: 1em; + border: 1px solid #ccc; + min-width: 6em; + text-align: center; +} + +.tooltip-html h1, +.tooltip-html p { margin: 0; } +.tooltip-html b { color: var(--ui-color-accent); } +.tooltip-html a:hover { text-decoration: none; } + +.section-utils { + --nav-sidebar-width: 240px; +} +.section-utils .dark-mode-switch { right: calc(var(--nav-sidebar-width) + 20px); } + +.section-utils .sticky-block { padding-bottom: 3rem; margin-right: var(--nav-sidebar-width); } + + +.section-utils .sticky-block .utility h3 { + scroll-margin-top: 4.2rem; + font-size: 1.1rem; + color: var(--ui-color-accent); + font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace; +} + + +.section-utils .utilities-nav { + position: fixed; + right: 0; + top: 0; + bottom: 0; + z-index: 52; + margin: 0; + padding: 1rem 2rem; + overflow-y: auto; + width: var(--nav-sidebar-width); + border-left: 1px solid var(--ui-color-border-2); + background-color: var(--ui-color-background-input); +} + +.section-utils .utility { + margin: 0 -2rem; + padding: 1rem 2rem; + border-bottom: 1px solid var(--ui-color-border-2); +} + + +.section-utils .btn-scroll-top { right: calc(var(--nav-sidebar-width) + 20px); } + + +@media (1px <= width <= 900px) { + .section-utils .dark-mode-switch { right: 0.6rem; } + .section-utils .btn-scroll-top { right: 1rem; } + .section-utils .sticky-block { margin-right: 0; } + .section-utils .utilities-nav { + position: static; + border-left: none; + width: auto; + z-index: initial; + margin-top: 2rem; + background-color: unset; + } + +} + +.button-toggle-wrapper-wide { width: 400px; max-width: 100%; } +.button-toggle-wrapper-wide .button-toggle { width: 100%; } + +.toggle-box { + margin: 10px 0 0; + line-height: 2.4em; + display: none; +} + +.toggle-box.visible { + display: block; +} +/*# sourceMappingURL=docs.css.map */ diff --git a/docs/docs.js b/docs/docs.js index 39c392dc..c5f1d4c9 100644 --- a/docs/docs.js +++ b/docs/docs.js @@ -1,68 +1,50965 @@ -var X2=Object.create;var vc=Object.defineProperty;var J2=Object.getOwnPropertyDescriptor;var Z2=Object.getOwnPropertyNames;var Q2=Object.getPrototypeOf,ev=Object.prototype.hasOwnProperty;var Kt=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),wc=(t,e)=>{for(var n in e)vc(t,n,{get:e[n],enumerable:!0})},tv=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of Z2(e))!ev.call(t,o)&&o!==n&&vc(t,o,{get:()=>e[o],enumerable:!(i=J2(e,o))||i.enumerable});return t};var $c=(t,e,n)=>(n=t!=null?X2(Q2(t)):{},tv(e||!t||!t.__esModule?vc(n,"default",{value:t,enumerable:!0}):n,t));var Wi=Kt(ni=>{"use strict";Object.defineProperty(ni,"__esModule",{value:!0});ni.TraceDirectionKey=ni.Direction=ni.Axis=void 0;var lp;ni.TraceDirectionKey=lp;(function(t){t.NEGATIVE="NEGATIVE",t.POSITIVE="POSITIVE",t.NONE="NONE"})(lp||(ni.TraceDirectionKey=lp={}));var rp;ni.Direction=rp;(function(t){t.TOP="TOP",t.LEFT="LEFT",t.RIGHT="RIGHT",t.BOTTOM="BOTTOM",t.NONE="NONE"})(rp||(ni.Direction=rp={}));var ap;ni.Axis=ap;(function(t){t.X="x",t.Y="y"})(ap||(ni.Axis=ap={}))});var mp=Kt(fp=>{"use strict";Object.defineProperty(fp,"__esModule",{value:!0});fp.calculateDirection=f3;var up=Wi();function f3(t){var e,n=up.TraceDirectionKey.NEGATIVE,i=up.TraceDirectionKey.POSITIVE,o=t[t.length-1],r=t[t.length-2]||0;return t.every(function(a){return a===0})?up.TraceDirectionKey.NONE:(e=o>r?i:n,o===0&&(e=r<0?i:n),e)}});var eu=Kt(pi=>{"use strict";Object.defineProperty(pi,"__esModule",{value:!0});pi.resolveAxisDirection=pi.getDirectionValue=pi.getDirectionKey=pi.getDifference=void 0;var xn=Wi(),m3=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},n=Object.keys(e).toString();switch(n){case xn.TraceDirectionKey.POSITIVE:return xn.TraceDirectionKey.POSITIVE;case xn.TraceDirectionKey.NEGATIVE:return xn.TraceDirectionKey.NEGATIVE;default:return xn.TraceDirectionKey.NONE}};pi.getDirectionKey=m3;var c3=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return e[e.length-1]||0};pi.getDirectionValue=c3;var d3=function(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;return Math.abs(e-n)};pi.getDifference=d3;var p3=function(e,n){var i=xn.Direction.LEFT,o=xn.Direction.RIGHT,r=xn.Direction.NONE;return e===xn.Axis.Y&&(i=xn.Direction.BOTTOM,o=xn.Direction.TOP),n===xn.TraceDirectionKey.NEGATIVE&&(r=i),n===xn.TraceDirectionKey.POSITIVE&&(r=o),r};pi.resolveAxisDirection=p3});var dp=Kt(cp=>{"use strict";Object.defineProperty(cp,"__esModule",{value:!0});cp.calculateDirectionDelta=g3;var h3=Wi(),hs=eu();function g3(t){for(var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,n=t.length,i=n-1,o=h3.TraceDirectionKey.NONE;i>=0;i--){var r=t[i],a=(0,hs.getDirectionKey)(r),u=(0,hs.getDirectionValue)(r[a]),m=t[i-1]||{},f=(0,hs.getDirectionKey)(m),d=(0,hs.getDirectionValue)(m[f]),g=(0,hs.getDifference)(u,d);if(g>=e){o=a;break}else o=f}return o}});var hp=Kt(pp=>{"use strict";Object.defineProperty(pp,"__esModule",{value:!0});pp.calculateDuration=b3;function b3(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;return t?e-t:0}});var a0=Kt(gp=>{"use strict";Object.defineProperty(gp,"__esModule",{value:!0});gp.calculateMovingPosition=_3;function _3(t){if("changedTouches"in t){var e=t.changedTouches&&t.changedTouches[0];return{x:e&&e.clientX,y:e&&e.clientY}}return{x:t.clientX,y:t.clientY}}});var _p=Kt(bp=>{"use strict";Object.defineProperty(bp,"__esModule",{value:!0});bp.updateTrace=v3;function v3(t,e){var n=t[t.length-1];return n!==e&&t.push(e),t}});var wp=Kt(vp=>{"use strict";Object.defineProperty(vp,"__esModule",{value:!0});vp.calculateTraceDirections=w3;var tu=Wi();function u0(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function w3(){for(var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],e=[],n=tu.TraceDirectionKey.POSITIVE,i=tu.TraceDirectionKey.NEGATIVE,o=0,r=[],a=tu.TraceDirectionKey.NONE;om?n:i;a===tu.TraceDirectionKey.NONE&&(a=f),f===a?r.push(u):(e.push(u0({},a,r.slice())),r=[],r.push(u),a=f)}else u!==0&&(a=u>0?n:i),r.push(u)}return r.length&&e.push(u0({},a,r)),e}});var yp=Kt($p=>{"use strict";Object.defineProperty($p,"__esModule",{value:!0});$p.resolveDirection=M3;var $3=mp(),y3=wp(),k3=dp(),f0=eu(),T3=Wi();function M3(t){var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:T3.Axis.X,n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:0;if(n){var i=(0,y3.calculateTraceDirections)(t),o=(0,k3.calculateDirectionDelta)(i,n);return(0,f0.resolveAxisDirection)(e,o)}var r=(0,$3.calculateDirection)(t);return(0,f0.resolveAxisDirection)(e,r)}});var Tp=Kt(kp=>{"use strict";Object.defineProperty(kp,"__esModule",{value:!0});kp.calculateVelocity=C3;function C3(t,e,n){var i=Math.sqrt(t*t+e*e);return i/(n||1)}});var p0=Kt(Mp=>{"use strict";Object.defineProperty(Mp,"__esModule",{value:!0});Mp.calculatePosition=L3;var m0=_p(),c0=yp(),E3=hp(),S3=Tp(),d0=Wi();function L3(t,e){var n=t.start,i=t.x,o=t.y,r=t.traceX,a=t.traceY,u=e.rotatePosition,m=e.directionDelta,f=u.x-i,d=o-u.y,g=Math.abs(f),_=Math.abs(d);(0,m0.updateTrace)(r,f),(0,m0.updateTrace)(a,d);var h=(0,c0.resolveDirection)(r,d0.Axis.X,m),b=(0,c0.resolveDirection)(a,d0.Axis.Y,m),$=(0,E3.calculateDuration)(n,Date.now()),k=(0,S3.calculateVelocity)(g,_,$);return{absX:g,absY:_,deltaX:f,deltaY:d,directionX:h,directionY:b,duration:$,positionX:u.x,positionY:u.y,velocity:k}}});var h0=Kt(nu=>{"use strict";Object.defineProperty(nu,"__esModule",{value:!0});nu.checkIsMoreThanSingleTouches=void 0;var D3=function(e){return!!(e.touches&&e.touches.length>1)};nu.checkIsMoreThanSingleTouches=D3});var Ep=Kt(Cp=>{"use strict";Object.defineProperty(Cp,"__esModule",{value:!0});Cp.createOptions=A3;function A3(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return Object.defineProperty(t,"passive",{get:function(){return this.isPassiveSupported=!0,!0},enumerable:!0}),t}});var g0=Kt(gs=>{"use strict";Object.defineProperty(gs,"__esModule",{value:!0});gs.checkIsPassiveSupported=O3;gs.noop=void 0;var I3=Ep();function O3(t){if(typeof t=="boolean")return t;var e={isPassiveSupported:t};try{var n=(0,I3.createOptions)(e);window.addEventListener("checkIsPassiveSupported",Sp,n),window.removeEventListener("checkIsPassiveSupported",Sp,n)}catch{}return e.isPassiveSupported}var Sp=function(){};gs.noop=Sp});var b0=Kt(iu=>{"use strict";Object.defineProperty(iu,"__esModule",{value:!0});iu.checkIsTouchEventsSupported=void 0;function Lp(t){"@babel/helpers - typeof";return Lp=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Lp(t)}var H3=function(){return(typeof window>"u"?"undefined":Lp(window))==="object"&&("ontouchstart"in window||!!window.navigator.maxTouchPoints)};iu.checkIsTouchEventsSupported=H3});var v0=Kt(ou=>{"use strict";Object.defineProperty(ou,"__esModule",{value:!0});ou.getInitialState=void 0;function _0(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter(function(o){return Object.getOwnPropertyDescriptor(t,o).enumerable})),n.push.apply(n,i)}return n}function x3(t){for(var e=1;e0&&arguments[0]!==void 0?arguments[0]:{};return x3({x:0,y:0,start:0,isSwiping:!1,traceX:[],traceY:[]},e)};ou.getInitialState=N3});var $0=Kt(su=>{"use strict";Object.defineProperty(su,"__esModule",{value:!0});su.getInitialProps=void 0;function w0(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter(function(o){return Object.getOwnPropertyDescriptor(t,o).enumerable})),n.push.apply(n,i)}return n}function F3(t){for(var e=1;e0&&arguments[0]!==void 0?arguments[0]:{};return F3({element:null,target:null,delta:10,directionDelta:0,rotationAngle:0,mouseTrackingEnabled:!1,touchTrackingEnabled:!0,preventDefaultTouchmoveEvent:!1,preventTrackingOnMouseleave:!1},e)};su.getInitialProps=B3});var y0=Kt(Dp=>{"use strict";Object.defineProperty(Dp,"__esModule",{value:!0});Dp.getOptions=R3;function R3(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:!1;return t?{passive:!1}:{}}});var k0=Kt(Ap=>{"use strict";Object.defineProperty(Ap,"__esModule",{value:!0});Ap.rotateByAngle=z3;function z3(t){var e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;if(e===0)return t;var n=t.x,i=t.y,o=Math.PI/180*e,r=n*Math.cos(o)+i*Math.sin(o),a=i*Math.cos(o)-n*Math.sin(o);return{x:r,y:a}}});var T0=Kt(et=>{"use strict";Object.defineProperty(et,"__esModule",{value:!0});var Ip=mp();Object.keys(Ip).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Ip[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Ip[t]}})});var Op=dp();Object.keys(Op).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Op[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Op[t]}})});var Hp=hp();Object.keys(Hp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Hp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Hp[t]}})});var xp=a0();Object.keys(xp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===xp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return xp[t]}})});var Pp=p0();Object.keys(Pp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Pp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Pp[t]}})});var Np=wp();Object.keys(Np).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Np[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Np[t]}})});var Fp=Tp();Object.keys(Fp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Fp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Fp[t]}})});var qp=h0();Object.keys(qp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===qp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return qp[t]}})});var Bp=g0();Object.keys(Bp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Bp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Bp[t]}})});var Rp=b0();Object.keys(Rp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Rp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Rp[t]}})});var zp=eu();Object.keys(zp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===zp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return zp[t]}})});var jp=Ep();Object.keys(jp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===jp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return jp[t]}})});var Wp=v0();Object.keys(Wp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Wp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Wp[t]}})});var Vp=$0();Object.keys(Vp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Vp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Vp[t]}})});var Up=y0();Object.keys(Up).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Up[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Up[t]}})});var Yp=yp();Object.keys(Yp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Yp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Yp[t]}})});var Gp=k0();Object.keys(Gp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Gp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Gp[t]}})});var Kp=_p();Object.keys(Kp).forEach(function(t){t==="default"||t==="__esModule"||t in et&&et[t]===Kp[t]||Object.defineProperty(et,t,{enumerable:!0,get:function(){return Kp[t]}})})});var S0=Kt(go=>{"use strict";function Jp(t){"@babel/helpers - typeof";return Jp=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Jp(t)}Object.defineProperty(go,"__esModule",{value:!0});var j3={};go.default=void 0;var pn=W3(T0()),Xp=Wi();Object.keys(Xp).forEach(function(t){t==="default"||t==="__esModule"||Object.prototype.hasOwnProperty.call(j3,t)||t in go&&go[t]===Xp[t]||Object.defineProperty(go,t,{enumerable:!0,get:function(){return Xp[t]}})});function E0(t){if(typeof WeakMap!="function")return null;var e=new WeakMap,n=new WeakMap;return(E0=function(o){return o?n:e})(t)}function W3(t,e){if(!e&&t&&t.__esModule)return t;if(t===null||Jp(t)!=="object"&&typeof t!="function")return{default:t};var n=E0(e);if(n&&n.has(t))return n.get(t);var i={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var r in t)if(r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)){var a=o?Object.getOwnPropertyDescriptor(t,r):null;a&&(a.get||a.set)?Object.defineProperty(i,r,a):i[r]=t[r]}return i.default=t,n&&n.set(t,i),i}function V3(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function M0(t,e){for(var n=0;n1&&arguments[1]!==void 0?arguments[1]:{directionDelta:0},o=this.props.rotationAngle,r=i.directionDelta,a=pn.calculateMovingPosition(n),u=pn.rotateByAngle(a,o);return pn.calculatePosition(this.state,{rotatePosition:u,directionDelta:r})}},{key:"handleSwipeStart",value:function(n){if(!pn.checkIsMoreThanSingleTouches(n)){var i=this.props.rotationAngle,o=pn.calculateMovingPosition(n),r=pn.rotateByAngle(o,i),a=r.x,u=r.y;this.state=pn.getInitialState({isSwiping:!1,start:Date.now(),x:a,y:u})}}},{key:"handleSwipeMove",value:function(n){var i=this.state,o=i.x,r=i.y,a=i.isSwiping;if(!(!o||!r||pn.checkIsMoreThanSingleTouches(n))){var u=this.props.directionDelta||0,m=this.getEventData(n,{directionDelta:u}),f=m.absX,d=m.absY,g=m.deltaX,_=m.deltaY,h=m.directionX,b=m.directionY,$=m.duration,k=m.velocity,v=this.props,T=v.delta,I=v.preventDefaultTouchmoveEvent,D=v.onSwipeStart,L=v.onSwiping;n.cancelable&&I&&n.preventDefault(),!(f{var XM=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var Je=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},o={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function $(k){return k instanceof r?new r(k.type,$(k.content),k.alias):Array.isArray(k)?k.map($):k.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document&&1<2)return document.currentScript;try{throw new Error}catch(T){var $=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(T.stack)||[])[1];if($){var k=document.getElementsByTagName("script");for(var v in k)if(k[v].src==$)return k[v]}return null}},isActive:function($,k,v){for(var T="no-"+k;$;){var I=$.classList;if(I.contains(k))return!0;if(I.contains(T))return!1;$=$.parentElement}return!!v}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function($,k){var v=o.util.clone(o.languages[$]);for(var T in k)v[T]=k[T];return v},insertBefore:function($,k,v,T){T=T||o.languages;var I=T[$],D={};for(var L in I)if(I.hasOwnProperty(L)){if(L==k)for(var M in v)v.hasOwnProperty(M)&&(D[M]=v[M]);v.hasOwnProperty(L)||(D[L]=I[L])}var A=T[$];return T[$]=D,o.languages.DFS(o.languages,function(x,O){O===A&&x!=$&&(this[x]=D)}),D},DFS:function $(k,v,T,I){I=I||{};var D=o.util.objId;for(var L in k)if(k.hasOwnProperty(L)){v.call(k,L,k[L],T||L);var M=k[L],A=o.util.type(M);A==="Object"&&!I[D(M)]?(I[D(M)]=!0,$(M,v,null,I)):A==="Array"&&!I[D(M)]&&(I[D(M)]=!0,$(M,v,L,I))}}},plugins:{},highlightAll:function($,k){o.highlightAllUnder(document,$,k)},highlightAllUnder:function($,k,v){var T={callback:v,container:$,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};o.hooks.run("before-highlightall",T),T.elements=Array.prototype.slice.apply(T.container.querySelectorAll(T.selector)),o.hooks.run("before-all-elements-highlight",T);for(var I=0,D;D=T.elements[I++];)o.highlightElement(D,k===!0,T.callback)},highlightElement:function($,k,v){var T=o.util.getLanguage($),I=o.languages[T];o.util.setLanguage($,T);var D=$.parentElement;D&&D.nodeName.toLowerCase()==="pre"&&o.util.setLanguage(D,T);var L=$.textContent,M={element:$,language:T,grammar:I,code:L};function A(O){M.highlightedCode=O,o.hooks.run("before-insert",M),M.element.innerHTML=M.highlightedCode,o.hooks.run("after-highlight",M),o.hooks.run("complete",M),v&&v.call(M.element)}if(o.hooks.run("before-sanity-check",M),D=M.element.parentElement,D&&D.nodeName.toLowerCase()==="pre"&&!D.hasAttribute("tabindex")&&D.setAttribute("tabindex","0"),!M.code){o.hooks.run("complete",M),v&&v.call(M.element);return}if(o.hooks.run("before-highlight",M),!M.grammar){A(o.util.encode(M.code));return}if(k&&t.Worker){var x=new Worker(o.filename);x.onmessage=function(O){A(O.data)},x.postMessage(JSON.stringify({language:M.language,code:M.code,immediateClose:!0}))}else A(o.highlight(M.code,M.grammar,M.language))},highlight:function($,k,v){var T={code:$,grammar:k,language:v};if(o.hooks.run("before-tokenize",T),!T.grammar)throw new Error('The language "'+T.language+'" has no grammar.');return T.tokens=o.tokenize(T.code,T.grammar),o.hooks.run("after-tokenize",T),r.stringify(o.util.encode(T.tokens),T.language)},tokenize:function($,k){var v=k.rest;if(v){for(var T in v)k[T]=v[T];delete k.rest}var I=new m;return f(I,I.head,$),u($,I,k,I.head,0),g(I)},hooks:{all:{},add:function($,k){var v=o.hooks.all;v[$]=v[$]||[],v[$].push(k)},run:function($,k){var v=o.hooks.all[$];if(!(!v||!v.length))for(var T=0,I;I=v[T++];)I(k)}},Token:r};t.Prism=o;function r($,k,v,T){this.type=$,this.content=k,this.alias=v,this.length=(T||"").length|0}r.stringify=function $(k,v){if(typeof k=="string")return k;if(Array.isArray(k)){var T="";return k.forEach(function(A){T+=$(A,v)}),T}var I={type:k.type,content:$(k.content,v),tag:"span",classes:["token",k.type],attributes:{},language:v},D=k.alias;D&&(Array.isArray(D)?Array.prototype.push.apply(I.classes,D):I.classes.push(D)),o.hooks.run("wrap",I);var L="";for(var M in I.attributes)L+=" "+M+'="'+(I.attributes[M]||"").replace(/"/g,""")+'"';return"<"+I.tag+' class="'+I.classes.join(" ")+'"'+L+">"+I.content+""};function a($,k,v,T){$.lastIndex=k;var I=$.exec(v);if(I&&T&&I[1]){var D=I[1].length;I.index+=D,I[0]=I[0].slice(D)}return I}function u($,k,v,T,I,D){for(var L in v)if(!(!v.hasOwnProperty(L)||!v[L])){var M=v[L];M=Array.isArray(M)?M:[M];for(var A=0;A=D.reach);P+=U.value.length,U=U.next){var j=U.value;if(k.length>$.length)return;if(!(j instanceof r)){var Y=1,Z;if(F){if(Z=a(z,P,$,N),!Z||Z.index>=$.length)break;var J=Z.index,le=Z.index+Z[0].length,ee=P;for(ee+=U.value.length;J>=ee;)U=U.next,ee+=U.value.length;if(ee-=U.value.length,P=ee,U.value instanceof r)continue;for(var X=U;X!==k.tail&&(eeD.reach&&(D.reach=G);var Q=U.prev;he&&(Q=f(k,Q,he),P+=he.length),d(k,Q,Y);var pe=new r(L,O?o.tokenize(ge,O):ge,W,ge);if(U=f(k,Q,pe),V&&f(k,U,V),Y>1){var ye={cause:L+","+A,reach:G};u($,k,v,U.prev,P,ye),D&&ye.reach>D.reach&&(D.reach=ye.reach)}}}}}}function m(){var $={value:null,prev:null,next:null},k={value:null,prev:$,next:null};$.next=k,this.head=$,this.tail=k,this.length=0}function f($,k,v){var T=k.next,I={value:v,prev:k,next:T};return k.next=I,T.prev=I,$.length++,I}function d($,k,v){for(var T=k.next,I=0;I/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};Je.languages.markup.tag.inside["attr-value"].inside.entity=Je.languages.markup.entity;Je.languages.markup.doctype.inside["internal-subset"].inside=Je.languages.markup;Je.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(Je.languages.markup.tag,"addInlined",{value:function(e,n){var i={};i["language-"+n]={pattern:/(^$)/i,lookbehind:!0,inside:Je.languages[n]},i.cdata=/^$/i;var o={"included-cdata":{pattern://i,inside:i}};o["language-"+n]={pattern:/[\s\S]+/,inside:Je.languages[n]};var r={};r[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:o},Je.languages.insertBefore("markup","cdata",r)}});Object.defineProperty(Je.languages.markup.tag,"addAttribute",{value:function(t,e){Je.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:Je.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});Je.languages.html=Je.languages.markup;Je.languages.mathml=Je.languages.markup;Je.languages.svg=Je.languages.markup;Je.languages.xml=Je.languages.extend("markup",{});Je.languages.ssml=Je.languages.xml;Je.languages.atom=Je.languages.xml;Je.languages.rss=Je.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))})(Je);Je.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};Je.languages.javascript=Je.languages.extend("clike",{"class-name":[Je.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});Je.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;Je.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Je.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Je.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:Je.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Je.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Je.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});Je.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:Je.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});Je.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});Je.languages.markup&&(Je.languages.markup.tag.addInlined("script","javascript"),Je.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));Je.languages.js=Je.languages.javascript;(function(){if(typeof Je>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(_,h){return"\u2716 Error "+_+" while fetching file: "+h},n="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},o="data-src-status",r="loading",a="loaded",u="failed",m="pre[data-src]:not(["+o+'="'+a+'"]):not(['+o+'="'+r+'"])';function f(_,h,b){var $=new XMLHttpRequest;$.open("GET",_,!0),$.onreadystatechange=function(){$.readyState==4&&($.status<400&&$.responseText?h($.responseText):$.status>=400?b(e($.status,$.statusText)):b(n))},$.send(null)}function d(_){var h=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(_||"");if(h){var b=Number(h[1]),$=h[2],k=h[3];return $?k?[b,Number(k)]:[b,void 0]:[b,b]}}Je.hooks.add("before-highlightall",function(_){_.selector+=", "+m}),Je.hooks.add("before-sanity-check",function(_){var h=_.element;if(h.matches(m)){_.code="",h.setAttribute(o,r);var b=h.appendChild(document.createElement("CODE"));b.textContent=t;var $=h.getAttribute("data-src"),k=_.language;if(k==="none"){var v=(/\.(\w+)$/.exec($)||[,"none"])[1];k=i[v]||v}Je.util.setLanguage(b,k),Je.util.setLanguage(h,k);var T=Je.plugins.autoloader;T&&T.loadLanguages(k),f($,function(I){h.setAttribute(o,a);var D=d(h.getAttribute("data-range"));if(D){var L=I.split(/\r\n?|\n/g),M=D[0],A=D[1]==null?L.length:D[1];M<0&&(M+=L.length),M=Math.max(0,Math.min(M-1,L.length)),A<0&&(A+=L.length),A=Math.max(0,Math.min(A,L.length)),I=L.slice(M,A).join(` -`),h.hasAttribute("data-start")||h.setAttribute("data-start",String(M+1))}b.textContent=I,Je.highlightElement(b)},function(I){h.setAttribute(o,u),b.textContent=I})}}),Je.plugins.fileHighlight={highlight:function(h){for(var b=(h||document).querySelectorAll(m),$=0,k;k=b[$++];)Je.highlightElement(k)}};var g=!1;Je.fileHighlight=function(){g||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),g=!0),Je.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var K2=Kt((sV,ru)=>{(function(){if(typeof Prism>"u")return;var t=Object.assign||function(r,a){for(var u in a)a.hasOwnProperty(u)&&(r[u]=a[u]);return r};function e(r){this.defaults=t({},r)}function n(r){return r.replace(/-(\w)/g,function(a,u){return u.toUpperCase()})}function i(r){for(var a=0,u=0;ua&&(f[g]=` -`+f[g],d=_)}u[m]=f.join("")}return u.join(` -`)}},typeof ru<"u"&&ru.exports&&(ru.exports=e),Prism.plugins.NormalizeWhitespace=new e({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0}),Prism.hooks.add("before-sanity-check",function(r){var a=Prism.plugins.NormalizeWhitespace;if(!(r.settings&&r.settings["whitespace-normalization"]===!1)&&Prism.util.isActive(r.element,"whitespace-normalization",!0)){if((!r.element||!r.element.parentNode)&&r.code){r.code=a.normalize(r.code,r.settings);return}var u=r.element.parentNode;if(!(!r.code||!u||u.nodeName.toLowerCase()!=="pre")){r.settings==null&&(r.settings={});for(var m in o)if(Object.hasOwnProperty.call(o,m)){var f=o[m];if(u.hasAttribute("data-"+m))try{var d=JSON.parse(u.getAttribute("data-"+m)||"true");typeof d===f&&(r.settings[m]=d)}catch{}}for(var g=u.childNodes,_="",h="",b=!1,$=0;$t;function tt(t,e){for(let n in e)t[n]=e[n];return t}function yc(t){return t()}function ga(){return Object.create(null)}function qe(t){t.forEach(yc)}function vt(t){return typeof t=="function"}function fe(t,e){return t!=t?e==e:t!==e||t&&typeof t=="object"||typeof t=="function"}var ha;function jg(t,e){return t===e?!0:(ha||(ha=document.createElement("a")),ha.href=e,t===ha.href)}function Wg(t){return Object.keys(t).length===0}function on(t,...e){if(t==null){for(let i of e)i(void 0);return Te}let n=t.subscribe(...e);return n.unsubscribe?()=>n.unsubscribe():n}function tn(t){let e;return on(t,n=>e=n)(),e}function dn(t,e,n){t.$$.on_destroy.push(on(e,n))}function At(t,e,n,i){if(t){let o=Vg(t,e,n,i);return t[0](o)}}function Vg(t,e,n,i){return t[1]&&i?tt(n.ctx.slice(),t[1](i(e))):n.ctx}function It(t,e,n,i){if(t[2]&&i){let o=t[2](i(n));if(e.dirty===void 0)return o;if(typeof o=="object"){let r=[],a=Math.max(e.dirty.length,o.length);for(let u=0;u32){let e=[],n=t.ctx.length/32;for(let i=0;iwindow.performance.now():()=>Date.now(),Wo=Yg?t=>requestAnimationFrame(t):Te;var ko=new Set;function Gg(t){ko.forEach(e=>{e.c(t)||(ko.delete(e),e.f())}),ko.size!==0&&Wo(Gg)}function To(t){let e;return ko.size===0&&Wo(Gg),{promise:new Promise(n=>{ko.add(e={c:t,f:n})}),abort(){ko.delete(e)}}}var Vo=typeof window<"u"?window:typeof globalThis<"u"?globalThis:global;var _a=class t{_listeners="WeakMap"in Vo?new WeakMap:void 0;_observer=void 0;options;constructor(e){this.options=e}observe(e,n){return this._listeners.set(e,n),this._getObserver().observe(e,this.options),()=>{this._listeners.delete(e),this._observer.unobserve(e)}}_getObserver(){return this._observer??(this._observer=new ResizeObserver(e=>{for(let n of e)t.entries.set(n.target,n),this._listeners.get(n.target)?.(n)}))}};_a.entries="WeakMap"in Vo?new WeakMap:void 0;var Kg=!1;function Xg(){Kg=!0}function Jg(){Kg=!1}function q(t,e){t.appendChild(e)}function Tc(t){if(!t)return document;let e=t.getRootNode?t.getRootNode():t.ownerDocument;return e&&e.host?e:t.ownerDocument}function Zg(t){let e=p("style");return e.textContent="/* empty */",iv(Tc(t),e),e.sheet}function iv(t,e){return q(t.head||t,e),e.sheet}function l(t,e,n){t.insertBefore(e,n||null)}function s(t){t.parentNode&&t.parentNode.removeChild(t)}function bt(t,e){for(let n=0;nt.removeEventListener(e,n,i)}function Xn(t){return function(e){return e.preventDefault(),t.call(this,e)}}function va(t){return function(e){return e.stopPropagation(),t.call(this,e)}}function H(t,e,n){n==null?t.removeAttribute(e):t.getAttribute(e)!==n&&t.setAttribute(e,n)}var ov=["width","height"];function St(t,e){let n=Object.getOwnPropertyDescriptors(t.__proto__);for(let i in e)e[i]==null?t.removeAttribute(i):i==="style"?t.style.cssText=e[i]:i==="__value"?t.value=t[i]=e[i]:n[i]&&n[i].set&&ov.indexOf(i)===-1?t[i]=e[i]:H(t,i,e[i])}function Qg(t){return t===""?null:+t}function e1(t){return Array.from(t.childNodes)}function Be(t,e){e=""+e,t.data!==e&&(t.data=e)}function pt(t,e){t.value=e??""}function Pt(t,e,n,i){n==null?t.style.removeProperty(e):t.style.setProperty(e,n,i?"important":"")}function Mc(t,e,n){for(let i=0;i{e[n.slot||"default"]=!0}),e}function Ii(t,e){return new t(e)}var wa=new Map,$a=0;function sv(t){let e=5381,n=t.length;for(;n--;)e=(e<<5)-e^t.charCodeAt(n);return e>>>0}function lv(t,e){let n={stylesheet:Zg(e),rules:{}};return wa.set(t,n),n}function Ki(t,e,n,i,o,r,a,u=0){let m=16.666/i,f=`{ -`;for(let k=0;k<=1;k+=m){let v=e+(n-e)*r(k);f+=k*100+`%{${a(v,1-v)}} -`}let d=f+`100% {${a(n,1-n)}} -}`,g=`__svelte_${sv(d)}_${u}`,_=Tc(t),{stylesheet:h,rules:b}=wa.get(_)||lv(_,t);b[g]||(b[g]=!0,h.insertRule(`@keyframes ${g} ${d}`,h.cssRules.length));let $=t.style.animation||"";return t.style.animation=`${$?`${$}, `:""}${g} ${i}ms linear ${o}ms 1 both`,$a+=1,g}function Xi(t,e){let n=(t.style.animation||"").split(", "),i=n.filter(e?r=>r.indexOf(e)<0:r=>r.indexOf("__svelte")===-1),o=n.length-i.length;o&&(t.style.animation=i.join(", "),$a-=o,$a||rv())}function rv(){Wo(()=>{$a||(wa.forEach(t=>{let{ownerNode:e}=t.stylesheet;e&&s(e)}),wa.clear())})}function ya(t,e,n,i){if(!e)return Te;let o=t.getBoundingClientRect();if(e.left===o.left&&e.right===o.right&&e.top===o.top&&e.bottom===o.bottom)return Te;let{delay:r=0,duration:a=300,easing:u=Di,start:m=yo()+r,end:f=m+a,tick:d=Te,css:g}=n(t,{from:e,to:o},i),_=!0,h=!1,b;function $(){g&&(b=Ki(t,0,1,a,r,u,g)),r||(h=!0)}function k(){g&&Xi(t,b),_=!1}return To(v=>{if(!h&&v>=m&&(h=!0),h&&v>=f&&(d(1,0),k()),!_)return!1;if(h){let T=v-m,I=0+1*u(T/a);d(I,1-I)}return!0}),$(),d(0,1),k}function ka(t){let e=getComputedStyle(t);if(e.position!=="absolute"&&e.position!=="fixed"){let{width:n,height:i}=e,o=t.getBoundingClientRect();t.style.position="absolute",t.style.width=n,t.style.height=i,Go(t,o)}}function Go(t,e){let n=t.getBoundingClientRect();if(e.left!==n.left||e.top!==n.top){let i=getComputedStyle(t),o=i.transform==="none"?"":i.transform;t.style.transform=`${o} translate(${e.left-n.left}px, ${e.top-n.top}px)`}}var Oi;function wi(t){Oi=t}function Hi(){if(!Oi)throw new Error("Function called outside component initialization");return Oi}function Ko(t){Hi().$$.before_update.push(t)}function Nt(t){Hi().$$.on_mount.push(t)}function In(t){Hi().$$.after_update.push(t)}function an(t){Hi().$$.on_destroy.push(t)}function lt(){let t=Hi();return(e,n,{cancelable:i=!1}={})=>{let o=t.$$.callbacks[e];if(o){let r=Yo(e,n,{cancelable:i});return o.slice().forEach(a=>{a.call(t,r)}),!r.defaultPrevented}return!0}}function Cc(t,e){return Hi().$$.context.set(t,e),e}function Ec(t){return Hi().$$.context.get(t)}function Qe(t,e){let n=t.$$.callbacks[e.type];n&&n.slice().forEach(i=>i.call(this,e))}var Ji=[];var be=[],Co=[],Lc=[],av=Promise.resolve(),Dc=!1;function i1(){Dc||(Dc=!0,av.then(Ct))}function nn(t){Co.push(t)}function Ye(t){Lc.push(t)}var Sc=new Set,Mo=0;function Ct(){if(Mo!==0)return;let t=Oi;do{try{for(;Mot.indexOf(i)===-1?e.push(i):n.push(i)),n.forEach(i=>i()),Co=e}var Xo;function Ac(){return Xo||(Xo=Promise.resolve(),Xo.then(()=>{Xo=null})),Xo}function Zi(t,e,n){t.dispatchEvent(Yo(`${e?"intro":"outro"}${n}`))}var Ta=new Set,ri;function We(){ri={r:0,c:[],p:ri}}function Ve(){ri.r||qe(ri.c),ri=ri.p}function w(t,e){t&&t.i&&(Ta.delete(t),t.i(e))}function y(t,e,n,i){if(t&&t.o){if(Ta.has(t))return;Ta.add(t),ri.c.push(()=>{Ta.delete(t),i&&(n&&t.d(1),i())}),t.o(e)}else i&&i()}var Ic={duration:0};function Eo(t,e,n){let i={direction:"in"},o=e(t,n,i),r=!1,a,u,m=0;function f(){a&&Xi(t,a)}function d(){let{delay:_=0,duration:h=300,easing:b=Di,tick:$=Te,css:k}=o||Ic;k&&(a=Ki(t,0,1,h,_,b,k,m++)),$(0,1);let v=yo()+_,T=v+h;u&&u.abort(),r=!0,nn(()=>Zi(t,!0,"start")),u=To(I=>{if(r){if(I>=T)return $(1,0),Zi(t,!0,"end"),f(),r=!1;if(I>=v){let D=b((I-v)/h);$(D,1-D)}}return r})}let g=!1;return{start(){g||(g=!0,Xi(t),vt(o)?(o=o(i),Ac().then(d)):d())},invalidate(){g=!1},end(){r&&(f(),r=!1)}}}function So(t,e,n){let i={direction:"out"},o=e(t,n,i),r=!0,a,u=ri;u.r+=1;let m;function f(){let{delay:d=0,duration:g=300,easing:_=Di,tick:h=Te,css:b}=o||Ic;b&&(a=Ki(t,1,0,g,d,_,b));let $=yo()+d,k=$+g;nn(()=>Zi(t,!1,"start")),"inert"in t&&(m=t.inert,t.inert=!0),To(v=>{if(r){if(v>=k)return h(0,1),Zi(t,!1,"end"),--u.r||qe(u.c),!1;if(v>=$){let T=_((v-$)/g);h(1-T,T)}}return r})}return vt(o)?Ac().then(()=>{o=o(i),f()}):f(),{end(d){d&&"inert"in t&&(t.inert=m),d&&o.tick&&o.tick(1,0),r&&(a&&Xi(t,a),r=!1)}}}function Oc(t,e,n,i){let r=e(t,n,{direction:"both"}),a=i?0:1,u=null,m=null,f=null,d;function g(){f&&Xi(t,f)}function _(b,$){let k=b.b-a;return $*=Math.abs(k),{a,b:b.b,d:k,duration:$,start:b.start,end:b.start+$,group:b.group}}function h(b){let{delay:$=0,duration:k=300,easing:v=Di,tick:T=Te,css:I}=r||Ic,D={start:yo()+$,b};b||(D.group=ri,ri.r+=1),"inert"in t&&(b?d!==void 0&&(t.inert=d):(d=t.inert,t.inert=!0)),u||m?m=D:(I&&(g(),f=Ki(t,a,b,k,$,v,I)),b&&T(0,1),u=_(D,k),nn(()=>Zi(t,b,"start")),To(L=>{if(m&&L>m.start&&(u=_(m,k),m=null,Zi(t,u.b,"start"),I&&(g(),f=Ki(t,a,u.b,u.duration,0,v,r.css))),u){if(L>=u.end)T(a=u.b,1-a),Zi(t,u.b,"end"),m||(u.b?g():--u.group.r||qe(u.group.c)),u=null;else if(L>=u.start){let M=L-u.start;a=u.a+u.d*v(M/u.duration),T(a,1-a)}}return!!(u||m)}))}return{run(b){vt(r)?Ac().then(()=>{r=r({direction:b?"in":"out"}),h(b)}):h(b)},end(){g(),u=m=null}}}function je(t){return t?.length!==void 0?t:Array.from(t)}function s1(t,e){t.d(1),e.delete(t.key)}function Jo(t,e){y(t,1,1,()=>{e.delete(t.key)})}function Ma(t,e){t.f(),Jo(t,e)}function ai(t,e,n,i,o,r,a,u,m,f,d,g){let _=t.length,h=r.length,b=_,$={};for(;b--;)$[t[b].key]=b;let k=[],v=new Map,T=new Map,I=[];for(b=h;b--;){let A=g(o,r,b),x=n(A),O=a.get(x);O?i&&I.push(()=>O.p(A,e)):(O=f(x,A),O.c()),v.set(x,k[b]=O),x in $&&T.set(x,Math.abs(b-$[x]))}let D=new Set,L=new Set;function M(A){w(A,1),A.m(u,d),a.set(A.key,A),d=A.first,h--}for(;_&&h;){let A=k[h-1],x=t[_-1],O=A.key,N=x.key;A===x?(d=A.first,_--,h--):v.has(N)?!a.has(O)||D.has(O)?M(A):L.has(N)?_--:T.get(O)>T.get(N)?(L.add(O),M(A)):(D.add(N),_--):(m(x,a),_--)}for(;_--;){let A=t[_];v.has(A.key)||m(A,a)}for(;h;)M(k[h-1]);return qe(I),k}function zt(t,e){let n={},i={},o={$$scope:1},r=t.length;for(;r--;){let a=t[r],u=e[r];if(u){for(let m in a)m in u||(i[m]=1);for(let m in u)o[m]||(n[m]=u[m],o[m]=1);t[r]=u}else for(let m in a)o[m]=1}for(let a in i)a in n||(n[a]=void 0);return n}function Lo(t){return typeof t=="object"&&t!==null?t:{}}var fv=["allowfullscreen","allowpaymentrequest","async","autofocus","autoplay","checked","controls","default","defer","disabled","formnovalidate","hidden","inert","ismap","loop","multiple","muted","nomodule","novalidate","open","playsinline","readonly","required","reversed","selected"],mv=new Set([...fv]);function Ge(t,e,n){let i=t.$$.props[e];i!==void 0&&(t.$$.bound[i]=n,n(t.$$.ctx[i]))}function S(t){t&&t.c()}function C(t,e,n){let{fragment:i,after_update:o}=t.$$;i&&i.m(e,n),nn(()=>{let r=t.$$.on_mount.map(yc).filter(vt);t.$$.on_destroy?t.$$.on_destroy.push(...r):qe(r),t.$$.on_mount=[]}),o.forEach(nn)}function E(t,e){let n=t.$$;n.fragment!==null&&(o1(n.after_update),qe(n.on_destroy),n.fragment&&n.fragment.d(e),n.on_destroy=n.fragment=null,n.ctx=[])}function dv(t,e){t.$$.dirty[0]===-1&&(Ji.push(t),i1(),t.$$.dirty.fill(0)),t.$$.dirty[e/31|0]|=1<{let b=h.length?h[0]:_;return f.ctx&&o(f.ctx[g],f.ctx[g]=b)&&(!f.skip_bound&&f.bound[g]&&f.bound[g](b),d&&dv(t,g)),_}):[],f.update(),d=!0,qe(f.before_update),f.fragment=i?i(f.ctx):!1,e.target){if(e.hydrate){Xg();let g=e1(e.target);f.fragment&&f.fragment.l(g),g.forEach(s)}else f.fragment&&f.fragment.c();e.intro&&w(t.$$.fragment),C(t,e.target,e.anchor),Jg(),Ct()}wi(m)}var pv;typeof HTMLElement=="function"&&(pv=class extends HTMLElement{$$ctor;$$s;$$c;$$cn=!1;$$d={};$$r=!1;$$p_d={};$$l={};$$l_u=new Map;constructor(t,e,n){super(),this.$$ctor=t,this.$$s=e,n&&this.attachShadow({mode:"open"})}addEventListener(t,e,n){if(this.$$l[t]=this.$$l[t]||[],this.$$l[t].push(e),this.$$c){let i=this.$$c.$on(t,e);this.$$l_u.set(e,i)}super.addEventListener(t,e,n)}removeEventListener(t,e,n){if(super.removeEventListener(t,e,n),this.$$c){let i=this.$$l_u.get(e);i&&(i(),this.$$l_u.delete(e))}}async connectedCallback(){if(this.$$cn=!0,!this.$$c){let t=function(o){return()=>{let r;return{c:function(){r=p("slot"),o!=="default"&&H(r,"name",o)},m:function(m,f){l(m,r,f)},d:function(m){m&&s(r)}}}};if(await Promise.resolve(),!this.$$cn||this.$$c)return;let e={},n=n1(this);for(let o of this.$$s)o in n&&(e[o]=[t(o)]);for(let o of this.attributes){let r=this.$$g_p(o.name);r in this.$$d||(this.$$d[r]=Hc(r,o.value,this.$$p_d,"toProp"))}for(let o in this.$$p_d)!(o in this.$$d)&&this[o]!==void 0&&(this.$$d[o]=this[o],delete this[o]);this.$$c=new this.$$ctor({target:this.shadowRoot||this,props:{...this.$$d,$$slots:e,$$scope:{ctx:[]}}});let i=()=>{this.$$r=!0;for(let o in this.$$p_d)if(this.$$d[o]=this.$$c.$$.ctx[this.$$c.$$.props[o]],this.$$p_d[o].reflect){let r=Hc(o,this.$$d[o],this.$$p_d,"toAttribute");r==null?this.removeAttribute(this.$$p_d[o].attribute||o):this.setAttribute(this.$$p_d[o].attribute||o,r)}this.$$r=!1};this.$$c.$$.after_update.push(i),i();for(let o in this.$$l)for(let r of this.$$l[o]){let a=this.$$c.$on(o,r);this.$$l_u.set(r,a)}this.$$l={}}}attributeChangedCallback(t,e,n){this.$$r||(t=this.$$g_p(t),this.$$d[t]=Hc(t,n,this.$$p_d,"toProp"),this.$$c?.$set({[t]:this.$$d[t]}))}disconnectedCallback(){this.$$cn=!1,Promise.resolve().then(()=>{!this.$$cn&&this.$$c&&(this.$$c.$destroy(),this.$$c=void 0)})}$$g_p(t){return Object.keys(this.$$p_d).find(e=>this.$$p_d[e].attribute===t||!this.$$p_d[e].attribute&&e.toLowerCase()===t)||t}});function Hc(t,e,n,i){let o=n[t]?.type;if(e=o==="Boolean"&&typeof e!="boolean"?e!=null:e,!i||!n[t])return e;if(i==="toAttribute")switch(o){case"Object":case"Array":return e==null?null:JSON.stringify(e);case"Boolean":return e?"":null;case"Number":return e??null;default:return e}else switch(o){case"Object":case"Array":return e&&JSON.parse(e);case"Boolean":return e;case"Number":return e!=null?+e:e;default:return e}}var ue=class{$$=void 0;$$set=void 0;$destroy(){E(this,1),this.$destroy=Te}$on(e,n){if(!vt(n))return Te;let i=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return i.push(n),()=>{let o=i.indexOf(n);o!==-1&&i.splice(o,1)}}$set(e){this.$$set&&!Wg(e)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}};var l1="4";typeof window<"u"&&(window.__svelte||(window.__svelte={v:new Set})).v.add(l1);function hv(t){let e,n,i,o,r,a=t[4].default,u=At(a,t,t[3],null);return{c(){e=p("div"),n=p("div"),i=p("div"),u&&u.c(),H(i,"class","button-group-inner"),H(i,"role","group"),H(n,"class","button-group-scroller"),H(e,"class",o="button-group "+t[1]),te(e,"round",t[2])},m(m,f){l(m,e,f),q(e,n),q(n,i),u&&u.m(i,null),t[5](e),r=!0},p(m,[f]){u&&u.p&&(!r||f&8)&&Ot(u,a,m,m[3],r?It(a,m[3],f,null):Ht(m[3]),null),(!r||f&2&&o!==(o="button-group "+m[1]))&&H(e,"class",o),(!r||f&6)&&te(e,"round",m[2])},i(m){r||(w(u,m),r=!0)},o(m){y(u,m),r=!1},d(m){m&&s(e),u&&u.d(m),t[5](null)}}}function gv(t,e,n){let{$$slots:i={},$$scope:o}=e,{class:r=""}=e,{round:a=void 0}=e,{element:u=void 0}=e;function m(f){be[f?"unshift":"push"](()=>{u=f,n(0,u)})}return t.$$set=f=>{"class"in f&&n(1,r=f.class),"round"in f&&n(2,a=f.round),"element"in f&&n(0,u=f.element),"$$scope"in f&&n(3,o=f.$$scope)},[u,r,a,o,i,m]}var xc=class extends ue{constructor(e){super(),me(this,e,gv,hv,fe,{class:1,round:2,element:0})}},Un=xc;var bv='",Zo={adjustments:'adjustments-horizontal">`}function a1(t,e){Qi[t]||(Qi[t]=e)}function vv(t){let e,n;return{c(){e=new Ai(!1),n=wt(),e.a=n},m(i,o){e.m(t[0],i,o),l(i,n,o)},p(i,[o]){o&1&&e.p(i[0])},i:Te,o:Te,d(i){i&&(s(n),e.d())}}}function wv(t,e,n){let i,{name:o=""}=e;return t.$$set=r=>{"name"in r&&n(1,o=r.name)},t.$$.update=()=>{t.$$.dirty&2&&n(0,i=eo(o))},[i,o]}var Pc=class extends ue{constructor(e){super(),me(this,e,wv,vv,fe,{name:1})}},Lt=Pc;function u1(t){let e,n;return e=new Lt({props:{name:t[10]}}),{c(){S(e.$$.fragment)},m(i,o){C(e,i,o),n=!0},p(i,o){let r={};o&1024&&(r.name=i[10]),e.$set(r)},i(i){n||(w(e.$$.fragment,i),n=!0)},o(i){y(e.$$.fragment,i),n=!1},d(i){E(e,i)}}}function $v(t){let e,n,i,o,r,a,u,m=t[10]&&u1(t),f=t[17].default,d=At(f,t,t[16],null),g=[{type:i=t[6]?"submit":"button"},{class:o="button "+t[12]},t[15]],_={};for(let h=0;h{m=null}),Ve()),d&&d.p&&(!r||b&65536)&&Ot(d,f,h,h[16],r?It(f,h[16],b,null):Ht(h[16]),null),St(e,_=zt(g,[(!r||b&64&&i!==(i=h[6]?"submit":"button"))&&{type:i},(!r||b&4096&&o!==(o="button "+h[12]))&&{class:o},b&32768&&h[15]])),te(e,"button-normal",!h[8]&&!h[9]&&!h[7]),te(e,"button-outline",h[7]),te(e,"button-link",h[8]),te(e,"button-text",h[9]),te(e,"button-has-text",h[14].default),te(e,"round",h[11]),te(e,"info",h[1]),te(e,"success",h[2]),te(e,"warning",h[3]),te(e,"danger",h[4]),te(e,"error",h[5]),te(e,"touching",h[13])},i(h){r||(w(m),w(d,h),r=!0)},o(h){y(m),y(d,h),r=!1},d(h){h&&s(e),m&&m.d(),d&&d.d(h),t[26](null),a=!1,qe(u)}}}function yv(t,e,n){let i=["element","info","success","warning","danger","error","submit","outline","link","text","icon","round","class"],o=Mt(e,i),{$$slots:r={},$$scope:a}=e,u=ba(r),{element:m=void 0}=e,{info:f=!1}=e,{success:d=!1}=e,{warning:g=!1}=e,{danger:_=!1}=e,{error:h=!1}=e,{submit:b=!1}=e,{outline:$=!1}=e,{link:k=!1}=e,{text:v=!1}=e,{icon:T=void 0}=e,{round:I=void 0}=e,{class:D=""}=e,L=!1;function M(j){Qe.call(this,t,j)}function A(j){Qe.call(this,t,j)}function x(j){Qe.call(this,t,j)}function O(j){Qe.call(this,t,j)}function N(j){Qe.call(this,t,j)}function F(j){Qe.call(this,t,j)}function W(j){Qe.call(this,t,j)}function K(j){Qe.call(this,t,j)}function z(j){be[j?"unshift":"push"](()=>{m=j,n(0,m)})}let U=()=>n(13,L=!0),P=()=>n(13,L=!1);return t.$$set=j=>{e=tt(tt({},e),Zt(j)),n(15,o=Mt(e,i)),"element"in j&&n(0,m=j.element),"info"in j&&n(1,f=j.info),"success"in j&&n(2,d=j.success),"warning"in j&&n(3,g=j.warning),"danger"in j&&n(4,_=j.danger),"error"in j&&n(5,h=j.error),"submit"in j&&n(6,b=j.submit),"outline"in j&&n(7,$=j.outline),"link"in j&&n(8,k=j.link),"text"in j&&n(9,v=j.text),"icon"in j&&n(10,T=j.icon),"round"in j&&n(11,I=j.round),"class"in j&&n(12,D=j.class),"$$scope"in j&&n(16,a=j.$$scope)},[m,f,d,g,_,h,b,$,k,v,T,I,D,L,u,o,a,r,M,A,x,O,N,F,W,K,z,U,P]}var Nc=class extends ue{constructor(e){super(),me(this,e,yv,$v,fe,{element:0,info:1,success:2,warning:3,danger:4,error:5,submit:6,outline:7,link:8,text:9,icon:10,round:11,class:12})}},De=Nc;var Do=[];function sn(t,e=Te){let n,i=new Set;function o(u){if(fe(t,u)&&(t=u,n)){let m=!Do.length;for(let f of i)f[1](),Do.push(f,t);if(m){for(let f=0;f{i.delete(f),i.size===0&&n&&(n(),n=null)}}return{set:o,update:r,subscribe:a}}var to=["a[href]:not([disabled])","button:not([disabled])","iframe:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","[contentEditable]","[tabindex]:not(.focus-trap)"].join(","),un=sn(300),Fc=sn(!1),f1=t=>un.set(!t||t.matches?0:200),m1=t=>Fc.set(t&&t.matches);if(window.matchMedia){let t=window.matchMedia("(prefers-reduced-motion: reduce)");f1(t),t.addEventListener("change",f1);let e=window.matchMedia("(prefers-color-scheme: dark)");m1(e),e.addEventListener("change",m1)}function Ca(t,e,n,i={}){let o={duration:tn(un),easing:"ease-out",fill:"forwards"},r=Object.assign({},o,i);return new Promise(a=>{requestAnimationFrame(()=>{let u=t.animate([e,n],r);u.oncancel=a,u.onfinish=a})})}function d1(t,e=160){return Ca(t,{opacity:1},{opacity:.5},{duration:e/2,fill:"backwards"})}function Ao(t,e=300){let n;return(...i)=>{n&&clearTimeout(n),n=setTimeout(()=>t.apply(this,i),e)}}function Ea(t,e=300){let n=0;return(...i)=>{let o=new Date().getTime();if(!(o-nt.length)return!1;if(e===t)return!0;t=t.toLowerCase(),e=e.toLowerCase();let n=-1;for(let i of e)if(!~(n=t.indexOf(i,n+1)))return!1;return!0}function Xe(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,t=>{let e=Math.random()*16|0;return(t==="x"?e:e&3|8).toString(16)})}function xi(t){return t.type.includes("touch")?t.changedTouches[0].clientX:t.clientX}function Qo(t){return t.type.includes("touch")?t.changedTouches[0].clientY:t.clientY}function Jn(){let t=navigator.userAgent,e=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i;return!!(e.test(t)||(e=/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i,e.test(t.slice(0,4))))}function kv(t,e){if(e in t)return t[e]}function Tv(t,e){let n={};return e.forEach(i=>{i in t&&(n[i]=t[i])}),n}function g1(t,e){return t?Array.isArray(e)?Tv(t,e):kv(t,e):{}}function b1(t,e=2){let n=Math.pow(10,e);return Math.round(t*n)/n}function Mv(t){let e=t.getFullYear(),n=("0"+(t.getMonth()+1)).slice(-2),i=("0"+t.getDate()).slice(-2),o=("0"+t.getHours()).slice(-2),r=("0"+t.getMinutes()).slice(-2);return`${e}-${n}-${i} ${o}:${r}`}function qc(t,e){if(!t)return"";e=e||new Date().getTime();let n=(e-+t)/1e3,i=[{label:"year",seconds:31536e3},{label:"month",seconds:2592e3},{label:"day",seconds:86400},{label:"hour",seconds:3600},{label:"minute",seconds:60}],o=[];for(;n>60;){let r=i.find(u=>u.seconds$.height||b<$.height)&&(g=m-$.height-a,(o==="top"||g<$.y)&&(g=d.top-$.height-r),t.style.top=g+window.scrollY+"px");let k=n==="center"?a*2:a;return f<$.x+$.width+k&&(_=f-$.width-k,_<0&&(_=a),_=_+window.scrollX),$.xd.top?"bottom":"top"}function Cv(t,e){let n=e.getBoundingClientRect(),i=t.left+t.width/2,o=n.left+n.width/2,r=n.width?n.width/100:1,a=50+(i-o)/r,u=Math.max(8,Math.min(93,a));return`${Math.round(u*r-1)}px`}function c1(t){let e=getComputedStyle(t,null),n=e.overflowX||e.overflow;return/(auto|scroll)/.test(n)?t.scrollWidth>t.clientWidth:!1}function _1(t){if(!(t instanceof HTMLElement||t instanceof SVGElement))return!1;if(c1(t))return!0;let e=t.parentElement;for(;e;){if(c1(e))return!0;e=e.parentElement}return!1}function es(t){if(t=t[0]==="#"?t.slice(1):t,t.length===3&&(t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]),t.length!==6)return!1;let e=parseInt(t.substring(0,2),16),n=parseInt(t.substring(2,4),16),i=parseInt(t.substring(4,6),16);if(isNaN(e)||isNaN(n)||isNaN(i))return!1;let o=(e*299+n*587+i*114)/1e3;return isNaN(o)?!1:o<140}var Ev=t=>({}),v1=t=>({});function Sv(t){let e,n,i,o,r,a,u,m,f,d,g,_,h,b,$,k,v=t[16].default,T=At(v,t,t[15],null),I=t[16].footer,D=At(I,t,t[15],v1);return{c(){e=p("div"),n=p("div"),i=p("div"),o=c(),r=p("h1"),a=ne(t[3]),u=c(),m=p("div"),T&&T.c(),f=c(),d=p("div"),D&&D.c(),g=c(),_=p("div"),H(i,"tabindex","0"),H(i,"class","focus-trap focus-trap-top"),H(r,"class","dialog-header"),H(m,"class","dialog-content"),H(d,"class","dialog-footer"),H(_,"tabindex","0"),H(_,"class","focus-trap focus-trap-bottom"),H(n,"class","dialog"),te(n,"no-title",!t[3]),H(e,"role","dialog"),H(e,"aria-modal","true"),H(e,"aria-label",t[3]),H(e,"class",h="dialog-backdrop "+t[2]),te(e,"opened",t[0])},m(L,M){l(L,e,M),q(e,n),q(n,i),q(n,o),q(n,r),q(r,a),q(n,u),q(n,m),T&&T.m(m,null),t[17](m),q(n,f),q(n,d),D&&D.m(d,null),t[18](d),q(n,g),q(n,_),t[19](n),t[20](e),b=!0,$||(k=[we(i,"focus",t[8]),we(_,"focus",t[7]),we(e,"mousedown",t[9]),we(e,"click",t[10])],$=!0)},p(L,[M]){(!b||M&8)&&Be(a,L[3]),T&&T.p&&(!b||M&32768)&&Ot(T,v,L,L[15],b?It(v,L[15],M,null):Ht(L[15]),null),D&&D.p&&(!b||M&32768)&&Ot(D,I,L,L[15],b?It(I,L[15],M,Ev):Ht(L[15]),v1),(!b||M&8)&&te(n,"no-title",!L[3]),(!b||M&8)&&H(e,"aria-label",L[3]),(!b||M&4&&h!==(h="dialog-backdrop "+L[2]))&&H(e,"class",h),(!b||M&5)&&te(e,"opened",L[0])},i(L){b||(w(T,L),w(D,L),b=!0)},o(L){y(T,L),y(D,L),b=!1},d(L){L&&s(e),T&&T.d(L),t[17](null),D&&D.d(L),t[18](null),t[19](null),t[20](null),$=!1,qe(k)}}}function Lv(t,e){let i={ArrowLeft:"nextElementSibling",ArrowRight:"previousElementSibling"}[e],o=t[i];for(;o&&o.tagName!=="BUTTON";)o=o[i];o&&o.focus()}function Dv(t,e,n){let i;dn(t,un,j=>n(25,i=j));let{$$slots:o={},$$scope:r}=e,{class:a=""}=e,{title:u=""}=e,{opened:m=!1}=e,{skipFirstFocus:f=!1}=e,{modal:d=!1}=e,{element:g}=e,_=lt(),h,b,$,k,v,T,I;Nt(()=>{document.body.appendChild(g)});function D(){let j=M().shift(),Y=M().pop();!j&&!Y&&(b.setAttribute("tabindex",0),j=b),Y&&Y.scrollIntoView({block:"end"}),j&&j.focus()}function L(){let j=M().shift(),Y=M().pop();!j&&!Y&&(b.setAttribute("tabindex",0),Y=b),j&&j.scrollIntoView({block:"end"}),Y&&Y.focus()}function M(){let j=Array.from(b.querySelectorAll(to)),Y=Array.from($.querySelectorAll(to));return[...j,...Y]}function A(j){d&&(j.stopPropagation(),j.preventDefault())}function x(j){!h.contains(j.target)&&!d&&(j.stopPropagation(),W())}function O(j){if(!m)return;let Y=g.contains(document.activeElement);if(j.key==="Tab"&&!Y)return D();if(j.key==="Escape"&&!d)return j.stopPropagation(),W();let Z=j.target?.closest("button");Z&&(j.key==="ArrowLeft"||j.key==="ArrowRight")&&Lv(Z,j.key)}function N(j){j?(I=window.scrollY,document.body.classList.add("has-dialog"),document.body.style.top=`-${I}px`):(document.body.classList.remove("has-dialog"),document.scrollingElement.scrollTop=I,document.body.style.top="")}function F(j){m||(j instanceof Event&&(j=j.target),k=j||document.activeElement,k&&k!==document.body&&(k.setAttribute("aria-haspopup","true"),k.setAttribute("aria-expanded","true")),n(1,g.style.display="flex",g),v&&clearTimeout(v),v=setTimeout(()=>{n(0,m=!0),n(1,g.style.display="flex",g),f!==!0&&f!=="true"&&D(),document.addEventListener("keydown",O),N(!0),_("open")},100))}function W(){m&&(n(0,m=!1),k&&k.focus&&k.focus(),T&&clearTimeout(T),T=setTimeout(()=>{n(0,m=!1),n(1,g.style.display="none",g),document.removeEventListener("keydown",O),k&&k!==document.body&&k.removeAttribute("aria-expanded"),N(!1),_("close")},i))}function K(j){be[j?"unshift":"push"](()=>{b=j,n(5,b)})}function z(j){be[j?"unshift":"push"](()=>{$=j,n(6,$)})}function U(j){be[j?"unshift":"push"](()=>{h=j,n(4,h)})}function P(j){be[j?"unshift":"push"](()=>{g=j,n(1,g)})}return t.$$set=j=>{"class"in j&&n(2,a=j.class),"title"in j&&n(3,u=j.title),"opened"in j&&n(0,m=j.opened),"skipFirstFocus"in j&&n(11,f=j.skipFirstFocus),"modal"in j&&n(12,d=j.modal),"element"in j&&n(1,g=j.element),"$$scope"in j&&n(15,r=j.$$scope)},[m,g,a,u,h,b,$,D,L,A,x,f,d,F,W,r,o,K,z,U,P]}var Bc=class extends ue{constructor(e){super(),me(this,e,Dv,Sv,fe,{class:2,title:3,opened:0,skipFirstFocus:11,modal:12,element:1,open:13,close:14})}get class(){return this.$$.ctx[2]}set class(e){this.$$set({class:e}),Ct()}get title(){return this.$$.ctx[3]}set title(e){this.$$set({title:e}),Ct()}get opened(){return this.$$.ctx[0]}set opened(e){this.$$set({opened:e}),Ct()}get skipFirstFocus(){return this.$$.ctx[11]}set skipFirstFocus(e){this.$$set({skipFirstFocus:e}),Ct()}get modal(){return this.$$.ctx[12]}set modal(e){this.$$set({modal:e}),Ct()}get element(){return this.$$.ctx[1]}set element(e){this.$$set({element:e}),Ct()}get open(){return this.$$.ctx[13]}get close(){return this.$$.ctx[14]}},$i=Bc;function ts(t){let e=t-1;return e*e*e+1}function no(t,{delay:e=0,duration:n=400,easing:i=ts,x:o=0,y:r=0,opacity:a=0}={}){let u=getComputedStyle(t),m=+u.opacity,f=u.transform==="none"?"":u.transform,d=m*(1-a),[g,_]=kc(o),[h,b]=kc(r);return{delay:e,duration:n,easing:i,css:($,k)=>` - transform: ${f} translate(${(1-$)*g}${_}, ${(1-$)*h}${b}); - opacity: ${m-d*k}`}}function w1({fallback:t,...e}){let n=new Map,i=new Map;function o(a,u,m){let{delay:f=0,duration:d=M=>Math.sqrt(M)*30,easing:g=ts}=tt(tt({},e),m),_=a.getBoundingClientRect(),h=u.getBoundingClientRect(),b=_.left-h.left,$=_.top-h.top,k=_.width/h.width,v=_.height/h.height,T=Math.sqrt(b*b+$*$),I=getComputedStyle(u),D=I.transform==="none"?"":I.transform,L=+I.opacity;return{delay:f,duration:vt(d)?d(T):d,easing:g,css:(M,A)=>` - opacity: ${M*L}; +var __create = Object.create; +var __defProp = Object.defineProperty; +var __getOwnPropDesc = Object.getOwnPropertyDescriptor; +var __getOwnPropNames = Object.getOwnPropertyNames; +var __getProtoOf = Object.getPrototypeOf; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __commonJS = (cb, mod) => function __require() { + return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; +}; +var __export = (target, all) => { + for (var name2 in all) + __defProp(target, name2, { get: all[name2], enumerable: true }); +}; +var __copyProps = (to, from, except, desc) => { + if (from && typeof from === "object" || typeof from === "function") { + for (let key of __getOwnPropNames(from)) + if (!__hasOwnProp.call(to, key) && key !== except) + __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); + } + return to; +}; +var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( + // If the importer is in node compatibility mode or this is not an ESM + // file that has been converted to a CommonJS file using a Babel- + // compatible transform (i.e. "__esModule" has not been set), then set + // "default" to the CommonJS "module.exports" for node compatibility. + isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, + mod +)); + +// node_modules/vanilla-swipe/lib/types/index.js +var require_types = __commonJS({ + "node_modules/vanilla-swipe/lib/types/index.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.TraceDirectionKey = exports.Direction = exports.Axis = void 0; + var TraceDirectionKey; + exports.TraceDirectionKey = TraceDirectionKey; + (function(TraceDirectionKey2) { + TraceDirectionKey2["NEGATIVE"] = "NEGATIVE"; + TraceDirectionKey2["POSITIVE"] = "POSITIVE"; + TraceDirectionKey2["NONE"] = "NONE"; + })(TraceDirectionKey || (exports.TraceDirectionKey = TraceDirectionKey = {})); + var Direction; + exports.Direction = Direction; + (function(Direction2) { + Direction2["TOP"] = "TOP"; + Direction2["LEFT"] = "LEFT"; + Direction2["RIGHT"] = "RIGHT"; + Direction2["BOTTOM"] = "BOTTOM"; + Direction2["NONE"] = "NONE"; + })(Direction || (exports.Direction = Direction = {})); + var Axis; + exports.Axis = Axis; + (function(Axis2) { + Axis2["X"] = "x"; + Axis2["Y"] = "y"; + })(Axis || (exports.Axis = Axis = {})); + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDirection.js +var require_calculateDirection = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDirection.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDirection = calculateDirection; + var _types = require_types(); + function calculateDirection(trace) { + var direction; + var negative = _types.TraceDirectionKey.NEGATIVE; + var positive = _types.TraceDirectionKey.POSITIVE; + var current = trace[trace.length - 1]; + var previous = trace[trace.length - 2] || 0; + if (trace.every(function(i) { + return i === 0; + })) { + return _types.TraceDirectionKey.NONE; + } + direction = current > previous ? positive : negative; + if (current === 0) { + direction = previous < 0 ? positive : negative; + } + return direction; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/common.js +var require_common = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/common.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.resolveAxisDirection = exports.getDirectionValue = exports.getDirectionKey = exports.getDifference = void 0; + var _types = require_types(); + var getDirectionKey = function getDirectionKey2() { + var object = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + var key = Object.keys(object).toString(); + switch (key) { + case _types.TraceDirectionKey.POSITIVE: + return _types.TraceDirectionKey.POSITIVE; + case _types.TraceDirectionKey.NEGATIVE: + return _types.TraceDirectionKey.NEGATIVE; + default: + return _types.TraceDirectionKey.NONE; + } + }; + exports.getDirectionKey = getDirectionKey; + var getDirectionValue = function getDirectionValue2() { + var values = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; + return values[values.length - 1] || 0; + }; + exports.getDirectionValue = getDirectionValue; + var getDifference = function getDifference2() { + var x = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; + var y = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + return Math.abs(x - y); + }; + exports.getDifference = getDifference; + var resolveAxisDirection = function resolveAxisDirection2(axis, key) { + var negative = _types.Direction.LEFT; + var positive = _types.Direction.RIGHT; + var direction = _types.Direction.NONE; + if (axis === _types.Axis.Y) { + negative = _types.Direction.BOTTOM; + positive = _types.Direction.TOP; + } + if (key === _types.TraceDirectionKey.NEGATIVE) { + direction = negative; + } + if (key === _types.TraceDirectionKey.POSITIVE) { + direction = positive; + } + return direction; + }; + exports.resolveAxisDirection = resolveAxisDirection; + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js +var require_calculateDirectionDelta = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDirectionDelta.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDirectionDelta = calculateDirectionDelta; + var _types = require_types(); + var _common = require_common(); + function calculateDirectionDelta(traceDirections) { + var delta = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + var length = traceDirections.length; + var i = length - 1; + var direction = _types.TraceDirectionKey.NONE; + for (; i >= 0; i--) { + var current = traceDirections[i]; + var currentKey = (0, _common.getDirectionKey)(current); + var currentValue = (0, _common.getDirectionValue)(current[currentKey]); + var prev = traceDirections[i - 1] || {}; + var prevKey = (0, _common.getDirectionKey)(prev); + var prevValue = (0, _common.getDirectionValue)(prev[prevKey]); + var difference = (0, _common.getDifference)(currentValue, prevValue); + if (difference >= delta) { + direction = currentKey; + break; + } else { + direction = prevKey; + } + } + return direction; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateDuration.js +var require_calculateDuration = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateDuration.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateDuration = calculateDuration; + function calculateDuration() { + var prevTime = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0; + var nextTime = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + return prevTime ? nextTime - prevTime : 0; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js +var require_calculateMovingPosition = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateMovingPosition.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateMovingPosition = calculateMovingPosition; + function calculateMovingPosition(e) { + if ("changedTouches" in e) { + var touches = e.changedTouches && e.changedTouches[0]; + return { + x: touches && touches.clientX, + y: touches && touches.clientY + }; + } + return { + x: e.clientX, + y: e.clientY + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/updateTrace.js +var require_updateTrace = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/updateTrace.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.updateTrace = updateTrace; + function updateTrace(trace, value2) { + var last = trace[trace.length - 1]; + if (last !== value2) { + trace.push(value2); + } + return trace; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js +var require_calculateTraceDirections = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateTraceDirections.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateTraceDirections = calculateTraceDirections; + var _types = require_types(); + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + function calculateTraceDirections() { + var trace = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : []; + var ticks = []; + var positive = _types.TraceDirectionKey.POSITIVE; + var negative = _types.TraceDirectionKey.NEGATIVE; + var i = 0; + var tick2 = []; + var direction = _types.TraceDirectionKey.NONE; + for (; i < trace.length; i++) { + var current = trace[i]; + var prev = trace[i - 1]; + if (tick2.length) { + var currentDirection = current > prev ? positive : negative; + if (direction === _types.TraceDirectionKey.NONE) { + direction = currentDirection; + } + if (currentDirection === direction) { + tick2.push(current); + } else { + ticks.push(_defineProperty({}, direction, tick2.slice())); + tick2 = []; + tick2.push(current); + direction = currentDirection; + } + } else { + if (current !== 0) { + direction = current > 0 ? positive : negative; + } + tick2.push(current); + } + } + if (tick2.length) { + ticks.push(_defineProperty({}, direction, tick2)); + } + return ticks; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/resolveDirection.js +var require_resolveDirection = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/resolveDirection.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.resolveDirection = resolveDirection; + var _calculateDirection = require_calculateDirection(); + var _calculateTraceDirections = require_calculateTraceDirections(); + var _calculateDirectionDelta = require_calculateDirectionDelta(); + var _common = require_common(); + var _types = require_types(); + function resolveDirection(trace) { + var axis = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : _types.Axis.X; + var directionDelta = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 0; + if (directionDelta) { + var directions = (0, _calculateTraceDirections.calculateTraceDirections)(trace); + var _direction = (0, _calculateDirectionDelta.calculateDirectionDelta)(directions, directionDelta); + return (0, _common.resolveAxisDirection)(axis, _direction); + } + var direction = (0, _calculateDirection.calculateDirection)(trace); + return (0, _common.resolveAxisDirection)(axis, direction); + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculateVelocity.js +var require_calculateVelocity = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculateVelocity.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculateVelocity = calculateVelocity; + function calculateVelocity(x, y, time) { + var magnitude = Math.sqrt(x * x + y * y); + return magnitude / (time || 1); + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/calculatePosition.js +var require_calculatePosition = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/calculatePosition.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.calculatePosition = calculatePosition; + var _updateTrace = require_updateTrace(); + var _resolveDirection = require_resolveDirection(); + var _calculateDuration = require_calculateDuration(); + var _calculateVelocity = require_calculateVelocity(); + var _types = require_types(); + function calculatePosition(state, options) { + var start = state.start, x = state.x, y = state.y, traceX = state.traceX, traceY = state.traceY; + var rotatePosition = options.rotatePosition, directionDelta = options.directionDelta; + var deltaX = rotatePosition.x - x; + var deltaY = y - rotatePosition.y; + var absX = Math.abs(deltaX); + var absY = Math.abs(deltaY); + (0, _updateTrace.updateTrace)(traceX, deltaX); + (0, _updateTrace.updateTrace)(traceY, deltaY); + var directionX = (0, _resolveDirection.resolveDirection)(traceX, _types.Axis.X, directionDelta); + var directionY = (0, _resolveDirection.resolveDirection)(traceY, _types.Axis.Y, directionDelta); + var duration2 = (0, _calculateDuration.calculateDuration)(start, Date.now()); + var velocity = (0, _calculateVelocity.calculateVelocity)(absX, absY, duration2); + return { + absX, + absY, + deltaX, + deltaY, + directionX, + directionY, + duration: duration2, + positionX: rotatePosition.x, + positionY: rotatePosition.y, + velocity + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js +var require_checkIsMoreThanSingleTouches = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsMoreThanSingleTouches.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsMoreThanSingleTouches = void 0; + var checkIsMoreThanSingleTouches = function checkIsMoreThanSingleTouches2(e) { + return Boolean(e.touches && e.touches.length > 1); + }; + exports.checkIsMoreThanSingleTouches = checkIsMoreThanSingleTouches; + } +}); + +// node_modules/vanilla-swipe/lib/utils/createOptions.js +var require_createOptions = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/createOptions.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.createOptions = createOptions; + function createOptions() { + var proxy = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + Object.defineProperty(proxy, "passive", { + get: function get() { + this.isPassiveSupported = true; + return true; + }, + enumerable: true + }); + return proxy; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js +var require_checkIsPassiveSupported = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsPassiveSupported.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsPassiveSupported = checkIsPassiveSupported; + exports.noop = void 0; + var _createOptions = require_createOptions(); + function checkIsPassiveSupported(isPassiveSupported) { + if (typeof isPassiveSupported === "boolean") { + return isPassiveSupported; + } + var proxy = { + isPassiveSupported + }; + try { + var options = (0, _createOptions.createOptions)(proxy); + window.addEventListener("checkIsPassiveSupported", noop2, options); + window.removeEventListener("checkIsPassiveSupported", noop2, options); + } catch (err) { + } + return proxy.isPassiveSupported; + } + var noop2 = function noop3() { + }; + exports.noop = noop2; + } +}); + +// node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js +var require_checkIsTouchEventsSupported = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/checkIsTouchEventsSupported.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.checkIsTouchEventsSupported = void 0; + function _typeof(obj) { + "@babel/helpers - typeof"; + return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { + return typeof obj2; + } : function(obj2) { + return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; + }, _typeof(obj); + } + var checkIsTouchEventsSupported = function checkIsTouchEventsSupported2() { + return (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object" && ("ontouchstart" in window || Boolean(window.navigator.maxTouchPoints)); + }; + exports.checkIsTouchEventsSupported = checkIsTouchEventsSupported; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getInitialState.js +var require_getInitialState = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getInitialState.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getInitialState = void 0; + function ownKeys(object, enumerableOnly) { + var keys = Object.keys(object); + if (Object.getOwnPropertySymbols) { + var symbols = Object.getOwnPropertySymbols(object); + enumerableOnly && (symbols = symbols.filter(function(sym) { + return Object.getOwnPropertyDescriptor(object, sym).enumerable; + })), keys.push.apply(keys, symbols); + } + return keys; + } + function _objectSpread(target) { + for (var i = 1; i < arguments.length; i++) { + var source = null != arguments[i] ? arguments[i] : {}; + i % 2 ? ownKeys(Object(source), true).forEach(function(key) { + _defineProperty(target, key, source[key]); + }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { + Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); + }); + } + return target; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var getInitialState = function getInitialState2() { + var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + return _objectSpread({ + x: 0, + y: 0, + start: 0, + isSwiping: false, + traceX: [], + traceY: [] + }, options); + }; + exports.getInitialState = getInitialState; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getInitialProps.js +var require_getInitialProps = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getInitialProps.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getInitialProps = void 0; + function ownKeys(object, enumerableOnly) { + var keys = Object.keys(object); + if (Object.getOwnPropertySymbols) { + var symbols = Object.getOwnPropertySymbols(object); + enumerableOnly && (symbols = symbols.filter(function(sym) { + return Object.getOwnPropertyDescriptor(object, sym).enumerable; + })), keys.push.apply(keys, symbols); + } + return keys; + } + function _objectSpread(target) { + for (var i = 1; i < arguments.length; i++) { + var source = null != arguments[i] ? arguments[i] : {}; + i % 2 ? ownKeys(Object(source), true).forEach(function(key) { + _defineProperty(target, key, source[key]); + }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) { + Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); + }); + } + return target; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var getInitialProps = function getInitialProps2() { + var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}; + return _objectSpread({ + element: null, + target: null, + delta: 10, + directionDelta: 0, + rotationAngle: 0, + mouseTrackingEnabled: false, + touchTrackingEnabled: true, + preventDefaultTouchmoveEvent: false, + preventTrackingOnMouseleave: false + }, props); + }; + exports.getInitialProps = getInitialProps; + } +}); + +// node_modules/vanilla-swipe/lib/utils/getOptions.js +var require_getOptions = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/getOptions.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.getOptions = getOptions; + function getOptions() { + var isPassiveSupported = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false; + if (isPassiveSupported) { + return { + passive: false + }; + } + return {}; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/rotateByAngle.js +var require_rotateByAngle = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/rotateByAngle.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.rotateByAngle = rotateByAngle; + function rotateByAngle(position) { + var angle = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; + if (angle === 0) { + return position; + } + var x = position.x, y = position.y; + var angleInRadians = Math.PI / 180 * angle; + var rotatedX = x * Math.cos(angleInRadians) + y * Math.sin(angleInRadians); + var rotatedY = y * Math.cos(angleInRadians) - x * Math.sin(angleInRadians); + return { + x: rotatedX, + y: rotatedY + }; + } + } +}); + +// node_modules/vanilla-swipe/lib/utils/index.js +var require_utils = __commonJS({ + "node_modules/vanilla-swipe/lib/utils/index.js"(exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { + value: true + }); + var _calculateDirection = require_calculateDirection(); + Object.keys(_calculateDirection).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDirection[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDirection[key]; + } + }); + }); + var _calculateDirectionDelta = require_calculateDirectionDelta(); + Object.keys(_calculateDirectionDelta).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDirectionDelta[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDirectionDelta[key]; + } + }); + }); + var _calculateDuration = require_calculateDuration(); + Object.keys(_calculateDuration).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateDuration[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateDuration[key]; + } + }); + }); + var _calculateMovingPosition = require_calculateMovingPosition(); + Object.keys(_calculateMovingPosition).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateMovingPosition[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateMovingPosition[key]; + } + }); + }); + var _calculatePosition = require_calculatePosition(); + Object.keys(_calculatePosition).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculatePosition[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculatePosition[key]; + } + }); + }); + var _calculateTraceDirections = require_calculateTraceDirections(); + Object.keys(_calculateTraceDirections).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateTraceDirections[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateTraceDirections[key]; + } + }); + }); + var _calculateVelocity = require_calculateVelocity(); + Object.keys(_calculateVelocity).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _calculateVelocity[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _calculateVelocity[key]; + } + }); + }); + var _checkIsMoreThanSingleTouches = require_checkIsMoreThanSingleTouches(); + Object.keys(_checkIsMoreThanSingleTouches).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsMoreThanSingleTouches[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsMoreThanSingleTouches[key]; + } + }); + }); + var _checkIsPassiveSupported = require_checkIsPassiveSupported(); + Object.keys(_checkIsPassiveSupported).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsPassiveSupported[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsPassiveSupported[key]; + } + }); + }); + var _checkIsTouchEventsSupported = require_checkIsTouchEventsSupported(); + Object.keys(_checkIsTouchEventsSupported).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _checkIsTouchEventsSupported[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _checkIsTouchEventsSupported[key]; + } + }); + }); + var _common = require_common(); + Object.keys(_common).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _common[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _common[key]; + } + }); + }); + var _createOptions = require_createOptions(); + Object.keys(_createOptions).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _createOptions[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _createOptions[key]; + } + }); + }); + var _getInitialState = require_getInitialState(); + Object.keys(_getInitialState).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getInitialState[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getInitialState[key]; + } + }); + }); + var _getInitialProps = require_getInitialProps(); + Object.keys(_getInitialProps).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getInitialProps[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getInitialProps[key]; + } + }); + }); + var _getOptions = require_getOptions(); + Object.keys(_getOptions).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _getOptions[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _getOptions[key]; + } + }); + }); + var _resolveDirection = require_resolveDirection(); + Object.keys(_resolveDirection).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _resolveDirection[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _resolveDirection[key]; + } + }); + }); + var _rotateByAngle = require_rotateByAngle(); + Object.keys(_rotateByAngle).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _rotateByAngle[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _rotateByAngle[key]; + } + }); + }); + var _updateTrace = require_updateTrace(); + Object.keys(_updateTrace).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (key in exports && exports[key] === _updateTrace[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _updateTrace[key]; + } + }); + }); + } +}); + +// node_modules/vanilla-swipe/lib/index.js +var require_lib = __commonJS({ + "node_modules/vanilla-swipe/lib/index.js"(exports) { + "use strict"; + function _typeof(obj) { + "@babel/helpers - typeof"; + return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj2) { + return typeof obj2; + } : function(obj2) { + return obj2 && "function" == typeof Symbol && obj2.constructor === Symbol && obj2 !== Symbol.prototype ? "symbol" : typeof obj2; + }, _typeof(obj); + } + Object.defineProperty(exports, "__esModule", { + value: true + }); + var _exportNames = {}; + exports["default"] = void 0; + var Utils2 = _interopRequireWildcard(require_utils()); + var _types = require_types(); + Object.keys(_types).forEach(function(key) { + if (key === "default" || key === "__esModule") + return; + if (Object.prototype.hasOwnProperty.call(_exportNames, key)) + return; + if (key in exports && exports[key] === _types[key]) + return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _types[key]; + } + }); + }); + function _getRequireWildcardCache(nodeInterop) { + if (typeof WeakMap !== "function") + return null; + var cacheBabelInterop = /* @__PURE__ */ new WeakMap(); + var cacheNodeInterop = /* @__PURE__ */ new WeakMap(); + return (_getRequireWildcardCache = function _getRequireWildcardCache2(nodeInterop2) { + return nodeInterop2 ? cacheNodeInterop : cacheBabelInterop; + })(nodeInterop); + } + function _interopRequireWildcard(obj, nodeInterop) { + if (!nodeInterop && obj && obj.__esModule) { + return obj; + } + if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { + return { "default": obj }; + } + var cache = _getRequireWildcardCache(nodeInterop); + if (cache && cache.has(obj)) { + return cache.get(obj); + } + var newObj = {}; + var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; + for (var key in obj) { + if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { + var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; + if (desc && (desc.get || desc.set)) { + Object.defineProperty(newObj, key, desc); + } else { + newObj[key] = obj[key]; + } + } + } + newObj["default"] = obj; + if (cache) { + cache.set(obj, newObj); + } + return newObj; + } + function _classCallCheck(instance122, Constructor) { + if (!(instance122 instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + function _defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ("value" in descriptor) + descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } + } + function _createClass(Constructor, protoProps, staticProps) { + if (protoProps) + _defineProperties(Constructor.prototype, protoProps); + if (staticProps) + _defineProperties(Constructor, staticProps); + Object.defineProperty(Constructor, "prototype", { writable: false }); + return Constructor; + } + function _defineProperty(obj, key, value2) { + if (key in obj) { + Object.defineProperty(obj, key, { value: value2, enumerable: true, configurable: true, writable: true }); + } else { + obj[key] = value2; + } + return obj; + } + var VanillaSwipe2 = /* @__PURE__ */ function() { + function VanillaSwipe3(props) { + _classCallCheck(this, VanillaSwipe3); + _defineProperty(this, "state", void 0); + _defineProperty(this, "props", void 0); + this.state = Utils2.getInitialState(); + this.props = Utils2.getInitialProps(props); + this.handleSwipeStart = this.handleSwipeStart.bind(this); + this.handleSwipeMove = this.handleSwipeMove.bind(this); + this.handleSwipeEnd = this.handleSwipeEnd.bind(this); + this.handleMouseDown = this.handleMouseDown.bind(this); + this.handleMouseMove = this.handleMouseMove.bind(this); + this.handleMouseUp = this.handleMouseUp.bind(this); + this.handleMouseLeave = this.handleMouseLeave.bind(this); + } + _createClass(VanillaSwipe3, [{ + key: "init", + value: function init3() { + this.setupTouchListeners(); + this.setupMouseListeners(); + } + }, { + key: "update", + value: function update2(props) { + var prevProps = this.props; + var nextProps = Object.assign({}, prevProps, props); + if (prevProps.element !== nextProps.element || prevProps.target !== nextProps.target) { + this.destroy(); + this.props = nextProps; + this.init(); + return; + } + this.props = nextProps; + if (prevProps.mouseTrackingEnabled !== nextProps.mouseTrackingEnabled || prevProps.preventTrackingOnMouseleave !== nextProps.preventTrackingOnMouseleave) { + this.cleanupMouseListeners(); + nextProps.mouseTrackingEnabled ? this.setupMouseListeners() : this.cleanupMouseListeners(); + } + if (prevProps.touchTrackingEnabled !== nextProps.touchTrackingEnabled) { + this.cleanupTouchListeners(); + nextProps.touchTrackingEnabled ? this.setupTouchListeners() : this.cleanupTouchListeners(); + } + } + }, { + key: "destroy", + value: function destroy() { + this.cleanupMouseListeners(); + this.cleanupTouchListeners(); + this.state = Utils2.getInitialState(); + this.props = Utils2.getInitialProps(); + } + }, { + key: "setupTouchListeners", + value: function setupTouchListeners() { + var _this$props = this.props, element3 = _this$props.element, target = _this$props.target, touchTrackingEnabled = _this$props.touchTrackingEnabled; + if (element3 && touchTrackingEnabled) { + var listener = target || element3; + var isPassiveSupported = Utils2.checkIsPassiveSupported(); + var options = Utils2.getOptions(isPassiveSupported); + listener.addEventListener("touchstart", this.handleSwipeStart, options); + listener.addEventListener("touchmove", this.handleSwipeMove, options); + listener.addEventListener("touchend", this.handleSwipeEnd, options); + } + } + }, { + key: "cleanupTouchListeners", + value: function cleanupTouchListeners() { + var _this$props2 = this.props, element3 = _this$props2.element, target = _this$props2.target; + var listener = target || element3; + if (listener) { + listener.removeEventListener("touchstart", this.handleSwipeStart); + listener.removeEventListener("touchmove", this.handleSwipeMove); + listener.removeEventListener("touchend", this.handleSwipeEnd); + } + } + }, { + key: "setupMouseListeners", + value: function setupMouseListeners() { + var _this$props3 = this.props, element3 = _this$props3.element, mouseTrackingEnabled = _this$props3.mouseTrackingEnabled, preventTrackingOnMouseleave = _this$props3.preventTrackingOnMouseleave; + if (mouseTrackingEnabled && element3) { + element3.addEventListener("mousedown", this.handleMouseDown); + element3.addEventListener("mousemove", this.handleMouseMove); + element3.addEventListener("mouseup", this.handleMouseUp); + if (preventTrackingOnMouseleave) { + element3.addEventListener("mouseleave", this.handleMouseLeave); + } + } + } + }, { + key: "cleanupMouseListeners", + value: function cleanupMouseListeners() { + var element3 = this.props.element; + if (element3) { + element3.removeEventListener("mousedown", this.handleMouseDown); + element3.removeEventListener("mousemove", this.handleMouseMove); + element3.removeEventListener("mouseup", this.handleMouseUp); + element3.removeEventListener("mouseleave", this.handleMouseLeave); + } + } + }, { + key: "getEventData", + value: function getEventData(e) { + var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : { + directionDelta: 0 + }; + var rotationAngle = this.props.rotationAngle; + var directionDelta = options.directionDelta; + var movingPosition = Utils2.calculateMovingPosition(e); + var rotatePosition = Utils2.rotateByAngle(movingPosition, rotationAngle); + return Utils2.calculatePosition(this.state, { + rotatePosition, + directionDelta + }); + } + }, { + key: "handleSwipeStart", + value: function handleSwipeStart(e) { + if (Utils2.checkIsMoreThanSingleTouches(e)) + return; + var rotationAngle = this.props.rotationAngle; + var movingPosition = Utils2.calculateMovingPosition(e); + var _Utils$rotateByAngle = Utils2.rotateByAngle(movingPosition, rotationAngle), x = _Utils$rotateByAngle.x, y = _Utils$rotateByAngle.y; + this.state = Utils2.getInitialState({ + isSwiping: false, + start: Date.now(), + x, + y + }); + } + }, { + key: "handleSwipeMove", + value: function handleSwipeMove(e) { + var _this$state = this.state, x = _this$state.x, y = _this$state.y, isSwiping = _this$state.isSwiping; + if (!x || !y || Utils2.checkIsMoreThanSingleTouches(e)) + return; + var directionDelta = this.props.directionDelta || 0; + var _this$getEventData = this.getEventData(e, { + directionDelta + }), absX = _this$getEventData.absX, absY = _this$getEventData.absY, deltaX = _this$getEventData.deltaX, deltaY = _this$getEventData.deltaY, directionX = _this$getEventData.directionX, directionY = _this$getEventData.directionY, duration2 = _this$getEventData.duration, velocity = _this$getEventData.velocity; + var _this$props4 = this.props, delta = _this$props4.delta, preventDefaultTouchmoveEvent = _this$props4.preventDefaultTouchmoveEvent, onSwipeStart = _this$props4.onSwipeStart, onSwiping = _this$props4.onSwiping; + if (e.cancelable && preventDefaultTouchmoveEvent) + e.preventDefault(); + if (absX < Number(delta) && absY < Number(delta) && !isSwiping) + return; + if (onSwipeStart && !isSwiping) { + onSwipeStart(e, { + deltaX, + deltaY, + absX, + absY, + directionX, + directionY, + duration: duration2, + velocity + }); + } + this.state.isSwiping = true; + if (onSwiping) { + onSwiping(e, { + deltaX, + deltaY, + absX, + absY, + directionX, + directionY, + duration: duration2, + velocity + }); + } + } + }, { + key: "handleSwipeEnd", + value: function handleSwipeEnd(e) { + var _this$props5 = this.props, onSwiped = _this$props5.onSwiped, onTap = _this$props5.onTap; + if (this.state.isSwiping) { + var directionDelta = this.props.directionDelta || 0; + var position = this.getEventData(e, { + directionDelta + }); + onSwiped && onSwiped(e, position); + } else { + var _position = this.getEventData(e); + onTap && onTap(e, _position); + } + this.state = Utils2.getInitialState(); + } + }, { + key: "handleMouseDown", + value: function handleMouseDown(e) { + var target = this.props.target; + if (target) { + if (target === e.target) { + this.handleSwipeStart(e); + } + } else { + this.handleSwipeStart(e); + } + } + }, { + key: "handleMouseMove", + value: function handleMouseMove(e) { + this.handleSwipeMove(e); + } + }, { + key: "handleMouseUp", + value: function handleMouseUp(e) { + var isSwiping = this.state.isSwiping; + var target = this.props.target; + if (target) { + if (target === e.target || isSwiping) { + this.handleSwipeEnd(e); + } + } else { + this.handleSwipeEnd(e); + } + } + }, { + key: "handleMouseLeave", + value: function handleMouseLeave(e) { + var isSwiping = this.state.isSwiping; + if (isSwiping) { + this.handleSwipeEnd(e); + } + } + }], [{ + key: "isTouchEventsSupported", + value: function isTouchEventsSupported() { + return Utils2.checkIsTouchEventsSupported(); + } + }]); + return VanillaSwipe3; + }(); + exports["default"] = VanillaSwipe2; + } +}); + +// node_modules/prismjs/prism.js +var require_prism = __commonJS({ + "node_modules/prismjs/prism.js"(exports, module) { + var _self = typeof window !== "undefined" ? window : typeof WorkerGlobalScope !== "undefined" && self instanceof WorkerGlobalScope ? self : {}; + var Prism2 = function(_self2) { + var lang = /(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i; + var uniqueId = 0; + var plainTextGrammar = {}; + var _ = { + /** + * By default, Prism will attempt to highlight all code elements (by calling {@link Prism.highlightAll}) on the + * current page after the page finished loading. This might be a problem if e.g. you wanted to asynchronously load + * additional languages or plugins yourself. + * + * By setting this value to `true`, Prism will not automatically highlight all code elements on the page. + * + * You obviously have to change this value before the automatic highlighting started. To do this, you can add an + * empty Prism object into the global scope before loading the Prism script like this: + * + * ```js + * window.Prism = window.Prism || {}; + * Prism.manual = true; + * // add a new - + diff --git a/docs/ui.css b/docs/ui.css index 8f7fa2ff..b1a2046a 100644 --- a/docs/ui.css +++ b/docs/ui.css @@ -595,8 +595,9 @@ button { -ms-touch-action: manipulation; touch-action: manipulation; } background: var(--ui-color-background-input); border-bottom: 1px solid var(--ui-color-border); box-shadow: 0 .5px 0 var(--ui-color-background-1); - z-index: 5; - position: relative; + position: sticky; + top: 0; + z-index: 1; } .grid { @@ -605,7 +606,12 @@ button { -ms-touch-action: manipulation; touch-action: manipulation; } cursor: default; } -.grid table { table-layout: fixed; } +.grid table { + table-layout: fixed; + position: sticky; + top: 0; + z-index: 2; +} .grid-item { content-visibility: auto; } .grid .column-check { width: 3em; padding: 0 0.5em; } @@ -656,8 +662,7 @@ button { -ms-touch-action: manipulation; touch-action: manipulation; } text-overflow: ellipsis; flex: 1; } -.grid-sortable thead th.sortasc svg, -.grid-sortable thead th.sortdesc svg { +.grid-sortable thead th svg { width: 20px; height: 20px; color: var(--ui-color-text-2); diff --git a/src/grid/store/data.js b/src/grid/DataStore.js similarity index 82% rename from src/grid/store/data.js rename to src/grid/DataStore.js index b3806294..204fb6c0 100644 --- a/src/grid/store/data.js +++ b/src/grid/DataStore.js @@ -1,15 +1,22 @@ import { writable, get } from 'svelte/store'; -import { isset } from '../../utils.js'; +import { isset } from '../utils.js'; +/** + * DataStore + * @description Store for all grid data + * @returns {Object} DataStore + */ export function DataStore () { const _this = writable([]); const { subscribe, set } = _this; + const columns = writable([]); const allSelected = writable(false); const someSelected = writable(false); const sortField = writable(''); const sortOrder = writable('ASC'); + let lastSelectedItemId = null; @@ -33,15 +40,17 @@ export function DataStore () { } function toggleSelectAll (forceState = null) { - if (typeof forceState === 'boolean') allSelected.set(forceState); - else { - if (get(someSelected)) allSelected.set(false); - else allSelected.set(!get(allSelected)); - } + let isAll = get(allSelected); + + if (typeof forceState === 'boolean') isAll = forceState; + else isAll = get(someSelected) ? false : !isAll; + + allSelected.set(isAll); + someSelected.set(false); + const $Data = get(_this); - $Data.forEach(_item => _item.selected = allSelected); + $Data.forEach(_item => _item.selected = isAll); set($Data); - someSelected.set(false); // onSelectionChange(); } @@ -75,8 +84,9 @@ export function DataStore () { function updateSelectedCounters () { const $Data = get(_this); const countSelected = $Data.filter(t => t.selected).length; - allSelected.set($Data.length === countSelected); - someSelected.set(countSelected > 0 && !allSelected); + const isAll = $Data.length === countSelected; + allSelected.set(isAll); + someSelected.set(countSelected > 0 && !isAll); } sortField.subscribe(field => { @@ -91,10 +101,13 @@ export function DataStore () { subscribe, set, get: () => _this, + + columns, allSelected, someSelected, sortField, sortOrder, + toggleSelection, toggleSelectAll, reset: () => set([]) @@ -116,13 +129,13 @@ function sortData (items, field, order) { -export function numberSort (field, order = 'ASC') { +function numberSort (field, order = 'ASC') { if (order === 'ASC') return (a, b) => Math.abs(a[field]) - Math.abs(b[field]); return (a, b) => Math.abs(b[field]) - Math.abs(a[field]); } -export function stringSort (field, order = 'ASC') { +function stringSort (field, order = 'ASC') { if (order === 'ASC') return (a, b) => ('' + a[field]).localeCompare('' + b[field]); return (a, b) => ('' + b[field]).localeCompare('' + a[field]); } diff --git a/src/grid/Grid.css b/src/grid/Grid.css index 5c8bb290..41181977 100644 --- a/src/grid/Grid.css +++ b/src/grid/Grid.css @@ -6,8 +6,9 @@ background: var(--ui-color-background-input); border-bottom: 1px solid var(--ui-color-border); box-shadow: 0 .5px 0 var(--ui-color-background-1); - z-index: 5; - position: relative; + position: sticky; + top: 0; + z-index: 1; } .grid { @@ -16,7 +17,12 @@ cursor: default; } -.grid table { table-layout: fixed; } +.grid table { + table-layout: fixed; + position: sticky; + top: 0; + z-index: 2; +} .grid-item { content-visibility: auto; } .grid .column-check { width: 3em; padding: 0 0.5em; } @@ -67,8 +73,7 @@ text-overflow: ellipsis; flex: 1; } -.grid-sortable thead th.sortasc svg, -.grid-sortable thead th.sortdesc svg { +.grid-sortable thead th svg { width: 20px; height: 20px; color: var(--ui-color-text-2); diff --git a/src/grid/Grid.svelte b/src/grid/Grid.svelte index de9ccd5b..4619756c 100644 --- a/src/grid/Grid.svelte +++ b/src/grid/Grid.svelte @@ -12,16 +12,16 @@

              {title}

              {/if} - - - + + +
              diff --git a/src/grid/parts/GridFoot.svelte b/src/grid/parts/GridFoot.svelte index 28a2a754..fb49ba61 100644 --- a/src/grid/parts/GridFoot.svelte +++ b/src/grid/parts/GridFoot.svelte @@ -3,7 +3,7 @@ {#if multiselect} {/if} - {#each $Columns as column} + {#each $columns as column} {column.total ? sumColumn(column) : ''} {/each} @@ -12,8 +12,8 @@ diff --git a/src/grid/parts/GridRow.svelte b/src/grid/parts/GridRow.svelte index c1ac06fa..1f81d941 100644 --- a/src/grid/parts/GridRow.svelte +++ b/src/grid/parts/GridRow.svelte @@ -11,7 +11,7 @@ {/if} - {#each $Columns as column} + {#each $columns as column} {item[column.field] || ''} @@ -23,10 +23,9 @@ import { Checkbox } from '../../input'; export let item = {}; export let multiselect = false; -export let Columns = []; export let Data = []; - +$:columns = Data.columns; $:id = item.id || item.field; function getType (column) { diff --git a/src/grid/store/columns.js b/src/grid/store/columns.js deleted file mode 100644 index ec0accbe..00000000 --- a/src/grid/store/columns.js +++ /dev/null @@ -1,16 +0,0 @@ -import { writable, get } from 'svelte/store'; - - -export function ColumnsStore () { - const { subscribe, set } = writable([]); - - return { - subscribe, - set, - get () { - return get(this); - }, - reset: () => set([]) - }; -} - diff --git a/src/grid/store/index.js b/src/grid/store/index.js deleted file mode 100644 index eb29ba7e..00000000 --- a/src/grid/store/index.js +++ /dev/null @@ -1,2 +0,0 @@ -export * from './columns.js'; -export * from './data.js'; diff --git a/src/grid/utils.js b/src/grid/utils.js index 0464f791..cb77d1c8 100644 --- a/src/grid/utils.js +++ b/src/grid/utils.js @@ -29,3 +29,34 @@ export function getSelectableItems (element) { if (rows && rows.length) return Array.from(rows); return []; } + + +/** + * Returns the scroll container element. + * @param element - The main grid element + * @param scrollContainer - Element or selector of the grid container that is scrollable (if passed by the consumer) + * @returns {HTMLElement} + */ +export function getScrollContainer (element, scrollContainer) { + let scrollEl = element; + if (scrollContainer) { + if (typeof scrollContainer === 'string') scrollEl = element.closest(scrollContainer); + else scrollEl = scrollContainer; + } + return scrollEl.scrollTo ? scrollEl : null; +} + + +/** + * Returns the height of the title + thead section of the grid. + * @param element - The main grid element + * @returns {number} + */ +export function getHeaderHeight (element) { + if (!element) return 0; + const _title = element.querySelector('.grid-title'); + const titleHeight = _title ? _title.offsetHeight : 0; + const head = element.querySelector('thead'); + const headHeight = head ? head.offsetHeight : 0; + return headHeight + titleHeight; +} From 5db10f30e242bff89cf0c4ce11b938a853e6711c Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Thu, 23 May 2024 22:49:07 +0100 Subject: [PATCH 09/11] grid updates --- CHANGELOG.md | 4 ++-- docs-src/components/grid/Grid.svelte | 2 +- docs/docs.js | 33 ++++++++++++++-------------- src/grid/DataStore.js | 1 - src/grid/Grid.svelte | 5 +++-- 5 files changed, 22 insertions(+), 23 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a3bebe73..840d974a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,9 +2,9 @@ Changelog ========= -## v10.0.0 *(2024-?-?)* +## v10.0.0 *(2024-05-23)* - Breaking change: Dropped `deepCopy` in favour of the native (and unwrapped) `structuredClone`. -- New component: `Grid`. +- New component: `Grid` (alpha). This should not be used for production yet, as it's still in development (or it may even be dropped). - Use `crypto` for `guid` generation in `utils`. diff --git a/docs-src/components/grid/Grid.svelte b/docs-src/components/grid/Grid.svelte index ee84f3ed..c8557ce0 100644 --- a/docs-src/components/grid/Grid.svelte +++ b/docs-src/components/grid/Grid.svelte @@ -1,4 +1,4 @@ -

              Grid

              +

              Grid [alpha version]

              Grid component is basically a table on steroids.

              diff --git a/docs/docs.js b/docs/docs.js index f4015398..19b4eef9 100644 --- a/docs/docs.js +++ b/docs/docs.js @@ -29873,7 +29873,6 @@ var GridFoot = class extends SvelteComponentDev { var GridFoot_default = GridFoot; // src/grid/Grid.svelte -var { Object: Object_12 } = globals; var file31 = "src/grid/Grid.svelte"; function create_if_block18(ctx) { let h1; @@ -30180,9 +30179,9 @@ function instance37($$self2, $$props2, $$invalidate2) { let clickTimer; let previousKey; onMount(() => { - Object.assign(element3.dataset, data); - if (_interactive) + if (_interactive) { requestAnimationFrame(() => headerHeight = getHeaderHeight(element3)); + } }); beforeUpdate(() => { if (data) @@ -30327,7 +30326,7 @@ function instance37($$self2, $$props2, $$invalidate2) { "multiselect", "element" ]; - Object_12.keys($$props2).forEach((key) => { + Object.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); @@ -33338,7 +33337,7 @@ function getNextNotification(el, id2) { } // src/notification-center/NotificationArchive/NotificationArchive.svelte -var { Object: Object_13 } = globals; +var { Object: Object_12 } = globals; var file36 = "src/notification-center/NotificationArchive/NotificationArchive.svelte"; function get_each_context13(ctx, list, i) { const child_ctx = ctx.slice(); @@ -34147,7 +34146,7 @@ function instance43($$self2, $$props2, $$invalidate2) { return slideUp(node, { duration: 0 }); } const writable_props = ["show", "expanded"]; - Object_13.keys($$props2).forEach((key) => { + Object_12.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); @@ -34265,7 +34264,7 @@ var NotificationArchive = class extends SvelteComponentDev { var NotificationArchive_default = NotificationArchive; // src/notification-center/NotificationCenter/NotificationCenter.svelte -var { Object: Object_14 } = globals; +var { Object: Object_13 } = globals; var file37 = "src/notification-center/NotificationCenter/NotificationCenter.svelte"; function get_each_context14(ctx, list, i) { const child_ctx = ctx.slice(); @@ -35116,7 +35115,7 @@ function instance44($$self2, $$props2, $$invalidate2) { } } const writable_props = ["class", "round", "outline", "hideButton"]; - Object_14.keys($$props2).forEach((key) => { + Object_13.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); @@ -36540,7 +36539,7 @@ var Splitter = class extends SvelteComponentDev { var Splitter_default = Splitter; // src/table/Table.svelte -var { Object: Object_15 } = globals; +var { Object: Object_14 } = globals; var file40 = "src/table/Table.svelte"; function create_fragment47(ctx) { let div; @@ -36919,7 +36918,7 @@ function instance47($$self2, $$props2, $$invalidate2) { "rowSelector", "data" ]; - Object_15.keys($$props2).forEach((key) => { + Object_14.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); @@ -70069,7 +70068,7 @@ function create_fragment86(ctx) { const block = { c: function create() { h2 = element2("h2"); - h2.textContent = "Grid"; + h2.textContent = "Grid [alpha version]"; t1 = space(); p = element2("p"); p.textContent = "Grid component is basically a table on steroids."; @@ -70081,9 +70080,9 @@ function create_fragment86(ctx) { t5 = space(); create_component(api.$$.fragment); add_location(h2, file79, 0, 0, 0); - add_location(p, file79, 1, 0, 14); + add_location(p, file79, 1, 0, 30); attr_dev(div, "class", "grid-viewport"); - add_location(div, file79, 2, 0, 71); + add_location(div, file79, 2, 0, 87); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -75135,7 +75134,7 @@ var Menu_1 = class extends SvelteComponentDev { var Menu_default2 = Menu_1; // docs-src/components/icon/Icon.svelte -var { Object: Object_16 } = globals; +var { Object: Object_15 } = globals; var file83 = "docs-src/components/icon/Icon.svelte"; function get_each_context18(ctx, list, i) { const child_ctx = ctx.slice(); @@ -75607,7 +75606,7 @@ function instance90($$self2, $$props2, $$invalidate2) { </script> `; const writable_props = []; - Object_16.keys($$props2).forEach((key) => { + Object_15.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); @@ -80098,7 +80097,7 @@ var Prefers_dark = class extends SvelteComponentDev { var prefers_dark_default = Prefers_dark; // docs-src/components/utils/Utils.svelte -var { Object: Object_17 } = globals; +var { Object: Object_16 } = globals; var file108 = "docs-src/components/utils/Utils.svelte"; function get_each_context19(ctx, list, i) { const child_ctx = ctx.slice(); @@ -80699,7 +80698,7 @@ function instance115($$self2, $$props2, $$invalidate2) { const props = Object.keys(properties_exports); const fns = Object.keys(functions_exports); const writable_props = []; - Object_17.keys($$props2).forEach((key) => { + Object_16.keys($$props2).forEach((key) => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot") console.warn(` was created with unknown prop '${key}'`); }); diff --git a/src/grid/DataStore.js b/src/grid/DataStore.js index 204fb6c0..f237b1c6 100644 --- a/src/grid/DataStore.js +++ b/src/grid/DataStore.js @@ -128,7 +128,6 @@ function sortData (items, field, order) { } - function numberSort (field, order = 'ASC') { if (order === 'ASC') return (a, b) => Math.abs(a[field]) - Math.abs(b[field]); return (a, b) => Math.abs(b[field]) - Math.abs(a[field]); diff --git a/src/grid/Grid.svelte b/src/grid/Grid.svelte index 4619756c..6358c1f6 100644 --- a/src/grid/Grid.svelte +++ b/src/grid/Grid.svelte @@ -52,8 +52,9 @@ $:_interactive = (interactive === true || interactive === 'true'); onMount(() => { - Object.assign(element.dataset, data); - if (_interactive) requestAnimationFrame(() => headerHeight = getHeaderHeight(element)); + if (_interactive) { + requestAnimationFrame(() => headerHeight = getHeaderHeight(element)); + } }); From c0e2bcb7918d68b0b71a4ff84f153095db8fc7ed Mon Sep 17 00:00:00 2001 From: Dziad Borowy Date: Sun, 26 May 2024 11:41:06 +0100 Subject: [PATCH 10/11] changes --- .../button-group/ButtonGroup.svelte | 2 +- docs/docs.js | 2 +- package-lock.json | 1099 +++++++++-------- package.json | 10 +- src/button/Button.svelte | 2 +- 5 files changed, 559 insertions(+), 556 deletions(-) diff --git a/docs-src/components/button-group/ButtonGroup.svelte b/docs-src/components/button-group/ButtonGroup.svelte index db4a0b13..1b0126ed 100644 --- a/docs-src/components/button-group/ButtonGroup.svelte +++ b/docs-src/components/button-group/ButtonGroup.svelte @@ -97,7 +97,7 @@