najwer23morsels 0.8.12 → 0.9.0
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 +6 -0
- package/README.md +1 -5
- package/lib/{Button-ClRkhVeI.js → Button-DP1hmI08.js} +1 -1
- package/lib/Button.js +1 -1
- package/lib/Grid.js +1 -1
- package/lib/{Loader-B_e1Rrr4.js → Loader-CL-mm0LT.js} +1 -1
- package/lib/Loader.js +1 -1
- package/lib/Slider.js +1 -1
- package/lib/Slidermulti.js +1 -1
- package/lib/Sliderscroll.js +1 -0
- package/lib/{TextBox-clfMTADi.js → TextBox-B47QWA9m.js} +1 -1
- package/lib/Textbox.js +1 -1
- package/lib/sliderscroll/SliderScroll.d.ts +9 -0
- package/lib/sliderscroll/index.d.ts +2 -0
- package/lib/textbox/TextBox.d.ts +2 -2
- package/package.json +1 -1
- package/lib/Carousel.js +0 -1
- package/lib/carousel/Carousel.d.ts +0 -6
- package/lib/carousel/index.d.ts +0 -2
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -1,8 +1,4 @@
|
|
|
1
|
-
The najwer23morsels npm package
|
|
2
|
-
|
|
3
|
-
This design system leverages native CSS features, primarily global CSS variables, to enable comprehensive customization of component styles. Instead of relying on external styling libraries, you can override these CSS variables or add your own CSS rules to control the look and feel. This approach ensures that styling remains straightforward, maintainable, and fully compatible with standard web technologies.
|
|
4
|
-
|
|
5
|
-
By following native CSS conventions, the package provides a flexible and efficient way to adapt the design system to different branding requirements or design preferences while keeping the styling logic clear and easy to manage. Using React props for styling alongside CSS variable overrides offers a powerful combination for both dynamic and static style customization.
|
|
1
|
+
The najwer23morsels npm package provides React UI components with flexible styling via configurable props and custom CSS classes. It uses native CSS features, mainly global CSS variables, allowing easy customization without external libraries. This approach ensures maintainable, clear styling that adapts efficiently to different branding and design needs.
|
|
6
2
|
|
|
7
3
|
# najwer23morsels
|
|
8
4
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as o,jsx as t}from"react/jsx-runtime";import{L as n}from"./Loader-
|
|
1
|
+
import{jsxs as o,jsx as t}from"react/jsx-runtime";import{L as n}from"./Loader-CL-mm0LT.js";import{s as e}from"./style-inject.es-BnTDb6vU.js";var r={n23mButtonButton:"Button-module_n23mButtonButton__IfHY-"};e('@layer n23mButton{.Button-module_n23mButtonButton__IfHY-{--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(--n23mButtonBg,var(--button-bg));border:1px solid var(--n23mButtonBorderColor,var(--button-borderColor,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(--n23mButtonBgDisabled,var(--button-bgDisabled));box-shadow:none;cursor:not-allowed}}}');const i=({children:e,className:i,backgroundColor:a,padding:s,loading:l,height:d,width:b,borderColor:u,backgroundColorDisabled:h,...c})=>o("div",{className:["n23mButton",i].filter(Boolean).join(" "),children:[l&&t("div",{style:{width:b,height:d},children:t(n,{})}),!l&&t("button",{style:{...null!=s?{"--button-padding":s}:{},"--button-bg":a,"--button-height":d,"--button-width":b,"--button-bgDisabled":h,"--button-borderColor":u},className:[r.n23mButtonButton,"n23mButtonButton"].filter(Boolean).join(" "),...c,children:t("span",{children:e})})]});i.displayName="Button";export{i as B};
|
package/lib/Button.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{B as Button}from"./Button-
|
|
1
|
+
export{B as Button}from"./Button-DP1hmI08.js";import"react/jsx-runtime";import"./Loader-CL-mm0LT.js";import"./TextBox-B47QWA9m.js";import"./style-inject.es-BnTDb6vU.js";
|
package/lib/Grid.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as i,jsx as r}from"react/jsx-runtime";import{s as d}from"./style-inject.es-BnTDb6vU.js";import{L as o}from"./Loader-
|
|
1
|
+
import{jsxs as i,jsx as r}from"react/jsx-runtime";import{s as d}from"./style-inject.es-BnTDb6vU.js";import{L as o}from"./Loader-CL-mm0LT.js";import"./TextBox-B47QWA9m.js";var a={n23mGridContainer:"Grid-module_n23mGridContainer__G1O3I",n23mGridColumns:"Grid-module_n23mGridColumns__oyScE"};d("@layer n23mGrid{.Grid-module_n23mGridContainer__G1O3I{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_n23mGridColumns__oyScE{column-gap:var(--grid-col-gap);display:flex;flex-wrap:wrap;row-gap:var(--grid-row-gap);width:100%}.Grid-module_n23mGridColumns__oyScE>div{width:calc(100%/var(--gfc) - ((var(--gfc) - 1)/var(--gfc))*var(--grid-col-gap))}@media (max-width:767.98px){.Grid-module_n23mGridColumns__oyScE>div{--gfc:var(--grid-col-mobile)}}@media (min-width:768px) and (max-width:1199.98px){.Grid-module_n23mGridColumns__oyScE>div{--gfc:var(--grid-col-tablet)}}@media (min-width:1200px) and (max-width:1599.98px){.Grid-module_n23mGridColumns__oyScE>div{--gfc:var(--grid-col-small-desktop)}}@media (min-width:1600px){.Grid-module_n23mGridColumns__oyScE>div{--gfc:var(--grid-col-desktop)}}}");const n=({children:d,widthMin:n=0,widthMax:m=1920,padding:l="0",margin:e="auto",layout:t,gap:g,col:c,loading:s=!1,minHeight:p,className:u,...G})=>{if("container"===t)return i("div",{className:[a.n23mGridContainer,"n23mGridContainer",u].filter(Boolean).join(" "),style:{"--grid-mh":`${p}px`,"--grid-wMin":`${n}px`,"--grid-wMax":`${m}px`,"--grid-p":l,"--grid-m":e},...G,children:[!s&&d,s&&r(o,{minHeight:p})]});if(!g||!c)throw new Error('When layout="columns", gap and col props are required');return r("div",{className:[a.n23mGridColumns,"n23mGridColumns",u].filter(Boolean).join(" "),style:{"--grid-col-mobile":c.mobile.toString(),"--grid-col-tablet":c.tablet.toString(),"--grid-col-small-desktop":c.smallDesktop.toString(),"--grid-col-desktop":c.desktop.toString(),"--grid-col-gap":g.col,"--grid-row-gap":g.row},...G,children:d})};n.displayName="Grid";export{n as Grid};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import{T as o}from"./TextBox-
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import{T as o}from"./TextBox-B47QWA9m.js";import{s as r}from"./style-inject.es-BnTDb6vU.js";var a={n23mLoader:"Loader-module_n23mLoader__stRd6"};r("@layer n23mLoader{.Loader-module_n23mLoader__stRd6{align-items:center;border:1px dashed var(--n23mTextBoxColor,var(--loader-lc,#000));box-sizing:border-box;color:var(--n23mTextBoxColor,var(--loader-lc,#000));display:flex;height:var(--loader-mh,100%);justify-content:center;width:100%}}");const l=({minHeight:r,className:l,loaderColor:d})=>e("div",{className:[a.n23mLoader,"n23mLoader",l].filter(Boolean).join(" "),style:{"--loader-lc":d,...null!=r?{"--loader-mh":`${r}px`}:{}},children:e(o,{mobileSize:16,desktopSize:16,color:d,children:"Loading..."})});l.displayName="Loader";export{l as L};
|
package/lib/Loader.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{L as Loader}from"./Loader-
|
|
1
|
+
export{L as Loader}from"./Loader-CL-mm0LT.js";import"react/jsx-runtime";import"./TextBox-B47QWA9m.js";import"./style-inject.es-BnTDb6vU.js";
|
package/lib/Slider.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import t,{useState as l,useRef as i,useEffect as o,useCallback as d,useLayoutEffect as s}from"react";import{s as a}from"./style-inject.es-BnTDb6vU.js";import{T as m}from"./TextBox-
|
|
1
|
+
import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import t,{useState as l,useRef as i,useEffect as o,useCallback as d,useLayoutEffect as s}from"react";import{s as a}from"./style-inject.es-BnTDb6vU.js";import{T as m}from"./TextBox-B47QWA9m.js";import{L as c}from"./Loader-CL-mm0LT.js";import{a as u,I as h}from"./IconArrowRight-Bs6HQ5lc.js";import{B as S}from"./Button-DP1hmI08.js";var p={n23mSliderContainerSlider:"Slider-module_n23mSliderContainerSlider__-1M4s",n23mSliderSlideWrapper:"Slider-module_n23mSliderSlideWrapper__hbDsw",n23mSliderSlide:"Slider-module_n23mSliderSlide__Hv6uj",n23mSliderControls:"Slider-module_n23mSliderControls__DLrdZ",n23mSliderControlsButtons:"Slider-module_n23mSliderControlsButtons__C1ypH",n23mSliderCounter:"Slider-module_n23mSliderCounter__UJLZw"};a("@layer n23mSlider{.Slider-module_n23mSliderContainer__Hx9qh{width:100%}.Slider-module_n23mSliderContainerSlider__-1M4s{display:flex;flex-direction:column;gap:10px;height:100%;position:relative;user-select:none;width:100%}.Slider-module_n23mSliderSlideWrapper__hbDsw{height:100%;overflow:hidden;position:relative;width:100%;will-change:transform}.Slider-module_n23mSliderSlide__Hv6uj{height:100%;overflow:hidden;position:absolute;top:0;will-change:transform;&>*{height:100%;width:100%}}.Slider-module_n23mSliderControls__DLrdZ{align-items:center;display:flex;justify-content:space-between;margin-left:20px;margin-right:20px}.Slider-module_n23mSliderControlsButtons__C1ypH{display:flex;gap:10px;margin-top:10px}.Slider-module_n23mSliderCounter__UJLZw{align-items:center;align-items:flex-start;display:flex;height:50px;justify-content:center}}");const g=(e,r,n=!1)=>(n?e.slice(0,r):e.slice(-r)).map((e,r)=>t.cloneElement(e,{key:`${n?"clone-first":"clone-last"}-${r}`,className:e.props.className})),f=({isCircular:a=!1,children:f,className:_,showControls:C=!0,loading:v=!1,loaderColor:w="black"})=>{const x=t.Children.toArray(f).filter(t.isValidElement),[y,b]=l(a&&x.length>=2?2:0),[E,j]=l(!1),[k,L]=l(0),[N,F]=l(0),T=i(null),B=i([]),$=i(null),[W,D]=l(null),[z,H]=l(0),M=a&&x.length>=2?[...g(x,2,!1),...x.map((e,r)=>t.cloneElement(e,{key:e.key??r,className:e.props.className})),...g(x,2,!0)]:x.map((e,r)=>t.cloneElement(e,{key:e.key??r,className:e.props.className}));B.current.length!==M.length&&(B.current=Array(M.length).fill(null)),o(()=>{b(a&&x.length>=2?2:0)},[a,x.length,v]);const Z=d(()=>{const e=T.current;if(!e)return;const r=B.current[0];if(!r)return;const n=window.getComputedStyle(r);L(r.offsetWidth+parseFloat(n.marginLeft)+parseFloat(n.marginRight)),F(e.offsetWidth)},[]);s(()=>{Z();const e=()=>{null!==$.current&&clearTimeout($.current),$.current=window.setTimeout(()=>{Z(),j(!0)},150)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e),null!==$.current&&clearTimeout($.current)}},[Z,v]),o(()=>{const e=k+10;B.current.forEach((r,n)=>{if(!r)return;const t=(n-y)*e+(N-k)/2;r.style.transition=E?"transform 0.4s cubic-bezier(.4,0,.2,1)":"none",r.style.transform=`translateX(${t}px)`,r.style.left=""})},[y,k,N,E,M.length,a,v]),o(()=>{if(!E||!a)return;const e=B.current.length,r=B.current[e-1];if(!r)return;let n;const t=()=>{let l=y;1===y?l=e-3:y===e-2&&(l=2),l!==y&&b(l),j(!1),r.removeEventListener("transitionend",t),clearTimeout(n)};return r.addEventListener("transitionend",t),n=window.setTimeout(()=>{j(!1),r.removeEventListener("transitionend",t)},500),()=>{r.removeEventListener("transitionend",t),clearTimeout(n)}},[y,a,E,v]),o(()=>{if(!E)return;const e=B.current[0];if(!e)return;let r;const n=()=>{j(!1),e.removeEventListener("transitionend",n),clearTimeout(r)};return e.addEventListener("transitionend",n),r=window.setTimeout(()=>{j(!1),e.removeEventListener("transitionend",n)},500),()=>{e.removeEventListener("transitionend",n),clearTimeout(r)}},[E,v]);const A=()=>{E||(j(!0),b(a?e=>e+1:e=>Math.min(e+1,M.length-1)))},X=()=>{E||(j(!0),b(a?e=>e-1:e=>Math.max(e-1,0)))};return e("div",{className:[p.n23mSlider,"n23mSlider",_].filter(Boolean).join(" "),style:{height:v?"calc(100% - 2px)":C&&x.length>1?"calc(100% - 60px)":"100%"},onTouchStart:e=>{1===e.touches.length&&(D(e.touches[0].clientX),H(0))},onTouchMove:e=>{null!==W&&H(e.touches[0].clientX-W)},onTouchEnd:()=>{z>50?X():z<-50&&A(),D(null),H(0)},children:[v&&r(c,{loaderColor:w}),!v&&e(n,{children:[r("div",{className:[p.n23mSliderContainerSlider,"n23mSliderContainerSlider"].filter(Boolean).join(" "),children:r("div",{className:[p.n23mSliderSlideWrapper,"n23mSliderSlideWrapper"].join(" "),ref:T,children:M.map((e,n)=>r("div",{ref:e=>{B.current[n]=e},className:`${p.n23mSliderSlide}`,style:{width:x.length>1?"calc(100% - 40px)":"100%"},"aria-hidden":y!==n,children:e},e.key??n))})}),C&&x.length>1&&e("div",{className:[p.n23mSliderControls,"n23mSliderControls"].join(" "),children:[r("div",{className:[p.n23mSliderCounter,"n23mSliderCounter"].join(" "),children:r(m,{mobileSize:16,desktopSize:16,color:"black",children:a?`${(()=>{if(!a)return y;const e=x.length;return e<1?0:(y-2+e)%e})()+1} / ${x.length}`:`${y+1} / ${x.length}`})}),e("div",{className:[p.n23mSliderControlsButtons,"n23mSliderControlsButtons"].join(" "),children:[r(S,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Prev",onClick:X,borderColor:"black",backgroundColorDisabled:"#F2F0EF",disabled:E||!a&&0===y,children:r(u,{width:24,height:24})}),r(S,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Next",borderColor:"black",backgroundColorDisabled:"#F2F0EF",onClick:A,disabled:E||!a&&y==x.length-1,children:r(h,{width:24,height:24})})]})]})]})]})};f.displayName="Slider";export{f as Slider};
|
package/lib/Slidermulti.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as l,Fragment as i}from"react/jsx-runtime";import r,{useState as t,useRef as n,useEffect as o}from"react";import{s as d}from"./style-inject.es-BnTDb6vU.js";import{L as s}from"./Loader-
|
|
1
|
+
import{jsxs as e,jsx as l,Fragment as i}from"react/jsx-runtime";import r,{useState as t,useRef as n,useEffect as o}from"react";import{s as d}from"./style-inject.es-BnTDb6vU.js";import{L as s}from"./Loader-CL-mm0LT.js";import{a,I as u}from"./IconArrowRight-Bs6HQ5lc.js";import{B as c}from"./Button-DP1hmI08.js";import"./TextBox-B47QWA9m.js";var h={n23mSliderMulti:"SliderMulti-module_n23mSliderMulti__hsL9a",n23mSliderMultiContainerSlider:"SliderMulti-module_n23mSliderMultiContainerSlider__iu4xy",n23mSliderMultiSlideWrapper:"SliderMulti-module_n23mSliderMultiSlideWrapper__KPiK1",n23mSliderMultiSlide:"SliderMulti-module_n23mSliderMultiSlide__NDrCj",n23mSliderMultiControls:"SliderMulti-module_n23mSliderMultiControls__54jy-",n23mSliderMultiControlsButtons:"SliderMulti-module_n23mSliderMultiControlsButtons__JqcZ5"};d("@layer n23mSliderMulti{.SliderMulti-module_n23mSliderMulti__hsL9a{width:100%}.SliderMulti-module_n23mSliderMultiContainerSlider__iu4xy{display:flex;flex-direction:column;gap:10px;height:100%;position:relative;user-select:none;width:100%}.SliderMulti-module_n23mSliderMultiSlideWrapper__KPiK1{height:100%;overflow:hidden;position:relative;width:100%;will-change:transform}.SliderMulti-module_n23mSliderMultiSlide__NDrCj{height:100%;overflow:hidden;position:absolute;top:0;will-change:transform;&>*{height:100%;width:100%}}.SliderMulti-module_n23mSliderMultiControls__54jy-{align-items:center;display:flex;justify-content:flex-end;margin-left:20px;margin-right:20px}.SliderMulti-module_n23mSliderMultiControlsButtons__JqcZ5{display:flex;gap:10px;margin-top:10px}}");const m=(e,l,i=!1,t)=>(i?e.slice(0,l):e.slice(-l)).map((e,l)=>r.cloneElement(e,{key:`${i?"clone-first":"clone-last"}-${l} ${t}`,className:e.props.className})),S=({isCircular:d=!1,children:S,className:p,showControls:g=!0,loading:M=!1,loaderColor:f="black",slidesPerView:_=4,slideSpacingPx:C=10,slidesToScroll:x=4})=>{const y=r.Children.toArray(S).filter(r.isValidElement),[v,w]=t(0),E=n(null);o(()=>{const e=()=>{E.current&&w(E.current.offsetWidth)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[M]);const j=_>0?(v-C*(_-1))/_:0;let b=d?[...m(y,r.Children.toArray(S).length,!1,1),...m(y,r.Children.toArray(S).length,!1,2),...y,...m(y,r.Children.toArray(S).length,!0,3),...m(y,r.Children.toArray(S).length,!0,4)]:y;const[N,F]=t(d?2*r.Children.toArray(S).length:0),[k,B]=t(!1),L=n([]),[A,T]=t(null),[$,W]=t(0);o(()=>{F(d?2*r.Children.toArray(S).length:0)},[d,_,y.length,M]);o(()=>{L.current.forEach((e,l)=>{if(!e)return;const i=(l-N)*(j+C)+(v-j*_-C*(_-1))/2;e.style.transition=k?"transform 0.4s cubic-bezier(.4,0,.2,1)":"none",e.style.transform=`translateX(${i}px)`,e.style.left=""})},[N,v,k,b.length,_,j,C,M]),o(()=>{if(!k)return;let e;const l=()=>{let i=N;N<_&&d?i=N+y.length:N>=y.length+_&&d&&(i=N-y.length),i!==N&&d&&F(i),B(!1),L.current.forEach(e=>{e&&e.removeEventListener("transitionend",l)}),clearTimeout(e)};return L.current.forEach(e=>{e&&e.addEventListener("transitionend",l)}),e=window.setTimeout(()=>{B(!1),L.current.forEach(e=>{e&&e.removeEventListener("transitionend",l)})},500),()=>{L.current.forEach(e=>{e&&e.removeEventListener("transitionend",l)}),clearTimeout(e)}},[N,d,k,y.length,_,b.length,M]);const P=()=>{k||(B(!0),F(e=>e+x))},D=()=>{k||(B(!0),F(e=>e-x))};return L.current.length!==b.length&&(L.current=Array(b.length).fill(null)),e("div",{className:[h.n23mSliderMulti,"n23mSliderMulti",p].filter(Boolean).join(" "),style:{height:M?"calc(100% - 2px)":g?"calc(100% - 60px)":"100%"},onTouchStart:e=>{1===e.touches.length&&(T(e.touches[0].clientX),W(0))},onTouchMove:e=>{null!==A&&W(e.touches[0].clientX-A)},onTouchEnd:()=>{$>50?D():$<-50&&P(),T(null),W(0)},children:[M&&l(s,{loaderColor:f}),!M&&e(i,{children:[l("div",{className:[h.n23mSliderMultiContainerSlider].filter(Boolean).join(" "),children:l("div",{className:[h.n23mSliderMultiSlideWrapper,"n23mSliderMultiSlideWrapper"].join(" "),ref:E,style:{display:"flex",gap:`${C}px`,overflow:"hidden",width:"100%"},children:b.map((e,i)=>l("div",{ref:e=>{L.current[i]=e},className:h.n23mSliderMultiSlide,style:{width:`${j}px`,flex:`0 0 ${j}px`},"aria-hidden":i<N||i>=N+_,children:e},e.key??i))})}),g&&l("div",{className:[h.n23mSliderMultiControls,"n23mSliderMultiControls"].join(" "),children:e("div",{className:[h.n23mSliderMultiControlsButtons,"n23mSliderMultiControlsButtons"].join(" "),children:[l(c,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Prev",onClick:D,borderColor:"black",backgroundColorDisabled:"#F2F0EF",disabled:k||!d&&0===N,children:l(a,{width:24,height:24})}),l(c,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Next",borderColor:"black",backgroundColorDisabled:"#F2F0EF",onClick:P,disabled:k||!d&&N+_>=y.length,children:l(u,{width:24,height:24})})]})})]})]})};S.displayName="Slider";export{S as SliderMulti};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsxs as r,jsx as e}from"react/jsx-runtime";import{useRef as l,useState as o,useEffect as t}from"react";import{B as n}from"./Button-DP1hmI08.js";import{s as i}from"./style-inject.es-BnTDb6vU.js";import{u as c}from"./useWindowSize-CAQRbyxi.js";import{a as s,I as d}from"./IconArrowRight-Bs6HQ5lc.js";import"./Loader-CL-mm0LT.js";import"./TextBox-B47QWA9m.js";var a={n23mSliderScroll:"SliderScroll-module_n23mSliderScroll__to3-Y",n23mSliderScrollTrack:"SliderScroll-module_n23mSliderScrollTrack__FcsTl",n23mSliderScrollControls:"SliderScroll-module_n23mSliderScrollControls__i64nM",n23mSliderScrollControlsButtons:"SliderScroll-module_n23mSliderScrollControlsButtons__W-5rb"};i("@layer n23mSliderScroll{.SliderScroll-module_n23mSliderScroll__to3-Y{display:grid;position:relative}.SliderScroll-module_n23mSliderScrollTrack__FcsTl{-ms-overflow-style:none;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:nowrap;gap:var(--sliderscroll-gap);overflow-x:scroll;scrollbar-width:none;will-change:scroll-position;&::-webkit-scrollbar{display:none}&>*{flex-shrink:0}}.SliderScroll-module_n23mSliderScrollControls__i64nM{align-items:center;display:flex;justify-content:flex-end;margin-left:20px;margin-right:20px}.SliderScroll-module_n23mSliderScrollControlsButtons__W-5rb{display:flex;gap:10px;margin-top:10px}}");const u=({children:i,className:u,gap:m="5px"})=>{const S=l(null),[f,p]=o(!1),[h,g]=o(!1),{width:v}=c(),w=l(!1),_=l(null),x=()=>{if(!S.current||!S.current.childNodes[1])return 0;const r=S.current.childNodes[1],e=getComputedStyle(r);return parseInt(e.marginLeft)+parseInt(e.marginRight)+r.offsetWidth+Number(m.slice(0,-2))};t(()=>{const r=setTimeout(()=>{C()},1);return()=>clearTimeout(r)},[v]);const b=()=>{w.current=!0,_.current&&clearTimeout(_.current),_.current=window.setTimeout(()=>{w.current=!1},150)},C=()=>{if(!S.current)return;b();const r=S.current.scrollLeft,e=S.current.scrollWidth-S.current.clientWidth;r<=0?(p(!1),g(0!==e)):r>=e?(p(!0),g(!1)):(p(!0),g(!0))},M=(r,e,l=400,o=!1)=>{if(w.current&&!o)return r.scrollLeft=e,void C();const t=r.scrollLeft,n=e-t,i=performance.now(),c=s=>{if(w.current&&!o)return r.scrollLeft=e,void C();const d=s-i,a=Math.min(d/l,1);var u;r.scrollLeft=t+n*((u=a)<.5?4*u*u*u:1-Math.pow(-2*u+2,3)/2),a<1?requestAnimationFrame(c):C()};requestAnimationFrame(c)},L=l({isDown:!1,startX:0,scrollLeft:0,isMove:!1}),k=()=>{L.current.isDown=!1};return r("div",{className:[a.n23mSliderScroll,"n23mSliderScroll",u].filter(Boolean).join(" "),style:{"--sliderscroll-gap":m},children:[e("div",{className:a.n23mSliderScrollTrack,ref:S,onClick:r=>{L.current.isMove&&(r.preventDefault(),r.stopPropagation())},onScroll:C,onMouseDown:r=>{L.current.isDown=!0,L.current.startX=r.pageX-(S.current?.offsetLeft||0),L.current.scrollLeft=S.current?.scrollLeft||0},onMouseLeave:k,onMouseUp:k,onMouseMove:r=>{if(!L.current.isDown)return void(L.current.isMove=!1);r.preventDefault(),b();var e;const l=1*(("pageX"in(e=r)?e.pageX:"touches"in e?e.touches[0].pageX:0)-(S.current?.offsetLeft||0)-L.current.startX);Math.abs(l)>5&&(L.current.isMove=!0),S.current&&(S.current.scrollLeft=L.current.scrollLeft-l)},onTouchMove:r=>{b()},children:i}),e("div",{className:[a.n23mSliderScrollControls,"n23mSliderScrollControls"].join(" "),children:r("div",{className:[a.n23mSliderScrollControlsButtons,"n23mSliderScrollControlsButtons"].join(" "),children:[e(n,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Prev",onClick:()=>{if(!S.current)return;const r=x();if(0===r)return;const e=Math.floor(S.current.offsetWidth/r)*r,l=Math.max(S.current.scrollLeft-e,0);M(S.current,l,900,!0)},borderColor:"black",backgroundColorDisabled:"#F2F0EF",disabled:!f,children:e(s,{width:24,height:24})}),e(n,{height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Next",borderColor:"black",backgroundColorDisabled:"#F2F0EF",onClick:()=>{if(!S.current)return;const r=x();if(0===r)return;const e=Math.floor(S.current.offsetWidth/r)*r,l=S.current.scrollWidth-S.current.clientWidth,o=Math.min(S.current.scrollLeft+e,l);M(S.current,o,900,!0)},disabled:!h,children:e(d,{width:24,height:24})})]})})]})};u.displayName="SliderScroll";export{u as SliderScroll};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{s as o}from"./style-inject.es-BnTDb6vU.js";var a={n23mTextBox:"TextBox-module_n23mTextBox__OqCdY"};o("@layer n23mTextBox{.TextBox-module_n23mTextBox__OqCdY{--mob:var(--textbox-ms);--des:var(--textbox-ds);--min:400;--max:1400;--tff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;--cmn:min(var(--mob),var(--des));--cmx:max(var(--mob),var(--des));--fss:var(--mob);--fes:var(--des);--sdf:calc(var(--fes) - var(--fss));--vpr:calc(var(--max) - var(--min));--slp:calc(var(--sdf)/var(--vpr));--int:calc(var(--fss) - var(--slp)*var(--min));color:var(--n23mTextBoxColor,var(--textbox-c));font-family:var(--n23mFontFamily,var(--tff));font-size:clamp(calc(var(--cmn)/16*1rem),calc(var(--slp)*100vw + var(--int)/16*1rem),calc(var(--cmx)/16*1rem));font-weight:var(--n23mTextBoxFontWeight,var(--textbox-fw));line-height:var(--n23mTextBoxLineHeight,var(--textbox-lh,1.42857));margin:var(--n23mTextBoxMargin,var(--textbox-m));& a{color:var(--n23mTextBoxColor,var(--textbox-c));font-weight:var(--n23mTextBoxFontWeight,var(--textbox-fw));text-decoration:unset;transition:
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{s as o}from"./style-inject.es-BnTDb6vU.js";var a={n23mTextBox:"TextBox-module_n23mTextBox__OqCdY"};o("@layer n23mTextBox{.TextBox-module_n23mTextBox__OqCdY{--mob:var(--textbox-ms);--des:var(--textbox-ds);--min:400;--max:1400;--tff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;--cmn:min(var(--mob),var(--des));--cmx:max(var(--mob),var(--des));--fss:var(--mob);--fes:var(--des);--sdf:calc(var(--fes) - var(--fss));--vpr:calc(var(--max) - var(--min));--slp:calc(var(--sdf)/var(--vpr));--int:calc(var(--fss) - var(--slp)*var(--min));color:var(--n23mTextBoxColor,var(--textbox-c));font-family:var(--n23mFontFamily,var(--tff));font-size:clamp(calc(var(--cmn)/16*1rem),calc(var(--slp)*100vw + var(--int)/16*1rem),calc(var(--cmx)/16*1rem));font-weight:var(--n23mTextBoxFontWeight,var(--textbox-fw));line-height:var(--n23mTextBoxLineHeight,var(--textbox-lh,1.42857));margin:var(--n23mTextBoxMargin,var(--textbox-m));& a{color:var(--n23mTextBoxColor,var(--textbox-c));font-weight:var(--n23mTextBoxFontWeight,var(--textbox-fw));text-decoration:unset;transition:all .15s ease-in-out;&:active,&:focus-visible,&:hover{color:var(--n23mTextBoxColorHover,var(--textbox-fw,var(--textbox-ch)));font-weight:var(--n23mTextBoxFontWeightHover,var(--textbox-fwh,var(--textbox-fw)));text-decoration:underline}}}}");const r=({tag:o="div",children:r,className:x,target:n,rel:i,mobileSize:m,desktopSize:v,lineHeight:l,color:s,href:c,colorHover:f,margin:b,fontWeight:h,fontWeightHover:d,...B})=>e(o,{style:{"--textbox-fw":h,"--textbox-fwh":d,"--textbox-ch":f,"--textbox-c":s,"--textbox-ms":m,"--textbox-ds":v,"--textbox-lh":l,...null!=b?{"--textbox-m":b}:{}},className:[a.n23mTextBox,"n23mTextBox",x].filter(Boolean).join(" "),...B,children:[c&&t("a",{className:"n23mTextBoxLink",href:c,target:n,rel:i,children:r}),!c&&r]});r.displayName="TextBox";export{r as T};
|
package/lib/Textbox.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{T as TextBox}from"./TextBox-
|
|
1
|
+
export{T as TextBox}from"./TextBox-B47QWA9m.js";import"react/jsx-runtime";import"./style-inject.es-BnTDb6vU.js";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
interface SliderScrollProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
arrowLeftIcon?: ReactNode;
|
|
5
|
+
arrowRightIcon?: ReactNode;
|
|
6
|
+
gap?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const SliderScroll: React.FC<SliderScrollProps>;
|
|
9
|
+
export {};
|
package/lib/textbox/TextBox.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export type TextBoxTag = 'h1' | 'h2' | 'h3' | 'p' | 'div';
|
|
2
|
-
interface TextBoxProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1
|
+
export type TextBoxTag = 'h1' | 'h2' | 'h3' | 'p' | 'div' | 'span' | 'a';
|
|
2
|
+
interface TextBoxProps extends React.HTMLAttributes<HTMLDivElement | HTMLAnchorElement> {
|
|
3
3
|
children: React.ReactNode;
|
|
4
4
|
tag?: TextBoxTag;
|
|
5
5
|
mobileSize: number;
|
package/package.json
CHANGED
package/lib/Carousel.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{jsx as r,jsxs as e}from"react/jsx-runtime";import{useRef as t,useState as o,useEffect as n}from"react";import{B as l}from"./Button-ClRkhVeI.js";import{s as a}from"./style-inject.es-BnTDb6vU.js";import{u as s}from"./useWindowSize-CAQRbyxi.js";import"./Loader-B_e1Rrr4.js";import"./TextBox-clfMTADi.js";var i={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:p="5px"})=>{const d=t(null),[f,h]=o(!1),[m,w]=o(!1),{width:_}=s(),x=t(!1),g=t(null),C=()=>{if(!d.current||!d.current.childNodes[1])return 0;const r=d.current.childNodes[1],e=getComputedStyle(r);return parseInt(e.marginLeft)+parseInt(e.marginRight)+r.offsetWidth+Number(p.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(!d.current)return;L();const r=d.current.scrollLeft,e=d.current.scrollWidth-d.current.clientWidth;r<=0?(h(!1),w(0!==e)):r>=e?(h(!0),w(!1)):(h(!0),w(!0))},b=(r,e,t=400,o=!1)=>{if(x.current&&!o)return r.scrollLeft=e,void v();const n=r.scrollLeft,l=e-n,a=performance.now(),s=i=>{if(x.current&&!o)return r.scrollLeft=e,void v();const u=i-a,c=Math.min(u/t,1);var p;r.scrollLeft=n+l*((p=c)<.5?4*p*p*p:1-Math.pow(-2*p+2,3)/2),c<1?requestAnimationFrame(s):v()};requestAnimationFrame(s)},y=t({isDown:!1,startX:0,scrollLeft:0,isMove:!1}),A=()=>{y.current.isDown=!1};return r("div",{className:i.carouselWrapper,style:{"--gap":p},children:e("div",{className:i.carousel,ref:d,onClick:r=>{y.current.isMove&&(r.preventDefault(),r.stopPropagation())},onScroll:v,onMouseDown:r=>{y.current.isDown=!0,y.current.startX=r.pageX-(d.current?.offsetLeft||0),y.current.scrollLeft=d.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 t=1*(("pageX"in(e=r)?e.pageX:"touches"in e?e.touches[0].pageX:0)-(d.current?.offsetLeft||0)-y.current.startX);Math.abs(t)>5&&(y.current.isMove=!0),d.current&&(d.current.scrollLeft=y.current.scrollLeft-t)},onTouchMove:r=>{L()},children:[r("div",{className:[i.arrowLeft,f&&i.arrowShow].join(" "),children:r(l,{type:"button",onClick:()=>{if(!d.current)return;const r=C();if(0===r)return;const e=Math.floor(d.current.offsetWidth/r)*r,t=Math.max(d.current.scrollLeft-e,0);b(d.current,t,900,!0)},height:"40px",width:"40px",children:u||r("div",{className:[i.buttonArrowLeft].join(" ")})})}),a,r("div",{className:[i.arrowRight,m&&i.arrowShow].join(" "),children:r(l,{type:"button",onClick:()=>{if(!d.current)return;const r=C();if(0===r)return;const e=Math.floor(d.current.offsetWidth/r)*r,t=d.current.scrollWidth-d.current.clientWidth,o=Math.min(d.current.scrollLeft+e,t);b(d.current,o,900,!0)},height:"40px",width:"40px",children:c||r("div",{className:[i.buttonArrowRight].join(" ")})})})]})})};u.displayName="Carousel";export{u as Carousel};
|
package/lib/carousel/index.d.ts
DELETED