amotify 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/atoms/Box.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { TagProperty
|
|
1
|
+
import { TagProperty } from '../@declaration';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
declare namespace Box {
|
|
4
4
|
type Input = TagProperty.BasicElement & {
|
|
5
|
-
children?:
|
|
5
|
+
children?: any;
|
|
6
6
|
} & React.HTMLAttributes<HTMLDivElement>;
|
|
7
7
|
}
|
|
8
8
|
declare const Box: React.FC<Box.Input>;
|
package/dist/atoms/Box.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,d as r}from"../chunk-VY3566IV.js";import{jsx as n}from"react/jsx-runtime";import{GenerateClassName as
|
|
1
|
+
import{b as t,d as r}from"../chunk-VY3566IV.js";import{jsx as n}from"react/jsx-runtime";import{GenerateClassName as m}from"../@utils";const a=o=>{let e=m(o),{freeCSS:c}=e,p=r(e,["freeCSS"]);return n("div",t({},p))};export{a as Box,a as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as E,c as J,d as W,e as K}from"../../../chunk-VY3566IV.js";import{Fragment as j,jsx as n,jsxs as O}from"react/jsx-runtime";import{useState as v,useEffect as R,useRef as L}from"react";import w from"@mingoo/jsmin";import{$$fromRoot as U,useStore as P}from"../../../@utils";import $ from"../../../atoms/Box";import _ from"../../../atoms/FAI";import z from"../../../atoms/Span";import H from"../../../mols/Column";import b from"../../../mols/Row";import V from"../../Button";import k from"../../Sheet";import G from"../../Loader";import Q from"../Text";import X from"../Parts";import{InputChipsClasses as Y}from"../../../@styles/componentClasses";const Z=e=>{let[h,i]=v("show"),[y,N]=v(""),[u]=v(w.uuid.gen()),[l,g]=v(e.options),[o,C]=v(l[0]||null),[S,x]=v(e.selected),[D,T]=v("init");R(()=>{P.set({[e.selectorID]:{updateOptions:t=>{g(t)},updateSelected:t=>{x(t)}}})},[]);const B=L(!1);R(()=>{B.current?k.reposition(e.selectorID):B.current=!0},[l]);const F=L(!1);R(()=>{F.current?(i("interlude"),C(l[0]||null),e.onDynamicSearch?(w.interval.clear(u+"-dynamicSearch"),w.interval.standBy(u+"-dynamicSearch",400,()=>K(void 0,null,function*(){let{options:t}=yield e.onDynamicSearch(y);g(t),i("show")}))):(w.interval.clear(u+"-staticSearch"),w.interval.standBy(u+"-staticSearch",400,()=>K(void 0,null,function*(){let t=new RegExp(y,"ig"),
|
|
1
|
+
import{b as E,c as J,d as W,e as K}from"../../../chunk-VY3566IV.js";import{Fragment as j,jsx as n,jsxs as O}from"react/jsx-runtime";import{useState as v,useEffect as R,useRef as L}from"react";import w from"@mingoo/jsmin";import{$$fromRoot as U,useStore as P}from"../../../@utils";import $ from"../../../atoms/Box";import _ from"../../../atoms/FAI";import z from"../../../atoms/Span";import H from"../../../mols/Column";import b from"../../../mols/Row";import V from"../../Button";import k from"../../Sheet";import G from"../../Loader";import Q from"../Text";import X from"../Parts";import{InputChipsClasses as Y}from"../../../@styles/componentClasses";const Z=e=>{let[h,i]=v("show"),[y,N]=v(""),[u]=v(w.uuid.gen()),[l,g]=v(e.options),[o,C]=v(l[0]||null),[S,x]=v(e.selected),[D,T]=v("init");R(()=>{P.set({[e.selectorID]:{updateOptions:t=>{g(t)},updateSelected:t=>{x(t)}}})},[]);const B=L(!1);R(()=>{B.current?k.reposition(e.selectorID):B.current=!0},[l]);const F=L(!1);R(()=>{F.current?(i("interlude"),C(l[0]||null),e.onDynamicSearch?(w.interval.clear(u+"-dynamicSearch"),w.interval.standBy(u+"-dynamicSearch",400,()=>K(void 0,null,function*(){let{options:t}=yield e.onDynamicSearch(y);g(t),i("show")}))):(w.interval.clear(u+"-staticSearch"),w.interval.standBy(u+"-staticSearch",400,()=>K(void 0,null,function*(){let t=new RegExp(y,"ig"),p=[];[...e.options].forEach(s=>{var c;!!(!y||((c=String(s.label))!=null?c:String(s.value)).match(t))&&p.push(s)}),g(p),i("show")})))):F.current=!0},[y]);const M=L(!1);R(()=>{M.current?e.onUpdated({values:S}):M.current=!0},[S]),R(()=>{w.scope(()=>{if(w.is.nullish(o)||D=="MouseEvent")return;let t=U("#"+u+"-Selector-Cell-Wrap");if(!t[0])return;let p=U('[data-chips-selector-cell="'+u+"-"+JSON.stringify((o==null?void 0:o.value)||"").replace(/\"/ig,"")+'"]');if(!p[0])return;let{top:s,height:I}=t.position(),{top:c,height:d}=p.position();if(s<=c&&c+d<=s+I)return;let r=t[0].scrollTop+(c-s);D=="ArrowDown"?r-=I-d-20:D=="ArrowUp"&&(r-=20),t[0].scrollTop=r})},[o]);let A=[];return h=="interlude"?A=[O(b.Center,{padding:2,gap:0,children:[n(G.Theme.R,{showInitial:!0}),n($,{padding:[0,1],fontSize:"1.mini",fontColor:"4.thin",children:"\u691C\u7D22\u4E2D..."})]},"interlude")]:A=[l.map((t,p)=>{let{value:s,label:I}=t,c=String(JSON.stringify(s)),d=S.findIndex(f=>JSON.stringify(f.value)==c),r=d!=-1,a=JSON.stringify((o==null?void 0:o.value)||"")==c,m={};return(r||a)&&(m={fontColor:"theme",isSemiBoldFont:!0}),a&&(m.backgroundColor="cloud"),r&&(m.backgroundColor="theme.opa.few"),n(V.Button.Clear.R,J(E({borderRadius:"3.tone.tertiary",color:"cloud",padding:"1/3",tabIndex:-1,textAlign:"left","data-chips-selector-cell":u+"-"+c.replace(/\"/ig,""),isActive:r||a,isActiveStyles:m},m),{onMouseOver:()=>{T("MouseEvent"),C(t)},onClick:()=>{let f=[...S];r?f.splice(d,1):(f=[...f,t],e.limit&&f.length>e.limit&&f.shift()),x(f)},children:n(e.SelectorCellComponent,{isSelected:r,isFocused:a,value:s,label:I})}),s+"-"+p)})],O(j,{children:[O(H,{padding:"2/3",gap:"2/3",borderBottom:!0,children:[O(b.Separate,{children:[n(Q.Normal,{value:y,onUpdateValidValue:({value:t})=>{N(t)},id:e.selectorID+"-KeywordInput",padding:"2/3",placeholder:"\u691C\u7D22...",leftIcon:n(X.LeftIcon,{right:"2/3",fontSize:"1.mini",fontColor:"3.blur",children:n(_.Search,{})}),onKeyDown:t=>{let{key:p,metaKey:s,ctrlKey:I}=t,c=s||I;if(["ArrowDown","ArrowUp"].includes(p)){let d=+(p=="ArrowDown")*2-1;if(c){let r=l[d==1?l.length-1:0];C(r)}else{let r=l.findIndex(a=>JSON.stringify(a.value)==JSON.stringify((o==null?void 0:o.value)||""))+d;l[r]?C(l[r]):C(l[d==1?0:l.length-1]||null)}}else if(p=="Enter"){let d=S.findIndex(m=>JSON.stringify(m.value)==JSON.stringify((o==null?void 0:o.value)||"")),r=d!=-1,a=[...S];if(r)a.splice(d,1);else{let m=l.findIndex(f=>JSON.stringify(f.value)==JSON.stringify((o==null?void 0:o.value)||""));if(m==-1)return;a=[...a,l[m]],e.limit&&a.length>e.limit&&a.shift()}x(a)}T(p)}}),n(V.Button.Border.S,{marginRight:"1/3",ssSphere:2,backgroundColor:"cloud",borderRadius:"2.tone.secondary",onClick:()=>{k.close(e.selectorID)},children:n(_.Times,{})})]}),O(b.Separate,{children:[O(b.Left,{gap:"1/2",verticalAlign:"baseline",children:[n(z,{fontColor:"theme",children:l.length}),n($,{fontSize:"1.mini",fontColor:"3.blur",children:"\u4EF6\u306E\u30D2\u30C3\u30C8"})]}),n(b.Right,{children:!!e.limit&&O(z,{fontColor:"3.blur",fontSize:"1.mini",children:[n(z,{fontSize:"3.paragraph",fontColor:"theme",isSemiBoldFont:!0,children:S.length})," / ",e.limit," \u4EF6"]})})]})]}),n(H,{gap:"1/4",padding:"1/2",overflow:"auto",freeCSS:{maxHeight:12*26,maxWidth:12*26},id:u+"-Selector-Cell-Wrap",className:Y("SelectorWrapper"),children:A}),e.bottomContent]})},q={openSelector:e=>{let T=e,{selectorID:h,options:i,selected:y,limit:N,bottomContent:u,onDynamicSearch:l,SelectorCellComponent:g,onUpdated:o,onClosed:C,parent:S}=T,x=W(T,["selectorID","options","selected","limit","bottomContent","onDynamicSearch","SelectorCellComponent","onUpdated","onClosed","parent"]),D=h;g=g||(B=>n(b.Left,{children:B.label})),k.open(J(E({parent:S,sheetID:D,type:"custom",gravityPoint:22,padding:[1,0],hold_state:!0,close_option:{aroundClick:!0,escapeKeyDown:!0}},x),{content:n($,{borderRadius:"2.tone.secondary",backgroundColor:"layer.1",border:!0,boxShadow:"1.normal",overflow:"hidden",children:n(Z,{selectorID:h,options:i,limit:N,selected:y,onUpdated:o,SelectorCellComponent:g,bottomContent:u,onDynamicSearch:l},JSON.stringify(y))}),openAfter:()=>{U("#"+e.selectorID+"-KeywordInput").focus()},closeAfter:()=>{C()}}))},closeSelector:e=>{k.close(e)},updateOptions:(e,h)=>{let i=P.get(e);i&&i.updateOptions&&i.updateOptions(h)},updateSelected:(e,h)=>{let i=P.get(e);i&&i.updateSelected&&i.updateSelected(h)}};export{q as Selector,q as default};
|
package/dist/fn/Input/Text.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as I,d as P}from"../../chunk-VY3566IV.js";import{Fragment as H,jsx as n,jsxs as W}from"react/jsx-runtime";import{useState as E,useEffect as z}from"react";import x from"@mingoo/jsmin";import{$$fromRoot as ae,useStore as re}from"../../@utils";import C from"../../atoms/Box";import F from"../../atoms/FAI";import U from"../Button";import R from"../Tooltips";import{faEye as K}from"@fortawesome/free-solid-svg-icons/faEye";import{Wrapper as ne,BoxWrapper as ie,SubmitForm as oe,CommonEffects as le,DefaultStyles as se}from"./core";import S from"./Parts";const ue={number:{reg:/^-?[0-9\.]+$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},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"},digitNumber:{reg:/^-?[0-9\.]+$/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:W(H,{children:[n(C,{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(C,{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:W(H,{children:[n(C,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),n(C,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),n(C,{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=e=>{let{restrict:r,value:u=""}=e,t=String(u),a=!1;if(["tel","number","digitNumber","test","postal","creditCard"].includes(r)&&(t=t.zen2hanNumber()),r=="katakana"&&(t=t.replace(/[^ァ-ヶー ｦ-ﾟ ]/ig,"")),r=="hankaku.katakana"&&(t=t.replace(/[^ｦ-ﾟ ]/ig,"")),["postal","creditCard"].includes(r)&&(t=t.removeLetters()),["number","digitNumber"].includes(r)&&t&&t!="-")if(t=="0-")t="-";else{t[0]=="-"&&(a=!0),t=t.replace(/[^0-9\.]/ig,"");let i=Number(t);i===0&&(a=!1),a&&(i=-1*i),x.is.exist(e.min)&&(i=Math.max(i,Number(e.min))),x.is.exist(e.max)&&(i=Math.min(i,Number(e.max))),t=String(Math.abs(i))}let p=t;if(r=="digitNumber"){if(t&&t!="-"){let i=[];for(let l=t.length-1;l>=0;l--){i.unshift(t[l]);let g=t.length-1-l+1;l!=0&&g%3==0&&i.unshift(",")}p=i.join("")}}else r=="postal"?t.length>=4&&(p=t.clip(0,3)+"-"+t.clip(3)):r=="creditCard"&&(p=t.replace(/.{4}(?=.)/g,"$& "));return["number","digitNumber"].includes(r)&&a&&(t="-"+t,p="-"+p),{formatValue:p,dataValue:t}},pe=e=>{let{id:r,restrict:u,val_status:t}=e,a=ae("#"+r)[0];if(a&&t.prevValue&&t.formatValue){let{formatValue:p,prevValue:i,caretFrom:l,caretTo:g}=t;if(u=="creditCard")p.length>=i.length&&l%5==0&&(l++,g++),a.setSelectionRange(l,g);else if(u=="postal")p.length==5&&i.length==3&&(l++,g++),a.setSelectionRange(l,g);else if(u=="digitNumber"){let D=p.length-i.length;D==2&&(l++,g++),D==-2&&(l--,g--),a.setSelectionRange(l,g)}}},Z=(e,r)=>{let u={ok:!0,body:""};return(()=>{let t=ue[r];if(!t)return;let a=t.reason;if(t){let p=!!(+!!e.match(t.reg)^+!t.exist);u={ok:p,body:p?"":a}}})(),u};function me(e){let{value:r,states:u}=e,{restrict:t="text",maxLength:a=255,required:p}=u,i=[];if(x.is.exist(a)&&r.length>=Number(a)&&i.push({type:"invalid",label:a+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),r){let l=Z(r,t);l.ok||i.push({type:"invalid",label:l.body})}else p&&i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!i.filter(({type:l})=>l=="invalid").length,notice:i}}const de=e=>{let L=e,{componentID:r,tone:u,required:t,restrict:a="text",form:p,autoComplete:i="off",autoCapitalize:l="off",enableFormSubmit:g,clearButton:D=!1,checkValidationAtFirst:ce,onChange:J,onKeyDown:M,onValidate:fe,onUpdateValue:q,onUpdateValidValue:Y,value:$="",leftIndicator:ge,rightIndicator:xe,leftIcon:be,rightIcon:he,maxLength:Ie,min:y,max:N}=L,d=P(L,["componentID","tone","required","restrict","form","autoComplete","autoCapitalize","enableFormSubmit","clearButton","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max"]),j=a=="password"||a=="concealed"?"password":"text",G=["number","digitNumber","creditCard"].includes(a)?"numeric":a=="email"?"email":"text",Q=I(o({componentID:r},T({min:y,max:N,restrict:a,value:$})),{prevValue:"",eventType:"init",eventID:x.uuid.gen(),caretFrom:null,caretTo:null}),[ee,X]=E(!1),[s,v]=E(Q),[k,B]=E({ok:!1,notice:[]});return le({states:e,val_status:s,set_status:v,val_validate:k,set_validate:B,DefaultValidation:me,onUpdateValue:q,onUpdateValidValue:Y,ExtraOverrideStates:o({},T({min:y,max:N,restrict:a,value:$}))}),z(()=>{pe({id:e.id,restrict:a,val_status:s})},[s]),n(ie,{val_status:s,set_status:v,val_validate:k,states:e,children:n("input",I(o({type:j,inputMode:G,"data-form":p,"data-input-type":"text","data-validation":k.ok,"data-value":s.dataValue,"data-component-id":s.componentID,value:s.formatValue,autoComplete:i,autoCapitalize:l,onKeyDown:c=>{let{key:f,target:w}=c;{let b=w,{selectionStart:h,selectionEnd:te}=b,V=Number(h),O=Number(te),_=s.formatValue[Number(V)],A=s.formatValue[Number(V)-1];f=="Delete"&&(a=="creditCard"&&_==" "||a=="postal"&&_=="-"||a=="digitNumber"&&_==",")&&(b.setSelectionRange(V+1,O+1),c.preventDefault()),f=="Backspace"&&(a=="creditCard"&&A==" "||a=="postal"&&A=="-"||a=="digitNumber"&&A==",")&&(b.setSelectionRange(V-1,O-1),c.preventDefault()),f=="Enter"||f=="Tab"}if(["number","digitNumber","creditCard"].includes(a)&&f=="Clear"&&v(I(o({},s),{dataValue:"",formatValue:"",eventType:"update",eventID:x.uuid.gen()})),["number","digitNumber"].includes(a)&&["ArrowUp","ArrowDown"].includes(f)){let b=+(f=="ArrowUp")*2-1,h=String(Number(s.dataValue)+b);k.ok&&B({ok:!1,notice:[]}),v(I(o(o({},s),T({min:y,max:N,restrict:a,value:h})),{eventType:"update",eventID:x.uuid.gen()})),c.preventDefault()}M&&M(c),g&&oe(c)},onChange:c=>{let{value:f,selectionStart:w,selectionEnd:b}=c.target,h=T({min:y,max:N,restrict:a,value:f});ee&&(h.formatValue=f),h.formatValue!=s.formatValue&&(k.ok&&B({ok:!1,notice:[]}),v(I(o(o({},s),h),{prevValue:s.formatValue,eventType:"update",eventID:x.uuid.gen(),caretFrom:Number(w),caretTo:Number(b)})),J&&J(c))}},d),{onCompositionStart:c=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(c)),X(!0)},onCompositionEnd:c=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(c)),a=="text")return;let f=T({min:y,max:N,restrict:a,value:s.formatValue});v(I(o(o({},s),f),{prevValue:s.formatValue,eventType:"update",eventID:x.uuid.gen(),caretFrom:Number(s.formatValue.length+1),caretTo:Number(s.formatValue.length+1)})),X(!1)}}))})},m={Validate:Z,Normal:e=>{var r,u;return e=o({},e),e.rightIcon&&(e.paddingRight=(r=e.paddingRight)!=null?r:3),e.leftIcon&&(e.paddingLeft=(u=e.paddingLeft)!=null?u:3),n(ne,{componentID:e.componentID,children:de,states:se.Boxish(e)})},Katakana:e=>n(m.Normal,o({restrict:"katakana"},e)),HankakuKatakana:e=>n(m.Normal,o({restrict:"hankaku.katakana"},e)),CreditCard:e=>n(m.Normal,o({restrict:"creditCard"},e)),Tel:e=>n(m.Normal,o({restrict:"tel",placeholder:"xxx-xxxx-xxxx"},e)),Number:e=>n(m.Normal,o({restrict:"number"},e)),DigitNumber:e=>n(m.Normal,o({restrict:"digitNumber"},e)),Email:e=>n(m.Normal,o({restrict:"email"},e)),Url:e=>n(m.Normal,o({restrict:"url"},e)),Postal:e=>{let[r]=E(x.uuid.gen());return z(()=>()=>{re.delete(r)},[]),n(m.Normal,o({restrict:"postal",placeholder:"\u90F5\u4FBF\u756A\u53F7",leftIndicator:n(S.LeftIndicator,{children:"\u3012"})},e))},Password:e=>n(m.Normal,o({restrict:"password",placeholder:"\u30D1\u30B9\u30EF\u30FC\u30C9\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{padding:0,children:n(U.Button.Normal.R,{padding:[0,1],fontColor:"theme",borderRadius:"inherit",backgroundColor:"inherit",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:r=>{R.open({parent:r.currentTarget,gravityPoint:24,padding:[1,0],content:n(R.Comps.Body,{children:"\u30D1\u30B9\u30EF\u30FC\u30C9\u3092\u8868\u793A"})})},tabIndex:-1,onClick:r=>{x(r.target).parent().parent().find("input").callback(u=>{let t=u[0];t.type=t.type==="password"?"text":"password"})},children:n(F,{icon:K})})})},e)),Concealed:e=>n(m.Normal,o({restrict:"concealed",placeholder:"\u79D8\u5BC6\u9375\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{padding:0,children:n(U.Button.Normal.R,{padding:[0,1],fontColor:"theme",borderRadius:"inherit",backgroundColor:"inherit",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:r=>{R.open({parent:r.currentTarget,gravityPoint:24,padding:[1,0],content:n(R.Comps.Body,{children:"\u5024\u3092\u8868\u793A"})})},tabIndex:-1,onClick:r=>{x(r.target).parent().parent().parent().find("input").callback(u=>{let t=u[0];t.type=t.type==="password"?"text":"password"})},children:n(F,{icon:K})})})},e)),Money:{JPY:e=>n(m.DigitNumber,o({placeholder:"\u91D1\u984D\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{children:"\u5186"})},e))}};export{m as Text,de as TextInput,m as default};
|
|
1
|
+
import{b as o,c as I,d as P}from"../../chunk-VY3566IV.js";import{Fragment as H,jsx as n,jsxs as W}from"react/jsx-runtime";import{useState as E,useEffect as z}from"react";import x from"@mingoo/jsmin";import{$$fromRoot as ae,useStore as re}from"../../@utils";import C from"../../atoms/Box";import F from"../../atoms/FAI";import U from"../Button";import R from"../Tooltips";import{faEye as K}from"@fortawesome/free-solid-svg-icons/faEye";import{Wrapper as ne,BoxWrapper as ie,SubmitForm as oe,CommonEffects as le,DefaultStyles as se}from"./core";import S from"./Parts";const ue={number:{reg:/^-?[0-9\.]+$/g,exist:!0,reason:"\u534A\u89D2\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"},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"},digitNumber:{reg:/^-?[0-9\.]+$/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:W(H,{children:[n(C,{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(C,{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:W(H,{children:[n(C,{children:"0\u304B\u3089\u59CB\u307E\u308B\u756A\u53F7\u306E\u307F\u5165\u529B\u53EF\u80FD\u3067\u3059"}),n(C,{children:"9~12\u6841\u306E\u6570\u5B57\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),n(C,{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=e=>{let{restrict:r,value:u=""}=e,t=String(u),a=!1;if(["tel","number","digitNumber","test","postal","creditCard"].includes(r)&&(t=t.zen2hanNumber()),r=="katakana"&&(t=t.replace(/[^ァ-ヶー ｦ-ﾟ ]/ig,"")),r=="hankaku.katakana"&&(t=t.replace(/[^ｦ-ﾟ ]/ig,"")),["postal","creditCard"].includes(r)&&(t=t.removeLetters()),["number","digitNumber"].includes(r)&&t&&t!="-")if(t=="0-")t="-";else{t[0]=="-"&&(a=!0),t=t.replace(/[^0-9\.]/ig,"");let i=Number(t);i===0&&(a=!1),a&&(i=-1*i),x.is.exist(e.min)&&(i=Math.max(i,Number(e.min))),x.is.exist(e.max)&&(i=Math.min(i,Number(e.max))),t=String(Math.abs(i))}let p=t;if(r=="digitNumber"){if(t&&t!="-"){let i=[];for(let l=t.length-1;l>=0;l--){i.unshift(t[l]);let g=t.length-1-l+1;l!=0&&g%3==0&&i.unshift(",")}p=i.join("")}}else r=="postal"?t.length>=4&&(p=t.clip(0,3)+"-"+t.clip(3)):r=="creditCard"&&(p=t.replace(/.{4}(?=.)/g,"$& "));return["number","digitNumber"].includes(r)&&a&&(t="-"+t,p="-"+p),{formatValue:p,dataValue:t}},pe=e=>{let{id:r,restrict:u,val_status:t}=e,a=ae("#"+r)[0];if(a&&t.prevValue&&t.formatValue){let{formatValue:p,prevValue:i,caretFrom:l,caretTo:g}=t;if(u=="creditCard")p.length>=i.length&&l%5==0&&(l++,g++),a.setSelectionRange(l,g);else if(u=="postal")p.length==5&&i.length==3&&(l++,g++),a.setSelectionRange(l,g);else if(u=="digitNumber"){let D=p.length-i.length;D==2&&(l++,g++),D==-2&&(l--,g--),a.setSelectionRange(l,g)}}},Z=(e,r)=>{let u={ok:!0,body:""};return(()=>{let t=ue[r];if(!t)return;let a=t.reason;if(t){let p=!!(+!!e.match(t.reg)^+!t.exist);u={ok:p,body:p?"":a}}})(),u};function me(e){let{value:r,states:u}=e,{restrict:t="text",maxLength:a=255,required:p}=u,i=[];if(x.is.exist(a)&&r.length>=Number(a)&&i.push({type:"invalid",label:a+"\u5B57\u4EE5\u5185\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),r){let l=Z(r,t);l.ok||i.push({type:"invalid",label:l.body})}else p&&i.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"});return{ok:!i.filter(({type:l})=>l=="invalid").length,notice:i}}const de=e=>{let L=e,{componentID:r,tone:u,required:t,restrict:a="text",form:p,autoComplete:i="off",autoCapitalize:l="off",enableFormSubmit:g,clearButton:D=!1,checkValidationAtFirst:ce,onChange:J,onKeyDown:M,onValidate:fe,onUpdateValue:q,onUpdateValidValue:Y,wrapStyles:ge,value:$="",leftIndicator:xe,rightIndicator:be,leftIcon:he,rightIcon:Ie,maxLength:ve,min:y,max:N}=L,d=P(L,["componentID","tone","required","restrict","form","autoComplete","autoCapitalize","enableFormSubmit","clearButton","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","wrapStyles","value","leftIndicator","rightIndicator","leftIcon","rightIcon","maxLength","min","max"]),j=a=="password"||a=="concealed"?"password":"text",G=["number","digitNumber","creditCard"].includes(a)?"numeric":a=="email"?"email":"text",Q=I(o({componentID:r},T({min:y,max:N,restrict:a,value:$})),{prevValue:"",eventType:"init",eventID:x.uuid.gen(),caretFrom:null,caretTo:null}),[ee,X]=E(!1),[s,v]=E(Q),[k,B]=E({ok:!1,notice:[]});return le({states:e,val_status:s,set_status:v,val_validate:k,set_validate:B,DefaultValidation:me,onUpdateValue:q,onUpdateValidValue:Y,ExtraOverrideStates:o({},T({min:y,max:N,restrict:a,value:$}))}),z(()=>{pe({id:e.id,restrict:a,val_status:s})},[s]),n(ie,{val_status:s,set_status:v,val_validate:k,states:e,children:n("input",I(o({type:j,inputMode:G,"data-form":p,"data-input-type":"text","data-validation":k.ok,"data-value":s.dataValue,"data-component-id":s.componentID,value:s.formatValue,autoComplete:i,autoCapitalize:l,onKeyDown:c=>{let{key:f,target:w}=c;{let b=w,{selectionStart:h,selectionEnd:te}=b,V=Number(h),O=Number(te),_=s.formatValue[Number(V)],A=s.formatValue[Number(V)-1];f=="Delete"&&(a=="creditCard"&&_==" "||a=="postal"&&_=="-"||a=="digitNumber"&&_==",")&&(b.setSelectionRange(V+1,O+1),c.preventDefault()),f=="Backspace"&&(a=="creditCard"&&A==" "||a=="postal"&&A=="-"||a=="digitNumber"&&A==",")&&(b.setSelectionRange(V-1,O-1),c.preventDefault()),f=="Enter"||f=="Tab"}if(["number","digitNumber","creditCard"].includes(a)&&f=="Clear"&&v(I(o({},s),{dataValue:"",formatValue:"",eventType:"update",eventID:x.uuid.gen()})),["number","digitNumber"].includes(a)&&["ArrowUp","ArrowDown"].includes(f)){let b=+(f=="ArrowUp")*2-1,h=String(Number(s.dataValue)+b);k.ok&&B({ok:!1,notice:[]}),v(I(o(o({},s),T({min:y,max:N,restrict:a,value:h})),{eventType:"update",eventID:x.uuid.gen()})),c.preventDefault()}M&&M(c),g&&oe(c)},onChange:c=>{let{value:f,selectionStart:w,selectionEnd:b}=c.target,h=T({min:y,max:N,restrict:a,value:f});ee&&(h.formatValue=f),h.formatValue!=s.formatValue&&(k.ok&&B({ok:!1,notice:[]}),v(I(o(o({},s),h),{prevValue:s.formatValue,eventType:"update",eventID:x.uuid.gen(),caretFrom:Number(w),caretTo:Number(b)})),J&&J(c))}},d),{onCompositionStart:c=>{d!=null&&d.onCompositionStart&&(d==null||d.onCompositionStart(c)),X(!0)},onCompositionEnd:c=>{if(d!=null&&d.onCompositionEnd&&(d==null||d.onCompositionEnd(c)),a=="text")return;let f=T({min:y,max:N,restrict:a,value:s.formatValue});v(I(o(o({},s),f),{prevValue:s.formatValue,eventType:"update",eventID:x.uuid.gen(),caretFrom:Number(s.formatValue.length+1),caretTo:Number(s.formatValue.length+1)})),X(!1)}}))})},m={Validate:Z,Normal:e=>{var r,u;return e=o({},e),e.rightIcon&&(e.paddingRight=(r=e.paddingRight)!=null?r:3),e.leftIcon&&(e.paddingLeft=(u=e.paddingLeft)!=null?u:3),n(ne,{componentID:e.componentID,children:de,states:se.Boxish(e)})},Katakana:e=>n(m.Normal,o({restrict:"katakana"},e)),HankakuKatakana:e=>n(m.Normal,o({restrict:"hankaku.katakana"},e)),CreditCard:e=>n(m.Normal,o({restrict:"creditCard"},e)),Tel:e=>n(m.Normal,o({restrict:"tel",placeholder:"xxx-xxxx-xxxx"},e)),Number:e=>n(m.Normal,o({restrict:"number"},e)),DigitNumber:e=>n(m.Normal,o({restrict:"digitNumber"},e)),Email:e=>n(m.Normal,o({restrict:"email"},e)),Url:e=>n(m.Normal,o({restrict:"url"},e)),Postal:e=>{let[r]=E(x.uuid.gen());return z(()=>()=>{re.delete(r)},[]),n(m.Normal,o({restrict:"postal",placeholder:"\u90F5\u4FBF\u756A\u53F7",leftIndicator:n(S.LeftIndicator,{children:"\u3012"})},e))},Password:e=>n(m.Normal,o({restrict:"password",placeholder:"\u30D1\u30B9\u30EF\u30FC\u30C9\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{padding:0,children:n(U.Button.Normal.R,{padding:[0,1],fontColor:"theme",borderRadius:"inherit",backgroundColor:"inherit",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:r=>{R.open({parent:r.currentTarget,gravityPoint:24,padding:[1,0],content:n(R.Comps.Body,{children:"\u30D1\u30B9\u30EF\u30FC\u30C9\u3092\u8868\u793A"})})},tabIndex:-1,onClick:r=>{x(r.target).parent().parent().find("input").callback(u=>{let t=u[0];t.type=t.type==="password"?"text":"password"})},children:n(F,{icon:K})})})},e)),Concealed:e=>n(m.Normal,o({restrict:"concealed",placeholder:"\u79D8\u5BC6\u9375\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{padding:0,children:n(U.Button.Normal.R,{padding:[0,1],fontColor:"theme",borderRadius:"inherit",backgroundColor:"inherit",flexCenter:!0,height:1,ssEffectsOnActive:["expand"],onMouseOver:r=>{R.open({parent:r.currentTarget,gravityPoint:24,padding:[1,0],content:n(R.Comps.Body,{children:"\u5024\u3092\u8868\u793A"})})},tabIndex:-1,onClick:r=>{x(r.target).parent().parent().parent().find("input").callback(u=>{let t=u[0];t.type=t.type==="password"?"text":"password"})},children:n(F,{icon:K})})})},e)),Money:{JPY:e=>n(m.DigitNumber,o({placeholder:"\u91D1\u984D\u3092\u5165\u529B",rightIndicator:n(S.RightIndicator,{children:"\u5186"})},e))}};export{m as Text,de as TextInput,m as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as n,e as D}from"../../chunk-VY3566IV.js";import{jsx as
|
|
1
|
+
import{b as o,c as n,e as D}from"../../chunk-VY3566IV.js";import{jsx as y,jsxs as V}from"react/jsx-runtime";import{useState as _,useEffect as R,useRef as P}from"react";import i from"@mingoo/jsmin";import{$$fromRoot as z,Config as L,useStore as m,GenerateClassName as B}from"../../@utils";import{InputClasses as N}from"../../@styles/componentClasses";import E from"../../atoms/Box";import A from"../../atoms/Flex";import T from"../../atoms/FAI";import w from"../../mols/Row";import W from"../../mols/Column";import U from"../Button";import k from"../Tooltips";const ue=e=>{let[t]=_(e.componentID||i.uuid.gen());e=o({},e),e.states=n(o({enableFormSubmit:!0,status_id:i.uuid.gen(),override:"never",name:i.uuid.gen(),id:i.uuid.gen(),"aria-label":"Input-"+t},e.states),{componentID:t});let{children:a}=e;return y(a,o({},e.states))},de=e=>{let{children:t,val_status:a,set_status:r,val_validate:c,states:l}=e,{clearButton:s,rightIcon:u,leftIcon:p,wrapStyles:v}=l;return a.eventType=="init"&&!l.checkValidationAtFirst&&(c.notice=[]),V(w.Center,n(o({position:"relative",verticalAlign:"unset",gap:0},v),{className:N("Wrapper"),"data-notice-uid":a.componentID,children:[y($,{notice:c.notice,val_status:a}),l.leftIndicator,V(A,{position:"relative",flexSizing:"auto",children:[p,t,s&&a.dataValue?y(U.Button.Normal.R,{ssSphere:2,flexCenter:!0,fontColor:"5.translucent",ssEffectsOnActive:["ripple.theme"],position:"absolute",right:1,top:"50%",freeCSS:{zIndex:3,transform:"translateY(-50%)"},onClick:()=>{r(n(o({},a),{dataValue:"",formatValue:"",eventType:"update",eventID:i.uuid.gen()}))},children:y(T.Times,{})}):u]}),l.rightIndicator]}))},$=e=>{let{notice:t,val_status:a}=e,{componentID:r,eventType:c}=a,l="NoticeTimer-"+r,s="NoticeTimerClose-"+r,u="notice-tips-"+r;return i.interval.clear(l),i.interval.clear(s),t.length?(i.interval.standBy(l,350,()=>{k.open({tipsID:u,parent:`[data-notice-uid="${r}"]`,gravityPoint:22,padding:[1,0],close_option:{parentBlur:!1},content:V(k.Comps.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[y(E,{position:"absolute",unitHeight:1,unitWidth:1,left:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),y(W,{gap:"1/3",position:"relative",freeCSS:{zIndex:2},backgroundColor:"inherit",children:t.map((p,v)=>{let{type:S,label:I}=p,g=S=="invalid"?T.Times:S=="warn"?T.Exclamation:T.Check;return V(w.Left,{gap:0,borderRadius:"2.tone.secondary",children:[y(g,{flexCenter:!0,fontSize:"3.paragraph",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[S]}),y(E,{fontColor:"white",children:I})]},v)})})]})})}),i.interval.standBy(s,6e3,()=>{k.close(u)}),null):(k.close(u),null)},ce=e=>{let{type:t,states:a,val_status:r,set_status:c,ExtraOverrideStates:l,ExtraStoreStates:s,val_validate:u,set_validate:p,DefaultValidation:v,onUpdateValue:S,onUpdateValidValue:I}=e;a=o({},a);let{componentID:g}=r,[F,O]=_(i.uuid.gen());R(()=>(m.update({[g]:o({ResolveRefresh:null,Refresh:()=>new Promise((d,f)=>{m.get(g).ResolveRefresh=d,O(i.uuid.gen())}),GenNotice:d=>{let{ok:f,notice:h}=d;p({ok:f,notice:h})}},s)}),()=>{m.delete(g)}),[]);const x=P(!1);R(()=>{x.current?c(n(o({},r),{eventType:"refresh",eventID:i.uuid.gen()})):x.current=!0},[F]),R(()=>{a.value=r.dataValue,i.interval.clear("ValidationTimer-"+g),j({val_status:r,set_validate:p,DefaultValidation:v,states:a})},[r.eventID]),(()=>{let{override:d}=a;if(d=="never"||d=="beforeModified"&&!["init","override"].includes(r.eventType))return;let f=m.get(r.componentID);f&&(a.value!=r.dataValue&&a.status_id!=f.status_id&&c(n(o(n(o({},r),{dataValue:a.value}),l),{eventType:"override",eventID:i.uuid.gen()})),f.status_id=a.status_id)})(),R(()=>{let{componentID:d,eventType:f,dataValue:h}=r,C=h;if(t=="list"?C=h.map(b=>JSON.parse(b)):t=="select"||t=="richSelect"?C=JSON.parse(h):t=="file"&&m.update({[d]:{Files:r.dataValue}}),f=="refresh"){let b=m.get(d);b&&b.ResolveRefresh&&b.ResolveRefresh(null)}f=="update"&&(S&&S({componentID:d,value:C,storeData:m.get(d),eventType:f}),i.scope(()=>{u.ok&&I&&I({componentID:d,value:C,storeData:m.get(d),eventType:f})}))},[u])},j=e=>{let{val_status:t,states:a,set_validate:r,DefaultValidation:c}=e,l=c({value:t.dataValue,states:a});if(!l.ok){r(l);return}let s=l.notice;const u=()=>D(void 0,null,function*(){if(!a.onValidate)return;let p=yield a.onValidate({value:t.dataValue,eventType:t.eventType,props:e});if(!p.ok){r({ok:!1,notice:[...s,...p.notice]});return}r({ok:!0,notice:[...s,...p.notice]})});a.onValidate?t.eventType=="refresh"?u():i.interval.standBy("ValidationTimer-"+t.componentID,450,u):r({ok:!0,notice:s})},pe=e=>{let t=e.target,{form:a,formName:r}=t.dataset;a=r||a;let c=!1,l=z(`[data-form-submit-button="${a}"]`)[0];if(!l)return c;let s=l.dataset.sdfike||"",u=e.key,p=e.ctrlKey||e.metaKey;return i.scope(()=>{s.includes("enter")&&(u!="Enter"||e.nativeEvent.isComposing||L.get().browserIs=="safari"&&e.keyCode==229)||((u=="Enter"&&(s.includes("enter")||s.includes("auxEnter")&&p)||u==" "&&s.includes("space"))&&(l.click(),e.preventDefault()),c=!0)}),c},K={Input:e=>{if(e=="plain")return{};let t={padding:"3/4",transition:"middle",flexSizing:"auto",boxShadow:"0.thin"};return e=="border"?t=n(o({},t),{border:!0,borderRadius:"2.tone.secondary",backgroundColor:"layer.1"}):e=="cloud"?t=n(o({},t),{border:"1.thin",borderRadius:"2.tone.secondary",backgroundColor:"cloud"}):e=="bottomBorder"&&(t=n(o({},t),{borderRadius:0,border:"unset",borderBottom:!0,backgroundColor:"cloud"})),t},ListCell:e=>{e=o({},e),e.tone||(e.tone="border");let{tone:t}=e;return t=="plain"||(e=n(o({},e),{cellStyles:o({position:"relative",padding:["3/4",1],borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),t=="normal"?e=n(o({gap:"1/2"},e),{cellStyles:o({isSemiBoldFont:!0},e.cellStyles),cellCheckedStyles:{backgroundColor:"cloud"}}):(e=n(o({gap:"3/4"},e),{cellStyles:o({boxShadow:"0.thin"},e.cellStyles)}),(t=="cloud"||t=="vivid")&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2"},e.cellStyles)),t=="border"?(e.cellStyles=o({border:!0,backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):t=="cloud"?e.cellCheckedStyles=o({backgroundColor:"theme.opa.few",fontColor:"theme",borderColor:"theme"},e.cellCheckedStyles):t=="vivid"&&(e.cellCheckedStyles=o({backgroundColor:"theme",fontColor:"white",borderColor:"theme"},e.cellCheckedStyles)))),B(e)},Boxish:e=>{e=o({},e),e.tone||(e.tone="border");let t=n(o(o(o(n(o({},K.Input(e.tone)),{fontColor:"2.normal"}),e),!!e.leftIndicator&&{borderTopLeftRadius:"2/3",borderBottomLeftRadius:"2/3",marginLeft:"1/4"}),!!e.rightIndicator&&{borderTopRightRadius:"2/3",borderBottomRightRadius:"2/3",marginRight:"1/4"}),{className:[N("Input"),e.className].join(" ")});return B(t)},Indicator:e=>{if(e||(e="border"),e=="plain")return{};let t={flexSizing:"none",flexCenter:!0,padding:[0,1],borderRadius:"2.tone.secondary",backgroundColor:"cloud"};return e=="border"?t=n(o({},t),{border:!0}):e=="cloud"?t=n(o({},t),{border:"1.thin"}):e=="bottomBorder"&&(t=n(o({},t),{borderRadius:0,borderBottom:!0})),t},IndicatorIcon:{position:"absolute",ssSquare:2,top:"50%",flexCenter:!0,fontColor:"theme",fontSize:"1.mini",backgroundColor:"inherit",freeCSS:{transform:"translateY(-50%)"}}};export{de as BoxWrapper,ce as CommonEffects,K as DefaultStyles,pe as SubmitForm,j as ValidationCheck,ue as Wrapper};
|
package/dist/temps/designBook.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import{e as I}from"../chunk-VY3566IV.js";import{Fragment as
|
|
1
|
+
import{e as I}from"../chunk-VY3566IV.js";import{Fragment as u,jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as D,useEffect as V}from"react";import R from"@mingoo/jsmin";import{Config as A}from"../@utils";import{Box as o,Span as U,Grid as g,Flex as c,FAI as x,Img as f,Logo as l,Placeholder as q}from"../atoms";import{List as S,LinkifyText as Y,Accordion as M,Row as B,Column as h,Text as n}from"../mols";import{PageViewController as J,SwipeView as K,TabBar as j,Plate as _,Table as m,Input as i,Button as r,Sheet as G,Snackbar as y,Tooltips as z,Loader as w,Effect as X,Cropper as $}from"../fn";const O={_:()=>t(u,{children:[e(O.DarkMode,{}),e(O.ThemeColor,{})]}),DarkMode:()=>t(B.Separate,{children:[e(o,{isSemiBoldFont:!0,fontSize:"4.thirdTitle",children:"Dark Mode"}),e(c,{gap:2,children:e(i.Segmented.Border,{value:A.get().darkMode,textAlign:"left",options:[{value:"light",label:"Light"},{value:"dark",label:"Dark"},{value:"dim",label:"Dim"},{value:"auto",label:"Auto"}],flexCenter:!0,onUpdateValidValue:({value:a})=>{let d=a[0];A.update.darkMode(d)}})})]}),ThemeColor:()=>{const a=p=>{A.update.themeColor(p)};let d=[];const s=["comun","leaf","heart","droplet","brick","flower","lip","wine","theater","bat","poizon","eggplant","ufo","alien","tombstone","ninja","moon","rain","unicorn","axe","gem","soap","drizzle","building","fish","icicles","water","tree1","tree2","tree3","battery","seedle","greenTea","oak","salad","cloudy","lemon","angel","parasol","pizza","thunder","latte","island","shovel","coffee","carrot","cactus","volcano","choco","industry","gun","galaxy","line","twitter","amazon","facebook","android","slackBlue","slackGreen","slackRed","slackYellow","slackBase","googleBlue","googleGreen","googleYellow","googleRed"];for(let p of s)d.push(e(r.Button.Prime.R,{padding:[1,1.5],fontColor:"white",borderRadius:"1.tone.primary",textAlign:"left",backgroundColor:p,onClick:()=>{a(p)},children:e(n.Supplement,{children:p.toCapital()})},p));return t(B.Separate,{children:[e(n.SubTitle,{children:"ThemeColor"}),e(g,{gridCols:5,gap:"1/3",children:d})]})}},T={_:()=>t(u,{children:[t(c,{gap:1,flexChilds:"even",flexNewLine:!0,children:[e(o,{padding:2,ssCardBox:!0,flexCenter:!0,children:"Hello"}),e(o,{padding:2,ssCardBox:"border",flexCenter:!0,children:"Hello"}),e(o,{padding:2,ssCardBox:"cloud",flexCenter:!0,children:"Hello"})]}),t(c,{gap:1,children:[e(o,{flexCenter:!0,children:e(q,{unitWidth:6,unitHeight:6,children:"Placeholder",isRounded:!0})}),t(g,{gridCols:3,gap:1,flexSizing:"auto",children:[e(o,{backgroundColor:"layer.1",padding:2}),e(o,{backgroundColor:"layer.2",padding:2}),e(o,{backgroundColor:"layer.3",padding:2}),e(o,{backgroundColor:"layer.4",padding:2}),e(o,{backgroundColor:"layer.5",padding:2}),e(o,{backgroundColor:"layer.6",padding:2})]}),t(g,{gridCols:3,gap:"1/2",flexSizing:"auto",ssCardBox:!0,children:[e(o,{flexCenter:!0,fontColor:"1.clear",children:"FontColor1"}),e(o,{flexCenter:!0,fontColor:"2.normal",children:"FontColor2"}),e(o,{flexCenter:!0,fontColor:"3.blur",children:"FontColor3"}),e(o,{flexCenter:!0,fontColor:"4.thin",children:"FontColor4"}),e(o,{flexCenter:!0,fontColor:"5.translucent",children:"FontColor5"})]})]}),e(T.Fonts,{}),e(T.Box,{}),e(T.Flex,{}),e(T.Grid,{}),e(T.Others,{})]}),Fonts:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Font"}),t(o,{overflow:"auto",padding:1,children:[e(n.Description,{padding:1,children:`<Box
|
|
2
2
|
fontSize={ 0 ~ 8 }
|
|
3
3
|
>
|
|
4
4
|
some text
|
|
5
|
-
</Box>`}),e(S,{rowStyles:{flexType:"col",borderBottom:!0,padding:1,flexWrap:!1,gap:"1/2"},rows:[{children:t(
|
|
5
|
+
</Box>`}),e(S,{rowStyles:{flexType:"col",borderBottom:!0,padding:1,flexWrap:!1,gap:"1/2"},rows:[{children:t(u,{children:["\u30FB Landing",t(o,{fontSize:"7.landing",isSemiBoldFont:!0,children:["Visualize Your ",e(U,{fontColor:"theme",children:"Colors"})," On a Real Website"]})]})},{children:t(u,{children:["\u30FB Title",e(o,{fontSize:"6.title",children:"\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u56FD\u6C11\u8CA0\u62C5\u7387\u3092\u516C\u8868\u3057\u307E\u3059"})]})},{children:t(u,{children:["\u30FB SubTitle",e(o,{fontSize:"5.subTitle",children:"\u652F\u6255\u3044\u3092\u53D7\u3051\u4ED8\u3051\u308B"})]})},{children:t(u,{children:["\u30FB ThirdTitle",e(o,{fontSize:"4.thirdTitle",children:"\u79DF\u7A0E\u8CA0\u62C5\u7387\u3068\u793E\u4F1A\u4FDD\u969C\u8CA0\u62C5\u7387\u3092\u5408\u8A08\u3057\u305F\u56FD\u6C11\u8CA0\u62C5\u7387\u306B\u3064\u3044\u3066\u3001\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u898B\u901A\u3057\u3092\u63A8\u8A08\u3057\u307E\u3057\u305F\u306E\u3067\u3001\u516C\u8868\u3057\u307E\u3059\u3002"})]})},{children:t(u,{children:["\u30FB Paragraph",e(n.Description,{fontSize:"3.paragraph",children:e(Y,{text:`
|
|
6
6
|
This article discusses performance best practices for fonts.
|
|
7
|
-
There are a variety of ways in which web fonts impact performance`})})]})},{children:t(
|
|
7
|
+
There are a variety of ways in which web fonts impact performance`})})]})},{children:t(u,{children:["\u30FB Normal",e(o,{fontSize:"2.normal",children:"\u52B9\u7387\u7684\u3067\u6301\u7D9A\u53EF\u80FD\u306A\u8CA1\u653F\u3078\u306E\u8EE2\u63DB\u3092\u56F3\u308A\u3001\u3053\u306E\u8CA1\u653F\u69CB\u9020\u3092\u5404\u822C\u306E\u69CB\u9020\u6539\u9769\u3068\u3068\u3082\u306B\u63A8\u9032\u3059\u308B\u3053\u3068\u3067\u3001\u6C11\u9593\u9700\u8981\u4E3B\u5C0E\u306E\u6301\u7D9A\u7684\u7D4C\u6E08\u6210\u9577\u306E\u5B9F\u73FE\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u5C11\u5B50\u30FB\u9AD8\u9F62\u5316\u3001\u56FD\u969B\u5316\u306A\u3069\u7D4C\u6E08\u793E\u4F1A\u306E\u69CB\u9020\u5909\u5316\u306B\u5BFE\u5FDC\u3067\u304D\u308B21\u4E16\u7D00\u306E\u3042\u308B\u3079\u304D\u7A0E\u5236\u3092\u304D\u305A\u304D\u307E\u3059\u3002 \u8CA1\u653F\u6295\u878D\u8CC7\u306F\u3001\u884C\u8CA1\u653F\u6539\u9769\u306E\u8DA3\u65E8\u3092\u8E0F\u307E\u3048\u3001\u6C11\u9593\u3067\u306F\u3067\u304D\u306A\u3044\u5206\u91CE\u30FB\u4E8B\u696D\u306A\u3069\u306B\u91CD\u70B9\u5316\u3092\u884C\u3044\u3001\u771F\u306B\u653F\u7B56\u7684\u306B\u5FC5\u8981\u306A\u8CC7\u91D1\u9700\u8981\u306B\u306F\u7684\u78BA\u306B\u5BFE\u5FDC\u3057\u307E\u3059\u3002 \u91D1\u878D\u5E81\u3068\u5354\u529B\u3057\u3001\u91D1\u878D\u306E\u30BB\u30FC\u30D5\u30C6\u30A3\u30CD\u30C3\u30C8\u3092\u6574\u5099\u3057\u3001\u91D1\u878D\u5371\u6A5F\u306B\u7D20\u65E9\u304F\u5BFE\u5FDC\u3059\u308B\u306A\u3069\u3001\u91D1\u878D\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u306E\u78BA\u4FDD\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u56FD\u969B\u7684\u306A\u5354\u529B\u7B49\u306B\u7A4D\u6975\u7684\u306B\u53D6\u308A\u7D44\u3080\u3053\u3068\u306B\u3088\u308A\u3001\u56FD\u969B\u901A\u8CA8\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u30FB\u56FD\u969B\u8CBF\u6613\u306E\u79E9\u5E8F\u3042\u308B\u767A\u5C55\u3092\u76EE\u6307\u3057\u307E\u3059\u3002"})]})},{children:t(u,{children:["\u30FB Mini",e(o,{fontSize:"1.mini",children:"Copyright \xA9 Ministry of Finance Japan. All Rights Reserved."})]})}]})]})]}),Box:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Box"}),e(o,{padding:1,overflow:"auto",children:e(m.Normal,{ssCardBox:!1,tone:"cellBorder",borderRadius:0,height:1,colLength:2,head:!1,rows:[[{children:e(n.Description,{children:`<Box>
|
|
8
8
|
helloWorld!!
|
|
9
9
|
</Box>`})},{children:e(o,{children:" helloWorld!! "})}],[{children:e(n.Description,{children:`<Box
|
|
10
10
|
children={ 'helloWorld!!' }
|
|
@@ -28,7 +28,7 @@ flexChilds={ 'auto' }
|
|
|
28
28
|
<Box />
|
|
29
29
|
<Box />
|
|
30
30
|
...
|
|
31
|
-
</Flex>`})},{children:t(
|
|
31
|
+
</Flex>`})},{children:t(u,{children:[t(c,{gap:1,flexCenter:!0,children:[e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lightest"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lighter"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lighten"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darken"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darker"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darkest"})]}),t(c,{gap:1,flexCenter:!0,children:[e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.1"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.2"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.3"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.4"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.5"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.6"})]})]})}],[{children:e(n.Description,{children:`<Flex gap={ 1 }>
|
|
32
32
|
<Box flexGrid={ 2 } ... />
|
|
33
33
|
<Box flexGrid={ 3 } ... />
|
|
34
34
|
<Box flexGrid={ 4 } ... />
|
|
@@ -39,7 +39,7 @@ flexChilds={ 'auto' }
|
|
|
39
39
|
<Box children={ 'GridBox4' } />
|
|
40
40
|
<Box children={ 'GridBox5' } />
|
|
41
41
|
<Box children={ 'GridBox6' } />
|
|
42
|
-
</Grid>`})},{children:t(g,{gridCols:3,gap:1,children:[e(o,{border:!0,padding:1,backgroundColor:"layer.1",children:"GridBox1"}),e(o,{border:!0,padding:1,backgroundColor:"layer.2",children:"GridBox2"}),e(o,{border:!0,padding:1,backgroundColor:"layer.3",children:"GridBox3"}),e(o,{border:!0,padding:1,backgroundColor:"layer.4",children:"GridBox4"}),e(o,{border:!0,padding:1,backgroundColor:"layer.5",children:"GridBox5"}),e(o,{border:!0,padding:1,backgroundColor:"layer.6",children:"GridBox6"})]})}]]})})]}),Others:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Others"}),e(o,{padding:1,overflow:"auto",children:e(m.Normal,{ssCardBox:!1,colLength:2,tone:"cellBorder",height:1,borderRadius:0,head:!1,rows:[[{children:e(
|
|
42
|
+
</Grid>`})},{children:t(g,{gridCols:3,gap:1,children:[e(o,{border:!0,padding:1,backgroundColor:"layer.1",children:"GridBox1"}),e(o,{border:!0,padding:1,backgroundColor:"layer.2",children:"GridBox2"}),e(o,{border:!0,padding:1,backgroundColor:"layer.3",children:"GridBox3"}),e(o,{border:!0,padding:1,backgroundColor:"layer.4",children:"GridBox4"}),e(o,{border:!0,padding:1,backgroundColor:"layer.5",children:"GridBox5"}),e(o,{border:!0,padding:1,backgroundColor:"layer.6",children:"GridBox6"})]})}]]})})]}),Others:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Others"}),e(o,{padding:1,overflow:"auto",children:e(m.Normal,{ssCardBox:!1,colLength:2,tone:"cellBorder",height:1,borderRadius:0,head:!1,rows:[[{children:e(u,{children:e(n.Description,{children:`
|
|
43
43
|
<Button.Label
|
|
44
44
|
htmlFor='testAccordion'
|
|
45
45
|
type='sub'
|
|
@@ -53,27 +53,27 @@ children={
|
|
|
53
53
|
in Accordion Element
|
|
54
54
|
</>
|
|
55
55
|
}
|
|
56
|
-
/>`})})},{children:t(
|
|
56
|
+
/>`})})},{children:t(u,{children:[e(r.Label.Sub.R,{children:"ToggleButton",onClick:()=>{M.fn.toggle("testAccordion")}}),e(M,{accordionID:"testAccordion",defaultOpen:!0,children:"in Accordion Element"})]})}],[{children:e(n.Description,{children:`
|
|
57
57
|
<Img
|
|
58
58
|
maxheight={ 8 }
|
|
59
59
|
maxWidth={ 8 }
|
|
60
60
|
src='...'
|
|
61
61
|
alt='noImage'
|
|
62
62
|
/>
|
|
63
|
-
`})},{children:e(f,{src:l.Images.defaultIcon("user"),alt:"noImage",freeCSS:{maxHeight:12*8,maxWidth:12*8}})}]]})})]})},C={_:()=>t(
|
|
63
|
+
`})},{children:e(f,{src:l.Images.defaultIcon("user"),alt:"noImage",freeCSS:{maxHeight:12*8,maxWidth:12*8}})}]]})})]})},C={_:()=>t(u,{children:[e(C.Comun,{}),e(C.Mingoo,{}),e(C.Google,{}),e(C.Facebook,{}),e(C.Line,{}),e(C.Twitter,{})]}),Comun:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Comun"}),e(o,{padding:1,overflow:"auto",children:t(h,{padding:2,children:[t(B.Left,{gap:2,children:[e(l.Brands.ComunIcon,{size:"S"}),e(l.Brands.ComunIcon,{size:"R"}),e(l.Brands.ComunIcon,{size:"L"}),e(l.Brands.ComunIcon,{size:"2L"}),e(l.Brands.ComunIcon,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(l.Brands.ComunTitle,{size:"S"}),e(l.Brands.ComunTitle,{size:"R"}),e(l.Brands.ComunTitle,{size:"L"}),e(l.Brands.ComunTitle,{size:"2L"}),e(l.Brands.ComunTitle,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(l.Brands.ComunLogoH,{size:"S"}),e(l.Brands.ComunLogoH,{size:"R"}),e(l.Brands.ComunLogoH,{size:"L"}),e(l.Brands.ComunLogoH,{size:"2L"}),e(l.Brands.ComunLogoH,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(l.Brands.ComunLogoV,{size:"S"}),e(l.Brands.ComunLogoV,{size:"R"}),e(l.Brands.ComunLogoV,{size:"L"}),e(l.Brands.ComunLogoV,{size:"2L"}),e(l.Brands.ComunLogoV,{size:"3L"})]})]})})]}),Mingoo:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Mingoo"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(l.Brands.MingooIcon,{size:"S"}),e(l.Brands.MingooIcon,{size:"R"}),e(l.Brands.MingooIcon,{size:"L"}),e(l.Brands.MingooIcon,{size:"2L"}),e(l.Brands.MingooIcon,{size:"3L"})]})})]}),Google:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Google"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(l.Brands.Google,{size:"S"}),e(l.Brands.Google,{size:"R"}),e(l.Brands.Google,{size:"L"}),e(l.Brands.Google,{size:"2L"}),e(l.Brands.Google,{size:"3L"})]})})]}),Facebook:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Facebook"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(l.Brands.Facebook,{size:"S"}),e(l.Brands.Facebook,{size:"R"}),e(l.Brands.Facebook,{size:"L"}),e(l.Brands.Facebook,{size:"2L"}),e(l.Brands.Facebook,{size:"3L"})]})})]}),Line:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"LINE"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(l.Brands.LINE,{size:"S"}),e(l.Brands.LINE,{size:"R"}),e(l.Brands.LINE,{size:"L"}),e(l.Brands.LINE,{size:"2L"}),e(l.Brands.LINE,{size:"3L"})]})})]}),Twitter:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Twitter"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(l.Brands.Twitter,{size:"S"}),e(l.Brands.Twitter,{size:"R"}),e(l.Brands.Twitter,{size:"L"}),e(l.Brands.Twitter,{size:"2L"}),e(l.Brands.Twitter,{size:"3L"})]})})]})},v={_:()=>t(u,{children:[e(v.Ripple,{}),e(v.Variables,{}),e(v.Tooltips,{}),e(v.Snackbar,{})]}),Ripple:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Ripple"}),t(h,{padding:2,children:[e(n.Description,{children:`<Element
|
|
64
64
|
ssEffectsOnActive={ 'ripple.( cloud | theme | nega | posi | warn )' }
|
|
65
65
|
/>`}),t(B.Center,{children:[e(r.Button.Prime.R,{ssEffectsOnActive:["ripple.white"],children:"White"}),e(r.Button.Border.R,{ssEffectsOnActive:["ripple.cloud"],children:"Cloud"}),e(r.Button.Border.R,{children:"Theme",ssEffectsOnActive:["ripple.theme"]})]})]})]}),Variables:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Effects"}),t(h,{padding:2,children:[e(n.Description,{children:`<Button
|
|
66
66
|
ssEffectsOnActive={ 'shrink' }
|
|
67
|
-
/>`}),e(B.Left,{children:e(r.Button.Prime.R,{onClick:()=>{w.fn.mini.active("testLoadingKey"),setTimeout(()=>{w.fn.stopALL()},5e3)},children:t(B.Center,{gap:0,children:[e(w.White.S,{loaderID:"testLoadingKey",marginRight:1}),e(o,{textAlign:"left",children:"Launch Mini Loader"})]})})}),t(B.Left,{children:[e(r.Button.Border.R,{children:"Shrink",ssEffectsOnActive:"shrink"}),e(r.Button.Border.R,{children:"Pudding",ssEffectsOnActive:"pudding"}),e(r.Button.Border.R,{children:"Expand",ssEffectsOnActive:"expand"}),e(r.Button.Border.R,{children:"corner Loader",onClick:()=>{w.fn.corner.active(),setTimeout(()=>{w.fn.corner.stop()},3e3)}})]})]})]}),Tooltips:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"ToolTips"}),e(g,{gridCols:5,gap:1,padding:2,children:Array.from({length:25}).map((a,
|
|
67
|
+
/>`}),e(B.Left,{children:e(r.Button.Prime.R,{onClick:()=>{w.fn.mini.active("testLoadingKey"),setTimeout(()=>{w.fn.stopALL()},5e3)},children:t(B.Center,{gap:0,children:[e(w.White.S,{loaderID:"testLoadingKey",marginRight:1}),e(o,{textAlign:"left",children:"Launch Mini Loader"})]})})}),t(B.Left,{children:[e(r.Button.Border.R,{children:"Shrink",ssEffectsOnActive:"shrink"}),e(r.Button.Border.R,{children:"Pudding",ssEffectsOnActive:"pudding"}),e(r.Button.Border.R,{children:"Expand",ssEffectsOnActive:"expand"}),e(r.Button.Border.R,{children:"corner Loader",onClick:()=>{w.fn.corner.active(),setTimeout(()=>{w.fn.corner.stop()},3e3)}})]})]})]}),Tooltips:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"ToolTips"}),e(g,{gridCols:5,gap:1,padding:2,children:Array.from({length:25}).map((a,d)=>e(r.Button.Border.R,{onMouseOver:s=>{let p=R.uuid.gen();z.open({tipsID:"tips-"+(d+1)+"---"+p,parent:s.currentTarget,gravityPoint:d+1,padding:0,content:e(z.Comps.Body,{children:d},d)})},children:d+1},d))})]}),Snackbar:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Snackbars"}),t(B.Center,{padding:2,children:[e(r.Button.Prime.R,{onClick:()=>{y.add({children:"hello World!!"})},children:"Add Normal Snackbar"}),e(r.Button.Prime.R,{onClick:()=>{y.add({secondsToClose:30,children:t(B.Separate,{verticalAlign:"baseline",paddingLeft:"2/3",children:["\u4E88\u7D04\u6642\u9593\u304C\u66F4\u65B0\u3055\u308C\u307E\u3057\u305F",e(r.Button.Clear.S,{color:"white",fontColor:"posi",children:"\u5143\u306B\u623B\u3059"})]})})},children:"Notices"}),e(r.Button.Prime.R,{onClick:()=>{let a=R.uuid.gen();y.add({snackID:a,children:t(h,{padding:1,children:[t(B.Left,{verticalAlign:"top",children:[e(f,{src:l.Images.defaultIcon("user"),ssSphere:4}),e(n.Description,{children:`Some Text
|
|
68
68
|
Some Text
|
|
69
|
-
Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:()=>{y.remove(a)},children:"\u9589\u3058\u308B"}),e(r.Anchor.Prime.S,{href:"",children:"\u8A73\u7D30"})]})]})})},children:"Message"})]})]})},F={_:()=>t(
|
|
69
|
+
Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:()=>{y.remove(a)},children:"\u9589\u3058\u308B"}),e(r.Anchor.Prime.S,{href:"",children:"\u8A73\u7D30"})]})]})})},children:"Message"})]})]})},F={_:()=>t(u,{children:[e(F.Types,{}),e(F.Tone,{}),e(F.Segmented,{})]}),Tone:()=>t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Tone"}),e(o,{padding:1,overflow:"auto",children:t(g,{gridCols:2,gap:2,children:[t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBPrime"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Prime.R,{color:"theme",children:"theme"}),e(r.Button.Prime.R,{color:"coffee",children:"posi"}),e(r.Button.Prime.R,{color:"ninja",children:"nega"}),e(r.Button.Prime.R,{color:"droplet",children:"warn"}),e(r.Button.Prime.R,{color:"googleBlue",children:"mono"}),e(r.Button.Prime.R,{color:"poizon",children:"pozion"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBSub"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Sub.R,{color:"theme",children:"theme"}),e(r.Button.Sub.R,{color:"posi",children:"posi"}),e(r.Button.Sub.R,{color:"nega",children:"nega"}),e(r.Button.Sub.R,{color:"warn",children:"warn"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]}),t(g,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.Sub.R,{color:"white",children:"white"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBClear"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Clear.R,{color:"theme",children:"theme"}),e(r.Button.Clear.R,{color:"posi",children:"posi"}),e(r.Button.Clear.R,{color:"nega",children:"nega"}),e(r.Button.Clear.R,{color:"warn",children:"warn"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]}),t(g,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.Clear.R,{color:"white",children:"white"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBFillToBorder"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.FillToBorder.R,{color:"theme",children:"theme"}),e(r.Button.FillToBorder.R,{color:"posi",children:"posi"}),e(r.Button.FillToBorder.R,{color:"nega",children:"nega"}),e(r.Button.FillToBorder.R,{color:"warn",children:"warn"})]}),t(g,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.FillToBorder.R,{color:"white",children:"white"}),e(r.Button.FillToBorder.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBBorderToFill"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.BorderToFill.R,{color:"theme",fontColor:"nega",children:e(o,{children:"theme"})}),e(r.Button.BorderToFill.R,{color:"posi",children:"posi"}),e(r.Button.BorderToFill.R,{color:"nega",children:"nega"}),e(r.Button.BorderToFill.R,{color:"warn",children:"warn"})]}),t(g,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.BorderToFill.R,{color:"white",children:"white"}),e(r.Button.BorderToFill.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBOthers"}),t(g,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Border.R,{children:"Border"}),e(r.Button.Normal.R,{children:"Normal"}),e(r.Button.Link,{children:"Link"}),e(r.Button.Plain,{children:"Plain"})]})]})]})})]}),Types:()=>t(c,{gap:2,flexChilds:"auto",children:[t(o,{ssCardBox:!0,children:[e(n.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBButton"}),e(o,{padding:1,overflow:"auto",children:e(S,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Button.Prime ... />"}),e(o,{children:e(r.Button.Prime.R,{children:"Button.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Button.Sub ... />"}),e(o,{children:e(r.Button.Sub.R,{children:"Button.Sub AAAA"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Button.Border ... />"}),e(o,{children:e(r.Button.Border.R,{children:"Button.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(n.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBLabel"}),e(o,{padding:1,overflow:"auto",children:e(S,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Label.Prime ... />"}),e(o,{children:e(r.Label.Prime.R,{children:"Label.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Label.Sub ... />"}),e(o,{children:e(r.Label.Sub.R,{children:"Label.Sub"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Label.Border ... />"}),e(o,{children:e(r.Label.Border.R,{children:"Label.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(n.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBAnchor"}),e(o,{padding:1,overflow:"auto",children:e(S,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Anchor.Prime ... />"}),e(o,{children:e(r.Anchor.Prime.R,{href:"",children:"Anchor.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Anchor.Sub ... />"}),e(o,{children:e(r.Anchor.Sub.R,{href:"",children:"Anchor.Sub"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Anchor.Border ... />"}),e(o,{children:e(r.Anchor.Border.R,{href:"",children:"Anchor.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(n.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBSizes"}),t(g,{gridCols:2,padding:1,gap:2,children:[e(o,{flexCenter:!0,children:e(r.Button.Prime.XS,{children:'size="XS"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.S,{children:'size="S"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.R,{children:'size="R"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.L,{children:'size="L"'})})]})]})]}),Segmented:()=>t(o,{ssCardBox:!0,children:[e(n.ThirdTitle,{padding:1,borderBottom:!0,children:"Segmented"}),t(c,{overflow:"auto",gap:2,padding:3,children:[e(i.Segmented.Auto,{tone:"cloud",value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud2,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud3,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Border,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(i.Segmented.Border2,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(i.Segmented.BottomLine,{value:1,options:[{value:0,label:"Takana"},{value:1,label:"Mentai"},{value:2,label:"Mayo"},{value:3,label:"Gyudon"}]})]})]})},Q=()=>{const a={Basic:()=>t(o,{ssCardBox:!0,children:[e(n.Paragraph,{padding:1,borderBottom:!0,children:"TextInput"}),t(o,{padding:1,children:[t(B.Separate,{marginBottom:2,children:[e(n.Description,{children:`<Input.Text
|
|
70
70
|
required
|
|
71
71
|
value={ 'hello React!!' }
|
|
72
72
|
/>`}),t(h,{gap:"1/2",children:[t(o,{children:["testInputLabel ",e(i.Comps.RequiredSign,{})]}),e(i.Text.Normal,{required:!0,value:"helloReact"})]})]}),t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Text.Email",e(i.Text.Email,{autoComplete:"off",name:"emailInput",value:"******@gmail.com"})]}),t(o,{children:["Input.Text.Number",e(i.Text.Number,{value:"324"})]}),t(o,{children:["Input.Text.Tel",e(i.Text.Tel,{value:"080-6995-2229"})]}),t(o,{children:["Input.Text.Money.JPY",e(i.Text.Money.JPY,{value:"3000"})]}),t(o,{children:["Input.Text.Url",e(i.Text.Url,{value:"http://google.com"})]}),t(o,{children:["Input.Text.Postal",t(B.Right,{children:[e(o,{flexSizing:0,children:e(i.Text.Postal,{override:"force"})}),e(r.Button.Border.R,{onClick:()=>I(void 0,null,function*(){}),children:"\u73FE\u5728\u5730\u3092\u53D6\u5F97"})]}),e(o,{id:"postalResult",padding:1,textAlign:"left"})]}),t(o,{children:["Input.Text.Password",e(i.Text.Password,{value:"onigiriUmai"})]}),t(o,{flexNewLine:!0,children:["Input.TextArea",e(i.TextArea,{value:`text1
|
|
73
73
|
text2
|
|
74
74
|
text3
|
|
75
75
|
text4
|
|
76
|
-
text5`,rows:5})]})]})]})]})
|
|
76
|
+
text5`,rows:5})]})]})]})]}),Time:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(n.Paragraph,{padding:1,borderBottom:!0,children:"Time Input"}),e(o,{padding:1,children:t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Time.Clock",e(i.Time.Clock,{})]}),t(o,{children:["Input.Time.Date",e(i.Time.Date,{})]}),t(o,{children:["Input.Time.Week",e(i.Time.Week,{})]}),t(o,{children:["Input.Time.Month",e(i.Time.Month,{})]}),t(o,{children:["Input.Time.Year",e(i.Time.Year,{})]}),t(o,{children:["Input.Time.Periods.Date",e(i.Time.Periods.Date,{})]}),t(o,{children:["Input.Time.Periods.Month",e(i.Time.Periods.Month,{})]}),t(o,{children:["Input.Time.DateWareki",e(i.Time.DateWareki,{})]}),t(o,{children:["Input.Time.picker",e(i.Select,{id:"timePicker",options:[{value:"clock",label:"clock"},{value:"date",label:"date"},{value:"week",label:"week"},{value:"month",label:"month"},{value:"year",label:"year"},{value:"dates",label:"dates"},{value:"months",label:"months"},{value:"dateWareki",label:"dateWareki"}],onUpdateValidValue:({value:d})=>{i.Time.fn.picker.launch({parent:"#timePicker",restrict:d,defaultValue:"",onValueUpdate:s=>{console.log(s)}})}})]})]})})]})}),List:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(n.Paragraph,{padding:1,borderBottom:!0,children:"Radio & Checkbox Input"}),e(o,{padding:1,children:t(h,{children:[t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Radio",e(i.Radio,{value:[1],options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"},{value:5,label:"option5"}]})]}),t(o,{children:["Input.Checkbox",e(i.Checkbox,{value:[2,"3"],options:[{value:"1",label:"option1"},{value:"2",label:"option2"},{value:"3",label:"option3"}]})]})]}),t(h,{children:[e(n.Paragraph,{children:"Tones"}),t(c,{gap:2,flexChilds:"auto",children:[e(i.Radio,{tone:"plain",value:[1],gap:1,options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"normal",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"cloud",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"border",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"vivid",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]})]})]})]})})]})}),Select:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(n.Paragraph,{padding:1,borderBottom:!0,children:"Select,Search,Chips Input"}),e(o,{padding:1,children:e(h,{children:t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Select",e(i.Select,{required:!0,value:3,options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3a"},{value:4,label:"option4"}]})]}),t(o,{children:["Input.Search",e(i.Search,{required:!0,defaultOptions:[{value:1,label:"1"},{value:{value1:2,value2:3},label:"Object"},{value:3,label:"3"},{value:101,label:"101"},{value:102,label:"102"}],onDynamicSearch:(...d)=>I(void 0,null,function*(){let s=[];for(let p=0;p<100;p++)s.push({value:p,label:String(p)});return{options:s}})})]}),t(o,{flexNewLine:!0,children:["Input.Chips",e(i.Chips,{limit:5,value:[{value:"option3",label:"option3"}],onUpdateValidValue:({value:d})=>{console.log(d)},defaultOptions:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"}]})]})]})})})]})}),Variables:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(n.Paragraph,{padding:1,borderBottom:!0,children:"Variables"}),e(o,{padding:1,children:e(h,{children:t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.File",e(i.Filer,{limit:3})]}),t(o,{children:["Input.Switch",t(c,{gap:2,children:[e(i.Switch,{}),e(i.Switch,{appearance:"applely",color:"icicles",value:!0}),e(i.Switch,{appearance:"applely",icon:e(x.Check,{}),color:"warn",value:!0})]})]}),t(o,{flexNewLine:!0,children:["Input.Slider",e(i.Slider,{color:"battery",name:"sliderInput",value:40,step:10,min:0,max:100})]})]})})})]})})};return e(u,{children:e(_,{size:"L",children:t(g,{gap:2,gridCols:2,children:[e(a.Basic,{}),e(a.Select,{}),e(a.Time,{}),e(a.List,{}),e(a.Variables,{})]})})})},Z=()=>{const a=d=>{let s="testModal2";G.open({type:d,sheetID:s,size:"S",padding:2,content:t(G.Comps.Body,{padding:1,children:[e(o,{padding:2,children:"Content"}),e(B.Right,{children:e(r.Button.Prime.R,{onClick:()=>{G.close(s)},children:"\u9589\u3058\u308B"})})]})})};return t(u,{children:[t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"CardBox"}),e(o,{padding:1,overflow:"auto",children:e(n.Description,{children:`<Box ssCardBox>
|
|
77
77
|
<Box>
|
|
78
78
|
Header
|
|
79
79
|
</Box>
|
|
@@ -91,9 +91,9 @@ Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:
|
|
|
91
91
|
content: RightSideReactComponent
|
|
92
92
|
}
|
|
93
93
|
] }
|
|
94
|
-
/>`})}),e(o,{padding:2,overflow:"auto",children:e(S,{border:!0,rowStyles:{padding:1,borderBottom:!0},rows:[{children:t(
|
|
94
|
+
/>`})}),e(o,{padding:2,overflow:"auto",children:e(S,{border:!0,rowStyles:{padding:1,borderBottom:!0},rows:[{children:t(u,{children:[e(o,{children:"Title1"}),e(o,{children:e(o,{children:"Content1"})})]}),horizontalAlign:"between"},{children:t(u,{children:[e(o,{flexGrid:1,children:"Title2"}),e(o,{flexGrid:2,children:e(o,{children:"Content2"})})]})},{children:t(u,{children:[e(o,{children:"Title3"}),e(o,{children:e(o,{children:"Content3"})})]}),flexType:"col"},{children:e(u,{children:e(o,{children:e(o,{children:"Content4"})})}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(n.SubTitle,{padding:1,borderBottom:!0,children:"Sheet"}),e(o,{padding:1,overflow:"auto",children:e(n.Description,{children:`Sheet.open( {
|
|
95
95
|
sheetID: 'sheetID',
|
|
96
96
|
header: ReactElement | React.FC< { modalClose } >,
|
|
97
97
|
body: ReactElement | React.FC< { modalClose } >,
|
|
98
98
|
footer: ReactElement | React.FC< { modalClose } >
|
|
99
|
-
} );`})}),t(h,{padding:2,children:[e(o,{flexCenter:!0,children:t(g,{gridCols:3,gap:1,children:[e(r.Button.Border.R,{onClick:()=>{a("normal.topLeft")},children:"Top Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.topCenter")},children:"Top Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.topRight")},children:"Top Right"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleLeft")},children:"Middle Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleCenter")},children:"Middle Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleRight")},children:"Middle Right"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomLeft")},children:"Bottom Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomCenter")},children:"Bottom Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomRight")},children:"Bottom Right"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.left")},children:"Drawer Left"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.bottom")},children:"Drawer Bottom"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.right")},children:"Drawer Right"}),e(r.Button.Border.R,{onClick:
|
|
99
|
+
} );`})}),t(h,{padding:2,children:[e(o,{flexCenter:!0,children:t(g,{gridCols:3,gap:1,children:[e(r.Button.Border.R,{onClick:()=>{a("normal.topLeft")},children:"Top Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.topCenter")},children:"Top Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.topRight")},children:"Top Right"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleLeft")},children:"Middle Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleCenter")},children:"Middle Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.middleRight")},children:"Middle Right"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomLeft")},children:"Bottom Left"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomCenter")},children:"Bottom Center"}),e(r.Button.Border.R,{onClick:()=>{a("normal.bottomRight")},children:"Bottom Right"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.left")},children:"Drawer Left"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.bottom")},children:"Drawer Bottom"}),e(r.Button.Border.R,{onClick:()=>{a("drawer.right")},children:"Drawer Right"}),e(r.Button.Border.R,{onClick:d=>{z.open({tipsID:"test40",content:e(o,{padding:1,border:!0,borderRadius:2,backgroundColor:"dark",fontColor:"white",children:"Content"}),parent:d.target})},children:"Open Tooltips"})]})}),t(B.Center,{children:["Image Picker",e(f,{src:l.Images.defaultIcon("user"),unitWidth:6,unitHeight:6,showExpand:!0})]})]})]})]})},k={_:()=>e(u,{children:t(h,{children:[e(k.Normal,{}),e(k.Data,{}),e(k.Drag,{}),e(k.Spread,{})]})}),Normal:()=>{let a=[];for(var d=0;d<10;d++){let s=[{children:"head_"+d},{children:"data_"+d},{children:"data_"+d}];a.push(s)}return t(u,{children:[e(o,{fontSize:"5.subTitle",children:"Table.Normal"}),e(m.Normal,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],rows:a,ssCardBox:!0,onRowClick:s=>{console.log(s)}})]})},Drag:()=>{let a=[];for(var d=0;d<4;d++){let s=[{children:"head_"+d},{children:"data_"+d},{children:"data_"+d}];s.rowID="rowID-"+d,a.push(s)}return t(u,{children:[e(o,{fontSize:"5.subTitle",children:"Table.Drag"}),e(m.Drag,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],rows:a,ssCardBox:!0,onOrderChanged:s=>{console.log(s)}})]})},Data:()=>{let a=[];for(var d=0;d<100;d++){let p=Math.round(Math.random()*50+1),L=Math.round(Math.random()*50+1),P=Math.round(Math.random()*50+1),b="name_"+p,W="data_"+L,E="data_"+P,N=[{type:"th",children:d+":"+b,data:b,orderIndex:d},{type:"td",children:W,data:W},{type:"td",children:E,data:E}];a.push(N)}a[1].checked=!0,a[4].checked=!0,a[10].checked=!0;let s="testDataTable";return t(u,{children:[t(c,{horizontalAlign:"between",children:[e(o,{fontSize:"5.subTitle",children:"Table.Data"}),t(c,{gap:"1/2",backgroundColor:"theme",borderRadius:"1.tone.primary",overflow:"hidden",fontColor:"white",children:[e(r.Button.Clear.R,{color:"white",children:"SubmitButton"}),e(o,{flexSizing:"none",unitWidth:"1/4",backgroundColor:"layer.4.opa.middle",isRounded:!0,margin:["2/3",0]}),e(r.Button.Clear.R,{padding:[0,1],color:"white",onClick:p=>{z.open({tipsID:R.uuid.gen(),parent:p.target,gravityPoint:24,close_option:{aroundClick:!0,parentBlur:!1},content:e(u,{children:t(h,{gap:0,padding:["2/3",0],backgroundColor:"layer.1",borderRadius:2,boxShadow:"0.normal",overflow:"hidden",children:[e(r.Button.Clear.S,{borderRadius:0,borderBottom:"1.thin",children:"\u3059\u3079\u3066\u3092\u51FA\u529B"}),e(r.Button.Clear.S,{borderRadius:0,borderBottom:"1.thin",children:"\u3053\u306E\u30DA\u30FC\u30B8\u306E\u307F\u51FA\u529B"}),e(r.Button.Clear.S,{borderRadius:0,children:"\u30C1\u30A7\u30C3\u30AF\u3057\u305F\u884C\u306E\u307F\u51FA\u529B"})]})})})},children:e(x.EllipsisV,{})})]})]}),t(B.Separate,{verticalAlign:"bottom",children:[t(B.Left,{verticalAlign:"bottom",children:[e(m.Data.SearchInput,{tableID:s}),e(m.Data.Info,{tableID:s})]}),t(B.Right,{verticalAlign:"unset",children:[e(m.Data.RowLength,{tableID:s,lengthSelect:[30,50,100]}),e(m.Data.Paging,{tableID:s})]})]}),e(m.Data,{tableID:s,colLength:3,head:[{data:"head1"},{data:"head2"},{data:"head3"}],rows:a,pageRowLength:30,ssCardBox:!0,filter:[!0],checker:!0})]})},Spread:()=>e(u,{children:e(o,{fontSize:"5.subTitle",children:"Table.Spread"})})},ee=()=>{let[a,d]=D(""),[s,p]=D(""),[L,P]=D("");return e(u,{children:t(o,{children:[t(r.Button.Prime.R,{onClick:()=>{$.open({use:"square",develops:[{size:"S"},{size:"R"},{size:"L"}],onProcessFinished:b=>I(void 0,null,function*(){d(yield b[0].toDataUrl()),p(yield b[1].toDataUrl()),P(yield b[2].toDataUrl())})})},children:[e(x.Image,{})," \u30A4\u30E1\u30FC\u30B8\u3092\u9078\u629E"]}),t(c,{verticalAlign:"top",gap:1,children:[a&&e(f,{isRounded:!0,src:a,alt:"",showExpand:!0,freeCSS:{maxWidth:12*12}}),s&&e(f,{style:{maxWidth:24*12},src:s,alt:"",showExpand:!0}),L&&e(f,{style:{maxWidth:24*12},src:L,alt:"",showExpand:!0}),e(K,{border:!0,borderWidth:3,margin:[3,"auto"],freeCSS:{width:12*10},slideIndex:1,options:{loop:!0,onSlideCallback:b=>{}},slides:[e(o,{backgroundColor:"nega",padding:3,flexCenter:!0,children:"test1"}),e(o,{backgroundColor:"posi",padding:3,flexCenter:!0,children:"test2"}),e(o,{backgroundColor:"warn",padding:3,flexCenter:!0,children:"test3"}),e(o,{backgroundColor:"theme",padding:3,flexCenter:!0,children:"test4"})]})]})]})})},H=()=>{let[a,d]=D(Number(R.queryParams.get().ti)||0);return V(()=>{R.queryParams.set({ti:String(a)})},[a]),e(u,{children:t(h,{gap:0,minHeight:"contentHeight",backgroundColor:"layer.1",children:[e(j,{borderBottom:!0,position:"sticky",backgroundColor:"layer.1",top:"topBase",tabIndex:a,tabs:["Profiles","Basic","Buttons","Inputs","Styling","Effection","Tables","Croppie","PlayGround","Logo"],onTabChange:s=>{localStorage.setItem("designTabHeader",String(s)),d(s)},UnderBreakPointStyles:{position:"static",top:0}}),e(o,{flexSizing:0,position:"relative",freeCSS:{zIndex:1},children:e(J,{viewIndex:a,views:[e(O._,{}),e(T._,{}),e(F._,{}),e(Q,{}),e(Z,{}),e(v._,{}),e(k._,{}),e(ee,{}),e(C._,{})],wrapper:s=>e(X.FadeIn,{animationTime:200,children:e(_,{children:e(c,{gap:2,padding:2,flexWrap:!0,flexChilds:"auto",children:s})})},a)})})]})})};export{H as DesignBook,H as default};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "amotify",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"description": "UI FW for React",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"clean": "rimraf dist",
|
|
@@ -33,24 +33,21 @@
|
|
|
33
33
|
"@fortawesome/free-regular-svg-icons": "^6.5.2",
|
|
34
34
|
"@fortawesome/free-solid-svg-icons": "^6.5.1",
|
|
35
35
|
"@fortawesome/react-fontawesome": "^0.2.0",
|
|
36
|
-
"@mingoo/jsmin": "^0.0.
|
|
36
|
+
"@mingoo/jsmin": "^0.0.35",
|
|
37
37
|
"@types/express": "^4.17.21",
|
|
38
|
-
"@types/react": "^18.3.
|
|
38
|
+
"@types/react": "^18.3.3",
|
|
39
39
|
"esbuild": "^0.20.2",
|
|
40
40
|
"esbuild-sass-plugin": "^3.2.0",
|
|
41
41
|
"nodemon": "^3.1.0",
|
|
42
42
|
"npm-run-all": "^4.1.5",
|
|
43
43
|
"postcss-modules": "^6.0.0",
|
|
44
44
|
"prop-types": "^15.8.1",
|
|
45
|
-
"react": "^
|
|
45
|
+
"react": "^18.3.1",
|
|
46
46
|
"ts-loader": "^9.5.1",
|
|
47
47
|
"ts-node": "^10.9.2",
|
|
48
48
|
"tsc-alias": "^1.8.8",
|
|
49
49
|
"typescript": "^5.4.5"
|
|
50
50
|
},
|
|
51
|
-
"peerDependencies": {
|
|
52
|
-
"react": "^17.0.0 || ^18.0.0"
|
|
53
|
-
},
|
|
54
51
|
"main": "./dist",
|
|
55
52
|
"types": "./dist",
|
|
56
53
|
"exports": {
|