@e1011/es-kit 1.0.40 → 1.0.44

package/dist/hooks/esm/src/core/hooks/useResize.js

@@ -1,2 +1,2 @@
-import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as e,useRef as i,useMemo as n,useLayoutEffect as r}from"react";import l from"../../../node_modules/lodash-es/debounce.js";var o=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,u=e({width:void 0,height:void 0}),d=t(u,2),c=d[0],v=d[1],h=i({width:0,height:0}),a=i(),s=i(),g=n((function(){return l((function(t){var e,i,n,r,l=t[0].contentRect.width,o=t[0].contentRect.height;(null===(e=h.current)||void 0===e?void 0:e.width)===l&&(null===(i=h.current)||void 0===i?void 0:i.height)===o||(h.current={width:l,height:o},v({width:null==a||null===(n=a.current)||void 0===n?void 0:n.clientWidth,height:null==a||null===(r=a.current)||void 0===r?void 0:r.clientHeight}))}),o)}),[a,o]);return r((function(){var t,e,i,n;null!=a&&a.current&&(e=null==a?void 0:a.current,(t=new ResizeObserver(g)).observe(e),v({width:null==a||null===(i=a.current)||void 0===i?void 0:i.clientWidth,height:null==a||null===(n=a.current)||void 0===n?void 0:n.clientHeight}));var r=function(){var i,n;null===(i=t)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,e)};return s.current=r,r}),[g,a]),[a,c,s.current]};export{o as useResize};
+import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as e,useRef as i,useMemo as n,useLayoutEffect as r}from"react";import l from"../../../node_modules/lodash-es/debounce.js";var o=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,u=arguments.length>1?arguments[1]:void 0,d=e({width:void 0,height:void 0}),v=t(d,2),c=v[0],h=v[1],a=i({width:0,height:0}),g=i(),s=i(),f=n((function(){return l((function(t){var e,i,n,r,l=t[0].contentRect.width,o=t[0].contentRect.height;(null===(e=a.current)||void 0===e?void 0:e.width)===l&&(null===(i=a.current)||void 0===i?void 0:i.height)===o||(a.current={width:l,height:o},(u||h)({width:null==g||null===(n=g.current)||void 0===n?void 0:n.clientWidth,height:null==g||null===(r=g.current)||void 0===r?void 0:r.clientHeight}))}),o)}),[u,o]);return r((function(){var t,e,i,n;null!=g&&g.current&&(e=null==g?void 0:g.current,(t=new ResizeObserver(f)).observe(e),(u||h)({width:null==g||null===(i=g.current)||void 0===i?void 0:i.clientWidth,height:null==g||null===(n=g.current)||void 0===n?void 0:n.clientHeight}));var r=function(){var i,n;null===(i=t)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,e)};return s.current=r,r}),[f,g,u]),[g,c,s.current]};export{o as useResize};
 //# sourceMappingURL=useResize.js.map

package/dist/hooks/esm/src/core/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\nexport const useResize = (debounceDelay = 250): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n  = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n\n  // const [unobserver, setUnobserver] = useState<Unobserver>(DefaultUnobserver)\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    setContainerSize({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [containerRef, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["useResize","debounceDelay","arguments","length","undefined","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"6NASaA,EAAY,WACmE,IADlEC,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAExCG,EACEC,EAAsB,CAAEC,WAAOH,EAAWI,YAAQJ,IAAYK,EAAAC,EAAAL,EAAA,GADzDM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,IAGjEE,EAAgBF,IAEhBG,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,GAE9Df,EAAiB,CACfL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE7B,EAAc,GAAE,CAACc,EAAcd,IA0BlC,OAxBA8B,GAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBrB,EAAiB,CACfL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACT,GAAG,CAACrB,EAAwBF,IAErB,CAACA,EAAcJ,EAAeK,EAAcY,QACrD"}
+{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\ntype CallBack = () => void\n\n// eslint-disable-next-line default-param-last\nexport const useResize = (debounceDelay = 250, callBack?: CallBack): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    // eslint-disable-next-line semi-style\n    ;(callBack || setContainerSize)({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [callBack, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      // eslint-disable-next-line semi-style\n      ;(callBack || setContainerSize)({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef, callBack])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["useResize","debounceDelay","arguments","length","undefined","callBack","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"6NAYaA,EAAY,WACmE,IADlEC,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAAKG,EAAmBH,UAAAC,OAAAD,EAAAA,kBAAAE,EAEhEE,EACIC,EAAsB,CAAEC,WAAOJ,EAAWK,YAAQL,IAAYM,EAAAC,EAAAL,EAAA,GAD3DM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,IACjEE,EAAgBF,IAEhBG,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,IAG5DvB,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE9B,EAAc,GAAE,CAACI,EAAUJ,IA2B9B,OAzBA+B,GAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,IAGrB7B,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACR,GAAE,CAACrB,EAAwBF,EAAcX,IAEnC,CAACW,EAAcJ,EAAeK,EAAcY,QACrD"}

package/dist/hooks/src/core/hooks/useResize.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../node_modules/lodash-es/debounce.js");exports.useResize=function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,n=t.useState({width:void 0,height:void 0}),u=e.slicedToArray(n,2),l=u[0],o=u[1],d=t.useRef({width:0,height:0}),c=t.useRef(),v=t.useRef(),h=t.useMemo((function(){return i((function(e){var t,i,r,n,u=e[0].contentRect.width,l=e[0].contentRect.height;(null===(t=d.current)||void 0===t?void 0:t.width)===u&&(null===(i=d.current)||void 0===i?void 0:i.height)===l||(d.current={width:u,height:l},o({width:null==c||null===(r=c.current)||void 0===r?void 0:r.clientWidth,height:null==c||null===(n=c.current)||void 0===n?void 0:n.clientHeight}))}),r)}),[c,r]);return t.useLayoutEffect((function(){var e,t,i,r;null!=c&&c.current&&(t=null==c?void 0:c.current,(e=new ResizeObserver(h)).observe(t),o({width:null==c||null===(i=c.current)||void 0===i?void 0:i.clientWidth,height:null==c||null===(r=c.current)||void 0===r?void 0:r.clientHeight}));var n=function(){var i,r;null===(i=e)||void 0===i||null===(r=i.unobserve)||void 0===r||r.call(i,t)};return v.current=n,n}),[h,c]),[c,l,v.current]};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../node_modules/lodash-es/debounce.js");exports.useResize=function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,n=arguments.length>1?arguments[1]:void 0,u=t.useState({width:void 0,height:void 0}),l=e.slicedToArray(u,2),o=l[0],d=l[1],c=t.useRef({width:0,height:0}),v=t.useRef(),h=t.useRef(),s=t.useMemo((function(){return i((function(e){var t,i,r,u,l=e[0].contentRect.width,o=e[0].contentRect.height;(null===(t=c.current)||void 0===t?void 0:t.width)===l&&(null===(i=c.current)||void 0===i?void 0:i.height)===o||(c.current={width:l,height:o},(n||d)({width:null==v||null===(r=v.current)||void 0===r?void 0:r.clientWidth,height:null==v||null===(u=v.current)||void 0===u?void 0:u.clientHeight}))}),r)}),[n,r]);return t.useLayoutEffect((function(){var e,t,i,r;null!=v&&v.current&&(t=null==v?void 0:v.current,(e=new ResizeObserver(s)).observe(t),(n||d)({width:null==v||null===(i=v.current)||void 0===i?void 0:i.clientWidth,height:null==v||null===(r=v.current)||void 0===r?void 0:r.clientHeight}));var u=function(){var i,r;null===(i=e)||void 0===i||null===(r=i.unobserve)||void 0===r||r.call(i,t)};return h.current=u,u}),[s,v,n]),[v,o,h.current]};
 //# sourceMappingURL=useResize.js.map

package/dist/hooks/src/core/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","sources":["../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\nexport const useResize = (debounceDelay = 250): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n  = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n\n  // const [unobserver, setUnobserver] = useState<Unobserver>(DefaultUnobserver)\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    setContainerSize({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [containerRef, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["debounceDelay","arguments","length","undefined","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"kOASyB,WACmE,IADlEA,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAExCG,EACEC,EAAAA,SAAsB,CAAEC,WAAOH,EAAWI,YAAQJ,IAAYK,EAAAC,EAAAA,cAAAL,EAAA,GADzDM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAAA,OAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,EAAAA,SAGjEE,EAAgBF,EAAAA,SAEhBG,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,GAE9Df,EAAiB,CACfL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE7B,EAAc,GAAE,CAACc,EAAcd,IA0BlC,OAxBA8B,EAAAA,iBAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBrB,EAAiB,CACfL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACT,GAAG,CAACrB,EAAwBF,IAErB,CAACA,EAAcJ,EAAeK,EAAcY,QACrD"}
+{"version":3,"file":"useResize.js","sources":["../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\ntype CallBack = () => void\n\n// eslint-disable-next-line default-param-last\nexport const useResize = (debounceDelay = 250, callBack?: CallBack): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    // eslint-disable-next-line semi-style\n    ;(callBack || setContainerSize)({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [callBack, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      // eslint-disable-next-line semi-style\n      ;(callBack || setContainerSize)({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef, callBack])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["debounceDelay","arguments","length","undefined","callBack","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"kOAYyB,WACmE,IADlEA,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAAKG,EAAmBH,UAAAC,OAAAD,EAAAA,kBAAAE,EAEhEE,EACIC,EAAAA,SAAsB,CAAEC,WAAOJ,EAAWK,YAAQL,IAAYM,EAAAC,EAAAA,cAAAL,EAAA,GAD3DM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAAA,OAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,EAAAA,SACjEE,EAAgBF,EAAAA,SAEhBG,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,IAG5DvB,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE9B,EAAc,GAAE,CAACI,EAAUJ,IA2B9B,OAzBA+B,EAAAA,iBAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,IAGrB7B,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACR,GAAE,CAACrB,EAAwBF,EAAcX,IAEnC,CAACW,EAAcJ,EAAeK,EAAcY,QACrD"}

package/dist/lib/cjs/src/core/hooks/useResize.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../node_modules/lodash-es/debounce.js");exports.useResize=function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,n=t.useState({width:void 0,height:void 0}),u=e.slicedToArray(n,2),l=u[0],o=u[1],d=t.useRef({width:0,height:0}),c=t.useRef(),v=t.useRef(),h=t.useMemo((function(){return i((function(e){var t,i,r,n,u=e[0].contentRect.width,l=e[0].contentRect.height;(null===(t=d.current)||void 0===t?void 0:t.width)===u&&(null===(i=d.current)||void 0===i?void 0:i.height)===l||(d.current={width:u,height:l},o({width:null==c||null===(r=c.current)||void 0===r?void 0:r.clientWidth,height:null==c||null===(n=c.current)||void 0===n?void 0:n.clientHeight}))}),r)}),[c,r]);return t.useLayoutEffect((function(){var e,t,i,r;null!=c&&c.current&&(t=null==c?void 0:c.current,(e=new ResizeObserver(h)).observe(t),o({width:null==c||null===(i=c.current)||void 0===i?void 0:i.clientWidth,height:null==c||null===(r=c.current)||void 0===r?void 0:r.clientHeight}));var n=function(){var i,r;null===(i=e)||void 0===i||null===(r=i.unobserve)||void 0===r||r.call(i,t)};return v.current=n,n}),[h,c]),[c,l,v.current]};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../node_modules/lodash-es/debounce.js");exports.useResize=function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,n=arguments.length>1?arguments[1]:void 0,u=t.useState({width:void 0,height:void 0}),l=e.slicedToArray(u,2),o=l[0],d=l[1],c=t.useRef({width:0,height:0}),v=t.useRef(),h=t.useRef(),s=t.useMemo((function(){return i((function(e){var t,i,r,u,l=e[0].contentRect.width,o=e[0].contentRect.height;(null===(t=c.current)||void 0===t?void 0:t.width)===l&&(null===(i=c.current)||void 0===i?void 0:i.height)===o||(c.current={width:l,height:o},(n||d)({width:null==v||null===(r=v.current)||void 0===r?void 0:r.clientWidth,height:null==v||null===(u=v.current)||void 0===u?void 0:u.clientHeight}))}),r)}),[n,r]);return t.useLayoutEffect((function(){var e,t,i,r;null!=v&&v.current&&(t=null==v?void 0:v.current,(e=new ResizeObserver(s)).observe(t),(n||d)({width:null==v||null===(i=v.current)||void 0===i?void 0:i.clientWidth,height:null==v||null===(r=v.current)||void 0===r?void 0:r.clientHeight}));var u=function(){var i,r;null===(i=e)||void 0===i||null===(r=i.unobserve)||void 0===r||r.call(i,t)};return h.current=u,u}),[s,v,n]),[v,o,h.current]};
 //# sourceMappingURL=useResize.js.map

