@splunk/dynamic-editors 0.44.2 → 0.44.4

package/containers/EditorLayoutItem.js

@@ -164,7 +164,7 @@ e.exports=function(){"use strict";function e(e,t){if("undefined"==typeof documen
     width: ${(0,s.toPx)(T.FLYOUT_WIDTH)};
 `,S=(0,f.default)(c.default)`
     padding: '4px';
-`;t.prepareUpdate=({name:e,selectedDataSelector:t,selectedFormatterType:n,currentFormatterConfig:r})=>{const o=`${e}EditorConfig`,a=o.replace(/^\w+\[\d+\]\.(.+)$/,"$1");return{options:{[e]:(0,g.buildDSLFromDataSelectorAndFormatter)(t,n,o)},context:{[a]:r}}};t.DynamicColorEditor=({name:e,value:n,label:r="",labelPosition:o="left",labelWidth:a,context:i,onChange:s=(()=>{}),flyoutTitle:c=(0,p._)("Dynamic coloring"),formatters:f=[],dataSelectors:T=[],defaultPalettesConfig:k=h.defaultPalettesConfig,isDisabled:I=!1,showStaticTextColor:N=!1,colorMode:P,handleColorModeChange:R})=>{const[L,M]=v(!1),F=y(null),{type:w,paramKey:B}=(0,g.getLastFormatterFromDSL)(n)||{type:"unknown",paramKey:"unknown"},j=(0,g.getDataSelectorsFromDSL)(n)[0],[H,U]=v(w);A((()=>{U(w)}),[w]);const[G,z]=v(j);A((()=>{z(j)}),[j]);const V=(0,_.getFormatterConfig)({contextConfig:i[B],formatters:f,formatterFromDSL:w,selectedDataSelector:G}),[q,Y]=v(V);A((()=>{Y(V)}),[i,f,B,w,j]);const W=n=>{const r=(0,m.find)(f,(e=>e.isDefault))||(0,m.find)(f,(e=>"rangeValue"===e.value))||f[0];if((0,m.isEmpty)(r))return;const o=r.value,a=Object.keys(r.defaults)[0],i=r.defaults[a];z(a),U(o),Y(i),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:a,selectedFormatterType:o,currentFormatterConfig:i}))},$=l.useCallback((()=>{M((e=>!e))}),[]);if(!(0,_.isSupportedDataSelector)({selectedDataSelector:G,dataSelectors:T})||!(0,_.isSupportedFormatter)({selectedFormatterType:H,formattersFromEditor:f,supportedFormatters:b.supportedFormatters}))return l.createElement(C.default,{label:r,labelPosition:o,labelWidth:a,onResetToDefault:W});const K=b.supportedFormatters[H].preview;return l.createElement(l.Fragment,null,l.createElement(u.default,{"data-test":"DynamicColorEditorGroup",label:r,labelPosition:o,labelWidth:a},l.createElement(S,{inline:!1,"data-test":"DynamicColorEditorButton",appearance:"default",ref:F,onClick:$,disabled:I},l.createElement(K,{"data-test":"FormatterConfigPreview",config:q}))),l.createElement(d.default,{"data-test":"DynamicColorEditorFlyout",open:L,anchor:F.current,defaultPlacement:"horizontal",style:{padding:"10px"},onRequestClose:()=>M(!1),takeFocus:!0},l.createElement(x,null,!P&&l.createElement(D,null,c),P&&l.createElement(u.default,{"data-test":"TableDynamicColorEditorGroup",label:c,labelPosition:o,labelWidth:a},l.createElement(E.default,{value:P,onChange:R},[{label:(0,p._)("Off"),value:"off"},{label:(0,p._)("Text"),value:"text"},{label:(0,p._)("Background"),value:"background"}].map((({label:e,value:t})=>l.createElement(E.default.Option,{key:t,value:t,label:(0,p._)(e)}))))),P&&l.createElement(O,null,(0,p._)("Method")),l.createElement(b.FormatterEditor,{selectedDataSelector:G,selectedFormatterType:H,currentFormatterConfig:q,onDataSelectorChange:(n,r,o)=>{z(o);const a=(0,m.find)(f,(e=>e.defaults[o]));U(a.value);const i=a.defaults[o];Y(i),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:o,selectedFormatterType:a.value,currentFormatterConfig:i}))},onFormatterTypeChange:(n,r,o)=>{U(o);const a=(0,m.find)(f,["value",o]).defaults[G];Y(a),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:G,selectedFormatterType:o,currentFormatterConfig:a}))},onFormatterConfigChange:(n,r,o)=>{Y(o),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:G,selectedFormatterType:H,currentFormatterConfig:o}))},formatters:f,dataSelectors:T,defaultPalettesConfig:k,showStaticTextColor:N}))))}},8281:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.DynamicColorEditorWithPrecedence=void 0;const l=a(n(9497)),s=n(6649),u=n(5089),c=n(333),d=n(152),f=i(n(2065)),p=n(1027),h=Object.assign({},c.DynamicColorEditorPropTypes);t.DynamicColorEditorWithPrecedence=({name:e,value:t,label:n="",labelPosition:r,labelWidth:o,context:a,flyoutTitle:i=(0,s._)("Dynamic coloring"),formatters:c=[],dataSelectors:h=[],defaultPalettesConfig:m=u.defaultPalettesConfig,tooltip:g,options:E={},onChange:b=(()=>{})})=>{const C=l.useCallback((e=>{if(!e||""===e)return!0;if("string"==typeof e){return null!==/^>\s*areaValues\s*\|\s*gradient\(\s*\)$/.exec(e)}return!1}),[]),[T,_]=l.useState(!C(t));l.useEffect((()=>{_(!C(t))}),[t,C]);const y=l.useCallback(((n,r)=>{var o,i,l,s,u,d;_((e=>!e));const f={},m={};if(T){const t=h.map((e=>e.value));f[e]=(0,p.getToggleOffValueForDataColors)({name:e,options:E,dataSelectors:t}),a&&void 0!==a.dataColorsEditorConfig&&(m.dataColorsEditorConfig=void 0)}else{if("string"==typeof t&&null!==/^>\s*areaValues\s*\|\s*gradient\(\s*\)$/.exec(t)){f[e]="> areaValues | gradient(dataColorsEditorConfig)";const t=null===(i=null===(o=c.find((e=>"gradient"===e.value)))||void 0===o?void 0:o.defaults)||void 0===i?void 0:i.areaValues;t&&(m.dataColorsEditorConfig=t)}else if(e.endsWith("dataColors")){const t=null===(l=h[0])||void 0===l?void 0:l.value,n=null===(s=c[0])||void 0===s?void 0:s.value,r=null===(d=null===(u=c[0])||void 0===u?void 0:u.defaults)||void 0===d?void 0:d[t];if(!t||!n||!r)return;f[e]=`> ${h[0].value} | ${n}(dataColorsEditorConfig)`,m.dataColorsEditorConfig=r}}b(n,{options:f,context:m})}),[a,h,c,T,e,b,E,t]),v=l.useCallback(((e,t)=>{b(e,t)}),[b]);return l.createElement("div",{"data-test":"dynamic-color-toggle"},l.createElement(f.default,{name:e,label:(0,s._)("Dynamic coloring"),labelPosition:"right",value:T,onChange:y,itemSchema:{type:"boolean"},help:g}),T&&l.createElement("div",{"data-test":"dynamic-color-editor"},l.createElement(d.DynamicColorEditor,{name:e,label:n,labelPosition:r,labelWidth:o,value:t,context:a,onChange:v,flyoutTitle:i,formatters:c,dataSelectors:h,defaultPalettesConfig:m})))},t.DynamicColorEditorWithPrecedence.propTypes=h},7585:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const l=a(n(9497)),s=a(n(23)),u=n(4793),c=i(n(4082)),d=i(n(9250)),f=i(n(7143)),p=n(6649),h=i(n(5731)),m=i(n(5456)),g=n(4381),E=n(5862),b=(0,p._)("Advanced configuration options are being used by this input. Please edit in source mode."),C=({name:e,context:t,value:n="",label:r,onChange:o,dataSourceBindings:a,labelPosition:i="top",labelWidth:s,help:C=b,validate:T})=>{const[_,y]=l.useState([]),[v,A]=l.useState(""),[D,O]=l.useState("");l.useEffect((()=>{const{staticOptions:e,dynamicOptionsLabel:r,dynamicOptionsValue:o}=(0,g.getDynamicOptionsFromConfig)({items:n,context:t});y(e),A(r),O(o)}),[n,t]),l.useEffect((()=>{void 0!==a.primary||Array.isArray(n)||o(null,{context:{formattedConfig:void 0,formattedStatics:void 0,statics:void 0,label:void 0,value:void 0},options:{[e]:_}})}),[a,e,n,o,_]);const x=l.useCallback(((t,r,a)=>{if(Array.isArray(n)&&(!r||!a))o(null,{options:{[e]:t}});else{const n=(0,u.unzip)(t.map((({label:e,value:t})=>[e,t])));o(null,{context:{formattedConfig:{number:{prefix:""}},formattedStatics:">statics | formatByType(formattedConfig)",statics:n,label:`>primary | seriesByName("${r}") | renameSeries("label") | formatByType(formattedConfig)`,value:`>primary | seriesByName("${a}") | renameSeries("value") | formatByType(formattedConfig)`},options:{[e]:">frame(label, value) | prepend(formattedStatics) | objects()"}})}}),[e,n,o]),S=l.useCallback(((e,t,n)=>{x(n,v,D)}),[x,v,D]),k=l.useCallback(((e,{value:t})=>{""===D?A(t):x(_,t,D)}),[x,_,D]),I=l.useCallback(((e,{value:t})=>{""===v?O(t):x(_,v,t)}),[x,_,v]),N=e=>t=>{var n;const r=null===(n=null==t?void 0:t.options)||void 0===n?void 0:n[e];return"string"==typeof r?{value:(0,g.getFieldFromFieldNameDsl)(r)}:{value:""}};if(l.useMemo((()=>(0,g.isConfigAdvanced)({items:n,context:t})),[n,t]))return l.createElement(d.default,{label:(0,p._)(r),labelPosition:i,labelWidth:s,help:C},l.createElement(c.default,{key:n.toString(),"data-test":e,disabled:!0,defaultValue:n.toString()}));const P=!!a.primary;return l.createElement(l.Fragment,null,l.createElement(m.default,{name:"",label:(0,p._)("Static menu configuration"),labelPosition:i,value:_,onChange:S,validate:T}),P&&l.createElement(f.default,{key:"dynamic-item-editor-label-value-layout",gutter:E.VERTICAL_EDITOR_SPACING},l.createElement(f.default.Row,{key:"dynamic-item-editor-label-row"},l.createElement(h.default,{name:"label",label:(0,p._)("Dynamic menu label field"),dataSourceKey:"primary",dataSourceBindings:a,value:`>primary | seriesByName("${v}")`,context:t,onChange:k,prepareValue:N("label")})),l.createElement(f.default.Row,{key:"dynamic-item-editor-value-row"},l.createElement(h.default,{name:"value",label:(0,p._)("Dynamic menu value field"),dataSourceKey:"primary",dataSourceBindings:a,value:`>primary | seriesByName("${D}")`,context:t,onChange:I,prepareValue:N("value")}))))};C.propTypes={onChange:s.func.isRequired,name:s.string.isRequired,label:s.string.isRequired,value:s.oneOfType([s.arrayOf(s.shape({label:s.string.isRequired,value:s.string.isRequired}).isRequired),s.string]),labelPosition:s.oneOf(["top","left"]),labelWidth:s.number,context:s.shape({label:s.string,value:s.string,statics:s.arrayOf(s.arrayOf(s.string.isRequired).isRequired)}).isRequired,dataSourceBindings:s.shape({primary:s.any}).isRequired,help:s.string},t.default=C},7970:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__rest||function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const s=a(n(9497)),u=a(n(23)),c=l(n(232)),d=n(2640),f=l(n(1018)),p=l(n(6447)),h=n(6649),m=n(8987),g=l(n(4703)),E=l(n(4723)),b=l(n(4784)),C=l(n(7110)),T=l(n(6078)),_=l(n(3757)),y=l(n(785)),v=l(n(6301)),A=l(n(821)),D=l(n(7020)),O=l(n(6379)),x=l(n(5905)),S=l(n(2621)),k=n(3563),I=n(5135),N=n(962),P=n(137),R=[Object.assign(Object.assign({},d.commands.heading3),{icon:s.createElement(b.default,null),name:"header"}),Object.assign(Object.assign({},d.commands.bold),{icon:s.createElement(g.default,null),name:"bold"}),Object.assign(Object.assign({},d.commands.italic),{icon:s.createElement(C.default,null),name:"italic"}),Object.assign(Object.assign({},d.commands.link),{icon:s.createElement(E.default,null),name:"link"}),Object.assign(Object.assign({},d.commands.quote),{icon:s.createElement(A.default,null),name:"quote"}),Object.assign(Object.assign({},d.commands.code),{icon:s.createElement(T.default,null),name:"code"}),Object.assign(Object.assign({},d.commands.image),{icon:s.createElement(_.default,null),name:"image"}),Object.assign(Object.assign({},d.commands.unorderedListCommand),{icon:s.createElement(y.default,null),name:"unordered-list"}),Object.assign(Object.assign({},d.commands.orderedListCommand),{icon:s.createElement(v.default,null),name:"ordered-list"})],L=c.default.div`
+`;t.prepareUpdate=({name:e,selectedDataSelector:t,selectedFormatterType:n,currentFormatterConfig:r})=>{const o=`${e}EditorConfig`,a=o.replace(/^\w+\[\d+\]\.(.+)$/,"$1");return{options:{[e]:(0,g.buildDSLFromDataSelectorAndFormatter)(t,n,o)},context:{[a]:r}}};t.DynamicColorEditor=({name:e,value:n,label:r="",labelPosition:o="left",labelWidth:a,context:i,onChange:s=(()=>{}),flyoutTitle:c=(0,p._)("Dynamic coloring"),formatters:f=[],dataSelectors:T=[],defaultPalettesConfig:k=h.defaultPalettesConfig,isDisabled:I=!1,showStaticTextColor:N=!1,colorMode:P,handleColorModeChange:R})=>{const[L,M]=v(!1),F=y(null),{type:w,paramKey:B}=(0,g.getLastFormatterFromDSL)(n)||{type:"unknown",paramKey:"unknown"},j=(0,g.getDataSelectorsFromDSL)(n)[0],[H,U]=v(w);A((()=>{U(w)}),[w]);const[G,z]=v(j);A((()=>{z(j)}),[j]);const V=(0,_.getFormatterConfig)({contextConfig:i[B],formatters:f,formatterFromDSL:w,selectedDataSelector:G}),[q,Y]=v(V);A((()=>{Y(V)}),[i,f,B,w,j]);const W=n=>{const r=(0,m.find)(f,(e=>e.isDefault))||(0,m.find)(f,(e=>"rangeValue"===e.value))||f[0];if((0,m.isEmpty)(r))return;const o=r.value,a=Object.keys(r.defaults)[0],i=r.defaults[a];z(a),U(o),Y(i),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:a,selectedFormatterType:o,currentFormatterConfig:i}))},$=l.useCallback((()=>{M((e=>!e))}),[]);if(!(0,_.isSupportedDataSelector)({selectedDataSelector:G,dataSelectors:T})||!(0,_.isSupportedFormatter)({selectedFormatterType:H,formattersFromEditor:f,supportedFormatters:b.supportedFormatters}))return l.createElement(C.default,{label:r,labelPosition:o,labelWidth:a,onResetToDefault:W});const K=b.supportedFormatters[H].preview;return l.createElement(l.Fragment,null,l.createElement(u.default,{"data-test":"DynamicColorEditorGroup",label:r,labelPosition:o,labelWidth:a},l.createElement(S,{inline:!1,"data-test":"DynamicColorEditorButton",appearance:"default","aria-label":r||c,ref:F,onClick:$,disabled:I},l.createElement(K,{"data-test":"FormatterConfigPreview",config:q}))),l.createElement(d.default,{"data-test":"DynamicColorEditorFlyout",open:L,anchor:F.current,defaultPlacement:"horizontal",style:{padding:"10px"},onRequestClose:()=>M(!1),takeFocus:!0},l.createElement(x,null,!P&&l.createElement(D,null,c),P&&l.createElement(u.default,{"data-test":"TableDynamicColorEditorGroup",label:c,labelPosition:o,labelWidth:a},l.createElement(E.default,{value:P,onChange:R},[{label:(0,p._)("Off"),value:"off"},{label:(0,p._)("Text"),value:"text"},{label:(0,p._)("Background"),value:"background"}].map((({label:e,value:t})=>l.createElement(E.default.Option,{key:t,value:t,label:(0,p._)(e)}))))),P&&l.createElement(O,null,(0,p._)("Method")),l.createElement(b.FormatterEditor,{selectedDataSelector:G,selectedFormatterType:H,currentFormatterConfig:q,onDataSelectorChange:(n,r,o)=>{z(o);const a=(0,m.find)(f,(e=>e.defaults[o]));U(a.value);const i=a.defaults[o];Y(i),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:o,selectedFormatterType:a.value,currentFormatterConfig:i}))},onFormatterTypeChange:(n,r,o)=>{U(o);const a=(0,m.find)(f,["value",o]).defaults[G];Y(a),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:G,selectedFormatterType:o,currentFormatterConfig:a}))},onFormatterConfigChange:(n,r,o)=>{Y(o),s(n,(0,t.prepareUpdate)({name:e,selectedDataSelector:G,selectedFormatterType:H,currentFormatterConfig:o}))},formatters:f,dataSelectors:T,defaultPalettesConfig:k,showStaticTextColor:N}))))}},8281:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.DynamicColorEditorWithPrecedence=void 0;const l=a(n(9497)),s=n(6649),u=n(5089),c=n(333),d=n(152),f=i(n(2065)),p=n(1027),h=Object.assign({},c.DynamicColorEditorPropTypes);t.DynamicColorEditorWithPrecedence=({name:e,value:t,label:n="",labelPosition:r,labelWidth:o,context:a,flyoutTitle:i=(0,s._)("Dynamic coloring"),formatters:c=[],dataSelectors:h=[],defaultPalettesConfig:m=u.defaultPalettesConfig,tooltip:g,options:E={},onChange:b=(()=>{})})=>{const C=l.useCallback((e=>{if(!e||""===e)return!0;if("string"==typeof e){return null!==/^>\s*areaValues\s*\|\s*gradient\(\s*\)$/.exec(e)}return!1}),[]),[T,_]=l.useState(!C(t));l.useEffect((()=>{_(!C(t))}),[t,C]);const y=l.useCallback(((n,r)=>{var o,i,l,s,u,d;_((e=>!e));const f={},m={};if(T){const t=h.map((e=>e.value));f[e]=(0,p.getToggleOffValueForDataColors)({name:e,options:E,dataSelectors:t}),a&&void 0!==a.dataColorsEditorConfig&&(m.dataColorsEditorConfig=void 0)}else{if("string"==typeof t&&null!==/^>\s*areaValues\s*\|\s*gradient\(\s*\)$/.exec(t)){f[e]="> areaValues | gradient(dataColorsEditorConfig)";const t=null===(i=null===(o=c.find((e=>"gradient"===e.value)))||void 0===o?void 0:o.defaults)||void 0===i?void 0:i.areaValues;t&&(m.dataColorsEditorConfig=t)}else if(e.endsWith("dataColors")){const t=null===(l=h[0])||void 0===l?void 0:l.value,n=null===(s=c[0])||void 0===s?void 0:s.value,r=null===(d=null===(u=c[0])||void 0===u?void 0:u.defaults)||void 0===d?void 0:d[t];if(!t||!n||!r)return;f[e]=`> ${h[0].value} | ${n}(dataColorsEditorConfig)`,m.dataColorsEditorConfig=r}}b(n,{options:f,context:m})}),[a,h,c,T,e,b,E,t]),v=l.useCallback(((e,t)=>{b(e,t)}),[b]);return l.createElement("div",{"data-test":"dynamic-color-toggle"},l.createElement(f.default,{name:e,label:(0,s._)("Dynamic coloring"),labelPosition:"right",value:T,onChange:y,itemSchema:{type:"boolean"},help:g}),T&&l.createElement("div",{"data-test":"dynamic-color-editor"},l.createElement(d.DynamicColorEditor,{name:e,label:n,labelPosition:r,labelWidth:o,value:t,context:a,onChange:v,flyoutTitle:i,formatters:c,dataSelectors:h,defaultPalettesConfig:m})))},t.DynamicColorEditorWithPrecedence.propTypes=h},7585:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const l=a(n(9497)),s=a(n(23)),u=n(4793),c=i(n(4082)),d=i(n(9250)),f=i(n(7143)),p=n(6649),h=i(n(5731)),m=i(n(5456)),g=n(4381),E=n(5862),b=(0,p._)("Advanced configuration options are being used by this input. Please edit in source mode."),C=({name:e,context:t,value:n="",label:r,onChange:o,dataSourceBindings:a,labelPosition:i="top",labelWidth:s,help:C=b,validate:T})=>{const[_,y]=l.useState([]),[v,A]=l.useState(""),[D,O]=l.useState("");l.useEffect((()=>{const{staticOptions:e,dynamicOptionsLabel:r,dynamicOptionsValue:o}=(0,g.getDynamicOptionsFromConfig)({items:n,context:t});y(e),A(r),O(o)}),[n,t]),l.useEffect((()=>{void 0!==a.primary||Array.isArray(n)||o(null,{context:{formattedConfig:void 0,formattedStatics:void 0,statics:void 0,label:void 0,value:void 0},options:{[e]:_}})}),[a,e,n,o,_]);const x=l.useCallback(((t,r,a)=>{if(Array.isArray(n)&&(!r||!a))o(null,{options:{[e]:t}});else{const n=(0,u.unzip)(t.map((({label:e,value:t})=>[e,t])));o(null,{context:{formattedConfig:{number:{prefix:""}},formattedStatics:">statics | formatByType(formattedConfig)",statics:n,label:`>primary | seriesByName("${r}") | renameSeries("label") | formatByType(formattedConfig)`,value:`>primary | seriesByName("${a}") | renameSeries("value") | formatByType(formattedConfig)`},options:{[e]:">frame(label, value) | prepend(formattedStatics) | objects()"}})}}),[e,n,o]),S=l.useCallback(((e,t,n)=>{x(n,v,D)}),[x,v,D]),k=l.useCallback(((e,{value:t})=>{""===D?A(t):x(_,t,D)}),[x,_,D]),I=l.useCallback(((e,{value:t})=>{""===v?O(t):x(_,v,t)}),[x,_,v]),N=e=>t=>{var n;const r=null===(n=null==t?void 0:t.options)||void 0===n?void 0:n[e];return"string"==typeof r?{value:(0,g.getFieldFromFieldNameDsl)(r)}:{value:""}};if(l.useMemo((()=>(0,g.isConfigAdvanced)({items:n,context:t})),[n,t]))return l.createElement(d.default,{label:(0,p._)(r),labelPosition:i,labelWidth:s,help:C},l.createElement(c.default,{key:n.toString(),"data-test":e,disabled:!0,defaultValue:n.toString()}));const P=!!a.primary;return l.createElement(l.Fragment,null,l.createElement(m.default,{name:"",label:(0,p._)("Static menu configuration"),labelPosition:i,value:_,onChange:S,validate:T}),P&&l.createElement(f.default,{key:"dynamic-item-editor-label-value-layout",gutter:E.VERTICAL_EDITOR_SPACING},l.createElement(f.default.Row,{key:"dynamic-item-editor-label-row"},l.createElement(h.default,{name:"label",label:(0,p._)("Dynamic menu label field"),dataSourceKey:"primary",dataSourceBindings:a,value:`>primary | seriesByName("${v}")`,context:t,onChange:k,prepareValue:N("label")})),l.createElement(f.default.Row,{key:"dynamic-item-editor-value-row"},l.createElement(h.default,{name:"value",label:(0,p._)("Dynamic menu value field"),dataSourceKey:"primary",dataSourceBindings:a,value:`>primary | seriesByName("${D}")`,context:t,onChange:I,prepareValue:N("value")}))))};C.propTypes={onChange:s.func.isRequired,name:s.string.isRequired,label:s.string.isRequired,value:s.oneOfType([s.arrayOf(s.shape({label:s.string.isRequired,value:s.string.isRequired}).isRequired),s.string]),labelPosition:s.oneOf(["top","left"]),labelWidth:s.number,context:s.shape({label:s.string,value:s.string,statics:s.arrayOf(s.arrayOf(s.string.isRequired).isRequired)}).isRequired,dataSourceBindings:s.shape({primary:s.any}).isRequired,help:s.string},t.default=C},7970:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__rest||function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const s=a(n(9497)),u=a(n(23)),c=l(n(232)),d=n(2640),f=l(n(1018)),p=l(n(6447)),h=n(6649),m=n(8987),g=l(n(4703)),E=l(n(4723)),b=l(n(4784)),C=l(n(7110)),T=l(n(6078)),_=l(n(3757)),y=l(n(785)),v=l(n(6301)),A=l(n(821)),D=l(n(7020)),O=l(n(6379)),x=l(n(5905)),S=l(n(2621)),k=n(3563),I=n(5135),N=n(962),P=n(137),R=[Object.assign(Object.assign({},d.commands.heading3),{icon:s.createElement(b.default,null),name:"header"}),Object.assign(Object.assign({},d.commands.bold),{icon:s.createElement(g.default,null),name:"bold"}),Object.assign(Object.assign({},d.commands.italic),{icon:s.createElement(C.default,null),name:"italic"}),Object.assign(Object.assign({},d.commands.link),{icon:s.createElement(E.default,null),name:"link"}),Object.assign(Object.assign({},d.commands.quote),{icon:s.createElement(A.default,null),name:"quote"}),Object.assign(Object.assign({},d.commands.code),{icon:s.createElement(T.default,null),name:"code"}),Object.assign(Object.assign({},d.commands.image),{icon:s.createElement(_.default,null),name:"image"}),Object.assign(Object.assign({},d.commands.unorderedListCommand),{icon:s.createElement(y.default,null),name:"unordered-list"}),Object.assign(Object.assign({},d.commands.orderedListCommand),{icon:s.createElement(v.default,null),name:"ordered-list"})],L=c.default.div`
     font-family: ${k.variables.sansFontFamily};
 `,M=c.default.div`
     display: flex;
@@ -178,17 +178,17 @@ e.exports=function(){"use strict";function e(e,t){if("undefined"==typeof documen
     display: none;
 `,B=(0,c.default)(D.default)`
     flex: 0;
-`,j={error:1,warning:2,other:3},H=s.memo((({command:e,isFocusable:t,onFocus:n,onExecute:r})=>{const{icon:o,buttonProps:a}=e,{title:l}=a||{};return s.createElement(O.default,{content:l||"",contentRelationship:"label",renderAnchor:a=>{var{onFocus:l,onClick:u}=a,c=i(a,["onFocus","onClick"]);return s.createElement(B,Object.assign({appearance:"subtle","data-name":e.name,onFocus:t=>{l(t),n(e.name||"")},tabIndex:t?0:-1,onClick:t=>{u(t),r(e)}},c),o)}})}));H.displayName="ToolbarButton",H.propTypes={command:u.object.isRequired,isFocusable:u.bool.isRequired,onFocus:u.func.isRequired,onExecute:u.func.isRequired};const U=({onChange:e,name:t,value:n="",defaultErrors:r={}})=>{const o=s.useMemo((()=>(0,m.createDOMID)("markdown-editor")),[]),a=s.useRef(null),[i,l]=s.useState(n),[u,c]=s.useState(R[0].name||""),g=s.useRef(null),[E,b]=s.useState(r);s.useEffect((()=>(a.current&&!g.current&&(g.current=new d.TextAreaCommandOrchestrator(a.current)),()=>{g.current=null})),[]);const C=s.useCallback(((e,{value:t})=>{l(t)}),[]),T=s.useCallback((o=>{i!==n&&(e(o,t,i),b(r))}),[i,n,e,t,r]),_=s.useCallback((e=>{g.current&&a.current&&(g.current.executeCommand(e),l(a.current.value))}),[]),y=s.useMemo((()=>{let e=null;return Object.values(E).includes("error")?e=s.createElement(N.CSPMessage,{type:"error"}):Object.values(E).includes("warning")&&(e=s.createElement(N.CSPMessage,{type:"warning"})),Object.values(E).includes("other")&&(e=s.createElement(s.Fragment,null,e,s.createElement(p.default,{appearance:"fill",type:"error","data-test":"image-error"},(0,h._)("We can't find an image with this URL. Please enter a new URL")))),e}),[Object.values(E).join("")]),v=s.useMemo((()=>{return s.createElement(w,null,s.createElement(f.default,{text:n,imageRenderer:(e=(e,t)=>{var n,r;(null!==(n=j[E[e]])&&void 0!==n?n:1/0)>(null!==(r=j[t])&&void 0!==r?r:0)&&b(Object.assign(Object.assign({},E),{[e]:t}))},function({src:t,alt:n}){const r=(0,I.useCSPViolationObserver)(t);return s.useEffect((()=>{"none"!==r&&e(t,r)}),[r,t]),s.createElement("img",{src:t,alt:n,onError:()=>{"none"===r&&e(t,"other")}})})}));var e}),[n,E]),A=s.useCallback((e=>{var t,n;const r=e.target;if("BUTTON"!==r.tagName)return;const o=e.currentTarget,a=Array.from(o.querySelectorAll("button")),i=a.indexOf(r);if(-1===i)return;const l="ArrowLeft"===e.key,s="ArrowRight"===e.key,u="Home"===e.key,c="End"===e.key;let d=null;l?d=null!==(t=a[i-1])&&void 0!==t?t:a[a.length-1]:s?d=null!==(n=a[i+1])&&void 0!==n?n:a[0]:u?[d]=a:c&&(d=a[a.length-1]),d&&(e.preventDefault(),d.focus())}),[]),D=s.useCallback((e=>{(0,d.handleKeyDown)(e,2,!0),g.current&&((0,d.shortcuts)(e,R,g.current),a.current&&l(a.current.value))}),[]);return s.createElement(L,{"data-test":t},s.createElement(M,{role:"toolbar","aria-label":(0,h._)("Markdown formatting"),"aria-orientation":"horizontal","aria-controls":`${o}-textarea`,onKeyDown:A},R.map((e=>s.createElement(H,{key:e.name,command:e,isFocusable:u===e.name,onFocus:c,onExecute:_})))),s.createElement(S.default,{id:`${o}-textarea-label`},(0,h._)("Markdown editor")),s.createElement(F,{inputRef:a,"data-test":`${t}-textarea`,id:`${o}-textarea`,labelledBy:`${o}-textarea-label`,value:i,onChange:C,onBlur:T,onKeyDown:D}),v,y&&s.createElement(P.MessageContainer,null,y))};U.propTypes={onChange:u.func.isRequired,name:u.string.isRequired,value:u.string,defaultErrors:u.objectOf(u.oneOf(["warning","error","other"]))},t.default=U},2965:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ColorFlyoutEditor=void 0;const l=a(n(9497)),s=a(n(23)),u=i(n(232)),c=n(4793),d=i(n(4566)),f=n(6649),p=i(n(8965)),h=n(8987),m=i(n(7020)),g=i(n(1551)),E=n(3850),b=n(6801),C=i(n(4008)),T=i(n(397)),_={padding:"10px"},y={width:"314px"},v=(0,u.default)(m.default)`
+`,j={error:1,warning:2,other:3},H=s.memo((({command:e,isFocusable:t,onFocus:n,onExecute:r})=>{const{icon:o,buttonProps:a}=e,{title:l}=a||{};return s.createElement(O.default,{content:l||"",contentRelationship:"label",renderAnchor:a=>{var{onFocus:l,onClick:u}=a,c=i(a,["onFocus","onClick"]);return s.createElement(B,Object.assign({appearance:"subtle","data-name":e.name,onFocus:t=>{l(t),n(e.name||"")},tabIndex:t?0:-1,onClick:t=>{u(t),r(e)}},c),o)}})}));H.displayName="ToolbarButton",H.propTypes={command:u.object.isRequired,isFocusable:u.bool.isRequired,onFocus:u.func.isRequired,onExecute:u.func.isRequired};const U=({onChange:e,name:t,value:n="",defaultErrors:r={}})=>{const o=s.useMemo((()=>(0,m.createDOMID)("markdown-editor")),[]),a=s.useRef(null),[i,l]=s.useState(n),[u,c]=s.useState(R[0].name||""),g=s.useRef(null),[E,b]=s.useState(r);s.useEffect((()=>(a.current&&!g.current&&(g.current=new d.TextAreaCommandOrchestrator(a.current)),()=>{g.current=null})),[]);const C=s.useCallback(((e,{value:t})=>{l(t)}),[]),T=s.useCallback((o=>{i!==n&&(e(o,t,i),b(r))}),[i,n,e,t,r]),_=s.useCallback((e=>{g.current&&a.current&&(g.current.executeCommand(e),l(a.current.value))}),[]),y=s.useMemo((()=>{let e=null;return Object.values(E).includes("error")?e=s.createElement(N.CSPMessage,{type:"error"}):Object.values(E).includes("warning")&&(e=s.createElement(N.CSPMessage,{type:"warning"})),Object.values(E).includes("other")&&(e=s.createElement(s.Fragment,null,e,s.createElement(p.default,{appearance:"fill",type:"error","data-test":"image-error"},(0,h._)("We can't find an image with this URL. Please enter a new URL")))),e}),[Object.values(E).join("")]),v=s.useMemo((()=>{return s.createElement(w,null,s.createElement(f.default,{text:n,imageRenderer:(e=(e,t)=>{var n,r;(null!==(n=j[E[e]])&&void 0!==n?n:1/0)>(null!==(r=j[t])&&void 0!==r?r:0)&&b(Object.assign(Object.assign({},E),{[e]:t}))},function({src:t,alt:n}){const r=(0,I.useCSPViolationObserver)(t);return s.useEffect((()=>{"none"!==r&&e(t,r)}),[r,t]),s.createElement("img",{src:t,alt:n,onError:()=>{"none"===r&&e(t,"other")}})})}));var e}),[n,E]),A=s.useCallback((e=>{var t,n;const r=e.target;if("BUTTON"!==r.tagName)return;const o=e.currentTarget,a=Array.from(o.querySelectorAll("button")),i=a.indexOf(r);if(-1===i)return;const l="ArrowLeft"===e.key,s="ArrowRight"===e.key,u="Home"===e.key,c="End"===e.key;let d=null;l?d=null!==(t=a[i-1])&&void 0!==t?t:a[a.length-1]:s?d=null!==(n=a[i+1])&&void 0!==n?n:a[0]:u?[d]=a:c&&(d=a[a.length-1]),d&&(e.preventDefault(),d.focus())}),[]),D=s.useCallback((e=>{(0,d.handleKeyDown)(e,2,!0),g.current&&((0,d.shortcuts)(e,R,g.current),a.current&&l(a.current.value))}),[]);return s.createElement(L,{"data-test":t},s.createElement(M,{role:"toolbar","aria-label":(0,h._)("Markdown formatting"),"aria-orientation":"horizontal","aria-controls":`${o}-textarea`,onKeyDown:A},R.map((e=>s.createElement(H,{key:e.name,command:e,isFocusable:u===e.name,onFocus:c,onExecute:_})))),s.createElement(S.default,{id:`${o}-textarea-label`},(0,h._)("Markdown editor")),s.createElement(F,{inputRef:a,"data-test":`${t}-textarea`,id:`${o}-textarea`,labelledBy:`${o}-textarea-label`,value:i,onChange:C,onBlur:T,onKeyDown:D}),v,y&&s.createElement(P.MessageContainer,null,y))};U.propTypes={onChange:u.func.isRequired,name:u.string.isRequired,value:u.string,defaultErrors:u.objectOf(u.oneOf(["warning","error","other"]))},t.default=U},2965:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ColorFlyoutEditor=void 0;const l=a(n(9497)),s=a(n(23)),u=i(n(232)),c=n(4793),d=i(n(4566)),f=n(6649),p=i(n(8965)),h=n(8987),m=i(n(7020)),g=i(n(1551)),E=n(3850),b=n(6801),C=i(n(4008)),T=i(n(397)),_={padding:"10px"},y=(0,u.default)(m.default)`
     padding: 8px;
     width: 100%;
     min-height: 40px;
-    & > span {
-        display: grid;
-        grid-template-columns: repeat(auto-fill, 26px);
-        justify-content: space-evenly;
-        grid-gap: 4px;
-    }
     background-color: ${d.default.interactiveColorBackground};
+`,v=u.default.div`
+    display: grid;
+    grid-template-columns: repeat(auto-fill, 26px);
+    justify-content: center;
+    gap: 4px;
+    width: 100%;
 `,A=u.default.div`
     width: 26px;
     height: 24px;
@@ -212,7 +212,7 @@ e.exports=function(){"use strict";function e(e,t){if("undefined"==typeof documen
     height: 412px;
     overflow-y: auto;
     padding: 8px 10px;
-`;t.ColorFlyoutEditor=({colors:e,CustomColorMatchEditor:t,handleColorRemove:n,handleColorChange:r,flyoutTitle:o,addColorButtonLabel:a,handleColorAdd:i,handleColorMove:s})=>{const u=(0,l.useMemo)((()=>e.map(((e,o)=>{const a=null==t;return l.default.createElement(p.default.Row,{index:o,key:(0,h.createDOMID)(),"data-color":e,onRequestRemove:n},l.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},l.default.createElement(T.default,{value:e,key:(0,h.createDOMID)(),onChange:r(o),hideLabel:!0,label:" ",name:"color",style:{marginBottom:0,marginTop:0,width:a?"100%":32},showTextInput:a}),"function"==typeof t&&l.default.createElement(t,{index:o})))}))),[e,t,n,r]);return l.default.createElement(D,{"data-test":"MultiColorPickerFlyoutContent"},l.default.createElement(O,{"data-test":"MultiColorPickerFlyoutTitle"},o),l.default.createElement(x,null,l.default.createElement(p.default,{addLabel:a,onRequestAdd:i,onRequestMove:s,"data-test":"ColorListEditor"},u)))};const S=({CustomColorMatchEditor:e,onChange:n=c.noop,canReorderColors:r=!0,value:o=E.VIZ_CATEGORICAL,flyoutTitle:a=(0,f._)("Customize colors"),addColorButtonLabel:i=(0,f._)("Add color"),name:s="seriesColors",label:u="",labelPosition:d="top",labelWidth:p,isDisabled:m=!1,hideLabel:b=!0,canAddNewColors:T=!0})=>{const[D,O]=(0,l.useState)(!1),[x,S]=(0,l.useState)(o),k=(0,l.useRef)(null);(0,l.useEffect)((()=>{S(o)}),[o]);const I=(0,l.useCallback)((()=>{const e=new Set(x);let t=E.VIZ_CATEGORICAL.find((t=>!e.has(t)));if(!t){const e=new Map;E.VIZ_CATEGORICAL.forEach((t=>e.set(t,0))),x.forEach((t=>{e.set(t,(e.get(t)||0)+1)}));let n=1/0;E.VIZ_CATEGORICAL.forEach((r=>{const o=e.get(r)||0;o<n&&(n=o,t=r)}))}n(null,s,[...x,t])}),[s,n,x]),N=(0,l.useCallback)((e=>(t,r,o)=>{const a=[...x];a.splice(e,1,o),n(null,s,a)}),[s,n,x]),P=(0,l.useCallback)(((e,{index:t})=>{const r=[...x];r.splice(t,1),n(null,s,r)}),[s,n,x]),R=(0,l.useCallback)((({fromIndex:e,toIndex:t})=>{const r=[...x],o=r[e];r.splice(e,1),r.splice(t,0,o),n(null,s,r)}),[s,n,x]),L=(0,l.useCallback)((({event:e,reason:t})=>{var n;(null===(n=null==e?void 0:e.srcElement)||void 0===n?void 0:n.sortableHandle)||O(!1),"escapeKey"===t&&k.current.focus()}),[]),M=(0,l.useMemo)((()=>x.map((e=>l.default.createElement(A,{color:e,key:(0,h.createDOMID)()})))),[x]),F=(0,l.useCallback)((()=>{O((e=>!e))}),[]);return l.default.createElement(C.default,{label:u,labelPosition:d,labelWidth:p,hideLabel:b,"data-test":"MultiColorPickerEditor"},l.default.createElement(v,{inline:!1,"data-test":"MultiColorPickerButton",appearance:"default",ref:k,onClick:F,disabled:m,style:y},M),l.default.createElement(g.default,{"data-test":"MultiColorPickerFlyout",open:D,anchor:k.current,defaultPlacement:"horizontal",style:_,onRequestClose:L,takeFocus:!0},l.default.createElement(t.ColorFlyoutEditor,{colors:x,CustomColorMatchEditor:e,handleColorRemove:P,handleColorChange:N,handleColorAdd:T?I:void 0,handleColorMove:r?R:void 0,flyoutTitle:a,addColorButtonLabel:i})))};S.propTypes=Object.assign(Object.assign({},b.BaseEditorPropTypes),{canReorderColors:s.bool,canAddNewColors:s.bool,value:s.arrayOf(s.string),flyoutTitle:s.string,addColorButtonLabel:s.string,CustomColorMatchEditor:s.func,hideLabel:s.bool}),t.default=S},1546:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.NetworkGraphDynamicColorEditor=void 0;const l=a(n(9497)),s=n(6649),u=i(n(7143)),c=n(152),d=i(n(4182)),f=i(n(397));t.NetworkGraphDynamicColorEditor=({name:e,value:t,contextName:n,label:r="",labelWidth:o,context:a,flyoutTitle:i=(0,s._)("Dynamic coloring"),formatters:p=[],dataSelectors:h=[],defaultPalettesConfig:m,tooltip:g,options:E={},onChange:b=(()=>{})})=>{var C;const T=null===(C=h[0])||void 0===C?void 0:C.value,_=l.useCallback((e=>!e||e.trim().startsWith("#")?"static":"dynamic"),[]),[y,v]=l.useState(_(t));l.useEffect((()=>{const e=_(t);v(e)}),[_,t]);const A=l.useCallback(((t,r,o)=>{var i,l,s;v(o);const u=Object.assign({},E),c=Object.assign({},a);if("dynamic"===o){const r=(null===(i=p[0])||void 0===i?void 0:i.value)||"gradient",o=(null===(s=null===(l=p[0])||void 0===l?void 0:l.defaults)||void 0===s?void 0:s[T])||{},a=`> ${T} | ${r}(${n})`;u[e]=a,c[n]=o,b(t,{options:u,context:c})}else"static"===o&&(u[e]=void 0,c[n]=void 0,b(t,{options:u,context:c}))}),[E,a,p,T,n,e,b]),D=l.useCallback(((t,r)=>{var o;const i=r.options[e],l=null===(o=r.context)||void 0===o?void 0:o[n],s=Object.assign(Object.assign({},E),{[e]:i}),u=Object.assign(Object.assign({},a),{[n]:l});b(t,{options:s,context:u})}),[E,e,a,b,n]),O=l.useCallback(((e,t,r)=>{const o=Object.assign(Object.assign({},E),{[t]:r}),i=Object.assign({},a);i[n]=void 0,b(e,{options:o,context:i})}),[a,b,E,n]);return l.createElement(u.default,{"data-test":"dynamic-color-toggle",gutter:15},l.createElement(u.default.Row,{"data-test":"network-graph-dynamic-color-row",alignItems:"start"},l.createElement(u.default.Column,{span:6},l.createElement(d.default,{name:e,label:(0,s._)(r),labelPosition:"top",value:y,onChange:A,itemSchema:{type:"string"},values:[{label:(0,s._)("Static coloring"),value:"static"},{label:(0,s._)("Dynamic coloring"),value:"dynamic"}],help:g})),"dynamic"===y&&l.createElement(u.default.Column,{span:6},l.createElement(c.DynamicColorEditor,{name:e,label:" ",labelPosition:"top",labelWidth:o,value:t,context:a,onChange:D,flyoutTitle:i,formatters:p,dataSelectors:h,defaultPalettesConfig:m})),"static"===y&&l.createElement(u.default.Column,{span:6},l.createElement(f.default,{name:e,label:" ",labelPosition:"top",labelWidth:o,value:t,onChange:O}))))}},4215:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const l=a(n(9497)),s=i(n(232)),u=i(n(4566)),c=i(n(7020)),d=i(n(1551)),f=i(n(6769)),p=n(3563),h=i(n(1668)),m=i(n(4008)),g=(0,s.default)(h.default)`
+`;t.ColorFlyoutEditor=({colors:e,CustomColorMatchEditor:t,handleColorRemove:n,handleColorChange:r,flyoutTitle:o,addColorButtonLabel:a,handleColorAdd:i,handleColorMove:s})=>{const u=(0,l.useMemo)((()=>e.map(((e,o)=>{const a=null==t;return l.default.createElement(p.default.Row,{index:o,key:(0,h.createDOMID)(),"data-color":e,onRequestRemove:n},l.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},l.default.createElement(T.default,{value:e,key:(0,h.createDOMID)(),onChange:r(o),hideLabel:!0,label:" ",name:"color",style:{marginBottom:0,marginTop:0,width:a?"100%":32},showTextInput:a}),"function"==typeof t&&l.default.createElement(t,{index:o})))}))),[e,t,n,r]);return l.default.createElement(D,{"data-test":"MultiColorPickerFlyoutContent"},l.default.createElement(O,{"data-test":"MultiColorPickerFlyoutTitle"},o),l.default.createElement(x,null,l.default.createElement(p.default,{addLabel:a,onRequestAdd:i,onRequestMove:s,"data-test":"ColorListEditor"},u)))};const S=({CustomColorMatchEditor:e,onChange:n=c.noop,canReorderColors:r=!0,value:o=E.VIZ_CATEGORICAL,flyoutTitle:a=(0,f._)("Customize colors"),addColorButtonLabel:i=(0,f._)("Add color"),name:s="seriesColors",label:u="",labelPosition:d="top",labelWidth:p,isDisabled:m=!1,hideLabel:b=!0,canAddNewColors:T=!0})=>{const[D,O]=(0,l.useState)(!1),[x,S]=(0,l.useState)(o),k=(0,l.useRef)(null);(0,l.useEffect)((()=>{S(o)}),[o]);const I=(0,l.useCallback)((()=>{const e=new Set(x);let t=E.VIZ_CATEGORICAL.find((t=>!e.has(t)));if(!t){const e=new Map;E.VIZ_CATEGORICAL.forEach((t=>e.set(t,0))),x.forEach((t=>{e.set(t,(e.get(t)||0)+1)}));let n=1/0;E.VIZ_CATEGORICAL.forEach((r=>{const o=e.get(r)||0;o<n&&(n=o,t=r)}))}n(null,s,[...x,t])}),[s,n,x]),N=(0,l.useCallback)((e=>(t,r,o)=>{const a=[...x];a.splice(e,1,o),n(null,s,a)}),[s,n,x]),P=(0,l.useCallback)(((e,{index:t})=>{const r=[...x];r.splice(t,1),n(null,s,r)}),[s,n,x]),R=(0,l.useCallback)((({fromIndex:e,toIndex:t})=>{const r=[...x],o=r[e];r.splice(e,1),r.splice(t,0,o),n(null,s,r)}),[s,n,x]),L=(0,l.useCallback)((({event:e,reason:t})=>{var n;(null===(n=null==e?void 0:e.srcElement)||void 0===n?void 0:n.sortableHandle)||O(!1),"escapeKey"===t&&k.current.focus()}),[]),M=(0,l.useMemo)((()=>x.map((e=>l.default.createElement(A,{color:e,key:(0,h.createDOMID)()})))),[x]),F=(0,l.useCallback)((()=>{O((e=>!e))}),[]);return l.default.createElement(C.default,{label:u,labelPosition:d,labelWidth:p,hideLabel:b,"data-test":"MultiColorPickerEditor"},l.default.createElement(y,{inline:!1,"data-test":"MultiColorPickerButton",appearance:"default",ref:k,onClick:F,disabled:m},l.default.createElement(v,null,M)),l.default.createElement(g.default,{"data-test":"MultiColorPickerFlyout",open:D,anchor:k.current,defaultPlacement:"horizontal",style:_,onRequestClose:L,takeFocus:!0},l.default.createElement(t.ColorFlyoutEditor,{colors:x,CustomColorMatchEditor:e,handleColorRemove:P,handleColorChange:N,handleColorAdd:T?I:void 0,handleColorMove:r?R:void 0,flyoutTitle:a,addColorButtonLabel:i})))};S.propTypes=Object.assign(Object.assign({},b.BaseEditorPropTypes),{canReorderColors:s.bool,canAddNewColors:s.bool,value:s.arrayOf(s.string),flyoutTitle:s.string,addColorButtonLabel:s.string,CustomColorMatchEditor:s.func,hideLabel:s.bool}),t.default=S},1546:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.NetworkGraphDynamicColorEditor=void 0;const l=a(n(9497)),s=n(6649),u=i(n(7143)),c=n(152),d=i(n(4182)),f=i(n(397));t.NetworkGraphDynamicColorEditor=({name:e,value:t,contextName:n,label:r="",labelWidth:o,context:a,flyoutTitle:i=(0,s._)("Dynamic coloring"),formatters:p=[],dataSelectors:h=[],defaultPalettesConfig:m,tooltip:g,options:E={},onChange:b=(()=>{})})=>{var C;const T=null===(C=h[0])||void 0===C?void 0:C.value,_=l.useCallback((e=>!e||e.trim().startsWith("#")?"static":"dynamic"),[]),[y,v]=l.useState(_(t));l.useEffect((()=>{const e=_(t);v(e)}),[_,t]);const A=l.useCallback(((t,r,o)=>{var i,l,s;v(o);const u=Object.assign({},E),c=Object.assign({},a);if("dynamic"===o){const r=(null===(i=p[0])||void 0===i?void 0:i.value)||"gradient",o=(null===(s=null===(l=p[0])||void 0===l?void 0:l.defaults)||void 0===s?void 0:s[T])||{},a=`> ${T} | ${r}(${n})`;u[e]=a,c[n]=o,b(t,{options:u,context:c})}else"static"===o&&(u[e]=void 0,c[n]=void 0,b(t,{options:u,context:c}))}),[E,a,p,T,n,e,b]),D=l.useCallback(((t,r)=>{var o;const i=r.options[e],l=null===(o=r.context)||void 0===o?void 0:o[n],s=Object.assign(Object.assign({},E),{[e]:i}),u=Object.assign(Object.assign({},a),{[n]:l});b(t,{options:s,context:u})}),[E,e,a,b,n]),O=l.useCallback(((e,t,r)=>{const o=Object.assign(Object.assign({},E),{[t]:r}),i=Object.assign({},a);i[n]=void 0,b(e,{options:o,context:i})}),[a,b,E,n]);return l.createElement(u.default,{"data-test":"dynamic-color-toggle",gutter:15},l.createElement(u.default.Row,{"data-test":"network-graph-dynamic-color-row",alignItems:"start"},l.createElement(u.default.Column,{span:6},l.createElement(d.default,{name:e,label:(0,s._)(r),labelPosition:"top",value:y,onChange:A,itemSchema:{type:"string"},values:[{label:(0,s._)("Static coloring"),value:"static"},{label:(0,s._)("Dynamic coloring"),value:"dynamic"}],help:g})),"dynamic"===y&&l.createElement(u.default.Column,{span:6},l.createElement(c.DynamicColorEditor,{name:e,label:" ",labelPosition:"top",labelWidth:o,value:t,context:a,onChange:D,flyoutTitle:i,formatters:p,dataSelectors:h,defaultPalettesConfig:m})),"static"===y&&l.createElement(u.default.Column,{span:6},l.createElement(f.default,{name:e,label:" ",labelPosition:"top",labelWidth:o,value:t,onChange:O}))))}},4215:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const l=a(n(9497)),s=i(n(232)),u=i(n(4566)),c=i(n(7020)),d=i(n(1551)),f=i(n(6769)),p=n(3563),h=i(n(1668)),m=i(n(4008)),g=(0,s.default)(h.default)`
     background-color: ${u.default.backgroundColorPopup};
 `,E=s.default.span`
     font-weight: 500;
@@ -260,7 +260,7 @@ e.exports=function(){"use strict";function e(e,t){if("undefined"==typeof documen
 `,D=u.default.div`
     flex: 1 0 1px;
     height: 100%;
-`,O=({label:e,value:n,name:r,onChange:o})=>{const a=(0,l.useMemo)((()=>!!(null==n?void 0:n.length)&&!(0,c.isEqual)(n,g.VIZ_CATEGORICAL)),[n]),i=(0,l.useMemo)((()=>a?Object.assign(Object.assign({},t.PALETTES),{custom:Object.assign(Object.assign({},t.PALETTES.custom),{palette:n})}):t.PALETTES),[a,n]),[s,u]=(0,l.useState)(a?"custom":"default"),[T,y]=(0,l.useState)(i),O=(0,l.useCallback)((e=>{u(e),o(null,r,T[e].palette)}),[r,o,T]),x=(0,l.useCallback)(((e,n,a)=>{a.length?(y((e=>Object.assign(Object.assign({},e),{custom:Object.assign(Object.assign({},t.PALETTES.custom),{palette:a})}))),u("custom"),o(null,r,a)):(y((e=>Object.assign(Object.assign({},e),{custom:t.PALETTES.custom}))),u("default"),o(null,r,t.PALETTES.default.palette))}),[r,o]),S=l.default.createElement(d.default,{appearance:"default","data-test":"palette-dropdown-button",label:T[s].name,isMenu:!0}),k=e=>{const{id:t,palette:n,name:r}=e;return l.default.createElement(h.default.Item,{key:`SeriesColorsDropdownMenuItem-${t}`,"data-test":`palette-dropdown-menu-${t}`,selectable:!0,selected:s===t,onClick:()=>O(t)},l.default.createElement(A,null,l.default.createElement(v,null,r),l.default.createElement(D,null,l.default.createElement(b.ColorPreview,{colors:n.slice(0,8),maxColorCount:8,expandToFillHorizontalSpace:!1}))))},I=T.custom.palette.length>0;return l.default.createElement(f.default,{gutter:_.VERTICAL_EDITOR_SPACING},l.default.createElement(f.default.Row,null,l.default.createElement(C.default,{label:e||(0,m._)("Series colors"),labelPosition:"top","data-test":"series-colors-editor"},l.default.createElement(p.default,{toggle:S},l.default.createElement(h.default,{style:{width:_.DROPDOWN_MENU_WIDTH}},I&&k(T.custom),I&&l.default.createElement(h.default.Divider,null),k(t.PALETTES.default))))),l.default.createElement(f.default.Row,null,l.default.createElement(E.default,{name:"series-colors",value:T[s].palette,flyoutTitle:(0,m._)("Customize colors"),addColorButtonLabel:(0,m._)("Add color"),onChange:x})))};O.propTypes=Object.assign(Object.assign({},y.BaseEditorPropTypes),{value:s.arrayOf(s.string)}),t.default=O},148:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.SliderEditor=void 0;const l=a(n(9497)),s=i(n(232)),u=i(n(5309)),c=i(n(2782)),d=i(n(4008)),f=n(5592),p={flexBasis:92,flexGrow:0,flexShrink:0},h=(0,s.default)(u.default)`
+`,O=({label:e,value:n,name:r,onChange:o})=>{const a=(0,l.useMemo)((()=>!!(null==n?void 0:n.length)&&!(0,c.isEqual)(n,g.VIZ_CATEGORICAL)),[n]),i=(0,l.useMemo)((()=>a?Object.assign(Object.assign({},t.PALETTES),{custom:Object.assign(Object.assign({},t.PALETTES.custom),{palette:n})}):t.PALETTES),[a,n]),[s,u]=(0,l.useState)(a?"custom":"default"),[T,y]=(0,l.useState)(i),O=(0,l.useCallback)((e=>{u(e),o(null,r,T[e].palette)}),[r,o,T]),x=(0,l.useCallback)(((e,n,a)=>{a.length?(y((e=>Object.assign(Object.assign({},e),{custom:Object.assign(Object.assign({},t.PALETTES.custom),{palette:a})}))),u("custom"),o(null,r,a)):(y((e=>Object.assign(Object.assign({},e),{custom:t.PALETTES.custom}))),u("default"),o(null,r,t.PALETTES.default.palette))}),[r,o]),S=l.default.createElement(d.default,{appearance:"default","data-test":"palette-dropdown-button",label:T[s].name,inline:!1,isMenu:!0}),k=e=>{const{id:t,palette:n,name:r}=e;return l.default.createElement(h.default.Item,{key:`SeriesColorsDropdownMenuItem-${t}`,"data-test":`palette-dropdown-menu-${t}`,selectable:!0,selected:s===t,onClick:()=>O(t)},l.default.createElement(A,null,l.default.createElement(v,null,r),l.default.createElement(D,null,l.default.createElement(b.ColorPreview,{colors:n.slice(0,8),maxColorCount:8,expandToFillHorizontalSpace:!1}))))},I=T.custom.palette.length>0;return l.default.createElement(f.default,{gutter:_.VERTICAL_EDITOR_SPACING},l.default.createElement(f.default.Row,null,l.default.createElement(C.default,{label:e||(0,m._)("Series colors"),labelPosition:"top","data-test":"series-colors-editor"},l.default.createElement(p.default,{toggle:S},l.default.createElement(h.default,{style:{width:_.DROPDOWN_MENU_WIDTH}},I&&k(T.custom),I&&l.default.createElement(h.default.Divider,null),k(t.PALETTES.default))))),l.default.createElement(f.default.Row,null,l.default.createElement(E.default,{name:"series-colors",value:T[s].palette,flyoutTitle:(0,m._)("Customize colors"),addColorButtonLabel:(0,m._)("Add color"),onChange:x})))};O.propTypes=Object.assign(Object.assign({},y.BaseEditorPropTypes),{value:s.arrayOf(s.string)}),t.default=O},148:function(e,t,n){"use strict";var r=this&&this.__createBinding||(Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&r(t,e,n);return o(t,e),t},i=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.SliderEditor=void 0;const l=a(n(9497)),s=i(n(232)),u=i(n(5309)),c=i(n(2782)),d=i(n(4008)),f=n(5592),p={flexBasis:92,flexGrow:0,flexShrink:0},h=(0,s.default)(u.default)`
     div:has(> [data-test='bar']) {
         min-width: 0;
     }