@withone/connect 0.20.0 → 0.22.0

package/README.md

@@ -81,7 +81,7 @@ ONE_CLIENT_ID=…
 ONE_CLIENT_SECRET=one_secret_…                        # server only
 ONE_CONNECT_KEY=sk_live_…                             # server only; key mode
 ONE_REDIRECT_URI=https://yourapp.com/api/one/callback  # exactly the registered URL
-ONE_PERMISSION_SET=…                                  # optional: the Permission set ID
+ONE_PERMISSION_SET=…                                  # optional: the Permission set ID (never changes)
 ```
 
 ### Or from code
@@ -119,7 +119,7 @@ one connect types    # optional: tool slugs and action names autocomplete
 one connect create   # opens your browser to approve it, then writes .env
 ```
 
-The CLI opens a page in your signed-in browser showing the app as your users will see it. You approve it there; a new app's client secret and connect key are made on that page and shown once, so they never pass through the terminal. The CLI then writes `ONE_CLIENT_ID`, `ONE_REDIRECT_URI` and, for a list of tools, `ONE_PERMISSION_SET` to `.env` (an app that asks for everything has none, so the CLI removes it). `access` is `read-only`, `read-write`, `full-access`, or `custom` with `actions`, named as `one connect types` wrote them or by id. On Node older than 22.18, name the file `one.connect.mjs` and type it with `/** @type {import("@withone/connect/config").ConnectAppConfig} */`.
+The CLI opens a page in your signed-in browser showing the app as your users will see it. You approve it there; a new app's client secret and connect key are made on that page and shown once, so they never pass through the terminal. The CLI then writes `ONE_CLIENT_ID`, `ONE_REDIRECT_URI` and, for a list of tools, `ONE_PERMISSION_SET` to `.env` (an app that asks for everything needs none, so the CLI removes it; a server that still sends the old ID keeps working, because switching never deletes it). `access` is `read-only`, `read-write`, `full-access`, or `custom` with `actions`, named as `one connect types` wrote them or by id. On Node older than 22.18, name the file `one.connect.mjs` and type it with `/** @type {import("@withone/connect/config").ConnectAppConfig} */`.
 
 | Prop | |
 |---|---|
@@ -198,11 +198,12 @@ import { ConnectButton } from "@withone/connect/react";
 | `authorizeUrl` | Your authorize route. Required. |
 | `logos` | Connector slugs to draw as logos. Decoration only; your permission set decides what One asks for. |
 | `connected` | Whether the user already has a grant, from your server. |
-| `variant` | `default`, `accent` (your brand colour, set with `--one-connect-accent` and `--one-connect-accent-fg`), or `block` (a card with a `description`). |
+| `variant` | `default`, `accent` (your brand colour), or `block` (a card with a `description`). Setting `accent` alone picks `accent`. |
+| `accent` / `accentText` | Your brand colour (`"#F4A938"`) and the text on it. Leave `accentText` out and the button picks dark or white text, whichever reads. |
 | `size` | `sm`, `md` or `lg`. |
 | `fullWidth` | Fills its container. |
 | `theme` | `light`, `dark` or `auto`. `connectTheme` sets One's page. |
-| `connector` | A connector slug (`gmail`). One's page opens that connector's connect screen first, then the usual list. |
+| `openApp` | An app's slug (`gmail`). One's page opens that app's connect screen first, then the usual list. Works whether your app asks for specific apps or for everything. |
 | `returnTo` | Where this flow returns to: a path on your app, such as `/chat/42`. Overrides the server's `returnTo` for this flow only. |
 | `label` / `connectedLabel` | Button text, and the text once connected. |
 | `disabled` | Not clickable. |
@@ -221,7 +222,27 @@ Other frameworks take the same props:
 
 Svelte: `use:connectButton={{ authorizeUrl, logos }}` from `@withone/connect/svelte`.
 
-To match your design, set `--one-connect-font`, `--one-connect-radius`, `--one-connect-accent` and `--one-connect-accent-fg` on the host, or style `::part(button)`.
+To match your brand, pass your colour:
+
+```tsx
+<ConnectButton
+  authorizeUrl="/api/one/authorize"
+  label="Connect your tools"
+  accent="#F4A938"
+  accentText="#16233F"
+/>
+```
+
+```html
+<one-connect-button
+  authorize-url="/api/one/authorize"
+  label="Connect your tools"
+  accent="#F4A938"
+  accent-text="#16233F"
+></one-connect-button>
+```
+
+The Connected state keeps the same colours. For the rest of your design, set `--one-connect-font` and `--one-connect-radius` on the host, or style `::part(button)`. `--one-connect-accent` and `--one-connect-accent-fg` still work; the props win when both are set.
 
 ### Your own button
 
@@ -284,14 +305,14 @@ The user lands back on your `returnTo` page (`/` unless you set it) with the out
 
 Show your own text for each code and never text taken from the URL, since anyone can craft a link. Remove the parameters after reading them so a refresh does not repeat the message. To theme One's page, add `#one_theme=dark` or `#one_theme=light` to the link.
 
-### One connector first
+### One app first
 
-A chat or a settings page often needs a single tool connected now, not the whole list. Pass `connector`, and `returnTo` when the flow must come back to the page it started on:
+A chat or a settings page often needs a single app connected now, not the whole list. Pass `openApp`, and `returnTo` when the flow must come back to the page it started on:
 
 ```tsx
 const { open } = useOneConnect({
   authorizeUrl: "/api/one/authorize",
-  connector: "gmail",
+  openApp: "gmail",
   returnTo: "/chat/42",
 });
 
@@ -300,9 +321,10 @@ const { open } = useOneConnect({
 
 One's page still signs the user in and asks for the space. Then, instead of the list, it opens Gmail's connect screen straight away. The list follows with everything the user has connected, so they confirm the whole grant as always.
 
-- `connector` is a slug from One's catalog (`gmail`, `google-calendar`, `stripe`). A slug your permission set does not offer, or one the user already connected in that space, is ignored and the page opens on the list.
+- `openApp` is a slug from One's catalog (`gmail`, `google-calendar`, `stripe`). An app that asks for everything can open any app in the catalog; an app that asks for specific apps can open only one it asks for. A slug outside that, or one the user already connected in that space, is ignored and the page opens on the list.
+- `connector` and `#one_connector` are the old names. They still work.
 - `returnTo` must be a path on your app. Anything else is ignored and the server's `returnTo` applies.
-- Both work the same on `ConnectButton`, `createConnectFlow` and a plain link: `<a href="/api/one/authorize?one_return_to=%2Fchat%2F42#one_connector=gmail">`.
+- Both work the same on `ConnectButton`, `createConnectFlow` and a plain link: `<a href="/api/one/authorize?one_return_to=%2Fchat%2F42#one_open_app=gmail">`.
 
 ## 5 · Using the grant
 
@@ -527,7 +549,7 @@ The job renews both tokens when either is within 3 days of expiring. Without it,
 | `createConnectFlow(options)` | Your own button anywhere. |
 | `readConnectReturn()` | How this page load ended a flow, or null. |
 
-`useOneConnect` and `createConnectFlow` take `authorizeUrl`, `connectTheme`, `connector`, `returnTo`, `onSuccess`, `onError` and `onCancel`.
+`useOneConnect` and `createConnectFlow` take `authorizeUrl`, `connectTheme`, `openApp`, `returnTo`, `onSuccess`, `onError` and `onCancel`.
 
 ### Config · `@withone/connect/config`
 

package/dist/button.d.ts

@@ -1,4 +1,11 @@
 import type { ConnectButtonHandle, ConnectButtonProps } from "./types";
+/** @internal The variant drawn: the one asked for, else accent when a brand colour
+ *  is given, else default. */
+export declare const resolveVariant: (props: ConnectButtonProps) => import("./types").ConnectButtonVariant;
+/** Dark or white text on a hex fill, whichever reads (WCAG relative
+ *  luminance). Null for anything that isn't a hex colour: the stylesheet's
+ *  default stands. */
+export declare function readableTextOn(fill: string): string | null;
 /**
  * Draws the button inside the shadow root of an element you render, for
  * wrappers that own their host (React, Vue). Nothing is written to the

package/dist/constants.d.ts

@@ -11,11 +11,12 @@ export declare const LEGACY_MESSAGE_PARAM = "one_connect_message";
  *  A fragment never reaches any server and survives the whole redirect
  *  chain, so the app's backend forwards nothing. */
 export declare const THEME_PARAM = "one_theme";
-/** Fragment key naming the connector One's page opens first. Sign-in
- *  and the space step run as always; then that connector's connect
- *  screen opens instead of the list, and the list follows with
- *  everything the user has connected. */
-export declare const CONNECTOR_PARAM = "one_connector";
+/** Fragment key naming the app One's page opens first. Sign-in and the
+ *  space step run as always; then that app's connect screen opens
+ *  instead of the list, and the list follows with everything the user
+ *  has connected. One's page also reads the old `one_connector` key, so
+ *  links written before the rename keep working. */
+export declare const OPEN_APP_PARAM = "one_open_app";
 /** Query param on the app's own authorize route naming where this one
  *  flow returns to. The route reads it; it never reaches One. */
 export declare const RETURN_TO_PARAM = "one_return_to";

package/dist/index.cjs.js

