format files with prettier

sayari-analytics · Sep 13, 2023 · c9a1711 · c9a1711
1 parent 2ac429b
commit c9a1711
Show file tree

Hide file tree

Showing 39 changed files with 1,232 additions and 874 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1 @@
+dist/
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1 @@
+dist/
diff --git a/.prettierrc b/.prettierrc
@@ -6,5 +6,13 @@
   "singleQuote": true,
   "bracketSameLine": true,
   "jsxSingleQuote": true,
-  "parser": "typescript"
+  "parser": "typescript",
+  "overrides": [
+    {
+      "files": "*.json",
+      "options": {
+        "parser": "json"
+      }
+    }
+  ]
 }
diff --git a/src/bindings/native/download.ts b/src/bindings/native/download.ts
@@ -8,7 +8,6 @@ export type Options = {
   onClick?: () => Promise<string>
 }
 
-
 const DEFAULT_TOP = '20px'
 const DEFAULT_LEFT = '20px'
 const DEFAULT_BG = '#fff'
@@ -19,7 +18,6 @@ const DEFAULT_COLOR = '#666'
 // const DEFAULT_COLOR_HOVER_SELECTED = '#222'
 // const DEFAULT_DISABLED = '#aaa'
 
-
 const styleButton = (button: HTMLButtonElement) => {
   button.style.border = '1px solid #aaa'
   button.style.borderRadius = '4px'
@@ -37,7 +35,6 @@ const styleButton = (button: HTMLButtonElement) => {
   return button
 }
 
-
 export const Control = ({ container }: { container: HTMLDivElement }) => {
   const controlContainer = document.createElement('div')
   controlContainer.style.position = 'absolute'
@@ -47,10 +44,10 @@ export const Control = ({ container }: { container: HTMLDivElement }) => {
   download.textContent = 'd'
   download.setAttribute('aria-label', 'Download')
   download.setAttribute('title', 'Download')
-  download.onmouseenter = () => download.style.background = DEFAULT_BG_HOVER
-  download.onmouseleave = () => download.style.background = DEFAULT_BG
-  download.onfocus = () => download.style.boxShadow = '0px 0px 0px 1px #aaa inset'
-  download.onblur = () => download.style.boxShadow = 'none'
+  download.onmouseenter = () => (download.style.background = DEFAULT_BG_HOVER)
+  download.onmouseleave = () => (download.style.background = DEFAULT_BG)
+  download.onfocus = () => (download.style.boxShadow = '0px 0px 0px 1px #aaa inset')
+  download.onblur = () => (download.style.boxShadow = 'none')
   download.onpointerdown = () => {
     download.style.background = DEFAULT_BG
     download.style.color = DEFAULT_COLOR
@@ -60,7 +57,6 @@ export const Control = ({ container }: { container: HTMLDivElement }) => {
   container.style.position = 'relative'
   container.appendChild(controlContainer)
 
-
   return (options: Options) => {
     controlContainer.style.display = 'block'
     controlContainer.className = options.className ?? 'download-container'

diff --git a/src/bindings/native/selection.ts b/src/bindings/native/selection.ts
@@ -1,5 +1,8 @@
-import { ViewportDragDecelerateEvent, ViewportDragEvent, ViewportPointerEvent } from '../../renderers/webgl'
-
+import {
+  ViewportDragDecelerateEvent,
+  ViewportDragEvent,
+  ViewportPointerEvent,
+} from '../../renderers/webgl'
 
 const DEFAULT_TOP = '100px'
 const DEFAULT_LEFT = '20px'
@@ -10,9 +13,7 @@ const DEFAULT_BG_HOVER_SELECTED = '#ccc'
 const DEFAULT_COLOR = '#666'
 const DEFAULT_COLOR_SELECTED = '#222'
 
-
-export type SelectionChangeEvent = { type: 'selectionChange', x: number, y: number, radius: number }
-
+export type SelectionChangeEvent = { type: 'selectionChange'; x: number; y: number; radius: number }
 
 export type Options = Partial<{
   className: string
@@ -26,7 +27,6 @@ export type Options = Partial<{
   onViewportPointerUp: (event: ViewportPointerEvent) => void
 }>
 
-
 const styleButton = (button: HTMLButtonElement) => {
   button.style.border = '1px solid #aaa'
   button.style.borderRadius = '4px'
@@ -44,7 +44,6 @@ const styleButton = (button: HTMLButtonElement) => {
   return button
 }
 
-
 export const Control = ({ container }: { container: HTMLDivElement }) => {
   let select = false
   let selectionStartX: number | undefined
@@ -58,10 +57,12 @@ export const Control = ({ container }: { container: HTMLDivElement }) => {
   toggleSelection.textContent = '●'
   toggleSelection.setAttribute('aria-label', 'Select')
   toggleSelection.setAttribute('title', 'Select')
-  toggleSelection.onmouseenter = () => toggleSelection.style.background = select ? DEFAULT_BG_HOVER_SELECTED : DEFAULT_BG_HOVER
-  toggleSelection.onmouseleave = () => toggleSelection.style.background = select ? DEFAULT_BG_SELECTED : DEFAULT_BG
-  toggleSelection.onfocus = () => toggleSelection.style.boxShadow = '0px 0px 0px 1px #aaa inset'
-  toggleSelection.onblur = () => toggleSelection.style.boxShadow = 'none'
+  toggleSelection.onmouseenter = () =>
+    (toggleSelection.style.background = select ? DEFAULT_BG_HOVER_SELECTED : DEFAULT_BG_HOVER)
+  toggleSelection.onmouseleave = () =>
+    (toggleSelection.style.background = select ? DEFAULT_BG_SELECTED : DEFAULT_BG)
+  toggleSelection.onfocus = () => (toggleSelection.style.boxShadow = '0px 0px 0px 1px #aaa inset')
+  toggleSelection.onblur = () => (toggleSelection.style.boxShadow = 'none')
   const toggleButtonPointerDown = () => {
     if (select) {
       select = false
@@ -114,12 +115,17 @@ export const Control = ({ container }: { container: HTMLDivElement }) => {
         options.onViewportPointerDown?.(event)
       },
       onViewportDrag: (event: ViewportDragEvent | ViewportDragDecelerateEvent) => {
-        if (select && selectionStartX !== undefined && selectionStartY !== undefined && event.type === 'viewportDrag') {
+        if (
+          select &&
+          selectionStartX !== undefined &&
+          selectionStartY !== undefined &&
+          event.type === 'viewportDrag'
+        ) {
           options.onSelection?.({
             type: 'selectionChange',
             x: selectionStartX,
             y: selectionStartY,
-            radius: Math.hypot(event.x - selectionStartX, event.y - selectionStartY)
+            radius: Math.hypot(event.x - selectionStartX, event.y - selectionStartY),
           })
         } else {
           options.onViewportDrag?.(event)

diff --git a/src/bindings/native/zoom.ts b/src/bindings/native/zoom.ts
@@ -12,11 +12,9 @@ export type ViewportChangeOptions = Partial<{
   padding: number
 }>
 
-
 const DEFAULT_TOP = '20px'
 const DEFAULT_LEFT = '20px'
 
-
 const styleButton = (button: HTMLButtonElement) => {
   button.style.border = '1px solid #aaa'
   button.style.background = '#fff'
@@ -29,17 +27,16 @@ const styleButton = (button: HTMLButtonElement) => {
   button.style.boxSizing = 'border-box'
   button.style.fontWeight = 'bold'
   button.style.color = '#666'
-  button.onmouseenter = () => button.style.background = '#eee'
-  button.onmouseleave = () => button.style.background = '#fff'
-  button.onfocus = () => button.style.boxShadow = '0px 0px 0px 1px #aaa inset'
-  button.onblur = () => button.style.boxShadow = 'none'
+  button.onmouseenter = () => (button.style.background = '#eee')
+  button.onmouseleave = () => (button.style.background = '#fff')
+  button.onfocus = () => (button.style.boxShadow = '0px 0px 0px 1px #aaa inset')
+  button.onblur = () => (button.style.boxShadow = 'none')
 
   return button
 }
 
-
-export const clampZoom = (min: number, max: number, zoom: number) => Math.max(min, Math.min(max, zoom))
-
+export const clampZoom = (min: number, max: number, zoom: number) =>
+  Math.max(min, Math.min(max, zoom))
 
 /**
  * TODO
@@ -91,7 +88,6 @@ export const Control = ({ container }: { container: HTMLDivElement }) => {
       controlContainer.style.left = DEFAULT_LEFT
     }
 
-
     zoomIn.onpointerdown = options.onZoomIn ?? null
     zoomOut.onpointerdown = options.onZoomOut ?? null
   }

diff --git a/src/bindings/react/button.ts b/src/bindings/react/button.ts
@@ -1,6 +1,5 @@
 import { createElement, FunctionComponent, useCallback, useState } from 'react'
 
-
 export type Props = {
   selected?: boolean
   disabled?: boolean
@@ -9,7 +8,6 @@ export type Props = {
   onClick?: () => void
 }
 
-
 const STYLE = {
   border: '1px solid #aaa',
   borderRadius: '4px',
@@ -67,48 +65,57 @@ const DISABLED_STYLE = {
   color: '#aaa',
 }
 
-
 // TODO - memoize style computation
-const buttonStyle = (disabled?: boolean, selected?: boolean, hover?: boolean, focus?: boolean, group?: 'top' | 'middle' | 'bottom') => {
-  const _STYLE = group === undefined ? (
-    STYLE
-  ) : group === 'top' ? {
-    ...STYLE,
-    borderBottomLeftRadius: '0',
-    borderBottomRightRadius: '0',
-    marginBottom: '0',
-    borderBottom: '0',
-  } : group === 'middle' ? {
-    ...STYLE,
-    borderRadius: '0',
-    marginBottom: '0',
-    borderBottom: '0',
-  } : {
-    ...STYLE,
-    borderTopLeftRadius: '0',
-    borderTopRightRadius: '0',
-  }
-
-  return disabled ? (
-    { ..._STYLE, ...DISABLED_STYLE }
-  ) : selected && hover && focus ? (
-    { ..._STYLE, ...SELECTED_HOVER_FOCUS_STYLE }
-  ) : selected && hover ? (
-    { ..._STYLE, ...SELECTED_HOVER_STYLE }
-  ) : selected && focus ? (
-    { ..._STYLE, ...SELECTED_FOCUS_STYLE }
-  ) : hover && focus ? (
-    { ..._STYLE, ...HOVER_FOCUS_STYLE }
-  ) : selected ? (
-    { ..._STYLE, ...SELECTED_STYLE }
-  ) : hover ? (
-    { ..._STYLE, ...HOVER_STYLE }
-  ) : focus ? (
-    { ..._STYLE, ...FOCUS_STYLE}
-  ) : _STYLE
+const buttonStyle = (
+  disabled?: boolean,
+  selected?: boolean,
+  hover?: boolean,
+  focus?: boolean,
+  group?: 'top' | 'middle' | 'bottom',
+) => {
+  const _STYLE =
+    group === undefined
+      ? STYLE
+      : group === 'top'
+      ? {
+          ...STYLE,
+          borderBottomLeftRadius: '0',
+          borderBottomRightRadius: '0',
+          marginBottom: '0',
+          borderBottom: '0',
+        }
+      : group === 'middle'
+      ? {
+          ...STYLE,
+          borderRadius: '0',
+          marginBottom: '0',
+          borderBottom: '0',
+        }
+      : {
+          ...STYLE,
+          borderTopLeftRadius: '0',
+          borderTopRightRadius: '0',
+        }
+
+  return disabled
+    ? { ..._STYLE, ...DISABLED_STYLE }
+    : selected && hover && focus
+    ? { ..._STYLE, ...SELECTED_HOVER_FOCUS_STYLE }
+    : selected && hover
+    ? { ..._STYLE, ...SELECTED_HOVER_STYLE }
+    : selected && focus
+    ? { ..._STYLE, ...SELECTED_FOCUS_STYLE }
+    : hover && focus
+    ? { ..._STYLE, ...HOVER_FOCUS_STYLE }
+    : selected
+    ? { ..._STYLE, ...SELECTED_STYLE }
+    : hover
+    ? { ..._STYLE, ...HOVER_STYLE }
+    : focus
+    ? { ..._STYLE, ...FOCUS_STYLE }
+    : _STYLE
 }
 
-
 export const Button: FunctionComponent<Props> = (props) => {
   const [hover, setHover] = useState(false)
   const [focus, setFocus] = useState(false)
@@ -118,14 +125,18 @@ export const Button: FunctionComponent<Props> = (props) => {
   const onFocus = useCallback(() => setFocus(true), [])
   const onBlur = useCallback(() => setFocus(false), [])
 
-  return createElement('button', {
-    style: buttonStyle(props.disabled, props.selected, hover, focus, props.group),
-    'aria-label': props.title,
-    title: props.title,
-    onClick: props.onClick,
-    onMouseEnter,
-    onMouseLeave,
-    onFocus,
-    onBlur,
-  }, props.children)
+  return createElement(
+    'button',
+    {
+      style: buttonStyle(props.disabled, props.selected, hover, focus, props.group),
+      'aria-label': props.title,
+      title: props.title,
+      onClick: props.onClick,
+      onMouseEnter,
+      onMouseLeave,
+      onFocus,
+      onBlur,
+    },
+    props.children,
+  )
 }
diff --git a/src/bindings/react/buttonGroup.ts b/src/bindings/react/buttonGroup.ts
@@ -1,7 +1,6 @@
 import { createElement, Fragment, FunctionComponent, ReactNode } from 'react'
 import { Button } from './button'
 
-
 export type Props = {
   children: {
     selected?: boolean
@@ -12,22 +11,30 @@ export type Props = {
   }[]
 }
 
-
 export const ButtonGroup: FunctionComponent<Props> = (props) => {
-  return createElement(Fragment, {}, props.children.map(({ selected, disabled, title, onClick, body }, idx) => (
-    createElement(Button, {
-      key: idx,
-      group: props.children.length === 0 ? (
-        undefined
-      ) : idx === 0 ? (
-        'top'
-      ) : idx === props.children.length - 1 ? (
-        'bottom'
-      ) : 'middle',
-      selected,
-      disabled,
-      title,
-      onClick,
-    }, body)
-  )))
+  return createElement(
+    Fragment,
+    {},
+    props.children.map(({ selected, disabled, title, onClick, body }, idx) =>
+      createElement(
+        Button,
+        {
+          key: idx,
+          group:
+            props.children.length === 0
+              ? undefined
+              : idx === 0
+              ? 'top'
+              : idx === props.children.length - 1
+              ? 'bottom'
+              : 'middle',
+          selected,
+          disabled,
+          title,
+          onClick,
+        },
+        body,
+      ),
+    ),
+  )
 }