autoql-fe-utils 1.0.21 → 1.0.22

package/dist/index.mjs

@@ -1017,20 +1017,6 @@ var require_lodash = __commonJS({
   }
 });
 
-// src/HelperFns/stringHelpers.ts
-var capitalizeFirstChar = (string) => {
-  let capitalized = string;
-  try {
-    capitalized = string.charAt(0).toUpperCase() + string.slice(1);
-  } catch (error) {
-    console.error(error);
-  }
-  return capitalized;
-};
-var isNumber = (str) => {
-  return /^\d+$/.test(str);
-};
-
 // src/dayjsWithPlugins.ts
 import dayjs from "dayjs";
 import advancedFormat from "dayjs/plugin/advancedFormat.js";
@@ -1069,6 +1055,26 @@ dayjs.extend(customParseFormat);
 })();
 var dayjsWithPlugins_default = dayjs;
 
+// src/HelperFns/stringHelpers.ts
+var capitalizeFirstChar = (string) => {
+  let capitalized = string;
+  try {
+    capitalized = string.charAt(0).toUpperCase() + string.slice(1);
+  } catch (error) {
+    console.error(error);
+  }
+  return capitalized;
+};
+var isNumber = (str) => {
+  return /^\d+$/.test(str);
+};
+var getTitleCase = (str) => {
+  if ((str == null ? void 0 : str.length) < 2) {
+    return str;
+  }
+  return str[0].toUpperCase() + str.substring(1);
+};
+
 // src/HelperFns/columnHelpers.ts
 import { v4 as uuid } from "uuid";
 import _cloneDeep from "lodash.clonedeep";
@@ -1109,11 +1115,19 @@ var ColumnTypes = /* @__PURE__ */ ((ColumnTypes2) => {
   ColumnTypes2["DATE_STRING"] = "DATE_STRING";
   return ColumnTypes2;
 })(ColumnTypes || {});
