amotify 0.2.209 → 0.2.211
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/esbuild/designBook.tsx +1 -1
- package/demo/next/src/app/(router)/designbook/page.tsx +1 -1
- package/demo/next/src/app/(router)/page.tsx +16 -4
- package/dist/atoms/index.d.ts +2 -1
- package/dist/atoms/index.js +1 -1
- package/dist/fn/Input/CollectForm.js +1 -1
- package/dist/fn/Input/TextField.js +3 -3
- package/dist/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -82,7 +82,11 @@ const SheetContent = () => {
|
|
|
82
82
|
|
|
83
83
|
let Page = () => {
|
|
84
84
|
let [ val_selected,set_selected ] = useState<any>( 0 )
|
|
85
|
-
|
|
85
|
+
|
|
86
|
+
// let [ val_value,set_value ] = useState( 'DFF' )
|
|
87
|
+
|
|
88
|
+
let [ val_value,set_value ] = useState( `hello, world` )
|
|
89
|
+
|
|
86
90
|
let [ val_caret,set_caret ] = useState<any>( [ 0,0 ] )
|
|
87
91
|
|
|
88
92
|
let [ val_refresh,set_refresh ] = useState( UUID() )
|
|
@@ -117,10 +121,11 @@ let Page = () => {
|
|
|
117
121
|
<Literal>
|
|
118
122
|
val_value { val_value || "null" }
|
|
119
123
|
</Literal>
|
|
120
|
-
<Input.TextField
|
|
124
|
+
{/* <Input.TextField
|
|
121
125
|
form='form_test'
|
|
122
126
|
name='testInput'
|
|
123
127
|
override='force'
|
|
128
|
+
multiline
|
|
124
129
|
value={ val_value }
|
|
125
130
|
required
|
|
126
131
|
// onValidate={ async () => {
|
|
@@ -132,7 +137,7 @@ let Page = () => {
|
|
|
132
137
|
// console.log(
|
|
133
138
|
// '[onUserAction]',value,opt
|
|
134
139
|
// )
|
|
135
|
-
|
|
140
|
+
set_value( value )
|
|
136
141
|
} }
|
|
137
142
|
onUpdateValue={ ( value,opt ) => {
|
|
138
143
|
// console.log(
|
|
@@ -146,8 +151,15 @@ let Page = () => {
|
|
|
146
151
|
// )
|
|
147
152
|
// set_value( value )
|
|
148
153
|
} }
|
|
154
|
+
/> */}
|
|
155
|
+
<Input.TextField
|
|
156
|
+
override='force'
|
|
157
|
+
value={ val_value }
|
|
158
|
+
onUpdateValue={ value => {
|
|
159
|
+
console.log( '[onUpdateValue]',value )
|
|
160
|
+
set_value( value )
|
|
161
|
+
} }
|
|
149
162
|
/>
|
|
150
|
-
|
|
151
163
|
{/* <Input.Time.DateWareki
|
|
152
164
|
form='form_test'
|
|
153
165
|
name='dateInput'
|
package/dist/atoms/index.d.ts
CHANGED
|
@@ -24,6 +24,7 @@ declare namespace Flex {
|
|
|
24
24
|
}
|
|
25
25
|
declare const Flex: React.FC<Flex.Input>;
|
|
26
26
|
declare const FlexBr: React.FC<Box.DefaultInput>;
|
|
27
|
+
declare const FlexMargin: React.FC<Box.DefaultInput>;
|
|
27
28
|
/**
|
|
28
29
|
* Div flex column container
|
|
29
30
|
*/
|
|
@@ -31,7 +32,7 @@ declare namespace Column {
|
|
|
31
32
|
type Input = Flex.Input;
|
|
32
33
|
}
|
|
33
34
|
declare const Column: React.FC<Column.Input>;
|
|
34
|
-
export { Span, P, Grid, Flex, FlexBr, Column };
|
|
35
|
+
export { Span, P, Grid, Flex, FlexBr, FlexMargin, Column };
|
|
35
36
|
export * from './FAI';
|
|
36
37
|
export * from './Img';
|
|
37
38
|
export * from './Logo';
|
package/dist/atoms/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,c as n}from"../chunk-C5N2D3ZX.js";import{jsx as p}from"react/jsx-runtime";export*from"./Box";import o from"./Box";const
|
|
1
|
+
import{b as t,c as n}from"../chunk-C5N2D3ZX.js";import{jsx as p}from"react/jsx-runtime";export*from"./Box";import o from"./Box";const r=e=>p(o,n(t({},e),{htmlTag:"span"})),x=e=>p(o,n(t({},e),{htmlTag:"p"})),l=e=>p(o,t({display:"grid"},e)),a=e=>p(o,n(t({flexType:"row",flexWrap:!0,display:"flex"},e),{freeCSS:t({wordBreak:"break-word"},e.freeCSS)})),u=e=>p(o,t({width:1,flexSizing:"none"},e)),f=e=>p(o,t({flexSizing:0},e)),c=e=>p(a,t({flexType:"col",gap:1},e));export*from"./FAI";export*from"./Img";export*from"./Logo";export*from"./Placeholder";export*from"./Card";export{c as Column,a as Flex,u as FlexBr,f as FlexMargin,l as Grid,x as P,r as Span};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{e as
|
|
1
|
+
import{e as l}from"../../chunk-C5N2D3ZX.js";import u,{useStore as t}from"jmini";const p=o=>l(void 0,null,function*(){let i={},n="form-process-"+o;if(t.get(n))return console.log("[CollectForm] already processing..."),{valid:!1,data:{}};t.set({[n]:!0});let s=1;return yield u.pending(()=>{},100),yield u.scope(()=>l(void 0,null,function*(){let m=document.activeElement;m&&m.blur();let c=t.get(["form-data",o].join("-"));if(c){for(let[r,a]of Object.entries(c)){if(!a)continue;let e=t.get(a.componentId);e&&e.Refresh&&(yield e.Refresh())}{let r=t.get(["form-data",o].join("-"));if(!r)return;for(let[a,e]of Object.entries(r))e&&(s&=Number(e.validation),i[a]=e.value)}}})),t.set({[n]:!1}),{valid:!!s,data:i}});export{p as CollectForm,p as default};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{b as
|
|
2
|
-
T`.repeat(
|
|
3
|
-
T`.repeat(x-1)}let o=De(n);return Y(k,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[s(le.Description,r(i({className:n.className},o),{position:"absolute",width:1,freeCSS:r(i({},o.freeCSS),{color:"orange"}),"data-input-shallow":l.componentId,children:s(k,{"data-input-value-shallow":l.componentId,children:a})})),s(le.Description,r(i({className:n.className},o),{position:"absolute",left:0,freeCSS:r(i({},o.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":l.componentId,children:f})),s(le.Description,r(i({className:n.className},o),{position:"absolute",right:0,freeCSS:r(i({},o.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":l.componentId,children:g}))]})},InputBox:t=>{let{rootStates:n,val_validate:l,set_validate:p,val_status:a,set_status:e,val_inputType:f,set_inputType:g}=t;if(n.multiline)return null;let re=n,{componentId:o,tone:c,required:x,restrict:u="text",form:E,autoComplete:L="off",autoCapitalize:F="off",minRows:$,maxRows:D,multiline:fe,autoHeight:ge,enableFormSubmit:G,clearButton:xe=!1,allowDecimals:z,allowZeroStart:A,checkValidationAtFirst:W,onChange:X,onKeyDown:Q,onValidate:be,onValidateDelay:he,onUpdateValue:Ie,onUpdateValidValue:Se,onUserAction:ve,value:Te="",leftIndicator:Ce,rightIndicator:Re,leftIcon:ye,rightIcon:we,maxLength:m,min:O,max:B,label:v,isLabelActive:y,defaultValidation:oe,wrapStyles:Pe}=re,d=ae(re,["componentId","tone","required","restrict","form","autoComplete","autoCapitalize","minRows","maxRows","multiline","autoHeight","enableFormSubmit","clearButton","allowDecimals","allowZeroStart","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max","label","isLabelActive","defaultValidation","wrapStyles"]);return s(k,r(i({htmlTag:"input",type:f,inputMode:["number","digitNumber","creditCard"].includes(u)?"numeric":u=="email"?"email":"text","data-disabled":n.disabled,"data-show-validation":K.isShowValidation(l,a,!!W),"data-component-id":a.componentId,"data-input-origin":a.componentId,value:a.formatValue,autoComplete:L,autoCapitalize:F,onKeyDown:I=>{let{key:h,target:w}=I,M=w,{selectionStart:P,selectionEnd:j}=M,q=Number(P),U=Number(j);{let _=a.formatValue[Number(q)],H=a.formatValue[Number(q)-1];h=="Delete"&&(u=="creditCard"&&_==" "||u=="postal"&&_=="-"||u=="digitNumber"&&_==",")&&(M.setSelectionRange(q+1,U+1),I.preventDefault()),h=="Backspace"&&(u=="creditCard"&&H==" "||u=="postal"&&H=="-"||u=="digitNumber"&&H==",")&&(M.setSelectionRange(q-1,U-1),I.preventDefault()),h=="Enter"||h=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(u)&&h=="Clear"&&e(_=>r(i({},_),{dataValue:"",formatValue:"",eventType:"update",eventID:T(),isFocusing:!0}))}),b.scope(()=>{if(!["number","digitNumber"].includes(u)||!["ArrowUp","ArrowDown"].includes(h))return;let _=+(h=="ArrowUp")*2-1,H=a.dataValue.slice(-1),se=a.formatValue[U-1],N=U-1,V=String(a.formatValue),ee=a.dataValue.split(".")[1],Ve=(ee==null?void 0:ee.length)||0;b.scope(()=>{if(!H){V="0";return}if(H=="-"){V+="0";return}if(H=="."){V+="0";return}if(U==0)return;let te=String(V).slice(0,N).match(/\./),Fe=String(V).slice(N),J=String(Fe.toNumber().toFixed(0)).length;se=="."&&(J=1,N=V.split(".")[0].length-1),se==","&&(J+=1,N--),te&&(J=-1*(Ve-J));let Z=V[N].toNumber()+_;Z<0?Z=9:Z>=10&&(Z=0),V=V.partReplace(N,String(Z)),setTimeout(()=>{M.setSelectionRange(N+1,N+1)},1)}),l.ok&&p({ok:!1,notice:[]}),e(te=>r(i(i({},te),C.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:V})),{eventType:"update",eventID:T(),isFocusing:!0})),I.preventDefault()}),Q&&Q(I),G&&K.SubmitForm(I,E)},onChange:I=>{let{value:h,selectionStart:w,selectionEnd:M}=I.target,P=C.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:h});a.isComposing&&(P.formatValue=h),P.formatValue!=a.formatValue&&(l.ok&&p({ok:!1,notice:[]}),e(j=>r(i(i({},j),P),{prevValue:a.formatValue,eventType:"update",eventID:T(),caretFrom:Number(w),caretTo:Number(M),isFocusing:!0})),X&&X(I))},width:1},d),{onFocus:I=>{d!=null&&d.onFocus&&(d==null||d.onFocus(I)),e(h=>r(i({},h),{eventID:T(),isFocusing:!0}))},onBlur:I=>{d!=null&&d.onBlur&&(d==null||d.onBlur(I)),e(h=>r(i({},h),{eventID:T(),isFocusing:!1}))},onCompositionStart:I=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(I)),e(h=>r(i({},h),{eventID:T(),isComposing:!0}))},onCompositionEnd:I=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(I)),u=="text"){b.interval.once(()=>{e(w=>r(i({},w),{isComposing:!1}))},100,"input.textfield.composing.end");return}let h=C.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:a.formatValue});e(w=>r(i(i({},w),h),{prevValue:w.formatValue,eventType:"update",eventID:T(),caretFrom:Number(w.formatValue.length+1),caretTo:Number(w.formatValue.length+1),isComposing:!1}))}}))},TextAreaBox:t=>{let{rootStates:n,val_validate:l,set_validate:p,val_status:a,set_status:e,isShallow:f}=t,B=n,{componentId:g,tone:o,required:c,form:x,label:u,isLabelActive:E,minRows:L,maxRows:F,multiline:$,autoHeight:D,allowDecimals:fe,allowZeroStart:ge,enableFormSubmit:G,maxLength:xe,checkValidationAtFirst:z,onChange:A,onKeyDown:W,onValidate:X,onValidateDelay:Q,onUpdateValue:be,onUpdateValidValue:he,onUserAction:Ie,value:Se="",leftIndicator:ve,rightIndicator:Te,leftIcon:Ce,rightIcon:Re,defaultValidation:ye,wrapStyles:we}=B,m=ae(B,["componentId","tone","required","form","label","isLabelActive","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!n.multiline?null:s(k,r(i({htmlTag:"textarea","data-show-validation":K.isShowValidation(l,a,!!z),"data-input-origin":a.componentId,"data-component-id":a.componentId,value:a.dataValue,width:1},m),{onFocus:v=>{m!=null&&m.onFocus&&(m==null||m.onFocus(v)),e(y=>r(i({},y),{eventID:T(),isFocusing:!0}))},onBlur:v=>{m!=null&&m.onBlur&&(m==null||m.onBlur(v)),e(y=>r(i({},y),{eventID:T(),isFocusing:!1}))},onCompositionStart:v=>{m!=null&&m.onCompositionStart&&(m==null||m.onCompositionStart(v)),e(y=>r(i({},y),{eventID:T(),isComposing:!0}))},onCompositionEnd:v=>{m!=null&&m.onCompositionEnd&&(m==null||m.onCompositionEnd(v)),b.interval.once(()=>{e(y=>r(i({},y),{eventID:T(),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:v=>{W&&W(v),G&&K.SubmitForm(v,x)},onChange:v=>{let{value:y}=v.target;l.ok&&p({ok:!1,notice:[]}),e(oe=>r(i({},oe),{dataValue:y,eventType:"update",eventID:T(),isFocusing:!0})),A&&A(v)}}))}},ze=t=>{let{componentId:n,restrict:l="text",value:p="",min:a,max:e,allowDecimals:f,allowZeroStart:g}=t,[o,c]=ie(r(i({componentId:n},C.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:a,max:e,restrict:l,value:p})),{prevValue:"",eventType:"init",eventID:T(),caretFrom:null,caretTo:null})),[x,u]=ie({ok:!1,notice:[]}),[E,L]=ie(["password","concealed"].includes(l)&&"password"||"text");ne(()=>{c($=>i(i({},$),C.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:a,max:e,restrict:l,value:p}))),pe.set({[n+":set_inputType"]:L})},[]);let F={rootStates:t,val_inputType:E,set_inputType:L,val_status:o,set_status:c,val_validate:x,set_validate:u};return K.CommonEffects({type:"textfield",states:t,val_status:o,set_status:c,val_validate:x,set_validate:u,SystemValidation:C.Validation.System,ExtraOverrideStates:()=>C.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:a,max:e,restrict:l,value:p})}),ne(()=>{C.setSelection({id:t.id,restrict:l,val_status:o})},[o]),Y(He,{val_status:o,set_status:c,val_validate:x,states:F.rootStates,children:[s(Be,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||!!o.isFocusing||!!o.dataValue}),s(C.Shallow,i({},F)),s(C.InputBox,i({},F)),s(C.TextAreaBox,i({},F))]})},R=t=>(t=i({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),s(_e,{componentId:t.componentId,children:ze,states:Ae(t)})),S=R;S.Validate=C.Validation.Text,S.Katakana=t=>s(R,r(i({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=t=>s(R,r(i({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=t=>s(R,r(i({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=t=>s(R,r(i({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=t=>s(R,r(i({},t),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=t=>s(R,r(i({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=t=>s(R,r(i({},t),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=t=>s(R,r(i({},t),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=t=>s(R,r(i({label:"\u90F5\u4FBF\u756A\u53F7"},t),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:s(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),S.Password=t=>s(R,r(i({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:s(me,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:s(Ee.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:n=>{ce.open(n.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:ce.abort,tabIndex:-1,onClick:n=>{b(n.target).parent().parent().find("input").callback(l=>{let p=l[0];if(!p)return;let a=p.dataset.componentId;if(!a)return;let e=pe.get(a+":set_inputType");e&&e(f=>f==="password"&&"text"||"password")})},children:s(Ne,{icon:Le})})}),restrict:"password"},t),{multiline:!1,autoHeight:!1})),S.Concealed=t=>s(S.Password,r(i({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),S.Money={JPY:t=>s(S.DigitNumber,r(i({rightIcon:s(me,{ssSphere:2,fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{S as TextField,ze as TextInput,S as default};
|
|
1
|
+
import{b as n,c as r,d as ae,e as ue}from"../../chunk-C5N2D3ZX.js";import{Fragment as de,jsx as s,jsxs as Y}from"react/jsx-runtime";import b,{UUID as C,useStore as ce}from"jmini";import{useState as ie,useEffect as ne}from"react";import{$$fromRoot as De,ExtractStyles as ke}from"../../@utils";import{Box as D,FAI as Ne}from"../../atoms";import{Literal as le}from"../../mols";import{Tips as me,Button as Ee}from"..";import{faEye as Le}from"@fortawesome/free-solid-svg-icons/faEye";import{OptionalInputWrapper as _e,BoxWrapper as He,CoreEffects as K,DefaultBoxishStyles as Ae}from"./core";import{InputLabel as Be}from"./Label";import{LeftIcon as Me,RightIcon as pe}from".";const $e={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(de,{children:[s(D,{children:"\u25CB\u25CB\u25CB\u25CB@\u25CB\u25CB\u25CB\u25CB.\u25CB\u25CB\u25CB\u306E\u5F62\u5F0F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),s(D,{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(de,{children:[s(D,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),s(D,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),s(D,{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"}},T={setSelection:t=>{let{id:a,restrict:l,val_status:c}=t,i=De("#"+a)[0];if(i&&c.prevValue&&c.formatValue){let{formatValue:e,prevValue:f,caretFrom:g,caretTo:o}=c;if(l=="creditCard")e.length>=f.length&&g%5==0&&(g++,o++),i.setSelectionRange(g,o);else if(l=="postal")e.length==5&&f.length==3&&(g++,o++),i.setSelectionRange(g,o);else if(l=="digitNumber"){let m=e.length-f.length;m==2&&(g++,o++),m==-2&&(g--,o--),i.setSelectionRange(g,o)}}},Validation:{System:t=>{let{value:a,states:l}=t,{restrict:c="text",defaultValidation:i,maxLength:e,multiline:f,required:g}=l,o=[];if(f||(e=e||255),b.is.exist(e)&&a.length>=Number(e)&&o.push({type:"invalid",label:e+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a){let m=T.Validation.Text(a,c,i);m.ok||o.push({type:"invalid",label:m.body})}else g&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!o.filter(({type:m})=>m=="invalid").length,notice:o}},Text:(t,a,l)=>{let c={ok:!0,body:""};return(()=>{let i=l||$e[a];if(!i)return;let e=i.reason;if(i){let f=!!(+!!t.match(i.reg)^+!i.exist);c={ok:f,body:f?"":e}}})(),c},DataLeveling:t=>{let{restrict:a,allowDecimals:l,allowZeroStart:c,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 g=Number(e)<0||e[0]=="-";e=e.replace(/[^0-9.]/g,""),g&&(e="-"+e);let o=Number(l);l?e=e.replace(/(\.\d{0,})\..*/g,"$1").replace(/\.(\d{0,})/g,(m,x)=>x.length>o?"."+x.slice(0,o):m):e=e.replace(/\.\d?/g,""),b.scope(()=>{a=="number"&&(c||(e=e.replace(/^0(\d+)/g,"$1").replace(/^-0(\d+)/g,"-$1")))}),b.scope(()=>{let m=e.slice(-1);if(!e||m=="."||m=="-")return;let{min:x,max:u}=t;b.is.exist(x)&&b.is.number(x)&&Number(e)<Number(x)&&(e=String(x.toFixed(o))),b.is.exist(u)&&b.is.number(u)&&Number(e)>Number(u)&&(e=String(u.toFixed(o)))}),b.scope(()=>{if(!e||e=="-"||a!="digitNumber")return;let m=e.slice(-1),[x,u]=e.split(".");e=x.replace(/\B(?=(\d{3})+(?!\d))/g,","),u&&(e+="."+u),m=="."&&(e+=".")})});let f=e;return a=="digitNumber"||(a=="postal"?e.length>=4&&(f=e.clip(0,3)+"-"+e.clip(3)):a=="creditCard"&&(f=e.replace(/.{4}(?=.)/g,"$& "))),(a=="digitNumber"||a=="number")&&(e=e.replace(/,/g,"")),{formatValue:f,dataValue:e}}},Shallow:t=>{let{rootStates:a,val_status:l}=t,c=l.dataValue||"";ne(()=>{b.scope(()=>ue(void 0,null,function*(){if(!a.multiline)return;let m=b('[data-input-origin="'+l.componentId+'"]'),x=b('[data-input-shallow="'+l.componentId+'"]'),u=b('[data-input-min-height-value-shallow="'+l.componentId+'"]'),E=b('[data-input-max-height-value-shallow="'+l.componentId+'"]');if(!m[0]||!x[0]||!u[0]||!E[0])return;let L=x.position(),F=u.position(),$=E.position(),k=0;a.autoHeight&&(k=L.height),k=Math.max(k,F.height),k=Math.min(k,$.height),m[0].style.height=k+"px"}))},[c]);let i=c||"";(!!c.match(/\n$/)||!c)&&(i+="T");let f="",g="";if(a.multiline){let m=a.minRows||1,x=a.maxRows||100;f=`
|
|
2
|
+
T`.repeat(m-1),g=`
|
|
3
|
+
T`.repeat(x-1)}let o=ke(a);return Y(D,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:[s(le.Description,r(n({className:a.className},o),{position:"absolute",width:1,freeCSS:r(n({},o.freeCSS),{color:"orange"}),"data-input-shallow":l.componentId,children:s(D,{"data-input-value-shallow":l.componentId,children:i})})),s(le.Description,r(n({className:a.className},o),{position:"absolute",left:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"blue"}),"data-input-min-height-value-shallow":l.componentId,children:f})),s(le.Description,r(n({className:a.className},o),{position:"absolute",right:0,freeCSS:r(n({},o.freeCSS),{backgroundColor:"transparent",color:"red"}),"data-input-max-height-value-shallow":l.componentId,children:g}))]})},InputBox:t=>{let{rootStates:a,val_validate:l,set_validate:c,val_status:i,set_status:e,val_inputType:f,set_inputType:g}=t;if(a.multiline)return null;let re=a,{componentId:o,tone:m,required:x,restrict:u="text",form:E,autoComplete:L="off",autoCapitalize:F="off",minRows:$,maxRows:k,multiline:fe,autoHeight:ge,enableFormSubmit:G,clearButton:xe=!1,allowDecimals:z,allowZeroStart:A,checkValidationAtFirst:W,onChange:X,onKeyDown:Q,onValidate:be,onValidateDelay:he,onUpdateValue:Ie,onUpdateValidValue:Se,onUserAction:ve,value:Te="",leftIndicator:Ce,rightIndicator:Re,leftIcon:ye,rightIcon:we,maxLength:p,min:O,max:B,label:v,isLabelActive:y,defaultValidation:oe,wrapStyles:Pe}=re,d=ae(re,["componentId","tone","required","restrict","form","autoComplete","autoCapitalize","minRows","maxRows","multiline","autoHeight","enableFormSubmit","clearButton","allowDecimals","allowZeroStart","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max","label","isLabelActive","defaultValidation","wrapStyles"]);return s(D,r(n({htmlTag:"input",type:f,inputMode:["number","digitNumber","creditCard"].includes(u)?"numeric":u=="email"?"email":"text","data-disabled":a.disabled,"data-show-validation":K.isShowValidation(l,i,!!W),"data-component-id":i.componentId,"data-input-origin":i.componentId,value:i.formatValue,autoComplete:L,autoCapitalize:F,onKeyDown:I=>{let{key:h,target:w}=I,M=w,{selectionStart:P,selectionEnd:j}=M,q=Number(P),Z=Number(j);{let _=i.formatValue[Number(q)],H=i.formatValue[Number(q)-1];h=="Delete"&&(u=="creditCard"&&_==" "||u=="postal"&&_=="-"||u=="digitNumber"&&_==",")&&(M.setSelectionRange(q+1,Z+1),I.preventDefault()),h=="Backspace"&&(u=="creditCard"&&H==" "||u=="postal"&&H=="-"||u=="digitNumber"&&H==",")&&(M.setSelectionRange(q-1,Z-1),I.preventDefault()),h=="Enter"||h=="Tab"}b.scope(()=>{["number","digitNumber","creditCard"].includes(u)&&h=="Clear"&&e(_=>r(n({},_),{dataValue:"",formatValue:"",eventType:"update",eventID:C(),isFocusing:!0}))}),b.scope(()=>{if(!["number","digitNumber"].includes(u)||!["ArrowUp","ArrowDown"].includes(h))return;let _=+(h=="ArrowUp")*2-1,H=i.dataValue.slice(-1),se=i.formatValue[Z-1],N=Z-1,V=String(i.formatValue),ee=i.dataValue.split(".")[1],Ve=(ee==null?void 0:ee.length)||0;b.scope(()=>{if(!H){V="0";return}if(H=="-"){V+="0";return}if(H=="."){V+="0";return}if(Z==0)return;let te=String(V).slice(0,N).match(/\./),Fe=String(V).slice(N),J=String(Fe.toNumber().toFixed(0)).length;se=="."&&(J=1,N=V.split(".")[0].length-1),se==","&&(J+=1,N--),te&&(J=-1*(Ve-J));let U=V[N].toNumber()+_;U<0?U=9:U>=10&&(U=0),V=V.partReplace(N,String(U)),setTimeout(()=>{M.setSelectionRange(N+1,N+1)},1)}),l.ok&&c({ok:!1,notice:[]}),e(te=>r(n(n({},te),T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:V})),{eventType:"update",eventID:C(),isFocusing:!0})),I.preventDefault()}),Q&&Q(I),G&&K.SubmitForm(I,E)},onChange:I=>{let{value:h,selectionStart:w,selectionEnd:M}=I.target,P=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:h});i.isComposing&&(P.formatValue=h),P.formatValue!=i.formatValue&&(l.ok&&c({ok:!1,notice:[]}),e(j=>r(n(n({},j),P),{prevValue:i.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w),caretTo:Number(M),isFocusing:!0})),X&&X(I))},width:1},d),{onFocus:I=>{d!=null&&d.onFocus&&(d==null||d.onFocus(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!0}))},onBlur:I=>{d!=null&&d.onBlur&&(d==null||d.onBlur(I)),e(h=>r(n({},h),{eventID:C(),isFocusing:!1}))},onCompositionStart:I=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(I)),e(h=>r(n({},h),{eventID:C(),isComposing:!0}))},onCompositionEnd:I=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(I)),u=="text"){b.interval.once(()=>{e(w=>r(n({},w),{isComposing:!1}))},100,"input.textfield.composing.end");return}let h=T.Validation.DataLeveling({allowDecimals:z,allowZeroStart:A,min:O,max:B,restrict:u,value:i.formatValue});e(w=>r(n(n({},w),h),{prevValue:w.formatValue,eventType:"update",eventID:C(),caretFrom:Number(w.formatValue.length+1),caretTo:Number(w.formatValue.length+1),isComposing:!1}))}}))},TextAreaBox:t=>{let{rootStates:a,val_validate:l,set_validate:c,val_status:i,set_status:e,isShallow:f}=t,B=a,{componentId:g,tone:o,required:m,form:x,label:u,isLabelActive:E,minRows:L,maxRows:F,multiline:$,autoHeight:k,allowDecimals:fe,allowZeroStart:ge,enableFormSubmit:G,maxLength:xe,checkValidationAtFirst:z,onChange:A,onKeyDown:W,onValidate:X,onValidateDelay:Q,onUpdateValue:be,onUpdateValidValue:he,onUserAction:Ie,value:Se="",leftIndicator:ve,rightIndicator:Te,leftIcon:Ce,rightIcon:Re,defaultValidation:ye,wrapStyles:we}=B,p=ae(B,["componentId","tone","required","form","label","isLabelActive","minRows","maxRows","multiline","autoHeight","allowDecimals","allowZeroStart","enableFormSubmit","maxLength","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","leftIndicator","rightIndicator","leftIcon","rightIcon","defaultValidation","wrapStyles"]);return!a.multiline?null:s(D,r(n({htmlTag:"textarea","data-show-validation":K.isShowValidation(l,i,!!z),"data-input-origin":i.componentId,"data-component-id":i.componentId,value:i.dataValue,width:1},p),{onFocus:v=>{p!=null&&p.onFocus&&(p==null||p.onFocus(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!0}))},onBlur:v=>{p!=null&&p.onBlur&&(p==null||p.onBlur(v)),e(y=>r(n({},y),{eventID:C(),isFocusing:!1}))},onCompositionStart:v=>{p!=null&&p.onCompositionStart&&(p==null||p.onCompositionStart(v)),e(y=>r(n({},y),{eventID:C(),isComposing:!0}))},onCompositionEnd:v=>{p!=null&&p.onCompositionEnd&&(p==null||p.onCompositionEnd(v)),b.interval.once(()=>{e(y=>r(n({},y),{eventID:C(),isComposing:!1}))},100,"input.textfield.composing.end")},onKeyDown:v=>{W&&W(v),G&&K.SubmitForm(v,x)},onChange:v=>{let{value:y}=v.target;l.ok&&c({ok:!1,notice:[]}),e(oe=>r(n({},oe),{dataValue:y,eventType:"update",eventID:C(),isFocusing:!0})),A&&A(v)}}))}},ze=t=>{let{componentId:a,restrict:l="text",value:c="",min:i,max:e,allowDecimals:f,allowZeroStart:g}=t,[o,m]=ie(r(n({componentId:a},T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:c})),{prevValue:"",eventType:"init",eventID:C(),caretFrom:null,caretTo:null})),[x,u]=ie({ok:!1,notice:[]}),[E,L]=ie(["password","concealed"].includes(l)&&"password"||"text");ne(()=>{m($=>n(n({},$),T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:c}))),ce.set({[a+":set_inputType"]:L})},[]);let F={rootStates:t,val_inputType:E,set_inputType:L,val_status:o,set_status:m,val_validate:x,set_validate:u};return K.CommonEffects({type:"textfield",states:t,val_status:o,set_status:m,val_validate:x,set_validate:u,SystemValidation:T.Validation.System,ExtraOverrideStates:()=>T.Validation.DataLeveling({allowDecimals:f,allowZeroStart:g,min:i,max:e,restrict:l,value:c})}),ne(()=>{T.setSelection({id:t.id,restrict:l,val_status:o})},[o]),Y(He,{val_status:o,set_status:m,val_validate:x,states:F.rootStates,children:[s(Be,{componentId:t.componentId,fontSize:t.fontSize,required:t.required,label:t.label,isActive:t.isLabelActive||!!o.isFocusing||!!o.dataValue}),s(T.Shallow,n({},F)),s(T.InputBox,n({},F)),s(T.TextAreaBox,n({},F))]})},R=t=>(t=n({autoHeight:!0,restrict:"text",fontSize:"inherit",value:""},t),t.value=T.Validation.DataLeveling({allowDecimals:t.allowDecimals,allowZeroStart:t.allowZeroStart,min:t.min,max:t.max,restrict:t.restrict||"text",value:t.value||""}).dataValue||"",t.multiline?(t.minRows=t.minRows||5,t.maxRows=t.maxRows||20):(t.minRows=1,t.maxRows=1),s(_e,{componentId:t.componentId,children:ze,states:Ae(t)})),S=R;S.Validate=T.Validation.Text,S.Katakana=t=>s(R,r(n({},t),{restrict:"katakana",multiline:!1,autoHeight:!1})),S.HankakuKatakana=t=>s(R,r(n({},t),{restrict:"hankaku.katakana",multiline:!1,autoHeight:!1})),S.CreditCard=t=>s(R,r(n({},t),{restrict:"creditCard",multiline:!1,autoHeight:!1})),S.Tel=t=>s(R,r(n({},t),{restrict:"tel",multiline:!1,autoHeight:!1})),S.Number=t=>s(R,r(n({},t),{restrict:"number",multiline:!1,autoHeight:!1})),S.DigitNumber=t=>s(R,r(n({},t),{restrict:"digitNumber",multiline:!1,autoHeight:!1})),S.Email=t=>s(R,r(n({},t),{restrict:"email",multiline:!1,autoHeight:!1})),S.Url=t=>s(R,r(n({},t),{restrict:"url",multiline:!1,autoHeight:!1})),S.Postal=t=>s(R,r(n({label:"\u90F5\u4FBF\u756A\u53F7"},t),{restrict:"postal",multiline:!1,autoHeight:!1,leftIcon:s(Me,{ssSphere:2,fontColor:"4.thin",children:"\u3012"})})),S.Password=t=>s(R,r(n({label:"\u30D1\u30B9\u30EF\u30FC\u30C9",rightIcon:s(pe,{ssSphere:2.5,freeCSS:{pointerEvents:"all"},children:s(Ee.Sub,{ssSphere:2.5,borderRadius:"3.tone.tertiary",fontColor:"theme",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:a=>{me.open(a.currentTarget,"\u30C6\u30AD\u30B9\u30C8\u3092\u8868\u793A",24)},onMouseLeave:me.abort,tabIndex:-1,onClick:a=>{b(a.target).parent().parent().find("input").callback(l=>{let c=l[0];if(!c)return;let i=c.dataset.componentId;if(!i)return;let e=ce.get(i+":set_inputType");e&&e(f=>f==="password"&&"text"||"password")})},children:s(Ne,{icon:Le})})}),restrict:"password"},t),{multiline:!1,autoHeight:!1})),S.Concealed=t=>s(S.Password,r(n({label:"\u79D8\u5BC6\u9375"},t),{restrict:"concealed"})),S.Money={JPY:t=>s(S.DigitNumber,r(n({rightIcon:s(pe,{ssSphere:2,fontColor:"4.thin",children:"\u5186"})},t),{multiline:!1,autoHeight:!1}))};export{S as TextField,ze as TextInput,S as default};
|
package/dist/index.d.ts
CHANGED
|
@@ -51,6 +51,7 @@ declare const amotify: {
|
|
|
51
51
|
Grid: import("react").FC<atoms.Box.DefaultInput>;
|
|
52
52
|
Flex: import("react").FC<atoms.Box.DefaultInput>;
|
|
53
53
|
FlexBr: import("react").FC<atoms.Box.DefaultInput>;
|
|
54
|
+
FlexMargin: import("react").FC<atoms.Box.DefaultInput>;
|
|
54
55
|
Column: import("react").FC<atoms.Box.DefaultInput>;
|
|
55
56
|
Box: <T extends import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> = "div">(p: atoms.Box.Input<T>) => import("react/jsx-runtime").JSX.Element | null;
|
|
56
57
|
FAI: atoms.FAI.Methods;
|