najwer23morsels 1.1.5 → 1.1.7
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/lib/Calendar.js +1 -1
- package/lib/Input/Input.d.ts +1 -0
- package/lib/{Input-CPX5geDL.js → Input-CRQfGPi5.js} +1 -1
- package/lib/Input.js +1 -1
- package/lib/Select.js +1 -1
- package/lib/SliderScroll.js +1 -1
- package/package.json +1 -1
package/lib/Calendar.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as a,Fragment as o}from"react/jsx-runtime";import{useRef as l,useState as d,useMemo as r}from"react";import{B as n}from"./Button-czA3IzD8.js";import{I as t,a as i}from"./IconLocate-1fQEMRDH.js";import{I as s}from"./Input-
|
|
1
|
+
import{jsxs as e,jsx as a,Fragment as o}from"react/jsx-runtime";import{useRef as l,useState as d,useMemo as r}from"react";import{B as n}from"./Button-czA3IzD8.js";import{I as t,a as i}from"./IconLocate-1fQEMRDH.js";import{I as s}from"./Input-CRQfGPi5.js";import{T as c}from"./TextBox-CT8wp519.js";import{s as p}from"./style-inject.es-CrVRO2OA.js";import{e as h,g as u,i as m,d as y,f as _,b as v,a as C,c as w}from"./index-DA33EDrV.js";import"./Loader-hxKQ6g7j.js";var x={n23mCalendar:"Calendar-module_n23mCalendar__6E2X7",icon:"Calendar-module_icon__ye4Dl",dropdownWrapper:"Calendar-module_dropdownWrapper__KryyT",open:"Calendar-module_open__Y-JWN",dropdown:"Calendar-module_dropdown__RPTTl",controls:"Calendar-module_controls__XGi-Q",controlsDate:"Calendar-module_controlsDate__L1Wp6",weekdays:"Calendar-module_weekdays__t9VRM",weekdaysChild:"Calendar-module_weekdaysChild__owTwc",days:"Calendar-module_days__D03p-",daysChild:"Calendar-module_daysChild__Jbjrd",daysActive:"Calendar-module_daysActive__Y7Fsv",daysClickable:"Calendar-module_daysClickable__THEm1",months:"Calendar-module_months__NOLDP",years:"Calendar-module_years__li-uY",monthsChild:"Calendar-module_monthsChild__4gx-0",yearsChild:"Calendar-module_yearsChild__mRWoZ"};p("@layer n23mCalendar{.Calendar-module_n23mCalendar__6E2X7{--iff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;position:relative;& input{cursor:pointer;padding-right:40px}.Calendar-module_icon__ye4Dl{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 25'%3E%3Cpath fill='%23231f20' d='M22.5 3H21V2a1 1 0 0 0-1-1h-1a1 1 0 0 0-1 1v1h-4V2a1 1 0 0 0-1-1h-1a1 1 0 0 0-1 1v1H7V2a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1v1H2.5A1.5 1.5 0 0 0 1 4.5v18A1.5 1.5 0 0 0 2.5 24h20a1.5 1.5 0 0 0 1.5-1.5v-18A1.5 1.5 0 0 0 22.5 3ZM19 2h1v3h-1Zm-7 0h1v3h-1ZM5 2h1v3H5ZM2.5 4H4v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1V4h4v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1V4h4v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1V4h1.5a.5.5 0 0 1 .5.5V8H2V4.5a.5.5 0 0 1 .5-.5Zm20 19h-20a.5.5 0 0 1-.5-.5V9h21v13.5a.5.5 0 0 1-.5.5Z'/%3E%3C/svg%3E\");background-position:100%;background-position:calc(100% - 10px) 50%;background-repeat:no-repeat;background-size:18px;cursor:pointer;display:inline-block;height:40px;position:absolute;right:2px;top:21px;width:40px}.Calendar-module_dropdownWrapper__KryyT{background-color:transparent;display:none;margin-top:65px;padding-bottom:40px;position:absolute;top:0;width:318px;z-index:3;&.Calendar-module_open__Y-JWN{display:block}.Calendar-module_dropdown__RPTTl{corner-shape:squircle;background:#fff;border:1px solid var(--input-cb,#000);border-radius:12px;box-shadow:0 4px 8px 0 rgba(0,0,0,.24),0 6px 20px 0 rgba(0,0,0,.19);box-sizing:border-box;overflow-y:auto;padding:20px;& .Calendar-module_controls__XGi-Q{align-items:center;display:flex;height:40px;justify-content:space-between;padding:0 7px}& .Calendar-module_controlsDate__L1Wp6{display:flex;font-family:var(--n23mFontFamily,var(--iff));font-size:20px;justify-content:center}& .Calendar-module_weekdays__t9VRM{display:flex;justify-content:center;width:100%}& .Calendar-module_weekdaysChild__owTwc{align-items:center;display:flex;font-family:var(--n23mFontFamily,var(--iff));font-size:12px;height:30px;justify-content:center;width:14.28571%}& .Calendar-module_days__D03p-{display:flex;flex-wrap:wrap;justify-content:flex-start;width:100%}& .Calendar-module_daysChild__Jbjrd{font-size:16px}& .Calendar-module_daysChild__Jbjrd:nth-child(7n){color:red;font-weight:700}& .Calendar-module_daysActive__Y7Fsv{corner-shape:squircle;background-color:#f2f2f2;border-radius:12px;cursor:pointer}& .Calendar-module_daysClickable__THEm1{cursor:pointer}& .Calendar-module_months__NOLDP,& .Calendar-module_years__li-uY{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}& .Calendar-module_monthsChild__4gx-0,& .Calendar-module_yearsChild__mRWoZ{display:flex;justify-content:center}}}}}");const b=({children:p,name:b,placeholder:g,label:f="Calendar",initialValue:k,onBlur:D,validatorOptions:F,className:S,style:j,...N})=>{const M=l(null),[T,E]=d({value:""==k?"":h(k??new Date),open:!1,dropDwonState:"days"}),V=e=>{E(a=>({...a,value:h(e),open:!0}))},z=e=>{V(C(m(T.value)?T.value:h(new Date),e))},W=e=>{V(v(m(T.value)?T.value:h(new Date),e))},A=r(()=>Array.from({length:7},(e,a)=>new Date(2021,0,(a+4)%7).toLocaleString("en-US",{weekday:"short"})),[]),B=r(()=>Array.from({length:12},(e,a)=>new Date(2021,a+1,0).toLocaleString("en-US",{month:"short"})),[]),H=u(m(T.value)?T.value:h(new Date)),L=y(m(T.value)?T.value:h(new Date)),P=m(T.value)?new Date(T.value):new Date,Z=P.getFullYear(),R=P.getMonth(),Y=P.getDate();return e("div",{className:[x.n23mCalendar,"n23mCalendar",S].filter(Boolean).join(" "),...N,style:{...j},children:[a("div",{className:x.icon,onMouseDown:e=>{e.preventDefault(),M.current?.focus(),E(e=>({...e,value:"",open:!e.open,dropDwonState:"days"}))}}),a(s,{inputRef:M,label:f,type:"text",kind:"input",name:b,autoComplete:"off",placeholder:g,onChange:e=>{const a=e.currentTarget.value;E(e=>({...e,value:a}))},onBlur:e=>{E(e=>({...e,open:!1})),D?.(e)},onClick:()=>E(e=>({...e,value:"",open:!0,dropDwonState:"days"})),value:T.value,validatorOptions:[...F??[],{type:"date"}],className:x.arrowUp,"aria-expanded":T.open,role:"combobox"}),a("div",{className:[x.dropdownWrapper,T.open?x.open:""].join(" "),children:e("div",{className:[x.dropdown].join(" "),onMouseDown:e=>e.preventDefault(),children:["years"===T.dropDwonState&&e(o,{children:[e("div",{className:x.controls,style:{marginBottom:"10px"},children:[a("div",{style:{width:"30px"},children:a(n,{type:"button",padding:"3px 0 0 0",height:"30px",width:"30px",title:"Prev Month",backgroundColor:"#F2F0EF",borderColor:"black",onClick:()=>W(Z-9),children:a(t,{color:"black",height:22,width:22})})}),a("div",{style:{width:"60%"},className:x.controlsDate,children:a("div",{style:{cursor:"pointer"},onClick:()=>E(e=>({...e,dropDwonState:"days"})),children:Z})}),a("div",{style:{width:"30px"},children:a(n,{type:"button",padding:"3px 0 0 0",height:"30px",width:"30px",title:"Prev Month",backgroundColor:"#F2F0EF",borderColor:"black",onClick:()=>W(Z+9),children:a(i,{color:"black",height:22,width:22})})})]}),a("div",{className:x.years,children:L.map(e=>a("div",{className:x.yearsChild,children:a(n,{type:"button",height:"40px",width:"80px",color:"black",backgroundColor:Z==e?"white":"#F2F0EF",borderColor:"black",title:"year",onClick:()=>{W(e),E(e=>({...e,dropDwonState:"days"}))},children:a(c,{mobileSize:14,desktopSize:14,children:e})},e+T.value)},e+T.value))})]}),"months"===T.dropDwonState&&a("div",{className:x.months,children:B.map((e,o)=>a("div",{className:x.monthsChild,children:a(n,{type:"button",height:"40px",width:"80px",backgroundColor:R==o?"white":"#F2F0EF",borderColor:"black",title:"month",onClick:()=>{z(o-R),E(e=>({...e,dropDwonState:"days"}))},children:a(c,{mobileSize:14,desktopSize:14,children:e})},e+T.value)},e+T.value))}),"days"===T.dropDwonState&&e(o,{children:[e("div",{className:x.controls,children:[a("div",{style:{width:"30px"},children:a(n,{type:"button",padding:"3px 0 0 0",height:"30px",width:"30px",title:"Prev Month",backgroundColor:"#F2F0EF",borderColor:"black",onClick:()=>z(-1),children:a(t,{color:"black",height:22,width:22})})}),e("div",{style:{width:"60%"},className:x.controlsDate,children:[a("div",{style:{cursor:"pointer"},onClick:()=>E(e=>({...e,dropDwonState:"years"})),children:Z}),a("div",{children:"-"}),a("div",{style:{cursor:"pointer"},onClick:()=>E(e=>({...e,dropDwonState:"months"})),children:String(R+1).padStart(2,"0")}),a("div",{children:"-"}),a("div",{children:String(Y).padStart(2,"0")})]}),a("div",{style:{width:"30px"},children:a(n,{type:"button",padding:"3px 0 0 0",height:"30px",width:"30px",title:"Prev Month",backgroundColor:"#F2F0EF",borderColor:"black",onClick:()=>z(1),children:a(i,{color:"black",height:22,width:22})})})]}),a("div",{className:x.weekdays,children:A.map(e=>a("div",{className:x.weekdaysChild,children:e},e))}),a("div",{className:x.days,children:H.map(e=>a("div",{className:[x.weekdaysChild,x.daysChild,"active"==e.cssClass&&x.daysActive,"clickable"==e.cssClass&&x.daysClickable].join(" "),onMouseDown:()=>{var a;e.day>0&&(a=e.day,V(w(m(T.value)?T.value:h(new Date),a))),E(e=>({...e,open:!1})),setTimeout(()=>{M.current?.blur()})},children:e.day<=0||e.day>_(T.value)?" ":e.day},e.day+T.value))})]})]})})]})};b.displayName="Calendar";export{b as Calendar};
|
package/lib/Input/Input.d.ts
CHANGED
|
@@ -15,6 +15,7 @@ interface InputBase extends React.HTMLAttributes<HTMLElement> {
|
|
|
15
15
|
onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
|
|
16
16
|
value?: string;
|
|
17
17
|
autoComplete?: string;
|
|
18
|
+
step?: number | 'any';
|
|
18
19
|
}
|
|
19
20
|
export type InputProps = InputBase & {
|
|
20
21
|
kind?: 'input' | 'textarea';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as n}from"react";import{T as r}from"./TextBox-CT8wp519.js";import{s as a,g as o}from"./style-inject.es-CrVRO2OA.js";import{v as i}from"./index-DA33EDrV.js";var l={n23mInput:"Input-module_n23mInput__6WopW",n23mInputInput:"Input-module_n23mInputInput__djmAy"};a("@layer n23mInput{.Input-module_n23mInput__6WopW{--iff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;margin-top:0;&:not(:has(input[type=hidden])){margin-bottom:10px}.Input-module_n23mInputInput__djmAy{display:grid;& input,& textarea{corner-shape:squircle;border:1px solid var(--input-cb,#000);border-radius:12px;box-sizing:border-box;color:var(--input-c,#000);font-family:var(--n23mFontFamily,var(--iff));font-size:16px;font-weight:500}& input{height:40px;padding:20px 10px;width:100%}& textarea{field-sizing:content;block-size:100%;max-height:400px;min-height:200px;padding:10px;resize:vertical}&input[type=hidden]{margin:0;padding:0}& ::placeholder{filter:brightness(125%);font-weight:300}}.Input-module_n23mInputError__0yrzG{color:var(--najwer23snacks-input-error-font-color);font-family:var(--najwer23snacks-input-error-font-family);font-size:var(--najwer23snacks-input-error-font-size);font-weight:var(--najwer23snacks-input-error-font-weight);line-height:1;margin:2px}}}");const p=({className:a,style:p,name:u,label:s,inputRef:d,placeholder:m,type:c="text",labelColor:f="black",kind:h="input",inputColor:g,inputColorBorder:x,defaultValue:v,disabled:b,validatorOptions:I,value:y,autoComplete:_,id:C,onBlur:j,onChange:z,...
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as n}from"react";import{T as r}from"./TextBox-CT8wp519.js";import{s as a,g as o}from"./style-inject.es-CrVRO2OA.js";import{v as i}from"./index-DA33EDrV.js";var l={n23mInput:"Input-module_n23mInput__6WopW",n23mInputInput:"Input-module_n23mInputInput__djmAy"};a("@layer n23mInput{.Input-module_n23mInput__6WopW{--iff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;margin-top:0;&:not(:has(input[type=hidden])){margin-bottom:10px}.Input-module_n23mInputInput__djmAy{display:grid;& input,& textarea{corner-shape:squircle;border:1px solid var(--input-cb,#000);border-radius:12px;box-sizing:border-box;color:var(--input-c,#000);font-family:var(--n23mFontFamily,var(--iff));font-size:16px;font-weight:500}& input{height:40px;padding:20px 10px;width:100%}& textarea{field-sizing:content;block-size:100%;max-height:400px;min-height:200px;padding:10px;resize:vertical}&input[type=hidden]{margin:0;padding:0}& ::placeholder{filter:brightness(125%);font-weight:300}}.Input-module_n23mInputError__0yrzG{color:var(--najwer23snacks-input-error-font-color);font-family:var(--najwer23snacks-input-error-font-family);font-size:var(--najwer23snacks-input-error-font-size);font-weight:var(--najwer23snacks-input-error-font-weight);line-height:1;margin:2px}}}");const p=({className:a,style:p,name:u,label:s,inputRef:d,placeholder:m,type:c="text",labelColor:f="black",kind:h="input",inputColor:g,inputColorBorder:x,defaultValue:v,disabled:b,validatorOptions:I,value:y,autoComplete:_,id:C,onBlur:j,onChange:z,step:k,...w})=>{const B=n(null),W=e=>{j?.(e);const t=e.target;if(document.activeElement!==t&&(B.current&&(B.current.textContent=""),I)){const e=i(t.value,I);e.length>0?(B.current&&(B.current.textContent=e[0]),t.classList.add("error")):t.classList.remove("error")}},S=e=>{z?.(e)};return e("div",{className:[l.n23mInput,"n23mInput",a].filter(Boolean).join(" "),...w,style:{...o({"--input-c":g,"--input-cb":x}),...p},children:["hidden"!==c&&t(r,{mobileSize:14,desktopSize:14,tag:"label",fontWeight:400,color:f,htmlFor:"select"==h?C:u,children:s}),e("div",{className:l.n23mInputInput,children:["input"===h&&t("input",{ref:d,id:u,name:u,type:c,onBlur:W,onChange:S,placeholder:m,defaultValue:v,disabled:b,value:y,autoComplete:_,step:k}),"textarea"===h&&t("textarea",{autoComplete:_,id:u,name:u,onBlur:W,onChange:S,placeholder:m,defaultValue:v,disabled:b,value:y,ref:d}),"select"===h&&t("input",{id:C,autoComplete:"off",ref:d,type:c,onBlur:W,onChange:S,placeholder:m,defaultValue:v,disabled:b,value:y,step:k})]}),"hidden"!==c&&t(r,{ref:B,mobileSize:12,desktopSize:12,tag:"p",fontWeight:400,color:"#ff3333",lineHeight:"14px",margin:"2px 0 2px"})]})};p.displayName="Input";export{p as I};
|
package/lib/Input.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{I as Input}from"./Input-
|
|
1
|
+
export{I as Input}from"./Input-CRQfGPi5.js";import"react/jsx-runtime";import"react";import"./TextBox-CT8wp519.js";import"./style-inject.es-CrVRO2OA.js";import"./index-DA33EDrV.js";
|
package/lib/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useState as t,useRef as n,useId as r,useMemo as l}from"react";import{I as a}from"./Input-
|
|
1
|
+
import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useState as t,useRef as n,useId as r,useMemo as l}from"react";import{I as a}from"./Input-CRQfGPi5.js";import{s as i}from"./style-inject.es-CrVRO2OA.js";import"./TextBox-CT8wp519.js";import"./index-DA33EDrV.js";var s={n23mSelect:"Select-module_n23mSelect__awO8y",icon:"Select-module_icon__jzEHa",iconRotate:"Select-module_iconRotate__NvZVj",dropdownWrapper:"Select-module_dropdownWrapper__IUKRC",open:"Select-module_open__JxM1W",dropdown:"Select-module_dropdown__DZBqH",dropdownItem:"Select-module_dropdownItem__COzLI"};i('@layer n23mSelect{.Select-module_n23mSelect__awO8y{--iff:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;position:relative;& input{cursor:pointer;padding-right:40px}.Select-module_icon__jzEHa{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);background:url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" xml:space="preserve"><g style="stroke:none;stroke-width:1px;fill-rule:nonzero;opacity:1"><path d="M90 24.25a3.499 3.499 0 0 0-5.974-2.475L45 60.8 5.975 21.775a3.5 3.5 0 1 0-4.95 4.95l41.5 41.5a3.499 3.499 0 0 0 4.949 0l41.5-41.5A3.487 3.487 0 0 0 90 24.25z" style="stroke:none;stroke-width:1" transform="matrix(2.81 0 0 2.81 1.407 1.407)"/></g></svg>\') no-repeat 100%;background-position:calc(100% - 10px) 50%;background-size:18px;cursor:pointer;display:inline-block;height:40px;position:absolute;right:2px;top:22px;transform:rotate(0deg);transition:transform .1s ease-in-out;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:40px;&.Select-module_iconRotate__NvZVj{transform:rotate(180deg);transition:transform .1s ease-in-out}}.Select-module_dropdownWrapper__IUKRC{corner-shape:squircle;background:transparent;border-radius:12px;display:none;margin-top:65px;padding-bottom:40px;position:absolute;top:0;width:100%;z-index:3;&.Select-module_open__JxM1W{display:block}.Select-module_dropdown__DZBqH{corner-shape:squircle;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);background:#fff;border-radius:12px;box-shadow:0 4px 8px 0 rgba(0,0,0,.24),0 6px 20px 0 rgba(0,0,0,.19);cursor:pointer;max-height:200px;overflow-y:auto;overscroll-behavior:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;&:has(.Select-module_dropdownItem__COzLI){border:1px solid var(--input-cb,#000)}.Select-module_dropdownItem__COzLI{background:#fff;border-bottom:1px solid var(--input-cb,#000);box-sizing:border-box;color:var(--input-c,#000);font-family:var(--n23mFontFamily,var(--iff));font-size:16px;font-weight:500;padding:10px;width:100%;&:hover{background-color:#f5f5f5}&:not(:first-child){border-top:none}&:last-child{border-bottom:unset}}}}}}');const p=({className:i,name:p,disabled:d,style:c,options:u,initialValue:m,validatorOptions:b,placeholder:h,onBlur:_,label:x="Select",...g})=>{const[v,w]=t(m?.label??""),[f,k]=t(m?.value??""),[y,S]=t(!1),j=n(null),I=r(),z=l(()=>u.filter(e=>e.label.toLowerCase().includes(v.toLowerCase())),[u,v]),C=()=>{S(e=>!e),w(""),k("")};return e("div",{className:[s.n23mSelect,"n23mSelect",i].filter(Boolean).join(" "),...g,style:{...c},children:[o("div",{className:[s.icon,y?s.iconRotate:""].join(" "),onMouseDown:e=>{e.preventDefault(),j.current?.focus(),C()}}),o(a,{name:p,type:"hidden",kind:"input",validatorOptions:[...b??[],{type:"existsInOptions",options:{options:u,matchBy:"value"}}],value:f}),o(a,{id:I,inputRef:j,label:x,type:"text",kind:"select",disabled:d,placeholder:h,value:v,onChange:e=>{const o=e.currentTarget.value;w(o),k(""),S(!0)},onClick:C,onBlur:e=>{S(!1),_?.(e,{value:f,label:v})},validatorOptions:[...b??[],{type:"existsInOptions",options:{options:u,matchBy:"label"}}],"aria-autocomplete":"list","aria-expanded":y,"aria-controls":`${p}-listbox`,role:"combobox"}),o("div",{className:[s.dropdownWrapper,y?s.open:""].join(" "),children:o("div",{className:[s.dropdown].join(" "),children:z.map(e=>o("div",{className:s.dropdownItem,onMouseDown:()=>{(e=>{k(e.value),w(e.label),S(!1)})(e)},children:e.label},e.value))})})]})};export{p as Select};
|
package/lib/SliderScroll.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as r,jsx as e}from"react/jsx-runtime";import{useRef as l,Children as t,cloneElement as n,useState as o,useEffect as i,useMemo as c,useCallback as s}from"react";import{B as a}from"./Button-czA3IzD8.js";import{u}from"./useWindowSize-CAQRbyxi.js";import{I as d,a as g}from"./IconLocate-1fQEMRDH.js";import{s as m,g as f}from"./style-inject.es-CrVRO2OA.js";import"./Loader-hxKQ6g7j.js";import"./TextBox-CT8wp519.js";var h={n23mSliderScrollWrapper:"SliderScroll-module_n23mSliderScrollWrapper__qj8cS",n23mSliderScrollTrack:"SliderScroll-module_n23mSliderScrollTrack__y6G6v",dragging:"SliderScroll-module_dragging__gH9AX",n23mSliderScrollControls:"SliderScroll-module_n23mSliderScrollControls__TAnlc",n23mSliderScrollControlsButtons:"SliderScroll-module_n23mSliderScrollControlsButtons__-PK4Y"};m("@layer n23mSliderScroll{.SliderScroll-module_n23mSliderScrollWrapper__qj8cS{display:grid;position:relative}.SliderScroll-module_n23mSliderScrollTrack__y6G6v{-ms-overflow-style:none;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:nowrap;gap:var(--sliderscroll-g);overflow-x:scroll;scrollbar-width:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;will-change:scroll-position;&::-webkit-scrollbar{display:none}&>*{flex-shrink:0}&.SliderScroll-module_dragging__gH9AX,&.SliderScroll-module_dragging__gH9AX a{cursor:grabbing}}.SliderScroll-module_n23mSliderScrollControls__TAnlc{align-items:center;display:flex;justify-content:flex-end;margin-left:20px;margin-right:20px}.SliderScroll-module_n23mSliderScrollControlsButtons__-PK4Y{display:flex;gap:10px;margin-top:10px}}");const S=({children:m,className:S,gap:p="5px",isCircular:w=!1,autoPlay:b=!1,autoPlaySpeed:v=.5,style:L})=>{const _={carousel:l(null),buttonLeft:l(null),buttonRight:l(null),showArrowLeft:l(!1),showArrowRight:l(!1),isSliding:l(!1),animationFrameId:l(null),isHovered:l(!1),drag:l({isDown:!1,startX:0,scrollLeft:0,isMove:!1,isDragging:!1}),childRefs:l([])},F=t.toArray(m),x=F.length,y=w?F.map((r,e)=>n(r,{key:`cb-${e}`})):[],k=w?F.map((r,e)=>n(r,{key:`ca-${e}`})):[],A=w?[...y,...F,...k]:F,[C,D]=o([]),{width:j}=u();i(()=>{if(!_.carousel.current)return;const r=_.childRefs.current.map(r=>{if(!r)return 0;const e=getComputedStyle(r),l=parseFloat(e.marginLeft)||0,t=parseFloat(e.marginRight)||0;return r.offsetWidth+l+t+Number(p.slice(0,-2))});D(r)},[m,j,p]);const M=c(()=>{const r=[];let e=0;for(const l of C)r.push(e),e+=l;return r},[C]);i(()=>{w&&_.carousel.current&&M.length&&(_.carousel.current.scrollLeft=(M[x]||0)-2*Number(p.slice(0,-2))),I()},[j,M,x,w]),i(()=>{N(!1)},[]),i(()=>{if(!w)return;if(!b)return void(_.animationFrameId.current&&(cancelAnimationFrame(_.animationFrameId.current),_.animationFrameId.current=null));let r;const e=()=>{if(!_.carousel.current)return;if(_.isSliding.current||_.isHovered.current)return void(_.animationFrameId.current=requestAnimationFrame(e));const r=_.carousel.current;let l=r.scrollLeft+v;if(w&&M.length&&C.length){const r=M[M.length-1]+(C[C.length-1]||0),e=M[x]||0,t=M[x+F.length]||r;l>t+C[0]/2&&(l-=t-e)}r.scrollLeft=l,I(),_.animationFrameId.current=requestAnimationFrame(e)};return r=setTimeout(()=>{_.animationFrameId.current=requestAnimationFrame(e)},500),()=>{r&&clearTimeout(r),_.animationFrameId.current&&(cancelAnimationFrame(_.animationFrameId.current),_.animationFrameId.current=null)}},[b,v,w,M,C,x,F.length]);const I=()=>{if(_.carousel.current){if(w)_.showArrowLeft.current=!0,_.showArrowRight.current=!0;else{const r=_.carousel.current.scrollLeft,e=_.carousel.current.scrollWidth-_.carousel.current.clientWidth;_.showArrowLeft.current=r>0,_.showArrowRight.current=r<e-1}N(_.isSliding.current)}},N=r=>{_.buttonLeft.current&&(_.buttonLeft.current.disabled=r||!_.showArrowLeft.current),_.buttonRight.current&&(_.buttonRight.current.disabled=r||!_.showArrowRight.current)},R=(r,e,l=300)=>{if(_.isSliding.current)return;_.isSliding.current=!0,N(!0);const t=r.scrollLeft,n=e-t,o=performance.now(),i=e=>{const c=e-o,s=Math.min(c/l,1);var a;r.scrollLeft=t+n*((a=s)<.5?4*a*a*a:1-Math.pow(-2*a+2,3)/2),s<1?requestAnimationFrame(i):(_.isSliding.current=!1,N(!1),I())};requestAnimationFrame(i)},W=s(()=>{if(!_.carousel.current)return;if(!M.length||!C.length)return;const r=_.carousel.current,e=r.offsetWidth,l=r.scrollLeft;let t=M.findIndex((r,e)=>r>l);-1===t?t=M.length-1:t>0&&t--;let n,o=0,i=0;for(let r=t;r<M.length&&(o+=C[r],i++,!(o>=e));r++);const c=t+i-1;n=M[c]+C[c]>l+e+1?c:t+i;let s=M[n]-2*Number(p.slice(0,-2));if(s<0&&(s=0),w){s=(M[x]||0)+s-(M[x]||0)}R(_.carousel.current,s,400)},[M,C,p,x,w,F.length]),X=s(()=>{if(!_.carousel.current)return;if(!M.length||!C.length)return;const r=_.carousel.current,e=r.offsetWidth,l=r.scrollLeft;let t=0;for(let r=0;r<M.length;r++)if(M[r]>l){t=r-1;break}t<0&&(t=0);let n=0,o=0;for(let r=t;r>=0&&(n+=C[r],n<=e);r--)o++;let i=t;w||(i=Math.max(o-1,i));let c=M[i]+C[i]-e;if(c<0&&(c=0),w){c=(M[x]||0)+c-(M[x]||0)+Number(p.slice(0,-2))}R(_.carousel.current,c,400)},[M,C,p,x,w]),B=()=>{_.carousel.current&&(_.drag.current.isDragging?_.carousel.current.classList.add(h.dragging):_.carousel.current.classList.remove(h.dragging))};return r("div",{className:["n23mSliderScroll",S].filter(Boolean).join(" "),style:{...f({"--sliderscroll-g":p,height:"calc(100% - 60px)"}),...L},onMouseEnter:()=>{_.isHovered.current=!0},onMouseLeave:()=>{_.isHovered.current=!1},children:[e("div",{className:[h.n23mSliderScrollWrapper,"n23mSliderScrollWrapper"].join(" "),children:e("div",{className:h.n23mSliderScrollTrack,ref:_.carousel,onClick:r=>{_.drag.current.isMove&&(r.preventDefault(),r.stopPropagation())},onScroll:()=>{if(_.carousel.current){if(w&&M.length&&C.length){const r=_.carousel.current.scrollLeft,e=M[M.length-1]+(C[C.length-1]||0),l=M[x]||0,t=M[x+F.length]||e;r<l-C[0]/2?_.carousel.current.scrollLeft=r+(M[F.length+x]-l):r>t+C[0]/2&&(_.carousel.current.scrollLeft=r-(t-l))}I()}},onMouseDown:r=>{_.drag.current.isDown=!0,_.drag.current.startX=r.pageX-(_.carousel.current?.offsetLeft||0),_.drag.current.scrollLeft=_.carousel.current?.scrollLeft||0,_.drag.current.isDragging=!0,B()},onMouseLeave:()=>{_.drag.current.isDown&&(_.drag.current.isDown=!1,_.drag.current.isDragging=!1,B())},onMouseUp:()=>{_.drag.current.isDown=!1,_.drag.current.isDragging=!1,B()},onMouseMove:r=>{if(!_.drag.current.isDown)return void(_.drag.current.isMove=!1);r.preventDefault();var e;const l=("pageX"in(e=r)?e.pageX:"touches"in e?e.touches[0].pageX:0)-(_.carousel.current?.offsetLeft||0)-_.drag.current.startX;Math.abs(l)>5&&(_.drag.current.isMove=!0),_.carousel.current&&(_.carousel.current.scrollLeft=_.drag.current.scrollLeft-l,I())},children:A.map((r,l)=>e("div",{ref:r=>{_.childRefs.current[l]=r},style:{display:"inline-block"},children:r},r.key||l))})}),e("div",{className:[h.n23mSliderScrollControls,"n23mSliderScrollControls"].join(" "),children:r("div",{className:[h.n23mSliderScrollControlsButtons,"n23mSliderScrollControlsButtons"].join(" "),children:[e(a,{ref:_.buttonLeft,height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Prev",onClick:X,borderColor:"black",backgroundColorDisabled:"#F2F0EF",children:e(d,{width:24,height:24})}),e(a,{ref:_.buttonRight,height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Next",onClick:W,borderColor:"black",backgroundColorDisabled:"#F2F0EF",children:e(g,{width:24,height:24})})]})})]})};S.displayName="SliderScroll";export{S as SliderScroll};
|
|
1
|
+
import{jsxs as r,jsx as e}from"react/jsx-runtime";import{useRef as l,Children as t,cloneElement as n,useState as o,useEffect as i,useMemo as c,useCallback as s}from"react";import{B as a}from"./Button-czA3IzD8.js";import{u}from"./useWindowSize-CAQRbyxi.js";import{I as d,a as g}from"./IconLocate-1fQEMRDH.js";import{s as m,g as f}from"./style-inject.es-CrVRO2OA.js";import"./Loader-hxKQ6g7j.js";import"./TextBox-CT8wp519.js";var h={n23mSliderScrollWrapper:"SliderScroll-module_n23mSliderScrollWrapper__qj8cS",n23mSliderScrollTrack:"SliderScroll-module_n23mSliderScrollTrack__y6G6v",dragging:"SliderScroll-module_dragging__gH9AX",n23mSliderScrollControls:"SliderScroll-module_n23mSliderScrollControls__TAnlc",n23mSliderScrollControlsButtons:"SliderScroll-module_n23mSliderScrollControlsButtons__-PK4Y"};m("@layer n23mSliderScroll{.SliderScroll-module_n23mSliderScrollWrapper__qj8cS{display:grid;position:relative}.SliderScroll-module_n23mSliderScrollTrack__y6G6v{-ms-overflow-style:none;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:nowrap;gap:var(--sliderscroll-g);overflow-x:scroll;scrollbar-width:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;will-change:scroll-position;&::-webkit-scrollbar{display:none}&>*{flex-shrink:0}&.SliderScroll-module_dragging__gH9AX,&.SliderScroll-module_dragging__gH9AX a{cursor:grabbing}}.SliderScroll-module_n23mSliderScrollControls__TAnlc{align-items:center;display:flex;justify-content:flex-end;margin-left:20px;margin-right:20px}.SliderScroll-module_n23mSliderScrollControlsButtons__-PK4Y{display:flex;gap:10px;margin-top:10px}}");const S=({children:m,className:S,gap:p="5px",isCircular:w=!1,autoPlay:b=!1,autoPlaySpeed:v=.5,style:L})=>{const _={carousel:l(null),buttonLeft:l(null),buttonRight:l(null),showArrowLeft:l(!1),showArrowRight:l(!1),isSliding:l(!1),animationFrameId:l(null),isHovered:l(!1),drag:l({isDown:!1,startX:0,scrollLeft:0,isMove:!1,isDragging:!1}),childRefs:l([])},F=t.toArray(m),x=F.length,y=w?F.map((r,e)=>n(r,{key:`cb-${e}`})):[],k=w?F.map((r,e)=>n(r,{key:`ca-${e}`})):[],A=w?[...y,...F,...k]:F,[C,D]=o([]),{width:j}=u();i(()=>{if(!_.carousel.current)return;const r=_.childRefs.current.map(r=>{if(!r)return 0;const e=getComputedStyle(r),l=parseFloat(e.marginLeft)||0,t=parseFloat(e.marginRight)||0;return r.offsetWidth+l+t+Number(p.slice(0,-2))});D(r)},[m,j,p]);const M=c(()=>{const r=[];let e=0;for(const l of C)r.push(e),e+=l;return r},[C]);i(()=>{w&&_.carousel.current&&M.length&&(_.carousel.current.scrollLeft=(M[x]||0)-2*Number(p.slice(0,-2))),I()},[j,M,x,w]),i(()=>{N(!1)},[]),i(()=>{if(!w)return;if(!b)return void(_.animationFrameId.current&&(cancelAnimationFrame(_.animationFrameId.current),_.animationFrameId.current=null));let r;const e=()=>{if(!_.carousel.current)return;if(_.isSliding.current||_.isHovered.current)return void(_.animationFrameId.current=requestAnimationFrame(e));const r=_.carousel.current;let l=r.scrollLeft+v;if(w&&M.length&&C.length){const r=M[M.length-1]+(C[C.length-1]||0),e=M[x]||0,t=M[x+F.length]||r;l>t+C[0]/2&&(l-=t-e)}r.scrollLeft=l,I(),_.animationFrameId.current=requestAnimationFrame(e)};return r=setTimeout(()=>{_.animationFrameId.current=requestAnimationFrame(e)},500),()=>{r&&clearTimeout(r),_.animationFrameId.current&&(cancelAnimationFrame(_.animationFrameId.current),_.animationFrameId.current=null)}},[b,v,w,M,C,x,F.length]);const I=()=>{if(_.carousel.current){if(w)_.showArrowLeft.current=!0,_.showArrowRight.current=!0;else{const r=_.carousel.current.scrollLeft,e=_.carousel.current.scrollWidth-_.carousel.current.clientWidth;_.showArrowLeft.current=r>0,_.showArrowRight.current=r<e-1}N(_.isSliding.current)}},N=r=>{_.buttonLeft.current&&(_.buttonLeft.current.disabled=r||!_.showArrowLeft.current),_.buttonRight.current&&(_.buttonRight.current.disabled=r||!_.showArrowRight.current)},R=(r,e,l=300)=>{if(_.isSliding.current)return;_.isSliding.current=!0,N(!0);const t=r.scrollLeft,n=e-t,o=performance.now(),i=e=>{const c=e-o,s=Math.min(c/l,1);var a;r.scrollLeft=t+n*((a=s)<.5?4*a*a*a:1-Math.pow(-2*a+2,3)/2),s<1?requestAnimationFrame(i):(_.isSliding.current=!1,N(!1),I())};requestAnimationFrame(i)},W=s(()=>{if(!_.carousel.current)return;if(!M.length||!C.length)return;const r=_.carousel.current,e=r.offsetWidth,l=r.scrollLeft;let t=M.findIndex((r,e)=>r>l);-1===t?t=M.length-1:t>0&&t--;let n,o=0,i=0;for(let r=t;r<M.length&&(o+=C[r],i++,!(o>=e));r++);const c=t+i-1;n=M[c]+C[c]>l+e+1?c:t+i;let s=M[n]-2*Number(p.slice(0,-2));if(s<0&&(s=0),w){s=(M[x]||0)+s-(M[x]||0)}R(_.carousel.current,s,400)},[M,C,p,x,w,F.length]),X=s(()=>{if(!_.carousel.current)return;if(!M.length||!C.length)return;const r=_.carousel.current,e=r.offsetWidth,l=r.scrollLeft;let t=0;for(let r=0;r<M.length;r++)if(M[r]>l){t=r-1;break}t<0&&(t=0);let n=0,o=0;for(let r=t;r>=0&&(n+=C[r],n<=e);r--)o++;let i=t;w||(i=Math.max(o-1,i));let c=M[i]+C[i]-e+Number(p.slice(0,-2));if(c<0&&(c=0),w){c=(M[x]||0)+c-(M[x]||0)+Number(p.slice(0,-2))}R(_.carousel.current,c,400)},[M,C,p,x,w]),B=()=>{_.carousel.current&&(_.drag.current.isDragging?_.carousel.current.classList.add(h.dragging):_.carousel.current.classList.remove(h.dragging))};return r("div",{className:["n23mSliderScroll",S].filter(Boolean).join(" "),style:{...f({"--sliderscroll-g":p,height:"calc(100% - 60px)"}),...L},onMouseEnter:()=>{_.isHovered.current=!0},onMouseLeave:()=>{_.isHovered.current=!1},children:[e("div",{className:[h.n23mSliderScrollWrapper,"n23mSliderScrollWrapper"].join(" "),children:e("div",{className:h.n23mSliderScrollTrack,ref:_.carousel,onClick:r=>{_.drag.current.isMove&&(r.preventDefault(),r.stopPropagation())},onScroll:()=>{if(_.carousel.current){if(w&&M.length&&C.length){const r=_.carousel.current.scrollLeft,e=M[M.length-1]+(C[C.length-1]||0),l=M[x]||0,t=M[x+F.length]||e;r<l-C[0]/2?_.carousel.current.scrollLeft=r+(M[F.length+x]-l):r>t+C[0]/2&&(_.carousel.current.scrollLeft=r-(t-l))}I()}},onMouseDown:r=>{_.drag.current.isDown=!0,_.drag.current.startX=r.pageX-(_.carousel.current?.offsetLeft||0),_.drag.current.scrollLeft=_.carousel.current?.scrollLeft||0,_.drag.current.isDragging=!0,B()},onMouseLeave:()=>{_.drag.current.isDown&&(_.drag.current.isDown=!1,_.drag.current.isDragging=!1,B())},onMouseUp:()=>{_.drag.current.isDown=!1,_.drag.current.isDragging=!1,B()},onMouseMove:r=>{if(!_.drag.current.isDown)return void(_.drag.current.isMove=!1);r.preventDefault();var e;const l=("pageX"in(e=r)?e.pageX:"touches"in e?e.touches[0].pageX:0)-(_.carousel.current?.offsetLeft||0)-_.drag.current.startX;Math.abs(l)>5&&(_.drag.current.isMove=!0),_.carousel.current&&(_.carousel.current.scrollLeft=_.drag.current.scrollLeft-l,I())},children:A.map((r,l)=>e("div",{ref:r=>{_.childRefs.current[l]=r},style:{display:"inline-block"},children:r},r.key||l))})}),e("div",{className:[h.n23mSliderScrollControls,"n23mSliderScrollControls"].join(" "),children:r("div",{className:[h.n23mSliderScrollControlsButtons,"n23mSliderScrollControlsButtons"].join(" "),children:[e(a,{ref:_.buttonLeft,height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Prev",onClick:X,borderColor:"black",backgroundColorDisabled:"#F2F0EF",children:e(d,{width:24,height:24})}),e(a,{ref:_.buttonRight,height:"50px",width:"50px",backgroundColor:"#F2F0EF",padding:0,title:"Next",onClick:W,borderColor:"black",backgroundColorDisabled:"#F2F0EF",children:e(g,{width:24,height:24})})]})})]})};S.displayName="SliderScroll";export{S as SliderScroll};
|