amotify 0.2.7 → 0.2.9
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as t,c as o,d as
|
|
1
|
+
import{b as t,c as o,d as O}from"../../chunk-C5N2D3ZX.js";import{jsx as l}from"react/jsx-runtime";import{useState as R}from"react";import p from"@mingoo/jsmin";import W from"../../atoms/Box";import K from"../../atoms/FAI";import q from"../../mols/Column";import M from"../Button";import P from"../Tooltips";import{Wrapper as $,BoxWrapper as j,CommonEffects as z,DefaultStyles as G}from"./core";import Q from"./Parts";import{InputRichSelectClasses as X,InputClasses as Y}from"../../@styles/componentClasses";function Z(e){let{value:a,states:u}=e,{required:n,options:i}=u,s=[];return n&&(!i.length||i.length&&p.is.nullish(JSON.parse(a)))&&s.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!s.filter(({type:d})=>d=="invalid").length,notice:s}}const ee=e=>{let E=e,{tone:a,required:u,form:n,className:i,enableFormSubmit:s,enableUnSelected:d,checkValidationAtFirst:b,onChange:I,onKeyDown:V,onValidate:C,onUpdateValue:m,onUpdateValidValue:h,value:y="",options:D,placeholder:k,leftIndicator:ae,rightIndicator:le,leftIcon:ne,rightIcon:oe,componentID:ie,status_id:re,cellStyles:A,sheetStyles:f,gravityPoint:F}=E,L=O(E,["tone","required","form","className","enableFormSubmit","enableUnSelected","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","options","placeholder","leftIndicator","rightIndicator","leftIcon","rightIcon","componentID","status_id","cellStyles","sheetStyles","gravityPoint"]),w={componentID:e.componentID||"",dataValue:y,eventType:"init",eventID:p.uuid.gen()},[x]=R(p.uuid.gen()),[r,S]=R(w),[v,H]=R({ok:!1,notice:[]});z({type:"richSelect",states:e,val_status:r,set_status:S,ExtraOverrideStates:{dataValue:y,formatValue:y},val_validate:v,set_validate:H,DefaultValidation:Z,onUpdateValue:m,onUpdateValidValue:h});let T=l(W,{fontColor:"4.thin",textAlign:"left",children:k||"\u9078\u629E"});if(r.dataValue){let c=D.find(g=>g.type=="button"&&g.value==r.dataValue);c&&(T=c.selectedLabel||c.label)}return l(j,{val_status:r,set_status:S,val_validate:v,states:e,children:l("button",o(t({},L),{"data-form":n,"data-validation":v.ok,"data-component-id":r.componentID,"data-value":r.dataValue,"data-input-type":"richSelect",className:[i,X("SelectLegend"),Y("InputCover")].join(" "),onClick:c=>{P.open({tipsID:x,parent:c.currentTarget,gravityPoint:F||13,close_option:{parentBlur:!1},content:()=>{let g=D.map(J=>{let{type:U,value:B,label:_}=J;return U=="button"?l(M.Button.Clear.R,o(t({color:"cloud",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:0,onClick:()=>{S(o(t({},r),{dataValue:B,eventType:"update",eventID:p.uuid.gen()})),P.close(x)}},A),{children:_}),String(B)):_});return l(q,o(t({ssCardBox:!0,padding:[1,0],gap:0,overflow:"auto"},f),{freeCSS:t({minWidth:12*20,maxHeight:"90vh"},f==null?void 0:f.freeCSS),children:g}))}})},children:T}))})},te=e=>{let{value:a=null,placeholder:u,options:n=[]}=e,i=0,s=JSON.stringify(a),d=n.map(I=>{let{type:V,value:C}=I,m=JSON.stringify(C),h=m==s;return i|=Number(h),o(t({},I),{type:V||"button",value:m})});i||(a=null);let b=JSON.stringify(a);return l(ee,o(t({},e),{value:b,options:d}))},N=e=>{var u,n;e=t({},e),p.is.nullish(e.rightIcon)&&(e.rightIcon=l(Q.RightIcon,o(t({flexType:"col"},e.rightIconStyles),{children:l(K.AngleDown,{})}))),e.rightIcon&&(e.paddingRight=(u=e.paddingRight)!=null?u:3),e.leftIcon&&(e.paddingLeft=(n=e.paddingLeft)!=null?n:3);let a=G.Boxish(e);return delete a.rightIconStyles,l($,{componentID:e.componentID,children:te,states:a})};export{N as RichSelect,N as default};
|
package/dist/fn/Input/core.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{b as o,c as n,e as
|
|
1
|
+
import{b as o,c as n,e as x}from"../../chunk-C5N2D3ZX.js";import{jsx as v,jsxs as V}from"react/jsx-runtime";import{useState as E,useEffect as k}from"react";import s from"@mingoo/jsmin";import{$$fromRoot as w,Config as F,useStore as y,GenerateClassName as D}from"../../@utils";import{InputClasses as _}from"../../@styles/componentClasses";import B from"../../atoms/Box";import P from"../../atoms/Flex";import R from"../../atoms/FAI";import N from"../../mols/Row";import z from"../../mols/Column";import L from"../Button";import T from"../Tooltips";const ie=e=>{let[t]=E(e.componentID||s.uuid.gen());e=o({},e),e.states=n(o({enableFormSubmit:!0,status_id:s.uuid.gen(),override:"never",name:s.uuid.gen(),id:s.uuid.gen(),"aria-label":"Input-"+t},e.states),{componentID:t});let{children:a}=e;return v(a,o({},e.states))},se=e=>{let{children:t,val_status:a,set_status:r,val_validate:u,states:l}=e,{clearButton:i,rightIcon:d,leftIcon:p,wrapStyles:m}=l;return a.eventType=="init"&&!l.checkValidationAtFirst&&(u.notice=[]),V(N.Center,n(o({position:"relative",verticalAlign:"unset",gap:0},m),{className:_("Wrapper"),"data-notice-uid":a.componentID,children:[v(O,{notice:u.notice,val_status:a}),l.leftIndicator,V(P,{position:"relative",flexSizing:"auto",children:[p,t,i&&a.dataValue?v(L.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:s.uuid.gen()}))},children:v(R.Times,{})}):d]}),l.rightIndicator]}))},O=e=>{let{notice:t,val_status:a}=e,{componentID:r}=a,u="NoticeTimer-"+r,l="NoticeTimerClose-"+r,i="notice-tips-"+r;return s.interval.clear(u),s.interval.clear(l),t.length?(s.interval.standBy(u,350,()=>{T.open({tipsID:i,parent:`[data-notice-uid="${r}"]`,gravityPoint:22,padding:[1,0],close_option:{parentBlur:!1},content:V(T.Comps.Body,{padding:["1/2","2/3"],fontSize:"1.mini",position:"relative",children:[v(B,{position:"absolute",unitHeight:1,unitWidth:1,left:1,backgroundColor:"dark",freeCSS:{zIndex:1,transform:"rotate(45deg)",top:-6}}),v(z,{gap:"1/3",position:"relative",freeCSS:{zIndex:2},backgroundColor:"inherit",children:t.map((d,p)=>{let{type:m,label:h}=d,I=m=="invalid"?R.Times:m=="warn"?R.Exclamation:R.Check;return V(N.Left,{gap:0,borderRadius:"2.tone.secondary",children:[v(I,{flexCenter:!0,fontSize:"3.paragraph",fontColor:{invalid:"nega",warn:"warn",valid:"posi"}[m]}),v(B,{fontColor:"white",children:h})]},p)})})]})})}),s.interval.standBy(l,6e3,()=>{T.close(i)}),null):(T.close(i),null)},ue=e=>{let{type:t,states:a,val_status:r,set_status:u,ExtraOverrideStates:l,ExtraStoreStates:i,val_validate:d,set_validate:p,DefaultValidation:m,onUpdateValue:h,onUpdateValidValue:I}=e;a=o({},a);let{componentID:b}=r;k(()=>(y.update({[b]:o({ResolveRefresh:null,Refresh:()=>new Promise((c,f)=>{y.get(b).ResolveRefresh=c,u(n(o({},r),{eventType:"refresh",eventID:s.uuid.gen()}))}),GenNotice:c=>{let{ok:f,notice:S}=c;p({ok:f,notice:S})}},i)}),()=>{y.delete(b)}),[]),k(()=>{a.value=r.dataValue,s.interval.clear("ValidationTimer-"+b),A({val_status:r,set_validate:p,DefaultValidation:m,states:a})},[r.eventID]),(()=>{let{override:c}=a;if(c=="never"||c=="beforeModified"&&!["init","override"].includes(r.eventType))return;let f=y.get(r.componentID);f&&(a.value!=r.dataValue&&a.status_id!=f.status_id&&u(n(o(n(o({},r),{dataValue:a.value}),l),{eventType:"override",eventID:s.uuid.gen()})),f.status_id=a.status_id)})(),k(()=>{let{componentID:c,eventType:f,dataValue:S}=r,g=S;if(t=="list"?g=S.map(C=>JSON.parse(C)):t=="select"||t=="richSelect"?g=JSON.parse(S):t=="file"&&y.update({[c]:{Files:r.dataValue}}),f=="refresh"){let C=y.get(c);C&&C.ResolveRefresh&&C.ResolveRefresh(null)}f=="update"&&(h&&h({componentID:c,value:g,storeData:y.get(c),eventType:f}),s.scope(()=>{d.ok&&I&&I({componentID:c,value:g,storeData:y.get(c),eventType:f})}))},[d])},A=e=>{let{val_status:t,states:a,set_validate:r,DefaultValidation:u}=e,l=u({value:t.dataValue,states:a});if(!l.ok){r(l);return}let i=l.notice;const d=()=>x(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:[...i,...p.notice]});return}r({ok:!0,notice:[...i,...p.notice]})});a.onValidate?t.eventType=="refresh"?d():s.interval.standBy("ValidationTimer-"+t.componentID,450,d):r({ok:!0,notice:i})},de=e=>{let t=e.target,{form:a,formName:r}=t.dataset;a=r||a;let u=!1,l=w(`[data-form-submit-button="${a}"]`)[0];if(!l)return u;let i=l.dataset.sdfike||"",d=e.key,p=e.ctrlKey||e.metaKey;return s.scope(()=>{i.includes("enter")&&(d!="Enter"||e.nativeEvent.isComposing||F.get().browserIs=="safari"&&e.keyCode==229)||((d=="Enter"&&(i.includes("enter")||i.includes("auxEnter")&&p)||d==" "&&i.includes("space"))&&(l.click(),e.preventDefault()),u=!0)}),u},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)))),D(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:[_("Input"),e.className].join(" ")});return D(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{se as BoxWrapper,ue as CommonEffects,K as DefaultStyles,de as SubmitForm,A as ValidationCheck,ie as Wrapper};
|
package/dist/temps/designBook.js
CHANGED
|
@@ -70,10 +70,10 @@ Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:
|
|
|
70
70
|
required
|
|
71
71
|
value={ 'hello React!!' }
|
|
72
72
|
/>`}),t(h,{gap:"1/2",children:[t(o,{children:["testInputLabel ",e(d.Comps.RequiredSign,{})]}),e(d.Text.Normal,{required:!0,value:"helloReact"})]})]}),t(c,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Text.Email",e(d.Text.Email,{autoComplete:"off",name:"emailInput",value:"******@gmail.com"})]}),t(o,{children:["Input.Text.Number",e(d.Text.Number,{value:"324"})]}),t(o,{children:["Input.Text.Tel",e(d.Text.Tel,{value:"080-6995-2229"})]}),t(o,{children:["Input.Text.Money.JPY",e(d.Text.Money.JPY,{value:"3000"})]}),t(o,{children:["Input.Text.Url",e(d.Text.Url,{value:"http://google.com"})]}),t(o,{children:["Input.Text.Postal",t(B.Right,{children:[e(o,{flexSizing:0,children:e(d.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(d.Text.Password,{value:"onigiriUmai"})]}),t(o,{flexNewLine:!0,children:["Input.TextArea",e(d.TextArea,{value:`text1
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
73
|
+
text2
|
|
74
|
+
text3
|
|
75
|
+
text4
|
|
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(d.Time.Clock,{})]}),t(o,{children:["Input.Time.Date",e(d.Time.Date,{})]}),t(o,{children:["Input.Time.Week",e(d.Time.Week,{})]}),t(o,{children:["Input.Time.Month",e(d.Time.Month,{})]}),t(o,{children:["Input.Time.Year",e(d.Time.Year,{})]}),t(o,{children:["Input.Time.Periods.Date",e(d.Time.Periods.Date,{})]}),t(o,{children:["Input.Time.Periods.Month",e(d.Time.Periods.Month,{})]}),t(o,{children:["Input.Time.DateWareki",e(d.Time.DateWareki,{})]}),t(o,{children:["Input.Time.picker",e(d.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:i})=>{d.Time.fn.picker.launch({parent:"#timePicker",restrict:i,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(d.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(d.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(d.Radio,{tone:"plain",value:[1],gap:1,options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"normal",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"cloud",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"border",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.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(d.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(d.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:(...i)=>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(d.Chips,{limit:5,value:[{value:"option3",label:"option3"}],onUpdateValidValue:({value:i})=>{console.log(i)},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(d.Filer,{limit:3})]}),t(o,{children:["Input.Switch",t(c,{gap:2,children:[e(d.Switch,{}),e(d.Switch,{appearance:"applely",color:"icicles",value:!0}),e(d.Switch,{appearance:"applely",icon:e(x.Check,{}),color:"warn",value:!0})]})]}),t(o,{flexNewLine:!0,children:["Input.Slider",e(d.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=i=>{let s="testModal2";T.open({type:i,sheetID:s,size:"S",padding:2,content:t(T.Comps.Body,{padding:1,children:[e(o,{padding:2,children:"Content"}),e(B.Right,{children:e(r.Button.Prime.R,{onClick:()=>{T.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>
|
|
@@ -96,4 +96,4 @@ Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:
|
|
|
96
96
|
header: ReactElement | React.FC< { modalClose } >,
|
|
97
97
|
body: ReactElement | React.FC< { modalClose } >,
|
|
98
98
|
footer: ReactElement | React.FC< { modalClose } >
|
|
99
|
-
} )
|
|
99
|
+
} )`})}),t(h,{padding:2,children:[e(r.Button.Border.R,{onClick:i=>{v.open({tipsID:"testTips",parent:i.currentTarget,close_option:{parentBlur:!1,aroundClick:!1,escapeKeyDown:!0},content:()=>e(T.Comps.Body,{padding:2,children:e(r.Button.Prime.R,{onClick:()=>{T.open({sheetID:"testSheet",close_option:{aroundClick:!0},type:"normal.middleLeft",content:()=>e(T.Comps.Body,{padding:2,children:"END"})})},children:"nest"})})})},children:"Tooltips with nested sheet"}),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:i=>{v.open({tipsID:"test40",content:e(o,{padding:1,border:!0,borderRadius:2,backgroundColor:"dark",fontColor:"white",children:"Content"}),parent:i.target})},children:"Open Tooltips"})]})}),t(B.Center,{children:["Image Picker",e(f,{src:l.Images.defaultIcon("user"),unitWidth:6,unitHeight:6,showExpand:!0})]})]})]})]})},D={_:()=>e(u,{children:t(h,{children:[e(D.Normal,{}),e(D.Data,{}),e(D.Drag,{}),e(D.Spread,{})]})}),Normal:()=>{let a=[];for(var i=0;i<10;i++){let s=[{children:"head_"+i},{children:"data_"+i},{children:"data_"+i}];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 i=0;i<4;i++){let s=[{children:"head_"+i},{children:"data_"+i},{children:"data_"+i}];s.rowID="rowID-"+i,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 i=0;i<100;i++){let p=Math.round(Math.random()*50+1),y=Math.round(Math.random()*50+1),A=Math.round(Math.random()*50+1),b="name_"+p,W="data_"+y,E="data_"+A,H=[{type:"th",children:i+":"+b,data:b,orderIndex:i},{type:"td",children:W,data:W},{type:"td",children:E,data:E}];a.push(H)}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=>{v.open({tipsID:S.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,i]=z(""),[s,p]=z(""),[y,A]=z("");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*(){i(yield b[0].toDataUrl()),p(yield b[1].toDataUrl()),A(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}),y&&e(f,{style:{maxWidth:24*12},src:y,alt:"",showExpand:!0}),e(J,{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"})]})]})]})})};let N=()=>{let[a,i]=z(Number(S.queryParams.get().ti)||0);return V(()=>{S.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)),i(s)},UnderBreakPointStyles:{position:"static",top:0}}),e(o,{flexSizing:0,position:"relative",freeCSS:{zIndex:1},children:e(K,{viewIndex:a,views:[e(O._,{}),e(R._,{}),e(P._,{}),e(Q,{}),e(Z,{}),e(L._,{}),e(D._,{}),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{N as DesignBook,N as default};
|