@splunk/dynamic-editors 0.44.2 → 0.44.4

package/editors/TableDynamicColorEditor.js

@@ -37,7 +37,7 @@
     width: ${(0,s.toPx)(y.FLYOUT_WIDTH)};
 `,M=(0,f.default)(c.default)`
     padding: '4px';
-`;t.prepareUpdate=({name:e,selectedDataSelector:t,selectedFormatterType:r,currentFormatterConfig:a})=>{const o=`${e}EditorConfig`,n=o.replace(/^\w+\[\d+\]\.(.+)$/,"$1");return{options:{[e]:(0,m.buildDSLFromDataSelectorAndFormatter)(t,r,o)},context:{[n]:a}}};t.DynamicColorEditor=({name:e,value:r,label:a="",labelPosition:o="left",labelWidth:n,context:l,onChange:s=(()=>{}),flyoutTitle:c=(0,p._)("Dynamic coloring"),formatters:f=[],dataSelectors:y=[],defaultPalettesConfig:D=h.defaultPalettesConfig,isDisabled:S=!1,showStaticTextColor:T=!1,colorMode:k,handleColorModeChange:R})=>{const[F,I]=P(!1),A=O(null),{type:B,paramKey:V}=(0,m.getLastFormatterFromDSL)(r)||{type:"unknown",paramKey:"unknown"},$=(0,m.getDataSelectorsFromDSL)(r)[0],[L,q]=P(B);x((()=>{q(B)}),[B]);const[U,z]=P($);x((()=>{z($)}),[$]);const N=(0,C.getFormatterConfig)({contextConfig:l[V],formatters:f,formatterFromDSL:B,selectedDataSelector:U}),[G,W]=P(N);x((()=>{W(N)}),[l,f,V,B,$]);const H=r=>{const a=(0,g.find)(f,(e=>e.isDefault))||(0,g.find)(f,(e=>"rangeValue"===e.value))||f[0];if((0,g.isEmpty)(a))return;const o=a.value,n=Object.keys(a.defaults)[0],l=a.defaults[n];z(n),q(o),W(l),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:n,selectedFormatterType:o,currentFormatterConfig:l}))},K=i.useCallback((()=>{I((e=>!e))}),[]);if(!(0,C.isSupportedDataSelector)({selectedDataSelector:U,dataSelectors:y})||!(0,C.isSupportedFormatter)({selectedFormatterType:L,formattersFromEditor:f,supportedFormatters:v.supportedFormatters}))return i.createElement(_.default,{label:a,labelPosition:o,labelWidth:n,onResetToDefault:H});const Y=v.supportedFormatters[L].preview;return i.createElement(i.Fragment,null,i.createElement(u.default,{"data-test":"DynamicColorEditorGroup",label:a,labelPosition:o,labelWidth:n},i.createElement(M,{inline:!1,"data-test":"DynamicColorEditorButton",appearance:"default",ref:A,onClick:K,disabled:S},i.createElement(Y,{"data-test":"FormatterConfigPreview",config:G}))),i.createElement(d.default,{"data-test":"DynamicColorEditorFlyout",open:F,anchor:A.current,defaultPlacement:"horizontal",style:{padding:"10px"},onRequestClose:()=>I(!1),takeFocus:!0},i.createElement(E,null,!k&&i.createElement(w,null,c),k&&i.createElement(u.default,{"data-test":"TableDynamicColorEditorGroup",label:c,labelPosition:o,labelWidth:n},i.createElement(b.default,{value:k,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})=>i.createElement(b.default.Option,{key:t,value:t,label:(0,p._)(e)}))))),k&&i.createElement(j,null,(0,p._)("Method")),i.createElement(v.FormatterEditor,{selectedDataSelector:U,selectedFormatterType:L,currentFormatterConfig:G,onDataSelectorChange:(r,a,o)=>{z(o);const n=(0,g.find)(f,(e=>e.defaults[o]));q(n.value);const l=n.defaults[o];W(l),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:o,selectedFormatterType:n.value,currentFormatterConfig:l}))},onFormatterTypeChange:(r,a,o)=>{q(o);const n=(0,g.find)(f,["value",o]).defaults[U];W(n),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:U,selectedFormatterType:o,currentFormatterConfig:n}))},onFormatterConfigChange:(r,a,o)=>{W(o),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:U,selectedFormatterType:L,currentFormatterConfig:o}))},formatters:f,dataSelectors:y,defaultPalettesConfig:D,showStaticTextColor:T}))))}},8444:function(e,t,r){var a=this&&this.__createBinding||(Object.create?function(e,t,r,a){void 0===a&&(a=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,a,o)}:function(e,t,r,a){void 0===a&&(a=r),e[a]=t[r]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&a(t,e,r);return o(t,e),t},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.TableDynamicColorEditor=void 0;const i=n(r(9497)),s=r(6649),u=r(152),c=l(r(2065)),d=r(333),f=r(630),p=Object.assign({},d.DynamicColorEditorPropTypes);t.TableDynamicColorEditor=({name:e,value:t,label:r="",labelPosition:a,labelWidth:o,context:n,flyoutTitle:l=(0,s._)("Dynamic coloring"),formatters:d=[],dataSelectors:p=[],defaultPalettesConfig:h,tooltip:g,options:m={},onChange:b=(()=>{})})=>{const v=(null==m?void 0:m.tableFormat)||{},_=(null==v?void 0:v.rowColors)?"text":"background",[y,C]=i.useState(_),O=(null==m?void 0:m.tableFormat)||{},[P,x]=i.useState(Boolean(O.rowColors||O.rowBackgroundColors));i.useEffect((()=>{const e=(null==m?void 0:m.tableFormat)||{},{rowColors:t,rowBackgroundColors:r}=e,a=Boolean(t||r);x(a),a||C("background")}),[null==m?void 0:m.tableFormat]);const w=i.useCallback(((e,t)=>{var r,a,o,l;x((e=>!e));const i=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},m.tableFormat)}),s=Object.assign({},n);if(P)Object.assign(i.tableFormat,(0,f.clearDynamicColoring)(y)),s.tableFormatEditorConfig=void 0,b(e,{options:i,context:s});else{const t=(null===(r=p[0])||void 0===r?void 0:r.value)||"table",n=(null===(a=d[0])||void 0===a?void 0:a.value)||"gradient",u=(null===(l=null===(o=d[0])||void 0===o?void 0:o.defaults)||void 0===l?void 0:l[t])||{},c=`> ${t} | ${n}(tableFormatEditorConfig)`;"background"===y?(i.tableFormat.rowBackgroundColors=c,i.tableFormat.rowColors=void 0):(i.tableFormat.rowColors=c,i.tableFormat.rowBackgroundColors=void 0),s.tableFormatEditorConfig=u,b(e,{options:i,context:s})}}),[m,n,P,b,y,p,d]),j=i.useCallback(((e,t)=>{var r,a;const o=null===(r=t.options)||void 0===r?void 0:r.tableFormat,l=null===(a=t.context)||void 0===a?void 0:a.tableFormatEditorConfig,i=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},m.tableFormat)});"background"===y?(i.tableFormat.rowBackgroundColors=o,i.tableFormat.rowColors=void 0):"text"===y&&(i.tableFormat.rowColors=o,i.tableFormat.rowBackgroundColors=void 0),void 0===i.tableFormat.rowBackgroundColors&&void 0===i.tableFormat.rowColors&&(i.tableFormat={});const s=Object.assign(Object.assign({},n),{tableFormatEditorConfig:l});b(e,{options:i,context:s})}),[b,m,n,y]);return i.createElement("div",{"data-test":"dynamic-color-toggle"},i.createElement(c.default,{name:e,label:(0,s._)("Dynamic coloring"),labelPosition:"right",value:P,onChange:w,itemSchema:{type:"boolean"},help:g}),P&&i.createElement(u.DynamicColorEditor,{name:e,label:r||(0,s._)("Dynamic coloring"),labelPosition:a,labelWidth:o,value:"background"===y?null==t?void 0:t.rowBackgroundColors:null==t?void 0:t.rowColors,context:n,onChange:j,flyoutTitle:l,formatters:d,dataSelectors:p,defaultPalettesConfig:h,colorMode:y,handleColorModeChange:(e,{value:t})=>{const r=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},v)}),a=Object.assign({},n);"off"===t?(x(!1),Object.assign(r.tableFormat,(0,f.clearDynamicColoring)(y)),a.tableFormatEditorConfig=void 0):"background"===y&&"text"===t?(Object.assign(r.tableFormat,(0,f.moveDslBetweenModes)("background","text",v)),C("text")):"text"===y&&"background"===t&&(Object.assign(r.tableFormat,(0,f.moveDslBetweenModes)("text","background",v)),C("background")),b(e,{options:r,context:a})}}))},t.TableDynamicColorEditor.propTypes=p},1705:function(e,t,r){var a=this&&this.__createBinding||(Object.create?function(e,t,r,a){void 0===a&&(a=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,a,o)}:function(e,t,r,a){void 0===a&&(a=r),e[a]=t[r]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&a(t,e,r);return o(t,e),t},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ColorPreview=void 0;const i=n(r(9497)),s=l(r(232)),u=r(3283),c=r(8987),d=s.default.div.attrs((e=>({"data-test":"ColorPreviewWrapper",isReversed:e.isReversed})))`
+`;t.prepareUpdate=({name:e,selectedDataSelector:t,selectedFormatterType:r,currentFormatterConfig:a})=>{const o=`${e}EditorConfig`,n=o.replace(/^\w+\[\d+\]\.(.+)$/,"$1");return{options:{[e]:(0,m.buildDSLFromDataSelectorAndFormatter)(t,r,o)},context:{[n]:a}}};t.DynamicColorEditor=({name:e,value:r,label:a="",labelPosition:o="left",labelWidth:n,context:l,onChange:s=(()=>{}),flyoutTitle:c=(0,p._)("Dynamic coloring"),formatters:f=[],dataSelectors:y=[],defaultPalettesConfig:D=h.defaultPalettesConfig,isDisabled:S=!1,showStaticTextColor:T=!1,colorMode:k,handleColorModeChange:R})=>{const[F,I]=P(!1),A=O(null),{type:B,paramKey:V}=(0,m.getLastFormatterFromDSL)(r)||{type:"unknown",paramKey:"unknown"},$=(0,m.getDataSelectorsFromDSL)(r)[0],[L,q]=P(B);x((()=>{q(B)}),[B]);const[U,z]=P($);x((()=>{z($)}),[$]);const N=(0,C.getFormatterConfig)({contextConfig:l[V],formatters:f,formatterFromDSL:B,selectedDataSelector:U}),[G,W]=P(N);x((()=>{W(N)}),[l,f,V,B,$]);const H=r=>{const a=(0,g.find)(f,(e=>e.isDefault))||(0,g.find)(f,(e=>"rangeValue"===e.value))||f[0];if((0,g.isEmpty)(a))return;const o=a.value,n=Object.keys(a.defaults)[0],l=a.defaults[n];z(n),q(o),W(l),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:n,selectedFormatterType:o,currentFormatterConfig:l}))},K=i.useCallback((()=>{I((e=>!e))}),[]);if(!(0,C.isSupportedDataSelector)({selectedDataSelector:U,dataSelectors:y})||!(0,C.isSupportedFormatter)({selectedFormatterType:L,formattersFromEditor:f,supportedFormatters:v.supportedFormatters}))return i.createElement(_.default,{label:a,labelPosition:o,labelWidth:n,onResetToDefault:H});const Y=v.supportedFormatters[L].preview;return i.createElement(i.Fragment,null,i.createElement(u.default,{"data-test":"DynamicColorEditorGroup",label:a,labelPosition:o,labelWidth:n},i.createElement(M,{inline:!1,"data-test":"DynamicColorEditorButton",appearance:"default","aria-label":a||c,ref:A,onClick:K,disabled:S},i.createElement(Y,{"data-test":"FormatterConfigPreview",config:G}))),i.createElement(d.default,{"data-test":"DynamicColorEditorFlyout",open:F,anchor:A.current,defaultPlacement:"horizontal",style:{padding:"10px"},onRequestClose:()=>I(!1),takeFocus:!0},i.createElement(E,null,!k&&i.createElement(w,null,c),k&&i.createElement(u.default,{"data-test":"TableDynamicColorEditorGroup",label:c,labelPosition:o,labelWidth:n},i.createElement(b.default,{value:k,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})=>i.createElement(b.default.Option,{key:t,value:t,label:(0,p._)(e)}))))),k&&i.createElement(j,null,(0,p._)("Method")),i.createElement(v.FormatterEditor,{selectedDataSelector:U,selectedFormatterType:L,currentFormatterConfig:G,onDataSelectorChange:(r,a,o)=>{z(o);const n=(0,g.find)(f,(e=>e.defaults[o]));q(n.value);const l=n.defaults[o];W(l),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:o,selectedFormatterType:n.value,currentFormatterConfig:l}))},onFormatterTypeChange:(r,a,o)=>{q(o);const n=(0,g.find)(f,["value",o]).defaults[U];W(n),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:U,selectedFormatterType:o,currentFormatterConfig:n}))},onFormatterConfigChange:(r,a,o)=>{W(o),s(r,(0,t.prepareUpdate)({name:e,selectedDataSelector:U,selectedFormatterType:L,currentFormatterConfig:o}))},formatters:f,dataSelectors:y,defaultPalettesConfig:D,showStaticTextColor:T}))))}},8444:function(e,t,r){var a=this&&this.__createBinding||(Object.create?function(e,t,r,a){void 0===a&&(a=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,a,o)}:function(e,t,r,a){void 0===a&&(a=r),e[a]=t[r]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&a(t,e,r);return o(t,e),t},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.TableDynamicColorEditor=void 0;const i=n(r(9497)),s=r(6649),u=r(152),c=l(r(2065)),d=r(333),f=r(630),p=Object.assign({},d.DynamicColorEditorPropTypes);t.TableDynamicColorEditor=({name:e,value:t,label:r="",labelPosition:a,labelWidth:o,context:n,flyoutTitle:l=(0,s._)("Dynamic coloring"),formatters:d=[],dataSelectors:p=[],defaultPalettesConfig:h,tooltip:g,options:m={},onChange:b=(()=>{})})=>{const v=(null==m?void 0:m.tableFormat)||{},_=(null==v?void 0:v.rowColors)?"text":"background",[y,C]=i.useState(_),O=(null==m?void 0:m.tableFormat)||{},[P,x]=i.useState(Boolean(O.rowColors||O.rowBackgroundColors));i.useEffect((()=>{const e=(null==m?void 0:m.tableFormat)||{},{rowColors:t,rowBackgroundColors:r}=e,a=Boolean(t||r);x(a),a||C("background")}),[null==m?void 0:m.tableFormat]);const w=i.useCallback(((e,t)=>{var r,a,o,l;x((e=>!e));const i=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},m.tableFormat)}),s=Object.assign({},n);if(P)Object.assign(i.tableFormat,(0,f.clearDynamicColoring)(y)),s.tableFormatEditorConfig=void 0,b(e,{options:i,context:s});else{const t=(null===(r=p[0])||void 0===r?void 0:r.value)||"table",n=(null===(a=d[0])||void 0===a?void 0:a.value)||"gradient",u=(null===(l=null===(o=d[0])||void 0===o?void 0:o.defaults)||void 0===l?void 0:l[t])||{},c=`> ${t} | ${n}(tableFormatEditorConfig)`;"background"===y?(i.tableFormat.rowBackgroundColors=c,i.tableFormat.rowColors=void 0):(i.tableFormat.rowColors=c,i.tableFormat.rowBackgroundColors=void 0),s.tableFormatEditorConfig=u,b(e,{options:i,context:s})}}),[m,n,P,b,y,p,d]),j=i.useCallback(((e,t)=>{var r,a;const o=null===(r=t.options)||void 0===r?void 0:r.tableFormat,l=null===(a=t.context)||void 0===a?void 0:a.tableFormatEditorConfig,i=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},m.tableFormat)});"background"===y?(i.tableFormat.rowBackgroundColors=o,i.tableFormat.rowColors=void 0):"text"===y&&(i.tableFormat.rowColors=o,i.tableFormat.rowBackgroundColors=void 0),void 0===i.tableFormat.rowBackgroundColors&&void 0===i.tableFormat.rowColors&&(i.tableFormat={});const s=Object.assign(Object.assign({},n),{tableFormatEditorConfig:l});b(e,{options:i,context:s})}),[b,m,n,y]);return i.createElement("div",{"data-test":"dynamic-color-toggle"},i.createElement(c.default,{name:e,label:(0,s._)("Dynamic coloring"),labelPosition:"right",value:P,onChange:w,itemSchema:{type:"boolean"},help:g}),P&&i.createElement(u.DynamicColorEditor,{name:e,label:r||(0,s._)("Dynamic coloring"),labelPosition:a,labelWidth:o,value:"background"===y?null==t?void 0:t.rowBackgroundColors:null==t?void 0:t.rowColors,context:n,onChange:j,flyoutTitle:l,formatters:d,dataSelectors:p,defaultPalettesConfig:h,colorMode:y,handleColorModeChange:(e,{value:t})=>{const r=Object.assign(Object.assign({},m),{tableFormat:Object.assign({},v)}),a=Object.assign({},n);"off"===t?(x(!1),Object.assign(r.tableFormat,(0,f.clearDynamicColoring)(y)),a.tableFormatEditorConfig=void 0):"background"===y&&"text"===t?(Object.assign(r.tableFormat,(0,f.moveDslBetweenModes)("background","text",v)),C("text")):"text"===y&&"background"===t&&(Object.assign(r.tableFormat,(0,f.moveDslBetweenModes)("text","background",v)),C("background")),b(e,{options:r,context:a})}}))},t.TableDynamicColorEditor.propTypes=p},1705:function(e,t,r){var a=this&&this.__createBinding||(Object.create?function(e,t,r,a){void 0===a&&(a=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,a,o)}:function(e,t,r,a){void 0===a&&(a=r),e[a]=t[r]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&a(t,e,r);return o(t,e),t},l=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ColorPreview=void 0;const i=n(r(9497)),s=l(r(232)),u=r(3283),c=r(8987),d=s.default.div.attrs((e=>({"data-test":"ColorPreviewWrapper",isReversed:e.isReversed})))`
     display: flex;
     flex-direction: row;
     height: 100%;