@splunk/dynamic-editors 0.38.0 → 0.38.1

package/containers/EditorLayout.js

@@ -202,7 +202,7 @@
     height: 412px;
     overflow-y: auto;
     padding: 8px 10px;
-`;t.ColorFlyoutEditor=({colors:e,CustomColorMatchEditor:t,handleColorRemove:o,handleColorChange:a,flyoutTitle:r,addColorButtonLabel:l,handleColorAdd:n,handleColorMove:s})=>{const u=(0,i.useMemo)((()=>e.map(((e,r)=>{const l=null==t;return i.default.createElement(p.default.Row,{index:r,key:(0,m.createDOMID)(),"data-color":e,onRequestRemove:o},i.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},i.default.createElement(C.default,{value:e,key:(0,m.createDOMID)(),onChange:a(r),hideLabel:!0,label:" ",name:"color",style:{marginBottom:0,marginTop:0,width:l?"100%":32},showTextInput:l}),"function"==typeof t&&i.default.createElement(t,{index:r})))}))),[e,t,o,a]);return i.default.createElement(P,{"data-test":"MultiColorPickerFlyoutContent"},i.default.createElement(j,{"data-test":"MultiColorPickerFlyoutTitle"},r),i.default.createElement(w,null,i.default.createElement(p.default,{addLabel:l,onRequestAdd:n,onRequestMove:s,"data-test":"ColorListEditor"},u)))};let T=0;const D=({CustomColorMatchEditor:e,onChange:o=c.noop,canReorderColors:a=!0,value:r=h.VIZ_CATEGORICAL,flyoutTitle:l=(0,f._)("Customize colors"),addColorButtonLabel:n=(0,f._)("Add color"),name:s="seriesColors",label:u="",labelPosition:d="top",labelWidth:p,isDisabled:g=!1,hideLabel:v=!0,canAddNewColors:C=!0})=>{const[P,j]=(0,i.useState)(!1),[w,D]=(0,i.useState)(r),S=(0,i.useRef)(null);(0,i.useEffect)((()=>{D(r)}),[r]);const M=(0,i.useCallback)((()=>{o(null,s,[...w,h.VIZ_CATEGORICAL[T%h.VIZ_CATEGORICAL.length]]),T+=1}),[s,o,w]),k=(0,i.useCallback)((e=>(t,a,r)=>{const l=[...w];l.splice(e,1,r),o(null,s,l)}),[s,o,w]),F=(0,i.useCallback)(((e,{index:t})=>{const a=[...w];a.splice(t,1),o(null,s,a)}),[s,o,w]),R=(0,i.useCallback)((({fromIndex:e,toIndex:t})=>{const a=[...w],r=a[e];a.splice(e,1),a.splice(t,0,r),o(null,s,a)}),[s,o,w]),B=(0,i.useCallback)((({event:e,reason:t})=>{var o;(null===(o=null==e?void 0:e.srcElement)||void 0===o?void 0:o.sortableHandle)||j(!1),"escapeKey"===t&&S.current.focus()}),[]),A=(0,i.useMemo)((()=>w.map((e=>i.default.createElement(x,{color:e,key:(0,m.createDOMID)()})))),[w]),I=(0,i.useCallback)((()=>{j((e=>!e))}),[]);return i.default.createElement(y.default,{label:u,labelPosition:d,labelWidth:p,hideLabel:v,"data-test":"MultiColorPickerEditor"},i.default.createElement(E,{inline:!1,"data-test":"MultiColorPickerButton",appearance:"default",ref:S,onClick:I,disabled:g,style:O},A),i.default.createElement(b.default,{"data-test":"MultiColorPickerFlyout",open:P,anchor:S.current,defaultPlacement:"horizontal",style:_,onRequestClose:B,takeFocus:!0},i.default.createElement(t.ColorFlyoutEditor,{colors:w,CustomColorMatchEditor:e,handleColorRemove:F,handleColorChange:k,handleColorAdd:C?M:void 0,handleColorMove:a?R:void 0,flyoutTitle:l,addColorButtonLabel:n})))};D.propTypes=Object.assign(Object.assign({},v.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=D},4215:function(e,t,o){var a=this&&this.__createBinding||(Object.create?function(e,t,o,a){void 0===a&&(a=o);var r=Object.getOwnPropertyDescriptor(t,o);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,a,r)}:function(e,t,o,a){void 0===a&&(a=o),e[a]=t[o]}),r=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),l=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var o in e)"default"!==o&&Object.prototype.hasOwnProperty.call(e,o)&&a(t,e,o);return r(t,e),t},n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const i=l(o(9497)),s=n(o(232)),u=n(o(4566)),c=n(o(7020)),d=n(o(1551)),f=n(o(6769)),p=o(3563),m=n(o(1668)),g=n(o(4008)),b=(0,s.default)(m.default)`
+`;t.ColorFlyoutEditor=({colors:e,CustomColorMatchEditor:t,handleColorRemove:o,handleColorChange:a,flyoutTitle:r,addColorButtonLabel:l,handleColorAdd:n,handleColorMove:s})=>{const u=(0,i.useMemo)((()=>e.map(((e,r)=>{const l=null==t;return i.default.createElement(p.default.Row,{index:r,key:(0,m.createDOMID)(),"data-color":e,onRequestRemove:o},i.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},i.default.createElement(C.default,{value:e,key:(0,m.createDOMID)(),onChange:a(r),hideLabel:!0,label:" ",name:"color",style:{marginBottom:0,marginTop:0,width:l?"100%":32},showTextInput:l}),"function"==typeof t&&i.default.createElement(t,{index:r})))}))),[e,t,o,a]);return i.default.createElement(P,{"data-test":"MultiColorPickerFlyoutContent"},i.default.createElement(j,{"data-test":"MultiColorPickerFlyoutTitle"},r),i.default.createElement(w,null,i.default.createElement(p.default,{addLabel:l,onRequestAdd:n,onRequestMove:s,"data-test":"ColorListEditor"},u)))};const T=({CustomColorMatchEditor:e,onChange:o=c.noop,canReorderColors:a=!0,value:r=h.VIZ_CATEGORICAL,flyoutTitle:l=(0,f._)("Customize colors"),addColorButtonLabel:n=(0,f._)("Add color"),name:s="seriesColors",label:u="",labelPosition:d="top",labelWidth:p,isDisabled:g=!1,hideLabel:v=!0,canAddNewColors:C=!0})=>{const[P,j]=(0,i.useState)(!1),[w,T]=(0,i.useState)(r),D=(0,i.useRef)(null);(0,i.useEffect)((()=>{T(r)}),[r]);const S=(0,i.useCallback)((()=>{const e=new Set(w);let t=h.VIZ_CATEGORICAL.find((t=>!e.has(t)));if(!t){const e=new Map;h.VIZ_CATEGORICAL.forEach((t=>e.set(t,0))),w.forEach((t=>{e.set(t,(e.get(t)||0)+1)}));let o=1/0;h.VIZ_CATEGORICAL.forEach((a=>{const r=e.get(a)||0;r<o&&(o=r,t=a)}))}o(null,s,[...w,t])}),[s,o,w]),M=(0,i.useCallback)((e=>(t,a,r)=>{const l=[...w];l.splice(e,1,r),o(null,s,l)}),[s,o,w]),k=(0,i.useCallback)(((e,{index:t})=>{const a=[...w];a.splice(t,1),o(null,s,a)}),[s,o,w]),F=(0,i.useCallback)((({fromIndex:e,toIndex:t})=>{const a=[...w],r=a[e];a.splice(e,1),a.splice(t,0,r),o(null,s,a)}),[s,o,w]),R=(0,i.useCallback)((({event:e,reason:t})=>{var o;(null===(o=null==e?void 0:e.srcElement)||void 0===o?void 0:o.sortableHandle)||j(!1),"escapeKey"===t&&D.current.focus()}),[]),B=(0,i.useMemo)((()=>w.map((e=>i.default.createElement(x,{color:e,key:(0,m.createDOMID)()})))),[w]),A=(0,i.useCallback)((()=>{j((e=>!e))}),[]);return i.default.createElement(y.default,{label:u,labelPosition:d,labelWidth:p,hideLabel:v,"data-test":"MultiColorPickerEditor"},i.default.createElement(E,{inline:!1,"data-test":"MultiColorPickerButton",appearance:"default",ref:D,onClick:A,disabled:g,style:O},B),i.default.createElement(b.default,{"data-test":"MultiColorPickerFlyout",open:P,anchor:D.current,defaultPlacement:"horizontal",style:_,onRequestClose:R,takeFocus:!0},i.default.createElement(t.ColorFlyoutEditor,{colors:w,CustomColorMatchEditor:e,handleColorRemove:k,handleColorChange:M,handleColorAdd:C?S:void 0,handleColorMove:a?F:void 0,flyoutTitle:l,addColorButtonLabel:n})))};T.propTypes=Object.assign(Object.assign({},v.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=T},4215:function(e,t,o){var a=this&&this.__createBinding||(Object.create?function(e,t,o,a){void 0===a&&(a=o);var r=Object.getOwnPropertyDescriptor(t,o);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,a,r)}:function(e,t,o,a){void 0===a&&(a=o),e[a]=t[o]}),r=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),l=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var o in e)"default"!==o&&Object.prototype.hasOwnProperty.call(e,o)&&a(t,e,o);return r(t,e),t},n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const i=l(o(9497)),s=n(o(232)),u=n(o(4566)),c=n(o(7020)),d=n(o(1551)),f=n(o(6769)),p=o(3563),m=n(o(1668)),g=n(o(4008)),b=(0,s.default)(m.default)`
     background-color: ${u.default.backgroundColorPopup};
 `,h=s.default.span`
     font-weight: 500;