{"version":3,"file":"GroupByRow.cjs","sources":["../../../../src/components/visual-query-builder/GroupByRow.tsx"],"sourcesContent":["import { useCallback } from 'react';\n\nimport { type SelectableValue, toOption } from '@grafana/data';\nimport { t } from '@grafana/i18n';\nimport { AccessoryButton, EditorList, InputGroup } from '@grafana/plugin-ui';\nimport { Select } from '@grafana/ui';\n\nimport { type QueryEditorGroupByExpression } from '../../expressions';\nimport { type SQLExpression } from '../../types';\nimport { setGroupByField } from '../../utils/sql.utils';\n\ninterface GroupByRowProps {\n  sql: SQLExpression;\n  onSqlChange: (sql: SQLExpression) => void;\n  columns?: Array<SelectableValue<string>>;\n}\n\nexport function GroupByRow({ sql, columns, onSqlChange }: GroupByRowProps) {\n  const onGroupByChange = useCallback(\n    (item: Array<Partial<QueryEditorGroupByExpression>>) => {\n      // As new (empty object) items come in, we need to make sure they have the correct type\n      const cleaned = item.map((v) => setGroupByField(v.property?.name));\n      const newSql = { ...sql, groupBy: cleaned };\n      onSqlChange(newSql);\n    },\n    [onSqlChange, sql]\n  );\n\n  return (\n    <EditorList\n      items={sql.groupBy!}\n      onChange={onGroupByChange}\n      renderItem={makeRenderColumn({\n        options: columns,\n      })}\n    />\n  );\n}\n\nfunction makeRenderColumn({ options }: { options?: Array<SelectableValue<string>> }) {\n  const renderColumn = function (\n    item: Partial<QueryEditorGroupByExpression>,\n    onChangeItem: (item: QueryEditorGroupByExpression) => void,\n    onDeleteItem: () => void\n  ) {\n    return (\n      <InputGroup>\n        <Select\n          value={item.property?.name ? toOption(item.property.name) : null}\n          aria-label={t('grafana-sql.components.make-render-column.render-column.aria-label-group-by', 'Group by')}\n          options={options}\n          menuShouldPortal\n          onChange={({ value }) => value && onChangeItem(setGroupByField(value))}\n        />\n        <AccessoryButton\n          aria-label={t(\n            'grafana-sql.components.make-render-column.render-column.title-remove-group-by-column',\n            'Remove group by column'\n          )}\n          icon=\"times\"\n          variant=\"secondary\"\n          onClick={onDeleteItem}\n        />\n      </InputGroup>\n    );\n  };\n  return renderColumn;\n}\n"],"names":["useCallback","setGroupByField","jsx","EditorList","InputGroup","Select","toOption","t","AccessoryButton"],"mappings":";;;;;;;;;;;;;AAiBO,SAAS,UAAA,CAAW,EAAE,GAAA,EAAK,OAAA,EAAS,aAAY,EAAoB;AACzE,EAAA,MAAM,eAAA,GAAkBA,iBAAA;AAAA,IACtB,CAAC,IAAA,KAAuD;AAEtD,MAAA,MAAM,OAAA,GAAU,IAAA,CAAK,GAAA,CAAI,CAAC,CAAA,KAAG;AArBnC,QAAA,IAAA,EAAA;AAqBsC,QAAA,OAAAC,yBAAA,CAAA,CAAgB,EAAA,GAAA,CAAA,CAAE,QAAA,KAAF,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAY,IAAI,CAAA;AAAA,MAAA,CAAC,CAAA;AACjE,MAAA,MAAM,MAAA,GAAS,EAAE,GAAG,GAAA,EAAK,SAAS,OAAA,EAAQ;AAC1C,MAAA,WAAA,CAAY,MAAM,CAAA;AAAA,IACpB,CAAA;AAAA,IACA,CAAC,aAAa,GAAG;AAAA,GACnB;AAEA,EAAA,uBACEC,cAAA;AAAA,IAACC,mBAAA;AAAA,IAAA;AAAA,MACC,OAAO,GAAA,CAAI,OAAA;AAAA,MACX,QAAA,EAAU,eAAA;AAAA,MACV,YAAY,gBAAA,CAAiB;AAAA,QAC3B,OAAA,EAAS;AAAA,OACV;AAAA;AAAA,GACH;AAEJ;AAEA,SAAS,gBAAA,CAAiB,EAAE,OAAA,EAAQ,EAAiD;AACnF,EAAA,MAAM,YAAA,GAAe,SACnB,IAAA,EACA,YAAA,EACA,YAAA,EACA;AA5CJ,IAAA,IAAA,EAAA;AA6CI,IAAA,uCACGC,mBAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAAF,cAAA;AAAA,QAACG,SAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAA,CAAA,CAAO,UAAK,QAAA,KAAL,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAe,QAAOC,aAAA,CAAS,IAAA,CAAK,QAAA,CAAS,IAAI,CAAA,GAAI,IAAA;AAAA,UAC5D,YAAA,EAAYC,MAAA,CAAE,6EAAA,EAA+E,UAAU,CAAA;AAAA,UACvG,OAAA;AAAA,UACA,gBAAA,EAAgB,IAAA;AAAA,UAChB,QAAA,EAAU,CAAC,EAAE,KAAA,OAAY,KAAA,IAAS,YAAA,CAAaN,yBAAA,CAAgB,KAAK,CAAC;AAAA;AAAA,OACvE;AAAA,sBACAC,cAAA;AAAA,QAACM,wBAAA;AAAA,QAAA;AAAA,UACC,YAAA,EAAYD,MAAA;AAAA,YACV,sFAAA;AAAA,YACA;AAAA,WACF;AAAA,UACA,IAAA,EAAK,OAAA;AAAA,UACL,OAAA,EAAQ,WAAA;AAAA,UACR,OAAA,EAAS;AAAA;AAAA;AACX,KAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AACA,EAAA,OAAO,YAAA;AACT;;;;"}