package/dist/lib/cjs/src/core/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\nexport const useResize = (debounceDelay = 250): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n  = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n\n  // const [unobserver, setUnobserver] = useState<Unobserver>(DefaultUnobserver)\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    setContainerSize({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [containerRef, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["debounceDelay","arguments","length","undefined","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"kOASyB,WACmE,IADlEA,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAExCG,EACEC,EAAAA,SAAsB,CAAEC,WAAOH,EAAWI,YAAQJ,IAAYK,EAAAC,EAAAA,cAAAL,EAAA,GADzDM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAAA,OAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,EAAAA,SAGjEE,EAAgBF,EAAAA,SAEhBG,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,GAE9Df,EAAiB,CACfL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE7B,EAAc,GAAE,CAACc,EAAcd,IA0BlC,OAxBA8B,EAAAA,iBAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBrB,EAAiB,CACfL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACT,GAAG,CAACrB,EAAwBF,IAErB,CAACA,EAAcJ,EAAeK,EAAcY,QACrD"}
+{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\ntype CallBack = () => void\n\n// eslint-disable-next-line default-param-last\nexport const useResize = (debounceDelay = 250, callBack?: CallBack): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    // eslint-disable-next-line semi-style\n    ;(callBack || setContainerSize)({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [callBack, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      // eslint-disable-next-line semi-style\n      ;(callBack || setContainerSize)({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef, callBack])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["debounceDelay","arguments","length","undefined","callBack","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"kOAYyB,WACmE,IADlEA,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAAKG,EAAmBH,UAAAC,OAAAD,EAAAA,kBAAAE,EAEhEE,EACIC,EAAAA,SAAsB,CAAEC,WAAOJ,EAAWK,YAAQL,IAAYM,EAAAC,EAAAA,cAAAL,EAAA,GAD3DM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAAA,OAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,EAAAA,SACjEE,EAAgBF,EAAAA,SAEhBG,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,IAG5DvB,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE9B,EAAc,GAAE,CAACI,EAAUJ,IA2B9B,OAzBA+B,EAAAA,iBAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,IAGrB7B,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACR,GAAE,CAACrB,EAAwBF,EAAcX,IAEnC,CAACW,EAAcJ,EAAeK,EAAcY,QACrD"}

package/dist/lib/cjs/src/core/ui/components/container/FBox.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/es.array.concat.js");var r=require("react"),t=require("./fbox.module.scss.js"),a=["style","children","className"],o={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},s=function(e){return e&&o[e]||e},l=r.forwardRef((function(o,l){var i=o.style,c=o.children,n=o.className,d=void 0===n?"":n,u=e.objectWithoutProperties(o,a),f=r.useMemo((function(){return e.objectSpread2(e.objectSpread2(e.objectSpread2(e.objectSpread2(e.objectSpread2({},i),u),u.align?{alignItems:s(u.align)}:{}),u.justify?{justifyContent:s(u.justify)}:{}),u.direction?{flexDirection:u.direction}:{})}),[u,i]);return React.createElement("div",{ref:l,className:"".concat(t["flexible-box"]," ").concat(d),style:f},c)}));l.displayName="FBoxRefForwarded";var i=r.memo(l);i.displayName="FBox",exports.FBox=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/es.array.concat.js");var r=require("react"),t=require("./fbox.module.scss.js"),a=["style","children","tabIndex","className"],o={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},s=function(e){return e&&o[e]||e},l=r.forwardRef((function(o,l){var n=o.style,i=o.children,c=o.tabIndex,d=o.className,u=void 0===d?"":d,f=e.objectWithoutProperties(o,a),x=r.useMemo((function(){return e.objectSpread2(e.objectSpread2(e.objectSpread2(e.objectSpread2(e.objectSpread2({},n),f),f.align?{alignItems:s(f.align)}:{}),f.justify?{justifyContent:s(f.justify)}:{}),f.direction?{flexDirection:f.direction}:{})}),[f,n]);return React.createElement("div",{ref:l,tabIndex:c,className:"".concat(t["flexible-box"]," ").concat(u),style:x},i)}));l.displayName="FBoxRefForwarded";var n=r.memo(l);n.displayName="FBox",exports.FBox=n;
 //# sourceMappingURL=FBox.js.map

package/dist/lib/cjs/src/core/ui/components/container/FBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"FBox.js","sources":["../../../../../../../../src/core/ui/components/container/FBox.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\n\nimport classes from './fbox.module.scss'\n\n\nexport type FBoxProps = PropsWithChildren<any> &{\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n  style?: CSSProperties\n  className?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n\nconst FBoxRefForwarded = forwardRef(({\n  style, children, className = '', ...props\n}: FBoxProps, ref: LegacyRef<HTMLDivElement> | undefined) => {\n  const styles = useMemo(() => (\n    {\n      ...style,\n      ...props,\n      ...(props.align ? { alignItems: resolveFlexProps(props.align) } : {}),\n      ...(props.justify ? { justifyContent: resolveFlexProps(props.justify) } : {}),\n      ...(props.direction ? { flexDirection: props.direction } : {}),\n    }\n  ), [props, style])\n\n  return (\n    <div\n      ref={ref}\n      className={`${(classes as any)['flexible-box']} ${className}`}\n      style={styles as CSSProperties}\n    >\n      {children}\n    </div>\n  )\n})\n\nFBoxRefForwarded.displayName = 'FBoxRefForwarded'\n\nexport const FBox = memo<FBoxProps>(FBoxRefForwarded)\n\n\nFBox.displayName = 'FBox'\n\n\n// default flex centralized, 100% width and height\n// export const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n//   {\n//     width: props.width || '100%',\n//     height: props.height || '100%',\n//     justify: props.justify || 'center',\n//     align: props.align || 'center',\n//     ...props,\n//   }\n// ))``)\n\n// export const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   ...props,\n// }))``)\n\n// export const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   style: {\n//     text: 'blue',\n//     padding: '1rem',\n//     border: '1px solid green',\n//   },\n//   ...props,\n// }))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","FBoxRefForwarded","forwardRef","_ref","ref","style","children","_ref$className","className","props","_objectWithoutProperties","objectWithoutProperties","_excluded","styles","useMemo","_objectSpread","objectSpread2","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","concat","classes","displayName","FBox","memo"],"mappings":"iTAgCMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAmB,SAACC,GAAc,OAA0BA,GAASJ,EAAaI,IAAmBA,CAAK,EAG1GC,EAAmBC,EAAUA,YAAC,SAAAC,EAEtBC,GAA+C,IAD3DC,EAAKF,EAALE,MAAOC,EAAQH,EAARG,SAAQC,EAAAJ,EAAEK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAKE,EAAKC,EAAAC,wBAAAR,EAAAS,GAEnCC,EAASC,EAAAA,SAAQ,WAAA,OAAAC,gBAAAA,EAAAA,cAAAA,EAAAC,cAAAD,EAAAC,cAAAD,EAAAC,cAAA,GAEhBX,GACAI,GACCA,EAAMQ,MAAQ,CAAEC,WAAYnB,EAAiBU,EAAMQ,QAAW,CAAE,GAChER,EAAMU,QAAU,CAAEC,eAAgBrB,EAAiBU,EAAMU,UAAa,CAAE,GACxEV,EAAMY,UAAY,CAAEC,cAAeb,EAAMY,WAAc,CAAE,EAAA,GAE9D,CAACZ,EAAOJ,IAEX,OACEkB,MAAAC,cAAA,MAAA,CACEpB,IAAKA,EACLI,UAAS,GAAAiB,OAAMC,EAAgB,gBAAeD,KAAAA,OAAIjB,GAClDH,MAAOQ,GAENP,EAGP,IAEAL,EAAiB0B,YAAc,uBAElBC,EAAOC,EAAIA,KAAY5B,GAGpC2B,EAAKD,YAAc"}
+{"version":3,"file":"FBox.js","sources":["../../../../../../../../src/core/ui/components/container/FBox.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\n\nimport classes from './fbox.module.scss'\n\n\nexport type FBoxProps = PropsWithChildren<any> &{\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n  style?: CSSProperties\n  className?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n\nconst FBoxRefForwarded = forwardRef(({\n  style, children, tabIndex, className = '', ...props\n}: FBoxProps, ref: LegacyRef<HTMLDivElement> | undefined) => {\n  const styles = useMemo(() => (\n    {\n      ...style,\n      ...props,\n      ...(props.align ? { alignItems: resolveFlexProps(props.align) } : {}),\n      ...(props.justify ? { justifyContent: resolveFlexProps(props.justify) } : {}),\n      ...(props.direction ? { flexDirection: props.direction } : {}),\n    }\n  ), [props, style])\n\n  return (\n    <div\n      ref={ref}\n      tabIndex={tabIndex}\n      className={`${(classes as any)['flexible-box']} ${className}`}\n      style={styles as CSSProperties}\n    >\n      {children}\n    </div>\n  )\n})\n\nFBoxRefForwarded.displayName = 'FBoxRefForwarded'\n\nexport const FBox = memo<FBoxProps>(FBoxRefForwarded)\n\n\nFBox.displayName = 'FBox'\n\n\n// default flex centralized, 100% width and height\n// export const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n//   {\n//     width: props.width || '100%',\n//     height: props.height || '100%',\n//     justify: props.justify || 'center',\n//     align: props.align || 'center',\n//     ...props,\n//   }\n// ))``)\n\n// export const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   ...props,\n// }))``)\n\n// export const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   style: {\n//     text: 'blue',\n//     padding: '1rem',\n//     border: '1px solid green',\n//   },\n//   ...props,\n// }))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","FBoxRefForwarded","forwardRef","_ref","ref","style","children","tabIndex","_ref$className","className","props","_objectWithoutProperties","objectWithoutProperties","_excluded","styles","useMemo","_objectSpread","objectSpread2","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","concat","classes","displayName","FBox","memo"],"mappings":"4TAgCMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAmB,SAACC,GAAc,OAA0BA,GAASJ,EAAaI,IAAmBA,CAAK,EAG1GC,EAAmBC,EAAUA,YAAC,SAAAC,EAEtBC,GAA+C,IAD3DC,EAAKF,EAALE,MAAOC,EAAQH,EAARG,SAAUC,EAAQJ,EAARI,SAAQC,EAAAL,EAAEM,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAKE,EAAKC,EAAAC,wBAAAT,EAAAU,GAE7CC,EAASC,EAAAA,SAAQ,WAAA,OAAAC,gBAAAA,EAAAA,cAAAA,EAAAC,cAAAD,EAAAC,cAAAD,EAAAC,cAAA,GAEhBZ,GACAK,GACCA,EAAMQ,MAAQ,CAAEC,WAAYpB,EAAiBW,EAAMQ,QAAW,CAAE,GAChER,EAAMU,QAAU,CAAEC,eAAgBtB,EAAiBW,EAAMU,UAAa,CAAE,GACxEV,EAAMY,UAAY,CAAEC,cAAeb,EAAMY,WAAc,CAAE,EAAA,GAE9D,CAACZ,EAAOL,IAEX,OACEmB,MAAAC,cAAA,MAAA,CACErB,IAAKA,EACLG,SAAUA,EACVE,UAAS,GAAAiB,OAAMC,EAAgB,gBAAeD,KAAAA,OAAIjB,GAClDJ,MAAOS,GAENR,EAGP,IAEAL,EAAiB2B,YAAc,uBAElBC,EAAOC,EAAIA,KAAY7B,GAGpC4B,EAAKD,YAAc"}

