@tellescope/react-components 1.195.0 → 1.196.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tellescope/react-components",
-  "version": "1.195.0",
+  "version": "1.196.0",
   "description": "",
   "main": "./lib/cjs/index.js",
   "module": "./lib/esm/index.js",
@@ -47,13 +47,13 @@
     "@reduxjs/toolkit": "^1.6.2",
     "@stripe/react-stripe-js": "^2.9.0",
     "@stripe/stripe-js": "^1.52.1",
-    "@tellescope/constants": "^1.195.0",
-    "@tellescope/sdk": "^1.195.0",
-    "@tellescope/types-client": "^1.195.0",
-    "@tellescope/types-models": "^1.195.0",
-    "@tellescope/types-utilities": "^1.195.0",
-    "@tellescope/utilities": "^1.195.0",
-    "@tellescope/validation": "^1.195.0",
+    "@tellescope/constants": "^1.196.0",
+    "@tellescope/sdk": "^1.196.0",
+    "@tellescope/types-client": "^1.196.0",
+    "@tellescope/types-models": "^1.196.0",
+    "@tellescope/types-utilities": "^1.196.0",
+    "@tellescope/utilities": "^1.196.0",
+    "@tellescope/validation": "^1.196.0",
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
     "css-to-react-native": "^3.0.0",
@@ -84,7 +84,7 @@
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-native": "^0.65.0 || ^0.66.0 || ^0.67.0 || ^0.68.0 || ^0.71.0"
   },
-  "gitHead": "eb4dad9ab2bd06dd6993a6c0c55b9f0b61ee12b3",
+  "gitHead": "5775521d0ee6a92be5139fb0466772d40ab4d0af",
   "publishConfig": {
     "access": "public"
   }

package/src/Forms/inputs.tsx

@@ -3397,7 +3397,7 @@ export const ConditionsInput = ({ goToNextField, goToPreviousField, field, value
 }
 
 export const RichTextInput = ({ field, value, onChange }: FormInputProps<'Rich Text'>) => (
-  <WYSIWYG initialHTML={value} onChange={v => onChange(v, field.id)} style={{ width: '100%' }} editorStyle={{ width: '100%' }} />
+  <WYSIWYG stopEnterPropagation initialHTML={value} onChange={v => onChange(v, field.id)} style={{ width: '100%' }} editorStyle={{ width: '100%' }} />
 )
 
 export const ChargeebeeInput = ({ field, value, onChange, setCustomerId }: FormInputProps<'Chargebee'> & { 

package/src/Forms/wysiwyg.tsx

@@ -167,11 +167,12 @@ const getToolbar = ({ hideEmoji } : { hideEmoji?: boolean }) => ({
 
 
 
-export const WYSIWYG = ({ updateHtml, initialHTML: _initialHTML='', autoFocus, onChange, style, editorStyle, hideEmoji } : { 
+export const WYSIWYG = ({ stopEnterPropagation, updateHtml, initialHTML: _initialHTML='', autoFocus, onChange, style, editorStyle, hideEmoji } : { 
   initialHTML?: string, onChange: (html: string) => void, autoFocus?: boolean,
   editorStyle?: React.CSSProperties,
   hideEmoji?: boolean,
   updateHtml?: string,
+  stopEnterPropagation?: boolean,
 } & Styled) => {
   const trimmed = _initialHTML.trim()
   const initialHTML = (
@@ -228,6 +229,12 @@ export const WYSIWYG = ({ updateHtml, initialHTML: _initialHTML='', autoFocus, o
         editorClassName="demo-editor"
         onEditorStateChange={setEditorState}
         toolbar={toolbar} 
+        handleReturn={e => {
+          if (stopEnterPropagation) {
+            e.stopPropagation()
+          }
+          return false // not handled (allow editor to update)
+        }}
       />
     </Paper>
   )  

package/src/table.tsx

@@ -499,6 +499,7 @@ export interface PaginationOptions<T> {
   pageSize?: number;
   initialPage?: number;
   pageMemoryId?: string,
+  showLoadAll?: boolean,
 }
 export interface PaginationProps<T> extends PaginationOptions<T> {
   items: T[];
@@ -568,6 +569,7 @@ export const usePagination = <T,>({ paginated=true, items, pageMemoryId, pageSiz
 
 export interface TableFooterProps <T> extends Styled, HorizontalPadded, Partial<LoadMoreFunctions<T>>, ReturnType<typeof usePagination> {
   loadMoreOptions?: LoadMoreOptions<T>,
+  showLoadAll?: boolean,
 }
 export const TableFooter = <T,>({ horizontalPadding, style, previousDisabled, nextDisabled, selectedPage, numPages, goToNext, goToPrevious } : TableFooterProps<T>) => {
   return (
@@ -608,7 +610,7 @@ const resolve_middle_page_numbers = (selectedPage: number, numPages: number): [u
 }
 
 const FOOTER_BUTTON_SIZE = 30
-export const TableFooterNumbered = <T,>({ horizontalPadding, loadMore, loadMoreOptions, doneLoading, style, previousDisabled, nextDisabled, selectedPage, numPages, goToNext, goToPrevious, goToPage } : TableFooterProps<T>) => {
+export const TableFooterNumbered = <T,>({ showLoadAll, horizontalPadding, loadMore, loadMoreOptions, doneLoading, style, previousDisabled, nextDisabled, selectedPage, numPages, goToNext, goToPrevious, goToPage } : TableFooterProps<T>) => {
   const [middleLeft, middle, middleRight] = resolve_middle_page_numbers(selectedPage, numPages)
 
   const buttonProps = { 
@@ -679,6 +681,18 @@ export const TableFooterNumbered = <T,>({ horizontalPadding, loadMore, loadMoreO
           <NavigateNextIcon/>
         </Button>
 
+        {showLoadAll &&
+          <LoadingButton variant="outlined" submitText="Load All" submittingText="Loading..."
+            style={{ width: 175, height: 32, marginLeft: 5 }}
+            disabled={doneLoading?.()} 
+            onClick={async () => {
+              while (!doneLoading?.()) {
+                await loadMore?.(loadMoreOptions)
+              }
+            }} 
+          />
+        }
+
 
         <Typography style={{ fontSize: 12, marginLeft: 'auto' }}>
           Page {selectedPage + 1} of {numPages}
@@ -1145,7 +1159,7 @@ export const Table = <T extends Item>({
       } />
 
       {paginated && FooterComponent && items.length > 0 && // avoid displaying footer / unnecessary border when no items
-        <FooterComponent doneLoading={doneLoading} loadMore={loadMore} loadMoreOptions={loadMoreOptions} {...paginationProps } {...pageOptions} horizontalPadding={horizontalPadding}/>
+        <FooterComponent showLoadAll={pageOptions.showLoadAll} doneLoading={doneLoading} loadMore={loadMore} loadMoreOptions={loadMoreOptions} {...paginationProps } {...pageOptions} horizontalPadding={horizontalPadding}/>
       }
     </Flex>
   )