amotify 0.3.32 → 0.3.33

package/dist/fn/Input/Slider.d.ts

@@ -12,6 +12,7 @@ declare namespace Slider {
             disabled?: boolean;
             value?: number | [number, number];
             color?: Color;
+            trackIcon?: ReactElement | [ReactElement, ReactElement];
             /**
              * default min
              */

package/dist/fn/Input/Slider.js

@@ -1 +1 @@
-import{b as d,c as h,d as F,e as P}from"../../chunk-C5N2D3ZX.js";import{Fragment as ee,jsx as m,jsxs as C}from"react/jsx-runtime";import x,{UUID as E}from"jmini";import{useState as W,useEffect as K}from"react";import{$$fromRoot as _,GenerateHTMLProps as $}from"../../@utils";import{Box as b,Flex as q,Column as z}from"../../atoms";import{Literal as O}from"../../mols";import{Button as Y}from"../Trigger";import{OptionalInputWrapper as G,BoxWrapper as j,CoreEffects as X}from"./core";import{InputSliderClasses as M}from"../../@styles/componentClasses";function Q(e){let{value:n,states:t}=e,{required:l}=t,a=[],[o,r]=x.Arrayify(n);return l&&!o&&!r&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:i})=>i=="invalid").length,notice:a}}const f={getOffsetLeft:e=>{let{trackMin:n,min:t,max:l,value:a}=e,o=(a-(n!=null?n:t))/(l-(n!=null?n:t));return Math.min(o,1)*100},normalize:e=>{let{min:n,max:t,step:l,value:a}=e;a=Math.max(a,n),a=Math.min(a,t);let o=Math.round(a/l)*l;return{value:o,offsetLeft:f.getOffsetLeft(h(d({},e),{value:o}))}},Effects:{Start:(e,n)=>{let t=x.getCursor(e).x,{val_status:l}=n,{componentId:a}=l,o=_("#"+a+"_Bar"),{width:r,left:i}=o.position(),c=(t-i)/r;c=Math.max(c,0),c=Math.min(c,1);let u=c*l.max;x(document).onEvent("mousemove",p=>{f.Effects.Move(p,n,u)},{eventID:"SliderMouseMove",passive:!1}).onEvent("touchmove",p=>{f.Effects.Move(p,n,u)},{eventID:"SliderTouchMove",passive:!1}).onEvent("mouseup",()=>{f.Effects.End()},{eventID:"SliderMouseUp"}).onEvent("touchend",()=>{f.Effects.End()},{eventID:"SliderTouchEnd"})},Move:(e,n,t)=>{var I;let l=x.getCursor(e).x,{val_status:a}=n,{componentId:o}=a,r=_("#"+o+"_Bar"),{width:i,left:c}=r.position(),u=(l-c)/i;u=Math.max(u,0),u=Math.min(u,1);let p=(I=a.trackMin)!=null?I:a.min,v=u*(a.max-p)+p,S=f.normalize(h(d({},a),{value:v})).value,s=Math.round(v-t);return n.onChange(S,s),e.preventDefault(),e.stopPropagation(),!1},End:()=>{x(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},Rail:e=>{let{rootStates:n,val_status:t,set_status:l}=e,{componentId:a}=t,o=2;n.size=="small"?o=1.5:n.size=="large"&&(o=2.5);let r=[f.normalize(h(d({},t),{value:t.safeValue[0]})),f.normalize(h(d({},t),{value:t.safeValue[1]||0}))];const i=(c,u)=>{let{min:p,max:v,step:g}=t;c=Math.max(Math.min(c,v),p),l(S=>{let s=d({},S);return s.safeValue[u]==c?s:(s.safeValue[u]=c,t.ranged&&s.safeValue[0]>s.safeValue[1]&&(s.safeValue=[s.safeValue[1],s.safeValue[0]]),h(d({},s),{rawValue:s.ranged?s.safeValue:s.safeValue[0],eventType:"update",eventID:E(12),isInspected:!1}))})};return m(z,{padding:[1,"1/2"],onPointerDown:c=>{e.rootStates.disabled||(c.stopPropagation(),!t.ranged&&f.Effects.Start(c,{val_status:t,onChange:u=>{i(u,0)}}))},children:C(b,{className:M("Bar"),height:0,position:"relative",transition:"middle",flexSizing:"none",id:a+"_Bar",children:[m(b,{position:"absolute",isRounded:!0,backgroundColor:"cloud",xcss:{top:-2*o,left:-2*o,right:-2*o,bottom:-2*o}}),m(f.Range,{rootStates:n,val_status:t,set_status:l,formatData:r,onUpdateValue:i}),m(f.DiscreteScale,{rootStates:n,val_status:t}),m(f.Edge,{focusIndex:0,rootStates:n,val_status:t,set_status:l,formatData:r[0],onUpdateValue:i}),t.ranged&&m(f.Edge,{focusIndex:1,rootStates:n,val_status:t,set_status:l,formatData:r[1],onUpdateValue:i})]})})},DiscreteScale:e=>{let{rootStates:n,val_status:t}=e;if(!n.discreteScale)return null;let{trackMin:l,min:a,max:o,step:r}=t,i=Math.round(a/r),u=Math.round(o/r)-i+1,p=0,v=t.safeValue[0]||0;return t.ranged&&(p=t.safeValue[0]||0,v=t.safeValue[1]||0),m(ee,{children:Array.from({length:u},(g,S)=>S+i).map(g=>{let S=g*r;S=Math.max(S,a),S=Math.min(S,o);let s=f.getOffsetLeft(h(d({},t),{value:S}))+"%",I=x.isInRange(S,p,v);return m(z,{gap:0,position:"absolute",verticalAlign:"center",horizontalAlign:"center",width:0,height:0,transition:"middle",fontColor:"1.clear",xcss:{pointerEvents:"none",top:"50%",left:s,transform:"translateY(-50%)"},children:m(b,{isRounded:!0,backgroundColor:I?"layer.0":"gray",ssSphere:"1/4"})},S)})})},Range:e=>{let{rootStates:n,formatData:t,val_status:l}=e,a=2;return n.size=="small"?a=1.5:n.size=="large"&&(a=2.5),C(b,{className:M("Range"),position:"absolute",transition:"middle",xcss:d({cursor:"pointer",top:"50%",transform:"translateY(-50%)"},l.ranged?{left:t[0].offsetLeft+"%",width:t[1].offsetLeft-t[0].offsetLeft+"%"}:{left:0,width:(t[0].offsetLeft||0)+"%"}),onPointerDown:o=>{if(!e.rootStates.disabled){if(o.stopPropagation(),l.ranged){let[r,i]=l.safeValue;o.stopPropagation(),f.Effects.Start(o,{val_status:l,onChange:(c,u)=>{e.set_status(p=>{let v=p.safeValue,g=d({},p);return g.safeValue=[f.normalize(h(d({},l),{value:r+u})).value,f.normalize(h(d({},l),{value:i+u})).value],g.safeValue[0]==v[0]&&g.safeValue[1]==v[1]?h(d({},p),{eventType:"update",eventID:E(12)}):h(d({},g),{rawValue:g.ranged?g.safeValue:g.safeValue[0],eventType:"update",eventID:E(12),isInspected:!1})})}});return}f.Effects.Start(o,{val_status:l,onChange:r=>{e.onUpdateValue(r,0)}})}},children:[m(b,{className:M("Field"),transition:"middle",position:"absolute",isRounded:!0,backgroundColor:n.color,xcss:{top:-6*a,bottom:-6*a,left:-6*a,right:-6*a}}),m(b,{className:M("Child"),transition:"middle",position:"absolute",isRounded:!0,backgroundColor:n.color,xcss:{pointerEvents:"none",top:-2*a,left:-2*a,right:-2*a,bottom:-2*a}})]})},Edge:e=>{let{formatData:n,rootStates:t,val_status:l,set_status:a}=e,o=2;return t.size=="small"?o=1.5:t.size=="large"&&(o=2.5),C(Y.Plain,{className:M("Edge"),position:"absolute",transition:"middle",height:0,width:0,flexCenter:!0,xcss:{left:n.offsetLeft+"%"},onPointerDown:r=>{e.rootStates.disabled||e.focusIndex==1&&!l.ranged||(r.stopPropagation(),f.Effects.Start(r,{val_status:l,onChange:i=>{e.onUpdateValue(i,e.focusIndex)}}))},onKeyDown:r=>{t.enableFormSubmit&&X.SubmitForm(r,t.form);let{min:i,max:c,step:u}=l,{key:p,metaKey:v,ctrlKey:g}=r,S=g||v,s=l.safeValue[e.focusIndex];if(!p.match(/Arrow/))return;r.preventDefault(),p.match(/Left|Up/)?S?s=i:s-=u:p.match(/Right|Down/)&&(S?s=c:s+=u);let I=f.normalize(h(d({},l),{value:s}));e.onUpdateValue(I.value,e.focusIndex)},onFocus:r=>{a(i=>h(d({},i),{eventID:E(12),isFocusing:!0}))},onBlur:r=>{a(i=>h(d({},i),{eventID:E(12),isFocusing:!1}))},children:[m(b,{className:M("EdgeChild"),transition:"middle",position:"absolute",backgroundColor:t.color,isRounded:!0,opacity:"trans",xcss:{pointerEvents:"all",top:-12*o,bottom:-12*o,left:-12*o,right:-12*o}}),m(b,{transition:"long",boxShadow:"1.remark",fontSize:"0.xs",backgroundColor:!l.ranged||e.focusIndex==1?t.color:"layer.0",ssSphere:o,xcss:{pointerEvents:"all"}})]})},Legends:e=>{var g;let{val_status:n,rootStates:t}=e,{trackMin:l,min:a,max:o,step:r}=n,[i]=W(E()),c=(g=t.legends)!=null?g:!0,u=Math.round(a/r),p=Math.round(o/r),v=p-u+1;return K(()=>{if(!c)return;const S=()=>P(void 0,null,function*(){yield x.pending(100);let s=_("#"+i),I=_("#"+i+"-"+a),T=s.position().width-I.position().left,B=12*4,k=Math.round(T/B),U=Math.max(1,Math.floor(v/k));for(let y=u;y<=p;y++){let D=y*r,A=y==u||y==p||y%U==0;_("#"+i+"-"+D).css({display:A?"flex":"none"})}});return x(window).onEvent("resize",S,{eventID:"SliderResizeCB-"+i}),S(),()=>{x(window).removeEvent("SliderResizeCB-"+i)}},[]),c?C(q,{fontSize:"0.xs",position:"relative",padding:[0,"1/2"],id:i,xcss:{pointerEvents:"none",userSelect:"none"},children:[C(z,{gap:0,unitWidth:0,opacity:"trans",children:[m(b,{unitHeight:"1/2"}),m(O.Mini,{fontHeight:1.2,children:"A"})]}),Array.from({length:v},(S,s)=>s+u).map(S=>{let s=S*r;s=Math.max(s,a),s=Math.min(s,o);let I=f.getOffsetLeft(h(d({},n),{value:s}))+"%";return C(z,{gap:0,id:i+"-"+s,className:M("Legend"),position:"relative",verticalAlign:"center",unitWidth:0,display:"none",transition:"middle",fontColor:"1.clear",textAlign:"center",xcss:{left:I,whiteSpace:"nowrap"},children:[m(b,{isRounded:!0,backgroundColor:"mono.positive",opacity:"low",unitWidth:"1/12",unitHeight:"1/2"}),m(O.Micro,{fontHeight:1.2,children:t.onLegendRender?t.onLegendRender(s):s.rank()})]},s)})]}):null},index:e=>{let N=e,{color:n="theme",required:t,form:l="",discreteScale:a,size:o,ranged:r,legends:i,onLegendRender:c,trackMin:u,min:p,max:v,step:g,enableFormSubmit:S,showInitValidation:s,onValidate:I,onValidateDelay:T,onUpdateValue:B,onUpdateValidValue:k,onUserAction:U,value:y=0,className:D,wrapStyles:A}=N,J=F(N,["color","required","form","discreteScale","size","ranged","legends","onLegendRender","trackMin","min","max","step","enableFormSubmit","showInitValidation","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","wrapStyles"]),[L,w]=W({componentId:e.componentId||"",rawValue:y,safeValue:x.Arrayify(y),ranged:!!r,trackMin:Math.min(u!=null?u:p,p),min:p,max:v,step:g,eventType:"init",eventID:E(12)});return X.CommonEffects({type:"slider",states:e,val_status:L,set_status:w,SystemValidation:Q,ExtraOverrideStates:H=>({safeValue:x.Arrayify(H)})}),m(j,{val_status:L,set_status:w,states:e,children:C(z,h(d({gap:0,padding:[0,"1/2"],flexSizing:"auto"},J),{className:[D,M("Wrap")].join(" "),children:[m(f.Rail,{rootStates:e,val_status:L,set_status:w}),m(f.Legends,{rootStates:e,val_status:L})]}))})}},V=e=>{let n=h(d({color:"theme",size:"medium",discreteScale:!0},e),{xcss:d({minWidth:120},e.xcss)});return m(G,{componentId:e.componentId,children:f.index,states:$(n)})},R=V;R.Small=e=>m(V,d({size:"small"},e)),R.Medium=e=>m(V,d({size:"medium"},e)),R.Large=e=>m(V,d({size:"large"},e));const Z=e=>m(V,d({ranged:!0},e));R.Range=Z,R.Range.Small=e=>m(V,d({ranged:!0,size:"small"},e)),R.Range.Medium=e=>m(V,d({ranged:!0,size:"medium"},e)),R.Range.Large=e=>m(V,d({ranged:!0,size:"large"},e));export{R as Slider,R as default};
+import{b as m,c as h,d as F,e as P}from"../../chunk-C5N2D3ZX.js";import{Fragment as ee,jsx as p,jsxs as C}from"react/jsx-runtime";import x,{UUID as E}from"jmini";import{useState as W,useEffect as K}from"react";import{$$fromRoot as z,GenerateHTMLProps as $}from"../../@utils";import{Box as b,Flex as q,Column as _}from"../../atoms";import{Literal as O}from"../../mols";import{Button as Y}from"../Trigger";import{OptionalInputWrapper as G,BoxWrapper as j,CoreEffects as X}from"./core";import{InputSliderClasses as R}from"../../@styles/componentClasses";function Q(e){let{value:n,states:t}=e,{required:l}=t,a=[],[o,d]=x.Arrayify(n);return l&&!o&&!d&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:s})=>s=="invalid").length,notice:a}}const c={getOffsetLeft:e=>{let{trackMin:n,min:t,max:l,value:a}=e,o=(a-(n!=null?n:t))/(l-(n!=null?n:t));return Math.min(o,1)*100},normalize:e=>{let{min:n,max:t,step:l,value:a}=e;a=Math.max(a,n),a=Math.min(a,t);let o=Math.round(a/l)*l;return{value:o,offsetLeft:c.getOffsetLeft(h(m({},e),{value:o}))}},Effects:{Start:(e,n)=>{let t=x.getCursor(e).x,{val_status:l}=n,{componentId:a}=l,o=z("#"+a+"_Bar"),{width:d,left:s}=o.position(),i=(t-s)/d;i=Math.max(i,0),i=Math.min(i,1);let u=i*l.max;x(document).onEvent("mousemove",f=>{c.Effects.Move(f,n,u)},{eventID:"SliderMouseMove",passive:!1}).onEvent("touchmove",f=>{c.Effects.Move(f,n,u)},{eventID:"SliderTouchMove",passive:!1}).onEvent("mouseup",()=>{c.Effects.End()},{eventID:"SliderMouseUp"}).onEvent("touchend",()=>{c.Effects.End()},{eventID:"SliderTouchEnd"})},Move:(e,n,t)=>{var I;let l=x.getCursor(e).x,{val_status:a}=n,{componentId:o}=a,d=z("#"+o+"_Bar"),{width:s,left:i}=d.position(),u=(l-i)/s;u=Math.max(u,0),u=Math.min(u,1);let f=(I=a.trackMin)!=null?I:a.min,g=u*(a.max-f)+f,S=c.normalize(h(m({},a),{value:g})).value,r=Math.round(g-t);return n.onChange(S,r),e.preventDefault(),e.stopPropagation(),!1},End:()=>{x(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},Rail:e=>{let{rootStates:n,val_status:t,set_status:l}=e,{componentId:a}=t,o=2;n.size=="small"?o=1.5:n.size=="large"&&(o=2.5);let d=[c.normalize(h(m({},t),{value:t.safeValue[0]})),c.normalize(h(m({},t),{value:t.safeValue[1]||0}))];const s=(i,u)=>{let{min:f,max:g,step:v}=t;i=Math.max(Math.min(i,g),f),l(S=>{let r=m({},S);return r.safeValue[u]==i?r:(r.safeValue[u]=i,t.ranged&&r.safeValue[0]>r.safeValue[1]&&(r.safeValue=[r.safeValue[1],r.safeValue[0]]),h(m({},r),{rawValue:r.ranged?r.safeValue:r.safeValue[0],eventType:"update",eventID:E(12),isInspected:!1}))})};return p(_,{padding:[1,"1/2"],onPointerDown:i=>{e.rootStates.disabled||(i.stopPropagation(),!t.ranged&&c.Effects.Start(i,{val_status:t,onChange:u=>{s(u,0)}}))},children:C(b,{className:R("Bar"),height:0,position:"relative",transition:"middle",flexSizing:"none",id:a+"_Bar",children:[p(b,{position:"absolute",isRounded:!0,backgroundColor:"cloud",xcss:{top:-2*o,left:-2*o,right:-2*o,bottom:-2*o}}),p(c.Range,{rootStates:n,val_status:t,set_status:l,formatData:d,onUpdateValue:s}),p(c.DiscreteScale,{rootStates:n,val_status:t}),p(c.Edge,{focusIndex:0,rootStates:n,val_status:t,set_status:l,formatData:d[0],onUpdateValue:s}),t.ranged&&p(c.Edge,{focusIndex:1,rootStates:n,val_status:t,set_status:l,formatData:d[1],onUpdateValue:s})]})})},DiscreteScale:e=>{let{rootStates:n,val_status:t}=e;if(!n.discreteScale)return null;let{trackMin:l,min:a,max:o,step:d}=t,s=Math.round(a/d),u=Math.round(o/d)-s+1,f=0,g=t.safeValue[0]||0;return t.ranged&&(f=t.safeValue[0]||0,g=t.safeValue[1]||0),p(ee,{children:Array.from({length:u},(v,S)=>S+s).map(v=>{let S=v*d;S=Math.max(S,a),S=Math.min(S,o);let r=c.getOffsetLeft(h(m({},t),{value:S}))+"%",I=x.isInRange(S,f,g);return p(_,{gap:0,position:"absolute",verticalAlign:"center",horizontalAlign:"center",width:0,height:0,transition:"middle",fontColor:"1.clear",xcss:{pointerEvents:"none",top:"50%",left:r,transform:"translateY(-50%)"},children:p(b,{isRounded:!0,backgroundColor:I?"layer.0":"gray",ssSphere:"1/4"})},S)})})},Range:e=>{let{rootStates:n,formatData:t,val_status:l}=e,a=2;return n.size=="small"?a=1.5:n.size=="large"&&(a=2.5),C(b,{className:R("Range"),position:"absolute",transition:"middle",xcss:m({cursor:"pointer",top:"50%",transform:"translateY(-50%)"},l.ranged?{left:t[0].offsetLeft+"%",width:t[1].offsetLeft-t[0].offsetLeft+"%"}:{left:0,width:(t[0].offsetLeft||0)+"%"}),onPointerDown:o=>{if(!e.rootStates.disabled){if(o.stopPropagation(),l.ranged){let[d,s]=l.safeValue;o.stopPropagation(),c.Effects.Start(o,{val_status:l,onChange:(i,u)=>{e.set_status(f=>{let g=f.safeValue,v=m({},f);return v.safeValue=[c.normalize(h(m({},l),{value:d+u})).value,c.normalize(h(m({},l),{value:s+u})).value],v.safeValue[0]==g[0]&&v.safeValue[1]==g[1]?h(m({},f),{eventType:"update",eventID:E(12)}):h(m({},v),{rawValue:v.ranged?v.safeValue:v.safeValue[0],eventType:"update",eventID:E(12),isInspected:!1})})}});return}c.Effects.Start(o,{val_status:l,onChange:d=>{e.onUpdateValue(d,0)}})}},children:[p(b,{className:R("Field"),transition:"middle",position:"absolute",isRounded:!0,backgroundColor:n.color,xcss:{top:-6*a,bottom:-6*a,left:-6*a,right:-6*a}}),p(b,{className:R("Child"),transition:"middle",position:"absolute",isRounded:!0,backgroundColor:n.color,xcss:{pointerEvents:"none",top:-2*a,left:-2*a,right:-2*a,bottom:-2*a}})]})},Edge:e=>{var d;let{formatData:n,rootStates:t,val_status:l,set_status:a}=e,o=2;return t.size=="small"?o=1.5:t.size=="large"&&(o=2.5),C(Y.Plain,{className:R("Edge"),position:"absolute",transition:"middle",height:0,width:0,flexCenter:!0,xcss:{left:n.offsetLeft+"%"},onPointerDown:s=>{e.rootStates.disabled||e.focusIndex==1&&!l.ranged||(s.stopPropagation(),c.Effects.Start(s,{val_status:l,onChange:i=>{e.onUpdateValue(i,e.focusIndex)}}))},onKeyDown:s=>{t.enableFormSubmit&&X.SubmitForm(s,t.form);let{min:i,max:u,step:f}=l,{key:g,metaKey:v,ctrlKey:S}=s,r=S||v,I=l.safeValue[e.focusIndex];if(!g.match(/Arrow/))return;s.preventDefault(),g.match(/Left|Up/)?r?I=i:I-=f:g.match(/Right|Down/)&&(r?I=u:I+=f);let L=c.normalize(h(m({},l),{value:I}));e.onUpdateValue(L.value,e.focusIndex)},onFocus:s=>{a(i=>h(m({},i),{eventID:E(12),isFocusing:!0}))},onBlur:s=>{a(i=>h(m({},i),{eventID:E(12),isFocusing:!1}))},children:[p(b,{className:R("EdgeChild"),transition:"middle",position:"absolute",backgroundColor:t.color,isRounded:!0,opacity:"trans",xcss:{pointerEvents:"all",top:-12*o,bottom:-12*o,left:-12*o,right:-12*o}}),p(b,{transition:"long",boxShadow:"1.remark",fontSize:"0.xs",backgroundColor:!l.ranged||e.focusIndex==1?t.color:"layer.0",ssSphere:o,xcss:{pointerEvents:"all"},children:((d=x.Arrayify(t.trackIcon))==null?void 0:d[e.focusIndex])||null})]})},Legends:e=>{var v;let{val_status:n,rootStates:t}=e,{trackMin:l,min:a,max:o,step:d}=n,[s]=W(()=>E()),i=(v=t.legends)!=null?v:!0,u=Math.round(a/d),f=Math.round(o/d),g=f-u+1;return K(()=>{if(!i)return;const S=()=>P(void 0,null,function*(){x.interval.once(()=>{let r=z("#"+s),I=z("#"+s+"-"+a),L=r.position().width-I.position().left,B=12*4,A=Math.round(L/B),U=Math.max(1,Math.floor(g/A));for(let V=u;V<=f;V++){let D=V*d,T=V==u||V==f||V%U==0;z("#"+s+"-"+D).css({opacity:T?1:0})}},200,"SliderResizeCB-"+s)});return S(),x(window).onEvent("resize",S,{eventID:"SliderResizeCB-"+s}),()=>{x(window).removeEvent("SliderResizeCB-"+s)}},[]),i?C(q,{fontSize:"0.xs",position:"relative",padding:[0,"1/2"],id:s,xcss:{pointerEvents:"none",userSelect:"none"},children:[C(_,{gap:0,unitWidth:0,opacity:"trans",children:[p(b,{unitHeight:"1/2"}),p(O.Mini,{fontHeight:1.2,children:"A"})]}),Array.from({length:g},(S,r)=>r+u).map(S=>{let r=S*d;r=Math.max(r,a),r=Math.min(r,o);let I=c.getOffsetLeft(h(m({},n),{value:r}))+"%";return C(_,{gap:0,id:s+"-"+r,className:R("Legend"),position:"relative",verticalAlign:"center",unitWidth:0,transition:"middle",fontColor:"1.clear",textAlign:"center",xcss:{left:I,whiteSpace:"nowrap"},children:[p(b,{isRounded:!0,backgroundColor:"mono.positive",opacity:"low",unitWidth:"1/12",unitHeight:"1/2"}),p(O.Micro,{fontHeight:1.2,children:t.onLegendRender?t.onLegendRender(r):r.rank()})]},r)})]}):null},index:e=>{let N=e,{color:n="theme",required:t,form:l="",discreteScale:a,size:o,ranged:d,legends:s,onLegendRender:i,trackMin:u,min:f,max:g,step:v,trackIcon:S,enableFormSubmit:r,showInitValidation:I,onValidate:L,onValidateDelay:B,onUpdateValue:A,onUpdateValidValue:U,onUserAction:V,value:D=0,className:T,wrapStyles:te}=N,J=F(N,["color","required","form","discreteScale","size","ranged","legends","onLegendRender","trackMin","min","max","step","trackIcon","enableFormSubmit","showInitValidation","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","wrapStyles"]),[w,k]=W({componentId:e.componentId||"",rawValue:D,safeValue:x.Arrayify(D),ranged:!!d,trackMin:Math.min(u!=null?u:f,f),min:f,max:g,step:v,eventType:"init",eventID:E(12)});return X.CommonEffects({type:"slider",states:e,val_status:w,set_status:k,SystemValidation:Q,ExtraOverrideStates:H=>({safeValue:x.Arrayify(H)})}),p(j,{val_status:w,set_status:k,states:e,children:C(_,h(m({gap:0,padding:[0,"1/2"],flexSizing:"auto"},J),{className:[T,R("Wrap")].join(" "),children:[p(c.Rail,{rootStates:e,val_status:w,set_status:k}),p(c.Legends,{rootStates:e,val_status:w})]}))})}},M=e=>{let n=h(m({color:"theme",size:"medium",discreteScale:!0},e),{xcss:m({minWidth:120},e.xcss)});return p(G,{componentId:e.componentId,children:c.index,states:$(n)})},y=M;y.Small=e=>p(M,m({size:"small"},e)),y.Medium=e=>p(M,m({size:"medium"},e)),y.Large=e=>p(M,m({size:"large"},e));const Z=e=>p(M,m({ranged:!0},e));y.Range=Z,y.Range.Small=e=>p(M,m({ranged:!0,size:"small"},e)),y.Range.Medium=e=>p(M,m({ranged:!0,size:"medium"},e)),y.Range.Large=e=>p(M,m({ranged:!0,size:"large"},e));export{y as Slider,y as default};

package/dist/mols/Row.d.ts

@@ -10,6 +10,18 @@ declare namespace Row {
         Left: React.FC<Flex.Input>;
         Right: React.FC<Flex.Input>;
         Separate: React.FC<Flex.Input>;
+        /**
+         * left title component and right content component
+         * left ... 25% min default
+         */
+        Description: React.FC<Flex.Input & {
+            label?: ReactElement;
+            onLabelRender?: (label: ReactElement) => ReactElement;
+            children: ReactElement;
+            onChildrenRender?: (children: ReactElement) => ReactElement;
+            labelStyles?: StyleProps.States;
+            childrenStyles?: StyleProps.States;
+        }>;
     };
 }
 declare const Row: Row.Methods;

package/dist/mols/Row.js

@@ -1 +1 @@
-import{b as t}from"../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import{Flex as l}from"../atoms";const n={Center:e=>a(l,t({horizontalAlign:"center",verticalAlign:"center",flexWrap:!1,gap:1},e)),Left:e=>a(l,t({horizontalAlign:"left",verticalAlign:"center",flexWrap:!1,gap:1},e)),Right:e=>a(l,t({horizontalAlign:"right",verticalAlign:"center",flexWrap:!1,gap:1},e)),Separate:e=>a(l,t({horizontalAlign:"between",verticalAlign:"center",flexWrap:!1,gap:1},e))};export{n as Row,n as default};
+import{b as t,c as n,d as p}from"../chunk-C5N2D3ZX.js";import{jsx as l,jsxs as S}from"react/jsx-runtime";import{Box as x,Flex as a}from"../atoms";import d from"./Literal";const o={Center:e=>l(a,t({horizontalAlign:"center",verticalAlign:"center",flexWrap:!1,gap:1},e)),Left:e=>l(a,t({horizontalAlign:"left",verticalAlign:"center",flexWrap:!1,gap:1},e)),Right:e=>l(a,t({horizontalAlign:"right",verticalAlign:"center",flexWrap:!1,gap:1},e)),Separate:e=>l(a,t({horizontalAlign:"between",verticalAlign:"center",flexWrap:!1,gap:1},e)),Description:e=>{let c=e,{label:s,labelStyles:r,onLabelRender:R=i=>l(d,n(t({flexSizing:"none",isSemiBoldFont:!0},r),{xcss:n(t({},r==null?void 0:r.xcss),{minWidth:"25%"}),children:i})),children:f,childrenStyles:m,onChildrenRender:g=i=>l(x,n(t({flexSizing:0},m),{children:i}))}=c,h=p(c,["label","labelStyles","onLabelRender","children","childrenStyles","onChildrenRender"]);return S(o.Left,n(t({UnderBreakPointStyles:{flexType:"col",gap:"1/2",horizontalAlign:"unset",verticalAlign:"unset"}},h),{children:[R(s),g(f)]}))}};export{o as Row,o as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amotify",
-  "version": "0.3.32",
+  "version": "0.3.33",
   "description": "UI Component for React,NextJS,esbuild",
   "scripts": {
     "start": "run-p clean build:*",