Run Prettier

gee-community · Nov 6, 2024 · 1e183d1 · 1e183d1
1 parent 04da42b
commit 1e183d1
Show file tree

Hide file tree

Showing 5 changed files with 84 additions and 49 deletions.
diff --git a/js/ipywidgets_styles.ts b/js/ipywidgets_styles.ts
@@ -23,9 +23,10 @@ export const legacyStyles = css`
 
     .legacy-button:hover:enabled,
     .legacy-button:focus:enabled {
-        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, var(--md-shadow-key-penumbra-opacity)),
-                    0 3px 1px -2px rgba(0, 0, 0, var(--md-shadow-key-umbra-opacity)),
-                    0 1px 5px 0 rgba(0, 0, 0, var(--md-shadow-ambient-shadow-opacity));
+        box-shadow: 0 2px 2px 0
+                rgba(0, 0, 0, var(--md-shadow-key-penumbra-opacity)),
+            0 3px 1px -2px rgba(0, 0, 0, var(--md-shadow-key-umbra-opacity)),
+            0 1px 5px 0 rgba(0, 0, 0, var(--md-shadow-ambient-shadow-opacity));
     }
 
     .legacy-slider {
@@ -55,4 +56,4 @@ export const legacyStyles = css`
         height: var(--jp-widgets-inline-height);
         line-height: var(--jp-widgets-inline-height);
     }
-`;
+`;
diff --git a/js/layer_manager.ts b/js/layer_manager.ts
@@ -1,7 +1,8 @@
 import type { AnyModel, RenderProps } from "@anywidget/types";
 import { html, css, LitElement } from "lit";
 import { property } from "lit/decorators.js";