package/dist/lib/cjs/src/core/ui/components/container/ResizableContainer.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../../../node_modules/lodash-es/debounce.js"),n=require("./FBox.js"),r=["children"],l={main:{position:"absolute",zIndex:111,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},o=t.memo((function(o){var u=o.children,c=e.objectWithoutProperties(o,r),h=t.useRef(),d=t.useRef({width:0,height:0}),a=t.useState({width:void 0,height:void 0}),s=e.slicedToArray(a,2),v=s[0],g=s[1],m=t.useMemo((function(){return i((function(e){var t,i,n,r,l=e[0].contentRect.width,o=e[0].contentRect.height;(null===(t=d.current)||void 0===t?void 0:t.width)===l&&(null===(i=d.current)||void 0===i?void 0:i.height)===o||(d.current={width:l,height:o},g({width:null==h||null===(n=h.current)||void 0===n?void 0:n.clientWidth,height:null==h||null===(r=h.current)||void 0===r?void 0:r.clientHeight}))}),250)}),[]);return t.useEffect((function(){var e,t;return null!=h&&h.current&&(t=null==h?void 0:h.current,(e=new ResizeObserver(m)).observe(t)),function(){var i,n;null===(i=e)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,t)}}),[m,h]),React.createElement(n.FBox,e.extends({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},c),React.createElement(n.FBox,{style:l.main,width:"100%",height:"100%",ref:h}),!u&&React.createElement(n.FBox,{width:"".concat(Math.max((null==v?void 0:v.width)||200,200)||200,"px"),height:"".concat(Math.max((null==v?void 0:v.height)||200,200)||200,"px"),style:l.empty}),u&&(null==u?void 0:u({height:"".concat((null==v?void 0:v.height)||200,"px"),width:"".concat((null==v?void 0:v.width)||200,"px"),measured:!(null==v||!v.height)})))}));o.displayName="ResizableContainer",exports.ResizableContainer=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=require("../../../../../node_modules/lodash-es/debounce.js"),n=require("./FBox.js"),l=["children","debounceDelay"],o={main:{position:"absolute",zIndex:111,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},r=t.memo((function(r){var u=r.children,d=r.debounceDelay,c=void 0===d?250:d,h=e.objectWithoutProperties(r,l),a=t.useRef(),s=t.useRef({width:0,height:0}),v=t.useState({width:void 0,height:void 0}),g=e.slicedToArray(v,2),m=g[0],p=g[1],w=t.useMemo((function(){return i((function(e){var t,i,n,l,o=e[0].contentRect.width,r=e[0].contentRect.height;(null===(t=s.current)||void 0===t?void 0:t.width)===o&&(null===(i=s.current)||void 0===i?void 0:i.height)===r||(s.current={width:o,height:r},p({width:null==a||null===(n=a.current)||void 0===n?void 0:n.clientWidth,height:null==a||null===(l=a.current)||void 0===l?void 0:l.clientHeight}))}),c)}),[c]);return t.useLayoutEffect((function(){var e,t,i,n;null!=a&&a.current&&(t=null==a?void 0:a.current,(e=new ResizeObserver(w)).observe(t),p({width:null==a||null===(i=a.current)||void 0===i?void 0:i.clientWidth,height:null==a||null===(n=a.current)||void 0===n?void 0:n.clientHeight}));return function(){var i,n;null===(i=e)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,t)}}),[w,a]),React.createElement(n.FBox,e.extends({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},h),React.createElement(n.FBox,{style:o.main,width:"100%",height:"100%",ref:a}),!u&&React.createElement(n.FBox,{width:"".concat(Math.max((null==m?void 0:m.width)||200,200)||200,"px"),height:"".concat(Math.max((null==m?void 0:m.height)||200,200)||200,"px"),style:o.empty}),u&&(null==u?void 0:u({height:"".concat((null==m?void 0:m.height)||200,"px"),width:"".concat((null==m?void 0:m.width)||200,"px"),measured:!(null==m||!m.height)})))}));r.displayName="ResizableContainer",exports.ResizableContainer=r;
 //# sourceMappingURL=ResizableContainer.js.map

