najwer23morsels 0.6.1 → 0.7.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # najwer23morsels
 
+## 0.7.1
+
+### Patch Changes
+
+- Slider swipe events on mobile
+
+## 0.7.0
+
+### Minor Changes
+
+- Button
+
 ## 0.6.0
 
 ### Minor Changes

package/README.md

@@ -55,6 +55,10 @@ export const Example = () => {
     --najwer23morselsSliderArrowsColorBackground: white;
     --najwer23morselsSliderArrowsColorBorder: black;
     --najwer23morselsSliderArrowsColor: black;
+
+    /* MorselsButton */
+    --najwer23morselsButtonBg: black;
+    --najwer23morselsButtonBgDisabled: black;
 }
 ```
 

package/lib/Button-BF9bCjkn.js

@@ -0,0 +1 @@
+import{jsxs as o,jsx as e}from"react/jsx-runtime";import{L as t}from"./Loader-Bp_QrPqC.js";import{s as n}from"./TextBox-DnwTtpP2.js";var r={najwer23morselsButtonContainer:"Button-module_najwer23morselsButtonContainer__Okjrw"};n('@layer najwer23morselsButton{.Button-module_najwer23morselsButtonContainer__Okjrw{--boxShadow:0 4px 8px 0 rgba(0,0,0,.24),0 6px 20px 0 rgba(0,0,0,.19);-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);background-color:var(--najwer23morselsButtonBg,var(--button-bg));border:unset;border-radius:8px;box-shadow:none;cursor:pointer;height:var(--button-height,auto);letter-spacing:normal;padding:var(--button-padding,10px 17px);position:relative;transition:background-color .3s,box-shadow .3s;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:var(--button-width,auto);>span{display:inline-block;position:relative;z-index:1}&:before{background-color:inherit;border-radius:8px;content:"";inset:0;pointer-events:none;position:absolute;transition:filter .3s;z-index:0}@media (hover:hover) and (pointer:fine){&:hover:before{filter:brightness(100%)}&:hover{box-shadow:var(--boxShadow)}}&:active:before{filter:brightness(.8)}&:active{box-shadow:var(--boxShadow)}&:focus-visible:before{filter:brightness(.8);outline:none}&:focus-visible{box-shadow:var(--boxShadow);outline:none}&:disabled{background-color:var(--najwer23morselsButtonBgDisabled,var(--button-bgDisabled));box-shadow:none;cursor:not-allowed}}}');const a=({children:n,className:a,backgroundColor:i,padding:s,loading:l,height:d,width:b,backgroundColorDisabled:u,...h})=>o("div",{className:["MorselsButtonWrapper",a].filter(Boolean).join(" "),children:[l&&e("div",{style:{width:b,height:d},children:e(t,{})}),!l&&e("button",{style:{...null!=s?{"--button-padding":s}:{},"--button-bg":i,"--button-height":d,"--button-width":b,"--button-bgDisabled":u},className:[r.najwer23morselsButtonContainer,"MorselsButton"].filter(Boolean).join(" "),...h,children:e("span",{children:n})})]});a.displayName="Button";export{a as B};

package/lib/Button.js

@@ -0,0 +1 @@
+export{B as Button}from"./Button-BF9bCjkn.js";import"react/jsx-runtime";import"./Loader-Bp_QrPqC.js";import"./TextBox-DnwTtpP2.js";

package/lib/Carousel.js

@@ -0,0 +1 @@
+import{jsx as r,jsxs as e}from"react/jsx-runtime";import{useRef as o,useState as t,useEffect as n}from"react";import{B as l}from"./Button-BF9bCjkn.js";import{s as a}from"./TextBox-DnwTtpP2.js";import{u as i}from"./useWindowSize-CAQRbyxi.js";import"./Loader-Bp_QrPqC.js";var s={carousel:"Carousel-module_carousel__Yo2oU",carouselWrapper:"Carousel-module_carouselWrapper__JQHy4",arrowLeft:"Carousel-module_arrowLeft__kk-Rx",arrowRight:"Carousel-module_arrowRight__Spznn",arrowShow:"Carousel-module_arrowShow__NqOi-",buttonArrowRight:"Carousel-module_buttonArrowRight__1-Cq0",buttonArrowLeft:"Carousel-module_buttonArrowLeft__EAxth"};a('@layer najwer23snacksCarouel{.Carousel-module_carousel__Yo2oU{-ms-overflow-style:none;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:nowrap;gap:var(--gap);overflow-x:scroll;scrollbar-width:none;will-change:scroll-position;&::-webkit-scrollbar{display:none}&>*{flex-shrink:0}}.Carousel-module_carouselWrapper__JQHy4{display:grid;position:relative}.Carousel-module_arrowLeft__kk-Rx{display:none;left:20px;position:absolute;top:calc(50% - 25px);@media (max-width:767.98px){display:none}}.Carousel-module_arrowRight__Spznn{display:none;position:absolute;right:20px;top:calc(50% - 25px);@media (max-width:767.98px){display:none}}.Carousel-module_arrowShow__NqOi-{display:block;@media (max-width:767.98px){display:none}}.Carousel-module_buttonArrowLeft__EAxth,.Carousel-module_buttonArrowRight__1-Cq0{height:15px;padding:5px 0;position:relative;transition:all .2s linear;width:15px}.Carousel-module_buttonArrowRight__1-Cq0:after{right:3px;transform:rotate(135deg)}.Carousel-module_buttonArrowLeft__EAxth:after,.Carousel-module_buttonArrowRight__1-Cq0:after{border-left:2px solid #fff;border-top:2px solid #fff;content:"";display:flex;height:15px;position:absolute;width:15px}.Carousel-module_buttonArrowLeft__EAxth:after{left:3px;transform:rotate(-45deg)}}');const u=({children:a,arrowLeftIcon:u,arrowRightIcon:c,gap:d="5px"})=>{const p=o(null),[f,h]=t(!1),[m,w]=t(!1),{width:_}=i(),x=o(!1),g=o(null),C=()=>{if(!p.current||!p.current.childNodes[1])return 0;const r=p.current.childNodes[1],e=getComputedStyle(r);return parseInt(e.marginLeft)+parseInt(e.marginRight)+r.offsetWidth+Number(d.slice(0,-2))};n(()=>{const r=setTimeout(()=>{v()},1);return()=>clearTimeout(r)},[_]);const L=()=>{x.current=!0,g.current&&clearTimeout(g.current),g.current=window.setTimeout(()=>{x.current=!1},150)},v=()=>{if(!p.current)return;L();const r=p.current.scrollLeft,e=p.current.scrollWidth-p.current.clientWidth;r<=0?(h(!1),w(0!==e)):r>=e?(h(!0),w(!1)):(h(!0),w(!0))},b=(r,e,o=400,t=!1)=>{if(x.current&&!t)return r.scrollLeft=e,void v();const n=r.scrollLeft,l=e-n,a=performance.now(),i=s=>{if(x.current&&!t)return r.scrollLeft=e,void v();const u=s-a,c=Math.min(u/o,1);var d;r.scrollLeft=n+l*((d=c)<.5?4*d*d*d:1-Math.pow(-2*d+2,3)/2),c<1?requestAnimationFrame(i):v()};requestAnimationFrame(i)},y=o({isDown:!1,startX:0,scrollLeft:0,isMove:!1}),A=()=>{y.current.isDown=!1};return r("div",{className:s.carouselWrapper,style:{"--gap":d},children:e("div",{className:s.carousel,ref:p,onClick:r=>{y.current.isMove&&(r.preventDefault(),r.stopPropagation())},onScroll:v,onMouseDown:r=>{y.current.isDown=!0,y.current.startX=r.pageX-(p.current?.offsetLeft||0),y.current.scrollLeft=p.current?.scrollLeft||0},onMouseLeave:A,onMouseUp:A,onMouseMove:r=>{if(!y.current.isDown)return void(y.current.isMove=!1);r.preventDefault(),L();var e;const o=1*(("pageX"in(e=r)?e.pageX:"touches"in e?e.touches[0].pageX:0)-(p.current?.offsetLeft||0)-y.current.startX);Math.abs(o)>5&&(y.current.isMove=!0),p.current&&(p.current.scrollLeft=y.current.scrollLeft-o)},onTouchMove:r=>{L()},children:[r("div",{className:[s.arrowLeft,f&&s.arrowShow].join(" "),children:r(l,{type:"button",onClick:()=>{if(!p.current)return;const r=C();if(0===r)return;const e=Math.floor(p.current.offsetWidth/r)*r,o=Math.max(p.current.scrollLeft-e,0);b(p.current,o,900,!0)},height:"40px",width:"40px",children:u||r("div",{className:[s.buttonArrowLeft].join(" ")})})}),a,r("div",{className:[s.arrowRight,m&&s.arrowShow].join(" "),children:r(l,{type:"button",onClick:()=>{if(!p.current)return;const r=C();if(0===r)return;const e=Math.floor(p.current.offsetWidth/r)*r,o=p.current.scrollWidth-p.current.clientWidth,t=Math.min(p.current.scrollLeft+e,o);b(p.current,t,900,!0)},height:"40px",width:"40px",children:c||r("div",{className:[s.buttonArrowRight].join(" ")})})})]})})};u.displayName="Carousel";export{u as Carousel};

package/lib/Grid.js

@@ -1 +1 @@
-import{jsxs as r,jsx as i}from"react/jsx-runtime";import{s as d}from"./TextBox-DnwTtpP2.js";import{L as o}from"./Loader-DpeUiZAb.js";var l={najwer23morselsGridContainer:"Grid-module_najwer23morselsGridContainer__eKjhq",najwer23morselsGridColumns:"Grid-module_najwer23morselsGridColumns__LCtFl"};d("@layer najwer23morselsGrid{.Grid-module_najwer23morselsGridContainer__eKjhq{box-sizing:border-box;margin:var(--grid-m);max-width:var(--grid-wMax);min-height:var(--grid-mh);min-width:var(--grid-wMin);padding:var(--grid-p)}.Grid-module_najwer23morselsGridColumns__LCtFl{column-gap:var(--grid-col-gap);display:flex;flex-wrap:wrap;row-gap:var(--grid-row-gap);width:100%}.Grid-module_najwer23morselsGridColumns__LCtFl>div{width:calc(100%/var( --gridFlexCol) - ((var(--gridFlexCol) - 1)/var(--gridFlexCol))*var(--grid-col-gap))}@media (max-width:767.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-mobile)}}@media (min-width:768px) and (max-width:1199.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-tablet)}}@media (min-width:1200px) and (max-width:1599.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-small-desktop)}}@media (min-width:1600px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-desktop)}}}");const e=({children:d,widthMin:e=0,widthMax:a=1920,padding:n="0",margin:m="auto",layout:s,gap:t,col:g,loading:p=!1,minHeight:w,className:x,...C})=>{if("container"===s)return r("div",{className:[l.najwer23morselsGridContainer,"MorselsGridContainer",x].filter(Boolean).join(" "),style:{"--grid-mh":`${w}px`,"--grid-wMin":`${e}px`,"--grid-wMax":`${a}px`,"--grid-p":n,"--grid-m":m},...C,children:[!p&&d,p&&i(o,{minHeight:w})]});if(!t||!g)throw new Error('When layout="columns", gap and col props are required');return i("div",{className:[l.najwer23morselsGridColumns,"MorselsGridColumns",x].filter(Boolean).join(" "),style:{"--grid-col-mobile":g.mobile.toString(),"--grid-col-tablet":g.tablet.toString(),"--grid-col-small-desktop":g.smallDesktop.toString(),"--grid-col-desktop":g.desktop.toString(),"--grid-col-gap":t.col,"--grid-row-gap":t.row},...C,children:d})};e.displayName="Grid";export{e as Grid};
+import{jsxs as r,jsx as i}from"react/jsx-runtime";import{s as d}from"./TextBox-DnwTtpP2.js";import{L as o}from"./Loader-Bp_QrPqC.js";var l={najwer23morselsGridContainer:"Grid-module_najwer23morselsGridContainer__eKjhq",najwer23morselsGridColumns:"Grid-module_najwer23morselsGridColumns__LCtFl"};d("@layer najwer23morselsGrid{.Grid-module_najwer23morselsGridContainer__eKjhq{box-sizing:border-box;margin:var(--grid-m);max-width:var(--grid-wMax);min-height:var(--grid-mh);min-width:var(--grid-wMin);padding:var(--grid-p)}.Grid-module_najwer23morselsGridColumns__LCtFl{column-gap:var(--grid-col-gap);display:flex;flex-wrap:wrap;row-gap:var(--grid-row-gap);width:100%}.Grid-module_najwer23morselsGridColumns__LCtFl>div{width:calc(100%/var(--gridFlexCol) - ((var(--gridFlexCol) - 1)/var(--gridFlexCol))*var(--grid-col-gap))}@media (max-width:767.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-mobile)}}@media (min-width:768px) and (max-width:1199.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-tablet)}}@media (min-width:1200px) and (max-width:1599.98px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-small-desktop)}}@media (min-width:1600px){.Grid-module_najwer23morselsGridColumns__LCtFl>div{--gridFlexCol:var(--grid-col-desktop)}}}");const e=({children:d,widthMin:e=0,widthMax:a=1920,padding:n="0",margin:m="auto",layout:s,gap:t,col:g,loading:p=!1,minHeight:w,className:x,...C})=>{if("container"===s)return r("div",{className:[l.najwer23morselsGridContainer,"MorselsGridContainer",x].filter(Boolean).join(" "),style:{"--grid-mh":`${w}px`,"--grid-wMin":`${e}px`,"--grid-wMax":`${a}px`,"--grid-p":n,"--grid-m":m},...C,children:[!p&&d,p&&i(o,{minHeight:w})]});if(!t||!g)throw new Error('When layout="columns", gap and col props are required');return i("div",{className:[l.najwer23morselsGridColumns,"MorselsGridColumns",x].filter(Boolean).join(" "),style:{"--grid-col-mobile":g.mobile.toString(),"--grid-col-tablet":g.tablet.toString(),"--grid-col-small-desktop":g.smallDesktop.toString(),"--grid-col-desktop":g.desktop.toString(),"--grid-col-gap":t.col,"--grid-row-gap":t.row},...C,children:d})};e.displayName="Grid";export{e as Grid};

package/lib/Hooks.js

@@ -0,0 +1 @@
+import{useRef as e,useEffect as t,useCallback as r,useState as i}from"react";export{u as useWindowSize}from"./useWindowSize-CAQRbyxi.js";const n=()=>{const i=e(!1);return t(()=>(i.current=!0,()=>{i.current=!1}),[]),r(()=>i.current,[])},o={width:void 0,height:void 0},c=r=>{const{ref:c,box:h="content-box"}=r,[{width:u,height:s},w]=i(o),x=n(),z=e({...o}),b=e(void 0);return b.current=r.onResize,t(()=>{if(!c.current)return;if("undefined"==typeof window||!("ResizeObserver"in window))return;const e=new ResizeObserver(([e])=>{const t="border-box"===h?"borderBoxSize":"device-pixel-content-box"===h?"devicePixelContentBoxSize":"contentBoxSize",r=d(e,t,"inlineSize"),i=d(e,t,"blockSize");if(z.current.width!==r||z.current.height!==i){const e={width:r,height:i};z.current.width=r,z.current.height=i,b.current?b.current(e):x()&&w(e)}});return e.observe(c.current,{box:h}),()=>{e.disconnect()}},[h,c,x]),{width:u,height:s}},d=(e,t,r)=>e[t]?Array.isArray(e[t])?e[t][0][r]:e[t][r]:"contentBoxSize"===t?e.contentRect["inlineSize"===r?"width":"height"]:void 0;export{n as useIsMounted,c as useResizeObserver};

package/lib/Loader-Bp_QrPqC.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{s as r,T as o}from"./TextBox-DnwTtpP2.js";var a={najwer23morselsContainer:"Loader-module_najwer23morselsContainer__TUBxr"};r("@layer najwer23morselsLoader{.Loader-module_najwer23morselsContainer__TUBxr{align-items:center;border:1px dashed var(--najwer23morselsTextBoxColor,var(--loader-lc,#000));box-sizing:border-box;color:var(--najwer23morselsTextBoxColor,var(--loader-lc,#000));display:flex;height:var(--loader-mh,100%);justify-content:center;width:100%}}");const l=({minHeight:r,className:l,loaderColor:s})=>e("div",{className:[a.najwer23morselsContainer,"MorselsLoader",l].filter(Boolean).join(" "),style:{"--loader-lc":s,...null!=r?{"--loader-mh":`${r}px`}:{}},children:e(o,{mobileSize:16,desktopSize:16,color:s,children:"Loading..."})});l.displayName="Loader";export{l as L};

package/lib/Loader.js

@@ -1 +1 @@
-export{L as Loader}from"./Loader-DpeUiZAb.js";import"react/jsx-runtime";import"./TextBox-DnwTtpP2.js";
+export{L as Loader}from"./Loader-Bp_QrPqC.js";import"react/jsx-runtime";import"./TextBox-DnwTtpP2.js";

package/lib/Slider.js

@@ -1 +1 @@
-import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import l,{useState as t,useRef as o,useEffect as i,useCallback as s}from"react";import{s as a,T as d}from"./TextBox-DnwTtpP2.js";import{L as c}from"./Loader-DpeUiZAb.js";var m={najwer23morselsSliderContainer:"Slider-module_najwer23morselsSliderContainer__1SbJN",najwer23morselsSliderContainerSlider:"Slider-module_najwer23morselsSliderContainerSlider__7ONky",najwer23morselsSlideWrapper:"Slider-module_najwer23morselsSlideWrapper__veeuJ",najwer23morselsSlide:"Slider-module_najwer23morselsSlide__KHKZW",najwer23morselsBtnControl:"Slider-module_najwer23morselsBtnControl__RHrxn",najwer23morselsBtn:"Slider-module_najwer23morselsBtn__10p8D",najwer23morselsSliderCounter:"Slider-module_najwer23morselsSliderCounter__56f5P"};a("@layer najwer23morselsSlider{.Slider-module_najwer23morselsSliderContainer__1SbJN{width:100%}.Slider-module_najwer23morselsSliderContainerSlider__7ONky{display:flex;flex-direction:column;gap:10px;height:100%;position:relative;user-select:none;width:100%}.Slider-module_najwer23morselsSlideWrapper__veeuJ{height:100%;overflow:hidden;position:relative;width:100%;will-change:transform}.Slider-module_najwer23morselsSlide__KHKZW{height:100%;overflow:hidden;position:absolute;top:0;will-change:transform;&>*{height:100%;width:100%}}.Slider-module_najwer23morselsBtnControl__RHrxn{align-items:center;display:flex;height:100%;left:0;opacity:0;padding:0 25px;pointer-events:none;position:absolute;right:0;transition:all .2s linear;z-index:100}.Slider-module_najwer23morselsSliderContainer__1SbJN:hover .Slider-module_najwer23morselsBtnControl__RHrxn{opacity:1;pointer-events:auto}.Slider-module_najwer23morselsBtn__10p8D{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);background-color:var(--najwer23morselsSliderArrowsColorBackground,var(--slider-acbg,#fff));border:1px solid var(--najwer23morselsSliderArrowsColorBorder,var(--slider-acb,#000));border-radius:50%;color:var(--najwer23morselsSliderArrowsColor,var(--slider-ac,#000));cursor:pointer;display:flex;left:50%;padding:10px;pointer-events:auto;transition:all .2s linear;transition:background-color .3s,box-shadow .3s;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;@media (hover:hover) and (pointer:fine){&:hover{box-shadow:0 4px 8px 0 rgba(0,0,0,.24),0 6px 20px 0 rgba(0,0,0,.19);filter:brightness(.95)}}}.Slider-module_najwer23morselsSliderCounter__56f5P{align-items:center;display:flex;height:35px;justify-content:center}}");const u=(e,r,n=!1)=>(n?e.slice(0,r):e.slice(-r)).map((e,r)=>l.cloneElement(e,{key:`${n?"clone-first":"clone-last"}-${r}`,className:e.props.className})),h=({isCircular:a=!1,children:h,className:w,arrowsColor:p,arrowsColorBackground:g,arrowsColorBorder:S,showCounter:f=!0,loading:v=!1,loaderColor:_="black"})=>{const j=l.Children.toArray(h).filter(l.isValidElement),[C,x]=t(a&&j.length>=2?2:0),[b,y]=t(!1),[N,k]=t(0),[B,E]=t(0),L=o(null),T=o([]),z=o(null),W=a&&j.length>=2?[...u(j,2,!1),...j.map((e,r)=>l.cloneElement(e,{key:e.key??r,className:e.props.className})),...u(j,2,!0)]:j.map((e,r)=>l.cloneElement(e,{key:e.key??r,className:e.props.className}));T.current.length!==W.length&&(T.current=Array(W.length).fill(null)),i(()=>{x(a&&j.length>=2?2:0)},[a,j.length,v]);const M=s(()=>{const e=L.current;if(!e)return;const r=T.current[0];if(!r)return;const n=window.getComputedStyle(r);k(r.offsetWidth+parseFloat(n.marginLeft)+parseFloat(n.marginRight)),E(e.offsetWidth)},[]);i(()=>{M();const e=()=>{null!==z.current&&clearTimeout(z.current),z.current=window.setTimeout(()=>{M(),y(!0)},150)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e),null!==z.current&&clearTimeout(z.current)}},[M,v]),i(()=>{const e=N+10;T.current.forEach((r,n)=>{if(!r)return;const l=(n-C)*e+(B-N)/2;r.style.transition=b?"transform 0.4s cubic-bezier(.4,0,.2,1)":"none",r.style.transform=`translateX(${l}px)`,r.style.left=""})},[C,N,B,b,W.length,a,v]),i(()=>{if(!b||!a)return;const e=T.current.length,r=T.current[e-1];if(!r)return;let n;const l=()=>{let t=C;1===C?t=e-3:C===e-2&&(t=2),t!==C&&x(t),y(!1),r.removeEventListener("transitionend",l),clearTimeout(n)};return r.addEventListener("transitionend",l),n=window.setTimeout(()=>{y(!1),r.removeEventListener("transitionend",l)},500),()=>{r.removeEventListener("transitionend",l),clearTimeout(n)}},[C,a,b,v]),i(()=>{if(!b)return;const e=T.current[0];if(!e)return;let r;const n=()=>{y(!1),e.removeEventListener("transitionend",n),clearTimeout(r)};return e.addEventListener("transitionend",n),r=window.setTimeout(()=>{y(!1),e.removeEventListener("transitionend",n)},500),()=>{e.removeEventListener("transitionend",n),clearTimeout(r)}},[b,v]);return e("div",{className:[m.najwer23morselsSliderContainer,"MorselsSlider",w].filter(Boolean).join(" "),style:{height:v?"calc(100% - 2px)":f?"calc(100% - 35px)":"100%"},children:[v&&r(c,{loaderColor:_}),!v&&e(n,{children:[e("div",{className:[m.najwer23morselsSliderContainerSlider].filter(Boolean).join(" "),style:{"--slider-ac":p,"--slider-acbg":g,"--slider-acb":S},children:[e("div",{className:[m.najwer23morselsBtnControl,"MorselsSliderControl",w].join(" "),style:{justifyContent:a?"space-between":0===C?"flex-end":C===j.length-1?"flex-start":"space-between"},children:[(a&&j.length>1||0!==C)&&r("button",{title:"Prev",className:m.najwer23morselsBtn,onClick:()=>{b||(y(!0),x(a?e=>e-1:e=>Math.max(e-1,0)))},disabled:b,children:r("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 320 512",width:"24",height:"24",fill:"currentColor",children:r("path",{d:"M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"})})}),(a&&j.length>1||C!==j.length-1)&&r("button",{title:"Next",className:m.najwer23morselsBtn,onClick:()=>{b||(y(!0),x(a?e=>e+1:e=>Math.min(e+1,W.length-1)))},disabled:b,children:r("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 320 512",width:"24",height:"24",fill:"currentColor",children:r("path",{d:"M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z"})})})]}),r("div",{className:[m.najwer23morselsSlideWrapper,"MorselsSliderWrapper",w].join(" "),ref:L,children:W.map((e,n)=>r("div",{ref:e=>{T.current[n]=e},className:`${m.najwer23morselsSlide}`,style:{width:j.length>1?"calc(100% - 40px)":"100%"},"aria-hidden":C!==n,children:e},e.key??n))})]}),f&&r("div",{className:[m.najwer23morselsSliderCounter,"MorselsSliderCounter",w].join(" "),children:r(d,{mobileSize:16,desktopSize:16,color:"black",children:a?`${(()=>{if(!a)return C;const e=j.length;return e<1?0:(C-2+e)%e})()+1} / ${j.length}`:`${C+1} / ${j.length}`})})]})]})};h.displayName="Slider";export{h as Slider};
+import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import l,{useState as t,useRef as o,useEffect as i,useCallback as s}from"react";import{s as a,T as d}from"./TextBox-DnwTtpP2.js";import{L as c}from"./Loader-Bp_QrPqC.js";var m={najwer23morselsSliderContainer:"Slider-module_najwer23morselsSliderContainer__1SbJN",najwer23morselsSliderContainerSlider:"Slider-module_najwer23morselsSliderContainerSlider__7ONky",najwer23morselsSlideWrapper:"Slider-module_najwer23morselsSlideWrapper__veeuJ",najwer23morselsSlide:"Slider-module_najwer23morselsSlide__KHKZW",najwer23morselsBtnControl:"Slider-module_najwer23morselsBtnControl__RHrxn",najwer23morselsBtn:"Slider-module_najwer23morselsBtn__10p8D",najwer23morselsSliderCounter:"Slider-module_najwer23morselsSliderCounter__56f5P"};a("@layer najwer23morselsSlider{.Slider-module_najwer23morselsSliderContainer__1SbJN{width:100%}.Slider-module_najwer23morselsSliderContainerSlider__7ONky{display:flex;flex-direction:column;gap:10px;height:100%;position:relative;user-select:none;width:100%}.Slider-module_najwer23morselsSlideWrapper__veeuJ{height:100%;overflow:hidden;position:relative;width:100%;will-change:transform}.Slider-module_najwer23morselsSlide__KHKZW{height:100%;overflow:hidden;position:absolute;top:0;will-change:transform;&>*{height:100%;width:100%}}.Slider-module_najwer23morselsBtnControl__RHrxn{align-items:center;display:flex;height:100%;left:0;opacity:0;padding:0 25px;pointer-events:none;position:absolute;right:0;transition:all .2s linear;z-index:100;@media (max-width:767.98px){display:none}}.Slider-module_najwer23morselsSliderContainer__1SbJN:hover .Slider-module_najwer23morselsBtnControl__RHrxn{opacity:1;pointer-events:auto}.Slider-module_najwer23morselsBtn__10p8D{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);background-color:var(--najwer23morselsSliderArrowsColorBackground,var(--slider-acbg,#fff));border:1px solid var(--najwer23morselsSliderArrowsColorBorder,var(--slider-acb,#000));border-radius:50%;color:var(--najwer23morselsSliderArrowsColor,var(--slider-ac,#000));cursor:pointer;display:flex;left:50%;padding:10px;pointer-events:auto;transition:all .2s linear;transition:background-color .3s,box-shadow .3s;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;@media (hover:hover) and (pointer:fine){&:hover{box-shadow:0 4px 8px 0 rgba(0,0,0,.24),0 6px 20px 0 rgba(0,0,0,.19);filter:brightness(.95)}}}.Slider-module_najwer23morselsSliderCounter__56f5P{align-items:center;display:flex;height:35px;justify-content:center}}");const u=(e,r,n=!1)=>(n?e.slice(0,r):e.slice(-r)).map((e,r)=>l.cloneElement(e,{key:`${n?"clone-first":"clone-last"}-${r}`,className:e.props.className})),h=({isCircular:a=!1,children:h,className:w,arrowsColor:p,arrowsColorBackground:g,arrowsColorBorder:S,showCounter:f=!0,loading:v=!1,loaderColor:_="black"})=>{const j=l.Children.toArray(h).filter(l.isValidElement),[x,C]=t(a&&j.length>=2?2:0),[b,y]=t(!1),[N,k]=t(0),[B,E]=t(0),L=o(null),T=o([]),z=o(null),[M,W]=t(null),[$,A]=t(0),H=a&&j.length>=2?[...u(j,2,!1),...j.map((e,r)=>l.cloneElement(e,{key:e.key??r,className:e.props.className})),...u(j,2,!0)]:j.map((e,r)=>l.cloneElement(e,{key:e.key??r,className:e.props.className}));T.current.length!==H.length&&(T.current=Array(H.length).fill(null)),i(()=>{C(a&&j.length>=2?2:0)},[a,j.length,v]);const J=s(()=>{const e=L.current;if(!e)return;const r=T.current[0];if(!r)return;const n=window.getComputedStyle(r);k(r.offsetWidth+parseFloat(n.marginLeft)+parseFloat(n.marginRight)),E(e.offsetWidth)},[]);i(()=>{J();const e=()=>{null!==z.current&&clearTimeout(z.current),z.current=window.setTimeout(()=>{J(),y(!0)},150)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e),null!==z.current&&clearTimeout(z.current)}},[J,v]),i(()=>{const e=N+10;T.current.forEach((r,n)=>{if(!r)return;const l=(n-x)*e+(B-N)/2;r.style.transition=b?"transform 0.4s cubic-bezier(.4,0,.2,1)":"none",r.style.transform=`translateX(${l}px)`,r.style.left=""})},[x,N,B,b,H.length,a,v]),i(()=>{if(!b||!a)return;const e=T.current.length,r=T.current[e-1];if(!r)return;let n;const l=()=>{let t=x;1===x?t=e-3:x===e-2&&(t=2),t!==x&&C(t),y(!1),r.removeEventListener("transitionend",l),clearTimeout(n)};return r.addEventListener("transitionend",l),n=window.setTimeout(()=>{y(!1),r.removeEventListener("transitionend",l)},500),()=>{r.removeEventListener("transitionend",l),clearTimeout(n)}},[x,a,b,v]),i(()=>{if(!b)return;const e=T.current[0];if(!e)return;let r;const n=()=>{y(!1),e.removeEventListener("transitionend",n),clearTimeout(r)};return e.addEventListener("transitionend",n),r=window.setTimeout(()=>{y(!1),e.removeEventListener("transitionend",n)},500),()=>{e.removeEventListener("transitionend",n),clearTimeout(r)}},[b,v]);const K=()=>{b||(y(!0),C(a?e=>e+1:e=>Math.min(e+1,H.length-1)))},R=()=>{b||(y(!0),C(a?e=>e-1:e=>Math.max(e-1,0)))};return e("div",{className:[m.najwer23morselsSliderContainer,"MorselsSlider",w].filter(Boolean).join(" "),style:{height:v?"calc(100% - 2px)":f?"calc(100% - 35px)":"100%"},onTouchStart:e=>{1===e.touches.length&&(W(e.touches[0].clientX),A(0))},onTouchMove:e=>{null!==M&&A(e.touches[0].clientX-M)},onTouchEnd:()=>{$>50?R():$<-50&&K(),W(null),A(0)},children:[v&&r(c,{loaderColor:_}),!v&&e(n,{children:[e("div",{className:[m.najwer23morselsSliderContainerSlider].filter(Boolean).join(" "),style:{"--slider-ac":p,"--slider-acbg":g,"--slider-acb":S},children:[e("div",{className:[m.najwer23morselsBtnControl,"MorselsSliderControl",w].join(" "),style:{justifyContent:a?"space-between":0===x?"flex-end":x===j.length-1?"flex-start":"space-between"},children:[(a&&j.length>1||0!==x)&&r("button",{title:"Prev",className:m.najwer23morselsBtn,onClick:R,disabled:b,children:r("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 320 512",width:"24",height:"24",fill:"currentColor",children:r("path",{d:"M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"})})}),(a&&j.length>1||x!==j.length-1)&&r("button",{title:"Next",className:m.najwer23morselsBtn,onClick:K,disabled:b,children:r("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 320 512",width:"24",height:"24",fill:"currentColor",children:r("path",{d:"M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z"})})})]}),r("div",{className:[m.najwer23morselsSlideWrapper,"MorselsSliderWrapper",w].join(" "),ref:L,children:H.map((e,n)=>r("div",{ref:e=>{T.current[n]=e},className:`${m.najwer23morselsSlide}`,style:{width:j.length>1?"calc(100% - 40px)":"100%"},"aria-hidden":x!==n,children:e},e.key??n))})]}),f&&r("div",{className:[m.najwer23morselsSliderCounter,"MorselsSliderCounter",w].join(" "),children:r(d,{mobileSize:16,desktopSize:16,color:"black",children:a?`${(()=>{if(!a)return x;const e=j.length;return e<1?0:(x-2+e)%e})()+1} / ${j.length}`:`${x+1} / ${j.length}`})})]})]})};h.displayName="Slider";export{h as Slider};

package/lib/button/Button.d.ts

@@ -0,0 +1,11 @@
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    children?: React.ReactNode;
+    backgroundColor?: string;
+    padding?: string | 0;
+    height: string;
+    width: string;
+    loading?: boolean;
+    backgroundColorDisabled?: string;
+}
+export declare const Button: React.FC<ButtonProps>;
+export {};

package/lib/button/index.d.ts

@@ -0,0 +1,2 @@
+import { Button } from './Button';
+export { Button };

package/lib/carousel/Carousel.d.ts

@@ -0,0 +1,6 @@
+export declare const Carousel: React.FC<{
+    children: React.ReactNode;
+    arrowLeftIcon?: React.ReactNode;
+    arrowRightIcon?: React.ReactNode;
+    gap?: string;
+}>;

package/lib/carousel/index.d.ts

@@ -0,0 +1,2 @@
+import { Carousel } from './Carousel';
+export { Carousel };

package/lib/grid/Grid.d.ts

@@ -13,8 +13,8 @@ interface GridProps extends React.HTMLAttributes<HTMLDivElement> {
     children?: React.ReactNode;
     widthMin?: number;
     widthMax?: number;
-    padding?: string;
-    margin?: string;
+    padding?: string | 0;
+    margin?: string | 0;
     minHeight?: number;
     loading?: boolean;
     gap?: Gap;

package/lib/hooks/index.d.ts

@@ -0,0 +1,6 @@
+import { useIsMounted } from './useIsMounted';
+import { useResizeObserver } from './useResizeObserver';
+import { useWindowSize } from './useWindowSize';
+export { useWindowSize };
+export { useResizeObserver };
+export { useIsMounted };

package/lib/hooks/useIsMounted.d.ts

@@ -0,0 +1 @@
+export declare const useIsMounted: () => (() => boolean);

package/lib/hooks/useResizeObserver.d.ts

@@ -0,0 +1,12 @@
+import type { RefObject } from 'react';
+type Size = {
+    width: number | undefined;
+    height: number | undefined;
+};
+type UseResizeObserverOptions<T extends HTMLElement = HTMLElement> = {
+    ref: RefObject<T | null>;
+    onResize?: (size: Size) => void;
+    box?: 'border-box' | 'content-box' | 'device-pixel-content-box';
+};
+export declare const useResizeObserver: <T extends HTMLElement = HTMLElement>(options: UseResizeObserverOptions<T>) => Size;
+export {};

package/lib/hooks/useWindowSize.d.ts

@@ -0,0 +1,6 @@
+interface WindowSize {
+    width: number;
+    height: number;
+}
+export declare const useWindowSize: (delay?: number) => WindowSize;
+export {};

package/lib/useWindowSize-CAQRbyxi.js

@@ -0,0 +1 @@
+import{useState as i,useLayoutEffect as e}from"react";const n=(n=0)=>{const[t,w]=i({width:window.innerWidth,height:window.innerHeight});return e(()=>{let i=null;const e=()=>{0===n&&t.width!==window.innerWidth&&w({width:window.innerWidth,height:window.innerHeight}),0!==n&&(i&&clearTimeout(i),i=setTimeout(()=>{t.width!==window.innerWidth&&w({width:window.innerWidth,height:window.innerHeight})},n))};return window.addEventListener("resize",e),e(),()=>{window.removeEventListener("resize",e),i&&clearTimeout(i)}},[t,n]),t};export{n as u};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "najwer23morsels",
-  "version": "0.6.1",
+  "version": "0.7.1",
   "main": "./lib/index.js",
   "module": "./lib/index.mjs",
   "types": "./lib/index.d.ts",

package/lib/Loader-DpeUiZAb.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{s as r,T as o}from"./TextBox-DnwTtpP2.js";var a={najwer23morselsContainer:"Loader-module_najwer23morselsContainer__TUBxr"};r("@layer najwer23morselsLoader{.Loader-module_najwer23morselsContainer__TUBxr{border:1px dashed var(--najwer23morselsTextBoxColor,var(--loader-lc,#000));box-sizing:border-box;color:var(--najwer23morselsTextBoxColor,var(--loader-lc,#000));display:flex;height:var(--loader-mh,100%);justify-content:center;padding-top:20px;width:100%}}");const l=({minHeight:r,className:l,loaderColor:s})=>e("div",{className:[a.najwer23morselsContainer,"MorselsLoader",l].filter(Boolean).join(" "),style:{"--loader-lc":s,...null!=r?{"--loader-mh":`${r}px`}:{}},children:e(o,{mobileSize:16,desktopSize:16,color:s,children:"Loading..."})});l.displayName="Loader";export{l as L};