@@ -1 +1 @@
-"use strict";const e="one_connect",t="one_connect_error",n={declined:"You cancelled the connection.",expired:"The connection attempt expired. Please try again.",failed:"The connection could not be completed. Please try again."};function o(o){const i=new URLSearchParams(o),r=i.get(e);if("success"===r)return{status:r};if("error"!==r)return null;const a=i.get(t),l=null!==(s=a)&&Object.prototype.hasOwnProperty.call(n,s)?a:"failed";var s;return{status:r,code:l,message:n[l]}}const i=[e,t,"one_connect_message"];function r(e){const t=new URLSearchParams(e);return i.some(e=>t.has(e))}let a,l=!1,s=!1,c=!1;const d=[];function u(){return p()}function p(){return"undefined"==typeof window?null:(void 0===a&&(a=o(window.location.search),(a||r(window.location.search))&&function(){const e=()=>{r(window.location.search)&&window.history.replaceState(window.history.state,"",function(e){const t=new URLSearchParams(e.search);for(const e of i)t.delete(e);const n=t.toString();return`${e.pathname}${n?`?${n}`:""}${e.hash}`}(window.location))};e();for(const t of[50,500,2e3])window.setTimeout(e,t)}()),a)}function h(e){let t=e,n=!1;const o={deliver:e=>{try{var n,o,i,r,a,l;"success"===e.status?null===(n=(o=t).onSuccess)||void 0===n||n.call(o):null===(i=(r=t).onError)||void 0===i||i.call(r,null!==(a=e.message)&&void 0!==a?a:"",null!==(l=e.code)&&void 0!==l?l:"failed")}catch{}},restored:()=>{if(n){n=!1;try{var e,o;null===(e=(o=t).onCancel)||void 0===e||e.call(o)}catch{}}}};return"undefined"!=typeof window&&(d.push(o),c||"undefined"==typeof window||(c=!0,window.addEventListener("pageshow",e=>{if(e.persisted)for(const e of[...d])e.restored()})),function(){if(l||s)return;const e=p();e&&(s=!0,window.setTimeout(()=>{s=!1;const t=d[0];t&&!l&&(l=!0,t.deliver(e))},0))}()),{open:()=>{"undefined"!=typeof window&&(n=!0,window.location.assign((e=>{try{var t;const n=new URL(e.authorizeUrl,window.location.origin);e.returnTo&&n.searchParams.set("one_return_to",e.returnTo);const o=new URLSearchParams;e.connectTheme&&o.set("one_theme",e.connectTheme);const i=null===(t=e.connector)||void 0===t?void 0:t.trim().toLowerCase();i&&o.set("one_connector",i);const r=o.toString();return r&&(n.hash=r),n.toString()}catch{return e.authorizeUrl}})(t)))},update:e=>{t=e},destroy:()=>{const e=d.indexOf(o);e>=0&&d.splice(e,1)}}}function C(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t);if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e){return e.trim().toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}const b={"cal-com":"Cal.com","click-up":"ClickUp",clickup:"ClickUp",docusign:"DocuSign",elevenlabs:"ElevenLabs","fireflies-ai":"Fireflies.ai",github:"GitHub",gitlab:"GitLab",hubspot:"HubSpot","linked-in":"LinkedIn",linkedin:"LinkedIn","one-drive":"OneDrive",onedrive:"OneDrive",openai:"OpenAI","otter-ai":"Otter.ai",paypal:"PayPal",posthog:"PostHog",quickbooks:"QuickBooks",sharepoint:"SharePoint","spotify-web":"Spotify",teams:"Microsoft Teams","telegram-bot":"Telegram","whatsapp-business":"WhatsApp Business",woocommerce:"WooCommerce",x:"X","youtube-data":"YouTube",youtube:"YouTube"};function g(e){var t;return null!==(t=b[e])&&void 0!==t?t:e.split(/[-_]+/).filter(Boolean).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}function v(e){return e?`https://assets.withone.ai/connectors/${e}.svg`:""}function m(e){var t,n,o,i;const r="string"==typeof e?{slug:e}:e,a=null!==(t=r.slug)&&void 0!==t&&t.trim()?f(r.slug):null!==(n=r.name)&&void 0!==n&&n.trim()?f(r.name):"";return a?{slug:a,name:(null===(o=r.name)||void 0===o?void 0:o.trim())||g(a),imageUrl:(null===(i=r.imageUrl)||void 0===i?void 0:i.trim())||v(a)}:null}function x(e){const t=null==e?void 0:e.trim();if(!t)return[];if(t.startsWith("["))try{const e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>"string"==typeof e||"object"==typeof e&&null!==e):[]}catch{return[]}return t.split(",").map(e=>e.trim()).filter(Boolean)}const w="#CCFF00",y="#0A0C0B",k="#FFFFFF",A=`\n:host{display:inline-block;vertical-align:middle;max-width:100%}\n:host([data-full-width]),:host([full-width]:not([full-width="false"])),\n:host([data-variant="block"]),:host([variant="block"]){display:block;width:100%}\n.b{all:unset;box-sizing:border-box;position:relative;display:inline-flex;align-items:center;gap:var(--gap);\n  max-width:100%;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;\n  font-family:var(--one-connect-font,inherit);font-size:var(--fs);font-weight:500;line-height:1.2;letter-spacing:-.01em;\n  padding:var(--pad);border-radius:var(--one-connect-radius,12px);background:var(--bg);color:var(--fg);\n  box-shadow:var(--shadow);transition:box-shadow .2s var(--ease),background-color .2s var(--ease),opacity .2s var(--ease)}\n.b[data-full-width]{display:flex;width:100%;justify-content:center}\n.b:focus-visible{outline:2px solid var(--ring);outline-offset:2px}\n.b:hover{box-shadow:var(--shadow-hover)}\n.b[disabled]{cursor:not-allowed;opacity:.5;box-shadow:none}\n.b[aria-busy="true"]{cursor:progress}\n.b{--ease:cubic-bezier(.2,.9,.25,1)}\n.b[data-size="sm"]{--fs:13px;--pad:8px 12px 8px 10px;--gap:8px;--chip:18px;--logo:12px}\n.b[data-size="md"]{--fs:14.5px;--pad:12px 16px 12px 14px;--gap:12px;--chip:22px;--logo:14px}\n.b[data-size="lg"]{--fs:16px;--pad:14px 20px 14px 16px;--gap:12px;--chip:26px;--logo:16px}\n.b[data-theme="light"],.b[data-theme="auto"]{--ink-bg:${y};--ink-fg:${k};--surface:${k};--surface-fg:${y};\n  --muted:#5B6560;--line:#D5DAD7;--ring:${y};--shadow-base:0 1px 2px rgba(10,12,11,.08),0 4px 14px rgba(10,12,11,.06);\n  --shadow-strong:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.1)}\n.b[data-theme="dark"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}\n@media (prefers-color-scheme:dark){.b[data-theme="auto"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}}\n.b[data-variant="default"]{--bg:var(--ink-bg);--fg:var(--ink-fg);--shadow:var(--shadow-base);--shadow-hover:var(--shadow-strong)}\n.b[data-variant="accent"]{--bg:var(--one-connect-accent,${w});--fg:var(--one-connect-accent-fg,${y});\n  --shadow:0 1px 2px rgba(10,12,11,.1);--shadow-hover:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.12)}\n.b[data-variant="block"]{--bg:var(--surface);--fg:var(--surface-fg);--shadow:inset 0 0 0 1px var(--line);\n  --shadow-hover:inset 0 0 0 1px var(--muted);flex-direction:column;align-items:stretch;gap:0;\n  width:100%;max-width:420px;text-align:left;padding:16px;border-radius:var(--one-connect-radius,14px)}\n.b[data-variant="block"][data-full-width]{max-width:none}\n.stack{display:inline-flex;align-items:center;flex-shrink:0}\n.chip{width:var(--chip);height:var(--chip);border-radius:6px;display:grid;place-items:center;overflow:hidden;\n  margin-left:-7px;position:relative;background:${k};color:${y};box-shadow:0 0 0 1.5px var(--bg);\n  transition:margin-left .28s var(--ease)}\n.chip:first-child{margin-left:0}\n.b[data-variant="block"] .chip{box-shadow:0 0 0 1.5px var(--bg),0 0 0 2.5px var(--line)}\n.chip img{width:var(--logo);height:var(--logo);display:block;object-fit:contain}\n.chip.more,.chip.letter{font:500 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}\n.chip.letter{font-size:10px;font-weight:600}\n.b:hover .chip{margin-left:-2px}.b:hover .chip:first-child{margin-left:0}\n.label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.icon{display:inline-flex;flex-shrink:0}\n.arrow{opacity:.55;transition:transform .2s var(--ease),opacity .2s var(--ease)}\n.b:hover .arrow{transform:translateX(2px);opacity:.85}\n.spinner{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;\n  opacity:.7;animation:spin .7s linear infinite;flex-shrink:0}\n@keyframes spin{to{transform:rotate(360deg)}}\n.top{display:flex;align-items:center;justify-content:space-between;gap:12px}\n.title{font-size:15px;font-weight:600;letter-spacing:-.01em}\n.sub{font-size:13px;line-height:1.5;margin-top:6px;font-weight:400;color:var(--muted)}\n.foot{margin-top:14px;padding-top:12px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:400;\n  color:var(--muted);border-top:1px solid var(--line)}\n.lockup{display:inline-flex;color:var(--surface-fg)}\n.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n@media (prefers-reduced-motion:reduce){.b,.chip,.arrow{transition:none}.spinner{animation-duration:1.6s}}\n@media (forced-colors:active){.b{border:1px solid ButtonText}.b:focus-visible{outline-color:Highlight}}\n`;let S=null;const L=(e,t,n)=>{const o=document.createElement(e);return t&&(o.className=t),void 0!==n&&(o.textContent=n),o},E=(e,t="icon")=>{const n=L("span",t);return n.innerHTML=e,n};function z(e){var t;const n=(null!=(o=null!==(t=e.logos)&&void 0!==t?t:e.platforms)?o:[]).map(m).filter(e=>null!==e);var o;if(0===n.length)return null;const i=L("span","stack");i.setAttribute("aria-hidden","true");for(const e of n.slice(0,3)){const t=L("span","chip");t.title=e.name;const n=L("img");n.alt="",n.decoding="async",n.src=e.imageUrl,n.addEventListener("error",()=>{n.remove(),t.classList.add("letter"),t.textContent=e.name.charAt(0).toUpperCase()}),t.appendChild(n),i.appendChild(t)}const r=n.length-3;return r>0&&i.appendChild(L("span","chip more",`+${r}`)),i}const F=(e,t)=>({authorizeUrl:e.authorizeUrl,connectTheme:e.connectTheme,connector:e.connector,returnTo:e.returnTo,...t});function M(e,t){var n;const o=null!==(n=e.shadowRoot)&&void 0!==n?n:e.attachShadow({mode:"open"});!function(e){if("undefined"!=typeof CSSStyleSheet&&"replaceSync"in CSSStyleSheet.prototype&&"adoptedStyleSheets"in e)try{return S||(S=new CSSStyleSheet,S.replaceSync(A)),void(e.adoptedStyleSheets=[S])}catch{}const t=document.createElement("style");t.textContent=A,e.appendChild(t)}(o);let i=t,r=!1,a=!1,l=null;const s=L("button","b");s.type="button",s.setAttribute("part","button");const c=L("span","sr");c.setAttribute("role","status"),c.setAttribute("aria-live","polite"),o.append(s,c);const d=()=>{return r?"connecting":void 0!==i.connected?i.connected?"connected":"idle":"success"===(null===(e=u())||void 0===e?void 0:e.status)?"connected":"idle";var e},p={onSuccess:()=>{var e,t;return null===(e=(t=i).onSuccess)||void 0===e?void 0:e.call(t)},onError:(e,t)=>{var n,o;return null===(n=(o=i).onError)||void 0===n?void 0:n.call(o,e,t)},onCancel:()=>{var e,t;r=!1,f(),null===(e=(t=i).onCancel)||void 0===e||e.call(t)}},C=h(F(i,p)),f=()=>{var e,t,n,o,r;if(a)return;const u=d(),p=null!==(e=i.variant)&&void 0!==e?e:"default",h="connecting"===u?"Connecting…":"connected"===u?null!==(t=i.connectedLabel)&&void 0!==t?t:"Connected":null!==(n=i.label)&&void 0!==n?n:"Connect your apps";s.dataset.variant=p,s.dataset.size=null!==(o=i.size)&&void 0!==o?o:"md",s.dataset.theme=null!==(r=i.theme)&&void 0!==r?r:"light",s.dataset.state=u,s.toggleAttribute("data-full-width",Boolean(i.fullWidth)),s.disabled=Boolean(i.disabled),s.setAttribute("aria-busy",String("connecting"===u)),"connecting"===u?s.setAttribute("aria-disabled","true"):s.removeAttribute("aria-disabled");const C="idle"===u?z(i):null,f="connecting"===u?L("span","spinner"):"connected"===u?E('<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M3 8.5l3.5 3.5L13 5"/></svg>'):C;if(s.replaceChildren(),s.removeAttribute("aria-labelledby"),s.removeAttribute("aria-describedby"),"block"===p){const e=L("span","top"),t=L("span","title",h);if(t.id="one-connect-title",t.setAttribute("part","label"),e.appendChild(t),f&&e.appendChild(f),s.appendChild(e),s.setAttribute("aria-labelledby",t.id),i.description){const e=L("span","sub",i.description);e.id="one-connect-description",s.appendChild(e),s.setAttribute("aria-describedby",e.id)}const n=L("span","foot");n.setAttribute("aria-hidden","true"),n.append(L("span","","Secured by"),E('<svg viewBox="0 0 3152 990" width="35" height="11" fill="none" aria-hidden="true" focusable="false"><path d="M1698.02 793.203C1525.75 793.203 1401 666.834 1401 495.102C1401 323.909 1524.67 197 1698.02 197C1870.83 197 1996.12 323.909 1996.12 495.102C1996.12 666.834 1869.75 793.203 1698.02 793.203ZM1698.02 694.916C1801.71 694.916 1884.88 615.53 1884.88 495.102C1884.88 374.133 1801.71 295.827 1698.02 295.827C1594.87 295.827 1511.71 373.053 1511.71 495.102C1511.71 616.61 1595.41 694.916 1698.02 694.916Z" fill="currentColor"/><path d="M2326.71 197.54C2480.62 197.54 2565.95 289.887 2565.95 467.56V779.702H2455.24V468.64C2455.24 361.172 2411.5 292.587 2308.35 292.587C2217.63 292.587 2140.4 356.852 2140.4 484.841V779.702H2030.77V211.041H2140.4V272.065C2185.76 225.082 2248.41 197.54 2326.71 197.54Z" fill="currentColor"/><path d="M3151.98 493.481C3151.98 514.003 3150.36 520.483 3148.74 529.124H2700.51C2715.63 637.672 2794.47 686.815 2922.46 686.815C3031.01 686.815 3099.6 650.633 3116.88 643.072V747.84C3100.68 755.4 3023.45 793.203 2908.96 793.203C2699.97 793.203 2588.18 661.434 2588.18 497.802C2588.18 332.55 2702.67 197 2871.7 197C3031.55 197 3151.98 317.969 3151.98 493.481ZM2876.02 300.688C2784.75 300.688 2720.49 345.511 2702.67 434.617H3050.45C3034.79 344.971 2967.29 300.688 2876.02 300.688Z" fill="currentColor"/><path d="M537.494 782.175C641.011 827.7 767.922 858.83 880.501 839.875C983.155 822.599 1069.64 764.946 1094.39 659.271C1114.47 573.493 1088.54 481.273 1047.27 405.311C983.124 287.246 874.768 183.791 759.847 114.657C644.926 45.5225 507.181 -5.02605 372.102 0.398669C289.698 3.69665 205.938 26.536 146.544 85.6685C112.069 119.989 88.3818 171.231 83.1266 219.823C78.1642 265.64 84.3749 310.317 99.8478 354.007C168.243 547.14 354.009 701.467 537.51 782.191L537.494 782.175ZM751.956 818.053C583.05 796.2 415.7 707.108 292.472 593.004C222.536 528.246 159.366 444.979 125.985 355.471C102.961 293.734 96.3956 223.367 122.41 161.969C137.158 127.14 160.367 98.244 190.743 75.9133C275.581 13.5752 395.819 6.99464 495.977 26.8596C608.848 49.252 713.875 99.4615 806.712 166.515C907.085 239.025 999.537 339.922 1048.42 454.627C1072.45 511.001 1083.99 570.103 1075.64 630.869C1067.38 690.957 1034.57 742.353 983.987 775.379C917.626 818.715 830.861 828.255 751.972 818.053H751.956Z" fill="currentColor"/><path d="M1103.27 661.228C1086.68 755.313 1024.9 818.622 934.021 848.69C821.751 885.846 685.146 860.263 576.251 818.915C452.515 771.942 340.336 699.91 245.157 607.813C209.002 572.83 177.255 534.456 148.837 493.031C100.384 422.402 61.7024 335.19 65.8326 248.071C68.2213 197.769 83.987 159.241 111.403 116.938C45.8289 171.308 31.404 262.511 47.1543 342.002C53.4728 373.841 62.9815 403.23 76.528 432.958C100.338 485.202 130.914 532.992 167.747 577.238C255.452 682.573 367.83 765.13 491.073 824.124C614.317 883.118 769.307 920.691 900.471 889.128C985.788 868.601 1061.47 816.095 1090.83 730.856C1098.18 708.71 1104.61 686.564 1103.25 661.244L1103.27 661.228Z" fill="currentColor"/><path d="M883.297 963.502C923.15 947.074 960.877 926.022 988.309 893.967C954.265 917.839 920.931 934.807 882.403 944.993C751.747 979.53 595.123 942.589 474.731 886.57C422.102 862.082 372.617 834.018 325.181 800.591C205.128 715.984 89.4825 597.996 36.7762 458.756C20.2092 414.973 11.7793 370.404 11.5327 323.739C11.4249 302.641 15.4627 283.747 19.0226 263.004C-2.52219 310.486 -3.66265 380.915 5.21419 431.617C32.0605 584.881 147.151 721.146 266.988 813.983C343.443 873.224 436.403 924.913 528.424 954.672C620.444 984.431 713.851 999.426 808.491 983.598C834.459 979.252 858.362 973.781 883.297 963.502Z" fill="currentColor"/><path d="M1045.09 830.737C1053.55 816.158 1061.75 802.95 1066.99 787.061C1043.75 824.541 1013.3 854.408 974.29 874.982C947.752 888.991 920.228 899.27 890.577 905.219C864.578 910.428 839.673 914.481 812.781 914.851C739.716 915.852 668.717 903.092 599.459 880.854C418.686 822.8 238.422 697.6 127.985 543.165C94.8819 496.87 68.8679 447.847 50.7135 394.031C28.1978 324.45 25.7782 258.69 53.4104 189.078C36.1345 211.825 26.9956 237.793 20.4151 264.916C18.3654 282.732 14.713 299.345 15.0828 317.561C15.9613 360.774 23.5436 402.692 38.477 443.562C73.1522 538.464 134.936 621.869 207.368 691.913C307.34 788.587 426.762 862.268 558.127 907.993C689.491 953.718 871.975 973.768 992.614 885.446C1013.28 870.312 1029.39 851.773 1045.07 830.752L1045.09 830.737Z" fill="currentColor"/><path d="M552.552 745.664C671.079 797.831 835.825 835.526 954.768 769.12C999.137 744.354 1031.99 705.626 1047.99 657.312C1086.75 540.264 1020.28 405.817 947.124 315.631C855.536 202.745 729.688 114.516 592.76 66.0323C506.349 35.4412 418.968 22.0797 328.211 37.46C262.313 48.6177 195.29 81.7054 157.563 138.234C118.912 196.133 115.891 270.785 136.758 335.882C176.519 459.926 276.769 570.763 381.01 646.277C434.995 685.391 491.662 718.864 552.567 745.664H552.552ZM210.162 422.955C199.898 402.381 189.141 382.701 184.733 360.385C182.267 347.918 184.625 333.477 184.564 320.64C184.44 293.223 194.072 269.059 209.992 247.93C219.609 235.17 229.456 224.844 243.018 215.906C341.218 151.179 476.051 175.991 576.763 223.904C661.971 264.435 737.394 321.534 796.11 395.862C836.919 447.52 871.193 513.634 880.502 579.501C888.238 634.272 873.243 695.485 826.763 729.189C807.853 742.905 785.045 751.721 761.728 755.974C721.921 763.217 688.802 758.008 649.565 748.916C594.27 736.094 542.488 715.212 492.279 688.889C441.977 662.521 396.745 631.483 353.008 595.436C314.372 563.597 280.252 537.845 248.458 498.007L248.274 497.837L221.504 461.945L211.379 445.84C194.103 418.408 177.398 391.346 165.238 361.202C151.291 326.604 142.676 291.852 143.678 254.279C146.19 160.564 203.766 96.7467 290.238 67.82C434.394 19.5985 611.561 79.4246 735.298 157.636C825.099 214.411 904.435 286.581 963.321 375.134C989.767 414.894 1010.42 456.998 1023.78 502.646C1049.84 591.66 1036.79 685.884 957.404 742.659C890.257 790.68 785.6 793.146 707.295 776.486C680.403 769.736 654.065 766.007 629.222 754.818C732.107 783.93 882.397 797.723 963.938 715.35C990.599 688.412 1007.55 656.218 1013.75 618.537C1020.87 575.232 1016.12 531.634 1002.62 489.931C985.498 437.071 956.34 384.026 922.405 340.289C876.911 281.665 823.188 230.531 762.468 187.981C681.112 130.975 588.783 88.887 490.799 71.0872C425.595 59.2514 349.463 60.4072 287.557 85.0959C256.441 97.5019 228.501 114.5 205.924 138.85C158.303 190.2 147.176 256.036 161.539 323.383C166.856 348.334 175.456 371.296 185.596 394.737C194.488 415.295 222.676 461.883 236.022 477.649L226.729 456.196L210.162 423.001V422.955ZM832.342 286.936C756.904 211.544 666.44 154.076 564.896 120.249C526.553 107.473 487.948 99.4899 447.648 96.084C401.26 92.1696 356.167 96.7313 312.215 111.341C222.337 141.208 169.399 217.277 175.255 312.333C177.567 324.847 179.555 335.774 180.603 348.503C152.971 264.944 174.454 175.236 251.356 125.581C310.797 87.2072 387.39 78.2071 456.694 86.7603C503.714 92.5549 555.387 106.656 599.078 124.317C706.016 167.546 800.764 234.615 876.741 321.395C912.002 361.664 942.085 405.756 963.876 454.532C996.779 528.166 1011.85 610.046 965.895 681.369C952.379 702.359 935.427 718.818 914.283 731.871C884.432 747.421 852.947 758.671 818.872 761.06C839.523 755.959 859.404 750.981 878.637 740.424C929.186 717.061 964.601 671.567 974.818 616.488C987.671 547.245 964.693 475.429 930.881 415.357C903.834 367.305 871.471 326.049 832.311 286.905L832.342 286.936ZM890.673 420.18C861.623 370.387 825.515 327.621 783.288 287.999C721.659 230.161 650.028 185.345 570.598 156.033C513.623 135.013 454.506 124.394 393.786 128.108C353.316 130.59 315.728 139.867 280.498 159.516C245.268 179.166 216.819 204.918 201.023 240.394L188.617 268.242C204.583 180.445 278.325 132.054 361.931 119.355C412.757 111.634 462.658 116.643 512.421 129.048C596.905 150.116 674.1 189.923 743.45 242.028C816.607 296.999 885.526 373.531 924.578 456.982C949.713 510.675 965.094 571.61 949.837 630.234C939.018 671.768 912.511 706.566 875.308 727.987C847.013 744.292 816.191 754.679 783.242 758.101C825.915 745.926 863.75 731.917 895.327 698.799C913.512 679.72 926.535 657.62 933.054 631.714C951.347 558.989 927.49 483.274 890.642 420.134L890.673 420.18ZM726.19 279.369C625.678 198.799 493.404 141.917 362.655 156.973C343.854 159.131 326.547 164.17 308.639 169.195C301.18 171.29 295.201 177.732 286.493 176.253C378.313 130.081 492.063 149.545 583.143 188.119C684.102 230.87 775.952 302.825 840.664 391.069C871.794 433.527 895.805 479.652 909.506 530.386C918.382 563.273 920.232 596.654 911.941 629.294C905.622 654.153 895.481 677.778 875.786 694.9C893.987 666.327 905.452 637.693 907.086 604.128C908.72 570.562 903.141 536.565 891.567 503.57C861.392 417.53 797.066 336.19 726.205 279.384L726.19 279.369Z" fill="currentColor"/></svg>',"lockup")),s.appendChild(n)}else{f&&s.appendChild(f);const e=L("span","label",h);e.setAttribute("part","label"),s.appendChild(e),"idle"===u&&s.appendChild(E('<svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M6 3l5 5-5 5"/></svg>',"icon arrow"))}var b,g;b=u,null!==l?b!==l&&(l=b,c.textContent="connecting"===b?"Connecting to One…":"connected"===b?null!==(g=i.connectedLabel)&&void 0!==g?g:"Connected":""):l=b};return s.addEventListener("click",()=>{a||i.disabled||r||(r=!0,f(),C.open())}),f(),{update:e=>{i=e,C.update(F(i,p)),f()},destroy:()=>{a=!0,C.destroy(),o.replaceChildren()}}}const T=["authorize-url","logos","platforms","connected","disabled","variant","size","full-width","theme","connect-theme","connector","return-to","label","connected-label","description"];function $(e,t,n){const o=e.getAttribute(t);return o&&n.includes(o)?o:void 0}const U=(e,t)=>e.hasAttribute(t)?"false"!==e.getAttribute(t):void 0;function B(){if("undefined"!=typeof window&&"undefined"!=typeof customElements&&!customElements.get("one-connect-button")){class e extends HTMLElement{constructor(...e){super(...e),C(this,"onSuccess",null),C(this,"onError",null),C(this,"onCancel",null),C(this,"handle",null)}connectedCallback(){this.sync()}disconnectedCallback(){var e;null===(e=this.handle)||void 0===e||e.destroy(),this.handle=null}attributeChangedCallback(){this.isConnected&&this.sync()}props(e){var t,n,o,i,r,a;return{authorizeUrl:e,logos:x(null!==(t=this.getAttribute("logos"))&&void 0!==t?t:this.getAttribute("platforms")),connected:U(this,"connected"),disabled:U(this,"disabled"),variant:$(this,"variant",["default","accent","block"]),size:$(this,"size",["sm","md","lg"]),fullWidth:U(this,"full-width"),theme:$(this,"theme",["light","dark","auto"]),connectTheme:$(this,"connect-theme",["light","dark"]),connector:null!==(n=this.getAttribute("connector"))&&void 0!==n?n:void 0,returnTo:null!==(o=this.getAttribute("return-to"))&&void 0!==o?o:void 0,label:null!==(i=this.getAttribute("label"))&&void 0!==i?i:void 0,connectedLabel:null!==(r=this.getAttribute("connected-label"))&&void 0!==r?r:void 0,description:null!==(a=this.getAttribute("description"))&&void 0!==a?a:void 0,onSuccess:()=>{var e;null===(e=this.onSuccess)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("success"))},onError:(e,t)=>{var n;null===(n=this.onError)||void 0===n||n.call(this,e,t),this.dispatchEvent(new CustomEvent("error",{detail:{message:e,code:t}}))},onCancel:()=>{var e;null===(e=this.onCancel)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("cancel"))}}}sync(){const e=this.getAttribute("authorize-url");var t;if(!e)return null===(t=this.handle)||void 0===t||t.destroy(),void(this.handle=null);const n=this.props(e);this.handle?this.handle.update(n):this.handle=M(this,n)}}C(e,"observedAttributes",[...T]),customElements.define("one-connect-button",e)}}B(),exports.createConnectFlow=h,exports.mountConnectButton=function(e,t){const n=document.createElement("span");n.className="one-connect";const o=e=>{var t;n.setAttribute("data-variant",null!==(t=e.variant)&&void 0!==t?t:"default"),n.toggleAttribute("data-full-width",Boolean(e.fullWidth))};o(t),e.appendChild(n);const i=M(n,t);return{update:e=>{o(e),i.update(e)},destroy:()=>{i.destroy(),n.remove()}}},exports.readConnectReturn=u,exports.registerConnectButton=B,exports.renderConnectButton=M;
+"use strict";const e="one_connect",t="one_connect_error",n={declined:"You cancelled the connection.",expired:"The connection attempt expired. Please try again.",failed:"The connection could not be completed. Please try again."};function o(o){const i=new URLSearchParams(o),r=i.get(e);if("success"===r)return{status:r};if("error"!==r)return null;const a=i.get(t),l=null!==(s=a)&&Object.prototype.hasOwnProperty.call(n,s)?a:"failed";var s;return{status:r,code:l,message:n[l]}}const i=[e,t,"one_connect_message"];function r(e){const t=new URLSearchParams(e);return i.some(e=>t.has(e))}let a,l=!1,s=!1,c=!1;const d=[];function p(){return u()}function u(){return"undefined"==typeof window?null:(void 0===a&&(a=o(window.location.search),(a||r(window.location.search))&&function(){const e=()=>{r(window.location.search)&&window.history.replaceState(window.history.state,"",function(e){const t=new URLSearchParams(e.search);for(const e of i)t.delete(e);const n=t.toString();return`${e.pathname}${n?`?${n}`:""}${e.hash}`}(window.location))};e();for(const t of[50,500,2e3])window.setTimeout(e,t)}()),a)}function h(e){let t=e,n=!1;const o={deliver:e=>{try{var n,o,i,r,a,l;"success"===e.status?null===(n=(o=t).onSuccess)||void 0===n||n.call(o):null===(i=(r=t).onError)||void 0===i||i.call(r,null!==(a=e.message)&&void 0!==a?a:"",null!==(l=e.code)&&void 0!==l?l:"failed")}catch{}},restored:()=>{if(n){n=!1;try{var e,o;null===(e=(o=t).onCancel)||void 0===e||e.call(o)}catch{}}}};return"undefined"!=typeof window&&(d.push(o),c||"undefined"==typeof window||(c=!0,window.addEventListener("pageshow",e=>{if(e.persisted)for(const e of[...d])e.restored()})),function(){if(l||s)return;const e=u();e&&(s=!0,window.setTimeout(()=>{s=!1;const t=d[0];t&&!l&&(l=!0,t.deliver(e))},0))}()),{open:()=>{"undefined"!=typeof window&&(n=!0,window.location.assign((e=>{try{var t,n;const o=new URL(e.authorizeUrl,window.location.origin);e.returnTo&&o.searchParams.set("one_return_to",e.returnTo);const i=new URLSearchParams;e.connectTheme&&i.set("one_theme",e.connectTheme);const r=null===(t=null!==(n=e.openApp)&&void 0!==n?n:e.connector)||void 0===t?void 0:t.trim().toLowerCase();r&&i.set("one_open_app",r);const a=i.toString();return a&&(o.hash=a),o.toString()}catch{return e.authorizeUrl}})(t)))},update:e=>{t=e},destroy:()=>{const e=d.indexOf(o);e>=0&&d.splice(e,1)}}}function C(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t);if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e){return e.trim().toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}const b={"cal-com":"Cal.com","click-up":"ClickUp",clickup:"ClickUp",docusign:"DocuSign",elevenlabs:"ElevenLabs","fireflies-ai":"Fireflies.ai",github:"GitHub",gitlab:"GitLab",hubspot:"HubSpot","linked-in":"LinkedIn",linkedin:"LinkedIn","one-drive":"OneDrive",onedrive:"OneDrive",openai:"OpenAI","otter-ai":"Otter.ai",paypal:"PayPal",posthog:"PostHog",quickbooks:"QuickBooks",sharepoint:"SharePoint","spotify-web":"Spotify",teams:"Microsoft Teams","telegram-bot":"Telegram","whatsapp-business":"WhatsApp Business",woocommerce:"WooCommerce",x:"X","youtube-data":"YouTube",youtube:"YouTube"};function v(e){var t;return null!==(t=b[e])&&void 0!==t?t:e.split(/[-_]+/).filter(Boolean).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}function g(e){return e?`https://assets.withone.ai/connectors/${e}.svg`:""}function m(e){var t,n,o,i;const r="string"==typeof e?{slug:e}:e,a=null!==(t=r.slug)&&void 0!==t&&t.trim()?f(r.slug):null!==(n=r.name)&&void 0!==n&&n.trim()?f(r.name):"";return a?{slug:a,name:(null===(o=r.name)||void 0===o?void 0:o.trim())||v(a),imageUrl:(null===(i=r.imageUrl)||void 0===i?void 0:i.trim())||g(a)}:null}function x(e){const t=null==e?void 0:e.trim();if(!t)return[];if(t.startsWith("["))try{const e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>"string"==typeof e||"object"==typeof e&&null!==e):[]}catch{return[]}return t.split(",").map(e=>e.trim()).filter(Boolean)}const w="#CCFF00",y="#0A0C0B",k="#FFFFFF",A=`\n:host{display:inline-block;vertical-align:middle;max-width:100%}\n:host([data-full-width]),:host([full-width]:not([full-width="false"])),\n:host([data-variant="block"]),:host([variant="block"]){display:block;width:100%}\n.b{all:unset;box-sizing:border-box;position:relative;display:inline-flex;align-items:center;gap:var(--gap);\n  max-width:100%;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;\n  font-family:var(--one-connect-font,inherit);font-size:var(--fs);font-weight:500;line-height:1.2;letter-spacing:-.01em;\n  padding:var(--pad);border-radius:var(--one-connect-radius,12px);background:var(--bg);color:var(--fg);\n  box-shadow:var(--shadow);transition:box-shadow .2s var(--ease),background-color .2s var(--ease),opacity .2s var(--ease)}\n.b[data-full-width]{display:flex;width:100%;justify-content:center}\n.b:focus-visible{outline:2px solid var(--ring);outline-offset:2px}\n.b:hover{box-shadow:var(--shadow-hover)}\n.b[disabled]{cursor:not-allowed;opacity:.5;box-shadow:none}\n.b[aria-busy="true"]{cursor:progress}\n.b{--ease:cubic-bezier(.2,.9,.25,1)}\n.b[data-size="sm"]{--fs:13px;--pad:8px 12px 8px 10px;--gap:8px;--chip:18px;--logo:12px}\n.b[data-size="md"]{--fs:14.5px;--pad:12px 16px 12px 14px;--gap:12px;--chip:22px;--logo:14px}\n.b[data-size="lg"]{--fs:16px;--pad:14px 20px 14px 16px;--gap:12px;--chip:26px;--logo:16px}\n.b[data-theme="light"],.b[data-theme="auto"]{--ink-bg:${y};--ink-fg:${k};--surface:${k};--surface-fg:${y};\n  --muted:#5B6560;--line:#D5DAD7;--ring:${y};--shadow-base:0 1px 2px rgba(10,12,11,.08),0 4px 14px rgba(10,12,11,.06);\n  --shadow-strong:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.1)}\n.b[data-theme="dark"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}\n@media (prefers-color-scheme:dark){.b[data-theme="auto"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}}\n.b[data-variant="default"]{--bg:var(--ink-bg);--fg:var(--ink-fg);--shadow:var(--shadow-base);--shadow-hover:var(--shadow-strong)}\n.b[data-variant="accent"]{--bg:var(--one-connect-accent,${w});--fg:var(--one-connect-accent-fg,${y});\n  --shadow:0 1px 2px rgba(10,12,11,.1);--shadow-hover:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.12)}\n.b[data-variant="block"]{--bg:var(--surface);--fg:var(--surface-fg);--shadow:inset 0 0 0 1px var(--line);\n  --shadow-hover:inset 0 0 0 1px var(--muted);flex-direction:column;align-items:stretch;gap:0;\n  width:100%;max-width:420px;text-align:left;padding:16px;border-radius:var(--one-connect-radius,14px)}\n.b[data-variant="block"][data-full-width]{max-width:none}\n.stack{display:inline-flex;align-items:center;flex-shrink:0}\n.chip{width:var(--chip);height:var(--chip);border-radius:6px;display:grid;place-items:center;overflow:hidden;\n  margin-left:-7px;position:relative;background:${k};color:${y};box-shadow:0 0 0 1.5px var(--bg);\n  transition:margin-left .28s var(--ease)}\n.chip:first-child{margin-left:0}\n.b[data-variant="block"] .chip{box-shadow:0 0 0 1.5px var(--bg),0 0 0 2.5px var(--line)}\n.chip img{width:var(--logo);height:var(--logo);display:block;object-fit:contain}\n.chip.more,.chip.letter{font:500 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}\n.chip.letter{font-size:10px;font-weight:600}\n.b:hover .chip{margin-left:-2px}.b:hover .chip:first-child{margin-left:0}\n.label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.icon{display:inline-flex;flex-shrink:0}\n.arrow{opacity:.55;transition:transform .2s var(--ease),opacity .2s var(--ease)}\n.b:hover .arrow{transform:translateX(2px);opacity:.85}\n.spinner{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;\n  opacity:.7;animation:spin .7s linear infinite;flex-shrink:0}\n@keyframes spin{to{transform:rotate(360deg)}}\n.top{display:flex;align-items:center;justify-content:space-between;gap:12px}\n.title{font-size:15px;font-weight:600;letter-spacing:-.01em}\n.sub{font-size:13px;line-height:1.5;margin-top:6px;font-weight:400;color:var(--muted)}\n.foot{margin-top:14px;padding-top:12px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:400;\n  color:var(--muted);border-top:1px solid var(--line)}\n.lockup{display:inline-flex;color:var(--surface-fg)}\n.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n@media (prefers-reduced-motion:reduce){.b,.chip,.arrow{transition:none}.spinner{animation-duration:1.6s}}\n@media (forced-colors:active){.b{border:1px solid ButtonText}.b:focus-visible{outline-color:Highlight}}\n`;let S=null;const L=(e,t,n)=>{const o=document.createElement(e);return t&&(o.className=t),void 0!==n&&(o.textContent=n),o},E=(e,t="icon")=>{const n=L("span",t);return n.innerHTML=e,n};function T(e){const t=(null!=(n=e.logos)?n:[]).map(m).filter(e=>null!==e);var n;if(0===t.length)return null;const o=L("span","stack");o.setAttribute("aria-hidden","true");for(const e of t.slice(0,3)){const t=L("span","chip");t.title=e.name;const n=L("img");n.alt="",n.decoding="async",n.src=e.imageUrl,n.addEventListener("error",()=>{n.remove(),t.classList.add("letter"),t.textContent=e.name.charAt(0).toUpperCase()}),t.appendChild(n),o.appendChild(t)}const i=t.length-3;return i>0&&o.appendChild(L("span","chip more",`+${i}`)),o}const z=e=>{var t;return null!==(t=e.variant)&&void 0!==t?t:e.accent?"accent":"default"};function F(e,t){var n,o;const i=null===(n=t.accent)||void 0===n?void 0:n.trim(),r=(null===(o=t.accentText)||void 0===o?void 0:o.trim())||(i?function(e){const t=e.trim().replace(/^#/,""),n=3===t.length?t.split("").map(e=>e+e).join(""):t;if(!/^[0-9a-f]{6}$/i.test(n))return null;const o=e=>{const t=parseInt(n.slice(e,e+2),16)/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4},i=.2126*o(0)+.7152*o(2)+.0722*o(4);return(i+.05)/(.0037+.05)>=1.05/(i+.05)?y:k}(i):null);i?e.style.setProperty("--one-connect-accent",i):e.style.removeProperty("--one-connect-accent"),r?e.style.setProperty("--one-connect-accent-fg",r):e.style.removeProperty("--one-connect-accent-fg"),e.getAttribute("style")||e.removeAttribute("style")}const M=(e,t)=>{var n;return{authorizeUrl:e.authorizeUrl,connectTheme:e.connectTheme,openApp:null!==(n=e.openApp)&&void 0!==n?n:e.connector,returnTo:e.returnTo,...t}};function $(e,t){var n;const o=null!==(n=e.shadowRoot)&&void 0!==n?n:e.attachShadow({mode:"open"});!function(e){if("undefined"!=typeof CSSStyleSheet&&"replaceSync"in CSSStyleSheet.prototype&&"adoptedStyleSheets"in e)try{return S||(S=new CSSStyleSheet,S.replaceSync(A)),void(e.adoptedStyleSheets=[S])}catch{}const t=document.createElement("style");t.textContent=A,e.appendChild(t)}(o);let i=t,r=!1,a=!1,l=null;const s=L("button","b");s.type="button",s.setAttribute("part","button");const c=L("span","sr");c.setAttribute("role","status"),c.setAttribute("aria-live","polite"),o.append(s,c);const d=()=>{return r?"connecting":void 0!==i.connected?i.connected?"connected":"idle":"success"===(null===(e=p())||void 0===e?void 0:e.status)?"connected":"idle";var e},u={onSuccess:()=>{var e,t;return null===(e=(t=i).onSuccess)||void 0===e?void 0:e.call(t)},onError:(e,t)=>{var n,o;return null===(n=(o=i).onError)||void 0===n?void 0:n.call(o,e,t)},onCancel:()=>{var e,t;r=!1,f(),null===(e=(t=i).onCancel)||void 0===e||e.call(t)}},C=h(M(i,u)),f=()=>{var e,t,n,o;if(a)return;const r=d(),p=z(i),u="connecting"===r?"Connecting…":"connected"===r?null!==(e=i.connectedLabel)&&void 0!==e?e:"Connected":null!==(t=i.label)&&void 0!==t?t:"Connect your apps";s.dataset.variant=p,F(s,i),s.dataset.size=null!==(n=i.size)&&void 0!==n?n:"md",s.dataset.theme=null!==(o=i.theme)&&void 0!==o?o:"light",s.dataset.state=r,s.toggleAttribute("data-full-width",Boolean(i.fullWidth)),s.disabled=Boolean(i.disabled),s.setAttribute("aria-busy",String("connecting"===r)),"connecting"===r?s.setAttribute("aria-disabled","true"):s.removeAttribute("aria-disabled");const h="idle"===r?T(i):null,C="connecting"===r?L("span","spinner"):"connected"===r?E('<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M3 8.5l3.5 3.5L13 5"/></svg>'):h;if(s.replaceChildren(),s.removeAttribute("aria-labelledby"),s.removeAttribute("aria-describedby"),"block"===p){const e=L("span","top"),t=L("span","title",u);if(t.id="one-connect-title",t.setAttribute("part","label"),e.appendChild(t),C&&e.appendChild(C),s.appendChild(e),s.setAttribute("aria-labelledby",t.id),i.description){const e=L("span","sub",i.description);e.id="one-connect-description",s.appendChild(e),s.setAttribute("aria-describedby",e.id)}const n=L("span","foot");n.setAttribute("aria-hidden","true"),n.append(L("span","","Secured by"),E('<svg viewBox="0 0 3152 990" width="35" height="11" fill="none" aria-hidden="true" focusable="false"><path d="M1698.02 793.203C1525.75 793.203 1401 666.834 1401 495.102C1401 323.909 1524.67 197 1698.02 197C1870.83 197 1996.12 323.909 1996.12 495.102C1996.12 666.834 1869.75 793.203 1698.02 793.203ZM1698.02 694.916C1801.71 694.916 1884.88 615.53 1884.88 495.102C1884.88 374.133 1801.71 295.827 1698.02 295.827C1594.87 295.827 1511.71 373.053 1511.71 495.102C1511.71 616.61 1595.41 694.916 1698.02 694.916Z" fill="currentColor"/><path d="M2326.71 197.54C2480.62 197.54 2565.95 289.887 2565.95 467.56V779.702H2455.24V468.64C2455.24 361.172 2411.5 292.587 2308.35 292.587C2217.63 292.587 2140.4 356.852 2140.4 484.841V779.702H2030.77V211.041H2140.4V272.065C2185.76 225.082 2248.41 197.54 2326.71 197.54Z" fill="currentColor"/><path d="M3151.98 493.481C3151.98 514.003 3150.36 520.483 3148.74 529.124H2700.51C2715.63 637.672 2794.47 686.815 2922.46 686.815C3031.01 686.815 3099.6 650.633 3116.88 643.072V747.84C3100.68 755.4 3023.45 793.203 2908.96 793.203C2699.97 793.203 2588.18 661.434 2588.18 497.802C2588.18 332.55 2702.67 197 2871.7 197C3031.55 197 3151.98 317.969 3151.98 493.481ZM2876.02 300.688C2784.75 300.688 2720.49 345.511 2702.67 434.617H3050.45C3034.79 344.971 2967.29 300.688 2876.02 300.688Z" fill="currentColor"/><path d="M537.494 782.175C641.011 827.7 767.922 858.83 880.501 839.875C983.155 822.599 1069.64 764.946 1094.39 659.271C1114.47 573.493 1088.54 481.273 1047.27 405.311C983.124 287.246 874.768 183.791 759.847 114.657C644.926 45.5225 507.181 -5.02605 372.102 0.398669C289.698 3.69665 205.938 26.536 146.544 85.6685C112.069 119.989 88.3818 171.231 83.1266 219.823C78.1642 265.64 84.3749 310.317 99.8478 354.007C168.243 547.14 354.009 701.467 537.51 782.191L537.494 782.175ZM751.956 818.053C583.05 796.2 415.7 707.108 292.472 593.004C222.536 528.246 159.366 444.979 125.985 355.471C102.961 293.734 96.3956 223.367 122.41 161.969C137.158 127.14 160.367 98.244 190.743 75.9133C275.581 13.5752 395.819 6.99464 495.977 26.8596C608.848 49.252 713.875 99.4615 806.712 166.515C907.085 239.025 999.537 339.922 1048.42 454.627C1072.45 511.001 1083.99 570.103 1075.64 630.869C1067.38 690.957 1034.57 742.353 983.987 775.379C917.626 818.715 830.861 828.255 751.972 818.053H751.956Z" fill="currentColor"/><path d="M1103.27 661.228C1086.68 755.313 1024.9 818.622 934.021 848.69C821.751 885.846 685.146 860.263 576.251 818.915C452.515 771.942 340.336 699.91 245.157 607.813C209.002 572.83 177.255 534.456 148.837 493.031C100.384 422.402 61.7024 335.19 65.8326 248.071C68.2213 197.769 83.987 159.241 111.403 116.938C45.8289 171.308 31.404 262.511 47.1543 342.002C53.4728 373.841 62.9815 403.23 76.528 432.958C100.338 485.202 130.914 532.992 167.747 577.238C255.452 682.573 367.83 765.13 491.073 824.124C614.317 883.118 769.307 920.691 900.471 889.128C985.788 868.601 1061.47 816.095 1090.83 730.856C1098.18 708.71 1104.61 686.564 1103.25 661.244L1103.27 661.228Z" fill="currentColor"/><path d="M883.297 963.502C923.15 947.074 960.877 926.022 988.309 893.967C954.265 917.839 920.931 934.807 882.403 944.993C751.747 979.53 595.123 942.589 474.731 886.57C422.102 862.082 372.617 834.018 325.181 800.591C205.128 715.984 89.4825 597.996 36.7762 458.756C20.2092 414.973 11.7793 370.404 11.5327 323.739C11.4249 302.641 15.4627 283.747 19.0226 263.004C-2.52219 310.486 -3.66265 380.915 5.21419 431.617C32.0605 584.881 147.151 721.146 266.988 813.983C343.443 873.224 436.403 924.913 528.424 954.672C620.444 984.431 713.851 999.426 808.491 983.598C834.459 979.252 858.362 973.781 883.297 963.502Z" fill="currentColor"/><path d="M1045.09 830.737C1053.55 816.158 1061.75 802.95 1066.99 787.061C1043.75 824.541 1013.3 854.408 974.29 874.982C947.752 888.991 920.228 899.27 890.577 905.219C864.578 910.428 839.673 914.481 812.781 914.851C739.716 915.852 668.717 903.092 599.459 880.854C418.686 822.8 238.422 697.6 127.985 543.165C94.8819 496.87 68.8679 447.847 50.7135 394.031C28.1978 324.45 25.7782 258.69 53.4104 189.078C36.1345 211.825 26.9956 237.793 20.4151 264.916C18.3654 282.732 14.713 299.345 15.0828 317.561C15.9613 360.774 23.5436 402.692 38.477 443.562C73.1522 538.464 134.936 621.869 207.368 691.913C307.34 788.587 426.762 862.268 558.127 907.993C689.491 953.718 871.975 973.768 992.614 885.446C1013.28 870.312 1029.39 851.773 1045.07 830.752L1045.09 830.737Z" fill="currentColor"/><path d="M552.552 745.664C671.079 797.831 835.825 835.526 954.768 769.12C999.137 744.354 1031.99 705.626 1047.99 657.312C1086.75 540.264 1020.28 405.817 947.124 315.631C855.536 202.745 729.688 114.516 592.76 66.0323C506.349 35.4412 418.968 22.0797 328.211 37.46C262.313 48.6177 195.29 81.7054 157.563 138.234C118.912 196.133 115.891 270.785 136.758 335.882C176.519 459.926 276.769 570.763 381.01 646.277C434.995 685.391 491.662 718.864 552.567 745.664H552.552ZM210.162 422.955C199.898 402.381 189.141 382.701 184.733 360.385C182.267 347.918 184.625 333.477 184.564 320.64C184.44 293.223 194.072 269.059 209.992 247.93C219.609 235.17 229.456 224.844 243.018 215.906C341.218 151.179 476.051 175.991 576.763 223.904C661.971 264.435 737.394 321.534 796.11 395.862C836.919 447.52 871.193 513.634 880.502 579.501C888.238 634.272 873.243 695.485 826.763 729.189C807.853 742.905 785.045 751.721 761.728 755.974C721.921 763.217 688.802 758.008 649.565 748.916C594.27 736.094 542.488 715.212 492.279 688.889C441.977 662.521 396.745 631.483 353.008 595.436C314.372 563.597 280.252 537.845 248.458 498.007L248.274 497.837L221.504 461.945L211.379 445.84C194.103 418.408 177.398 391.346 165.238 361.202C151.291 326.604 142.676 291.852 143.678 254.279C146.19 160.564 203.766 96.7467 290.238 67.82C434.394 19.5985 611.561 79.4246 735.298 157.636C825.099 214.411 904.435 286.581 963.321 375.134C989.767 414.894 1010.42 456.998 1023.78 502.646C1049.84 591.66 1036.79 685.884 957.404 742.659C890.257 790.68 785.6 793.146 707.295 776.486C680.403 769.736 654.065 766.007 629.222 754.818C732.107 783.93 882.397 797.723 963.938 715.35C990.599 688.412 1007.55 656.218 1013.75 618.537C1020.87 575.232 1016.12 531.634 1002.62 489.931C985.498 437.071 956.34 384.026 922.405 340.289C876.911 281.665 823.188 230.531 762.468 187.981C681.112 130.975 588.783 88.887 490.799 71.0872C425.595 59.2514 349.463 60.4072 287.557 85.0959C256.441 97.5019 228.501 114.5 205.924 138.85C158.303 190.2 147.176 256.036 161.539 323.383C166.856 348.334 175.456 371.296 185.596 394.737C194.488 415.295 222.676 461.883 236.022 477.649L226.729 456.196L210.162 423.001V422.955ZM832.342 286.936C756.904 211.544 666.44 154.076 564.896 120.249C526.553 107.473 487.948 99.4899 447.648 96.084C401.26 92.1696 356.167 96.7313 312.215 111.341C222.337 141.208 169.399 217.277 175.255 312.333C177.567 324.847 179.555 335.774 180.603 348.503C152.971 264.944 174.454 175.236 251.356 125.581C310.797 87.2072 387.39 78.2071 456.694 86.7603C503.714 92.5549 555.387 106.656 599.078 124.317C706.016 167.546 800.764 234.615 876.741 321.395C912.002 361.664 942.085 405.756 963.876 454.532C996.779 528.166 1011.85 610.046 965.895 681.369C952.379 702.359 935.427 718.818 914.283 731.871C884.432 747.421 852.947 758.671 818.872 761.06C839.523 755.959 859.404 750.981 878.637 740.424C929.186 717.061 964.601 671.567 974.818 616.488C987.671 547.245 964.693 475.429 930.881 415.357C903.834 367.305 871.471 326.049 832.311 286.905L832.342 286.936ZM890.673 420.18C861.623 370.387 825.515 327.621 783.288 287.999C721.659 230.161 650.028 185.345 570.598 156.033C513.623 135.013 454.506 124.394 393.786 128.108C353.316 130.59 315.728 139.867 280.498 159.516C245.268 179.166 216.819 204.918 201.023 240.394L188.617 268.242C204.583 180.445 278.325 132.054 361.931 119.355C412.757 111.634 462.658 116.643 512.421 129.048C596.905 150.116 674.1 189.923 743.45 242.028C816.607 296.999 885.526 373.531 924.578 456.982C949.713 510.675 965.094 571.61 949.837 630.234C939.018 671.768 912.511 706.566 875.308 727.987C847.013 744.292 816.191 754.679 783.242 758.101C825.915 745.926 863.75 731.917 895.327 698.799C913.512 679.72 926.535 657.62 933.054 631.714C951.347 558.989 927.49 483.274 890.642 420.134L890.673 420.18ZM726.19 279.369C625.678 198.799 493.404 141.917 362.655 156.973C343.854 159.131 326.547 164.17 308.639 169.195C301.18 171.29 295.201 177.732 286.493 176.253C378.313 130.081 492.063 149.545 583.143 188.119C684.102 230.87 775.952 302.825 840.664 391.069C871.794 433.527 895.805 479.652 909.506 530.386C918.382 563.273 920.232 596.654 911.941 629.294C905.622 654.153 895.481 677.778 875.786 694.9C893.987 666.327 905.452 637.693 907.086 604.128C908.72 570.562 903.141 536.565 891.567 503.57C861.392 417.53 797.066 336.19 726.205 279.384L726.19 279.369Z" fill="currentColor"/></svg>',"lockup")),s.appendChild(n)}else{C&&s.appendChild(C);const e=L("span","label",u);e.setAttribute("part","label"),s.appendChild(e),"idle"===r&&s.appendChild(E('<svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M6 3l5 5-5 5"/></svg>',"icon arrow"))}var f,b;f=r,null!==l?f!==l&&(l=f,c.textContent="connecting"===f?"Connecting to One…":"connected"===f?null!==(b=i.connectedLabel)&&void 0!==b?b:"Connected":""):l=f};return s.addEventListener("click",()=>{a||i.disabled||r||(r=!0,f(),C.open())}),f(),{update:e=>{i=e,C.update(M(i,u)),f()},destroy:()=>{a=!0,C.destroy(),o.replaceChildren()}}}const P=["authorize-url","logos","connected","disabled","variant","size","full-width","theme","connect-theme","open-app","connector","return-to","label","connected-label","description","accent","accent-text"];function U(e,t,n){const o=e.getAttribute(t);return o&&n.includes(o)?o:void 0}const B=(e,t)=>e.hasAttribute(t)?"false"!==e.getAttribute(t):void 0;function Z(){if("undefined"!=typeof window&&"undefined"!=typeof customElements&&!customElements.get("one-connect-button")){class e extends HTMLElement{constructor(...e){super(...e),C(this,"onSuccess",null),C(this,"onError",null),C(this,"onCancel",null),C(this,"handle",null)}connectedCallback(){this.sync()}disconnectedCallback(){var e;null===(e=this.handle)||void 0===e||e.destroy(),this.handle=null}attributeChangedCallback(){this.isConnected&&this.sync()}props(e){var t,n,o,i,r,a,l,s;return{authorizeUrl:e,logos:x(this.getAttribute("logos")),connected:B(this,"connected"),disabled:B(this,"disabled"),variant:U(this,"variant",["default","accent","block"]),size:U(this,"size",["sm","md","lg"]),fullWidth:B(this,"full-width"),theme:U(this,"theme",["light","dark","auto"]),connectTheme:U(this,"connect-theme",["light","dark"]),openApp:null!==(t=null!==(n=this.getAttribute("open-app"))&&void 0!==n?n:this.getAttribute("connector"))&&void 0!==t?t:void 0,returnTo:null!==(o=this.getAttribute("return-to"))&&void 0!==o?o:void 0,label:null!==(i=this.getAttribute("label"))&&void 0!==i?i:void 0,connectedLabel:null!==(r=this.getAttribute("connected-label"))&&void 0!==r?r:void 0,description:null!==(a=this.getAttribute("description"))&&void 0!==a?a:void 0,accent:null!==(l=this.getAttribute("accent"))&&void 0!==l?l:void 0,accentText:null!==(s=this.getAttribute("accent-text"))&&void 0!==s?s:void 0,onSuccess:()=>{var e;null===(e=this.onSuccess)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("success"))},onError:(e,t)=>{var n;null===(n=this.onError)||void 0===n||n.call(this,e,t),this.dispatchEvent(new CustomEvent("error",{detail:{message:e,code:t}}))},onCancel:()=>{var e;null===(e=this.onCancel)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("cancel"))}}}sync(){const e=this.getAttribute("authorize-url");var t;if(!e)return null===(t=this.handle)||void 0===t||t.destroy(),void(this.handle=null);const n=this.props(e);this.handle?this.handle.update(n):this.handle=$(this,n)}}C(e,"observedAttributes",[...P]),customElements.define("one-connect-button",e)}}Z(),exports.createConnectFlow=h,exports.mountConnectButton=function(e,t){const n=document.createElement("span");n.className="one-connect";const o=e=>{n.setAttribute("data-variant",z(e)),n.toggleAttribute("data-full-width",Boolean(e.fullWidth))};o(t),e.appendChild(n);const i=$(n,t);return{update:e=>{o(e),i.update(e)},destroy:()=>{i.destroy(),n.remove()}}},exports.readConnectReturn=p,exports.registerConnectButton=Z,exports.renderConnectButton=$,exports.resolveVariant=z;

package/dist/index.d.ts

@@ -1,3 +1,3 @@
 export { createConnectFlow, readConnectReturn } from "./flow";
-export { mountConnectButton, registerConnectButton, renderConnectButton, } from "./button";
-export type { ConnectButtonHandle, ConnectButtonLogo, ConnectButtonLogoInput, ConnectButtonPlatform, ConnectButtonPlatformInput, ConnectButtonProps, ConnectButtonSize, ConnectButtonState, ConnectButtonTheme, ConnectButtonVariant, ConnectFailureCode, OneConnectFlow, OneConnectFlowOptions, OneConnectReturn, OneConnectTheme, } from "./types";
+export { mountConnectButton, registerConnectButton, renderConnectButton, resolveVariant, } from "./button";
+export type { ConnectButtonHandle, ConnectButtonLogo, ConnectButtonLogoInput, ConnectButtonProps, ConnectButtonSize, ConnectButtonState, ConnectButtonTheme, ConnectButtonVariant, ConnectFailureCode, OneConnectFlow, OneConnectFlowOptions, OneConnectReturn, OneConnectTheme, } from "./types";

package/dist/index.esm.js

@@ -1 +1 @@
-const e="one_connect",t="one_connect_error",n={declined:"You cancelled the connection.",expired:"The connection attempt expired. Please try again.",failed:"The connection could not be completed. Please try again."};function o(o){const i=new URLSearchParams(o),r=i.get(e);if("success"===r)return{status:r};if("error"!==r)return null;const a=i.get(t),l=null!==(s=a)&&Object.prototype.hasOwnProperty.call(n,s)?a:"failed";var s;return{status:r,code:l,message:n[l]}}const i=[e,t,"one_connect_message"];function r(e){const t=new URLSearchParams(e);return i.some(e=>t.has(e))}let a,l=!1,s=!1,c=!1;const d=[];function u(){return p()}function p(){return"undefined"==typeof window?null:(void 0===a&&(a=o(window.location.search),(a||r(window.location.search))&&function(){const e=()=>{r(window.location.search)&&window.history.replaceState(window.history.state,"",function(e){const t=new URLSearchParams(e.search);for(const e of i)t.delete(e);const n=t.toString();return`${e.pathname}${n?`?${n}`:""}${e.hash}`}(window.location))};e();for(const t of[50,500,2e3])window.setTimeout(e,t)}()),a)}function h(e){let t=e,n=!1;const o={deliver:e=>{try{var n,o,i,r,a,l;"success"===e.status?null===(n=(o=t).onSuccess)||void 0===n||n.call(o):null===(i=(r=t).onError)||void 0===i||i.call(r,null!==(a=e.message)&&void 0!==a?a:"",null!==(l=e.code)&&void 0!==l?l:"failed")}catch{}},restored:()=>{if(n){n=!1;try{var e,o;null===(e=(o=t).onCancel)||void 0===e||e.call(o)}catch{}}}};return"undefined"!=typeof window&&(d.push(o),c||"undefined"==typeof window||(c=!0,window.addEventListener("pageshow",e=>{if(e.persisted)for(const e of[...d])e.restored()})),function(){if(l||s)return;const e=p();e&&(s=!0,window.setTimeout(()=>{s=!1;const t=d[0];t&&!l&&(l=!0,t.deliver(e))},0))}()),{open:()=>{"undefined"!=typeof window&&(n=!0,window.location.assign((e=>{try{var t;const n=new URL(e.authorizeUrl,window.location.origin);e.returnTo&&n.searchParams.set("one_return_to",e.returnTo);const o=new URLSearchParams;e.connectTheme&&o.set("one_theme",e.connectTheme);const i=null===(t=e.connector)||void 0===t?void 0:t.trim().toLowerCase();i&&o.set("one_connector",i);const r=o.toString();return r&&(n.hash=r),n.toString()}catch{return e.authorizeUrl}})(t)))},update:e=>{t=e},destroy:()=>{const e=d.indexOf(o);e>=0&&d.splice(e,1)}}}function C(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t);if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e){return e.trim().toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}const b={"cal-com":"Cal.com","click-up":"ClickUp",clickup:"ClickUp",docusign:"DocuSign",elevenlabs:"ElevenLabs","fireflies-ai":"Fireflies.ai",github:"GitHub",gitlab:"GitLab",hubspot:"HubSpot","linked-in":"LinkedIn",linkedin:"LinkedIn","one-drive":"OneDrive",onedrive:"OneDrive",openai:"OpenAI","otter-ai":"Otter.ai",paypal:"PayPal",posthog:"PostHog",quickbooks:"QuickBooks",sharepoint:"SharePoint","spotify-web":"Spotify",teams:"Microsoft Teams","telegram-bot":"Telegram","whatsapp-business":"WhatsApp Business",woocommerce:"WooCommerce",x:"X","youtube-data":"YouTube",youtube:"YouTube"};function g(e){var t;return null!==(t=b[e])&&void 0!==t?t:e.split(/[-_]+/).filter(Boolean).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}function v(e){return e?`https://assets.withone.ai/connectors/${e}.svg`:""}function m(e){var t,n,o,i;const r="string"==typeof e?{slug:e}:e,a=null!==(t=r.slug)&&void 0!==t&&t.trim()?f(r.slug):null!==(n=r.name)&&void 0!==n&&n.trim()?f(r.name):"";return a?{slug:a,name:(null===(o=r.name)||void 0===o?void 0:o.trim())||g(a),imageUrl:(null===(i=r.imageUrl)||void 0===i?void 0:i.trim())||v(a)}:null}function x(e){const t=null==e?void 0:e.trim();if(!t)return[];if(t.startsWith("["))try{const e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>"string"==typeof e||"object"==typeof e&&null!==e):[]}catch{return[]}return t.split(",").map(e=>e.trim()).filter(Boolean)}const w="#CCFF00",y="#0A0C0B",k="#FFFFFF",A=`\n:host{display:inline-block;vertical-align:middle;max-width:100%}\n:host([data-full-width]),:host([full-width]:not([full-width="false"])),\n:host([data-variant="block"]),:host([variant="block"]){display:block;width:100%}\n.b{all:unset;box-sizing:border-box;position:relative;display:inline-flex;align-items:center;gap:var(--gap);\n  max-width:100%;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;\n  font-family:var(--one-connect-font,inherit);font-size:var(--fs);font-weight:500;line-height:1.2;letter-spacing:-.01em;\n  padding:var(--pad);border-radius:var(--one-connect-radius,12px);background:var(--bg);color:var(--fg);\n  box-shadow:var(--shadow);transition:box-shadow .2s var(--ease),background-color .2s var(--ease),opacity .2s var(--ease)}\n.b[data-full-width]{display:flex;width:100%;justify-content:center}\n.b:focus-visible{outline:2px solid var(--ring);outline-offset:2px}\n.b:hover{box-shadow:var(--shadow-hover)}\n.b[disabled]{cursor:not-allowed;opacity:.5;box-shadow:none}\n.b[aria-busy="true"]{cursor:progress}\n.b{--ease:cubic-bezier(.2,.9,.25,1)}\n.b[data-size="sm"]{--fs:13px;--pad:8px 12px 8px 10px;--gap:8px;--chip:18px;--logo:12px}\n.b[data-size="md"]{--fs:14.5px;--pad:12px 16px 12px 14px;--gap:12px;--chip:22px;--logo:14px}\n.b[data-size="lg"]{--fs:16px;--pad:14px 20px 14px 16px;--gap:12px;--chip:26px;--logo:16px}\n.b[data-theme="light"],.b[data-theme="auto"]{--ink-bg:${y};--ink-fg:${k};--surface:${k};--surface-fg:${y};\n  --muted:#5B6560;--line:#D5DAD7;--ring:${y};--shadow-base:0 1px 2px rgba(10,12,11,.08),0 4px 14px rgba(10,12,11,.06);\n  --shadow-strong:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.1)}\n.b[data-theme="dark"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}\n@media (prefers-color-scheme:dark){.b[data-theme="auto"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}}\n.b[data-variant="default"]{--bg:var(--ink-bg);--fg:var(--ink-fg);--shadow:var(--shadow-base);--shadow-hover:var(--shadow-strong)}\n.b[data-variant="accent"]{--bg:var(--one-connect-accent,${w});--fg:var(--one-connect-accent-fg,${y});\n  --shadow:0 1px 2px rgba(10,12,11,.1);--shadow-hover:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.12)}\n.b[data-variant="block"]{--bg:var(--surface);--fg:var(--surface-fg);--shadow:inset 0 0 0 1px var(--line);\n  --shadow-hover:inset 0 0 0 1px var(--muted);flex-direction:column;align-items:stretch;gap:0;\n  width:100%;max-width:420px;text-align:left;padding:16px;border-radius:var(--one-connect-radius,14px)}\n.b[data-variant="block"][data-full-width]{max-width:none}\n.stack{display:inline-flex;align-items:center;flex-shrink:0}\n.chip{width:var(--chip);height:var(--chip);border-radius:6px;display:grid;place-items:center;overflow:hidden;\n  margin-left:-7px;position:relative;background:${k};color:${y};box-shadow:0 0 0 1.5px var(--bg);\n  transition:margin-left .28s var(--ease)}\n.chip:first-child{margin-left:0}\n.b[data-variant="block"] .chip{box-shadow:0 0 0 1.5px var(--bg),0 0 0 2.5px var(--line)}\n.chip img{width:var(--logo);height:var(--logo);display:block;object-fit:contain}\n.chip.more,.chip.letter{font:500 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}\n.chip.letter{font-size:10px;font-weight:600}\n.b:hover .chip{margin-left:-2px}.b:hover .chip:first-child{margin-left:0}\n.label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.icon{display:inline-flex;flex-shrink:0}\n.arrow{opacity:.55;transition:transform .2s var(--ease),opacity .2s var(--ease)}\n.b:hover .arrow{transform:translateX(2px);opacity:.85}\n.spinner{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;\n  opacity:.7;animation:spin .7s linear infinite;flex-shrink:0}\n@keyframes spin{to{transform:rotate(360deg)}}\n.top{display:flex;align-items:center;justify-content:space-between;gap:12px}\n.title{font-size:15px;font-weight:600;letter-spacing:-.01em}\n.sub{font-size:13px;line-height:1.5;margin-top:6px;font-weight:400;color:var(--muted)}\n.foot{margin-top:14px;padding-top:12px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:400;\n  color:var(--muted);border-top:1px solid var(--line)}\n.lockup{display:inline-flex;color:var(--surface-fg)}\n.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n@media (prefers-reduced-motion:reduce){.b,.chip,.arrow{transition:none}.spinner{animation-duration:1.6s}}\n@media (forced-colors:active){.b{border:1px solid ButtonText}.b:focus-visible{outline-color:Highlight}}\n`;let S=null;const L=(e,t,n)=>{const o=document.createElement(e);return t&&(o.className=t),void 0!==n&&(o.textContent=n),o},E=(e,t="icon")=>{const n=L("span",t);return n.innerHTML=e,n};function z(e){var t;const n=(null!=(o=null!==(t=e.logos)&&void 0!==t?t:e.platforms)?o:[]).map(m).filter(e=>null!==e);var o;if(0===n.length)return null;const i=L("span","stack");i.setAttribute("aria-hidden","true");for(const e of n.slice(0,3)){const t=L("span","chip");t.title=e.name;const n=L("img");n.alt="",n.decoding="async",n.src=e.imageUrl,n.addEventListener("error",()=>{n.remove(),t.classList.add("letter"),t.textContent=e.name.charAt(0).toUpperCase()}),t.appendChild(n),i.appendChild(t)}const r=n.length-3;return r>0&&i.appendChild(L("span","chip more",`+${r}`)),i}const F=(e,t)=>({authorizeUrl:e.authorizeUrl,connectTheme:e.connectTheme,connector:e.connector,returnTo:e.returnTo,...t});function M(e,t){var n;const o=null!==(n=e.shadowRoot)&&void 0!==n?n:e.attachShadow({mode:"open"});!function(e){if("undefined"!=typeof CSSStyleSheet&&"replaceSync"in CSSStyleSheet.prototype&&"adoptedStyleSheets"in e)try{return S||(S=new CSSStyleSheet,S.replaceSync(A)),void(e.adoptedStyleSheets=[S])}catch{}const t=document.createElement("style");t.textContent=A,e.appendChild(t)}(o);let i=t,r=!1,a=!1,l=null;const s=L("button","b");s.type="button",s.setAttribute("part","button");const c=L("span","sr");c.setAttribute("role","status"),c.setAttribute("aria-live","polite"),o.append(s,c);const d=()=>{return r?"connecting":void 0!==i.connected?i.connected?"connected":"idle":"success"===(null===(e=u())||void 0===e?void 0:e.status)?"connected":"idle";var e},p={onSuccess:()=>{var e,t;return null===(e=(t=i).onSuccess)||void 0===e?void 0:e.call(t)},onError:(e,t)=>{var n,o;return null===(n=(o=i).onError)||void 0===n?void 0:n.call(o,e,t)},onCancel:()=>{var e,t;r=!1,f(),null===(e=(t=i).onCancel)||void 0===e||e.call(t)}},C=h(F(i,p)),f=()=>{var e,t,n,o,r;if(a)return;const u=d(),p=null!==(e=i.variant)&&void 0!==e?e:"default",h="connecting"===u?"Connecting…":"connected"===u?null!==(t=i.connectedLabel)&&void 0!==t?t:"Connected":null!==(n=i.label)&&void 0!==n?n:"Connect your apps";s.dataset.variant=p,s.dataset.size=null!==(o=i.size)&&void 0!==o?o:"md",s.dataset.theme=null!==(r=i.theme)&&void 0!==r?r:"light",s.dataset.state=u,s.toggleAttribute("data-full-width",Boolean(i.fullWidth)),s.disabled=Boolean(i.disabled),s.setAttribute("aria-busy",String("connecting"===u)),"connecting"===u?s.setAttribute("aria-disabled","true"):s.removeAttribute("aria-disabled");const C="idle"===u?z(i):null,f="connecting"===u?L("span","spinner"):"connected"===u?E('<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M3 8.5l3.5 3.5L13 5"/></svg>'):C;if(s.replaceChildren(),s.removeAttribute("aria-labelledby"),s.removeAttribute("aria-describedby"),"block"===p){const e=L("span","top"),t=L("span","title",h);if(t.id="one-connect-title",t.setAttribute("part","label"),e.appendChild(t),f&&e.appendChild(f),s.appendChild(e),s.setAttribute("aria-labelledby",t.id),i.description){const e=L("span","sub",i.description);e.id="one-connect-description",s.appendChild(e),s.setAttribute("aria-describedby",e.id)}const n=L("span","foot");n.setAttribute("aria-hidden","true"),n.append(L("span","","Secured by"),E('<svg viewBox="0 0 3152 990" width="35" height="11" fill="none" aria-hidden="true" focusable="false"><path d="M1698.02 793.203C1525.75 793.203 1401 666.834 1401 495.102C1401 323.909 1524.67 197 1698.02 197C1870.83 197 1996.12 323.909 1996.12 495.102C1996.12 666.834 1869.75 793.203 1698.02 793.203ZM1698.02 694.916C1801.71 694.916 1884.88 615.53 1884.88 495.102C1884.88 374.133 1801.71 295.827 1698.02 295.827C1594.87 295.827 1511.71 373.053 1511.71 495.102C1511.71 616.61 1595.41 694.916 1698.02 694.916Z" fill="currentColor"/><path d="M2326.71 197.54C2480.62 197.54 2565.95 289.887 2565.95 467.56V779.702H2455.24V468.64C2455.24 361.172 2411.5 292.587 2308.35 292.587C2217.63 292.587 2140.4 356.852 2140.4 484.841V779.702H2030.77V211.041H2140.4V272.065C2185.76 225.082 2248.41 197.54 2326.71 197.54Z" fill="currentColor"/><path d="M3151.98 493.481C3151.98 514.003 3150.36 520.483 3148.74 529.124H2700.51C2715.63 637.672 2794.47 686.815 2922.46 686.815C3031.01 686.815 3099.6 650.633 3116.88 643.072V747.84C3100.68 755.4 3023.45 793.203 2908.96 793.203C2699.97 793.203 2588.18 661.434 2588.18 497.802C2588.18 332.55 2702.67 197 2871.7 197C3031.55 197 3151.98 317.969 3151.98 493.481ZM2876.02 300.688C2784.75 300.688 2720.49 345.511 2702.67 434.617H3050.45C3034.79 344.971 2967.29 300.688 2876.02 300.688Z" fill="currentColor"/><path d="M537.494 782.175C641.011 827.7 767.922 858.83 880.501 839.875C983.155 822.599 1069.64 764.946 1094.39 659.271C1114.47 573.493 1088.54 481.273 1047.27 405.311C983.124 287.246 874.768 183.791 759.847 114.657C644.926 45.5225 507.181 -5.02605 372.102 0.398669C289.698 3.69665 205.938 26.536 146.544 85.6685C112.069 119.989 88.3818 171.231 83.1266 219.823C78.1642 265.64 84.3749 310.317 99.8478 354.007C168.243 547.14 354.009 701.467 537.51 782.191L537.494 782.175ZM751.956 818.053C583.05 796.2 415.7 707.108 292.472 593.004C222.536 528.246 159.366 444.979 125.985 355.471C102.961 293.734 96.3956 223.367 122.41 161.969C137.158 127.14 160.367 98.244 190.743 75.9133C275.581 13.5752 395.819 6.99464 495.977 26.8596C608.848 49.252 713.875 99.4615 806.712 166.515C907.085 239.025 999.537 339.922 1048.42 454.627C1072.45 511.001 1083.99 570.103 1075.64 630.869C1067.38 690.957 1034.57 742.353 983.987 775.379C917.626 818.715 830.861 828.255 751.972 818.053H751.956Z" fill="currentColor"/><path d="M1103.27 661.228C1086.68 755.313 1024.9 818.622 934.021 848.69C821.751 885.846 685.146 860.263 576.251 818.915C452.515 771.942 340.336 699.91 245.157 607.813C209.002 572.83 177.255 534.456 148.837 493.031C100.384 422.402 61.7024 335.19 65.8326 248.071C68.2213 197.769 83.987 159.241 111.403 116.938C45.8289 171.308 31.404 262.511 47.1543 342.002C53.4728 373.841 62.9815 403.23 76.528 432.958C100.338 485.202 130.914 532.992 167.747 577.238C255.452 682.573 367.83 765.13 491.073 824.124C614.317 883.118 769.307 920.691 900.471 889.128C985.788 868.601 1061.47 816.095 1090.83 730.856C1098.18 708.71 1104.61 686.564 1103.25 661.244L1103.27 661.228Z" fill="currentColor"/><path d="M883.297 963.502C923.15 947.074 960.877 926.022 988.309 893.967C954.265 917.839 920.931 934.807 882.403 944.993C751.747 979.53 595.123 942.589 474.731 886.57C422.102 862.082 372.617 834.018 325.181 800.591C205.128 715.984 89.4825 597.996 36.7762 458.756C20.2092 414.973 11.7793 370.404 11.5327 323.739C11.4249 302.641 15.4627 283.747 19.0226 263.004C-2.52219 310.486 -3.66265 380.915 5.21419 431.617C32.0605 584.881 147.151 721.146 266.988 813.983C343.443 873.224 436.403 924.913 528.424 954.672C620.444 984.431 713.851 999.426 808.491 983.598C834.459 979.252 858.362 973.781 883.297 963.502Z" fill="currentColor"/><path d="M1045.09 830.737C1053.55 816.158 1061.75 802.95 1066.99 787.061C1043.75 824.541 1013.3 854.408 974.29 874.982C947.752 888.991 920.228 899.27 890.577 905.219C864.578 910.428 839.673 914.481 812.781 914.851C739.716 915.852 668.717 903.092 599.459 880.854C418.686 822.8 238.422 697.6 127.985 543.165C94.8819 496.87 68.8679 447.847 50.7135 394.031C28.1978 324.45 25.7782 258.69 53.4104 189.078C36.1345 211.825 26.9956 237.793 20.4151 264.916C18.3654 282.732 14.713 299.345 15.0828 317.561C15.9613 360.774 23.5436 402.692 38.477 443.562C73.1522 538.464 134.936 621.869 207.368 691.913C307.34 788.587 426.762 862.268 558.127 907.993C689.491 953.718 871.975 973.768 992.614 885.446C1013.28 870.312 1029.39 851.773 1045.07 830.752L1045.09 830.737Z" fill="currentColor"/><path d="M552.552 745.664C671.079 797.831 835.825 835.526 954.768 769.12C999.137 744.354 1031.99 705.626 1047.99 657.312C1086.75 540.264 1020.28 405.817 947.124 315.631C855.536 202.745 729.688 114.516 592.76 66.0323C506.349 35.4412 418.968 22.0797 328.211 37.46C262.313 48.6177 195.29 81.7054 157.563 138.234C118.912 196.133 115.891 270.785 136.758 335.882C176.519 459.926 276.769 570.763 381.01 646.277C434.995 685.391 491.662 718.864 552.567 745.664H552.552ZM210.162 422.955C199.898 402.381 189.141 382.701 184.733 360.385C182.267 347.918 184.625 333.477 184.564 320.64C184.44 293.223 194.072 269.059 209.992 247.93C219.609 235.17 229.456 224.844 243.018 215.906C341.218 151.179 476.051 175.991 576.763 223.904C661.971 264.435 737.394 321.534 796.11 395.862C836.919 447.52 871.193 513.634 880.502 579.501C888.238 634.272 873.243 695.485 826.763 729.189C807.853 742.905 785.045 751.721 761.728 755.974C721.921 763.217 688.802 758.008 649.565 748.916C594.27 736.094 542.488 715.212 492.279 688.889C441.977 662.521 396.745 631.483 353.008 595.436C314.372 563.597 280.252 537.845 248.458 498.007L248.274 497.837L221.504 461.945L211.379 445.84C194.103 418.408 177.398 391.346 165.238 361.202C151.291 326.604 142.676 291.852 143.678 254.279C146.19 160.564 203.766 96.7467 290.238 67.82C434.394 19.5985 611.561 79.4246 735.298 157.636C825.099 214.411 904.435 286.581 963.321 375.134C989.767 414.894 1010.42 456.998 1023.78 502.646C1049.84 591.66 1036.79 685.884 957.404 742.659C890.257 790.68 785.6 793.146 707.295 776.486C680.403 769.736 654.065 766.007 629.222 754.818C732.107 783.93 882.397 797.723 963.938 715.35C990.599 688.412 1007.55 656.218 1013.75 618.537C1020.87 575.232 1016.12 531.634 1002.62 489.931C985.498 437.071 956.34 384.026 922.405 340.289C876.911 281.665 823.188 230.531 762.468 187.981C681.112 130.975 588.783 88.887 490.799 71.0872C425.595 59.2514 349.463 60.4072 287.557 85.0959C256.441 97.5019 228.501 114.5 205.924 138.85C158.303 190.2 147.176 256.036 161.539 323.383C166.856 348.334 175.456 371.296 185.596 394.737C194.488 415.295 222.676 461.883 236.022 477.649L226.729 456.196L210.162 423.001V422.955ZM832.342 286.936C756.904 211.544 666.44 154.076 564.896 120.249C526.553 107.473 487.948 99.4899 447.648 96.084C401.26 92.1696 356.167 96.7313 312.215 111.341C222.337 141.208 169.399 217.277 175.255 312.333C177.567 324.847 179.555 335.774 180.603 348.503C152.971 264.944 174.454 175.236 251.356 125.581C310.797 87.2072 387.39 78.2071 456.694 86.7603C503.714 92.5549 555.387 106.656 599.078 124.317C706.016 167.546 800.764 234.615 876.741 321.395C912.002 361.664 942.085 405.756 963.876 454.532C996.779 528.166 1011.85 610.046 965.895 681.369C952.379 702.359 935.427 718.818 914.283 731.871C884.432 747.421 852.947 758.671 818.872 761.06C839.523 755.959 859.404 750.981 878.637 740.424C929.186 717.061 964.601 671.567 974.818 616.488C987.671 547.245 964.693 475.429 930.881 415.357C903.834 367.305 871.471 326.049 832.311 286.905L832.342 286.936ZM890.673 420.18C861.623 370.387 825.515 327.621 783.288 287.999C721.659 230.161 650.028 185.345 570.598 156.033C513.623 135.013 454.506 124.394 393.786 128.108C353.316 130.59 315.728 139.867 280.498 159.516C245.268 179.166 216.819 204.918 201.023 240.394L188.617 268.242C204.583 180.445 278.325 132.054 361.931 119.355C412.757 111.634 462.658 116.643 512.421 129.048C596.905 150.116 674.1 189.923 743.45 242.028C816.607 296.999 885.526 373.531 924.578 456.982C949.713 510.675 965.094 571.61 949.837 630.234C939.018 671.768 912.511 706.566 875.308 727.987C847.013 744.292 816.191 754.679 783.242 758.101C825.915 745.926 863.75 731.917 895.327 698.799C913.512 679.72 926.535 657.62 933.054 631.714C951.347 558.989 927.49 483.274 890.642 420.134L890.673 420.18ZM726.19 279.369C625.678 198.799 493.404 141.917 362.655 156.973C343.854 159.131 326.547 164.17 308.639 169.195C301.18 171.29 295.201 177.732 286.493 176.253C378.313 130.081 492.063 149.545 583.143 188.119C684.102 230.87 775.952 302.825 840.664 391.069C871.794 433.527 895.805 479.652 909.506 530.386C918.382 563.273 920.232 596.654 911.941 629.294C905.622 654.153 895.481 677.778 875.786 694.9C893.987 666.327 905.452 637.693 907.086 604.128C908.72 570.562 903.141 536.565 891.567 503.57C861.392 417.53 797.066 336.19 726.205 279.384L726.19 279.369Z" fill="currentColor"/></svg>',"lockup")),s.appendChild(n)}else{f&&s.appendChild(f);const e=L("span","label",h);e.setAttribute("part","label"),s.appendChild(e),"idle"===u&&s.appendChild(E('<svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M6 3l5 5-5 5"/></svg>',"icon arrow"))}var b,g;b=u,null!==l?b!==l&&(l=b,c.textContent="connecting"===b?"Connecting to One…":"connected"===b?null!==(g=i.connectedLabel)&&void 0!==g?g:"Connected":""):l=b};return s.addEventListener("click",()=>{a||i.disabled||r||(r=!0,f(),C.open())}),f(),{update:e=>{i=e,C.update(F(i,p)),f()},destroy:()=>{a=!0,C.destroy(),o.replaceChildren()}}}function T(e,t){const n=document.createElement("span");n.className="one-connect";const o=e=>{var t;n.setAttribute("data-variant",null!==(t=e.variant)&&void 0!==t?t:"default"),n.toggleAttribute("data-full-width",Boolean(e.fullWidth))};o(t),e.appendChild(n);const i=M(n,t);return{update:e=>{o(e),i.update(e)},destroy:()=>{i.destroy(),n.remove()}}}const $=["authorize-url","logos","platforms","connected","disabled","variant","size","full-width","theme","connect-theme","connector","return-to","label","connected-label","description"];function U(e,t,n){const o=e.getAttribute(t);return o&&n.includes(o)?o:void 0}const P=(e,t)=>e.hasAttribute(t)?"false"!==e.getAttribute(t):void 0;function Z(){if("undefined"!=typeof window&&"undefined"!=typeof customElements&&!customElements.get("one-connect-button")){class e extends HTMLElement{constructor(...e){super(...e),C(this,"onSuccess",null),C(this,"onError",null),C(this,"onCancel",null),C(this,"handle",null)}connectedCallback(){this.sync()}disconnectedCallback(){var e;null===(e=this.handle)||void 0===e||e.destroy(),this.handle=null}attributeChangedCallback(){this.isConnected&&this.sync()}props(e){var t,n,o,i,r,a;return{authorizeUrl:e,logos:x(null!==(t=this.getAttribute("logos"))&&void 0!==t?t:this.getAttribute("platforms")),connected:P(this,"connected"),disabled:P(this,"disabled"),variant:U(this,"variant",["default","accent","block"]),size:U(this,"size",["sm","md","lg"]),fullWidth:P(this,"full-width"),theme:U(this,"theme",["light","dark","auto"]),connectTheme:U(this,"connect-theme",["light","dark"]),connector:null!==(n=this.getAttribute("connector"))&&void 0!==n?n:void 0,returnTo:null!==(o=this.getAttribute("return-to"))&&void 0!==o?o:void 0,label:null!==(i=this.getAttribute("label"))&&void 0!==i?i:void 0,connectedLabel:null!==(r=this.getAttribute("connected-label"))&&void 0!==r?r:void 0,description:null!==(a=this.getAttribute("description"))&&void 0!==a?a:void 0,onSuccess:()=>{var e;null===(e=this.onSuccess)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("success"))},onError:(e,t)=>{var n;null===(n=this.onError)||void 0===n||n.call(this,e,t),this.dispatchEvent(new CustomEvent("error",{detail:{message:e,code:t}}))},onCancel:()=>{var e;null===(e=this.onCancel)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("cancel"))}}}sync(){const e=this.getAttribute("authorize-url");var t;if(!e)return null===(t=this.handle)||void 0===t||t.destroy(),void(this.handle=null);const n=this.props(e);this.handle?this.handle.update(n):this.handle=M(this,n)}}C(e,"observedAttributes",[...$]),customElements.define("one-connect-button",e)}}Z();export{h as createConnectFlow,T as mountConnectButton,u as readConnectReturn,Z as registerConnectButton,M as renderConnectButton};
+const e="one_connect",t="one_connect_error",n={declined:"You cancelled the connection.",expired:"The connection attempt expired. Please try again.",failed:"The connection could not be completed. Please try again."};function o(o){const i=new URLSearchParams(o),r=i.get(e);if("success"===r)return{status:r};if("error"!==r)return null;const a=i.get(t),l=null!==(s=a)&&Object.prototype.hasOwnProperty.call(n,s)?a:"failed";var s;return{status:r,code:l,message:n[l]}}const i=[e,t,"one_connect_message"];function r(e){const t=new URLSearchParams(e);return i.some(e=>t.has(e))}let a,l=!1,s=!1,c=!1;const d=[];function p(){return u()}function u(){return"undefined"==typeof window?null:(void 0===a&&(a=o(window.location.search),(a||r(window.location.search))&&function(){const e=()=>{r(window.location.search)&&window.history.replaceState(window.history.state,"",function(e){const t=new URLSearchParams(e.search);for(const e of i)t.delete(e);const n=t.toString();return`${e.pathname}${n?`?${n}`:""}${e.hash}`}(window.location))};e();for(const t of[50,500,2e3])window.setTimeout(e,t)}()),a)}function h(e){let t=e,n=!1;const o={deliver:e=>{try{var n,o,i,r,a,l;"success"===e.status?null===(n=(o=t).onSuccess)||void 0===n||n.call(o):null===(i=(r=t).onError)||void 0===i||i.call(r,null!==(a=e.message)&&void 0!==a?a:"",null!==(l=e.code)&&void 0!==l?l:"failed")}catch{}},restored:()=>{if(n){n=!1;try{var e,o;null===(e=(o=t).onCancel)||void 0===e||e.call(o)}catch{}}}};return"undefined"!=typeof window&&(d.push(o),c||"undefined"==typeof window||(c=!0,window.addEventListener("pageshow",e=>{if(e.persisted)for(const e of[...d])e.restored()})),function(){if(l||s)return;const e=u();e&&(s=!0,window.setTimeout(()=>{s=!1;const t=d[0];t&&!l&&(l=!0,t.deliver(e))},0))}()),{open:()=>{"undefined"!=typeof window&&(n=!0,window.location.assign((e=>{try{var t,n;const o=new URL(e.authorizeUrl,window.location.origin);e.returnTo&&o.searchParams.set("one_return_to",e.returnTo);const i=new URLSearchParams;e.connectTheme&&i.set("one_theme",e.connectTheme);const r=null===(t=null!==(n=e.openApp)&&void 0!==n?n:e.connector)||void 0===t?void 0:t.trim().toLowerCase();r&&i.set("one_open_app",r);const a=i.toString();return a&&(o.hash=a),o.toString()}catch{return e.authorizeUrl}})(t)))},update:e=>{t=e},destroy:()=>{const e=d.indexOf(o);e>=0&&d.splice(e,1)}}}function C(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t);if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e){return e.trim().toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}const b={"cal-com":"Cal.com","click-up":"ClickUp",clickup:"ClickUp",docusign:"DocuSign",elevenlabs:"ElevenLabs","fireflies-ai":"Fireflies.ai",github:"GitHub",gitlab:"GitLab",hubspot:"HubSpot","linked-in":"LinkedIn",linkedin:"LinkedIn","one-drive":"OneDrive",onedrive:"OneDrive",openai:"OpenAI","otter-ai":"Otter.ai",paypal:"PayPal",posthog:"PostHog",quickbooks:"QuickBooks",sharepoint:"SharePoint","spotify-web":"Spotify",teams:"Microsoft Teams","telegram-bot":"Telegram","whatsapp-business":"WhatsApp Business",woocommerce:"WooCommerce",x:"X","youtube-data":"YouTube",youtube:"YouTube"};function v(e){var t;return null!==(t=b[e])&&void 0!==t?t:e.split(/[-_]+/).filter(Boolean).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}function g(e){return e?`https://assets.withone.ai/connectors/${e}.svg`:""}function m(e){var t,n,o,i;const r="string"==typeof e?{slug:e}:e,a=null!==(t=r.slug)&&void 0!==t&&t.trim()?f(r.slug):null!==(n=r.name)&&void 0!==n&&n.trim()?f(r.name):"";return a?{slug:a,name:(null===(o=r.name)||void 0===o?void 0:o.trim())||v(a),imageUrl:(null===(i=r.imageUrl)||void 0===i?void 0:i.trim())||g(a)}:null}function x(e){const t=null==e?void 0:e.trim();if(!t)return[];if(t.startsWith("["))try{const e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>"string"==typeof e||"object"==typeof e&&null!==e):[]}catch{return[]}return t.split(",").map(e=>e.trim()).filter(Boolean)}const w="#CCFF00",y="#0A0C0B",k="#FFFFFF",A=`\n:host{display:inline-block;vertical-align:middle;max-width:100%}\n:host([data-full-width]),:host([full-width]:not([full-width="false"])),\n:host([data-variant="block"]),:host([variant="block"]){display:block;width:100%}\n.b{all:unset;box-sizing:border-box;position:relative;display:inline-flex;align-items:center;gap:var(--gap);\n  max-width:100%;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;\n  font-family:var(--one-connect-font,inherit);font-size:var(--fs);font-weight:500;line-height:1.2;letter-spacing:-.01em;\n  padding:var(--pad);border-radius:var(--one-connect-radius,12px);background:var(--bg);color:var(--fg);\n  box-shadow:var(--shadow);transition:box-shadow .2s var(--ease),background-color .2s var(--ease),opacity .2s var(--ease)}\n.b[data-full-width]{display:flex;width:100%;justify-content:center}\n.b:focus-visible{outline:2px solid var(--ring);outline-offset:2px}\n.b:hover{box-shadow:var(--shadow-hover)}\n.b[disabled]{cursor:not-allowed;opacity:.5;box-shadow:none}\n.b[aria-busy="true"]{cursor:progress}\n.b{--ease:cubic-bezier(.2,.9,.25,1)}\n.b[data-size="sm"]{--fs:13px;--pad:8px 12px 8px 10px;--gap:8px;--chip:18px;--logo:12px}\n.b[data-size="md"]{--fs:14.5px;--pad:12px 16px 12px 14px;--gap:12px;--chip:22px;--logo:14px}\n.b[data-size="lg"]{--fs:16px;--pad:14px 20px 14px 16px;--gap:12px;--chip:26px;--logo:16px}\n.b[data-theme="light"],.b[data-theme="auto"]{--ink-bg:${y};--ink-fg:${k};--surface:${k};--surface-fg:${y};\n  --muted:#5B6560;--line:#D5DAD7;--ring:${y};--shadow-base:0 1px 2px rgba(10,12,11,.08),0 4px 14px rgba(10,12,11,.06);\n  --shadow-strong:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.1)}\n.b[data-theme="dark"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}\n@media (prefers-color-scheme:dark){.b[data-theme="auto"]{--ink-bg:#F2F5F3;--ink-fg:${y};--surface:#101312;--surface-fg:#F2F5F3;\n  --muted:#9AA39E;--line:#2A302D;--ring:${w};--shadow-base:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);\n  --shadow-strong:0 1px 2px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.45)}}\n.b[data-variant="default"]{--bg:var(--ink-bg);--fg:var(--ink-fg);--shadow:var(--shadow-base);--shadow-hover:var(--shadow-strong)}\n.b[data-variant="accent"]{--bg:var(--one-connect-accent,${w});--fg:var(--one-connect-accent-fg,${y});\n  --shadow:0 1px 2px rgba(10,12,11,.1);--shadow-hover:0 1px 2px rgba(10,12,11,.12),0 6px 18px rgba(10,12,11,.12)}\n.b[data-variant="block"]{--bg:var(--surface);--fg:var(--surface-fg);--shadow:inset 0 0 0 1px var(--line);\n  --shadow-hover:inset 0 0 0 1px var(--muted);flex-direction:column;align-items:stretch;gap:0;\n  width:100%;max-width:420px;text-align:left;padding:16px;border-radius:var(--one-connect-radius,14px)}\n.b[data-variant="block"][data-full-width]{max-width:none}\n.stack{display:inline-flex;align-items:center;flex-shrink:0}\n.chip{width:var(--chip);height:var(--chip);border-radius:6px;display:grid;place-items:center;overflow:hidden;\n  margin-left:-7px;position:relative;background:${k};color:${y};box-shadow:0 0 0 1.5px var(--bg);\n  transition:margin-left .28s var(--ease)}\n.chip:first-child{margin-left:0}\n.b[data-variant="block"] .chip{box-shadow:0 0 0 1.5px var(--bg),0 0 0 2.5px var(--line)}\n.chip img{width:var(--logo);height:var(--logo);display:block;object-fit:contain}\n.chip.more,.chip.letter{font:500 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}\n.chip.letter{font-size:10px;font-weight:600}\n.b:hover .chip{margin-left:-2px}.b:hover .chip:first-child{margin-left:0}\n.label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.icon{display:inline-flex;flex-shrink:0}\n.arrow{opacity:.55;transition:transform .2s var(--ease),opacity .2s var(--ease)}\n.b:hover .arrow{transform:translateX(2px);opacity:.85}\n.spinner{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;\n  opacity:.7;animation:spin .7s linear infinite;flex-shrink:0}\n@keyframes spin{to{transform:rotate(360deg)}}\n.top{display:flex;align-items:center;justify-content:space-between;gap:12px}\n.title{font-size:15px;font-weight:600;letter-spacing:-.01em}\n.sub{font-size:13px;line-height:1.5;margin-top:6px;font-weight:400;color:var(--muted)}\n.foot{margin-top:14px;padding-top:12px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:400;\n  color:var(--muted);border-top:1px solid var(--line)}\n.lockup{display:inline-flex;color:var(--surface-fg)}\n.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}\n@media (prefers-reduced-motion:reduce){.b,.chip,.arrow{transition:none}.spinner{animation-duration:1.6s}}\n@media (forced-colors:active){.b{border:1px solid ButtonText}.b:focus-visible{outline-color:Highlight}}\n`;let S=null;const L=(e,t,n)=>{const o=document.createElement(e);return t&&(o.className=t),void 0!==n&&(o.textContent=n),o},E=(e,t="icon")=>{const n=L("span",t);return n.innerHTML=e,n};function T(e){const t=(null!=(n=e.logos)?n:[]).map(m).filter(e=>null!==e);var n;if(0===t.length)return null;const o=L("span","stack");o.setAttribute("aria-hidden","true");for(const e of t.slice(0,3)){const t=L("span","chip");t.title=e.name;const n=L("img");n.alt="",n.decoding="async",n.src=e.imageUrl,n.addEventListener("error",()=>{n.remove(),t.classList.add("letter"),t.textContent=e.name.charAt(0).toUpperCase()}),t.appendChild(n),o.appendChild(t)}const i=t.length-3;return i>0&&o.appendChild(L("span","chip more",`+${i}`)),o}const z=e=>{var t;return null!==(t=e.variant)&&void 0!==t?t:e.accent?"accent":"default"};function F(e,t){var n,o;const i=null===(n=t.accent)||void 0===n?void 0:n.trim(),r=(null===(o=t.accentText)||void 0===o?void 0:o.trim())||(i?function(e){const t=e.trim().replace(/^#/,""),n=3===t.length?t.split("").map(e=>e+e).join(""):t;if(!/^[0-9a-f]{6}$/i.test(n))return null;const o=e=>{const t=parseInt(n.slice(e,e+2),16)/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4},i=.2126*o(0)+.7152*o(2)+.0722*o(4);return(i+.05)/(.0037+.05)>=1.05/(i+.05)?y:k}(i):null);i?e.style.setProperty("--one-connect-accent",i):e.style.removeProperty("--one-connect-accent"),r?e.style.setProperty("--one-connect-accent-fg",r):e.style.removeProperty("--one-connect-accent-fg"),e.getAttribute("style")||e.removeAttribute("style")}const M=(e,t)=>{var n;return{authorizeUrl:e.authorizeUrl,connectTheme:e.connectTheme,openApp:null!==(n=e.openApp)&&void 0!==n?n:e.connector,returnTo:e.returnTo,...t}};function $(e,t){var n;const o=null!==(n=e.shadowRoot)&&void 0!==n?n:e.attachShadow({mode:"open"});!function(e){if("undefined"!=typeof CSSStyleSheet&&"replaceSync"in CSSStyleSheet.prototype&&"adoptedStyleSheets"in e)try{return S||(S=new CSSStyleSheet,S.replaceSync(A)),void(e.adoptedStyleSheets=[S])}catch{}const t=document.createElement("style");t.textContent=A,e.appendChild(t)}(o);let i=t,r=!1,a=!1,l=null;const s=L("button","b");s.type="button",s.setAttribute("part","button");const c=L("span","sr");c.setAttribute("role","status"),c.setAttribute("aria-live","polite"),o.append(s,c);const d=()=>{return r?"connecting":void 0!==i.connected?i.connected?"connected":"idle":"success"===(null===(e=p())||void 0===e?void 0:e.status)?"connected":"idle";var e},u={onSuccess:()=>{var e,t;return null===(e=(t=i).onSuccess)||void 0===e?void 0:e.call(t)},onError:(e,t)=>{var n,o;return null===(n=(o=i).onError)||void 0===n?void 0:n.call(o,e,t)},onCancel:()=>{var e,t;r=!1,f(),null===(e=(t=i).onCancel)||void 0===e||e.call(t)}},C=h(M(i,u)),f=()=>{var e,t,n,o;if(a)return;const r=d(),p=z(i),u="connecting"===r?"Connecting…":"connected"===r?null!==(e=i.connectedLabel)&&void 0!==e?e:"Connected":null!==(t=i.label)&&void 0!==t?t:"Connect your apps";s.dataset.variant=p,F(s,i),s.dataset.size=null!==(n=i.size)&&void 0!==n?n:"md",s.dataset.theme=null!==(o=i.theme)&&void 0!==o?o:"light",s.dataset.state=r,s.toggleAttribute("data-full-width",Boolean(i.fullWidth)),s.disabled=Boolean(i.disabled),s.setAttribute("aria-busy",String("connecting"===r)),"connecting"===r?s.setAttribute("aria-disabled","true"):s.removeAttribute("aria-disabled");const h="idle"===r?T(i):null,C="connecting"===r?L("span","spinner"):"connected"===r?E('<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M3 8.5l3.5 3.5L13 5"/></svg>'):h;if(s.replaceChildren(),s.removeAttribute("aria-labelledby"),s.removeAttribute("aria-describedby"),"block"===p){const e=L("span","top"),t=L("span","title",u);if(t.id="one-connect-title",t.setAttribute("part","label"),e.appendChild(t),C&&e.appendChild(C),s.appendChild(e),s.setAttribute("aria-labelledby",t.id),i.description){const e=L("span","sub",i.description);e.id="one-connect-description",s.appendChild(e),s.setAttribute("aria-describedby",e.id)}const n=L("span","foot");n.setAttribute("aria-hidden","true"),n.append(L("span","","Secured by"),E('<svg viewBox="0 0 3152 990" width="35" height="11" fill="none" aria-hidden="true" focusable="false"><path d="M1698.02 793.203C1525.75 793.203 1401 666.834 1401 495.102C1401 323.909 1524.67 197 1698.02 197C1870.83 197 1996.12 323.909 1996.12 495.102C1996.12 666.834 1869.75 793.203 1698.02 793.203ZM1698.02 694.916C1801.71 694.916 1884.88 615.53 1884.88 495.102C1884.88 374.133 1801.71 295.827 1698.02 295.827C1594.87 295.827 1511.71 373.053 1511.71 495.102C1511.71 616.61 1595.41 694.916 1698.02 694.916Z" fill="currentColor"/><path d="M2326.71 197.54C2480.62 197.54 2565.95 289.887 2565.95 467.56V779.702H2455.24V468.64C2455.24 361.172 2411.5 292.587 2308.35 292.587C2217.63 292.587 2140.4 356.852 2140.4 484.841V779.702H2030.77V211.041H2140.4V272.065C2185.76 225.082 2248.41 197.54 2326.71 197.54Z" fill="currentColor"/><path d="M3151.98 493.481C3151.98 514.003 3150.36 520.483 3148.74 529.124H2700.51C2715.63 637.672 2794.47 686.815 2922.46 686.815C3031.01 686.815 3099.6 650.633 3116.88 643.072V747.84C3100.68 755.4 3023.45 793.203 2908.96 793.203C2699.97 793.203 2588.18 661.434 2588.18 497.802C2588.18 332.55 2702.67 197 2871.7 197C3031.55 197 3151.98 317.969 3151.98 493.481ZM2876.02 300.688C2784.75 300.688 2720.49 345.511 2702.67 434.617H3050.45C3034.79 344.971 2967.29 300.688 2876.02 300.688Z" fill="currentColor"/><path d="M537.494 782.175C641.011 827.7 767.922 858.83 880.501 839.875C983.155 822.599 1069.64 764.946 1094.39 659.271C1114.47 573.493 1088.54 481.273 1047.27 405.311C983.124 287.246 874.768 183.791 759.847 114.657C644.926 45.5225 507.181 -5.02605 372.102 0.398669C289.698 3.69665 205.938 26.536 146.544 85.6685C112.069 119.989 88.3818 171.231 83.1266 219.823C78.1642 265.64 84.3749 310.317 99.8478 354.007C168.243 547.14 354.009 701.467 537.51 782.191L537.494 782.175ZM751.956 818.053C583.05 796.2 415.7 707.108 292.472 593.004C222.536 528.246 159.366 444.979 125.985 355.471C102.961 293.734 96.3956 223.367 122.41 161.969C137.158 127.14 160.367 98.244 190.743 75.9133C275.581 13.5752 395.819 6.99464 495.977 26.8596C608.848 49.252 713.875 99.4615 806.712 166.515C907.085 239.025 999.537 339.922 1048.42 454.627C1072.45 511.001 1083.99 570.103 1075.64 630.869C1067.38 690.957 1034.57 742.353 983.987 775.379C917.626 818.715 830.861 828.255 751.972 818.053H751.956Z" fill="currentColor"/><path d="M1103.27 661.228C1086.68 755.313 1024.9 818.622 934.021 848.69C821.751 885.846 685.146 860.263 576.251 818.915C452.515 771.942 340.336 699.91 245.157 607.813C209.002 572.83 177.255 534.456 148.837 493.031C100.384 422.402 61.7024 335.19 65.8326 248.071C68.2213 197.769 83.987 159.241 111.403 116.938C45.8289 171.308 31.404 262.511 47.1543 342.002C53.4728 373.841 62.9815 403.23 76.528 432.958C100.338 485.202 130.914 532.992 167.747 577.238C255.452 682.573 367.83 765.13 491.073 824.124C614.317 883.118 769.307 920.691 900.471 889.128C985.788 868.601 1061.47 816.095 1090.83 730.856C1098.18 708.71 1104.61 686.564 1103.25 661.244L1103.27 661.228Z" fill="currentColor"/><path d="M883.297 963.502C923.15 947.074 960.877 926.022 988.309 893.967C954.265 917.839 920.931 934.807 882.403 944.993C751.747 979.53 595.123 942.589 474.731 886.57C422.102 862.082 372.617 834.018 325.181 800.591C205.128 715.984 89.4825 597.996 36.7762 458.756C20.2092 414.973 11.7793 370.404 11.5327 323.739C11.4249 302.641 15.4627 283.747 19.0226 263.004C-2.52219 310.486 -3.66265 380.915 5.21419 431.617C32.0605 584.881 147.151 721.146 266.988 813.983C343.443 873.224 436.403 924.913 528.424 954.672C620.444 984.431 713.851 999.426 808.491 983.598C834.459 979.252 858.362 973.781 883.297 963.502Z" fill="currentColor"/><path d="M1045.09 830.737C1053.55 816.158 1061.75 802.95 1066.99 787.061C1043.75 824.541 1013.3 854.408 974.29 874.982C947.752 888.991 920.228 899.27 890.577 905.219C864.578 910.428 839.673 914.481 812.781 914.851C739.716 915.852 668.717 903.092 599.459 880.854C418.686 822.8 238.422 697.6 127.985 543.165C94.8819 496.87 68.8679 447.847 50.7135 394.031C28.1978 324.45 25.7782 258.69 53.4104 189.078C36.1345 211.825 26.9956 237.793 20.4151 264.916C18.3654 282.732 14.713 299.345 15.0828 317.561C15.9613 360.774 23.5436 402.692 38.477 443.562C73.1522 538.464 134.936 621.869 207.368 691.913C307.34 788.587 426.762 862.268 558.127 907.993C689.491 953.718 871.975 973.768 992.614 885.446C1013.28 870.312 1029.39 851.773 1045.07 830.752L1045.09 830.737Z" fill="currentColor"/><path d="M552.552 745.664C671.079 797.831 835.825 835.526 954.768 769.12C999.137 744.354 1031.99 705.626 1047.99 657.312C1086.75 540.264 1020.28 405.817 947.124 315.631C855.536 202.745 729.688 114.516 592.76 66.0323C506.349 35.4412 418.968 22.0797 328.211 37.46C262.313 48.6177 195.29 81.7054 157.563 138.234C118.912 196.133 115.891 270.785 136.758 335.882C176.519 459.926 276.769 570.763 381.01 646.277C434.995 685.391 491.662 718.864 552.567 745.664H552.552ZM210.162 422.955C199.898 402.381 189.141 382.701 184.733 360.385C182.267 347.918 184.625 333.477 184.564 320.64C184.44 293.223 194.072 269.059 209.992 247.93C219.609 235.17 229.456 224.844 243.018 215.906C341.218 151.179 476.051 175.991 576.763 223.904C661.971 264.435 737.394 321.534 796.11 395.862C836.919 447.52 871.193 513.634 880.502 579.501C888.238 634.272 873.243 695.485 826.763 729.189C807.853 742.905 785.045 751.721 761.728 755.974C721.921 763.217 688.802 758.008 649.565 748.916C594.27 736.094 542.488 715.212 492.279 688.889C441.977 662.521 396.745 631.483 353.008 595.436C314.372 563.597 280.252 537.845 248.458 498.007L248.274 497.837L221.504 461.945L211.379 445.84C194.103 418.408 177.398 391.346 165.238 361.202C151.291 326.604 142.676 291.852 143.678 254.279C146.19 160.564 203.766 96.7467 290.238 67.82C434.394 19.5985 611.561 79.4246 735.298 157.636C825.099 214.411 904.435 286.581 963.321 375.134C989.767 414.894 1010.42 456.998 1023.78 502.646C1049.84 591.66 1036.79 685.884 957.404 742.659C890.257 790.68 785.6 793.146 707.295 776.486C680.403 769.736 654.065 766.007 629.222 754.818C732.107 783.93 882.397 797.723 963.938 715.35C990.599 688.412 1007.55 656.218 1013.75 618.537C1020.87 575.232 1016.12 531.634 1002.62 489.931C985.498 437.071 956.34 384.026 922.405 340.289C876.911 281.665 823.188 230.531 762.468 187.981C681.112 130.975 588.783 88.887 490.799 71.0872C425.595 59.2514 349.463 60.4072 287.557 85.0959C256.441 97.5019 228.501 114.5 205.924 138.85C158.303 190.2 147.176 256.036 161.539 323.383C166.856 348.334 175.456 371.296 185.596 394.737C194.488 415.295 222.676 461.883 236.022 477.649L226.729 456.196L210.162 423.001V422.955ZM832.342 286.936C756.904 211.544 666.44 154.076 564.896 120.249C526.553 107.473 487.948 99.4899 447.648 96.084C401.26 92.1696 356.167 96.7313 312.215 111.341C222.337 141.208 169.399 217.277 175.255 312.333C177.567 324.847 179.555 335.774 180.603 348.503C152.971 264.944 174.454 175.236 251.356 125.581C310.797 87.2072 387.39 78.2071 456.694 86.7603C503.714 92.5549 555.387 106.656 599.078 124.317C706.016 167.546 800.764 234.615 876.741 321.395C912.002 361.664 942.085 405.756 963.876 454.532C996.779 528.166 1011.85 610.046 965.895 681.369C952.379 702.359 935.427 718.818 914.283 731.871C884.432 747.421 852.947 758.671 818.872 761.06C839.523 755.959 859.404 750.981 878.637 740.424C929.186 717.061 964.601 671.567 974.818 616.488C987.671 547.245 964.693 475.429 930.881 415.357C903.834 367.305 871.471 326.049 832.311 286.905L832.342 286.936ZM890.673 420.18C861.623 370.387 825.515 327.621 783.288 287.999C721.659 230.161 650.028 185.345 570.598 156.033C513.623 135.013 454.506 124.394 393.786 128.108C353.316 130.59 315.728 139.867 280.498 159.516C245.268 179.166 216.819 204.918 201.023 240.394L188.617 268.242C204.583 180.445 278.325 132.054 361.931 119.355C412.757 111.634 462.658 116.643 512.421 129.048C596.905 150.116 674.1 189.923 743.45 242.028C816.607 296.999 885.526 373.531 924.578 456.982C949.713 510.675 965.094 571.61 949.837 630.234C939.018 671.768 912.511 706.566 875.308 727.987C847.013 744.292 816.191 754.679 783.242 758.101C825.915 745.926 863.75 731.917 895.327 698.799C913.512 679.72 926.535 657.62 933.054 631.714C951.347 558.989 927.49 483.274 890.642 420.134L890.673 420.18ZM726.19 279.369C625.678 198.799 493.404 141.917 362.655 156.973C343.854 159.131 326.547 164.17 308.639 169.195C301.18 171.29 295.201 177.732 286.493 176.253C378.313 130.081 492.063 149.545 583.143 188.119C684.102 230.87 775.952 302.825 840.664 391.069C871.794 433.527 895.805 479.652 909.506 530.386C918.382 563.273 920.232 596.654 911.941 629.294C905.622 654.153 895.481 677.778 875.786 694.9C893.987 666.327 905.452 637.693 907.086 604.128C908.72 570.562 903.141 536.565 891.567 503.57C861.392 417.53 797.066 336.19 726.205 279.384L726.19 279.369Z" fill="currentColor"/></svg>',"lockup")),s.appendChild(n)}else{C&&s.appendChild(C);const e=L("span","label",u);e.setAttribute("part","label"),s.appendChild(e),"idle"===r&&s.appendChild(E('<svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M6 3l5 5-5 5"/></svg>',"icon arrow"))}var f,b;f=r,null!==l?f!==l&&(l=f,c.textContent="connecting"===f?"Connecting to One…":"connected"===f?null!==(b=i.connectedLabel)&&void 0!==b?b:"Connected":""):l=f};return s.addEventListener("click",()=>{a||i.disabled||r||(r=!0,f(),C.open())}),f(),{update:e=>{i=e,C.update(M(i,u)),f()},destroy:()=>{a=!0,C.destroy(),o.replaceChildren()}}}function P(e,t){const n=document.createElement("span");n.className="one-connect";const o=e=>{n.setAttribute("data-variant",z(e)),n.toggleAttribute("data-full-width",Boolean(e.fullWidth))};o(t),e.appendChild(n);const i=$(n,t);return{update:e=>{o(e),i.update(e)},destroy:()=>{i.destroy(),n.remove()}}}const U=["authorize-url","logos","connected","disabled","variant","size","full-width","theme","connect-theme","open-app","connector","return-to","label","connected-label","description","accent","accent-text"];function Z(e,t,n){const o=e.getAttribute(t);return o&&n.includes(o)?o:void 0}const B=(e,t)=>e.hasAttribute(t)?"false"!==e.getAttribute(t):void 0;function H(){if("undefined"!=typeof window&&"undefined"!=typeof customElements&&!customElements.get("one-connect-button")){class e extends HTMLElement{constructor(...e){super(...e),C(this,"onSuccess",null),C(this,"onError",null),C(this,"onCancel",null),C(this,"handle",null)}connectedCallback(){this.sync()}disconnectedCallback(){var e;null===(e=this.handle)||void 0===e||e.destroy(),this.handle=null}attributeChangedCallback(){this.isConnected&&this.sync()}props(e){var t,n,o,i,r,a,l,s;return{authorizeUrl:e,logos:x(this.getAttribute("logos")),connected:B(this,"connected"),disabled:B(this,"disabled"),variant:Z(this,"variant",["default","accent","block"]),size:Z(this,"size",["sm","md","lg"]),fullWidth:B(this,"full-width"),theme:Z(this,"theme",["light","dark","auto"]),connectTheme:Z(this,"connect-theme",["light","dark"]),openApp:null!==(t=null!==(n=this.getAttribute("open-app"))&&void 0!==n?n:this.getAttribute("connector"))&&void 0!==t?t:void 0,returnTo:null!==(o=this.getAttribute("return-to"))&&void 0!==o?o:void 0,label:null!==(i=this.getAttribute("label"))&&void 0!==i?i:void 0,connectedLabel:null!==(r=this.getAttribute("connected-label"))&&void 0!==r?r:void 0,description:null!==(a=this.getAttribute("description"))&&void 0!==a?a:void 0,accent:null!==(l=this.getAttribute("accent"))&&void 0!==l?l:void 0,accentText:null!==(s=this.getAttribute("accent-text"))&&void 0!==s?s:void 0,onSuccess:()=>{var e;null===(e=this.onSuccess)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("success"))},onError:(e,t)=>{var n;null===(n=this.onError)||void 0===n||n.call(this,e,t),this.dispatchEvent(new CustomEvent("error",{detail:{message:e,code:t}}))},onCancel:()=>{var e;null===(e=this.onCancel)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("cancel"))}}}sync(){const e=this.getAttribute("authorize-url");var t;if(!e)return null===(t=this.handle)||void 0===t||t.destroy(),void(this.handle=null);const n=this.props(e);this.handle?this.handle.update(n):this.handle=$(this,n)}}C(e,"observedAttributes",[...U]),customElements.define("one-connect-button",e)}}H();export{h as createConnectFlow,P as mountConnectButton,p as readConnectReturn,H as registerConnectButton,$ as renderConnectButton,z as resolveVariant};

package/dist/platforms.d.ts

@@ -1,4 +1,4 @@
-import type { ConnectButtonPlatform, ConnectButtonPlatformInput } from "./types";
+import type { ConnectButtonLogo, ConnectButtonLogoInput } from "./types";
 /** "Google Calendar" -> "google-calendar". */
 export declare function slugFromName(name: string): string;
 /** "google-calendar" -> "Google Calendar"; "hubspot" -> "HubSpot". */
@@ -11,11 +11,11 @@ export declare function logoUrlForSlug(slug: string): string;
  * Entries with neither a slug nor a name are dropped rather than drawn
  * as an empty chip.
  */
-export declare function normalizePlatform(input: ConnectButtonPlatformInput): ConnectButtonPlatform | null;
-export declare function normalizePlatforms(inputs: ConnectButtonPlatformInput[] | undefined): ConnectButtonPlatform[];
+export declare function normalizePlatform(input: ConnectButtonLogoInput): ConnectButtonLogo | null;
+export declare function normalizePlatforms(inputs: ConnectButtonLogoInput[] | undefined): ConnectButtonLogo[];
 /**
  * The `logos` attribute on <one-connect-button>: a comma list of
  * slugs ("stripe, notion") or, for overrides, a JSON array of
  * {slug, name, imageUrl} objects.
  */
-export declare function parsePlatformsAttribute(raw: string | null): ConnectButtonPlatformInput[];
+export declare function parsePlatformsAttribute(raw: string | null): ConnectButtonLogoInput[];

package/dist/react.cjs.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";var e=require("react"),n=require("@withone/connect");const r=e=>{var n,r;return JSON.stringify([e.authorizeUrl,null!==(n=null!==(r=e.logos)&&void 0!==r?r:e.platforms)&&void 0!==n?n:[],e.connected,e.disabled,e.variant,e.size,e.fullWidth,e.theme,e.connectTheme,e.connector,e.returnTo,e.label,e.connectedLabel,e.description])};exports.ConnectButton=function(t){var u;const c=e.useRef(null),l=e.useRef(null),o=e.useRef(""),s=e.useRef(t);s.current=t;const a=()=>({...s.current,onSuccess:()=>{var e,n;return null===(e=(n=s.current).onSuccess)||void 0===e?void 0:e.call(n)},onError:(e,n)=>{var r,t;return null===(r=(t=s.current).onError)||void 0===r?void 0:r.call(t,e,n)},onCancel:()=>{var e,n;return null===(e=(n=s.current).onCancel)||void 0===e?void 0:e.call(n)}});e.useEffect(()=>{if(c.current)return l.current=n.renderConnectButton(c.current,a()),o.current=r(s.current),()=>{var e;null===(e=l.current)||void 0===e||e.destroy(),l.current=null}},[]);const i=r(t);return e.useEffect(()=>{l.current&&i!==o.current&&(o.current=i,l.current.update(a()))},[i]),e.createElement("span",{ref:c,className:t.className?`one-connect ${t.className}`:"one-connect",style:t.style,"data-variant":null!==(u=t.variant)&&void 0!==u?u:"default","data-full-width":t.fullWidth?"":void 0})},exports.useOneConnect=function(r){const[t,u]=e.useState("idle"),[c,l]=e.useState(null),o=e.useRef(r);o.current=r;const s=e.useRef(null),a=()=>({...o.current,onSuccess:()=>{var e,n;return null===(e=(n=o.current).onSuccess)||void 0===e?void 0:e.call(n)},onError:(e,n)=>{var r,t;return null===(r=(t=o.current).onError)||void 0===r?void 0:r.call(t,e,n)},onCancel:()=>{var e,n;u("idle"),null===(e=(n=o.current).onCancel)||void 0===e||e.call(n)}});return e.useEffect(()=>{const e=n.createConnectFlow(a());s.current=e;const r=n.readConnectReturn();if("success"===(null==r?void 0:r.status))u("connected");else if("error"===(null==r?void 0:r.status)){var t,c;u("error"),l({message:null!==(t=r.message)&&void 0!==t?t:"",code:null!==(c=r.code)&&void 0!==c?c:"failed"})}return()=>{e.destroy(),s.current=null}},[]),e.useEffect(()=>{var e;null===(e=s.current)||void 0===e||e.update(a())}),{open:e.useCallback(()=>{s.current&&(l(null),u("connecting"),s.current.open())},[]),status:t,error:c}};
+"use strict";var e=require("react"),n=require("@withone/connect");const r=e=>{var n,r;return JSON.stringify([e.authorizeUrl,null!==(n=e.logos)&&void 0!==n?n:[],e.connected,e.disabled,e.variant,e.size,e.fullWidth,e.theme,e.connectTheme,null!==(r=e.openApp)&&void 0!==r?r:e.connector,e.returnTo,e.label,e.connectedLabel,e.description,e.accent,e.accentText])};exports.ConnectButton=function(t){const c=e.useRef(null),u=e.useRef(null),o=e.useRef(""),l=e.useRef(t);l.current=t;const s=()=>({...l.current,onSuccess:()=>{var e,n;return null===(e=(n=l.current).onSuccess)||void 0===e?void 0:e.call(n)},onError:(e,n)=>{var r,t;return null===(r=(t=l.current).onError)||void 0===r?void 0:r.call(t,e,n)},onCancel:()=>{var e,n;return null===(e=(n=l.current).onCancel)||void 0===e?void 0:e.call(n)}});e.useEffect(()=>{if(c.current)return u.current=n.renderConnectButton(c.current,s()),o.current=r(l.current),()=>{var e;null===(e=u.current)||void 0===e||e.destroy(),u.current=null}},[]);const a=r(t);return e.useEffect(()=>{u.current&&a!==o.current&&(o.current=a,u.current.update(s()))},[a]),e.createElement("span",{ref:c,className:t.className?`one-connect ${t.className}`:"one-connect",style:t.style,"data-variant":n.resolveVariant(t),"data-full-width":t.fullWidth?"":void 0})},exports.useOneConnect=function(r){const[t,c]=e.useState("idle"),[u,o]=e.useState(null),l=e.useRef(r);l.current=r;const s=e.useRef(null),a=()=>({...l.current,onSuccess:()=>{var e,n;return null===(e=(n=l.current).onSuccess)||void 0===e?void 0:e.call(n)},onError:(e,n)=>{var r,t;return null===(r=(t=l.current).onError)||void 0===r?void 0:r.call(t,e,n)},onCancel:()=>{var e,n;c("idle"),null===(e=(n=l.current).onCancel)||void 0===e||e.call(n)}});return e.useEffect(()=>{const e=n.createConnectFlow(a());s.current=e;const r=n.readConnectReturn();if("success"===(null==r?void 0:r.status))c("connected");else if("error"===(null==r?void 0:r.status)){var t,u;c("error"),o({message:null!==(t=r.message)&&void 0!==t?t:"",code:null!==(u=r.code)&&void 0!==u?u:"failed"})}return()=>{e.destroy(),s.current=null}},[]),e.useEffect(()=>{var e;null===(e=s.current)||void 0===e||e.update(a())}),{open:e.useCallback(()=>{s.current&&(o(null),c("connecting"),s.current.open())},[]),status:t,error:u}};

package/dist/react.esm.js

@@ -1,2 +1,2 @@
 "use client";
-import{useRef as r,useEffect as n,createElement as e,useState as t,useCallback as l}from"react";import{renderConnectButton as c,createConnectFlow as o,readConnectReturn as u}from"@withone/connect";const a=r=>{var n,e;return JSON.stringify([r.authorizeUrl,null!==(n=null!==(e=r.logos)&&void 0!==e?e:r.platforms)&&void 0!==n?n:[],r.connected,r.disabled,r.variant,r.size,r.fullWidth,r.theme,r.connectTheme,r.connector,r.returnTo,r.label,r.connectedLabel,r.description])};function s(t){var l;const o=r(null),u=r(null),s=r(""),i=r(t);i.current=t;const d=()=>({...i.current,onSuccess:()=>{var r,n;return null===(r=(n=i.current).onSuccess)||void 0===r?void 0:r.call(n)},onError:(r,n)=>{var e,t;return null===(e=(t=i.current).onError)||void 0===e?void 0:e.call(t,r,n)},onCancel:()=>{var r,n;return null===(r=(n=i.current).onCancel)||void 0===r?void 0:r.call(n)}});n(()=>{if(o.current)return u.current=c(o.current,d()),s.current=a(i.current),()=>{var r;null===(r=u.current)||void 0===r||r.destroy(),u.current=null}},[]);const v=a(t);return n(()=>{u.current&&v!==s.current&&(s.current=v,u.current.update(d()))},[v]),e("span",{ref:o,className:t.className?`one-connect ${t.className}`:"one-connect",style:t.style,"data-variant":null!==(l=t.variant)&&void 0!==l?l:"default","data-full-width":t.fullWidth?"":void 0})}function i(e){const[c,a]=t("idle"),[s,i]=t(null),d=r(e);d.current=e;const v=r(null),f=()=>({...d.current,onSuccess:()=>{var r,n;return null===(r=(n=d.current).onSuccess)||void 0===r?void 0:r.call(n)},onError:(r,n)=>{var e,t;return null===(e=(t=d.current).onError)||void 0===e?void 0:e.call(t,r,n)},onCancel:()=>{var r,n;a("idle"),null===(r=(n=d.current).onCancel)||void 0===r||r.call(n)}});n(()=>{const r=o(f());v.current=r;const n=u();if("success"===(null==n?void 0:n.status))a("connected");else if("error"===(null==n?void 0:n.status)){var e,t;a("error"),i({message:null!==(e=n.message)&&void 0!==e?e:"",code:null!==(t=n.code)&&void 0!==t?t:"failed"})}return()=>{r.destroy(),v.current=null}},[]),n(()=>{var r;null===(r=v.current)||void 0===r||r.update(f())});return{open:l(()=>{v.current&&(i(null),a("connecting"),v.current.open())},[]),status:c,error:s}}export{s as ConnectButton,i as useOneConnect};
+import{useRef as r,useEffect as n,createElement as e,useState as t,useCallback as c}from"react";import{renderConnectButton as l,resolveVariant as o,createConnectFlow as u,readConnectReturn as a}from"@withone/connect";const s=r=>{var n,e;return JSON.stringify([r.authorizeUrl,null!==(n=r.logos)&&void 0!==n?n:[],r.connected,r.disabled,r.variant,r.size,r.fullWidth,r.theme,r.connectTheme,null!==(e=r.openApp)&&void 0!==e?e:r.connector,r.returnTo,r.label,r.connectedLabel,r.description,r.accent,r.accentText])};function i(t){const c=r(null),u=r(null),a=r(""),i=r(t);i.current=t;const d=()=>({...i.current,onSuccess:()=>{var r,n;return null===(r=(n=i.current).onSuccess)||void 0===r?void 0:r.call(n)},onError:(r,n)=>{var e,t;return null===(e=(t=i.current).onError)||void 0===e?void 0:e.call(t,r,n)},onCancel:()=>{var r,n;return null===(r=(n=i.current).onCancel)||void 0===r?void 0:r.call(n)}});n(()=>{if(c.current)return u.current=l(c.current,d()),a.current=s(i.current),()=>{var r;null===(r=u.current)||void 0===r||r.destroy(),u.current=null}},[]);const v=s(t);return n(()=>{u.current&&v!==a.current&&(a.current=v,u.current.update(d()))},[v]),e("span",{ref:c,className:t.className?`one-connect ${t.className}`:"one-connect",style:t.style,"data-variant":o(t),"data-full-width":t.fullWidth?"":void 0})}function d(e){const[l,o]=t("idle"),[s,i]=t(null),d=r(e);d.current=e;const v=r(null),f=()=>({...d.current,onSuccess:()=>{var r,n;return null===(r=(n=d.current).onSuccess)||void 0===r?void 0:r.call(n)},onError:(r,n)=>{var e,t;return null===(e=(t=d.current).onError)||void 0===e?void 0:e.call(t,r,n)},onCancel:()=>{var r,n;o("idle"),null===(r=(n=d.current).onCancel)||void 0===r||r.call(n)}});n(()=>{const r=u(f());v.current=r;const n=a();if("success"===(null==n?void 0:n.status))o("connected");else if("error"===(null==n?void 0:n.status)){var e,t;o("error"),i({message:null!==(e=n.message)&&void 0!==e?e:"",code:null!==(t=n.code)&&void 0!==t?t:"failed"})}return()=>{r.destroy(),v.current=null}},[]),n(()=>{var r;null===(r=v.current)||void 0===r||r.update(f())});return{open:c(()=>{v.current&&(i(null),o("connecting"),v.current.open())},[]),status:l,error:s}}export{i as ConnectButton,d as useOneConnect};

package/dist/types.d.ts

@@ -27,9 +27,12 @@ export interface OneConnectFlowOptions {
     /** Theme for One's hosted page. Carried on the URL fragment, which
      *  survives the redirect chain, so the backend forwards nothing. */
     connectTheme?: OneConnectTheme;
-    /** A connector slug ("gmail"). One's page opens that connector's
-     *  connect screen first, then shows the full list as usual. Carried
-     *  on the URL fragment like the theme. */
+    /** An app's slug ("gmail"). One's page opens that app's connect
+     *  screen first, then shows the full list as usual. Works whether
+     *  your app asks for specific apps or for everything. Carried on the
+     *  URL fragment like the theme. */
+    openApp?: string;
+    /** @deprecated Renamed to `openApp`. Still works. */
     connector?: string;
     /** Where the user lands afterwards, for this flow only: a path on
      *  your app such as "/chat/42". Your authorize route reads it and
@@ -77,10 +80,6 @@ export interface ConnectButtonLogo {
     name: string;
     imageUrl: string;
 }
-/** @deprecated Renamed to `ConnectButtonLogoInput`; removed in 0.21.0. */
-export type ConnectButtonPlatformInput = ConnectButtonLogoInput;
-/** @deprecated Renamed to `ConnectButtonLogo`; removed in 0.21.0. */
-export type ConnectButtonPlatform = ConnectButtonLogo;
 export type ConnectButtonVariant = "default" | "accent" | "block";
 export type ConnectButtonSize = "sm" | "md" | "lg";
 export type ConnectButtonState = "idle" | "connecting" | "connected";
@@ -94,18 +93,24 @@ export interface ConnectButtonProps {
      *  into a "+N" chip. Decoration only; the permission set decides what
      *  One asks for. */
     logos?: ConnectButtonLogoInput[];
-    /** @deprecated Renamed to `logos`; removed in 0.21.0. */
-    platforms?: ConnectButtonLogoInput[];
     /** Whether this user has a live grant, from your server. When set, it
      *  decides the Connected state. When omitted, the button shows
      *  Connected only right after a successful return. */
     connected?: boolean;
     /** Not clickable, for example until terms are accepted. */
     disabled?: boolean;
-    /** default = neutral, accent = your brand colour (set
+    /** default = neutral, accent = your brand colour (`accent` below, or
      *  `--one-connect-accent` and `--one-connect-accent-fg` on the host),
-     *  block = a card with a description and a "Secured by One" foot. */
+     *  block = a card with a description and a "Secured by One" foot.
+     *  Defaults to accent when `accent` is set, else default. */
     variant?: ConnectButtonVariant;
+    /** Your brand colour, any CSS colour ("#F4A938"): the accent
+     *  variant's fill, and the variant the button uses when `variant` is
+     *  not set. Wins over `--one-connect-accent` on the host. */
+    accent?: string;
+    /** The accent variant's text and icon colour. When omitted with a hex
+     *  `accent`, the button picks dark or white text, whichever reads. */
+    accentText?: string;
     size?: ConnectButtonSize;
     /** Stretches to the width of its container. */
     fullWidth?: boolean;
@@ -113,7 +118,9 @@ export interface ConnectButtonProps {
     theme?: ConnectButtonTheme;
     /** Theme of One's hosted page. */
     connectTheme?: OneConnectTheme;
-    /** A connector slug ("gmail") to open first on One's page. */
+    /** An app's slug ("gmail") to open first on One's page. */
+    openApp?: string;
+    /** @deprecated Renamed to `openApp`. Still works. */
     connector?: string;
     /** Where this flow returns to: a path on your app. */
     returnTo?: string;

package/dist/vue.cjs.js

@@ -1 +1 @@
-"use strict";var e=require("vue"),t=require("@withone/connect");const n={type:Boolean,default:void 0},o=e.defineComponent({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},logos:{type:Array,default:void 0},platforms:{type:Array,default:void 0},connected:n,disabled:n,variant:{type:String,default:void 0},size:{type:String,default:void 0},fullWidth:n,theme:{type:String,default:void 0},connectTheme:{type:String,default:void 0},connector:{type:String,default:void 0},returnTo:{type:String,default:void 0},label:{type:String,default:void 0},connectedLabel:{type:String,default:void 0},description:{type:String,default:void 0}},emits:{success:()=>!0,error:(e,t)=>"string"==typeof e&&"string"==typeof t,cancel:()=>!0},setup(n,{emit:o}){const r=e.ref(null);let i=null;const d=()=>({...n,onSuccess:()=>o("success"),onError:(e,t)=>o("error",e,t),onCancel:()=>o("cancel")});return e.onMounted(()=>{r.value&&(i=t.renderConnectButton(r.value,d()))}),e.watch(()=>({...n}),()=>{var e;return null===(e=i)||void 0===e?void 0:e.update(d())},{deep:!0}),e.onBeforeUnmount(()=>{var e;null===(e=i)||void 0===e||e.destroy(),i=null}),()=>{var t;return e.h("span",{ref:r,class:"one-connect","data-variant":null!==(t=n.variant)&&void 0!==t?t:"default","data-full-width":n.fullWidth?"":void 0})}}});exports.ConnectButton=o;
+"use strict";var e=require("vue"),t=require("@withone/connect");const n={type:Boolean,default:void 0},o=e.defineComponent({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},logos:{type:Array,default:void 0},connected:n,disabled:n,variant:{type:String,default:void 0},size:{type:String,default:void 0},fullWidth:n,theme:{type:String,default:void 0},connectTheme:{type:String,default:void 0},openApp:{type:String,default:void 0},connector:{type:String,default:void 0},returnTo:{type:String,default:void 0},label:{type:String,default:void 0},connectedLabel:{type:String,default:void 0},description:{type:String,default:void 0},accent:{type:String,default:void 0},accentText:{type:String,default:void 0}},emits:{success:()=>!0,error:(e,t)=>"string"==typeof e&&"string"==typeof t,cancel:()=>!0},setup(n,{emit:o}){const r=e.ref(null);let i=null;const d=()=>({...n,onSuccess:()=>o("success"),onError:(e,t)=>o("error",e,t),onCancel:()=>o("cancel")});return e.onMounted(()=>{r.value&&(i=t.renderConnectButton(r.value,d()))}),e.watch(()=>({...n}),()=>{var e;return null===(e=i)||void 0===e?void 0:e.update(d())},{deep:!0}),e.onBeforeUnmount(()=>{var e;null===(e=i)||void 0===e||e.destroy(),i=null}),()=>e.h("span",{ref:r,class:"one-connect","data-variant":t.resolveVariant(n),"data-full-width":n.fullWidth?"":void 0})}});exports.ConnectButton=o;

package/dist/vue.d.ts

@@ -9,11 +9,6 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: PropType<ConnectButtonLogoInput[]>;
         default: undefined;
     };
-    /** @deprecated use logos */
-    platforms: {
-        type: PropType<ConnectButtonLogoInput[]>;
-        default: undefined;
-    };
     connected: {
         type: BooleanConstructor;
         default: undefined;
@@ -42,6 +37,11 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: PropType<OneConnectTheme>;
         default: undefined;
     };
+    openApp: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** @deprecated Renamed to openApp. Still works. */
     connector: {
         type: StringConstructor;
         default: undefined;
@@ -62,6 +62,14 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: StringConstructor;
         default: undefined;
     };
+    accent: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    accentText: {
+        type: StringConstructor;
+        default: undefined;
+    };
 }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -77,11 +85,6 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: PropType<ConnectButtonLogoInput[]>;
         default: undefined;
     };
