@blocklet/pages-kit-inner-components 0.0.19 → 0.1.0
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/lib/cjs/setting.js +3 -3
- package/lib/es/setting.js +2 -4
- package/package.json +2 -2
package/lib/cjs/setting.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var Ie=Object.create;var pe=Object.defineProperty;var ke=Object.getOwnPropertyDescriptor;var Be=Object.getOwnPropertyNames;var Ce=Object.getPrototypeOf,we=Object.prototype.hasOwnProperty;var Te=(t,s,n
|
|
1
|
+
"use strict";var Ie=Object.create;var pe=Object.defineProperty;var ke=Object.getOwnPropertyDescriptor;var Be=Object.getOwnPropertyNames;var Ce=Object.getPrototypeOf,we=Object.prototype.hasOwnProperty;var Te=(t,s,l,n)=>{if(s&&typeof s=="object"||typeof s=="function")for(let c of Be(s))!we.call(t,c)&&c!==l&&pe(t,c,{get:()=>s[c],enumerable:!(n=ke(s,c))||n.enumerable});return t};var Pe=(t,s,l)=>(l=t!=null?Ie(Ce(t)):{},Te(s||!t||!t.__esModule?pe(l,"default",{value:t,enumerable:!0}):l,t));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),B=require("../state-C6F-M3XT.js"),r=require("@mui/material"),I=require("react"),De=require("@arcblock/ux/lib/Empty"),R=require("@arcblock/ux/lib/Locale/context"),Re=require("@arcblock/ux/lib/Theme"),Fe=require("@emotion/css"),Z=require("ahooks"),ze=require("gradient-parser");require("lodash/without");const Ae=require("tinycolor2"),w=require("@mui/material/colors"),F=require("./uploader.js"),Oe=require("@iconify-icon/react"),je=require("react-use"),T=require("lodash"),_e=require("@arcblock/ux/lib/Toast"),he=require("@blocklet/code-editor"),Q=require("@blocklet/pages-kit/components"),te=require("@mui/base"),z=require("@mui/icons-material"),N=require("@syncedstore/core"),qe=require("lodash/has"),Ee=require("lodash/keyBy"),D=require("material-ui-popup-state/hooks"),Ne=require("react-error-boundary"),Ve=require("lodash/sortBy"),ee=require("react-dnd"),E=t=>t&&t.__esModule?t:{default:t},We=E(De),xe=E(ze),Ue=E(Ae),Me=E(_e),Ke=E(qe),He=E(Ee),Ye=E(Ve);w.red[300],w.pink[300],w.purple[300],w.indigo[300],w.blue[300],w.cyan[300],w.teal[300],w.green[300],w.lime[300],w.yellow[300],w.amber[300],w.orange[300],w.brown[300],w.grey[300],w.blueGrey[300];const Le=I.forwardRef(function({showMarkdown:s,markdown:l,onMarkdownChange:n,showUploader:c,value:b,meta:x,onChange:p,...f},u){const[j,m]=I.useState("");I.useEffect(()=>{m(b||"")},[b,m]);const h=async()=>{if(j!==b){const i=B.getImageAbsoluteUrl(j);if(!i){p(j,void 0);return}const o=await F.getImageSize(i).catch(()=>F.getVideoSize(i)).catch(()=>{});p(j,{...o,filename:j})}};je.useDebounce(()=>{j!==b&&p(j)},300,[j]),I.useImperativeHandle(u,()=>({submit:h}));const a={};return c&&(a.InputProps={sx:{pr:0},endAdornment:e.jsx(r.InputAdornment,{position:"end",sx:{mx:.5},children:e.jsx(F.UploaderButton,{onChange:async({response:i})=>{var g;const o=(g=i==null?void 0:i.data)==null?void 0:g.filename,d=B.getImageAbsoluteUrl(o)||"";let v={};d&&(v=await F.getImageSize(d).catch(()=>F.getVideoSize(d)).catch(()=>{})),p(o,{...v,filename:o})}})})}),e.jsx(r.TextField,{size:"small",fullWidth:!0,...f,label:e.jsxs(r.Stack,{direction:"row",spacing:1,alignItems:"center",children:[f.label,s&&e.jsxs(e.Fragment,{children:[" (",e.jsx(r.FormControlLabel,{checked:l,label:e.jsx(r.Box,{component:Oe.Icon,icon:"tabler:markdown",sx:{verticalAlign:"middle"}}),labelPlacement:"start",control:e.jsx(r.Switch,{size:"small"}),sx:{ml:.25,pr:1},onChange:(i,o)=>n==null?void 0:n(o)}),")"]})]}),InputLabelProps:{shrink:!0,...f.InputLabelProps},value:j,onChange:i=>m(i.target.value),...a,onKeyDown:i=>{i.keyCode!==229&&i.key==="Enter"&&h()}})}),Je=I.lazy(()=>import("react-best-gradient-color-picker"));function Ge(t){try{const l=xe.default.parse(t).map(c=>{const b=c.colorStops.map(x=>{if(x.type!=="rgba"){const p=Ue.default(x.value).toRgb();return{...x,value:[p.r,p.g,p.b,p.a],type:"rgba"}}return x});return{...c,colorStops:b}});return xe.default.stringify(l)}catch{return B.isColorString(t)?t:""}}function $e({color:t,sx:s={},...l}){B.isColorString(t);const n={};return B.isGradient(t)?n.backgroundImage=t:n.backgroundColor=t,e.jsx(r.Box,{sx:{...s,width:"100%",paddingBottom:"100%",cursor:"pointer",transition:"opacity 0.2s",border:"1px solid #ccc",borderRadius:.5,"&:hover":{opacity:.75},...n},...l})}const Qe=I.forwardRef(function({onSave:s},l){const n=Z.useReactive({value:""}),{t:c}=R.useLocaleContext(),b={};n.value?B.isGradient(n.value)?b.backgroundImage=n.value:b.backgroundColor=n.value:b.border="1px solid #ccc";const[x,{setFalse:p,setTrue:f}]=Z.useBoolean(!1),u=I.useCallback(()=>{p()},[p]),j=()=>{s({value:n.value},u)};return I.useImperativeHandle(l,()=>({open({value:m}={value:""}){n.value=m,f()},close(){u()}})),e.jsxs(r.Dialog,{open:x,onClose:u,hideBackdrop:!0,children:[e.jsx(r.DialogTitle,{children:c("maker.configBackground")}),e.jsx(r.DialogContent,{sx:{width:600},children:e.jsxs(r.Box,{width:"100%",display:"flex",children:[e.jsx(r.Box,{flex:1,mr:1,sx:b,children:!n.value&&e.jsx(We.default,{children:c("error.notConfig")})}),e.jsx(I.Suspense,{children:e.jsx(Je,{width:200,height:200,value:Ge(n.value),onChange:m=>{n.value=m},hidePresets:!0,hideAdvancedSliders:!0,hideColorGuide:!0,hideInputType:!0})})]})}),e.jsxs(r.DialogActions,{children:[e.jsx(r.Button,{variant:"outlined",size:"small",onClick:u,children:c("common.cancel")}),e.jsx(r.Button,{variant:"contained",size:"small",onClick:j,children:c("maker.save")})]})]})});Re.styled(r.Box)`
|
|
2
2
|
.color-item {
|
|
3
3
|
position: relative;
|
|
4
4
|
}
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
top: 0;
|
|
19
19
|
right: 0;
|
|
20
20
|
}
|
|
21
|
-
`;function Xe({value:t,onChange:s,...n}){const l=I.useRef(null);return e.jsxs(e.Fragment,{children:[e.jsx(Le,{...n,value:t,onChange:s,InputProps:{endAdornment:e.jsx(r.InputAdornment,{position:"end",children:e.jsx($e,{color:t??"",style:{width:"1.5rem",height:"1.5rem",padding:0},onClick:()=>{var c;(c=l.current)==null||c.open({value:t??""})}})})}}),e.jsx(Qe,{ref:l,onSave:({value:c},b)=>{s(c),b()}})]})}const me=["string","multiline","json","yaml","component","custom","url"];function Ze({disabled:t,list:s,renderItem:n,...l}){const c=I.useRef(null),b=I.useId(),x=Z.useUpdate(),p=Ye.default(Object.entries(s),a=>a[1].index).map(a=>a[0]),f=I.useRef(p),u=I.useCallback(a=>{f.current=a,x()},[x]),j=I.useCallback(({index:a},{index:i})=>{const o=[...f.current];o.splice(i,0,...o.splice(a,1)),u(o)},[u]);I.useEffect(()=>{u(p)},[p.join("-")]);const[{isOver:m},h]=ee.useDrop({accept:b,collect:a=>({isOver:a.isOver()}),canDrop:()=>!t,drop:()=>{var o;const a=()=>{f.current.forEach((d,v)=>{const g=s[d];g&&(g.index=v)})},i=(o=N.getYjsValue(s))==null?void 0:o.doc;i?i.transact(()=>{a()}):a()}});return I.useEffect(()=>{m||u(p)},[m]),h(c),e.jsx(r.Box,{...l,ref:c,className:Fe.cx(m&&"isDragging"),children:f.current.map((a,i)=>e.jsx(et,{type:b,disabled:t,id:a,index:i,itemIndex:o=>f.current.indexOf(o),move:j,children:o=>{const d=s[a];return d?n(d.data,i,o):null}},a))})}function et({disabled:t,id:s,index:n,type:l,children:c,itemIndex:b,move:x}){const p=I.useRef(),[{isDragging:f},u,j]=ee.useDrag({type:l,item:()=>({id:s}),canDrag:()=>!t,collect:h=>({isDragging:h.isDragging()})}),[,m]=ee.useDrop({accept:l,canDrop:()=>!t,hover(h,a){var y;if(!p.current)return;const i=b(h.id),o=n;if(i===o)return;const d=(y=p.current)==null?void 0:y.getBoundingClientRect(),v=(d.bottom-d.top)/2,S=a.getClientOffset().y-d.top;i<o&&S<v||i>o&&S>v||x({id:h.id,index:i},{id:s,index:n})}});return typeof c=="function"?c({isDragging:f,drag:u,drop:h=>(p.current=h,m(h)),preview:j}):(u(m(j(p))),e.jsx(r.Box,{ref:p,children:c}))}function tt({drop:t,preview:s,drag:n,disabled:l,isDragging:c,children:b,onDelete:x,actions:p}){const{t:f}=R.useLocaleContext();return e.jsx(r.Box,{ref:t,sx:{":hover .hover-visible":{maxHeight:"100%"}},children:e.jsxs(r.Box,{sx:{position:"relative"},children:[e.jsx(r.Box,{ref:s,sx:{flex:1,borderRadius:1,bgcolor:c?"action.hover":"background.paper",opacity:.9999},children:b}),!l&&e.jsx(r.Box,{className:"hover-visible",sx:{maxHeight:0,overflow:"hidden",position:"absolute",right:2,top:2},children:e.jsxs(r.Stack,{direction:"row",sx:{bgcolor:u=>r.alpha(u.palette.grey[300],.9),borderRadius:1,p:.5,[`.${r.buttonClasses.root}`]:{minWidth:24,width:24,height:24,p:0}},children:[p,x&&e.jsx(r.Tooltip,{title:f("delete"),disableInteractive:!0,placement:"top",children:e.jsx(r.Button,{onClick:x,children:e.jsx(z.DeleteOutlineRounded,{sx:{fontSize:"1.25rem",color:"grey.500"}})})}),e.jsx(r.Tooltip,{title:f("dragSort"),disableInteractive:!0,placement:"top",children:e.jsx(r.Button,{ref:n,children:e.jsx(z.DragIndicatorRounded,{sx:{color:"grey.500"}})})})]})})]})})}function rt({label:t,value:s,onChange:n}){const[l,c]=I.useState(!1);return e.jsxs(r.Stack,{gap:1,children:[e.jsx(r.TextField,{label:t,size:"small",value:s,onChange:b=>n==null?void 0:n(b.target.value),InputProps:{endAdornment:e.jsx(F.UploaderButton,{onChange:({response:b})=>{var p;const x=(p=b==null?void 0:b.data)==null?void 0:p.filename;x&&(n==null||n(x))}})}}),s&&e.jsx(r.Box,{component:"img",sx:{objectFit:"contain",borderRadius:1,cursor:"pointer"},src:B.getImageAbsoluteUrl(s),alt:t,maxWidth:100,maxHeight:100,width:"100%",onClick:()=>c(!0)}),e.jsx(r.Dialog,{open:l,onClose:()=>c(!1),children:e.jsx(r.Box,{component:"img",sx:{objectFit:"contain"},src:B.getImageAbsoluteUrl(s),alt:t})})]})}function st({componentId:t}){const{state:{components:s}}=B.useStore(),n=s[t],l=n==null?void 0:n.data;return l?e.jsx(r.Stack,{maxHeight:"100%",overflow:"auto",children:e.jsx(r.Box,{p:2,children:e.jsx(Ne.ErrorBoundary,{FallbackComponent:B.ErrorView,resetKeys:[t],children:e.jsx(lt,{value:l})})})}):null}function lt({value:t}){var f,u,j;const{t:s}=R.useLocaleContext(),{localState:{currentLocale:n},state:{config:{defaultLocale:l}},currentPage:c,currentSection:b}=B.useStore(),x=N.getYjsValue(t).doc,p=B.useAllComponents();return e.jsx(r.Stack,{height:"100%",children:e.jsxs(r.Stack,{gap:2,children:[e.jsx(be,{config:t}),e.jsx(fe,{config:t,currentLocale:n,defaultLocale:l,allComponents:p,onUpdateConfig:m=>{x.transact(()=>{m(t)})}}),e.jsxs(r.Stack,{gap:2,direction:"row",justifyContent:"space-between",alignItems:"center",children:[e.jsx(r.Typography,{variant:"subtitle1",children:s("renderer")}),e.jsxs(r.TextField,{hiddenLabel:!0,size:"small",select:!0,SelectProps:{autoWidth:!0},value:((f=t.renderer)==null?void 0:f.type)||"react-component",onChange:m=>{x.transact(()=>{const h=m.target.value;t.renderer??(t.renderer={type:h}),t.renderer.type=h})},children:[e.jsx(r.MenuItem,{value:"react-component",children:"React Component"}),e.jsx(r.MenuItem,{value:"component",children:"Custom Component"})]})]}),((u=t.renderer)==null?void 0:u.type)==="component"?e.jsx(at,{value:t}):((j=t.renderer)==null?void 0:j.type)==="react-component"?e.jsx(ct,{value:t}):null,e.jsx(Se,{config:t,currentLocale:n,defaultLocale:l,allComponents:p,onChange:m=>{console.warn(m,JSON.parse(JSON.stringify({currentPage:c,currentSection:b})))},props:{title:"2"}})]})})}function be({config:t}){const{t:s}=R.useLocaleContext();return e.jsx(F.UploaderProvider,{children:e.jsxs(r.Stack,{gap:2,children:[e.jsx(r.Typography,{variant:"subtitle1",children:s("basicInfo")}),e.jsx(r.TextField,{label:s("name"),size:"small",value:t.name||"",onChange:n=>t.name=n.target.value}),e.jsx(r.TextField,{label:s("description"),size:"small",multiline:!0,minRows:2,maxRows:10,inputProps:{maxLength:200},value:t.description||"",onChange:n=>t.description=n.target.value}),e.jsx(r.Autocomplete,{size:"small",options:[],multiple:!0,freeSolo:!0,value:t.tags??[],onChange:(n,l)=>t.tags=l,renderInput:n=>e.jsx(r.TextField,{label:s("tags"),...n})}),e.jsx(rt,{label:s("previewImage"),value:t.previewImage||"",onChange:n=>t.previewImage=n})]})})}function fe({config:t,currentLocale:s,defaultLocale:n,allComponents:l,onUpdateConfig:c,useI18nEditor:b=!0}){const{t:x}=R.useLocaleContext(),p=D.usePopupState({variant:"dialog"}),f=t.properties&&T.sortBy(Object.values(t.properties),"index");return e.jsx(F.UploaderProvider,{children:e.jsxs(r.Stack,{gap:2,children:[e.jsxs(r.Stack,{direction:"row",gap:1,alignItems:"center",justifyContent:"space-between",children:[e.jsx(r.Typography,{variant:"subtitle1",children:x("properties")}),e.jsx(r.Box,{flex:1}),e.jsx(r.Button,{onClick:()=>{c(u=>{var m;const j=B.nextId();u.properties??(u.properties={}),(m=u.properties)[j]??(m[j]={index:(f==null?void 0:f.length)||0,data:{id:j}})})},startIcon:e.jsx(z.AddRounded,{}),children:x("addObject",{object:x("property")})}),b&&e.jsx(r.Button,{sx:{minWidth:32,minHeight:32,p:0},...D.bindTrigger(p),children:e.jsx(z.TranslateRounded,{fontSize:"small"})})]}),t.properties&&e.jsx(Ze,{component:r.Stack,gap:2,list:t.properties,renderItem:(u,j,m)=>{var h,a,i,o,d,v;return u.type==="custom-settings"?null:e.jsxs(r.Stack,{gap:1,bgcolor:"background.paper",children:[e.jsx(tt,{preview:m.preview,drop:m.drop,drag:m.drag,isDragging:m.isDragging,onDelete:()=>{c(g=>{if(g.properties){const y=Object.entries(g.properties).sort(([,C],[,P])=>C.index-P.index);delete g.properties[u.id],y.filter(([C])=>C!==u.id).forEach(([,C],P)=>{C.index=P})}})},children:e.jsxs(r.Stack,{direction:"row",gap:1,children:[e.jsx(r.TextField,{label:x("key"),size:"small",sx:{flex:1},value:u.key||"",onChange:g=>{c(S=>{const y=S.properties[u.id].data;y.key=g.target.value.trim()})}}),e.jsx(r.TextField,{label:x("label"),size:"small",sx:{flex:1},value:(((a=(h=u.locales)==null?void 0:h[s])==null?void 0:a.name)??((o=(i=u.locales)==null?void 0:i[n])==null?void 0:o.name))||"",onChange:g=>{c(S=>{var k;const y=S.properties[u.id].data;y.locales??(y.locales={}),(k=y.locales)[s]??(k[s]={}),y.locales[s].name=g.target.value})}}),e.jsxs(r.TextField,{label:x("type"),size:"small",select:!0,sx:{flex:1},value:u.type==="string"&&u.multiline?"multiline":u.type||"string",onChange:g=>{c(S=>{const y=S.properties[u.id].data;if(y.locales)for(const C of Object.keys(y.locales))y.locales[C].defaultValue=void 0;const k=g.target.value;k==="multiline"?(y.type="string",y.multiline=!0):(typeof y.multiline<"u"&&delete y.multiline,y.type=k)})},children:[e.jsx(r.MenuItem,{value:"string",children:"Text"}),e.jsx(r.MenuItem,{value:"multiline",children:"Text (Multiline)"}),e.jsx(r.MenuItem,{value:"number",children:"Number"}),e.jsx(r.MenuItem,{value:"decimal",children:"Decimal"}),e.jsx(r.MenuItem,{value:"boolean",children:"Boolean"}),e.jsx(r.MenuItem,{value:"color",children:"Color"}),e.jsx(r.MenuItem,{value:"url",children:"URL (Upload)"}),e.jsx(r.MenuItem,{value:"json",children:"JSON"}),e.jsx(r.MenuItem,{value:"yaml",children:"YAML"}),e.jsx(r.MenuItem,{value:"component",children:"Component"}),e.jsx(r.MenuItem,{value:"custom",children:"Custom (Render by a Component)"})]})]})}),e.jsxs(r.Stack,{direction:"row",gap:1,children:[e.jsx(q,{allComponents:l,defaultLocale:n,component:t,property:u,label:x("defaultValue"),size:"small",fullWidth:!0,value:(v=(d=u.locales)==null?void 0:d[s])==null?void 0:v.defaultValue,onChange:g=>{c(S=>{var k;const y=S.properties[u.id].data;y.locales??(y.locales={}),(k=y.locales)[s]??(k[s]={}),y.locales[s].defaultValue=g})}}),u.type==="custom"?e.jsx(r.Box,{children:e.jsx(nt,{property:u,allComponents:l})}):null]})]},u.id)}}),b&&e.jsx(ge,{...D.bindDialog(p),component:t})]})})}function nt({property:t,allComponents:s}){const n=D.usePopupState({variant:"popper"});return e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{sx:{minWidth:0},...D.bindTrigger(n),children:e.jsx(z.SettingsRounded,{fontSize:"small"})}),e.jsx(r.Popper,{...D.bindPopper(n),children:e.jsx(te.ClickAwayListener,{onClickAway:n.close,children:e.jsx(r.Paper,{children:e.jsx(r.Box,{width:500,p:2,children:e.jsx(X,{value:t.componentId,onChange:(l,c)=>t.componentId=c,allComponents:s})})})})})]})}function it({value:t,valueImmutable:s,onChange:n,defaultLocale:l,allComponents:c}){var f;const b=D.usePopupState({variant:"popper"}),{locale:x}=R.useLocaleContext(),p=typeof(t==null?void 0:t.componentId)=="string"?(f=c[t.componentId])==null?void 0:f.data:void 0;return p?e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{sx:{minWidth:0},disabled:!p,...D.bindTrigger(b),children:e.jsx(z.SettingsRounded,{fontSize:"small"})}),e.jsx(r.Popper,{...D.bindPopper(b),sx:{zIndex:1e3},children:e.jsx(te.ClickAwayListener,{onClickAway:b.close,children:e.jsx(r.Paper,{children:e.jsxs(r.Box,{width:500,p:2,children:[e.jsx(r.Typography,{variant:"subtitle1",children:"Parameters"}),e.jsx(r.Stack,{gap:1,children:(p==null?void 0:p.properties)&&T.sortBy(Object.values(p.properties),"index").map(({data:u})=>{var j,m,h,a,i,o,d,v;return e.jsx(r.Box,{children:e.jsx(q,{allComponents:c,defaultLocale:l,size:"small",fullWidth:!0,component:p,property:u,valueImmutable:T.isNil((m=(j=t.properties)==null?void 0:j[u.id])==null?void 0:m.value),value:((a=(h=t.properties)==null?void 0:h[u.id])==null?void 0:a.value)??((o=(i=u.locales)==null?void 0:i[x])==null?void 0:o.defaultValue)??((v=(d=u.locales)==null?void 0:d[l])==null?void 0:v.defaultValue),onChange:g=>{if(s){const S=JSON.parse(JSON.stringify(t));n==null||n({...S,properties:{...S.properties,[u.id]:{value:g}}})}else N.getYjsValue(p).doc.transact(()=>{t.properties??(t.properties={}),t.properties[u.id]={value:g}})}})},u.id)})})]})})})})]}):null}function ge({type:t="properties",component:s,...n}){var m,h,a;const{t:l}=R.useLocaleContext(),{state:{components:c,supportedLocales:b,config:{defaultLocale:x}}}=B.useStore(),p=B.useAllComponents(),f=N.getYjsValue(s).doc,u=t==="properties"?s.properties:t==="parameters"&&((m=s.renderer)==null?void 0:m.type)==="component"?(h=c[s.renderer.componentId])==null?void 0:h.data.properties:void 0,j=((a=s.renderer)==null?void 0:a.type)==="component"?s:void 0;return e.jsxs(r.Dialog,{...n,fullWidth:!0,maxWidth:"lg",children:[e.jsx(r.DialogTitle,{children:l("i18nEditorTitle")}),e.jsx(r.DialogContent,{children:u&&e.jsx(r.Stack,{children:e.jsxs(r.Table,{stickyHeader:!0,sx:{td:{verticalAlign:"top"}},children:[e.jsx(r.TableHead,{children:e.jsx(r.TableRow,{children:b.map(({locale:i,name:o})=>e.jsxs(r.TableCell,{children:[o,x===i&&e.jsx(z.StarRounded,{sx:{fontSize:12,color:"text.secondary"}})]},i))})}),e.jsx(r.TableBody,{children:T.sortBy(Object.values(u),"index").map(({data:i})=>e.jsx(r.TableRow,{children:b.map(({locale:o})=>{var d,v,g,S,y,k,C,P,A,V,W,U,M,K,$,H,Y,L,J,G,re,se,le,ne,ie,oe;return e.jsx(r.TableCell,{children:e.jsx(r.Stack,{gap:1,children:t==="properties"?e.jsxs(e.Fragment,{children:[e.jsx(r.TextField,{size:"small",label:"Key",value:i.key||"",onChange:_=>{f.transact(()=>{i.key=_.target.value.trim()})}}),e.jsx(r.TextField,{size:"small",label:l("label"),value:(((v=(d=i.locales)==null?void 0:d[o])==null?void 0:v.name)??((S=(g=i.locales)==null?void 0:g[x])==null?void 0:S.name))||"",onChange:_=>{f.transact(()=>{var O;i.locales??(i.locales={}),(O=i.locales)[o]??(O[o]={}),i.locales[o].name=_.target.value})}}),e.jsx(r.Box,{children:e.jsx(q,{allComponents:p,defaultLocale:x,component:s,property:i,size:"small",fullWidth:!0,label:"Default Value",valueImmutable:T.isNil((k=(y=i.locales)==null?void 0:y[o])==null?void 0:k.defaultValue),value:((P=(C=i.locales)==null?void 0:C[o])==null?void 0:P.defaultValue)??((V=(A=i.locales)==null?void 0:A[x])==null?void 0:V.defaultValue),onChange:_=>{f.transact(()=>{var O;i.locales??(i.locales={}),(O=i.locales)[o]??(O[o]={}),i.locales[o].defaultValue=_})}})})]}):t==="parameters"&&j?e.jsx(r.Box,{children:e.jsx(q,{allComponents:p,defaultLocale:x,component:s,property:i,size:"small",fullWidth:!0,valueImmutable:T.isNil((K=(M=(U=(W=j.renderer.properties)==null?void 0:W[i.id])==null?void 0:U.locales)==null?void 0:M[o])==null?void 0:K.value),value:((L=(Y=(H=($=j.renderer.properties)==null?void 0:$[i.id])==null?void 0:H.locales)==null?void 0:Y[o])==null?void 0:L.value)??((se=(re=(G=(J=j.renderer.properties)==null?void 0:J[i.id])==null?void 0:G.locales)==null?void 0:re[x])==null?void 0:se.value)??((ne=(le=i.locales)==null?void 0:le[o])==null?void 0:ne.defaultValue)??((oe=(ie=i.locales)==null?void 0:ie[x])==null?void 0:oe.defaultValue),onChange:_=>{f.transact(()=>{var O,ce,ae,ue,de;(O=j.renderer).properties??(O.properties={}),(ce=j.renderer.properties)[ae=i.id]??(ce[ae]={}),(ue=j.renderer.properties[i.id]).locales??(ue.locales={}),(de=j.renderer.properties[i.id].locales)[o]??(de[o]={}),j.renderer.properties[i.id].locales[o].value=_})}})}):null},i.id)},o)})},i.id))})]})})}),e.jsx(r.DialogActions,{children:e.jsx(r.Button,{onClick:i=>{var o;return(o=n.onClose)==null?void 0:o.call(n,i,"escapeKeyDown")},children:l("close")})})]})}function q({component:t,property:s,value:n,onChange:l,valueImmutable:c,defaultLocale:b,allComponents:x,...p}){var m,h,a,i,o;const{locale:f}=R.useLocaleContext(),u=I.useRef(null),j=p.label||((h=(m=s.locales)==null?void 0:m[f])==null?void 0:h.name)||((i=(a=s.locales)==null?void 0:a[b])==null?void 0:i.name)||s.key||s.id;if(s.type==="number")return e.jsx(ot,{...p,label:j,NumberProps:{value:["number","string"].includes(typeof n)?n:null,onChange:(d,v)=>l==null?void 0:l(v)}});if(s.type==="custom-settings")return null;if(s.type==="decimal")return e.jsx(r.TextField,{...p,label:j,type:"text",value:n??"",onChange:d=>{const v=d.target.value;if(v===""||v==="-"){l==null||l(v);return}if(/^-?(?!.*\..*\.)[0-9]*(\.[0-9]{0,9})?$/.test(v)){let S=v;/^-?[1-9]+[0-9]*(\.[0-9]{1,9})?$/.test(S)&&(S=Number(S)),l==null||l(S)}}});if(s.type==="boolean")return e.jsx(r.FormControlLabel,{label:j,labelPlacement:"start",control:e.jsx(r.Switch,{checked:n===!0,onChange:(d,v)=>l==null?void 0:l(v)})});if(s.type==="color")return e.jsx(Xe,{label:j,value:n,onChange:d=>{l==null||l(d)}});if(s.type==="json"||s.type==="yaml")return e.jsxs(r.Stack,{sx:{width:"100%",position:"relative",pt:1,pb:"6px",px:"1px",minHeight:50,".monaco-editor,.overflow-guard":{borderRadius:1}},children:[e.jsx(r.FormLabel,{sx:{position:"absolute",left:0,top:0,transform:"translate(0px, -7px) scale(0.75)"},children:j}),e.jsx(he.CodeEditor,{keyId:s.id,locale:f,language:s.type==="yaml"?"yaml":"json",value:typeof n=="string"?n:"",onChange:d=>l==null?void 0:l(d),onUpload:d=>{u.current=d}},s.id),e.jsx(r.Box,{component:"fieldset",sx:{pointerEvents:"none",position:"absolute",left:0,top:-5,width:"100%",height:"100%",border:1,borderColor:"rgba(0, 0, 0, 0.23)",borderRadius:1,px:1,py:0},children:e.jsx(r.Box,{component:"legend",sx:{fontSize:"0.75em"},children:e.jsx(r.Box,{component:"span",sx:{opacity:0},children:p.label})})})]});if(s.type==="custom"){const d=(o=x[s.componentId])==null?void 0:o.data;return d?e.jsx(r.Box,{width:"100%",children:e.jsx(Q.CustomComponentRenderer,{componentId:d.id,props:{label:j,value:n,onChange:l},locale:f,dev:{mode:"draft",components:x,defaultLocale:b}})}):e.jsx(r.TextField,{...p,label:j,disabled:!0,placeholder:"Click right button select a component"})}if(s.type==="component")return e.jsxs(r.Stack,{width:"100%",direction:"row",gap:1,children:[e.jsx(r.Box,{flex:1,children:e.jsx(X,{allComponents:x,label:j,value:n==null?void 0:n.componentId,onChange:(d,v)=>{c||!n?l==null||l({...n&&JSON.parse(JSON.stringify(n)),componentId:v}):typeof n=="object"&&(n.componentId=v)}})}),e.jsx(r.Box,{children:e.jsx(it,{value:n,valueImmutable:c,onChange:l,defaultLocale:b,allComponents:x})})]});if(!s.type||["string","url"].includes(s.type)){const d=s.type==="string"?s.multiline:void 0,v=s.type==="url"?n==null?void 0:n.url:n;return e.jsx(r.TextField,{...p,label:j,value:typeof v=="string"?v:"",multiline:d,minRows:d?2:void 0,maxRows:d?10:void 0,onChange:g=>l==null?void 0:l(s.type==="url"?{...n,url:g.target.value,mediaKitUrl:g.target.value}:g.target.value),InputProps:s.type==="url"?{sx:{pr:0},endAdornment:e.jsxs(r.InputAdornment,{position:"end",children:[e.jsx(F.UploaderButton,{onChange:async({response:g})=>{var C,P,A;const S=((C=g==null?void 0:g.data)==null?void 0:C.url)||((P=g==null?void 0:g.data)==null?void 0:P.fileUrl);let y;S&&(y=await F.getImageSize(S).catch(()=>F.getVideoSize(S)).catch(()=>{}));let k=((A=g==null?void 0:g.data)==null?void 0:A.filename)||"";k&&(k=`mediakit://${k}`),l==null||l({url:S,mediaKitUrl:k,width:y==null?void 0:y.naturalWidth,height:y==null?void 0:y.naturalHeight})}}),e.jsx(r.Tooltip,{title:"If you are using the 'mediaKitUrl' property, please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address.",children:e.jsx(z.InfoRounded,{sx:{cursor:"default"},fontSize:"small"})})]})}:void 0})}return console.error("Unsupported property type",s.type),null}function ot({NumberProps:t,...s}){const{getInputProps:n}=te.unstable_useNumberInput(t),l=n();return e.jsx(r.TextField,{...s,inputProps:l})}const ye=`import React from '@blocklet/pages-kit/builtin/react'
|
|
21
|
+
`;function Xe({value:t,onChange:s,...l}){const n=I.useRef(null);return e.jsxs(e.Fragment,{children:[e.jsx(Le,{...l,value:t,onChange:s,InputProps:{endAdornment:e.jsx(r.InputAdornment,{position:"end",children:e.jsx($e,{color:t??"",style:{width:"1.5rem",height:"1.5rem",padding:0},onClick:()=>{var c;(c=n.current)==null||c.open({value:t??""})}})})}}),e.jsx(Qe,{ref:n,onSave:({value:c},b)=>{s(c),b()}})]})}const me=["string","multiline","json","yaml","component","custom","url"];function Ze({disabled:t,list:s,renderItem:l,...n}){const c=I.useRef(null),b=I.useId(),x=Z.useUpdate(),p=Ye.default(Object.entries(s),a=>a[1].index).map(a=>a[0]),f=I.useRef(p),u=I.useCallback(a=>{f.current=a,x()},[x]),j=I.useCallback(({index:a},{index:i})=>{const o=[...f.current];o.splice(i,0,...o.splice(a,1)),u(o)},[u]);I.useEffect(()=>{u(p)},[p.join("-")]);const[{isOver:m},h]=ee.useDrop({accept:b,collect:a=>({isOver:a.isOver()}),canDrop:()=>!t,drop:()=>{var o;const a=()=>{f.current.forEach((d,v)=>{const g=s[d];g&&(g.index=v)})},i=(o=N.getYjsValue(s))==null?void 0:o.doc;i?i.transact(()=>{a()}):a()}});return I.useEffect(()=>{m||u(p)},[m]),h(c),e.jsx(r.Box,{...n,ref:c,className:Fe.cx(m&&"isDragging"),children:f.current.map((a,i)=>e.jsx(et,{type:b,disabled:t,id:a,index:i,itemIndex:o=>f.current.indexOf(o),move:j,children:o=>{const d=s[a];return d?l(d.data,i,o):null}},a))})}function et({disabled:t,id:s,index:l,type:n,children:c,itemIndex:b,move:x}){const p=I.useRef(),[{isDragging:f},u,j]=ee.useDrag({type:n,item:()=>({id:s}),canDrag:()=>!t,collect:h=>({isDragging:h.isDragging()})}),[,m]=ee.useDrop({accept:n,canDrop:()=>!t,hover(h,a){var y;if(!p.current)return;const i=b(h.id),o=l;if(i===o)return;const d=(y=p.current)==null?void 0:y.getBoundingClientRect(),v=(d.bottom-d.top)/2,S=a.getClientOffset().y-d.top;i<o&&S<v||i>o&&S>v||x({id:h.id,index:i},{id:s,index:l})}});return typeof c=="function"?c({isDragging:f,drag:u,drop:h=>(p.current=h,m(h)),preview:j}):(u(m(j(p))),e.jsx(r.Box,{ref:p,children:c}))}function tt({drop:t,preview:s,drag:l,disabled:n,isDragging:c,children:b,onDelete:x,actions:p}){const{t:f}=R.useLocaleContext();return e.jsx(r.Box,{ref:t,sx:{":hover .hover-visible":{maxHeight:"100%"}},children:e.jsxs(r.Box,{sx:{position:"relative"},children:[e.jsx(r.Box,{ref:s,sx:{flex:1,borderRadius:1,bgcolor:c?"action.hover":"background.paper",opacity:.9999},children:b}),!n&&e.jsx(r.Box,{className:"hover-visible",sx:{maxHeight:0,overflow:"hidden",position:"absolute",right:2,top:2},children:e.jsxs(r.Stack,{direction:"row",sx:{bgcolor:u=>r.alpha(u.palette.grey[300],.9),borderRadius:1,p:.5,[`.${r.buttonClasses.root}`]:{minWidth:24,width:24,height:24,p:0}},children:[p,x&&e.jsx(r.Tooltip,{title:f("delete"),disableInteractive:!0,placement:"top",children:e.jsx(r.Button,{onClick:x,children:e.jsx(z.DeleteOutlineRounded,{sx:{fontSize:"1.25rem",color:"grey.500"}})})}),e.jsx(r.Tooltip,{title:f("dragSort"),disableInteractive:!0,placement:"top",children:e.jsx(r.Button,{ref:l,children:e.jsx(z.DragIndicatorRounded,{sx:{color:"grey.500"}})})})]})})]})})}function rt({label:t,value:s,onChange:l}){const[n,c]=I.useState(!1);return e.jsxs(r.Stack,{gap:1,children:[e.jsx(r.TextField,{label:t,size:"small",value:s,onChange:b=>l==null?void 0:l(b.target.value),InputProps:{endAdornment:e.jsx(F.UploaderButton,{onChange:({response:b})=>{var p;const x=(p=b==null?void 0:b.data)==null?void 0:p.filename;x&&(l==null||l(x))}})}}),s&&e.jsx(r.Box,{component:"img",sx:{objectFit:"contain",borderRadius:1,cursor:"pointer"},src:B.getImageAbsoluteUrl(s),alt:t,maxWidth:100,maxHeight:100,width:"100%",onClick:()=>c(!0)}),e.jsx(r.Dialog,{open:n,onClose:()=>c(!1),children:e.jsx(r.Box,{component:"img",sx:{objectFit:"contain"},src:B.getImageAbsoluteUrl(s),alt:t})})]})}function st({componentId:t}){const{state:{components:s}}=B.useStore(),l=s[t],n=l==null?void 0:l.data;return n?e.jsx(r.Stack,{maxHeight:"100%",overflow:"auto",children:e.jsx(r.Box,{p:2,children:e.jsx(Ne.ErrorBoundary,{FallbackComponent:B.ErrorView,resetKeys:[t],children:e.jsx(nt,{value:n})})})}):null}function nt({value:t}){var f,u,j;const{t:s}=R.useLocaleContext(),{localState:{currentLocale:l},state:{config:{defaultLocale:n}},currentPage:c,currentSection:b}=B.useStore(),x=N.getYjsValue(t).doc,p=B.useAllComponents();return e.jsx(r.Stack,{height:"100%",children:e.jsxs(r.Stack,{gap:2,children:[e.jsx(be,{config:t}),e.jsx(fe,{config:t,currentLocale:l,defaultLocale:n,allComponents:p,onUpdateConfig:m=>{x.transact(()=>{m(t)})}}),e.jsxs(r.Stack,{gap:2,direction:"row",justifyContent:"space-between",alignItems:"center",children:[e.jsx(r.Typography,{variant:"subtitle1",children:s("renderer")}),e.jsxs(r.TextField,{hiddenLabel:!0,size:"small",select:!0,SelectProps:{autoWidth:!0},value:((f=t.renderer)==null?void 0:f.type)||"react-component",onChange:m=>{x.transact(()=>{const h=m.target.value;t.renderer??(t.renderer={type:h}),t.renderer.type=h})},children:[e.jsx(r.MenuItem,{value:"react-component",children:"React Component"}),e.jsx(r.MenuItem,{value:"component",children:"Custom Component"})]})]}),((u=t.renderer)==null?void 0:u.type)==="component"?e.jsx(at,{value:t}):((j=t.renderer)==null?void 0:j.type)==="react-component"?e.jsx(ct,{value:t}):null,e.jsx(Se,{config:t,currentLocale:l,defaultLocale:n,allComponents:p,onChange:m=>{console.warn(m,JSON.parse(JSON.stringify({currentPage:c,currentSection:b})))},props:{}})]})})}function be({config:t}){const{t:s}=R.useLocaleContext();return e.jsx(F.UploaderProvider,{children:e.jsxs(r.Stack,{gap:2,children:[e.jsx(r.Typography,{variant:"subtitle1",children:s("basicInfo")}),e.jsx(r.TextField,{label:s("name"),size:"small",value:t.name||"",onChange:l=>t.name=l.target.value}),e.jsx(r.TextField,{label:s("description"),size:"small",multiline:!0,minRows:2,maxRows:10,inputProps:{maxLength:200},value:t.description||"",onChange:l=>t.description=l.target.value}),e.jsx(r.Autocomplete,{size:"small",options:[],multiple:!0,freeSolo:!0,value:t.tags??[],onChange:(l,n)=>t.tags=n,renderInput:l=>e.jsx(r.TextField,{label:s("tags"),...l})}),e.jsx(rt,{label:s("previewImage"),value:t.previewImage||"",onChange:l=>t.previewImage=l})]})})}function fe({config:t,currentLocale:s,defaultLocale:l,allComponents:n,onUpdateConfig:c,useI18nEditor:b=!0}){const{t:x}=R.useLocaleContext(),p=D.usePopupState({variant:"dialog"}),f=t.properties&&T.sortBy(Object.values(t.properties),"index");return e.jsx(F.UploaderProvider,{children:e.jsxs(r.Stack,{gap:2,children:[e.jsxs(r.Stack,{direction:"row",gap:1,alignItems:"center",justifyContent:"space-between",children:[e.jsx(r.Typography,{variant:"subtitle1",children:x("properties")}),e.jsx(r.Box,{flex:1}),e.jsx(r.Button,{onClick:()=>{c(u=>{var m;const j=B.nextId();u.properties??(u.properties={}),(m=u.properties)[j]??(m[j]={index:(f==null?void 0:f.length)||0,data:{id:j}})})},startIcon:e.jsx(z.AddRounded,{}),children:x("addObject",{object:x("property")})}),b&&e.jsx(r.Button,{sx:{minWidth:32,minHeight:32,p:0},...D.bindTrigger(p),children:e.jsx(z.TranslateRounded,{fontSize:"small"})})]}),t.properties&&e.jsx(Ze,{component:r.Stack,gap:2,list:t.properties,renderItem:(u,j,m)=>{var h,a,i,o,d,v;return u.type==="custom-settings"?null:e.jsxs(r.Stack,{gap:1,bgcolor:"background.paper",children:[e.jsx(tt,{preview:m.preview,drop:m.drop,drag:m.drag,isDragging:m.isDragging,onDelete:()=>{c(g=>{if(g.properties){const y=Object.entries(g.properties).sort(([,C],[,P])=>C.index-P.index);delete g.properties[u.id],y.filter(([C])=>C!==u.id).forEach(([,C],P)=>{C.index=P})}})},children:e.jsxs(r.Stack,{direction:"row",gap:1,children:[e.jsx(r.TextField,{label:x("key"),size:"small",sx:{flex:1},value:u.key||"",onChange:g=>{c(S=>{const y=S.properties[u.id].data;y.key=g.target.value.trim()})}}),e.jsx(r.TextField,{label:x("label"),size:"small",sx:{flex:1},value:(((a=(h=u.locales)==null?void 0:h[s])==null?void 0:a.name)??((o=(i=u.locales)==null?void 0:i[l])==null?void 0:o.name))||"",onChange:g=>{c(S=>{var k;const y=S.properties[u.id].data;y.locales??(y.locales={}),(k=y.locales)[s]??(k[s]={}),y.locales[s].name=g.target.value})}}),e.jsxs(r.TextField,{label:x("type"),size:"small",select:!0,sx:{flex:1},value:u.type==="string"&&u.multiline?"multiline":u.type||"string",onChange:g=>{c(S=>{const y=S.properties[u.id].data;if(y.locales)for(const C of Object.keys(y.locales))y.locales[C].defaultValue=void 0;const k=g.target.value;k==="multiline"?(y.type="string",y.multiline=!0):(typeof y.multiline<"u"&&delete y.multiline,y.type=k)})},children:[e.jsx(r.MenuItem,{value:"string",children:"Text"}),e.jsx(r.MenuItem,{value:"multiline",children:"Text (Multiline)"}),e.jsx(r.MenuItem,{value:"number",children:"Number"}),e.jsx(r.MenuItem,{value:"decimal",children:"Decimal"}),e.jsx(r.MenuItem,{value:"boolean",children:"Boolean"}),e.jsx(r.MenuItem,{value:"color",children:"Color"}),e.jsx(r.MenuItem,{value:"url",children:"URL (Upload)"}),e.jsx(r.MenuItem,{value:"json",children:"JSON"}),e.jsx(r.MenuItem,{value:"yaml",children:"YAML"}),e.jsx(r.MenuItem,{value:"component",children:"Component"}),e.jsx(r.MenuItem,{value:"custom",children:"Custom (Render by a Component)"})]})]})}),e.jsxs(r.Stack,{direction:"row",gap:1,children:[e.jsx(q,{allComponents:n,defaultLocale:l,component:t,property:u,label:x("defaultValue"),size:"small",fullWidth:!0,value:(v=(d=u.locales)==null?void 0:d[s])==null?void 0:v.defaultValue,onChange:g=>{c(S=>{var k;const y=S.properties[u.id].data;y.locales??(y.locales={}),(k=y.locales)[s]??(k[s]={}),y.locales[s].defaultValue=g})}}),u.type==="custom"?e.jsx(r.Box,{children:e.jsx(lt,{property:u,allComponents:n})}):null]})]},u.id)}}),b&&e.jsx(ge,{...D.bindDialog(p),component:t})]})})}function lt({property:t,allComponents:s}){const l=D.usePopupState({variant:"popper"});return e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{sx:{minWidth:0},...D.bindTrigger(l),children:e.jsx(z.SettingsRounded,{fontSize:"small"})}),e.jsx(r.Popper,{...D.bindPopper(l),children:e.jsx(te.ClickAwayListener,{onClickAway:l.close,children:e.jsx(r.Paper,{children:e.jsx(r.Box,{width:500,p:2,children:e.jsx(X,{value:t.componentId,onChange:(n,c)=>t.componentId=c,allComponents:s})})})})})]})}function it({value:t,valueImmutable:s,onChange:l,defaultLocale:n,allComponents:c}){var f;const b=D.usePopupState({variant:"popper"}),{locale:x}=R.useLocaleContext(),p=typeof(t==null?void 0:t.componentId)=="string"?(f=c[t.componentId])==null?void 0:f.data:void 0;return p?e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{sx:{minWidth:0},disabled:!p,...D.bindTrigger(b),children:e.jsx(z.SettingsRounded,{fontSize:"small"})}),e.jsx(r.Popper,{...D.bindPopper(b),sx:{zIndex:1e3},children:e.jsx(te.ClickAwayListener,{onClickAway:b.close,children:e.jsx(r.Paper,{children:e.jsxs(r.Box,{width:500,p:2,children:[e.jsx(r.Typography,{variant:"subtitle1",children:"Parameters"}),e.jsx(r.Stack,{gap:1,children:(p==null?void 0:p.properties)&&T.sortBy(Object.values(p.properties),"index").map(({data:u})=>{var j,m,h,a,i,o,d,v;return e.jsx(r.Box,{children:e.jsx(q,{allComponents:c,defaultLocale:n,size:"small",fullWidth:!0,component:p,property:u,valueImmutable:T.isNil((m=(j=t.properties)==null?void 0:j[u.id])==null?void 0:m.value),value:((a=(h=t.properties)==null?void 0:h[u.id])==null?void 0:a.value)??((o=(i=u.locales)==null?void 0:i[x])==null?void 0:o.defaultValue)??((v=(d=u.locales)==null?void 0:d[n])==null?void 0:v.defaultValue),onChange:g=>{if(s){const S=JSON.parse(JSON.stringify(t));l==null||l({...S,properties:{...S.properties,[u.id]:{value:g}}})}else N.getYjsValue(p).doc.transact(()=>{t.properties??(t.properties={}),t.properties[u.id]={value:g}})}})},u.id)})})]})})})})]}):null}function ge({type:t="properties",component:s,...l}){var m,h,a;const{t:n}=R.useLocaleContext(),{state:{components:c,supportedLocales:b,config:{defaultLocale:x}}}=B.useStore(),p=B.useAllComponents(),f=N.getYjsValue(s).doc,u=t==="properties"?s.properties:t==="parameters"&&((m=s.renderer)==null?void 0:m.type)==="component"?(h=c[s.renderer.componentId])==null?void 0:h.data.properties:void 0,j=((a=s.renderer)==null?void 0:a.type)==="component"?s:void 0;return e.jsxs(r.Dialog,{...l,fullWidth:!0,maxWidth:"lg",children:[e.jsx(r.DialogTitle,{children:n("i18nEditorTitle")}),e.jsx(r.DialogContent,{children:u&&e.jsx(r.Stack,{children:e.jsxs(r.Table,{stickyHeader:!0,sx:{td:{verticalAlign:"top"}},children:[e.jsx(r.TableHead,{children:e.jsx(r.TableRow,{children:b.map(({locale:i,name:o})=>e.jsxs(r.TableCell,{children:[o,x===i&&e.jsx(z.StarRounded,{sx:{fontSize:12,color:"text.secondary"}})]},i))})}),e.jsx(r.TableBody,{children:T.sortBy(Object.values(u),"index").map(({data:i})=>e.jsx(r.TableRow,{children:b.map(({locale:o})=>{var d,v,g,S,y,k,C,P,A,V,W,U,M,K,$,H,Y,L,J,G,re,se,ne,le,ie,oe;return e.jsx(r.TableCell,{children:e.jsx(r.Stack,{gap:1,children:t==="properties"?e.jsxs(e.Fragment,{children:[e.jsx(r.TextField,{size:"small",label:"Key",value:i.key||"",onChange:_=>{f.transact(()=>{i.key=_.target.value.trim()})}}),e.jsx(r.TextField,{size:"small",label:n("label"),value:(((v=(d=i.locales)==null?void 0:d[o])==null?void 0:v.name)??((S=(g=i.locales)==null?void 0:g[x])==null?void 0:S.name))||"",onChange:_=>{f.transact(()=>{var O;i.locales??(i.locales={}),(O=i.locales)[o]??(O[o]={}),i.locales[o].name=_.target.value})}}),e.jsx(r.Box,{children:e.jsx(q,{allComponents:p,defaultLocale:x,component:s,property:i,size:"small",fullWidth:!0,label:"Default Value",valueImmutable:T.isNil((k=(y=i.locales)==null?void 0:y[o])==null?void 0:k.defaultValue),value:((P=(C=i.locales)==null?void 0:C[o])==null?void 0:P.defaultValue)??((V=(A=i.locales)==null?void 0:A[x])==null?void 0:V.defaultValue),onChange:_=>{f.transact(()=>{var O;i.locales??(i.locales={}),(O=i.locales)[o]??(O[o]={}),i.locales[o].defaultValue=_})}})})]}):t==="parameters"&&j?e.jsx(r.Box,{children:e.jsx(q,{allComponents:p,defaultLocale:x,component:s,property:i,size:"small",fullWidth:!0,valueImmutable:T.isNil((K=(M=(U=(W=j.renderer.properties)==null?void 0:W[i.id])==null?void 0:U.locales)==null?void 0:M[o])==null?void 0:K.value),value:((L=(Y=(H=($=j.renderer.properties)==null?void 0:$[i.id])==null?void 0:H.locales)==null?void 0:Y[o])==null?void 0:L.value)??((se=(re=(G=(J=j.renderer.properties)==null?void 0:J[i.id])==null?void 0:G.locales)==null?void 0:re[x])==null?void 0:se.value)??((le=(ne=i.locales)==null?void 0:ne[o])==null?void 0:le.defaultValue)??((oe=(ie=i.locales)==null?void 0:ie[x])==null?void 0:oe.defaultValue),onChange:_=>{f.transact(()=>{var O,ce,ae,ue,de;(O=j.renderer).properties??(O.properties={}),(ce=j.renderer.properties)[ae=i.id]??(ce[ae]={}),(ue=j.renderer.properties[i.id]).locales??(ue.locales={}),(de=j.renderer.properties[i.id].locales)[o]??(de[o]={}),j.renderer.properties[i.id].locales[o].value=_})}})}):null},i.id)},o)})},i.id))})]})})}),e.jsx(r.DialogActions,{children:e.jsx(r.Button,{onClick:i=>{var o;return(o=l.onClose)==null?void 0:o.call(l,i,"escapeKeyDown")},children:n("close")})})]})}function q({component:t,property:s,value:l,onChange:n,valueImmutable:c,defaultLocale:b,allComponents:x,...p}){var m,h,a,i,o;const{locale:f}=R.useLocaleContext(),u=I.useRef(null),j=p.label||((h=(m=s.locales)==null?void 0:m[f])==null?void 0:h.name)||((i=(a=s.locales)==null?void 0:a[b])==null?void 0:i.name)||s.key||s.id;if(s.type==="number")return e.jsx(ot,{...p,label:j,NumberProps:{value:["number","string"].includes(typeof l)?l:null,onChange:(d,v)=>n==null?void 0:n(v)}});if(s.type==="custom-settings")return null;if(s.type==="decimal")return e.jsx(r.TextField,{...p,label:j,type:"text",value:l??"",onChange:d=>{const v=d.target.value;if(v===""||v==="-"){n==null||n(v);return}if(/^-?(?!.*\..*\.)[0-9]*(\.[0-9]{0,9})?$/.test(v)){let S=v;/^-?[1-9]+[0-9]*(\.[0-9]{1,9})?$/.test(S)&&(S=Number(S)),n==null||n(S)}}});if(s.type==="boolean")return e.jsx(r.FormControlLabel,{label:j,labelPlacement:"start",control:e.jsx(r.Switch,{checked:l===!0,onChange:(d,v)=>n==null?void 0:n(v)})});if(s.type==="color")return e.jsx(Xe,{label:j,value:l,onChange:d=>{n==null||n(d)}});if(s.type==="json"||s.type==="yaml")return e.jsxs(r.Stack,{sx:{width:"100%",position:"relative",pt:1,pb:"6px",px:"1px",minHeight:50,".monaco-editor,.overflow-guard":{borderRadius:1}},children:[e.jsx(r.FormLabel,{sx:{position:"absolute",left:0,top:0,transform:"translate(0px, -7px) scale(0.75)"},children:j}),e.jsx(he.CodeEditor,{keyId:s.id,locale:f,language:s.type==="yaml"?"yaml":"json",value:typeof l=="string"?l:"",onChange:d=>n==null?void 0:n(d),onUpload:d=>{u.current=d}},s.id),e.jsx(r.Box,{component:"fieldset",sx:{pointerEvents:"none",position:"absolute",left:0,top:-5,width:"100%",height:"100%",border:1,borderColor:"rgba(0, 0, 0, 0.23)",borderRadius:1,px:1,py:0},children:e.jsx(r.Box,{component:"legend",sx:{fontSize:"0.75em"},children:e.jsx(r.Box,{component:"span",sx:{opacity:0},children:p.label})})})]});if(s.type==="custom"){const d=(o=x[s.componentId])==null?void 0:o.data;return d?e.jsx(r.Box,{width:"100%",children:e.jsx(Q.CustomComponentRenderer,{componentId:d.id,props:{label:j,value:l,onChange:n},locale:f,dev:{mode:"draft",components:x,defaultLocale:b}})}):e.jsx(r.TextField,{...p,label:j,disabled:!0,placeholder:"Click right button select a component"})}if(s.type==="component")return e.jsxs(r.Stack,{width:"100%",direction:"row",gap:1,children:[e.jsx(r.Box,{flex:1,children:e.jsx(X,{allComponents:x,label:j,value:l==null?void 0:l.componentId,onChange:(d,v)=>{c||!l?n==null||n({...l&&JSON.parse(JSON.stringify(l)),componentId:v}):typeof l=="object"&&(l.componentId=v)}})}),e.jsx(r.Box,{children:e.jsx(it,{value:l,valueImmutable:c,onChange:n,defaultLocale:b,allComponents:x})})]});if(!s.type||["string","url"].includes(s.type)){const d=s.type==="string"?s.multiline:void 0,v=s.type==="url"?l==null?void 0:l.url:l;return e.jsx(r.TextField,{...p,label:j,value:typeof v=="string"?v:"",multiline:d,minRows:d?2:void 0,maxRows:d?10:void 0,onChange:g=>n==null?void 0:n(s.type==="url"?{...l,url:g.target.value,mediaKitUrl:g.target.value}:g.target.value),InputProps:s.type==="url"?{sx:{pr:0},endAdornment:e.jsxs(r.InputAdornment,{position:"end",children:[e.jsx(F.UploaderButton,{onChange:async({response:g})=>{var C,P,A;const S=((C=g==null?void 0:g.data)==null?void 0:C.url)||((P=g==null?void 0:g.data)==null?void 0:P.fileUrl);let y;S&&(y=await F.getImageSize(S).catch(()=>F.getVideoSize(S)).catch(()=>{}));let k=((A=g==null?void 0:g.data)==null?void 0:A.filename)||"";k&&(k=`mediakit://${k}`),n==null||n({url:S,mediaKitUrl:k,width:y==null?void 0:y.naturalWidth,height:y==null?void 0:y.naturalHeight})}}),e.jsx(r.Tooltip,{title:"If you are using the 'mediaKitUrl' property, please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address.",children:e.jsx(z.InfoRounded,{sx:{cursor:"default"},fontSize:"small"})})]})}:void 0})}return console.error("Unsupported property type",s.type),null}function ot({NumberProps:t,...s}){const{getInputProps:l}=te.unstable_useNumberInput(t),n=l();return e.jsx(r.TextField,{...s,inputProps:n})}const ye=`import React from '@blocklet/pages-kit/builtin/react'
|
|
22
22
|
import { Box } from '@blocklet/pages-kit/builtin/mui/material'
|
|
23
23
|
|
|
24
24
|
export default function () {
|
|
@@ -28,4 +28,4 @@ export default function () {
|
|
|
28
28
|
</Box>
|
|
29
29
|
)
|
|
30
30
|
}`,ve=`console.log('hello')
|
|
31
|
-
`;function ct({value:t}){const{locale:s}=R.useLocaleContext(),
|
|
31
|
+
`;function ct({value:t}){const{locale:s}=R.useLocaleContext(),l=je.useUpdate(),n=N.getYjsValue(t).doc;return I.useEffect(()=>{var c;(c=t.renderer)!=null&&c.script||(n.transact(()=>{t.renderer.script=t.renderer.type==="react-component"?ye:ve}),l())},[t]),e.jsx(r.Box,{sx:{border:1,borderColor:"divider",borderRadius:1,overflow:"hidden"},children:e.jsx(he.CodeEditor,{keyId:t.id,locale:s,language:"typescript",value:t.renderer.script||"",onChange:c=>t.renderer.script=c,typeScriptNoValidation:!1},t.id)})}function at({value:t}){var j,m,h;const{t:s}=R.useLocaleContext(),l=N.getYjsValue(t).doc,{state:{components:n,config:{defaultLocale:c},resources:b},localState:{currentLocale:x}}=B.useStore(),p=B.useAllComponents(),f=((j=n[t.renderer.componentId])==null?void 0:j.data)??((h=(m=b.components)==null?void 0:m[t.renderer.componentId])==null?void 0:h.component),u=D.usePopupState({variant:"dialog"});return e.jsxs(r.Stack,{gap:1,children:[e.jsx(X,{allComponents:p,excludes:[t.id],value:t.renderer.componentId,onChange:(a,i)=>t.renderer.componentId=i}),f&&e.jsxs(e.Fragment,{children:[e.jsxs(r.Stack,{direction:"row",justifyContent:"space-between",alignItems:"center",children:[e.jsx(r.Typography,{variant:"subtitle2",children:s("parameters")}),e.jsx(r.Button,{sx:{minWidth:32,minHeight:32,p:0},...D.bindTrigger(u),children:e.jsx(z.TranslateRounded,{fontSize:"small"})})]}),f.properties&&T.sortBy(Object.values(f.properties),"index").map(({data:a})=>{var i,o,d,v,g,S,y,k,C,P,A,V,W,U,M,K;return e.jsx(r.Box,{children:e.jsx(q,{allComponents:p,defaultLocale:c,component:f,property:a,fullWidth:!0,size:"small",valueImmutable:T.isNil((v=(d=(o=(i=t.renderer.properties)==null?void 0:i[a.id])==null?void 0:o.locales)==null?void 0:d[x])==null?void 0:v.value),value:((k=(y=(S=(g=t.renderer.properties)==null?void 0:g[a.id])==null?void 0:S.locales)==null?void 0:y[x])==null?void 0:k.value)??((V=(A=(P=(C=t.renderer.properties)==null?void 0:C[a.id])==null?void 0:P.locales)==null?void 0:A[c])==null?void 0:V.value)??((U=(W=a.locales)==null?void 0:W[x])==null?void 0:U.defaultValue)??((K=(M=a.locales)==null?void 0:M[c])==null?void 0:K.defaultValue),onChange:$=>{l.transact(()=>{var H,Y,L,J,G;(H=t.renderer).properties??(H.properties={}),(Y=t.renderer.properties)[L=a.id]??(Y[L]={}),(J=t.renderer.properties[a.id]).locales??(J.locales={}),(G=t.renderer.properties[a.id].locales)[x]??(G[x]={}),t.renderer.properties[a.id].locales[x].value=$})}})},a.id)}),e.jsx(ge,{...D.bindDialog(u),component:t,type:"parameters"})]})]})}function X({label:t,options:s,excludes:l,value:n,onChange:c,allComponents:b,...x}){var j;const{t:p}=R.useLocaleContext(),f=s??T.sortBy(Object.values(T.omit(b,...l??[])),"index").map(m=>m.data),u=(typeof n=="string"?(j=b[n])==null?void 0:j.data:void 0)??null;return e.jsx(r.Autocomplete,{...x,size:"small",options:f,autoHighlight:!0,isOptionEqualToValue:(m,h)=>m.id===h.id,getOptionKey:m=>m.id,getOptionLabel:m=>m.name||m.id,renderInput:m=>e.jsx(r.TextField,{label:t||p("component"),...m}),value:u,onChange:(m,h)=>{var i,o,d,v,g,S;let a={};h&&(a={blockletId:(i=b[h==null?void 0:h.id])==null?void 0:i.blockletId,blockletTitle:(o=b[h==null?void 0:h.id])==null?void 0:o.blockletTitle,componentName:((v=(d=b[h==null?void 0:h.id])==null?void 0:d.data)==null?void 0:v.name)||((S=(g=b[h==null?void 0:h.id])==null?void 0:g.data)==null?void 0:S.id)}),c==null||c(m,h==null?void 0:h.id,a)}})}function Se({config:t,allComponents:s,defaultLocale:l,propertiesValue:n,currentLocale:c,onChange:b,props:x}){const{t:p}=R.useLocaleContext(),[f,u]=I.useState(t==null?void 0:t.properties);I.useEffect(()=>{(()=>{var i,o;((i=t==null?void 0:t.renderer)==null?void 0:i.type)==="react-component"&&T.isEmpty(t==null?void 0:t.properties)?Q.transpileAndLoadScript((o=t==null?void 0:t.renderer)==null?void 0:o.script).then(d=>{const v=Q.getPropertiesFromCode(d);u(v)}):u(t==null?void 0:t.properties)})()},[t]);const m=I.useCallback(()=>!t||!f?{}:Object.values(f).reduce((a,{data:i})=>{var d,v,g,S,y;const o=i.key||i.id;return a[i.id]={value:(x==null?void 0:x[o])??((d=n==null?void 0:n[i.id])==null?void 0:d.value)??((g=(v=i.locales)==null?void 0:v[c])==null?void 0:g.defaultValue)??((y=(S=i.locales)==null?void 0:S[l])==null?void 0:y.defaultValue),key:o,id:i.id,type:i.type},a},{}),[f,t,n,c,l])(),h=He.default(m,"key");return e.jsxs(e.Fragment,{children:[e.jsx(r.Typography,{variant:"subtitle1",children:p("maker.properties.parameters")}),e.jsx(r.Stack,{gap:1,children:t&&f&&T.sortBy(Object.values(f),"index").map(({data:a})=>{var i,o;return e.jsx(r.Box,{children:e.jsx(q,{allComponents:s,defaultLocale:l,size:"small",fullWidth:!0,component:t,property:a,valueImmutable:T.isNil((i=n==null?void 0:n[a.id])==null?void 0:i.value),value:(o=m[a.id])==null?void 0:o.value,onChange:d=>{b({path:["properties",a.id],value:{value:d},shouldSync:!(!a.type||me.includes(a.type)),excludeKeys:[],key:a.key||a.id})}})},a.id)})}),e.jsx(r.Box,{sx:{width:"100%"},children:e.jsx(Q.CustomComponentRenderer,{componentId:(t==null?void 0:t.id)||"",renderType:"setting",locale:c,properties:m,dev:{mode:"draft",components:s,defaultLocale:l},props:{...x,onChange:a=>{Object.keys(a).filter(o=>{var d;return a[o]!==((d=h==null?void 0:h[o])==null?void 0:d.value)}).filter(o=>!(o==="locale"&&!Ke.default(h[o],"locale"))).forEach(o=>{const d=h[o];d!=null&&d.id?b({path:["properties",d.id],value:{value:a[o]},shouldSync:!(!d.type||me.includes(d.type)),excludeKeys:[],key:d.key||d.id}):(console.warn("property not found: ",o),Me.default.warning(p("maker.properties.propertyNotFound",{key:o})))})}}})})]})}exports.BasicInfo=be;exports.CustomComponentAutocomplete=X;exports.CustomComponentSettings=st;exports.DefaultReactComponentScriptTemplate=ye;exports.DefaultWebComponentScriptTemplate=ve;exports.ParametersConfig=Se;exports.PropertiesConfig=fe;exports.PropertyValueField=q;
|
package/lib/es/setting.js
CHANGED
|
@@ -522,9 +522,7 @@ function lr({ value: t }) {
|
|
|
522
522
|
onChange: (m) => {
|
|
523
523
|
console.warn(m, JSON.parse(JSON.stringify({ currentPage: a, currentSection: b })));
|
|
524
524
|
},
|
|
525
|
-
props: {
|
|
526
|
-
title: "2"
|
|
527
|
-
}
|
|
525
|
+
props: {}
|
|
528
526
|
}
|
|
529
527
|
)
|
|
530
528
|
] }) });
|
|
@@ -1260,7 +1258,7 @@ function hr({
|
|
|
1260
1258
|
var d, x, y, I, g;
|
|
1261
1259
|
const o = l.key || l.id;
|
|
1262
1260
|
return s[l.id] = {
|
|
1263
|
-
value: (p == null ? void 0 : p[o]) ?? ((d = r == null ? void 0 : r[
|
|
1261
|
+
value: (p == null ? void 0 : p[o]) ?? ((d = r == null ? void 0 : r[l.id]) == null ? void 0 : d.value) ?? ((y = (x = l.locales) == null ? void 0 : x[a]) == null ? void 0 : y.defaultValue) ?? ((g = (I = l.locales) == null ? void 0 : I[n]) == null ? void 0 : g.defaultValue),
|
|
1264
1262
|
key: o,
|
|
1265
1263
|
id: l.id,
|
|
1266
1264
|
type: l.type
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/pages-kit-inner-components",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"description": "Pages Kit inner components library",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -195,7 +195,7 @@
|
|
|
195
195
|
"yjs": "^13.6.18",
|
|
196
196
|
"zustand": "^4.5.5",
|
|
197
197
|
"@blocklet/pages-kit": "^0.4.10",
|
|
198
|
-
"@blocklet/pages-kit-block-studio": "^0.
|
|
198
|
+
"@blocklet/pages-kit-block-studio": "^0.1.1"
|
|
199
199
|
},
|
|
200
200
|
"devDependencies": {
|
|
201
201
|
"@trivago/prettier-plugin-sort-imports": "^5.2.1",
|