amotify 0.2.205 → 0.2.207

package/demo/next/src/app/(router)/page.tsx

@@ -108,23 +108,10 @@ let Page = () => {
         <Literal>
           val_value { val_value || "null" }
         </Literal>
-        <input
-          type='text'
-          onChange={ event => {
-            let {
-              value: rawValue,
-              selectionStart,
-              selectionEnd,
-            } = event.target as HTMLInputElement
-            console.log(
-              rawValue,
-              ( event as any ).key
-            )
-          } }
-        />
         <Input.TextField
-          override='force'
+          // override='force'
           value={ val_value }
+          required
           onUpdateValidValue={ value => {
             console.log(
               '[onUpdateValidValue]',value
@@ -132,6 +119,19 @@ let Page = () => {
             set_value( value )
           } }
         />
+        <Input.Switch
+          onUserAction={ ( value,opt ) => {
+            // console.log(
+            //   '[onUserAction]',value,opt
+            // )
+          } }
+          onUpdateValue={ ( ...args ) => {
+            // console.log( '[onUpdateValue]',args )
+          } }
+          onUpdateValidValue={ ( ...args ) => {
+            console.log( '[onUpdateValidValue]',args )
+          } }
+        />
       </Box>
     </Column>
   </Plate>

package/dist/fn/Input/core.js

@@ -1 +1 @@
-import{b as o,c as d,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as f,jsxs as V}from"react/jsx-runtime";import{useState as k,useEffect as g}from"react";import p,{UUID as y,useStore as v}from"jmini";import{$$fromRoot as D}from"../../@utils";import{InputClasses as _}from"../../@styles/componentClasses";import{Box as B,Flex as E,FAI as h,Column as N}from"../../atoms";import{Row as x,Literal as w}from"../../mols";import{Button as F}from"../Button";import R 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 f(e,o({},t.states))},at=t=>{let{children:n,val_status:e,val_validate:a,states:i}=t,{leftIcon:l,wrapStyles:u}=i;return i.checkValidationAtFirst||e.eventType=="init"&&(a.notice=[]),V(x.Center,d(o({position:"relative",verticalAlign:"unset",gap:0},u),{className:_("Wrapper"),"data-notice-uid":e.componentId,children:[f(T.Notice,{notice:a.notice,val_status:e}),i.leftIndicator,V(E,{position:"relative",flexSizing:"auto",children:[n,l,f(T.RightIcon,o({},t)),f(T.ClearButton,o({},t))]}),i.rightIndicator]}))},T={ClearButton:t=>!t.states.clearButton||!t.val_status.dataValue?null:f(F.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:f(h.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,u="notice-tips-"+a;return g(()=>{p.interval.once(()=>{if(!n.length){R.close(u);return}R.open({tipsID:u,parent:`[data-notice-uid="${a}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:V(R.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[f(B,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),f(N,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:n.map((I,S)=>{let{type:r,label:s}=I,m=r=="invalid"?h.Exclamation:r=="warn"?h.Exclamation:h.Check;return V(x.Left,{gap:0,borderRadius:"2.tone.secondary",children:[f(m,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[r]}),f(w.Supplement,{fontSize:"0.xs",fontColor:"white",children:s})]},S+"-"+p.Stringify(I))})})]})})},350,i),p.interval.once(()=>{R.close(u)},6e3,l)},[n]),null}},A={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:u,SystemValidation:I}=t;e=o({},e);let{componentId:S}=a;g(()=>(v.update({[S]:{ResolveRefresh:null,Refresh:()=>new Promise((r,s)=>{v.get(S).ResolveRefresh=r,i(m=>d(o({},m),{eventType:"refresh",eventID:y()}))}),GenNotice:r=>{let{ok:s,notice:m}=r;u({ok:s,notice:m})}}}),()=>{v.delete(S)}),[]),p.scope(()=>{let{override:r}=e;if(r=="never"||r=="beforeModified"&&!["init","override"].includes(a.eventType)||a.isComposing)return;let s=v.get(a.componentId);if(s){if(e.value==a.dataValue){s.status_id=e.status_id;return}e.status_id!=s.status_id&&i(m=>d(o(d(o({},m),{dataValue:e.value}),t.ExtraOverrideStates&&t.ExtraOverrideStates()),{eventType:"override",eventID:y()}))}}),g(()=>{A.ValidationCheck({val_status:a,set_validate:u,SystemValidation:I,states:e})},[a.eventID,a.dataValue]),g(()=>(p.scope(()=>{let{componentId:r,eventType:s,dataValue:m}=a,c=m;if(n=="autocomplete.single"||n=="list.radio"?c=c[0]:e.isChecker&&(c=!!c[0]),e.form=e.form||"testForm",e.name&&e.form&&v.update({[["form-data",e.form].join("-")]:{[e.name]:{componentId:r,type:n,value:c,validation:l.ok}}}),e.onUserAction&&e.onUserAction(c,{eventType:s,componentId:r,isValidated:!!l.ok,isComposing:!!a.isComposing,isFocusing:!!a.isFocusing}),s=="refresh"){let C=v.get(r);C&&C.ResolveRefresh&&C.ResolveRefresh(null)}else s=="update"&&(e.onUpdateValue&&e.onUpdateValue(c,s,r),p.scope(()=>{e.onUpdateValidValue&&l.ok&&e.onUpdateValidValue(c,s,r)}))}),()=>{v.update({[["form-data",e.form].join("-")]:{[e.name]:null}})}),[l])},ValidationCheck:t=>{let{states:n}=t,e="ValidationTimer-"+t.val_status.componentId;p.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 u=yield n.onValidate(t.val_status.dataValue,t.val_status.eventType,t);t.set_validate({ok:u.ok,notice:[...i,...u.notice]})});if(n.onValidate){if(t.val_status.eventType=="refresh"){l();return}p.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,u=t.ctrlKey||t.metaKey;return p.scope(()=>{i.includes("enter")&&(l!="Enter"||t.nativeEvent.isComposing||(t==null?void 0:t.keyCode)==229)||((l=="Enter"&&(i.includes("enter")||i.includes("auxEnter")&&u)||l==" "&&i.includes("space"))&&(a.click(),t.preventDefault()),e=!0)}),e},isShowValidation:(t,n,e)=>{let a=t.ok;return!e&&n.eventType=="init"?!0:a}},nt=function(t){t=o({tone:"border"},t);let n=p.scope(()=>{if(t.tone=="plain")return{};let a={padding:1,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,A as CoreEffects,nt as DefaultBoxishStyles,et as OptionalInputWrapper};
+import{b as i,c as p,e as b}from"../../chunk-C5N2D3ZX.js";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useState as x,useEffect as S}from"react";import f,{UUID as y,useStore as v}from"jmini";import{$$fromRoot as D}from"../../@utils";import{InputClasses as _}from"../../@styles/componentClasses";import{Box as B,Flex as E,FAI as V,Column as F}from"../../atoms";import{Row as k,Literal as N}from"../../mols";import{Button as w}from"../Button";import C from"../Tooltips";const et=t=>{let[n]=x(t.componentId||y());t=i({},t),t.states=p(i({enableFormSubmit:!0,status_id:y(),override:"never",form:"",id:y(),"aria-label":"Input-"+n},t.states),{componentId:n});let{children:e}=t;return m(e,i({},t.states))},at=t=>{let{children:n,val_status:e,val_validate:a,states:o}=t,{leftIcon:r,wrapStyles:d}=o;return o.checkValidationAtFirst||e.eventType=="init"&&(a.notice=[]),h(k.Center,p(i({position:"relative",verticalAlign:"unset",gap:0},d),{className:_("Wrapper"),"data-notice-uid":e.componentId,children:[m(T.Notice,{notice:a.notice,val_status:e}),o.leftIndicator,h(E,{position:"relative",flexSizing:"auto",children:[n,r,m(T.RightIcon,i({},t)),m(T.ClearButton,i({},t))]}),o.rightIndicator]}))},T={ClearButton:t=>!t.states.clearButton||!t.val_status.dataValue?null:m(w.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=>p(i({},n),{dataValue:"",formatValue:"",eventType:"update",eventID:y()}))},children:m(V.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,o="NoticeTimer-"+a,r="NoticeTimerClose-"+a,d="notice-tips-"+a;return S(()=>{f.interval.once(()=>{if(!n.length){C.close(d);return}C.open({tipsID:d,parent:`[data-notice-uid="${a}"]`,gravityPoint:24,padding:[1,0],closeAtParentBlur:!1,content:h(C.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[m(B,{position:"absolute",unitHeight:1,unitWidth:1,right:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),m(F,{backgroundColor:"inherit",gap:"1/3",position:"relative",freeCSS:{zIndex:2},children:n.map((I,g)=>{let{type:s,label:u}=I,c=s=="invalid"?V.Exclamation:s=="warn"?V.Exclamation:V.Check;return h(k.Left,{gap:0,borderRadius:"2.tone.secondary",children:[m(c,{flexCenter:!0,fontSize:"2.normal",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[s]}),m(N.Supplement,{fontSize:"0.xs",fontColor:"white",children:u})]},g+"-"+f.Stringify(I))})})]})})},350,o),f.interval.once(()=>{C.close(d)},6e3,r)},[n]),null}},A={DefaultStatus:(t,n)=>({componentId:t,dataValue:n,eventType:"init",eventID:y()}),CommonEffects:function(t){let{type:n,states:e,val_status:a,set_status:o,val_validate:r,set_validate:d,SystemValidation:I}=t;e=i({},e);let{componentId:g}=a;S(()=>(v.update({[g]:{ResolveRefresh:null,Refresh:()=>new Promise((s,u)=>{v.get(g).ResolveRefresh=s,o(c=>p(i({},c),{eventType:"refresh",eventID:y()}))}),GenNotice:s=>{let{ok:u,notice:c}=s;d({ok:u,notice:c})}}}),()=>{v.delete(g)}),[]),f.scope(()=>{let{override:s}=e;if(s=="never"||s=="beforeModified"&&!["init","override"].includes(a.eventType)||a.isComposing)return;let u=v.get(a.componentId);if(u){if(e.value==a.dataValue){u.status_id=e.status_id;return}e.status_id!=u.status_id&&o(c=>p(i(p(i({},c),{dataValue:e.value}),t.ExtraOverrideStates&&t.ExtraOverrideStates()),{eventType:"override",eventID:y()}))}}),S(()=>{A.ValidationCheck({val_status:a,set_validate:d,SystemValidation:I,states:e})},[a.eventID,a.dataValue]),S(()=>{let{componentId:s,eventType:u,dataValue:c}=a,l=c;n=="autocomplete.single"||n=="list.radio"?l=l[0]:e.isChecker&&(l=!!l[0]),e.onUserAction&&e.onUserAction(l,{eventType:u,componentId:s,isValidated:!!r.ok,isComposing:!!a.isComposing,isFocusing:!!a.isFocusing})},[a]),S(()=>(f.scope(()=>{let{componentId:s,eventType:u,dataValue:c}=a,l=c;if(n=="autocomplete.single"||n=="list.radio"?l=l[0]:e.isChecker&&(l=!!l[0]),e.form=e.form||"testForm",e.name&&e.form&&v.update({[["form-data",e.form].join("-")]:{[e.name]:{componentId:s,type:n,value:l,validation:r.ok}}}),u=="refresh"){let R=v.get(s);R&&R.ResolveRefresh&&R.ResolveRefresh(null)}else u=="update"&&(e.onUpdateValue&&e.onUpdateValue(l,{eventType:u,componentId:s,isValidated:!!r.ok,isComposing:!!a.isComposing,isFocusing:!!a.isFocusing}),f.scope(()=>{e.onUpdateValidValue&&r.ok&&e.onUpdateValidValue(l,{eventType:u,componentId:s,isValidated:!!r.ok,isComposing:!!a.isComposing,isFocusing:!!a.isFocusing})}))}),()=>{v.update({[["form-data",e.form].join("-")]:{[e.name]:null}})}),[r.ok,a.dataValue])},ValidationCheck:t=>{let{states:n}=t,e="ValidationTimer-"+t.val_status.componentId;f.interval.abort(e);let a=t.SystemValidation({value:t.val_status.dataValue,states:n});if(!a.ok){t.set_validate(a);return}let o=a.notice;const r=()=>b(void 0,null,function*(){if(!n.onValidate)return;let d=yield n.onValidate(t.val_status.dataValue,t.val_status.eventType,t);t.set_validate({ok:d.ok,notice:[...o,...d.notice]})});if(n.onValidate){if(t.val_status.eventType=="refresh"){r();return}f.interval.once(r,n.onValidateDelay||500,e);return}t.set_validate({ok:!0,notice:o})},SubmitForm:(t,n)=>{let e=!1;if(!n)return e;let a=D(`[data-form-submit-button="${n}"]`)[0];if(!a)return e;let o=a.dataset.sdfike||"",r=t.key,d=t.ctrlKey||t.metaKey;return f.scope(()=>{o.includes("enter")&&(r!="Enter"||t.nativeEvent.isComposing||(t==null?void 0:t.keyCode)==229)||((r=="Enter"&&(o.includes("enter")||o.includes("auxEnter")&&d)||r==" "&&o.includes("space"))&&(a.click(),t.preventDefault()),e=!0)}),e},isShowValidation:(t,n,e)=>{let a=t.ok;return!e&&n.eventType=="init"?!0:a}},nt=function(t){t=i({tone:"border"},t);let n=f.scope(()=>{if(t.tone=="plain")return{};let a={padding:1,transition:"middle",flexSizing:"auto",boxShadow:"0.min"};return t.tone=="border"?a=p(i({},a),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):t.tone=="cloud"?a=p(i({},a),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):t.tone=="bottomBorder"&&(a=p(i({},a),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),a});return p(i(i(i(i(i(i({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:i({letterSpacing:"1px",resize:"none"},t.freeCSS),className:[_("Input"),t.className].join(" ")})};export{at as BoxWrapper,A as CoreEffects,nt as DefaultBoxishStyles,et as OptionalInputWrapper};

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

@@ -3,7 +3,13 @@ import { ReactElement, StyleTags } from '../../@declares';
 export declare namespace InputTypes {
     type BoxTone = 'border' | 'cloud' | 'bottomBorder' | 'plain';
     type Type = 'hidden' | 'textfield' | 'textfield.multiline' | 'select' | 'list.radio' | 'list.checkbox' | 'autocomplete.single' | 'autocomplete.multi' | 'time' | 'switch' | 'slider' | 'file' | 'contenteditable' | 'color' | '';
-    type OnUpdateValue<T = any> = (value: T, eventType: Validation.EventType, componentId: string) => void;
+    type OnUpdateValue<T = any> = (value: T, option: {
+        eventType?: Validation.EventType;
+        componentId?: string;
+        isValidated?: boolean;
+        isComposing?: boolean;
+        isFocusing?: boolean;
+    }) => void;
     type OnUserAction<T = any> = (value: T, option: {
         eventType?: Validation.EventType;
         componentId?: string;

package/dist/fn/Input/index.js

@@ -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 n from"./DigitCharacters";import l from"./Time";import d from"./Select";import s from"./Autocomplete";import*as r from"./List";import c from"./Search";import x from"./Filer";import y from"./Slider";import T from"./Switch";import f 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=n,e.Time=l,e.Select=d,e.Autocomplete=s,e.List=r.List,e.Radio=r.Radio,e.Checkbox=r.Checkbox,e.Checker=f,e.Search=c,e.Filer=x,e.Slider=y,e.Switch=T,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};
+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 n from"./DigitCharacters";import l from"./Time";import d from"./Select";import s from"./Autocomplete";import*as r from"./List";import c from"./Search";import x from"./Filer";import y from"./Slider";import T from"./Switch";import f from"./Checker";import g from"./Segmented";import b from"./Color";import S from"./CollectForm";var o;(e=>(e.Plain=i,e.Hidden=a,e.TextField=p,e.Contenteditable=m,e.DigitCharacters=n,e.Time=l,e.Select=d,e.Autocomplete=s,e.List=r.List,e.Radio=r.Radio,e.Checkbox=r.Checkbox,e.Checker=f,e.Search=c,e.Filer=x,e.Slider=y,e.Switch=T,e.Segmented=g,e.Color=b,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=S))(o||(o={}));export{o as Input,o as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amotify",
-  "version": "0.2.205",
+  "version": "0.2.207",
   "description": "UI Component for React,NextJS,esbuild",
   "scripts": {
     "start": "run-p clean build:*",
@@ -90,7 +90,7 @@
     "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@fortawesome/react-fontawesome": "^0.2.2",
     "dotenv": "^17.0.1",
-    "jmini": "^0.0.91",
+    "jmini": "^0.0.95",
     "react": "^18.3.1"
   },
   "devDependencies": {