package/dist/lib/cjs/src/core/ui/components/container/ResizableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, useState, useRef, useMemo, useEffect, RefObject, PropsWithChildren } from 'react'\nimport debounce from 'lodash-es/debounce'\n\nimport { FBox, FBoxProps } from './FBox'\n\n\n\n\nexport type ResizableContainerProps = FBoxProps & PropsWithChildren<any>\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 111,\n    left: 0,\n    pointerEvents: 'none',\n    // backgroundColor: '#FF000040',\n  },\n  empty: {\n    pointerEvents: 'none',\n    // background: '#FF000040',\n    // border: '1px solid #0000FF40',\n  },\n}\n\nexport const ResizableContainer = memo<ResizableContainerProps>(\n  ({ children, ...props }: ResizableContainerProps) => {\n    const containerRef = useRef<HTMLDivElement>()\n\n    const lastResizeWidthRef = useRef<{ width: number; height: number }>({ width: 0, height: 0 })\n\n    const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n    const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n      const newResizeWidth = entries[0].contentRect.width\n      const newResizeHeight = entries[0].contentRect.height\n\n      if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n        return\n      }\n      lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }, 250), [])\n\n    useEffect(() => {\n      let resizeObserver: ResizeObserver\n      let containerElement: HTMLElement\n\n      if (containerRef?.current) {\n        containerElement = containerRef?.current\n        resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n        resizeObserver.observe(containerElement as Element)\n      }\n      return () => {\n        resizeObserver?.unobserve?.(containerElement as Element)\n      }\n    }, [debouncedResizeWrapper, containerRef])\n\n    // END RESIZING\n\n    console.log('containerSize', containerSize)\n\n    return (\n      <FBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <FBox\n          style={styles.main}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (<FBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty}\n        />)}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </FBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","props","_objectWithoutProperties","objectWithoutProperties","_excluded","containerRef","useRef","lastResizeWidthRef","width","height","_useState","useState","undefined","_useState2","_slicedToArray","containerSize","setContainerSize","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useEffect","resizeObserver","containerElement","ResizeObserver","observe","_resizeObserver","_resizeObserver$unobs","unobserve","call","React","createElement","FBox","_extends","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"kQAkBMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,IACRC,KAAM,EACNC,cAAe,QAGjBC,MAAO,CACLD,cAAe,SAMNE,EAAqBC,EAAAA,MAChC,SAAAC,GAAqD,IAAlDC,EAAQD,EAARC,SAAaC,EAAKC,EAAAC,wBAAAJ,EAAAK,GACbC,EAAeC,EAAAA,SAEfC,EAAqBD,EAAAA,OAA0C,CAAEE,MAAO,EAAGC,OAAQ,IAEzFC,EACEC,EAAAA,SAAsB,CAAEH,WAAOI,EAAWH,YAAQG,IAAYC,EAAAC,EAAAA,cAAAJ,EAAA,GADzDK,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYlB,MACxCmB,EAAkBP,EAAQ,GAAGM,YAAYjB,QAEjBY,QAA1BA,EAAAd,EAAmBqB,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bb,SAAUiB,IACb,QAA1BH,EAAAf,EAAmBqB,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bb,UAAWkB,IAG1CpB,EAAmBqB,QAAU,CAAEpB,MAAOiB,EAAgBhB,OAAQkB,GAE9DX,EAAiB,CACfR,MAAOH,SAAqBkB,QAATA,EAAZlB,EAAcuB,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BpB,OAAQJ,SAAqB,QAATmB,EAAZnB,EAAcuB,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE,IAAI,GAAE,IAoBT,OAlBAC,EAAAA,WAAU,WACR,IAAIC,EACAC,EAOJ,OALI5B,SAAAA,EAAcuB,UAChBK,EAAmB5B,aAAAA,EAAAA,EAAcuB,SACjCI,EAAiB,IAAIE,eAAejB,IACrBkB,QAAQF,IAElB,WAAM,IAAAG,EAAAC,EACG,QAAdD,EAAAJ,SAAcK,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BH,GAEhC,GAAG,CAAChB,EAAwBZ,IAO1BmC,MAAAC,cAACC,EAAIA,KAAAC,UAAA,CACHnC,MAAM,OACNC,OAAO,OACPmC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACN7C,GAEJuC,MAAAC,cAACC,EAAAA,KAAI,CACHK,MAAOzD,EAAOC,KACdiB,MAAM,OACNC,OAAO,OACPuC,IAAK3C,KAELL,GAAawC,MAAAC,cAACC,EAAAA,KAAI,CAClBlC,MAAK,GAAAyC,OAAKC,KAAKC,KAAIpC,eAAAA,EAAeP,QAAS,IAAK,MAAQ,IAAQ,MAChEC,OAAM,GAAAwC,OAAKC,KAAKC,KAAIpC,eAAAA,EAAeN,SAAU,IAAK,MAAQ,IAAQ,MAClEsC,MAAOzD,EAAOM,QAEfI,IAAYA,aAAQ,EAARA,EAAW,CACtBS,OAAMwC,GAAAA,QAAKlC,aAAa,EAAbA,EAAeN,SAAU,IAAO,MAC3CD,MAAKyC,GAAAA,QAAKlC,aAAa,EAAbA,EAAeP,QAAS,IAAO,MACzC4C,WAAYrC,UAAAA,EAAeN,WAInC,IAGFZ,EAAmBwD,YAAc"}
+{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, useState, useRef, useMemo, useLayoutEffect, RefObject, PropsWithChildren } from 'react'\nimport debounce from 'lodash-es/debounce'\n\nimport { FBox, FBoxProps } from './FBox'\n\n\nexport type ResizableContainerProps = FBoxProps & PropsWithChildren<any> & {\n  debounceDelay?: number\n}\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 111,\n    left: 0,\n    pointerEvents: 'none',\n    // backgroundColor: '#FF000040',\n  },\n  empty: {\n    pointerEvents: 'none',\n    // background: '#FF000040',\n    // border: '1px solid #0000FF40',\n  },\n}\n\nexport const ResizableContainer = memo<ResizableContainerProps>(\n  ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n    const containerRef = useRef<HTMLDivElement>()\n\n    const lastResizeWidthRef = useRef<{ width: number; height: number }>({ width: 0, height: 0 })\n\n    const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n    const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n      const newResizeWidth = entries[0].contentRect.width\n      const newResizeHeight = entries[0].contentRect.height\n\n      if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n        return\n      }\n      lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }, debounceDelay), [debounceDelay])\n\n    useLayoutEffect(() => {\n      let resizeObserver: ResizeObserver\n      let containerElement: HTMLElement\n\n      if (containerRef?.current) {\n        containerElement = containerRef?.current\n        resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n        resizeObserver.observe(containerElement as Element)\n\n        setContainerSize({\n          width: containerRef?.current?.clientWidth,\n          height: containerRef?.current?.clientHeight,\n        })\n      }\n      return () => {\n        resizeObserver?.unobserve?.(containerElement as Element)\n      }\n    }, [debouncedResizeWrapper, containerRef])\n\n    // END RESIZING\n\n    return (\n      <FBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <FBox\n          style={styles.main}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (<FBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty}\n        />)}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </FBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","objectWithoutProperties","_excluded","containerRef","useRef","lastResizeWidthRef","width","height","_useState","useState","undefined","_useState2","_slicedToArray","containerSize","setContainerSize","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","_resizeObserver","_resizeObserver$unobs","unobserve","call","React","createElement","FBox","_extends","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"kRAkBMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,IACRC,KAAM,EACNC,cAAe,QAGjBC,MAAO,CACLD,cAAe,SAMNE,EAAqBC,EAAAA,MAChC,SAAAC,GAA0E,IAAvEC,EAAQD,EAARC,SAAQC,EAAAF,EAAEG,cAAAA,OAAgB,IAAHD,EAAG,IAAGA,EAAKE,EAAKC,EAAAC,wBAAAN,EAAAO,GAClCC,EAAeC,EAAAA,SAEfC,EAAqBD,EAAAA,OAA0C,CAAEE,MAAO,EAAGC,OAAQ,IAEzFC,EACEC,EAAAA,SAAsB,CAAEH,WAAOI,EAAWH,YAAQG,IAAYC,EAAAC,EAAAA,cAAAJ,EAAA,GADzDK,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAyBC,EAAAA,SAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYlB,MACxCmB,EAAkBP,EAAQ,GAAGM,YAAYjB,QAEjBY,QAA1BA,EAAAd,EAAmBqB,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bb,SAAUiB,IACb,QAA1BH,EAAAf,EAAmBqB,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bb,UAAWkB,IAG1CpB,EAAmBqB,QAAU,CAAEpB,MAAOiB,EAAgBhB,OAAQkB,GAE9DX,EAAiB,CACfR,MAAOH,SAAqBkB,QAATA,EAAZlB,EAAcuB,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BpB,OAAQJ,SAAqB,QAATmB,EAAZnB,EAAcuB,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE9B,KAAgB,CAACA,IAuBpB,OArBA+B,EAAAA,iBAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvB9B,SAAAA,EAAcuB,UAChBK,EAAmB5B,aAAAA,EAAAA,EAAcuB,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBjB,EAAiB,CACfR,MAAOH,SAAqB6B,QAATA,EAAZ7B,EAAcuB,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BpB,OAAQJ,SAAqB,QAAT8B,EAAZ9B,EAAcuB,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,OAAO,WAAM,IAAAQ,EAAAC,EACG,QAAdD,EAAAN,SAAcO,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BL,GAEhC,GAAG,CAAChB,EAAwBZ,IAK1BqC,MAAAC,cAACC,EAAIA,KAAAC,UAAA,CACHrC,MAAM,OACNC,OAAO,OACPqC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACN/C,GAEJyC,MAAAC,cAACC,EAAAA,KAAI,CACHK,MAAO7D,EAAOC,KACdmB,MAAM,OACNC,OAAO,OACPyC,IAAK7C,KAELP,GAAa4C,MAAAC,cAACC,EAAAA,KAAI,CAClBpC,MAAK,GAAA2C,OAAKC,KAAKC,KAAItC,eAAAA,EAAeP,QAAS,IAAK,MAAQ,IAAQ,MAChEC,OAAM,GAAA0C,OAAKC,KAAKC,KAAItC,eAAAA,EAAeN,SAAU,IAAK,MAAQ,IAAQ,MAClEwC,MAAO7D,EAAOM,QAEfI,IAAYA,aAAQ,EAARA,EAAW,CACtBW,OAAM0C,GAAAA,QAAKpC,aAAa,EAAbA,EAAeN,SAAU,IAAO,MAC3CD,MAAK2C,GAAAA,QAAKpC,aAAa,EAAbA,EAAeP,QAAS,IAAO,MACzC8C,WAAYvC,UAAAA,EAAeN,WAInC,IAGFd,EAAmB4D,YAAc"}

package/dist/lib/esm/src/core/hooks/useResize.js

@@ -1,2 +1,2 @@
-import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as e,useRef as i,useMemo as n,useLayoutEffect as r}from"react";import l from"../../../node_modules/lodash-es/debounce.js";var o=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,u=e({width:void 0,height:void 0}),d=t(u,2),c=d[0],v=d[1],h=i({width:0,height:0}),a=i(),s=i(),g=n((function(){return l((function(t){var e,i,n,r,l=t[0].contentRect.width,o=t[0].contentRect.height;(null===(e=h.current)||void 0===e?void 0:e.width)===l&&(null===(i=h.current)||void 0===i?void 0:i.height)===o||(h.current={width:l,height:o},v({width:null==a||null===(n=a.current)||void 0===n?void 0:n.clientWidth,height:null==a||null===(r=a.current)||void 0===r?void 0:r.clientHeight}))}),o)}),[a,o]);return r((function(){var t,e,i,n;null!=a&&a.current&&(e=null==a?void 0:a.current,(t=new ResizeObserver(g)).observe(e),v({width:null==a||null===(i=a.current)||void 0===i?void 0:i.clientWidth,height:null==a||null===(n=a.current)||void 0===n?void 0:n.clientHeight}));var r=function(){var i,n;null===(i=t)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,e)};return s.current=r,r}),[g,a]),[a,c,s.current]};export{o as useResize};
+import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as e,useRef as i,useMemo as n,useLayoutEffect as r}from"react";import l from"../../../node_modules/lodash-es/debounce.js";var o=function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:250,u=arguments.length>1?arguments[1]:void 0,d=e({width:void 0,height:void 0}),v=t(d,2),c=v[0],h=v[1],a=i({width:0,height:0}),g=i(),s=i(),f=n((function(){return l((function(t){var e,i,n,r,l=t[0].contentRect.width,o=t[0].contentRect.height;(null===(e=a.current)||void 0===e?void 0:e.width)===l&&(null===(i=a.current)||void 0===i?void 0:i.height)===o||(a.current={width:l,height:o},(u||h)({width:null==g||null===(n=g.current)||void 0===n?void 0:n.clientWidth,height:null==g||null===(r=g.current)||void 0===r?void 0:r.clientHeight}))}),o)}),[u,o]);return r((function(){var t,e,i,n;null!=g&&g.current&&(e=null==g?void 0:g.current,(t=new ResizeObserver(f)).observe(e),(u||h)({width:null==g||null===(i=g.current)||void 0===i?void 0:i.clientWidth,height:null==g||null===(n=g.current)||void 0===n?void 0:n.clientHeight}));var r=function(){var i,n;null===(i=t)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,e)};return s.current=r,r}),[f,g,u]),[g,c,s.current]};export{o as useResize};
 //# sourceMappingURL=useResize.js.map

