docs(docs-infra): ensure code preview copy preserves spaces

Preserve whitespace when copying code examples from the docs. Fixes the copy handler so copied snippets keep original spacing.

Fixes #66790

adev/shared-docs/pipeline/api-gen/rendering/entities/renderables.mts

@@ -167,11 +167,9 @@ export type CliCommandRenderable = CliCommand & {
   htmlDescription: string;
   cards: CliCardRenderable[];
   argumentsLabel: string;
-  hasOptions: boolean;
+  optionsLabel: string;
   subcommands?: CliCommandRenderable[];
 };
 
 export interface InitializerApiFunctionRenderable
-  extends Omit<InitializerApiFunctionEntry, 'jsdocTags'>,
-    DocEntryRenderable,
-    HasRenderableToc {}
+  extends Omit<InitializerApiFunctionEntry, 'jsdocTags'>, DocEntryRenderable, HasRenderableToc {}

adev/shared-docs/pipeline/api-gen/rendering/templates/cli-reference.tsx

@@ -26,19 +26,15 @@ export function CliCommandReference(entry: CliCommandRenderable) {
               <code>
                 <div className={'shiki line cli'}>
                   ng {commandName(entry, command)}
-                  {entry.argumentsLabel ? (
+                  {entry.argumentsLabel && (
                     <button member-id={'Arguments'} className="shiki-ln-line-argument">
                       {entry.argumentsLabel}
                     </button>
-                  ) : (
-                    <></>
                   )}
-                  {entry.hasOptions ? (
+                  {entry.optionsLabel && (
                     <button member-id={'Options'} className="shiki-ln-line-option">
-                      [options]
+                      {entry.optionsLabel}
                     </button>
-                  ) : (
-                    <></>
                   )}
                 </div>
               </code>

adev/shared-docs/pipeline/api-gen/rendering/test/cli.spec.mts

@@ -40,7 +40,7 @@ describe('CLI docs to html', () => {
     const cliTocs = fragment.querySelectorAll('.docs-reference-cli-toc')!;
     expect(cliTocs.length).toBe(2);
 
-    expect(cliTocs[0].textContent).toContain('ng component[name][options]');
-    expect(cliTocs[1].textContent).toContain('ng c[name][options]');
+    expect(cliTocs[0].textContent).toContain('ng component [name] [options]');
+    expect(cliTocs[1].textContent).toContain('ng c [name] [options]');
   });
 });

adev/shared-docs/pipeline/api-gen/rendering/transforms/cli-transforms.mts

@@ -27,7 +27,7 @@ export function getCliRenderable(command: CliCommand): CliCommandRenderable {
     }),
     cards: getCliCardsRenderable(command),
     argumentsLabel: getArgumentsLabel(command),
-    hasOptions: getOptions(command).length > 0,
+    optionsLabel: getOptionsLabel(command),
   };
 }
 
@@ -66,7 +66,12 @@ function getArgumentsLabel(command: CliCommand): string {
   if (args.length === 0) {
     return '';
   }
-  return command.command.replace(`${command.name} `, '');
+  const label = command.command.replace(/^ng\s+/, '').replace(`${command.name} `, '');
+  return ` ${label}`;
+}
+
+function getOptionsLabel(command: CliCommand): string {
+  return getOptions(command).length > 0 ? ' [options]' : '';
 }
 
 function getArgs(command: CliCommand): CliOption[] {