@grafana/sql 0.0.0 → 13.0.0-23483592685

package/dist/cjs/components/visual-query-builder/Preview.cjs

@@ -0,0 +1,55 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var css = require('@emotion/css');
+var reactUse = require('react-use');
+var i18n = require('@grafana/i18n');
+var runtime = require('@grafana/runtime');
+var ui = require('@grafana/ui');
+var formatSQL = require('../../utils/formatSQL.cjs');
+
+"use strict";
+function Preview({ rawSql, datasourceType }) {
+  const [_, copyToClipboard] = reactUse.useCopyToClipboard();
+  const styles = ui.useStyles2(getStyles);
+  const copyPreview = (rawSql2) => {
+    copyToClipboard(rawSql2);
+    runtime.reportInteraction("grafana_sql_preview_copied", {
+      datasource: datasourceType
+    });
+  };
+  const labelElement = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.labelWrapper, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.label, children: /* @__PURE__ */ jsxRuntime.jsx(i18n.Trans, { i18nKey: "grafana-sql.components.preview.label-element.preview", children: "Preview" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.IconButton,
+      {
+        tooltip: i18n.t("grafana-sql.components.preview.label-element.tooltip-copy-to-clipboard", "Copy to clipboard"),
+        onClick: () => copyPreview(rawSql),
+        name: "copy"
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Field, { label: labelElement, className: styles.grow, children: /* @__PURE__ */ jsxRuntime.jsx(
+    ui.CodeEditor,
+    {
+      language: "sql",
+      height: 80,
+      value: formatSQL.formatSQL(rawSql),
+      monacoOptions: { scrollbar: { vertical: "hidden" }, scrollBeyondLastLine: false },
+      readOnly: true,
+      showMiniMap: false
+    }
+  ) });
+}
+function getStyles(theme) {
+  return {
+    grow: css.css({ flexGrow: 1 }),
+    label: css.css({ fontSize: 12, fontWeight: theme.typography.fontWeightMedium }),
+    labelWrapper: css.css({ display: "flex", justifyContent: "space-between", paddingBottom: theme.spacing(0.5) })
+  };
+}
+
+exports.Preview = Preview;
+//# sourceMappingURL=Preview.cjs.map

package/dist/cjs/components/visual-query-builder/Preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Preview.cjs","sources":["../../../../src/components/visual-query-builder/Preview.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useCopyToClipboard } from 'react-use';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Trans, t } from '@grafana/i18n';\nimport { reportInteraction } from '@grafana/runtime';\nimport { CodeEditor, Field, IconButton, useStyles2 } from '@grafana/ui';\n\nimport { formatSQL } from '../../utils/formatSQL';\n\ntype PreviewProps = {\n  rawSql: string;\n  datasourceType?: string;\n};\n\nexport function Preview({ rawSql, datasourceType }: PreviewProps) {\n  // TODO: use zero index to give feedback about copy success\n  const [_, copyToClipboard] = useCopyToClipboard();\n  const styles = useStyles2(getStyles);\n\n  const copyPreview = (rawSql: string) => {\n    copyToClipboard(rawSql);\n    reportInteraction('grafana_sql_preview_copied', {\n      datasource: datasourceType,\n    });\n  };\n\n  const labelElement = (\n    <div className={styles.labelWrapper}>\n      <span className={styles.label}>\n        <Trans i18nKey=\"grafana-sql.components.preview.label-element.preview\">Preview</Trans>\n      </span>\n      <IconButton\n        tooltip={t('grafana-sql.components.preview.label-element.tooltip-copy-to-clipboard', 'Copy to clipboard')}\n        onClick={() => copyPreview(rawSql)}\n        name=\"copy\"\n      />\n    </div>\n  );\n\n  return (\n    <Field label={labelElement} className={styles.grow}>\n      <CodeEditor\n        language=\"sql\"\n        height={80}\n        value={formatSQL(rawSql)}\n        monacoOptions={{ scrollbar: { vertical: 'hidden' }, scrollBeyondLastLine: false }}\n        readOnly={true}\n        showMiniMap={false}\n      />\n    </Field>\n  );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n  return {\n    grow: css({ flexGrow: 1 }),\n    label: css({ fontSize: 12, fontWeight: theme.typography.fontWeightMedium }),\n    labelWrapper: css({ display: 'flex', justifyContent: 'space-between', paddingBottom: theme.spacing(0.5) }),\n  };\n}\n"],"names":["useCopyToClipboard","useStyles2","rawSql","reportInteraction","jsxs","jsx","Trans","IconButton","t","Field","CodeEditor","formatSQL","css"],"mappings":";;;;;;;;;;;;;AAeO,SAAS,OAAA,CAAQ,EAAE,MAAA,EAAQ,cAAA,EAAe,EAAiB;AAEhE,EAAA,MAAM,CAAC,CAAA,EAAG,eAAe,CAAA,GAAIA,2BAAA,EAAmB;AAChD,EAAA,MAAM,MAAA,GAASC,cAAW,SAAS,CAAA;AAEnC,EAAA,MAAM,WAAA,GAAc,CAACC,OAAAA,KAAmB;AACtC,IAAA,eAAA,CAAgBA,OAAM,CAAA;AACtB,IAAAC,yBAAA,CAAkB,4BAAA,EAA8B;AAAA,MAC9C,UAAA,EAAY;AAAA,KACb,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,MAAM,YAAA,mBACJC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,YAAA,EACrB,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,MAAA,EAAA,EAAK,WAAW,MAAA,CAAO,KAAA,EACtB,yCAACC,UAAA,EAAA,EAAM,OAAA,EAAQ,sDAAA,EAAuD,QAAA,EAAA,SAAA,EAAO,CAAA,EAC/E,CAAA;AAAA,oBACAD,cAAA;AAAA,MAACE,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAASC,MAAA,CAAE,wEAAA,EAA0E,mBAAmB,CAAA;AAAA,QACxG,OAAA,EAAS,MAAM,WAAA,CAAY,MAAM,CAAA;AAAA,QACjC,IAAA,EAAK;AAAA;AAAA;AACP,GAAA,EACF,CAAA;AAGF,EAAA,sCACGC,QAAA,EAAA,EAAM,KAAA,EAAO,YAAA,EAAc,SAAA,EAAW,OAAO,IAAA,EAC5C,QAAA,kBAAAJ,cAAA;AAAA,IAACK,aAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAS,KAAA;AAAA,MACT,MAAA,EAAQ,EAAA;AAAA,MACR,KAAA,EAAOC,oBAAU,MAAM,CAAA;AAAA,MACvB,aAAA,EAAe,EAAE,SAAA,EAAW,EAAE,UAAU,QAAA,EAAS,EAAG,sBAAsB,KAAA,EAAM;AAAA,MAChF,QAAA,EAAU,IAAA;AAAA,MACV,WAAA,EAAa;AAAA;AAAA,GACf,EACF,CAAA;AAEJ;AAEA,SAAS,UAAU,KAAA,EAAsB;AACvC,EAAA,OAAO;AAAA,IACL,IAAA,EAAMC,OAAA,CAAI,EAAE,QAAA,EAAU,GAAG,CAAA;AAAA,IACzB,KAAA,EAAOA,QAAI,EAAE,QAAA,EAAU,IAAI,UAAA,EAAY,KAAA,CAAM,UAAA,CAAW,gBAAA,EAAkB,CAAA;AAAA,IAC1E,YAAA,EAAcA,OAAA,CAAI,EAAE,OAAA,EAAS,MAAA,EAAQ,cAAA,EAAgB,eAAA,EAAiB,aAAA,EAAe,KAAA,CAAM,OAAA,CAAQ,GAAG,CAAA,EAAG;AAAA,GAC3G;AACF;;;;"}

package/dist/cjs/components/visual-query-builder/SQLGroupByRow.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var getColumnsWithIndices = require('../../utils/getColumnsWithIndices.cjs');
+var useSqlChange = require('../../utils/useSqlChange.cjs');
+var GroupByRow = require('./GroupByRow.cjs');
+
+"use strict";
+function SQLGroupByRow({ fields, query, onQueryChange, db }) {
+  const { onSqlChange } = useSqlChange.useSqlChange({ query, onQueryChange, db });
+  let columnsWithIndices = getColumnsWithIndices.getColumnsWithIndices(query, fields);
+  return /* @__PURE__ */ jsxRuntime.jsx(GroupByRow.GroupByRow, { columns: columnsWithIndices, sql: query.sql, onSqlChange });
+}
+
+exports.SQLGroupByRow = SQLGroupByRow;
+//# sourceMappingURL=SQLGroupByRow.cjs.map

package/dist/cjs/components/visual-query-builder/SQLGroupByRow.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SQLGroupByRow.cjs","sources":["../../../../src/components/visual-query-builder/SQLGroupByRow.tsx"],"sourcesContent":["import { SelectableValue } from '@grafana/data';\n\nimport { QueryWithDefaults } from '../../defaults';\nimport { DB, SQLQuery } from '../../types';\nimport { getColumnsWithIndices } from '../../utils/getColumnsWithIndices';\nimport { useSqlChange } from '../../utils/useSqlChange';\n\nimport { GroupByRow } from './GroupByRow';\n\ninterface SQLGroupByRowProps {\n  fields: SelectableValue[];\n  query: QueryWithDefaults;\n  onQueryChange: (query: SQLQuery) => void;\n  db: DB;\n}\n\nexport function SQLGroupByRow({ fields, query, onQueryChange, db }: SQLGroupByRowProps) {\n  const { onSqlChange } = useSqlChange({ query, onQueryChange, db });\n  let columnsWithIndices: SelectableValue[] = getColumnsWithIndices(query, fields);\n  return <GroupByRow columns={columnsWithIndices} sql={query.sql!} onSqlChange={onSqlChange} />;\n}\n"],"names":["useSqlChange","getColumnsWithIndices","GroupByRow"],"mappings":";;;;;;;;;;AAgBO,SAAS,cAAc,EAAE,MAAA,EAAQ,KAAA,EAAO,aAAA,EAAe,IAAG,EAAuB;AACtF,EAAA,MAAM,EAAE,aAAY,GAAIA,yBAAA,CAAa,EAAE,KAAA,EAAO,aAAA,EAAe,IAAI,CAAA;AACjE,EAAA,IAAI,kBAAA,GAAwCC,2CAAA,CAAsB,KAAA,EAAO,MAAM,CAAA;AAC/E,EAAA,sCAAQC,qBAAA,EAAA,EAAW,OAAA,EAAS,oBAAoB,GAAA,EAAK,KAAA,CAAM,KAAM,WAAA,EAA0B,CAAA;AAC7F;;;;"}

package/dist/cjs/components/visual-query-builder/SQLOrderByRow.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var getColumnsWithIndices = require('../../utils/getColumnsWithIndices.cjs');
+var useSqlChange = require('../../utils/useSqlChange.cjs');
+var OrderByRow = require('./OrderByRow.cjs');
+
+"use strict";
+function SQLOrderByRow({ fields, query, onQueryChange, db }) {
+  const { onSqlChange } = useSqlChange.useSqlChange({ query, onQueryChange, db });
+  let columnsWithIndices = getColumnsWithIndices.getColumnsWithIndices(query, fields);
+  return /* @__PURE__ */ jsxRuntime.jsx(OrderByRow.OrderByRow, { sql: query.sql, onSqlChange, columns: columnsWithIndices });
+}
+
+exports.SQLOrderByRow = SQLOrderByRow;
+//# sourceMappingURL=SQLOrderByRow.cjs.map

package/dist/cjs/components/visual-query-builder/SQLOrderByRow.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SQLOrderByRow.cjs","sources":["../../../../src/components/visual-query-builder/SQLOrderByRow.tsx"],"sourcesContent":["import { SelectableValue } from '@grafana/data';\n\nimport { QueryWithDefaults } from '../../defaults';\nimport { DB, SQLQuery } from '../../types';\nimport { getColumnsWithIndices } from '../../utils/getColumnsWithIndices';\nimport { useSqlChange } from '../../utils/useSqlChange';\n\nimport { OrderByRow } from './OrderByRow';\n\ntype SQLOrderByRowProps = {\n  fields: SelectableValue[];\n  query: QueryWithDefaults;\n  onQueryChange: (query: SQLQuery) => void;\n  db: DB;\n};\n\nexport function SQLOrderByRow({ fields, query, onQueryChange, db }: SQLOrderByRowProps) {\n  const { onSqlChange } = useSqlChange({ query, onQueryChange, db });\n  let columnsWithIndices: SelectableValue[] = getColumnsWithIndices(query, fields);\n  return <OrderByRow sql={query.sql!} onSqlChange={onSqlChange} columns={columnsWithIndices} />;\n}\n"],"names":["useSqlChange","getColumnsWithIndices","OrderByRow"],"mappings":";;;;;;;;;;AAgBO,SAAS,cAAc,EAAE,MAAA,EAAQ,KAAA,EAAO,aAAA,EAAe,IAAG,EAAuB;AACtF,EAAA,MAAM,EAAE,aAAY,GAAIA,yBAAA,CAAa,EAAE,KAAA,EAAO,aAAA,EAAe,IAAI,CAAA;AACjE,EAAA,IAAI,kBAAA,GAAwCC,2CAAA,CAAsB,KAAA,EAAO,MAAM,CAAA;AAC/E,EAAA,sCAAQC,qBAAA,EAAA,EAAW,GAAA,EAAK,MAAM,GAAA,EAAM,WAAA,EAA0B,SAAS,kBAAA,EAAoB,CAAA;AAC7F;;;;"}

package/dist/cjs/components/visual-query-builder/SQLWhereRow.cjs

@@ -0,0 +1,56 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactUse = require('react-use');
+var runtime = require('@grafana/runtime');
+var useSqlChange = require('../../utils/useSqlChange.cjs');
+var WhereRow = require('./WhereRow.cjs');
+
+"use strict";
+function SQLWhereRow({ query, fields, onQueryChange, db }) {
+  const state = reactUse.useAsync(async () => {
+    return mapFieldsToTypes(fields);
+  }, [fields]);
+  const { onSqlChange } = useSqlChange.useSqlChange({ query, onQueryChange, db });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    WhereRow.WhereRow,
+    {
+      config: { fields: state.value || {} },
+      sql: query.sql,
+      onSqlChange: (val) => {
+        const templateVars = runtime.getTemplateSrv().getVariables();
+        removeQuotesForMultiVariables(val, templateVars);
+        onSqlChange(val);
+      }
+    },
+    JSON.stringify(state.value)
+  );
+}
+function mapFieldsToTypes(columns) {
+  const fields = {};
+  for (const col of columns) {
+    fields[col.value] = {
+      type: col.raqbFieldType || "text",
+      valueSources: ["value"],
+      mainWidgetProps: { customProps: { icon: col.icon } }
+    };
+  }
+  return fields;
+}
+function removeQuotesForMultiVariables(val, templateVars) {
+  var _a, _b;
+  const multiVariableInWhereString = (tv) => {
+    var _a2, _b2;
+    return "multi" in tv && tv.multi && (((_a2 = val.whereString) == null ? void 0 : _a2.includes(`\${${tv.name}}`)) || ((_b2 = val.whereString) == null ? void 0 : _b2.includes(`$${tv.name}`)));
+  };
+  if (templateVars.some((tv) => multiVariableInWhereString(tv))) {
+    val.whereString = (_a = val.whereString) == null ? void 0 : _a.replaceAll("')", ")");
+    val.whereString = (_b = val.whereString) == null ? void 0 : _b.replaceAll("('", "(");
+  }
+}
+
+exports.SQLWhereRow = SQLWhereRow;
+exports.removeQuotesForMultiVariables = removeQuotesForMultiVariables;
+//# sourceMappingURL=SQLWhereRow.cjs.map

