@teselagen/ui 0.6.1 → 0.6.3

package/TgSelect/index.d.ts

@@ -6,5 +6,4 @@ export function createNewOption(newValString: any): {
 export function simplesearch(needle: any, haystack: any): boolean;
 declare function _default(props: any): import("react/jsx-runtime").JSX.Element;
 export default _default;
-export function renderCreateNewOption(query: any, active: any, handleClick: any): import("react/jsx-runtime").JSX.Element;
 export function itemListPredicate(_queryString: string | undefined, items: any, isSimpleSearch: any): any;

package/index.cjs.js

@@ -37076,6 +37076,28 @@ const _TgSelect = class _TgSelect extends React$1.Component {
       }
       return optionRenderer;
     }, "getOptionRenderer"));
+    __publicField(this, "renderCreateNewOption", /* @__PURE__ */ __name((query, active3, handleClick) => {
+      if (this.props.renderCreateNewOption) {
+        return this.props.renderCreateNewOption(query, active3, handleClick);
+      }
+      return /* @__PURE__ */ React$1.createElement(
+        core.MenuItem,
+        {
+          icon: "add",
+          text: `Create "${query}"`,
+          active: active3,
+          onClick: (...args) => {
+            const shouldStopEarly = this.props.onCreateNewOption(query);
+            if (shouldStopEarly) {
+              this.setOpenState(false);
+            } else {
+              handleClick(...args);
+            }
+          },
+          shouldDismissPopover: false
+        }
+      );
+    }, "renderCreateNewOption"));
     const { autoOpen = false } = this.props;
     this.state = {
       isOpen: autoOpen,
@@ -37111,8 +37133,7 @@ const _TgSelect = class _TgSelect extends React$1.Component {
       disabled,
       popoverProps,
       additionalRightEl,
-      resetOnSelect = true,
-      renderCreateNewOption: _renderCreateNewOption = renderCreateNewOption$1
+      resetOnSelect = true
     } = _a2, rest = __objRest(_a2, [
       "multi",
       "asTag",
@@ -37140,8 +37161,7 @@ const _TgSelect = class _TgSelect extends React$1.Component {
       "disabled",
       "popoverProps",
       "additionalRightEl",
-      "resetOnSelect",
-      "renderCreateNewOption"
+      "resetOnSelect"
     ]);
     if (asTag) {
       small = true;
@@ -37180,7 +37200,7 @@ const _TgSelect = class _TgSelect extends React$1.Component {
       }
     ));
     const maybeCreateNewItemFromQuery = creatable ? createNewOption : void 0;
-    const maybeCreateNewItemRenderer = creatable && !this.queryHasExactOptionMatch() ? _renderCreateNewOption : null;
+    const maybeCreateNewItemRenderer = creatable && !this.queryHasExactOptionMatch() ? this.renderCreateNewOption : null;
     const selectedItems = getValueArray(value).map((value2) => {
       if (value2 && value2.label)
         return value2;
@@ -37319,16 +37339,6 @@ const TgSelect$1 = redux.compose(
 )(TgSelect);
 const itemDisabled = /* @__PURE__ */ __name((i) => i.disabled, "itemDisabled");
 const noResultsDefault = /* @__PURE__ */ React$1.createElement("div", null, "No Results...");
-const renderCreateNewOption$1 = /* @__PURE__ */ __name((query, active3, handleClick) => /* @__PURE__ */ React$1.createElement(
-  core.MenuItem,
-  {
-    icon: "add",
-    text: `Create "${query}"`,
-    active: active3,
-    onClick: handleClick,
-    shouldDismissPopover: false
-  }
-), "renderCreateNewOption$1");
 function createNewOption(newValString) {
   if (!newValString)
     return;

package/index.es.js

@@ -58,7 +58,7 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as React$1 from "react";
 import React__default, { useState, useEffect, forwardRef, useImperativeHandle, Fragment, useMemo, useRef, useReducer, useCallback, memo, Component, PureComponent, createElement, useLayoutEffect, createContext, useContext, isValidElement } from "react";
-import { Icon, Classes, Button, Intent, Keys, MenuItem, Tag, useHotkeys, Popover, Tooltip, Toaster, Position, Menu, MenuDivider, NumericInput, InputGroup, Spinner, FormGroup, TextArea, Checkbox, Switch, EditableText, RadioGroup, Callout, ContextMenu, Dialog, Card, Tabs, Tab, Colors, Overlay, KeyCombo, ProgressBar } from "@blueprintjs/core";
+import { Icon, Classes, Button, Intent, MenuItem, Keys, Tag, useHotkeys, Popover, Tooltip, Toaster, Position, Menu, MenuDivider, NumericInput, InputGroup, Spinner, FormGroup, TextArea, Checkbox, Switch, EditableText, RadioGroup, Callout, ContextMenu, Dialog, Card, Tabs, Tab, Colors, Overlay, KeyCombo, ProgressBar } from "@blueprintjs/core";
 import ReactDOM, { unstable_batchedUpdates, createPortal } from "react-dom";
 import { FormName, formValueSelector, change, Field, reduxForm, SubmissionError, destroy, initialize, Fields } from "redux-form";
 import { connect, useStore } from "react-redux";
@@ -37058,6 +37058,28 @@ const _TgSelect = class _TgSelect extends React__default.Component {
       }
       return optionRenderer;
     }, "getOptionRenderer"));
+    __publicField(this, "renderCreateNewOption", /* @__PURE__ */ __name((query, active3, handleClick) => {
+      if (this.props.renderCreateNewOption) {
+        return this.props.renderCreateNewOption(query, active3, handleClick);
+      }
+      return /* @__PURE__ */ React__default.createElement(
+        MenuItem,
+        {
+          icon: "add",
+          text: `Create "${query}"`,
+          active: active3,
+          onClick: (...args) => {
+            const shouldStopEarly = this.props.onCreateNewOption(query);
+            if (shouldStopEarly) {
+              this.setOpenState(false);
+            } else {
+              handleClick(...args);
+            }
+          },
+          shouldDismissPopover: false
+        }
+      );
+    }, "renderCreateNewOption"));
     const { autoOpen = false } = this.props;
     this.state = {
       isOpen: autoOpen,
@@ -37093,8 +37115,7 @@ const _TgSelect = class _TgSelect extends React__default.Component {
       disabled,
       popoverProps,
       additionalRightEl,
-      resetOnSelect = true,
-      renderCreateNewOption: _renderCreateNewOption = renderCreateNewOption$1
+      resetOnSelect = true
     } = _a2, rest = __objRest(_a2, [
       "multi",
       "asTag",
@@ -37122,8 +37143,7 @@ const _TgSelect = class _TgSelect extends React__default.Component {
       "disabled",
       "popoverProps",
       "additionalRightEl",
-      "resetOnSelect",
-      "renderCreateNewOption"
+      "resetOnSelect"
     ]);
     if (asTag) {
       small = true;
@@ -37162,7 +37182,7 @@ const _TgSelect = class _TgSelect extends React__default.Component {
       }
     ));
     const maybeCreateNewItemFromQuery = creatable ? createNewOption : void 0;
-    const maybeCreateNewItemRenderer = creatable && !this.queryHasExactOptionMatch() ? _renderCreateNewOption : null;
+    const maybeCreateNewItemRenderer = creatable && !this.queryHasExactOptionMatch() ? this.renderCreateNewOption : null;
     const selectedItems = getValueArray(value).map((value2) => {
       if (value2 && value2.label)
         return value2;
@@ -37301,16 +37321,6 @@ const TgSelect$1 = compose$1(
 )(TgSelect);
 const itemDisabled = /* @__PURE__ */ __name((i) => i.disabled, "itemDisabled");
 const noResultsDefault = /* @__PURE__ */ React__default.createElement("div", null, "No Results...");
-const renderCreateNewOption$1 = /* @__PURE__ */ __name((query, active3, handleClick) => /* @__PURE__ */ React__default.createElement(
-  MenuItem,
-  {
-    icon: "add",
-    text: `Create "${query}"`,
-    active: active3,
-    onClick: handleClick,
-    shouldDismissPopover: false
-  }
-), "renderCreateNewOption$1");
 function createNewOption(newValString) {
   if (!newValString)
     return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.6.1",
+  "version": "0.6.3",
   "main": "./src/index.js",
   "exports": {
     ".": {

package/src/TgSelect/index.js

@@ -221,6 +221,27 @@ class TgSelect extends React.Component {
     }
     return optionRenderer;
   };
+  renderCreateNewOption = (query, active, handleClick) => {
+    if (this.props.renderCreateNewOption) {
+      return this.props.renderCreateNewOption(query, active, handleClick);
+    }
+    return (
+      <MenuItem
+        icon="add"
+        text={`Create "${query}"`}
+        active={active}
+        onClick={(...args) => {
+          const shouldStopEarly = this.props.onCreateNewOption(query);
+          if (shouldStopEarly) {
+            this.setOpenState(false);
+          } else {
+            handleClick(...args);
+          }
+        }}
+        shouldDismissPopover={false}
+      />
+    );
+  };
 
   render() {
     let {
@@ -250,7 +271,6 @@ class TgSelect extends React.Component {
       popoverProps,
       additionalRightEl,
       resetOnSelect = true,
-      renderCreateNewOption: _renderCreateNewOption = renderCreateNewOption,
       ...rest
     } = this.props;
     if (asTag) {
@@ -304,7 +324,7 @@ class TgSelect extends React.Component {
     const maybeCreateNewItemFromQuery = creatable ? createNewOption : undefined;
     const maybeCreateNewItemRenderer =
       creatable && !this.queryHasExactOptionMatch()
-        ? _renderCreateNewOption
+        ? this.renderCreateNewOption
         : null;
     const selectedItems = getValueArray(value).map(value => {
       if (value && value.label) return value; //if the value has a label, just use that
@@ -458,16 +478,6 @@ export default compose(
 const itemDisabled = i => i.disabled;
 const noResultsDefault = <div>No Results...</div>;
 
-export const renderCreateNewOption = (query, active, handleClick) => (
-  <MenuItem
-    icon="add"
-    text={`Create "${query}"`}
-    active={active}
-    onClick={handleClick}
-    shouldDismissPopover={false}
-  />
-);
-
 export function createNewOption(newValString) {
   if (!newValString) return;
   return {