-    /** @deprecated use logos */
-    platforms: {
-        type: PropType<ConnectButtonLogoInput[]>;
-        default: undefined;
-    };
     connected: {
         type: BooleanConstructor;
         default: undefined;
@@ -110,6 +113,11 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: PropType<OneConnectTheme>;
         default: undefined;
     };
+    openApp: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** @deprecated Renamed to openApp. Still works. */
     connector: {
         type: StringConstructor;
         default: undefined;
@@ -130,23 +138,33 @@ export declare const ConnectButton: import("vue").DefineComponent<import("vue").
         type: StringConstructor;
         default: undefined;
     };
+    accent: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    accentText: {
+        type: StringConstructor;
+        default: undefined;
+    };
 }>> & Readonly<{
     onSuccess?: (() => any) | undefined;
     onError?: ((message: string, code: ConnectFailureCode) => any) | undefined;
     onCancel?: (() => any) | undefined;
 }>, {
+    accent: string;
     connected: boolean;
     label: string;
     disabled: boolean;
     connectTheme: OneConnectTheme;
+    openApp: string;
     connector: string;
     returnTo: string;
     logos: ConnectButtonLogoInput[];
-    platforms: ConnectButtonLogoInput[];
     variant: ConnectButtonVariant;
     size: ConnectButtonSize;
     theme: ConnectButtonTheme;
     description: string;
     fullWidth: boolean;
     connectedLabel: string;
+    accentText: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/vue.esm.js

@@ -1 +1 @@
-import{defineComponent as e,ref as t,onMounted as n,watch as o,onBeforeUnmount as r,h as i}from"vue";import{renderConnectButton as l}from"@withone/connect";const d={type:Boolean,default:void 0},a=e({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},logos:{type:Array,default:void 0},platforms:{type:Array,default:void 0},connected:d,disabled:d,variant:{type:String,default:void 0},size:{type:String,default:void 0},fullWidth:d,theme:{type:String,default:void 0},connectTheme:{type:String,default:void 0},connector:{type:String,default:void 0},returnTo:{type:String,default:void 0},label:{type:String,default:void 0},connectedLabel:{type:String,default:void 0},description:{type:String,default:void 0}},emits:{success:()=>!0,error:(e,t)=>"string"==typeof e&&"string"==typeof t,cancel:()=>!0},setup(e,{emit:d}){const a=t(null);let u=null;const c=()=>({...e,onSuccess:()=>d("success"),onError:(e,t)=>d("error",e,t),onCancel:()=>d("cancel")});return n(()=>{a.value&&(u=l(a.value,c()))}),o(()=>({...e}),()=>{var e;return null===(e=u)||void 0===e?void 0:e.update(c())},{deep:!0}),r(()=>{var e;null===(e=u)||void 0===e||e.destroy(),u=null}),()=>{var t;return i("span",{ref:a,class:"one-connect","data-variant":null!==(t=e.variant)&&void 0!==t?t:"default","data-full-width":e.fullWidth?"":void 0})}}});export{a as ConnectButton};
+import{defineComponent as e,ref as t,onMounted as n,watch as o,onBeforeUnmount as r,h as i}from"vue";import{renderConnectButton as d,resolveVariant as l}from"@withone/connect";const a={type:Boolean,default:void 0},u=e({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},logos:{type:Array,default:void 0},connected:a,disabled:a,variant:{type:String,default:void 0},size:{type:String,default:void 0},fullWidth:a,theme:{type:String,default:void 0},connectTheme:{type:String,default:void 0},openApp:{type:String,default:void 0},connector:{type:String,default:void 0},returnTo:{type:String,default:void 0},label:{type:String,default:void 0},connectedLabel:{type:String,default:void 0},description:{type:String,default:void 0},accent:{type:String,default:void 0},accentText:{type:String,default:void 0}},emits:{success:()=>!0,error:(e,t)=>"string"==typeof e&&"string"==typeof t,cancel:()=>!0},setup(e,{emit:a}){const u=t(null);let c=null;const p=()=>({...e,onSuccess:()=>a("success"),onError:(e,t)=>a("error",e,t),onCancel:()=>a("cancel")});return n(()=>{u.value&&(c=d(u.value,p()))}),o(()=>({...e}),()=>{var e;return null===(e=c)||void 0===e?void 0:e.update(p())},{deep:!0}),r(()=>{var e;null===(e=c)||void 0===e||e.destroy(),c=null}),()=>i("span",{ref:u,class:"one-connect","data-variant":l(e),"data-full-width":e.fullWidth?"":void 0})}});export{u as ConnectButton};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@withone/connect",
-  "version": "0.20.0",
+  "version": "0.22.0",
   "description": "One Connect for your app: the button your users press, the two backend routes as one import, and a server client that calls One with the grant. Users keep their connections in One; your app holds only what they granted.",
   "files": [
     "dist",

package/skills/one-connect/SKILL.md

@@ -204,7 +204,7 @@ import { ConnectButton } from "@withone/connect/react";
 
 <ConnectButton
   authorizeUrl="/api/one/authorize"
-  logos={["gmail", "stripe"]}       // connector slugs, decoration only
+  logos={["gmail", "stripe"]}       // app slugs, decoration only
   connected={hasGrant}              // from the server: await oneConnect.isConnected(userId)
   onSuccess={() => { /* refetch app state */ }}
   onError={(message) => { /* show message */ }}
@@ -213,12 +213,13 @@ import { ConnectButton } from "@withone/connect/react";
 
 Optional props: `variant` ("default" | "accent" | "block"), `size` ("sm" |
 "md" | "lg"), `fullWidth`, `theme` ("light" | "dark" | "auto"),
-`connectTheme` ("light" | "dark", One's page), `connector` (a slug such as
-"gmail": One's page opens that connector's connect screen first, then the
-usual list), `returnTo` (a path on the app this flow returns to), `label`,
-`connectedLabel`, `description`, `disabled`, `onCancel`. The accent variant's colours come
-from the host's `--one-connect-accent` and `--one-connect-accent-fg` CSS
-variables.
+`connectTheme` ("light" | "dark", One's page), `openApp` (a slug such as
+"gmail": One's page opens that app's connect screen first, then the usual
+list; works for specific apps and for everything), `returnTo` (a path on the app this flow returns to), `label`,
+`connectedLabel`, `description`, `disabled`, `onCancel`, `accent` and
+`accentText` (the brand colour and the text on it, e.g. `accent="#F4A938"`;
+`accent` alone switches to the accent variant and picks readable text).
+Attributes on `<one-connect-button>`: `accent` and `accent-text`.
 
 Vue: `@withone/connect/vue`, same props. Svelte: `use:connectButton` from
 `@withone/connect/svelte`. Anything else: `import "@withone/connect"` and use
@@ -243,14 +244,14 @@ keep it and wire the flow to it instead of adding a second style:
   button.addEventListener("click", () => flow.open());
   ```
 
-- One connector at a time (a chat that says "Connect Gmail", a settings
-  row): `useOneConnect({ authorizeUrl, connector: "gmail", returnTo: "/chat/42" })`.
+- One app at a time (a chat that says "Connect Gmail", a settings
+  row): `useOneConnect({ authorizeUrl, openApp: "gmail", returnTo: "/chat/42" })`.
   One's page still signs the user in and asks for the space, then opens
   Gmail's connect screen instead of the list; the list follows with
   everything connected. `returnTo` must be a path on the app.
 
 - No SDK in the browser (server-rendered pages): a plain link,
-  `<a href="/api/one/authorize">` (add `#one_connector=gmail` and
+  `<a href="/api/one/authorize">` (add `#one_open_app=gmail` and
   `?one_return_to=%2Fchat%2F42` for the above). The user returns with
   `?one_connect=success`, or `?one_connect=error&one_connect_error=` with
   `declined`, `expired` or `failed`. Show the app's own text per code, never

package/src/button.ts

@@ -21,7 +21,8 @@ import type {
  *
  * Theming hooks for the host page: `--one-connect-font`,
  * `--one-connect-radius`, `--one-connect-accent` and
- * `--one-connect-accent-fg` (the accent variant's fill and text), and
+ * `--one-connect-accent-fg` (the accent variant's fill and text; the
+ * `accent` / `accentText` props set the same two and win), and
  * `::part(button)` / `::part(label)` on the host (`one-connect-button`,
  * or `.one-connect` for the wrappers).
  */
@@ -151,7 +152,7 @@ const icon = (svg: string, className = "icon"): HTMLSpanElement => {
 };
 
 function buildStack(props: ConnectButtonProps): HTMLElement | null {
-  const platforms = normalizePlatforms(props.logos ?? props.platforms);
+  const platforms = normalizePlatforms(props.logos);
   if (platforms.length === 0) return null;
   const stack = el("span", "stack");
   stack.setAttribute("aria-hidden", "true");
@@ -176,13 +177,57 @@ function buildStack(props: ConnectButtonProps): HTMLElement | null {
   return stack;
 }
 
+/** @internal The variant drawn: the one asked for, else accent when a brand colour
+ *  is given, else default. */
+export const resolveVariant = (props: ConnectButtonProps) =>
+  props.variant ?? (props.accent ? "accent" : "default");
+
+/** Dark or white text on a hex fill, whichever reads (WCAG relative
+ *  luminance). Null for anything that isn't a hex colour: the stylesheet's
+ *  default stands. */
+export function readableTextOn(fill: string): string | null {
+  const hex = fill.trim().replace(/^#/, "");
+  const full =
+    hex.length === 3
+      ? hex
+          .split("")
+          .map((c) => c + c)
+          .join("")
+      : hex;
+  if (!/^[0-9a-f]{6}$/i.test(full)) return null;
+  const channel = (i: number) => {
+    const v = parseInt(full.slice(i, i + 2), 16) / 255;
+    return v <= 0.03928 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4;
+  };
+  const luminance =
+    0.2126 * channel(0) + 0.7152 * channel(2) + 0.0722 * channel(4);
+  // Contrast of carbon text on the fill against white text on it
+  // (carbon's own luminance is about 0.0037).
+  const carbonOnFill = (luminance + 0.05) / (0.0037 + 0.05);
+  const whiteOnFill = 1.05 / (luminance + 0.05);
+  return carbonOnFill >= whiteOnFill ? CARBON : WHITE;
+}
+
+/** Brand colours from props, set on the button through the CSSOM (which
+ *  a strict style-src allows), so they win over the host's variables. */
+function applyAccent(button: HTMLElement, props: ConnectButtonProps): void {
+  const accent = props.accent?.trim();
+  const text =
+    props.accentText?.trim() || (accent ? readableTextOn(accent) : null);
+  if (accent) button.style.setProperty("--one-connect-accent", accent);
+  else button.style.removeProperty("--one-connect-accent");
+  if (text) button.style.setProperty("--one-connect-accent-fg", text);
+  else button.style.removeProperty("--one-connect-accent-fg");
+  if (!button.getAttribute("style")) button.removeAttribute("style");
+}
+
 const flowOptions = (
   props: ConnectButtonProps,
   handlers: Pick<OneConnectFlowOptions, "onSuccess" | "onError" | "onCancel">,
 ): OneConnectFlowOptions => ({
   authorizeUrl: props.authorizeUrl,
   connectTheme: props.connectTheme,
-  connector: props.connector,
+  openApp: props.openApp ?? props.connector,
   returnTo: props.returnTo,
   ...handlers,
 });
@@ -256,7 +301,7 @@ export function renderConnectButton(
   const render = () => {
     if (destroyed) return;
     const current = state();
-    const variant = props.variant ?? "default";
+    const variant = resolveVariant(props);
     const text =
       current === "connecting"
         ? "Connecting…"
@@ -265,6 +310,7 @@ export function renderConnectButton(
           : (props.label ?? "Connect your apps");
 
     button.dataset.variant = variant;
+    applyAccent(button, props);
     button.dataset.size = props.size ?? "md";
     button.dataset.theme = props.theme ?? "light";
     button.dataset.state = current;
@@ -353,7 +399,7 @@ export function mountConnectButton(
   const host = document.createElement("span");
   host.className = "one-connect";
   const layout = (next: ConnectButtonProps) => {
-    host.setAttribute("data-variant", next.variant ?? "default");
+    host.setAttribute("data-variant", resolveVariant(next));
     host.toggleAttribute("data-full-width", Boolean(next.fullWidth));
   };
   layout(props);
@@ -376,7 +422,6 @@ export function mountConnectButton(
 const ATTRIBUTES = [
   "authorize-url",
   "logos",
-  "platforms",
   "connected",
   "disabled",
   "variant",
@@ -384,11 +429,14 @@ const ATTRIBUTES = [
   "full-width",
   "theme",
   "connect-theme",
+  "open-app",
   "connector",
   "return-to",
   "label",
   "connected-label",
   "description",
+  "accent",
+  "accent-text",
 ] as const;
 
 /** An attribute narrowed to a known set of values; anything else is
@@ -448,9 +496,7 @@ export function registerConnectButton(): void {
     private props(authorizeUrl: string): ConnectButtonProps {
       return {
         authorizeUrl,
-        logos: parsePlatformsAttribute(
-          this.getAttribute("logos") ?? this.getAttribute("platforms"),
-        ),
+        logos: parsePlatformsAttribute(this.getAttribute("logos")),
         connected: flag(this, "connected"),
         disabled: flag(this, "disabled"),
         variant: attributeAs(this, "variant", ["default", "accent", "block"]),
@@ -458,11 +504,16 @@ export function registerConnectButton(): void {
         fullWidth: flag(this, "full-width"),
         theme: attributeAs(this, "theme", ["light", "dark", "auto"]),
         connectTheme: attributeAs(this, "connect-theme", ["light", "dark"]),
-        connector: this.getAttribute("connector") ?? undefined,
+        openApp:
+          this.getAttribute("open-app") ??
+          this.getAttribute("connector") ??
+          undefined,
         returnTo: this.getAttribute("return-to") ?? undefined,
         label: this.getAttribute("label") ?? undefined,
         connectedLabel: this.getAttribute("connected-label") ?? undefined,
         description: this.getAttribute("description") ?? undefined,
+        accent: this.getAttribute("accent") ?? undefined,
+        accentText: this.getAttribute("accent-text") ?? undefined,
         onSuccess: () => {
           this.onSuccess?.();
           this.dispatchEvent(new CustomEvent("success"));

package/src/constants.ts

@@ -13,11 +13,12 @@ export const LEGACY_MESSAGE_PARAM = "one_connect_message";
  *  chain, so the app's backend forwards nothing. */
 export const THEME_PARAM = "one_theme";
 
-/** Fragment key naming the connector One's page opens first. Sign-in
- *  and the space step run as always; then that connector's connect
- *  screen opens instead of the list, and the list follows with
- *  everything the user has connected. */
-export const CONNECTOR_PARAM = "one_connector";
+/** Fragment key naming the app One's page opens first. Sign-in and the
+ *  space step run as always; then that app's connect screen opens
+ *  instead of the list, and the list follows with everything the user
+ *  has connected. One's page also reads the old `one_connector` key, so
+ *  links written before the rename keep working. */
+export const OPEN_APP_PARAM = "one_open_app";
 
 /** Query param on the app's own authorize route naming where this one
  *  flow returns to. The route reads it; it never reaches One. */

package/src/flow.ts

@@ -1,4 +1,4 @@
-import { CONNECTOR_PARAM, RETURN_TO_PARAM, THEME_PARAM } from "./constants";
+import { OPEN_APP_PARAM, RETURN_TO_PARAM, THEME_PARAM } from "./constants";
 import { hasReturnParams, parseReturn, stripReturnParams } from "./return";
 import type {
   OneConnectFlow,
@@ -91,7 +91,7 @@ function bindPageshow(): void {
   });
 }
 
-/** The theme and the connector ride the fragment: no server sees it,
+/** The theme and the app to open ride the fragment: no server sees it,
  *  and it survives every redirect to One's page. The return path is a
  *  query param for the app's own route, which reads it and keeps it. */
 const authorizeUrlFor = (options: OneConnectFlowOptions): string => {
@@ -100,8 +100,8 @@ const authorizeUrlFor = (options: OneConnectFlowOptions): string => {
     if (options.returnTo) url.searchParams.set(RETURN_TO_PARAM, options.returnTo);
     const fragment = new URLSearchParams();
     if (options.connectTheme) fragment.set(THEME_PARAM, options.connectTheme);
-    const connector = options.connector?.trim().toLowerCase();
-    if (connector) fragment.set(CONNECTOR_PARAM, connector);
+    const app = (options.openApp ?? options.connector)?.trim().toLowerCase();
+    if (app) fragment.set(OPEN_APP_PARAM, app);
     const hash = fragment.toString();
     if (hash) url.hash = hash;
     return url.toString();

package/src/index.ts

@@ -3,13 +3,12 @@ export {
   mountConnectButton,
   registerConnectButton,
   renderConnectButton,
+  resolveVariant,
 } from "./button";
 export type {
   ConnectButtonHandle,
   ConnectButtonLogo,
   ConnectButtonLogoInput,
-  ConnectButtonPlatform,
-  ConnectButtonPlatformInput,
   ConnectButtonProps,
   ConnectButtonSize,
   ConnectButtonState,
@@ -21,4 +20,3 @@ export type {
   OneConnectReturn,
   OneConnectTheme,
 } from "./types";
-

package/src/platforms.ts

@@ -1,7 +1,7 @@
 import { CONNECTOR_ASSETS_URL } from "./constants";
 import type {
-  ConnectButtonPlatform,
-  ConnectButtonPlatformInput,
+  ConnectButtonLogo,
+  ConnectButtonLogoInput,
 } from "./types";
 
 /** "Google Calendar" -> "google-calendar". */
@@ -69,8 +69,8 @@ export function logoUrlForSlug(slug: string): string {
  * as an empty chip.
  */
 export function normalizePlatform(
-  input: ConnectButtonPlatformInput,
-): ConnectButtonPlatform | null {
+  input: ConnectButtonLogoInput,
+): ConnectButtonLogo | null {
   const raw = typeof input === "string" ? { slug: input } : input;
   const slug = raw.slug?.trim()
     ? slugFromName(raw.slug)
@@ -86,11 +86,11 @@ export function normalizePlatform(
 }
 
 export function normalizePlatforms(
-  inputs: ConnectButtonPlatformInput[] | undefined,
-): ConnectButtonPlatform[] {
+  inputs: ConnectButtonLogoInput[] | undefined,
+): ConnectButtonLogo[] {
   return (inputs ?? [])
     .map(normalizePlatform)
-    .filter((p): p is ConnectButtonPlatform => p !== null);
+    .filter((p): p is ConnectButtonLogo => p !== null);
 }
 
 /**
@@ -100,7 +100,7 @@ export function normalizePlatforms(
  */
 export function parsePlatformsAttribute(
   raw: string | null,
-): ConnectButtonPlatformInput[] {
+): ConnectButtonLogoInput[] {
   const value = raw?.trim();
   if (!value) return [];
   if (value.startsWith("[")) {
@@ -108,7 +108,7 @@ export function parsePlatformsAttribute(
       const parsed = JSON.parse(value) as unknown;
       return Array.isArray(parsed)
         ? parsed.filter(
-            (entry): entry is ConnectButtonPlatformInput =>
+            (entry): entry is ConnectButtonLogoInput =>
               typeof entry === "string" ||
               (typeof entry === "object" && entry !== null),
           )

package/src/react.ts

@@ -12,6 +12,7 @@ import {
   createConnectFlow,
   readConnectReturn,
   renderConnectButton,
+  resolveVariant,
   type ConnectButtonHandle,
   type ConnectButtonProps as ConnectButtonCoreProps,
   type ConnectFailureCode,
@@ -30,7 +31,7 @@ export interface ConnectButtonProps extends ConnectButtonCoreProps {
 const visualKey = (props: ConnectButtonCoreProps): string =>
   JSON.stringify([
     props.authorizeUrl,
-    props.logos ?? props.platforms ?? [],
+    props.logos ?? [],
     props.connected,
     props.disabled,
     props.variant,
@@ -38,11 +39,13 @@ const visualKey = (props: ConnectButtonCoreProps): string =>
     props.fullWidth,
     props.theme,
     props.connectTheme,
-    props.connector,
+    props.openApp ?? props.connector,
     props.returnTo,
     props.label,
     props.connectedLabel,
     props.description,
+    props.accent,
+    props.accentText,
   ]);
 
 export function ConnectButton(props: ConnectButtonProps): ReactElement {
@@ -91,7 +94,7 @@ export function ConnectButton(props: ConnectButtonProps): ReactElement {
       ? `one-connect ${props.className}`
       : "one-connect",
     style: props.style,
-    "data-variant": props.variant ?? "default",
+    "data-variant": resolveVariant(props),
     "data-full-width": props.fullWidth ? "" : undefined,
   });
 }

package/src/types.ts

@@ -31,9 +31,12 @@ export interface OneConnectFlowOptions {
   /** Theme for One's hosted page. Carried on the URL fragment, which
    *  survives the redirect chain, so the backend forwards nothing. */
   connectTheme?: OneConnectTheme;
-  /** A connector slug ("gmail"). One's page opens that connector's
-   *  connect screen first, then shows the full list as usual. Carried
-   *  on the URL fragment like the theme. */
+  /** An app's slug ("gmail"). One's page opens that app's connect
+   *  screen first, then shows the full list as usual. Works whether
+   *  your app asks for specific apps or for everything. Carried on the
+   *  URL fragment like the theme. */
+  openApp?: string;
+  /** @deprecated Renamed to `openApp`. Still works. */
   connector?: string;
   /** Where the user lands afterwards, for this flow only: a path on
    *  your app such as "/chat/42". Your authorize route reads it and
@@ -83,11 +86,6 @@ export interface ConnectButtonLogo {
   imageUrl: string;
 }
 
-/** @deprecated Renamed to `ConnectButtonLogoInput`; removed in 0.21.0. */
-export type ConnectButtonPlatformInput = ConnectButtonLogoInput;
-/** @deprecated Renamed to `ConnectButtonLogo`; removed in 0.21.0. */
-export type ConnectButtonPlatform = ConnectButtonLogo;
-
 export type ConnectButtonVariant = "default" | "accent" | "block";
 export type ConnectButtonSize = "sm" | "md" | "lg";
 export type ConnectButtonState = "idle" | "connecting" | "connected";
@@ -102,18 +100,24 @@ export interface ConnectButtonProps {
    *  into a "+N" chip. Decoration only; the permission set decides what
    *  One asks for. */
   logos?: ConnectButtonLogoInput[];
-  /** @deprecated Renamed to `logos`; removed in 0.21.0. */
-  platforms?: ConnectButtonLogoInput[];
   /** Whether this user has a live grant, from your server. When set, it
    *  decides the Connected state. When omitted, the button shows
    *  Connected only right after a successful return. */
   connected?: boolean;
   /** Not clickable, for example until terms are accepted. */
   disabled?: boolean;
-  /** default = neutral, accent = your brand colour (set
+  /** default = neutral, accent = your brand colour (`accent` below, or
    *  `--one-connect-accent` and `--one-connect-accent-fg` on the host),
-   *  block = a card with a description and a "Secured by One" foot. */
+   *  block = a card with a description and a "Secured by One" foot.
+   *  Defaults to accent when `accent` is set, else default. */
   variant?: ConnectButtonVariant;
+  /** Your brand colour, any CSS colour ("#F4A938"): the accent
+   *  variant's fill, and the variant the button uses when `variant` is
+   *  not set. Wins over `--one-connect-accent` on the host. */
+  accent?: string;
+  /** The accent variant's text and icon colour. When omitted with a hex
+   *  `accent`, the button picks dark or white text, whichever reads. */
+  accentText?: string;
   size?: ConnectButtonSize;
   /** Stretches to the width of its container. */
   fullWidth?: boolean;
@@ -121,7 +125,9 @@ export interface ConnectButtonProps {
   theme?: ConnectButtonTheme;
   /** Theme of One's hosted page. */
   connectTheme?: OneConnectTheme;
-  /** A connector slug ("gmail") to open first on One's page. */
+  /** An app's slug ("gmail") to open first on One's page. */
+  openApp?: string;
+  /** @deprecated Renamed to `openApp`. Still works. */
   connector?: string;
   /** Where this flow returns to: a path on your app. */
   returnTo?: string;

package/src/vue.ts

@@ -3,7 +3,7 @@
  *
  *   <ConnectButton
  *     authorize-url="/api/one/authorize"
- *     :platforms="['stripe', 'notion']"
+ *     :logos="['stripe', 'notion']"
  *     :connected="user.hasOneGrant"
  *     @success="onConnected"
  *   />
@@ -22,6 +22,7 @@ import type { PropType } from "vue";
 
 import {
   renderConnectButton,
+  resolveVariant,
   type ConnectButtonHandle,
   type ConnectButtonLogoInput,
   type ConnectButtonProps,
@@ -44,11 +45,6 @@ export const ConnectButton = defineComponent({
       type: Array as PropType<ConnectButtonLogoInput[]>,
       default: undefined,
     },
-    /** @deprecated use logos */
-    platforms: {
-      type: Array as PropType<ConnectButtonLogoInput[]>,
-      default: undefined,
-    },
     connected: optionalBoolean,
     disabled: optionalBoolean,
     variant: {
@@ -62,11 +58,15 @@ export const ConnectButton = defineComponent({
       type: String as PropType<OneConnectTheme>,
       default: undefined,
     },
+    openApp: { type: String, default: undefined },
+    /** @deprecated Renamed to openApp. Still works. */
     connector: { type: String, default: undefined },
     returnTo: { type: String, default: undefined },
     label: { type: String, default: undefined },
     connectedLabel: { type: String, default: undefined },
     description: { type: String, default: undefined },
+    accent: { type: String, default: undefined },
+    accentText: { type: String, default: undefined },
   },
   emits: {
     success: () => true,
@@ -104,7 +104,7 @@ export const ConnectButton = defineComponent({
       h("span", {
         ref: host,
         class: "one-connect",
-        "data-variant": props.variant ?? "default",
+        "data-variant": resolveVariant(props),
         "data-full-width": props.fullWidth ? "" : undefined,
       });
   },