@perses-dev/plugin-system 0.55.0-beta.1 → 0.55.0-beta.10

package/dist/components/OptionsEditorTabPanel/OptionsEditorTabPanel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/OptionsEditorTabPanel.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box } from '@mui/material';\nimport { ReactElement } from 'react';\n\ninterface OptionsEditorTabPanelProps {\n  children: React.ReactNode;\n  index: number;\n  value: number;\n}\n\nexport function OptionsEditorTabPanel(props: OptionsEditorTabPanelProps): ReactElement {\n  const { children, value, index, ...other } = props;\n\n  const isActive = value === index;\n\n  return (\n    <div\n      role=\"tabpanel\"\n      hidden={!isActive}\n      id={`options-editor-tabpanel-${index}`}\n      aria-labelledby={`options-editor-tab-${index}`}\n      {...other}\n    >\n      {isActive && <Box mt={2}>{children}</Box>}\n    </div>\n  );\n}\n"],"names":["Box","OptionsEditorTabPanel","props","children","value","index","other","isActive","div","role","hidden","id","aria-labelledby","mt"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,QAAQ,gBAAgB;AASpC,OAAO,SAASC,sBAAsBC,KAAiC;IACrE,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,KAAK,EAAE,GAAGC,OAAO,GAAGJ;IAE7C,MAAMK,WAAWH,UAAUC;IAE3B,qBACE,KAACG;QACCC,MAAK;QACLC,QAAQ,CAACH;QACTI,IAAI,CAAC,wBAAwB,EAAEN,OAAO;QACtCO,mBAAiB,CAAC,mBAAmB,EAAEP,OAAO;QAC7C,GAAGC,KAAK;kBAERC,0BAAY,KAACP;YAAIa,IAAI;sBAAIV;;;AAGhC"}
+{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/OptionsEditorTabPanel.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box } from '@mui/material';\nimport type { ReactElement } from 'react';\n\ninterface OptionsEditorTabPanelProps {\n  children: React.ReactNode;\n  index: number;\n  value: number;\n}\n\nexport function OptionsEditorTabPanel(props: OptionsEditorTabPanelProps): ReactElement {\n  const { children, value, index, ...other } = props;\n\n  const isActive = value === index;\n\n  return (\n    <div\n      role=\"tabpanel\"\n      hidden={!isActive}\n      id={`options-editor-tabpanel-${index}`}\n      aria-labelledby={`options-editor-tab-${index}`}\n      {...other}\n    >\n      {isActive && <Box mt={2}>{children}</Box>}\n    </div>\n  );\n}\n"],"names":["Box","OptionsEditorTabPanel","props","children","value","index","other","isActive","div","role","hidden","id","aria-labelledby","mt"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,QAAQ,gBAAgB;AASpC,OAAO,SAASC,sBAAsBC,KAAiC;IACrE,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,KAAK,EAAE,GAAGC,OAAO,GAAGJ;IAE7C,MAAMK,WAAWH,UAAUC;IAE3B,qBACE,KAACG;QACCC,MAAK;QACLC,QAAQ,CAACH;QACTI,IAAI,CAAC,wBAAwB,EAAEN,OAAO;QACtCO,mBAAiB,CAAC,mBAAmB,EAAEP,OAAO;QAC7C,GAAGC,KAAK;kBAERC,0BAAY,KAACP;YAAIa,IAAI;sBAAIV;;;AAGhC"}

package/dist/components/OptionsEditorTabPanel/index.js

@@ -10,6 +10,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-export * from './OptionsEditorTabPanel';
+export * from "./OptionsEditorTabPanel.js";
 
 //# sourceMappingURL=index.js.map

package/dist/components/OptionsEditorTabPanel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './OptionsEditorTabPanel';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,0BAA0B"}
+{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './OptionsEditorTabPanel';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,6BAA0B"}

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 export type OptionsEditorTab = {
     label: string;
     /**

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OptionsEditorTabs.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAG1D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,EAAE,gBAAgB,EAAE,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,iBAAiB,aAAc,sBAAsB,KAAG,YAgCpE,CAAC"}
+{"version":3,"file":"OptionsEditorTabs.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,EAAE,gBAAgB,EAAE,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,iBAAiB,aAAc,sBAAsB,KAAG,YAgCpE,CAAC"}

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -11,9 +10,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Tab, Tabs, Box } from '@mui/material';
-import { useState } from 'react';
-import { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Tab, Tabs, Box } from "@mui/material";
+import { useState } from "react";
+import { OptionsEditorTabPanel } from "../OptionsEditorTabPanel/index.js";
 export const OptionsEditorTabs = ({ tabs })=>{
     const [activeTab, setActiveTab] = useState(0);
     const handleChange = (_, newValue)=>{

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Tab, Tabs, TabsProps, Box } from '@mui/material';\nimport { ReactElement, ReactNode, useState } from 'react';\nimport { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';\n\nexport type OptionsEditorTab = {\n  label: string;\n  /**\n   * Content rendered when the tab is active.\n   */\n  content: ReactNode;\n};\n\nexport type OptionsEditorTabsProps = {\n  tabs: OptionsEditorTab[];\n};\n\nexport const OptionsEditorTabs = ({ tabs }: OptionsEditorTabsProps): ReactElement => {\n  const [activeTab, setActiveTab] = useState(0);\n\n  const handleChange: TabsProps['onChange'] = (_, newValue) => {\n    setActiveTab(newValue);\n  };\n\n  return (\n    <>\n      <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n        <Tabs value={activeTab} onChange={handleChange} aria-label=\"Panel configuration tabs\">\n          {tabs.map(({ label }, i) => {\n            return (\n              <Tab\n                key={label}\n                label={label}\n                id={`options-editor-tab-${i}`}\n                aria-controls={`options-editor-tabpanel-${i}`}\n              />\n            );\n          })}\n        </Tabs>\n      </Box>\n      {tabs.map(({ label, content }, i) => {\n        return (\n          <OptionsEditorTabPanel key={label} value={activeTab} index={i}>\n            {content}\n          </OptionsEditorTabPanel>\n        );\n      })}\n    </>\n  );\n};\n"],"names":["Tab","Tabs","Box","useState","OptionsEditorTabPanel","OptionsEditorTabs","tabs","activeTab","setActiveTab","handleChange","_","newValue","sx","borderBottom","borderColor","theme","palette","divider","value","onChange","aria-label","map","label","i","id","aria-controls","content","index"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,IAAI,EAAaC,GAAG,QAAQ,gBAAgB;AAC1D,SAAkCC,QAAQ,QAAQ,QAAQ;AAC1D,SAASC,qBAAqB,QAAQ,2BAA2B;AAcjE,OAAO,MAAMC,oBAAoB,CAAC,EAAEC,IAAI,EAA0B;IAChE,MAAM,CAACC,WAAWC,aAAa,GAAGL,SAAS;IAE3C,MAAMM,eAAsC,CAACC,GAAGC;QAC9CH,aAAaG;IACf;IAEA,qBACE;;0BACE,KAACT;gBAAIU,IAAI;oBAAEC,cAAc;oBAAGC,aAAa,CAACC,QAAUA,MAAMC,OAAO,CAACC,OAAO;gBAAC;0BACxE,cAAA,KAAChB;oBAAKiB,OAAOX;oBAAWY,UAAUV;oBAAcW,cAAW;8BACxDd,KAAKe,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAE,EAAEC;wBACpB,qBACE,KAACvB;4BAECsB,OAAOA;4BACPE,IAAI,CAAC,mBAAmB,EAAED,GAAG;4BAC7BE,iBAAe,CAAC,wBAAwB,EAAEF,GAAG;2BAHxCD;oBAMX;;;YAGHhB,KAAKe,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEI,OAAO,EAAE,EAAEH;gBAC7B,qBACE,KAACnB;oBAAkCc,OAAOX;oBAAWoB,OAAOJ;8BACzDG;mBADyBJ;YAIhC;;;AAGN,EAAE"}
+{"version":3,"sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { TabsProps } from '@mui/material';\nimport { Tab, Tabs, Box } from '@mui/material';\nimport type { ReactElement, ReactNode } from 'react';\nimport { useState } from 'react';\n\nimport { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';\n\nexport type OptionsEditorTab = {\n  label: string;\n  /**\n   * Content rendered when the tab is active.\n   */\n  content: ReactNode;\n};\n\nexport type OptionsEditorTabsProps = {\n  tabs: OptionsEditorTab[];\n};\n\nexport const OptionsEditorTabs = ({ tabs }: OptionsEditorTabsProps): ReactElement => {\n  const [activeTab, setActiveTab] = useState(0);\n\n  const handleChange: TabsProps['onChange'] = (_, newValue) => {\n    setActiveTab(newValue);\n  };\n\n  return (\n    <>\n      <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n        <Tabs value={activeTab} onChange={handleChange} aria-label=\"Panel configuration tabs\">\n          {tabs.map(({ label }, i) => {\n            return (\n              <Tab\n                key={label}\n                label={label}\n                id={`options-editor-tab-${i}`}\n                aria-controls={`options-editor-tabpanel-${i}`}\n              />\n            );\n          })}\n        </Tabs>\n      </Box>\n      {tabs.map(({ label, content }, i) => {\n        return (\n          <OptionsEditorTabPanel key={label} value={activeTab} index={i}>\n            {content}\n          </OptionsEditorTabPanel>\n        );\n      })}\n    </>\n  );\n};\n"],"names":["Tab","Tabs","Box","useState","OptionsEditorTabPanel","OptionsEditorTabs","tabs","activeTab","setActiveTab","handleChange","_","newValue","sx","borderBottom","borderColor","theme","palette","divider","value","onChange","aria-label","map","label","i","id","aria-controls","content","index"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAGjC,SAASA,GAAG,EAAEC,IAAI,EAAEC,GAAG,QAAQ,gBAAgB;AAE/C,SAASC,QAAQ,QAAQ,QAAQ;AAEjC,SAASC,qBAAqB,QAAQ,oCAA2B;AAcjE,OAAO,MAAMC,oBAAoB,CAAC,EAAEC,IAAI,EAA0B;IAChE,MAAM,CAACC,WAAWC,aAAa,GAAGL,SAAS;IAE3C,MAAMM,eAAsC,CAACC,GAAGC;QAC9CH,aAAaG;IACf;IAEA,qBACE;;0BACE,KAACT;gBAAIU,IAAI;oBAAEC,cAAc;oBAAGC,aAAa,CAACC,QAAUA,MAAMC,OAAO,CAACC,OAAO;gBAAC;0BACxE,cAAA,KAAChB;oBAAKiB,OAAOX;oBAAWY,UAAUV;oBAAcW,cAAW;8BACxDd,KAAKe,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAE,EAAEC;wBACpB,qBACE,KAACvB;4BAECsB,OAAOA;4BACPE,IAAI,CAAC,mBAAmB,EAAED,GAAG;4BAC7BE,iBAAe,CAAC,wBAAwB,EAAEF,GAAG;2BAHxCD;oBAMX;;;YAGHhB,KAAKe,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEI,OAAO,EAAE,EAAEH;gBAC7B,qBACE,KAACnB;oBAAkCc,OAAOX;oBAAWoB,OAAOJ;8BACzDG;mBADyBJ;YAIhC;;;AAGN,EAAE"}

package/dist/components/OptionsEditorTabs/index.js

@@ -10,6 +10,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-export * from './OptionsEditorTabs';
+export * from "./OptionsEditorTabs.js";
 
 //# sourceMappingURL=index.js.map

package/dist/components/OptionsEditorTabs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/OptionsEditorTabs/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './OptionsEditorTabs';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,sBAAsB"}
+{"version":3,"sources":["../../../src/components/OptionsEditorTabs/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './OptionsEditorTabs';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,yBAAsB"}

package/dist/components/PanelSpecEditor/PanelAnnotationsEditor.d.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from 'react';
-import { AnnotationSpec } from '@perses-dev/spec';
+import type { AnnotationSpec } from '@perses-dev/spec';
+import type { ReactElement } from 'react';
 export interface PanelAnnotationsEditorProps {
     value: AnnotationSpec[];
     onChange: (annotations: AnnotationSpec[]) => void;

package/dist/components/PanelSpecEditor/PanelAnnotationsEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelAnnotationsEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PanelSpecEditor/PanelAnnotationsEditor.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAqB,MAAM,OAAO,CAAC;AAqBxD,OAAO,EAAE,cAAc,EAA2B,MAAM,kBAAkB,CAAC;AAyB3E,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,IAAI,CAAC;IAClD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,2BAA2B,GAAG,YAAY,CA6IjH"}
+{"version":3,"file":"PanelAnnotationsEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PanelSpecEditor/PanelAnnotationsEditor.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,cAAc,EAA2B,MAAM,kBAAkB,CAAC;AAMhF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AA0B1C,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,IAAI,CAAC;IAClD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,2BAA2B,GAAG,YAAY,CA6IjH"}

package/dist/components/PanelSpecEditor/PanelAnnotationsEditor.js

@@ -11,15 +11,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { useMemo, useState } from 'react';
-import { Alert, Box, Button, IconButton, Stack, Switch, Table, TableBody, TableCell as MuiTableCell, TableContainer, TableHead, TableRow, styled } from '@mui/material';
-import AddIcon from 'mdi-material-ui/Plus';
-import PencilIcon from 'mdi-material-ui/Pencil';
-import TrashIcon from 'mdi-material-ui/TrashCan';
-import ArrowUp from 'mdi-material-ui/ArrowUp';
-import ArrowDown from 'mdi-material-ui/ArrowDown';
-import { ValidationProvider } from '../../context';
-import { AnnotationEditorForm } from '../Annotations';
+import { Alert, Box, Button, IconButton, Stack, Switch, Table, TableBody, TableCell as MuiTableCell, TableContainer, TableHead, TableRow, styled } from "@mui/material";
+import ArrowDown from "mdi-material-ui/ArrowDown";
+import ArrowUp from "mdi-material-ui/ArrowUp";
+import PencilIcon from "mdi-material-ui/Pencil";
+import AddIcon from "mdi-material-ui/Plus";
+import TrashIcon from "mdi-material-ui/TrashCan";
+import { useMemo, useState } from "react";
+import { ValidationProvider } from "../../context/index.js";
+import { AnnotationEditorForm } from "../Annotations/index.js";
 const TableCell = styled(MuiTableCell)(({ theme })=>({
         borderBottom: `solid 1px ${theme.palette.divider}`
     }));

package/dist/components/PanelSpecEditor/PanelAnnotationsEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelSpecEditor/PanelAnnotationsEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ReactElement, useMemo, useState } from 'react';\nimport {\n  Alert,\n  Box,\n  Button,\n  IconButton,\n  Stack,\n  Switch,\n  Table,\n  TableBody,\n  TableCell as MuiTableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  styled,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport { AnnotationSpec, Definition, UnknownSpec } from '@perses-dev/spec';\nimport { Action } from '@perses-dev/client';\nimport { ValidationProvider } from '../../context';\nimport { AnnotationEditorForm } from '../Annotations';\n\nconst TableCell = styled(MuiTableCell)(({ theme }) => ({\n  borderBottom: `solid 1px ${theme.palette.divider}`,\n}));\n\n// The annotation being edited: an existing entry by index, a brand new one, or nothing (list view).\ntype EditTarget = { kind: 'edit'; index: number } | { kind: 'new' } | null;\n\nfunction findDuplicateNames(specs: AnnotationSpec[]): string[] {\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  for (const spec of specs) {\n    const name = spec.display.name;\n    if (seen.has(name)) {\n      duplicates.add(name);\n    }\n    seen.add(name);\n  }\n  return Array.from(duplicates);\n}\n\nexport interface PanelAnnotationsEditorProps {\n  value: AnnotationSpec[];\n  onChange: (annotations: AnnotationSpec[]) => void;\n  isReadonly?: boolean;\n}\n\n/**\n * Panel-level annotations editor, rendered as a common tab in the panel editor for panel plugins\n * that declare `supportsAnnotations`. Reuses {@link AnnotationEditorForm} for the per-annotation form\n * and propagates every committed change through `onChange`, so it fits the inline panel-editor flow\n * (no separate apply step).\n */\nexport function PanelAnnotationsEditor({ value, onChange, isReadonly }: PanelAnnotationsEditorProps): ReactElement {\n  const [target, setTarget] = useState<EditTarget>(null);\n  const [formAction, setFormAction] = useState<Action>('update');\n\n  const duplicateNames = useMemo(() => findDuplicateNames(value), [value]);\n\n  const initialSpec: AnnotationSpec | undefined = useMemo(() => {\n    if (target?.kind === 'new') {\n      return { display: { name: 'NewAnnotation' }, plugin: {} as Definition<UnknownSpec> };\n    }\n    if (target?.kind === 'edit') {\n      return value[target.index];\n    }\n    return undefined;\n  }, [target, value]);\n\n  const removeAnnotation = (index: number): void => {\n    onChange(value.filter((_, i) => i !== index));\n  };\n\n  const changeAnnotationOrder = (index: number, direction: 'up' | 'down'): void => {\n    const step = direction === 'up' ? -1 : 1;\n    const swapWith = index + step;\n    const current = value[index];\n    const adjacent = value[swapWith];\n    if (!current || !adjacent) {\n      return;\n    }\n    const next = [...value];\n    next[index] = adjacent;\n    next[swapWith] = current;\n    onChange(next);\n  };\n\n  const toggleAnnotationVisibility = (index: number, visible: boolean): void => {\n    onChange(\n      value.map((spec, i) => (i === index ? { ...spec, display: { ...spec.display, hidden: !visible } } : spec))\n    );\n  };\n\n  const handleSave = (definition: AnnotationSpec): void => {\n    if (target?.kind === 'new') {\n      onChange([...value, definition]);\n    } else if (target?.kind === 'edit') {\n      onChange(value.map((spec, i) => (i === target.index ? definition : spec)));\n    }\n    setTarget(null);\n  };\n\n  if (target !== null && initialSpec) {\n    return (\n      <ValidationProvider>\n        <AnnotationEditorForm\n          initialAnnotationSpec={initialSpec}\n          action={formAction}\n          isDraft={true}\n          isReadonly={isReadonly}\n          onActionChange={setFormAction}\n          onSave={handleSave}\n          onClose={() => setTarget(null)}\n        />\n      </ValidationProvider>\n    );\n  }\n\n  return (\n    <Stack spacing={2} padding={1}>\n      {duplicateNames.map((name) => (\n        <Alert severity=\"error\" key={name}>\n          {`Duplicate annotation name: ${name}`}\n        </Alert>\n      ))}\n      <TableContainer>\n        <Table aria-label=\"table of panel annotations\">\n          <TableHead>\n            <TableRow>\n              <TableCell>Visibility</TableCell>\n              <TableCell>Name</TableCell>\n              <TableCell>Type</TableCell>\n              <TableCell>Description</TableCell>\n              <TableCell align=\"right\">Actions</TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {value.map((annotation, index) => (\n              <TableRow key={`${annotation.display.name}-${index}`}>\n                <TableCell component=\"th\" scope=\"row\">\n                  <Switch\n                    checked={annotation.display?.hidden !== true}\n                    disabled={isReadonly}\n                    onChange={(e) => toggleAnnotationVisibility(index, e.target.checked)}\n                  />\n                </TableCell>\n                <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold' }}>\n                  {annotation.display.name}\n                </TableCell>\n                <TableCell>{annotation.plugin.kind}</TableCell>\n                <TableCell>{annotation.display?.description ?? ''}</TableCell>\n                <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n                  <IconButton onClick={() => changeAnnotationOrder(index, 'up')} disabled={isReadonly || index === 0}>\n                    <ArrowUp />\n                  </IconButton>\n                  <IconButton\n                    onClick={() => changeAnnotationOrder(index, 'down')}\n                    disabled={isReadonly || index === value.length - 1}\n                  >\n                    <ArrowDown />\n                  </IconButton>\n                  <IconButton\n                    onClick={() => {\n                      setFormAction('update');\n                      setTarget({ kind: 'edit', index });\n                    }}\n                  >\n                    <PencilIcon />\n                  </IconButton>\n                  <IconButton disabled={isReadonly} onClick={() => removeAnnotation(index)}>\n                    <TrashIcon />\n                  </IconButton>\n                </TableCell>\n              </TableRow>\n            ))}\n          </TableBody>\n        </Table>\n      </TableContainer>\n      <Box display=\"flex\">\n        <Button\n          variant=\"contained\"\n          startIcon={<AddIcon />}\n          sx={{ marginLeft: 'auto' }}\n          disabled={isReadonly}\n          onClick={() => {\n            setFormAction('create');\n            setTarget({ kind: 'new' });\n          }}\n        >\n          Add Annotation\n        </Button>\n      </Box>\n    </Stack>\n  );\n}\n"],"names":["useMemo","useState","Alert","Box","Button","IconButton","Stack","Switch","Table","TableBody","TableCell","MuiTableCell","TableContainer","TableHead","TableRow","styled","AddIcon","PencilIcon","TrashIcon","ArrowUp","ArrowDown","ValidationProvider","AnnotationEditorForm","theme","borderBottom","palette","divider","findDuplicateNames","specs","seen","Set","duplicates","spec","name","display","has","add","Array","from","PanelAnnotationsEditor","value","onChange","isReadonly","target","setTarget","formAction","setFormAction","duplicateNames","initialSpec","kind","plugin","index","undefined","removeAnnotation","filter","_","i","changeAnnotationOrder","direction","step","swapWith","current","adjacent","next","toggleAnnotationVisibility","visible","map","hidden","handleSave","definition","initialAnnotationSpec","action","isDraft","onActionChange","onSave","onClose","spacing","padding","severity","aria-label","align","annotation","component","scope","checked","disabled","e","sx","fontWeight","description","whiteSpace","onClick","length","variant","startIcon","marginLeft"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/PanelSpecEditor/PanelAnnotationsEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport {\n  Alert,\n  Box,\n  Button,\n  IconButton,\n  Stack,\n  Switch,\n  Table,\n  TableBody,\n  TableCell as MuiTableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  styled,\n} from '@mui/material';\nimport type { Action } from '@perses-dev/client';\nimport type { AnnotationSpec, Definition, UnknownSpec } from '@perses-dev/spec';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport type { ReactElement } from 'react';\nimport { useMemo, useState } from 'react';\n\nimport { ValidationProvider } from '../../context';\nimport { AnnotationEditorForm } from '../Annotations';\n\nconst TableCell = styled(MuiTableCell)(({ theme }) => ({\n  borderBottom: `solid 1px ${theme.palette.divider}`,\n}));\n\n// The annotation being edited: an existing entry by index, a brand new one, or nothing (list view).\ntype EditTarget = { kind: 'edit'; index: number } | { kind: 'new' } | null;\n\nfunction findDuplicateNames(specs: AnnotationSpec[]): string[] {\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  for (const spec of specs) {\n    const name = spec.display.name;\n    if (seen.has(name)) {\n      duplicates.add(name);\n    }\n    seen.add(name);\n  }\n  return Array.from(duplicates);\n}\n\nexport interface PanelAnnotationsEditorProps {\n  value: AnnotationSpec[];\n  onChange: (annotations: AnnotationSpec[]) => void;\n  isReadonly?: boolean;\n}\n\n/**\n * Panel-level annotations editor, rendered as a common tab in the panel editor for panel plugins\n * that declare `supportsAnnotations`. Reuses {@link AnnotationEditorForm} for the per-annotation form\n * and propagates every committed change through `onChange`, so it fits the inline panel-editor flow\n * (no separate apply step).\n */\nexport function PanelAnnotationsEditor({ value, onChange, isReadonly }: PanelAnnotationsEditorProps): ReactElement {\n  const [target, setTarget] = useState<EditTarget>(null);\n  const [formAction, setFormAction] = useState<Action>('update');\n\n  const duplicateNames = useMemo(() => findDuplicateNames(value), [value]);\n\n  const initialSpec: AnnotationSpec | undefined = useMemo(() => {\n    if (target?.kind === 'new') {\n      return { display: { name: 'NewAnnotation' }, plugin: {} as Definition<UnknownSpec> };\n    }\n    if (target?.kind === 'edit') {\n      return value[target.index];\n    }\n    return undefined;\n  }, [target, value]);\n\n  const removeAnnotation = (index: number): void => {\n    onChange(value.filter((_, i) => i !== index));\n  };\n\n  const changeAnnotationOrder = (index: number, direction: 'up' | 'down'): void => {\n    const step = direction === 'up' ? -1 : 1;\n    const swapWith = index + step;\n    const current = value[index];\n    const adjacent = value[swapWith];\n    if (!current || !adjacent) {\n      return;\n    }\n    const next = [...value];\n    next[index] = adjacent;\n    next[swapWith] = current;\n    onChange(next);\n  };\n\n  const toggleAnnotationVisibility = (index: number, visible: boolean): void => {\n    onChange(\n      value.map((spec, i) => (i === index ? { ...spec, display: { ...spec.display, hidden: !visible } } : spec)),\n    );\n  };\n\n  const handleSave = (definition: AnnotationSpec): void => {\n    if (target?.kind === 'new') {\n      onChange([...value, definition]);\n    } else if (target?.kind === 'edit') {\n      onChange(value.map((spec, i) => (i === target.index ? definition : spec)));\n    }\n    setTarget(null);\n  };\n\n  if (target !== null && initialSpec) {\n    return (\n      <ValidationProvider>\n        <AnnotationEditorForm\n          initialAnnotationSpec={initialSpec}\n          action={formAction}\n          isDraft={true}\n          isReadonly={isReadonly}\n          onActionChange={setFormAction}\n          onSave={handleSave}\n          onClose={() => setTarget(null)}\n        />\n      </ValidationProvider>\n    );\n  }\n\n  return (\n    <Stack spacing={2} padding={1}>\n      {duplicateNames.map((name) => (\n        <Alert severity=\"error\" key={name}>\n          {`Duplicate annotation name: ${name}`}\n        </Alert>\n      ))}\n      <TableContainer>\n        <Table aria-label=\"table of panel annotations\">\n          <TableHead>\n            <TableRow>\n              <TableCell>Visibility</TableCell>\n              <TableCell>Name</TableCell>\n              <TableCell>Type</TableCell>\n              <TableCell>Description</TableCell>\n              <TableCell align=\"right\">Actions</TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {value.map((annotation, index) => (\n              <TableRow key={`${annotation.display.name}-${index}`}>\n                <TableCell component=\"th\" scope=\"row\">\n                  <Switch\n                    checked={annotation.display?.hidden !== true}\n                    disabled={isReadonly}\n                    onChange={(e) => toggleAnnotationVisibility(index, e.target.checked)}\n                  />\n                </TableCell>\n                <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold' }}>\n                  {annotation.display.name}\n                </TableCell>\n                <TableCell>{annotation.plugin.kind}</TableCell>\n                <TableCell>{annotation.display?.description ?? ''}</TableCell>\n                <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n                  <IconButton onClick={() => changeAnnotationOrder(index, 'up')} disabled={isReadonly || index === 0}>\n                    <ArrowUp />\n                  </IconButton>\n                  <IconButton\n                    onClick={() => changeAnnotationOrder(index, 'down')}\n                    disabled={isReadonly || index === value.length - 1}\n                  >\n                    <ArrowDown />\n                  </IconButton>\n                  <IconButton\n                    onClick={() => {\n                      setFormAction('update');\n                      setTarget({ kind: 'edit', index });\n                    }}\n                  >\n                    <PencilIcon />\n                  </IconButton>\n                  <IconButton disabled={isReadonly} onClick={() => removeAnnotation(index)}>\n                    <TrashIcon />\n                  </IconButton>\n                </TableCell>\n              </TableRow>\n            ))}\n          </TableBody>\n        </Table>\n      </TableContainer>\n      <Box display=\"flex\">\n        <Button\n          variant=\"contained\"\n          startIcon={<AddIcon />}\n          sx={{ marginLeft: 'auto' }}\n          disabled={isReadonly}\n          onClick={() => {\n            setFormAction('create');\n            setTarget({ kind: 'new' });\n          }}\n        >\n          Add Annotation\n        </Button>\n      </Box>\n    </Stack>\n  );\n}\n"],"names":["Alert","Box","Button","IconButton","Stack","Switch","Table","TableBody","TableCell","MuiTableCell","TableContainer","TableHead","TableRow","styled","ArrowDown","ArrowUp","PencilIcon","AddIcon","TrashIcon","useMemo","useState","ValidationProvider","AnnotationEditorForm","theme","borderBottom","palette","divider","findDuplicateNames","specs","seen","Set","duplicates","spec","name","display","has","add","Array","from","PanelAnnotationsEditor","value","onChange","isReadonly","target","setTarget","formAction","setFormAction","duplicateNames","initialSpec","kind","plugin","index","undefined","removeAnnotation","filter","_","i","changeAnnotationOrder","direction","step","swapWith","current","adjacent","next","toggleAnnotationVisibility","visible","map","hidden","handleSave","definition","initialAnnotationSpec","action","isDraft","onActionChange","onSave","onClose","spacing","padding","severity","aria-label","align","annotation","component","scope","checked","disabled","e","sx","fontWeight","description","whiteSpace","onClick","length","variant","startIcon","marginLeft"],"mappings":"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"}

package/dist/components/PanelSpecEditor/PanelSpecEditor.d.ts

@@ -1,14 +1,17 @@
-/// <reference types="react" />
-import { PanelDefinition, QueryDefinition, UnknownSpec } from '@perses-dev/spec';
-import { Control } from 'react-hook-form';
-import { PanelEditorValues } from '../../model';
-import { PluginEditorRef } from '../PluginEditor';
+import type { AnnotationSpec, PanelDefinition, QueryDefinition, UnknownSpec } from '@perses-dev/spec';
+import type { Control } from 'react-hook-form';
+import type { PanelEditorValues } from '../../model';
+import type { PanelGroup, VariableDefinitionGroup } from '../LayoutEditor';
+import type { PluginEditorRef } from '../PluginEditor';
 export interface PanelSpecEditorProps {
     control: Control<PanelEditorValues>;
     panelDefinition: PanelDefinition;
+    variableDefinitionGroups: VariableDefinitionGroup[];
+    panelGroups?: PanelGroup[];
     onQueriesChange: (queries: QueryDefinition[]) => void;
     onQueryRun: (index: number, query: QueryDefinition) => void;
     onPluginSpecChange: (spec: UnknownSpec) => void;
+    onAnnotationsChange: (annotations: AnnotationSpec[]) => void;
     onJSONChange: (panelDefinitionStr: string) => void;
 }
 export declare const PanelSpecEditor: import("react").ForwardRefExoticComponent<PanelSpecEditorProps & import("react").RefAttributes<PluginEditorRef>>;

package/dist/components/PanelSpecEditor/PanelSpecEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelSpecEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PanelSpecEditor/PanelSpecEditor.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACjF,OAAO,EAAE,OAAO,EAAc,MAAM,iBAAiB,CAAC;AAGtD,OAAO,EAAE,iBAAiB,EAAe,MAAM,aAAa,CAAC;AAI7D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGlD,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IACpC,eAAe,EAAE,eAAe,CAAC;IACjC,eAAe,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IACtD,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,kBAAkB,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAChD,YAAY,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAED,eAAO,MAAM,eAAe,kHAyH1B,CAAC"}
+{"version":3,"file":"PanelSpecEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PanelSpecEditor/PanelSpecEditor.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAGtG,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAG/C,OAAO,KAAK,EAAE,iBAAiB,EAAe,MAAM,aAAa,CAAC;AAElE,OAAO,KAAK,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAM3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGvD,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IACpC,eAAe,EAAE,eAAe,CAAC;IACjC,wBAAwB,EAAE,uBAAuB,EAAE,CAAC;IACpD,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,eAAe,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IACtD,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,kBAAkB,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAChD,mBAAmB,EAAE,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,IAAI,CAAC;IAC7D,YAAY,EAAE,CAAC,kBAAkB,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD;AAED,eAAO,MAAM,eAAe,kHA4I1B,CAAC"}

package/dist/components/PanelSpecEditor/PanelSpecEditor.js

@@ -11,16 +11,17 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { ErrorAlert, JSONEditor } from '@perses-dev/components';
-import { Controller } from 'react-hook-form';
-import { forwardRef } from 'react';
-import { LinksEditor } from '../LinksEditor';
-import { useDataQueriesContext, usePlugin } from '../../runtime';
-import { OptionsEditorTabs } from '../OptionsEditorTabs';
-import { MultiQueryEditor } from '../MultiQueryEditor';
-import { PanelAnnotationsEditor } from './PanelAnnotationsEditor';
+import { ErrorAlert, JSONEditor } from "@perses-dev/components";
+import { forwardRef } from "react";
+import { Controller } from "react-hook-form";
+import { useDataQueriesContext, usePlugin } from "../../runtime/index.js";
+import { LayoutEditor } from "../LayoutEditor/index.js";
+import { LinksEditor } from "../LinksEditor/index.js";
+import { MultiQueryEditor } from "../MultiQueryEditor/index.js";
+import { OptionsEditorTabs } from "../OptionsEditorTabs/index.js";
+import { PanelAnnotationsEditor } from "./PanelAnnotationsEditor.js";
 export const PanelSpecEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
-    const { control, panelDefinition, onQueriesChange, onQueryRun, onPluginSpecChange, onJSONChange } = props;
+    const { control, panelDefinition, variableDefinitionGroups, panelGroups, onQueriesChange, onQueryRun, onPluginSpecChange, onAnnotationsChange, onJSONChange } = props;
     const { kind } = panelDefinition.spec.plugin;
     const { data: plugin, isLoading, error } = usePlugin('Panel', kind);
     const { queryResults } = useDataQueriesContext();
@@ -88,12 +89,15 @@ export const PanelSpecEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
                 name: "panelDefinition.spec.annotations",
                 render: ({ field })=>/*#__PURE__*/ _jsx(PanelAnnotationsEditor, {
                         value: panelDefinition.spec.annotations ?? [],
-                        onChange: (annotations)=>field.onChange(annotations)
+                        onChange: (annotations)=>{
+                            field.onChange(annotations);
+                            onAnnotationsChange(annotations);
+                        }
                     })
             })
         });
     }
-    // always show json editor and links editor by default
+    // Always show the JSON editor, Links editor, and Layout editor by default.
     tabs.push({
         label: 'Links',
         content: /*#__PURE__*/ _jsx(LinksEditor, {
@@ -115,6 +119,14 @@ export const PanelSpecEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
                 })
         })
     });
+    tabs.push({
+        label: 'Layout',
+        content: /*#__PURE__*/ _jsx(LayoutEditor, {
+            control: control,
+            variableDefinitionGroups: variableDefinitionGroups,
+            panelGroups: panelGroups
+        })
+    });
     return /*#__PURE__*/ _jsx(OptionsEditorTabs, {
         tabs: tabs
     }, tabs.length);

package/dist/components/PanelSpecEditor/PanelSpecEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelSpecEditor/PanelSpecEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ErrorAlert, JSONEditor } from '@perses-dev/components';\nimport { PanelDefinition, QueryDefinition, UnknownSpec } from '@perses-dev/spec';\nimport { Control, Controller } from 'react-hook-form';\nimport { forwardRef, ReactElement } from 'react';\nimport { LinksEditor } from '../LinksEditor';\nimport { PanelEditorValues, PanelPlugin } from '../../model';\nimport { useDataQueriesContext, usePlugin } from '../../runtime';\nimport { OptionsEditorTabs, OptionsEditorTabsProps } from '../OptionsEditorTabs';\nimport { MultiQueryEditor } from '../MultiQueryEditor';\nimport { PluginEditorRef } from '../PluginEditor';\nimport { PanelAnnotationsEditor } from './PanelAnnotationsEditor';\n\nexport interface PanelSpecEditorProps {\n  control: Control<PanelEditorValues>;\n  panelDefinition: PanelDefinition;\n  onQueriesChange: (queries: QueryDefinition[]) => void;\n  onQueryRun: (index: number, query: QueryDefinition) => void;\n  onPluginSpecChange: (spec: UnknownSpec) => void;\n  onJSONChange: (panelDefinitionStr: string) => void;\n}\n\nexport const PanelSpecEditor = forwardRef<PluginEditorRef, PanelSpecEditorProps>((props, ref): ReactElement | null => {\n  const { control, panelDefinition, onQueriesChange, onQueryRun, onPluginSpecChange, onJSONChange } = props;\n  const { kind } = panelDefinition.spec.plugin;\n  const { data: plugin, isLoading, error } = usePlugin('Panel', kind);\n\n  const { queryResults } = useDataQueriesContext();\n\n  if (error) {\n    return <ErrorAlert error={error} />;\n  }\n\n  if (isLoading) {\n    return null;\n  }\n\n  if (!plugin) {\n    throw new Error(`Missing implementation for panel plugin with kind '${kind}'`);\n  }\n\n  const { panelOptionsEditorComponents, hideQueryEditor, supportsAnnotations } = plugin as PanelPlugin;\n  let tabs: OptionsEditorTabsProps['tabs'] = [];\n\n  if (!hideQueryEditor) {\n    tabs.push({\n      label: 'Query',\n      content: (\n        <Controller\n          control={control}\n          name=\"panelDefinition.spec.queries\"\n          render={({ field }) => (\n            <MultiQueryEditor\n              ref={ref}\n              queryTypes={plugin.supportedQueryTypes ?? []}\n              queries={panelDefinition.spec.queries ?? []}\n              queryResults={queryResults}\n              onChange={(queries) => {\n                field.onChange(queries);\n                onQueriesChange(queries);\n              }}\n              onQueryRun={(index, query) => {\n                onQueryRun(index, query);\n                // If spec has not changed, refetch to update the data\n                if (JSON.stringify(panelDefinition.spec.queries?.[index]) === JSON.stringify(query)) {\n                  queryResults[index]?.refetch?.();\n                }\n              }}\n            />\n          )}\n        />\n      ),\n    });\n  }\n\n  if (panelOptionsEditorComponents) {\n    tabs = tabs.concat(\n      panelOptionsEditorComponents.map(({ label, content: OptionsEditorComponent }) => ({\n        label,\n        content: (\n          <Controller\n            control={control}\n            name=\"panelDefinition.spec.plugin.spec\"\n            render={({ field }) => (\n              <OptionsEditorComponent\n                value={panelDefinition.spec.plugin.spec}\n                onChange={(spec) => {\n                  field.onChange(spec);\n                  onPluginSpecChange(spec);\n                }}\n              />\n            )}\n          />\n        ),\n      }))\n    );\n  }\n\n  // annotations are common to all panel plugins, but only shown for plugins that render them\n  if (supportsAnnotations) {\n    tabs.push({\n      label: 'Annotations',\n      content: (\n        <Controller\n          control={control}\n          name=\"panelDefinition.spec.annotations\"\n          render={({ field }) => (\n            <PanelAnnotationsEditor\n              value={panelDefinition.spec.annotations ?? []}\n              onChange={(annotations) => field.onChange(annotations)}\n            />\n          )}\n        />\n      ),\n    });\n  }\n\n  // always show json editor and links editor by default\n  tabs.push({\n    label: 'Links',\n    content: <LinksEditor control={control} />,\n  });\n  tabs.push({\n    label: 'JSON',\n    content: (\n      <Controller\n        control={control}\n        name=\"panelDefinition\"\n        render={({ field }) => (\n          <JSONEditor\n            maxHeight=\"80vh\"\n            value={panelDefinition}\n            onChange={(json) => {\n              field.onChange(JSON.parse(json));\n              onJSONChange(json);\n            }}\n          />\n        )}\n      />\n    ),\n  });\n\n  return <OptionsEditorTabs key={tabs.length} tabs={tabs} />;\n});\n\nPanelSpecEditor.displayName = 'PanelSpecEditor';\n"],"names":["ErrorAlert","JSONEditor","Controller","forwardRef","LinksEditor","useDataQueriesContext","usePlugin","OptionsEditorTabs","MultiQueryEditor","PanelAnnotationsEditor","PanelSpecEditor","props","ref","control","panelDefinition","onQueriesChange","onQueryRun","onPluginSpecChange","onJSONChange","kind","spec","plugin","data","isLoading","error","queryResults","Error","panelOptionsEditorComponents","hideQueryEditor","supportsAnnotations","tabs","push","label","content","name","render","field","queryTypes","supportedQueryTypes","queries","onChange","index","query","JSON","stringify","refetch","concat","map","OptionsEditorComponent","value","annotations","maxHeight","json","parse","length","displayName"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/PanelSpecEditor/PanelSpecEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ErrorAlert, JSONEditor } from '@perses-dev/components';\nimport type { AnnotationSpec, PanelDefinition, QueryDefinition, UnknownSpec } from '@perses-dev/spec';\nimport type { ReactElement } from 'react';\nimport { forwardRef } from 'react';\nimport type { Control } from 'react-hook-form';\nimport { Controller } from 'react-hook-form';\n\nimport type { PanelEditorValues, PanelPlugin } from '../../model';\nimport { useDataQueriesContext, usePlugin } from '../../runtime';\nimport type { PanelGroup, VariableDefinitionGroup } from '../LayoutEditor';\nimport { LayoutEditor } from '../LayoutEditor';\nimport { LinksEditor } from '../LinksEditor';\nimport { MultiQueryEditor } from '../MultiQueryEditor';\nimport type { OptionsEditorTabsProps } from '../OptionsEditorTabs';\nimport { OptionsEditorTabs } from '../OptionsEditorTabs';\nimport type { PluginEditorRef } from '../PluginEditor';\nimport { PanelAnnotationsEditor } from './PanelAnnotationsEditor';\n\nexport interface PanelSpecEditorProps {\n  control: Control<PanelEditorValues>;\n  panelDefinition: PanelDefinition;\n  variableDefinitionGroups: VariableDefinitionGroup[];\n  panelGroups?: PanelGroup[];\n  onQueriesChange: (queries: QueryDefinition[]) => void;\n  onQueryRun: (index: number, query: QueryDefinition) => void;\n  onPluginSpecChange: (spec: UnknownSpec) => void;\n  onAnnotationsChange: (annotations: AnnotationSpec[]) => void;\n  onJSONChange: (panelDefinitionStr: string) => void;\n}\n\nexport const PanelSpecEditor = forwardRef<PluginEditorRef, PanelSpecEditorProps>((props, ref): ReactElement | null => {\n  const {\n    control,\n    panelDefinition,\n    variableDefinitionGroups,\n    panelGroups,\n    onQueriesChange,\n    onQueryRun,\n    onPluginSpecChange,\n    onAnnotationsChange,\n    onJSONChange,\n  } = props;\n  const { kind } = panelDefinition.spec.plugin;\n  const { data: plugin, isLoading, error } = usePlugin('Panel', kind);\n\n  const { queryResults } = useDataQueriesContext();\n\n  if (error) {\n    return <ErrorAlert error={error} />;\n  }\n\n  if (isLoading) {\n    return null;\n  }\n\n  if (!plugin) {\n    throw new Error(`Missing implementation for panel plugin with kind '${kind}'`);\n  }\n\n  const { panelOptionsEditorComponents, hideQueryEditor, supportsAnnotations } = plugin as PanelPlugin;\n  let tabs: OptionsEditorTabsProps['tabs'] = [];\n\n  if (!hideQueryEditor) {\n    tabs.push({\n      label: 'Query',\n      content: (\n        <Controller\n          control={control}\n          name=\"panelDefinition.spec.queries\"\n          render={({ field }) => (\n            <MultiQueryEditor\n              ref={ref}\n              queryTypes={plugin.supportedQueryTypes ?? []}\n              queries={panelDefinition.spec.queries ?? []}\n              queryResults={queryResults}\n              onChange={(queries) => {\n                field.onChange(queries);\n                onQueriesChange(queries);\n              }}\n              onQueryRun={(index, query) => {\n                onQueryRun(index, query);\n                // If spec has not changed, refetch to update the data\n                if (JSON.stringify(panelDefinition.spec.queries?.[index]) === JSON.stringify(query)) {\n                  queryResults[index]?.refetch?.();\n                }\n              }}\n            />\n          )}\n        />\n      ),\n    });\n  }\n\n  if (panelOptionsEditorComponents) {\n    tabs = tabs.concat(\n      panelOptionsEditorComponents.map(({ label, content: OptionsEditorComponent }) => ({\n        label,\n        content: (\n          <Controller\n            control={control}\n            name=\"panelDefinition.spec.plugin.spec\"\n            render={({ field }) => (\n              <OptionsEditorComponent\n                value={panelDefinition.spec.plugin.spec}\n                onChange={(spec) => {\n                  field.onChange(spec);\n                  onPluginSpecChange(spec);\n                }}\n              />\n            )}\n          />\n        ),\n      })),\n    );\n  }\n\n  // annotations are common to all panel plugins, but only shown for plugins that render them\n  if (supportsAnnotations) {\n    tabs.push({\n      label: 'Annotations',\n      content: (\n        <Controller\n          control={control}\n          name=\"panelDefinition.spec.annotations\"\n          render={({ field }) => (\n            <PanelAnnotationsEditor\n              value={panelDefinition.spec.annotations ?? []}\n              onChange={(annotations) => {\n                field.onChange(annotations);\n                onAnnotationsChange(annotations);\n              }}\n            />\n          )}\n        />\n      ),\n    });\n  }\n\n  // Always show the JSON editor, Links editor, and Layout editor by default.\n  tabs.push({\n    label: 'Links',\n    content: <LinksEditor control={control} />,\n  });\n  tabs.push({\n    label: 'JSON',\n    content: (\n      <Controller\n        control={control}\n        name=\"panelDefinition\"\n        render={({ field }) => (\n          <JSONEditor\n            maxHeight=\"80vh\"\n            value={panelDefinition}\n            onChange={(json) => {\n              field.onChange(JSON.parse(json));\n              onJSONChange(json);\n            }}\n          />\n        )}\n      />\n    ),\n  });\n  tabs.push({\n    label: 'Layout',\n    content: (\n      <LayoutEditor control={control} variableDefinitionGroups={variableDefinitionGroups} panelGroups={panelGroups} />\n    ),\n  });\n\n  return <OptionsEditorTabs key={tabs.length} tabs={tabs} />;\n});\n\nPanelSpecEditor.displayName = 'PanelSpecEditor';\n"],"names":["ErrorAlert","JSONEditor","forwardRef","Controller","useDataQueriesContext","usePlugin","LayoutEditor","LinksEditor","MultiQueryEditor","OptionsEditorTabs","PanelAnnotationsEditor","PanelSpecEditor","props","ref","control","panelDefinition","variableDefinitionGroups","panelGroups","onQueriesChange","onQueryRun","onPluginSpecChange","onAnnotationsChange","onJSONChange","kind","spec","plugin","data","isLoading","error","queryResults","Error","panelOptionsEditorComponents","hideQueryEditor","supportsAnnotations","tabs","push","label","content","name","render","field","queryTypes","supportedQueryTypes","queries","onChange","index","query","JSON","stringify","refetch","concat","map","OptionsEditorComponent","value","annotations","maxHeight","json","parse","length","displayName"],"mappings":"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"}

package/dist/components/PanelSpecEditor/index.js

@@ -10,6 +10,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-export * from './PanelSpecEditor';
+export * from "./PanelSpecEditor.js";
 
 //# sourceMappingURL=index.js.map

package/dist/components/PanelSpecEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelSpecEditor/index.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PanelSpecEditor';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,oBAAoB"}
+{"version":3,"sources":["../../../src/components/PanelSpecEditor/index.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PanelSpecEditor';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,uBAAoB"}

package/dist/components/PluginEditor/PluginEditor.d.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from 'react';
-import { PluginEditorProps } from './plugin-editor-api';
+import type { ReactElement } from 'react';
+import type { PluginEditorProps } from './plugin-editor-api';
 /**
  * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property
  * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's

package/dist/components/PluginEditor/PluginEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PluginEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,YAAY,EAAe,MAAM,OAAO,CAAC;AAIlD,OAAO,EAAE,iBAAiB,EAAmB,MAAM,qBAAqB,CAAC;AAEzE;;;;;;;GAOG;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAwEnE"}
+{"version":3,"file":"PluginEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAG7D;;;;;;;GAOG;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CA0EnE"}

package/dist/components/PluginEditor/PluginEditor.js

@@ -11,13 +11,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Box, Button } from '@mui/material';
-import Reload from 'mdi-material-ui/Reload';
-import { ErrorAlert, ErrorBoundary } from '@perses-dev/components';
-import { useCallback } from 'react';
-import { PluginKindSelect } from '../PluginKindSelect';
-import { PluginSpecEditor } from '../PluginSpecEditor';
-import { usePluginEditor } from './plugin-editor-api';
+import { Box, Button } from "@mui/material";
+import { ErrorAlert, ErrorBoundary } from "@perses-dev/components";
+import Reload from "mdi-material-ui/Reload";
+import { useCallback } from "react";
+import { PluginKindSelect } from "../PluginKindSelect/index.js";
+import { PluginSpecEditor } from "../PluginSpecEditor/index.js";
+import { usePluginEditor } from "./plugin-editor-api.js";
 /**
  * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property
  * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's
@@ -26,7 +26,7 @@ import { usePluginEditor } from './plugin-editor-api';
  * previous plugin's spec state. If you just want this behavior, but in a different UI layout from this, try the
  * `usePluginEditor` hook that powers this component.
  */ export function PluginEditor(props) {
-    const { value, withRunQueryButton = true, pluginTypes, pluginKindLabel, onChange: _, isReadonly, onRunQuery, filteredQueryPlugins, ...others } = props;
+    const { value, withRunQueryButton = true, pluginTypes, pluginKindLabel, onChange: _, isReadonly, onRunQuery, filteredQueryPlugins, testConnection, ...others } = props;
     const { pendingSelection, isLoading, error, onSelectionChange, onSpecChange } = usePluginEditor(props);
     const handleSpecChange = useCallback((nextSpec)=>{
         onSpecChange(nextSpec);
@@ -82,7 +82,8 @@ import { usePluginEditor } from './plugin-editor-api';
                     pluginSelection: value.selection,
                     value: value.spec,
                     onChange: handleSpecChange,
-                    isReadonly: isReadonly
+                    isReadonly: isReadonly,
+                    testConnection: testConnection
                 })
             })
         ]

package/dist/components/PluginEditor/PluginEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Button } from '@mui/material';\nimport Reload from 'mdi-material-ui/Reload';\nimport { ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport { ReactElement, useCallback } from 'react';\nimport { UnknownSpec } from '@perses-dev/spec';\nimport { PluginKindSelect } from '../PluginKindSelect';\nimport { PluginSpecEditor } from '../PluginSpecEditor';\nimport { PluginEditorProps, usePluginEditor } from './plugin-editor-api';\n\n/**\n * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property\n * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's\n * editor component. It takes care of transitioning from one plugin kind to another \"all at once\" so that when the\n * plugin's kind changes, the spec is also changed at the same time so those options editor components don't see a\n * previous plugin's spec state. If you just want this behavior, but in a different UI layout from this, try the\n * `usePluginEditor` hook that powers this component.\n */\n\nexport function PluginEditor(props: PluginEditorProps): ReactElement {\n  const {\n    value,\n    withRunQueryButton = true,\n    pluginTypes,\n    pluginKindLabel,\n    onChange: _,\n    isReadonly,\n    onRunQuery,\n    filteredQueryPlugins,\n    ...others\n  } = props;\n\n  const { pendingSelection, isLoading, error, onSelectionChange, onSpecChange } = usePluginEditor(props);\n\n  const handleSpecChange = useCallback(\n    (nextSpec: UnknownSpec) => {\n      onSpecChange(nextSpec);\n    },\n    [onSpecChange]\n  );\n\n  return (\n    <Box {...others}>\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n          mb: 1,\n        }}\n      >\n        <PluginKindSelect\n          fullWidth={false}\n          sx={{ minWidth: 120 }}\n          margin=\"dense\"\n          label={pluginKindLabel}\n          pluginTypes={pluginTypes}\n          disabled={isLoading}\n          value={pendingSelection ? pendingSelection : value.selection}\n          slotProps={{ input: { readOnly: isReadonly } }}\n          error={!!error}\n          helperText={error?.message}\n          onChange={onSelectionChange}\n          filteredQueryPlugins={filteredQueryPlugins}\n        />\n\n        {withRunQueryButton && (\n          <Button\n            data-testid=\"run_query_button\"\n            variant=\"contained\"\n            startIcon={<Reload />}\n            onClick={onRunQuery}\n            disabled={isLoading}\n          >\n            Run Query\n          </Button>\n        )}\n      </Box>\n\n      <ErrorBoundary FallbackComponent={ErrorAlert}>\n        <PluginSpecEditor\n          pluginSelection={value.selection}\n          value={value.spec}\n          onChange={handleSpecChange}\n          isReadonly={isReadonly}\n        />\n      </ErrorBoundary>\n    </Box>\n  );\n}\n"],"names":["Box","Button","Reload","ErrorAlert","ErrorBoundary","useCallback","PluginKindSelect","PluginSpecEditor","usePluginEditor","PluginEditor","props","value","withRunQueryButton","pluginTypes","pluginKindLabel","onChange","_","isReadonly","onRunQuery","filteredQueryPlugins","others","pendingSelection","isLoading","error","onSelectionChange","onSpecChange","handleSpecChange","nextSpec","sx","display","flexDirection","alignItems","justifyContent","gap","mb","fullWidth","minWidth","margin","label","disabled","selection","slotProps","input","readOnly","helperText","message","data-testid","variant","startIcon","onClick","FallbackComponent","pluginSelection","spec"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,MAAM,QAAQ,gBAAgB;AAC5C,OAAOC,YAAY,yBAAyB;AAC5C,SAASC,UAAU,EAAEC,aAAa,QAAQ,yBAAyB;AACnE,SAAuBC,WAAW,QAAQ,QAAQ;AAElD,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAA4BC,eAAe,QAAQ,sBAAsB;AAEzE;;;;;;;CAOC,GAED,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EACJC,KAAK,EACLC,qBAAqB,IAAI,EACzBC,WAAW,EACXC,eAAe,EACfC,UAAUC,CAAC,EACXC,UAAU,EACVC,UAAU,EACVC,oBAAoB,EACpB,GAAGC,QACJ,GAAGV;IAEJ,MAAM,EAAEW,gBAAgB,EAAEC,SAAS,EAAEC,KAAK,EAAEC,iBAAiB,EAAEC,YAAY,EAAE,GAAGjB,gBAAgBE;IAEhG,MAAMgB,mBAAmBrB,YACvB,CAACsB;QACCF,aAAaE;IACf,GACA;QAACF;KAAa;IAGhB,qBACE,MAACzB;QAAK,GAAGoB,MAAM;;0BACb,MAACpB;gBACC4B,IAAI;oBACFC,SAAS;oBACTC,eAAe;oBACfC,YAAY;oBACZC,gBAAgB;oBAChBC,KAAK;oBACLC,IAAI;gBACN;;kCAEA,KAAC5B;wBACC6B,WAAW;wBACXP,IAAI;4BAAEQ,UAAU;wBAAI;wBACpBC,QAAO;wBACPC,OAAOxB;wBACPD,aAAaA;wBACb0B,UAAUjB;wBACVX,OAAOU,mBAAmBA,mBAAmBV,MAAM6B,SAAS;wBAC5DC,WAAW;4BAAEC,OAAO;gCAAEC,UAAU1B;4BAAW;wBAAE;wBAC7CM,OAAO,CAAC,CAACA;wBACTqB,YAAYrB,OAAOsB;wBACnB9B,UAAUS;wBACVL,sBAAsBA;;oBAGvBP,oCACC,KAACX;wBACC6C,eAAY;wBACZC,SAAQ;wBACRC,yBAAW,KAAC9C;wBACZ+C,SAAS/B;wBACTqB,UAAUjB;kCACX;;;;0BAML,KAAClB;gBAAc8C,mBAAmB/C;0BAChC,cAAA,KAACI;oBACC4C,iBAAiBxC,MAAM6B,SAAS;oBAChC7B,OAAOA,MAAMyC,IAAI;oBACjBrC,UAAUW;oBACVT,YAAYA;;;;;AAKtB"}
+{"version":3,"sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Button } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport type { UnknownSpec } from '@perses-dev/spec';\nimport Reload from 'mdi-material-ui/Reload';\nimport type { ReactElement } from 'react';\nimport { useCallback } from 'react';\n\nimport { PluginKindSelect } from '../PluginKindSelect';\nimport { PluginSpecEditor } from '../PluginSpecEditor';\nimport type { PluginEditorProps } from './plugin-editor-api';\nimport { usePluginEditor } from './plugin-editor-api';\n\n/**\n * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property\n * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's\n * editor component. It takes care of transitioning from one plugin kind to another \"all at once\" so that when the\n * plugin's kind changes, the spec is also changed at the same time so those options editor components don't see a\n * previous plugin's spec state. If you just want this behavior, but in a different UI layout from this, try the\n * `usePluginEditor` hook that powers this component.\n */\n\nexport function PluginEditor(props: PluginEditorProps): ReactElement {\n  const {\n    value,\n    withRunQueryButton = true,\n    pluginTypes,\n    pluginKindLabel,\n    onChange: _,\n    isReadonly,\n    onRunQuery,\n    filteredQueryPlugins,\n    testConnection,\n    ...others\n  } = props;\n\n  const { pendingSelection, isLoading, error, onSelectionChange, onSpecChange } = usePluginEditor(props);\n\n  const handleSpecChange = useCallback(\n    (nextSpec: UnknownSpec) => {\n      onSpecChange(nextSpec);\n    },\n    [onSpecChange],\n  );\n\n  return (\n    <Box {...others}>\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n          mb: 1,\n        }}\n      >\n        <PluginKindSelect\n          fullWidth={false}\n          sx={{ minWidth: 120 }}\n          margin=\"dense\"\n          label={pluginKindLabel}\n          pluginTypes={pluginTypes}\n          disabled={isLoading}\n          value={pendingSelection ? pendingSelection : value.selection}\n          slotProps={{ input: { readOnly: isReadonly } }}\n          error={!!error}\n          helperText={error?.message}\n          onChange={onSelectionChange}\n          filteredQueryPlugins={filteredQueryPlugins}\n        />\n\n        {withRunQueryButton && (\n          <Button\n            data-testid=\"run_query_button\"\n            variant=\"contained\"\n            startIcon={<Reload />}\n            onClick={onRunQuery}\n            disabled={isLoading}\n          >\n            Run Query\n          </Button>\n        )}\n      </Box>\n\n      <ErrorBoundary FallbackComponent={ErrorAlert}>\n        <PluginSpecEditor\n          pluginSelection={value.selection}\n          value={value.spec}\n          onChange={handleSpecChange}\n          isReadonly={isReadonly}\n          testConnection={testConnection}\n        />\n      </ErrorBoundary>\n    </Box>\n  );\n}\n"],"names":["Box","Button","ErrorAlert","ErrorBoundary","Reload","useCallback","PluginKindSelect","PluginSpecEditor","usePluginEditor","PluginEditor","props","value","withRunQueryButton","pluginTypes","pluginKindLabel","onChange","_","isReadonly","onRunQuery","filteredQueryPlugins","testConnection","others","pendingSelection","isLoading","error","onSelectionChange","onSpecChange","handleSpecChange","nextSpec","sx","display","flexDirection","alignItems","justifyContent","gap","mb","fullWidth","minWidth","margin","label","disabled","selection","slotProps","input","readOnly","helperText","message","data-testid","variant","startIcon","onClick","FallbackComponent","pluginSelection","spec"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,MAAM,QAAQ,gBAAgB;AAC5C,SAASC,UAAU,EAAEC,aAAa,QAAQ,yBAAyB;AAEnE,OAAOC,YAAY,yBAAyB;AAE5C,SAASC,WAAW,QAAQ,QAAQ;AAEpC,SAASC,gBAAgB,QAAQ,+BAAsB;AACvD,SAASC,gBAAgB,QAAQ,+BAAsB;AAEvD,SAASC,eAAe,QAAQ,yBAAsB;AAEtD;;;;;;;CAOC,GAED,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EACJC,KAAK,EACLC,qBAAqB,IAAI,EACzBC,WAAW,EACXC,eAAe,EACfC,UAAUC,CAAC,EACXC,UAAU,EACVC,UAAU,EACVC,oBAAoB,EACpBC,cAAc,EACd,GAAGC,QACJ,GAAGX;IAEJ,MAAM,EAAEY,gBAAgB,EAAEC,SAAS,EAAEC,KAAK,EAAEC,iBAAiB,EAAEC,YAAY,EAAE,GAAGlB,gBAAgBE;IAEhG,MAAMiB,mBAAmBtB,YACvB,CAACuB;QACCF,aAAaE;IACf,GACA;QAACF;KAAa;IAGhB,qBACE,MAAC1B;QAAK,GAAGqB,MAAM;;0BACb,MAACrB;gBACC6B,IAAI;oBACFC,SAAS;oBACTC,eAAe;oBACfC,YAAY;oBACZC,gBAAgB;oBAChBC,KAAK;oBACLC,IAAI;gBACN;;kCAEA,KAAC7B;wBACC8B,WAAW;wBACXP,IAAI;4BAAEQ,UAAU;wBAAI;wBACpBC,QAAO;wBACPC,OAAOzB;wBACPD,aAAaA;wBACb2B,UAAUjB;wBACVZ,OAAOW,mBAAmBA,mBAAmBX,MAAM8B,SAAS;wBAC5DC,WAAW;4BAAEC,OAAO;gCAAEC,UAAU3B;4BAAW;wBAAE;wBAC7CO,OAAO,CAAC,CAACA;wBACTqB,YAAYrB,OAAOsB;wBACnB/B,UAAUU;wBACVN,sBAAsBA;;oBAGvBP,oCACC,KAACX;wBACC8C,eAAY;wBACZC,SAAQ;wBACRC,yBAAW,KAAC7C;wBACZ8C,SAAShC;wBACTsB,UAAUjB;kCACX;;;;0BAML,KAACpB;gBAAcgD,mBAAmBjD;0BAChC,cAAA,KAACK;oBACC6C,iBAAiBzC,MAAM8B,SAAS;oBAChC9B,OAAOA,MAAM0C,IAAI;oBACjBtC,UAAUY;oBACVV,YAAYA;oBACZG,gBAAgBA;;;;;AAK1B"}

package/dist/components/PluginEditor/index.js

@@ -10,7 +10,7 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-export * from './PluginEditor';
-export * from './plugin-editor-api';
+export * from "./PluginEditor.js";
+export * from "./plugin-editor-api.js";
 
 //# sourceMappingURL=index.js.map

package/dist/components/PluginEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginEditor/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PluginEditor';\nexport * from './plugin-editor-api';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,iBAAiB;AAC/B,cAAc,sBAAsB"}
+{"version":3,"sources":["../../../src/components/PluginEditor/index.ts"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PluginEditor';\nexport * from './plugin-editor-api';\n"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,oBAAiB;AAC/B,cAAc,yBAAsB"}

package/dist/components/PluginEditor/plugin-editor-api.d.ts

@@ -1,6 +1,6 @@
-import { BoxProps } from '@mui/material';
-import { UnknownSpec } from '@perses-dev/spec';
-import { PluginType } from '../../model';
+import type { BoxProps } from '@mui/material';
+import type { DatasourceSpec, UnknownSpec } from '@perses-dev/spec';
+import type { PluginType } from '../../model';
 export interface PluginEditorSelection {
     type: PluginType;
     kind: string;
@@ -19,6 +19,7 @@ export interface PluginEditorProps extends Omit<BoxProps, OmittedMuiProps> {
     filteredQueryPlugins?: string[];
     onChange: (next: PluginEditorValue) => void;
     onRunQuery?: () => void;
+    testConnection?: (spec: DatasourceSpec, healthCheckPath: string) => Promise<void>;
 }
 export interface PluginEditorRef {
     flushChanges?: () => void;

package/dist/components/PluginEditor/plugin-editor-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin-editor-api.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAe,UAAU,EAAE,MAAM,aAAa,CAAC;AAMtD,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,UAAU,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,qBAAqB,CAAC;IACjC,IAAI,EAAE,WAAW,CAAC;CACnB;AAID,KAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,QAAQ,EAAE,eAAe,CAAC;IACxE,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,iBAAiB,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,QAAQ,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAKD;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,iBAAiB,EAAE,aAAa,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IACjG,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG;IAC5D,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,iBAAiB,EAAE,CAAC,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,YAAY,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC1C,wBAAwB,EAAE,MAAM,IAAI,CAAC;CACtC,CAkIA"}
+{"version":3,"file":"plugin-editor-api.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAIpE,OAAO,KAAK,EAAe,UAAU,EAAE,MAAM,aAAa,CAAC;AAM3D,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,UAAU,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,qBAAqB,CAAC;IACjC,IAAI,EAAE,WAAW,CAAC;CACnB;AAID,KAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,QAAQ,EAAE,eAAe,CAAC;IACxE,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,iBAAiB,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,QAAQ,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACnF;AAED,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAKD;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,iBAAiB,EAAE,aAAa,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IACjG,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG;IAC5D,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,iBAAiB,EAAE,CAAC,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,YAAY,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC1C,wBAAwB,EAAE,MAAM,IAAI,CAAC;CACtC,CAkIA"}

package/dist/components/PluginEditor/plugin-editor-api.js

@@ -10,10 +10,10 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { useState, useRef, useEffect } from 'react';
-import { produce } from 'immer';
-import { usePlugin, usePluginRegistry } from '../../runtime';
-import { useEvent } from '../../utils';
+import { produce } from "immer";
+import { useState, useRef, useEffect } from "react";
+import { usePlugin, usePluginRegistry } from "../../runtime/index.js";
+import { useEvent } from "../../utils/index.js";
 /**
  * Returns the state/handlers that power the `PluginEditor` component. Useful for custom components that want to provide
  * a different UI, but want the same behavior of changing `kind` and `spec` together on plugin kind changes. Also