@widgex/wgx 0.0.0-stage → 0.4.2

package/python/xactor/widgets/__init__.py

@@ -0,0 +1 @@
+# xactor widget libraries

package/python/xactor/widgets/github_tokens.py

@@ -0,0 +1,314 @@
+r"""
+GitHub -- Personal Access Tokens widget (classic and fine-grained).
+
+Covers GitHub token management:
+  GitHubLogin -> TokensPage -> CreateClassicTokenDialog -> TokenCreatedDialog
+              \-> CreateFineGrainedTokenDialog -> TokenCreatedDialog
+
+Token flow (login -> generate -> extract):
+  0. Navigate to github.com/settings/tokens
+  1. If not authenticated, login page appears (do not attempt login)
+  2. TokensPage shows existing tokens and "Generate new token" dropdown
+  3. Select token type (Classic or Fine-grained)
+  4. Fill in token details (name, expiration, scopes/permissions)
+  5. Generate -> TokenCreatedDialog
+  6. Extract token value using extract_secret
+  7. Done -> TokensPage
+
+Usage:
+    # In an xactor shell:
+    await api.use_widget("github_tokens")
+    state = await registry.here(api)
+    print(state.describe())
+"""
+
+# These names are injected into scope by the xactor shell runtime:
+#   PageState, Observation, Transition, Step, registry
+
+# ===============================================================
+# State 0: GitHub Login (authentication gate)
+# ===============================================================
+github_login = PageState(
+    "GitHubLogin",
+    url_pattern=r"github\.com/login(?:\?|$)",
+    keywords=["Sign in to GitHub", "Username or email address", "Password"],
+    expected_timeout=120.0,
+    observations=[
+        Observation(
+            "login_form",
+            description="Login form presence and any error messages",
+            js="""(() => {
+                const form = document.querySelector('form');
+                const error = document.querySelector('[role=alert], .flash-error');
+                return {
+                    form_present: !!form,
+                    error_message: error?.textContent?.trim() || null,
+                    fields: form ? Array.from(form.querySelectorAll('input[type=text], input[type=password], textbox')).map(
+                        f => f.getAttribute('aria-label') || f.name || ''
+                    ).filter(Boolean) : [],
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "wait_for_login",
+            description="Wait for the user to complete GitHub sign-in. "
+                        "Blocks until the browser leaves the login page. "
+                        "Do NOT attempt to fill credentials -- let the user sign in manually.",
+            steps=[
+                Step("wait_for", 'main/heading"Personal access tokens"', timeout_ms=120000),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# State 1: Tokens Page (/settings/tokens)
+# ===============================================================
+tokens_page = PageState(
+    "TokensPage",
+    url_pattern=r"github\.com/settings/tokens",
+    keywords=["Personal access tokens", "Generate new token", "Classic", "Fine-grained"],
+    expected_timeout=5.0,
+    observations=[
+        Observation(
+            "existing_tokens",
+            description="List of existing personal access tokens with name, last used, and expiration",
+            js="""(() => {
+                const rows = Array.from(document.querySelectorAll('table tbody tr, [role=row]'));
+                return rows.map(row => {
+                    const cells = Array.from(row.querySelectorAll('td, [role=gridcell]'));
+                    return {
+                        name: cells[0]?.textContent?.trim(),
+                        last_used: cells[1]?.textContent?.trim(),
+                        expiration: cells[2]?.textContent?.trim(),
+                        scopes_or_permissions: cells[3]?.textContent?.trim(),
+                    };
+                }).filter(r => r.name && r.name.length > 0);
+            })()""",
+        ),
+        Observation(
+            "page_structure",
+            description="Headings and interactive elements on the tokens page",
+            js="""(() => {
+                const headings = Array.from(document.querySelectorAll('h1,h2,h3,[role=heading]')).map(
+                    h => h.textContent?.trim()
+                ).filter(Boolean);
+                const buttons = Array.from(document.querySelectorAll('button, [role=button]')).map(
+                    b => b.textContent.trim()
+                ).filter(t => t.length > 0 && t.length < 50);
+                return { headings, buttons };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "generate_classic_token",
+            description="Open the dialog to generate a classic personal access token.",
+            steps=[
+                Step("click", 'button"Generate new token"'),
+                Step("click", "Classic"),
+            ],
+        ),
+        Transition(
+            "generate_fine_grained_token",
+            description="Open the dialog to generate a fine-grained personal access token.",
+            steps=[
+                Step("click", 'button"Generate new token"'),
+                Step("click", "Fine-grained"),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# State 2: Create Classic Token Dialog
+# ===============================================================
+create_classic_token_dialog = PageState(
+    "CreateClassicTokenDialog",
+    url_pattern=r"github\.com/settings/tokens/new",
+    keywords=["New personal access token", "Note", "Expiration", "Select scopes", "Generate token"],
+    expected_timeout=5.0,
+    observations=[
+        Observation(
+            "form_state",
+            description="Current state of the classic token creation form",
+            js="""(() => {
+                const noteInput = document.querySelector('input[placeholder*="Token description i"], input[aria-label*="Description i"]');
+                const expirationSelect = document.querySelector('select[aria-label*="Expiration"], [role=combobox]');
+                const scopeCheckboxes = Array.from(document.querySelectorAll('input[type=checkbox]')).map(
+                    cb => ({
+                        label: cb.labels?.[0]?.textContent?.trim() || cb.getAttribute('aria-label') || '',
+                        checked: cb.checked
+                    })
+                ).filter(s => s.label);
+                return {
+                    note_value: noteInput?.value || '',
+                    note_placeholder: noteInput?.placeholder || '',
+                    expiration_value: expirationSelect?.value || '',
+                    scopes_selected: scopeCheckboxes.filter(s => s.checked).map(s => s.label),
+                    scopes_available: scopeCheckboxes.map(s => s.label),
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "set_token_name",
+            description="Type a description/name for the token.",
+            params={"name": "str"},
+            steps=[Step("clear_and_type", 'textbox"Token description"', text="$name")],
+        ),
+        Transition(
+            "set_expiration",
+            description="Set token expiration. Options: 7 days, 30 days, 60 days, 90 days, 1 year, or No expiration.",
+            params={"days": "str"},
+            steps=[Step("select", 'select[aria-label*="Expiration"]', label="$days")],
+        ),
+        Transition(
+            "toggle_scope",
+            description="Toggle a scope checkbox by its label (e.g., 'repo', 'gist', 'read:user').",
+            params={"scope_name": "str"},
+            steps=[Step("click", 'input[aria-label*="$scope_name"], label:has-text("$scope_name")')],
+        ),
+        Transition(
+            "generate_token",
+            description="Click 'Generate token' to create the token. "
+                        "Waits for the token value display to appear.",
+            steps=[
+                Step("scroll_to", 'button"Generate token"'),
+                Step("click", 'button"Generate token"'),
+                Step("wait_for", 'pre, code, input[readonly]', timeout_ms=10000),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# State 3: Create Fine-Grained Token Dialog
+# ===============================================================
+create_fine_grained_token_dialog = PageState(
+    "CreateFineGrainedTokenDialog",
+    url_pattern=r"github\.com/settings/tokens/new\?type=beta",
+    keywords=["New fine-grained personal access token", "Token name", "Expiration",
+              "Repository access", "Permissions", "Generate token"],
+    expected_timeout=5.0,
+    observations=[
+        Observation(
+            "form_state",
+            description="Current state of the fine-grained token creation form",
+            js="""(() => {
+                const nameInput = document.querySelector('input[aria-label*="Token name"]');
+                const expirationSelect = document.querySelector('select[aria-label*="Expiration"]');
+                const repoAccess = document.querySelector('fieldset:has(legend:contains("Repository access"))');
+                return {
+                    token_name: nameInput?.value || '',
+                    expiration: expirationSelect?.value || '',
+                    has_repo_access_section: !!repoAccess,
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "set_token_name",
+            description="Type a name for the fine-grained token.",
+            params={"name": "str"},
+            steps=[Step("clear_and_type", 'textbox"Token name"', text="$name")],
+        ),
+        Transition(
+            "set_expiration",
+            description="Set token expiration. Options: 7 days, 30 days, 60 days, 90 days, 1 year, or No expiration.",
+            params={"days": "str"},
+            steps=[Step("select", 'select[aria-label*="Expiration"]', label="$days")],
+        ),
+        Transition(
+            "generate_token",
+            description="Click 'Generate token' to create the fine-grained token. "
+                        "Waits for the token value display to appear.",
+            steps=[
+                Step("scroll_to", 'button"Generate token"'),
+                Step("click", 'button"Generate token"'),
+                Step("wait_for", 'pre, code, input[readonly]', timeout_ms=10000),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# State 4: Token Created (success view with token value)
+# ===============================================================
+token_created_dialog = PageState(
+    "TokenCreatedDialog",
+    url_pattern=r"github\.com/settings/tokens/\w+",
+    keywords=["Personal access token", "Make sure to copy", "won't be shown again",
+              "Copy", "Close", "Remember to store securely"],
+    expected_timeout=5.0,
+    observations=[
+        Observation(
+            "token_info",
+            description="Token creation success state. Shows token value display area "
+                        "(use extract_token to securely save it).",
+            js="""(() => {
+                const heading = Array.from(document.querySelectorAll('h1,h2,h3,[role=heading]')).find(
+                    h => h.textContent?.includes('Personal access token') || h.textContent?.includes('Token')
+                );
+                if (!heading) return {dialog_open: false};
+                let container = heading;
+                for (let i = 0; i < 8; i++) { if (container.parentElement) container = container.parentElement; }
+                const pre = container.querySelector('pre');
+                const codeEl = container.querySelector('code');
+                const readonlyInput = container.querySelector('input[readonly]');
+                const copyButton = container.querySelector('button[aria-label*="Copy"], button:has-text("Copy")');
+                return {
+                    token_visible: !!(pre?.textContent || codeEl?.textContent || readonlyInput?.value),
+                    has_copy_button: !!copyButton,
+                    selector_hint: pre ? 'pre'
+                        : codeEl ? 'code'
+                        : readonlyInput ? 'input[readonly]'
+                        : 'unknown',
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "extract_token",
+            description="Securely extract the token value and save it to .env using extract_secret. "
+                        "The token value never passes through the agent. "
+                        "Pass the desired env variable name (e.g., 'GITHUB_TOKEN').",
+            params={"env_var": "str"},
+            steps=[Step("extract_secret", 'pre, code, input[readonly]', env_var="$env_var")],
+        ),
+        Transition(
+            "close",
+            description="Close the token view and return to the tokens list.",
+            steps=[Step("navigate", "https://github.com/settings/tokens")],
+        ),
+    ],
+)
+
+# ===============================================================
+# Register all states with adjacency graph
+# ===============================================================
+registry.add(github_login, transitions_to=[
+    "TokensPage",
+])
+
+registry.add(tokens_page, transitions_to=[
+    "CreateClassicTokenDialog", "CreateFineGrainedTokenDialog",
+])
+
+registry.add(create_classic_token_dialog, transitions_to=[
+    "TokenCreatedDialog", "TokensPage",
+])
+
+registry.add(create_fine_grained_token_dialog, transitions_to=[
+    "TokenCreatedDialog", "TokensPage",
+])
+
+registry.add(token_created_dialog, transitions_to=[
+    "TokensPage",
+])
+    

package/python/xactor/widgets/google_aistudio.py

@@ -0,0 +1,365 @@
+"""
+Google AI Studio — key creation for the providers panel.
+
+    AIStudioServiceBlocked ─▶ AIStudioAccountChooser ─┐
+    AIStudioSignIn ───────────────────────────────────┴─▶ AIStudioKeys
+                                                              │
+                          AIStudioKeyDetails ◀── AIStudioCreateKey
+
+`AIStudio` and not `Google`, because `gcp_oauth.py` already owns a `GoogleSignIn`
+covering the same `accounts.google.com` — and `StateRegistry` is keyed by name,
+so on the agent path, where every widget loads into one shell, the second
+registration would silently replace the first. The panel never sees this (it
+loads one widget), which is exactly what would have made it hard to find.
+
+Angular Material. `mat-dialog-container`, `mat-select`, `mat-form-field` are
+documented tag selectors and are used throughout. Ids are **not**: the name
+input's id is a per-render GUID (`input-260574C1-…`), the exact inverse of xAI.
+`aria-label` is stable here and this site labels almost everything, including
+each individual copy button — which matters because icon buttons render their
+ligature name as text (`content_copy`, `close`, `delete`), so matching buttons
+on `innerText` is noisy in a way it is not on the other three consoles.
+
+Written from `.widgex/plans/recon/google.md`.
+
+## Three ways in, and only one of them is a sign-in
+
+**A Workspace account can be refused outright.** With a managed account active,
+`/apikey` redirects to `access.workspace.google.com/ServiceNotAllowed` — *"Your
+account is managed by an organization that has this service turned off."* That
+is terminal, not a login prompt: no credential fixes it, only a different
+account. `AIStudioServiceBlocked` exists to tell those two apart, because the
+remedies have nothing in common.
+
+**The account chooser needs no credentials.** Picking an already-authenticated
+session from `accounts.google.com/AccountChooser` is a session switch that
+completes straight through to the destination, so it is automatable. Entering a
+password is not, and is not modelled — `AIStudioSignIn` waits.
+
+**The URL you land on shares no path with the one you asked for.** `/apikey`
+becomes `/u/<n>/api-keys?pli=1&project=…`. Any pattern has to tolerate the
+account-index segment, so these match on host plus a trailing key path.
+
+## Two consequences of a pre-filled form
+
+Both fields arrive filled — the name defaults to `Gemini API Key` and the
+project to the first imported one — and `Create key` is enabled immediately.
+That is why the recon account holds `Gemini API Key`, `Gemini API Key 2`, `3`
+and `4`.
+
+So `set_name` must *overwrite* rather than type into an assumed-empty field
+(`dom_fill` replaces, which is why it is the verb), and because a bare commit
+silently succeeds under the generic name there is no natural error to catch if
+naming fails — `form_state` exists to be checked, not merely to be available.
+
+The project select is deliberately not driven. It arrives pointed at a real
+imported project and the panel has nothing better to say about which one; a
+control the panel never touches does not get a transition.
+
+## The reveal is text, and Google is the only one that forgives it
+
+`API key details` contains no input element at all — the key is text following
+the `API Key` label, so it lands in any `innerText` read. `key_location` marks
+the one node so `capture_secret` can take that node alone, the same as xAI.
+
+Unlike the other three, though, the key stays retrievable: clicking a row's
+masked value reopens this dialog with the full secret. A failed capture here is
+recoverable, so the "do not dismiss until the host confirms capture" rule the
+others need does not bind. It is still followed, because one code path is
+better than two.
+"""
+
+# Injected into scope by the xactor shell runtime:
+#   PageState, Observation, Transition, Step, registry
+
+# `/apikey` as requested, `/api-keys` as landed on, `/u/<n>/` in between.
+GOOGLE_KEYS_URL = r"aistudio\.google\.com/(?:u/\d+/)?api-?keys?"
+
+# ===============================================================
+# Wall 1 — the account is not allowed to use AI Studio at all
+# ===============================================================
+ai_studio_service_blocked = PageState(
+    "AIStudioServiceBlocked",
+    url_pattern=r"access\.workspace\.google\.com",
+    keywords=["Service Not Allowed", "do not have access", "managed by an organization"],
+    expected_timeout=10.0,
+    observations=[
+        Observation(
+            "block_reason",
+            description="That AI Studio is disabled for the signed-in Workspace account, "
+                        "and whether an account switch is offered. No credential will fix "
+                        "this; a different account is the only route.",
+            js="""(() => {
+                const chooser = document.querySelector('a[href*="AccountChooser"]');
+                return {
+                    blocked: true,
+                    url: location.href,
+                    message: document.body.innerText.trim().slice(0, 300),
+                    can_switch_account: !!chooser,
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "switch_account",
+            description="Follow the page's own 'Sign in with a different account' link to "
+                        "the account chooser.",
+            steps=[
+                Step("dom_click", 'a[href*="AccountChooser"]'),
+                Step("wait_for_element", "[data-identifier]", timeout_ms=20000),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# Wall 2 — pick among sessions that are already signed in
+# ===============================================================
+#
+# Automatable, and the only Google wall that is: choosing a listed identity is a
+# session switch, not an authentication. `Use another account` leads to a
+# credential form and is not modelled.
+ai_studio_account_chooser = PageState(
+    "AIStudioAccountChooser",
+    url_pattern=r"accounts\.google\.com/AccountChooser",
+    keywords=["Choose an account", "Use another account", "Signed out"],
+    expected_timeout=15.0,
+    observations=[
+        Observation(
+            "accounts",
+            description="Email addresses of sessions already authenticated in this browser. "
+                        "Picking one needs no credentials.",
+            js="""Array.from(document.querySelectorAll('[data-identifier]')).map(
+                el => el.getAttribute('data-identifier')
+            ).filter(Boolean)""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "choose_account",
+            description="Continue as one of the already-authenticated accounts. Pass an "
+                        "address returned by the 'accounts' observation.",
+            params={"email": "str"},
+            steps=[
+                # The address goes into a selector, not into the page — this is
+                # a click, and the value came off this same page a moment ago.
+                # A miss resolves to nothing and `dom_click` says so.
+                Step("dom_click", '[data-identifier="$email"]'),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# Wall 3 — an ordinary sign-in
+# ===============================================================
+ai_studio_sign_in = PageState(
+    "AIStudioSignIn",
+    url_pattern=r"accounts\.google\.com/(?:v\d+/)?(?:signin|ServiceLogin)",
+    keywords=["Sign in", "to continue to", "Forgot email", "Next"],
+    expected_timeout=120.0,
+    observations=[
+        Observation(
+            "sign_in_state",
+            description="Whether a sign-in page is showing. Never reads or reports "
+                        "credentials.",
+            js="""(() => ({ signed_out: true, url: location.href }))()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "wait_for_sign_in",
+            description="Block until the user has signed in and the key list has rendered. "
+                        "Do not fill credentials — reveal the browser and let the user do it.",
+            steps=[
+                Step("wait_for_element", '[role=row]', timeout_ms=120000, interval_ms=2000),
+            ],
+        ),
+    ],
+)
+
+# ===============================================================
+# /u/<n>/api-keys
+# ===============================================================
+ai_studio_keys = PageState(
+    "AIStudioKeys",
+    url_pattern=GOOGLE_KEYS_URL,
+    entry="https://aistudio.google.com/apikey",
+    keywords=["Billing Tier", "Import projects"],
+    expected_timeout=10.0,
+    observations=[
+        Observation(
+            "existing_keys",
+            description="Existing keys: masked value, project, created date, billing tier. "
+                        "The table shows a suffix mask only.",
+            js="""(() => {
+                const rows = Array.from(document.querySelectorAll('[role=row]'));
+                return rows.map(row => {
+                    const c = Array.from(row.querySelectorAll('[role=cell], [role=gridcell]')).map(
+                        cell => cell.textContent?.trim() || ''
+                    );
+                    return {
+                        masked: c[0] || '',
+                        project: c[1] || '',
+                        created: c[2] || '',
+                        billing_tier: c[3] || '',
+                    };
+                }).filter(r => r.masked && r.project);
+            })()""",
+        ),
+        Observation(
+            "page_ready",
+            description="Whether the key list has rendered and the create button is "
+                        "available. The opener flips to disabled while a dialog is open, "
+                        "which is a cheap check that one is.",
+            js="""(() => {
+                const opener = Array.from(document.querySelectorAll('button')).find(
+                    b => /create api key/i.test(b.innerText || '')
+                );
+                return {
+                    has_rows: !!document.querySelector('[role=row]'),
+                    opener: !!opener,
+                    dialog_open: !!opener && opener.disabled,
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "open_create_dialog",
+            description="Open the 'Create a new key' dialog.",
+            steps=[
+                # The button's own text is `key Create API key` — the leading
+                # word is the icon ligature. Text resolution is substring-based,
+                # so the label alone finds it.
+                Step("dom_click", "Create API key"),
+                Step("wait_for_element", "mat-dialog-container", timeout_ms=15000),
+            ],
+        ),
+    ],
+)
+
+ai_studio_create_key = PageState(
+    "AIStudioCreateKey",
+    url_pattern=GOOGLE_KEYS_URL,
+    # `Create a new key` is the dialog heading; the opener behind it says
+    # `Create API key`, and neither is a substring of the other.
+    keywords=["Create a new key", "Choose an imported project", "Cancel"],
+    expected_timeout=8.0,
+    observations=[
+        Observation(
+            "form_state",
+            description="The create dialog's current name and project. Both arrive "
+                        "pre-filled, so this is what a caller checks after set_name to "
+                        "confirm the name actually landed — committing under the default "
+                        "name succeeds silently and raises nothing.",
+            js="""(() => {
+                const dlg = document.querySelector('mat-dialog-container');
+                if (!dlg) return { dialog_open: false };
+                const name = dlg.querySelector('input[aria-label="Name your key"]');
+                const project = dlg.querySelector('mat-select[aria-label="Project"]');
+                const commit = dlg.querySelector('button.ms-button-primary');
+                return {
+                    dialog_open: true,
+                    name: name?.value || '',
+                    project: project?.textContent?.trim() || '',
+                    can_commit: !!commit && !commit.disabled,
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "set_name",
+            description="Replace the pre-filled key name. Check form_state afterwards — "
+                        "a failure here produces another 'Gemini API Key', not an error.",
+            params={"name": "str"},
+            steps=[
+                Step("dom_fill", 'mat-dialog-container input[aria-label="Name your key"]',
+                     text="$name"),
+            ],
+        ),
+        Transition(
+            "commit",
+            description="Create the key, landing on the API key details dialog.",
+            steps=[
+                Step("dom_click", "mat-dialog-container button.ms-button-primary"),
+                # A labelled control that exists only on the details dialog, and
+                # so is a real arrival marker rather than a guess. Not scoped to
+                # `mat-dialog-container`, because at this moment the details
+                # dialog is the only one open.
+                Step("wait_for_element", 'button[aria-label="Copy key to clipboard"]',
+                     timeout_ms=20000),
+            ],
+        ),
+        Transition(
+            "cancel",
+            description="Abandon key creation and return to the list.",
+            steps=[Step("dom_click", "Cancel", container="mat-dialog-container")],
+        ),
+    ],
+)
+
+ai_studio_key_details = PageState(
+    "AIStudioKeyDetails",
+    url_pattern=GOOGLE_KEYS_URL,
+    keywords=["API key details", "Project number", "Copy cURL quickstart", "Delete key"],
+    expected_timeout=8.0,
+    observations=[
+        Observation(
+            "key_location",
+            description="Where the secret is, as a selector — never the secret itself. "
+                        "The host reads it with capture_secret, which checks it against "
+                        "Google's key shape and returns a handle.",
+            # Marked before it is named, as on xAI and for the same reason: the
+            # key is bare text in a labelled field list, so finding it means
+            # matching on content and handing it over means leaving behind
+            # something a selector can address.
+            #
+            # `dialogs[last]` rather than `querySelector`, because Google stacks
+            # dialogs — the delete confirmation opens *over* this one, and the
+            # first match is then the wrong one.
+            js="""(() => {
+                const dialogs = document.querySelectorAll('mat-dialog-container');
+                const root = dialogs[dialogs.length - 1];
+                const miss = { ready: false, selector: null, container: null, index: 0 };
+                if (!root) return miss;
+                const el = Array.from(root.querySelectorAll('*')).find(n =>
+                    n.children.length === 0 &&
+                    /^(?:AIza[A-Za-z0-9_-]{35}|AQ\\.[A-Za-z0-9_-]{30,})$/.test(
+                        (n.textContent || '').trim()
+                    )
+                );
+                if (!el) return miss;
+                el.setAttribute('data-widgex-key', '1');
+                return {
+                    ready: true,
+                    selector: '[data-widgex-key="1"]',
+                    container: null,
+                    index: 0,
+                };
+            })()""",
+        ),
+    ],
+    transitions=[
+        Transition(
+            "dismiss",
+            description="Close the details dialog and return to the key list.",
+            steps=[Step("dom_click", 'button[aria-label="Close dialog"]')],
+        ),
+    ],
+)
+
+# ===============================================================
+# Registration
+# ===============================================================
+registry.add(ai_studio_service_blocked, transitions_to=["AIStudioAccountChooser"])
+registry.add(ai_studio_account_chooser, transitions_to=["AIStudioKeys", "AIStudioSignIn"])
+registry.add(ai_studio_sign_in, transitions_to=["AIStudioKeys"])
+
+registry.add(ai_studio_keys, transitions_to=[
+    "AIStudioCreateKey", "AIStudioSignIn", "AIStudioServiceBlocked",
+])
+registry.add(ai_studio_create_key, transitions_to=["AIStudioKeyDetails", "AIStudioKeys"])
+registry.add(ai_studio_key_details, transitions_to=["AIStudioKeys"])