package/dist/lib/esm/src/core/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\nexport const useResize = (debounceDelay = 250): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n  = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n\n  // const [unobserver, setUnobserver] = useState<Unobserver>(DefaultUnobserver)\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    setContainerSize({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [containerRef, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["useResize","debounceDelay","arguments","length","undefined","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"6NASaA,EAAY,WACmE,IADlEC,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAExCG,EACEC,EAAsB,CAAEC,WAAOH,EAAWI,YAAQJ,IAAYK,EAAAC,EAAAL,EAAA,GADzDM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,IAGjEE,EAAgBF,IAEhBG,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,GAE9Df,EAAiB,CACfL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE7B,EAAc,GAAE,CAACc,EAAcd,IA0BlC,OAxBA8B,GAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBrB,EAAiB,CACfL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACT,GAAG,CAACrB,EAAwBF,IAErB,CAACA,EAAcJ,EAAeK,EAAcY,QACrD"}
+{"version":3,"file":"useResize.js","sources":["../../../../../../src/core/hooks/useResize.ts"],"sourcesContent":["import { MutableRefObject, useLayoutEffect, useMemo, useState, useRef } from 'react'\nimport debounce from 'lodash-es/debounce'\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\n// const DefaultUnobserver = () => null\n\ntype Unobserver = () => (null | void)\n\ntype CallBack = () => void\n\n// eslint-disable-next-line default-param-last\nexport const useResize = (debounceDelay = 250, callBack?: CallBack): [\n  MutableRefObject<HTMLElement | null | undefined>, WrapperSize, Unobserver | undefined] => {\n  const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n  const lastResizeWidthRef = useRef<WrapperSize>({ width: 0, height: 0 })\n  const containerRef: MutableRefObject<HTMLElement | undefined | null> = useRef<HTMLElement | undefined | null>()\n  const unobserverRef = useRef<Unobserver>()\n\n  const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n    const newResizeWidth = entries[0].contentRect.width\n    const newResizeHeight = entries[0].contentRect.height\n\n    if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n      return\n    }\n    lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n    // eslint-disable-next-line semi-style\n    ;(callBack || setContainerSize)({\n      width: containerRef?.current?.clientWidth,\n      height: containerRef?.current?.clientHeight,\n    })\n  }, debounceDelay), [callBack, debounceDelay])\n\n  useLayoutEffect(() => {\n    let resizeObserver: ResizeObserver\n    let containerElement: HTMLElement\n\n    if (containerRef?.current) {\n      containerElement = containerRef?.current\n      resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n      resizeObserver.observe(containerElement as Element)\n\n      // eslint-disable-next-line semi-style\n      ;(callBack || setContainerSize)({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }\n    const unobserver = () => {\n      resizeObserver?.unobserve?.(containerElement as Element)\n    }\n\n    // setUnobserver(unobserver)\n    unobserverRef.current = unobserver\n\n    return unobserver\n  }, [debouncedResizeWrapper, containerRef, callBack])\n\n  return [containerRef, containerSize, unobserverRef.current]\n}\n"],"names":["useResize","debounceDelay","arguments","length","undefined","callBack","_useState","useState","width","height","_useState2","_slicedToArray","containerSize","setContainerSize","lastResizeWidthRef","useRef","containerRef","unobserverRef","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","unobserver","_resizeObserver","_resizeObserver$unobs","unobserve","call"],"mappings":"6NAYaA,EAAY,WACmE,IADlEC,EAAaC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,IAAKG,EAAmBH,UAAAC,OAAAD,EAAAA,kBAAAE,EAEhEE,EACIC,EAAsB,CAAEC,WAAOJ,EAAWK,YAAQL,IAAYM,EAAAC,EAAAL,EAAA,GAD3DM,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAqBC,EAAoB,CAAEP,MAAO,EAAGC,OAAQ,IAC7DO,EAAiED,IACjEE,EAAgBF,IAEhBG,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYnB,MACxCoB,EAAkBP,EAAQ,GAAGM,YAAYlB,QAEjBa,QAA1BA,EAAAR,EAAmBe,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bd,SAAUkB,IACX,QAA1BH,EAAAT,EAAmBe,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bd,UAAWmB,IAG5Cd,EAAmBe,QAAU,CAAErB,MAAOkB,EAAgBjB,OAAQmB,IAG5DvB,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBQ,QAATA,EAAZR,EAAca,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BrB,OAAQO,SAAqB,QAATS,EAAZT,EAAca,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE9B,EAAc,GAAE,CAACI,EAAUJ,IA2B9B,OAzBA+B,GAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvBpB,SAAAA,EAAca,UAChBK,EAAmBlB,aAAAA,EAAAA,EAAca,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,IAGrB7B,GAAYQ,GAAkB,CAC9BL,MAAOQ,SAAqBmB,QAATA,EAAZnB,EAAca,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BrB,OAAQO,SAAqB,QAAToB,EAAZpB,EAAca,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,IAAMQ,EAAa,WAAM,IAAAC,EAAAC,EACT,QAAdD,EAAAP,SAAcQ,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BN,IAM9B,OAFAjB,EAAcY,QAAUU,EAEjBA,CACR,GAAE,CAACrB,EAAwBF,EAAcX,IAEnC,CAACW,EAAcJ,EAAeK,EAAcY,QACrD"}

package/dist/lib/esm/src/core/ui/components/container/FBox.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,objectSpread2 as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../node_modules/core-js/modules/es.array.concat.js";import{memo as r,forwardRef as a,useMemo as o}from"react";import s from"./fbox.module.scss.js";var l=["style","children","className"],i={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},n=function(e){return e&&i[e]||e},c=a((function(r,a){var i=r.style,c=r.children,f=r.className,d=void 0===f?"":f,m=e(r,l),u=o((function(){return t(t(t(t(t({},i),m),m.align?{alignItems:n(m.align)}:{}),m.justify?{justifyContent:n(m.justify)}:{}),m.direction?{flexDirection:m.direction}:{})}),[m,i]);return React.createElement("div",{ref:a,className:"".concat(s["flexible-box"]," ").concat(d),style:u},c)}));c.displayName="FBoxRefForwarded";var f=r(c);f.displayName="FBox";export{f as FBox};
+import{objectWithoutProperties as e,objectSpread2 as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../node_modules/core-js/modules/es.array.concat.js";import{memo as r,forwardRef as a,useMemo as o}from"react";import s from"./fbox.module.scss.js";var l=["style","children","tabIndex","className"],n={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},i=function(e){return e&&n[e]||e},c=a((function(r,a){var n=r.style,c=r.children,d=r.tabIndex,f=r.className,m=void 0===f?"":f,u=e(r,l),x=o((function(){return t(t(t(t(t({},n),u),u.align?{alignItems:i(u.align)}:{}),u.justify?{justifyContent:i(u.justify)}:{}),u.direction?{flexDirection:u.direction}:{})}),[u,n]);return React.createElement("div",{ref:a,tabIndex:d,className:"".concat(s["flexible-box"]," ").concat(m),style:x},c)}));c.displayName="FBoxRefForwarded";var d=r(c);d.displayName="FBox";export{d as FBox};
 //# sourceMappingURL=FBox.js.map

package/dist/lib/esm/src/core/ui/components/container/FBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"FBox.js","sources":["../../../../../../../../src/core/ui/components/container/FBox.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\n\nimport classes from './fbox.module.scss'\n\n\nexport type FBoxProps = PropsWithChildren<any> &{\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n  style?: CSSProperties\n  className?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n\nconst FBoxRefForwarded = forwardRef(({\n  style, children, className = '', ...props\n}: FBoxProps, ref: LegacyRef<HTMLDivElement> | undefined) => {\n  const styles = useMemo(() => (\n    {\n      ...style,\n      ...props,\n      ...(props.align ? { alignItems: resolveFlexProps(props.align) } : {}),\n      ...(props.justify ? { justifyContent: resolveFlexProps(props.justify) } : {}),\n      ...(props.direction ? { flexDirection: props.direction } : {}),\n    }\n  ), [props, style])\n\n  return (\n    <div\n      ref={ref}\n      className={`${(classes as any)['flexible-box']} ${className}`}\n      style={styles as CSSProperties}\n    >\n      {children}\n    </div>\n  )\n})\n\nFBoxRefForwarded.displayName = 'FBoxRefForwarded'\n\nexport const FBox = memo<FBoxProps>(FBoxRefForwarded)\n\n\nFBox.displayName = 'FBox'\n\n\n// default flex centralized, 100% width and height\n// export const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n//   {\n//     width: props.width || '100%',\n//     height: props.height || '100%',\n//     justify: props.justify || 'center',\n//     align: props.align || 'center',\n//     ...props,\n//   }\n// ))``)\n\n// export const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   ...props,\n// }))``)\n\n// export const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   style: {\n//     text: 'blue',\n//     padding: '1rem',\n//     border: '1px solid green',\n//   },\n//   ...props,\n// }))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","FBoxRefForwarded","forwardRef","_ref","ref","style","children","_ref$className","className","props","_objectWithoutProperties","_excluded","styles","useMemo","_objectSpread","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","concat","classes","displayName","FBox","memo"],"mappings":"+TAgCMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAmB,SAACC,GAAc,OAA0BA,GAASJ,EAAaI,IAAmBA,CAAK,EAG1GC,EAAmBC,GAAW,SAAAC,EAEtBC,GAA+C,IAD3DC,EAAKF,EAALE,MAAOC,EAAQH,EAARG,SAAQC,EAAAJ,EAAEK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAKE,EAAKC,EAAAP,EAAAQ,GAEnCC,EAASC,GAAQ,WAAA,OAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,GAEhBT,GACAI,GACCA,EAAMM,MAAQ,CAAEC,WAAYjB,EAAiBU,EAAMM,QAAW,CAAE,GAChEN,EAAMQ,QAAU,CAAEC,eAAgBnB,EAAiBU,EAAMQ,UAAa,CAAE,GACxER,EAAMU,UAAY,CAAEC,cAAeX,EAAMU,WAAc,CAAE,EAAA,GAE9D,CAACV,EAAOJ,IAEX,OACEgB,MAAAC,cAAA,MAAA,CACElB,IAAKA,EACLI,UAAS,GAAAe,OAAMC,EAAgB,gBAAeD,KAAAA,OAAIf,GAClDH,MAAOO,GAENN,EAGP,IAEAL,EAAiBwB,YAAc,uBAElBC,EAAOC,EAAgB1B,GAGpCyB,EAAKD,YAAc"}
+{"version":3,"file":"FBox.js","sources":["../../../../../../../../src/core/ui/components/container/FBox.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\n\nimport classes from './fbox.module.scss'\n\n\nexport type FBoxProps = PropsWithChildren<any> &{\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n  style?: CSSProperties\n  className?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n\nconst FBoxRefForwarded = forwardRef(({\n  style, children, tabIndex, className = '', ...props\n}: FBoxProps, ref: LegacyRef<HTMLDivElement> | undefined) => {\n  const styles = useMemo(() => (\n    {\n      ...style,\n      ...props,\n      ...(props.align ? { alignItems: resolveFlexProps(props.align) } : {}),\n      ...(props.justify ? { justifyContent: resolveFlexProps(props.justify) } : {}),\n      ...(props.direction ? { flexDirection: props.direction } : {}),\n    }\n  ), [props, style])\n\n  return (\n    <div\n      ref={ref}\n      tabIndex={tabIndex}\n      className={`${(classes as any)['flexible-box']} ${className}`}\n      style={styles as CSSProperties}\n    >\n      {children}\n    </div>\n  )\n})\n\nFBoxRefForwarded.displayName = 'FBoxRefForwarded'\n\nexport const FBox = memo<FBoxProps>(FBoxRefForwarded)\n\n\nFBox.displayName = 'FBox'\n\n\n// default flex centralized, 100% width and height\n// export const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n//   {\n//     width: props.width || '100%',\n//     height: props.height || '100%',\n//     justify: props.justify || 'center',\n//     align: props.align || 'center',\n//     ...props,\n//   }\n// ))``)\n\n// export const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   ...props,\n// }))``)\n\n// export const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n//   size: 'unset',\n//   width: 'initial',\n//   style: {\n//     text: 'blue',\n//     padding: '1rem',\n//     border: '1px solid green',\n//   },\n//   ...props,\n// }))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","FBoxRefForwarded","forwardRef","_ref","ref","style","children","tabIndex","_ref$className","className","props","_objectWithoutProperties","_excluded","styles","useMemo","_objectSpread","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","concat","classes","displayName","FBox","memo"],"mappings":"0UAgCMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAmB,SAACC,GAAc,OAA0BA,GAASJ,EAAaI,IAAmBA,CAAK,EAG1GC,EAAmBC,GAAW,SAAAC,EAEtBC,GAA+C,IAD3DC,EAAKF,EAALE,MAAOC,EAAQH,EAARG,SAAUC,EAAQJ,EAARI,SAAQC,EAAAL,EAAEM,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAKE,EAAKC,EAAAR,EAAAS,GAE7CC,EAASC,GAAQ,WAAA,OAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,GAEhBV,GACAK,GACCA,EAAMM,MAAQ,CAAEC,WAAYlB,EAAiBW,EAAMM,QAAW,CAAE,GAChEN,EAAMQ,QAAU,CAAEC,eAAgBpB,EAAiBW,EAAMQ,UAAa,CAAE,GACxER,EAAMU,UAAY,CAAEC,cAAeX,EAAMU,WAAc,CAAE,EAAA,GAE9D,CAACV,EAAOL,IAEX,OACEiB,MAAAC,cAAA,MAAA,CACEnB,IAAKA,EACLG,SAAUA,EACVE,UAAS,GAAAe,OAAMC,EAAgB,gBAAeD,KAAAA,OAAIf,GAClDJ,MAAOQ,GAENP,EAGP,IAEAL,EAAiByB,YAAc,uBAElBC,EAAOC,EAAgB3B,GAGpC0B,EAAKD,YAAc"}