-import { legacyStyles } from './ipywidgets_styles';
+
+import { legacyStyles } from "./ipywidgets_styles";
 import { loadFonts, updateChildren } from "./utils";
 
 export interface LayerManagerModel {
@@ -35,7 +36,10 @@ export class LayerManager extends LitElement {
     ];
 
     private _model: AnyModel<LayerManagerModel> | undefined = undefined;
-    private static modelNameToViewName = new Map<keyof LayerManagerModel, keyof LayerManager | null>([
+    private static modelNameToViewName = new Map<
+        keyof LayerManagerModel,
+        keyof LayerManager | null
+    >([
         ["children", null],
         ["visible", "visible"],
     ]);
@@ -67,7 +71,9 @@ export class LayerManager extends LitElement {
                         .checked="${this.visible}"
                         @change="${this.onLayerVisibilityChanged}"
                     />
-                    <span class="legacy-text all-layers-text">All layers on/off</span>
+                    <span class="legacy-text all-layers-text"
+                        >All layers on/off</span
+                    >
                 </div>
                 <slot></slot>
             </div>
@@ -95,7 +101,9 @@ if (!customElements.get(LayerManager.componentName)) {
 
 async function render({ model, el }: RenderProps<LayerManagerModel>) {
     loadFonts();
-    const manager = <LayerManager>document.createElement(LayerManager.componentName);
+    const manager = <LayerManager>(
+        document.createElement(LayerManager.componentName)
+    );
     manager.model = model;
     el.appendChild(manager);
 

diff --git a/js/layer_manager_row.ts b/js/layer_manager_row.ts
@@ -1,9 +1,9 @@
 import type { AnyModel, RenderProps } from "@anywidget/types";
 import { html, css, LitElement, TemplateResult, nothing } from "lit";
 import { property } from "lit/decorators.js";
-import { classMap } from 'lit/directives/class-map.js';
+import { classMap } from "lit/directives/class-map.js";
 
-import { legacyStyles } from './ipywidgets_styles';
+import { legacyStyles } from "./ipywidgets_styles";
 import { materialStyles } from "./material_styles";
 import { loadFonts } from "./utils";
 
@@ -62,13 +62,21 @@ export class LayerManagerRow extends LitElement {
             }
 
             @-webkit-keyframes spin {
-                0% { -webkit-transform: rotate(0deg); }
-                100% { -webkit-transform: rotate(360deg); }
+                0% {
+                    -webkit-transform: rotate(0deg);
+                }
+                100% {
+                    -webkit-transform: rotate(360deg);
+                }
             }
 
             @keyframes spin {
-                0% { transform: rotate(0deg); }
-                100% { transform: rotate(360deg); }
+                0% {
+                    transform: rotate(0deg);
+                }
+                100% {
+                    transform: rotate(360deg);
+                }
             }
 
             button.loading .spinner,
@@ -95,7 +103,10 @@ export class LayerManagerRow extends LitElement {
     ];
 
     private _model: AnyModel<LayerManagerRowModel> | undefined = undefined;
-    private static modelNameToViewName = new Map<keyof LayerManagerRowModel, keyof LayerManagerRow | null>([
+    private static modelNameToViewName = new Map<
+        keyof LayerManagerRowModel,
+        keyof LayerManagerRow | null
+    >([
         ["name", "name"],
         ["visible", "visible"],
         ["opacity", "opacity"],
@@ -104,7 +115,10 @@ export class LayerManagerRow extends LitElement {
 
     set model(model: AnyModel<LayerManagerRowModel>) {
         this._model = model;
-        for (const [modelKey, widgetKey] of LayerManagerRow.modelNameToViewName) {
+        for (const [
+            modelKey,
+            widgetKey,
+        ] of LayerManagerRow.modelNameToViewName) {
             if (widgetKey) {
                 // Get initial values from the Python model.
                 (this as any)[widgetKey] = model.get(modelKey);
@@ -158,15 +172,17 @@ export class LayerManagerRow extends LitElement {
                 </button>
                 <button
                     class=${classMap({
-            'legacy-button': true,
-            'settings-delete-button': true,
-            'loading': this.isLoading,
-            'done-loading': !this.isLoading
+            "legacy-button": true,
+            "settings-delete-button": true,
+            loading: this.isLoading,
+            "done-loading": !this.isLoading,
         })}
                     @click="${this.onDeleteClicked}"
                 >
                     <div class="spinner"></div>
-                    <span class="close-icon material-symbols-outlined">&#xe5cd;</span>
+                    <span class="close-icon material-symbols-outlined"
+                        >&#xe5cd;</span
+                    >
                 </button>
             </div>
             ${this.renderConfirmDialog()}
@@ -180,18 +196,18 @@ export class LayerManagerRow extends LitElement {
         return html`
             <div class="row">
                 <span class="legacy-text remove-layer-text">Remove layer?</span>
-                    <button
-                        class="legacy-button primary confirm-deny-button"
-                        @click="${this.confirmDeletion}"
-                    >
-                        Yes
-                    </button>
-                    <button
-                        class="legacy-button primary confirm-deny-button"
-                        @click="${this.cancelDeletion}"
-                    >
-                        No
-                    </button>
+                <button
+                    class="legacy-button primary confirm-deny-button"
+                    @click="${this.confirmDeletion}"
+                >
+                    Yes
+                </button>
+                <button
+                    class="legacy-button primary confirm-deny-button"
+                    @click="${this.cancelDeletion}"
+                >
+                    No
+                </button>
             </div>
         `;
     }
@@ -215,15 +231,15 @@ export class LayerManagerRow extends LitElement {
     }
 
     private onSettingsClicked(_: Event) {
-        this._model?.send({ "type": "click", "id": "settings" });
+        this._model?.send({ type: "click", id: "settings" });
     }
 
     private onDeleteClicked(_: Event) {
         this.isConfirmDialogVisible = true;
     }
 
     private confirmDeletion(_: Event) {
-        this._model?.send({ "type": "click", "id": "delete" });
+        this._model?.send({ type: "click", id: "delete" });
     }
 
     private cancelDeletion(_: Event) {
@@ -238,7 +254,9 @@ if (!customElements.get(LayerManagerRow.componentName)) {
 
 function render({ model, el }: RenderProps<LayerManagerRowModel>) {
     loadFonts();
-    const row = <LayerManagerRow>document.createElement(LayerManagerRow.componentName);
+    const row = <LayerManagerRow>(
+        document.createElement(LayerManagerRow.componentName)
+    );
     row.model = model;
     el.appendChild(row);
 }

diff --git a/js/material_styles.ts b/js/material_styles.ts
@@ -2,18 +2,19 @@ import { css } from "lit";
 
 export const materialStyles = css`
     @font-face {
-        font-family: 'Material Symbols Outlined';
+        font-family: "Material Symbols Outlined";
         font-style: normal;
         font-weight: 400;
-        src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v205/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOejbd5zrDAt.woff2) format('woff2');
+        src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v205/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOejbd5zrDAt.woff2)
+            format("woff2");
     }
 
     .material-symbols-outlined {
-        -webkit-font-feature-settings: 'liga';
+        -webkit-font-feature-settings: "liga";
         -webkit-font-smoothing: antialiased;
         direction: ltr;
         display: inline-block;
-        font-family: 'Material Symbols Outlined';
+        font-family: "Material Symbols Outlined";
         font-style: normal;
         font-weight: normal;
         letter-spacing: normal;
@@ -22,4 +23,4 @@ export const materialStyles = css`
         white-space: nowrap;
         word-wrap: normal;
     }
-`;
+`;
diff --git a/js/utils.ts b/js/utils.ts
@@ -1,26 +1,33 @@
 import type { AnyModel } from "@anywidget/types";
 import { IWidgetManager, WidgetModel } from "@jupyter-widgets/base";
 
-async function unpackModels(modelIds: Array<string>, manager: IWidgetManager): Promise<Array<WidgetModel>> {
+async function unpackModels(
+    modelIds: Array<string>,
+    manager: IWidgetManager
+): Promise<Array<WidgetModel>> {
     return Promise.all(
-        modelIds.map(id => manager.get_model(id.slice("IPY_MODEL_".length)))
+        modelIds.map((id) => manager.get_model(id.slice("IPY_MODEL_".length)))
     );
 }
 
 export function loadFonts() {
-    if (!document.querySelector('.custom-fonts')) {
-        const styleElement = document.createElement('style');
-        styleElement.classList.add('custom-fonts');
-        styleElement.textContent = '@import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined";'
+    if (!document.querySelector(".custom-fonts")) {
+        const styleElement = document.createElement("style");
+        styleElement.classList.add("custom-fonts");
+        styleElement.textContent =
+            '@import "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined";';
         document.body.appendChild(styleElement);
     }
 }
 
-export async function updateChildren(container: HTMLElement, model: AnyModel<any>) {
+export async function updateChildren(
+    container: HTMLElement,
+    model: AnyModel<any>
+) {
     const children = model.get("children");
     const child_models = await unpackModels(children, model.widget_manager);
     const child_views = await Promise.all(
-        child_models.map(model => model.widget_manager.create_view(model))
+        child_models.map((model) => model.widget_manager.create_view(model))
     );
     container.innerHTML = ``;
     for (const child_view of child_views) {