@redsift/table 9.3.2 → 9.3.3

package/index.d.ts

@@ -85,16 +85,24 @@ type StyledDataGridProps = {
 
 declare const DataGrid: Comp<DataGridProps, HTMLDivElement>;
 
+interface CompletionResponseItem {
+    columnField: string;
+    operatorValue: string;
+    value?: string;
+}
 type CompletionResponse = {
     linkOperator: 'and' | 'or';
-    items: [
-        {
-            columnField: string;
-            operatorValue: string;
-            value?: string;
-        }
-    ];
+    items: CompletionResponseItem[];
 };
+interface LocaleText {
+    textLabel?: string;
+    textPlaceholder?: string;
+    buttonAriaLabel?: string;
+    buttonText?: string;
+    powerText?: string;
+    powerTooltipContent?: string;
+    errorText?: string;
+}
 interface FilterConfig {
     columns: object[];
     typeOperators: object;
@@ -105,6 +113,11 @@ interface FilterConfig {
 interface GridToolbarFilterSemanticFieldProps extends ComponentProps<'form'> {
     nlpFilterConfig: FilterConfig;
     onFilterModelChange: (filterModel: GridFilterModel) => void;
+    dateFormat?: string;
+    defaultModel?: string;
+    defaultFilter?: CompletionResponse;
+    disablePower?: boolean;
+    localeText?: LocaleText;
 }
 
 declare const DEFAULT_OPERATORS: {
@@ -120,6 +133,7 @@ declare const GridToolbarFilterSemanticField: Comp<GridToolbarFilterSemanticFiel
 
 type GridToolbarColumnsProps = Omit<typeof GridToolbarColumnsButton, 'ref'>;
 type GridToolbarDensityProps = Omit<typeof GridToolbarDensitySelector, 'ref'>;
+type GridToolbarFilterSemanticProps = Omit<GridToolbarFilterSemanticFieldProps, 'ref'>;
 interface ToolbarProps {
     /** Props to forward to the column button. */
     columnsButtonProps?: GridToolbarColumnsProps;
@@ -146,8 +160,8 @@ interface ToolbarProps {
     /** Whether the filter button is displayed or not. */
     hasFilterButton?: boolean;
     /** Configuration object for NLP filter. undefined if disabled. */
-    nlpFilterConfig?: FilterConfig;
     onFilterModelChange?: (filterModel: GridFilterModel) => void;
+    semanticFilterProps?: GridToolbarFilterSemanticProps;
 }
 
 /**

package/index.js

@@ -21462,7 +21462,7 @@ const StyledTooltipContent = styled$3.div`
 
 const COMPONENT_NAME$5 = 'TooltipContent';
 const CLASSNAME$5 = 'redsift-tooltip-content';
-const DEFAULT_PROPS$3 = {};
+const DEFAULT_PROPS$4 = {};
 
 /**
  * The TooltipContent component.
@@ -21524,12 +21524,12 @@ const TooltipContent = /*#__PURE__*/forwardRef((props, ref) => {
   }, children)));
 });
 TooltipContent.className = CLASSNAME$5;
-TooltipContent.defaultProps = DEFAULT_PROPS$3;
+TooltipContent.defaultProps = DEFAULT_PROPS$4;
 TooltipContent.displayName = COMPONENT_NAME$5;
 
 const COMPONENT_NAME$4 = 'TooltipTrigger';
 const CLASSNAME$4 = 'redsift-tooltip-trigger';
-const DEFAULT_PROPS$2 = {};
+const DEFAULT_PROPS$3 = {};
 
 /**
  * The TooltipTrigger component.
@@ -21560,7 +21560,7 @@ const TooltipTrigger = /*#__PURE__*/forwardRef((props, ref) => {
   }, getReferenceProps(props)), children);
 });
 TooltipTrigger.className = CLASSNAME$4;