package/dist/lib/esm/src/core/ui/components/container/ResizableContainer.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,slicedToArray as t,extends as i}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as n,useRef as o,useState as r,useMemo as l,useEffect as h}from"react";import c from"../../../../../node_modules/lodash-es/debounce.js";import{FBox as d}from"./FBox.js";var u=["children"],a={main:{position:"absolute",zIndex:111,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},v=n((function(n){var v=n.children,s=e(n,u),m=o(),p=o({width:0,height:0}),g=r({width:void 0,height:void 0}),w=t(g,2),f=w[0],x=w[1],b=l((function(){return c((function(e){var t,i,n,o,r=e[0].contentRect.width,l=e[0].contentRect.height;(null===(t=p.current)||void 0===t?void 0:t.width)===r&&(null===(i=p.current)||void 0===i?void 0:i.height)===l||(p.current={width:r,height:l},x({width:null==m||null===(n=m.current)||void 0===n?void 0:n.clientWidth,height:null==m||null===(o=m.current)||void 0===o?void 0:o.clientHeight}))}),250)}),[]);return h((function(){var e,t;return null!=m&&m.current&&(t=null==m?void 0:m.current,(e=new ResizeObserver(b)).observe(t)),function(){var i,n;null===(i=e)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,t)}}),[b,m]),React.createElement(d,i({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},s),React.createElement(d,{style:a.main,width:"100%",height:"100%",ref:m}),!v&&React.createElement(d,{width:"".concat(Math.max((null==f?void 0:f.width)||200,200)||200,"px"),height:"".concat(Math.max((null==f?void 0:f.height)||200,200)||200,"px"),style:a.empty}),v&&(null==v?void 0:v({height:"".concat((null==f?void 0:f.height)||200,"px"),width:"".concat((null==f?void 0:f.width)||200,"px"),measured:!(null==f||!f.height)})))}));v.displayName="ResizableContainer";export{v as ResizableContainer};
+import{objectWithoutProperties as e,slicedToArray as t,extends as i}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as n,useRef as l,useState as o,useMemo as r,useLayoutEffect as d}from"react";import h from"../../../../../node_modules/lodash-es/debounce.js";import{FBox as u}from"./FBox.js";var c=["children","debounceDelay"],a={main:{position:"absolute",zIndex:111,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},v=n((function(n){var v=n.children,s=n.debounceDelay,m=void 0===s?250:s,g=e(n,c),p=l(),w=l({width:0,height:0}),f=o({width:void 0,height:void 0}),b=t(f,2),x=b[0],y=b[1],R=r((function(){return h((function(e){var t,i,n,l,o=e[0].contentRect.width,r=e[0].contentRect.height;(null===(t=w.current)||void 0===t?void 0:t.width)===o&&(null===(i=w.current)||void 0===i?void 0:i.height)===r||(w.current={width:o,height:r},y({width:null==p||null===(n=p.current)||void 0===n?void 0:n.clientWidth,height:null==p||null===(l=p.current)||void 0===l?void 0:l.clientHeight}))}),m)}),[m]);return d((function(){var e,t,i,n;null!=p&&p.current&&(t=null==p?void 0:p.current,(e=new ResizeObserver(R)).observe(t),y({width:null==p||null===(i=p.current)||void 0===i?void 0:i.clientWidth,height:null==p||null===(n=p.current)||void 0===n?void 0:n.clientHeight}));return function(){var i,n;null===(i=e)||void 0===i||null===(n=i.unobserve)||void 0===n||n.call(i,t)}}),[R,p]),React.createElement(u,i({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},g),React.createElement(u,{style:a.main,width:"100%",height:"100%",ref:p}),!v&&React.createElement(u,{width:"".concat(Math.max((null==x?void 0:x.width)||200,200)||200,"px"),height:"".concat(Math.max((null==x?void 0:x.height)||200,200)||200,"px"),style:a.empty}),v&&(null==v?void 0:v({height:"".concat((null==x?void 0:x.height)||200,"px"),width:"".concat((null==x?void 0:x.width)||200,"px"),measured:!(null==x||!x.height)})))}));v.displayName="ResizableContainer";export{v as ResizableContainer};
 //# sourceMappingURL=ResizableContainer.js.map

package/dist/lib/esm/src/core/ui/components/container/ResizableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, useState, useRef, useMemo, useEffect, RefObject, PropsWithChildren } from 'react'\nimport debounce from 'lodash-es/debounce'\n\nimport { FBox, FBoxProps } from './FBox'\n\n\n\n\nexport type ResizableContainerProps = FBoxProps & PropsWithChildren<any>\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 111,\n    left: 0,\n    pointerEvents: 'none',\n    // backgroundColor: '#FF000040',\n  },\n  empty: {\n    pointerEvents: 'none',\n    // background: '#FF000040',\n    // border: '1px solid #0000FF40',\n  },\n}\n\nexport const ResizableContainer = memo<ResizableContainerProps>(\n  ({ children, ...props }: ResizableContainerProps) => {\n    const containerRef = useRef<HTMLDivElement>()\n\n    const lastResizeWidthRef = useRef<{ width: number; height: number }>({ width: 0, height: 0 })\n\n    const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n    const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n      const newResizeWidth = entries[0].contentRect.width\n      const newResizeHeight = entries[0].contentRect.height\n\n      if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n        return\n      }\n      lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }, 250), [])\n\n    useEffect(() => {\n      let resizeObserver: ResizeObserver\n      let containerElement: HTMLElement\n\n      if (containerRef?.current) {\n        containerElement = containerRef?.current\n        resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n        resizeObserver.observe(containerElement as Element)\n      }\n      return () => {\n        resizeObserver?.unobserve?.(containerElement as Element)\n      }\n    }, [debouncedResizeWrapper, containerRef])\n\n    // END RESIZING\n\n    console.log('containerSize', containerSize)\n\n    return (\n      <FBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <FBox\n          style={styles.main}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (<FBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty}\n        />)}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </FBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","props","_objectWithoutProperties","_excluded","containerRef","useRef","lastResizeWidthRef","width","height","_useState","useState","undefined","_useState2","_slicedToArray","containerSize","setContainerSize","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useEffect","resizeObserver","containerElement","ResizeObserver","observe","_resizeObserver","_resizeObserver$unobs","unobserve","call","React","createElement","FBox","_extends","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"uUAkBMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,IACRC,KAAM,EACNC,cAAe,QAGjBC,MAAO,CACLD,cAAe,SAMNE,EAAqBC,GAChC,SAAAC,GAAqD,IAAlDC,EAAQD,EAARC,SAAaC,EAAKC,EAAAH,EAAAI,GACbC,EAAeC,IAEfC,EAAqBD,EAA0C,CAAEE,MAAO,EAAGC,OAAQ,IAEzFC,EACEC,EAAsB,CAAEH,WAAOI,EAAWH,YAAQG,IAAYC,EAAAC,EAAAJ,EAAA,GADzDK,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYlB,MACxCmB,EAAkBP,EAAQ,GAAGM,YAAYjB,QAEjBY,QAA1BA,EAAAd,EAAmBqB,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bb,SAAUiB,IACb,QAA1BH,EAAAf,EAAmBqB,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bb,UAAWkB,IAG1CpB,EAAmBqB,QAAU,CAAEpB,MAAOiB,EAAgBhB,OAAQkB,GAE9DX,EAAiB,CACfR,MAAOH,SAAqBkB,QAATA,EAAZlB,EAAcuB,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BpB,OAAQJ,SAAqB,QAATmB,EAAZnB,EAAcuB,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE,IAAI,GAAE,IAoBT,OAlBAC,GAAU,WACR,IAAIC,EACAC,EAOJ,OALI5B,SAAAA,EAAcuB,UAChBK,EAAmB5B,aAAAA,EAAAA,EAAcuB,SACjCI,EAAiB,IAAIE,eAAejB,IACrBkB,QAAQF,IAElB,WAAM,IAAAG,EAAAC,EACG,QAAdD,EAAAJ,SAAcK,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BH,GAEhC,GAAG,CAAChB,EAAwBZ,IAO1BmC,MAAAC,cAACC,EAAIC,EAAA,CACHnC,MAAM,OACNC,OAAO,OACPmC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACN5C,GAEJsC,MAAAC,cAACC,EAAI,CACHK,MAAOxD,EAAOC,KACdgB,MAAM,OACNC,OAAO,OACPuC,IAAK3C,KAELJ,GAAauC,MAAAC,cAACC,EAAI,CAClBlC,MAAK,GAAAyC,OAAKC,KAAKC,KAAIpC,eAAAA,EAAeP,QAAS,IAAK,MAAQ,IAAQ,MAChEC,OAAM,GAAAwC,OAAKC,KAAKC,KAAIpC,eAAAA,EAAeN,SAAU,IAAK,MAAQ,IAAQ,MAClEsC,MAAOxD,EAAOM,QAEfI,IAAYA,aAAQ,EAARA,EAAW,CACtBQ,OAAMwC,GAAAA,QAAKlC,aAAa,EAAbA,EAAeN,SAAU,IAAO,MAC3CD,MAAKyC,GAAAA,QAAKlC,aAAa,EAAbA,EAAeP,QAAS,IAAO,MACzC4C,WAAYrC,UAAAA,EAAeN,WAInC,IAGFX,EAAmBuD,YAAc"}
+{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, useState, useRef, useMemo, useLayoutEffect, RefObject, PropsWithChildren } from 'react'\nimport debounce from 'lodash-es/debounce'\n\nimport { FBox, FBoxProps } from './FBox'\n\n\nexport type ResizableContainerProps = FBoxProps & PropsWithChildren<any> & {\n  debounceDelay?: number\n}\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\ntype WrapperSize = {width: undefined | number; height: undefined | number}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 111,\n    left: 0,\n    pointerEvents: 'none',\n    // backgroundColor: '#FF000040',\n  },\n  empty: {\n    pointerEvents: 'none',\n    // background: '#FF000040',\n    // border: '1px solid #0000FF40',\n  },\n}\n\nexport const ResizableContainer = memo<ResizableContainerProps>(\n  ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n    const containerRef = useRef<HTMLDivElement>()\n\n    const lastResizeWidthRef = useRef<{ width: number; height: number }>({ width: 0, height: 0 })\n\n    const [containerSize, setContainerSize]\n    = useState<WrapperSize>({ width: undefined, height: undefined })\n\n    const debouncedResizeWrapper = useMemo(() => debounce((entries) => {\n      const newResizeWidth = entries[0].contentRect.width\n      const newResizeHeight = entries[0].contentRect.height\n\n      if (lastResizeWidthRef.current?.width === newResizeWidth\n      && lastResizeWidthRef.current?.height === newResizeHeight) {\n        return\n      }\n      lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight }\n\n      setContainerSize({\n        width: containerRef?.current?.clientWidth,\n        height: containerRef?.current?.clientHeight,\n      })\n    }, debounceDelay), [debounceDelay])\n\n    useLayoutEffect(() => {\n      let resizeObserver: ResizeObserver\n      let containerElement: HTMLElement\n\n      if (containerRef?.current) {\n        containerElement = containerRef?.current\n        resizeObserver = new ResizeObserver(debouncedResizeWrapper)\n        resizeObserver.observe(containerElement as Element)\n\n        setContainerSize({\n          width: containerRef?.current?.clientWidth,\n          height: containerRef?.current?.clientHeight,\n        })\n      }\n      return () => {\n        resizeObserver?.unobserve?.(containerElement as Element)\n      }\n    }, [debouncedResizeWrapper, containerRef])\n\n    // END RESIZING\n\n    return (\n      <FBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <FBox\n          style={styles.main}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (<FBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty}\n        />)}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </FBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","containerRef","useRef","lastResizeWidthRef","width","height","_useState","useState","undefined","_useState2","_slicedToArray","containerSize","setContainerSize","debouncedResizeWrapper","useMemo","debounce","entries","_lastResizeWidthRef$c","_lastResizeWidthRef$c2","_containerRef$current","_containerRef$current2","newResizeWidth","contentRect","newResizeHeight","current","clientWidth","clientHeight","useLayoutEffect","resizeObserver","containerElement","_containerRef$current3","_containerRef$current4","ResizeObserver","observe","_resizeObserver","_resizeObserver$unobs","unobserve","call","React","createElement","FBox","_extends","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"6VAkBMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,IACRC,KAAM,EACNC,cAAe,QAGjBC,MAAO,CACLD,cAAe,SAMNE,EAAqBC,GAChC,SAAAC,GAA0E,IAAvEC,EAAQD,EAARC,SAAQC,EAAAF,EAAEG,cAAAA,OAAgB,IAAHD,EAAG,IAAGA,EAAKE,EAAKC,EAAAL,EAAAM,GAClCC,EAAeC,IAEfC,EAAqBD,EAA0C,CAAEE,MAAO,EAAGC,OAAQ,IAEzFC,EACEC,EAAsB,CAAEH,WAAOI,EAAWH,YAAQG,IAAYC,EAAAC,EAAAJ,EAAA,GADzDK,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAGhCI,EAAyBC,GAAQ,WAAA,OAAMC,GAAS,SAACC,GAAY,IAAAC,EAAAC,EAAAC,EAAAC,EAC3DC,EAAiBL,EAAQ,GAAGM,YAAYlB,MACxCmB,EAAkBP,EAAQ,GAAGM,YAAYjB,QAEjBY,QAA1BA,EAAAd,EAAmBqB,eAAnBP,IAA0BA,OAA1BA,EAAAA,EAA4Bb,SAAUiB,IACb,QAA1BH,EAAAf,EAAmBqB,eAAO,IAAAN,OAAA,EAA1BA,EAA4Bb,UAAWkB,IAG1CpB,EAAmBqB,QAAU,CAAEpB,MAAOiB,EAAgBhB,OAAQkB,GAE9DX,EAAiB,CACfR,MAAOH,SAAqBkB,QAATA,EAAZlB,EAAcuB,eAAdL,IAAqBA,SAArBA,EAAuBM,YAC9BpB,OAAQJ,SAAqB,QAATmB,EAAZnB,EAAcuB,eAAO,IAAAJ,SAArBA,EAAuBM,eAElC,GAAE7B,KAAgB,CAACA,IAuBpB,OArBA8B,GAAgB,WACd,IAAIC,EACAC,EAEuBC,EAAAC,EAAvB9B,SAAAA,EAAcuB,UAChBK,EAAmB5B,aAAAA,EAAAA,EAAcuB,SACjCI,EAAiB,IAAII,eAAenB,IACrBoB,QAAQJ,GAEvBjB,EAAiB,CACfR,MAAOH,SAAqB6B,QAATA,EAAZ7B,EAAcuB,eAAdM,IAAqBA,SAArBA,EAAuBL,YAC9BpB,OAAQJ,SAAqB,QAAT8B,EAAZ9B,EAAcuB,eAAO,IAAAO,SAArBA,EAAuBL,gBAGnC,OAAO,WAAM,IAAAQ,EAAAC,EACG,QAAdD,EAAAN,SAAcO,IAAAD,GAAWC,QAAXA,EAAdD,EAAgBE,qBAASD,GAAzBA,EAAAE,KAAAH,EAA4BL,GAEhC,GAAG,CAAChB,EAAwBZ,IAK1BqC,MAAAC,cAACC,EAAIC,EAAA,CACHrC,MAAM,OACNC,OAAO,OACPqC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACN9C,GAEJwC,MAAAC,cAACC,EAAI,CACHK,MAAO5D,EAAOC,KACdkB,MAAM,OACNC,OAAO,OACPyC,IAAK7C,KAELN,GAAa2C,MAAAC,cAACC,EAAI,CAClBpC,MAAK,GAAA2C,OAAKC,KAAKC,KAAItC,eAAAA,EAAeP,QAAS,IAAK,MAAQ,IAAQ,MAChEC,OAAM,GAAA0C,OAAKC,KAAKC,KAAItC,eAAAA,EAAeN,SAAU,IAAK,MAAQ,IAAQ,MAClEwC,MAAO5D,EAAOM,QAEfI,IAAYA,aAAQ,EAARA,EAAW,CACtBU,OAAM0C,GAAAA,QAAKpC,aAAa,EAAbA,EAAeN,SAAU,IAAO,MAC3CD,MAAK2C,GAAAA,QAAKpC,aAAa,EAAbA,EAAeP,QAAS,IAAO,MACzC8C,WAAYvC,UAAAA,EAAeN,WAInC,IAGFb,EAAmB2D,YAAc"}

