amotify 0.2.180 → 0.2.182
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/demo/next/src/app/(router)/page.tsx +37 -4
- package/dist/fn/Input/Autocomplete.js +1 -1
- package/dist/fn/Input/Color.js +1 -1
- package/dist/fn/Input/Contenteditable.js +1 -1
- package/dist/fn/Input/DigitCharacters.js +1 -1
- package/dist/fn/Input/Filer.js +1 -1
- package/dist/fn/Input/List.js +1 -1
- package/dist/fn/Input/Select.js +1 -1
- package/dist/fn/Input/Slider.js +1 -1
- package/dist/fn/Input/Switch.js +1 -1
- package/dist/fn/Input/TextField.js +2 -2
- package/dist/fn/Input/Time/index.js +1 -1
- package/dist/fn/Input/core.js +1 -1
- package/dist/fn/Input/index.d.ts +1 -0
- package/dist/fn/Input/index.js +1 -1
- package/package.json +2 -2
|
@@ -51,11 +51,44 @@ const Dashboard = () => {
|
|
|
51
51
|
console.log( 'Time Value',value )
|
|
52
52
|
} }
|
|
53
53
|
/> */}
|
|
54
|
-
<Input.
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
54
|
+
<Input.Autocomplete
|
|
55
|
+
emptySelect={ false }
|
|
56
|
+
required
|
|
57
|
+
name='keyword'
|
|
58
|
+
SelectorPosition={ 4 }
|
|
59
|
+
// SelectorCellStyles={ {
|
|
60
|
+
// freeCSS: {
|
|
61
|
+
// minWidth: 12 * 12
|
|
62
|
+
// }
|
|
63
|
+
// } }
|
|
64
|
+
options={ [
|
|
65
|
+
{ value: void 0,label: '無効/測定しない' },
|
|
66
|
+
...Array.from( { length: 24 } ).map( ( hour,idx ) => {
|
|
67
|
+
return {
|
|
68
|
+
value: idx,
|
|
69
|
+
label: Number( idx ).zeroEmbed( 2 ) + ':00'
|
|
70
|
+
}
|
|
71
|
+
} ),
|
|
72
|
+
...Array.from( { length: 24 } ).map( ( hour,idx ) => {
|
|
73
|
+
return {
|
|
74
|
+
value: String( idx ),
|
|
75
|
+
label: Number( idx ).zeroEmbed( 2 ) + ':00'
|
|
76
|
+
}
|
|
77
|
+
} ),
|
|
78
|
+
{ value: { test: "hello" },label: '無効/測定しない' },
|
|
79
|
+
{ value: true,label: '無効/測定しない' },
|
|
80
|
+
] }
|
|
81
|
+
// value={ 17 }
|
|
82
|
+
// value={ "17" }
|
|
83
|
+
// value={ true }
|
|
84
|
+
// value={ { test: "hello" } }
|
|
85
|
+
|
|
86
|
+
// value={ val_dailyLog || void 0 }
|
|
87
|
+
onUpdateValidValue={ value => {
|
|
88
|
+
// set_keyword( value )
|
|
89
|
+
} }
|
|
58
90
|
/>
|
|
91
|
+
|
|
59
92
|
<Column
|
|
60
93
|
padding={ 3 }
|
|
61
94
|
>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as S,c as b,d as Q,e as Y}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as n,jsxs as B}from"react/jsx-runtime";import{useState as I,useEffect as F,useRef as ne}from"react";import s,{UUID as K}from"jmini";import{ExtractStyles as ae}from"../../@utils";import{Box as x,Span as ie,FAI as M,Column as re}from"../../atoms";import{Literal as W,Row as q}from"../../mols";import{Button as Z}from"../Button";import{Loader as se}from"../Loader";import{Sheet as ue}from"../Sheet";import{OptionalInputWrapper as ce,BoxWrapper as pe,CoreEffects as N,DefaultBoxishStyles as de}from"./core";import{InputAutocompleteClasses as z}from"../../@styles/componentClasses";import{InputLabel as Se}from"./Label";import{RightIcon as ee}from".";function me(e){let{value:t,states:p}=e,{required:u,options:a,min:o,max:d}=p;o=o||0,d=d||65535;let i=[],h=t.filter(c=>c!==null).length;return u&&(h||i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),h<o&&i.push({type:"invalid",label:o+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),h>d&&i.push({type:"invalid",label:d+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!i.filter(({type:c})=>c=="invalid").length,notice:i}}const U={InitOptions:e=>{let t=[];return e.forEach(p=>{let{type:u,label:a,value:o,searchValue:d}=p,i=d||s.is.string(a)&&a||""||s.is.string(o)&&o||s.Stringify(o||"")||"";s.is.nullish(a)&&(a=String(o)),t.push(b(S({},p),{searchValue:i,type:u||"selector",label:a,value:o}))}),t},FilterSelectableOptions:(e,t,p)=>{let u=e;return p||(u=e.filter(a=>a.type!="label")),s.scope(()=>{if(!t)return;let a=t.toLower().replace(/ /g,"");u=u.filter(o=>(o.searchValue||"").toLower().replace(/ /g,"").includes(a))}),u}},L={Shallow:e=>{let{rootStates:t,val_status:p}=e,u=ae(t);return n(x,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:n(W.Description,b(S({className:t.className},u),{position:"absolute",width:1,freeCSS:b(S({},u.freeCSS),{color:"orange"}),"data-id":"shallow_"+p.componentId,children:n(x,{"data-input-value-shallow":p.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:p,set_keyword:u,val_optionFocused:a,set_optionFocused:o,val_options:d,set_options:i,val_optionsDict:h,set_optionsDict:c,val_preventOpenSelectorOnFocus:r,set_preventOpenSelectorOnFocus:m,val_selectorOpen:l,set_selectorOpen:f,val_status:v,set_status:C,val_validate:_,set_validate:g}=e,j=t,{tone:D,required:w,form:T,className:R,multiSelect:P,enableFormSubmit:V,checkValidationAtFirst:A,onValidate:$,onUpdateValue:X,onUpdateValidValue:H,value:fe="",options:ve,leftIndicator:ye,rightIndicator:he,leftIcon:_e,rightIcon:ge,componentId:Oe,status_id:be,wrapStyles:Ie,emptySelect:Ce,SearchInput:De,SearchInputPlaceholder:we,SelectedComponent:Ve,SelectorComponent:ke,SelectorStyles:Te,SelectorPosition:Re,DynamicOptionsOnSearch:xe,DynamicOptionsOnSearchDelay:Ae}=j,O=Q(j,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return F(()=>{var k,E;if(t.disabled||!l)return;let y=U.FilterSelectableOptions(e.val_options,p,!1);o((E=(k=y[0])==null?void 0:k.value)!=null?E:null)},[p]),F(()=>{v.eventType!="init"&&(t.max==v.dataValue.length?(f(!1),m(!0),setTimeout(()=>{let y=s('[data-input-origin="'+t.componentId+'"]');y&&y.focus()},10)):s("#SearchInput_"+t.componentId).focus())},[v.dataValue]),F(()=>{let y="autocomplete-click-"+t.componentId;if(l){if(!s('[data-input-origin="'+t.componentId+'"]'))return;s("#SearchInput_"+t.componentId).focus(),s(document).addEvent({eventID:y,eventType:"mousedown",callback:E=>{let G=s(E.target),oe=!!s(G).parent("."+z("Core")).length,le=!!s(G).parent("."+z("Selector")).length;oe||le||(f(!1),E.preventDefault(),E.stopPropagation())},options:{passive:!1}})}else s(document).removeEvent([y]),u("")},[l]),B(J,{children:[n(x,b(S({tabIndex:0},O),{"data-disabled":t.disabled,"data-show-validation":N.isShowValidation(_,v,!!A),"data-component-id":v.componentId,"data-input-origin":v.componentId,"data-focus":!!l,className:[R,z("Core")].join(" "),onFocus:y=>{if(O!=null&&O.onFocus&&(O==null||O.onFocus(y)),!t.disabled){if(r)return m(!1);f(!0),y.preventDefault()}},onClick:y=>{O!=null&&O.onClick&&(O==null||O.onClick(y)),!t.disabled&&f(!0)},onKeyDown:y=>{let{key:k}=y;V&&N.SubmitForm(y,T),!l&&(k==" "||k=="ArrowDown"||k=="ArrowUp"||k=="Enter")&&f(!0)},children:B(q.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[n(L.Selected,S({},e)),n(ie,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),n(L.SearchInput,S({},e))]})})),l&&n(L.Selector,S({},e))]})},SearchInput:e=>{let{rootStates:t}=e,[p,u]=I(!1);return t.disabled||!e.val_selectorOpen?null:n(x,{id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_selectorOpen?"max":"trans",transition:"middle",flexSizing:0,htmlTag:"input",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onCompositionStart:a=>{t.onCompositionStart&&t.onCompositionStart(a),u(!0)},onCompositionEnd:a=>{t.onCompositionEnd&&t.onCompositionEnd(a),u(!1)},onKeyDown:a=>{let{key:o,metaKey:d,ctrlKey:i}=a,h=d||i;o=="Escape"?(e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0),setTimeout(()=>{let c=s('[data-input-origin="'+t.componentId+'"]');c&&c.focus()},10)):o=="Tab"?e.set_selectorOpen(!1):o==" "?s.scope(()=>{e.val_selectorOpen||e.val_keyword||(a.preventDefault(),e.set_selectorOpen(!0))}):o=="Backspace"?s.scope(()=>{if(e.val_keyword)return;let c=[...e.val_status.dataValue];c.pop(),e.set_status(r=>b(S({},r),{dataValue:c,eventType:"update",eventID:K()}))}):o=="Enter"&&s.scope(()=>{if(p)return;if(!e.val_selectorOpen)return e.set_selectorOpen(!0);let c=e.val_options.find(m=>m.value==e.val_optionFocused);if(!c)return;let{value:r}=c;e.set_status(m=>{let l=[...m.dataValue];return s.scope(()=>{if(r===null)return l=[];m.dataValue.includes(r)?l=l.filter(v=>v!==r):t.multiSelect?l.push(r):l=[r]}),b(S({},m),{dataValue:l,eventType:"update",eventID:K()})}),e.set_keyword(""),e.set_preventDynamicSearchOnKeywordChange(!0)}),s.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(o))return;if(a.preventDefault(),!e.val_selectorOpen)return e.set_selectorOpen(!0);let c=o=="ArrowDown"?1:-1,r=U.FilterSelectableOptions(e.val_options,e.val_keyword,!1),m=r.length-1,l=null;s.scope(()=>{var v,C,_,g,D,w,T,R,P,V;let f=r.findIndex(A=>A.value==e.val_optionFocused);if(f==-1&&(f=0),c==1){if(l=(C=(v=r[0])==null?void 0:v.value)!=null?C:null,h){l=(_=r[m].value)!=null?_:null;return}if(f==-1||f==m)return;l=(D=(g=r[f+1])==null?void 0:g.value)!=null?D:null}else{if(l=(w=r[m].value)!=null?w:null,h){l=(R=(T=r[0])==null?void 0:T.value)!=null?R:null;return}if(f==-1||f==0)return;l=(V=(P=r[f-1])==null?void 0:P.value)!=null?V:null}}),e.set_optionFocused(l)}),t.enableFormSubmit&&N.SubmitForm(a,e.rootStates.form)},onChange:a=>{let d=a.target.value;e.set_keyword(d)}},"searchInput")},Selector:e=>{var h;let[t,p]=I("idle"),[u,a]=I("idle");F(()=>{if(!e.val_selectorOpen||!e.rootStates.DynamicOptionsOnSearch)return;if(e.val_preventDynamicSearchOnKeywordChange)return e.set_preventDynamicSearchOnKeywordChange(!1);if(t=="idle")return p("ok");a("fetch");let c="autocomplete-search-"+e.rootStates.componentId;s.interval.once(()=>Y(void 0,null,function*(){let r=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);a("idle");let m=U.InitOptions(r||[]);e.set_options(m)}),e.rootStates.DynamicOptionsOnSearchDelay||300,c)},[e.val_keyword]);let o=[],d=U.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0);d.forEach((c,r)=>{let{type:m,value:l}=c,f=e.val_optionFocused==l,v=e.val_status.dataValue.includes(l),C=e.rootStates.SelectorComponent;o.push(n(C,{option:c,isFocused:f,isSelected:v,addCallback:()=>{e.set_status(_=>{let g=[..._.dataValue];return s.scope(()=>{if(l===null)return g=[];_.dataValue.includes(l)?g=g.filter(w=>w!==l):e.rootStates.multiSelect?g.push(l):g=[l]}),b(S({},_),{dataValue:g,eventType:"update",eventID:K()})})}},s.Stringify(l)||K()))}),d.length||(o=[n(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]),u=="fetch"&&(o=[B(q.Left,{padding:1,fontColor:"3.blur",children:[n(se.Theme.R,{showInitial:!0}),n(W.Supplement,{children:"Loading..."})]},"loader")]);let i={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:i.bottom="100%",i.left=0,i.paddingBottom="1/3";break;case 2:i.bottom="100%",i.right=0,i.paddingBottom="1/3";break;case 3:i.top="100%",i.left=0,i.paddingTop="1/3";break;case 4:i.top="100%",i.right=0,i.paddingTop="1/3";break;default:break}return n(x,b(S({},i),{children:n(ue.Body,b(S({className:z("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:S({maxHeight:12*24},(h=e.rootStates.SelectorStyles)==null?void 0:h.freeCSS),children:n(re,{gap:"1/12",padding:[1,0],children:o})}))}))},Selected:e=>{let{rootStates:t,val_status:p,set_status:u,val_optionsDict:a}=e,o=[];return p.dataValue.forEach(d=>{let i=a[s.Stringify(d)];if(!i)return;let h=t.SelectedComponent,c=i.label;i.value===null&&(c=""),o.push(n(x,{className:z("SelectedCell"),children:n(h,{value:i.value,label:c,removeCallback:r=>{if(r.stopPropagation(),r.preventDefault(),t.disabled)return;let m=[...p.dataValue];m=m.filter(l=>l!==d),u(l=>b(S({},l),{dataValue:m,eventType:"update",eventID:K()}))}})},s.Stringify(i.value)))}),n(J,{children:o})},Core:e=>{var A;let{value:t}=e,[p,u]=I(!1),[a,o]=I(!1),[d,i]=I(!1),[h,c]=I(""),[r,m]=I(e.options),[l,f]=I((A=e.value[0])!=null?A:null),[v,C]=I({}),[_,g]=I(N.DefaultStatus(e.componentId,t)),[D,w]=I({ok:!1,notice:[]}),T=ne(!1);F(()=>{T.current?m(e.options):T.current=!0},[e.options]),F(()=>{if(!r.length)return;let $=[...r],X=S({},v);$.forEach(H=>{H.type!="label"&&(X[s.Stringify(H.value)]=H)}),C(X)},[r]);let R={rootStates:e,val_options:r,set_options:m,val_optionFocused:l,set_optionFocused:f,val_optionsDict:v,set_optionsDict:C,val_preventDynamicSearchOnKeywordChange:a,set_preventDynamicSearchOnKeywordChange:o,val_preventOpenSelectorOnFocus:p,set_preventOpenSelectorOnFocus:u,val_selectorOpen:d,set_selectorOpen:i,val_keyword:h,set_keyword:c,val_status:_,set_status:g,val_validate:D,set_validate:w},P=!!e.multiSelect;N.CommonEffects({type:P?"autocomplete.multi":"autocomplete.single",states:e,val_status:_,set_status:g,val_validate:D,set_validate:w,SystemValidation:me});let V=_.dataValue.length&&_.dataValue[0]!==null;return V=V||d,B(pe,{val_status:_,set_status:g,val_validate:D,states:e,children:[n(Se,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:V}),n(L.Shallow,S({},R)),n(L.Button,S({},R))]})}},te=e=>{var p;let t=S({},e);return t=b(S({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:u,isSelected:a,isFocused:o,addCallback:d})=>u.type=="selector"?n(Z.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:i=>{d()},children:B(q.Left,{gap:"1/2",children:[a&&n(M.Check,{fontColor:"theme"}),n(W.Supplement,{transition:"short",children:u.label})]})}):n(J,{children:u.label}),SelectedComponent:({value:u,label:a,removeCallback:o})=>B(q.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[n(x,{padding:[0,"1/4"],children:a}),n(Z.Sub,{flexSizing:"none",color:"cloud",fontColor:"white",backgroundColor:"layer.5",isRounded:!0,padding:"1/4",onClick:o,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:n(M.X,{ssSphere:1})})]}),SelectorPosition:3},t),{freeCSS:S({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:n(W.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=s.flatArray((p=t.value)!=null?p:null),t.options=U.InitOptions(t.options),s.is.nullish(t.rightIcon)&&(t.rightIcon=n(ee,{ssSphere:2,children:n(M.Search,{})}),t.disabled&&(t.rightIcon=n(ee,{ssSphere:2,fontColor:"5.translucent",children:n(M.Ban,{})}))),t.rightIcon&&(t=S({paddingRight:3},t)),t.leftIcon&&(t=S({paddingLeft:3},t)),n(ce,{componentId:t.componentId,children:L.Core,states:de(t)})};export{te as Autocomplete,te as default};
|
|
1
|
+
import{b as S,c as b,d as Q,e as Y}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as B}from"react/jsx-runtime";import{useState as I,useEffect as x,useRef as ne}from"react";import r,{UUID as K}from"jmini";import{ExtractStyles as ie}from"../../@utils";import{Box as A,Span as re,FAI as M,Column as Z}from"../../atoms";import{Literal as W,Row as q}from"../../mols";import{Button as ee}from"../Button";import{Loader as se}from"../Loader";import{Sheet as ue}from"../Sheet";import{OptionalInputWrapper as ce,BoxWrapper as pe,CoreEffects as N,DefaultBoxishStyles as de}from"./core";import{InputAutocompleteClasses as z}from"../../@styles/componentClasses";import{InputLabel as Se}from"./Label";import{RightIcon as te}from".";function me(e){let{value:t,states:p}=e,{required:u,options:n,min:o,max:d}=p;o=o||0,d=d||65535;let i=[],h=t.filter(c=>c!==null).length;return u&&(h||i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),h<o&&i.push({type:"invalid",label:o+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),h>d&&i.push({type:"invalid",label:d+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!i.filter(({type:c})=>c=="invalid").length,notice:i}}const U={InitOptions:e=>{let t=[];return e.forEach(p=>{let{type:u,label:n,value:o,searchValue:d}=p,i=d||r.is.string(n)&&n||""||r.is.string(o)&&o||r.Stringify(o||"")||"";r.is.nullish(n)&&(n=String(o)),t.push(b(S({},p),{searchValue:i,type:u||"selector",label:n,value:o}))}),t},FilterSelectableOptions:(e,t,p)=>{let u=e;return p||(u=e.filter(n=>n.type!="label")),r.scope(()=>{if(!t)return;let n=t.toLower().replace(/ /g,"");u=u.filter(o=>(o.searchValue||"").toLower().replace(/ /g,"").includes(n))}),u}},L={Shallow:e=>{let{rootStates:t,val_status:p}=e,u=ie(t);return a(A,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(W.Description,b(S({className:t.className},u),{position:"absolute",width:1,freeCSS:b(S({},u.freeCSS),{color:"orange"}),"data-id":"shallow_"+p.componentId,children:a(A,{"data-input-value-shallow":p.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:p,set_keyword:u,val_optionFocused:n,set_optionFocused:o,val_options:d,set_options:i,val_optionsDict:h,set_optionsDict:c,val_preventOpenSelectorOnFocus:s,set_preventOpenSelectorOnFocus:m,val_selectorOpen:l,set_selectorOpen:f,val_status:v,set_status:C,val_validate:_,set_validate:g}=e,j=t,{tone:D,required:w,form:T,className:R,multiSelect:P,enableFormSubmit:V,checkValidationAtFirst:E,onValidate:$,onValidateDelay:X,onUpdateValue:H,onUpdateValidValue:fe,value:ve="",options:ye,leftIndicator:he,rightIndicator:_e,leftIcon:ge,rightIcon:Oe,componentId:be,status_id:Ie,wrapStyles:Ce,emptySelect:De,SearchInput:we,SearchInputPlaceholder:Ve,SelectedComponent:ke,SelectorComponent:Te,SelectorStyles:Re,SelectorPosition:xe,DynamicOptionsOnSearch:Ae,DynamicOptionsOnSearchDelay:Ee}=j,O=Q(j,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return x(()=>{var k,F;if(t.disabled||!l)return;let y=U.FilterSelectableOptions(e.val_options,p,!1);o((F=(k=y[0])==null?void 0:k.value)!=null?F:null)},[p]),x(()=>{v.eventType!="init"&&(t.max==v.dataValue.length?(f(!1),m(!0),setTimeout(()=>{let y=r('[data-input-origin="'+t.componentId+'"]');y&&y.focus()},10)):r("#SearchInput_"+t.componentId).focus())},[v.dataValue]),x(()=>{let y="autocomplete-click-"+t.componentId;if(l){if(!r('[data-input-origin="'+t.componentId+'"]'))return;r("#SearchInput_"+t.componentId).focus(),r(document).addEvent({eventID:y,eventType:"mousedown",callback:F=>{let G=r(F.target),le=!!r(G).parent("."+z("Core")).length,ae=!!r(G).parent("."+z("Selector")).length;le||ae||(f(!1),F.preventDefault(),F.stopPropagation())},options:{passive:!1}})}else r(document).removeEvent([y]),u("")},[l]),B(J,{children:[a(A,b(S({tabIndex:0},O),{"data-disabled":t.disabled,"data-show-validation":N.isShowValidation(_,v,!!E),"data-component-id":v.componentId,"data-input-origin":v.componentId,"data-focus":!!l,className:[R,z("Core")].join(" "),onFocus:y=>{if(O!=null&&O.onFocus&&(O==null||O.onFocus(y)),!t.disabled){if(s)return m(!1);f(!0),y.preventDefault()}},onClick:y=>{O!=null&&O.onClick&&(O==null||O.onClick(y)),!t.disabled&&f(!0)},onKeyDown:y=>{let{key:k}=y;V&&N.SubmitForm(y,T),!l&&(k==" "||k=="ArrowDown"||k=="ArrowUp"||k=="Enter")&&f(!0)},children:B(q.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(L.Selected,S({},e)),a(re,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),a(L.SearchInput,S({},e))]})})),l&&a(L.Selector,S({},e))]})},SearchInput:e=>{let{rootStates:t}=e,[p,u]=I(!1);return t.disabled||!e.val_selectorOpen?null:a(A,{id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_selectorOpen?"max":"trans",transition:"middle",flexSizing:0,htmlTag:"input",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onCompositionStart:n=>{t.onCompositionStart&&t.onCompositionStart(n),u(!0)},onCompositionEnd:n=>{t.onCompositionEnd&&t.onCompositionEnd(n),u(!1)},onKeyDown:n=>{let{key:o,metaKey:d,ctrlKey:i}=n,h=d||i;o=="Escape"?(e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0),setTimeout(()=>{let c=r('[data-input-origin="'+t.componentId+'"]');c&&c.focus()},10)):o=="Tab"?e.set_selectorOpen(!1):o==" "?r.scope(()=>{e.val_selectorOpen||e.val_keyword||(n.preventDefault(),e.set_selectorOpen(!0))}):o=="Backspace"?r.scope(()=>{if(e.val_keyword)return;let c=[...e.val_status.dataValue];c.pop(),e.set_status(s=>b(S({},s),{dataValue:c,eventType:"update",eventID:K()}))}):o=="Enter"&&r.scope(()=>{if(p)return;if(!e.val_selectorOpen)return e.set_selectorOpen(!0);let c=e.val_options.find(m=>m.value==e.val_optionFocused);if(!c)return;let{value:s}=c;e.set_status(m=>{let l=[...m.dataValue];return r.scope(()=>{if(s===null)return l=[];m.dataValue.includes(s)?l=l.filter(v=>v!==s):t.multiSelect?l.push(s):l=[s]}),b(S({},m),{dataValue:l,eventType:"update",eventID:K()})}),e.set_keyword(""),e.set_preventDynamicSearchOnKeywordChange(!0)}),r.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(o))return;if(n.preventDefault(),!e.val_selectorOpen)return e.set_selectorOpen(!0);let c=o=="ArrowDown"?1:-1,s=U.FilterSelectableOptions(e.val_options,e.val_keyword,!1),m=s.length-1,l=null;r.scope(()=>{var v,C,_,g,D,w,T,R,P,V;let f=s.findIndex(E=>E.value==e.val_optionFocused);if(f==-1&&(f=0),c==1){if(l=(C=(v=s[0])==null?void 0:v.value)!=null?C:null,h){l=(_=s[m].value)!=null?_:null;return}if(f==-1||f==m)return;l=(D=(g=s[f+1])==null?void 0:g.value)!=null?D:null}else{if(l=(w=s[m].value)!=null?w:null,h){l=(R=(T=s[0])==null?void 0:T.value)!=null?R:null;return}if(f==-1||f==0)return;l=(V=(P=s[f-1])==null?void 0:P.value)!=null?V:null}}),e.set_optionFocused(l)}),t.enableFormSubmit&&N.SubmitForm(n,e.rootStates.form)},onChange:n=>{let d=n.target.value;e.set_keyword(d)}},"searchInput")},Selector:e=>{var h;let[t,p]=I("idle"),[u,n]=I("idle");x(()=>{if(!e.val_selectorOpen||!e.rootStates.DynamicOptionsOnSearch)return;if(e.val_preventDynamicSearchOnKeywordChange)return e.set_preventDynamicSearchOnKeywordChange(!1);if(t=="idle")return p("ok");n("fetch");let c="autocomplete-search-"+e.rootStates.componentId;r.interval.once(()=>Y(void 0,null,function*(){let s=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);n("idle");let m=U.InitOptions(s||[]);e.set_options(m)}),e.rootStates.DynamicOptionsOnSearchDelay||300,c)},[e.val_keyword]),x(()=>{r(`[data-autocomplete-input-value="${String(r.Stringify(e.val_status.dataValue[0])).replace(/"/g,"_")}"]`).find("button").focus()},[]);let o=[],d=U.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0);d.forEach((c,s)=>{let{type:m,value:l}=c,f=e.val_optionFocused==l,v=e.val_status.dataValue.includes(l),C=e.rootStates.SelectorComponent;o.push(a(Z,{"data-autocomplete-input-value":String(r.Stringify(l)).replace(/"/g,"_"),children:a(C,{option:c,isFocused:f,isSelected:v,addCallback:()=>{e.set_status(_=>{let g=[..._.dataValue];return r.scope(()=>{if(l===null)return g=[];_.dataValue.includes(l)?g=g.filter(w=>w!==l):e.rootStates.multiSelect?g.push(l):g=[l]}),b(S({},_),{dataValue:g,eventType:"update",eventID:K()})})}})},String(r.Stringify(l))||K()))}),d.length||(o=[a(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]),u=="fetch"&&(o=[B(q.Left,{padding:1,fontColor:"3.blur",children:[a(se.Theme.R,{showInitial:!0}),a(W.Supplement,{children:"Loading..."})]},"loader")]);let i={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:i.bottom="100%",i.left=0,i.paddingBottom="1/3";break;case 2:i.bottom="100%",i.right=0,i.paddingBottom="1/3";break;case 3:i.top="100%",i.left=0,i.paddingTop="1/3";break;case 4:i.top="100%",i.right=0,i.paddingTop="1/3";break;default:break}return a(A,b(S({},i),{children:a(ue.Body,b(S({className:z("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:S({maxHeight:12*24},(h=e.rootStates.SelectorStyles)==null?void 0:h.freeCSS),children:a(Z,{gap:"1/12",padding:[1,0],children:o})}))}))},Selected:e=>{let{rootStates:t,val_status:p,set_status:u,val_optionsDict:n}=e,o=[];return p.dataValue.forEach(d=>{let i=n[r.Stringify(d)];if(!i)return;let h=t.SelectedComponent,c=i.label;i.value===null&&(c=""),o.push(a(A,{className:z("SelectedCell"),children:a(h,{value:i.value,label:c,removeCallback:s=>{if(s.stopPropagation(),s.preventDefault(),t.disabled)return;let m=[...p.dataValue];m=m.filter(l=>l!==d),u(l=>b(S({},l),{dataValue:m,eventType:"update",eventID:K()}))}})},r.Stringify(i.value)))}),a(J,{children:o})},Core:e=>{var E;let{value:t}=e,[p,u]=I(!1),[n,o]=I(!1),[d,i]=I(!1),[h,c]=I(""),[s,m]=I(e.options),[l,f]=I((E=e.value[0])!=null?E:null),[v,C]=I({}),[_,g]=I(N.DefaultStatus(e.componentId,t)),[D,w]=I({ok:!1,notice:[]}),T=ne(!1);x(()=>{T.current?m(e.options):T.current=!0},[e.options]),x(()=>{if(!s.length)return;let $=[...s],X=S({},v);$.forEach(H=>{H.type!="label"&&(X[r.Stringify(H.value)]=H)}),C(X)},[s]);let R={rootStates:e,val_options:s,set_options:m,val_optionFocused:l,set_optionFocused:f,val_optionsDict:v,set_optionsDict:C,val_preventDynamicSearchOnKeywordChange:n,set_preventDynamicSearchOnKeywordChange:o,val_preventOpenSelectorOnFocus:p,set_preventOpenSelectorOnFocus:u,val_selectorOpen:d,set_selectorOpen:i,val_keyword:h,set_keyword:c,val_status:_,set_status:g,val_validate:D,set_validate:w},P=!!e.multiSelect;N.CommonEffects({type:P?"autocomplete.multi":"autocomplete.single",states:e,val_status:_,set_status:g,val_validate:D,set_validate:w,SystemValidation:me});let V=_.dataValue.length&&_.dataValue[0]!==null;return V=V||d,B(pe,{val_status:_,set_status:g,val_validate:D,states:e,children:[a(Se,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:V}),a(L.Shallow,S({},R)),a(L.Button,S({},R))]})}},oe=e=>{var p;let t=S({},e);return t=b(S({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:u,isSelected:n,isFocused:o,addCallback:d})=>u.type=="label"?a(J,{children:u.label}):a(ee.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:o,isActiveStyles:{backgroundColor:"cloud"},onClick:i=>{d()},children:B(q.Left,{gap:"1/2",children:[n&&a(M.Check,{fontColor:"theme"}),a(W.Supplement,{transition:"short",children:u.label})]})}),SelectedComponent:({value:u,label:n,removeCallback:o})=>B(q.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[a(A,{padding:[0,"1/4"],children:n}),a(ee.Sub,{flexSizing:"none",color:"cloud",fontColor:"white",backgroundColor:"layer.5",isRounded:!0,padding:"1/4",onClick:o,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:a(M.X,{ssSphere:1})})]}),SelectorPosition:3},t),{freeCSS:S({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:a(W.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=r.flatArray((p=t.value)!=null?p:null),t.options=U.InitOptions(t.options),r.is.nullish(t.rightIcon)&&(t.rightIcon=a(te,{ssSphere:2,children:a(M.Search,{})}),t.disabled&&(t.rightIcon=a(te,{ssSphere:2,fontColor:"5.translucent",children:a(M.Ban,{})}))),t.rightIcon&&(t=S({paddingRight:3},t)),t.leftIcon&&(t=S({paddingLeft:3},t)),a(ce,{componentId:t.componentId,children:L.Core,states:de(t)})};export{oe as Autocomplete,oe as default};
|
package/dist/fn/Input/Color.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as
|
|
1
|
+
import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as D}from"jmini";import{useState as v}from"react";import x from"../../atoms/Box";import{OptionalInputWrapper as _,BoxWrapper as k,CoreEffects as p,DefaultBoxishStyles as F}from"./core";import{InputSwitchClasses as R}from"../../@styles/componentClasses";function w(t){let{value:n,states:d}=t,{required:s}=d,o=[];return s&&!n&&o.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!o.filter(({type:c})=>c=="invalid").length,notice:o}}const B=t=>{let y=t,{componentId:n,required:d,form:s,enableFormSubmit:o,checkValidationAtFirst:c,onChange:I,onKeyDown:f,onValidate:E,onValidateDelay:U,onUpdateValue:W,onUpdateValidValue:H,value:g=""}=y,S=h(y,["componentId","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value"]),[l,i]=v(p.DefaultStatus(t.componentId||"",g)),[u,C]=v({ok:!1,notice:[]});return p.CommonEffects({type:"color",states:t,val_status:l,set_status:i,val_validate:u,set_validate:C,SystemValidation:w}),m(k,{val_status:l,set_status:i,val_validate:u,states:t,children:m(x,e({htmlTag:"input",type:"color","data-component-id":l.componentId,value:l.dataValue,className:R("Input"),onKeyDown:a=>{f&&f(a),o&&p.SubmitForm(a,s)},onChange:a=>{let{value:T}=a.target;u.ok&&C({ok:!1,notice:[]}),i(b=>r(e({},b),{dataValue:T,eventType:"update",eventID:D()})),I&&I(a)}},S))})},V=t=>{let n=r(e(r(e({},F(t)),{backgroundColor:"cloud",unitHeight:3}),t),{freeCSS:e({minWidth:108},t.freeCSS)});return m(_,{componentId:t.componentId,children:B,states:n})};export{V as Color,V as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as u}from"react/jsx-runtime";import{UUID as
|
|
1
|
+
import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as u}from"react/jsx-runtime";import{UUID as g}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as w,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:c}=t,{required:m}=c,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentId:e,tone:c,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onValidateDelay:M,onUpdateValue:U,onUpdateValidValue:W,children:E="",leftIndicator:q,rightIndicator:A,leftIcon:K,rightIcon:G,freeCSS:N,wrapStyles:O}=T,V=b(T,["componentId","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,d]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:d,val_validate:l,set_validate:y,SystemValidation:F}),u(_,{val_status:i,set_status:d,val_validate:l,states:t,children:u(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentId,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let R=a.currentTarget,{innerHTML:P,innerText:x}=R;l.ok&&y({ok:!1,notice:[]}),d(D=>r(o({},D),{dataValue:x,eventType:"update",eventID:g()})),f&&f(a)}},V),{children:E}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return u(w,{componentId:t.componentId,children:H,states:e})};export{v as Contenteditable,v as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,c as p,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{useState as F}from"react";import B,{UUID as S}from"jmini";import{$$fromRoot as K,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as $,CoreEffects as w,DefaultBoxishStyles as P}from"./core";import{Flex as q}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function j(e){let{value:a,states:l}=e,{required:u,numericOnly:o=!1,digits:c}=l,r=[];return u&&!a&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(o&&a.match(/\D/)&&r.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=c&&r.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!r.filter(({type:f})=>f=="invalid"||f=="warn").length,notice:r}}const z=(e,a="")=>{let l=String(a),u=[];for(let o=0;o<e;o++)u[o]=l[o]||"";return{formatValue:u,dataValue:l}},A=(e="")=>{let a=e,l=a.join("");return{formatValue:a,dataValue:l}},G=e=>{let v=e,{tone:a,required:l,form:u,name:o,className:c="",digits:r,numericOnly:h=!1,enableFormSubmit:f,checkValidationAtFirst:J,onChange:Q,onKeyDown:X,onValidate:Y,
|
|
1
|
+
import{b as t,c as p,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{useState as F}from"react";import B,{UUID as S}from"jmini";import{$$fromRoot as K,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as $,CoreEffects as w,DefaultBoxishStyles as P}from"./core";import{Flex as q}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function j(e){let{value:a,states:l}=e,{required:u,numericOnly:o=!1,digits:c}=l,r=[];return u&&!a&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(o&&a.match(/\D/)&&r.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=c&&r.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!r.filter(({type:f})=>f=="invalid"||f=="warn").length,notice:r}}const z=(e,a="")=>{let l=String(a),u=[];for(let o=0;o<e;o++)u[o]=l[o]||"";return{formatValue:u,dataValue:l}},A=(e="")=>{let a=e,l=a.join("");return{formatValue:a,dataValue:l}},G=e=>{let v=e,{tone:a,required:l,form:u,name:o,className:c="",digits:r,numericOnly:h=!1,enableFormSubmit:f,checkValidationAtFirst:J,onChange:Q,onKeyDown:X,onValidate:Y,onValidateDelay:Z,onUpdateValue:ee,onUpdateValidValue:te,value:N="",override:ae,freeCSS:ne,wrapStyles:ie,combineInput:re,componentId:le,listStyles:_}=v,oe=V(v,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[s,y]=F(p(t({componentId:e.componentId||""},z(r,N)),{eventType:"init",eventID:S()})),[D,k]=F({ok:!1,notice:[]});w.CommonEffects({type:"textfield",states:e,val_status:s,set_status:y,val_validate:D,set_validate:k,SystemValidation:j});let b=[];for(let n=0;n<r;n++){let E=s.formatValue[n],H={},x=c;e.combineInput&&(x=[c,R("DigitCharacterCell"),R("Combined")].join(" ")),b.push(I("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:E,id:"Digit-"+n+"-"+s.componentId,className:x,style:t(t({},e.style),H),onKeyDown:C=>{let{key:g,code:L}=C;if(g=="Tab")return;C.preventDefault();let m=null;if(g=="Backspace"){let i=s.formatValue;i[n]="",y(d=>p(t(t({},d),A(i)),{eventType:"update",eventID:S()})),m=n-1}else if(["ArrowLeft","ArrowRight"].includes(g)){let i=+(g=="ArrowRight")*2-1;m=n+i}else f&&w.SubmitForm(C,u),(()=>{let i=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!i)return;let d=i[2]||i[3]||i[4];if(h&&!d.match(/\d/)||!d)return;let T=s.formatValue;T[n]=d,y(O=>p(t(t({},O),A(T)),{eventType:"update",eventID:S()})),m=n+1})();B.is.exist(m)&&K("#Digit-"+m+"-"+s.componentId).focus()},onChange:()=>{}},n))}return I($,{val_status:s,set_status:y,val_validate:D,states:e,children:I(q,p(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:b}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=p(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(P(e));return I(U,{componentId:e.componentId,children:G,states:a})};export{M as DigitCharacters,M as default};
|
package/dist/fn/Input/Filer.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as s,c as u,d as G,e as
|
|
1
|
+
import{b as s,c as u,d as G,e as O}from"../../chunk-C5N2D3ZX.js";import{Fragment as le,jsx as l,jsxs as p}from"react/jsx-runtime";import{useState as U,useEffect as Q}from"react";import se,{UUID as T,useStore as Y}from"jmini";import{$$fromRoot as D,ExtractStyles as re}from"../../@utils";import{Box as d,FAI as P,Flex as L,Column as ee}from"../../atoms";import{Row as pe}from"../../mols";import{Button as W}from"../Button";import H from"../Snackbar";import{OptionalInputWrapper as ue,BoxWrapper as me,CoreEffects as te,DefaultBoxishStyles as ce}from"./core";import de from"./TextField";import{InputFilerClasses as f}from"../../@styles/componentClasses";import{faCloudArrowUp as fe}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function ge(e){let{value:t,states:n}=e,{required:m}=n,a=[];return m&&!t.length&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:c})=>c=="invalid").length,notice:a}}const ae={List:e=>{let{rootStates:t,val_status:n,set_status:m}=e;if(t.useSystemOnly)return null;let a=t.limit-(n.dataValue||[]).length,c=(n.dataValue||[]).map((r,g)=>l(ae.ListCell,u(s({},e),{index:g,val_file:r}),r.name));return a>0&&c.push(l(d,u(s({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,f("AddButton")].join(" "),"data-component-id":n.componentId,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:r=>{let{key:g}=r;t.tabIndex!=-1&&[" ","Enter"].includes(g)&&D("#"+t.id).click()},children:p(pe.Center,{padding:["1/3",0],children:[l(d,{isRounded:!0,className:f("AddIcon"),children:l(P,{icon:fe,className:f("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),p(d,{children:[p(d,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",a,")"]}),l(d,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),l(ee,u(s({flexSizing:"auto"},re(t)),{className:t.className,children:c}))},ListCell:e=>{let{index:t,rootStates:n,val_file:m,val_status:a,set_status:c}=e,{name:r,size:g,type:o}=m,[F,B]=U(!1),w=T(),q=g.rank(),[K,_]=r.replace(/\s/,"").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),i="\u30D5\u30A1\u30A4\u30EB";return o.match(/image/)?i=o.replace(/image\//,""):o.match(/pdf/)?i="PDF":o.match(/csv/)?i="CSV":o.match(/spreadsheet/)?i="SpreadSheet":o.match(/presentation/)?i="PowerPoint":o.match(/word/)?i="Word":o.match(/zip/)?i="Zip":o.match(/powerpoint/)?i="PowerPoint":o.match(/html/)?i="HTML":o.match(/js/)?i="JavaScript":o.match(/css/)?i="CSS":o.match(/text\/plain/)&&(i="\u30C6\u30AD\u30B9\u30C8"),Q(()=>{F&&setTimeout(()=>{D("#"+w).focus()},100)},[F]),p(L,u(s({verticalAlign:"center",flexWrap:!1,gap:1,className:n.cellClassName},n.cellStyles),{children:[l(P.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),p(d,{flexSizing:0,children:[l(d,{children:l(L,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:f("FileName"),children:F?l(le,{children:p(ee,{flexSizing:0,gap:"1/2",children:[p(L,{gap:"2/3",verticalAlign:"center",children:[l(de,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:w,form:"form-"+w,enableFormSubmit:!0,value:K,onKeyDown:C=>{let{key:N}=C;N=="Escape"&&B(!1)}}),p(d,{children:[". ",_]})]}),p(L,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[l(W.Sub,{padding:["2/3",1],onClick:()=>{B(!1)},children:"\u9589\u3058\u308B"}),l(W,{padding:["2/3",1],submitOption:{formName:"form-"+w,callback:C=>O(void 0,null,function*(){let{name:N}=C,b=[...a.dataValue],A=b[t],J=A.id;if(!A)return;let{target:M}=yield A.convert();if(!M)return;let E=yield String(M.result).toBlob(m.type);if(!E)return;let y=new File([E],N+"."+_,{type:A.type});y.id=J,b[t]=y,c(x=>u(s({},x),{dataValue:b,eventType:"update",eventID:T()})),B(!1)})},children:"\u6C7A\u5B9A"})]})]})}):p(le,{children:[r,!!n.isNameEditable&&l(W.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{B(!0)},children:l(P.Pen,{})})]})})}),!F&&p(d,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[i,"\u30D5\u30A1\u30A4\u30EB / ",q,"B"]})]}),l(W.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let C=[...a.dataValue];C[t]&&(C.splice(t,1),c(b=>u(s({},b),{dataValue:C,eventType:"update",eventID:T()})))},children:l(P.X,{})})]}))}},ye=e=>{let Z=e,{tone:t,required:n,form:m,isNameEditable:a,useSystemOnly:c,accept:r="*",limit:g=1,checkValidationAtFirst:o,onChange:F,onValidate:B,onValidateDelay:w,onUpdateValue:q,onUpdateValidValue:K,value:_=[],className:i,cellStyles:C,cellClassName:N,componentId:b,status_id:A,enableFormSubmit:J,freeCSS:M,wrapStyles:ne}=Z,E=G(Z,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[y,x]=U(te.DefaultStatus(e.componentId||"",_)),[X,oe]=U({ok:!1,notice:[]}),ie={rootStates:e,val_status:y,set_status:x};Q(()=>{Y.set({["AddFiles-"+y.componentId]:v=>{x(V=>{let I=V.dataValue,k=[];for(var S=0;S<(v==null?void 0:v.length);S++){let h=v[S],{type:z,name:R}=h;if(S+1+I.length>g){H.add({componentId:R,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${R}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(r&&r=="image"&&!z.match(/image/)){H.add({componentId:R,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${R} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}k.push(h)}return u(s({},V),{dataValue:[...I,...k],eventType:"update",eventID:T()})})}})},[]),te.CommonEffects({type:"file",states:e,val_status:y,set_status:x,val_validate:X,set_validate:oe,SystemValidation:ge});let $="";return r&&(r=="image"?$="image/png,image/jpeg":$=r),p(me,{val_status:y,set_status:x,val_validate:X,states:e,children:[l(d,u(s({htmlTag:"input",type:"file",className:f("Input"),"data-component-id":y.componentId,accept:$,multiple:g!=1,onChange:v=>O(void 0,null,function*(){F&&F(v);let V=v.target,I=V.files,k=[];for(var S=0;S<(I==null?void 0:I.length);S++){let h=I[S],z=h.name;if(h.id=T(),S+1+y.dataValue.length>g){H.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}k.push(h)}x(h=>u(s({},h),{dataValue:[...h.dataValue,...k],eventType:"update",eventID:T()})),V.value=""})},E),{opacity:"low",tabIndex:-1,value:""})),l(ae.List,s({},ie))]})},j=e=>(e=u(s({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:s(s({},ce({tone:e.tone||"border"})),e.cellStyles)}),l(ue,{componentId:e.componentId,children:ye,states:e}));j.fn={openDialog:e=>{let{multiple:t,accept:n}=e;return new Promise(m=>{const a=document.createElement("input");a.type="file",a.multiple=t!=null?t:!0,n&&(n=="image"?a.accept="image/png,image/jpeg,image/webp":a.accept=n),a.onchange=c=>{m(c.target.files)},a.click()})}},typeof window!="undefined"&&window.document&&se(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),D("."+f("AddButton")).addClass(f("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),D("."+f("AddButton")).removeClass(f("Draggable"));let t=e.dataTransfer.files;if(t.length){let n=e.target;if(D(n).hasClass(f("AddButton"))){let{componentId:m}=n.dataset,a=Y.get("AddFiles-"+m);a&&a(t)}}},options:{passive:!1}});export{j as Filer,j as default};
|
package/dist/fn/Input/List.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as u,d as
|
|
1
|
+
import{b as o,c as u,d as w}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import S,{UUID as M}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as I,Flex as re,FAI as ce,Span as de}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as me,BoxWrapper as pe,CoreEffects as J}from"./core";import{InputListClasses as T}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:p}=i;n=n||0,p=p||65535;let r=[],y=l.length;return s&&(y||e=="radio"&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),y<n&&r.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),y>p&&r.push({type:"invalid",label:p+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!r.filter(({type:V})=>V=="invalid").length,notice:r}}const h={InitOptions:t=>{let l=[];return t.forEach(i=>{let{label:e,value:s}=i;S.is.nullish(e)&&(e=String(s)),l.push(u(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=S.is.exist(l)?S.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(r=>S.is.equal(r.value,n))!=-1&&s.push(n)}),a(h.Core,u(o({},t),{value:s,options:i}))},Core:t=>{let k=t,{type:l,tone:i,required:e,componentId:s="",form:n,override:p,icon:r,iconType:y,iconSize:V,iconPosition:X,iconColor:v,CustomIcon:A,enableFormSubmit:$,checkValidationAtFirst:W,onValidate:H,onValidateDelay:N,onUpdateValue:U,onUpdateValidValue:K,value:_,options:b,className:q,cellStyles:j,cellClassName:G,cellCheckedStyles:Q,cellCheckedClassName:Y,min:Z,max:E,hideInput:m,freeCSS:O,wrapStyles:x}=k,ee=w(k,["type","tone","required","componentId","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[C,L]=ie(J.DefaultStatus(s,_)),[D,z]=ie({ok:!1,notice:[]});return J.CommonEffects({type:"list."+l,states:t,val_status:C,set_status:L,val_validate:D,set_validate:z,SystemValidation:Ce}),a(pe,{val_status:C,set_status:L,val_validate:D,states:t,children:a(h.List,{rootStates:t,val_status:C,set_status:L})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentId:s,type:n,tone:p,icon:r,iconSize:y,iconColor:V,isChecker:X,options:v,name:A,form:$,tabIndex:W,hideInput:H,disabled:N,className:U,cellStyles:K,cellClassName:_="",cellCheckedStyles:b,cellCheckedClassName:q="",enableFormSubmit:j}=l,{dataValue:G}=i,Q=l.CustomIcon,Y=v.map((Z,E)=>{let le=Z,{value:m,label:O,disabled:x,className:ee="",checkedStyles:C,checkedClassName:L="",freeCSS:D}=le,z=w(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),k=M(),R=G.findIndex(c=>c===m)!=-1,f=o(o({},K),z),F=[T("Label"),_,ee];R&&(f=u(o(o(o({},f),b),C),{freeCSS:o(o(o({},f==null?void 0:f.freeCSS),b==null?void 0:b.freeCSS),C==null?void 0:C.freeCSS)}),F=[...F,q,L]);const te=()=>{if(N||x)return;let c=[];if(n=="radio")c=[m];else if(n=="checkbox"||X)if(!R)c=[...i.dataValue,m];else{let d=[...i.dataValue];d.splice(i.dataValue.findIndex(B=>B==m),1),c=d}e(d=>u(o({},d),{dataValue:c,eventType:"update",eventID:M()}))};let oe=[a(de,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:S.is.string(O)?a(I,{children:O}):O},"content")];return r&&oe[l.iconPosition=="right"?"push":"unshift"](a(Q,{isChecked:R,iconSize:y,iconColor:V,toggle:te},"icon")),[a(I,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:T("Input"),name:"RadioCheckbox-"+A,"data-list-index":s+"-"+E,id:k,value:String(m),disabled:N||x,checked:R,onFocus:c=>{x||n=="radio"&&(i.dataValue.length||e(d=>u(o({},d),{dataValue:[m],eventType:"update",eventID:M()})))},onChange:()=>{te()},onKeyDown:c=>{let{key:d,shiftKey:B}=c;if((n=="checkbox"||t.rootStates.isChecker)&&d!="Tab"){if(d.match(/Arrow/)){c.preventDefault();let ae=["ArrowLeft","ArrowUp"].includes(d)?-1:1,g=E+ae;g<0?g=v.length-1:g>=v.length&&(g=0),ne(`input[data-list-index="${s}-${g}"]`).focus()}}j&&J.SubmitForm(c,$)},tabIndex:W},"List-"+S.Stringify(m)),a(I,u(o({htmlTag:"label","data-disabled":N||x,htmlFor:k,className:F.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},f),{children:oe}),"ListTrigger-"+S.Stringify(m))]});return a(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[U,T("CellBase"),T("HideInput_"+H),T("IconIndicator_"+!!r),T("Tone_"+p)].join(" "),children:Y})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),a(ue.Normal,{ssPushable:!0,color:"cloud",tabIndex:-1,ssEffectsOnActive:"ripple.cloud",ssSphere:2,freeCSS:{transform:`scale(${l})`},onClick:i=>{i.preventDefault(),i.stopPropagation(),t.toggle()},children:t.children})},RadioIcon:t=>a(h._Icon,u(o({type:"radio"},t),{children:a(I,{flexCenter:!0,isRounded:!0,border:t.isChecked?"0.trans":"3.thick",borderColor:t.isChecked?t.iconColor:"3.thick",position:"relative",transition:"middle",freeCSS:{width:"50%",height:"50%"},children:a(I,{position:"absolute",transition:"middle",isRounded:!0,backgroundColor:t.iconColor,opacity:t.isChecked?"max":"trans",freeCSS:{width:"60%",height:"60%",transform:t.isChecked?"scale(1)":"scale(.4)"}})})})),CheckboxIcon:t=>a(h._Icon,u(o({type:"checkbox"},t),{children:a(I,{flexCenter:!0,boxShadow:t.isChecked?"0.remark":"none",border:t.isChecked?"0.trans":"3.thick",backgroundColor:t.isChecked?t.iconColor:"trans",position:"relative",transition:"middle",fontColor:"white",freeCSS:{borderRadius:"25%",padding:"4%",width:"50%",height:"50%"},children:a(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},P=t=>{t=t||"checkbox";const l=e=>(e=u(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=h.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=h.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=h.InitOptions(e.options),a(me,{componentId:e.componentId,children:h.OptionalListWrapper,states:e})),i=l;return i.Normal=e=>a(l,o({type:t,tone:"normal",icon:!1},e)),i.Border=e=>a(l,o({type:t,tone:"border"},e)),i.Cloud=e=>a(l,o({type:t,tone:"cloud"},e)),i.Vivid=e=>a(l,o({type:t,tone:"normal",icon:!1,cellCheckedStyles:{backgroundColor:"theme",fontColor:"white"}},e)),i.Simple=e=>a(l,o({type:t,tone:"plain",icon:!1,cellCheckedStyles:{fontColor:"theme"}},e)),i},he=P("radio"),Se=P("checkbox"),ye=P();export{Se as Checkbox,ye as List,he as Radio};
|
package/dist/fn/Input/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as n,c as u,d as z}from"../../chunk-C5N2D3ZX.js";import{Fragment as H,jsx as a,jsxs as R}from"react/jsx-runtime";import c,{UUID as k}from"jmini";import{useState as D,useEffect as oe}from"react";import{ExtractStyles as xe}from"../../@utils";import{Box as I,Span as Fe,FAI as ne,Column as we}from"../../atoms";import{Literal as B,Row as re}from"../../mols";import{Button as Re}from"../Button";import{Sheet as ke}from"../Sheet";import{OptionalInputWrapper as De,BoxWrapper as Ae,CoreEffects as w,DefaultBoxishStyles as Ee}from"./core";import{InputAutocompleteClasses as A}from"../../@styles/componentClasses";import{InputLabel as Be}from"./Label";import{RightIcon as Le}from".";function We(e){let{value:t,states:o}=e,{required:l,options:y}=o,p=[];return l&&t===null&&p.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!p.filter(({type:d})=>d=="invalid").length,notice:p}}const se={FilterSelectableOptions:(e,t)=>{let o=e.rootStates.options;return t||(o=o.filter(l=>l.type!="label")),o}},C={Shallow:e=>{let{rootStates:t,val_status:o}=e,l=xe(t);return a(I,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(B.Description,u(n({className:t.className},l),{position:"absolute",width:1,freeCSS:u(n({},l.freeCSS),{color:"orange"}),children:a(I,{"data-input-value-shallow":o.componentId,children:"A"})}))})},Button:e=>R(H,{children:[a(C.LegacySelector,n({},e)),a(C.Original,n({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(I,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:d,set_validate:h,val_status:s,set_status:g,val_selectorOpen:S,set_selectorOpen:f}=e,U=t,{tone:O,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:de,onUpdateValue:Se,onUpdateValidValue:fe,value:N="",options:K,leftIndicator:me,rightIndicator:j,leftIcon:ve,rightIcon:ye,componentId:be,status_id:ge,wrapStyles:he,SelectedCellStyles:Ie,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:Ve,SelectorPosition:Oe}=U,r=z(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return oe(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let i="select-click-"+t.componentId;if(S){if(!c('[data-input-origin="'+t.componentId+'"]'))return;c(document).addEvent({eventID:i,eventType:"click",callback:m=>{let T=c(m.target),x=!!c(T).parent("."+A("Core")).length;c(T).parent("."+A("Selector")).length||x||f(!1)}})}else c(document).removeEvent([i])},[S]),oe(()=>{if(e.rootStates.SelectorMode!="original"||s.eventType=="init"||!S)return;let i=c('[data-input-origin="'+t.componentId+'"]');i&&i.focus()},[s.dataValue]),e.rootStates.SelectorMode!="original"?null:R(H,{children:[a(I,u(n({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(d,s,!!M),"data-component-id":s.componentId,"data-input-origin":s.componentId,className:[W,A("Core")].join(" "),onFocus:i=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(i)),!t.disabled){if(o)return l(!1);f(!0)}},onClick:i=>{r!=null&&r.onClick&&(r==null||r.onClick(i)),!t.disabled&&f(!0)},onKeyDown:i=>{let{key:b,metaKey:m,ctrlKey:T}=i,x=m||T;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(i)),P&&w.SubmitForm(i,L),!t.disabled){if(c.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(b))return;if(i.preventDefault(),!S)return f(!0);let _=b=="ArrowDown"?1:-1,v=se.FilterSelectableOptions(e),q=v.length-1,V=null;c.scope(()=>{var J,X,G,Q,Y,Z,ee,te,le,ae;let F=v.findIndex(Te=>Te.value==y);if(_==1){if(V=(X=(J=v[0])==null?void 0:J.value)!=null?X:null,x){V=(G=v[q].value)!=null?G:null;return}if(F==-1||F==q)return;V=(Y=(Q=v[F+1])==null?void 0:Q.value)!=null?Y:null}else{if(V=(Z=v[q].value)!=null?Z:null,x){V=(te=(ee=v[0])==null?void 0:ee.value)!=null?te:null;return}if(F==-1||F==0)return;V=(ae=(le=v[F-1])==null?void 0:le.value)!=null?ae:null}}),p(V)}),b=="Escape")f(!1);else if(b=="Tab")f(!1);else if(b=="Backspace")g(_=>u(n({},_),{dataValue:null,eventType:"update",eventID:k()}));else if(b==" ")i.preventDefault(),f(!0);else if(b=="Enter"){if(!S)return f(!0);i.preventDefault();let _=t.options.find(v=>v.value==y);if(!_)return;g(v=>u(n({},v),{dataValue:_.value,eventType:"update",eventID:k()})),f(!1)}}},children:R(re.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(C.Placeholder,n({},e)),a(C.Selected,n({},e)),a(Fe,{width:0,overflow:"hidden",opacity:"trans",children:"A"})]})})),S&&a(C.Selector,n({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:o,set_preventOpenSelectorOnFocus:l,val_optionFocused:y,set_optionFocused:p,val_validate:d,set_validate:h,val_status:s,set_status:g,val_selectorOpen:S,set_selectorOpen:f}=e,b=t,{tone:O,required:E,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:$,checkValidationAtFirst:M,onValidate:de,onUpdateValue:Se,onUpdateValidValue:fe,onKeyDown:N,onChange:K,value:me="",options:j,leftIndicator:ve,rightIndicator:ye,leftIcon:be,rightIcon:ge,componentId:he,status_id:Ie,wrapStyles:Ce,SelectedCellStyles:_e,SelectorCellStyles:Ve,SelectorMode:Oe,SelectorStyles:r,SelectorPosition:U}=b,i=z(b,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onUpdateValue","onUpdateValidValue","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:R(I,u(n({htmlTag:"select",tabIndex:0},i),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(d,s,!!M),"data-component-id":s.componentId,"data-input-origin":s.componentId,className:[W,A("Core")].join(" "),onKeyDown:m=>{N&&N(m),P&&w.SubmitForm(m,L)},onChange:m=>{let{value:T}=m.target;d.ok&&h({ok:!1,notice:[]}),g(x=>u(n({},x),{dataValue:T,eventType:"update",eventID:k()})),K&&K(m)},children:[!!$&&a("option",{value:"null",children:"\u9078\u629E"}),j.map(m=>c.is.nullish(m.value)?null:a("option",{value:m.value,children:m.label},String(m.value)))]}))},Selector:e=>{var y;let t=[],o=se.FilterSelectableOptions(e,!0);o.forEach((p,d)=>{let{type:h,value:s}=p,g=e.val_optionFocused==s,S=e.val_status.dataValue===s;if(h=="selector"){t.push(a(Re.Sub.S,u(n({color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:S||g,isActiveStyles:g?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:f=>{e.set_status(O=>u(n({},O),{dataValue:s,eventType:"update",eventID:k()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:R(re.Left,{gap:"1/2",children:[S&&a(ne.Check,{fontColor:"theme"}),a(B.Supplement,{transition:"short",flexSizing:0,children:p.label})]})}),String(s)));return}t.push(a(I,{children:p.label},k()))}),o.length||(t=[a(B.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]);let l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(I,u(n({},l),{children:a(ke.Body,u(n({className:A("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(y=e.rootStates.SelectorStyles)==null?void 0:y.freeCSS),children:a(we,{gap:"1/12",padding:[1,0],children:t})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&c.scope(()=>{let o=e.rootStates.options.find(l=>c.is.equal(l.value,e.val_status.dataValue));o&&t.push(a(I,u(n({},e.rootStates.SelectedCellStyles),{children:o.label}),String(o.value)))}),a(H,{children:t})},Core:e=>{var E;let{value:t}=e,[o,l]=D(w.DefaultStatus(e.componentId,t)),[y,p]=D(!1),[d,h]=D(!1),[s,g]=D((E=e.value)!=null?E:null),[S,f]=D({ok:!1,notice:[]}),O={rootStates:e,val_preventOpenSelectorOnFocus:y,set_preventOpenSelectorOnFocus:p,val_optionFocused:s,set_optionFocused:g,val_selectorOpen:d,set_selectorOpen:h,val_status:o,set_status:l,val_validate:S,set_validate:f};return w.CommonEffects({type:"select",states:e,val_status:o,set_status:l,val_validate:S,set_validate:f,SystemValidation:We}),R(Ae,{val_status:o,set_status:l,val_validate:S,states:e,children:[a(Be,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||o.dataValue!==null}),a(C.Shallow,n({},O)),a(C.Button,n({},O))]})}},ie=e=>{var o;let t=n({},e);return t=u(n({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:n({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(B.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(o=t.value)!=null?o:null,t.options.forEach((l,y)=>{let{type:p,value:d,searchValue:h}=l,s=h||c.is.string(d)&&d||c.Stringify(d||"")||"";t.options[y]=u(n({},l),{value:d,searchValue:s,type:p||"selector"})}),c.is.nullish(t.rightIcon)&&(t.rightIcon=a(Le,{ssSphere:2,children:a(ne.AngleDown,{})})),a(De,{componentId:t.componentId,children:C.Core,states:Ee(t)})};export{ie as Select,ie as default};
|
|
1
|
+
import{b as o,c as d,d as z}from"../../chunk-C5N2D3ZX.js";import{Fragment as $,jsx as a,jsxs as O}from"react/jsx-runtime";import i,{UUID as D}from"jmini";import{useState as k,useEffect as H}from"react";import{ExtractStyles as Fe}from"../../@utils";import{Box as h,Span as we,FAI as ne,Column as De}from"../../atoms";import{Literal as E,Row as re}from"../../mols";import{Button as ke}from"../Button";import{Sheet as Re}from"../Sheet";import{OptionalInputWrapper as Ae,BoxWrapper as Be,CoreEffects as w,DefaultBoxishStyles as Ee}from"./core";import{InputAutocompleteClasses as R}from"../../@styles/componentClasses";import{InputLabel as Le}from"./Label";import{RightIcon as We}from".";function Pe(e){let{value:t,states:l}=e,{required:n,options:f}=l,g=[];return n&&t===null&&g.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!g.filter(({type:c})=>c=="invalid").length,notice:g}}const ie={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(n=>n.type!="label")),l}},_={Shallow:e=>{let{rootStates:t,val_status:l}=e,n=Fe(t);return a(h,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(E.Description,d(o({className:t.className},n),{position:"absolute",width:1,freeCSS:d(o({},n.freeCSS),{color:"orange"}),children:a(h,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>O($,{children:[a(_.LegacySelector,o({},e)),a(_.Original,o({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(h,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:f,set_optionFocused:g,val_validate:c,set_validate:m,val_status:u,set_status:I,val_selectorOpen:v,set_selectorOpen:p}=e,U=t,{tone:A,required:B,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:j,checkValidationAtFirst:M,onValidate:de,onValidateDelay:Se,onUpdateValue:fe,onUpdateValidValue:me,value:N="",options:K,leftIndicator:ve,rightIndicator:J,leftIcon:ye,rightIcon:ge,componentId:be,status_id:Ie,wrapStyles:he,SelectedCellStyles:_e,SelectorCellStyles:Ce,SelectorMode:Ve,SelectorStyles:Oe,SelectorPosition:Te}=U,r=z(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return H(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let s="select-click-"+t.componentId;if(v){if(!i('[data-input-origin="'+t.componentId+'"]'))return;i(document).addEvent({eventID:s,eventType:"click",callback:S=>{let T=i(S.target),x=!!i(T).parent("."+R("Core")).length;i(T).parent("."+R("Selector")).length||x||p(!1)}})}else i(document).removeEvent([s])},[v]),H(()=>{if(e.rootStates.SelectorMode!="original"||u.eventType=="init"||!v)return;let s=i('[data-input-origin="'+t.componentId+'"]');s&&s.focus()},[u.dataValue]),e.rootStates.SelectorMode!="original"?null:O($,{children:[a(h,d(o({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(c,u,!!M),"data-component-id":u.componentId,"data-input-origin":u.componentId,className:[W,R("Core")].join(" "),onFocus:s=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(s)),!t.disabled){if(l)return n(!1);p(!0)}},onClick:s=>{r!=null&&r.onClick&&(r==null||r.onClick(s)),!t.disabled&&p(!0)},onKeyDown:s=>{let{key:b,metaKey:S,ctrlKey:T}=s,x=S||T;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(s)),P&&w.SubmitForm(s,L),!t.disabled){if(i.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(b))return;if(s.preventDefault(),!v)return p(!0);let C=b=="ArrowDown"?1:-1,y=ie.FilterSelectableOptions(e),q=y.length-1,V=null;i.scope(()=>{var X,G,Q,Y,Z,ee,te,le,ae,oe;let F=y.findIndex(xe=>xe.value==f);if(C==1){if(V=(G=(X=y[0])==null?void 0:X.value)!=null?G:null,x){V=(Q=y[q].value)!=null?Q:null;return}if(F==-1||F==q)return;V=(Z=(Y=y[F+1])==null?void 0:Y.value)!=null?Z:null}else{if(V=(ee=y[q].value)!=null?ee:null,x){V=(le=(te=y[0])==null?void 0:te.value)!=null?le:null;return}if(F==-1||F==0)return;V=(oe=(ae=y[F-1])==null?void 0:ae.value)!=null?oe:null}}),g(V)}),b=="Escape")p(!1);else if(b=="Tab")p(!1);else if(b=="Backspace")I(C=>d(o({},C),{dataValue:null,eventType:"update",eventID:D()}));else if(b==" ")s.preventDefault(),p(!0);else if(b=="Enter"){if(!v)return p(!0);s.preventDefault();let C=t.options.find(y=>y.value==f);if(!C)return;I(y=>d(o({},y),{dataValue:C.value,eventType:"update",eventID:D()})),p(!1)}}},children:O(re.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(_.Placeholder,o({},e)),a(_.Selected,o({},e)),a(we,{width:0,overflow:"hidden",opacity:"trans",children:"A"})]})})),v&&a(_.Selector,o({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:f,set_optionFocused:g,val_validate:c,set_validate:m,val_status:u,set_status:I,val_selectorOpen:v,set_selectorOpen:p}=e,b=t,{tone:A,required:B,form:L,className:W,label:ue,isLabelActive:ce,placeholder:pe,enableFormSubmit:P,emptySelect:j,checkValidationAtFirst:M,onValidate:de,onValidateDelay:Se,onUpdateValue:fe,onUpdateValidValue:me,onKeyDown:N,onChange:K,value:ve="",options:J,leftIndicator:ye,rightIndicator:ge,leftIcon:be,rightIcon:Ie,componentId:he,status_id:_e,wrapStyles:Ce,SelectedCellStyles:Ve,SelectorCellStyles:Oe,SelectorMode:Te,SelectorStyles:r,SelectorPosition:U}=b,s=z(b,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:O(h,d(o({htmlTag:"select",tabIndex:0},s),{"data-disabled":t.disabled,"data-show-validation":w.isShowValidation(c,u,!!M),"data-component-id":u.componentId,"data-input-origin":u.componentId,className:[W,R("Core")].join(" "),onKeyDown:S=>{N&&N(S),P&&w.SubmitForm(S,L)},onChange:S=>{let{value:T}=S.target;c.ok&&m({ok:!1,notice:[]}),I(x=>d(o({},x),{dataValue:T,eventType:"update",eventID:D()})),K&&K(S)},children:[!!j&&a("option",{value:"null",children:"\u9078\u629E"}),J.map(S=>i.is.nullish(S.value)?null:a("option",{value:S.value,children:S.label},String(S.value)))]}))},Selector:e=>{var n;H(()=>{i(`[data-select-input-value="${String(i.Stringify(e.val_status.dataValue)).replace(/"/g,"_")}"]`).focus()},[]);let t=ie.FilterSelectableOptions(e,!0),l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(h,d(o({},l),{children:a(Re.Body,d(o({className:R("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto"},e.rootStates.SelectorStyles),{freeCSS:o({minWidth:12*6,maxHeight:12*24},(n=e.rootStates.SelectorStyles)==null?void 0:n.freeCSS),children:O(De,{gap:"1/12",padding:[1,0],children:[t.map((f,g)=>{let{type:c,value:m}=f,u=e.val_optionFocused==m,I=e.val_status.dataValue===m;return c=="label"?a(h,{children:f.label},D()):a(ke.Sub.S,d(o({color:"cloud","data-select-input-value":String(i.Stringify(m)).replace(/"/g,"_"),backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:I||u,isActiveStyles:u?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:v=>{e.set_status(p=>d(o({},p),{dataValue:m,eventType:"update",eventID:D()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:O(re.Left,{gap:"1/2",children:[I&&a(ne.Check,{fontColor:"theme"}),a(E.Supplement,{transition:"short",flexSizing:0,children:f.label})]})}),String(i.Stringify(m)))}),!t.length&&a(E.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&i.scope(()=>{let l=e.rootStates.options.find(n=>i.is.equal(n.value,e.val_status.dataValue));l&&t.push(a(h,d(o({},e.rootStates.SelectedCellStyles),{children:l.label}),String(l.value)))}),a($,{children:t})},Core:e=>{var B;let{value:t}=e,[l,n]=k(w.DefaultStatus(e.componentId,t)),[f,g]=k(!1),[c,m]=k(!1),[u,I]=k((B=e.value)!=null?B:null),[v,p]=k({ok:!1,notice:[]}),A={rootStates:e,val_preventOpenSelectorOnFocus:f,set_preventOpenSelectorOnFocus:g,val_optionFocused:u,set_optionFocused:I,val_selectorOpen:c,set_selectorOpen:m,val_status:l,set_status:n,val_validate:v,set_validate:p};return w.CommonEffects({type:"select",states:e,val_status:l,set_status:n,val_validate:v,set_validate:p,SystemValidation:Pe}),O(Be,{val_status:l,set_status:n,val_validate:v,states:e,children:[a(Le,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||l.dataValue!==null}),a(_.Shallow,o({},A)),a(_.Button,o({},A))]})}},se=e=>{var l;let t=o({},e);return t=d(o({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:o({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(E.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(l=t.value)!=null?l:null,t.options.forEach((n,f)=>{let{type:g,value:c,searchValue:m}=n,u=m||i.is.string(c)&&c||i.Stringify(c||"")||"";t.options[f]=d(o({},n),{value:c,searchValue:u,type:g||"selector"})}),i.is.nullish(t.rightIcon)&&(t.rightIcon=a(We,{ssSphere:2,children:a(ne.AngleDown,{})})),a(Ae,{componentId:t.componentId,children:_.Core,states:Ee(t)})};export{se as Select,se as default};
|
package/dist/fn/Input/Slider.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as
|
|
1
|
+
import{b as h,c as I,d as k}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as W}from"react/jsx-runtime";import L,{UUID as E}from"jmini";import{useState as B,useEffect as P}from"react";import{$$fromRoot as D,GenerateHTMLProps as $}from"../../@utils";import{Box as x,Flex as A,Column as q}from"../../atoms";import{Button as O}from"../Button";import{OptionalInputWrapper as G,BoxWrapper as X,CoreEffects as F}from"./core";import{InputSliderClasses as c}from"../../@styles/componentClasses";function j(t){let{value:e,states:n}=t,{required:s}=n,o=[];return s&&!e&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!o.filter(({type:i})=>i=="invalid").length,notice:o}}const z=t=>{let{value:e,val_status:n}=t,{min:s,max:o,step:i}=n;e=Math.max(e,s),e=Math.min(e,o);let a=e/o*o;return a=Math.round(a/i),{stepValue:a*i,stepIndex:a,positionLeft:a*i/o*100+"%"}},N={IndicatorLabels:t=>{let{componentId:e,min:n,max:s,step:o,customLegends:i}=t,r=[],a=Math.round(n/o),d=Math.round(s/o),S=d-a+1;for(var u=a;u<=d;u++){let l=u*o;l=Math.max(l,n),l=Math.min(l,s);let f=l/s*100+"%";r.push(p(x,{className:c("Label"),id:"Legend-"+e+"-"+u,display:u==a||u==d?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:f,whiteSpace:"nowrap",textAlign:"center"},children:i?i(l):l.rank()},l))}return P(()=>{const l=()=>{let f=D("#Labels-"+e),{width:v}=f.position(),C=Math.round(v/50)-1,g=Math.round(S/C);for(let m=a+1;m<d;m++)D("#Legend-"+e+"-"+m).css({display:m%g==0?"flex":"none"})};return L(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{L(window).removeEvent("SliderResizeCallback-"+e)}},[]),p(A,{className:c("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:p(x,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:r})})},Rail:t=>{let{val_status:e,set_status:n,DotData:s,form:o,enableFormSubmit:i}=t,{componentId:r}=e;return W(A,{className:c("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),y.Effects.Start(a,{val_status:e,set_status:n,DotData:s}))},children:[p(x,{className:c("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:r+"_Bar",children:p(x,{className:c("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:r+"_BarColor"})}),p(x,{className:c("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:p(O.Plain,{className:c("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:r+"_Ball",onKeyDown:a=>{y.KeyDownEvent({event:a,val_status:e,set_status:n,DotData:s}),i&&F.SubmitForm(a,o)}})})]})}},y={Effects:{Start:(t,e)=>{L(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:n=>{y.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:n=>{y.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{y.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{y.Effects.End()}})},Move:(t,e)=>{let n=L.getCursor(t).x,{val_status:s,set_status:o}=e,{componentId:i,min:r,max:a}=s,d=D("#"+i+"_Ball"),S=D("#"+i+"_Bar"),u=D("#"+i+"_BarColor"),{width:l,left:f}=S.position(),v=(n-f)/l;v=Math.max(v,0),v=Math.min(v,1);let C=v*a,g=z({value:C,val_status:s}),m=g.positionLeft,w=g.stepValue;return d.css({left:m}),u.css({width:m}),o(R=>{let T=R.dataValue;return w==T?R:I(h({},R),{dataValue:w,eventType:"update",eventID:E()})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{L(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:n,set_status:s}=t,{min:o,max:i,step:r}=n,{key:a,metaKey:d,ctrlKey:S}=e,u=S||d,l=n.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?u?l=o:l-=r:a.match(/Right|Down/)&&(u?l=i:l+=r),l=Math.max(Math.min(l,i),o),s(f=>I(h({},f),{dataValue:l,eventType:"update",eventID:E()})))}},J=t=>{let V=t,{color:e="theme",required:n,form:s="",legends:{enable:o=!0,custom:i,showAlways:r=!1}={},min:a,max:d,step:S,enableFormSubmit:u,checkValidationAtFirst:l,onValidate:f,onValidateDelay:v,onUpdateValue:C,onUpdateValidValue:g,value:m="",className:w,wrapStyles:R}=V,T=k(V,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","className","wrapStyles"]),[b,_]=B({componentId:t.componentId||"",dataValue:m,min:a,max:d,step:S,eventType:"init",eventID:E()}),[M,K]=B({ok:!1,notice:[]});F.CommonEffects({type:"slider",states:t,val_status:b,set_status:_,val_validate:M,set_validate:K,SystemValidation:j});let U=z({value:b.dataValue,val_status:b});return p(X,{val_status:b,set_status:_,val_validate:M,states:t,children:W(q,I(h({gap:"1/2",flexSizing:"auto"},T),{className:[c("Wrap"),w,c("ShowLegendsAlways_"+r)].join(" "),children:[p(N.Rail,{rootStates:t,color:e,val_status:b,set_status:_,DotData:U,form:s,enableFormSubmit:u}),!!o&&p(N.IndicatorLabels,{componentId:b.componentId,min:a,max:d,step:S,customLegends:i})]}))})},H=t=>{let e=I(h({},t),{freeCSS:h({minWidth:120},t.freeCSS)});return p(G,{componentId:t.componentId,children:J,states:$(e)})};export{H as Slider,H as default};
|
package/dist/fn/Input/Switch.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as a,c as i,d as
|
|
1
|
+
import{b as a,c as i,d as k}from"../../chunk-C5N2D3ZX.js";import{jsx as t,jsxs as N}from"react/jsx-runtime";import{UUID as F}from"jmini";import{useState as M}from"react";import c from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as W}from"../Button";import{OptionalInputWrapper as A,BoxWrapper as P,CoreEffects as D}from"./core";import{InputSwitchClasses as f}from"../../@styles/componentClasses";function H(e){let{value:o,states:n}=e,{required:R}=n,l=[];return R&&!o&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:m})=>m=="invalid").length,notice:l}}const O=e=>{let V=e,{componentId:o,color:n="posi",required:R,form:l,id:m,enableFormSubmit:z,checkValidationAtFirst:q,onChange:w,onKeyDown:x,onValidate:K,onValidateDelay:$,onUpdateValue:G,onUpdateValidValue:J,size:C="regular",value:B="",icon:v="",isApply:s=!1}=V,E=k(V,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","size","value","icon","isApply"]),[r,S]=M({componentId:e.componentId||"",dataValue:B,eventType:"init",eventID:F()}),[b,T]=M({ok:!1,notice:[]}),p=!!r.dataValue;D.CommonEffects({type:"switch",states:e,val_status:r,set_status:S,val_validate:b,set_validate:T,SystemValidation:H});let h="middle",g=5,I=3;return s&&(I=4),N(P,{val_status:r,set_status:S,val_validate:b,states:e,children:[t(c,a({htmlTag:"input",type:"checkbox","data-component-id":r.componentId,checked:r.dataValue,className:f("Input"),id:m,onKeyDown:d=>{x&&x(d),z&&D.SubmitForm(d,l)},onChange:d=>{let{checked:L}=d.target;b.ok&&T({ok:!1,notice:[]}),S(_=>i(a({},_),{dataValue:L,eventType:"update",eventID:F()})),w&&w(d)}},E)),t(W.Plain,{tabIndex:-1,htmlFor:m,padding:"1/4",transition:h,borderRadius:"1.tone.primary",className:f("Label"),children:t(c,i(a({},s?{padding:"1/4",isRounded:!0,backgroundColor:p?n:"layer.3"}:{}),{children:N(U.Center,{unitHeight:C=="small"?2:C=="regular"?2.5:C=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(g+I)/g},children:[!s&&t(c,{position:"absolute",backgroundColor:p?n:"layer.5",isRounded:!0,transition:h,width:1,opacity:"middle",className:f("Bar"),freeCSS:{height:"40%"}}),t(c,{position:"absolute",top:0,backgroundColor:!s&&p?n:"white",transition:h,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:f("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:p?`calc(${I.ratio(g+I)}%)`:0},children:v&&t(c,{transition:h,flexCenter:!0,fontColor:p?s?n:"white":"6.clear",children:v})})]})}))})]})},y=e=>{let o=a({},e);return o.value=!!o.value,o.color=o.color||"theme",t(A,{componentId:o.componentId,children:O,states:o})},u=y;u.S=e=>t(y,i(a({},e),{size:"small"})),u.R=e=>t(y,i(a({},e),{size:"regular"})),u.L=e=>t(y,i(a({},e),{size:"large"}));export{u as Switch,u as default};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{b as l,c,d as ne,e as de}from"../../chunk-C5N2D3ZX.js";import{Fragment as xe,jsx as n,jsxs as Y}from"react/jsx-runtime";import b,{UUID as M,useStore as fe}from"jmini";import{useState as K,useEffect as oe}from"react";import{$$fromRoot as
|
|
1
|
+
import{b as l,c,d as ne,e as de}from"../../chunk-C5N2D3ZX.js";import{Fragment as xe,jsx as n,jsxs as Y}from"react/jsx-runtime";import b,{UUID as M,useStore as fe}from"jmini";import{useState as K,useEffect as oe}from"react";import{$$fromRoot as Ne,ExtractStyles as _e}from"../../@utils";import{Box as k,FAI as De}from"../../atoms";import{Literal as re}from"../../mols";import{Tips as ge,Button as Le}from"..";import{faEye as Ee}from"@fortawesome/free-solid-svg-icons/faEye";import{OptionalInputWrapper as He,BoxWrapper as Ae,CoreEffects as W,DefaultBoxishStyles as Be}from"./core";import{InputLabel as Me}from"./Label";import{LeftIcon as $e,RightIcon as be}from".";const ze={katakana:{reg:/^[ァ-ヶー ヲ-゚ ]*$/g,exist:!0,reason:"\u30AB\u30BF\u30AB\u30CA\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},"hankaku.katakana":{reg:/^[ヲ-゚ ]*$/g,exist:!0,reason:"\u534A\u89D2\u30AB\u30BF\u30AB\u30CA\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},number:{reg:/^-?[0-9\.]{0,}[0-9]{1,}$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},digitNumber:{reg:/^-?[0-9\,\.]{0,}[0-9]{1,}$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},fileName:{reg:/[¥\/:*\?\"\'\|\.\s\n\r\<\>]/g,exist:!1,reason:"\u7A7A\u767D\u307E\u305F\u306F\u4E00\u90E8\u306E\u7279\u6B8A\u6587\u5B57\u306F\u4F7F\u7528\u3067\u304D\u307E\u305B\u3093"},creditCard:{reg:/^\d{14,16}$/g,exist:!0,reason:"14~16\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},email:{reg:/^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]+\.[A-Za-z0-9]+$/,exist:!0,reason:Y(xe,{children:[n(k,{children:"\u25CB\u25CB\u25CB\u25CB@\u25CB\u25CB\u25CB\u25CB.\u25CB\u25CB\u25CB\u306E\u5F62\u5F0F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),n(k,{children:"\u6700\u5F8C\u306E\u6587\u5B57\u306B.(\u30C9\u30C3\u30C8)\u3092\u5165\u308C\u308B\u3053\u3068\u306F\u3067\u304D\u307E\u305B\u3093"})]})},password:{reg:/^(?=[^A-Z]*[A-Z])(?=[^a-z]*[a-z])(?=[^0-9]*[0-9]).{8,}$/,exist:!0,reason:"8\u6587\u5B57\u4EE5\u4E0A\u3001\u534A\u89D2\u82F1\u6570\u5927\u5C0F\u6587\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},tel:{reg:/.*$/g,exist:!0,reason:Y(xe,{children:[n(k,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),n(k,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),n(k,{children:"\u6570\u5B57\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"})]})},url:{reg:/^https?:\/\/[^\n\s]+(\.|\:)[^\n\s\.\:]+$/,exist:!0,reason:"URL\u5F62\u5F0F : http(s)://\u25EF\u25EF\u25EF\u25EF"},postal:{reg:/^\d{7}$/g,exist:!0,reason:"7\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}},y={setSelection:t=>{let{id:a,restrict:o,val_status:s}=t,i=Ne("#"+a)[0];if(i&&s.prevValue&&s.formatValue){let{formatValue:e,prevValue:u,caretFrom:d,caretTo:r}=s;if(o=="creditCard")e.length>=u.length&&d%5==0&&(d++,r++),i.setSelectionRange(d,r);else if(o=="postal")e.length==5&&u.length==3&&(d++,r++),i.setSelectionRange(d,r);else if(o=="digitNumber"){let p=e.length-u.length;p==2&&(d++,r++),p==-2&&(d--,r--),i.setSelectionRange(d,r)}}},Validation:{System:t=>{let{value:a,states:o}=t,{restrict:s="text",defaultValidation:i,maxLength:e,multiline:u,required:d}=o,r=[];if(u||(e=e||255),b.is.exist(e)&&a.length>=Number(e)&&r.push({type:"invalid",label:e+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a){let p=y.Validation.Text(a,s,i);p.ok||r.push({type:"invalid",label:p.body})}else d&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!r.filter(({type:p})=>p=="invalid").length,notice:r}},Text:(t,a,o)=>{let s={ok:!0,body:""};return(()=>{let i=o||ze[a];if(!i)return;let e=i.reason;if(i){let u=!!(+!!t.match(i.reg)^+!i.exist);s={ok:u,body:u?"":e}}})(),s},DataLeveling:t=>{let{restrict:a,allowDecimals:o,allowZeroStart:s,value:i=""}=t,e=String(i);["tel","number","digitNumber","postal","creditCard"].includes(a)&&(e=e.zen2hanNumber()),a=="katakana",a=="hankaku.katakana",["postal","creditCard"].includes(a)&&(e=e.removeLetters()),b.scope(()=>{if(!["number","digitNumber"].includes(a))return;e=e.replace(/(\.\d+)\..*/g,"$1").replace(/\.+/g,".").replace(/[^0-9.-]/g,"");let d=Number(e)<0||e[0]=="-";e=e.replace(/[^0-9.]/g,""),d&&(e="-"+e);let r=Number(o);o?e=e.replace(/(\.\d{0,})\..*/g,"$1").replace(/\.(\d{0,})/g,(p,g)=>g.length>r?"."+g.slice(0,r):p):e=e.replace(/\.\d?/g,""),b.scope(()=>{a=="number"&&(s||(e=e.replace(/^0(\d+)/g,"$1").replace(/^-0(\d+)/g,"-$1")))}),b.scope(()=>{let p=e.slice(-1);if(!e||p=="."||p=="-")return;let{min:g,max:S}=t;b.is.exist(g)&&b.is.number(g)&&Number(e)<Number(g)&&(e=String(g.toFixed(r))),b.is.exist(S)&&b.is.number(S)&&Number(e)>Number(S)&&(e=String(S.toFixed(r)))}),b.scope(()=>{if(!e||e=="-"||a!="digitNumber")return;let p=e.slice(-1),[g,S]=e.split(".");e=g.replace(/\B(?=(\d{3})+(?!\d))/g,","),S&&(e+="."+S),p=="."&&(e+=".")})});let u=e;return a=="digitNumber"||(a=="postal"?e.length>=4&&(u=e.clip(0,3)+"-"+e.clip(3)):a=="creditCard"&&(u=e.replace(/.{4}(?=.)/g,"$& "))),e=e.replace(/,/g,""),{formatValue:u,dataValue:e}}},Shallow:t=>{let{rootStates:a,val_status:o}=t,s=o.dataValue||"";oe(()=>{b.scope(()=>de(void 0,null,function*(){if(!a.multiline)return;let p=b('[data-input-origin="'+o.componentId+'"]'),g=b('[data-input-shallow="'+o.componentId+'"]'),S=b('[data-input-min-height-value-shallow="'+o.componentId+'"]'),T=b('[data-input-max-height-value-shallow="'+o.componentId+'"]');if(!p[0]||!g[0]||!S[0]||!T[0])return;let F=g.position(),D=S.position(),f=T.position(),C=0;a.autoHeight&&(C=F.height),C=Math.max(C,D.height),C=Math.min(C,f.height),p[0].style.height=C+"px"}))},[s]);let i=s||"";(!!s.match(/\n$/)||!s)&&(i+="T");let u="",d="";if(a.multiline){let p=a.minRows||1,g=a.maxRows||100;u=`
|
|
2
2
|
T`.repeat(p-1),d=`
|
|
3
|
-
T`.repeat(g-1)}let r=
|
|
3
|
+
T`.repeat(g-1)}let r=_e(a);return Y(k,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[n(re.Description,c(l({className:a.className},r),{position:"absolute",width:1,freeCSS:c(l({},r.freeCSS),{color:"orange"}),"data-input-shallow":o.componentId,children:n(k,{"data-input-value-shallow":o.componentId,children:i})})),n(re.Description,c(l({className:a.className},r),{position:"absolute",left:0,freeCSS:c(l({},r.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":o.componentId,children:u})),n(re.Description,c(l({className:a.className},r),{position:"absolute",right:0,freeCSS:c(l({},r.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":o.componentId,children:d}))]})},InputBox:t=>{let{rootStates:a,val_validate:o,set_validate:s,val_status:i,set_status:e,val_inputType:u,set_inputType:d,val_focus:r,set_focus:p,val_isComposing:g,set_isComposing:S}=t;if(a.multiline)return null;let pe=a,{componentId:T,tone:F,required:D,restrict:f="text",form:C,autoComplete:$="off",autoCapitalize:L="off",minRows:G,maxRows:he,multiline:se,autoHeight:Se,enableFormSubmit:X,clearButton:Q=!1,allowDecimals:A,allowZeroStart:O,checkValidationAtFirst:ue,onChange:j,onKeyDown:ee,onValidate:Ie,onValidateDelay:ve,onUpdateValue:Te,onUpdateValidValue:Re,value:ye="",leftIndicator:Ce,rightIndicator:we,leftIcon:I,rightIcon:Ve,maxLength:te,min:v,max:z,label:ce,isLabelActive:Ze,defaultValidation:Ue,wrapStyles:Ke}=pe,m=ne(pe,["componentId","tone","required","restrict","form","autoComplete","autoCapitalize","minRows","maxRows","multiline","autoHeight","enableFormSubmit","clearButton","allowDecimals","allowZeroStart","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max","label","isLabelActive","defaultValidation","wrapStyles"]);return n(k,c(l({htmlTag:"input",type:u,inputMode:["number","digitNumber","creditCard"].includes(f)?"numeric":f=="email"?"email":"text","data-disabled":a.disabled,"data-show-validation":W.isShowValidation(o,i,!!ue),"data-component-id":i.componentId,"data-input-origin":i.componentId,value:i.formatValue,autoComplete:$,autoCapitalize:L,onKeyDown:x=>{let{key:R,target:N}=x,B=N,{selectionStart:P,selectionEnd:ae}=B,q=Number(P),Z=Number(ae);{let E=i.formatValue[Number(q)],H=i.formatValue[Number(q)-1];R=="Delete"&&(f=="creditCard"&&E==" "||f=="postal"&&E=="-"||f=="digitNumber"&&E==",")&&(B.setSelectionRange(q+1,Z+1),x.preventDefault()),R=="Backspace"&&(f=="creditCard"&&H==" "||f=="postal"&&H=="-"||f=="digitNumber"&&H==",")&&(B.setSelectionRange(q-1,Z-1),x.preventDefault()),R=="Enter"||R=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(f)&&R=="Clear"&&e(E=>c(l({},E),{dataValue:"",formatValue:"",eventType:"update",eventID:M()}))}),b.scope(()=>{if(!["number","digitNumber"].includes(f)||!["ArrowUp","ArrowDown"].includes(R))return;let E=+(R=="ArrowUp")*2-1,H=i.dataValue.slice(-1),me=i.formatValue[Z-1],_=Z-1,V=String(i.formatValue),ie=i.dataValue.split(".")[1],ke=(ie==null?void 0:ie.length)||0;b.scope(()=>{if(!H){V="0";return}if(H=="-"){V+="0";return}if(H=="."){V+="0";return}if(Z==0)return;let le=String(V).slice(0,_).match(/\./),Fe=String(V).slice(_),J=String(Fe.toNumber().toFixed(0)).length;me=="."&&(J=1,_=V.split(".")[0].length-1),me==","&&(J+=1,_--),le&&(J=-1*(ke-J));let U=V[_].toNumber()+E;U<0?U=9:U>=10&&(U=0),V=V.partReplace(_,String(U)),setTimeout(()=>{B.setSelectionRange(_+1,_+1)},1)}),o.ok&&s({ok:!1,notice:[]}),e(le=>c(l(l({},le),y.Validation.DataLeveling({allowDecimals:A,allowZeroStart:O,min:v,max:z,restrict:f,value:V})),{eventType:"update",eventID:M()})),x.preventDefault()}),ee&&ee(x),X&&W.SubmitForm(x,C)},onChange:x=>{let{value:R,selectionStart:N,selectionEnd:B}=x.target,P=y.Validation.DataLeveling({allowDecimals:A,allowZeroStart:O,min:v,max:z,restrict:f,value:R});g&&(P.formatValue=R),P.formatValue!=i.formatValue&&(o.ok&&s({ok:!1,notice:[]}),e(ae=>c(l(l({},ae),P),{prevValue:i.formatValue,eventType:"update",eventID:M(),caretFrom:Number(N),caretTo:Number(B)})),j&&j(x))},width:1},m),{onFocus:x=>{m!=null&&m.onFocus&&(m==null||m.onFocus(x)),p(!0)},onBlur:x=>{m!=null&&m.onBlur&&(m==null||m.onBlur(x)),p(!1)},onCompositionStart:x=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(x)),S(!0)},onCompositionEnd:x=>{if(m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(x)),f=="text")return;let R=y.Validation.DataLeveling({allowDecimals:A,allowZeroStart:O,min:v,max:z,restrict:f,value:i.formatValue});e(N=>c(l(l({},N),R),{prevValue:N.formatValue,eventType:"update",eventID:M(),caretFrom:Number(N.formatValue.length+1),caretTo:Number(N.formatValue.length+1)})),S(!1)}}))},TextAreaBox:t=>{let{rootStates:a,val_focus:o,set_focus:s,val_validate:i,set_validate:e,val_status:u,set_status:d,isShallow:r}=t,te=a,{componentId:p,tone:g,required:S,form:T,label:F,isLabelActive:D,minRows:f,maxRows:C,multiline:$,autoHeight:L,allowDecimals:G,allowZeroStart:he,enableFormSubmit:se,maxLength:Se,checkValidationAtFirst:X,onChange:Q,onKeyDown:A,onValidate:O,onValidateDelay:ue,onUpdateValue:j,onUpdateValidValue:ee,value:Ie="",leftIndicator:ve,rightIndicator:Te,leftIcon:Re,rightIcon:ye,defaultValidation:Ce,wrapStyles:we}=te,I=ne(te,["componentId","tone","required","form","label","isLabelActive","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!a.multiline?null:n(k,c(l({htmlTag:"textarea","data-show-validation":W.isShowValidation(i,u,!!X),"data-input-origin":u.componentId,"data-component-id":u.componentId,value:u.dataValue,width:1},I),{onFocus:v=>{I!=null&&I.onFocus&&(I==null||I.onFocus(v)),s(!0)},onBlur:v=>{I!=null&&I.onBlur&&(I==null||I.onBlur(v)),s(!1)},onKeyDown:v=>{A&&A(v),se&&W.SubmitForm(v,T)},onChange:v=>{let{value:z}=v.target;i.ok&&e({ok:!1,notice:[]}),d(ce=>c(l({},ce),{dataValue:z,eventType:"update",eventID:M()})),Q&&Q(v)}}))}},Pe=t=>{let{componentId:a,restrict:o="text",value:s="",min:i,max:e,allowDecimals:u,allowZeroStart:d}=t,[r,p]=K(!1),[g,S]=K(!1),[T,F]=K({componentId:a,formatValue:"",dataValue:"",prevValue:"",eventType:"init",eventID:M(),caretFrom:null,caretTo:null}),[D,f]=K({ok:!1,notice:[]}),[C,$]=K(["password","concealed"].includes(o)&&"password"||"text");oe(()=>{F(G=>l(l({},G),y.Validation.DataLeveling({allowDecimals:u,allowZeroStart:d,min:i,max:e,restrict:o,value:s}))),fe.set({[a+":set_inputType"]:$})},[]);let L={rootStates:t,val_focus:r,set_focus:p,val_inputType:C,set_inputType:$,val_isComposing:g,set_isComposing:S,val_status:T,set_status:F,val_validate:D,set_validate:f};return W.CommonEffects({type:"textfield",states:t,val_status:T,set_status:F,val_validate:D,set_validate:f,SystemValidation:y.Validation.System,ExtraOverrideStates:()=>y.Validation.DataLeveling({allowDecimals:u,allowZeroStart:d,min:i,max:e,restrict:o,value:s})}),oe(()=>{y.setSelection({id:t.id,restrict:o,val_status:T})},[T]),Y(Ae,{val_status:T,set_status:F,val_validate:D,states:L.rootStates,children:[n(Me,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||r||!!T.dataValue}),n(y.Shallow,l({},L)),n(y.InputBox,l({},L)),n(y.TextAreaBox,l({},L))]})},w=t=>(t=l({autoHeight:!0,restrict:"text",fontSize:"inherit"},t),t.multiline?(t.minRows=t.minRows||5,t.maxRows=t.maxRows||20):(t.minRows=1,t.maxRows=1),n(He,{componentId:t.componentId,children:Pe,states:Be(t)})),h=w;h.Validate=y.Validation.Text,h.Katakana=t=>n(w,c(l({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),h.HankakuKatakana=t=>n(w,c(l({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),h.CreditCard=t=>n(w,c(l({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),h.Tel=t=>n(w,c(l({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),h.Number=t=>n(w,c(l({},t),{restrict:"number",multiline:!1,autoHeight:!1})),h.DigitNumber=t=>n(w,c(l({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),h.Email=t=>n(w,c(l({},t),{restrict:"email",multiline:!1,autoHeight:!1})),h.Url=t=>n(w,c(l({},t),{restrict:"url",multiline:!1,autoHeight:!1})),h.Postal=t=>n(w,c(l({label:"\u90F5\u4FBF\u756A\u53F7"},t),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:n($e,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),h.Password=t=>n(w,c(l({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:n(be,{ssSphere:2,padding:0,freeCSS:{pointerEvents:"all"},children:n(Le.Sub,{ssSphere:2,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:a=>{ge.open(a.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:ge.abort,tabIndex:-1,onClick:a=>{b(a.target).parent().parent().find("input").callback(o=>{let s=o[0];if(!s)return;let i=s.dataset.componentId;if(!i)return;let e=fe.get(i+":set_inputType");e&&e(u=>u==="password"&&"text"||"password")})},children:n(De,{icon:Ee})})}),restrict:"password"},t),{multiline:!1,autoHeight:!1})),h.Concealed=t=>n(h.Password,c(l({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),h.Money={JPY:t=>n(h.DigitNumber,c(l({rightIcon:n(be,{ssSphere:2,fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{h as TextField,Pe as TextInput,h as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as ae,b as l,c as k,d as G}from"../../../chunk-C5N2D3ZX.js";import{Fragment as _e,jsx as y,jsxs as oe}from"react/jsx-runtime";import Q,{UUID as N,useStore as L}from"jmini";import*as K from"jmini";import{useState as W,useEffect as X,useRef as pe}from"react";import{$$fromRoot as ce,Config as re,ExtractStyles as ue}from"../../../@utils";import{Box as z,FAI as de}from"../../../atoms";import{Literal as fe,Row as he}from"../../../mols";import{Button as ie}from"../../Button";import ge from"../../Tooltips";import ye from"../../Sheet";import{faClock as ve}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as Ie}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as Se,BoxWrapper as Te,CoreEffects as H,DefaultBoxishStyles as De}from"../core";import{RightIcon as be}from"..";import xe from"../Select";import{InputLabel as ke}from"../Label";import Ee from"./Picker";const F=" ~ ",we={clock:{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2}],sets:1},date:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2}],sets:1},week:{defaultValue:"----\u5E74\u7B2C--\u9031",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4,region:6},{type:"week",from:6,length:2,region:3}],sets:1},month:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:3}],sets:1},year:{defaultValue:"----\u5E74",format:/^\d{4}$/,ranges:[{type:"year",from:0,length:4,region:5}],sets:1},dates:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2,region:5},{type:"year",from:10+F.length,length:4},{type:"month",from:15+F.length,length:2},{type:"date",from:18+F.length,length:2}],sets:2},months:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:6},{type:"year",from:8+F.length,length:4},{type:"month",from:13+F.length,length:2,region:3}],sets:2},dateWareki:{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"dateWareki",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},O={PeriodMargin:" ~ ",DataLeveling:e=>{let{restrict:t,value:v,era:a}=e,f=Q.flatArray(v||""),{defaultValue:h,format:g,ranges:I,sets:r}=we[t],p=[],o=t=="clock"&&":"||"/";for(let i=0;i<f.length;i++)f[i]=String(f[i]).replace(/\D/ig,o);for(let i=0;i<r;i++){let u=f[i]||"";if(!u.match(g))f[i]="",p.push(h);else{let x=h;u.split(/\D/).forEach((E,V)=>{if(V==0&&t=="dateWareki"){let T=Number(E);a!="year"&&(T>=2019?a=="reiwa"?T-=2018:a=="heisei"&&(T=31):T>=1989?a=="heisei"?T-=1988:a=="shouwa"&&(T=64):T>=1926?a=="shouwa"?T-=1925:a=="taisho"&&(T=15):T>=1912?a=="taisho"?T-=1911:a=="meiji"&&(T=45):T>=1868&&(T-=1867)),E=T.zeroEmbed(4)}x=x.replace(new RegExp("------------------".slice(0,E.length)),E)}),p.push(x)}}return{formatValue:p.join(F),dataValue:["dates","months"].includes(t)?f:f[0],ranges:I}},SystemValidation:e=>{let{states:t}=e,{restrict:v,min:a,max:f,required:h}=t,g=[],I=Q.flatArray(e.value),r={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let p=v=="clock"&&":"||"/";for(let o=0;o<I.length;o++)I[o]=String(I[o]).replace(/\D/ig,p);for(let o=0;o<I.length;o++){let i=I[o],u=I[o-1];i.removeLetters()||(r.empty=!0),o>0&&(r.escalated&=+(i>=u))}r.escalated&&(r.empty||(v.match(/clock/)?I.forEach(o=>{let[i,u]=o.split(/\D+/);!i||!u?r.filled=!1:(Number(i)>23||Number(u)>59)&&(r.correct=!1)}):v.match(/date/)?I.forEach(o=>{let[i,u,x]=o.split(/\D+/);if(!i||!u||!x)r.filled=!1;else{let E=K.Time(o);(!E.validate||o!=E.toFormatYMD())&&(r.correct=!1)}}):v.match(/week/)?I.forEach(o=>{let[i,u]=o.split(/\D+/);if(!i||!u)r.filled=!1;else{let x=K.Time(i+"/01/01").weekday,V=K.Time(i+"/01/0"+(7-x+1)).addWeek(Number(u)-1);i!=String(V.year)&&(r.correct=!1)}}):v.match(/month/)?I.forEach(o=>{let[i,u]=o.split(/\D+/);!i||!u?r.filled=!1:K.Time([i,u,"01"].join("/")).validate||(r.correct=!1)}):v.match(/year/),r.filled&&r.correct&&I.forEach(o=>{{let i=Number(String(o).replace(/\D/ig,""));if(a&&Number(String(a).replace(/\D/ig,""))>i&&(r.prohibited=!0),f){let u=Number(String(f).replace(/\D/ig,""));i>u&&(r.prohibited=!0)}}})))})();{let{empty:p,escalated:o,filled:i,correct:u,prohibited:x}=r;p&&h&&(g=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),o||g.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),u||g.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),i||g.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),x&&g.push({type:"invalid",label:oe(_e,{children:[y(z,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",a||"\u4E0B\u9650\u7121\u3057","] ~ [",f||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!g.filter(({type:p})=>p=="invalid").length,notice:g}},KeyDownEvent:e=>{let{val_era:t,restrict:v,event:a,val_status:f,set_status:h,val_focus:g,set_focus:I}=e,{key:r,shiftKey:p,ctrlKey:o,metaKey:i}=a,u=o||i,{selectionStart:x,selectionEnd:E}=a.target,{index:V,prevIndex:T}=g,{ranges:$,formatValue:Y}=f,C=$.length-1;if(["Tab","ArrowLeft","ArrowRight"].includes(r)){let S=0;if(r=="Tab"){let s=+!p*2-1;if(S=g.index+s,S<0||S>C)return}else{let s=r=="ArrowLeft"?-1:r=="ArrowRight"?1:0;u||x==0&&E==String(f.formatValue).length?S=s==1?C:0:S=Math.max(0,Math.min(V+s,C))}I(s=>k(l({},s),{index:S,prevIndex:V})),a.preventDefault()}if(["Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9"].includes(r)){a.preventDefault();let S=V;S=Math.max(S,0),S=Math.min(S,C);let{type:s,from:U,length:q}=$[S],_=Y.slice(U,U+q),c;if(r=="Backspace")c="------".slice(0,q);else if(["ArrowUp","ArrowDown"].includes(r)){let w=r=="ArrowUp"?1:-1;_=_|0,c=_+w;let[n,m,D]=s=="dateWareki"?t=="year"?[0,2999,4]:t=="reiwa"?[1,2999,4]:t=="heisei"?[1,31,4]:t=="shouwa"?[1,64,4]:t=="taisho"?[1,15,4]:t=="meiji"?[1,45,4]:[0,0,0]:s=="minute"?[0,59,2]:s=="hour"?[0,23,2]:s=="date"?[1,31,2]:s=="week"?[1,53,2]:s=="month"?[1,12,2]:s=="year"?[0,2999,4]:[0,0,0];c>m?c=n:c<n&&(c=m),c=Number(c).zeroEmbed(D)}else if(["0","1","2","3","4","5","6","7","8","9"].includes(r)){let w=_|0,n=r,m=`${w}${n}`;if(T!=V&&(w=0,m="0"+n),s=="year"||s=="dateWareki"&&t=="year")Number(m)>1e4?c=n:c=m,(c|0)>1e3&&S++;else if(["hour","minute","date","week","month"].includes(s)||s=="dateWareki"&&t!="year"){let D=s=="dateWareki"?t=="reiwa"?100:t=="heisei"?31:t=="shouwa"?64:t=="taisho"?15:t=="meiji"?45:0:s=="minute"?59:s=="hour"?23:s=="date"?31:s=="week"?53:s=="month"?12:0;c=(m|0)>D?n:m,(Number(n)>Number(String(D)[0])||_=="0000".slice(0,String(D).length)&&(m!="0000".slice(0,String(D).length)||["minute","hour"].includes(s)&&T==V)||(m|0)>=ae(10,String(D).length-1))&&S++}s=="year"||s=="dateWareki"?c=(c|0).zeroEmbed(4):c=(c|0).zeroEmbed(2)}{let w=String(Y).partReplace(U,String(c)),n=w.split(F).map(m=>m.replace(/(^\D|\D$)/,"").split(/\D+/).join(v=="clock"&&":"||"/").replace(/(^\D|\D$)/,""));if(v=="dateWareki"){let m=n[0].split(/\D/),[D,j,P]=m;m.length==3&&D&&(n=[[Number(D)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[t]),j,P].join("/")])}S=Math.max(S,0),S=Math.min(S,C),h(m=>k(l({},m),{dataValue:["dates","months"].includes(v)?n:n[0],formatValue:w,eventType:"update",eventID:N()})),I(m=>k(l({},m),{index:S,prevIndex:m.index}))}}}},ne={picker:{launch:e=>{let t=e.sheetID||N(),p=e,{onValueUpdate:v,min:a,max:f,era:h,restrict:g,defaultValue:I}=p,r=G(p,["onValueUpdate","min","max","era","restrict","defaultValue"]);ye.open("middleCenter",k(l({sheetID:t,size:"S",padding:0,closeAtAroundClick:!0,closeAtParentBlur:!1},r),{content:y(he.Center,{children:y(Ee,{restrict:g,min:a,max:f,era:h,defaultValue:I,sheetID:t,onValueUpdate:(o,i)=>{v(o,i)}})})}))},remove:e=>{ge.close(e)}}},Ve={Shallow:e=>{let{rootStates:t,val_status:v}=e,a=ue(t);return y(z,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:y(fe.Description,k(l({className:t.className},a),{position:"absolute",width:1,freeCSS:k(l({},a.freeCSS),{color:"orange"}),children:y(z,{"data-input-value-shallow":v.componentId,children:"A"})}))})}},Re=e=>{let ee=e,{tone:t,required:v,restrict:a="clock",componentId:f,era:h,form:g,name:I,min:r,max:p,className:o,enableFormSubmit:i,checkValidationAtFirst:u,onKeyDown:x,onValidate:E,onUpdateValue:V,onUpdateValidValue:T,value:$="",leftIndicator:Y,rightIndicator:C,leftIcon:S,rightIcon:s,freeCSS:U,wrapStyles:q}=ee,_=G(ee,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[c,w]=W(h),[n,m]=W({componentId:e.componentId||"",formatValue:"",dataValue:"",ranges:[],eventType:"init",eventID:N()}),[D,j]=W({ok:!1,notice:[]}),[P,B]=W({active:!1,index:0,prevIndex:-1}),le={rootStates:e,val_status:n,set_status:m,val_validate:D,set_validate:j,val_era:c,set_era:w,val_focus:P,set_focus:B};H.CommonEffects({type:"time",states:e,val_status:n,set_status:m,val_validate:D,set_validate:j,SystemValidation:O.SystemValidation,ExtraOverrideStates:()=>O.DataLeveling({restrict:a,value:$,era:c})}),X(()=>{m(d=>l(l({},d),O.DataLeveling({restrict:a,value:$,era:c})))},[]);const Z=pe(!1);return X(()=>{if(Z.current){m(b=>l(l({},b),O.DataLeveling({restrict:a,value:b.dataValue,era:c})));let d=L.get("refreshEra_"+n.componentId);d&&d.refreshEra(c)}else Z.current=!0},[c]),L.update({[n.componentId]:{openPicker:d=>{e.disabled||ne.picker.launch({parent:d,sheetID:"PickerTips-"+n.componentId,restrict:a,min:r,max:p,defaultValue:n.dataValue,era:c,onValueUpdate:(b,A)=>{m(M=>k(l(l({},M),O.DataLeveling({restrict:a,value:b,era:A})),{eventType:"update",eventID:N()})),w(A)}})},resetEra:d=>{w(d),m(b=>k(l(l({},b),O.DataLeveling({restrict:a,value:"",era:c})),{eventType:"update",eventID:N()}))}}}),X(()=>{let{index:d,active:b}=P;if(b){d=Math.max(d,0),d=Math.min(d,n.ranges.length-1);let{from:A,length:M}=n.ranges[d],J=ce("#"+e.id)[0];J&&J.setSelectionRange(A,A+M)}},[P]),oe(Te,{val_status:n,set_status:m,val_validate:D,states:e,children:[y(Ve.Shallow,l({},le)),y(ke,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),re.get().isTouchDevice?y(ie.Plain,k(l({"data-show-validation":H.isShowValidation(D,n,!!u),"data-component-id":n.componentId,"data-input-origin":n.componentId,"data-disabled":e.disabled,className:o,freeCSS:{textAlign:"left"}},_),{children:n.formatValue,onClick:d=>{let b=L.get(n.componentId);b&&b.openPicker(`[data-input-origin="${n.componentId}"]`),d.stopPropagation()}})):y(z,l({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":H.isShowValidation(D,n,!!u),"data-input-origin":n.componentId,"data-disabled":e.disabled,value:n.formatValue,className:o,tabIndex:re.get().isTouchDevice?-1:0,onKeyDown:d=>{O.KeyDownEvent({restrict:a,event:d,val_era:c,val_status:n,set_status:m,val_focus:P,set_focus:B}),x&&x(d),i&&H.SubmitForm(d,g)},onKeyUp:d=>{d.key=="Tab"&&B(b=>k(l({},b),{active:!0}))},onClick:d=>{let b=d.target.selectionEnd,A=0;n.ranges.forEach((M,J)=>{let{from:te,length:se,region:me}=M;te<=b&&b<=te+(me||se)&&(A=J)}),B(M=>k(l({},M),{active:!0,index:A})),d.preventDefault()},onChange:()=>{}},_))]})},R={Origin:e=>{let t=l({fontSize:"inherit",width:1},e),[v]=W(e.componentId||N());if(t.componentId=v,Q.is.nullish(t.rightIcon)){let a=(e.restrict||"").match(/clock/)?ve:Ie;t.rightIcon=y(be,{ssSphere:2,freeCSS:{pointerEvents:"all"},children:y(ie.Sub,{color:"cloud",border:"unset",ssSphere:2,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+t.componentId,onClick:()=>{let f=L.get(t.componentId);f&&f.openPicker("#Picker-"+t.componentId)},children:y(de,{icon:a})})})}return y(Se,{componentId:t.componentId,children:Re,states:De(t)})},Clock:e=>y(R.Origin,l({restrict:"clock",era:"clock"},e)),Date:e=>y(R.Origin,l({restrict:"date"},e)),Week:e=>y(R.Origin,l({restrict:"week"},e)),Month:e=>y(R.Origin,l({restrict:"month"},e)),Year:e=>y(R.Origin,l({restrict:"year"},e)),DateWareki:e=>{e=l({},e);let[t]=W(e.componentId||N());e.componentId=t;let{defaultEra:v="wareki"}=e,[a,f]=W((()=>{let h="year";if(v=="wareki"&&(h="reiwa",e.value)){let[g,I,r]=e.value.split(/\D/);if(g&&I&&r){let p=Number(g);p>=2019?(p-=2019,h="reiwa"):p>=1989?(p-=1989,h="heisei"):p>=1926?(p-=1926,h="shouwa"):p>=1912?(p-=1912,h="taisho"):p>=1868&&(p-=1868,h="meiji"),p+=1}}return h})());return X(()=>{L.set({["refreshEra_"+t]:{refreshEra:h=>{f(h)}}})},[]),y(R.Origin,k(l({restrict:"dateWareki",leftIndicator:y(xe,{label:"\u5143\u53F7",emptySelect:!1,value:a,tone:e.tone||"border",override:"force",flexCenter:!0,borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",height:1,freeCSS:{whiteSpace:"nowrap"},options:[{value:"year",label:"\u897F\u66A6"},{value:"reiwa",label:"\u4EE4\u548C"},{value:"heisei",label:"\u5E73\u6210"},{value:"shouwa",label:"\u662D\u548C"},{value:"taisho",label:"\u5927\u6B63"},{value:"meiji",label:"\u660E\u6CBB"}],onUpdateValidValue:h=>{f(h);let g=L.get(e.componentId);g&&g.resetEra&&g.resetEra(h)}})},e),{era:a}))},Periods:{Date:e=>y(R.Origin,l({restrict:"dates"},e)),Month:e=>y(R.Origin,l({restrict:"months"},e))},fn:ne};export{R as Time,R as default};
|
|
1
|
+
import{a as re,b as l,c as E,d as Q}from"../../../chunk-C5N2D3ZX.js";import{Fragment as Ae,jsx as h,jsxs as le}from"react/jsx-runtime";import Z,{UUID as N,useStore as L}from"jmini";import*as X from"jmini";import{useState as W,useEffect as z,useRef as ce}from"react";import{$$fromRoot as ue,Config as ie,ExtractStyles as de}from"../../../@utils";import{Box as H,FAI as fe}from"../../../atoms";import{Literal as he,Row as ge}from"../../../mols";import{Button as ne}from"../../Button";import ye from"../../Tooltips";import ve from"../../Sheet";import{faClock as Ie}from"@fortawesome/free-solid-svg-icons/faClock";import{faCalendarAlt as Se}from"@fortawesome/free-solid-svg-icons/faCalendarAlt";import{OptionalInputWrapper as Te,BoxWrapper as De,CoreEffects as Y,DefaultBoxishStyles as be}from"../core";import{RightIcon as xe}from"..";import ke from"../Select";import{InputLabel as Ee}from"../Label";import we from"./Picker";const F=" ~ ",Ve={clock:{defaultValue:"--:--",format:/^\d{2}\D\d{2}$/,ranges:[{type:"hour",from:0,length:2},{type:"minute",from:3,length:2}],sets:1},date:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2}],sets:1},week:{defaultValue:"----\u5E74\u7B2C--\u9031",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4,region:6},{type:"week",from:6,length:2,region:3}],sets:1},month:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:3}],sets:1},year:{defaultValue:"----\u5E74",format:/^\d{4}$/,ranges:[{type:"year",from:0,length:4,region:5}],sets:1},dates:{defaultValue:"----/--/--",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2},{type:"date",from:8,length:2,region:5},{type:"year",from:10+F.length,length:4},{type:"month",from:15+F.length,length:2},{type:"date",from:18+F.length,length:2}],sets:2},months:{defaultValue:"----\u5E74--\u6708",format:/^\d{4}\D\d{2}$/,ranges:[{type:"year",from:0,length:4},{type:"month",from:5,length:2,region:6},{type:"year",from:8+F.length,length:4},{type:"month",from:13+F.length,length:2,region:3}],sets:2},dateWareki:{defaultValue:"----\u5E74--\u6708--\u65E5",format:/^\d{4}\D\d{2}\D\d{2}$/,ranges:[{type:"dateWareki",from:0,length:4,region:5},{type:"month",from:5,length:2,region:3},{type:"date",from:8,length:2,region:3}],sets:1}},O={PeriodMargin:" ~ ",DataLeveling:e=>{let{restrict:a,value:g,era:r}=e,u=Z.flatArray(g||""),{defaultValue:d,format:f,ranges:y,sets:i}=Ve[a],m=[],o=a=="clock"&&":"||"/";for(let n=0;n<u.length;n++)u[n]=String(u[n]).replace(/\D/ig,o);for(let n=0;n<i;n++){let p=u[n]||"";if(!p.match(f))u[n]="",m.push(d);else{let k=d;p.split(/\D/).forEach((w,V)=>{if(V==0&&a=="dateWareki"){let S=Number(w);r!="year"&&(S>=2019?r=="reiwa"?S-=2018:r=="heisei"&&(S=31):S>=1989?r=="heisei"?S-=1988:r=="shouwa"&&(S=64):S>=1926?r=="shouwa"?S-=1925:r=="taisho"&&(S=15):S>=1912?r=="taisho"?S-=1911:r=="meiji"&&(S=45):S>=1868&&(S-=1867)),w=S.zeroEmbed(4)}k=k.replace(new RegExp("------------------".slice(0,w.length)),w)}),m.push(k)}}return{formatValue:m.join(F),dataValue:["dates","months"].includes(a)?u:u[0],ranges:y}},SystemValidation:e=>{let{states:a}=e,{restrict:g,min:r,max:u,required:d}=a,f=[],y=Z.flatArray(e.value),i={empty:!1,escalated:1,filled:!0,correct:!0,prohibited:!1};(()=>{let m=g=="clock"&&":"||"/";for(let o=0;o<y.length;o++)y[o]=String(y[o]).replace(/\D/ig,m);for(let o=0;o<y.length;o++){let n=y[o],p=y[o-1];n.removeLetters()||(i.empty=!0),o>0&&(i.escalated&=+(n>=p))}i.escalated&&(i.empty||(g.match(/clock/)?y.forEach(o=>{let[n,p]=o.split(/\D+/);!n||!p?i.filled=!1:(Number(n)>23||Number(p)>59)&&(i.correct=!1)}):g.match(/date/)?y.forEach(o=>{let[n,p,k]=o.split(/\D+/);if(!n||!p||!k)i.filled=!1;else{let w=X.Time(o);(!w.validate||o!=w.toFormatYMD())&&(i.correct=!1)}}):g.match(/week/)?y.forEach(o=>{let[n,p]=o.split(/\D+/);if(!n||!p)i.filled=!1;else{let k=X.Time(n+"/01/01").weekday,V=X.Time(n+"/01/0"+(7-k+1)).addWeek(Number(p)-1);n!=String(V.year)&&(i.correct=!1)}}):g.match(/month/)?y.forEach(o=>{let[n,p]=o.split(/\D+/);!n||!p?i.filled=!1:X.Time([n,p,"01"].join("/")).validate||(i.correct=!1)}):g.match(/year/),i.filled&&i.correct&&y.forEach(o=>{{let n=Number(String(o).replace(/\D/ig,""));if(r&&Number(String(r).replace(/\D/ig,""))>n&&(i.prohibited=!0),u){let p=Number(String(u).replace(/\D/ig,""));n>p&&(i.prohibited=!0)}}})))})();{let{empty:m,escalated:o,filled:n,correct:p,prohibited:k}=i;m&&d&&(f=[{type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}]),o||f.push({type:"invalid",label:"\u6642\u7CFB\u5217\u3092\u6B63\u3057\u304F\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),p||f.push({type:"invalid",label:"\u7121\u52B9\u306A\u5024\u304C\u5165\u529B\u3055\u308C\u3066\u3044\u307E\u3059"}),n||f.push({type:"invalid",label:"\u6700\u5F8C\u307E\u3067\u5024\u3092\u57CB\u3081\u3066\u304F\u3060\u3055\u3044"}),k&&f.push({type:"invalid",label:le(Ae,{children:[h(H,{children:"\u5165\u529B\u7BC4\u56F2\u304C\u5236\u9650\u3055\u308C\u3066\u3044\u307E\u3059"}),"[",r||"\u4E0B\u9650\u7121\u3057","] ~ [",u||"\u4E0A\u9650\u7121\u3057","]"]})})}return{ok:!f.filter(({type:m})=>m=="invalid").length,notice:f}},KeyDownEvent:e=>{let{val_era:a,restrict:g,event:r,val_status:u,set_status:d,val_focus:f,set_focus:y}=e,{key:i,shiftKey:m,ctrlKey:o,metaKey:n}=r,p=o||n,{selectionStart:k,selectionEnd:w}=r.target,{index:V,prevIndex:S}=f,{ranges:q,formatValue:$}=u,A=q.length-1;if(["Tab","ArrowLeft","ArrowRight"].includes(i)){let v=0;if(i=="Tab"){let s=+!m*2-1;if(v=f.index+s,v<0||v>A)return}else{let s=i=="ArrowLeft"?-1:i=="ArrowRight"?1:0;p||k==0&&w==String(u.formatValue).length?v=s==1?A:0:v=Math.max(0,Math.min(V+s,A))}y(s=>E(l({},s),{index:v,prevIndex:V})),r.preventDefault()}if(["Backspace","ArrowUp","ArrowDown","0","1","2","3","4","5","6","7","8","9"].includes(i)){r.preventDefault();let v=V;v=Math.max(v,0),v=Math.min(v,A);let{type:s,from:U,length:G}=q[v],P=$.slice(U,U+G),I;if(i=="Backspace")I="------".slice(0,G);else if(["ArrowUp","ArrowDown"].includes(i)){let D=i=="ArrowUp"?1:-1;P=P|0,I=P+D;let[b,t,T]=s=="dateWareki"?a=="year"?[0,2999,4]:a=="reiwa"?[1,2999,4]:a=="heisei"?[1,31,4]:a=="shouwa"?[1,64,4]:a=="taisho"?[1,15,4]:a=="meiji"?[1,45,4]:[0,0,0]:s=="minute"?[0,59,2]:s=="hour"?[0,23,2]:s=="date"?[1,31,2]:s=="week"?[1,53,2]:s=="month"?[1,12,2]:s=="year"?[0,2999,4]:[0,0,0];I>t?I=b:I<b&&(I=t),I=Number(I).zeroEmbed(T)}else if(["0","1","2","3","4","5","6","7","8","9"].includes(i)){let D=P|0,b=i,t=`${D}${b}`;if(S!=V&&(D=0,t="0"+b),s=="year"||s=="dateWareki"&&a=="year")Number(t)>1e4?I=b:I=t,(I|0)>1e3&&v++;else if(["hour","minute","date","week","month"].includes(s)||s=="dateWareki"&&a!="year"){let T=s=="dateWareki"?a=="reiwa"?100:a=="heisei"?31:a=="shouwa"?64:a=="taisho"?15:a=="meiji"?45:0:s=="minute"?59:s=="hour"?23:s=="date"?31:s=="week"?53:s=="month"?12:0;I=(t|0)>T?b:t,(Number(b)>Number(String(T)[0])||P=="0000".slice(0,String(T).length)&&(t!="0000".slice(0,String(T).length)||["minute","hour"].includes(s)&&S==V)||(t|0)>=re(10,String(T).length-1))&&v++}s=="year"||s=="dateWareki"?I=(I|0).zeroEmbed(4):I=(I|0).zeroEmbed(2)}{let D=String($).partReplace(U,String(I)),b=D.split(F).map(t=>t.replace(/(^\D|\D$)/,"").split(/\D+/).join(g=="clock"&&":"||"/").replace(/(^\D|\D$)/,""));if(g=="dateWareki"){let t=b[0].split(/\D/),[T,C,j]=t;t.length==3&&T&&(b=[[Number(T)-1+Number({year:1,reiwa:2019,heisei:1989,shouwa:1926,taisho:1912,meiji:1868}[a]),C,j].join("/")])}v=Math.max(v,0),v=Math.min(v,A),d(t=>E(l({},t),{dataValue:["dates","months"].includes(g)?b:b[0],formatValue:D,eventType:"update",eventID:N()})),y(t=>E(l({},t),{index:v,prevIndex:t.index}))}}}},oe={picker:{launch:e=>{let a=e.sheetID||N(),m=e,{onValueUpdate:g,min:r,max:u,era:d,restrict:f,defaultValue:y}=m,i=Q(m,["onValueUpdate","min","max","era","restrict","defaultValue"]);ve.open("middleCenter",E(l({sheetID:a,size:"S",padding:0,closeAtAroundClick:!0,closeAtParentBlur:!1},i),{content:h(ge.Center,{children:h(we,{restrict:f,min:r,max:u,era:d,defaultValue:y,sheetID:a,onValueUpdate:(o,n)=>{g(o,n)}})})}))},remove:e=>{ye.close(e)}}},Re={Shallow:e=>{let{rootStates:a,val_status:g}=e,r=de(a);return h(H,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:h(he.Description,E(l({className:a.className},r),{position:"absolute",width:1,freeCSS:E(l({},r.freeCSS),{color:"orange"}),children:h(H,{"data-input-value-shallow":g.componentId,children:"A"})}))})}},_e=e=>{let te=e,{tone:a,required:g,restrict:r="clock",componentId:u,era:d,form:f,name:y,min:i,max:m,className:o,enableFormSubmit:n,checkValidationAtFirst:p,onKeyDown:k,onValidate:w,onUpdateValue:V,onUpdateValidValue:S,onValidateDelay:q,value:$="",leftIndicator:A,rightIndicator:v,leftIcon:s,rightIcon:U,freeCSS:G,wrapStyles:P}=te,I=Q(te,["tone","required","restrict","componentId","era","form","name","min","max","className","enableFormSubmit","checkValidationAtFirst","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","onValidateDelay","value","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[D,b]=W(d),[t,T]=W({componentId:e.componentId||"",formatValue:"",dataValue:"",ranges:[],eventType:"init",eventID:N()}),[C,j]=W({ok:!1,notice:[]}),[B,J]=W({active:!1,index:0,prevIndex:-1}),se={rootStates:e,val_status:t,set_status:T,val_validate:C,set_validate:j,val_era:D,set_era:b,val_focus:B,set_focus:J};Y.CommonEffects({type:"time",states:e,val_status:t,set_status:T,val_validate:C,set_validate:j,SystemValidation:O.SystemValidation,ExtraOverrideStates:()=>O.DataLeveling({restrict:r,value:$,era:D})}),z(()=>{T(c=>l(l({},c),O.DataLeveling({restrict:r,value:$,era:D})))},[]);const ee=ce(!1);return z(()=>{if(ee.current){T(x=>l(l({},x),O.DataLeveling({restrict:r,value:x.dataValue,era:D})));let c=L.get("refreshEra_"+t.componentId);c&&c.refreshEra(D)}else ee.current=!0},[D]),L.update({[t.componentId]:{openPicker:c=>{e.disabled||oe.picker.launch({parent:c,sheetID:"PickerTips-"+t.componentId,restrict:r,min:i,max:m,defaultValue:t.dataValue,era:D,onValueUpdate:(x,_)=>{T(M=>E(l(l({},M),O.DataLeveling({restrict:r,value:x,era:_})),{eventType:"update",eventID:N()})),b(_)}})},resetEra:c=>{b(c),T(x=>E(l(l({},x),O.DataLeveling({restrict:r,value:"",era:D})),{eventType:"update",eventID:N()}))}}}),z(()=>{let{index:c,active:x}=B;if(x){c=Math.max(c,0),c=Math.min(c,t.ranges.length-1);let{from:_,length:M}=t.ranges[c],K=ue("#"+e.id)[0];K&&K.setSelectionRange(_,_+M)}},[B]),le(De,{val_status:t,set_status:T,val_validate:C,states:e,children:[h(Re.Shallow,l({},se)),h(Ee,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:!0}),ie.get().isTouchDevice?h(ne.Plain,E(l({"data-show-validation":Y.isShowValidation(C,t,!!p),"data-component-id":t.componentId,"data-input-origin":t.componentId,"data-disabled":e.disabled,className:o,freeCSS:{textAlign:"left"}},I),{children:t.formatValue,onClick:c=>{let x=L.get(t.componentId);x&&x.openPicker(`[data-input-origin="${t.componentId}"]`),c.stopPropagation()}})):h(H,l({htmlTag:"input",type:"text",inputMode:"numeric","data-show-validation":Y.isShowValidation(C,t,!!p),"data-input-origin":t.componentId,"data-disabled":e.disabled,value:t.formatValue,className:o,tabIndex:ie.get().isTouchDevice?-1:0,onKeyDown:c=>{O.KeyDownEvent({restrict:r,event:c,val_era:D,val_status:t,set_status:T,val_focus:B,set_focus:J}),k&&k(c),n&&Y.SubmitForm(c,f)},onKeyUp:c=>{c.key=="Tab"&&J(x=>E(l({},x),{active:!0}))},onClick:c=>{let x=c.target.selectionEnd,_=0;t.ranges.forEach((M,K)=>{let{from:ae,length:me,region:pe}=M;ae<=x&&x<=ae+(pe||me)&&(_=K)}),J(M=>E(l({},M),{active:!0,index:_})),c.preventDefault()},onChange:()=>{}},I))]})},R={Origin:e=>{let a=l({fontSize:"inherit",width:1},e),[g]=W(e.componentId||N());if(a.componentId=g,Z.is.nullish(a.rightIcon)){let r=(e.restrict||"").match(/clock/)?Ie:Se;a.rightIcon=h(xe,{ssSphere:2,freeCSS:{pointerEvents:"all"},children:h(ne.Sub,{color:"cloud",border:"unset",ssSphere:2,fontColor:"theme",boxShadow:"0.normal",borderRadius:"3.tone.tertiary",flexCenter:!0,ssEffectsOnActive:"push",tabIndex:-1,id:"Picker-"+a.componentId,onClick:()=>{let u=L.get(a.componentId);u&&u.openPicker("#Picker-"+a.componentId)},children:h(fe,{icon:r})})})}return h(Te,{componentId:a.componentId,children:_e,states:be(a)})},Clock:e=>h(R.Origin,l({restrict:"clock",era:"clock"},e)),Date:e=>h(R.Origin,l({restrict:"date"},e)),Week:e=>h(R.Origin,l({restrict:"week"},e)),Month:e=>h(R.Origin,l({restrict:"month"},e)),Year:e=>h(R.Origin,l({restrict:"year"},e)),DateWareki:e=>{e=l({},e);let[a]=W(e.componentId||N());e.componentId=a;let{defaultEra:g="wareki"}=e,[r,u]=W((()=>{let d="year";if(g=="wareki"&&(d="reiwa",e.value)){let[f,y,i]=e.value.split(/\D/);if(f&&y&&i){let m=Number(f);m>=2019?(m-=2019,d="reiwa"):m>=1989?(m-=1989,d="heisei"):m>=1926?(m-=1926,d="shouwa"):m>=1912?(m-=1912,d="taisho"):m>=1868&&(m-=1868,d="meiji"),m+=1}}return d})());return z(()=>{L.set({["refreshEra_"+a]:{refreshEra:d=>{u(d)}}})},[]),h(R.Origin,E(l({restrict:"dateWareki",leftIndicator:h(ke,{label:"\u5143\u53F7",emptySelect:!1,value:r,tone:e.tone||"border",override:"force",flexCenter:!0,borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",height:1,freeCSS:{whiteSpace:"nowrap"},options:[{value:"year",label:"\u897F\u66A6"},{value:"reiwa",label:"\u4EE4\u548C"},{value:"heisei",label:"\u5E73\u6210"},{value:"shouwa",label:"\u662D\u548C"},{value:"taisho",label:"\u5927\u6B63"},{value:"meiji",label:"\u660E\u6CBB"}],onUpdateValidValue:d=>{u(d);let f=L.get(e.componentId);f&&f.resetEra&&f.resetEra(d)}})},e),{era:r}))},Periods:{Date:e=>h(R.Origin,l({restrict:"dates"},e)),Month:e=>h(R.Origin,l({restrict:"months"},e))},fn:oe};export{R as Time,R as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as d,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as V}from"react/jsx-runtime";import{useState as k,useEffect as g}from"react";import c,{UUID as y,useStore as v}from"jmini";import{$$fromRoot as
|
|
1
|
+
import{b as o,c as d,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as V}from"react/jsx-runtime";import{useState as k,useEffect as g}from"react";import c,{UUID as y,useStore as v}from"jmini";import{$$fromRoot as D,Config as B}from"../../@utils";import{InputClasses as _}from"../../@styles/componentClasses";import{Box as E,Flex as w,FAI as R,Column as N}from"../../atoms";import{Row as x,Literal as F}from"../../mols";import{Button as L}from"../Button";import h from"../Tooltips";const et=t=>{let[n]=k(t.componentId||y());t=o({},t),t.states=d(o({enableFormSubmit:!0,status_id:y(),override:"never",form:"",id:y(),"aria-label":"Input-"+n},t.states),{componentId:n});let{children:e}=t;return p(e,o({},t.states))},at=t=>{let{children:n,val_status:e,val_validate:a,states:i}=t,{leftIcon:l,wrapStyles:s}=i;return e.eventType=="init"&&!i.checkValidationAtFirst&&(a.notice=[]),V(x.Center,d(o({position:"relative",verticalAlign:"unset",gap:0},s),{className:_("Wrapper"),"data-notice-uid":e.componentId,children:[p(C.Notice,{notice:a.notice,val_status:e}),i.leftIndicator,V(w,{position:"relative",flexSizing:"auto",children:[n,l,p(C.RightIcon,o({},t)),p(C.ClearButton,o({},t))]}),i.rightIndicator]}))},C={ClearButton:t=>!t.states.clearButton||!t.val_status.dataValue?null:p(L.Normal,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",right:1,top:"50%",freeCSS:{zIndex:3,transform:"translateY(-50%)"},onClick:()=>{t.set_status(n=>d(o({},n),{dataValue:"",formatValue:"",eventType:"update",eventID:y()}))},children:p(R.X,{})}),RightIcon:t=>t.states.clearButton&&t.val_status.dataValue?null:t.states.rightIcon,Notice:t=>{let{notice:n,val_status:e}=t,{componentId:a}=e,i="NoticeTimer-"+a,l="NoticeTimerClose-"+a,s="notice-tips-"+a;return g(()=>{c.interval.once(()=>{if(!n.length){h.close(s);return}h.open({tipsID:s,parent:`[data-notice-uid="${a}"]`,gravityPoint:22,padding:[1,0],closeAtParentBlur:!1,content:V(h.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[p(E,{position:"absolute",unitHeight:1,unitWidth:1,left:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),p(N,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:n.map((I,S)=>{let{type:r,label:u}=I,f=r=="invalid"?R.X:r=="warn"?R.Exclamation:R.Check;return V(x.Left,{gap:0,borderRadius:"2.tone.secondary",children:[p(f,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[r]}),p(F.Supplement,{fontSize:"0.xs",fontColor:"white",children:u})]},S+"-"+c.Stringify(I))})})]})})},350,i),c.interval.once(()=>{h.close(s)},6e3,l)},[n]),null}},W={DefaultStatus:(t,n)=>({componentId:t,dataValue:n,eventType:"init",eventID:y()}),CommonEffects:function(t){let{type:n,states:e,val_status:a,set_status:i,val_validate:l,set_validate:s,SystemValidation:I}=t;e=o({},e);let{componentId:S}=a;g(()=>(v.update({[S]:{ResolveRefresh:null,Refresh:()=>new Promise((r,u)=>{v.get(S).ResolveRefresh=r,i(f=>d(o({},f),{eventType:"refresh",eventID:y()}))}),GenNotice:r=>{let{ok:u,notice:f}=r;s({ok:u,notice:f})}}}),()=>{v.delete(S)}),[]),c.scope(()=>{let{override:r}=e;if(r=="never"||r=="beforeModified"&&!["init","override"].includes(a.eventType))return;let u=v.get(a.componentId);u&&(e.value!=a.dataValue&&e.status_id!=u.status_id&&i(f=>d(o(d(o({},f),{dataValue:e.value}),t.ExtraOverrideStates&&t.ExtraOverrideStates()),{eventType:"override",eventID:y()})),u.status_id=e.status_id)}),g(()=>{W.ValidationCheck({val_status:a,set_validate:s,SystemValidation:I,states:e})},[a.eventID,a.dataValue]),g(()=>(c.scope(()=>{let{componentId:r,eventType:u,dataValue:f}=a,m=f;if(n=="autocomplete.single"||n=="list.radio"?m=m[0]:e.isChecker&&(m=!!m[0]),e.form=e.form||"testForm",e.name&&e.form&&v.update({[["form-data",e.form].join("-")]:{[e.name]:{componentId:r,type:n,value:m,validation:l.ok}}}),u=="refresh"){let T=v.get(r);T&&T.ResolveRefresh&&T.ResolveRefresh(null)}else u=="update"&&(e.onUpdateValue&&e.onUpdateValue(m,u,r),c.scope(()=>{l.ok&&e.onUpdateValidValue&&e.onUpdateValidValue(m,u,r)}))}),()=>{v.update({[["form-data",e.form].join("-")]:{[e.name]:null}})}),[l])},ValidationCheck:t=>{let{states:n}=t,e="ValidationTimer-"+t.val_status.componentId;c.interval.abort(e);let a=t.SystemValidation({value:t.val_status.dataValue,states:n});if(!a.ok){t.set_validate(a);return}let i=a.notice;const l=()=>b(void 0,null,function*(){if(!n.onValidate)return;let s=yield n.onValidate(t.val_status.dataValue,t.val_status.eventType,t);t.set_validate({ok:s.ok,notice:[...i,...s.notice]})});if(n.onValidate){if(t.val_status.eventType=="refresh"){l();return}c.interval.once(l,n.onValidateDelay||500,e);return}t.set_validate({ok:!0,notice:i})},SubmitForm:(t,n)=>{let e=!1;if(!n)return e;let a=D(`[data-form-submit-button="${n}"]`)[0];if(!a)return e;let i=a.dataset.sdfike||"",l=t.key,s=t.ctrlKey||t.metaKey;return c.scope(()=>{i.includes("enter")&&(l!="Enter"||t.nativeEvent.isComposing||B.get().browserIs=="safari"&&t.keyCode==229)||((l=="Enter"&&(i.includes("enter")||i.includes("auxEnter")&&s)||l==" "&&i.includes("space"))&&(a.click(),t.preventDefault()),e=!0)}),e},isShowValidation:(t,n,e)=>{let a=t.ok;return!e&&n.eventType=="init"&&(a=!0),a}},nt=function(t){t=o({tone:"border"},t);let n=c.scope(()=>{if(t.tone=="plain")return{};let a={padding:"3/4",transition:"middle",flexSizing:"auto",boxShadow:"0.min"};return t.tone=="border"?a=d(o({},a),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):t.tone=="cloud"?a=d(o({},a),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):t.tone=="bottomBorder"&&(a=d(o({},a),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),a});return d(o(o(o(o(o(o({fontColor:"2.normal"},n),!!t.rightIcon&&{paddingRight:3}),!!t.leftIcon&&{paddingLeft:3}),!!t.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!t.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),t),{freeCSS:o({letterSpacing:"1px",resize:"none"},t.freeCSS),className:[_("Input"),t.className].join(" ")})};export{at as BoxWrapper,W as CoreEffects,nt as DefaultBoxishStyles,et as OptionalInputWrapper};
|
package/dist/fn/Input/index.d.ts
CHANGED
package/dist/fn/Input/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import"../../chunk-C5N2D3ZX.js";import*as t from"./Parts";export*from"./Parts";import i from"./Plain";import a from"./Hidden";import p from"./TextField";import m from"./Contenteditable";import l from"./DigitCharacters";import n from"./Time";import d from"./Select";import x from"./Autocomplete";import*as r from"./List";import c from"./Search";import s from"./Filer";import y from"./Slider";import f from"./Switch";import T from"./Checker";import g from"./Segmented";import S from"./Color";import
|
|
1
|
+
import"../../chunk-C5N2D3ZX.js";import*as t from"./Parts";export*from"./Parts";import i from"./Plain";import a from"./Hidden";import p from"./TextField";import m from"./Contenteditable";import l from"./DigitCharacters";import n from"./Time";import d from"./Select";import x from"./Autocomplete";import*as r from"./List";import c from"./Search";import s from"./Filer";import y from"./Slider";import f from"./Switch";import T from"./Checker";import g from"./Segmented";import S from"./Color";import b from"./CollectForm";var o;(e=>(e.Plain=i,e.Hidden=a,e.TextField=p,e.Contenteditable=m,e.DigitCharacters=l,e.Time=n,e.Select=d,e.Autocomplete=x,e.List=r.List,e.Radio=r.Radio,e.Checkbox=r.Checkbox,e.Checker=T,e.Search=c,e.Filer=s,e.Slider=y,e.Switch=f,e.Segmented=g,e.Color=S,e.LeftIcon=t.LeftIcon,e.RightIcon=t.RightIcon,e.LeftIndicator=t.LeftIndicator,e.RightIndicator=t.RightIndicator,e.RequiredSign=t.RequiredSign,e.RequiredShortSign=t.RequiredShortSign,e.OmitSign=t.OmitSign,e.CollectForm=b))(o||(o={}));export{o as Input,o as default};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "amotify",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.182",
|
|
4
4
|
"description": "UI Component for React,NextJS,esbuild",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"start": "run-p clean build:*",
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
"@fortawesome/free-solid-svg-icons": "^6.7.2",
|
|
91
91
|
"@fortawesome/react-fontawesome": "^0.2.2",
|
|
92
92
|
"dotenv": "^17.0.1",
|
|
93
|
-
"jmini": "^0.0.
|
|
93
|
+
"jmini": "^0.0.86",
|
|
94
94
|
"react": "^18.3.1"
|
|
95
95
|
},
|
|
96
96
|
"devDependencies": {
|