@kubit-ui-web/react-components 2.0.0-beta.55 → 2.0.0-beta.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @kubit-ui-web/react-components
2
2
 
3
+ ## 2.0.0-beta.57
4
+
5
+ ### Major Changes
6
+
7
+ - Improve stylesprovider props (#69)
8
+
9
+ ## 2.0.0-beta.56
10
+
11
+ ### Major Changes
12
+
13
+ - Update to react 19 (#68)
14
+
3
15
  ## 2.0.0-beta.55
4
16
 
5
17
  ### Major Changes
@@ -1 +1 @@
1
- const e=require(`../../../lib/hooks/useScrollBlock/useScrollBlock.js`),t=require(`./utils/calc.utils.js`),n=require(`./utils/constants.js`);let r=require(`react`);exports.useCarouselSwipe=({allowShiftRef:i,centerExtremesWhenExtraPadding:a,changePage:o,circular:s,contentContainerRef:c,currentPageRef:l,disabled:u=!1,elements:d,extraPadding:f,numElementsPerPageRef:p,numPagesRef:m,viewerContainerRef:h})=>{let g=(0,r.useRef)(!1),_=(0,r.useRef)(!1),v=(0,r.useRef)(!1),y=(0,r.useRef)(),b=(0,r.useRef)(0),x=(0,r.useRef)(0),S=(0,r.useRef)(0),C=(0,r.useRef)(0),w=(0,r.useCallback)(()=>{i.current&&(s||l.current!==m.current-1)&&o({newPage:l.current+1})},[s,o]),T=(0,r.useCallback)(()=>{i.current&&(s||l.current!==0)&&o({newPage:l.current-1})},[s,o]),{allowScroll:E,blockScroll:D}=e.useScrollBlock(),O=(0,r.useCallback)(e=>{let t=c.current;!t||m.current<=1||(y.current=parseFloat(t.style.left||`0`),e.type===`touchstart`?(b.current=e.touches[0].clientX,S.current=e.touches[0].clientX,C.current=e.touches[0].clientY):(b.current=e.clientX,S.current=e.clientX,C.current=e.clientY),g.current=!0)},[]),k=(0,r.useCallback)(e=>{let r=c.current;if(!r||!g.current||!p?.current||m.current<=1)return;let i,o;e.type===`touchmove`?(x.current=b.current-e.touches[0].clientX,b.current=e.touches[0].clientX,i=e.touches[0].clientX-S.current,o=e.touches[0].clientY-C.current):(x.current=b.current-e.clientX,b.current=e.clientX,i=e.clientX-S.current,o=e.clientY-C.current);let u=parseFloat(r.style.left||`0`)-x.current;if(!_.current&&!v.current&&(Math.abs(i)>n.default.THRESHOLD_TO_DECIDE_IF_ALLOW_DRAGGING?(_.current=!0,D()):Math.abs(o)>n.default.THRESHOLD_TO_DECIDE_IF_ALLOW_DRAGGING&&(v.current=!0)),_.current)if(s&&d.length>p.current)r.style.left=`${u}px`;else{let e=t.default.calcXDistanceBetween2Elements(r.firstChild,r.children[r.children.length-p.current]);if(a)u-f<0&&-u<e-f&&(r.style.left=`${u}px`);else{let t=s?f:0;!s&&f&&l.current===m.current-1&&(t=f*2),u-t<0&&-u<e-t&&(r.style.left=`${u}px`)}}},[D,a,s,d,f]),A=(0,r.useCallback)(()=>{let e=c.current;if(v.current=!1,_.current&&E(),_.current=!1,!e||!g.current||y.current===void 0||m.current<=1)return;g.current=!1;let t=parseFloat(e.style.left||`0`);t-y.current<-n.default.THRESHOLD_TO_DECIDE_IF_SWIPE_ON_DRAG_ENDS?w():t-y.current>n.default.THRESHOLD_TO_DECIDE_IF_SWIPE_ON_DRAG_ENDS?T():e.style.left=`${y.current}px`},[E,w,T]);(0,r.useEffect)(()=>{if(u)return;let e=h.current,t={passive:!0};return e?.addEventListener(`touchstart`,O,t),e?.addEventListener(`touchend`,A,t),e?.addEventListener(`touchmove`,k,t),e?.addEventListener(`mousedown`,O,t),e?.addEventListener(`mouseup`,A,t),e?.addEventListener(`mousemove`,k,t),e?.addEventListener(`mouseleave`,A,t),()=>{e?.removeEventListener(`touchstart`,O,t),e?.removeEventListener(`touchend`,A,t),e?.removeEventListener(`touchmove`,k,t),e?.removeEventListener(`mousedown`,O,t),e?.removeEventListener(`mouseup`,A,t),e?.removeEventListener(`mousemove`,k,t),e?.removeEventListener(`mouseleave`,A,t)}},[O,A,k,u])};
1
+ const e=require(`../../../lib/hooks/useScrollBlock/useScrollBlock.js`),t=require(`./utils/calc.utils.js`),n=require(`./utils/constants.js`);let r=require(`react`);exports.useCarouselSwipe=({allowShiftRef:i,centerExtremesWhenExtraPadding:a,changePage:o,circular:s,contentContainerRef:c,currentPageRef:l,disabled:u=!1,elements:d,extraPadding:f,numElementsPerPageRef:p,numPagesRef:m,viewerContainerRef:h})=>{let g=(0,r.useRef)(!1),_=(0,r.useRef)(!1),v=(0,r.useRef)(!1),y=(0,r.useRef)(void 0),b=(0,r.useRef)(0),x=(0,r.useRef)(0),S=(0,r.useRef)(0),C=(0,r.useRef)(0),w=(0,r.useCallback)(()=>{i.current&&(s||l.current!==m.current-1)&&o({newPage:l.current+1})},[s,o]),T=(0,r.useCallback)(()=>{i.current&&(s||l.current!==0)&&o({newPage:l.current-1})},[s,o]),{allowScroll:E,blockScroll:D}=e.useScrollBlock(),O=(0,r.useCallback)(e=>{let t=c.current;!t||m.current<=1||(y.current=parseFloat(t.style.left||`0`),e.type===`touchstart`?(b.current=e.touches[0].clientX,S.current=e.touches[0].clientX,C.current=e.touches[0].clientY):(b.current=e.clientX,S.current=e.clientX,C.current=e.clientY),g.current=!0)},[]),k=(0,r.useCallback)(e=>{let r=c.current;if(!r||!g.current||!p?.current||m.current<=1)return;let i,o;e.type===`touchmove`?(x.current=b.current-e.touches[0].clientX,b.current=e.touches[0].clientX,i=e.touches[0].clientX-S.current,o=e.touches[0].clientY-C.current):(x.current=b.current-e.clientX,b.current=e.clientX,i=e.clientX-S.current,o=e.clientY-C.current);let u=parseFloat(r.style.left||`0`)-x.current;if(!_.current&&!v.current&&(Math.abs(i)>n.default.THRESHOLD_TO_DECIDE_IF_ALLOW_DRAGGING?(_.current=!0,D()):Math.abs(o)>n.default.THRESHOLD_TO_DECIDE_IF_ALLOW_DRAGGING&&(v.current=!0)),_.current)if(s&&d.length>p.current)r.style.left=`${u}px`;else{let e=t.default.calcXDistanceBetween2Elements(r.firstChild,r.children[r.children.length-p.current]);if(a)u-f<0&&-u<e-f&&(r.style.left=`${u}px`);else{let t=s?f:0;!s&&f&&l.current===m.current-1&&(t=f*2),u-t<0&&-u<e-t&&(r.style.left=`${u}px`)}}},[D,a,s,d,f]),A=(0,r.useCallback)(()=>{let e=c.current;if(v.current=!1,_.current&&E(),_.current=!1,!e||!g.current||y.current===void 0||m.current<=1)return;g.current=!1;let t=parseFloat(e.style.left||`0`);t-y.current<-n.default.THRESHOLD_TO_DECIDE_IF_SWIPE_ON_DRAG_ENDS?w():t-y.current>n.default.THRESHOLD_TO_DECIDE_IF_SWIPE_ON_DRAG_ENDS?T():e.style.left=`${y.current}px`},[E,w,T]);(0,r.useEffect)(()=>{if(u)return;let e=h.current,t={passive:!0};return e?.addEventListener(`touchstart`,O,t),e?.addEventListener(`touchend`,A,t),e?.addEventListener(`touchmove`,k,t),e?.addEventListener(`mousedown`,O,t),e?.addEventListener(`mouseup`,A,t),e?.addEventListener(`mousemove`,k,t),e?.addEventListener(`mouseleave`,A,t),()=>{e?.removeEventListener(`touchstart`,O,t),e?.removeEventListener(`touchend`,A,t),e?.removeEventListener(`touchmove`,k,t),e?.removeEventListener(`mousedown`,O,t),e?.removeEventListener(`mouseup`,A,t),e?.removeEventListener(`mousemove`,k,t),e?.removeEventListener(`mouseleave`,A,t)}},[O,A,k,u])};
@@ -1 +1 @@
1
- let e=require(`react`);function t(e,t){if(e.width!==t.width||e.height!==t.height)return!1;for(let n=0;n<e.data.length;n++)if(e.data[n]!==t.data[n])return!1;return!0}exports.useDraw=n=>{let r=(0,e.useRef)(null),i=(0,e.useRef)(),a=(0,e.useRef)(!1),o=(0,e.useRef)(!1),s=(0,e.useRef)({color:`black`,lineWidth:2}),c=(0,e.useRef)(null),l=()=>{r.current&&(o.current=!1,i.current.clearRect(0,0,r.current.width,r.current.height))},u=e=>{e&&(s.current.color=e.color,s.current.lineWidth=e.lineWidth)},d=e=>{let t,n;if(e.type===`touchstart`&&r.current){let{touches:i}=e,{clientX:a,clientY:o}=i[0],{left:s,top:c}=r.current.getBoundingClientRect();t=a-s,n=o-c}else t=e.offsetX,n=e.offsetY;c.current=i.current.getImageData(0,0,r.current?.width,r.current?.height),i.current.beginPath(),i.current.moveTo(t,n),a.current=!0},f=e=>{if(!a.current)return;let t,n;if(e.preventDefault(),e.type===`touchmove`&&r.current){let{touches:i}=e,{clientX:a,clientY:o}=i[0],{left:s,top:c}=r.current.getBoundingClientRect();t=a-s,n=o-c}else t=e.offsetX,n=e.offsetY;i.current.lineTo(t,n),i.current.stroke()},p=()=>{let e=i.current.getImageData(0,0,r.current?.width,r.current?.height);if(i.current.closePath(),a.current=!1,c.current&&!t(e,c.current)){let e=r.current?.toDataURL();n?.(e),o.current=!0}};return(0,e.useEffect)(()=>{if(r.current===null)return;let e=r.current;if(i.current=e?.getContext(`2d`,{willReadFrequently:!0}),i.current)return i.current.strokeStyle=s.current.color,i.current.lineWidth=s.current.lineWidth,i.current.lineCap=`round`,i.current.lineJoin=`round`,e?.addEventListener(`mousedown`,d),e?.addEventListener(`mousemove`,f),e?.addEventListener(`mouseup`,p),e?.addEventListener(`mouseleave`,p),e?.addEventListener(`touchstart`,d),e?.addEventListener(`touchmove`,f,{passive:!1}),e?.addEventListener(`touchend`,p),()=>{e?.removeEventListener(`mousedown`,d),e?.removeEventListener(`mousemove`,f),e?.removeEventListener(`mouseup`,p),e?.removeEventListener(`mouseleave`,p),e?.removeEventListener(`touchstart`,d),e?.removeEventListener(`touchmove`,f),e?.removeEventListener(`touchend`,p)}},[]),{canvasRef:r,filled:o.current,resetCanvas:l,setSignatureStyles:u}};
1
+ let e=require(`react`);function t(e,t){if(e.width!==t.width||e.height!==t.height)return!1;for(let n=0;n<e.data.length;n++)if(e.data[n]!==t.data[n])return!1;return!0}exports.useDraw=n=>{let r=(0,e.useRef)(null),i=(0,e.useRef)(null),a=(0,e.useRef)(!1),o=(0,e.useRef)(!1),s=(0,e.useRef)({color:`black`,lineWidth:2}),c=(0,e.useRef)(null),l=()=>{r.current&&(o.current=!1,i.current.clearRect(0,0,r.current.width,r.current.height))},u=e=>{e&&(s.current.color=e.color,s.current.lineWidth=e.lineWidth)},d=e=>{let t,n;if(e.type===`touchstart`&&r.current){let{touches:i}=e,{clientX:a,clientY:o}=i[0],{left:s,top:c}=r.current.getBoundingClientRect();t=a-s,n=o-c}else t=e.offsetX,n=e.offsetY;c.current=i.current.getImageData(0,0,r.current?.width,r.current?.height),i.current.beginPath(),i.current.moveTo(t,n),a.current=!0},f=e=>{if(!a.current)return;let t,n;if(e.preventDefault(),e.type===`touchmove`&&r.current){let{touches:i}=e,{clientX:a,clientY:o}=i[0],{left:s,top:c}=r.current.getBoundingClientRect();t=a-s,n=o-c}else t=e.offsetX,n=e.offsetY;i.current.lineTo(t,n),i.current.stroke()},p=()=>{let e=i.current.getImageData(0,0,r.current?.width,r.current?.height);if(i.current.closePath(),a.current=!1,c.current&&!t(e,c.current)){let e=r.current?.toDataURL();n?.(e),o.current=!0}};return(0,e.useEffect)(()=>{if(r.current===null)return;let e=r.current;if(i.current=e?.getContext(`2d`,{willReadFrequently:!0}),i.current)return i.current.strokeStyle=s.current.color,i.current.lineWidth=s.current.lineWidth,i.current.lineCap=`round`,i.current.lineJoin=`round`,e?.addEventListener(`mousedown`,d),e?.addEventListener(`mousemove`,f),e?.addEventListener(`mouseup`,p),e?.addEventListener(`mouseleave`,p),e?.addEventListener(`touchstart`,d),e?.addEventListener(`touchmove`,f,{passive:!1}),e?.addEventListener(`touchend`,p),()=>{e?.removeEventListener(`mousedown`,d),e?.removeEventListener(`mousemove`,f),e?.removeEventListener(`mouseup`,p),e?.removeEventListener(`mouseleave`,p),e?.removeEventListener(`touchstart`,d),e?.removeEventListener(`touchmove`,f),e?.removeEventListener(`touchend`,p)}},[]),{canvasRef:r,filled:o.current,resetCanvas:l,setSignatureStyles:u}};
@@ -1 +1 @@
1
- const e=require(`../../lib/provider/genericComponentsProvider/genericComponentsProvider.js`),t=require(`../../lib/hooks/useClassName/useClassName.js`),n=require(`./optionStandAlone.js`);let r=require(`react`),i=require(`react/jsx-runtime`);const a=(0,r.forwardRef)(({additionalClasses:a,focus:o,onBlur:s,onFocus:c,variant:l,...u},d)=>{let f=t.useClassName({additionalClassNames:a,component:`OPTION`,variant:l}),{LINK:p}=e.useGenericComponents(),m=(0,r.useRef)(),[h,g]=(0,r.useState)(!1),[_,v]=(0,r.useState)(!1);(0,r.useImperativeHandle)(d,()=>m.current,[]),(0,r.useEffect)(()=>{o&&m.current?.focus()},[o]);let y=e=>{c?.(e),v(!0)},b=e=>{s?.(e),v(!1)};return(0,i.jsx)(n.OptionStandAlone,{...u,ref:m,componentLink:p,cssClasses:f,focus:_,hover:h,onBlur:b,onFocus:y,onMouseEnter:()=>g(!0),onMouseLeave:()=>g(!1)})});exports.Option=a;
1
+ const e=require(`../../lib/provider/genericComponentsProvider/genericComponentsProvider.js`),t=require(`../../lib/hooks/useClassName/useClassName.js`),n=require(`./optionStandAlone.js`);let r=require(`react`),i=require(`react/jsx-runtime`);const a=(0,r.forwardRef)(({additionalClasses:a,focus:o,onBlur:s,onFocus:c,variant:l,...u},d)=>{let f=t.useClassName({additionalClassNames:a,component:`OPTION`,variant:l}),{LINK:p}=e.useGenericComponents(),m=(0,r.useRef)(null),[h,g]=(0,r.useState)(!1),[_,v]=(0,r.useState)(!1);(0,r.useImperativeHandle)(d,()=>m.current,[]),(0,r.useEffect)(()=>{o&&m.current?.focus()},[o]);let y=e=>{c?.(e),v(!0)},b=e=>{s?.(e),v(!1)};return(0,i.jsx)(n.OptionStandAlone,{...u,ref:m,componentLink:p,cssClasses:f,focus:_,hover:h,onBlur:b,onFocus:y,onMouseEnter:()=>g(!0),onMouseLeave:()=>g(!1)})});exports.Option=a;
@@ -1 +1 @@
1
- const e=require(`../../lib/hooks/useClassName/useClassName.js`),t=require(`./utils/accessibility.utils.js`),n=require(`./sliderStandAlone.js`),r=require(`./utils/slider.utils.js`);let i=require(`react`),a=require(`react/jsx-runtime`);var o=50;const s=(0,i.forwardRef)(({additionalClasses:s,ariaLabel:c,ariaLabelBy:l,decrementButton:u,defaultValue:d,disabled:f=!1,incrementButton:p,initialStepOffset:m,label:h,leftHelperText:g,max:_=100,min:v=0,onChange:y,onDragEnd:b,onDragStart:x,range:S=!1,rightAriaLabel:C,rightAriaLabelBy:w,rightHelperText:T,rightThumbIcon:ee,rightTooltip:E,step:D=1,thumbExceedsTrack:O=!0,thumbIcon:k,tooltip:A,type:te=`discrete`,value:j,variant:M},N)=>{let P=e=>r.calcDefaultValue({initialStepOffset:m,max:_,min:v,range:S,step:D,value:e}),F=(0,i.useRef)(null),[I,L]=(0,i.useState)(P(j??d)),[R,z]=(0,i.useState)(!1),[B,V]=(0,i.useState)(!1),H=(0,i.useRef)(`left`),[U,W]=(0,i.useState)({max:100,min:0}),G=(0,i.useRef)();r.focusThumb({container:F.current,currentActivePointer:H.current,range:S});let K=(0,i.useCallback)(e=>{y&&(clearTimeout(G.current),G.current=setTimeout(()=>{y(e)},o))},[y]),q=e=>{if(!F.current||f)return;let t=r.calcScaleValue({initialStepOffset:m,max:_,min:v,step:D,value:r.calcValueByOffset({max:_,min:v,offset:r.calculateChange({container:F.current,event:e,offsetBoundaries:U}),offsetBoundaries:U,step:D})});L(e=>{let n=t;return S&&(n=r.calcNewRangeValue({activePointer:H,newValue:t,prevValue:e})),K(n),n})},J=e=>{if(f)return;let n=t.calcNewValueAfterKeyPress({activePointer:H.current,event:e,max:_,min:v,range:S,step:D,value:I});n!==void 0&&(L(n),K(n))},Y=e=>{let n=t.incrementValue({activePointer:H.current,max:_,range:S,step:D,value:I});n!==void 0&&(L(n),K(n)),p?.onClick?.(e)},X=e=>{let n=t.decrementValue({activePointer:H.current,min:v,range:S,step:D,value:I});n!==void 0&&(L(n),K(n)),u?.onClick?.(e)},Z=()=>{b?.(),V(!1),Q()},{scaleOffsets:ne,showScale:re}=r.getScale({initialStepOffset:m,max:_,min:v,step:D,type:te}),{offset:ie,offsetLeft:ae,offsetRight:oe}=r.getOffset({max:_,min:v,offsetBoundaries:U,range:S,value:I}),Q=()=>{window.removeEventListener(`mousemove`,q),window.removeEventListener(`mouseup`,Z),window.removeEventListener(`touchend`,Z)},se=e.useClassName({additionalClassNames:s,component:`SLIDER`,variant:M}),$=(0,i.useCallback)(()=>{if(O){W({max:100,min:0});return}if(!F.current)return;let e=F.current.querySelector(`[role="slider"]`);if(!e)return;let t=F.current.getBoundingClientRect().width,n=e.getBoundingClientRect().width/t*100/2;W({max:100-n,min:n})},[O]);(0,i.useEffect)(()=>($(),O||window.addEventListener(`resize`,$),()=>{O||window.removeEventListener(`resize`,$)}),[O]),(0,i.useEffect)(()=>{j!==void 0&&(S&&!r.equalsRangeValues({values1:j,values2:I})||!S&&j!==I)&&L(P(j))},[j]),(0,i.useEffect)(()=>Q,[]);let ce=e=>{x?.(),V(!0),q(e),window.addEventListener(`mousemove`,q),window.addEventListener(`mouseup`,Z)},le=e=>{x?.(),V(!0),q(e),window.addEventListener(`touchend`,Z)};return(0,a.jsx)(n.SliderStandAlone,{ref:N,activePointer:H,ariaLabel:c,ariaLabelBy:l,containerRef:F,cssClasses:se,decrementButton:{...u,disabled:f||u?.disabled,onClick:X},disabled:f,hover:R,incrementButton:{...p,disabled:f||p?.disabled,onClick:Y},label:h,leftHelperText:g,max:_,min:v,offset:ie,offsetLeft:ae,offsetRight:oe,pressed:B,range:S,rightAriaLabel:C,rightAriaLabelBy:w,rightHelperText:T,rightThumbIcon:ee,rightTooltip:E,scaleOffsets:ne,setHover:z,showScale:re,step:D,thumbIcon:k,tooltip:A,value:I,onChange:q,onKeyPress:J,onMouseDown:ce,onTouchStart:le})});exports.Slider=s;
1
+ const e=require(`../../lib/hooks/useClassName/useClassName.js`),t=require(`./utils/accessibility.utils.js`),n=require(`./sliderStandAlone.js`),r=require(`./utils/slider.utils.js`);let i=require(`react`),a=require(`react/jsx-runtime`);var o=50;const s=(0,i.forwardRef)(({additionalClasses:s,ariaLabel:c,ariaLabelBy:l,decrementButton:u,defaultValue:d,disabled:f=!1,incrementButton:p,initialStepOffset:m,label:h,leftHelperText:g,max:_=100,min:v=0,onChange:y,onDragEnd:b,onDragStart:x,range:S=!1,rightAriaLabel:C,rightAriaLabelBy:w,rightHelperText:T,rightThumbIcon:ee,rightTooltip:E,step:D=1,thumbExceedsTrack:O=!0,thumbIcon:k,tooltip:A,type:te=`discrete`,value:j,variant:M},N)=>{let P=e=>r.calcDefaultValue({initialStepOffset:m,max:_,min:v,range:S,step:D,value:e}),F=(0,i.useRef)(null),[I,L]=(0,i.useState)(P(j??d)),[R,z]=(0,i.useState)(!1),[B,V]=(0,i.useState)(!1),H=(0,i.useRef)(`left`),[U,W]=(0,i.useState)({max:100,min:0}),G=(0,i.useRef)(void 0);r.focusThumb({container:F.current,currentActivePointer:H.current,range:S});let K=(0,i.useCallback)(e=>{y&&(clearTimeout(G.current),G.current=setTimeout(()=>{y(e)},o))},[y]),q=e=>{if(!F.current||f)return;let t=r.calcScaleValue({initialStepOffset:m,max:_,min:v,step:D,value:r.calcValueByOffset({max:_,min:v,offset:r.calculateChange({container:F.current,event:e,offsetBoundaries:U}),offsetBoundaries:U,step:D})});L(e=>{let n=t;return S&&(n=r.calcNewRangeValue({activePointer:H,newValue:t,prevValue:e})),K(n),n})},J=e=>{if(f)return;let n=t.calcNewValueAfterKeyPress({activePointer:H.current,event:e,max:_,min:v,range:S,step:D,value:I});n!==void 0&&(L(n),K(n))},Y=e=>{let n=t.incrementValue({activePointer:H.current,max:_,range:S,step:D,value:I});n!==void 0&&(L(n),K(n)),p?.onClick?.(e)},X=e=>{let n=t.decrementValue({activePointer:H.current,min:v,range:S,step:D,value:I});n!==void 0&&(L(n),K(n)),u?.onClick?.(e)},Z=()=>{b?.(),V(!1),Q()},{scaleOffsets:ne,showScale:re}=r.getScale({initialStepOffset:m,max:_,min:v,step:D,type:te}),{offset:ie,offsetLeft:ae,offsetRight:oe}=r.getOffset({max:_,min:v,offsetBoundaries:U,range:S,value:I}),Q=()=>{window.removeEventListener(`mousemove`,q),window.removeEventListener(`mouseup`,Z),window.removeEventListener(`touchend`,Z)},se=e.useClassName({additionalClassNames:s,component:`SLIDER`,variant:M}),$=(0,i.useCallback)(()=>{if(O){W({max:100,min:0});return}if(!F.current)return;let e=F.current.querySelector(`[role="slider"]`);if(!e)return;let t=F.current.getBoundingClientRect().width,n=e.getBoundingClientRect().width/t*100/2;W({max:100-n,min:n})},[O]);(0,i.useEffect)(()=>($(),O||window.addEventListener(`resize`,$),()=>{O||window.removeEventListener(`resize`,$)}),[O]),(0,i.useEffect)(()=>{j!==void 0&&(S&&!r.equalsRangeValues({values1:j,values2:I})||!S&&j!==I)&&L(P(j))},[j]),(0,i.useEffect)(()=>Q,[]);let ce=e=>{x?.(),V(!0),q(e),window.addEventListener(`mousemove`,q),window.addEventListener(`mouseup`,Z)},le=e=>{x?.(),V(!0),q(e),window.addEventListener(`touchend`,Z)};return(0,a.jsx)(n.SliderStandAlone,{ref:N,activePointer:H,ariaLabel:c,ariaLabelBy:l,containerRef:F,cssClasses:se,decrementButton:{...u,disabled:f||u?.disabled,onClick:X},disabled:f,hover:R,incrementButton:{...p,disabled:f||p?.disabled,onClick:Y},label:h,leftHelperText:g,max:_,min:v,offset:ie,offsetLeft:ae,offsetRight:oe,pressed:B,range:S,rightAriaLabel:C,rightAriaLabelBy:w,rightHelperText:T,rightThumbIcon:ee,rightTooltip:E,scaleOffsets:ne,setHover:z,showScale:re,step:D,thumbIcon:k,tooltip:A,value:I,onChange:q,onKeyPress:J,onMouseDown:ce,onTouchStart:le})});exports.Slider=s;
package/dist/cjs/index.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./lib/utils/date/formatDate.js`),t=require(`./lib/utils/date/transformDate.js`),n=require(`./lib/utils/date/date.js`),r=require(`./lib/provider/genericComponentsProvider/defaultGenericComponents.js`),i=require(`./lib/provider/genericComponentsProvider/genericComponentsProvider.js`),a=require(`./lib/provider/utilsProvider/utilsProvider.js`),o=require(`./lib/provider/stylesProvider/stylesProvider.js`),s=require(`./components/accordion/accordionControlled.js`),c=require(`./components/accordion/accordionUnControlled.js`),ee=require(`./components/text/text2.js`),te=require(`./components/alert/alertControlled.js`),ne=require(`./components/dot/dot.js`),l=require(`./components/icon/icon.js`),u=require(`./components/icon/iconHost.js`),d=require(`./components/avatar/avatar.js`),f=require(`./components/badge/badge.js`),p=require(`./components/link/link.js`),m=require(`./lib/types/states/states.js`),h=require(`./components/breadcrumbs/breadcrumbs.js`),g=require(`./lib/types/positions/positions.js`),_=require(`./components/button/button.js`),v=require(`./components/calendar/calendar.js`),y=require(`./components/card/cardStandAlone.js`),b=require(`./components/card/card.js`),x=require(`./components/carousel/types/carousel.js`),S=require(`./components/carousel/carousel.js`),C=require(`./components/checkboxBase/checkboxBaseControlled.js`),w=require(`./lib/components/errorMessage/errorMessage.js`),T=require(`./components/label/labelStandAlone.js`),E=require(`./components/checkbox/checkboxControlled.js`),D=require(`./components/checkbox/checkboxUnControlled.js`),O=require(`./components/checkboxBase/checkboxBaseUncontrolled.js`),k=require(`./components/chip/chip.js`),A=require(`./components/tableBody/tableBody.js`),j=require(`./components/table/table.js`),M=require(`./components/tableCaption/tableCaption.js`),N=require(`./components/tableDivider/tableDivider.js`),P=require(`./components/tableCell/tableCell.js`),F=require(`./components/tableHead/tableHead.js`),I=require(`./components/tableRow/tableRow.js`),L=require(`./components/dataTable/dataTable.js`),R=require(`./lib/types/breakpoints/breakpoints.js`),z=require(`./components/image/image2.js`),B=require(`./components/inputBase/inputBase.js`),V=require(`./components/inputDecoration/inputDecoration.js`),H=require(`./components/input/input.js`),U=require(`./components/inputSignature/inputSignatureControlled.js`),re=require(`./components/inputSignature/inputSignatureUncontrolled.js`),W=require(`./components/link/linkAsButton/linkAsButton.js`),G=require(`./components/option/option.js`),K=require(`./components/listOptions/listOptions.js`),q=require(`./components/popover/popover.js`),J=require(`./components/modal/modalControlled.js`),Y=require(`./components/modal/modalUnControlled.js`),X=require(`./components/pageControl/pageControl.js`),ie=require(`./components/pagination/pagination.js`),Z=require(`./components/popover/animations/spring.animations.js`),ae=require(`./components/progressBar/progressBar.js`),oe=require(`./components/radioButton/radioButtonStandAlone.js`),se=require(`./components/radioButton/radioButton.js`),ce=require(`./components/select/selectControlled.js`),le=require(`./components/select/selectUncontrolled.js`),ue=require(`./components/selectorBoxFile/selectorBoxFile.js`),de=require(`./components/skeleton/skeleton2.js`),fe=require(`./components/tooltip/tooltipUnControlled.js`),pe=require(`./components/slider/slider.js`),me=require(`./components/snackbar/snackbar.js`),he=require(`./components/stepperNumber/stepperNumber.js`),ge=require(`./components/tableFoot/tableFoot.js`),_e=require(`./components/tabs/tabsControlled.js`),ve=require(`./components/tabs/tabsUnControlled.js`),ye=require(`./components/tag/tag.js`),be=require(`./components/textArea/textArea.js`),xe=require(`./components/toggle/toggleStandAlone.js`),Q=require(`./components/toggle/toggleControlled.js`),Se=require(`./components/toggle/toggleUnControlled.js`),Ce=require(`./components/tooltip/tooltipControlled.js`),we=require(`./components/virtualKeyboard/virtualKeyboard.js`),Te=require(`./lib/types/sizes/sizes.js`);let $=require(`@floating-ui/dom`);exports.Accordion=c.AccordionUnControlled,exports.AccordionControlled=s.AccordionControlled,exports.Alert=te.Alert,exports.Avatar=d.Avatar,exports.Badge=f.Badge,exports.BreadCrumbs=h.BreadCrumbs,exports.Button=_.Button,exports.CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY=x.CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY,exports.CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY=x.CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY,exports.Calendar=v.Calendar,exports.Card=b.Card,exports.CardStandAlone=y.CardStandAlone,exports.Carousel=S.Carousel,exports.Checkbox=D.CheckboxUnControlled,exports.CheckboxBase=O.CheckboxBaseUnControlled,exports.CheckboxBaseControlled=C.CheckboxBaseControlled,exports.CheckboxControlled=E.CheckboxControlled,exports.Chip=k.Chip,exports.DEVICE_BREAKPOINTS=R.DEVICE_BREAKPOINTS,exports.DataTable=L.DataTable,exports.DeviceBreakpointsTypeUtils=R.DeviceBreakpointsTypeUtils,exports.Dot=ne.Dot,exports.ErrorMessage=w.ErrorMessage,exports.GenericComponentContext=i.GenericComponentContext,exports.GenericComponentsProvider=i.GenericComponentsProvider,exports.Icon=u.IconHost,exports.IconBasic=l.IconBasic,exports.Image=z.Image,exports.Input=H.Input,exports.InputBase=B.InputBase,exports.InputDecoration=V.InputDecoration,exports.InputSignature=re.InputSignatureUnControlled,exports.InputSignatureControlled=U.InputSignatureControlled,exports.Label=T.LabelStandAlone,exports.Link=p.Link,exports.LinkAsButton=W.LinkAsButton,exports.ListOptions=K.ListOptions,exports.MIRROR_POSITIONS=g.MIRROR_POSITIONS,exports.Modal=Y.ModalUnControlled,exports.ModalControlled=J.ModalControlled,exports.Option=G.Option,exports.POSITIONS=g.POSITIONS,exports.PageControl=X.PageControl,exports.Pagination=ie.Pagination,exports.Popover=q.Popover,exports.ProgressBar=ae.ProgressBar,exports.RadioButton=se.RadioButton,exports.RadioButtonStandAlone=oe.RadioButtonStandAlone,exports.SIZES=Te.SIZES,exports.STATES=m.STATES,exports.Select=le.SelectUnControlled,exports.SelectControlled=ce.SelectControlled,exports.SelectorBoxFile=ue.SelectorBoxFile,exports.Skeleton=de.Skeleton,exports.Slider=pe.Slider,exports.Snackbar=me.Snackbar,exports.StepperNumber=he.StepperNumber,exports.StylesContext=o.StylesContext,exports.StylesProvider=o.StylesProvider,exports.Table=j.Table,exports.TableBody=A.TableBody,exports.TableCaption=M.TableCaption,exports.TableCell=P.TableCell,exports.TableDivider=N.TableDivider,exports.TableFoot=ge.TableFoot,exports.TableHead=F.TableHead,exports.TableRow=I.TableRow,exports.Tabs=ve.TabsUnControlled,exports.TabsControlled=_e.TabsControlled,exports.Tag=ye.Tag,exports.Text=ee.Text,exports.TextArea=be.TextArea,exports.ToggleControlled=Q.ToggleControlled,exports.ToggleStandalone=xe.ToggleStandalone,exports.ToggleUncontrolled=Se.ToggleUncontrolled,exports.Tooltip=fe.TooltipUnControlled,exports.TooltipControlled=Ce.TooltipControlled,exports.UtilsContext=a.UtilsContext,exports.UtilsProvider=a.UtilsProvider,exports.VirtualKeyboard=we.VirtualKeyboard,exports.createSpringAnimation=Z.createSpringAnimation,exports.defaultGenericComponents=r.defaultGenericComponents,exports.formatDate=e.formatDate,exports.formatDateToUTC=e.formatDateToUTC,exports.generateSpringKeyframes=Z.generateSpringKeyframes,exports.generateSpringKeyframesRule=Z.generateSpringKeyframesRule,exports.getAddDays=n.getAddDays,exports.getAddMonths=n.getAddMonths,exports.getAddYears=n.getAddYears,exports.getAllMonthNames=n.getAllMonthNames,exports.getAllWeekdayNames=n.getAllWeekdayNames,exports.getSubDays=n.getSubDays,exports.getSubMonths=n.getSubMonths,exports.getSubYears=n.getSubYears,exports.isAfter=n.isAfter,exports.isBefore=n.isBefore,exports.isDatesEqual=n.isDatesEqual,Object.defineProperty(exports,`popoverMWArrow`,{enumerable:!0,get:function(){return $.arrow}}),Object.defineProperty(exports,`popoverMWAutoPlacement`,{enumerable:!0,get:function(){return $.autoPlacement}}),Object.defineProperty(exports,`popoverMWFlip`,{enumerable:!0,get:function(){return $.flip}}),Object.defineProperty(exports,`popoverMWHide`,{enumerable:!0,get:function(){return $.hide}}),Object.defineProperty(exports,`popoverMWOffset`,{enumerable:!0,get:function(){return $.offset}}),Object.defineProperty(exports,`popoverMWShift`,{enumerable:!0,get:function(){return $.shift}}),Object.defineProperty(exports,`popoverMWSize`,{enumerable:!0,get:function(){return $.size}}),exports.transformDate=t.transformDate,exports.useGenericComponents=i.useGenericComponents,exports.useStylesContext=o.useStylesContext,exports.useUtilsProvider=a.useUtilsProvider;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./lib/provider/genericComponentsProvider/genericComponentsProvider.js`),t=require(`./lib/provider/utilsProvider/utilsProvider.js`),n=require(`./lib/provider/stylesProvider/stylesProvider.js`),r=require(`./components/accordion/accordionControlled.js`),i=require(`./components/accordion/accordionUnControlled.js`),a=require(`./components/text/text2.js`),o=require(`./components/alert/alertControlled.js`),s=require(`./components/dot/dot.js`),ee=require(`./components/icon/icon.js`),c=require(`./components/icon/iconHost.js`),l=require(`./components/avatar/avatar.js`),u=require(`./components/badge/badge.js`),d=require(`./components/link/link.js`),f=require(`./lib/types/states/states.js`),p=require(`./components/breadcrumbs/breadcrumbs.js`),m=require(`./lib/types/positions/positions.js`),h=require(`./components/button/button.js`),g=require(`./components/calendar/calendar.js`),_=require(`./components/card/cardStandAlone.js`),v=require(`./components/card/card.js`),y=require(`./components/carousel/types/carousel.js`),b=require(`./components/carousel/carousel.js`),x=require(`./components/checkboxBase/checkboxBaseControlled.js`),S=require(`./components/label/labelStandAlone.js`),C=require(`./components/checkbox/checkboxControlled.js`),w=require(`./components/checkbox/checkboxUnControlled.js`),T=require(`./components/checkboxBase/checkboxBaseUncontrolled.js`),E=require(`./components/chip/chip.js`),D=require(`./components/tableBody/tableBody.js`),O=require(`./components/table/table.js`),k=require(`./components/tableCaption/tableCaption.js`),A=require(`./components/tableDivider/tableDivider.js`),j=require(`./components/tableCell/tableCell.js`),M=require(`./components/tableHead/tableHead.js`),N=require(`./components/tableRow/tableRow.js`),P=require(`./components/dataTable/dataTable.js`),F=require(`./lib/types/breakpoints/breakpoints.js`),I=require(`./components/image/image2.js`),L=require(`./components/inputBase/inputBase.js`),R=require(`./components/inputDecoration/inputDecoration.js`),z=require(`./components/input/input.js`),B=require(`./components/inputSignature/inputSignatureControlled.js`),V=require(`./components/inputSignature/inputSignatureUncontrolled.js`),H=require(`./components/link/linkAsButton/linkAsButton.js`),U=require(`./components/option/option.js`),te=require(`./components/listOptions/listOptions.js`),W=require(`./components/popover/popover.js`),G=require(`./components/modal/modalControlled.js`),K=require(`./components/modal/modalUnControlled.js`),q=require(`./components/pageControl/pageControl.js`),J=require(`./components/pagination/pagination.js`),Y=require(`./components/popover/animations/spring.animations.js`),X=require(`./components/progressBar/progressBar.js`),Z=require(`./components/radioButton/radioButtonStandAlone.js`),Q=require(`./components/radioButton/radioButton.js`),ne=require(`./components/select/selectControlled.js`),re=require(`./components/select/selectUncontrolled.js`),ie=require(`./components/selectorBoxFile/selectorBoxFile.js`),ae=require(`./components/skeleton/skeleton2.js`),oe=require(`./components/tooltip/tooltipUnControlled.js`),se=require(`./components/slider/slider.js`),ce=require(`./components/snackbar/snackbar.js`),le=require(`./components/stepperNumber/stepperNumber.js`),ue=require(`./components/tableFoot/tableFoot.js`),de=require(`./components/tabs/tabsControlled.js`),fe=require(`./components/tabs/tabsUnControlled.js`),pe=require(`./components/tag/tag.js`),me=require(`./components/textArea/textArea.js`),he=require(`./components/toggle/toggleStandAlone.js`),ge=require(`./components/toggle/toggleControlled.js`),_e=require(`./components/toggle/toggleUnControlled.js`),ve=require(`./components/tooltip/tooltipControlled.js`),ye=require(`./components/virtualKeyboard/virtualKeyboard.js`),be=require(`./lib/types/sizes/sizes.js`);let $=require(`@floating-ui/dom`);exports.Accordion=i.AccordionUnControlled,exports.AccordionControlled=r.AccordionControlled,exports.Alert=o.Alert,exports.Avatar=l.Avatar,exports.Badge=u.Badge,exports.BreadCrumbs=p.BreadCrumbs,exports.Button=h.Button,exports.CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY=y.CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY,exports.CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY=y.CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY,exports.Calendar=g.Calendar,exports.Card=v.Card,exports.CardStandAlone=_.CardStandAlone,exports.Carousel=b.Carousel,exports.Checkbox=w.CheckboxUnControlled,exports.CheckboxBase=T.CheckboxBaseUnControlled,exports.CheckboxBaseControlled=x.CheckboxBaseControlled,exports.CheckboxControlled=C.CheckboxControlled,exports.Chip=E.Chip,exports.DEVICE_BREAKPOINTS=F.DEVICE_BREAKPOINTS,exports.DataTable=P.DataTable,exports.DeviceBreakpointsTypeUtils=F.DeviceBreakpointsTypeUtils,exports.Dot=s.Dot,exports.GenericComponentContext=e.GenericComponentContext,exports.GenericComponentsProvider=e.GenericComponentsProvider,exports.Icon=c.IconHost,exports.IconBasic=ee.IconBasic,exports.Image=I.Image,exports.Input=z.Input,exports.InputBase=L.InputBase,exports.InputDecoration=R.InputDecoration,exports.InputSignature=V.InputSignatureUnControlled,exports.InputSignatureControlled=B.InputSignatureControlled,exports.Label=S.LabelStandAlone,exports.Link=d.Link,exports.LinkAsButton=H.LinkAsButton,exports.ListOptions=te.ListOptions,exports.MIRROR_POSITIONS=m.MIRROR_POSITIONS,exports.Modal=K.ModalUnControlled,exports.ModalControlled=G.ModalControlled,exports.Option=U.Option,exports.POSITIONS=m.POSITIONS,exports.PageControl=q.PageControl,exports.Pagination=J.Pagination,exports.Popover=W.Popover,exports.ProgressBar=X.ProgressBar,exports.RadioButton=Q.RadioButton,exports.RadioButtonStandAlone=Z.RadioButtonStandAlone,exports.SIZES=be.SIZES,exports.STATES=f.STATES,exports.Select=re.SelectUnControlled,exports.SelectControlled=ne.SelectControlled,exports.SelectorBoxFile=ie.SelectorBoxFile,exports.Skeleton=ae.Skeleton,exports.Slider=se.Slider,exports.Snackbar=ce.Snackbar,exports.StepperNumber=le.StepperNumber,exports.StylesContext=n.StylesContext,exports.StylesProvider=n.StylesProvider,exports.Table=O.Table,exports.TableBody=D.TableBody,exports.TableCaption=k.TableCaption,exports.TableCell=j.TableCell,exports.TableDivider=A.TableDivider,exports.TableFoot=ue.TableFoot,exports.TableHead=M.TableHead,exports.TableRow=N.TableRow,exports.Tabs=fe.TabsUnControlled,exports.TabsControlled=de.TabsControlled,exports.Tag=pe.Tag,exports.Text=a.Text,exports.TextArea=me.TextArea,exports.ToggleControlled=ge.ToggleControlled,exports.ToggleStandalone=he.ToggleStandalone,exports.ToggleUncontrolled=_e.ToggleUncontrolled,exports.Tooltip=oe.TooltipUnControlled,exports.TooltipControlled=ve.TooltipControlled,exports.UtilsContext=t.UtilsContext,exports.UtilsProvider=t.UtilsProvider,exports.VirtualKeyboard=ye.VirtualKeyboard,exports.createSpringAnimation=Y.createSpringAnimation,exports.generateSpringKeyframes=Y.generateSpringKeyframes,exports.generateSpringKeyframesRule=Y.generateSpringKeyframesRule,Object.defineProperty(exports,`popoverMWArrow`,{enumerable:!0,get:function(){return $.arrow}}),Object.defineProperty(exports,`popoverMWAutoPlacement`,{enumerable:!0,get:function(){return $.autoPlacement}}),Object.defineProperty(exports,`popoverMWFlip`,{enumerable:!0,get:function(){return $.flip}}),Object.defineProperty(exports,`popoverMWHide`,{enumerable:!0,get:function(){return $.hide}}),Object.defineProperty(exports,`popoverMWOffset`,{enumerable:!0,get:function(){return $.offset}}),Object.defineProperty(exports,`popoverMWShift`,{enumerable:!0,get:function(){return $.shift}}),Object.defineProperty(exports,`popoverMWSize`,{enumerable:!0,get:function(){return $.size}}),exports.useGenericComponents=e.useGenericComponents,exports.useStylesContext=n.useStylesContext,exports.useUtilsProvider=t.useUtilsProvider;
@@ -1 +1 @@
1
- const e=require(`./utils/contentVisibility.js`);let t=require(`react`);exports.useContentVisibility=({minVisibleHeight:n=100,onContentInvisible:r,onContentVisible:i})=>{let a=(0,t.useRef)(null),o=(0,t.useRef)(null),s=(0,t.useRef)(),c=(0,t.useRef)(),l=(0,t.useRef)(void 0),u=(0,t.useCallback)(()=>{let e=a.current,t=o.current;!e||!t||(i?i():(e.style.overflowY=``,t.style.overflowY=``))},[i]),d=(0,t.useCallback)(()=>{let e=a.current,t=o.current;!e||!t||(r?r():(e.style.overflowY=`auto`,t.style.overflowY=`visible`))},[r]);return{handleContentVisibility:(0,t.useCallback)(({container:t,content:r})=>{if(a.current=t,o.current=r,t&&r){let i=()=>{let i=e.isContentVisibleEnough({container:t,content:r,minVisibleHeight:n});i!==l.current&&(i?u():d()),l.current=i};i(),s.current=new ResizeObserver(()=>{i()}),c.current=new ResizeObserver(()=>{i()}),s.current.observe(r),s.current.observe(t)}else s.current?.disconnect(),c.current?.disconnect()},[n,u,d])}};
1
+ const e=require(`./utils/contentVisibility.js`);let t=require(`react`);exports.useContentVisibility=({minVisibleHeight:n=100,onContentInvisible:r,onContentVisible:i})=>{let a=(0,t.useRef)(null),o=(0,t.useRef)(null),s=(0,t.useRef)(void 0),c=(0,t.useRef)(void 0),l=(0,t.useRef)(void 0),u=(0,t.useCallback)(()=>{let e=a.current,t=o.current;!e||!t||(i?i():(e.style.overflowY=``,t.style.overflowY=``))},[i]),d=(0,t.useCallback)(()=>{let e=a.current,t=o.current;!e||!t||(r?r():(e.style.overflowY=`auto`,t.style.overflowY=`visible`))},[r]);return{handleContentVisibility:(0,t.useCallback)(({container:t,content:r})=>{if(a.current=t,o.current=r,t&&r){let i=()=>{let i=e.isContentVisibleEnough({container:t,content:r,minVisibleHeight:n});i!==l.current&&(i?u():d()),l.current=i};i(),s.current=new ResizeObserver(()=>{i()}),c.current=new ResizeObserver(()=>{i()}),s.current.observe(r),s.current.observe(t)}else s.current?.disconnect(),c.current?.disconnect()},[n,u,d])}};
@@ -1 +1 @@
1
- const e=require(`../../utils/scroll/hasScroll.js`);let t=require(`react`);exports.useScrollDetection=({autoFocus:n=!1}={})=>{let[r,i]=(0,t.useState)(!1),a=(0,t.useRef)(),o=(0,t.useRef)(!1);return{handleScrollDetection:(0,t.useCallback)(t=>{if(t){let r=t=>{let r=e.hasScroll(t);i(r),n&&r&&!o.current&&(t.focus(),o.current=!0)};r(t),a.current=new ResizeObserver(()=>{r(t)}),a.current.observe(t)}else a.current?.disconnect()},[n]),hasScroll:r}};
1
+ const e=require(`../../utils/scroll/hasScroll.js`);let t=require(`react`);exports.useScrollDetection=({autoFocus:n=!1}={})=>{let[r,i]=(0,t.useState)(!1),a=(0,t.useRef)(void 0),o=(0,t.useRef)(!1);return{handleScrollDetection:(0,t.useCallback)(t=>{if(t){let r=t=>{let r=e.hasScroll(t);i(r),n&&r&&!o.current&&(t.focus(),o.current=!0)};r(t),a.current=new ResizeObserver(()=>{r(t)}),a.current.observe(t)}else a.current?.disconnect()},[n]),hasScroll:r}};
@@ -1 +1 @@
1
- const e=require(`../../utils/date/formatDate.js`),t=require(`../../utils/date/transformDate.js`),n=require(`../../utils/date/date.js`),r=require(`../genericComponentsProvider/defaultGenericComponents.js`),i=require(`../genericComponentsProvider/genericComponentsProvider.js`),a=require(`../utilsProvider/utilsProvider.js`);let o=require(`react`),s=require(`react/jsx-runtime`);const c=(0,o.createContext)(void 0),l=()=>{let e=(0,o.useContext)(c);if(!e)throw Error(`useStylesContext must be used within a StylesProvider`);return e};var u={lg:992,md:768,sm:576,xl:1200},d=e=>({onlyDesktop:`(max-width: ${e.xl}px)`,onlyLargeDesktop:`(min-width: ${e.xl}px)`,onlyMobile:`(max-width: ${e.md-1}px)`,onlyTablet:`(min-width: ${e.md}px) and (max-width: ${e.lg-1}px)`});exports.StylesContext=c,exports.StylesProvider=({bernovaProvider:l,breakpoints:f=u,children:p,icons:m={},illustrations:h={},jsInCss:g=!0,linkId:_=`kb-styled-provider`,themeSelected:v})=>{let y=(0,o.useMemo)(()=>d(f),[f]),b=(0,o.useMemo)(()=>new l({jsInCss:g,linkId:_}),[l,g,_]),[x,S]=(0,o.useState)(v||b.themeSelected);b.themeSelected=x||``;let C=e=>{b.themeSelected=e,S(e)},w=({additionalClassNames:e,component:t,variant:n})=>b.getComponentStyles({additionalClassNames:e,component:t,variant:n||``}),T=(0,o.useMemo)(()=>({breakpoints:f,changeTheme:C,classes:[],currentTheme:x,getComponentStyles:w,icons:m,illustrations:h,mediaQueries:y,themeClassNames:b.classNames,themes:b.allThemes,themeVariables:b.variables}),[f,x,m,h,y,b.classNames,b.allThemes,b.variables]);return(0,s.jsx)(a.UtilsProvider,{dateHelpers:{getAddDays:n.getAddDays,getAddMonths:n.getAddMonths,getAddYears:n.getAddYears,getAllMonthName:(e,t)=>n.getAllMonthNames(e===`numeric`||e===`2-digit`?`long`:e||`long`,t),getAllWeekdayName:n.getAllWeekdayNames,getSubDays:n.getSubDays,getSubMonths:n.getSubMonths,getSubYears:n.getSubYears,isAfter:n.isAfter,isBefore:n.isBefore,isDatesEqual:n.isDatesEqual},formatDate:e.formatDate,transformDate:t.transformDate,children:(0,s.jsx)(i.GenericComponentsProvider,{value:{...r.defaultGenericComponents},children:(0,s.jsx)(c.Provider,{value:T,children:p})})})},exports.useStylesContext=l;
1
+ const e=require(`../../utils/date/formatDate.js`),t=require(`../../utils/date/transformDate.js`),n=require(`../../utils/date/date.js`),r=require(`../genericComponentsProvider/defaultGenericComponents.js`),i=require(`../genericComponentsProvider/genericComponentsProvider.js`),a=require(`../utilsProvider/utilsProvider.js`);let o=require(`react`),s=require(`react/jsx-runtime`);const c=(0,o.createContext)(void 0),l=()=>{let e=(0,o.useContext)(c);if(!e)throw Error(`useStylesContext must be used within a StylesProvider`);return e};var u={lg:992,md:768,sm:576,xl:1200},d=e=>({onlyDesktop:`(max-width: ${e.xl}px)`,onlyLargeDesktop:`(min-width: ${e.xl}px)`,onlyMobile:`(max-width: ${e.md-1}px)`,onlyTablet:`(min-width: ${e.md}px) and (max-width: ${e.lg-1}px)`});exports.StylesContext=c,exports.StylesProvider=({bernovaProvider:l={},breakpoints:f=u,children:p,icons:m={},illustrations:h={},jsInCss:g=!0,linkId:_=`kb-styled-provider`,themeSelected:v,genericComponents:y,dateHelpers:b})=>{let x=(0,o.useMemo)(()=>d(f),[f]),S=(0,o.useMemo)(()=>new l({jsInCss:g,linkId:_}),[l,g,_]),[C,w]=(0,o.useState)(v||S.themeSelected);S.themeSelected=C||``;let T=e=>{S.themeSelected=e,w(e)},E=({additionalClassNames:e,component:t,variant:n})=>S.getComponentStyles({additionalClassNames:e,component:t,variant:n||``}),D=(0,o.useMemo)(()=>({breakpoints:f,changeTheme:T,classes:[],currentTheme:C,getComponentStyles:E,icons:m,illustrations:h,mediaQueries:x,themeClassNames:S.classNames,themes:S.allThemes,themeVariables:S.variables}),[f,C,m,h,x,S.classNames,S.allThemes,S.variables]);return(0,s.jsx)(a.UtilsProvider,{dateHelpers:{getAddDays:n.getAddDays,getAddMonths:n.getAddMonths,getAddYears:n.getAddYears,getAllMonthName:(e,t)=>n.getAllMonthNames(e===`numeric`||e===`2-digit`?`long`:e||`long`,t),getAllWeekdayName:n.getAllWeekdayNames,getSubDays:n.getSubDays,getSubMonths:n.getSubMonths,getSubYears:n.getSubYears,isAfter:n.isAfter,isBefore:n.isBefore,isDatesEqual:n.isDatesEqual,...b},formatDate:e.formatDate,transformDate:t.transformDate,children:(0,s.jsx)(i.GenericComponentsProvider,{value:{...r.defaultGenericComponents,...y},children:(0,s.jsx)(c.Provider,{value:D,children:p})})})},exports.useStylesContext=l;
@@ -3,7 +3,7 @@ import calc_utils_default from "./utils/calc.utils.js";
3
3
  import constants_default from "./utils/constants.js";
4
4
  import { useCallback, useEffect, useRef } from "react";
5
5
  const useCarouselSwipe = ({ allowShiftRef: a, centerExtremesWhenExtraPadding: o, changePage: s, circular: c, contentContainerRef: l, currentPageRef: u, disabled: d = !1, elements: f, extraPadding: p, numElementsPerPageRef: m, numPagesRef: h, viewerContainerRef: g }) => {
6
- let _ = useRef(!1), v = useRef(!1), y = useRef(!1), b = useRef(), x = useRef(0), S = useRef(0), C = useRef(0), w = useRef(0), T = useCallback(() => {
6
+ let _ = useRef(!1), v = useRef(!1), y = useRef(!1), b = useRef(void 0), x = useRef(0), S = useRef(0), C = useRef(0), w = useRef(0), T = useCallback(() => {
7
7
  a.current && (c || u.current !== h.current - 1) && s({ newPage: u.current + 1 });
8
8
  }, [c, s]), E = useCallback(() => {
9
9
  a.current && (c || u.current !== 0) && s({ newPage: u.current - 1 });
@@ -5,7 +5,7 @@ function isImageDataEqual(e, t) {
5
5
  return !0;
6
6
  }
7
7
  const useDraw = (r) => {
8
- let i = useRef(null), a = useRef(), o = useRef(!1), s = useRef(!1), c = useRef({
8
+ let i = useRef(null), a = useRef(null), o = useRef(!1), s = useRef(!1), c = useRef({
9
9
  color: "black",
10
10
  lineWidth: 2
11
11
  }), l = useRef(null), u = () => {
@@ -8,7 +8,7 @@ const Option = forwardRef(({ additionalClasses: t, focus: n, onBlur: r, onFocus:
8
8
  additionalClassNames: t,
9
9
  component: "OPTION",
10
10
  variant: a
11
- }), { LINK: l } = useGenericComponents(), u = useRef(), [d, f] = useState(!1), [p, m] = useState(!1);
11
+ }), { LINK: l } = useGenericComponents(), u = useRef(null), [d, f] = useState(!1), [p, m] = useState(!1);
12
12
  useImperativeHandle(s, () => u.current, []), useEffect(() => {
13
13
  n && u.current?.focus();
14
14
  }, [n]);
@@ -16,7 +16,7 @@ const Slider = forwardRef(({ additionalClasses: r, ariaLabel: i, ariaLabelBy: a,
16
16
  }), j = useRef(null), [M, N] = useState(A(D ?? s)), [P, F] = useState(!1), [I, L] = useState(!1), R = useRef("left"), [z, B] = useState({
17
17
  max: 100,
18
18
  min: 0
19
- }), V = useRef();
19
+ }), V = useRef(void 0);
20
20
  focusThumb({
21
21
  container: j.current,
22
22
  currentActivePointer: R.current,
package/dist/esm/index.js CHANGED
@@ -1,7 +1,3 @@
1
- import { formatDate, formatDateToUTC } from "./lib/utils/date/formatDate.js";
2
- import { transformDate } from "./lib/utils/date/transformDate.js";
3
- import { getAddDays, getAddMonths, getAddYears, getAllMonthNames, getAllWeekdayNames, getSubDays, getSubMonths, getSubYears, isAfter, isBefore, isDatesEqual } from "./lib/utils/date/date.js";
4
- import { defaultGenericComponents } from "./lib/provider/genericComponentsProvider/defaultGenericComponents.js";
5
1
  import { GenericComponentContext, GenericComponentsProvider, useGenericComponents } from "./lib/provider/genericComponentsProvider/genericComponentsProvider.js";
6
2
  import { UtilsContext, UtilsProvider, useUtilsProvider } from "./lib/provider/utilsProvider/utilsProvider.js";
7
3
  import { StylesContext, StylesProvider, useStylesContext } from "./lib/provider/stylesProvider/stylesProvider.js";
@@ -25,7 +21,6 @@ import { Card } from "./components/card/card.js";
25
21
  import { CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY, CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY } from "./components/carousel/types/carousel.js";
26
22
  import { Carousel } from "./components/carousel/carousel.js";
27
23
  import { CheckboxBaseControlled } from "./components/checkboxBase/checkboxBaseControlled.js";
28
- import { ErrorMessage } from "./lib/components/errorMessage/errorMessage.js";
29
24
  import { LabelStandAlone } from "./components/label/labelStandAlone.js";
30
25
  import { CheckboxControlled } from "./components/checkbox/checkboxControlled.js";
31
26
  import { CheckboxUnControlled } from "./components/checkbox/checkboxUnControlled.js";
@@ -78,4 +73,4 @@ import { ToggleUncontrolled } from "./components/toggle/toggleUnControlled.js";
78
73
  import { TooltipControlled } from "./components/tooltip/tooltipControlled.js";
79
74
  import { VirtualKeyboard } from "./components/virtualKeyboard/virtualKeyboard.js";
80
75
  import { SIZES } from "./lib/types/sizes/sizes.js";
81
- export { AccordionUnControlled as Accordion, AccordionControlled, Alert, Avatar, Badge, BreadCrumbs, Button, CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY, CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY, Calendar, Card, CardStandAlone, Carousel, CheckboxUnControlled as Checkbox, CheckboxBaseUnControlled as CheckboxBase, CheckboxBaseControlled, CheckboxControlled, Chip, DEVICE_BREAKPOINTS, DataTable, DeviceBreakpointsTypeUtils, Dot, ErrorMessage, GenericComponentContext, GenericComponentsProvider, IconHost as Icon, IconBasic, Image, Input, InputBase, InputDecoration, InputSignatureUnControlled as InputSignature, InputSignatureControlled, LabelStandAlone as Label, Link, LinkAsButton, ListOptions, MIRROR_POSITIONS, ModalUnControlled as Modal, ModalControlled, Option, POSITIONS, PageControl, Pagination, Popover, ProgressBar, RadioButton, RadioButtonStandAlone, SIZES, STATES, SelectUnControlled as Select, SelectControlled, SelectorBoxFile, Skeleton, Slider, Snackbar, StepperNumber, StylesContext, StylesProvider, Table, TableBody, TableCaption, TableCell, TableDivider, TableFoot, TableHead, TableRow, TabsUnControlled as Tabs, TabsControlled, Tag, Text, TextArea, ToggleControlled, ToggleStandalone, ToggleUncontrolled, TooltipUnControlled as Tooltip, TooltipControlled, UtilsContext, UtilsProvider, VirtualKeyboard, createSpringAnimation, defaultGenericComponents, formatDate, formatDateToUTC, generateSpringKeyframes, generateSpringKeyframesRule, getAddDays, getAddMonths, getAddYears, getAllMonthNames, getAllWeekdayNames, getSubDays, getSubMonths, getSubYears, isAfter, isBefore, isDatesEqual, popoverMWArrow, popoverMWAutoPlacement, popoverMWFlip, popoverMWHide, popoverMWOffset, popoverMWShift, popoverMWSize, transformDate, useGenericComponents, useStylesContext, useUtilsProvider };
76
+ export { AccordionUnControlled as Accordion, AccordionControlled, Alert, Avatar, Badge, BreadCrumbs, Button, CAROUSEL_BUILD_SCREEN_READER_CURRENT_PAGE_KEY, CAROUSEL_BUILD_SCREEN_READER_NUM_PAGES_KEY, Calendar, Card, CardStandAlone, Carousel, CheckboxUnControlled as Checkbox, CheckboxBaseUnControlled as CheckboxBase, CheckboxBaseControlled, CheckboxControlled, Chip, DEVICE_BREAKPOINTS, DataTable, DeviceBreakpointsTypeUtils, Dot, GenericComponentContext, GenericComponentsProvider, IconHost as Icon, IconBasic, Image, Input, InputBase, InputDecoration, InputSignatureUnControlled as InputSignature, InputSignatureControlled, LabelStandAlone as Label, Link, LinkAsButton, ListOptions, MIRROR_POSITIONS, ModalUnControlled as Modal, ModalControlled, Option, POSITIONS, PageControl, Pagination, Popover, ProgressBar, RadioButton, RadioButtonStandAlone, SIZES, STATES, SelectUnControlled as Select, SelectControlled, SelectorBoxFile, Skeleton, Slider, Snackbar, StepperNumber, StylesContext, StylesProvider, Table, TableBody, TableCaption, TableCell, TableDivider, TableFoot, TableHead, TableRow, TabsUnControlled as Tabs, TabsControlled, Tag, Text, TextArea, ToggleControlled, ToggleStandalone, ToggleUncontrolled, TooltipUnControlled as Tooltip, TooltipControlled, UtilsContext, UtilsProvider, VirtualKeyboard, createSpringAnimation, generateSpringKeyframes, generateSpringKeyframesRule, popoverMWArrow, popoverMWAutoPlacement, popoverMWFlip, popoverMWHide, popoverMWOffset, popoverMWShift, popoverMWSize, useGenericComponents, useStylesContext, useUtilsProvider };
@@ -1,7 +1,7 @@
1
1
  import { isContentVisibleEnough } from "./utils/contentVisibility.js";
2
2
  import { useCallback, useRef } from "react";
3
3
  const useContentVisibility = ({ minVisibleHeight: r = 100, onContentInvisible: i, onContentVisible: a }) => {
4
- let o = useRef(null), s = useRef(null), c = useRef(), l = useRef(), u = useRef(void 0), d = useCallback(() => {
4
+ let o = useRef(null), s = useRef(null), c = useRef(void 0), l = useRef(void 0), u = useRef(void 0), d = useCallback(() => {
5
5
  let e = o.current, t = s.current;
6
6
  !e || !t || (a ? a() : (e.style.overflowY = "", t.style.overflowY = ""));
7
7
  }, [a]), f = useCallback(() => {
@@ -1,7 +1,7 @@
1
1
  import { hasScroll } from "../../utils/scroll/hasScroll.js";
2
2
  import { useCallback, useRef, useState } from "react";
3
3
  const useScrollDetection = ({ autoFocus: n = !1 } = {}) => {
4
- let [r, i] = useState(!1), a = useRef(), o = useRef(!1);
4
+ let [r, i] = useState(!1), a = useRef(void 0), o = useRef(!1);
5
5
  return {
6
6
  handleScrollDetection: useCallback((e) => {
7
7
  if (e) {
@@ -22,43 +22,43 @@ var defaultBreakpoints = {
22
22
  onlyMobile: `(max-width: ${e.md - 1}px)`,
23
23
  onlyTablet: `(min-width: ${e.md}px) and (max-width: ${e.lg - 1}px)`
24
24
  });
25
- const StylesProvider = ({ bernovaProvider: r, breakpoints: i = defaultBreakpoints, children: a, icons: o = {}, illustrations: s = {}, jsInCss: c = !0, linkId: l = "kb-styled-provider", themeSelected: u }) => {
26
- let d = useMemo(() => buildMediaQueries(i), [i]), f = useMemo(() => new r({
25
+ const StylesProvider = ({ bernovaProvider: r = {}, breakpoints: i = defaultBreakpoints, children: a, icons: o = {}, illustrations: s = {}, jsInCss: c = !0, linkId: l = "kb-styled-provider", themeSelected: u, genericComponents: d, dateHelpers: f }) => {
26
+ let p = useMemo(() => buildMediaQueries(i), [i]), m = useMemo(() => new r({
27
27
  jsInCss: c,
28
28
  linkId: l
29
29
  }), [
30
30
  r,
31
31
  c,
32
32
  l
33
- ]), [p, m] = useState(u || f.themeSelected);
34
- f.themeSelected = p || "";
35
- let h = (e) => {
36
- f.themeSelected = e, m(e);
37
- }, g = ({ additionalClassNames: e, component: t, variant: n }) => f.getComponentStyles({
33
+ ]), [h, g] = useState(u || m.themeSelected);
34
+ m.themeSelected = h || "";
35
+ let _ = (e) => {
36
+ m.themeSelected = e, g(e);
37
+ }, v = ({ additionalClassNames: e, component: t, variant: n }) => m.getComponentStyles({
38
38
  additionalClassNames: e,
39
39
  component: t,
40
40
  variant: n || ""
41
- }), _ = useMemo(() => ({
41
+ }), y = useMemo(() => ({
42
42
  breakpoints: i,
43
- changeTheme: h,
43
+ changeTheme: _,
44
44
  classes: [],
45
- currentTheme: p,
46
- getComponentStyles: g,
45
+ currentTheme: h,
46
+ getComponentStyles: v,
47
47
  icons: o,
48
48
  illustrations: s,
49
- mediaQueries: d,
50
- themeClassNames: f.classNames,
51
- themes: f.allThemes,
52
- themeVariables: f.variables
49
+ mediaQueries: p,
50
+ themeClassNames: m.classNames,
51
+ themes: m.allThemes,
52
+ themeVariables: m.variables
53
53
  }), [
54
54
  i,
55
- p,
55
+ h,
56
56
  o,
57
57
  s,
58
- d,
59
- f.classNames,
60
- f.allThemes,
61
- f.variables
58
+ p,
59
+ m.classNames,
60
+ m.allThemes,
61
+ m.variables
62
62
  ]);
63
63
  return /* @__PURE__ */ jsx(UtilsProvider, {
64
64
  dateHelpers: {
@@ -72,14 +72,18 @@ const StylesProvider = ({ bernovaProvider: r, breakpoints: i = defaultBreakpoint
72
72
  getSubYears,
73
73
  isAfter,
74
74
  isBefore,
75
- isDatesEqual
75
+ isDatesEqual,
76
+ ...f
76
77
  },
77
78
  formatDate,
78
79
  transformDate,
79
80
  children: /* @__PURE__ */ jsx(GenericComponentsProvider, {
80
- value: { ...defaultGenericComponents },
81
+ value: {
82
+ ...defaultGenericComponents,
83
+ ...d
84
+ },
81
85
  children: /* @__PURE__ */ jsx(StylesContext.Provider, {
82
- value: _,
86
+ value: y,
83
87
  children: a
84
88
  })
85
89
  })
@@ -1986,56 +1986,46 @@ declare interface DateFormatOptions {
1986
1986
  hourCycle?: Intl.DateTimeFormatOptions['hourCycle'];
1987
1987
  }
1988
1988
 
1989
- declare interface DateFormatOptions_2 {
1990
- weekday?: Intl.DateTimeFormatOptions['weekday'];
1991
- year?: Intl.DateTimeFormatOptions['year'];
1992
- month?: Intl.DateTimeFormatOptions['month'];
1993
- day?: Intl.DateTimeFormatOptions['day'];
1994
- hour?: Intl.DateTimeFormatOptions['hour'];
1995
- minute?: Intl.DateTimeFormatOptions['minute'];
1996
- second?: Intl.DateTimeFormatOptions['second'];
1997
- timeZoneName?: Intl.DateTimeFormatOptions['timeZoneName'];
1998
- hour12?: Intl.DateTimeFormatOptions['hour12'];
1999
- hourCycle?: Intl.DateTimeFormatOptions['hourCycle'];
2000
- }
2001
-
2002
- /**
2003
- * Default implementations for generic components.
2004
- * Provides standard HTML-based Link and Image components.
2005
- * These are used when the application doesn't provide custom implementations.
2006
- *
2007
- * @example
2008
- * ```tsx
2009
- * import { defaultGenericComponents } from './defaultGenericComponents';
2010
- *
2011
- * <GenericComponentsProvider value={defaultGenericComponents}>
2012
- * <App />
2013
- * </GenericComponentsProvider>
2014
- * ```
2015
- */
2016
- export declare const defaultGenericComponents: {
2017
- IMAGE: ForwardRefExoticComponent<GenericImageProps & RefAttributes<unknown>>;
2018
- LINK: ForwardRefExoticComponent< {
2019
- url: string;
2020
- id?: string;
2021
- children: string | JSX.Element;
2022
- className?: string;
2023
- target?: string;
2024
- onClick?: () => void;
2025
- onFocus?: () => void;
2026
- onMouseEnter?: () => void;
2027
- onMouseLeave?: () => void;
2028
- rel?: string;
2029
- role?: AriaRole;
2030
- dataTestId?: string;
2031
- draggable?: boolean;
2032
- } & {
2033
- "aria-label"?: string | undefined | undefined;
2034
- "aria-describedby"?: string | undefined | undefined;
2035
- "aria-labelledby"?: string | undefined | undefined;
2036
- "aria-disabled"?: (boolean | "false" | "true") | undefined;
2037
- "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
2038
- } & DataAttributes & RefAttributes<unknown>>;
1989
+ declare type dateHelpers = {
1990
+ /** Subtracts a specified number of days from a date */
1991
+ getSubDays: (date: Date, amount: number) => Date;
1992
+ /** Subtracts a specified number of months from a date */
1993
+ getSubMonths: (date: Date, amount: number) => Date;
1994
+ /** Subtracts a specified number of years from a date */
1995
+ getSubYears: (date: Date, amount: number) => Date;
1996
+ /** Adds a specified number of months to a date */
1997
+ getAddMonths: (date: Date, amount: number) => Date;
1998
+ /** Adds a specified number of days to a date */
1999
+ getAddDays: (date: Date, amount: number) => Date;
2000
+ /** Adds a specified number of years to a date */
2001
+ getAddYears: (date: Date, years: number) => Date;
2002
+ /**
2003
+ * Gets all month names in the specified format and locale.
2004
+ * @param monthFormat - Format for month names ('long', 'short', 'narrow')
2005
+ * @param locale - Optional locale string
2006
+ * @returns Array of month names
2007
+ */
2008
+ getAllMonthName: (monthFormat: Intl.DateTimeFormatOptions['month'], locale?: string) => Array<string>;
2009
+ /**
2010
+ * Gets all weekday names in the specified format and locale.
2011
+ * @param weekdayFormat - Format for weekday names ('long', 'short', 'narrow')
2012
+ * @param isSundayFirst - Whether Sunday should be the first day of the week
2013
+ * @param locale - Optional locale string
2014
+ * @returns Array of weekday names
2015
+ */
2016
+ getAllWeekdayName: (weekdayFormat: Intl.DateTimeFormatOptions['weekday'], isSundayFirst: boolean, locale?: string) => Array<string>;
2017
+ /** Checks if the first date is before the second date */
2018
+ isBefore: (date1: Date, date2: Date) => boolean;
2019
+ /** Checks if the first date is after the second date */
2020
+ isAfter: (date1: Date, date2: Date) => boolean;
2021
+ /**
2022
+ * Checks if two dates are equal.
2023
+ * @param firstDate - First date to compare
2024
+ * @param secondDate - Second date to compare
2025
+ * @param shouldCompareTime - Whether to include time in comparison
2026
+ * @returns True if dates are equal
2027
+ */
2028
+ isDatesEqual: (firstDate: Date | number | string, secondDate: Date | number | string, shouldCompareTime: boolean) => boolean;
2039
2029
  };
2040
2030
 
2041
2031
  export declare const DEVICE_BREAKPOINTS: {
@@ -2161,88 +2151,6 @@ declare interface ElementOrIconProps extends Omit<IconProps, 'icon'>, DataAttrib
2161
2151
  basic?: boolean;
2162
2152
  }
2163
2153
 
2164
- /**
2165
- * ErrorMessage component for displaying error messages.
2166
- *
2167
- * This component renders a styled error message with optional icons and
2168
- * customizable variants. It uses the ErrorMessageStandAlone component
2169
- * for rendering with CSS classes from the design system.
2170
- *
2171
- * @example
2172
- * ```tsx
2173
- * <ErrorMessage variant="default">
2174
- * Please enter a valid email address
2175
- * </ErrorMessage>
2176
- * ```
2177
- */
2178
- export declare const ErrorMessage: ForwardRefExoticComponent<Omit<ErrorMessageStandAloneProps, "styles"> & {
2179
- variant?: string | undefined;
2180
- additionalClasses?: Partial<{
2181
- icon: string;
2182
- error_message: string;
2183
- typography: string;
2184
- }>;
2185
- } & RefAttributes<HTMLDivElement>>;
2186
-
2187
- declare type ErrorMessageCssClasses = ComponentSelected<ComponentsTypesComponents['ERROR_MESSAGE']>;
2188
-
2189
- export declare type ErrorMessageProps<Variant = undefined extends string ? unknown : string> = Omit<ErrorMessageStandAloneProps, 'styles'> & {
2190
- variant?: Variant;
2191
- additionalClasses?: Partial<ErrorMessageCssClasses>;
2192
- };
2193
-
2194
- export declare interface ErrorMessageStandAloneProps extends Pick<AriaAttributes, 'aria-live'> {
2195
- cssClasses?: ErrorMessageCssClasses;
2196
- show?: boolean;
2197
- message?: CommonTextProps;
2198
- id?: string;
2199
- icon?: CommonIconProps;
2200
- }
2201
-
2202
- export declare interface ErrorMessageStyleProps extends CssLibPropsType {
2203
- _icon?: CssLibPropsType;
2204
- _typography?: CssLibPropsType;
2205
- }
2206
-
2207
- export declare type ErrorMessageVariantStyles<Variant extends string> = ErrorMessageStyleProps & {
2208
- [key in Variant]: ErrorMessageStyleProps;
2209
- };
2210
-
2211
- /**
2212
- * Formats a date according to the specified format and locale.
2213
- *
2214
- * @param date - The date to format
2215
- * @param format - The format to apply: can be a string pattern (e.g., 'dd/MM/yyyy'), a DateFormatOptions object, or a FormatDateType
2216
- * @param locale - The locale to use for formatting (default: current locale)
2217
- * @returns The formatted date string
2218
- *
2219
- * @remarks
2220
- * Supports various tokens: d, dd (day), M, MM, MMM, MMMM (month), yy, yyyy (year), H, HH (hour), m, mm (minute), s, ss (second), W, WW (weekday)
2221
- *
2222
- * @example
2223
- * ```typescript
2224
- * const date = new Date('2024-01-15');
2225
- * formatDate(date, 'dd/MM/yyyy'); // '15/01/2024'
2226
- * formatDate(date, 'MMMM dd, yyyy', 'en-US'); // 'January 15, 2024'
2227
- * ```
2228
- */
2229
- export declare const formatDate: (date: Date, format: DateFormatOptions_2 | FormatDateType | string, locale?: string) => string;
2230
-
2231
- /**
2232
- * Converts a date to UTC format, adjusting for timezone differences.
2233
- *
2234
- * @param date - The date to convert (Date object, string, or timestamp)
2235
- * @returns A Date object in UTC timezone
2236
- * @throws Error if the date is invalid
2237
- *
2238
- * @example
2239
- * ```typescript
2240
- * const localDate = new Date('2024-01-15T10:30:00');
2241
- * const utcDate = formatDateToUTC(localDate);
2242
- * ```
2243
- */
2244
- export declare const formatDateToUTC: (date: Date | string | number) => Date;
2245
-
2246
2154
  declare type FormatDateType = 'd' | 'dd' | 'ddd' | 'dddd' | 'f' | 'ff' | 'fff' | 'F' | 'FF' | 'FFF' | 'ffff' | 'FFFF' | 't' | 'tt' | 'T' | 'TT' | 'ttt' | 'TTT' | 'tttt' | 'TTTT';
2247
2155
 
2248
2156
  /**
@@ -2377,127 +2285,6 @@ declare type GenericLinkProps = {
2377
2285
  */
2378
2286
  declare type GenericLinkType = ((props: GenericLinkProps) => JSX.Element) | ForwardRefExoticComponent<GenericLinkProps & RefAttributes<unknown>>;
2379
2287
 
2380
- /**
2381
- * Adds a specified number of days to a date.
2382
- *
2383
- * @param date - The base date
2384
- * @param days - Number of days to add
2385
- * @returns A new Date with the specified days added
2386
- *
2387
- * @example
2388
- * ```typescript
2389
- * const today = new Date();
2390
- * const nextWeek = getAddDays(today, 7);
2391
- * ```
2392
- */
2393
- export declare const getAddDays: (date: Date, days: number) => Date;
2394
-
2395
- /**
2396
- * Adds a specified number of months to a date.
2397
- *
2398
- * @param date - The base date
2399
- * @param months - Number of months to add
2400
- * @returns A new Date with the specified months added
2401
- *
2402
- * @example
2403
- * ```typescript
2404
- * const today = new Date();
2405
- * const nextQuarter = getAddMonths(today, 3);
2406
- * ```
2407
- */
2408
- export declare const getAddMonths: (date: Date, months: number) => Date;
2409
-
2410
- /**
2411
- * Adds a specified number of years to a date.
2412
- *
2413
- * @param date - The base date
2414
- * @param years - Number of years to add
2415
- * @returns A new Date with the specified years added
2416
- *
2417
- * @example
2418
- * ```typescript
2419
- * const today = new Date();
2420
- * const nextYear = getAddYears(today, 1);
2421
- * ```
2422
- */
2423
- export declare const getAddYears: (date: Date, years: number) => Date;
2424
-
2425
- /**
2426
- * Gets an array of all month names in the specified locale and format.
2427
- *
2428
- * @param type - The format type: 'long' (January), 'short' (Jan), or 'narrow' (J)
2429
- * @param locale - The locale to use for month names (default: 'en-US')
2430
- * @returns An array of 12 month names
2431
- *
2432
- * @example
2433
- * ```typescript
2434
- * getAllMonthNames('long', 'en-US'); // ['January', 'February', ...]
2435
- * getAllMonthNames('short', 'es-ES'); // ['ene', 'feb', ...]
2436
- * ```
2437
- */
2438
- export declare const getAllMonthNames: (type?: "long" | "short" | "narrow", locale?: string) => string[];
2439
-
2440
- /**
2441
- * Gets an array of all weekday names in the specified locale and format.
2442
- *
2443
- * @param type - The format type: 'long' (Monday), 'short' (Mon), or 'narrow' (M)
2444
- * @param isSundayFirst - If `true`, starts week with Sunday; if `false`, starts with Monday
2445
- * @param locale - The locale to use for weekday names (default: 'en-US')
2446
- * @returns An array of 7 weekday names
2447
- *
2448
- * @example
2449
- * ```typescript
2450
- * getAllWeekdayNames('long', false, 'en-US'); // ['Monday', 'Tuesday', ...]
2451
- * getAllWeekdayNames('short', true, 'es-ES'); // ['dom', 'lun', ...]
2452
- * ```
2453
- */
2454
- export declare const getAllWeekdayNames: (type: string | undefined, isSundayFirst: boolean, locale?: string) => string[];
2455
-
2456
- /**
2457
- * Subtracts a specified number of days from a date.
2458
- *
2459
- * @param date - The base date
2460
- * @param days - Number of days to subtract
2461
- * @returns A new Date with the specified days subtracted
2462
- *
2463
- * @example
2464
- * ```typescript
2465
- * const today = new Date();
2466
- * const lastWeek = getSubDays(today, 7);
2467
- * ```
2468
- */
2469
- export declare const getSubDays: (date: Date, days: number) => Date;
2470
-
2471
- /**
2472
- * Subtracts a specified number of months from a date.
2473
- *
2474
- * @param date - The base date
2475
- * @param months - Number of months to subtract
2476
- * @returns A new Date with the specified months subtracted
2477
- *
2478
- * @example
2479
- * ```typescript
2480
- * const today = new Date();
2481
- * const lastQuarter = getSubMonths(today, 3);
2482
- * ```
2483
- */
2484
- export declare const getSubMonths: (date: Date, months: number) => Date;
2485
-
2486
- /**
2487
- * Subtracts a specified number of years from a date.
2488
- *
2489
- * @param date - The base date
2490
- * @param years - Number of years to subtract
2491
- * @returns A new Date with the specified years subtracted
2492
- *
2493
- * @example
2494
- * ```typescript
2495
- * const today = new Date();
2496
- * const lastYear = getSubYears(today, 1);
2497
- * ```
2498
- */
2499
- export declare const getSubYears: (date: Date, years: number) => Date;
2500
-
2501
2288
  /**
2502
2289
  * Interface for controlled Accordion component
2503
2290
  */
@@ -2562,8 +2349,8 @@ export declare interface ICarousel extends Omit<ICarouselStandAlone, 'cssClasses
2562
2349
 
2563
2350
  declare interface ICarouselStandAlone extends DataAttributes {
2564
2351
  cssClasses?: CarouselCssClasses;
2565
- viewerContainerRef: React.RefObject<HTMLDivElement>;
2566
- contentContainerRef: React.RefObject<HTMLDivElement>;
2352
+ viewerContainerRef: React.RefObject<HTMLDivElement | null>;
2353
+ contentContainerRef: React.RefObject<HTMLDivElement | null>;
2567
2354
  elements: JSX.Element[];
2568
2355
  screenReaderOnly?: CarouselScreenReaderOnlyType;
2569
2356
  allowModifySliceWidth?: boolean;
@@ -2951,7 +2738,7 @@ export declare interface InputSignatureLineStyles {
2951
2738
  */
2952
2739
  export declare interface InputSignatureStandAloneProps extends DataAttributes {
2953
2740
  state: InputSignatureState;
2954
- canvasRef: React.RefObject<HTMLCanvasElement>;
2741
+ canvasRef: React.RefObject<HTMLCanvasElement | null>;
2955
2742
  placeholder: CommonTextProps;
2956
2743
  errorText?: CommonTextProps;
2957
2744
  onClickContainer: (e: React.MouseEvent<HTMLDivElement>) => void;
@@ -3106,55 +2893,6 @@ declare interface IPopoverStandAlone extends DataAttributes, PopoverAriaAttribut
3106
2893
  popoverContainerRef?: React.ForwardedRef<HTMLElement>;
3107
2894
  }
3108
2895
 
3109
- /**
3110
- * Checks if the first date is after the second date.
3111
- *
3112
- * @param date1 - The first date to compare
3113
- * @param date2 - The second date to compare
3114
- * @returns `true` if date1 is after date2, otherwise `false`
3115
- *
3116
- * @example
3117
- * ```typescript
3118
- * const today = new Date();
3119
- * const tomorrow = new Date(today.getTime() + 86400000);
3120
- * isAfter(tomorrow, today); // true
3121
- * ```
3122
- */
3123
- export declare const isAfter: (date1: Date, date2: Date) => boolean;
3124
-
3125
- /**
3126
- * Checks if the first date is before the second date.
3127
- *
3128
- * @param date1 - The first date to compare
3129
- * @param date2 - The second date to compare
3130
- * @returns `true` if date1 is before date2, otherwise `false`
3131
- *
3132
- * @example
3133
- * ```typescript
3134
- * const yesterday = new Date();
3135
- * const today = new Date();
3136
- * isBefore(yesterday, today); // true
3137
- * ```
3138
- */
3139
- export declare const isBefore: (date1: Date, date2: Date) => boolean;
3140
-
3141
- /**
3142
- * Checks if two dates are equal.
3143
- *
3144
- * @param firstDate - The first date to compare (Date, string, or timestamp)
3145
- * @param secondDate - The second date to compare (Date, string, or timestamp)
3146
- * @param shouldCompareTime - If `true`, compares exact time; if `false`, compares only date (default: `false`)
3147
- * @returns `true` if dates are equal, otherwise `false`
3148
- *
3149
- * @example
3150
- * ```typescript
3151
- * const date1 = new Date('2024-01-15');
3152
- * const date2 = new Date('2024-01-15');
3153
- * isDatesEqual(date1, date2); // true
3154
- * ```
3155
- */
3156
- export declare const isDatesEqual: (firstDate: Date | string | number, secondDate: Date | string | number, shouldCompareTime?: boolean) => boolean;
3157
-
3158
2896
  declare interface ISnackbarStandAlone extends DataAttributes, AriaAttributes {
3159
2897
  cssClasses?: SnackbarV2CssClasses;
3160
2898
  popover?: SnackbarV2Popover;
@@ -3675,31 +3413,6 @@ export declare type OptionVariantStyles<Variant extends string> = OptionStylePro
3675
3413
  [key in Variant]: OptionStyleProps;
3676
3414
  };
3677
3415
 
3678
- declare type OverlayCssClasses = ComponentSelected<ComponentsTypesComponents['OVERLAY']>;
3679
-
3680
- /**
3681
- * Interface for the Overlay component with a variant.
3682
- * Extends the OverlayStandAloneProps interface and adds a variant and additional CSS classes.
3683
- *
3684
- * @template Variant - The type of the variant for the Overlay.
3685
- */
3686
- export declare interface OverlayProps<Variant = undefined extends string ? unknown : string> extends Omit<OverlayStandAloneProps, 'cssClasses'> {
3687
- variant?: Variant;
3688
- additionalClasses?: Partial<OverlayCssClasses>;
3689
- }
3690
-
3691
- /**
3692
- * Interface for the standalone Overlay component.
3693
- * Includes optional CSS classes and data attributes.
3694
- */
3695
- export declare interface OverlayStandAloneProps extends DataAttributes {
3696
- cssClasses?: OverlayCssClasses;
3697
- }
3698
-
3699
- export declare type OverlayVariantStyles<Variant extends string> = CssLibPropsType & {
3700
- [key in Variant]: CssLibPropsType;
3701
- };
3702
-
3703
3416
  /**
3704
3417
  * PageControl component for pagination/slide navigation indicators.
3705
3418
  *
@@ -4306,13 +4019,13 @@ export declare interface SelectStandAloneProps extends DataAttributes {
4306
4019
  listOptions: SelectListOptionsProps;
4307
4020
  optionSelected?: string;
4308
4021
  onOptionClick: (value: string) => void;
4309
- listOptionsRef: RefObject<HTMLDivElement>;
4022
+ listOptionsRef: RefObject<HTMLDivElement | null>;
4310
4023
  closePopoverOnScroll?: boolean;
4311
4024
  openAndCloseOnHover?: boolean;
4312
4025
  url?: string;
4313
4026
  urlTarget?: HTMLAttributeAnchorTarget;
4314
4027
  component: 'button' | GenericLinkType;
4315
- buttonOrLinkRef?: RefObject<HTMLButtonElement>;
4028
+ buttonOrLinkRef?: RefObject<HTMLButtonElement | null>;
4316
4029
  onFocus?: FocusEventHandler<HTMLDivElement>;
4317
4030
  onBlur?: FocusEventHandler<HTMLDivElement>;
4318
4031
  onKeyDown?: KeyboardEventHandler<HTMLDivElement>;
@@ -4513,7 +4226,7 @@ export declare interface SliderStandAloneProps extends DataAttributes {
4513
4226
  hover: boolean;
4514
4227
  pressed: boolean;
4515
4228
  activePointer: React.MutableRefObject<string>;
4516
- containerRef: React.RefObject<HTMLDivElement>;
4229
+ containerRef: React.RefObject<HTMLDivElement | null>;
4517
4230
  onMouseDown: React.MouseEventHandler<HTMLDivElement>;
4518
4231
  onChange: (event: MouseEvent | React.TouchEvent | React.MouseEvent) => void;
4519
4232
  onTouchStart: React.TouchEventHandler<HTMLDivElement>;
@@ -4827,6 +4540,8 @@ declare interface StylesProviderProps {
4827
4540
  linkId?: string;
4828
4541
  /** Whether to inject CSS directly into JavaScript. Default: true */
4829
4542
  jsInCss?: boolean;
4543
+ genericComponents?: GenericComponentsType;
4544
+ dateHelpers?: dateHelpers;
4830
4545
  }
4831
4546
 
4832
4547
  /**
@@ -5825,25 +5540,6 @@ export declare type TooltipVariantStyles<Variant extends string> = TooltipStyleP
5825
5540
  [key in Variant]?: TooltipStyleProps;
5826
5541
  };
5827
5542
 
5828
- /**
5829
- * Transforms a date string or timestamp into a Date object using a specified format.
5830
- *
5831
- * @param date - The date as a string or timestamp number
5832
- * @param format - The format pattern of the input date string (e.g., 'dd/MM/yyyy')
5833
- * @returns A Date object parsed from the input
5834
- *
5835
- * @remarks
5836
- * If no format is provided or date is a number, it will be converted directly to a Date.
5837
- * Supports tokens like dd, MM, yyyy, HH, mm, ss for parsing.
5838
- *
5839
- * @example
5840
- * ```typescript
5841
- * transformDate('15/01/2024', 'dd/MM/yyyy'); // Date object for Jan 15, 2024
5842
- * transformDate(1705334400000); // Date from timestamp
5843
- * ```
5844
- */
5845
- export declare const transformDate: (date: string | number, format?: string) => Date;
5846
-
5847
5543
  /**
5848
5544
  * Custom hook to access the generic components context.
5849
5545
  * Provides access to the custom Link and Image components configured in the provider.
@@ -5951,47 +5647,7 @@ declare interface UtilsContextType {
5951
5647
  /**
5952
5648
  * Collection of date manipulation and comparison utilities.
5953
5649
  */
5954
- dateHelpers: {
5955
- /** Subtracts a specified number of days from a date */
5956
- getSubDays: (date: Date, amount: number) => Date;
5957
- /** Subtracts a specified number of months from a date */
5958
- getSubMonths: (date: Date, amount: number) => Date;
5959
- /** Subtracts a specified number of years from a date */
5960
- getSubYears: (date: Date, amount: number) => Date;
5961
- /** Adds a specified number of months to a date */
5962
- getAddMonths: (date: Date, amount: number) => Date;
5963
- /** Adds a specified number of days to a date */
5964
- getAddDays: (date: Date, amount: number) => Date;
5965
- /** Adds a specified number of years to a date */
5966
- getAddYears: (date: Date, years: number) => Date;
5967
- /**
5968
- * Gets all month names in the specified format and locale.
5969
- * @param monthFormat - Format for month names ('long', 'short', 'narrow')
5970
- * @param locale - Optional locale string
5971
- * @returns Array of month names
5972
- */
5973
- getAllMonthName: (monthFormat: Intl.DateTimeFormatOptions['month'], locale?: string) => Array<string>;
5974
- /**
5975
- * Gets all weekday names in the specified format and locale.
5976
- * @param weekdayFormat - Format for weekday names ('long', 'short', 'narrow')
5977
- * @param isSundayFirst - Whether Sunday should be the first day of the week
5978
- * @param locale - Optional locale string
5979
- * @returns Array of weekday names
5980
- */
5981
- getAllWeekdayName: (weekdayFormat: Intl.DateTimeFormatOptions['weekday'], isSundayFirst: boolean, locale?: string) => Array<string>;
5982
- /** Checks if the first date is before the second date */
5983
- isBefore: (date1: Date, date2: Date) => boolean;
5984
- /** Checks if the first date is after the second date */
5985
- isAfter: (date1: Date, date2: Date) => boolean;
5986
- /**
5987
- * Checks if two dates are equal.
5988
- * @param firstDate - First date to compare
5989
- * @param secondDate - Second date to compare
5990
- * @param shouldCompareTime - Whether to include time in comparison
5991
- * @returns True if dates are equal
5992
- */
5993
- isDatesEqual: (firstDate: Date | number | string, secondDate: Date | number | string, shouldCompareTime: boolean) => boolean;
5994
- };
5650
+ dateHelpers: dateHelpers;
5995
5651
  }
5996
5652
 
5997
5653
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kubit-ui-web/react-components",
3
- "version": "2.0.0-beta.55",
3
+ "version": "2.0.0-beta.57",
4
4
  "description": "Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience",
5
5
  "author": {
6
6
  "name": "Kubit",
@@ -138,8 +138,8 @@
138
138
  }
139
139
  },
140
140
  "peerDependencies": {
141
- "react": ">=17.0.0 || >=18.3.1",
142
- "react-dom": ">=17.0.0 || >=18.3.1"
141
+ "react": "^18.3.0 || ^19.0.0",
142
+ "react-dom": "^18.3.0 || ^19.0.0"
143
143
  },
144
144
  "dependencies": {
145
145
  "@floating-ui/dom": "^1.7.5"
@@ -151,8 +151,8 @@
151
151
  "@testing-library/user-event": "^14.6.1",
152
152
  "@trivago/prettier-plugin-sort-imports": "^6.0.2",
153
153
  "@types/node": "^25.2.3",
154
- "@types/react": "^18.3.12",
155
- "@types/react-dom": "^18.3.1",
154
+ "@types/react": "^19.2.14",
155
+ "@types/react-dom": "^19.2.3",
156
156
  "@types/testing-library__jest-dom": "^6.0.0",
157
157
  "@vitejs/plugin-react": "^5.1.4",
158
158
  "@vitest/coverage-v8": "^4.0.18",
@@ -164,15 +164,15 @@
164
164
  "html-validate": "^10.7.0",
165
165
  "jsdom": "^28.0.0",
166
166
  "prettier": "^3.8.1",
167
- "react": "18.3.1",
168
- "react-dom": "18.3.1",
167
+ "react": "^19.2.4",
168
+ "react-dom": "^19.2.4",
169
169
  "typescript": "^5.9.3",
170
170
  "typescript-eslint": "^8.55.0",
171
171
  "vite": "8.0.0-beta.10",
172
172
  "vite-plugin-dts": "^4.5.4",
173
173
  "vitest": "^4.0.18",
174
174
  "vitest-axe": "^0.1.0",
175
- "@kubit-ui-web/design-system": "2.0.0-beta.14"
175
+ "@kubit-ui-web/design-system": "2.0.0-beta.16"
176
176
  },
177
177
  "publishConfig": {
178
178
  "access": "public",