package/dist/cjs/components/visual-query-builder/SQLWhereRow.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SQLWhereRow.cjs","sources":["../../../../src/components/visual-query-builder/SQLWhereRow.tsx"],"sourcesContent":["import { useAsync } from 'react-use';\n\nimport { SelectableValue, TypedVariableModel } from '@grafana/data';\nimport { getTemplateSrv } from '@grafana/runtime';\n\nimport { QueryWithDefaults } from '../../defaults';\nimport { DB, SQLExpression, SQLQuery, SQLSelectableValue } from '../../types';\nimport { useSqlChange } from '../../utils/useSqlChange';\n\nimport { Config } from './AwesomeQueryBuilder';\nimport { WhereRow } from './WhereRow';\n\ninterface WhereRowProps {\n  query: QueryWithDefaults;\n  fields: SelectableValue[];\n  onQueryChange: (query: SQLQuery) => void;\n  db: DB;\n}\n\nexport function SQLWhereRow({ query, fields, onQueryChange, db }: WhereRowProps) {\n  const state = useAsync(async () => {\n    return mapFieldsToTypes(fields);\n  }, [fields]);\n\n  const { onSqlChange } = useSqlChange({ query, onQueryChange, db });\n\n  return (\n    <WhereRow\n      // TODO: fix key that's used to force clean render or SQLWhereRow - otherwise it doesn't render operators correctly\n      key={JSON.stringify(state.value)}\n      config={{ fields: state.value || {} }}\n      sql={query.sql!}\n      onSqlChange={(val: SQLExpression) => {\n        const templateVars = getTemplateSrv().getVariables();\n\n        removeQuotesForMultiVariables(val, templateVars);\n\n        onSqlChange(val);\n      }}\n    />\n  );\n}\n\n// needed for awesome query builder\nfunction mapFieldsToTypes(columns: SQLSelectableValue[]) {\n  const fields: Config['fields'] = {};\n  for (const col of columns) {\n    fields[col.value] = {\n      type: col.raqbFieldType || 'text',\n      valueSources: ['value'],\n      mainWidgetProps: { customProps: { icon: col.icon } },\n    };\n  }\n  return fields;\n}\n\nexport function removeQuotesForMultiVariables(val: SQLExpression, templateVars: TypedVariableModel[]) {\n  const multiVariableInWhereString = (tv: TypedVariableModel) =>\n    'multi' in tv &&\n    tv.multi &&\n    (val.whereString?.includes(`\\${${tv.name}}`) || val.whereString?.includes(`$${tv.name}`));\n\n  if (templateVars.some((tv) => multiVariableInWhereString(tv))) {\n    val.whereString = val.whereString?.replaceAll(\"')\", ')');\n    val.whereString = val.whereString?.replaceAll(\"('\", '(');\n  }\n}\n"],"names":["useAsync","useSqlChange","jsx","WhereRow","getTemplateSrv","_a","_b"],"mappings":";;;;;;;;;;;AAmBO,SAAS,YAAY,EAAE,KAAA,EAAO,MAAA,EAAQ,aAAA,EAAe,IAAG,EAAkB;AAC/E,EAAA,MAAM,KAAA,GAAQA,kBAAS,YAAY;AACjC,IAAA,OAAO,iBAAiB,MAAM,CAAA;AAAA,EAChC,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,MAAM,EAAE,aAAY,GAAIC,yBAAA,CAAa,EAAE,KAAA,EAAO,aAAA,EAAe,IAAI,CAAA;AAEjE,EAAA,uBACEC,cAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MAGC,QAAQ,EAAE,MAAA,EAAQ,KAAA,CAAM,KAAA,IAAS,EAAC,EAAE;AAAA,MACpC,KAAK,KAAA,CAAM,GAAA;AAAA,MACX,WAAA,EAAa,CAAC,GAAA,KAAuB;AACnC,QAAA,MAAM,YAAA,GAAeC,sBAAA,EAAe,CAAE,YAAA,EAAa;AAEnD,QAAA,6BAAA,CAA8B,KAAK,YAAY,CAAA;AAE/C,QAAA,WAAA,CAAY,GAAG,CAAA;AAAA,MACjB;AAAA,KAAA;AAAA,IATK,IAAA,CAAK,SAAA,CAAU,KAAA,CAAM,KAAK;AAAA,GAUjC;AAEJ;AAGA,SAAS,iBAAiB,OAAA,EAA+B;AACvD,EAAA,MAAM,SAA2B,EAAC;AAClC,EAAA,KAAA,MAAW,OAAO,OAAA,EAAS;AACzB,IAAA,MAAA,CAAO,GAAA,CAAI,KAAK,CAAA,GAAI;AAAA,MAClB,IAAA,EAAM,IAAI,aAAA,IAAiB,MAAA;AAAA,MAC3B,YAAA,EAAc,CAAC,OAAO,CAAA;AAAA,MACtB,iBAAiB,EAAE,WAAA,EAAa,EAAE,IAAA,EAAM,GAAA,CAAI,MAAK;AAAE,KACrD;AAAA,EACF;AACA,EAAA,OAAO,MAAA;AACT;AAEO,SAAS,6BAAA,CAA8B,KAAoB,YAAA,EAAoC;AAxDtG,EAAA,IAAA,EAAA,EAAA,EAAA;AAyDE,EAAA,MAAM,0BAAA,GAA6B,CAAC,EAAA,KAAwB;AAzD9D,IAAA,IAAAC,GAAAA,EAAAC,GAAAA;AA0DI,IAAA,OAAA,OAAA,IAAW,EAAA,IACX,GAAG,KAAA,KAAA,CAAA,CACFD,GAAAA,GAAA,IAAI,WAAA,KAAJ,IAAA,GAAA,KAAA,CAAA,GAAAA,IAAiB,QAAA,CAAS,CAAA,GAAA,EAAM,GAAG,IAAI,CAAA,CAAA,CAAA,CAAA,MAAA,CAAQC,MAAA,GAAA,CAAI,WAAA,KAAJ,gBAAAA,GAAAA,CAAiB,QAAA,CAAS,CAAA,CAAA,EAAI,EAAA,CAAG,IAAI,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,EAAA,CAAA;AAEvF,EAAA,IAAI,aAAa,IAAA,CAAK,CAAC,OAAO,0BAAA,CAA2B,EAAE,CAAC,CAAA,EAAG;AAC7D,IAAA,GAAA,CAAI,WAAA,GAAA,CAAc,EAAA,GAAA,GAAA,CAAI,WAAA,KAAJ,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAiB,WAAW,IAAA,EAAM,GAAA,CAAA;AACpD,IAAA,GAAA,CAAI,WAAA,GAAA,CAAc,EAAA,GAAA,GAAA,CAAI,WAAA,KAAJ,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAiB,WAAW,IAAA,EAAM,GAAA,CAAA;AAAA,EACtD;AACF;;;;;"}

package/dist/cjs/components/visual-query-builder/SelectColumn.cjs

@@ -0,0 +1,30 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var e2eSelectors = require('@grafana/e2e-selectors');
+var i18n = require('@grafana/i18n');
+var pluginUi = require('@grafana/plugin-ui');
+var ui = require('@grafana/ui');
+
+"use strict";
+function SelectColumn({ columns, onParameterChange, value }) {
+  const selectInputId = react.useId();
+  return /* @__PURE__ */ jsxRuntime.jsx(pluginUi.EditorField, { label: i18n.t("grafana-sql.components.select-column.label-column", "Column"), width: 25, children: /* @__PURE__ */ jsxRuntime.jsx(
+    ui.Select,
+    {
+      value,
+      "data-testid": e2eSelectors.selectors.components.SQLQueryEditor.selectColumn,
+      inputId: selectInputId,
+      menuShouldPortal: true,
+      options: [{ label: "*", value: "*" }, ...columns],
+      allowCustomValue: true,
+      onChange: (s) => onParameterChange(s.value)
+    }
+  ) });
+}
+
+exports.SelectColumn = SelectColumn;
+//# sourceMappingURL=SelectColumn.cjs.map

package/dist/cjs/components/visual-query-builder/SelectColumn.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectColumn.cjs","sources":["../../../../src/components/visual-query-builder/SelectColumn.tsx"],"sourcesContent":["import { useId } from 'react';\n\nimport { SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { t } from '@grafana/i18n';\nimport { EditorField } from '@grafana/plugin-ui';\nimport { Select } from '@grafana/ui';\n\ninterface Props {\n  columns: Array<SelectableValue<string>>;\n  onParameterChange: (value?: string) => void;\n  value: SelectableValue<string> | null;\n}\n\nexport function SelectColumn({ columns, onParameterChange, value }: Props) {\n  const selectInputId = useId();\n\n  return (\n    <EditorField label={t('grafana-sql.components.select-column.label-column', 'Column')} width={25}>\n      <Select\n        value={value}\n        data-testid={selectors.components.SQLQueryEditor.selectColumn}\n        inputId={selectInputId}\n        menuShouldPortal\n        options={[{ label: '*', value: '*' }, ...columns]}\n        allowCustomValue\n        onChange={(s) => onParameterChange(s.value)}\n      />\n    </EditorField>\n  );\n}\n"],"names":["useId","jsx","EditorField","t","Select","selectors"],"mappings":";;;;;;;;;;;;AAcO,SAAS,YAAA,CAAa,EAAE,OAAA,EAAS,iBAAA,EAAmB,OAAM,EAAU;AACzE,EAAA,MAAM,gBAAgBA,WAAA,EAAM;AAE5B,EAAA,uBACEC,cAAA,CAACC,wBAAY,KAAA,EAAOC,MAAA,CAAE,qDAAqD,QAAQ,CAAA,EAAG,OAAO,EAAA,EAC3F,QAAA,kBAAAF,cAAA;AAAA,IAACG,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,aAAA,EAAaC,sBAAA,CAAU,UAAA,CAAW,cAAA,CAAe,YAAA;AAAA,MACjD,OAAA,EAAS,aAAA;AAAA,MACT,gBAAA,EAAgB,IAAA;AAAA,MAChB,OAAA,EAAS,CAAC,EAAE,KAAA,EAAO,KAAK,KAAA,EAAO,GAAA,EAAI,EAAG,GAAG,OAAO,CAAA;AAAA,MAChD,gBAAA,EAAgB,IAAA;AAAA,MAChB,QAAA,EAAU,CAAC,CAAA,KAAM,iBAAA,CAAkB,EAAE,KAAK;AAAA;AAAA,GAC5C,EACF,CAAA;AAEJ;;;;"}

package/dist/cjs/components/visual-query-builder/SelectCustomFunctionParameters.cjs

@@ -0,0 +1,135 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var css = require('@emotion/css');
+var react = require('react');
+var e2eSelectors = require('@grafana/e2e-selectors');
+var i18n = require('@grafana/i18n');
+var ui = require('@grafana/ui');
+var expressions = require('../../expressions.cjs');
+var sql_utils = require('../../utils/sql.utils.cjs');
+var SelectColumn = require('./SelectColumn.cjs');
+
+"use strict";
+function SelectCustomFunctionParameters({
+  columns,
+  query,
+  onSqlChange,
+  onParameterChange,
+  currentColumnIndex
+}) {
+  var _a, _b, _c;
+  const styles = ui.useStyles2(getStyles);
+  const macroOrFunction = (_b = (_a = query.sql) == null ? void 0 : _a.columns) == null ? void 0 : _b[currentColumnIndex];
+  const addParameter = react.useCallback(
+    (index) => {
+      var _a2, _b2, _c2, _d;
+      const item = (_b2 = (_a2 = query.sql) == null ? void 0 : _a2.columns) == null ? void 0 : _b2[index];
+      if (!item) {
+        return;
+      }
+      item.parameters = item.parameters ? [...item.parameters, { type: expressions.QueryEditorExpressionType.FunctionParameter, name: "" }] : [];
+      const newSql = {
+        ...query.sql,
+        columns: (_d = (_c2 = query.sql) == null ? void 0 : _c2.columns) == null ? void 0 : _d.map((c, i) => i === index ? item : c)
+      };
+      onSqlChange(newSql);
+    },
+    [onSqlChange, query.sql]
+  );
+  const removeParameter = react.useCallback(
+    (columnIndex, index) => {
+      var _a2, _b2, _c2, _d, _e;
+      const item = (_b2 = (_a2 = query.sql) == null ? void 0 : _a2.columns) == null ? void 0 : _b2[columnIndex];
+      if (!(item == null ? void 0 : item.parameters)) {
+        return;
+      }
+      item.parameters = (_c2 = item.parameters) == null ? void 0 : _c2.filter((_, i) => i !== index);
+      const newSql = {
+        ...query.sql,
+        columns: (_e = (_d = query.sql) == null ? void 0 : _d.columns) == null ? void 0 : _e.map((c, i) => i === columnIndex ? item : c)
+      };
+      onSqlChange(newSql);
+    },
+    [onSqlChange, query.sql]
+  );
+  function renderParameters(columnIndex) {
+    if (!(macroOrFunction == null ? void 0 : macroOrFunction.parameters) || macroOrFunction.parameters.length <= 1) {
+      return null;
+    }
+    const paramComponents = macroOrFunction.parameters.map((param, index) => {
+      if (index === 0) {
+        return null;
+      }
+      return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { gap: 2, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: "," }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            onChange: (e) => onParameterChange(index)(e.currentTarget.value),
+            value: param.name,
+            "aria-label": i18n.t(
+              "grafana-sql.components.select-custom-function-parameters.aria-label-parameter",
+              "Parameter {{index}} for column {{columnIndex}}",
+              { index, columnIndex }
+            ),
+            "data-testid": e2eSelectors.selectors.components.SQLQueryEditor.selectInputParameter,
+            addonAfter: /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                "aria-label": i18n.t(
+                  "grafana-sql.components.select-custom-function-parameters.render-parameters.params.title-remove-parameter",
+                  "Remove parameter"
+                ),
+                type: "button",
+                icon: "times",
+                variant: "secondary",
+                size: "md",
+                onClick: () => removeParameter(columnIndex, index)
+              }
+            )
+          }
+        )
+      ] }, index);
+    });
+    return paramComponents;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: "(" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      SelectColumn.SelectColumn,
+      {
+        columns,
+        onParameterChange: (s) => onParameterChange(0)(s),
+        value: sql_utils.getColumnValue((_c = macroOrFunction == null ? void 0 : macroOrFunction.parameters) == null ? void 0 : _c[0])
+      }
+    ),
+    renderParameters(currentColumnIndex),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Button,
+      {
+        type: "button",
+        onClick: () => addParameter(currentColumnIndex),
+        variant: "secondary",
+        size: "md",
+        icon: "plus",
+        "aria-label": i18n.t("grafana-sql.components.select-custom-function-parameters.title-add-parameter", "Add parameter")
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: ")" })
+  ] });
+}
+const getStyles = () => {
+  return {
+    label: css.css({
+      padding: 0,
+      margin: 0,
+      width: "unset"
+    })
+  };
+};
+
+exports.SelectCustomFunctionParameters = SelectCustomFunctionParameters;
+//# sourceMappingURL=SelectCustomFunctionParameters.cjs.map

