Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/components/codeBlockTitles.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {
tryCopyText,
} from './codeBlockTitles';

test('copyButtonContent matches app-frontend idle / copied labels', (assert) => {
test('copyButtonContent idle and copied labels', (assert) => {
assert.equal(copyButtonContent(false), {label: 'Copy', state: 'idle'});
assert.equal(copyButtonContent(true), {label: 'Copied!', state: 'copied'});
});
Expand Down Expand Up @@ -43,7 +43,7 @@ test('copyButtonMarkup accepts id, copy value, and a custom idle label', (assert
assert.equal(html.includes('class="btn'), false);
});

test('COPY_FEEDBACK_MS matches useCopyToClipboard reset window', (assert) => {
test('COPY_FEEDBACK_MS is 1500ms', (assert) => {
assert.equal(COPY_FEEDBACK_MS, 1500);
});

Expand Down
9 changes: 2 additions & 7 deletions src/components/codeBlockTitles.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
/** Matches app-frontend `useCopyToClipboard` reset window. */
export const COPY_FEEDBACK_MS = 1500;

/** Idle / copied labels — same strings as app-frontend `Code` copy button. */
export function copyButtonContent(
isCopied: boolean,
idleLabel = 'Copy',
Expand All @@ -21,7 +19,7 @@ export type TryCopyTextDeps = {
};

/**
* Copy text like app-frontend `useCopyToClipboard`: succeed → true; failure → false.
* Copy text to the clipboard: succeed → true; failure → false.
* Inject `writeText` in tests; browser path uses `navigator.clipboard.writeText`.
*/
export async function tryCopyText(text: string, deps: TryCopyTextDeps = {}): Promise<boolean> {
Expand Down Expand Up @@ -205,10 +203,7 @@ function ensureDots(header: HTMLElement): void {
dots.replaceChildren();
}

/**
* Park the EC copy control in the chrome row and apply app-frontend copy feedback:
* icon + “Copy” → green check + “Copied!” for COPY_FEEDBACK_MS.
*/
/** Park the EC copy control in the chrome row; icon + “Copy” → green check + “Copied!” for COPY_FEEDBACK_MS. */
function ensureCopyInHeader(frame: HTMLElement, header: HTMLElement): void {
const copy = frame.querySelector(':scope > .copy') ?? header.querySelector(':scope > .copy');
if (!(copy instanceof HTMLElement)) {
Expand Down
5 changes: 2 additions & 3 deletions src/styles/starlight-custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -2262,8 +2262,7 @@ html[data-theme='light'] .expressive-code .cs-code-file {
}

/*
* Copy control — app-frontend Code / useCopyToClipboard behavior:
* idle: icon + “Copy”; copied: green pill + check + “Copied!” for 1.5s.
* Copy control: idle icon + “Copy”; copied green pill + check + “Copied!” for 1.5s.
* Kill EC’s floating tooltip — we own the feedback UI.
*/
.expressive-code .frame.has-title > .header > .copy,
Expand Down Expand Up @@ -2382,7 +2381,7 @@ html[data-theme='light'] .expressive-code .frame.is-terminal .copy button.cs-cop
background: color-mix(in srgb, var(--cs-ink) 6%, transparent) !important;
}

/* app-frontend Code.module.scss `.copied` — success green wins over hover */
/* Success green wins over hover when copied */
.expressive-code .frame.has-title .copy button.cs-copy-btn.cs-copied,
.expressive-code .frame.is-terminal .copy button.cs-copy-btn.cs-copied,
.expressive-code .frame.has-title .copy button.cs-copy-btn.cs-copied:hover,
Expand Down
Loading