style: Format with the new Prettier version

Changes

12 changed files (+46/-48)

• scripts/generateStaticFigmaFile/fetchNode.mjs
  • @@ -26,12 +26,12 @@ const res = await fetch(image);
    if (res.status !== 200) { throw new Error( - `Failed to fetch a rendered image: node-id=${nodeId}, url=${image}` + `Failed to fetch a rendered image: node-id=${nodeId}, url=${image}`, ); } return res.buffer(); - }) + }), ); if (!image) {
• scripts/generateStaticFigmaFile/index.mjs
  • @@ -12,7 +12,7 @@ import { fetchNode } from "./fetchNode.mjs";
    const isFigmaURL = (url) => /https:\/\/([w.-]+.)?figma.com\/(file|proto)\/([0-9a-zA-Z]{22,128})(?:\/.*)?$/.test( - url + url, ); program
  • @@ -87,7 +87,7 @@ const outDir = path.resolve(
    path.isAbsolute(program.outDir) ? program.outDir : path.resolve(process.env.INIT_CWD, program.outDir), - fileKey + fileKey, ); try {
  • @@ -113,14 +113,14 @@ // See <https://github.com/pocka/figspec/issues/27> for the context.
    const safeFilename = file.filename.replace(/:/g, "-"); await fs.writeFile(path.resolve(outDir, safeFilename), file.data); - }) + }), ); } dotenv.config({ path: path.resolve( path.dirname(fileURLToPath(import.meta.url)), - "../../.env" + "../../.env", ), }); program.parse();
