git0 0.2.9 → 0.2.11

package/svelte-nodegui/src/dom/react-nodegui/src/components/SystemTrayIcon/RNSystemTrayIcon.ts

@@ -0,0 +1,141 @@
+import { WidgetEventListeners } from "../View/RNView";
+import {
+  QSystemTrayIconSignals,
+  QSystemTrayIcon,
+  NodeWidget,
+  QIcon,
+  QMenu,
+} from "@nodegui/nodegui";
+import { RNComponent, RNProps } from "../config";
+import { throwUnsupported } from "../../utils/helpers";
+
+/**
+ * The SystemTrayIcon component provides the ability to add and manipulate a native system tray icon.
+ * [NodeGui's QSystemTrayIcon](https://docs.nodegui.org/docs/api/generated/classes/qsystemtrayicon).
+ * ## Example
+ * ```javascript
+ * import React from "react";
+ * import { QIcon, QAction } from "@nodegui/nodegui";
+ * import { Menu, Renderer, SystemTrayIcon, Window } from "@nodegui/react-nodegui";
+ * import path from "path";
+ *
+ * const icon = new QIcon(path.join(__dirname, "../extras/assets/nodegui.png"));
+ * const action = new QAction();
+ * action.setText("Hello");
+ * action.addEventListener("triggered", () => {
+ *   console.log("hello");
+ * });
+ *
+ * const App = () => {
+ *   return (
+ *     <Window>
+ *       <SystemTrayIcon icon={icon} tooltip="Hello World" visible>
+ *         <Menu actions={[action]} />
+ *       </SystemTrayIcon>
+ *     </Window>
+ *   );
+ * };
+ *
+ * Renderer.render(<App />);
+ *
+ * ```
+ */
+export interface SystemTrayIconProps extends RNProps {
+  /**
+   * Sets an icon for the system tray. [QSystemTrayIcon: setIcon](https://docs.nodegui.org/docs/api/generated/classes/qsystemtrayicon#seticon)
+   */
+  icon?: QIcon;
+
+  /**
+   * Sets the object name (id) of the widget in Qt. Object name can be analogous to id of an element in the web world. Using the objectName of the widget one can reference it in the Qt's stylesheet much like what we do with id in the web world. [QWidget: setObjectName](https://docs.nodegui.org/docs/api/NodeWidget#widgetsetobjectnameobjectname)
+   */
+  id?: string;
+
+  /**
+   * Prop to set the event listener map. See [Handlong Events](/docs/guides/handle-events)
+   */
+  on?: Partial<WidgetEventListeners | QSystemTrayIconSignals>;
+
+  /**
+   * Sets a tooltip for the system tray. [QSystemTrayIcon: setTooltip](https://docs.nodegui.org/docs/api/generated/classes/qsystemtrayicon#settooltip)
+   */
+  tooltip?: string;
+
+  /**
+   * Shows or hides the widget and its children. [QWidget: show](https://docs.nodegui.org/docs/api/NodeWidget#widgetshow)
+   */
+  visible?: boolean;
+}
+
+const setSystemTrayIconProps = (
+  widget: RNSystemTrayIcon,
+  newProps: SystemTrayIconProps,
+  oldProps: SystemTrayIconProps
+) => {
+  const setter: SystemTrayIconProps = {
+    set icon(icon: QIcon) {
+      widget.setIcon(icon);
+    },
+    set id(id: string) {
+      widget.setObjectName(id);
+    },
+    set on(
+      listenerMap: Partial<WidgetEventListeners | QSystemTrayIconSignals>
+    ) {
+      const listenerMapLatest: any = Object.assign({}, listenerMap);
+      const oldListenerMap = Object.assign({}, oldProps.on);
+      Object.entries(oldListenerMap).forEach(([eventType, oldEvtListener]) => {
+        const newEvtListener = listenerMapLatest[eventType];
+        if (oldEvtListener !== newEvtListener) {
+          widget.removeEventListener(eventType as any, oldEvtListener);
+        } else {
+          delete listenerMapLatest[eventType];
+        }
+      });
+
+      Object.entries(listenerMapLatest).forEach(
+        ([eventType, newEvtListener]) => {
+          widget.addEventListener(eventType as any, newEvtListener);
+        }
+      );
+    },
+    set tooltip(tooltip: string) {
+      widget.setToolTip(tooltip);
+    },
+    set visible(shouldShow: boolean) {
+      shouldShow ? widget.show() : widget.hide();
+    },
+  };
+  Object.assign(setter, newProps);
+};
+
+/**
+ * @ignore
+ */
+export class RNSystemTrayIcon extends QSystemTrayIcon implements RNComponent {
+  static tagName = "systemtrayicon";
+
+  setProps(newProps: SystemTrayIconProps, oldProps: SystemTrayIconProps): void {
+    setSystemTrayIconProps(this, newProps, oldProps);
+  }
+  appendInitialChild(child: NodeWidget<any>): void {
+    if (child instanceof QMenu) {
+      if (!this.contextMenu) {
+        this.setContextMenu(child);
+      } else {
+        console.warn("SystemTrayIcon can't have more than one Menu.");
+      }
+    } else {
+      console.warn("SystemTrayIcon only supports Menu as its children");
+    }
+  }
+  appendChild(child: NodeWidget<any>): void {
+    this.appendInitialChild(child);
+  }
+  insertBefore(child: NodeWidget<any>, beforeChild: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+  removeChild(child: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+}

package/svelte-nodegui/src/dom/react-nodegui/src/components/SystemTrayIcon/index.ts

@@ -0,0 +1,43 @@
+import type { Fiber } from "../../utils/decoupleFromReact";
+import { registerComponent, ComponentConfig } from "../config";
+import { RNSystemTrayIcon, SystemTrayIconProps } from "./RNSystemTrayIcon";
+import { AppContainer } from "../../reconciler";
+
+class SystemTrayIconConfig extends ComponentConfig {
+  tagName = RNSystemTrayIcon.tagName;
+  shouldSetTextContent(nextProps: SystemTrayIconProps): boolean {
+    return false;
+  }
+  createInstance(
+    newProps: SystemTrayIconProps,
+    rootInstance: AppContainer,
+    context: any,
+    workInProgress: Fiber
+  ): RNSystemTrayIcon {
+    const widget = new RNSystemTrayIcon();
+    widget.setProps(newProps, {});
+    return widget;
+  }
+  commitMount(
+    instance: RNSystemTrayIcon,
+    newProps: SystemTrayIconProps,
+    internalInstanceHandle: any
+  ): void {
+    if (newProps.visible !== false) {
+      instance.show();
+    }
+  }
+  commitUpdate(
+    instance: RNSystemTrayIcon,
+    updatePayload: any,
+    oldProps: SystemTrayIconProps,
+    newProps: SystemTrayIconProps,
+    finishedWork: Fiber
+  ): void {
+    instance.setProps(newProps, oldProps);
+  }
+}
+
+export const SystemTrayIcon = registerComponent<SystemTrayIconProps>(
+  new SystemTrayIconConfig()
+);

package/svelte-nodegui/src/dom/react-nodegui/src/components/Tab/RNTab.ts

@@ -0,0 +1,69 @@
+import {
+  QTabWidget,
+  QTabWidgetSignals,
+  TabPosition,
+  QIcon,
+  NodeWidget
+} from "@nodegui/nodegui";
+import { ViewProps, setViewProps } from "../View/RNView";
+import { RNComponent } from "../config";
+import { RNTabItem, setTabItemProps } from "../TabItem/RNTabItem";
+
+export interface TabProps extends ViewProps<QTabWidgetSignals> {
+  tabPosition?: TabPosition;
+}
+
+/**
+ * @ignore
+ */
+export const setTabProps = (
+  widget: RNTab,
+  newProps: TabProps,
+  oldProps: TabProps
+) => {
+  const setter: TabProps = {
+    set tabPosition(value: TabPosition) {
+      widget.setTabPosition(value);
+    }
+  };
+  Object.assign(setter, newProps);
+  setViewProps(widget, newProps, oldProps);
+};
+
+/**
+ * @ignore
+ */
+export class RNTab extends QTabWidget implements RNComponent {
+  setProps(newProps: TabProps, oldProps: TabProps): void {
+    setTabProps(this, newProps, oldProps);
+  }
+
+  appendInitialChild(tabItem: RNTabItem): void {
+    if (!(tabItem instanceof RNTabItem)) {
+      throw new Error("Children of tab should be of type TabItem");
+    }
+
+    if (tabItem.actualTabWidget) {
+      this.addTab(tabItem.actualTabWidget, new QIcon(), "");
+      tabItem.parentTab = this;
+      setTabItemProps(tabItem, this, tabItem.initialProps, {});
+    }
+  }
+  appendChild(child: RNTabItem): void {
+    this.appendInitialChild(child);
+  }
+  insertBefore(child: RNTabItem, beforeChild: RNTabItem): void {
+    if (!(child instanceof RNTabItem)) {
+      throw new Error("Children of tab should be of type TabItem");
+    }
+    const index = this.indexOf(beforeChild.actualTabWidget as NodeWidget<any>);
+    this.insertTab(index, child.actualTabWidget as NodeWidget<any>, new QIcon(), "");
+    child.parentTab = this;
+    setTabItemProps(child, this, child.initialProps, {});
+  }
+  removeChild(child: RNTabItem): void {
+    const childIndex = this.indexOf(child.actualTabWidget as NodeWidget<any>);
+    this.removeTab(childIndex);
+  }
+  static tagName = "tabwidget";
+}

package/svelte-nodegui/src/dom/react-nodegui/src/components/Tab/index.ts

@@ -0,0 +1,48 @@
+import type { Fiber } from "../../utils/decoupleFromReact";
+import { registerComponent, ComponentConfig } from "../config";
+import { RNTab, TabProps } from "./RNTab";
+import { AppContainer } from "../../reconciler";
+class TabsConfig extends ComponentConfig {
+  tagName = RNTab.tagName;
+  shouldSetTextContent(nextProps: TabProps): boolean {
+    return false;
+  }
+  createInstance(
+    newProps: TabProps,
+    rootInstance: AppContainer,
+    context: any,
+    workInProgress: Fiber
+  ): RNTab {
+    const widget = new RNTab();
+    widget.setProps(newProps, {});
+    return widget;
+  }
+  commitMount(
+    instance: RNTab,
+    newProps: TabProps,
+    internalInstanceHandle: any
+  ): void {
+    if (newProps.visible !== false) {
+      instance.show();
+    }
+  }
+  finalizeInitialChildren(
+    instance: RNTab,
+    newProps: TabProps,
+    rootContainerInstance: AppContainer,
+    context: any
+  ): boolean {
+    return true;
+  }
+  commitUpdate(
+    instance: RNTab,
+    updatePayload: any,
+    oldProps: TabProps,
+    newProps: TabProps,
+    finishedWork: Fiber
+  ): void {
+    instance.setProps(newProps, oldProps);
+  }
+}
+
+export const Tabs = registerComponent<TabProps>(new TabsConfig());

package/svelte-nodegui/src/dom/react-nodegui/src/components/TabItem/RNTabItem.ts

@@ -0,0 +1,72 @@
+import { NodeWidget, QIcon, Component } from "@nodegui/nodegui";
+import { RNComponent, RNProps } from "../config";
+import { RNTab } from "../Tab/RNTab";
+
+export interface TabItemProps {
+  title?: string;
+  icon?: QIcon;
+}
+
+/**
+ * @ignore
+ */
+export const setTabItemProps = (
+  tabItem: RNTabItem,
+  parentTab: RNTab,
+  newProps: TabItemProps,
+  oldProps: TabItemProps
+) => {
+  if (!tabItem.actualTabWidget) {
+    return;
+  }
+  const tabIndex = parentTab.indexOf(tabItem.actualTabWidget);
+  if (tabIndex < 0) {
+    console.error("TabItem is not part of the parent tab it references to");
+    return;
+  }
+
+  const setter: TabItemProps = {
+    set title(text: string) {
+      parentTab.setTabText(tabIndex, text);
+    },
+    set icon(qicon: QIcon) {
+      parentTab.setTabIcon(tabIndex, qicon);
+    }
+  };
+  Object.assign(setter, newProps);
+};
+
+/**
+ * @ignore
+ */
+export class RNTabItem extends Component implements RNComponent {
+  native: any;
+  actualTabWidget?: NodeWidget<any>;
+  initialProps: TabItemProps = {};
+  parentTab?: RNTab;
+
+  setProps(newProps: TabItemProps, oldProps: TabItemProps): void {
+    if (this.parentTab) {
+      setTabItemProps(this, this.parentTab, newProps, oldProps);
+    } else {
+      this.initialProps = newProps;
+    }
+  }
+  appendInitialChild(child: NodeWidget<any>): void {
+    if (this.actualTabWidget) {
+      throw new Error("Tab Item can have only one child");
+    }
+    this.actualTabWidget = child;
+  }
+  appendChild(child: NodeWidget<any>): void {
+    this.appendInitialChild(child);
+  }
+  insertBefore(child: NodeWidget<any>, beforeChild: NodeWidget<any>): void {
+    this.appendInitialChild(child);
+  }
+  removeChild(child: NodeWidget<any>): void {
+    child.close();
+    delete this.actualTabWidget;
+  }
+  static tagName: string = "tabitem";
+}

package/svelte-nodegui/src/dom/react-nodegui/src/components/TabItem/index.ts

@@ -0,0 +1,40 @@
+import type { Fiber } from "../../utils/decoupleFromReact";
+import { registerComponent, ComponentConfig } from "../config";
+import { RNTabItem, TabItemProps } from "./RNTabItem";
+import { AppContainer } from "../../reconciler";
+
+class TabItemConfig extends ComponentConfig {
+  tagName = RNTabItem.tagName;
+  shouldSetTextContent(nextProps: TabItemProps): boolean {
+    return false;
+  }
+  createInstance(
+    newProps: TabItemProps,
+    rootInstance: AppContainer,
+    context: any,
+    workInProgress: Fiber
+  ): RNTabItem {
+    const item = new RNTabItem();
+    item.setProps(newProps, {});
+    return item;
+  }
+  finalizeInitialChildren(
+    instance: RNTabItem,
+    newProps: TabItemProps,
+    rootContainerInstance: AppContainer,
+    context: any
+  ): boolean {
+    return false;
+  }
+  commitUpdate(
+    instance: RNTabItem,
+    updatePayload: any,
+    oldProps: TabItemProps,
+    newProps: TabItemProps,
+    finishedWork: Fiber
+  ): void {
+    instance.setProps(newProps, oldProps);
+  }
+}
+
+export const TabItem = registerComponent<TabItemProps>(new TabItemConfig());

package/svelte-nodegui/src/dom/react-nodegui/src/components/Text/RNText.ts

@@ -0,0 +1,65 @@
+import { QLabel, NodeWidget, QLabelSignals, TextInteractionFlag } from '@nodegui/nodegui';
+import { ViewProps, setViewProps } from '../View/RNView';
+import { RNWidget } from '../config';
+import { throwUnsupported } from '../../utils/helpers';
+
+export interface TextProps extends ViewProps<QLabelSignals> {
+  children?: string | number | Array<string | number>;
+  wordWrap?: boolean;
+  scaledContents?: boolean;
+  openExternalLinks?: boolean;
+  textInteractionFlags?: TextInteractionFlag;
+}
+
+/**
+ * @ignore
+ */
+export const setTextProps = (
+  widget: RNText,
+  newProps: TextProps,
+  oldProps: TextProps
+) => {
+  const setter: TextProps = {
+    set children(text: string | number | Array<string | number>) {
+      text = Array.isArray(text) ? text.join('') : text;
+
+      widget.setText(text);
+    },
+    set wordWrap(shouldWrap: boolean) {
+      widget.setWordWrap(shouldWrap);
+    },
+    set scaledContents(scaled: boolean) {
+      widget.setProperty('scaledContents', scaled);
+    },
+    set openExternalLinks(shouldOpenExternalLinks: boolean) {
+      widget.setProperty('openExternalLinks', shouldOpenExternalLinks);
+    },
+    set textInteractionFlags(interactionFlag: TextInteractionFlag){
+      widget.setProperty('textInteractionFlags', interactionFlag);
+    }
+  };
+  Object.assign(setter, newProps);
+  setViewProps(widget, newProps, oldProps);
+};
+
+/**
+ * @ignore
+ */
+export class RNText extends QLabel implements RNWidget {
+  setProps(newProps: TextProps, oldProps: TextProps): void {
+    setTextProps(this, newProps, oldProps);
+  }
+  appendInitialChild(child: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+  appendChild(child: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+  insertBefore(child: NodeWidget<any>, beforeChild: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+  removeChild(child: NodeWidget<any>): void {
+    throwUnsupported(this);
+  }
+  static tagName = 'text';
+}

package/svelte-nodegui/src/dom/react-nodegui/src/components/Text/index.ts

@@ -0,0 +1,49 @@
+import type { Fiber } from "../../utils/decoupleFromReact";
+import { registerComponent, ComponentConfig } from "../config";
+import { RNText, TextProps } from "./RNText";
+import { AppContainer } from "../../reconciler";
+class TextConfig extends ComponentConfig {
+  tagName = RNText.tagName;
+  shouldSetTextContent(nextProps: TextProps): boolean {
+    return true;
+  }
+  createInstance(
+    newProps: TextProps,
+    rootInstance: AppContainer,
+    context: any,
+    workInProgress: Fiber
+  ): RNText {
+    const widget = new RNText();
+    widget.setProps(newProps, {});
+    return widget;
+  }
+  commitMount(
+    instance: RNText,
+    newProps: TextProps,
+    internalInstanceHandle: any
+  ): void {
+    if (newProps.visible !== false) {
+      instance.show();
+    }
+    return;
+  }
+  finalizeInitialChildren(
+    instance: RNText,
+    newProps: TextProps,
+    rootContainerInstance: AppContainer,
+    context: any
+  ): boolean {
+    return true;
+  }
+  commitUpdate(
+    instance: RNText,
+    updatePayload: any,
+    oldProps: TextProps,
+    newProps: TextProps,
+    finishedWork: Fiber
+  ): void {
+    instance.setProps(newProps, oldProps);
+  }
+}
+
+export const Text = registerComponent<TextProps>(new TextConfig());