package/dist/cjs/components/visual-query-builder/SelectCustomFunctionParameters.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectCustomFunctionParameters.cjs","sources":["../../../../src/components/visual-query-builder/SelectCustomFunctionParameters.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useCallback } from 'react';\n\nimport { SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { t } from '@grafana/i18n';\nimport { Button, InlineLabel, Input, Stack, useStyles2 } from '@grafana/ui';\n\nimport { QueryEditorExpressionType } from '../../expressions';\nimport { SQLExpression, SQLQuery } from '../../types';\nimport { getColumnValue } from '../../utils/sql.utils';\n\nimport { SelectColumn } from './SelectColumn';\n\ninterface Props {\n  columns: Array<SelectableValue<string>>;\n  query: SQLQuery;\n  onSqlChange: (sql: SQLExpression) => void;\n  onParameterChange: (index: number) => (value?: string) => void;\n  currentColumnIndex: number;\n}\n\nexport function SelectCustomFunctionParameters({\n  columns,\n  query,\n  onSqlChange,\n  onParameterChange,\n  currentColumnIndex,\n}: Props) {\n  const styles = useStyles2(getStyles);\n  const macroOrFunction = query.sql?.columns?.[currentColumnIndex];\n\n  const addParameter = useCallback(\n    (index: number) => {\n      const item = query.sql?.columns?.[index];\n      if (!item) {\n        return;\n      }\n\n      item.parameters = item.parameters\n        ? [...item.parameters, { type: QueryEditorExpressionType.FunctionParameter, name: '' }]\n        : [];\n\n      const newSql: SQLExpression = {\n        ...query.sql,\n        columns: query.sql?.columns?.map((c, i) => (i === index ? item : c)),\n      };\n\n      onSqlChange(newSql);\n    },\n    [onSqlChange, query.sql]\n  );\n\n  const removeParameter = useCallback(\n    (columnIndex: number, index: number) => {\n      const item = query.sql?.columns?.[columnIndex];\n      if (!item?.parameters) {\n        return;\n      }\n      item.parameters = item.parameters?.filter((_, i) => i !== index);\n\n      const newSql: SQLExpression = {\n        ...query.sql,\n        columns: query.sql?.columns?.map((c, i) => (i === columnIndex ? item : c)),\n      };\n\n      onSqlChange(newSql);\n    },\n    [onSqlChange, query.sql]\n  );\n\n  function renderParameters(columnIndex: number) {\n    if (!macroOrFunction?.parameters || macroOrFunction.parameters.length <= 1) {\n      return null;\n    }\n\n    const paramComponents = macroOrFunction.parameters.map((param, index) => {\n      // Skip the first parameter as it is the column name\n      if (index === 0) {\n        return null;\n      }\n\n      return (\n        <Stack key={index} gap={2}>\n          <InlineLabel className={styles.label}>,</InlineLabel>\n          <Input\n            onChange={(e) => onParameterChange(index)(e.currentTarget.value)}\n            value={param.name}\n            aria-label={t(\n              'grafana-sql.components.select-custom-function-parameters.aria-label-parameter',\n              'Parameter {{index}} for column {{columnIndex}}',\n              { index, columnIndex }\n            )}\n            data-testid={selectors.components.SQLQueryEditor.selectInputParameter}\n            addonAfter={\n              <Button\n                aria-label={t(\n                  'grafana-sql.components.select-custom-function-parameters.render-parameters.params.title-remove-parameter',\n                  'Remove parameter'\n                )}\n                type=\"button\"\n                icon=\"times\"\n                variant=\"secondary\"\n                size=\"md\"\n                onClick={() => removeParameter(columnIndex, index)}\n              />\n            }\n          />\n        </Stack>\n      );\n    });\n    return paramComponents;\n  }\n\n  return (\n    <>\n      <InlineLabel className={styles.label}>(</InlineLabel>\n      <SelectColumn\n        columns={columns}\n        onParameterChange={(s) => onParameterChange(0)(s)}\n        value={getColumnValue(macroOrFunction?.parameters?.[0])}\n      />\n      {renderParameters(currentColumnIndex)}\n      <Button\n        type=\"button\"\n        onClick={() => addParameter(currentColumnIndex)}\n        variant=\"secondary\"\n        size=\"md\"\n        icon=\"plus\"\n        aria-label={t('grafana-sql.components.select-custom-function-parameters.title-add-parameter', 'Add parameter')}\n      />\n      <InlineLabel className={styles.label}>)</InlineLabel>\n    </>\n  );\n}\n\nconst getStyles = () => {\n  return {\n    label: css({\n      padding: 0,\n      margin: 0,\n      width: 'unset',\n    }),\n  };\n};\n"],"names":["useStyles2","useCallback","_a","_b","_c","QueryEditorExpressionType","jsxs","Stack","jsx","InlineLabel","Input","t","selectors","Button","Fragment","SelectColumn","getColumnValue","css"],"mappings":"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"}

package/dist/cjs/components/visual-query-builder/SelectFunctionParameters.cjs

@@ -0,0 +1,142 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var css = require('@emotion/css');
+var react = require('react');
+var e2eSelectors = require('@grafana/e2e-selectors');
+var pluginUi = require('@grafana/plugin-ui');
+var ui = require('@grafana/ui');
+var expressions = require('../../expressions.cjs');
+var sql_utils = require('../../utils/sql.utils.cjs');
+var SelectColumn = require('./SelectColumn.cjs');
+var SelectCustomFunctionParameters = require('./SelectCustomFunctionParameters.cjs');
+
+"use strict";
+function SelectFunctionParameters({ query, onSqlChange, currentColumnIndex, db, columns }) {
+  var _a, _b, _c;
+  const selectInputId = react.useId();
+  const macroOrFunction = (_b = (_a = query.sql) == null ? void 0 : _a.columns) == null ? void 0 : _b[currentColumnIndex];
+  const styles = ui.useStyles2(getStyles);
+  const func = db.functions().find((f) => f.name === (macroOrFunction == null ? void 0 : macroOrFunction.name));
+  const [fieldsFromFunction, setFieldsFromFunction] = react.useState([]);
+  react.useEffect(() => {
+    const getFieldsFromFunction = async () => {
+      var _a2;
+      if (!func) {
+        return;
+      }
+      const options = [];
+      for (const param of (_a2 = func.parameters) != null ? _a2 : []) {
+        if (param.options) {
+          options.push(await param.options(query));
+        } else {
+          options.push([]);
+        }
+      }
+      setFieldsFromFunction(options);
+    };
+    getFieldsFromFunction();
+  }, [macroOrFunction == null ? void 0 : macroOrFunction.name]);
+  const onParameterChange = react.useCallback(
+    (index, keepIndex) => (s) => {
+      var _a2, _b2, _c2, _d, _e;
+      const item = (_b2 = (_a2 = query.sql) == null ? void 0 : _a2.columns) == null ? void 0 : _b2[currentColumnIndex];
+      if (!item) {
+        return;
+      }
+      if (!item.parameters) {
+        item.parameters = [];
+      }
+      if (item.parameters[index] === void 0) {
+        item.parameters[index] = { type: expressions.QueryEditorExpressionType.FunctionParameter, name: s };
+      } else if (s == null && keepIndex) {
+        item.parameters = item.parameters.map((p, i) => i === index ? { ...p, name: "" } : p);
+        if (((_c2 = item.parameters[item.parameters.length - 1]) == null ? void 0 : _c2.name) === "") {
+          item.parameters = item.parameters.filter((p) => p.name !== "");
+        }
+      } else if (s == null) {
+        item.parameters = item.parameters.filter((_, i) => i !== index);
+      } else {
+        item.parameters = item.parameters.map((p, i) => i === index ? { ...p, name: s } : p);
+      }
+      const newSql = {
+        ...query.sql,
+        columns: (_e = (_d = query.sql) == null ? void 0 : _d.columns) == null ? void 0 : _e.map((c, i) => i === currentColumnIndex ? item : c)
+      };
+      onSqlChange(newSql);
+    },
+    [currentColumnIndex, onSqlChange, query.sql]
+  );
+  function renderParametersWithFunctions() {
+    if (!(func == null ? void 0 : func.parameters)) {
+      return null;
+    }
+    return func == null ? void 0 : func.parameters.map((funcParam, index) => {
+      var _a2;
+      return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { alignItems: "flex-end", gap: 2, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(pluginUi.EditorField, { label: funcParam.name, width: 25, optional: !funcParam.required, children: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: funcParam.options ? /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Select,
+          {
+            value: sql_utils.getColumnValue(macroOrFunction == null ? void 0 : macroOrFunction.parameters[index]),
+            options: fieldsFromFunction == null ? void 0 : fieldsFromFunction[index],
+            "data-testid": e2eSelectors.selectors.components.SQLQueryEditor.selectFunctionParameter(funcParam.name),
+            inputId: selectInputId,
+            menuShouldPortal: true,
+            allowCustomValue: true,
+            isClearable: true,
+            onChange: (s) => onParameterChange(index, true)(s == null ? void 0 : s.value)
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            onChange: (e) => onParameterChange(index, true)(e.currentTarget.value),
+            value: (_a2 = macroOrFunction == null ? void 0 : macroOrFunction.parameters[index]) == null ? void 0 : _a2.name,
+            "data-testid": e2eSelectors.selectors.components.SQLQueryEditor.selectInputParameter
+          }
+        ) }) }),
+        func.parameters.length !== index + 1 && /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: "," })
+      ] }, index);
+    });
+  }
+  if ((macroOrFunction == null ? void 0 : macroOrFunction.name) === void 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      SelectColumn.SelectColumn,
+      {
+        columns,
+        onParameterChange: (s) => onParameterChange(0)(s),
+        value: sql_utils.getColumnValue((_c = macroOrFunction == null ? void 0 : macroOrFunction.parameters) == null ? void 0 : _c[0])
+      }
+    );
+  }
+  if (!func) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      SelectCustomFunctionParameters.SelectCustomFunctionParameters,
+      {
+        query,
+        onSqlChange,
+        currentColumnIndex,
+        columns,
+        onParameterChange
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: "(" }),
+    renderParametersWithFunctions(),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.InlineLabel, { className: styles.label, children: ")" })
+  ] });
+}
+const getStyles = () => {
+  return {
+    label: css.css({
+      padding: 0,
+      margin: 0,
+      width: "unset"
+    })
+  };
+};
+
+exports.SelectFunctionParameters = SelectFunctionParameters;
+//# sourceMappingURL=SelectFunctionParameters.cjs.map

