docs(copilot advice): reformat code examples

Author: iOvergaard

15/umbraco-cms/customizing/extending-overview/extension-types/menu.md

@@ -36,7 +36,7 @@ The manifest can also be written in TypeScript.
 For this TypeScript example we used a [Backoffice Entry Point](../../extending-overview/extension-types/backoffice-entry-point.md) extension to register the manifests.
 
 ```typescript
-import type { ManifestMenu } from "@umbraco-cms/backoffice/menu";
+import type { ManifestMenu } from '@umbraco-cms/backoffice/menu';
 
 const menuManifest: Array<ManifestMenu> = [
     {

15/umbraco-cms/customizing/extending-overview/extension-types/modals/custom-modals.md

@@ -20,7 +20,7 @@ There are two parts to creating a custom modal:
 A modal token is a string that identifies a modal. This is the modal extension alias. It is used to open a modal and is also to set default options for the modal. It should also have a unique alias to avoid conflicts with other modals.
 
 ```ts
-import { UmbModalToken } from "@umbraco-cms/backoffice/modal";
+import { UmbModalToken } from '@umbraco-cms/backoffice/modal';
 
 export type MyModalData = {
     headline: string;
@@ -48,10 +48,10 @@ Additionally, the modal element can see its data parameters through the `modalCo
 
 {% code title="my-modal.element.ts" %}
 ```ts
-import { html, LitElement, property, customElement } from "@umbraco-cms/backoffice/external/lit";
-import { UmbElementMixin } from "@umbraco-cms/backoffice/element-api";
-import { type UmbModalContext, UmbModalExtensionElement } from "@umbraco-cms/backoffice/modal";
-import type { MyModalData, MyModalValue } from "./my-modal.token.ts";
+import { html, LitElement, property, customElement } from '@umbraco-cms/backoffice/external/lit';
+import { UmbElementMixin } from '@umbraco-cms/backoffice/element-api';
+import { type UmbModalContext, UmbModalExtensionElement } from '@umbraco-cms/backoffice/modal';
+import type { MyModalData, MyModalValue } from './my-modal.token.js';
 
 @customElement('my-dialog')
 export default class MyDialogElement
@@ -69,14 +69,14 @@ export default class MyDialogElement
     }
 
     private _handleSubmit() {
-        this.modalContext?.updateValue({ myData: "hello world" });
+        this.modalContext?.updateValue({ myData: 'hello world' });
         this.modalContext?.submit();
     }
 
     render() {
         return html`
             <div>
-                <h1>${this.modalContext?.data.headline ?? "Default headline"}</h1>
+                <h1>${this.modalContext?.data.headline ?? 'Default headline'}</h1>
                 <button @click=${this._handleCancel}>Cancel</button>
                 <button @click=${this._handleSubmit}>Submit</button>
             </div>

15/umbraco-cms/customizing/extending-overview/extension-types/sections/section-view.md

@@ -51,7 +51,7 @@ The manifest can also be written in TypeScript.
 For this TypeScript example we used a [Backoffice Entry Point](../backoffice-entry-point.md) extension to register the manifests.
 
 ```typescript
-import { ManifestSectionView } from "@umbraco-cms/backoffice/section";
+import { ManifestSectionView } from '@umbraco-cms/backoffice/section';
 
 const sectionViews: Array<ManifestSectionView> = [
     {
@@ -83,7 +83,7 @@ Creating the Section View Element using a Lit Element.
 **my-section.element.ts:**
 
 ```typescript
-import { UmbLitElement } from "@umbraco-cms/backoffice/lit-element";
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
 
 @customElement('my-sectionview-element')

15/umbraco-cms/tutorials/creating-a-custom-dashboard/README.md

@@ -101,8 +101,8 @@ Now let's create the web component we need for our property editor. This web com
 
 {% code title="welcome-dashboard.element.ts" lineNumbers="true" overflow="wrap" %}
 ```typescript
-import { LitElement, css, html, customElement } from "@umbraco-cms/backoffice/external/lit";
-import { UmbLitElement } from "@umbraco-cms/backoffice/lit-element";
+import { LitElement, css, html, customElement } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 
 @customElement('my-welcome-dashboard')
 export class MyWelcomeDashboardElement extends UmbLitElement {

15/umbraco-cms/tutorials/creating-a-property-editor/README.md

@@ -91,7 +91,7 @@ import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/propert
 @customElement('my-suggestions-property-editor-ui')
 export default class MySuggestionsPropertyEditorUIElement extends LitElement implements UmbPropertyEditorUiElement {
     @property({ type: String })
-    public value = "";
+    public value = '';
 
     override render() {
         return html`I'm a property editor!`;
@@ -218,14 +218,14 @@ It should now look something like this:
 
 {% code title="suggestions-property-editor-ui.element.ts" lineNumbers="true" %}
 ```typescript
-import { LitElement, html, css, customElement, property } from "@umbraco-cms/backoffice/external/lit";
-import type { UmbPropertyEditorUiElement } from "@umbraco-cms/backoffice/property-editor";
+import { LitElement, html, css, customElement, property } from '@umbraco-cms/backoffice/external/lit';
+import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/property-editor';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 
 @customElement('my-suggestions-property-editor-ui')
 export default class MySuggestionsPropertyEditorUIElement extends LitElement implements UmbPropertyEditorUiElement {
     @property({ type: String })
-    public value = "";
+    public value = '';
 
     override render() {
         return html`
@@ -345,7 +345,7 @@ Let's look at the suggestions button next.
 
 {% code title="suggestions-property-editor-ui.element.ts" %}
 ```typescript
-import { LitElement, html, css, customElement, property, state } from "@umbraco-cms/backoffice/external/lit";
+import { LitElement, html, css, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
 ```
 {% endcode %}
 

15/umbraco-cms/tutorials/creating-a-property-editor/adding-configuration-to-a-property-editor.md

@@ -192,7 +192,7 @@ The next step is to gain access to our new configuration options. For this, open
 
 {% code title="suggestions-property-editor-ui.element.ts" %}
 ```typescript
-import { type UmbPropertyEditorConfigCollection } from "@umbraco-cms/backoffice/property-editor";
+import { type UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
 ```
 {% endcode %}
 
@@ -215,7 +215,7 @@ We can now use the configurations. Let's use the `placeholder` and `maxChars` fo
 
 {% code title="suggestions-property-editor-ui.element.ts" %}
 ```typescript
-import { ifDefined } from "@umbraco-cms/backoffice/external/lit";
+import { ifDefined } from '@umbraco-cms/backoffice/external/lit';
 ```
 {% endcode %}
 

15/umbraco-cms/tutorials/creating-a-property-editor/integrating-context-with-a-property-editor.md

@@ -111,7 +111,7 @@ import { UMB_MODAL_MANAGER_CONTEXT, UMB_CONFIRM_MODAL,} from '@umbraco-cms/backo
 2. Remove the `UmbNotificationContext` from the `'@umbraco-cms/backoffice/notification'` import:
 
 ```typescript
-import { UMB_NOTIFICATION_CONTEXT, UmbNotificationDefaultData } from "@umbraco-cms/backoffice/notification";
+import { UMB_NOTIFICATION_CONTEXT, UmbNotificationDefaultData } from '@umbraco-cms/backoffice/notification';
 ```
 
 3. Update the constructor to consume the `UMB_MODAL_MANAGER_CONTEXT`and the `UMB_CONFIRM_MODAL.`