-TooltipTrigger.defaultProps = DEFAULT_PROPS$2;
+TooltipTrigger.defaultProps = DEFAULT_PROPS$3;
 TooltipTrigger.displayName = COMPONENT_NAME$4;
 
 function useTooltip(_ref) {
@@ -21626,7 +21626,7 @@ function useTooltip(_ref) {
 
 const COMPONENT_NAME$3 = 'Tooltip';
 const CLASSNAME$3 = 'redsift-tooltip';
-const DEFAULT_PROPS$1 = {
+const DEFAULT_PROPS$2 = {
   delay: 500,
   placement: TooltipPlacement.top
 };
@@ -21658,7 +21658,7 @@ const BaseTooltip = props => {
   }, trigger, content);
 };
 BaseTooltip.className = CLASSNAME$3;
-BaseTooltip.defaultProps = DEFAULT_PROPS$1;
+BaseTooltip.defaultProps = DEFAULT_PROPS$2;
 BaseTooltip.displayName = COMPONENT_NAME$3;
 const Tooltip = Object.assign(BaseTooltip, {
   Trigger: TooltipTrigger,
@@ -21689,13 +21689,26 @@ const StyledGridToolbarFilterSemanticField = styled$3.form`
   }
 `;
 
-const _excluded$e = ["className", "nlpFilterConfig", "onFilterModelChange"];
+const _excluded$e = ["className", "nlpFilterConfig", "onFilterModelChange", "dateFormat", "defaultModel", "defaultFilter", "disablePower", "localeText"];
 const COMPONENT_NAME$2 = 'GridToolbarFilterSemanticField';
 const CLASSNAME$2 = 'redsift-datagrid-toolbar-nlp-filter-field';
-const DATE_FORMAT = 'yyyy-mm-dd';
-const DEFAULT_GPT_MODEL = 'gpt-4-0613';
-const DEFAULT_FILTER = {
-  items: []
+const DEFAULT_PROPS$1 = {
+  dateFormat: 'yyyy-mm-dd',
+  defaultModel: 'gpt-4-0613',
+  defaultFilter: {
+    items: [],
+    linkOperator: 'and'
+  },
+  disablePower: false,
+  localeText: {
+    textLabel: 'Semantic filtering',
+    textPlaceholder: 'Describe here how you would like to filter this datagrid.',
+    buttonAriaLabel: 'Submit',
+    buttonText: 'Run',
+    powerText: 'Power mode',
+    powerTooltipContent: 'The Power mode can get better results but is slower.',
+    errorText: 'Unable to find a valid filter, please try again with a more specific prompt.'
+  }
 };
 const DEFAULT_OPERATORS = {
   string: ['contains', 'equals', 'startsWith', 'endsWith', 'isEmpty', 'isNotEmpty', 'isAnyOf'],
@@ -21703,7 +21716,7 @@ const DEFAULT_OPERATORS = {
   boolean: ['is'],
   date: ['is', 'not', 'after', 'onOrAfter', 'before', 'onOrBefore', 'isEmpty', 'isNotEmpty']
 };
-const getRole = config => {
+const getRole = (config, dateFormat) => {
   const today = new Date().toDateString();
   const columns = `[${config.columns.map(_ref => {
     let {
@@ -21733,7 +21746,7 @@ The AI assistant extracts information from the user input and generates a JSON o
     - this can be skipped if the "operatorValue" is either "isEmpty" or "isNotEmpty"
     - a list of multiple values if the "operatorValue" ends with "AnyOf"
     - otherwise, it's a single value represented as a string: "true" instead of true, "false" instead of false, "0.6" instead of 0.6.
-    For "date" data type, use ${DATE_FORMAT}. If relative date is input, convert to the actual date given today is ${today}.
+    For "date" data type, use ${dateFormat}. If relative date is input, convert to the actual date given today is ${today}.
   - "operatorValue": the comparison operator, accepted values depend on the data type of the column
 ${operators}
 
@@ -21750,9 +21763,9 @@ Return just the JSON object without any extra text, explanation or note.
 If the user input can't be parsed, return a JSON object to indicate the error and the reason {"code":"error", "reason":"explain why it was failed to parse"}.
 `;
 };
-async function getOpenAICompletion(config, prompt, model) {
+async function getOpenAICompletion(config, prompt, model, dateFormat) {
   const text = 'Parse the text delimited by triple backticks: ```' + prompt.trim() + '``` and make sure the output is a valid JSON object';
-  const role = getRole(config);
+  const role = getRole(config, dateFormat);
   const completion = await getCompletion(text, role, config.openaiApiKey, model);
   const response = JSON.parse(completion);
   if ('code' in response) {
@@ -21769,11 +21782,25 @@ const GridToolbarFilterSemanticField = /*#__PURE__*/forwardRef((props, ref) => {
   const {
       className,
       nlpFilterConfig,
-      onFilterModelChange
+      onFilterModelChange,
+      dateFormat = DEFAULT_PROPS$1.dateFormat,
+      defaultModel = DEFAULT_PROPS$1.defaultModel,
+      defaultFilter = DEFAULT_PROPS$1.defaultFilter,
+      disablePower = DEFAULT_PROPS$1.disablePower,
+      localeText
     } = props,
     forwardedProps = _objectWithoutProperties(props, _excluded$e);
+  const {
+    textLabel,
+    textPlaceholder,
+    buttonAriaLabel,
+    buttonText,
+    powerText,
+    powerTooltipContent,
+    errorText
+  } = _objectSpread2(_objectSpread2({}, DEFAULT_PROPS$1.localeText), localeText);
   const [prompt, setPrompt] = useState('');
-  const modelRef = useRef(DEFAULT_GPT_MODEL);
+  const modelRef = useRef(defaultModel);
   const showErrorRef = useRef(false);
   const [isLoading, setIsLoading] = useState(false);
   const handlePromptSubmit = async event => {
@@ -21784,7 +21811,7 @@ const GridToolbarFilterSemanticField = /*#__PURE__*/forwardRef((props, ref) => {
       // Use the cache if it's available and it's not the default filter.
       // We still want to rerun default filter because it might be due to request fail.
       const response = sessionStorage.getItem(prompt);
-      if (response && response !== JSON.stringify(DEFAULT_FILTER)) {
+      if (response && response !== JSON.stringify(defaultFilter)) {
         filter = JSON.parse(response);
       } else {
         setIsLoading(true);
@@ -21793,12 +21820,12 @@ const GridToolbarFilterSemanticField = /*#__PURE__*/forwardRef((props, ref) => {
           if (nlpFilterConfig.completionFunc !== undefined) {
             filter = await nlpFilterConfig.completionFunc(nlpFilterConfig, prompt, modelRef.current);
           } else {
-            filter = await getOpenAICompletion(nlpFilterConfig, prompt, modelRef.current);
+            filter = await getOpenAICompletion(nlpFilterConfig, prompt, modelRef.current, dateFormat);
           }
           sessionStorage.setItem(prompt, JSON.stringify(filter));
         } catch (error) {
           showErrorRef.current = true;
-          filter = DEFAULT_FILTER;
+          filter = defaultFilter;
         }
 
         // MUI requires different id
@@ -21821,25 +21848,26 @@ const GridToolbarFilterSemanticField = /*#__PURE__*/forwardRef((props, ref) => {
     width: "100%"
   }, /*#__PURE__*/React__default.createElement(TextField$2, {
     width: "100%",
-    label: "Semantic filtering",
-    placeholder: "Describe here how you would like to filter this datagrid.",
+    label: textLabel,
+    placeholder: textPlaceholder,
     onChange: value => setPrompt(value),
     value: prompt
   }), /*#__PURE__*/React__default.createElement(Button, {
     variant: "primary",
-    "aria-label": "Submit",
+    "aira-label": buttonAriaLabel,
     type: "submit",
     isLoading: isLoading
-  }, "Run")), /*#__PURE__*/React__default.createElement(Tooltip, null, /*#__PURE__*/React__default.createElement(Tooltip.Trigger, null, /*#__PURE__*/React__default.createElement(Switch, {
+  }, buttonText)), !disablePower && /*#__PURE__*/React__default.createElement(Tooltip, null, /*#__PURE__*/React__default.createElement(Tooltip.Trigger, null, /*#__PURE__*/React__default.createElement(Switch, {
     width: "175px",
     isSelected: modelRef.current === 'gpt-4-0613',
     onChange: value => modelRef.current = value ? 'gpt-4-0613' : 'gpt-3.5-turbo-0613'
-  }, "Power mode")), /*#__PURE__*/React__default.createElement(Tooltip.Content, null, "The Power mode can get better results but is slower."))), showErrorRef.current && /*#__PURE__*/React__default.createElement(Text, {
+  }, powerText)), /*#__PURE__*/React__default.createElement(Tooltip.Content, null, powerTooltipContent))), showErrorRef.current && /*#__PURE__*/React__default.createElement(Text, {
     color: "error",
     marginLeft: "8px"
-  }, "Unable to find a valid filter, please try again with a more specific prompt."));
+  }, errorText));
 });
 GridToolbarFilterSemanticField.className = CLASSNAME$2;
+GridToolbarFilterSemanticField.defaultProps = DEFAULT_PROPS$1;
 GridToolbarFilterSemanticField.displayName = COMPONENT_NAME$2;
 
 /**
@@ -21863,9 +21891,12 @@ const Toolbar$2 = props => {
     hasDensityButton = true,
     densityButtonProps,
     densityButtonRef,
-    nlpFilterConfig = undefined,
-    onFilterModelChange
+    onFilterModelChange,
+    semanticFilterProps = undefined
   } = props;
+  if (semanticFilterProps && onFilterModelChange) {
+    semanticFilterProps.onFilterModelChange = onFilterModelChange;
+  }
   return /*#__PURE__*/React__default.createElement(GridToolbarWrapper, null, /*#__PURE__*/React__default.createElement(GridToolbarContainer, null, /*#__PURE__*/React__default.createElement(Flexbox, {
     gap: "0"
   }, hasFilterButton ? /*#__PURE__*/React__default.createElement(GridToolbarFilterButton, _extends$2({}, filterButtonProps, {
@@ -21896,10 +21927,7 @@ const Toolbar$2 = props => {
     className: filterButtonProps !== null && filterButtonProps !== void 0 && filterButtonProps.className ? `${filterButtonProps === null || filterButtonProps === void 0 ? void 0 : filterButtonProps.className} redsift-condensed` : 'redsift-condensed'
   })) : null), /*#__PURE__*/React__default.createElement(Flexbox, {
     flexGrow: 3
-  }, nlpFilterConfig && onFilterModelChange ? /*#__PURE__*/React__default.createElement(GridToolbarFilterSemanticField, {
-    nlpFilterConfig: nlpFilterConfig,
-    onFilterModelChange: onFilterModelChange
-  }) : null)));
+  }, semanticFilterProps ? /*#__PURE__*/React__default.createElement(GridToolbarFilterSemanticField, semanticFilterProps) : null)));
 };
 
 const _excluded$d = ["displayName"];