• src/FigspecViewer/DistanceGuide.ts
  • @@ -151,7 +151,7 @@
    if (!guides) { guides = getDistanceGuides( node.absoluteBoundingBox, - distanceTo.absoluteBoundingBox + distanceTo.absoluteBoundingBox, ); guidesCache.set(combinedId, guides);
• src/FigspecViewer/FigspecFileViewer.ts
  • @@ -161,7 +161,7 @@ return html`
    <div class="controls"> <select @change=${this.#handlePageChange}> ${this.documentNode?.document.children.map( - (c) => html`<option value=${c.id}>${c.name}</option>` + (c) => html`<option value=${c.id}>${c.name}</option>`, )} </select> </div>
  • @@ -216,7 +216,7 @@ }
    this.selectedPage = this.documentNode.document.children.filter( - (c): c is Figma.Canvas => c.type === "CANVAS" + (c): c is Figma.Canvas => c.type === "CANVAS", )[0] ?? null; };
  • @@ -225,7 +225,7 @@ const target = ev.currentTarget as HTMLSelectElement;
    this.selectedPage = (this.documentNode?.document.children.find( - (c) => c.id === target.value + (c) => c.id === target.value, ) as Figma.Canvas) ?? null; if (this.selectedPage) {
• src/FigspecViewer/Footer/utils.ts
  • @@ -33,7 +33,7 @@ */
    export const fromNow = ( date: Date | number | string, nowDate: Date | number | string = Date.now(), - rft = new Intl.RelativeTimeFormat(undefined, { numeric: "auto" }) + rft = new Intl.RelativeTimeFormat(undefined, { numeric: "auto" }), ) => { const now = getTime(nowDate); const diff = now - getTime(date);
• src/FigspecViewer/InspectorView/utils.ts
  • @@ -80,7 +80,7 @@ this.colorObjects = this.createColorObjects(this.colors);
    this.angle = this.calculateAngle( this.gradientHandles.start, - this.gradientHandles.end + this.gradientHandles.end, ); }
  • @@ -107,7 +107,7 @@ }
    private calculateAngle( startHandle: GradientHandlePosition, - endHandle: GradientHandlePosition + endHandle: GradientHandlePosition, ) { const radians = Math.atan(this.calculateGradient(startHandle, endHandle)); return parseInt(this.radToDeg(radians).toFixed(1));
  • @@ -115,7 +115,7 @@ }
    private calculateGradient( startHandle: GradientHandlePosition, - endHandle: GradientHandlePosition + endHandle: GradientHandlePosition, ) { return ((endHandle.y - startHandle.y) / (endHandle.x - startHandle.x)) * -1; }
  • @@ -162,7 +162,7 @@ if (node.style) {
    this.fontFamily = node.style.fontFamily; this.fontPostScriptName = node.style.fontPostScriptName?.replace( "-", - " " + " ", ); this.fontWeight = node.style.fontWeight; this.fontSize = `${Math.ceil(node.style.fontSize)}px`;
  • @@ -173,7 +173,7 @@ // border radii
    if (node.rectangleCornerRadii) { this.borderRadius = node.rectangleCornerRadii.filter( - (radius) => radius === node.cornerRadius + (radius) => radius === node.cornerRadius, ).length < 4 ? `${node.rectangleCornerRadii.join("px ")}px` : `${node.cornerRadius}px`;
  • @@ -191,7 +191,7 @@ if (node.type === "TEXT") {
    this.color = extractColorStyle(fillColor.color); } else if (fillColor.type.includes("GRADIENT")) { this.backgroundImage = extractGradientColorStyle( - (fillColor as unknown) as ElementGradientColor + fillColor as unknown as ElementGradientColor, ); } else if (fillColor.type === "SOLID") { this.background = extractColorStyle(fillColor.color);
  • @@ -201,7 +201,7 @@
    // borders if (node.strokes && node.strokes.length > 0) { this.borderColor = extractColorStyle( - node.strokes[0].color as ElementColor + node.strokes[0].color as ElementColor, ); this.border = `${node.strokeWeight}px solid ${this.borderColor}`; }
• src/FigspecViewer/Node.ts
  • @@ -70,7 +70,7 @@ lineTo(width - shift, height - radius.bottomRight),
    arcTo( radius.bottomRight - shift, width - radius.bottomRight, - height - shift + height - shift, ), lineTo(radius.bottomLeft, height - shift), arcTo(radius.bottomLeft - shift, shift, height - radius.bottomLeft),
• src/FigspecViewer/NodeSelectableMixin.ts
  • @@ -9,7 +9,7 @@ selectedNode: SizedNode | null;
    } export const NodeSelectableMixin = <T extends Constructor<LitElement>>( - superClass: T + superClass: T, ): T & Constructor<INodeSelectable> => { class NodeSelectable extends superClass { @property({
  • @@ -30,7 +30,7 @@ new CustomEvent<{ selectedNode: Figma.Node | null }>("nodeselect", {
    detail: { selectedNode: this.selectedNode, }, - }) + }), ); } }
• src/FigspecViewer/PositionedMixin.ts
  • @@ -30,7 +30,7 @@ readonly canvasTransform: readonly string[];
    } export const PositionedMixin = <T extends Constructor<LitElement>>( - superClass: T + superClass: T, ): T & Constructor<Positioned & TouchGestureMixinProps> => { class Positioned extends TouchGestureMixin(superClass) { @property({
  • @@ -112,7 +112,7 @@ this.panY -= (ev.deltaY * speed) / this.scale;
    } }, // This component prevents every native wheel behavior on it. - { passive: false } + { passive: false }, ); // Base scale for Safari's GestureEvents
  • @@ -186,7 +186,7 @@ new CustomEvent<{ scale: number }>("scalechange", {
    detail: { scale: this.scale, }, - }) + }), ); }
  • @@ -197,7 +197,7 @@ detail: {
    x: this.panX, y: this.panY, }, - }) + }), ); } }
• src/FigspecViewer/TouchGestureMixin.ts
  • @@ -18,7 +18,7 @@ onTouchPinch(delta: number): void;
    } export const TouchGestureMixin = <T extends Constructor<LitElement>>( - superClass: T + superClass: T, ): T & Constructor<TouchGestureMixinProps> => class CTouchGesture extends superClass { private previousTouches: TouchList | null = null;
  • @@ -66,7 +66,7 @@ // When one or more than one of touch input sources differs, skip processing.
    if ( currentTouches.length !== previousTouches.length || !currentTouches.every((t) => - previousTouches.some((pt) => pt.identifier === t.identifier) + previousTouches.some((pt) => pt.identifier === t.identifier), ) ) { return;
  • @@ -91,8 +91,8 @@ },
    { x: previousTouches[0].pageX, y: previousTouches[0].pageY, - } - ) + }, + ), ); return; });
• src/FigspecViewer/ViewerMixin.ts
  • @@ -44,7 +44,7 @@ | undefined;
    } export const ViewerMixin = <T extends Constructor<LitElement>>( - superClass: T + superClass: T, ): T & Constructor<IViewer & INodeSelectable & Positioned> => { class Viewer extends NodeSelectableMixin(PositionedMixin(superClass)) { @property({
  • @@ -211,11 +211,11 @@
    const guideThickness = `calc(var(--guide-thickness) * ${reverseScale})`; const computedGuideThickness = parseFloat( - getComputedStyle(this).getPropertyValue("--guide-thickness") + getComputedStyle(this).getPropertyValue("--guide-thickness"), ); const computedGuideTooltipFontSize = parseFloat( - getComputedStyle(this).getPropertyValue("--guide-tooltip-font-size") + getComputedStyle(this).getPropertyValue("--guide-tooltip-font-size"), ); return html`
  • @@ -355,7 +355,7 @@ node.type === "COMPONENT_SET"
    ) ) { throw new Error( - "Cannot update node tree: Top level node MUST be one of CANVAS, FRAME, COMPONENT, or COMPONENT_SET" + "Cannot update node tree: Top level node MUST be one of CANVAS, FRAME, COMPONENT, or COMPONENT_SET", ); }
  • @@ -389,7 +389,7 @@ ...margin,
    [node.id]: getEffectMargin(node, flattenNode(node)), }; }, - {} + {}, ); this.requestUpdate();
  • @@ -399,10 +399,8 @@ resetZoom() {
    if (this.#canvasSize) { // Set initial zoom level based on element size const { width, height } = this.#canvasSize; - const { - width: elementWidth, - height: elementHeight, - } = this.getBoundingClientRect(); + const { width: elementWidth, height: elementHeight } = + this.getBoundingClientRect(); const wDiff = elementWidth / (width + this.zoomMargin * 2); const hDiff = elementHeight / (height + this.zoomMargin * 2);
  • @@ -458,7 +456,7 @@ }
    function getEffectMargin( container: SizedNode, - nodes: readonly SizedNode[] + nodes: readonly SizedNode[], ): Margin { const points = nodes.map((node) => { if (!("effects" in node)) {
  • @@ -477,10 +475,10 @@
    const shadowMargins = node.effects .filter( ( - effect + effect, ): effect is Figma.Effect & { offset: NonNullable<Figma.Effect["offset"]>; - } => effect.visible && effect.type === "DROP_SHADOW" && !!effect.offset + } => effect.visible && effect.type === "DROP_SHADOW" && !!effect.offset, ) .map<Margin>((effect) => { return {
  • @@ -495,22 +493,22 @@ const margin: Margin = {
    top: Math.max( 0, ...blurRadiuses, - ...shadowMargins.map((margin) => margin.top) + ...shadowMargins.map((margin) => margin.top), ), right: Math.max( 0, ...blurRadiuses, - ...shadowMargins.map((margin) => margin.right) + ...shadowMargins.map((margin) => margin.right), ), bottom: Math.max( 0, ...blurRadiuses, - ...shadowMargins.map((margin) => margin.bottom) + ...shadowMargins.map((margin) => margin.bottom), ), left: Math.max( 0, ...blurRadiuses, - ...shadowMargins.map((margin) => margin.left) + ...shadowMargins.map((margin) => margin.left), ), };
  • @@ -551,7 +549,7 @@ }
    function flattenNode( node: Figma.Node, - depth: number = 0 + depth: number = 0, ): readonly (SizedNode & { depth: number; })[] {
• src/FigspecViewer/utils.ts
  • @@ -57,7 +57,7 @@ }
    export function getDistanceGuides( selected: Figma.Rect, - compared: Figma.Rect + compared: Figma.Rect, ): readonly DistanceGuide[] { const a = absRect(selected); const b = absRect(compared);
  • @@ -173,7 +173,7 @@ export type Constructor<T> = new (...args: any[]) => T;
    export function extendStyles( left: typeof LitElement.styles, - right: typeof LitElement.styles + right: typeof LitElement.styles, ): CSSResultArray { return [...stylesToArray(left), ...stylesToArray(right)]; }