@singlebase/elements 0.1.0

package/dist/uploader-eFYKpk8b.cjs

@@ -0,0 +1,1390 @@
+"use strict";var ue=t=>{throw TypeError(t)};var fe=(t,a,e)=>a.has(t)||ue("Cannot "+e);var d=(t,a,e)=>(fe(t,a,"read from private field"),e?e.call(t):a.get(t)),c=(t,a,e)=>a.has(t)?ue("Cannot add the same private member more than once"):a instanceof WeakSet?a.add(t):a.set(t,e),p=(t,a,e,r)=>(fe(t,a,"write to private field"),r?r.call(t,e):a.set(t,e),e);const n=require("lit"),u=require("lit/decorators.js"),Me=require("@singlebase/core"),ne={font:'"Geist", -apple-system, "Segoe UI", Helvetica, sans-serif',mono:'"Geist Mono", ui-monospace, monospace',accent:"#111111",onAccent:"#ffffff",radius:"4px",surface:"#ffffff",surfaceAlt:"#fafafa",ink:"#16181a",mutedInk:"#61666c",border:"#e4e6e9",borderStrong:"#cdd1d6",danger:"#b4231a",dangerBg:"#fdf1f0",dangerBorder:"#f3d6d3",dangerOutline:"#e8c4c0",dangerPanelBorder:"#efd9d6",dangerPanelBg:"#fdf7f6",ok:"#0f6b4a",okBg:"#f0f7f3",okBorder:"#cfe5da",gap:"16px",pad:"20px",fieldPad:"11px 13px"},me=n.css`
+  :host {
+    display: block;
+    box-sizing: border-box;
+    font-family: var(--sb-font, ${n.unsafeCSS(ne.font)});
+    color: var(--sb-ink, ${n.unsafeCSS(ne.ink)});
+  }
+
+  :host([theme="dark"]) {
+    /* The light default accent is near-black, which disappears on a dark
+       surface — primary buttons and links both use it. A host that sets its
+       own --sb-accent still wins: outer-page declarations beat :host rules. */
+    --sb-accent: #f3f4f5;
+    --sb-on-accent: #17181b;
+    --sb-surface: #17181b;
+    --sb-surface-alt: #202226;
+    --sb-ink: #f3f4f5;
+    --sb-muted-ink: #a2a8ae;
+    --sb-border: #2c2f34;
+    --sb-border-strong: #3a3e44;
+    --sb-danger: #f08379;
+    --sb-danger-bg: rgba(240, 131, 121, 0.1);
+    --sb-danger-border: rgba(240, 131, 121, 0.3);
+    --sb-danger-outline: rgba(240, 131, 121, 0.4);
+    --sb-danger-panel-border: rgba(240, 131, 121, 0.3);
+    --sb-danger-panel-bg: rgba(240, 131, 121, 0.06);
+    --sb-ok: #6fd1a6;
+    --sb-ok-bg: rgba(111, 209, 166, 0.1);
+    --sb-ok-border: rgba(111, 209, 166, 0.28);
+  }
+
+  :host([density="compact"]) {
+    --sb-gap: 12px;
+    --sb-pad: 16px;
+    --sb-field-pad: 9px 11px;
+  }
+`,xe=n.css`
+  /* ── layout primitives ───────────────────────────────────── */
+  .stack {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sb-gap, 16px);
+  }
+
+  .fields {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sb-gap, 16px);
+  }
+
+  .head {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .two-up {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: var(--sb-gap, 16px);
+  }
+
+  .actions {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .rule {
+    height: 1px;
+    background: var(--sb-border, #e4e6e9);
+  }
+
+  .between {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 16px;
+  }
+
+  /* ── type ────────────────────────────────────────────────── */
+  .logo-dot {
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 12px;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    color: var(--sb-muted-ink, #61666c);
+    margin-bottom: 6px;
+  }
+
+  .title {
+    margin: 0;
+    font-size: 20px;
+    font-weight: 600;
+    letter-spacing: -0.015em;
+    color: var(--sb-ink, #16181a);
+  }
+
+  .sub {
+    margin: 0;
+    font-size: 13.5px;
+    line-height: 1.5;
+    color: var(--sb-muted-ink, #61666c);
+    text-wrap: pretty;
+  }
+
+  .sec-title {
+    margin: 0;
+    font-size: 14px;
+    font-weight: 600;
+    letter-spacing: -0.01em;
+    color: var(--sb-ink, #16181a);
+  }
+
+  .hint {
+    margin: 0;
+    font-size: 12.5px;
+    line-height: 1.5;
+    color: var(--sb-muted-ink, #61666c);
+    text-wrap: pretty;
+  }
+
+  .sub-label {
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 11px;
+    letter-spacing: 0.07em;
+    text-transform: uppercase;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  /* ── fields ──────────────────────────────────────────────── */
+  .field {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .label-row {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 8px;
+  }
+
+  label,
+  .label {
+    font-size: 12.5px;
+    font-weight: 500;
+    color: var(--sb-muted-ink, #61666c);
+    letter-spacing: 0.01em;
+  }
+
+  input {
+    width: 100%;
+    box-sizing: border-box;
+    font: inherit;
+    font-size: 14px;
+    color: var(--sb-ink, #16181a);
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    border-radius: var(--sb-radius, 4px);
+    padding: var(--sb-field-pad, 11px 13px);
+    outline: none;
+  }
+
+  input:focus {
+    border-color: var(--sb-accent, #111111);
+  }
+
+  input[aria-invalid="true"] {
+    border-color: var(--sb-danger, #b4231a);
+  }
+
+  /* field-style="underline" — code boxes keep their box, they read as cells */
+  :host([field-style="underline"]) *:not(.code-row):not(.code-row-sm) > input {
+    background: transparent;
+    border: none;
+    border-bottom: 1px solid var(--sb-border-strong, #cdd1d6);
+    border-radius: 0;
+    padding: 9px 2px;
+  }
+
+  p.err {
+    margin: 0;
+    font-size: 12.5px;
+    color: var(--sb-danger, #b4231a);
+  }
+
+  /* ── code entry ──────────────────────────────────────────── */
+  .code-row {
+    display: grid;
+    grid-template-columns: repeat(6, 1fr);
+    gap: 8px;
+  }
+
+  .code-row input {
+    text-align: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 18px;
+    padding: 12px 0;
+  }
+
+  .code-row-sm {
+    display: grid;
+    grid-template-columns: repeat(6, 1fr);
+    gap: 6px;
+  }
+
+  .code-row-sm input {
+    text-align: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 14px;
+    padding: 8px 0;
+  }
+
+  .resend-row {
+    display: flex;
+    align-items: baseline;
+    gap: 8px;
+  }
+
+  /* ── buttons ─────────────────────────────────────────────── */
+  button {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    font: inherit;
+    font-size: 13.5px;
+    font-weight: 500;
+    border-radius: var(--sb-radius, 4px);
+    cursor: pointer;
+    padding: 9px 14px;
+    border: 1px solid transparent;
+    transition:
+      background 0.15s,
+      border-color 0.15s,
+      filter 0.15s,
+      color 0.15s;
+  }
+
+  button:disabled {
+    cursor: not-allowed;
+  }
+
+  button.primary {
+    background: var(--sb-accent, #111111);
+    color: var(--sb-on-accent, #ffffff);
+    width: 100%;
+  }
+
+  button.primary:hover:not(:disabled) {
+    filter: brightness(0.92);
+  }
+
+  button.primary-sm {
+    background: var(--sb-accent, #111111);
+    color: var(--sb-on-accent, #ffffff);
+    padding: 7px 12px;
+  }
+
+  button.primary-sm:hover:not(:disabled) {
+    filter: brightness(0.92);
+  }
+
+  button.ghost {
+    background: transparent;
+    color: var(--sb-muted-ink, #61666c);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    width: 100%;
+  }
+
+  button.ghost-sm {
+    background: transparent;
+    color: var(--sb-muted-ink, #61666c);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    padding: 7px 12px;
+  }
+
+  button.ghost:hover:not(:disabled),
+  button.ghost-sm:hover:not(:disabled) {
+    background: var(--sb-surface-alt, #fafafa);
+    color: var(--sb-ink, #16181a);
+  }
+
+  button.secondary {
+    background: var(--sb-surface, #ffffff);
+    color: var(--sb-ink, #16181a);
+    border: 1px solid var(--sb-border-strong, #cdd1d6);
+    padding: 7px 12px;
+  }
+
+  button.secondary:hover:not(:disabled) {
+    background: var(--sb-surface-alt, #fafafa);
+  }
+
+  button.link {
+    font: inherit;
+    font-size: 13px;
+    font-weight: 500;
+    color: var(--sb-accent, #111111);
+    background: none;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    text-decoration: underline;
+    text-underline-offset: 3px;
+  }
+
+  button.link-sm {
+    font: inherit;
+    font-size: 12.5px;
+    font-weight: 400;
+    color: var(--sb-muted-ink, #61666c);
+    background: none;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    text-decoration: underline;
+    text-underline-offset: 3px;
+  }
+
+  /* the mock's editLink: a muted underlined affordance that inks on hover */
+  button.edit-link {
+    align-self: flex-start;
+    font: inherit;
+    font-size: 12.5px;
+    font-weight: 400;
+    color: var(--sb-muted-ink, #61666c);
+    background: none;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    text-decoration: underline;
+    text-underline-offset: 3px;
+    transition: color 0.15s;
+  }
+
+  button.edit-link:hover:not(:disabled) {
+    color: var(--sb-ink, #16181a);
+  }
+
+  button.edit-link:disabled {
+    opacity: 0.4;
+  }
+
+  button.danger-link {
+    align-self: flex-start;
+    font: inherit;
+    font-size: 12.5px;
+    font-weight: 400;
+    color: var(--sb-muted-ink, #61666c);
+    background: none;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    text-decoration: underline;
+    text-underline-offset: 3px;
+    transition: color 0.15s;
+  }
+
+  button.danger-link:hover:not(:disabled) {
+    color: var(--sb-danger, #b4231a);
+  }
+
+  button.danger {
+    padding: 7px 12px;
+    background: transparent;
+    color: var(--sb-danger, #b4231a);
+    border: 1px solid var(--sb-danger-outline, #e8c4c0);
+  }
+
+  button.danger:hover:not(:disabled) {
+    background: var(--sb-danger-bg, #fdf1f0);
+  }
+
+  button.danger:disabled {
+    opacity: 0.45;
+  }
+
+  .btn-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-wrap: wrap;
+  }
+
+  .btn-row-end {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 12px;
+    flex-wrap: wrap;
+  }
+
+  .edit-actions {
+    display: flex;
+    gap: 8px;
+    padding-top: 2px;
+  }
+
+  /* ── feedback ────────────────────────────────────────────── */
+  .banner,
+  .notice {
+    font-size: 13px;
+    line-height: 1.45;
+    border-radius: var(--sb-radius, 4px);
+    padding: 10px 12px;
+  }
+
+  .banner {
+    color: var(--sb-danger, #b4231a);
+    background: var(--sb-danger-bg, #fdf1f0);
+    border: 1px solid var(--sb-danger-border, #f3d6d3);
+  }
+
+  .notice {
+    color: var(--sb-ok, #0f6b4a);
+    background: var(--sb-ok-bg, #f0f7f3);
+    border: 1px solid var(--sb-ok-border, #cfe5da);
+  }
+
+  .saved-note {
+    font-size: 12.5px;
+    font-weight: 500;
+    color: var(--sb-ok, #0f6b4a);
+  }
+
+  .spinner {
+    width: 13px;
+    height: 13px;
+    border: 2px solid rgba(255, 255, 255, 0.4);
+    border-top-color: var(--sb-on-accent, #ffffff);
+    border-radius: 50%;
+    animation: sb-spin 0.7s linear infinite;
+  }
+
+  @keyframes sb-spin {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  .sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip: rect(0 0 0 0);
+    white-space: nowrap;
+  }
+
+  /* ── step bar ────────────────────────────────────────────── */
+  .step-bar {
+    height: 3px;
+    background: var(--sb-border, #e4e6e9);
+    border-radius: 99px;
+    overflow: hidden;
+  }
+
+  .step-fill {
+    height: 100%;
+    background: var(--sb-accent, #111111);
+    transition: width 0.3s;
+  }
+
+  /* ── footer link row ─────────────────────────────────────── */
+  .foot {
+    margin: 0;
+    display: flex;
+    gap: 6px;
+    justify-content: center;
+    font-size: 13px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  /* ── oauth ───────────────────────────────────────────────── */
+  .oauth-primary {
+    background: var(--sb-surface, #ffffff);
+    color: var(--sb-ink, #16181a);
+    border: 1px solid var(--sb-border-strong, #cdd1d6);
+    width: 100%;
+  }
+
+  .oauth-primary:hover:not(:disabled) {
+    background: var(--sb-surface-alt, #fafafa);
+  }
+
+  .g-mark {
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-weight: 500;
+    font-size: 13px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .icon-row {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 8px;
+  }
+
+  .icon-btn {
+    padding: 7px 0;
+    background: var(--sb-surface, #ffffff);
+    color: var(--sb-muted-ink, #61666c);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 13px;
+  }
+
+  .icon-btn:hover:not(:disabled) {
+    background: var(--sb-surface-alt, #fafafa);
+    color: var(--sb-ink, #16181a);
+  }
+
+  /* ── accordion (method picker) ───────────────────────────── */
+  .acc-wrap {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .acc-item {
+    border: 1px solid var(--sb-border, #e4e6e9);
+    border-radius: var(--sb-radius, 4px);
+    overflow: hidden;
+    background: transparent;
+    transition:
+      border-color 0.2s,
+      background 0.2s;
+  }
+
+  .acc-item.open {
+    border-color: var(--sb-border-strong, #cdd1d6);
+    background: var(--sb-surface, #ffffff);
+  }
+
+  .acc-item.bare {
+    border: none;
+    background: transparent;
+  }
+
+  .acc-head {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    width: 100%;
+    box-sizing: border-box;
+    font: inherit;
+    text-align: left;
+    background: transparent;
+    border: none;
+    border-radius: 0;
+    padding: 11px 12px;
+    cursor: pointer;
+    color: var(--sb-ink, #16181a);
+    transition: background 0.15s;
+  }
+
+  .acc-head:hover {
+    background: var(--sb-surface-alt, #fafafa);
+  }
+
+  .chev {
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 13px;
+    color: var(--sb-muted-ink, #61666c);
+    line-height: 1;
+    transform: rotate(0deg);
+    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .acc-item.open .chev {
+    transform: rotate(90deg);
+  }
+
+  .acc-title {
+    font-size: 13.5px;
+    font-weight: 500;
+    color: var(--sb-ink, #16181a);
+    letter-spacing: -0.005em;
+  }
+
+  .acc-meta {
+    font-size: 12px;
+    color: var(--sb-muted-ink, #61666c);
+    margin-left: auto;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .acc-body {
+    display: grid;
+    grid-template-rows: 0fr;
+    opacity: 0;
+    transition:
+      grid-template-rows 0.28s cubic-bezier(0.32, 0.72, 0, 1),
+      opacity 0.16s ease;
+  }
+
+  .acc-item.open .acc-body {
+    grid-template-rows: 1fr;
+    opacity: 1;
+    transition:
+      grid-template-rows 0.34s cubic-bezier(0.32, 0.72, 0, 1),
+      opacity 0.26s ease 0.06s;
+  }
+
+  .acc-clip {
+    overflow: hidden;
+    min-height: 0;
+  }
+
+  .acc-inner {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sb-gap, 16px);
+    padding: 2px 12px 14px;
+    transform: translateY(-4px);
+    transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
+  }
+
+  .acc-item.open .acc-inner {
+    transform: translateY(0);
+  }
+
+  .acc-item.bare .acc-inner {
+    padding: 0;
+  }
+
+  /* ── invite ──────────────────────────────────────────────── */
+  .invite-box {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    padding: 10px 12px;
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    border-radius: var(--sb-radius, 4px);
+  }
+
+  .invite-label {
+    font-size: 11.5px;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .invite-email {
+    font-size: 14px;
+    color: var(--sb-ink, #16181a);
+  }
+
+  /* ── account ─────────────────────────────────────────────── */
+  .acct-root {
+    display: flex;
+    flex-direction: column;
+    gap: 22px;
+    width: 100%;
+  }
+
+  .acct-nav {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 16px;
+    padding-bottom: 18px;
+    border-bottom: 1px solid var(--sb-border, #e4e6e9);
+  }
+
+  .acct-who {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+  }
+
+  .avatar-col {
+    flex: 0 0 auto;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 6px;
+  }
+
+  .avatar {
+    flex: 0 0 auto;
+    width: 42px;
+    height: 42px;
+    border-radius: 50%;
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px dashed var(--sb-border, #e4e6e9);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 13px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .avatar.has-photo {
+    border-style: solid;
+    overflow: hidden;
+  }
+  .avatar img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .avatar-lg {
+    width: 56px;
+    height: 56px;
+    border-radius: 50%;
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px dashed var(--sb-border-strong, #cdd1d6);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 13px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .avatar-row {
+    display: flex;
+    align-items: center;
+    gap: 14px;
+  }
+
+  .avatar-actions {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .acct-who-text {
+    min-width: 0;
+  }
+
+  .acct-name {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--sb-ink, #16181a);
+    letter-spacing: -0.01em;
+  }
+
+  .acct-email {
+    font-size: 12.5px;
+    color: var(--sb-muted-ink, #61666c);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .acct-body {
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 22px;
+  }
+
+  .section {
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .sum-list {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .sum-row {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 16px;
+    padding: 15px 0;
+    border-bottom: 1px solid var(--sb-border, #e4e6e9);
+  }
+
+  .sum-label {
+    flex: 0 0 auto;
+    font-size: 12.5px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .sum-value {
+    min-width: 0;
+    font-size: 13.5px;
+    color: var(--sb-ink, #16181a);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .edit-card {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sb-gap, 16px);
+    padding: 14px;
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    border-radius: var(--sb-radius, 4px);
+  }
+
+  /* 2FA switch */
+  .switch {
+    flex: 0 0 auto;
+    width: 42px;
+    height: 24px;
+    border-radius: 99px;
+    border: 1px solid var(--sb-border-strong, #cdd1d6);
+    background: var(--sb-surface-alt, #fafafa);
+    cursor: pointer;
+    padding: 2px;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    transition:
+      background 0.15s,
+      border-color 0.15s;
+  }
+
+  .switch[aria-pressed="true"] {
+    border-color: var(--sb-accent, #111111);
+    background: var(--sb-accent, #111111);
+    justify-content: flex-end;
+  }
+
+  .knob {
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: var(--sb-muted-ink, #61666c);
+    display: block;
+  }
+
+  .switch[aria-pressed="true"] .knob {
+    background: var(--sb-on-accent, #ffffff);
+  }
+
+  .qr-row {
+    display: flex;
+    gap: 14px;
+    align-items: flex-start;
+  }
+
+  .qr-box {
+    flex: 0 0 auto;
+    width: 74px;
+    height: 74px;
+    border-radius: var(--sb-radius, 4px);
+    background: var(--sb-surface-alt, #fafafa);
+    border: 1px dashed var(--sb-border-strong, #cdd1d6);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 12px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .qr-text {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    min-width: 0;
+  }
+
+  /* connected accounts */
+  .list {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .conn-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    padding: 10px 12px;
+    border: 1px solid var(--sb-border, #e4e6e9);
+    border-radius: var(--sb-radius, 4px);
+    background: var(--sb-surface-alt, #fafafa);
+  }
+
+  .conn-left {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    min-width: 0;
+  }
+
+  .conn-mark {
+    flex: 0 0 auto;
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    background: var(--sb-surface, #ffffff);
+    border: 1px solid var(--sb-border, #e4e6e9);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 11px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .conn-name {
+    font-size: 13.5px;
+    font-weight: 500;
+    color: var(--sb-ink, #16181a);
+  }
+
+  .meta-row {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+  }
+
+  .dot {
+    flex: 0 0 auto;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+    background: var(--sb-ok, #0f6b4a);
+  }
+
+  .conn-meta {
+    font-size: 12px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .tile-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
+    gap: 8px;
+  }
+
+  .tile {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font: inherit;
+    text-align: left;
+    padding: 10px 11px;
+    border-radius: var(--sb-radius, 4px);
+    border: 1px dashed var(--sb-border-strong, #cdd1d6);
+    background: transparent;
+    cursor: pointer;
+    transition:
+      background 0.15s,
+      border-color 0.15s,
+      color 0.15s;
+  }
+
+  .tile:hover:not(:disabled) {
+    background: var(--sb-surface-alt, #fafafa);
+    border-color: var(--sb-accent, #111111);
+    border-style: solid;
+  }
+
+  .tile-mark {
+    flex: 0 0 auto;
+    width: 22px;
+    height: 22px;
+    border-radius: 50%;
+    background: var(--sb-surface-alt, #fafafa);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 10.5px;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .tile-name {
+    font-size: 13px;
+    color: var(--sb-ink, #16181a);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .tile-plus {
+    margin-left: auto;
+    font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+    font-size: 14px;
+    line-height: 1;
+    color: var(--sb-muted-ink, #61666c);
+  }
+
+  .delete-panel {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+    padding: 14px;
+    border: 1px solid var(--sb-danger-panel-border, #efd9d6);
+    border-radius: var(--sb-radius, 4px);
+    background: var(--sb-danger-panel-bg, #fdf7f6);
+  }
+
+  .disabled-note {
+    font-size: 12px;
+    color: var(--sb-muted-ink, #61666c);
+    font-style: italic;
+  }
+`;function ve(t,a,e){if(!t||!a)return null;let r;try{r=new URL(a)}catch{return null}let o;try{o=new URL(t,r.href)}catch{return e==null||e(`"${t}" is not a valid URL`),null}return o.protocol!=="http:"&&o.protocol!=="https:"?(e==null||e(`refusing redirect to unsupported scheme "${o.protocol}"`),null):o.origin!==r.origin?(e==null||e(`refusing cross-origin redirect to ${o.origin}; same-origin only`),null):o.href===r.href?null:o.href}const ie={heading:"Upload files",description:"Add one or more files. You can review the list before uploading.",dropTitle:"Drag and drop files here",dropSub:"or browse from your device",hintUpTo:"up to {size} each",chooseFiles:"Choose files",chooseFile:"Choose file",addMore:"+ Add more files",remove:"Remove",rename:"Rename",retry:"Retry",uploadCtaOne:"Upload {n} file",uploadCtaMany:"Upload {n} files",attachments:"Attachments",dropOrChoose:"Drop files or choose",checking:"Checking…",pagesLabel:"{n} pages",countOne:"{n} file of {max}",countMany:"{n} files of {max}",uploading:"Uploading…",uploaded:"Uploaded",failedLabel:"Failed",errTooMany:"You can upload up to {max} files.",errTooLarge:"{name} is larger than {size}.",errTooSmall:"{name} is smaller than {size}.",errDuplicate:"{name} is already in the list.",errType:"{name} isn't an accepted file type.",errNoClient:"No Singlebase client found on this page.",errUpload:"Upload failed.",errProtected:"{name} is password protected.",errTooManyPages:"{name} has {pages} pages; the limit is {max}.",brandingLabel:"Files by Singlebase"};function ye(t){return t?{...ie,...t}:ie}function x(t,a){return t.replace(/\{(\w+)\}/g,(e,r)=>r in a?String(a[r]):e)}const Te={b:1,kb:1024,mb:1024*1024,gb:1024*1024*1024};function ae(t){if(typeof t=="number")return t>0?t:0;if(!t)return 0;const a=String(t).trim().toLowerCase().match(/^([\d.]+)\s*(b|kb|mb|gb)?$/);if(!a)return 0;const e=Number.parseFloat(a[1]);return!Number.isFinite(e)||e<=0?0:Math.round(e*(Te[a[2]??"b"]??1))}function Z(t){return t<1024?`${t} B`:t<1024*1024?`${Math.round(t/1024)} KB`:t<1024*1024*1024?`${(t/(1024*1024)).toFixed(1)} MB`:`${(t/(1024*1024*1024)).toFixed(1)} GB`}function Q(t){const a=t.lastIndexOf(".");return a<=0||a===t.length-1?"":t.slice(a+1).toLowerCase()}function Le(t){return Q(t).toUpperCase().slice(0,4)}function Fe(t,a,e){const r=t.split(",").map(g=>g.trim().toLowerCase()).filter(Boolean);if(!r.length)return!0;const o=a.toLowerCase(),l=(e||"").toLowerCase();return r.some(g=>g.startsWith(".")?o.endsWith(g):g.endsWith("/*")?l.startsWith(g.slice(0,-1)):l===g)}function Oe(t){const a=t.split(",").map(e=>e.trim()).filter(Boolean).map(e=>{if(e.startsWith("."))return e.slice(1).toUpperCase();if(e.endsWith("/*"))return e.slice(0,-2).toUpperCase();const r=e.indexOf("/");return(r>=0?e.slice(r+1):e).toUpperCase()});return[...new Set(a)].join(", ")}function De(t){return`${t.name}:${t.size}:${t.lastModified??0}`}function je(t,a){const e=a.trim().replace(/[/\\]/g,"");if(!e)return t;const r=t.lastIndexOf("."),o=r>0?t.slice(r):"";return o?e.toLowerCase().endsWith(o.toLowerCase())?e:e+o:e}const we={pages:null,encrypted:null},ge=16*1024*1024,Ae=2*1024*1024,Ee=40,Ne=4*1024*1024,ke=new Set(["docx","pptx","xlsx"]);async function ze(t,a){try{if(a==="pdf")return await Be(t);if(ke.has(a))return await Re(t,a)}catch{}return we}function Ue(t){return t==="pdf"||ke.has(t)}async function Be(t){const a=await ee(t.slice(0,ge)),e=t.size>ge?await ee(t.slice(Math.max(0,t.size-Ae))):null,r=te(a)+(e?te(e):""),o=/\/Encrypt[\s/<>\]]/.test(r);let l=$e(r);return l===null&&(l=await Pe(a)),{pages:l,encrypted:o}}function $e(t){if(/\/Type\s*\/Pages/.test(t)){let e=0;for(const r of t.matchAll(/\/Count\s+(\d+)/g))e=Math.max(e,Number(r[1]));if(e>0)return e}const a=t.match(/\/Type\s*\/Page[^s]/g);return a!=null&&a.length?a.length:null}async function Pe(t){if(typeof DecompressionStream>"u")return null;const a=te(t);let e="",r=0;for(const o of a.matchAll(/stream\r?\n/g)){if(r>=Ee||e.length>=Ne)break;const l=o.index+o[0].length;let g=a.indexOf("endstream",l);if(g<0)break;for(;g>l&&(a[g-1]===`
+`||a[g-1]==="\r");)g-=1;r+=1;try{const i=await Se(t.subarray(l,g),"deflate");e+=te(i)}catch{}}return e?$e(e):null}async function Re(t,a){const e=await ee(t.slice(0,8));if(Ie(e))return{pages:null,encrypted:!0};if(e[0]!==80||e[1]!==75)return we;const r=await Ge(t,"docProps/app.xml");if(!r)return{pages:null,encrypted:!1};const o=a==="pptx"?"Slides":"Pages",l=new TextDecoder().decode(r).match(new RegExp(`<${o}>(\\d+)</${o}>`));return{pages:l?Number(l[1]):null,encrypted:!1}}function Ie(t){return[208,207,17,224,161,177,26,225].every((e,r)=>t[r]===e)}async function Ge(t,a){const e=Math.min(t.size,66e3),r=new DataView(await t.slice(t.size-e).arrayBuffer());let o=-1;for(let h=r.byteLength-22;h>=0;h--)if(r.getUint32(h,!0)===101010256){o=h;break}if(o<0)return null;const l=r.getUint32(o+12,!0),g=r.getUint32(o+16,!0);if(!l||g===4294967295)return null;const i=new DataView(await t.slice(g,g+l).arrayBuffer()),s=new TextDecoder;let b=0;for(;b+46<=i.byteLength&&i.getUint32(b,!0)===33639248;){const h=i.getUint16(b+10,!0),m=i.getUint32(b+20,!0),v=i.getUint16(b+28,!0),X=i.getUint16(b+30,!0),re=i.getUint16(b+32,!0),oe=i.getUint32(b+42,!0);if(s.decode(new Uint8Array(i.buffer,i.byteOffset+b+46,v))===a){const de=new DataView(await t.slice(oe,oe+30).arrayBuffer()),ce=oe+30+de.getUint16(26,!0)+de.getUint16(28,!0),pe=await ee(t.slice(ce,ce+m));return h===0?pe:h===8&&typeof DecompressionStream<"u"?await Se(pe,"deflate-raw"):null}b+=46+v+X+re}return null}async function ee(t){return new Uint8Array(await t.arrayBuffer())}async function Se(t,a){const e=new Blob([t]).stream().pipeThrough(new DecompressionStream(a));return new Uint8Array(await new Response(e).arrayBuffer())}function te(t){let a="";for(let r=0;r<t.length;r+=32768)a+=String.fromCharCode(...t.subarray(r,r+32768));return a}var Ce=Object.defineProperty,_e=Object.getOwnPropertyDescriptor,Ke=(t,a,e)=>a in t?Ce(t,a,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[a]=e,f=(t,a,e,r)=>{for(var o=r>1?void 0:r?_e(a,e):a,l=t.length-1,g;l>=0;l--)(g=t[l])&&(o=(r?g(a,e,o):g(o))||o);return r&&o&&Ce(a,e,o),o},We=(t,a,e)=>Ke(t,a+"",e);const se={fromAttribute:t=>{if(!t)return{};try{const a=JSON.parse(t);return a&&typeof a=="object"?a:{}}catch{return console.warn("[singlebase-uploader] an attribute holds invalid JSON; ignoring it"),{}}},toAttribute:t=>JSON.stringify(t??{})},le={fromAttribute:t=>t===null?!0:t!=="false",toAttribute:t=>t?null:"false"},be=["view","dropzone","allowRename","autoUpload","branding","logoUrl","logoText","heading","description","maxFiles","maxSize","minSize","accept","rules","bucket","publicRead","redirectUrl","metadata","options","messages","theme","density","onComplete","onError"];var w,k,z,U,$,S,C,M,T,L,F,O,D,j,A,E,N,B,P,R,I,G,_,K,W,q,Y,H,V,J,he;exports.SinglebaseUploader=(he=class extends n.LitElement{constructor(){super(...arguments);c(this,w,null);c(this,k,{});c(this,z);c(this,U);c(this,$,"full");c(this,S,!0);c(this,C,!0);c(this,M,!1);c(this,T,!0);c(this,L,"");c(this,F,"");c(this,O,"");c(this,D,"");c(this,j,10);c(this,A,"25MB");c(this,E,0);c(this,N,"");c(this,B,{});c(this,P,"default");c(this,R,{});c(this,I,{});c(this,G,!1);c(this,_,"");c(this,K,null);c(this,W,null);c(this,q,[]);c(this,Y,"");c(this,H,!1);c(this,V,!1);c(this,J,"")}get client(){return d(this,w)}set client(e){p(this,w,e)}get messages(){return d(this,k)}set messages(e){p(this,k,e)}get theme(){return d(this,z)}set theme(e){p(this,z,e)}get density(){return d(this,U)}set density(e){p(this,U,e)}get view(){return d(this,$)}set view(e){p(this,$,e)}get dropzone(){return d(this,S)}set dropzone(e){p(this,S,e)}get allowRename(){return d(this,C)}set allowRename(e){p(this,C,e)}get autoUpload(){return d(this,M)}set autoUpload(e){p(this,M,e)}get branding(){return d(this,T)}set branding(e){p(this,T,e)}get logoUrl(){return d(this,L)}set logoUrl(e){p(this,L,e)}get logoText(){return d(this,F)}set logoText(e){p(this,F,e)}get heading(){return d(this,O)}set heading(e){p(this,O,e)}get description(){return d(this,D)}set description(e){p(this,D,e)}get maxFiles(){return d(this,j)}set maxFiles(e){p(this,j,e)}get maxSize(){return d(this,A)}set maxSize(e){p(this,A,e)}get minSize(){return d(this,E)}set minSize(e){p(this,E,e)}get accept(){return d(this,N)}set accept(e){p(this,N,e)}get rules(){return d(this,B)}set rules(e){p(this,B,e)}get bucket(){return d(this,P)}set bucket(e){p(this,P,e)}get metadata(){return d(this,R)}set metadata(e){p(this,R,e)}get options(){return d(this,I)}set options(e){p(this,I,e)}get publicRead(){return d(this,G)}set publicRead(e){p(this,G,e)}get redirectUrl(){return d(this,_)}set redirectUrl(e){p(this,_,e)}get onComplete(){return d(this,K)}set onComplete(e){p(this,K,e)}get onError(){return d(this,W)}set onError(e){p(this,W,e)}get items(){return d(this,q)}set items(e){p(this,q,e)}get notice(){return d(this,Y)}set notice(e){p(this,Y,e)}get busy(){return d(this,H)}set busy(e){p(this,H,e)}get dragging(){return d(this,V)}set dragging(e){p(this,V,e)}get editing(){return d(this,J)}set editing(e){p(this,J,e)}get msg(){return ye(this.messages)}get resolvedClient(){return this.client??Me.getDefaultClient()??null}get files(){return this.items}get percent(){const e=this.items.filter(r=>r.status!=="ready");return e.length?Math.round(e.reduce((r,o)=>r+o.percent,0)/e.length):0}open(){var e;(e=this.renderRoot.querySelector("input[type=file]"))==null||e.click()}set config(e){const r=this;for(const o of be)e&&o in e&&(r[o]=e[o])}get config(){const e=this;return Object.fromEntries(be.map(r=>[r,e[r]]))}clear(){this.items.forEach(y),this.items=[],this.notice=""}disconnectedCallback(){super.disconnectedCallback(),this.items.forEach(y)}async upload(){var g;if(this.busy)return;const e=this.items.filter(i=>i.status==="ready"||i.status==="error");if(!e.length)return;const r=this.resolvedClient;if(!r){this.fail(this.msg.errNoClient);return}this.busy=!0,this.notice="";for(const i of e)i.status="uploading",i.percent=0,i.error="";this.items=[...this.items];const o=new Map,l=e.map(i=>{const s={file:i.file,filename:i.file.name};return this.bucket&&(s.bucket=this.bucket),this.publicRead&&(s.publicRead=!0),i.name!==i.file.name&&(s.newName=i.name),Object.keys(this.metadata??{}).length&&(s.metadata={...this.metadata}),Object.keys(this.options??{}).length&&(s.options={...this.options}),o.set(s,i),s});try{const i=await r.files.upload(l,{onProgress:h=>{const m=o.get(h.input);m&&(m.percent=h.percent,this.items=[...this.items],this.emit("singlebase-upload-progress",{file:m,percent:this.percent}))}});for(const h of i.completed){const m=o.get(h.input);m&&(m.status="done",m.percent=100,m.record=h.file)}for(const h of i.failed){const m=o.get(h.input);m&&(m.status="error",m.error=h.error.message||h.error.code)}this.items=[...this.items];const s=i.completed.map(h=>o.get(h.input)).filter(Boolean),b=i.failed.map(h=>o.get(h.input)).filter(Boolean);this.emit("singlebase-upload-complete",{completed:s,failed:b}),(g=this.onComplete)==null||g.call(this,{completed:s,failed:b}),b.length?this.notice=this.msg.errUpload:this.redirect()}catch(i){for(const s of e)s.status="error",s.error="";this.items=[...this.items],this.fail(Ye(i)||this.msg.errUpload)}finally{this.busy=!1}}ruleFor(e){const r=Q(e);if(!r)return null;for(const[o,l]of Object.entries(this.rules??{}))if(o.toLowerCase().replace(/^\./,"")===r)return l;return null}async add(e){if(this.view==="button"){const s=this.items.filter(b=>b.status==="done"||b.status==="error");s.forEach(y),this.items=this.items.filter(b=>!s.includes(b))}const r=this.maxFiles>0?this.maxFiles:Number.POSITIVE_INFINITY,o=[...this.items],l=o.length,g=[];let i="";for(const s of Array.from(e)){if(o.length>=r){i=x(this.msg.errTooMany,{max:r});break}if(this.accept&&!Fe(this.accept,s.name,s.type)){i=x(this.msg.errType,{name:s.name});continue}const b=this.ruleFor(s.name),h=ae((b==null?void 0:b.maxSize)??this.maxSize),m=ae((b==null?void 0:b.minSize)??this.minSize);if(h&&s.size>h){i=x(this.msg.errTooLarge,{name:s.name,size:Z(h)});continue}if(m&&s.size<m){i=x(this.msg.errTooSmall,{name:s.name,size:Z(m)});continue}const v=De(s);if(o.some(re=>re.key===v)){i=x(this.msg.errDuplicate,{name:s.name});continue}const X={key:v,file:s,name:s.name,status:this.needsInspection(b,s.name)?"checking":"ready",percent:0,error:"",record:null,pages:null,encrypted:null,preview:qe(s)};o.push(X),g.push(X)}this.notice=i,i&&this.emit("singlebase-upload-rejected",{message:i}),o.length!==l&&(this.items=o,this.emit("singlebase-upload-selected",{files:this.items}),await Promise.all(g.filter(s=>s.status==="checking").map(s=>this.inspect(s,this.ruleFor(s.file.name)))),(this.autoUpload||this.view==="button")&&this.upload())}needsInspection(e,r){return!e||!Ue(Q(r))?!1:e.maxPages!==void 0||e.allowProtected===!1}async inspect(e,r){const o=await ze(e.file,Q(e.file.name));e.pages=o.pages,e.encrypted=o.encrypted;let l="";r.allowProtected===!1&&o.encrypted===!0?l=x(this.msg.errProtected,{name:e.name}):r.maxPages&&o.pages!==null&&o.pages>r.maxPages&&(l=x(this.msg.errTooManyPages,{name:e.name,pages:o.pages,max:r.maxPages})),l?(y(e),this.items=this.items.filter(g=>g!==e),this.notice=l,this.emit("singlebase-upload-rejected",{message:l})):(e.status="ready",this.items=[...this.items])}removeItem(e){this.items.filter(r=>r.key===e).forEach(y),this.items=this.items.filter(r=>r.key!==e),this.notice=""}commitRename(e,r){e.name=je(e.file.name,r),this.editing="",this.items=[...this.items]}fail(e){var r;this.notice=e,this.emit("singlebase-upload-error",{message:e}),(r=this.onError)==null||r.call(this,{message:e})}emit(e,r){this.dispatchEvent(new CustomEvent(e,{detail:r,bubbles:!0,composed:!0}))}redirect(){if(!this.redirectUrl||typeof location>"u")return;const e=ve(this.redirectUrl,location.href,r=>console.warn(`[singlebase-uploader] ${r}`));e&&location.assign(e)}onPick(e){var o;const r=e.target;(o=r.files)!=null&&o.length&&this.add(r.files),r.value=""}onDrop(e){var o;e.preventDefault(),this.dragging=!1;const r=(o=e.dataTransfer)==null?void 0:o.files;r!=null&&r.length&&this.add(r)}onDragOver(e){e.preventDefault(),this.dragging=!0}onDragLeave(){this.dragging=!1}get canAddMore(){return this.maxFiles<=0||this.items.length<this.maxFiles}get checking(){return this.items.some(e=>e.status==="checking")}get pendingCount(){return this.items.filter(e=>e.status==="ready"||e.status==="error").length}get hint(){const e=Oe(this.accept),r=ae(this.maxSize),o=r?x(this.msg.hintUpTo,{size:Z(r)}):"";return[e,o].filter(Boolean).join(" · ")}renderInput(){return n.html`<input
+      class="sr-only"
+      type="file"
+      ?multiple=${this.maxFiles!==1}
+      accept=${this.accept||n.nothing}
+      @change=${this.onPick}
+    />`}renderLogo(){return this.logoUrl?n.html`<img
+        class="logo-img"
+        src=${this.logoUrl}
+        alt=${this.logoText||"Logo"}
+        part="logo"
+      />`:this.logoText?n.html`<div class="brand-mark" part="logo">${this.logoText}</div>`:n.nothing}renderBranding(){return this.branding?n.html`<div class="branding" part="branding">
+      <a href="https://singlebase.cloud" target="_blank" rel="noopener noreferrer"
+        >${this.msg.brandingLabel}</a
+      >
+    </div>`:n.nothing}renderNotice(){return this.notice?n.html`<div class="banner" role="alert" part="error">${this.notice}</div>`:n.nothing}renderCount(){if(!this.items.length)return n.nothing;const e=this.items.length===1?this.msg.countOne:this.msg.countMany;return n.html`<div class="count" part="count">
+      ${x(e,{n:this.items.length,max:this.maxFiles})}
+    </div>`}renderStatus(e){const r=Z(e.file.size);if(e.status==="checking")return`${r} · ${this.msg.checking}`;if(e.status==="uploading")return`${r} · ${this.msg.uploading}`;if(e.status==="done")return`${r} · ${this.msg.uploaded}`;if(e.status==="error")return`${r} · ${e.error||this.msg.failedLabel}`;const o=e.pages?` · ${x(this.msg.pagesLabel,{n:e.pages})}`:"";return r+o}renderRow(e){const r=this.allowRename&&e.status==="ready";return e.status==="uploading"||e.status,n.html`<div class="row" part="file">
+      <div class="chip" part="file-type">
+        ${e.preview?n.html`<img class="thumb" src=${e.preview} alt="" part="preview" />`:Le(e.name)||"FILE"}
+      </div>
+      <div class="meta">
+        ${this.editing===e.key?n.html`<input
+                class="name-input"
+                .value=${e.name}
+                autofocus
+                @keydown=${o=>{o.key==="Enter"?this.commitRename(e,o.target.value):o.key==="Escape"&&(this.editing="")}}
+                @blur=${o=>this.commitRename(e,o.target.value)}
+              />`:r?n.html`<button
+                  class="name"
+                  title=${this.msg.rename}
+                  @click=${()=>{this.editing=e.key}}
+                >
+                  ${e.name}
+                </button>`:n.html`<div class="name">${e.name}</div>`}
+        <div class="sz" data-state=${e.status}>${this.renderStatus(e)}</div>
+        ${e.status==="uploading"?n.html`<div class="bar" part="progress">
+                <div class="bar-fill" style="width:${e.percent}%"></div>
+              </div>`:n.nothing}
+      </div>
+      <div class="row-act">
+        ${e.status==="error"?n.html`<button class="link-sm" @click=${()=>void this.upload()}>
+                ${this.msg.retry}
+              </button>`:n.nothing}
+        ${e.status==="uploading"||e.status==="done"?n.nothing:n.html`<button class="link-sm" @click=${()=>this.removeItem(e.key)}>
+                ${this.msg.remove}
+              </button>`}
+      </div>
+    </div>`}renderRows(){return this.items.length?n.html`<div class="rows" part="files">
+      ${this.items.map(e=>this.renderRow(e))}
+    </div>`:n.nothing}renderDropzone(){return n.html`<div class="drop" part="dropzone" data-drag=${String(this.dragging)}>
+      <div class="arrow" aria-hidden="true">↑</div>
+      <div class="drop-title">${this.msg.dropTitle}</div>
+      <button class="link" @click=${this.open}>${this.msg.dropSub}</button>
+      ${this.hint?n.html`<div class="hint">${this.hint}</div>`:n.nothing}
+    </div>`}renderUploadCta(){const e=this.pendingCount;if(this.autoUpload||!e&&!this.busy)return n.nothing;const r=e===1?this.msg.uploadCtaOne:this.msg.uploadCtaMany;return n.html`<button
+      class="primary wide"
+      part="submit"
+      ?disabled=${this.busy||this.checking}
+      @click=${()=>void this.upload()}
+    >
+      ${this.busy?this.msg.uploading:x(r,{n:e})}
+    </button>`}renderFull(){const e=this.dropzone&&!this.items.length&&this.canAddMore;return n.html`<div
+      class="card"
+      part="card"
+      @dragover=${this.onDragOver}
+      @dragleave=${this.onDragLeave}
+      @drop=${this.onDrop}
+    >
+      ${this.logoUrl||this.logoText||this.heading||this.description?n.html`<div class="head-block">
+              ${this.renderLogo()}
+              ${this.heading?n.html`<div class="title">${this.heading}</div>`:n.nothing}
+              ${this.description?n.html`<div class="sub">${this.description}</div>`:n.nothing}
+            </div>`:n.nothing}
+      ${this.renderCount()} ${this.renderNotice()} ${this.renderRows()}
+      ${e?this.renderDropzone():n.nothing}
+      ${!e&&this.canAddMore?n.html`<button class="add-more" @click=${this.open}>${this.msg.addMore}</button>`:n.nothing}
+      ${this.renderUploadCta()} ${this.renderBranding()}
+    </div>`}renderCompact(){return n.html`<div
+      class="card"
+      part="card"
+      @dragover=${this.onDragOver}
+      @dragleave=${this.onDragLeave}
+      @drop=${this.onDrop}
+    >
+      <div class="between">
+        <span class="sec-title">${this.heading||this.msg.attachments}</span>
+        <span class="count">${this.items.length} / ${this.maxFiles}</span>
+      </div>
+      ${this.dropzone?n.html`<div class="strip" part="dropzone" data-drag=${String(this.dragging)}>
+              <span class="strip-label">${this.msg.dropOrChoose}</span>
+              <button class="secondary" ?disabled=${!this.canAddMore} @click=${this.open}>
+                ${this.msg.chooseFiles}
+              </button>
+            </div>`:n.html`<button class="secondary" ?disabled=${!this.canAddMore} @click=${this.open}>
+              ${this.msg.chooseFiles}
+            </button>`}
+      ${this.hint?n.html`<div class="hint">${this.hint}</div>`:n.nothing} ${this.renderNotice()}
+      ${this.renderRows()} ${this.renderUploadCta()} ${this.renderBranding()}
+    </div>`}renderButton(){const e=this.items[this.items.length-1];return n.html`<div class="button-view">
+      <button class="primary" ?disabled=${this.busy||!this.canAddMore} @click=${this.open}>
+        ${this.busy?this.msg.uploading:this.msg.chooseFile}
+      </button>
+      ${e&&e.status!=="ready"?n.html`<div class="sz" data-state=${e.status}>${this.renderStatus(e)}</div>`:n.nothing}
+      ${this.renderNotice()}
+    </div>`}render(){return n.html`${this.renderInput()}${this.view==="button"?this.renderButton():this.view==="compact"?this.renderCompact():this.renderFull()}`}},w=new WeakMap,k=new WeakMap,z=new WeakMap,U=new WeakMap,$=new WeakMap,S=new WeakMap,C=new WeakMap,M=new WeakMap,T=new WeakMap,L=new WeakMap,F=new WeakMap,O=new WeakMap,D=new WeakMap,j=new WeakMap,A=new WeakMap,E=new WeakMap,N=new WeakMap,B=new WeakMap,P=new WeakMap,R=new WeakMap,I=new WeakMap,G=new WeakMap,_=new WeakMap,K=new WeakMap,W=new WeakMap,q=new WeakMap,Y=new WeakMap,H=new WeakMap,V=new WeakMap,J=new WeakMap,he);We(exports.SinglebaseUploader,"styles",[me,xe,n.css`
+      .card {
+        display: flex;
+        flex-direction: column;
+        gap: 14px;
+        box-sizing: border-box;
+        padding: var(--sb-pad, 20px);
+        background: var(--sb-surface, #ffffff);
+        color: var(--sb-ink, #16181a);
+        border: 1px solid var(--sb-border, #e4e6e9);
+        border-radius: calc(var(--sb-radius, 4px) + 4px);
+      }
+
+      .logo-img {
+        display: block;
+        align-self: flex-start;
+        height: var(--sb-logo-height, 20px);
+        width: auto;
+        max-width: 100%;
+      }
+
+      .brand-mark {
+        font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+        font-size: 13px;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+        color: var(--sb-ink, #16181a);
+      }
+
+      .head-block {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+      }
+
+      .count {
+        font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+        font-size: 11.5px;
+        letter-spacing: 0.06em;
+        text-transform: uppercase;
+        color: var(--sb-muted-ink, #61666c);
+      }
+
+      /* ── dropzone ─────────────────────────────────────── */
+      .drop {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 6px;
+        padding: 30px 20px;
+        text-align: center;
+        border: 1px dashed var(--sb-border-strong, #cdd1d6);
+        border-radius: calc(var(--sb-radius, 4px) + 2px);
+        background: var(--sb-surface, #ffffff);
+        transition:
+          border-color 0.15s,
+          background 0.15s;
+      }
+
+      .drop[data-drag="true"] {
+        border-color: var(--sb-accent, #111111);
+        background: var(--sb-surface-alt, #fafafa);
+      }
+
+      .arrow {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 42px;
+        height: 42px;
+        margin-bottom: 4px;
+        font-size: 18px;
+        line-height: 1;
+        border: 1px solid var(--sb-border, #e4e6e9);
+        border-radius: 50%;
+        color: var(--sb-ink, #16181a);
+      }
+
+      .drop-title {
+        font-size: 14px;
+        font-weight: 600;
+        color: var(--sb-ink, #16181a);
+      }
+
+      /* the compact single-line dropzone */
+      .strip {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+        padding: 10px 12px;
+        border: 1px solid var(--sb-border, #e4e6e9);
+        border-radius: calc(var(--sb-radius, 4px) + 2px);
+        background: var(--sb-surface-alt, #fafafa);
+        transition:
+          border-color 0.15s,
+          background 0.15s;
+      }
+
+      .strip[data-drag="true"] {
+        border-color: var(--sb-accent, #111111);
+      }
+
+      .strip-label {
+        font-size: 14px;
+        color: var(--sb-muted-ink, #61666c);
+      }
+
+      /* ── file rows ────────────────────────────────────── */
+      .rows {
+        display: flex;
+        flex-direction: column;
+      }
+
+      .row {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        padding: 12px 0;
+        border-top: 1px solid var(--sb-border, #e4e6e9);
+      }
+
+      .rows .row:first-child {
+        border-top: none;
+      }
+
+      .chip {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex: 0 0 auto;
+        width: 46px;
+        height: 46px;
+        font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+        font-size: 10.5px;
+        letter-spacing: 0.04em;
+        color: var(--sb-muted-ink, #61666c);
+        background: var(--sb-surface-alt, #fafafa);
+        border: 1px solid var(--sb-border, #e4e6e9);
+        border-radius: var(--sb-radius, 4px);
+        overflow: hidden;
+      }
+
+      .thumb {
+        display: block;
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      .meta {
+        flex: 1;
+        min-width: 0;
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+      }
+
+      .name {
+        font-size: 14px;
+        font-weight: 500;
+        color: var(--sb-ink, #16181a);
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      button.name {
+        align-self: flex-start;
+        max-width: 100%;
+        padding: 0;
+        border: none;
+        background: none;
+        text-align: left;
+        border-radius: 0;
+      }
+
+      button.name:hover {
+        text-decoration: underline;
+        text-underline-offset: 3px;
+      }
+
+      .name-input {
+        font-size: 14px;
+        padding: 6px 8px;
+      }
+
+      .sz {
+        font-size: 12px;
+        color: var(--sb-muted-ink, #61666c);
+      }
+
+      .sz[data-state="error"] {
+        color: var(--sb-danger, #b4231a);
+      }
+
+      .sz[data-state="done"] {
+        color: var(--sb-ok, #0f6b4a);
+      }
+
+      .bar {
+        height: 3px;
+        margin-top: 2px;
+        border-radius: 999px;
+        background: var(--sb-border, #e4e6e9);
+        overflow: hidden;
+      }
+
+      .bar-fill {
+        height: 100%;
+        background: var(--sb-accent, #111111);
+        transition: width 0.2s linear;
+      }
+
+      .row-act {
+        flex: 0 0 auto;
+        display: flex;
+        align-items: center;
+        gap: 10px;
+      }
+
+      /* ── the dashed "add more" affordance ─────────────── */
+      button.add-more {
+        width: 100%;
+        padding: 14px;
+        color: var(--sb-ink, #16181a);
+        background: none;
+        border: 1px dashed var(--sb-border-strong, #cdd1d6);
+        border-radius: calc(var(--sb-radius, 4px) + 2px);
+      }
+
+      button.add-more:hover:not(:disabled) {
+        background: var(--sb-surface-alt, #fafafa);
+      }
+
+      button.wide {
+        width: 100%;
+        padding: 13px;
+        font-size: 14px;
+      }
+
+      .branding {
+        text-align: center;
+        font-family: var(--sb-mono, "Geist Mono", ui-monospace, monospace);
+        font-size: 10.5px;
+        letter-spacing: 0.06em;
+        color: var(--sb-muted-ink, #61666c);
+      }
+
+      .branding a {
+        color: inherit;
+        text-decoration: none;
+      }
+
+      .branding a:hover {
+        color: var(--sb-ink, #16181a);
+        text-decoration: underline;
+        text-underline-offset: 3px;
+      }
+
+      /* the button view is just a control, not a card */
+      :host([view="button"]) {
+        display: inline-block;
+      }
+
+      .button-view {
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+      }
+    `]);f([u.property({attribute:!1})],exports.SinglebaseUploader.prototype,"client",1);f([u.property({attribute:!1})],exports.SinglebaseUploader.prototype,"messages",1);f([u.property({reflect:!0})],exports.SinglebaseUploader.prototype,"theme",1);f([u.property({reflect:!0})],exports.SinglebaseUploader.prototype,"density",1);f([u.property({reflect:!0})],exports.SinglebaseUploader.prototype,"view",1);f([u.property({converter:le})],exports.SinglebaseUploader.prototype,"dropzone",1);f([u.property({converter:le,attribute:"allow-rename"})],exports.SinglebaseUploader.prototype,"allowRename",1);f([u.property({type:Boolean,attribute:"auto-upload"})],exports.SinglebaseUploader.prototype,"autoUpload",1);f([u.property({converter:le})],exports.SinglebaseUploader.prototype,"branding",1);f([u.property({attribute:"logo-url"})],exports.SinglebaseUploader.prototype,"logoUrl",1);f([u.property({attribute:"logo-text"})],exports.SinglebaseUploader.prototype,"logoText",1);f([u.property()],exports.SinglebaseUploader.prototype,"heading",1);f([u.property()],exports.SinglebaseUploader.prototype,"description",1);f([u.property({type:Number,attribute:"max-files"})],exports.SinglebaseUploader.prototype,"maxFiles",1);f([u.property({attribute:"max-size"})],exports.SinglebaseUploader.prototype,"maxSize",1);f([u.property({attribute:"min-size"})],exports.SinglebaseUploader.prototype,"minSize",1);f([u.property()],exports.SinglebaseUploader.prototype,"accept",1);f([u.property({converter:se})],exports.SinglebaseUploader.prototype,"rules",1);f([u.property()],exports.SinglebaseUploader.prototype,"bucket",1);f([u.property({converter:se})],exports.SinglebaseUploader.prototype,"metadata",1);f([u.property({converter:se})],exports.SinglebaseUploader.prototype,"options",1);f([u.property({type:Boolean,attribute:"public-read"})],exports.SinglebaseUploader.prototype,"publicRead",1);f([u.property({attribute:"redirect-url"})],exports.SinglebaseUploader.prototype,"redirectUrl",1);f([u.property({attribute:!1})],exports.SinglebaseUploader.prototype,"onComplete",1);f([u.property({attribute:!1})],exports.SinglebaseUploader.prototype,"onError",1);f([u.state()],exports.SinglebaseUploader.prototype,"items",1);f([u.state()],exports.SinglebaseUploader.prototype,"notice",1);f([u.state()],exports.SinglebaseUploader.prototype,"busy",1);f([u.state()],exports.SinglebaseUploader.prototype,"dragging",1);f([u.state()],exports.SinglebaseUploader.prototype,"editing",1);exports.SinglebaseUploader=f([u.customElement("singlebase-uploader")],exports.SinglebaseUploader);function qe(t){return!t.type.startsWith("image/")||typeof URL.createObjectURL!="function"?"":URL.createObjectURL(t)}function y(t){t.preview&&URL.revokeObjectURL(t.preview)}function Ye(t){return t instanceof Error?t.message:""}exports.TOKEN_DEFAULTS=ne;exports.defaultUploadMessages=ie;exports.inspectFile=ze;exports.isInspectable=Ue;exports.resolveRedirectTarget=ve;exports.resolveUploadMessages=ye;exports.sharedStyles=xe;exports.tokenDefaults=me;
+//# sourceMappingURL=uploader-eFYKpk8b.cjs.map