@component-hook/picker 1.2.0 → 1.2.1-alpha.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/dist/react/picker.es.js +298 -287
- package/dist/react/picker.umd.js +3 -3
- package/dist/vue/picker.es.js +127 -127
- package/dist/vue/picker.umd.js +1 -1
- package/package.json +1 -1
package/dist/react/picker.umd.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
/*$vite$:1*/`,document.head.appendChild(
|
|
1
|
+
(function(D,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],f):(D=typeof globalThis<"u"?globalThis:D||self,f(D.picker={},D.React))})(this,(function(D,f){"use strict";var ne=document.createElement("style");ne.textContent=`:root{--chook-picker-background: #fff;--chook-picker-columns-margin: 0 1rem;--chook-picker-columns-backdrop: linear-gradient( to bottom, #f2f2f2 0px, #f2f2f2 .0625rem, transparent .0625rem, transparent calc(100% - .0625rem) , #f2f2f2 calc(100% - .0625rem) , #f2f2f2 100% );--chook-picker-mask-backdrop: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4)), linear-gradient(0deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .4));--chook-picker-column-label-color: #323233;--chook-picker-column-label-padding: 0 .25rem;--chook-picker-column-font-size: 1rem;--chook-picker-column-font-weight: 500}.chook-picker-container{background:var(--chook-picker-background)}.chook-picker-columns{width:calc(100% - var(--chook-picker-columns-margin) * 2);height:13.5rem;overflow:hidden;position:relative;display:flex;margin:var(--chook-picker-columns-margin)}.chook-picker-columns-backdrop{background-image:var(--chook-picker-columns-backdrop);background-repeat:no-repeat;background-position:center;background-size:100% 3rem}.chook-picker-mask-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background-image:var(--chook-picker-mask-backdrop);background-repeat:no-repeat;background-position:top,bottom;background-size:100% 5.25rem}.chook-picker-loading{height:100%;width:100%;position:absolute;top:0;left:0}.chook-picker-column{flex:1 1 0%;overflow:hidden;padding:5.375rem 0;cursor:grab}.chook-picker-column ul{margin:0;padding:0;list-style:none}.chook-picker-column-item{height:3rem;display:flex;justify-content:center;align-items:center;cursor:grab}.chook-picker-column-label{color:var(--chook-picker-column-label-color);font-size:var(--chook-picker-column-font-size);font-weight:var(--chook-picker-column-font-weight);padding:var(--chook-picker-column-label-padding);text-overflow:ellipsis;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none}
|
|
2
|
+
/*$vite$:1*/`,document.head.appendChild(ne);var B={exports:{}},U={};var re;function _e(){if(re)return U;re=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function r(o,c,a){var d=null;if(a!==void 0&&(d=""+a),c.key!==void 0&&(d=""+c.key),"key"in c){a={};for(var s in c)s!=="key"&&(a[s]=c[s])}else a=c;return c=a.ref,{$$typeof:e,type:o,key:d,ref:c!==void 0?c:null,props:a}}return U.Fragment=n,U.jsx=r,U.jsxs=r,U}var L={};var oe;function Se(){return oe||(oe=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===T?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case w:return"Fragment";case M:return"Profiler";case _:return"StrictMode";case p:return"Suspense";case P:return"SuspenseList";case j:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case O:return"Portal";case b:return t.displayName||"Context";case l:return(t._context.displayName||"Context")+".Consumer";case g:var u=t.render;return t=t.displayName,t||(t=u.displayName||u.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case A:return u=t.displayName||null,u!==null?u:e(t.type)||"Memo";case I:u=t._payload,t=t._init;try{return e(t(u))}catch{}}return null}function n(t){return""+t}function r(t){try{n(t);var u=!1}catch{u=!0}if(u){u=console;var R=u.error,y=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return R.call(u,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",y),n(t)}}function o(t){if(t===w)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===I)return"<...>";try{var u=e(t);return u?"<"+u+">":"<...>"}catch{return"<...>"}}function c(){var t=S.A;return t===null?null:t.getOwner()}function a(){return Error("react-stack-top-frame")}function d(t){if(N.call(t,"key")){var u=Object.getOwnPropertyDescriptor(t,"key").get;if(u&&u.isReactWarning)return!1}return t.key!==void 0}function s(t,u){function R(){z||(z=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",u))}R.isReactWarning=!0,Object.defineProperty(t,"key",{get:R,configurable:!0})}function E(){var t=e(this.type);return W[t]||(W[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function m(t,u,R,y,Z,ee){var C=R.ref;return t={$$typeof:x,type:t,key:u,props:R,_owner:y},(C!==void 0?C:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:E}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:Z}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:ee}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function v(t,u,R,y,Z,ee){var C=u.children;if(C!==void 0)if(y)if(H(C)){for(y=0;y<C.length;y++)k(C[y]);Object.freeze&&Object.freeze(C)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else k(C);if(N.call(u,"key")){C=e(t);var X=Object.keys(u).filter(function(Je){return Je!=="key"});y=0<X.length?"{key: someKey, "+X.join(": ..., ")+": ...}":"{key: someKey}",Ee[C+y]||(X=0<X.length?"{"+X.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
3
3
|
let props = %s;
|
|
4
4
|
<%s {...props} />
|
|
5
5
|
React keys must be passed directly to JSX without using spread:
|
|
6
6
|
let props = %s;
|
|
7
|
-
<%s key={someKey} {...props} />`,C,P,X,P),Ee[P+C]=!0)}if(P=null,S!==void 0&&(r(S),P=""+S),m(u)&&(r(u.key),P=""+u.key),"key"in u){S={};for(var ee in u)ee!=="key"&&(S[ee]=u[ee])}else S=u;return P&&s(S,typeof t=="function"?t.displayName||t.name||"Unknown":t),d(t,P,S,o(),G,$)}function k(t){i(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===I&&(t._payload.status==="fulfilled"?i(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function i(t){return typeof t=="object"&&t!==null&&t.$$typeof===R}var h=f,R=Symbol.for("react.transitional.element"),x=Symbol.for("react.portal"),w=Symbol.for("react.fragment"),_=Symbol.for("react.strict_mode"),O=Symbol.for("react.profiler"),l=Symbol.for("react.consumer"),T=Symbol.for("react.context"),g=Symbol.for("react.forward_ref"),p=Symbol.for("react.suspense"),A=Symbol.for("react.suspense_list"),N=Symbol.for("react.memo"),I=Symbol.for("react.lazy"),b=Symbol.for("react.activity"),M=Symbol.for("react.client.reference"),y=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,D=Object.prototype.hasOwnProperty,H=Array.isArray,F=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(t){return t()}};var z,be={},Te=h.react_stack_bottom_frame.bind(h,a)(),ve=F(c(a)),Ee={};L.Fragment=w,L.jsx=function(t,u,S){var C=1e4>y.recentlyCreatedOwnerStacks++;return v(t,u,S,!1,C?Error("react-stack-top-frame"):Te,C?F(c(t)):ve)},L.jsxs=function(t,u,S){var C=1e4>y.recentlyCreatedOwnerStacks++;return v(t,u,S,!0,C?Error("react-stack-top-frame"):Te,C?F(c(t)):ve)}})()),L}var re;function Re(){return re||(re=1,process.env.NODE_ENV==="production"?W.exports=_e():W.exports=Se()),W.exports}var Y=Re();const xe=Array.isArray;function Oe(e,n){if(se(e))return"multiple";const[r]=e;return r?.[n.children]?"cascade":"single"}function Me(e){return{children:e?.children||"children",label:e?.label||"label",value:e?.value||"value"}}function we(e,n,r){if(se(e))return[];const c=[];let o=e,a=0;for(;o;){const m=n[a];let s=ce(o,m,r);s===-1&&(s=0),c.push(o),a+=1,o=o[s]?.[r.children]}return c}function ye(e,n,r,c){const o=[...r];let a=e,m=n+1;for(;a?.[c.children];){const s=a[c.children][0];o[m]=s.value,a=s,m+=1}return o}function ce(e,n,r){return e.findIndex(c=>c?.[r.value]===n)}function se(e){const[n]=e;return xe(n)}function Ce(e,n){return e>n?"horizontal":n>e?"vertical":""}function V(e,n,r){const c=[];for(let o=e;o<=n;o++){const a=r(`${o}`);c.push({label:a,value:o})}return c}function ae(e,n){return e===n.getFullYear()}function ie(e,n){return e===n.getFullYear()}function Pe(e,n){return e===n.getMonth()+1}function Ae(e,n){return e===n.getMonth()+1}function Ne(e,n){return new Date(e,n,0).getDate()}function ue(e,n,r){const c=new Date,o=Date.now(),a=e.getTime(),m=n.getTime(),s=o>=a&&o<=m;return r==="year"?s?c.getFullYear():e.getFullYear():r==="month"?s?c.getMonth()+1:e.getMonth()+1:s?c.getDate():e.getDate()}function Z(e){return e}function Ye(e){return/^(?:[01]\d|2[0-3]):[0-5]\d:[0-5]\d$/.test(e)}function le(e){if(!Ye(e))return null;const[n,r,c]=e.split(":");return{hour:Number(n),minute:Number(r),second:Number(c)}}function Q(e){return e.padStart(2,"0")}function fe(e,n,r){const c=Date.now(),{hour:o,minute:a,second:m}=e,{hour:s,minute:E,second:d}=n,v=new Date().setHours(o,a,m),k=new Date().setHours(s,E,d),i=c>=v&&c<=k;return r==="hour"?i?new Date().getHours():o:r==="minute"?i?new Date().getMinutes():a:i?new Date().getSeconds():m}function B(e){return f.forwardRef(e)}const Ie=16,J=48,je=.52,de=150,K=300,De=15,Fe=.008,me=5,Ve=["year","month","day"],He=["hour","minute","second"];function Xe(){const e={startX:0,startY:0,deltaX:0,deltaY:0,offsetX:0,offsetY:0};let n="",r=!0;const c=()=>n==="vertical",o=()=>n==="horizontal";function a(){e.deltaX=0,e.deltaY=0,e.offsetX=0,e.offsetY=0,n="",r=!0}function m(d){const v="touches"in d?d.touches[0]:d;a(),e.startX=v.clientX,e.startY=v.clientY}function s(d){if(!e.startX||!e.startY)return!0;const v="touches"in d?d.touches[0]:d;e.deltaX=Math.max(v.clientX,0)-e.startX,e.deltaY=v.clientY-e.startY,e.offsetX=Math.abs(e.deltaX),e.offsetY=Math.abs(e.deltaY);const k=10;(!n||e.offsetX<k&&e.offsetY<k)&&(n=Ce(e.offsetX,e.offsetY)),r&&(e.offsetX>me||e.offsetY>me)&&(r=!1)}function E(){e.startX=0,e.startY=0}return{pointer:e,move:s,start:m,stop:E,reset:a,isVertical:c,isHorizontal:o}}function Ue({column:e,onChange:n}){const c=Number.parseFloat(getComputedStyle(document.documentElement).fontSize)/Ie,[o,a]=f.useState(0),[m,s]=f.useState(0),E=f.useRef(0),d=f.useRef(0),v=f.useRef(0),k=f.useRef(!1),i=f.useRef(null),{pointer:h,start:R,move:x,stop:w}=f.useMemo(()=>Xe(),[]);function _(b){return b*c}function O(b){const M=e.length,y=Math.round(-b/_(J));return y<0?0:y>=M?M-1:y}function l(b){const M=-b*_(J),y=()=>n?.(b);k.current&&M!==o?i.current=y:y(),a(M)}function T(b){R(b),k.current=!0,s(0),d.current=Date.now(),E.current=o,v.current=E.current,i.current=null}function g(b){if(x(b))return;const y=e.length,D=E.current+h.deltaY,H=_((y-1)*-J),F=Math.min(Math.max(D,H),0),z=Date.now();a(F),!(z-d.current<=K)&&(d.current=z,v.current=F)}function p(){w();const b=o-v.current,M=Date.now()-d.current;if(M<K&&Math.abs(b)>De){A(b,M);return}const y=O(o);s(de),l(y),k.current=!1}function A(b,M){const y=Math.abs(b/M),D=o+y/Fe*(b<0?-1:1),H=O(D);s(K),l(H)}function N(){s(0),k.current=!1,i.current&&(i.current(),i.current=null)}function I(b,M="auto"){k.current&&M==="smooth"||(i.current=null,k.current=M==="smooth",s(M==="smooth"?de:0),l(b))}return{offsetY:o,transitionDuration:m,onPointerDown:T,onPointerMove:g,onPointerUp:p,stopInertialSliding:N,scrollToIndex:I}}function Le({column:e,fields:n,selectedIndex:r=0,onChange:c},o){const{offsetY:a,transitionDuration:m,onPointerDown:s,onPointerMove:E,onPointerUp:d,stopInertialSliding:v,scrollToIndex:k}=Ue({column:e,onChange:i});function i(x){x!==r&&c(x)}function h(x=r,w){k(x,w)}function R(x){x!==r&&h(x,"smooth")}return f.useImperativeHandle(o,()=>({scrollToSelected:h})),Y.jsx("div",{role:"presentation","aria-label":"Picker column",className:"chook-picker-column",onTouchStart:s,onTouchMove:E,onTouchEnd:d,onTouchCancel:d,onMouseDown:s,onMouseMove:E,onMouseUp:d,onMouseLeave:d,style:{overflowY:"hidden",touchAction:"none"},children:Y.jsx("ul",{style:{overflowY:"hidden",transform:`translate3d(0, ${a}px, 0)`,transitionDuration:`${m}ms`,transitionProperty:m?"all":"none",touchAction:"none"},onTransitionEnd:v,children:e.map((x,w)=>Y.jsx("div",{tabIndex:0,role:"button","aria-label":"Select option",className:"chook-picker-column-item",onClick:()=>R(w),onKeyDown:_=>{(_.key==="Enter"||_.key===" ")&&R(w)},children:Y.jsx("p",{className:"chook-picker-column-label",style:{transform:`rotate3d(1, 0, 0, ${(w*J+a)*je}deg)`},children:x?.[n.label]})},x?.[n.value]))})})}const pe=B(Le);pe.displayName="Column";function ze(e,n){const{loading:r,loadingSlot:c,columns:o,emptySlot:a,currentColumns:m,fields:s,selectedIndices:E,updateSelectedValueByIndex:d}=e,v=f.useRef([]);function k(i,h){v.current[i]?.scrollToSelected(h)}return f.useImperativeHandle(n,()=>({scrollColumnToSelected:k})),r?Y.jsxs(Y.Fragment,{children:[Y.jsx("div",{className:"chook-picker-loading",children:c}),Y.jsx("div",{className:"chook-picker-columns"})]}):o.length?Y.jsxs("div",{className:"chook-picker-columns chook-picker-columns-backdrop",onTouchMove:i=>i.stopPropagation(),children:[m.map((i,h)=>Y.jsx(pe,{ref:R=>{v.current[h]=R},column:i,fields:s,selectedIndex:E[h],onChange:R=>d(h,R)},h)),Y.jsx("div",{className:"chook-picker-mask-backdrop"})]}):Y.jsx("div",{className:"chook-picker-columns",children:a})}const he=B(ze);he.displayName="Columns";function q({values:e,columns:n,loading:r=!1,loadingSlot:c,emptySlot:o,columnsFieldNames:a,onChange:m}){const[s,E]=f.useState(e??[]),[d,v]=f.useState([]),k=f.useRef(null),i=Me(a),h=Oe(n,i),R=f.useMemo(()=>h==="single"?[n]:h==="multiple"?n:we(n,s,i),[n,h,s,i]);function x(_,O){const l=R[_],T=l[O]?.[i.value],g=s[_];if(T===g)return;const p=[...s];if(p[_]=T,h==="cascade"){const A=l[O],N=ye(A,_,p,i);E(N),m?.(N)}else E(p),m?.(p)}function w(_){return _.some((O,l)=>O!==s[l])}return f.useEffect(()=>{!e||!w(e)||E([...e])},[e]),f.useEffect(()=>{const _=R.length,O=[],l=[...s];let T=!1;for(let g=0;g<_;g++){const p=R[g],A=s[g],N=ce(p,A,i);if(N===-1){const b=(d[g]??0)>=p.length?Math.max(p.length-1,0):0;l[g]=p[b]?.[i.value],O[g]=b}else O[g]=N;O[g]!==d[g]&&(k.current?.scrollColumnToSelected(g,O[g]),T=!0)}T&&(E(l),v(O))},[s,R,i]),Y.jsx("div",{className:"chook-picker-container","aria-label":"Picker",children:Y.jsx(he,{ref:k,loading:r,loadingSlot:c,columns:n,emptySlot:o,currentColumns:R,fields:i,selectedIndices:d,updateSelectedValueByIndex:x})})}function We({values:e,columnsType:n=Ve,minDate:r=new Date(new Date().getFullYear()-10,0,1),maxDate:c=new Date(new Date().getFullYear()+10,11,31),formatYearLabel:o=Z,formatMonthLabel:a=Z,formatDayLabel:m=Z,onChange:s},E){const[d,v]=f.useState([]),k=f.useMemo(()=>e??d,[e,d]),i=f.useMemo(()=>{const l={year:h,month:R,day:x};return n.map(T=>l[T]())},[n,r,c,k,o,a,m]);function h(){const l=r.getFullYear(),T=c.getFullYear();return V(l,T,o)}function R(){const l=w("year"),T=ae(l,r)?r.getMonth()+1:1,g=ie(l,c)?c.getMonth()+1:12;return V(T,g,a)}function x(){const l=w("year"),T=w("month"),g=ae(l,r)&&Pe(T,r),p=ie(l,c)&&Ae(T,c),A=g?r.getDate():1,N=p?c.getDate():Ne(l,T);return V(A,N,m)}function w(l){const T=n.indexOf(l),g=k?.[T];return g?Number(g):ue(r,c,l)}function _(l){e||v(l),s?.(l)}function O(){const l=n.map(T=>ue(r,c,T));_(l)}return f.useEffect(()=>{(!e||!e.length)&&O()},[]),f.useImperativeHandle(E,()=>({setCurrentDate:O})),Y.jsx(q,{values:k,columns:i,onChange:_})}const ke=B(We);ke.displayName="DatePicker";function Be({values:e,columnsType:n=He,minTime:r,maxTime:c,formatHourLabel:o=Q,formatMinuteLabel:a=Q,formatSecondLabel:m=Q,onChange:s},E){const[d,v]=f.useState([]),k=f.useMemo(()=>e??d,[e,d]),i=f.useMemo(()=>le(r??"")??{hour:0,minute:0,second:0},[r]),h=f.useMemo(()=>le(c??"")??{hour:23,minute:59,second:59},[c]),R={hour:w,minute:_,second:O},x=n.map(p=>R[p]());function w(){return V(i.hour,h.hour,o)}function _(){const p=l("hour"),{hour:A,minute:N}=i,{hour:I,minute:b}=h;return V(p===A?N:0,p===I?b:59,a)}function O(){const p=l("hour"),A=l("minute"),{hour:N,minute:I,second:b}=i,{hour:M,minute:y,second:D}=h;return V(p===N&&A===I?b:0,p===M&&A===y?D:59,m)}function l(p){const A=n.indexOf(p),N=k?.[A];return N!==void 0?Number(N):fe(i,h,p)}function T(p){e||v(p),s?.(p)}function g(){const p=n.map(A=>fe(i,h,A));T(p)}return f.useEffect(()=>{(!e||!e.length)&&g()},[]),f.useImperativeHandle(E,()=>({setCurrentTime:g})),Y.jsx(q,{values:k,columns:x,onChange:T})}const ge=B(Be);ge.displayName="TimePicker",j.DatePicker=ke,j.Picker=q,j.TimePicker=ge,Object.defineProperty(j,Symbol.toStringTag,{value:"Module"})}));
|
|
7
|
+
<%s key={someKey} {...props} />`,y,C,X,C),Ee[C+y]=!0)}if(C=null,R!==void 0&&(r(R),C=""+R),d(u)&&(r(u.key),C=""+u.key),"key"in u){R={};for(var te in u)te!=="key"&&(R[te]=u[te])}else R=u;return C&&s(R,typeof t=="function"?t.displayName||t.name||"Unknown":t),m(t,C,R,c(),Z,ee)}function k(t){i(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===I&&(t._payload.status==="fulfilled"?i(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function i(t){return typeof t=="object"&&t!==null&&t.$$typeof===x}var h=f,x=Symbol.for("react.transitional.element"),O=Symbol.for("react.portal"),w=Symbol.for("react.fragment"),_=Symbol.for("react.strict_mode"),M=Symbol.for("react.profiler"),l=Symbol.for("react.consumer"),b=Symbol.for("react.context"),g=Symbol.for("react.forward_ref"),p=Symbol.for("react.suspense"),P=Symbol.for("react.suspense_list"),A=Symbol.for("react.memo"),I=Symbol.for("react.lazy"),j=Symbol.for("react.activity"),T=Symbol.for("react.client.reference"),S=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,N=Object.prototype.hasOwnProperty,H=Array.isArray,F=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(t){return t()}};var z,W={},Te=h.react_stack_bottom_frame.bind(h,a)(),ve=F(o(a)),Ee={};L.Fragment=w,L.jsx=function(t,u,R){var y=1e4>S.recentlyCreatedOwnerStacks++;return v(t,u,R,!1,y?Error("react-stack-top-frame"):Te,y?F(o(t)):ve)},L.jsxs=function(t,u,R){var y=1e4>S.recentlyCreatedOwnerStacks++;return v(t,u,R,!0,y?Error("react-stack-top-frame"):Te,y?F(o(t)):ve)}})()),L}var ce;function Re(){return ce||(ce=1,process.env.NODE_ENV==="production"?B.exports=_e():B.exports=Se()),B.exports}var Y=Re();const xe=Array.isArray;function Oe(e,n){if(ae(e))return"multiple";const[r]=e;return r?.[n.children]?"cascade":"single"}function Me(e){return{children:e?.children||"children",label:e?.label||"label",value:e?.value||"value"}}function we(e,n,r){if(ae(e))return[];const o=[];let c=e,a=0;for(;c;){const d=n[a];let s=se(c,d,r);s===-1&&(s=0),o.push(c),a+=1,c=c[s]?.[r.children]}return o}function ye(e,n,r,o){const c=[...r];let a=e,d=n+1;for(;a?.[o.children];){const s=a[o.children][0];c[d]=s.value,a=s,d+=1}return c}function se(e,n,r){return e.findIndex(o=>o?.[r.value]===n)}function ae(e){const[n]=e;return xe(n)}function Ce(e,n){return e>n?"horizontal":n>e?"vertical":""}function V(e,n,r){const o=[];for(let c=e;c<=n;c++){const a=r(`${c}`);o.push({label:a,value:c})}return o}function ie(e,n){return e===n.getFullYear()}function ue(e,n){return e===n.getFullYear()}function Pe(e,n){return e===n.getMonth()+1}function Ae(e,n){return e===n.getMonth()+1}function Ne(e,n){return new Date(e,n,0).getDate()}function le(e,n,r){const o=new Date,c=Date.now(),a=e.getTime(),d=n.getTime(),s=c>=a&&c<=d;return r==="year"?s?o.getFullYear():e.getFullYear():r==="month"?s?o.getMonth()+1:e.getMonth()+1:s?o.getDate():e.getDate()}function Q(e){return e}function Ye(e){return/^(?:[01]\d|2[0-3]):[0-5]\d:[0-5]\d$/.test(e)}function fe(e){if(!Ye(e))return null;const[n,r,o]=e.split(":");return{hour:Number(n),minute:Number(r),second:Number(o)}}function K(e){return e.padStart(2,"0")}function de(e,n,r){const o=Date.now(),{hour:c,minute:a,second:d}=e,{hour:s,minute:E,second:m}=n,v=new Date().setHours(c,a,d),k=new Date().setHours(s,E,m),i=o>=v&&o<=k;return r==="hour"?i?new Date().getHours():c:r==="minute"?i?new Date().getMinutes():a:i?new Date().getSeconds():d}function J(e){return f.forwardRef(e)}const Ie=16,G=48,je=.52,me=150,q=300,De=15,Fe=.008,pe=5,Ve=["year","month","day"],He=["hour","minute","second"];function Xe(){const e={startX:0,startY:0,deltaX:0,deltaY:0,offsetX:0,offsetY:0};let n="",r=!0;const o=()=>n==="vertical",c=()=>n==="horizontal";function a(){e.deltaX=0,e.deltaY=0,e.offsetX=0,e.offsetY=0,n="",r=!0}function d(m){const v="touches"in m?m.touches[0]:m;a(),e.startX=v.clientX,e.startY=v.clientY}function s(m){if(!e.startX||!e.startY)return!0;const v="touches"in m?m.touches[0]:m;e.deltaX=Math.max(v.clientX,0)-e.startX,e.deltaY=v.clientY-e.startY,e.offsetX=Math.abs(e.deltaX),e.offsetY=Math.abs(e.deltaY);const k=10;(!n||e.offsetX<k&&e.offsetY<k)&&(n=Ce(e.offsetX,e.offsetY)),r&&(e.offsetX>pe||e.offsetY>pe)&&(r=!1)}function E(){e.startX=0,e.startY=0}return{pointer:e,move:s,start:d,stop:E,reset:a,isVertical:o,isHorizontal:c}}function Ue({column:e,onChange:n}){const o=Number.parseFloat(getComputedStyle(document.documentElement).fontSize)/Ie,[c,a]=f.useState(0),d=f.useRef(null),s=f.useRef(0),E=f.useRef(0),m=f.useRef(0),v=f.useRef(0),k=f.useRef(!1),i=f.useRef(null),{pointer:h,start:x,move:O,stop:w}=f.useMemo(()=>Xe(),[]);function _(T){return T*o}function M(T){const S=e.length,N=Math.round(-T/_(G));return N<0?0:N>=S?S-1:N}function l(T){const S=-T*_(G),N=()=>n?.(T);k.current&&S!==s.current?i.current=N:N(),p(S)}function b(T){x(T),k.current=!0,a(0),m.current=Date.now(),E.current=s.current,v.current=E.current,i.current=null}function g(T){if(O(T))return;const N=e.length,H=E.current+h.deltaY,F=_((N-1)*-G),z=Math.min(Math.max(H,F),0),W=Date.now();p(z),!(W-m.current<=q)&&(m.current=W,v.current=z)}function p(T){s.current=T,d.current&&d.current.style.setProperty("--offset-y",`${T}`)}function P(){w();const T=s.current-v.current,S=Date.now()-m.current;if(S<q&&Math.abs(T)>De){A(T,S);return}const N=M(s.current);a(me),l(N),k.current=!1}function A(T,S){const N=Math.abs(T/S),H=s.current+N/Fe*(T<0?-1:1),F=M(H);a(q),l(F)}function I(){a(0),k.current=!1,i.current&&(i.current(),i.current=null)}function j(T,S="auto"){k.current&&S==="smooth"||(i.current=null,k.current=S==="smooth",a(S==="smooth"?me:0),l(T))}return{columnRef:d,transitionDuration:c,onPointerDown:b,onPointerMove:g,onPointerUp:P,stopInertialSliding:I,scrollToIndex:j}}function Le({column:e,fields:n,selectedIndex:r=0,onChange:o},c){const{columnRef:a,transitionDuration:d,onPointerDown:s,onPointerMove:E,onPointerUp:m,stopInertialSliding:v,scrollToIndex:k}=Ue({column:e,onChange:i});function i(O){O!==r&&o(O)}function h(O=r,w){k(O,w)}function x(O){O!==r&&h(O,"smooth")}return f.useImperativeHandle(c,()=>({scrollToSelected:h})),Y.jsx("div",{role:"presentation","aria-label":"Picker column",className:"chook-picker-column",onTouchStart:s,onTouchMove:E,onTouchEnd:m,onTouchCancel:m,onMouseDown:s,onMouseMove:E,onMouseUp:m,onMouseLeave:m,style:{overflowY:"hidden",touchAction:"none"},children:Y.jsx("ul",{ref:a,style:{overflowY:"hidden",transform:"translate3d(0, calc(var(--offset-y) * 1px), 0)",transitionDuration:`${d}ms`,transitionProperty:d?"all":"none",touchAction:"none"},onTransitionEnd:v,children:e.map((O,w)=>Y.jsx("div",{tabIndex:0,role:"button","aria-label":"Select option",className:"chook-picker-column-item",onClick:()=>x(w),onKeyDown:_=>{(_.key==="Enter"||_.key===" ")&&x(w)},children:Y.jsx("p",{className:"chook-picker-column-label",style:{transform:`rotate3d(1, 0, 0, calc((${w*G} + var(--offset-y)) * ${je}deg)`},children:O?.[n.label]})},O?.[n.value]))})})}const he=J(Le);he.displayName="Column";function ze(e,n){const{loading:r,loadingSlot:o,columns:c,emptySlot:a,currentColumns:d,fields:s,selectedIndices:E,updateSelectedValueByIndex:m}=e,v=f.useRef([]);function k(i,h){v.current[i]?.scrollToSelected(h)}return f.useImperativeHandle(n,()=>({scrollColumnToSelected:k})),r?Y.jsxs(Y.Fragment,{children:[Y.jsx("div",{className:"chook-picker-loading",children:o}),Y.jsx("div",{className:"chook-picker-columns"})]}):c.length?Y.jsxs("div",{className:"chook-picker-columns chook-picker-columns-backdrop",onTouchMove:i=>i.stopPropagation(),children:[d.map((i,h)=>Y.jsx(he,{ref:x=>{v.current[h]=x},column:i,fields:s,selectedIndex:E[h],onChange:x=>m(h,x)},h)),Y.jsx("div",{className:"chook-picker-mask-backdrop"})]}):Y.jsx("div",{className:"chook-picker-columns",children:a})}const ke=J(ze);ke.displayName="Columns";function $({values:e,columns:n,loading:r=!1,loadingSlot:o,emptySlot:c,columnsFieldNames:a,onChange:d}){const[s,E]=f.useState(e??[]),[m,v]=f.useState([]),k=f.useRef(null),i=Me(a),h=Oe(n,i),x=f.useMemo(()=>h==="single"?[n]:h==="multiple"?n:we(n,s,i),[n,h,s,i]);function O(_,M){const l=x[_],b=l[M]?.[i.value],g=s[_];if(b===g)return;const p=[...s];if(p[_]=b,h==="cascade"){const P=l[M],A=ye(P,_,p,i);E(A),d?.(A)}else E(p),d?.(p)}function w(_){return _.some((M,l)=>M!==s[l])}return f.useEffect(()=>{!e||!w(e)||E([...e])},[e]),f.useEffect(()=>{const _=x.length,M=[],l=[...s];let b=!1;for(let g=0;g<_;g++){const p=x[g],P=s[g],A=se(p,P,i);if(A===-1){const j=(m[g]??0)>=p.length?Math.max(p.length-1,0):0;l[g]=p[j]?.[i.value],M[g]=j}else M[g]=A;M[g]!==m[g]&&(k.current?.scrollColumnToSelected(g,M[g]),b=!0)}b&&(E(l),v(M))},[s,x,i]),Y.jsx("div",{className:"chook-picker-container","aria-label":"Picker",children:Y.jsx(ke,{ref:k,loading:r,loadingSlot:o,columns:n,emptySlot:c,currentColumns:x,fields:i,selectedIndices:m,updateSelectedValueByIndex:O})})}function We({values:e,columnsType:n=Ve,minDate:r=new Date(new Date().getFullYear()-10,0,1),maxDate:o=new Date(new Date().getFullYear()+10,11,31),formatYearLabel:c=Q,formatMonthLabel:a=Q,formatDayLabel:d=Q,onChange:s},E){const[m,v]=f.useState([]),k=f.useMemo(()=>e??m,[e,m]),i=f.useMemo(()=>{const l={year:h,month:x,day:O};return n.map(b=>l[b]())},[n,r,o,k,c,a,d]);function h(){const l=r.getFullYear(),b=o.getFullYear();return V(l,b,c)}function x(){const l=w("year"),b=ie(l,r)?r.getMonth()+1:1,g=ue(l,o)?o.getMonth()+1:12;return V(b,g,a)}function O(){const l=w("year"),b=w("month"),g=ie(l,r)&&Pe(b,r),p=ue(l,o)&&Ae(b,o),P=g?r.getDate():1,A=p?o.getDate():Ne(l,b);return V(P,A,d)}function w(l){const b=n.indexOf(l),g=k?.[b];return g?Number(g):le(r,o,l)}function _(l){e||v(l),s?.(l)}function M(){const l=n.map(b=>le(r,o,b));_(l)}return f.useEffect(()=>{(!e||!e.length)&&M()},[]),f.useImperativeHandle(E,()=>({setCurrentDate:M})),Y.jsx($,{values:k,columns:i,onChange:_})}const ge=J(We);ge.displayName="DatePicker";function Be({values:e,columnsType:n=He,minTime:r,maxTime:o,formatHourLabel:c=K,formatMinuteLabel:a=K,formatSecondLabel:d=K,onChange:s},E){const[m,v]=f.useState([]),k=f.useMemo(()=>e??m,[e,m]),i=f.useMemo(()=>fe(r??"")??{hour:0,minute:0,second:0},[r]),h=f.useMemo(()=>fe(o??"")??{hour:23,minute:59,second:59},[o]),x={hour:w,minute:_,second:M},O=n.map(p=>x[p]());function w(){return V(i.hour,h.hour,c)}function _(){const p=l("hour"),{hour:P,minute:A}=i,{hour:I,minute:j}=h;return V(p===P?A:0,p===I?j:59,a)}function M(){const p=l("hour"),P=l("minute"),{hour:A,minute:I,second:j}=i,{hour:T,minute:S,second:N}=h;return V(p===A&&P===I?j:0,p===T&&P===S?N:59,d)}function l(p){const P=n.indexOf(p),A=k?.[P];return A!==void 0?Number(A):de(i,h,p)}function b(p){e||v(p),s?.(p)}function g(){const p=n.map(P=>de(i,h,P));b(p)}return f.useEffect(()=>{(!e||!e.length)&&g()},[]),f.useImperativeHandle(E,()=>({setCurrentTime:g})),Y.jsx($,{values:k,columns:O,onChange:b})}const be=J(Be);be.displayName="TimePicker",D.DatePicker=ge,D.Picker=$,D.TimePicker=be,Object.defineProperty(D,Symbol.toStringTag,{value:"Module"})}));
|
package/dist/vue/picker.es.js
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import "
|
|
2
|
-
import { ref as R, readonly as Z, isRef as j, defineComponent as L, toRef as re, createElementBlock as Y, openBlock as k, unref as v, withModifiers as oe, createElementVNode as C, normalizeStyle as q, Fragment as U, renderList as le, toDisplayString as ie, mergeModels as V, useModel as $, useTemplateRef as ce, computed as I, watchEffect as me, renderSlot as J, createBlock as B, nextTick as fe } from "vue";
|
|
1
|
+
import { ref as R, readonly as Z, isRef as j, defineComponent as L, toRef as re, createElementBlock as Y, openBlock as k, unref as h, withModifiers as oe, createElementVNode as C, normalizeStyle as q, Fragment as $, renderList as se, toDisplayString as ie, mergeModels as V, useModel as U, useTemplateRef as ce, computed as I, watchEffect as me, renderSlot as J, createBlock as B, nextTick as fe } from "vue";
|
|
3
2
|
const de = Array.isArray;
|
|
4
|
-
function pe(e,
|
|
3
|
+
function pe(e, l) {
|
|
5
4
|
if (ue(e)) return "multiple";
|
|
6
5
|
const [f] = e;
|
|
7
|
-
return f?.[
|
|
6
|
+
return f?.[l.children] ? "cascade" : "single";
|
|
8
7
|
}
|
|
9
8
|
function ve(e) {
|
|
10
9
|
return {
|
|
@@ -13,80 +12,80 @@ function ve(e) {
|
|
|
13
12
|
value: e?.value || "value"
|
|
14
13
|
};
|
|
15
14
|
}
|
|
16
|
-
function he(e,
|
|
15
|
+
function he(e, l, f) {
|
|
17
16
|
if (ue(e)) return [];
|
|
18
17
|
const o = [];
|
|
19
18
|
let u = e, i = 0;
|
|
20
19
|
for (; u; ) {
|
|
21
|
-
const
|
|
22
|
-
let m =
|
|
20
|
+
const v = l[i];
|
|
21
|
+
let m = le(u, v, f);
|
|
23
22
|
m === -1 && (m = 0), o.push(u), i += 1, u = u[m]?.[f.children];
|
|
24
23
|
}
|
|
25
24
|
return o;
|
|
26
25
|
}
|
|
27
|
-
function ge(e,
|
|
26
|
+
function ge(e, l, f, o) {
|
|
28
27
|
const u = [...f];
|
|
29
|
-
let i = e,
|
|
28
|
+
let i = e, v = l + 1;
|
|
30
29
|
for (; i?.[o.children]; ) {
|
|
31
30
|
const m = i[o.children][0];
|
|
32
|
-
u[
|
|
31
|
+
u[v] = m.value, i = m, v += 1;
|
|
33
32
|
}
|
|
34
33
|
return u;
|
|
35
34
|
}
|
|
36
|
-
function
|
|
37
|
-
return e.findIndex((o) => o?.[f.value] ===
|
|
35
|
+
function le(e, l, f) {
|
|
36
|
+
return e.findIndex((o) => o?.[f.value] === l);
|
|
38
37
|
}
|
|
39
38
|
function ue(e) {
|
|
40
|
-
const [
|
|
41
|
-
return de(
|
|
39
|
+
const [l] = e;
|
|
40
|
+
return de(l);
|
|
42
41
|
}
|
|
43
|
-
function Te(e,
|
|
44
|
-
return e >
|
|
42
|
+
function Te(e, l) {
|
|
43
|
+
return e > l ? "horizontal" : l > e ? "vertical" : "";
|
|
45
44
|
}
|
|
46
|
-
function b(e,
|
|
45
|
+
function b(e, l, f) {
|
|
47
46
|
const o = [];
|
|
48
|
-
for (let u = e; u <=
|
|
47
|
+
for (let u = e; u <= l; u++) {
|
|
49
48
|
const i = f(`${u}`);
|
|
50
49
|
o.push({ label: i, value: u });
|
|
51
50
|
}
|
|
52
51
|
return o;
|
|
53
52
|
}
|
|
54
|
-
function Q(e,
|
|
55
|
-
return e ===
|
|
53
|
+
function Q(e, l) {
|
|
54
|
+
return e === l.getFullYear();
|
|
56
55
|
}
|
|
57
|
-
function W(e,
|
|
58
|
-
return e ===
|
|
56
|
+
function W(e, l) {
|
|
57
|
+
return e === l.getFullYear();
|
|
59
58
|
}
|
|
60
|
-
function Me(e,
|
|
61
|
-
return e ===
|
|
59
|
+
function Me(e, l) {
|
|
60
|
+
return e === l.getMonth() + 1;
|
|
62
61
|
}
|
|
63
|
-
function xe(e,
|
|
64
|
-
return e ===
|
|
62
|
+
function xe(e, l) {
|
|
63
|
+
return e === l.getMonth() + 1;
|
|
65
64
|
}
|
|
66
|
-
function
|
|
67
|
-
return new Date(e,
|
|
65
|
+
function ye(e, l) {
|
|
66
|
+
return new Date(e, l, 0).getDate();
|
|
68
67
|
}
|
|
69
|
-
function _(e,
|
|
70
|
-
const o = /* @__PURE__ */ new Date(), u = Date.now(), i = e.getTime(),
|
|
68
|
+
function _(e, l, f) {
|
|
69
|
+
const o = /* @__PURE__ */ new Date(), u = Date.now(), i = e.getTime(), v = l.getTime(), m = u >= i && u <= v;
|
|
71
70
|
return f === "year" ? m ? o.getFullYear() : e.getFullYear() : f === "month" ? m ? o.getMonth() + 1 : e.getMonth() + 1 : m ? o.getDate() : e.getDate();
|
|
72
71
|
}
|
|
73
72
|
function N(e) {
|
|
74
73
|
return e;
|
|
75
74
|
}
|
|
76
|
-
function
|
|
75
|
+
function De(e) {
|
|
77
76
|
return /^(?:[01]\d|2[0-3]):[0-5]\d:[0-5]\d$/.test(e);
|
|
78
77
|
}
|
|
79
78
|
function ee(e) {
|
|
80
|
-
if (!
|
|
81
|
-
const [
|
|
82
|
-
return { hour: Number(
|
|
79
|
+
if (!De(e)) return null;
|
|
80
|
+
const [l, f, o] = e.split(":");
|
|
81
|
+
return { hour: Number(l), minute: Number(f), second: Number(o) };
|
|
83
82
|
}
|
|
84
83
|
function H(e) {
|
|
85
84
|
return e.padStart(2, "0");
|
|
86
85
|
}
|
|
87
|
-
function te(e,
|
|
88
|
-
const o = Date.now(), { hour: u, minute: i, second:
|
|
89
|
-
return f === "hour" ? r ? (/* @__PURE__ */ new Date()).getHours() : u : f === "minute" ? r ? (/* @__PURE__ */ new Date()).getMinutes() : i : r ? (/* @__PURE__ */ new Date()).getSeconds() :
|
|
86
|
+
function te(e, l, f) {
|
|
87
|
+
const o = Date.now(), { hour: u, minute: i, second: v } = e, { hour: m, minute: d, second: p } = l, g = (/* @__PURE__ */ new Date()).setHours(u, i, v), M = (/* @__PURE__ */ new Date()).setHours(m, d, p), r = o >= g && o <= M;
|
|
88
|
+
return f === "hour" ? r ? (/* @__PURE__ */ new Date()).getHours() : u : f === "minute" ? r ? (/* @__PURE__ */ new Date()).getMinutes() : i : r ? (/* @__PURE__ */ new Date()).getSeconds() : v;
|
|
90
89
|
}
|
|
91
90
|
const ke = 16, F = 48, Se = 0.52, ne = 150, X = 300, Ye = 15, Ie = 8e-3, Oe = ["year", "month", "day"], be = ["hour", "minute", "second"];
|
|
92
91
|
function Ve() {
|
|
@@ -98,28 +97,28 @@ function Ve() {
|
|
|
98
97
|
offsetX: 0,
|
|
99
98
|
offsetY: 0
|
|
100
99
|
};
|
|
101
|
-
let
|
|
102
|
-
const f = () =>
|
|
100
|
+
let l = "";
|
|
101
|
+
const f = () => l === "vertical", o = () => l === "horizontal";
|
|
103
102
|
function u() {
|
|
104
|
-
e.deltaX = 0, e.deltaY = 0, e.offsetX = 0, e.offsetY = 0,
|
|
103
|
+
e.deltaX = 0, e.deltaY = 0, e.offsetX = 0, e.offsetY = 0, l = "";
|
|
105
104
|
}
|
|
106
105
|
function i(d) {
|
|
107
106
|
const p = "touches" in d ? d.touches[0] : d;
|
|
108
107
|
u(), e.startX = p.clientX, e.startY = p.clientY;
|
|
109
108
|
}
|
|
110
|
-
function
|
|
109
|
+
function v(d) {
|
|
111
110
|
if (!e.startX || !e.startY) return !0;
|
|
112
111
|
const p = "touches" in d ? d.touches[0] : d;
|
|
113
112
|
e.deltaX = Math.max(p.clientX, 0) - e.startX, e.deltaY = p.clientY - e.startY, e.offsetX = Math.abs(e.deltaX), e.offsetY = Math.abs(e.deltaY);
|
|
114
113
|
const g = 10;
|
|
115
|
-
(!
|
|
114
|
+
(!l || e.offsetX < g && e.offsetY < g) && (l = Te(e.offsetX, e.offsetY));
|
|
116
115
|
}
|
|
117
116
|
function m() {
|
|
118
117
|
e.startX = 0, e.startY = 0;
|
|
119
118
|
}
|
|
120
119
|
return {
|
|
121
120
|
pointer: e,
|
|
122
|
-
move:
|
|
121
|
+
move: v,
|
|
123
122
|
start: i,
|
|
124
123
|
stop: m,
|
|
125
124
|
reset: u,
|
|
@@ -127,47 +126,47 @@ function Ve() {
|
|
|
127
126
|
isHorizontal: o
|
|
128
127
|
};
|
|
129
128
|
}
|
|
130
|
-
function Ce({ column: e, onChange:
|
|
131
|
-
const o = Number.parseFloat(getComputedStyle(document.documentElement).fontSize) / ke, u = R(0), i = R(0), { pointer:
|
|
132
|
-
let g = 0, M = 0, r = 0,
|
|
129
|
+
function Ce({ column: e, onChange: l }) {
|
|
130
|
+
const o = Number.parseFloat(getComputedStyle(document.documentElement).fontSize) / ke, u = R(0), i = R(0), { pointer: v, start: m, move: d, stop: p } = Ve();
|
|
131
|
+
let g = 0, M = 0, r = 0, s = !1, t = null;
|
|
133
132
|
function n(T) {
|
|
134
|
-
m(T),
|
|
133
|
+
m(T), s = !0, i.value = 0, M = Date.now(), g = u.value, r = g, t = null;
|
|
135
134
|
}
|
|
136
135
|
function a(T) {
|
|
137
136
|
if (d(T)) return;
|
|
138
|
-
const
|
|
137
|
+
const D = j(e) ? e.value.length : e.length, E = g + v.deltaY, A = P((D - 1) * -F), G = Math.min(Math.max(E, A), 0), K = Date.now();
|
|
139
138
|
u.value = G, !(K - M <= X) && (M = K, r = G);
|
|
140
139
|
}
|
|
141
140
|
function c() {
|
|
142
141
|
p();
|
|
143
142
|
const T = u.value - r, x = Date.now() - M;
|
|
144
143
|
if (x < X && Math.abs(T) > Ye) {
|
|
145
|
-
|
|
144
|
+
y(T, x);
|
|
146
145
|
return;
|
|
147
146
|
}
|
|
148
|
-
const
|
|
149
|
-
i.value = ne, O(
|
|
147
|
+
const D = w(u.value);
|
|
148
|
+
i.value = ne, O(D), s = !1;
|
|
150
149
|
}
|
|
151
|
-
function
|
|
152
|
-
const
|
|
150
|
+
function y(T, x) {
|
|
151
|
+
const D = Math.abs(T / x), E = u.value + D / Ie * (T < 0 ? -1 : 1), A = w(E);
|
|
153
152
|
i.value = X, O(A);
|
|
154
153
|
}
|
|
155
154
|
function S() {
|
|
156
|
-
i.value = 0,
|
|
155
|
+
i.value = 0, s = !1, t && (t(), t = null);
|
|
157
156
|
}
|
|
158
157
|
function O(T) {
|
|
159
|
-
const x = -T * P(F),
|
|
160
|
-
|
|
158
|
+
const x = -T * P(F), D = () => l?.(T);
|
|
159
|
+
s && x !== u.value ? t = D : D(), u.value = x;
|
|
161
160
|
}
|
|
162
161
|
function w(T) {
|
|
163
|
-
const x = j(e) ? e.value.length : e.length,
|
|
164
|
-
return
|
|
162
|
+
const x = j(e) ? e.value.length : e.length, D = Math.round(-T / P(F));
|
|
163
|
+
return D < 0 ? 0 : D >= x ? x - 1 : D;
|
|
165
164
|
}
|
|
166
165
|
function P(T) {
|
|
167
166
|
return T * o;
|
|
168
167
|
}
|
|
169
168
|
function z(T, x = "auto") {
|
|
170
|
-
|
|
169
|
+
s && x === "smooth" || (t = null, s = x === "smooth", i.value = x === "smooth" ? ne : 0, O(T));
|
|
171
170
|
}
|
|
172
171
|
return {
|
|
173
172
|
offsetY: Z(u),
|
|
@@ -187,64 +186,65 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
187
186
|
selectedIndex: { default: 0 }
|
|
188
187
|
},
|
|
189
188
|
emits: ["change"],
|
|
190
|
-
setup(e, { expose:
|
|
191
|
-
const o = e, u = f, { offsetY: i, transitionDuration:
|
|
189
|
+
setup(e, { expose: l, emit: f }) {
|
|
190
|
+
const o = e, u = f, { offsetY: i, transitionDuration: v, onPointerDown: m, onPointerMove: d, onPointerUp: p, stopInertialSliding: g, scrollToIndex: M } = Ce({
|
|
192
191
|
column: re(o, "column"),
|
|
193
192
|
onChange: r
|
|
194
193
|
});
|
|
195
194
|
function r(n) {
|
|
196
195
|
n !== o.selectedIndex && u("change", n);
|
|
197
196
|
}
|
|
198
|
-
function
|
|
197
|
+
function s(n = o.selectedIndex, a) {
|
|
199
198
|
M(n, a);
|
|
200
199
|
}
|
|
201
200
|
function t(n) {
|
|
202
|
-
n !== o.selectedIndex &&
|
|
201
|
+
n !== o.selectedIndex && s(n, "smooth");
|
|
203
202
|
}
|
|
204
|
-
return
|
|
203
|
+
return l({ scrollToSelected: s }), (n, a) => (k(), Y("div", {
|
|
205
204
|
class: "chook-picker-column",
|
|
206
205
|
"aria-label": "Picker column",
|
|
207
206
|
onTouchstartPassive: a[1] || (a[1] = //@ts-ignore
|
|
208
|
-
(...c) =>
|
|
207
|
+
(...c) => h(m) && h(m)(...c)),
|
|
209
208
|
onTouchmove: a[2] || (a[2] = oe(
|
|
210
209
|
//@ts-ignore
|
|
211
|
-
(...c) =>
|
|
210
|
+
(...c) => h(d) && h(d)(...c),
|
|
212
211
|
["prevent"]
|
|
213
212
|
)),
|
|
214
213
|
onTouchendPassive: a[3] || (a[3] = //@ts-ignore
|
|
215
|
-
(...c) =>
|
|
214
|
+
(...c) => h(p) && h(p)(...c)),
|
|
216
215
|
onTouchcancel: a[4] || (a[4] = //@ts-ignore
|
|
217
|
-
(...c) =>
|
|
216
|
+
(...c) => h(p) && h(p)(...c)),
|
|
218
217
|
onMousedownPassive: a[5] || (a[5] = //@ts-ignore
|
|
219
|
-
(...c) =>
|
|
218
|
+
(...c) => h(m) && h(m)(...c)),
|
|
220
219
|
onMousemovePassive: a[6] || (a[6] = //@ts-ignore
|
|
221
|
-
(...c) =>
|
|
220
|
+
(...c) => h(d) && h(d)(...c)),
|
|
222
221
|
onMouseupPassive: a[7] || (a[7] = //@ts-ignore
|
|
223
|
-
(...c) =>
|
|
222
|
+
(...c) => h(p) && h(p)(...c)),
|
|
224
223
|
onMouseleavePassive: a[8] || (a[8] = //@ts-ignore
|
|
225
|
-
(...c) =>
|
|
224
|
+
(...c) => h(p) && h(p)(...c))
|
|
226
225
|
}, [
|
|
227
226
|
C("ul", {
|
|
228
227
|
style: q({
|
|
229
228
|
overflowY: "hidden",
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
229
|
+
"--offset-y": `${h(i)}`,
|
|
230
|
+
transform: "translate3d(0, calc(var(--offset-y) * 1px), 0)",
|
|
231
|
+
transitionDuration: `${h(v)}ms`,
|
|
232
|
+
transitionProperty: h(v) ? "all" : "none"
|
|
233
233
|
}),
|
|
234
234
|
onTransitionend: a[0] || (a[0] = //@ts-ignore
|
|
235
|
-
(...c) =>
|
|
235
|
+
(...c) => h(g) && h(g)(...c))
|
|
236
236
|
}, [
|
|
237
|
-
(k(!0), Y(
|
|
237
|
+
(k(!0), Y($, null, se(e.column, (c, y) => (k(), Y("li", {
|
|
238
238
|
key: c?.[e.fields.value],
|
|
239
239
|
class: "chook-picker-column-item",
|
|
240
240
|
role: "button",
|
|
241
241
|
tabindex: "0",
|
|
242
|
-
onClick: (S) => t(
|
|
242
|
+
onClick: (S) => t(y)
|
|
243
243
|
}, [
|
|
244
244
|
C("p", {
|
|
245
245
|
class: "chook-picker-column-label",
|
|
246
246
|
style: q({
|
|
247
|
-
transform: `rotate3d(1, 0, 0, ${
|
|
247
|
+
transform: `rotate3d(1, 0, 0, calc((${y * h(F)} + var(--offset-y)) * ${h(Se)}deg)`
|
|
248
248
|
})
|
|
249
249
|
}, ie(c?.[e.fields.label]), 5)
|
|
250
250
|
], 8, we))), 128))
|
|
@@ -268,18 +268,18 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
268
268
|
modelModifiers: {}
|
|
269
269
|
}),
|
|
270
270
|
emits: /* @__PURE__ */ V(["change"], ["update:modelValue"]),
|
|
271
|
-
setup(e, { emit:
|
|
272
|
-
const f = e, o =
|
|
271
|
+
setup(e, { emit: l }) {
|
|
272
|
+
const f = e, o = l, u = U(e, "modelValue"), i = R([]), v = ce("columnsRef"), m = I(() => ve(f.columnsFieldNames)), d = I(() => pe(f.columns, m.value)), p = I(() => {
|
|
273
273
|
const { columns: r } = f;
|
|
274
274
|
return d.value === "single" ? [r] : d.value === "multiple" ? r : he(r, u.value, m.value);
|
|
275
275
|
});
|
|
276
|
-
function g(r,
|
|
277
|
-
const t = p.value[r], n = t[
|
|
276
|
+
function g(r, s) {
|
|
277
|
+
const t = p.value[r], n = t[s]?.[m.value.value], a = u.value[r];
|
|
278
278
|
if (n === a) return;
|
|
279
279
|
const c = [...u.value];
|
|
280
280
|
if (c[r] = n, d.value === "cascade") {
|
|
281
|
-
const
|
|
282
|
-
u.value = ge(
|
|
281
|
+
const y = t[s];
|
|
282
|
+
u.value = ge(y, r, c, m.value);
|
|
283
283
|
} else
|
|
284
284
|
u.value = c;
|
|
285
285
|
fe(() => {
|
|
@@ -287,46 +287,46 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
287
287
|
});
|
|
288
288
|
}
|
|
289
289
|
function M() {
|
|
290
|
-
const r = p.value.length,
|
|
290
|
+
const r = p.value.length, s = [];
|
|
291
291
|
for (let t = 0; t < r; t++) {
|
|
292
|
-
const n = p.value[t], a = u.value[t], c =
|
|
292
|
+
const n = p.value[t], a = u.value[t], c = le(n, a, m.value);
|
|
293
293
|
if (c === -1) {
|
|
294
294
|
const S = (i.value[t] ?? 0) >= n.length ? Math.max(n.length - 1, 0) : 0;
|
|
295
|
-
u.value[t] = n[S]?.[m.value.value],
|
|
295
|
+
u.value[t] = n[S]?.[m.value.value], s[t] = S;
|
|
296
296
|
} else
|
|
297
|
-
|
|
298
|
-
|
|
297
|
+
s[t] = c;
|
|
298
|
+
s[t] !== i.value[t] && v.value?.[t]?.scrollToSelected(s[t]);
|
|
299
299
|
}
|
|
300
|
-
i.value =
|
|
300
|
+
i.value = s;
|
|
301
301
|
}
|
|
302
302
|
return me(
|
|
303
303
|
() => {
|
|
304
304
|
M();
|
|
305
305
|
},
|
|
306
306
|
{ flush: "post" }
|
|
307
|
-
), (r,
|
|
308
|
-
e.loading ? (k(), Y(
|
|
307
|
+
), (r, s) => (k(), Y("div", Fe, [
|
|
308
|
+
e.loading ? (k(), Y($, { key: 0 }, [
|
|
309
309
|
C("div", Le, [
|
|
310
310
|
J(r.$slots, "loading")
|
|
311
311
|
]),
|
|
312
|
-
|
|
312
|
+
s[1] || (s[1] = C("div", { class: "chook-picker-columns" }, null, -1))
|
|
313
313
|
], 64)) : e.columns.length ? (k(), Y("div", {
|
|
314
314
|
key: 2,
|
|
315
315
|
class: "chook-picker-columns chook-picker-columns-backdrop",
|
|
316
|
-
onTouchmove:
|
|
316
|
+
onTouchmove: s[0] || (s[0] = oe(() => {
|
|
317
317
|
}, ["stop"]))
|
|
318
318
|
}, [
|
|
319
|
-
(k(!0), Y(
|
|
319
|
+
(k(!0), Y($, null, se(p.value, (t, n) => (k(), B(Pe, {
|
|
320
320
|
key: n,
|
|
321
321
|
ref_for: !0,
|
|
322
322
|
ref_key: "columnsRef",
|
|
323
|
-
ref:
|
|
323
|
+
ref: v,
|
|
324
324
|
column: t,
|
|
325
325
|
fields: m.value,
|
|
326
326
|
"selected-index": i.value[n],
|
|
327
327
|
onChange: (a) => g(n, a)
|
|
328
328
|
}, null, 8, ["column", "fields", "selected-index", "onChange"]))), 128)),
|
|
329
|
-
|
|
329
|
+
s[2] || (s[2] = C("div", { class: "chook-picker-mask-backdrop" }, null, -1))
|
|
330
330
|
], 32)) : (k(), Y("div", Ee, [
|
|
331
331
|
J(r.$slots, "empty")
|
|
332
332
|
]))
|
|
@@ -346,43 +346,43 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
346
346
|
modelModifiers: {}
|
|
347
347
|
}),
|
|
348
348
|
emits: /* @__PURE__ */ V(["change"], ["update:modelValue"]),
|
|
349
|
-
setup(e, { expose:
|
|
350
|
-
const o = e, u = f, i =
|
|
351
|
-
const { columnsType: r, minDate:
|
|
349
|
+
setup(e, { expose: l, emit: f }) {
|
|
350
|
+
const o = e, u = f, i = U(e, "modelValue"), v = I(() => {
|
|
351
|
+
const { columnsType: r, minDate: s, maxDate: t } = o, n = {
|
|
352
352
|
year: m,
|
|
353
353
|
month: d,
|
|
354
354
|
day: p
|
|
355
355
|
};
|
|
356
|
-
return r.map((a) => n[a](
|
|
356
|
+
return r.map((a) => n[a](s, t));
|
|
357
357
|
});
|
|
358
358
|
i.value.length || M();
|
|
359
|
-
function m(r,
|
|
360
|
-
const t = r.getFullYear(), n =
|
|
359
|
+
function m(r, s) {
|
|
360
|
+
const t = r.getFullYear(), n = s.getFullYear();
|
|
361
361
|
return b(t, n, o.formatYearLabel);
|
|
362
362
|
}
|
|
363
|
-
function d(r,
|
|
364
|
-
const t = g("year"), n = Q(t, r) ? r.getMonth() + 1 : 1, a = W(t,
|
|
363
|
+
function d(r, s) {
|
|
364
|
+
const t = g("year"), n = Q(t, r) ? r.getMonth() + 1 : 1, a = W(t, s) ? s.getMonth() + 1 : 12;
|
|
365
365
|
return b(n, a, o.formatMonthLabel);
|
|
366
366
|
}
|
|
367
|
-
function p(r,
|
|
368
|
-
const t = g("year"), n = g("month"), a = Q(t, r) && Me(n, r), c = W(t,
|
|
369
|
-
return b(
|
|
367
|
+
function p(r, s) {
|
|
368
|
+
const t = g("year"), n = g("month"), a = Q(t, r) && Me(n, r), c = W(t, s) && xe(n, s), y = a ? r.getDate() : 1, S = c ? s.getDate() : ye(t, n);
|
|
369
|
+
return b(y, S, o.formatDayLabel);
|
|
370
370
|
}
|
|
371
371
|
function g(r) {
|
|
372
|
-
const { columnsType:
|
|
372
|
+
const { columnsType: s } = o, t = s.indexOf(r), n = i.value[t];
|
|
373
373
|
return n ? Number(n) : _(o.minDate, o.maxDate, r);
|
|
374
374
|
}
|
|
375
375
|
function M() {
|
|
376
376
|
const { columnsType: r } = o;
|
|
377
|
-
i.value = r.map((
|
|
377
|
+
i.value = r.map((s) => _(o.minDate, o.maxDate, s));
|
|
378
378
|
}
|
|
379
|
-
return
|
|
379
|
+
return l({
|
|
380
380
|
setCurrentDate: M
|
|
381
|
-
}), (r,
|
|
381
|
+
}), (r, s) => (k(), B(ae, {
|
|
382
382
|
modelValue: i.value,
|
|
383
|
-
"onUpdate:modelValue":
|
|
384
|
-
columns:
|
|
385
|
-
onChange:
|
|
383
|
+
"onUpdate:modelValue": s[0] || (s[0] = (t) => i.value = t),
|
|
384
|
+
columns: v.value,
|
|
385
|
+
onChange: s[1] || (s[1] = (t) => u("change", t))
|
|
386
386
|
}, null, 8, ["modelValue", "columns"]));
|
|
387
387
|
}
|
|
388
388
|
}), He = /* @__PURE__ */ L({
|
|
@@ -399,8 +399,8 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
399
399
|
modelModifiers: {}
|
|
400
400
|
}),
|
|
401
401
|
emits: /* @__PURE__ */ V(["change"], ["update:modelValue"]),
|
|
402
|
-
setup(e, { expose:
|
|
403
|
-
const o = e, u = f, i =
|
|
402
|
+
setup(e, { expose: l, emit: f }) {
|
|
403
|
+
const o = e, u = f, i = U(e, "modelValue"), v = I(() => {
|
|
404
404
|
const { columnsType: t } = o, n = {
|
|
405
405
|
hour: p,
|
|
406
406
|
minute: g,
|
|
@@ -408,33 +408,33 @@ const we = ["onClick"], Pe = /* @__PURE__ */ L({
|
|
|
408
408
|
};
|
|
409
409
|
return t.map((a) => n[a]());
|
|
410
410
|
}), m = I(() => ee(o.minTime ?? "") ?? { hour: 0, minute: 0, second: 0 }), d = I(() => ee(o.maxTime ?? "") ?? { hour: 23, minute: 59, second: 59 });
|
|
411
|
-
i.value.length ||
|
|
411
|
+
i.value.length || s();
|
|
412
412
|
function p() {
|
|
413
413
|
const t = m.value.hour, n = d.value.hour;
|
|
414
414
|
return b(t, n, o.formatHourLabel);
|
|
415
415
|
}
|
|
416
416
|
function g() {
|
|
417
|
-
const t = r("hour"), { hour: n, minute: a } = m.value, { hour: c, minute:
|
|
418
|
-
return b(t === n ? a : 0, t === c ?
|
|
417
|
+
const t = r("hour"), { hour: n, minute: a } = m.value, { hour: c, minute: y } = d.value;
|
|
418
|
+
return b(t === n ? a : 0, t === c ? y : 59, o.formatMinuteLabel);
|
|
419
419
|
}
|
|
420
420
|
function M() {
|
|
421
|
-
const t = r("hour"), n = r("minute"), { hour: a, minute: c, second:
|
|
422
|
-
return b(t === a && n === c ?
|
|
421
|
+
const t = r("hour"), n = r("minute"), { hour: a, minute: c, second: y } = m.value, { hour: S, minute: O, second: w } = d.value;
|
|
422
|
+
return b(t === a && n === c ? y : 0, t === S && n === O ? w : 59, o.formatSecondLabel);
|
|
423
423
|
}
|
|
424
424
|
function r(t) {
|
|
425
425
|
const { columnsType: n } = o, a = n.indexOf(t), c = i.value[a];
|
|
426
426
|
return c !== void 0 ? Number(c) : te(m.value, d.value, t);
|
|
427
427
|
}
|
|
428
|
-
function
|
|
428
|
+
function s() {
|
|
429
429
|
const { columnsType: t } = o;
|
|
430
430
|
i.value = t.map((n) => te(m.value, d.value, n));
|
|
431
431
|
}
|
|
432
|
-
return
|
|
433
|
-
setCurrentTime:
|
|
432
|
+
return l({
|
|
433
|
+
setCurrentTime: s
|
|
434
434
|
}), (t, n) => (k(), B(ae, {
|
|
435
435
|
modelValue: i.value,
|
|
436
436
|
"onUpdate:modelValue": n[0] || (n[0] = (a) => i.value = a),
|
|
437
|
-
columns:
|
|
437
|
+
columns: v.value,
|
|
438
438
|
onChange: n[1] || (n[1] = (a) => u("change", a))
|
|
439
439
|
}, null, 8, ["modelValue", "columns"]));
|
|
440
440
|
}
|