package/dist/cjs/components/visual-query-builder/SelectFunctionParameters.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectFunctionParameters.cjs","sources":["../../../../src/components/visual-query-builder/SelectFunctionParameters.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useCallback, useEffect, useId, useState } from 'react';\n\nimport { SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { EditorField } from '@grafana/plugin-ui';\nimport { InlineLabel, Input, Select, Stack, useStyles2 } from '@grafana/ui';\n\nimport { QueryEditorExpressionType } from '../../expressions';\nimport { DB, SQLExpression, SQLQuery } from '../../types';\nimport { getColumnValue } from '../../utils/sql.utils';\n\nimport { SelectColumn } from './SelectColumn';\nimport { SelectCustomFunctionParameters } from './SelectCustomFunctionParameters';\n\ninterface Props {\n  query: SQLQuery;\n  onSqlChange: (sql: SQLExpression) => void;\n  currentColumnIndex: number;\n  db: DB;\n  columns: Array<SelectableValue<string>>;\n}\n\nexport function SelectFunctionParameters({ query, onSqlChange, currentColumnIndex, db, columns }: Props) {\n  const selectInputId = useId();\n  const macroOrFunction = query.sql?.columns?.[currentColumnIndex];\n  const styles = useStyles2(getStyles);\n  const func = db.functions().find((f) => f.name === macroOrFunction?.name);\n\n  const [fieldsFromFunction, setFieldsFromFunction] = useState<Array<Array<SelectableValue<string>>>>([]);\n\n  useEffect(() => {\n    const getFieldsFromFunction = async () => {\n      if (!func) {\n        return;\n      }\n      const options: Array<Array<SelectableValue<string>>> = [];\n      for (const param of func.parameters ?? []) {\n        if (param.options) {\n          options.push(await param.options(query));\n        } else {\n          options.push([]);\n        }\n      }\n      setFieldsFromFunction(options);\n    };\n    getFieldsFromFunction();\n\n    // It is fine to ignore the warning here and omit the query object\n    // only table property is used in the query object and whenever table changes the component is re-rendered\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [macroOrFunction?.name]);\n\n  const onParameterChange = useCallback(\n    (index: number, keepIndex?: boolean) => (s: string | undefined) => {\n      const item = query.sql?.columns?.[currentColumnIndex];\n      if (!item) {\n        return;\n      }\n      if (!item.parameters) {\n        item.parameters = [];\n      }\n      if (item.parameters[index] === undefined) {\n        item.parameters[index] = { type: QueryEditorExpressionType.FunctionParameter, name: s };\n      } else if (s == null && keepIndex) {\n        // Remove value from index\n        item.parameters = item.parameters.map((p, i) => (i === index ? { ...p, name: '' } : p));\n        // Remove the last empty parameter\n        if (item.parameters[item.parameters.length - 1]?.name === '') {\n          item.parameters = item.parameters.filter((p) => p.name !== '');\n        }\n      } else if (s == null) {\n        item.parameters = item.parameters.filter((_, i) => i !== index);\n      } else {\n        item.parameters = item.parameters.map((p, i) => (i === index ? { ...p, name: s } : p));\n      }\n\n      const newSql: SQLExpression = {\n        ...query.sql,\n        columns: query.sql?.columns?.map((c, i) => (i === currentColumnIndex ? item : c)),\n      };\n\n      onSqlChange(newSql);\n    },\n    [currentColumnIndex, onSqlChange, query.sql]\n  );\n\n  function renderParametersWithFunctions() {\n    if (!func?.parameters) {\n      return null;\n    }\n\n    return func?.parameters.map((funcParam, index) => {\n      return (\n        <Stack key={index} alignItems=\"flex-end\" gap={2}>\n          <EditorField label={funcParam.name} width={25} optional={!funcParam.required}>\n            <>\n              {funcParam.options ? (\n                <Select\n                  value={getColumnValue(macroOrFunction?.parameters![index])}\n                  options={fieldsFromFunction?.[index]}\n                  data-testid={selectors.components.SQLQueryEditor.selectFunctionParameter(funcParam.name)}\n                  inputId={selectInputId}\n                  menuShouldPortal\n                  allowCustomValue\n                  isClearable\n                  onChange={(s) => onParameterChange(index, true)(s?.value)}\n                />\n              ) : (\n                <Input\n                  onChange={(e) => onParameterChange(index, true)(e.currentTarget.value)}\n                  value={macroOrFunction?.parameters![index]?.name}\n                  data-testid={selectors.components.SQLQueryEditor.selectInputParameter}\n                />\n              )}\n            </>\n          </EditorField>\n          {func.parameters!.length !== index + 1 && <InlineLabel className={styles.label}>,</InlineLabel>}\n        </Stack>\n      );\n    });\n  }\n\n  // This means that no function is selected, we render a column selector\n  if (macroOrFunction?.name === undefined) {\n    return (\n      <SelectColumn\n        columns={columns}\n        onParameterChange={(s) => onParameterChange(0)(s)}\n        value={getColumnValue(macroOrFunction?.parameters?.[0])}\n      />\n    );\n  }\n\n  // If the function is not found, that means that it might be a custom value\n  // we let the user add any number of parameters\n  if (!func) {\n    return (\n      <SelectCustomFunctionParameters\n        query={query}\n        onSqlChange={onSqlChange}\n        currentColumnIndex={currentColumnIndex}\n        columns={columns}\n        onParameterChange={onParameterChange}\n      />\n    );\n  }\n\n  // Else we render the function parameters based on the provided settings\n  return (\n    <>\n      <InlineLabel className={styles.label}>(</InlineLabel>\n      {renderParametersWithFunctions()}\n      <InlineLabel className={styles.label}>)</InlineLabel>\n    </>\n  );\n}\n\nconst getStyles = () => {\n  return {\n    label: css({\n      padding: 0,\n      margin: 0,\n      width: 'unset',\n    }),\n  };\n};\n"],"names":["useId","useStyles2","useState","useEffect","_a","useCallback","_b","_c","QueryEditorExpressionType","jsxs","Stack","jsx","EditorField","Fragment","Select","getColumnValue","selectors","Input","InlineLabel","SelectColumn","SelectCustomFunctionParameters","css"],"mappings":"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"}