-var DataExplorerTypes = /* @__PURE__ */ ((DataExplorerTypes2) => {
-  DataExplorerTypes2["SUBJECT_TYPE"] = "subject";
-  DataExplorerTypes2["VL_TYPE"] = "VL";
-  return DataExplorerTypes2;
+var DataExplorerTypes = /* @__PURE__ */ ((DataExplorerTypes3) => {
+  DataExplorerTypes3["SUBJECT_TYPE"] = "SUBJECT";
+  DataExplorerTypes3["VL_TYPE"] = "VL";
+  DataExplorerTypes3["TEXT_TYPE"] = "TEXT";
+  return DataExplorerTypes3;
 })(DataExplorerTypes || {});
+var SampleQueryReplacementTypes = /* @__PURE__ */ ((SampleQueryReplacementTypes2) => {
+  SampleQueryReplacementTypes2["SAMPLE_QUERY_TEXT_TYPE"] = "TEXT";
+  SampleQueryReplacementTypes2["SAMPLE_QUERY_VL_TYPE"] = "VL";
+  SampleQueryReplacementTypes2["SAMPLE_QUERY_TIME_TYPE"] = "DUCKLING_TIME";
+  SampleQueryReplacementTypes2["SAMPLE_QUERY_AMOUNT_TYPE"] = "DUCKLING_AMOUNT";
+  return SampleQueryReplacementTypes2;
+})(SampleQueryReplacementTypes || {});
 var DisplayTypes = /* @__PURE__ */ ((DisplayTypes2) => {
   DisplayTypes2["TABLE"] = "table";
   DisplayTypes2["PIVOT_TABLE"] = "pivot_table";
@@ -1132,7 +1146,48 @@ var DisplayTypes = /* @__PURE__ */ ((DisplayTypes2) => {
   return DisplayTypes2;
 })(DisplayTypes || {});
 
-// src/Constants/types.ts
+// src/Classes/ColumnType.ts
+var ColumnType = class {
+  constructor({
+    type,
+    description,
+    continuous,
+    ordinal,
+    aggOptions,
+    aggregable,
+    isNumber: isNumber2,
+    icon,
+    unit
+  }) {
+    var _a, _b;
+    this.type = (_a = type != null ? type : description) != null ? _a : "";
+    this.description = (_b = description != null ? description : type) != null ? _b : "";
+    this.continuous = !!continuous;
+    this.ordinal = !!ordinal;
+    this.aggOptions = aggOptions != null ? aggOptions : aggregable ? Object.values(AggTypes) : [];
+    this.aggregable = !!this.aggOptions.length;
+    this.isNumber = !!isNumber2;
+    this.icon = icon;
+    this.unit = this.isNumber ? unit != null ? unit : "none" : void 0;
+  }
+};
+
+// src/Classes/Column.ts
+var { DOLLAR_AMT, QUANTITY, PERCENT, RATIO, STRING, DATE, DATE_STRING } = ColumnTypes;
+var Column = class {
+  constructor(options) {
+    Object.assign(this, options);
+    this.isNumberType = [DOLLAR_AMT, QUANTITY, PERCENT, RATIO].includes(this.type);
+    this.isStringType = [STRING, DATE, DATE_STRING].includes(this.type);
+    this.isDateType = [STRING, DATE].includes(this.type);
+    this.title = this.display_name;
+    if (this.drilldownGroupby) {
+      this.title = `${this.title} <em>(Clicked: "${this.drilldownGroupby.value}")</em>`;
+    }
+  }
+};
+
+// src/Classes/AggType.ts
 var AggType = class {
   constructor({ type, displayName, tooltip, unit, supportsStrings = false, symbol: symbol2, fn = () => {
   } }) {
@@ -1146,35 +1201,73 @@ var AggType = class {
   }
 };
 
+// src/Classes/DataExplorerSubject.ts
+function isSubject(obj) {
+  return obj.query !== void 0;
+}
+function isValueLabel(obj) {
+  return obj.canonical !== void 0;
+}
+function isPlainText(obj) {
+  return obj.type === "TEXT" /* TEXT_TYPE */;
+}
+var DataExplorerSubject = class {
+  constructor(obj) {
+    if (isSubject(obj)) {
+      const { display_name, name, query } = obj;
+      this.id = name;
+      this.type = "SUBJECT" /* SUBJECT_TYPE */;
+      this.query = query;
+      this.formattedType = "Topic";
+      this.displayName = display_name;
+      this.context = name;
+    } else if (isValueLabel(obj)) {
+      const { canonical, keyword, show_message, format_txt } = obj;
+      this.id = canonical;
+      this.type = "VL" /* VL_TYPE */;
+      this.displayName = format_txt != null ? format_txt : keyword;
+      this.formattedType = show_message;
+      this.valueLabel = obj;
+    } else if (isPlainText(obj)) {
+      const { displayName, type } = obj;
+      this.id = displayName;
+      this.type = type;
+      this.text = displayName;
+      this.displayName = displayName;
+    }
+    this.isSubject = () => isSubject(obj);
+    this.isValueLabel = () => isValueLabel(obj);
+    this.isPlainText = () => isPlainText(obj);
+  }
+};
+
 // src/Constants/visualizationConstants.ts
-var TABLE_TYPES = [
-  "pivot_table",
-  "pivot_column",
-  "date_pivot",
-  "table",
-  "compare_table",
-  "compare_table_budget"
-];
+var TABLE_TYPES = ["pivot_table" /* PIVOT_TABLE */, "table" /* TABLE */];
 var CHART_TYPES = [
-  "bar",
-  "bubble",
-  "chart",
-  "column",
-  "heatmap",
-  "line",
-  "pie",
-  "stacked_bar",
-  "stacked_column",
-  "stacked_line",
-  "column_line",
-  "histogram",
-  "scatterplot"
+  "bar" /* BAR */,
+  "bubble" /* BUBBLE */,
+  "column" /* COLUMN */,
+  "heatmap" /* HEATMAP */,
+  "line" /* LINE */,
+  "pie" /* PIE */,
+  "stacked_bar" /* STACKED_BAR */,
+  "stacked_column" /* STACKED_COLUMN */,
+  "stacked_line" /* STACKED_LINE */,
+  "column_line" /* COLUMN_LINE */,
+  "histogram" /* HISTOGRAM */,
+  "scatterplot" /* SCATTERPLOT */
 ];
-var CHARTS_WITHOUT_LEGENDS = ["pie", "heatmap", "bubble", "scatterplot", "histogram"];
-var CHARTS_WITHOUT_AGGREGATED_DATA = ["histogram", "scatterplot"];
-var DATE_ONLY_CHART_TYPES = ["line", "stacked_line"];
-var DOUBLE_AXIS_CHART_TYPES = ["column_line"];
-var CHARTS_WITHOUT_AXES = ["pie"];
+var CHARTS_WITHOUT_LEGENDS = [
+  "pie" /* PIE */,
+  "heatmap" /* HEATMAP */,
+  "bubble" /* BUBBLE */,
+  "scatterplot" /* SCATTERPLOT */,
+  "histogram" /* HISTOGRAM */
+];
+var CHARTS_WITHOUT_AGGREGATED_DATA = ["histogram" /* HISTOGRAM */, "scatterplot" /* SCATTERPLOT */];
+var DATE_ONLY_CHART_TYPES = ["line" /* LINE */, "stacked_line" /* STACKED_LINE */];
+var DOUBLE_AXIS_CHART_TYPES = ["column_line" /* COLUMN_LINE */];
+var CHARTS_WITHOUT_AXES = ["pie" /* PIE */];
 var DEFAULT_CHART_CONFIG = {
   isScaled: false
 };
@@ -1205,17 +1298,6 @@ var DAYJS_PRECISION_FORMATS = {
   DATE_HOUR: "ll h:00A",
   DATE_MINUTE: "ll h:mmA"
 };
-var PRECISION_TYPES = {
-  DAY: "DAY",
-  MONTH: "MONTH",
-  YEAR: "YEAR",
-  WEEK: "WEEK",
-  QUARTER: "QUARTER",
-  DATE_HOUR: "DATE_HOUR",
-  DATE_MINUTE: "DATE_MINUTE",
-  HOUR: "HOUR",
-  MINUTE: "MINUTE"
-};
 var MAX_LEGEND_LABELS = 22;
 var MIN_HISTOGRAM_SAMPLE = 20;
 var DEFAULT_AGG_TYPE = "SUM" /* SUM */;
@@ -1285,6 +1367,124 @@ var AGG_TYPES = {
   //   tooltip: 'The variance will be shown for all data points with the same label.',
   // }),
 };
+var DISPLAY_TYPES = {
+  TABLE: {
+    type: "table" /* TABLE */,
+    isTableType: true
+  },
+  PIVOT_TABLE: {
+    type: "pivot_table" /* PIVOT_TABLE */,
+    isTableType: true
+  },
+  BAR: {
+    type: "bar" /* BAR */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    datesOnly: false,
+    multiAxis: false
+  },
+  COLUMN: {
+    type: "column" /* COLUMN */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    datesOnly: false,
+    multiAxis: false
+  },
+  LINE: {
+    type: "line" /* LINE */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    datesOnly: true,
+    multiAxis: false
+  },
+  STACKED_COLUMN: {
+    type: "stacked_column" /* STACKED_COLUMN */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  STACKED_BAR: {
+    type: "stacked_bar" /* STACKED_BAR */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  STACKED_LINE: {
+    type: "stacked_line" /* STACKED_LINE */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  BUBBLE: {
+    type: "bubble" /* BUBBLE */,
+    isChartType: true,
+    allowLegend: false,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  HEATMAP: {
+    type: "heatmap" /* HEATMAP */,
+    isChartType: true,
+    allowLegend: false,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  PIE: {
+    type: "pie" /* PIE */,
+    isChartType: true,
+    allowLegend: false,
+    allowAgg: true,
+    hasAxes: false,
+    dateOnly: false,
+    multiAxis: false
+  },
+  HISTOGRAM: {
+    type: "histogram" /* HISTOGRAM */,
+    isChartType: true,
+    allowLegend: false,
+    allowAgg: false,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  SCATTERPLOT: {
+    type: "scatterplot" /* SCATTERPLOT */,
+    isChartType: true,
+    allowLegend: false,
+    allowAgg: false,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: false
+  },
+  COLUMN_LINE: {
+    type: "column_line" /* COLUMN_LINE */,
+    isChartType: true,
+    allowLegend: true,
+    allowAgg: true,
+    hasAxes: true,
+    dateOnly: false,
+    multiAxis: true
+  }
+};
 
 // src/HelperFns/arrayHelpers.ts
 import isEqual from "lodash.isequal";
@@ -2084,47 +2284,6 @@ var EVALUATION_FREQUENCY_OPTIONS = {
   }
 };
 
-// src/Classes/ColumnType.ts
-var ColumnType = class {
-  constructor({
-    type,
-    description,
-    continuous,
-    ordinal,
-    aggOptions,
-    aggregable,
-    isNumber: isNumber2,
-    icon,
-    unit
-  }) {
-    var _a, _b;
-    this.type = (_a = type != null ? type : description) != null ? _a : "";
-    this.description = (_b = description != null ? description : type) != null ? _b : "";
-    this.continuous = !!continuous;
-    this.ordinal = !!ordinal;
-    this.aggOptions = aggOptions != null ? aggOptions : aggregable ? Object.values(AggTypes) : [];
-    this.aggregable = !!this.aggOptions.length;
-    this.isNumber = !!isNumber2;
-    this.icon = icon;
-    this.unit = this.isNumber ? unit != null ? unit : "none" : void 0;
-  }
-};
-
-// src/Classes/Column.ts
-var { DOLLAR_AMT, QUANTITY, PERCENT, RATIO, STRING, DATE, DATE_STRING } = ColumnTypes;
-var Column2 = class {
-  constructor(options) {
-    Object.assign(this, options);
-    this.isNumberType = [DOLLAR_AMT, QUANTITY, PERCENT, RATIO].includes(this.type);
-    this.isStringType = [STRING, DATE, DATE_STRING].includes(this.type);
-    this.isDateType = [STRING, DATE].includes(this.type);
-    this.title = this.display_name;
-    if (this.drilldownGroupby) {
-      this.title = `${this.title} <em>(Clicked: "${this.drilldownGroupby.value}")</em>`;
-    }
-  }
-};
-
 // src/Constants/columnConstants.ts
 var COLUMN_TYPES = {
   DOLLAR_AMT: new ColumnType({
@@ -3128,7 +3287,7 @@ var isColumnIndexConfigValid = ({ response, columnIndexConfig, columns, displayT
       console.debug("Table config invalid: Some of the string columns were hidden.");
       return false;
     }
-    if (displayType === "column_line" || displayType === "scatterplot") {
+    if (displayType === "column_line" /* COLUMN_LINE */ || displayType === "scatterplot" /* SCATTERPLOT */) {
       if (!isColumnIndexValid(columnIndexConfig.numberColumnIndex, columns) || !isColumnIndexValid(columnIndexConfig.numberColumnIndex2, columns) || columnIndexConfig.numberColumnIndex === columnIndexConfig.numberColumnIndex2) {
         console.debug(
           `Two unique number column indices were not found. This is required for display type: ${displayType}`,
@@ -3785,13 +3944,23 @@ var formatChartLabel = ({
         formattedLabel = formatDateStringType(d, col, config);
         break;
       }
+      case "RATIO" /* RATIO */: {
+        const dNumber = parseFloat(`${d}`);
+        if (!isNaN(dNumber)) {
+          formattedLabel = new Intl.NumberFormat(languageCode, {
+            minimumFractionDigits,
+            maximumFractionDigits
+          }).format(dNumber);
+        }
+        break;
+      }
       case "PERCENT" /* PERCENT */: {
         if (Number(d) || Number(d) === 0) {
           const p = Number(d) / 100;
           formattedLabel = new Intl.NumberFormat(languageCode, {
             style: "percent",
-            minimumFractionDigits: 1,
-            maximumFractionDigits: 1
+            minimumFractionDigits,
+            maximumFractionDigits
           }).format(p);
         }
         break;
@@ -4149,6 +4318,7 @@ var LIGHT_THEME = {
   "table-border-color": "#EFEFEF",
   "hover-color": "#F6F7F9",
   "text-color-primary": "#343434",
+  "text-color-secondary": "#8b8b8b",
   "text-color-accent": "#FFFFFF",
   "text-color-placeholder": "#0000004D",
   "dashboard-title-color": "#28A8E0",
@@ -4183,6 +4353,7 @@ var DARK_THEME = {
   "border-color": "#53565c",
   "hover-color": "#4a4f56",
   "text-color-primary": "#ececec",
+  "text-color-secondary": "#bababa",
   "text-color-accent": "#ffffff",
   "text-color-placeholder": "#ffffff6e",
   "dashboard-title-color": "#193a48",
@@ -4215,6 +4386,7 @@ var defaultThemeConfig = {
   accentColor: "#26A7E9",
   fontFamily: "sans-serif",
   textColor: void 0,
+  textColorSecondary: void 0,
   accentTextColor: void 0,
   dashboardTitleColor: void 0,
   backgroundColorPrimary: void 0,
@@ -4226,7 +4398,7 @@ var getThemeConfig = (customThemeConfig = {}) => {
     ...customThemeConfig
   };
 };
-var getYIQFromHex = (hex) => {
+var getRBGFromHex = (hex) => {
   let color2 = hex;
   if (color2.slice(0, 1) === "#") {
     color2 = color2.slice(1);
@@ -4237,6 +4409,10 @@ var getYIQFromHex = (hex) => {
   const r = parseInt(color2.substr(0, 2), 16);
   const g = parseInt(color2.substr(2, 2), 16);
   const b = parseInt(color2.substr(4, 2), 16);
+  return { r, g, b };
+};
+var getYIQFromHex = (hex) => {
+  const { r, g, b } = getRBGFromHex(hex);
   const yiq = (r * 299 + g * 587 + b * 114) / 1e3;
   return yiq;
 };
@@ -4324,11 +4500,11 @@ var setChartColors = (providedChartColors, themeStyles) => {
   }
   chartColors.forEach((color2, i) => {
     themeStyles[`chart-color-${i}`] = color2;
-    const darkerColor = lightenDarkenColor(color2, -10);
+    const darkerColor = lightenDarkenColor(color2, -50);
     themeStyles[`chart-color-dark-${i}`] = darkerColor;
   });
 };
-var configureTheme = (customThemeConfig = {}) => {
+var configureTheme = (customThemeConfig = {}, prefix = "react-autoql") => {
   const {
     theme,
     textColor,
@@ -4336,6 +4512,7 @@ var configureTheme = (customThemeConfig = {}) => {
     chartColors,
     accentColor,
     accentTextColor,
+    textColorSecondary,
     dashboardTitleColor,
     backgroundColorPrimary,
     backgroundColorSecondary
@@ -4344,6 +4521,9 @@ var configureTheme = (customThemeConfig = {}) => {
   if (textColor) {
     themeStyles["text-color-primary"] = textColor;
   }
+  if (textColorSecondary) {
+    themeStyles["text-color-secondary"] = textColorSecondary;
+  }
   if (accentTextColor) {
     themeStyles["text-color-accent"] = accentTextColor;
   } else {
@@ -4364,7 +4544,15 @@ var configureTheme = (customThemeConfig = {}) => {
   }
   setChartColors(chartColors, themeStyles);
   for (const property in themeStyles) {
-    document.documentElement.style.setProperty(`--react-autoql-${property}`, themeStyles[property]);
+    document.documentElement.style.setProperty(`--${prefix}-${property}`, themeStyles[property]);
+  }
+  try {
+    const { r, g, b } = getRBGFromHex(themeStyles["accent-color"]);
+    document.documentElement.style.setProperty(`--${prefix}-accent-color-R`, `${r}`);
+    document.documentElement.style.setProperty(`--${prefix}-accent-color-G`, `${g}`);
+    document.documentElement.style.setProperty(`--${prefix}-accent-color-B`, `${b}`);
+  } catch (error) {
+    console.error(error);
   }
 };
 
@@ -4787,7 +4975,7 @@ var generateDatePivotData = ({ rows, columns, tableConfig, dataFormatting } = {}
       headerFilter: false,
       headerFilterPlaceholder: "filter..."
     };
-    const firstPivotColumn = new Column2({
+    const firstPivotColumn = new Column({
       ...pivotMonthColumn,
       formatter: (cell) => formatElement({
         element: cell.getValue(),
@@ -4798,7 +4986,7 @@ var generateDatePivotData = ({ rows, columns, tableConfig, dataFormatting } = {}
     });
     const pivotTableColumns = [firstPivotColumn];
     Object.keys(uniqueYears).forEach((year, i) => {
-      const pivotColumn = new Column2({
+      const pivotColumn = new Column({
         ...columns[numberColumnIndex],
         origColumn: columns[numberColumnIndex],
         origValues: {},
@@ -4877,6 +5065,22 @@ var generateFilterDrilldownResponse = ({ response, rows, index, value }) => {
     console.error(error);
   }
 };
+var uuidv4 = () => {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    var r = Math.random() * 16 | 0, v = c == "x" ? r : r & 3 | 8;
+    return v.toString(16);
+  });
+};
+var parseJwt = (token) => {
+  var base64Url = token.split(".")[1];
+  var base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
+  var jsonPayload = decodeURIComponent(
+    window.atob(base64).split("").map(function(c) {
+      return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2);
+    }).join("")
+  );
+  return JSON.parse(jsonPayload);
+};
 
 // src/HelperFns/tableHelpers.ts
 var formatTableParams = (params, columns) => {
@@ -7484,7 +7688,7 @@ var transformQueryResponseColumns = (response) => {
   }
   const transformedColumns = columns.map((col, i) => {
     const drilldownGroupby = getDrilldownGroupby(response, col);
-    return new Column2({
+    return new Column({
       ...col,
       field: `${i}`,
       index: i,
@@ -8119,53 +8323,125 @@ var reportProblem = ({
     return Promise.reject((_a = error == null ? void 0 : error.response) == null ? void 0 : _a.data);
   });
 };
-var fetchSubjectList = ({ domain, apiKey, token }) => {
-  if (!token || !domain || !apiKey) {
-    return Promise.reject(new Error("Unauthenticated"));
+
+// src/Api/dataExplorerService.ts
+var getSampleQueryRegex = (suggestionValues) => {
+  const valueArray = Object.keys(suggestionValues);
+  const valueRegexArray = valueArray.map((value) => `(${value})`);
+  const valueRegex = new RegExp(valueRegexArray.join("|"), "gm");
+  return valueRegex;
+};
+var getSampleQueryText = (query, values) => {
+  try {
+    const valueArray = Object.keys(values);
+    let queryText = query;
+    valueArray.forEach((valueKey) => {
+      var _a;
+      const valueRegex = new RegExp(`${valueKey}`, "gm");
+      if (values[valueKey]) {
+        queryText = query.replace(valueRegex, (_a = values[valueKey]) == null ? void 0 : _a.value);
+      }
+    });
+    return queryText;
+  } catch (error) {
+    console.error(error);
+    return void 0;
   }
-  const url = `${domain}/autoql/api/v1/query/subjects?key=${apiKey}`;
-  const config = {
-    headers: {
-      Authorization: `Bearer ${token}`
-    }
-  };
-  return axios.get(url, config).then((response) => Promise.resolve(response)).catch((error) => {
+};
+var transformSuggestionResponse = (suggestions) => {
+  const newSuggestions = [];
+  suggestions.forEach((suggestion) => {
+    const initialQuery = suggestion.query;
+    const initialValues = transformSampleQueryValues(suggestion.values);
+    const chunked = getSampleQueryChunk(suggestion.query, initialValues);
+    const queryText = getSampleQueryText(suggestion.query, initialValues);
+    const newSuggestion = {
+      initialQuery,
+      initialValues,
+      chunked,
+      queryText
+    };
+    newSuggestions.push(newSuggestion);
+  });
+  return newSuggestions;
+};
+var transformSampleQueryValues = (originalValues) => {
+  const newValues = {};
+  Object.keys(originalValues).forEach((key) => {
     var _a;
-    return Promise.reject((_a = error == null ? void 0 : error.response) == null ? void 0 : _a.data);
+    newValues[key] = {
+      replacement: originalValues[key],
+      value: (_a = originalValues[key]) == null ? void 0 : _a.format_txt,
+      type: getSampleQueryReplacementType(key, originalValues[key])
+    };
   });
+  return newValues;
+};
+var getSampleQueryReplacementType = (key, replacement) => {
+  if (!replacement) {
+    return "TEXT" /* SAMPLE_QUERY_TEXT_TYPE */;
+  } else if (key === "DUCKLING_TIME") {
+    return "DUCKLING_TIME" /* SAMPLE_QUERY_TIME_TYPE */;
+  } else if (key === "DUCKLING_AMOUNT") {
+    return "DUCKLING_AMOUNT" /* SAMPLE_QUERY_AMOUNT_TYPE */;
+  } else if (replacement == null ? void 0 : replacement.canonical) {
+    return "VL" /* SAMPLE_QUERY_VL_TYPE */;
+  } else {
+    console.warn("There was a sample query replacement item but we didnt recognize its type: ", replacement);
+    return;
+  }
 };
-var fetchDataPreview = ({
-  subject,
-  domain,
-  apiKey,
-  token,
-  source = DEFAULT_SOURCE,
-  numRows = 10,
-  cancelToken
-} = {}) => {
-  if (!subject) {
-    return Promise.reject(new Error("No subject supplied for data preview"));
+var getSampleQueryChunk = (query, values) => {
+  const valueArray = Object.keys(values);
+  const valueRegexArray = valueArray.map((value) => `(${value})`);
+  const valueRegex = new RegExp(valueRegexArray.join("|"), "gm");
+  const splitStrArray = query.split(valueRegex);
+  const chunkedSuggestion = splitStrArray.map((key) => {
+    var _a;
+    const replacement = (_a = values[key]) == null ? void 0 : _a.replacement;
+    const type = getSampleQueryReplacementType(key, replacement);
+    if (type == "DUCKLING_TIME" /* SAMPLE_QUERY_TIME_TYPE */) {
+      return {
+        type: "TEXT" /* SAMPLE_QUERY_TEXT_TYPE */,
+        value: replacement == null ? void 0 : replacement.format_txt
+      };
+    } else if (type == "DUCKLING_AMOUNT" /* SAMPLE_QUERY_AMOUNT_TYPE */) {
+      return {
+        type: "DUCKLING_AMOUNT" /* SAMPLE_QUERY_AMOUNT_TYPE */,
+        value: replacement == null ? void 0 : replacement.format_txt,
+        name: key,
+        replacement
+      };
+    } else if (type == "VL" /* SAMPLE_QUERY_VL_TYPE */) {
+      return {
+        type: "VL" /* SAMPLE_QUERY_VL_TYPE */,
+        value: replacement == null ? void 0 : replacement.format_txt,
+        name: key,
+        replacement
+      };
+    } else if (type == "TEXT" /* SAMPLE_QUERY_TEXT_TYPE */) {
+      return {
+        type: "TEXT" /* SAMPLE_QUERY_TEXT_TYPE */,
+        value: key
+      };
+    }
+  });
+  return chunkedSuggestion;
+};
+var transformDataExplorerAutocompleteResponse = (response) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  let vlMatches = [];
+  if ((_d = (_c = (_b = (_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data) == null ? void 0 : _b.suggestions) == null ? void 0 : _c.value_labels) == null ? void 0 : _d.length) {
+    const vlMatchesTrimmed = response.data.data.suggestions.value_labels.slice(0, 10);
+    vlMatches = vlMatchesTrimmed.map((vl) => new DataExplorerSubject(vl));
   }
-  if (!token || !domain || !apiKey) {
-    return Promise.reject(new Error("Unauthenticated"));
+  let subjectMatches = [];
+  if ((_h = (_g = (_f = (_e = response == null ? void 0 : response.data) == null ? void 0 : _e.data) == null ? void 0 : _f.suggestions) == null ? void 0 : _g.subjects) == null ? void 0 : _h.length) {
+    subjectMatches = response.data.data.suggestions.subjects.map((subject) => new DataExplorerSubject(subject));
   }
-  const url = `${domain}/autoql/api/v1/query/preview?key=${apiKey}`;
-  const config = {
-    headers: {
-      Authorization: `Bearer ${token}`
-    },
-    cancelToken
-  };
-  const data = {
-    subject,
-    page_size: numRows,
-    source,
-    date_format: "ISO8601"
-  };
-  return axios.post(url, data, config).then((response) => Promise.resolve(response)).catch((error) => Promise.reject(error));
+  const allMatches = [...subjectMatches, ...vlMatches];
+  return Promise.resolve(allMatches);
 };
-
-// src/Api/dataExplorerService.ts
 var fetchDataExplorerAutocomplete = ({
   suggestion,
   domain,
@@ -8187,29 +8463,7 @@ var fetchDataExplorerAutocomplete = ({
     cancelToken
   };
   return axios2.get(url, config).then((response) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
-    let vlMatches = [];
-    if ((_d = (_c = (_b = (_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data) == null ? void 0 : _b.suggestions) == null ? void 0 : _c.value_labels) == null ? void 0 : _d.length) {
-      const vlMatchesTrimmed = response.data.data.suggestions.value_labels.slice(0, 10);
-      vlMatches = vlMatchesTrimmed.map((vl) => {
-        return {
-          ...vl,
-          display_name: `${vl.keyword} (${vl.show_message})`,
-          type: "VL" /* VL_TYPE */
-        };
-      });
-    }
-    let subjectMatches = [];
-    if ((_h = (_g = (_f = (_e = response == null ? void 0 : response.data) == null ? void 0 : _e.data) == null ? void 0 : _f.suggestions) == null ? void 0 : _g.subjects) == null ? void 0 : _h.length) {
-      subjectMatches = response.data.data.suggestions.subjects.map((subject) => {
-        return {
-          ...subject,
-          type: "subject" /* SUBJECT_TYPE */
-        };
-      });
-    }
-    const allMatches = [...subjectMatches, ...vlMatches];
-    return Promise.resolve(allMatches);
+    return transformDataExplorerAutocompleteResponse(response);
   }).catch((error) => {
     var _a;
     if ((error == null ? void 0 : error.message) === REQUEST_CANCELLED_ERROR) {
@@ -8227,6 +8481,109 @@ var transformVLForDataExplorerSuggestions = (vl) => {
     canonical: vl.canonical
   };
 };
+var fetchDataExplorerSuggestionsV2 = async ({
+  pageSize,
+  pageNumber,
+  domain,
+  apiKey,
+  token,
+  text,
+  context,
+  selectedVL,
+  userVLSelection = [],
+  skipQueryValidation,
+  columns
+} = {}) => {
+  var _a, _b, _c;
+  if (!skipQueryValidation && text) {
+    const queryValidationResponse = await runQueryValidation({
+      text,
+      domain,
+      apiKey,
+      token
+    });
+    if (((_c = (_b = (_a = queryValidationResponse == null ? void 0 : queryValidationResponse.data) == null ? void 0 : _a.data) == null ? void 0 : _b.replacements) == null ? void 0 : _c.length) > 0) {
+      return Promise.resolve(queryValidationResponse);
+    }
+  }
+  const exploreQueriesUrl = `${domain}/autoql/api/v1/query/query-builder?key=${apiKey}`;
+  const config = {
+    headers: {
+      Authorization: `Bearer ${token}`
+    }
+  };
+  let vlInfo = [];
+  if (selectedVL) {
+    vlInfo.push(transformVLForDataExplorerSuggestions(selectedVL));
+  }
+  if (userVLSelection) {
+    const transformedVLs = userVLSelection.map((vl) => transformVLForDataExplorerSuggestions(vl));
+    vlInfo = [...vlInfo, ...transformedVLs];
+  }
+  const data = {
+    page: pageNumber,
+    page_size: pageSize,
+    search_terms: text,
+    context,
+    value_label_info: vlInfo
+  };
+  const suggestionsMock = [
+    {
+      query: "total units sold above DUCKLING_AMOUNT",
+      values: {
+        DUCKLING_AMOUNT: {
+          canonical: "DUCKLING_AMOUNT",
+          format_txt: "100",
+          keyword: "100",
+          display_name: "100"
+        }
+      }
+    },
+    {
+      query: "total sales DUCKLING_TIME",
+      values: {
+        DUCKLING_TIME: {
+          canonical: "DUCKLING_TIME",
+          format_txt: "last year",
+          keyword: "last year",
+          display_name: "last year"
+        }
+      }
+    },
+    {
+      query: "all sales for PUBLIC_0_CUSTOMER_DIMENSION_0_CUSTOMER_NAME_VALUE_LABEL",
+      values: {
+        PUBLIC_0_CUSTOMER_DIMENSION_0_CUSTOMER_NAME_VALUE_LABEL: {
+          show_message: "PUBLIC_0_CUSTOMER_DIMENSION_0_CUSTOMER_NAME_VALUE_LABEL",
+          keyword: "Jack . Li",
+          format_txt: "Jack . Li",
+          canonical: "PUBLIC_0_CUSTOMER_DIMENSION_0_CUSTOMER_NAME_VALUE_LABEL"
+        }
+      }
+    }
+  ];
+  const promise = new Promise((res, rej) => {
+    setTimeout(() => {
+      var _a2, _b2;
+      try {
+        const testResponse = {
+          data: {
+            data: {
+              suggestions: suggestionsMock
+            }
+          }
+        };
+        const suggestions = transformSuggestionResponse((_b2 = (_a2 = testResponse == null ? void 0 : testResponse.data) == null ? void 0 : _a2.data) == null ? void 0 : _b2.suggestions);
+        testResponse.data.data.suggestions = suggestions;
+        res(testResponse);
+      } catch (error) {
+        console.error(error);
+        rej(error);
+      }
+    }, 500);
+  });
+  return promise;
+};
 var fetchDataExplorerSuggestions = async ({
   pageSize,
   pageNumber,
@@ -8243,7 +8600,7 @@ var fetchDataExplorerSuggestions = async ({
   if (!token || !domain || !apiKey) {
     return Promise.reject(new Error("Unauthenticated"));
   }
-  if (!skipQueryValidation) {
+  if (!skipQueryValidation && text) {
     const queryValidationResponse = await runQueryValidation({
       text,
       domain,
@@ -8280,6 +8637,62 @@ var fetchDataExplorerSuggestions = async ({
     return Promise.reject((_a2 = error == null ? void 0 : error.response) == null ? void 0 : _a2.data);
   });
 };
+var fetchSubjectList = ({ domain, apiKey, token }) => {
+  if (!token || !domain || !apiKey) {
+    return Promise.reject(new Error("Unauthenticated"));
+  }
+  const url = `${domain}/autoql/api/v1/query/subjects?key=${apiKey}`;
+  const config = {
+    headers: {
+      Authorization: `Bearer ${token}`
+    }
+  };
+  return axios2.get(url, config).then((response) => {
+    var _a, _b;
+    let subjectList = [];
+    if ((_b = (_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data) == null ? void 0 : _b.subjects) {
+      subjectList = response.data.data.subjects.map((subject) => new DataExplorerSubject(subject)).sort((a, b) => {
+        const aName = a.displayName;
+        const bName = b.displayName;
+        aName.localeCompare(bName);
+      });
+    }
+    return Promise.resolve(subjectList);
+  }).catch((error) => {
+    var _a;
+    return Promise.reject((_a = error == null ? void 0 : error.response) == null ? void 0 : _a.data);
+  });
+};
+var fetchDataPreview = ({
+  subject,
+  domain,
+  apiKey,
+  token,
+  source = DEFAULT_SOURCE,
+  numRows = 10,
+  cancelToken
+} = {}) => {
+  if (!subject) {
+    return Promise.reject(new Error("No subject supplied for data preview"));
+  }
+  if (!token || !domain || !apiKey) {
+    return Promise.reject(new Error("Unauthenticated"));
+  }
+  const url = `${domain}/autoql/api/v1/query/preview?key=${apiKey}`;
+  const config = {
+    headers: {
+      Authorization: `Bearer ${token}`
+    },
+    cancelToken
+  };
+  const data = {
+    subject,
+    page_size: numRows,
+    source,
+    date_format: "ISO8601"
+  };
+  return axios2.post(url, data, config).then((response) => Promise.resolve(response)).catch((error) => Promise.reject(error));
+};
 
 // src/Api/notificationService.ts
 import axios3 from "axios";
@@ -8296,10 +8709,18 @@ var fetchNotificationData = ({ id, domain, apiKey, token }) => {
   return axiosInstance.get(url).then((response) => {
     var _a, _b;
     const queryResult = (_b = (_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data) == null ? void 0 : _b.query_result;
-    if (queryResult) {
+    let hasQueryResult = false;
+    for (let key in queryResult) {
+      if (queryResult.hasOwnProperty(key)) {
+        hasQueryResult = true;
+        break;
+      }
+    }
+    if (hasQueryResult) {
       return Promise.resolve({ data: queryResult });
+    } else {
+      return Promise.reject({ response: { data: { message: GENERAL_ERROR, hasQueryResult } } });
     }
-    return Promise.reject({ response: { data: { message: GENERAL_ERROR } } });
   }).catch((error) => {
     var _a;
     return Promise.reject({ data: (_a = error == null ? void 0 : error.response) == null ? void 0 : _a.data });
@@ -9407,7 +9828,7 @@ export {
   COMPARE_TYPE,
   CONTINUOUS_TYPE,
   CUSTOM_TYPE,
-  Column2 as ColumnObj,
+  Column as ColumnObj,
   ColumnType,
   ColumnTypes,
   DATA_ALERT_CONDITION_TYPES,
@@ -9427,8 +9848,10 @@ export {
   DEFAULT_LEGEND_PADDING_TOP,
   DEFAULT_MAX_LEGEND_WIDTH,
   DEFAULT_SOURCE,
+  DISPLAY_TYPES,
   DOUBLE_AXIS_CHART_TYPES,
   DOW_STYLES,
+  DataExplorerSubject,
   DataExplorerTypes,
   DateUTC,
   DisplayTypes,
@@ -9457,7 +9880,6 @@ export {
   NUMBER_TERM_TYPE,
   PATH_SMOOTHING,
   PERIODIC_TYPE,
-  PRECISION_TYPES,
   PROJECT_TYPE,
   PrecisionTypes,
   QUERY_TERM_TYPE,
@@ -9467,6 +9889,7 @@ export {
   SCHEDULE_FREQUENCY_OPTIONS,
   SCHEDULE_INTERVAL_OPTIONS,
   SEASON_NAMES,
+  SampleQueryReplacementTypes,
   TABLE_TYPES,
   TITLE_FONT_SIZE,
   ThemeType,
@@ -9506,6 +9929,7 @@ export {
   dataStructureChanged,
   dateSortFn,
   dateStringSortFn,
+  dayjsWithPlugins_default as dayjs,
   deepEqual,
   deleteDataAlert,
   deleteNotification,
@@ -9519,6 +9943,7 @@ export {
   fetchDataAlerts,
   fetchDataExplorerAutocomplete,
   fetchDataExplorerSuggestions,
+  fetchDataExplorerSuggestionsV2,
   fetchDataPreview,
   fetchExploreQueries,
   fetchFilters,
@@ -9644,6 +10069,8 @@ export {
   getRangeForAxis,
   getRowNumberListForPopover,
   getSVGBase64,
+  getSampleQueryRegex,
+  getSampleQueryText,
   getScheduleFrequencyObject,
   getStartAndEndDateFromDateStrs,
   getStringColumnIndices,
@@ -9659,6 +10086,7 @@ export {
   getTimeRangeFromDateArray,
   getTimeRangeFromRT,
   getTimeScale,
+  getTitleCase,
   getTooltipContent,
   getTotalBottomPadding,
   getTotalHorizontalPadding,
@@ -9714,6 +10142,7 @@ export {
   onTableCellClick,
   onlySeriesVisibilityChanged,
   onlyUnique,
+  parseJwt,
   potentiallySupportsDatePivot,
   potentiallySupportsPivot,
   removeElementAtIndex,
@@ -9764,6 +10193,7 @@ export {
   updateDataAlert,
   updateDataAlertStatus,
   usePivotDataForChart,
+  uuidv4,
   validateExpression
 };
 //# sourceMappingURL=index.mjs.map