@thinking.tools/teff 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/js/tooltip.js ADDED
@@ -0,0 +1,40 @@
1
+ /**
2
+ * teff - Tooltip Enhancement
3
+ * Converts title attributes to data-tooltip for custom styling.
4
+ * Progressive enhancement: native title works without JS.
5
+ */
6
+
7
+ document.addEventListener("DOMContentLoaded", () => {
8
+ const _attrib = "title",
9
+ _sel = "[title]";
10
+ const apply = (el) => {
11
+ const t = el.getAttribute(_attrib);
12
+ if (!t) return;
13
+ el.setAttribute("data-tooltip", t);
14
+ el.hasAttribute("aria-label") || el.setAttribute("aria-label", t);
15
+
16
+ // Kill the original 'title'.
17
+ el.removeAttribute(_attrib);
18
+ };
19
+
20
+ // Apply to all elements on load.
21
+ document.querySelectorAll(_sel).forEach(apply);
22
+
23
+ // Apply to new elements.
24
+ new MutationObserver((muts) => {
25
+ for (const m of muts) {
26
+ apply(m.target);
27
+
28
+ for (const n of m.addedNodes)
29
+ if (n.nodeType === 1) {
30
+ apply(n);
31
+ n.querySelectorAll(_sel).forEach(apply);
32
+ }
33
+ }
34
+ }).observe(document.body, {
35
+ childList: true,
36
+ subtree: true,
37
+ attributes: true,
38
+ attributeFilter: [_attrib],
39
+ });
40
+ });
package/package.json CHANGED
@@ -1,9 +1,10 @@
1
1
  {
2
2
  "name": "@thinking.tools/teff",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "scripts": {
5
5
  "test": "echo \"Error: no test specified\" && exit 1"
6
6
  },
7
+ "homepage": "https://thinking_tools.codeberg.page/teff/",
7
8
  "repository": {
8
9
  "type": "git",
9
10
  "url": "git+https://git@codeberg.org/thinking_tools/teff.git"
@@ -24,7 +25,7 @@
24
25
  "css",
25
26
  "js"
26
27
  ],
27
- "author": "https://codeberg.org/Jolly_Good",
28
+ "author": "https://codeberg.org/thinking_tools",
28
29
  "license": "MIT",
29
30
  "description": "An ultra-lightweight semantic UI library: one CSS file, one JS file. No framework, no build step, no dependencies — dark mode built in.",
30
31
  "main": "teff.min.js",
package/teff.min.css ADDED
@@ -0,0 +1 @@
1
+ @layer theme,base,components,animations,utilities;@layer base{*,*:before,*:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}*{margin:0}html{tab-size:4}body,dialog,[popover]{font-family:var(--font-sans);font-size:var(--text-regular);line-height:var(--leading-normal);color:var(--foreground)}body{background-color:var(--background);color:var(--foreground);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{background-color:light-dark(rgb(0 0 0 / .1),rgb(255 255 255 / .2))}*{scrollbar-width:thin;scrollbar-color:var(--input) transparent}main{padding-block-start:var(--space-8)}search{display:block}img,picture,video,canvas,svg{max-width:100%}p,h1,h2,h3,h4,h5,h6,li,dt,dd,figcaption,summary,label,td,th{overflow-wrap:break-word}h1,h2,h3,h4,h5,h6{font-weight:var(--font-semibold);line-height:1.25;letter-spacing:var(--tracking-tight);text-wrap:balance;&:first-child{margin-block-start:0}}h1{font-size:var(--text-1);margin:var(--space-10) 0 var(--space-6)}h2{font-size:var(--text-2);margin:var(--space-8) 0 var(--space-5)}h3{font-size:var(--text-3);margin:var(--space-6) 0 var(--space-4)}h4{font-size:var(--text-4);margin:var(--space-5) 0 var(--space-3)}h5{font-size:var(--text-5);margin:var(--space-4) 0 var(--space-2)}h6{font-size:var(--text-regular);margin:var(--space-4) 0 var(--space-2)}p{margin-block-end:var(--space-4);text-wrap:pretty;&:last-child{margin-block-end:0}}a{color:var(--primary);text-decoration:underline;text-underline-offset:2px;transition:color var(--transition-fast);&:hover{color:rgb(from var(--primary) r g b / .8)}}strong,b{font-weight:var(--font-semibold)}em,i,dfn{font-style:italic}small{font-size:var(--text-7)}kbd{font-family:var(--font-mono);font-size:.875em;padding:calc(var(--space-1) / 2) var(--space-1);background-color:var(--faint);border:1px solid var(--input);border-bottom-width:2px;border-radius:var(--radius-small);&:has(>kbd){font-size:1em;padding:0;background:none;border:none}}samp,var{font-family:var(--font-mono);font-size:.875em}abbr[title]{text-decoration:underline dotted;text-underline-offset:2px;cursor:help}sub,sup{font-size:.75em;line-height:0}del{color:var(--danger)}ins{color:var(--success);text-decoration-color:rgb(from var(--success) r g b / .4)}s{color:var(--muted-foreground)}u{text-decoration:underline wavy var(--danger);text-underline-offset:2px}code{font-family:var(--font-mono);font-size:.875em;padding:calc(var(--space-1) / 2) var(--space-1);background-color:var(--faint);border-radius:var(--radius-small)}pre{font-family:var(--font-mono);padding:var(--space-4);background-color:var(--faint);border-radius:var(--radius-medium);overflow-x:auto;margin-block-end:var(--space-4);code{padding:0;background:none;border-radius:0}}blockquote{border-inline-start:4px solid var(--border);padding-inline-start:var(--space-4);margin:var(--space-4) 0;color:var(--muted-foreground);font-style:italic}hr{border:none;border-top:1px solid var(--border);margin:var(--space-8) 0}ul,ol{padding-inline-start:var(--space-6);margin-block-end:var(--space-4)}ul{list-style-type:disc}ol{list-style-type:decimal}li{margin-block-end:var(--space-1)}dl{margin-block-end:var(--space-4);& dt{font-weight:var(--font-medium);&:not(:first-child){margin-block-start:var(--space-2)}}& dd{color:var(--muted-foreground)}&[data-grid]{display:grid;grid-template-columns:fit-content(40%) 1fr;column-gap:var(--space-6);row-gap:var(--space-1);& dt{margin-block-start:0}}}figure:not([data-variant]){margin-block:var(--space-6);>:is(img,video),>picture>img{display:block;border-radius:var(--radius-medium);outline:1px solid light-dark(rgb(0 0 0 / .1),rgb(255 255 255 / .1));outline-offset:-1px}>figcaption{margin-block-start:var(--space-2);font-size:var(--text-7);color:var(--muted-foreground)}}hgroup{margin-block-end:var(--space-4);>:is(h1,h2,h3,h4,h5,h6){margin-block-end:var(--space-1)}>p{margin-block-end:0;color:var(--muted-foreground);text-wrap:balance}}mark{background-color:light-dark(var(--logo-citron),rgb(from var(--logo-citron) r g b / .3));color:light-dark(var(--logo-pine),inherit);padding:calc(var(--space-1) / 2) var(--space-1);border-radius:var(--radius-small)}[hidden]{display:none}:focus-visible{outline:2px solid var(--ring);outline-offset:2px}:disabled{opacity:.5;cursor:not-allowed}}@layer theme{:root{color-scheme:light dark;--logo-plum: #330f1f;--logo-red: #c83228;--logo-orange: #fb8841;--logo-citron: #d3dd92;--logo-green: #59824f;--logo-pine: #002414;--logo-navy: #142847;--logo-blue: #2874d7;--logo-sky: #99c2ff;--background: light-dark(#ffffff, #000000);--foreground: light-dark(#0a0a0a, #fafafa);--card: light-dark(#ffffff, #141414);--card-foreground: light-dark(#0a0a0a, #fafafa);--primary: light-dark(#171717, #fafafa);--primary-foreground: light-dark(#fafafa, #171717);--secondary: light-dark(#f5f5f5, #262626);--secondary-foreground: light-dark(#171717, #fafafa);--muted: light-dark(#f5f5f5, #262626);--muted-foreground: light-dark(#6f6f6f, #a3a3a3);--faint: light-dark(#fafafa, #0f0f0f);--faint-foreground: light-dark(#707070, #8f8f8f);--accent: light-dark(#f5f5f5, #262626);--danger: light-dark(#c83228, #ff8a76);--danger-foreground: light-dark(#ffffff, #0a0a0a);--success: light-dark(#47804a, #8fd47e);--success-foreground: light-dark(#ffffff, #0a0a0a);--warning: light-dark(#a85000, #ffa14d);--warning-foreground: light-dark(#ffffff, #0a0a0a);--border: light-dark(#e5e5e5, #262626);--input: light-dark(#d4d4d4, #3d3d3d);--ring: light-dark(#737373, #a3a3a3);--density: 1;--space-1: calc(.25rem * var(--density));--space-2: calc(.5rem * var(--density));--space-3: calc(.75rem * var(--density));--space-4: calc(1rem * var(--density));--space-5: calc(1.25rem * var(--density));--space-6: calc(1.5rem * var(--density));--space-8: calc(2rem * var(--density));--space-10: calc(2.5rem * var(--density));--space-12: calc(3rem * var(--density));--space-14: calc(3.5rem * var(--density));--space-16: calc(4rem * var(--density));--space-18: calc(4.5rem * var(--density));--radius-small: .5rem;--radius-medium: .75rem;--radius-large: 1.25rem;--radius-full: 9999px;--radius-button: var(--radius-full);--radius-field: var(--radius-full);--bar-height: .5rem;--font-sans: system-ui, sans-serif;--font-mono: ui-monospace, Consolas, monospace;--text-1: clamp(1.75rem, 1.5rem + 1.1vw, 2.25rem);--text-2: clamp(1.5rem, 1.3rem + .8vw, 1.875rem);--text-3: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);--text-4: clamp(1.125rem, 1.05rem + .3vw, 1.25rem);--text-5: 1.125rem;--text-6: 1rem;--text-7: .875rem;--text-8: .75rem;--text-regular: var(--text-6);--leading-normal: 1.5;--tracking-tight: -.02em;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 600;--shadow-ring: 0 0 0 1px light-dark(rgb(0 0 0 / .06), rgb(255 255 255 / .08));--shadow-small: var(--shadow-ring), 0 1px 2px light-dark(rgb(0 0 0 / .05), rgb(0 0 0 / 0)), 0 2px 4px light-dark(rgb(0 0 0 / .03), rgb(0 0 0 / 0));--shadow-medium: var(--shadow-ring), 0 2px 4px light-dark(rgb(0 0 0 / .05), rgb(0 0 0 / .3)), 0 6px 12px light-dark(rgb(0 0 0 / .06), rgb(0 0 0 / .3));--shadow-large: var(--shadow-ring), 0 4px 8px light-dark(rgb(0 0 0 / .06), rgb(0 0 0 / .4)), 0 16px 32px light-dark(rgb(0 0 0 / .1), rgb(0 0 0 / .5));--transition-fast: .12s cubic-bezier(.4, 0, .2, 1);--transition: .2s cubic-bezier(.4, 0, .2, 1);--ease-out: cubic-bezier(.16, 1, .3, 1);--z-dropdown: 50;--z-modal: 200}[data-theme=light]{color-scheme:light}[data-theme=dark]{color-scheme:dark}[data-accent]{--primary-foreground: light-dark(#ffffff, #0a0a0a)}[data-accent=blue]{--primary: light-dark(#2068c9, #7ab3ff);--ring: light-dark(#2068c9, #7ab3ff)}[data-accent=teal]{--primary: light-dark(#0f766e, #5eead4);--ring: light-dark(#0f766e, #5eead4)}[data-accent=green]{--primary: light-dark(#47804a, #8fd47e);--ring: light-dark(#47804a, #8fd47e)}[data-accent=orange]{--primary: light-dark(#c2410c, #ffa14d);--ring: light-dark(#c2410c, #ffa14d)}[data-accent=red]{--primary: light-dark(#c83228, #ff8a76);--ring: light-dark(#c83228, #ff8a76)}[data-accent=wine]{--primary: light-dark(#a83a68, #f9a8d4);--ring: light-dark(#a83a68, #f9a8d4)}[data-accent=navy]{--primary: light-dark(#3b5fa7, #99c2ff);--ring: light-dark(#3b5fa7, #99c2ff)}[data-radius=soft]{--radius-small: .125rem;--radius-medium: .375rem;--radius-large: .75rem;--radius-button: var(--radius-medium);--radius-field: var(--radius-medium)}[data-radius=sharp]{--radius-small: 0;--radius-medium: .125rem;--radius-large: .25rem;--radius-button: var(--radius-medium);--radius-field: var(--radius-medium)}[data-density=compact]{--density: .85}[data-density=comfortable]{--density: 1.18}}@layer animations{@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.animate-pop-in{opacity:1;transform:perspective(1000px) rotateX(0) translateZ(0);transition:opacity .15s cubic-bezier(.4,0,.2,1),transform .15s cubic-bezier(.4,0,.2,1),overlay .15s cubic-bezier(.4,0,.2,1) allow-discrete,display .15s cubic-bezier(.4,0,.2,1) allow-discrete;@starting-style{opacity:0;transform:perspective(1000px) rotateX(-15deg) translateZ(-80px)}&[data-state=closing]{opacity:0;transform:perspective(1000px) rotateX(-15deg) translateZ(-80px)}&[data-state=closing]::backdrop{opacity:0}}dialog::backdrop{opacity:1;transition:opacity .15s cubic-bezier(.4,0,.2,1);@starting-style{opacity:0}}@keyframes teff-enter{0%{opacity:0;translate:0 12px;filter:blur(4px)}}[data-enter]:not([data-enter=stagger]){animation:teff-enter .4s var(--ease-out) backwards}[data-enter=stagger]>*{animation:teff-enter .4s var(--ease-out) backwards}[data-enter=stagger]>:nth-child(2){animation-delay:.1s}[data-enter=stagger]>:nth-child(3){animation-delay:.2s}[data-enter=stagger]>:nth-child(4){animation-delay:.3s}[data-enter=stagger]>:nth-child(5){animation-delay:.4s}[data-enter=stagger]>:nth-child(6){animation-delay:.5s}[data-enter=stagger]>:nth-child(7){animation-delay:.6s}[data-enter=stagger]>:nth-child(n+8){animation-delay:.7s}@keyframes teff-shake{20%{translate:-6px}40%{translate:5px}60%{translate:-3px}80%{translate:2px}}[data-shake]{animation:teff-shake .35s cubic-bezier(.36,.07,.19,.97)}.animate-slide-in{opacity:1;transform:translate(0);transition:opacity .15s cubic-bezier(.16,1,.3,1),transform .15s cubic-bezier(.16,1,.3,1);@starting-style{opacity:0;transform:translate(100%)}&[data-state=closing]{opacity:0;transform:translate(100%)}}}@layer components{figure[data-variant=avatar]:not([role=group]){display:inline-flex;align-items:center;justify-content:center;width:var(--sz, 2.5rem);height:var(--sz, 2.5rem);color:var(--primary);background-color:var(--muted);border-radius:var(--radius-full);font-weight:var(--font-medium);overflow:hidden;box-shadow:inset 0 0 0 1px light-dark(rgb(0 0 0 / .1),rgb(255 255 255 / .1));>img{width:100%;height:100%;object-fit:cover}&.small{--sz: 2rem}&.large{--sz: 3.25rem}}figure[data-variant=avatar][role=group]{display:inline-flex;align-items:center;margin:0;& figure[data-variant=avatar]{isolation:isolate;margin-inline-end:calc(var(--space-5) * -1);border:2px solid var(--background);&:last-child{margin-inline-end:0}}&.small{--sz: 2rem;& figure[data-variant=avatar]{margin-inline-end:calc(var(--space-4) * -.8);border-width:1px}}&.large{--sz: 3.25rem;& figure[data-variant=avatar]{margin-inline-end:calc(var(--space-6) * -1)}}}}@layer base{:is(button,[type=submit],[type=reset],[type=button],a.button),::file-selector-button{--_hov: color-mix(in srgb, var(--primary), var(--background) 16%);--_px: var(--space-5);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:2.5rem;max-width:100%;padding:var(--space-2) var(--_px);font-size:var(--text-7);font-weight:var(--font-medium);line-height:var(--leading-normal);white-space:nowrap;text-decoration:none;background-color:var(--primary);color:var(--primary-foreground);border-radius:var(--radius-button);border:1px solid transparent;box-shadow:var(--shadow-small),inset 0 1px 0 light-dark(rgb(255 255 255 / .12),rgb(255 255 255 / 0));transition-property:background-color,border-color,box-shadow,scale;transition-duration:.12s;transition-timing-function:cubic-bezier(.4,0,.2,1);&:not(:disabled){cursor:pointer}&:hover:not(:disabled){background-color:var(--_hov)}&:active:not(:disabled){scale:.96}& svg{display:block;width:1.2em;height:1.2em;flex-shrink:0}&:has(>svg:first-child):not(.icon){padding-inline-start:calc(var(--_px) - 2px)}&:has(>svg:last-child):not(.icon){padding-inline-end:calc(var(--_px) - 2px)}>.truncate{min-width:0}&[data-variant=secondary]{--_hov: color-mix(in srgb, var(--secondary), var(--secondary-foreground) 7%);background-color:var(--secondary);color:var(--secondary-foreground);box-shadow:none}&[data-variant=danger]{--_hov: color-mix(in srgb, var(--danger), var(--background) 16%);background-color:var(--danger);color:var(--danger-foreground)}&:is(.outline,.ghost){--_hov: var(--accent);background-color:transparent;color:var(--foreground);box-shadow:none;&[data-variant=danger]{--_hov: color-mix(in srgb, var(--danger), transparent 90%);color:var(--danger)}&[data-variant=secondary]{--_hov: color-mix(in srgb, var(--secondary), transparent 80%);color:var(--secondary-foreground)}}&.outline{border-color:var(--input);&[data-variant=danger]{border-color:var(--danger)}&[data-variant=secondary]{border-color:var(--secondary)}}&.ghost{border-color:transparent}&.small{--_px: var(--space-4);min-height:2rem;padding-block:var(--space-1);font-size:var(--text-8)}&.large{--_px: var(--space-6);min-height:3rem;padding-block:0;font-size:var(--text-regular)}&.icon{width:2.5rem;padding:0;&.small{width:2rem}&.large{width:3rem}}}::file-selector-button{background-color:transparent;color:var(--foreground);border:1px solid var(--input);box-shadow:none}::file-selector-button:hover{background-color:var(--accent)}}@layer components{menu.buttons{list-style-type:none;padding-inline-start:0;display:inline-flex;>li{&:first-child>*{border-start-start-radius:var(--radius-button);border-end-start-radius:var(--radius-button)}&:last-child>*{border-start-end-radius:var(--radius-button);border-end-end-radius:var(--radius-button)}>*{border-radius:0}&:not(:last-child)>*{border-inline-end:1px solid rgb(from var(--secondary-foreground) r g b / .15)}}}}@layer base{label{display:block;font-size:var(--text-7);font-weight:var(--font-medium);&:has(input:where([type=checkbox],[type=radio])){display:inline-flex;align-items:center;gap:var(--space-2);row-gap:0;font-weight:var(--font-normal)}}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color]),textarea,select){width:100%;margin-block-start:var(--space-1);padding-inline:var(--space-4);padding-block:calc(var(--space-2) - 1px) calc(var(--space-2) + 1px);font-size:var(--text-7);line-height:var(--leading-normal);background-color:var(--background);color:var(--foreground);border:1px solid var(--input);border-radius:var(--radius-field);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);&::placeholder{color:var(--muted-foreground)}&:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px rgb(from var(--ring) r g b / .35);z-index:1}&:disabled{background-color:var(--muted)}&:is([aria-invalid=true],:user-invalid){border-color:var(--danger);&:focus{box-shadow:0 0 0 3px rgb(from var(--danger) r g b / .35)}}}textarea{height:auto;min-height:5rem;padding:var(--space-3) var(--space-4);border-radius:var(--radius-large);resize:vertical}input[type=search]{appearance:none}input[type=search]::-webkit-search-cancel-button{display:none}input[type=file]{width:100%;margin-block-start:var(--space-1);font-size:var(--text-7);color:var(--muted-foreground)}input[type=file]::file-selector-button{margin-inline-end:var(--space-3)}output{font-weight:var(--font-medium);font-variant-numeric:tabular-nums}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;padding-inline-end:var(--space-8)}input:where([type=checkbox],[type=radio]){appearance:none;width:1.125rem;height:1.125rem;margin:0;position:relative;background-color:var(--background);border:1px solid var(--input);transition:background-color var(--transition-fast),border-color var(--transition-fast);&:checked{background-color:var(--primary);border-color:var(--primary);&:after{content:"";position:absolute;inset:0;background-color:var(--primary-foreground);mask-position:center;mask-repeat:no-repeat;mask-size:100%}}}input[type=checkbox]{border-radius:calc(var(--radius-small) * .75);&:checked:after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='4'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}&[role=switch]{--switch-height: calc(var(--bar-height) * 3);--switch-inset: 2px;--switch-thumb: calc(var(--switch-height) - var(--switch-inset) * 3);width:calc(var(--switch-height) * 2);height:var(--switch-height);border-radius:var(--radius-full);background-color:var(--input);border-color:transparent;&:before{content:"";position:absolute;top:50%;left:var(--switch-inset);transform:translateY(-50%);width:var(--switch-thumb);height:var(--switch-thumb);background-color:var(--background);border-radius:var(--radius-full);transition:transform var(--transition);box-shadow:0 1px 2px #0003}&:checked{background-color:var(--primary);&:after{content:none}&:before{transform:translateY(-50%) translate(var(--switch-height))}}}}input[type=radio]{border-radius:var(--radius-full);&:checked:after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='4' fill='currentColor'/%3E%3C/svg%3E")}}:where(input:where([type=checkbox],[type=radio],[type=range]),select):not(:disabled),label:has(input:where([type=checkbox],[type=radio]):not(:disabled)){cursor:pointer}input[type=range]{width:100%;height:var(--bar-height);appearance:none;background:var(--muted);border-radius:var(--radius-full);&::-webkit-slider-thumb{appearance:none;width:1.25rem;height:1.25rem;background:var(--primary);border-radius:var(--radius-full);transition:transform var(--transition-fast);&:hover{transform:scale(1.1)}}&::-moz-range-thumb{width:1.25rem;height:1.25rem;background:var(--primary);border:none;border-radius:var(--radius-full)}}fieldset{border:1px solid var(--border);border-radius:var(--radius-large);padding:var(--space-4);margin-block-end:var(--space-4)}legend{font-size:var(--text-7);font-weight:var(--font-medium);padding:0 var(--space-2)}}@layer components{[data-password]{position:relative;display:block;margin-block-start:var(--space-1);>input{margin-block-start:0;padding-inline-end:var(--space-10)}>button{position:absolute;inset-inline-end:var(--space-1);inset-block:0;margin-block:auto;width:2rem;height:2rem;min-height:0;padding:0;display:grid;place-items:center;background:none;border:none;box-shadow:none;border-radius:var(--radius-full);color:var(--muted-foreground);&:hover:not(:disabled){background-color:var(--accent);color:var(--foreground)}&:before{content:"";position:absolute;inset:-4px;border-radius:inherit}& svg{grid-area:1 / 1;width:1.15rem;height:1.15rem;transition:opacity .2s cubic-bezier(.2,0,0,1),scale .2s cubic-bezier(.2,0,0,1),filter .2s cubic-bezier(.2,0,0,1)}& svg.off{opacity:0;scale:.25;filter:blur(4px)}&[aria-pressed=true]{& svg.off{opacity:1;scale:1;filter:blur(0)}& svg:not(.off){opacity:0;scale:.25;filter:blur(4px)}}}}fieldset.group{display:flex;align-items:stretch;border:none;padding:0;margin:0;>:is(input,textarea,select){flex:1;margin-block-start:0;&:not(:focus):not(:last-child){border-inline-end-color:transparent}}>:is(input,textarea,select,button){border-radius:0;&:first-child{border-radius:var(--radius-field) 0 0 var(--radius-field)}&:last-child{border-radius:0 var(--radius-field) var(--radius-field) 0}}>legend{float:inline-start;display:inline-flex;align-items:center;padding:0 var(--space-4);line-height:var(--leading-normal);font-weight:var(--font-normal);color:var(--muted-foreground);background-color:var(--muted);border:1px solid var(--input);border-inline-end:none;border-radius:var(--radius-field) 0 0 var(--radius-field)}}[data-field]{margin-block-end:var(--space-4);flex-wrap:wrap;[data-hint],.error{font-size:var(--text-8);font-weight:var(--font-normal);color:var(--muted-foreground);margin-block-start:var(--space-1);margin-inline-start:var(--space-4);display:block;flex-basis:100%;min-inline-size:100%}.error{display:none}&[data-field=error] .error{display:block;color:var(--danger)}}}@layer base{.table{min-width:320px;width:100%;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:var(--text-7)}caption{padding-block-end:var(--space-3);text-align:start;font-weight:var(--font-medium)}thead{border-bottom:1px solid var(--border)}th,td{overflow-wrap:break-word}th{padding:var(--space-3) var(--space-2);text-align:start;font-weight:var(--font-medium);color:var(--muted-foreground)}td{padding:var(--space-3) var(--space-2);font-variant-numeric:tabular-nums}tbody tr{border-bottom:1px solid var(--border);transition:background-color var(--transition-fast);&:last-child{border-bottom:none}&:hover{background-color:rgb(from var(--muted) r g b / .5)}}tfoot{border-top:1px solid var(--border);:is(th,td){font-weight:var(--font-medium)}}}@layer base{progress{appearance:none;width:100%;height:var(--bar-height);border:none;border-radius:var(--radius-full);overflow:hidden;background-color:var(--muted);&::-webkit-progress-bar{background-color:var(--muted);border-radius:var(--radius-full)}&::-webkit-progress-value{background-color:var(--primary);border-radius:var(--radius-full);transition:width var(--transition)}&::-moz-progress-bar{background-color:var(--primary);border-radius:var(--radius-full)}}meter{appearance:none;width:100%;height:var(--bar-height);border:none;border-radius:var(--radius-full);overflow:hidden;background:var(--muted);&::-webkit-meter-bar{background:var(--muted);border:none;border-radius:var(--radius-full);height:var(--bar-height)}&::-webkit-meter-optimum-value,&::-webkit-meter-suboptimum-value,&::-webkit-meter-even-less-good-value{border-radius:var(--radius-full)}&::-webkit-meter-optimum-value{background:var(--success)}&::-webkit-meter-suboptimum-value{background:var(--warning)}&::-webkit-meter-even-less-good-value{background:var(--danger)}&::-moz-meter-bar{background:var(--success);border-radius:var(--radius-full)}&:-moz-meter-sub-optimum::-moz-meter-bar{background:var(--warning)}&:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:var(--danger)}}}@layer components{[aria-busy=true]{&:before{content:"";display:inline-block;inset:0;margin:auto;width:1.5rem;height:1.5rem;border:2px solid var(--muted);border-top-color:var(--primary);border-radius:var(--radius-full);animation:spin 1s linear infinite;text-align:center}&[data-spinner~=small]:before{width:1rem;height:1rem}&[data-spinner~=large]:before{width:2rem;height:2rem;border-width:3px}&[data-spinner~=overlay]{position:relative;>*{opacity:.3;pointer-events:none}&:before{position:absolute;inset:0;margin:auto;z-index:1}}}@keyframes spin{to{transform:rotate(360deg)}}}@layer components{:root{--grid-cols: 12;--grid-gap: var(--space-6);--container-max: 1280px;--container-pad: var(--space-4)}.autogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--autogrid-min, 14rem),100%),1fr));gap:var(--grid-gap)}.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad)}.row{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--grid-gap);width:100%}.row>:is(.col,[class*=col-]){grid-column-end:span calc(var(--span, var(--grid-cols)) + var(--offset, 0))}.col-1{--span: 1}.col-2{--span: 2}.col-3{--span: 3}.col-4{--span: 4}.col-5{--span: 5}.col-6{--span: 6}.col-7{--span: 7}.col-8{--span: 8}.col-9{--span: 9}.col-10{--span: 10}.col-11{--span: 11}.col-12{--span: 12}.offset-1{--offset: 1}.offset-2{--offset: 2}.offset-3{--offset: 3}.offset-4{--offset: 4}.offset-5{--offset: 5}.offset-6{--offset: 6}.row>[class*=offset-]{margin-inline-start:calc(var(--offset) * (100% + var(--grid-gap)) / (var(--span) + var(--offset)))}.row>.col-end{grid-column-start:span var(--span, 1);grid-column-end:-1}@media(max-width:768px){.row{--grid-cols: 4;--grid-gap: var(--space-4)}.row>:is(.col,[class*=col-]){--span: 4}.row>[class*=offset-]{--offset: 0;margin-inline-start:0}}}@layer components{.card{background-color:var(--card);color:var(--card-foreground);border-radius:var(--radius-large);box-shadow:var(--shadow-small);padding:var(--space-6)}}@layer components{[role=alert]{position:relative;display:flex;gap:var(--space-3);padding:var(--space-4) var(--space-5);background-color:var(--background);border:1px solid var(--border);border-radius:var(--radius-large);font-size:var(--text-7);&[data-variant]{border:none}&[data-variant=error],&[data-variant=danger]{color:var(--danger);background-color:light-dark(color-mix(in srgb,var(--danger) 8%,transparent),color-mix(in srgb,var(--danger) 20%,transparent));& a{color:var(--danger)}}&[data-variant=success]{color:var(--success);background-color:light-dark(color-mix(in srgb,var(--success) 8%,transparent),color-mix(in srgb,var(--success) 20%,transparent));& a{color:var(--success)}}&[data-variant=warning]{color:var(--warning);background-color:light-dark(color-mix(in srgb,var(--warning) 8%,transparent),color-mix(in srgb,var(--warning) 20%,transparent));& a{color:var(--warning)}}}}@layer components{.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:calc(var(--space-1) / 2) var(--space-3);font-size:var(--text-8);font-weight:var(--font-medium);line-height:var(--leading-normal);background-color:var(--primary);color:var(--primary-foreground);border-radius:var(--radius-full);&.outline{background-color:transparent;color:var(--foreground);box-shadow:inset 0 0 0 1px var(--input)}&[data-variant=secondary]{background-color:var(--secondary);color:var(--secondary-foreground)}&[data-variant=success]{color:var(--success);background-color:light-dark(color-mix(in srgb,var(--success) 10%,transparent),color-mix(in srgb,var(--success) 30%,transparent))}&[data-variant=warning]{color:var(--warning);background-color:light-dark(color-mix(in srgb,var(--warning) 10%,transparent),color-mix(in srgb,var(--warning) 30%,transparent))}&[data-variant=danger]{color:var(--danger);background-color:light-dark(color-mix(in srgb,var(--danger) 10%,transparent),color-mix(in srgb,var(--danger) 30%,transparent))}}}@layer components{details{border:1px solid var(--border);border-radius:var(--radius-medium);overflow:hidden;+details{margin-top:-1px;border-start-start-radius:0;border-start-end-radius:0}&:has(+details){border-end-start-radius:0;border-end-end-radius:0}&[open] summary{border-bottom:1px solid var(--border)}}summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--space-4);font-weight:var(--font-medium);cursor:pointer;user-select:none;transition:background-color var(--transition-fast);&:hover{background-color:var(--muted)}&::-webkit-details-marker,&::marker{display:none}&:after{content:"";width:1em;height:1em;flex-shrink:0;background-color:currentColor;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");mask-size:contain;mask-repeat:no-repeat;transition:transform var(--transition-fast)}details[open] &:after{transform:rotate(180deg)}}details>*:not(summary){margin:var(--space-4)}}@layer components{[role=tablist]{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1);max-width:100%;overflow-x:auto;background-color:var(--muted);border-radius:var(--radius-button)}[role=tab]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:2rem;padding:var(--space-1) var(--space-4);font-size:var(--text-7);font-weight:var(--font-medium);white-space:nowrap;background-color:transparent;color:var(--muted-foreground);border:none;border-radius:var(--radius-button);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast);& svg{display:block;width:1.15em;height:1.15em;flex-shrink:0}&:hover:not([aria-selected=true]){color:var(--foreground)}&[aria-selected=true]{background-color:light-dark(var(--background),#3d3d3d);color:var(--foreground);box-shadow:0 1px 2px light-dark(rgb(0 0 0 / .08),rgb(0 0 0 / .3)),0 0 0 1px light-dark(rgb(0 0 0 / .04),rgb(255 255 255 / .06))}}[role=tabpanel]{padding:var(--space-4) 0;&:focus-visible{outline:none}}}@layer components{dialog{position:fixed;inset:0;z-index:var(--z-modal);width:min(100% - 2rem,32rem);max-height:85vh;max-height:85dvh;margin:auto;padding:0;background-color:var(--card);border:none;border-radius:var(--radius-large);box-shadow:var(--shadow-large);overflow:hidden;opacity:0;transform:scale(.96) translateY(.5rem);transition:opacity .2s var(--ease-out),transform .2s var(--ease-out),overlay .2s var(--ease-out) allow-discrete,display .2s var(--ease-out) allow-discrete;&:is([open],:popover-open){opacity:1;transform:scale(1) translateY(0)}@starting-style{&:is([open],:popover-open){opacity:0;transform:scale(.96) translateY(.5rem)}}&::backdrop{background-color:#0000;backdrop-filter:blur(0px);transition:background-color .2s var(--ease-out),backdrop-filter .2s var(--ease-out),overlay .2s var(--ease-out) allow-discrete,display .2s var(--ease-out) allow-discrete}&:is([open],:popover-open)::backdrop{background-color:#0006;backdrop-filter:blur(4px)}@starting-style{&:is([open],:popover-open)::backdrop{background-color:#0000;backdrop-filter:blur(0px)}}>header,>form>header{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-6);padding-block-end:0;>h1,>h2,>h3,>h4,>h5,>h6{margin-block-end:0}>p{font-size:var(--text-7);color:var(--muted-foreground);margin-block-end:0}}>p,>div,>section,>form>p,>form>div,>form>section{padding:var(--space-6);overflow-y:auto}>footer,>form>footer{display:flex;justify-content:flex-end;gap:var(--space-2);padding:var(--space-6);padding-block-start:0}}}@layer components{teff-dropdown{[popover]{position:fixed;margin:0;padding:var(--space-2);min-width:12rem;background-color:var(--card);border:none;border-radius:var(--radius-large);box-shadow:var(--shadow-medium);transform-origin:top;opacity:0;transform:translateY(-4px) scale(.97);transition:opacity .15s var(--ease-out),transform .15s var(--ease-out),display .15s allow-discrete,overlay .15s allow-discrete;&:popover-open{opacity:1;transform:translateY(0) scale(1)}@starting-style{&:popover-open{opacity:0;transform:translateY(-4px) scale(.97)}}hr{margin:var(--space-2) calc(var(--space-2) * -1)}}[role=menuitem]{display:flex;align-items:center;justify-content:start;gap:var(--space-2);width:100%;min-height:2.25rem;padding:var(--space-2) var(--space-3);font-size:var(--text-7);font-weight:var(--font-normal);text-align:start;color:var(--foreground);background:none;border:none;border-radius:var(--radius-medium);box-shadow:none;cursor:pointer;transition:background-color var(--transition-fast);&:hover,&:focus{background-color:var(--accent);outline:none}&[data-variant=danger]{color:var(--danger);&:hover,&:focus{background-color:color-mix(in srgb,var(--danger) 10%,transparent)}}}}}@layer components{.toast-container{position:fixed;display:flex;flex-direction:column;pointer-events:none;margin:0;padding:0;border:none;background:transparent;overflow:visible;&::backdrop{display:none}&[data-placement=top-left]{inset:var(--space-4) auto auto var(--space-4)}&[data-placement=top-center]{inset:var(--space-4) auto auto 50%;transform:translate(-50%)}&[data-placement=top-right]{inset:var(--space-4) var(--space-4) auto auto}&[data-placement=bottom-left]{inset:auto auto var(--space-4) var(--space-4);flex-direction:column-reverse}&[data-placement=bottom-center]{inset:auto auto var(--space-4) 50%;transform:translate(-50%);flex-direction:column-reverse}&[data-placement=bottom-right]{inset:auto var(--space-4) var(--space-4) auto;flex-direction:column-reverse}}.toast{--transition: .3s;--transition-in: calc(var(--transition) - 50ms);padding:var(--space-4) var(--space-5);max-width:min(28rem,calc(100vw - var(--space-8)));min-width:min(20rem,calc(100vw - var(--space-8)));pointer-events:auto;background-color:var(--card);border-radius:var(--radius-large);box-shadow:var(--shadow-large);transition:opacity var(--transition-in),transform var(--transition-in),filter var(--transition-in),margin var(--transition-in);line-height:var(--leading-normal);font-size:var(--text-7);.toast-title{display:flex;align-items:center;gap:var(--space-2);font-weight:var(--font-semibold);margin:0 0 var(--space-1) 0;&:before{content:"";width:.5rem;height:.5rem;flex-shrink:0;border-radius:var(--radius-full);background-color:currentColor}}.toast-message{color:var(--muted-foreground)}&[data-variant=success] .toast-title{color:var(--success)}&[data-variant=danger] .toast-title{color:var(--danger)}&[data-variant=warning] .toast-title{color:var(--warning)}>[data-close]{margin-inline-start:auto;background:none;border:none;padding:0;cursor:pointer;opacity:.5;&:hover{opacity:1}}margin:var(--space-2) 0;&[data-entering]{opacity:0;transform:translateY(-.75rem);filter:blur(4px)}&[data-exiting]{opacity:0;margin:0;padding-block:0;max-height:0;overflow:hidden;transform:translateY(-.75rem);filter:blur(4px);transition:opacity var(--transition),margin var(--transition),padding var(--transition),max-height var(--transition),transform var(--transition),filter var(--transition)}}}@layer components{nav[data-breadcrumbs]{font-size:var(--text-7);ol,ul{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);list-style:none;padding:0;margin:0}li{display:inline-flex;align-items:center;gap:var(--space-1);margin:0;color:var(--muted-foreground);+li:before{content:"";width:.9em;height:.9em;flex-shrink:0;background-color:var(--faint-foreground);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");mask-size:contain;mask-repeat:no-repeat}&[aria-current]{color:var(--foreground);font-weight:var(--font-medium)}}a{color:var(--muted-foreground);text-decoration:none;border-radius:var(--radius-small);transition:color var(--transition-fast);&:hover{color:var(--foreground)}}}nav[data-menu]{ul,menu{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);list-style:none;padding:0;margin:0}li{margin:0}a{display:inline-flex;align-items:center;gap:var(--space-2);min-height:2.25rem;padding:var(--space-1) var(--space-4);font-size:var(--text-7);color:var(--muted-foreground);text-decoration:none;border-radius:var(--radius-button);transition:background-color var(--transition-fast),color var(--transition-fast);&:hover{background-color:var(--accent);color:var(--foreground)}&[aria-current]{background-color:var(--accent);color:var(--foreground);font-weight:var(--font-medium)}& svg{display:block;width:1.15em;height:1.15em;flex-shrink:0}}}}@layer components{[data-sidebar-layout]{display:grid;grid-template-columns:14rem 1fr;grid-template-rows:auto 1fr;height:100dvh;>main{grid-row:2;min-width:0;overflow-y:auto}>aside[data-sidebar]{grid-row:2;min-height:0;z-index:1;background-color:var(--background);border-inline-end:1px solid var(--border);display:flex;flex-direction:column;>:is(header,footer){flex-shrink:0;padding:var(--space-3)}>footer{margin-block-start:auto}>nav{flex:1;min-height:0;overflow-y:auto;padding:var(--space-3) var(--space-2);font-size:var(--text-7);:is(h2,h3,h4,h5,h6,[data-nav-label]){font-size:var(--text-8);font-weight:var(--font-semibold);letter-spacing:.05em;text-transform:uppercase;color:var(--faint-foreground);margin:var(--space-4) var(--space-4) var(--space-1)}ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-1);li{margin:0}}a{display:flex;align-items:center;gap:var(--space-2);min-height:2.25rem;padding:var(--space-1) var(--space-4);color:var(--muted-foreground);text-decoration:none;border-radius:var(--radius-button);transition:background-color var(--transition-fast),color var(--transition-fast);&:is(:hover,[aria-current]){background-color:var(--accent);color:var(--foreground)}&[aria-current]{font-weight:var(--font-medium)}& svg{display:block;width:1.15em;height:1.15em;flex-shrink:0}}details{border:none;overflow:visible;+details{margin-top:0}&[open] summary{border-bottom:none}>ul{margin-inline-start:var(--space-4);padding:var(--space-1) 0}}summary{justify-content:flex-start;padding:var(--space-2) var(--space-4);border-radius:var(--radius-button);&:after{width:.75rem;height:.75rem;margin-inline-start:auto}}}}>nav[data-topnav]{grid-column:1 / -1}}nav[data-topnav]{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);padding:var(--space-2) var(--space-4);background-color:var(--background);border-bottom:1px solid var(--border);a{text-decoration:none}}:is([data-sidebar-toggle],[data-sidebar-header]){display:none}[data-sidebar-toggle]{width:2.5rem;flex-shrink:0;padding:0;background:none;color:var(--foreground);border:none;border-radius:var(--radius-button);box-shadow:none;&:hover:not(:disabled){background-color:var(--accent)}& svg{display:block;width:1.25rem;height:1.25rem;margin:auto}}@media(min-width:769px){[data-sidebar-layout=always]{transition:grid-template-columns var(--transition);[data-sidebar-toggle]{display:inline-block}>aside[data-sidebar]{transform:translate(0);opacity:1;transition:transform var(--transition),opacity var(--transition),visibility var(--transition)}&[data-sidebar-open]{grid-template-columns:0px 1fr;gap:0;>aside[data-sidebar]{overflow:hidden;min-width:0;transform:translate(-100%);opacity:0;visibility:hidden;border-inline-end:none}}}}@media(max-width:768px){[data-sidebar-layout]{grid-template-columns:1fr;>main{grid-column:1}>aside[data-sidebar]{grid-column:1;z-index:2;width:16rem;transform:translate(-100%);visibility:hidden;transition:transform var(--transition),visibility var(--transition);box-shadow:var(--shadow-large)}&[data-sidebar-open]>aside[data-sidebar]{transform:translate(0);visibility:visible}}[data-sidebar-toggle]{display:inline-block}[data-sidebar-header]{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border)}}}@layer components{[role=status].skeleton{--_c: light-dark( color-mix(in srgb, var(--muted) 15%, white), color-mix(in srgb, var(--muted) 90%, var(--foreground)) );position:relative;overflow:hidden;margin-block-end:var(--space-3);background:var(--muted);border-radius:var(--radius-medium);&:after{content:"";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,transparent 0%,var(--_c) 50%,transparent 100%);animation:shimmer 2s infinite}&.box{width:4rem;height:4rem}&.line{height:1rem;width:100%}}[role=status].skeleton:last-child{margin-block-end:0}@keyframes shimmer{to{transform:translate(100%)}}}@layer components{[data-tooltip]{position:relative}[data-tooltip]:after{--_from: translateX(-50%) translateY(4px);--_to: translateX(-50%) translateY(0);content:attr(data-tooltip);display:none;position:absolute;inset-inline-start:50%;inset-block-end:calc(100% + 8px);transform:var(--_from);opacity:0;transition:opacity var(--transition-fast),transform var(--transition-fast),display var(--transition-fast) allow-discrete;pointer-events:none;z-index:calc(var(--z-modal) + 10);padding:var(--space-1) var(--space-3);font-size:var(--text-8);font-weight:var(--font-medium);line-height:var(--leading-normal);white-space:nowrap;background:var(--foreground);color:var(--background);border-radius:var(--radius-full);box-shadow:var(--shadow-medium)}[data-tooltip][data-tooltip-placement=bottom]:after{--_from: translateX(-50%) translateY(-4px);inset-block-start:calc(100% + 8px);inset-block-end:auto}[data-tooltip]:is([data-tooltip-placement=left],[data-tooltip-placement=right]):after{--_to: translateX(0) translateY(-50%);inset-block-start:50%;inset-block-end:auto}[data-tooltip][data-tooltip-placement=left]:after{--_from: translateX(4px) translateY(-50%);inset-inline-start:auto;inset-inline-end:calc(100% + 8px)}[data-tooltip][data-tooltip-placement=right]:after{--_from: translateX(-4px) translateY(-50%);inset-inline-start:calc(100% + 8px)}[data-tooltip]:is(:hover,:focus-visible):after{display:block;opacity:1;transition-delay:.6s;transform:var(--_to);@starting-style{opacity:0;transform:var(--_from)}}}@layer utilities{.align-left{text-align:start}.align-center{text-align:center}.align-right{text-align:end}.text-light{color:var(--muted-foreground)}.text-lighter{color:var(--faint-foreground)}.text-small{font-size:var(--text-7)}.text-xsmall{font-size:var(--text-8)}.font-normal{font-weight:var(--font-normal)}.font-medium{font-weight:var(--font-medium)}.font-semibold{font-weight:var(--font-semibold)}.tabular{font-variant-numeric:tabular-nums}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.grow{flex-grow:1}.shrink-0{flex-shrink:0}.min-w-0{min-width:0}.hstack{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;align-content:flex-start;height:auto;>*{margin:0}}.vstack{display:flex;flex-direction:column;gap:var(--space-3)}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.mt-2{margin-block-start:var(--space-2)}.mt-4{margin-block-start:var(--space-4)}.mt-6{margin-block-start:var(--space-6)}.mt-8{margin-block-start:var(--space-8)}.mb-2{margin-block-end:var(--space-2)}.mb-4{margin-block-end:var(--space-4)}.mb-6{margin-block-end:var(--space-6)}.mb-8{margin-block-end:var(--space-8)}.ms-auto{margin-inline-start:auto}.me-auto{margin-inline-end:auto}.mx-auto{margin-inline:auto}.p-2{padding:var(--space-2)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.w-100{width:100%}.rounded{border-radius:var(--radius-medium)}.rounded-large{border-radius:var(--radius-large)}.rounded-full{border-radius:var(--radius-full)}.shadow-small{box-shadow:var(--shadow-small)}.shadow-medium{box-shadow:var(--shadow-medium)}.shadow-large{box-shadow:var(--shadow-large)}.img-outline{outline:1px solid light-dark(rgb(0 0 0 / .1),rgb(255 255 255 / .1));outline-offset:-1px}:is(ul,ol,a).unstyled{list-style:none;text-decoration:none;padding:0}}
package/teff.min.js ADDED
@@ -0,0 +1 @@
1
+ (()=>{var l=class extends HTMLElement{#t=!1;connectedCallback(){this.#t||(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>this.#e(),{once:!0}):this.#e())}#e(){this.#t||(this.#t=!0,this.init())}disconnectedCallback(){this.cleanup()}cleanup(){}handleEvent(t){let e=this[`on${t.type}`];e&&e.call(this,t)}keyNav(t,e,n,o,s,a=!1){let{key:r}=t,c=-1;return r===s?c=(e+1)%n:r===o?c=(e-1+n)%n:a&&(r==="Home"?c=0:r==="End"&&(c=n-1)),c>=0&&t.preventDefault(),c}emit(t,e=null){return this.dispatchEvent(new CustomEvent(t,{bubbles:!0,composed:!0,cancelable:!0,detail:e}))}$(t){return this.querySelector(t)}$$(t){return Array.from(this.querySelectorAll(t))}uid(){return Math.random().toString(36).slice(2,10)}};"commandForElement"in HTMLButtonElement.prototype||document.addEventListener("click",i=>{let t=i.target.closest("button[commandfor]");if(!t)return;let e=document.getElementById(t.getAttribute("commandfor"));if(!e)return;let n=t.getAttribute("command")||"toggle";e instanceof HTMLDialogElement&&(n==="show-modal"?e.showModal():n==="close"||e.open?e.close():e.showModal())});document.addEventListener("pointerdown",i=>{let t=i.target;if(!(t instanceof HTMLDialogElement)||!t.open||t.hasAttribute("data-static"))return;let e=t.getBoundingClientRect();i.clientX>=e.left&&i.clientX<=e.right&&i.clientY>=e.top&&i.clientY<=e.bottom||(i.preventDefault(),t.close())},{passive:!1});var h=class extends l{#t=[];#e=[];init(){let t=this.$(':scope > [role="tablist"]');if(this.#t=t?[...t.querySelectorAll('[role="tab"]')]:[],this.#e=this.$$(':scope > [role="tabpanel"]'),this.#t.length===0||this.#e.length===0){console.warn("teff-tabs: Missing tab or tabpanel elements");return}this.#t.forEach((n,o)=>{let s=this.#e[o];if(!s)return;let a=n.id||`teff-tab-${this.uid()}`,r=s.id||`teff-panel-${this.uid()}`;n.id=a,s.id=r,n.setAttribute("aria-controls",r),s.setAttribute("aria-labelledby",a)}),t.addEventListener("click",this),t.addEventListener("keydown",this);let e=this.#t.findIndex(n=>n.ariaSelected==="true");this.#i(e>=0?e:0)}onclick(t){let e=this.#t.indexOf(t.target.closest('[role="tab"]'));e>=0&&this.#i(e)}onkeydown(t){if(!t.target.closest('[role="tab"]'))return;let e=this.keyNav(t,this.activeIndex,this.#t.length,"ArrowLeft","ArrowRight");e>=0&&(this.#i(e),this.#t[e].focus())}#i(t){this.#t.forEach((e,n)=>{let o=n===t;e.ariaSelected=String(o),e.tabIndex=o?0:-1}),this.#e.forEach((e,n)=>{e.hidden=n!==t}),this.emit("teff-tab-change",{index:t,tab:this.#t[t]})}get activeIndex(){return this.#t.findIndex(t=>t.ariaSelected==="true")}set activeIndex(t){t>=0&&t<this.#t.length&&this.#i(t)}};customElements.define("teff-tabs",h);var f=class extends l{#t;#e;#i;#n;init(){this.#t=this.$("[popover]"),this.#e=this.$("[popovertarget]"),!(!this.#t||!this.#e)&&(this.#t.addEventListener("toggle",this),this.#t.addEventListener("keydown",this),this.#i=()=>{let t=this.#e.getBoundingClientRect(),e=this.#t.getBoundingClientRect();this.#t.style.top=`${t.bottom+e.height>window.innerHeight?t.top-e.height:t.bottom}px`,this.#t.style.left=`${t.left+e.width>window.innerWidth?t.right-e.width:t.left}px`})}ontoggle(t){t.newState==="open"?(this.#i(),window.addEventListener("scroll",this.#i,!0),window.addEventListener("resize",this.#i),this.#n=this.$$('[role="menuitem"]'),this.#n[0]?.focus(),this.#e.ariaExpanded="true"):(this.cleanup(),this.#n=null,this.#e.ariaExpanded="false",this.#e.focus())}onkeydown(t){if(!t.target.matches('[role="menuitem"]'))return;let e=this.#n.indexOf(t.target),n=this.keyNav(t,e,this.#n.length,"ArrowUp","ArrowDown",!0);n>=0&&this.#n[n].focus()}cleanup(){window.removeEventListener("scroll",this.#i,!0),window.removeEventListener("resize",this.#i)}};customElements.define("teff-dropdown",f);document.addEventListener("DOMContentLoaded",()=>{let i="title",t="[title]",e=n=>{let o=n.getAttribute(i);o&&(n.setAttribute("data-tooltip",o),n.hasAttribute("aria-label")||n.setAttribute("aria-label",o),n.removeAttribute(i))};document.querySelectorAll(t).forEach(e),new MutationObserver(n=>{for(let o of n){e(o.target);for(let s of o.addedNodes)s.nodeType===1&&(e(s),s.querySelectorAll(t).forEach(e))}}).observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[i]})});document.addEventListener("click",i=>{let t=i.target.closest("[data-sidebar-toggle]");if(t){t.closest("[data-sidebar-layout]")?.toggleAttribute("data-sidebar-open");return}if(!i.target.closest("[data-sidebar]")||i.target.closest("[data-sidebar] a[href]")){let e=document.querySelector("[data-sidebar-layout][data-sidebar-open]");e&&window.matchMedia("(max-width: 768px)").matches&&e.removeAttribute("data-sidebar-open")}});var A='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg>',L='<svg class="off" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"/><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"/><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"/><path d="m2 2 20 20"/></svg>',m='input[type="password"]',p=i=>{if(i.hasAttribute("data-static")||i.closest("[data-password], fieldset.group"))return;let t=document.createElement("span");t.setAttribute("data-password",""),i.before(t),t.append(i);let e=document.createElement("button");e.type="button",e.setAttribute("aria-label","Show password"),e.setAttribute("aria-pressed","false"),e.innerHTML=A+L,e.addEventListener("click",()=>{let n=i.type==="password";i.type=n?"text":"password",e.setAttribute("aria-pressed",String(n))}),t.append(e)};document.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll(m).forEach(p),new MutationObserver(i=>{for(let t of i)for(let e of t.addedNodes)e.nodeType===1&&(e.matches?.(m)&&p(e),e.querySelectorAll?.(m).forEach(p))}).observe(document.body,{childList:!0,subtree:!0})});var d={};function x(i){if(!d[i]){let t=document.createElement("div");t.className="toast-container",t.setAttribute("popover","manual"),t.setAttribute("data-placement",i),document.body.appendChild(t),d[i]=t}return d[i]}function g(i,t={}){let{placement:e="top-right",duration:n=4e3}=t,o=x(e);i.classList.add("toast");let s;return i.onmouseenter=()=>clearTimeout(s),i.onmouseleave=()=>{n>0&&(s=setTimeout(()=>b(i,o),n))},i.setAttribute("data-entering",""),o.appendChild(i),o.showPopover(),requestAnimationFrame(()=>{requestAnimationFrame(()=>{i.removeAttribute("data-entering")})}),n>0&&(s=setTimeout(()=>b(i,o),n)),i}function b(i,t){if(i.hasAttribute("data-exiting"))return;i.setAttribute("data-exiting","");let e=()=>{i.remove(),t.children.length||t.hidePopover()};i.addEventListener("transitionend",e,{once:!0});let n=getComputedStyle(i).getPropertyValue("--transition").trim(),o=parseFloat(n),s=n.endsWith("ms")?o:o*1e3;setTimeout(e,s)}function v(i,t,e={}){let{variant:n="info",...o}=e,s=document.createElement("output");if(s.setAttribute("data-variant",n),t){let r=document.createElement("h6");r.className="toast-title",r.textContent=t,s.appendChild(r)}let a=document.createElement("div");return a.className="toast-message",a.textContent=i,s.appendChild(a),g(s,o)}function E(i,t={}){let e;if(i instanceof HTMLTemplateElement?e=i.content.firstElementChild?.cloneNode(!0):i&&(e=i.cloneNode(!0)),!!e)return e.removeAttribute("id"),g(e,t)}function w(i){i&&d[i]?(d[i].innerHTML="",d[i].hidePopover()):Object.values(d).forEach(t=>{t.innerHTML="",t.hidePopover()})}var y=i=>{if(!i)return;i.removeAttribute("data-shake"),i.offsetWidth,i.setAttribute("data-shake","");let t=e=>{e.target===i&&(i.removeAttribute("data-shake"),i.removeEventListener("animationend",t))};i.addEventListener("animationend",t)};var u=window.teff||(window.teff={});u.toast=v;u.toast.el=E;u.toast.clear=w;u.shake=y;})();