Adds Spinbox, scrollarea and dial to react-nodegui

Author: a7ul

src/components/Dial/index.ts

@@ -0,0 +1,62 @@
+import { registerComponent } from "../config";
+import { QDial } from "@nodegui/nodegui";
+import { ViewProps, setProps as setViewProps } from "../View";
+
+export interface DialProps extends ViewProps {
+  notchesVisible?: boolean;
+  wrapping?: boolean;
+  notchTarget?: number;
+}
+
+export const setProps = (
+  widget: QDial,
+  newProps: DialProps,
+  oldProps: DialProps
+) => {
+  const setter: DialProps = {
+    set notchesVisible(notchesVisible: boolean) {
+      widget.setNotchesVisible(notchesVisible);
+    },
+    set wrapping(wrapping: boolean) {
+      widget.setWrapping(wrapping);
+    },
+    set notchTarget(notchTarget: number) {
+      widget.setNotchTarget(notchTarget);
+    }
+  };
+  Object.assign(setter, newProps);
+  setViewProps(widget, newProps, oldProps);
+};
+
+export const Dial = registerComponent<DialProps>({
+  id: "dial",
+  getContext() {
+    return {};
+  },
+  shouldSetTextContent: () => {
+    return true;
+  },
+  createInstance: newProps => {
+    const widget = new QDial();
+    setProps(widget, newProps, {});
+    return widget;
+  },
+  finalizeInitialChildren: () => {
+    return false;
+  },
+  commitMount: (instance, newProps, internalInstanceHandle) => {
+    return;
+  },
+  prepareUpdate: (
+    instance,
+    oldProps,
+    newProps,
+    rootContainerInstance,
+    hostContext
+  ) => {
+    return true;
+  },
+  commitUpdate: (instance, updatePayload, oldProps, newProps, finishedWork) => {
+    setProps(instance as QDial, newProps, oldProps);
+  }
+});

src/components/ScrollArea/index.ts

@@ -0,0 +1,56 @@
+import { registerComponent } from "../config";
+import { QScrollArea } from "@nodegui/nodegui";
+import { ViewProps, setProps as setViewProps } from "../View";
+import { ReactElement } from "react";
+
+export interface ScrollAreaProps extends ViewProps {
+  children?: ReactElement;
+}
+
+export const setProps = (
+  widget: QScrollArea,
+  newProps: ScrollAreaProps,
+  oldProps: ScrollAreaProps
+) => {
+  const setter: ScrollAreaProps = {
+    set children(childWidget: ReactElement) {
+      console.log(childWidget, "childWidget");
+      // widget.setWidget(childWidget);
+    }
+  };
+  Object.assign(setter, newProps);
+  setViewProps(widget, newProps, oldProps);
+};
+
+export const ScrollArea = registerComponent<ScrollAreaProps>({
+  id: "ScrollArea",
+  getContext() {
+    return {};
+  },
+  shouldSetTextContent: () => {
+    return true;
+  },
+  createInstance: newProps => {
+    const widget = new QScrollArea();
+    setProps(widget, newProps, {});
+    return widget;
+  },
+  finalizeInitialChildren: () => {
+    return false;
+  },
+  commitMount: (instance, newProps, internalInstanceHandle) => {
+    return;
+  },
+  prepareUpdate: (
+    instance,
+    oldProps,
+    newProps,
+    rootContainerInstance,
+    hostContext
+  ) => {
+    return true;
+  },
+  commitUpdate: (instance, updatePayload, oldProps, newProps, finishedWork) => {
+    setProps(instance as QScrollArea, newProps, oldProps);
+  }
+});

src/components/SpinBox/index.ts

@@ -0,0 +1,75 @@
+import { registerComponent } from "../config";
+import { QSpinBox } from "@nodegui/nodegui";
+import { ViewProps, setProps as setViewProps } from "../View";
+
+type Range = {
+  minimum: number;
+  maximum: number;
+};
+
+export interface SpinBoxProps extends ViewProps {
+  prefix?: string;
+  suffix?: string;
+  singleStep?: number;
+  range?: Range;
+  value?: number;
+}
+
+export const setProps = (
+  widget: QSpinBox,
+  newProps: SpinBoxProps,
+  oldProps: SpinBoxProps
+) => {
+  const setter: SpinBoxProps = {
+    set prefix(prefix: string) {
+      widget.setPrefix(prefix);
+    },
+    set suffix(suffix: string) {
+      widget.setSuffix(suffix);
+    },
+    set singleStep(step: number) {
+      widget.setSingleStep(step);
+    },
+    set range(range: Range) {
+      widget.setRange(range.minimum, range.maximum);
+    },
+    set value(value: number) {
+      widget.setValue(value);
+    }
+  };
+  Object.assign(setter, newProps);
+  setViewProps(widget, newProps, oldProps);
+};
+
+export const SpinBox = registerComponent<SpinBoxProps>({
+  id: "SpinBox",
+  getContext() {
+    return {};
+  },
+  shouldSetTextContent: () => {
+    return true;
+  },
+  createInstance: newProps => {
+    const widget = new QSpinBox();
+    setProps(widget, newProps, {});
+    return widget;
+  },
+  finalizeInitialChildren: () => {
+    return false;
+  },
+  commitMount: (instance, newProps, internalInstanceHandle) => {
+    return;
+  },
+  prepareUpdate: (
+    instance,
+    oldProps,
+    newProps,
+    rootContainerInstance,
+    hostContext
+  ) => {
+    return true;
+  },
+  commitUpdate: (instance, updatePayload, oldProps, newProps, finishedWork) => {
+    setProps(instance as QSpinBox, newProps, oldProps);
+  }
+});

src/index.ts

@@ -9,4 +9,7 @@ export { LineEdit } from "./components/LineEdit";
 export { PlainTextEdit } from "./components/PlainTextEdit";
 export { ProgressBar } from "./components/ProgressBar";
 export { RadioButton } from "./components/RadioButton";
+export { Dial } from "./components/Dial";
+export { SpinBox } from "./components/SpinBox";
+export { ScrollArea } from "./components/ScrollArea";
 export { useEventHandler } from "./hooks";