package/dist/lib/src/core/hooks/useResize.js

@@ -1,10 +1,10 @@
 import { useLayoutEffect, useMemo, useState, useRef } from 'react';
 import debounce from 'lodash-es/debounce';
-export const useResize = (debounceDelay = 250) => {
+// eslint-disable-next-line default-param-last
+export const useResize = (debounceDelay = 250, callBack) => {
     const [containerSize, setContainerSize] = useState({ width: undefined, height: undefined });
     const lastResizeWidthRef = useRef({ width: 0, height: 0 });
     const containerRef = useRef();
-    // const [unobserver, setUnobserver] = useState<Unobserver>(DefaultUnobserver)
     const unobserverRef = useRef();
     const debouncedResizeWrapper = useMemo(() => debounce((entries) => {
         const newResizeWidth = entries[0].contentRect.width;
@@ -14,11 +14,11 @@ export const useResize = (debounceDelay = 250) => {
             return;
         }
         lastResizeWidthRef.current = { width: newResizeWidth, height: newResizeHeight };
-        setContainerSize({
+        (callBack || setContainerSize)({
             width: containerRef?.current?.clientWidth,
             height: containerRef?.current?.clientHeight,
         });
-    }, debounceDelay), [containerRef, debounceDelay]);
+    }, debounceDelay), [callBack, debounceDelay]);
     useLayoutEffect(() => {
         let resizeObserver;
         let containerElement;
@@ -26,7 +26,7 @@ export const useResize = (debounceDelay = 250) => {
             containerElement = containerRef?.current;
             resizeObserver = new ResizeObserver(debouncedResizeWrapper);
             resizeObserver.observe(containerElement);
-            setContainerSize({
+            (callBack || setContainerSize)({
                 width: containerRef?.current?.clientWidth,
                 height: containerRef?.current?.clientHeight,
             });
@@ -37,7 +37,7 @@ export const useResize = (debounceDelay = 250) => {
         // setUnobserver(unobserver)
         unobserverRef.current = unobserver;
         return unobserver;
-    }, [debouncedResizeWrapper, containerRef]);
+    }, [debouncedResizeWrapper, containerRef, callBack]);
     return [containerRef, containerSize, unobserverRef.current];
 };
 //# sourceMappingURL=useResize.js.map

package/dist/lib/src/core/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","sourceRoot":"","sources":["../../../../../src/core/hooks/useResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,eAAe,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACpF,OAAO,QAAQ,MAAM,oBAAoB,CAAA;AAQzC,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,aAAa,GAAG,GAAG,EAC4C,EAAE;IACzF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GACrC,QAAQ,CAAc,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAA;IAEhE,MAAM,kBAAkB,GAAG,MAAM,CAAc,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAA;IACvE,MAAM,YAAY,GAAqD,MAAM,EAAkC,CAAA;IAE/G,8EAA8E;IAC9E,MAAM,aAAa,GAAG,MAAM,EAAc,CAAA;IAE1C,MAAM,sBAAsB,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,EAAE;QAChE,MAAM,cAAc,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAA;QACnD,MAAM,eAAe,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAA;QAErD,IAAI,kBAAkB,CAAC,OAAO,EAAE,KAAK,KAAK,cAAc;eACnD,kBAAkB,CAAC,OAAO,EAAE,MAAM,KAAK,eAAe,EAAE;YAC3D,OAAM;SACP;QACD,kBAAkB,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,EAAE,eAAe,EAAE,CAAA;QAE/E,gBAAgB,CAAC;YACf,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW;YACzC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY;SAC5C,CAAC,CAAA;IACJ,CAAC,EAAE,aAAa,CAAC,EAAE,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,CAAA;IAEjD,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,cAA8B,CAAA;QAClC,IAAI,gBAA6B,CAAA;QAEjC,IAAI,YAAY,EAAE,OAAO,EAAE;YACzB,gBAAgB,GAAG,YAAY,EAAE,OAAO,CAAA;YACxC,cAAc,GAAG,IAAI,cAAc,CAAC,sBAAsB,CAAC,CAAA;YAC3D,cAAc,CAAC,OAAO,CAAC,gBAA2B,CAAC,CAAA;YAEnD,gBAAgB,CAAC;gBACf,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW;gBACzC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY;aAC5C,CAAC,CAAA;SACH;QACD,MAAM,UAAU,GAAG,GAAG,EAAE;YACtB,cAAc,EAAE,SAAS,EAAE,CAAC,gBAA2B,CAAC,CAAA;QAC1D,CAAC,CAAA;QAED,4BAA4B;QAC5B,aAAa,CAAC,OAAO,GAAG,UAAU,CAAA;QAElC,OAAO,UAAU,CAAA;IACnB,CAAC,EAAE,CAAC,sBAAsB,EAAE,YAAY,CAAC,CAAC,CAAA;IAE1C,OAAO,CAAC,YAAY,EAAE,aAAa,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;AAC7D,CAAC,CAAA"}
+{"version":3,"file":"useResize.js","sourceRoot":"","sources":["../../../../../src/core/hooks/useResize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,eAAe,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACpF,OAAO,QAAQ,MAAM,oBAAoB,CAAA;AAUzC,8CAA8C;AAC9C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,aAAa,GAAG,GAAG,EAAE,QAAmB,EACuB,EAAE;IACzF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GACnC,QAAQ,CAAc,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAA;IAElE,MAAM,kBAAkB,GAAG,MAAM,CAAc,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAA;IACvE,MAAM,YAAY,GAAqD,MAAM,EAAkC,CAAA;IAC/G,MAAM,aAAa,GAAG,MAAM,EAAc,CAAA;IAE1C,MAAM,sBAAsB,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,EAAE;QAChE,MAAM,cAAc,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAA;QACnD,MAAM,eAAe,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAA;QAErD,IAAI,kBAAkB,CAAC,OAAO,EAAE,KAAK,KAAK,cAAc;eACnD,kBAAkB,CAAC,OAAO,EAAE,MAAM,KAAK,eAAe,EAAE;YAC3D,OAAM;SACP;QACD,kBAAkB,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,EAAE,eAAe,EAAE,CAG9E;QAAA,CAAC,QAAQ,IAAI,gBAAgB,CAAC,CAAC;YAC9B,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW;YACzC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY;SAC5C,CAAC,CAAA;IACJ,CAAC,EAAE,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAA;IAE7C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,cAA8B,CAAA;QAClC,IAAI,gBAA6B,CAAA;QAEjC,IAAI,YAAY,EAAE,OAAO,EAAE;YACzB,gBAAgB,GAAG,YAAY,EAAE,OAAO,CAAA;YACxC,cAAc,GAAG,IAAI,cAAc,CAAC,sBAAsB,CAAC,CAAA;YAC3D,cAAc,CAAC,OAAO,CAAC,gBAA2B,CAAC,CAGlD;YAAA,CAAC,QAAQ,IAAI,gBAAgB,CAAC,CAAC;gBAC9B,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW;gBACzC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY;aAC5C,CAAC,CAAA;SACH;QACD,MAAM,UAAU,GAAG,GAAG,EAAE;YACtB,cAAc,EAAE,SAAS,EAAE,CAAC,gBAA2B,CAAC,CAAA;QAC1D,CAAC,CAAA;QAED,4BAA4B;QAC5B,aAAa,CAAC,OAAO,GAAG,UAAU,CAAA;QAElC,OAAO,UAAU,CAAA;IACnB,CAAC,EAAE,CAAC,sBAAsB,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEpD,OAAO,CAAC,YAAY,EAAE,aAAa,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;AAC7D,CAAC,CAAA"}

package/dist/lib/src/core/ui/components/container/FBox.js

@@ -8,7 +8,7 @@ const flexValueMap = {
     'flex-end': 'flex-end',
 };
 const resolveFlexProps = (value) => (value ? (flexValueMap[value] || value) : value);
-const FBoxRefForwarded = forwardRef(({ style, children, className = '', ...props }, ref) => {
+const FBoxRefForwarded = forwardRef(({ style, children, tabIndex, className = '', ...props }, ref) => {
     const styles = useMemo(() => ({
         ...style,
         ...props,
@@ -16,7 +16,7 @@ const FBoxRefForwarded = forwardRef(({ style, children, className = '', ...props
         ...(props.justify ? { justifyContent: resolveFlexProps(props.justify) } : {}),
         ...(props.direction ? { flexDirection: props.direction } : {}),
     }), [props, style]);
-    return (_jsx("div", { ref: ref, className: `${classes['flexible-box']} ${className}`, style: styles, children: children }));
+    return (_jsx("div", { ref: ref, tabIndex: tabIndex, className: `${classes['flexible-box']} ${className}`, style: styles, children: children }));
 });
 FBoxRefForwarded.displayName = 'FBoxRefForwarded';
 export const FBox = memo(FBoxRefForwarded);

package/dist/lib/src/core/ui/components/container/FBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"FBox.js","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/container/FBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAqB,OAAO,EAAiB,UAAU,EAAa,MAAM,OAAO,CAAA;AAG9F,OAAO,OAAO,MAAM,oBAAoB,CAAA;AA6BxC,MAAM,YAAY,GAA2B;IAC3C,KAAK,EAAE,YAAY;IACnB,YAAY,EAAE,YAAY;IAC1B,GAAG,EAAE,UAAU;IACf,UAAU,EAAE,UAAU;CACvB,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAAc,EAAsB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;AAGjH,MAAM,gBAAgB,GAAG,UAAU,CAAC,CAAC,EACnC,KAAK,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,KAAK,EAC/B,EAAE,GAA0C,EAAE,EAAE;IAC1D,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAC3B;QACE,GAAG,KAAK;QACR,GAAG,KAAK;QACR,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACrE,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,gBAAgB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC7E,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAC/D,CACF,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAI,OAAe,CAAC,cAAc,CAAC,IAAI,SAAS,EAAE,EAC7D,KAAK,EAAE,MAAuB,YAE7B,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEjD,MAAM,CAAC,MAAM,IAAI,GAAG,IAAI,CAAY,gBAAgB,CAAC,CAAA;AAGrD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}
+{"version":3,"file":"FBox.js","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/container/FBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAqB,OAAO,EAAiB,UAAU,EAAa,MAAM,OAAO,CAAA;AAG9F,OAAO,OAAO,MAAM,oBAAoB,CAAA;AA6BxC,MAAM,YAAY,GAA2B;IAC3C,KAAK,EAAE,YAAY;IACnB,YAAY,EAAE,YAAY;IAC1B,GAAG,EAAE,UAAU;IACf,UAAU,EAAE,UAAU;CACvB,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAAc,EAAsB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;AAGjH,MAAM,gBAAgB,GAAG,UAAU,CAAC,CAAC,EACnC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,KAAK,EACzC,EAAE,GAA0C,EAAE,EAAE;IAC1D,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAC3B;QACE,GAAG,KAAK;QACR,GAAG,KAAK;QACR,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACrE,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,gBAAgB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC7E,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAC/D,CACF,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,GAAI,OAAe,CAAC,cAAc,CAAC,IAAI,SAAS,EAAE,EAC7D,KAAK,EAAE,MAAuB,YAE7B,QAAQ,GACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEjD,MAAM,CAAC,MAAM,IAAI,GAAG,IAAI,CAAY,gBAAgB,CAAC,CAAA;AAGrD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}

package/dist/lib/src/core/ui/components/container/ResizableContainer.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useState, useRef, useMemo, useEffect } from 'react';
+import { memo, useState, useRef, useMemo, useLayoutEffect } from 'react';
 import debounce from 'lodash-es/debounce';
 import { FBox } from './FBox';
 const styles = {
@@ -16,7 +16,7 @@ const styles = {
         // border: '1px solid #0000FF40',
     },
 };
-export const ResizableContainer = memo(({ children, ...props }) => {
+export const ResizableContainer = memo(({ children, debounceDelay = 250, ...props }) => {
     const containerRef = useRef();
     const lastResizeWidthRef = useRef({ width: 0, height: 0 });
     const [containerSize, setContainerSize] = useState({ width: undefined, height: undefined });
@@ -32,21 +32,24 @@ export const ResizableContainer = memo(({ children, ...props }) => {
             width: containerRef?.current?.clientWidth,
             height: containerRef?.current?.clientHeight,
         });
-    }, 250), []);
-    useEffect(() => {
+    }, debounceDelay), [debounceDelay]);
+    useLayoutEffect(() => {
         let resizeObserver;
         let containerElement;
         if (containerRef?.current) {
             containerElement = containerRef?.current;
             resizeObserver = new ResizeObserver(debouncedResizeWrapper);
             resizeObserver.observe(containerElement);
+            setContainerSize({
+                width: containerRef?.current?.clientWidth,
+                height: containerRef?.current?.clientHeight,
+            });
         }
         return () => {
             resizeObserver?.unobserve?.(containerElement);
         };
     }, [debouncedResizeWrapper, containerRef]);
     // END RESIZING
-    console.log('containerSize', containerSize);
     return (_jsxs(FBox, { width: '100%', height: '100%', justify: 'center', align: 'center', direction: 'column', ...props, children: [_jsx(FBox, { style: styles.main, width: '100%', height: '100%', ref: containerRef }), !children && (_jsx(FBox, { width: `${Math.max(containerSize?.width || 200, 200) || 200}px`, height: `${Math.max(containerSize?.height || 200, 200) || 200}px`, style: styles.empty })), children && children?.({
                 height: `${containerSize?.height || 200}px`,
                 width: `${containerSize?.width || 200}px`,

package/dist/lib/src/core/ui/components/container/ResizableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizableContainer.js","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ResizableContainer.js","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"names":[],"mappings":"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"}