aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/TouchScrollableMenu.tsx
diff options
context:
space:
mode:
authorSophie Zhang <sophie_zhang@brown.edu>2024-01-25 11:35:26 -0500
committerSophie Zhang <sophie_zhang@brown.edu>2024-01-25 11:35:26 -0500
commitf3dab2a56db5e4a6a3dca58185d94e1ff7d1dc32 (patch)
treea7bc895266b53bb620dbd2dd71bad2e83b555446 /src/client/views/TouchScrollableMenu.tsx
parentb5c5410b4af5d2c68d2107d3f064f6e3ec4ac3f2 (diff)
parent136f3d9f349d54e8bdd73b6380ea47c19e5edebf (diff)
Merge branch 'master' into sophie-ai-images
Diffstat (limited to 'src/client/views/TouchScrollableMenu.tsx')
-rw-r--r--src/client/views/TouchScrollableMenu.tsx34
1 files changed, 19 insertions, 15 deletions
diff --git a/src/client/views/TouchScrollableMenu.tsx b/src/client/views/TouchScrollableMenu.tsx
index 969605be9..530c693a7 100644
--- a/src/client/views/TouchScrollableMenu.tsx
+++ b/src/client/views/TouchScrollableMenu.tsx
@@ -1,6 +1,6 @@
-import React = require("react");
-import { computed } from "mobx";
-import { observer } from "mobx-react";
+import * as React from 'react';
+import { computed } from 'mobx';
+import { observer } from 'mobx-react';
export interface TouchScrollableMenuProps {
options: JSX.Element[];
@@ -24,31 +24,35 @@ export interface TouchScrollableMenuItemProps {
@observer
export default class TouchScrollableMenu extends React.Component<TouchScrollableMenuProps> {
-
@computed
- private get possibilities() { return this.props.options; }
+ private get possibilities() {
+ return this.props.options;
+ }
@computed
- private get selectedIndex() { return this.props.selectedIndex; }
+ private get selectedIndex() {
+ return this.props.selectedIndex;
+ }
render() {
return (
- <div className="inkToTextDoc-cont" style={{
- transform: `translate(${this.props.x}px, ${this.props.y}px)`,
- width: 300,
- height: this.possibilities.length * 25
- }}>
+ <div
+ className="inkToTextDoc-cont"
+ style={{
+ transform: `translate(${this.props.x}px, ${this.props.y}px)`,
+ width: 300,
+ height: this.possibilities.length * 25,
+ }}>
<div className="inkToTextDoc-scroller" style={{ transform: `translate(0, ${-this.selectedIndex * 25}px)` }}>
{this.possibilities}
</div>
- <div className="shadow" style={{ height: `calc(100% - 25px - ${this.selectedIndex * 25}px)` }}>
- </div>
+ <div className="shadow" style={{ height: `calc(100% - 25px - ${this.selectedIndex * 25}px)` }}></div>
</div>
);
}
}
-export class TouchScrollableMenuItem extends React.Component<TouchScrollableMenuItemProps>{
+export class TouchScrollableMenuItem extends React.Component<TouchScrollableMenuItemProps> {
render() {
return (
<div className="menuItem-cont" onClick={this.props.onClick}>
@@ -56,4 +60,4 @@ export class TouchScrollableMenuItem extends React.Component<TouchScrollableMenu
</div>
);
}
-} \ No newline at end of file
+}