@easy-editor/materials-dashboard-text 0.0.18 → 0.0.20

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/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @easy-editor/materials-dashboard-text
2
2
 
3
+ ## 0.0.20
4
+
5
+ ### Patch Changes
6
+
7
+ - fix: component export error
8
+
9
+ ## 0.0.19
10
+
11
+ ### Patch Changes
12
+
13
+ - perf: configure & datasource
14
+ - Updated dependencies
15
+ - @easy-editor/materials-shared@0.0.1
16
+
3
17
  ## 0.0.18
4
18
 
5
19
  ### Patch Changes
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextComponent={},e.React,e.jsxRuntime)}(this,function(e,t,n){"use strict";function o(e){var t,n,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e)){var i=e.length;for(t=0;t<i;t++)e[t]&&(n=o(e[t]))&&(r&&(r+=" "),r+=n)}else for(n in e)e[n]&&(r&&(r+=" "),r+=n);return r}function r(...e){return function(){for(var e,t,n=0,r="",i=arguments.length;n<i;n++)(e=arguments[n])&&(t=o(e))&&(r&&(r+=" "),r+=t);return r}(e)}var i="component-module__container___VbZSk",l="component-module__text___nFUOn",a="component-module__link___20asF",c="component-module__underline___0oAJz",s="component-module__alignLeft___IOvpO",_="component-module__alignCenter___EIwIC",d="component-module__alignRight___p3ReL",u="component-module__valignTop___-5DmK",f="component-module__valignMiddle___i0are",m="component-module__valignBottom___97zzw";function p(e,t){if(!t)return e;const n=t.split(".");let o=e;for(const e of n){if(null==o)return;if("object"!=typeof o)return;o=o[e]}return o}function g(e){return void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[]}!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}(".component-module__container___VbZSk{display:flex;height:100%;width:100%}.component-module__text___nFUOn{display:inline-block;word-break:break-word}.component-module__link___20asF{cursor:pointer;text-decoration:none;transition:opacity .2s ease}.component-module__link___20asF:hover{opacity:.8}.component-module__underline___0oAJz{text-decoration:underline}.component-module__alignLeft___IOvpO{justify-content:flex-start;text-align:left}.component-module__alignCenter___EIwIC{justify-content:center;text-align:center}.component-module__alignRight___p3ReL{justify-content:flex-end;text-align:right}.component-module__valignTop___-5DmK{align-items:flex-start}.component-module__valignMiddle___i0are{align-items:center}.component-module__valignBottom___97zzw{align-items:flex-end}");const y=({ref:e,$data:o,__dataSource:y,fontSize:h=16,fontWeight:x="normal",fontFamily:v="inherit",color:b="#ffffff",textAlign:k="left",verticalAlign:C="middle",lineHeight:j=1.5,letterSpacing:w=0,isLink:M=!1,href:T="",target:A="_blank",underline:I=!1,glowEnable:S=!1,glowColor:E="#00d4ff",glowIntensity:F=1,rotation:z=0,opacity:L=100,background:$="transparent",style:D,onClick:O,onDoubleClick:N,onMouseEnter:R,onMouseLeave:B})=>{const q=t.useMemo(()=>{if(!o)return"";let e=[];if("static"===o.sourceType)e=Array.isArray(o.staticData)?o.staticData:[];else if("global"===o.sourceType&&o.datasourceId){const t=y?.page?.[o.datasourceId];e=g(t)}else if("datasource"===o.sourceType&&o.datasourceId){const t=y?.component?.[o.datasourceId];e=g(t)}const t=function(e,t){return t&&0!==t.length?e.map(e=>{const n={};for(const{componentField:o,sourceField:r}of t)o&&r&&(n[o]=p(e,r));return n}):e}(e,o.fieldMappings);return t.length>0&&void 0!==t[0].text?String(t[0].text):""},[o,y]),H={fontSize:h,fontWeight:x,fontFamily:v,color:b,lineHeight:j,letterSpacing:w,textShadow:S?`0 0 ${10*F}px ${E}, 0 0 ${20*F}px ${E}, 0 0 ${30*F}px ${E}`:void 0},J={...D,transform:0!==z?`rotate(${z}deg)`:void 0,opacity:L/100,backgroundColor:$},K=r(i,(e=>{switch(e){case"left":default:return s;case"center":return _;case"right":return d}})(k),(e=>{switch(e){case"top":return u;case"middle":default:return f;case"bottom":return m}})(C)),U=r(l,M&&a,I&&c);if(M&&T){const t="_blank"===A?"noopener noreferrer":"";return n.jsx("div",{className:K,ref:e,style:J,onClick:O,onDoubleClick:N,onMouseEnter:R,onMouseLeave:B,children:n.jsx("a",{className:U,href:T,rel:t,style:H,target:A,children:q})})}return n.jsx("div",{className:K,ref:e,style:J,onClick:O,onDoubleClick:N,onMouseEnter:R,onMouseLeave:B,children:n.jsx("span",{className:U,style:H,children:q})})};e.Text=y,e.default=y,Object.defineProperty(e,"__esModule",{value:!0})});
1
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextComponent={},e.React,e.jsxRuntime)}(this,function(e,t,o){"use strict";function n(...e){const t=[];for(const o of e)if(o)if("string"==typeof o||"number"==typeof o)t.push(String(o));else if(Array.isArray(o)){const e=n(...o);e&&t.push(e)}else if("object"==typeof o)for(const[e,n]of Object.entries(o))n&&t.push(e);return t.join(" ")}const r=(e,t)=>{if(!t)return e;const o=t.split(".");let n=e;for(const e of o){if(null==n)return;if("object"!=typeof n)return;n=n[e]}return n},i=e=>void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[],a=(e,t)=>{const o=((e,t)=>{if(!e)return[];if("static"===e.sourceType)return Array.isArray(e.staticData)?e.staticData:[];if("global"===e.sourceType&&e.datasourceId){const o=t?.page?.[e.datasourceId];return i(o)}if("datasource"===e.sourceType&&e.datasourceId){const o=t?.component?.[e.datasourceId];return i(o)}return[]})(e,t);return((e,t)=>t&&0!==t.length?e.map(e=>{const o={};for(const{componentField:n,sourceField:i}of t)n&&i&&(o[n]=r(e,i));return o}):e)(o,e?.fieldMappings)};const l=(e,t,o)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...o}},items:t});l("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]);const s=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}];((e=s)=>{l("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}])})(),l("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}]);var c="component-module__container___VbZSk",u="component-module__text___nFUOn",d="component-module__link___20asF",p="component-module__underline___0oAJz",_="component-module__alignLeft___IOvpO",m="component-module__alignCenter___EIwIC",f="component-module__alignRight___p3ReL",g="component-module__valignTop___-5DmK",x="component-module__valignMiddle___i0are",y="component-module__valignBottom___97zzw";!function(e,t){void 0===t&&(t={});var o=t.insertAt;if("undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}(".component-module__container___VbZSk{display:flex;height:100%;width:100%}.component-module__text___nFUOn{display:inline-block;word-break:break-word}.component-module__link___20asF{cursor:pointer;text-decoration:none;transition:opacity .2s ease}.component-module__link___20asF:hover{opacity:.8}.component-module__underline___0oAJz{text-decoration:underline}.component-module__alignLeft___IOvpO{justify-content:flex-start;text-align:left}.component-module__alignCenter___EIwIC{justify-content:center;text-align:center}.component-module__alignRight___p3ReL{justify-content:flex-end;text-align:right}.component-module__valignTop___-5DmK{align-items:flex-start}.component-module__valignMiddle___i0are{align-items:center}.component-module__valignBottom___97zzw{align-items:flex-end}");const h=({ref:e,$data:r,__dataSource:i,fontSize:l=16,fontWeight:s="normal",fontFamily:h="inherit",color:b="#ffffff",textAlign:v="left",verticalAlign:S="middle",lineHeight:k=1.5,letterSpacing:C=0,isLink:E=!1,href:j="",target:V="_blank",underline:M=!1,glowEnable:w=!1,glowColor:P="#00d4ff",glowIntensity:N=1,rotation:T=0,opacity:A=100,background:I="transparent",style:$,onClick:F,onDoubleClick:L,onMouseEnter:z,onMouseLeave:D})=>{const O=function(e,o){return t.useMemo(()=>a(e,o),[e,o])}(r,i),R=t.useMemo(()=>O.length>0&&O[0]?.text?String(O[0].text):"",[O]),B={fontSize:l,fontWeight:s,fontFamily:h,color:b,lineHeight:k,letterSpacing:C,textShadow:w?`0 0 ${10*N}px ${P}, 0 0 ${20*N}px ${P}, 0 0 ${30*N}px ${P}`:void 0},q={...$,transform:0!==T?`rotate(${T}deg)`:void 0,opacity:A/100,backgroundColor:I},H=n(c,(e=>{switch(e){case"left":default:return _;case"center":return m;case"right":return f}})(v),(e=>{switch(e){case"top":return g;case"middle":default:return x;case"bottom":return y}})(S)),J=n(u,E&&d,M&&p);if(E&&j){const t="_blank"===V?"noopener noreferrer":"";return o.jsx("div",{className:H,onClick:F,onDoubleClick:L,onMouseEnter:z,onMouseLeave:D,ref:e,style:q,children:o.jsx("a",{className:J,href:j,rel:t,style:B,target:V,children:R})})}return o.jsx("div",{className:H,onClick:F,onDoubleClick:L,onMouseEnter:z,onMouseLeave:D,ref:e,style:q,children:o.jsx("span",{className:J,style:B,children:R})})};e.Text=h,e.default=h,Object.defineProperty(e,"__esModule",{value:!0})});
package/dist/index.min.js CHANGED
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsText={},e.React,e.jsxRuntime)}(this,function(e,t,o){"use strict";function n(e){var t,o,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e)){var a=e.length;for(t=0;t<a;t++)e[t]&&(o=n(e[t]))&&(r&&(r+=" "),r+=o)}else for(o in e)e[o]&&(r&&(r+=" "),r+=o);return r}function r(...e){return function(){for(var e,t,o=0,r="",a=arguments.length;o<a;o++)(e=arguments[o])&&(t=n(e))&&(r&&(r+=" "),r+=t);return r}(e)}var a="component-module__container___VbZSk",l="component-module__text___nFUOn",i="component-module__link___20asF",s="component-module__underline___0oAJz",c="component-module__alignLeft___IOvpO",p="component-module__alignCenter___EIwIC",d="component-module__alignRight___p3ReL",u="component-module__valignTop___-5DmK",m="component-module__valignMiddle___i0are",f="component-module__valignBottom___97zzw";function g(e,t){if(!t)return e;const o=t.split(".");let n=e;for(const e of o){if(null==n)return;if("object"!=typeof n)return;n=n[e]}return n}function _(e){return void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[]}!function(e,t){void 0===t&&(t={});var o=t.insertAt;if("undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}(".component-module__container___VbZSk{display:flex;height:100%;width:100%}.component-module__text___nFUOn{display:inline-block;word-break:break-word}.component-module__link___20asF{cursor:pointer;text-decoration:none;transition:opacity .2s ease}.component-module__link___20asF:hover{opacity:.8}.component-module__underline___0oAJz{text-decoration:underline}.component-module__alignLeft___IOvpO{justify-content:flex-start;text-align:left}.component-module__alignCenter___EIwIC{justify-content:center;text-align:center}.component-module__alignRight___p3ReL{justify-content:flex-end;text-align:right}.component-module__valignTop___-5DmK{align-items:flex-start}.component-module__valignMiddle___i0are{align-items:center}.component-module__valignBottom___97zzw{align-items:flex-end}");const h=(e,t,o)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...o}},items:t}),x={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},b="EasyEditorMaterialsText",y=e=>({sourceType:"static",staticData:[{text:e}],fieldMappings:[{componentField:"text",sourceField:"text"}]});const S={componentName:b,title:"文本",group:"basic",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-text",version:"0.0.18",globalName:b,componentName:b},configure:{props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[x,h("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),h("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"content",title:"内容",items:[{name:"isLink",title:"作为链接",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"href",title:"链接地址",setter:"StringSetter"},{name:"target",title:"打开方式",setter:{componentName:"SelectSetter",props:{options:[{label:"新窗口",value:"_blank"},{label:"当前窗口",value:"_self"}]}},extraProps:{defaultValue:"_blank"}}]},{type:"group",key:"font",title:"字体",items:[{name:"fontSize",title:"字体大小",setter:"NumberSetter",extraProps:{defaultValue:16}},{name:"fontWeight",title:"字体粗细",setter:{componentName:"SelectSetter",props:{options:[{label:"正常",value:"normal"},{label:"粗体",value:"bold"}]}},extraProps:{defaultValue:"normal"}},{name:"color",title:"颜色",setter:"ColorSetter",extraProps:{defaultValue:"#ffffff"}},{name:"lineHeight",title:"行高",setter:"NumberSetter",extraProps:{defaultValue:1.5}}]},{type:"group",key:"align",title:"对齐",items:[{name:"textAlign",title:"水平对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"左",value:"left"},{label:"中",value:"center"},{label:"右",value:"right"}]}},extraProps:{defaultValue:"left"}},{name:"verticalAlign",title:"垂直对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"上",value:"top"},{label:"中",value:"middle"},{label:"下",value:"bottom"}]}},extraProps:{defaultValue:"middle"}}]},{type:"group",key:"effect",title:"效果",items:[{name:"underline",title:"下划线",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowColor",title:"发光颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}}]}]}],{padding:"6px 16px 12px"})]},{type:"group",key:"data",title:"数据",items:[x,{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"text",label:"text",type:"string",required:!0,description:"文本内容"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}}]},{type:"group",key:"advanced",title:"高级",items:[x,h("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}]}},extraProps:{label:!1}}]),h("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}])]}]}],component:{},supports:{},advanced:{}},snippets:[{title:"普通文本",screenshot:"",schema:{componentName:b,title:"普通文本",props:{fontSize:16,color:"#ffffff",rotation:0,opacity:100,background:"transparent",$data:y("普通文本")},$dashboard:{rect:{width:120,height:40}}}},{title:"标题文本",screenshot:"",schema:{componentName:b,title:"标题文本",props:{fontSize:32,fontWeight:"bold",color:"#ffffff",textAlign:"center",rotation:0,opacity:100,background:"transparent",$data:y("标题文本")},$dashboard:{rect:{width:200,height:60}}}},{title:"发光标题",screenshot:"",schema:{componentName:b,title:"发光标题",props:{fontSize:36,fontWeight:"bold",color:"#00d4ff",textAlign:"center",glowEnable:!0,glowColor:"#00d4ff",glowIntensity:1.5,rotation:0,opacity:100,background:"transparent",$data:y("发光标题")},$dashboard:{rect:{width:240,height:80}}}},{title:"链接文本",screenshot:"",schema:{componentName:b,title:"链接文本",props:{fontSize:16,color:"#00d4ff",isLink:!0,href:"https://easy-editor-docs.vercel.app/",target:"_blank",underline:!0,rotation:0,opacity:100,background:"transparent",$data:y("点击跳转")},$dashboard:{rect:{width:120,height:40}}}},{title:"标签文本",screenshot:"",schema:{componentName:b,title:"标签文本",props:{fontSize:14,color:"#ffffff",textAlign:"center",verticalAlign:"middle",rotation:0,opacity:100,background:"rgba(0, 212, 255, 0.2)",$data:y("标签")},$dashboard:{rect:{width:80,height:32}}}}]};e.component=({ref:e,$data:n,__dataSource:h,fontSize:x=16,fontWeight:b="normal",fontFamily:y="inherit",color:S="#ffffff",textAlign:v="left",verticalAlign:k="middle",lineHeight:w=1.5,letterSpacing:N=0,isLink:V=!1,href:P="",target:C="_blank",underline:E=!1,glowEnable:$=!1,glowColor:A="#00d4ff",glowIntensity:M=1,rotation:T=0,opacity:j=100,background:z="transparent",style:I,onClick:F,onDoubleClick:L,onMouseEnter:D,onMouseLeave:R})=>{const O=t.useMemo(()=>{if(!n)return"";let e=[];if("static"===n.sourceType)e=Array.isArray(n.staticData)?n.staticData:[];else if("global"===n.sourceType&&n.datasourceId){const t=h?.page?.[n.datasourceId];e=_(t)}else if("datasource"===n.sourceType&&n.datasourceId){const t=h?.component?.[n.datasourceId];e=_(t)}const t=function(e,t){return t&&0!==t.length?e.map(e=>{const o={};for(const{componentField:n,sourceField:r}of t)n&&r&&(o[n]=g(e,r));return o}):e}(e,n.fieldMappings);return t.length>0&&void 0!==t[0].text?String(t[0].text):""},[n,h]),W={fontSize:x,fontWeight:b,fontFamily:y,color:S,lineHeight:w,letterSpacing:N,textShadow:$?`0 0 ${10*M}px ${A}, 0 0 ${20*M}px ${A}, 0 0 ${30*M}px ${A}`:void 0},B={...I,transform:0!==T?`rotate(${T}deg)`:void 0,opacity:j/100,backgroundColor:z},q=r(a,(e=>{switch(e){case"left":default:return c;case"center":return p;case"right":return d}})(v),(e=>{switch(e){case"top":return u;case"middle":default:return m;case"bottom":return f}})(k)),H=r(l,V&&i,E&&s);if(V&&P){const t="_blank"===C?"noopener noreferrer":"";return o.jsx("div",{className:q,ref:e,style:B,onClick:F,onDoubleClick:L,onMouseEnter:D,onMouseLeave:R,children:o.jsx("a",{className:H,href:P,rel:t,style:W,target:C,children:O})})}return o.jsx("div",{className:q,ref:e,style:B,onClick:F,onDoubleClick:L,onMouseEnter:D,onMouseLeave:R,children:o.jsx("span",{className:H,style:W,children:O})})},e.meta=S});
1
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsText={},e.React,e.jsxRuntime)}(this,function(e,t,o){"use strict";function n(...e){const t=[];for(const o of e)if(o)if("string"==typeof o||"number"==typeof o)t.push(String(o));else if(Array.isArray(o)){const e=n(...o);e&&t.push(e)}else if("object"==typeof o)for(const[e,n]of Object.entries(o))n&&t.push(e);return t.join(" ")}const r=(e,t)=>{if(!t)return e;const o=t.split(".");let n=e;for(const e of o){if(null==n)return;if("object"!=typeof n)return;n=n[e]}return n},a=e=>void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[],l=(e,t)=>{const o=((e,t)=>{if(!e)return[];if("static"===e.sourceType)return Array.isArray(e.staticData)?e.staticData:[];if("global"===e.sourceType&&e.datasourceId){const o=t?.page?.[e.datasourceId];return a(o)}if("datasource"===e.sourceType&&e.datasourceId){const o=t?.component?.[e.datasourceId];return a(o)}return[]})(e,t);return((e,t)=>t&&0!==t.length?e.map(e=>{const o={};for(const{componentField:n,sourceField:a}of t)n&&a&&(o[n]=r(e,a));return o}):e)(o,e?.fieldMappings)};const i=(e,t)=>{const o=Array.isArray(e)?e:[e],n=o[0]||{};return{sourceType:"static",staticData:o,fieldMappings:Object.keys(n).map(e=>({componentField:e,sourceField:e}))}},s=(e,t,o)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...o}},items:t}),c={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},p=s("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),d=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}],u=((e=d)=>s("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}]))(),m=s("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}]);var f="component-module__container___VbZSk",_="component-module__text___nFUOn",g="component-module__link___20asF",h="component-module__underline___0oAJz",x="component-module__alignLeft___IOvpO",b="component-module__alignCenter___EIwIC",y="component-module__alignRight___p3ReL",S="component-module__valignTop___-5DmK",v="component-module__valignMiddle___i0are",k="component-module__valignBottom___97zzw";!function(e,t){void 0===t&&(t={});var o=t.insertAt;if("undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}(".component-module__container___VbZSk{display:flex;height:100%;width:100%}.component-module__text___nFUOn{display:inline-block;word-break:break-word}.component-module__link___20asF{cursor:pointer;text-decoration:none;transition:opacity .2s ease}.component-module__link___20asF:hover{opacity:.8}.component-module__underline___0oAJz{text-decoration:underline}.component-module__alignLeft___IOvpO{justify-content:flex-start;text-align:left}.component-module__alignCenter___EIwIC{justify-content:center;text-align:center}.component-module__alignRight___p3ReL{justify-content:flex-end;text-align:right}.component-module__valignTop___-5DmK{align-items:flex-start}.component-module__valignMiddle___i0are{align-items:center}.component-module__valignBottom___97zzw{align-items:flex-end}");const w=((e,t)=>({props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[c,p,e]},{type:"group",key:"data",title:"数据",items:[c,t]},{type:"group",key:"advanced",title:"高级",items:[c,u,m]}]}],component:{},supports:{},advanced:{}}))(s("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"content",title:"内容",items:[{name:"isLink",title:"作为链接",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"href",title:"链接地址",setter:"StringSetter"},{name:"target",title:"打开方式",setter:{componentName:"SelectSetter",props:{options:[{label:"新窗口",value:"_blank"},{label:"当前窗口",value:"_self"}]}},extraProps:{defaultValue:"_blank"}}]},{type:"group",key:"font",title:"字体",items:[{name:"fontSize",title:"字体大小",setter:"NumberSetter",extraProps:{defaultValue:16}},{name:"fontWeight",title:"字体粗细",setter:{componentName:"SelectSetter",props:{options:[{label:"正常",value:"normal"},{label:"粗体",value:"bold"}]}},extraProps:{defaultValue:"normal"}},{name:"color",title:"颜色",setter:"ColorSetter",extraProps:{defaultValue:"#ffffff"}},{name:"lineHeight",title:"行高",setter:"NumberSetter",extraProps:{defaultValue:1.5}}]},{type:"group",key:"align",title:"对齐",items:[{name:"textAlign",title:"水平对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"左",value:"left"},{label:"中",value:"center"},{label:"右",value:"right"}]}},extraProps:{defaultValue:"left"}},{name:"verticalAlign",title:"垂直对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"上",value:"top"},{label:"中",value:"middle"},{label:"下",value:"bottom"}]}},extraProps:{defaultValue:"middle"}}]},{type:"group",key:"effect",title:"效果",items:[{name:"underline",title:"下划线",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowColor",title:"发光颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}}]}]}],{padding:"6px 16px 12px"}),{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"text",label:"text",type:"string",required:!0,description:"文本内容"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}}),N="EasyEditorMaterialsText";const V={componentName:N,title:"文本",group:"basic",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-text",version:"0.0.20",globalName:N,componentName:N},configure:w,snippets:[{title:"普通文本",screenshot:"",schema:{componentName:N,title:"普通文本",props:{fontSize:16,color:"#ffffff",rotation:0,opacity:100,background:"transparent",$data:i({text:"普通文本"})},$dashboard:{rect:{width:120,height:40}}}},{title:"标题文本",screenshot:"",schema:{componentName:N,title:"标题文本",props:{fontSize:32,fontWeight:"bold",color:"#ffffff",textAlign:"center",rotation:0,opacity:100,background:"transparent",$data:i({text:"标题文本"})},$dashboard:{rect:{width:200,height:60}}}},{title:"发光标题",screenshot:"",schema:{componentName:N,title:"发光标题",props:{fontSize:36,fontWeight:"bold",color:"#00d4ff",textAlign:"center",glowEnable:!0,glowColor:"#00d4ff",glowIntensity:1.5,rotation:0,opacity:100,background:"transparent",$data:i({text:"发光标题"})},$dashboard:{rect:{width:240,height:80}}}},{title:"链接文本",screenshot:"",schema:{componentName:N,title:"链接文本",props:{fontSize:16,color:"#00d4ff",isLink:!0,href:"https://easy-editor-docs.vercel.app/",target:"_blank",underline:!0,rotation:0,opacity:100,background:"transparent",$data:i({text:"点击跳转"})},$dashboard:{rect:{width:120,height:40}}}},{title:"标签文本",screenshot:"",schema:{componentName:N,title:"标签文本",props:{fontSize:14,color:"#ffffff",textAlign:"center",verticalAlign:"middle",rotation:0,opacity:100,background:"rgba(0, 212, 255, 0.2)",$data:i({text:"标签"})},$dashboard:{rect:{width:80,height:32}}}}]};e.component=({ref:e,$data:r,__dataSource:a,fontSize:i=16,fontWeight:s="normal",fontFamily:c="inherit",color:p="#ffffff",textAlign:d="left",verticalAlign:u="middle",lineHeight:m=1.5,letterSpacing:w=0,isLink:N=!1,href:V="",target:P="_blank",underline:C=!1,glowEnable:E=!1,glowColor:$="#00d4ff",glowIntensity:A=1,rotation:j=0,opacity:M=100,background:T="transparent",style:z,onClick:I,onDoubleClick:F,onMouseEnter:L,onMouseLeave:D})=>{const O=function(e,o){return t.useMemo(()=>l(e,o),[e,o])}(r,a),R=t.useMemo(()=>O.length>0&&O[0]?.text?String(O[0].text):"",[O]),W={fontSize:i,fontWeight:s,fontFamily:c,color:p,lineHeight:m,letterSpacing:w,textShadow:E?`0 0 ${10*A}px ${$}, 0 0 ${20*A}px ${$}, 0 0 ${30*A}px ${$}`:void 0},B={...z,transform:0!==j?`rotate(${j}deg)`:void 0,opacity:M/100,backgroundColor:T},q=n(f,(e=>{switch(e){case"left":default:return x;case"center":return b;case"right":return y}})(d),(e=>{switch(e){case"top":return S;case"middle":default:return v;case"bottom":return k}})(u)),H=n(_,N&&g,C&&h);if(N&&V){const t="_blank"===P?"noopener noreferrer":"";return o.jsx("div",{className:q,onClick:I,onDoubleClick:F,onMouseEnter:L,onMouseLeave:D,ref:e,style:B,children:o.jsx("a",{className:H,href:V,rel:t,style:W,target:P,children:R})})}return o.jsx("div",{className:q,onClick:I,onDoubleClick:F,onMouseEnter:L,onMouseLeave:D,ref:e,style:B,children:o.jsx("span",{className:H,style:W,children:R})})},e.meta=V});
package/dist/meta.min.js CHANGED
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextMeta={})}(this,function(e){"use strict";const t=(e,t,a)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...a}},items:t}),a={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},o="EasyEditorMaterialsText",r=e=>({sourceType:"static",staticData:[{text:e}],fieldMappings:[{componentField:"text",sourceField:"text"}]});const l={componentName:o,title:"文本",group:"basic",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-text",version:"0.0.18",globalName:o,componentName:o},configure:{props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[a,t("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),t("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"content",title:"内容",items:[{name:"isLink",title:"作为链接",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"href",title:"链接地址",setter:"StringSetter"},{name:"target",title:"打开方式",setter:{componentName:"SelectSetter",props:{options:[{label:"新窗口",value:"_blank"},{label:"当前窗口",value:"_self"}]}},extraProps:{defaultValue:"_blank"}}]},{type:"group",key:"font",title:"字体",items:[{name:"fontSize",title:"字体大小",setter:"NumberSetter",extraProps:{defaultValue:16}},{name:"fontWeight",title:"字体粗细",setter:{componentName:"SelectSetter",props:{options:[{label:"正常",value:"normal"},{label:"粗体",value:"bold"}]}},extraProps:{defaultValue:"normal"}},{name:"color",title:"颜色",setter:"ColorSetter",extraProps:{defaultValue:"#ffffff"}},{name:"lineHeight",title:"行高",setter:"NumberSetter",extraProps:{defaultValue:1.5}}]},{type:"group",key:"align",title:"对齐",items:[{name:"textAlign",title:"水平对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"左",value:"left"},{label:"中",value:"center"},{label:"右",value:"right"}]}},extraProps:{defaultValue:"left"}},{name:"verticalAlign",title:"垂直对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"上",value:"top"},{label:"中",value:"middle"},{label:"下",value:"bottom"}]}},extraProps:{defaultValue:"middle"}}]},{type:"group",key:"effect",title:"效果",items:[{name:"underline",title:"下划线",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowColor",title:"发光颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}}]}]}],{padding:"6px 16px 12px"})]},{type:"group",key:"data",title:"数据",items:[a,{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"text",label:"text",type:"string",required:!0,description:"文本内容"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}}]},{type:"group",key:"advanced",title:"高级",items:[a,t("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}]}},extraProps:{label:!1}}]),t("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}])]}]}],component:{},supports:{},advanced:{}},snippets:[{title:"普通文本",screenshot:"",schema:{componentName:o,title:"普通文本",props:{fontSize:16,color:"#ffffff",rotation:0,opacity:100,background:"transparent",$data:r("普通文本")},$dashboard:{rect:{width:120,height:40}}}},{title:"标题文本",screenshot:"",schema:{componentName:o,title:"标题文本",props:{fontSize:32,fontWeight:"bold",color:"#ffffff",textAlign:"center",rotation:0,opacity:100,background:"transparent",$data:r("标题文本")},$dashboard:{rect:{width:200,height:60}}}},{title:"发光标题",screenshot:"",schema:{componentName:o,title:"发光标题",props:{fontSize:36,fontWeight:"bold",color:"#00d4ff",textAlign:"center",glowEnable:!0,glowColor:"#00d4ff",glowIntensity:1.5,rotation:0,opacity:100,background:"transparent",$data:r("发光标题")},$dashboard:{rect:{width:240,height:80}}}},{title:"链接文本",screenshot:"",schema:{componentName:o,title:"链接文本",props:{fontSize:16,color:"#00d4ff",isLink:!0,href:"https://easy-editor-docs.vercel.app/",target:"_blank",underline:!0,rotation:0,opacity:100,background:"transparent",$data:r("点击跳转")},$dashboard:{rect:{width:120,height:40}}}},{title:"标签文本",screenshot:"",schema:{componentName:o,title:"标签文本",props:{fontSize:14,color:"#ffffff",textAlign:"center",verticalAlign:"middle",rotation:0,opacity:100,background:"rgba(0, 212, 255, 0.2)",$data:r("标签")},$dashboard:{rect:{width:80,height:32}}}}]};e.meta=l});
1
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextMeta={})}(this,function(e){"use strict";const t=(e,t)=>{const a=Array.isArray(e)?e:[e],r=a[0]||{};return{sourceType:"static",staticData:a,fieldMappings:Object.keys(r).map(e=>({componentField:e,sourceField:e}))}},a=(e,t,a)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...a}},items:t}),r={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},o=a("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),l=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}],i=((e=l)=>a("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}]))(),n=a("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}]);const s=((e,t)=>({props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[r,o,e]},{type:"group",key:"data",title:"数据",items:[r,t]},{type:"group",key:"advanced",title:"高级",items:[r,i,n]}]}],component:{},supports:{},advanced:{}}))(a("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"content",title:"内容",items:[{name:"isLink",title:"作为链接",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"href",title:"链接地址",setter:"StringSetter"},{name:"target",title:"打开方式",setter:{componentName:"SelectSetter",props:{options:[{label:"新窗口",value:"_blank"},{label:"当前窗口",value:"_self"}]}},extraProps:{defaultValue:"_blank"}}]},{type:"group",key:"font",title:"字体",items:[{name:"fontSize",title:"字体大小",setter:"NumberSetter",extraProps:{defaultValue:16}},{name:"fontWeight",title:"字体粗细",setter:{componentName:"SelectSetter",props:{options:[{label:"正常",value:"normal"},{label:"粗体",value:"bold"}]}},extraProps:{defaultValue:"normal"}},{name:"color",title:"颜色",setter:"ColorSetter",extraProps:{defaultValue:"#ffffff"}},{name:"lineHeight",title:"行高",setter:"NumberSetter",extraProps:{defaultValue:1.5}}]},{type:"group",key:"align",title:"对齐",items:[{name:"textAlign",title:"水平对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"左",value:"left"},{label:"中",value:"center"},{label:"右",value:"right"}]}},extraProps:{defaultValue:"left"}},{name:"verticalAlign",title:"垂直对齐",setter:{componentName:"SegmentedSetter",props:{options:[{label:"上",value:"top"},{label:"中",value:"middle"},{label:"下",value:"bottom"}]}},extraProps:{defaultValue:"middle"}}]},{type:"group",key:"effect",title:"效果",items:[{name:"underline",title:"下划线",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}},{name:"glowColor",title:"发光颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}}]}]}],{padding:"6px 16px 12px"}),{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"text",label:"text",type:"string",required:!0,description:"文本内容"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}}),p="EasyEditorMaterialsText";const d={componentName:p,title:"文本",group:"basic",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-text",version:"0.0.20",globalName:p,componentName:p},configure:s,snippets:[{title:"普通文本",screenshot:"",schema:{componentName:p,title:"普通文本",props:{fontSize:16,color:"#ffffff",rotation:0,opacity:100,background:"transparent",$data:t({text:"普通文本"})},$dashboard:{rect:{width:120,height:40}}}},{title:"标题文本",screenshot:"",schema:{componentName:p,title:"标题文本",props:{fontSize:32,fontWeight:"bold",color:"#ffffff",textAlign:"center",rotation:0,opacity:100,background:"transparent",$data:t({text:"标题文本"})},$dashboard:{rect:{width:200,height:60}}}},{title:"发光标题",screenshot:"",schema:{componentName:p,title:"发光标题",props:{fontSize:36,fontWeight:"bold",color:"#00d4ff",textAlign:"center",glowEnable:!0,glowColor:"#00d4ff",glowIntensity:1.5,rotation:0,opacity:100,background:"transparent",$data:t({text:"发光标题"})},$dashboard:{rect:{width:240,height:80}}}},{title:"链接文本",screenshot:"",schema:{componentName:p,title:"链接文本",props:{fontSize:16,color:"#00d4ff",isLink:!0,href:"https://easy-editor-docs.vercel.app/",target:"_blank",underline:!0,rotation:0,opacity:100,background:"transparent",$data:t({text:"点击跳转"})},$dashboard:{rect:{width:120,height:40}}}},{title:"标签文本",screenshot:"",schema:{componentName:p,title:"标签文本",props:{fontSize:14,color:"#ffffff",textAlign:"center",verticalAlign:"middle",rotation:0,opacity:100,background:"rgba(0, 212, 255, 0.2)",$data:t({text:"标签"})},$dashboard:{rect:{width:80,height:32}}}}]};e.default=d,e.meta=d,Object.defineProperty(e,"__esModule",{value:!0})});
@@ -1,10 +1,10 @@
1
- /**
2
- * @easy-editor/easypack configuration
3
- * @type {import('@easy-editor/easypack').EasypackConfig}
4
- */
5
- export default {
6
- preset: 'material',
7
- dev: {
8
- port: 5001,
9
- },
10
- }
1
+ /**
2
+ * @easy-editor/easypack configuration
3
+ * @type {import('@easy-editor/easypack').EasypackConfig}
4
+ */
5
+ export default {
6
+ preset: 'material',
7
+ dev: {
8
+ port: 5001,
9
+ },
10
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@easy-editor/materials-dashboard-text",
3
- "version": "0.0.18",
3
+ "version": "0.0.20",
4
4
  "description": "Text component for EasyEditor dashboard",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -45,7 +45,7 @@
45
45
  "react-dom": "^18 || ^19"
46
46
  },
47
47
  "dependencies": {
48
- "@easy-editor/materials-shared": "0.0.0"
48
+ "@easy-editor/materials-shared": "0.0.1"
49
49
  },
50
50
  "scripts": {
51
51
  "dev": "easypack dev",
package/src/component.tsx CHANGED
@@ -3,86 +3,14 @@
3
3
  * 文本组件 - 支持普通文本、链接、标题、发光效果
4
4
  */
5
5
 
6
- import type { CSSProperties, Ref } from 'react'
7
- import { useMemo } from 'react'
8
- import { cn } from '@easy-editor/materials-shared'
6
+ import { useMemo, type CSSProperties } from 'react'
7
+ import { cn, type MaterialComponet, useDataSource } from '@easy-editor/materials-shared'
9
8
  import styles from './component.module.css'
10
9
 
11
10
  export type TextAlign = 'left' | 'center' | 'right'
12
11
  export type VerticalAlign = 'top' | 'middle' | 'bottom'
13
12
 
14
- /** 数据配置类型(来自 DataSetter) */
15
- interface DataConfig {
16
- /** 数据源类型:具体数据 | 数据源 | 全局数据源 */
17
- sourceType: 'static' | 'datasource' | 'global'
18
- /** 静态数据(sourceType === 'static') */
19
- staticData?: unknown[]
20
- /** 数据源 ID(sourceType === 'datasource' | 'global') */
21
- datasourceId?: string
22
- /** 字段映射配置 */
23
- fieldMappings?: Array<{
24
- componentField: string
25
- sourceField: string
26
- }>
27
- }
28
-
29
- /** 根据路径从对象中获取值 */
30
- function getValueByPath(obj: unknown, path: string): unknown {
31
- if (!path) return obj
32
- const keys = path.split('.')
33
- let current: unknown = obj
34
- for (const key of keys) {
35
- if (current === null || current === undefined) return undefined
36
- if (typeof current !== 'object') return undefined
37
- current = (current as Record<string, unknown>)[key]
38
- }
39
- return current
40
- }
41
-
42
- /** 从数据源数据中提取数组 */
43
- function extractDataFromSource(dsData: unknown): unknown[] {
44
- if (dsData === undefined) return []
45
-
46
- if (Array.isArray(dsData)) {
47
- return dsData
48
- }
49
-
50
- if (dsData && typeof dsData === 'object') {
51
- return [dsData]
52
- }
53
-
54
- return []
55
- }
56
-
57
- /** 应用字段映射 */
58
- function applyFieldMappings(
59
- rawData: unknown[],
60
- mappings?: Array<{ componentField: string; sourceField: string }>,
61
- ): Record<string, unknown>[] {
62
- if (!mappings || mappings.length === 0) {
63
- return rawData as Record<string, unknown>[]
64
- }
65
-
66
- return rawData.map(item => {
67
- const result: Record<string, unknown> = {}
68
- for (const { componentField, sourceField } of mappings) {
69
- if (componentField && sourceField) {
70
- result[componentField] = getValueByPath(item, sourceField)
71
- }
72
- }
73
- return result
74
- })
75
- }
76
-
77
- export interface TextProps {
78
- ref?: Ref<HTMLDivElement>
79
- /** 数据配置(来自 $data extraProp) */
80
- $data?: DataConfig
81
- /** 数据源数据(由渲染器 HOC 传递) */
82
- __dataSource?: {
83
- component: Record<string, unknown>
84
- page: Record<string, unknown>
85
- }
13
+ export interface TextProps extends MaterialComponet {
86
14
  /** 字体大小 */
87
15
  fontSize?: number
88
16
  /** 字体粗细 */
@@ -113,16 +41,6 @@ export interface TextProps {
113
41
  glowColor?: string
114
42
  /** 发光强度 */
115
43
  glowIntensity?: number
116
- /** 旋转角度 */
117
- rotation?: number
118
- /** 不透明度 (0-100) */
119
- opacity?: number
120
- /** 背景颜色 */
121
- background?: string
122
- /** 显隐控制 */
123
- condition?: boolean
124
- /** 外部样式 */
125
- style?: CSSProperties
126
44
  /** 事件处理 */
127
45
  onClick?: (e: React.MouseEvent) => void
128
46
  onDoubleClick?: (e: React.MouseEvent) => void
@@ -184,35 +102,13 @@ export const Text: React.FC<TextProps> = ({
184
102
  onMouseEnter,
185
103
  onMouseLeave,
186
104
  }) => {
187
- // 解析数据配置,获取实际显示内容
188
- const resolvedContent = useMemo(() => {
189
- if (!$data) return ''
190
-
191
- let rawData: unknown[] = []
192
-
193
- if ($data.sourceType === 'static') {
194
- // 静态数据:直接使用
195
- rawData = Array.isArray($data.staticData) ? $data.staticData : []
196
- } else if ($data.sourceType === 'global' && $data.datasourceId) {
197
- // 全局数据源:从页面数据源获取
198
- const dsData = __dataSource?.page?.[$data.datasourceId]
199
- rawData = extractDataFromSource(dsData)
200
- } else if ($data.sourceType === 'datasource' && $data.datasourceId) {
201
- // 组件数据源:从组件数据源获取
202
- const dsData = __dataSource?.component?.[$data.datasourceId]
203
- rawData = extractDataFromSource(dsData)
204
- }
205
-
206
- // 应用字段映射
207
- const mappedData = applyFieldMappings(rawData, $data.fieldMappings)
208
-
209
- // 取第一条数据的 text 字段作为显示内容
210
- if (mappedData.length > 0 && mappedData[0].text !== undefined) {
211
- return String(mappedData[0].text)
105
+ const dataSource = useDataSource($data, __dataSource)
106
+ const data = useMemo<string>(() => {
107
+ if (dataSource.length > 0 && dataSource[0]?.text) {
108
+ return String(dataSource[0].text)
212
109
  }
213
-
214
110
  return ''
215
- }, [$data, __dataSource])
111
+ }, [dataSource])
216
112
 
217
113
  // 计算发光效果
218
114
  const textShadow = glowEnable
@@ -237,11 +133,7 @@ export const Text: React.FC<TextProps> = ({
237
133
  backgroundColor: background,
238
134
  }
239
135
 
240
- const containerClass = cn(
241
- styles.container,
242
- getAlignClass(textAlign),
243
- getValignClass(verticalAlign),
244
- )
136
+ const containerClass = cn(styles.container, getAlignClass(textAlign), getValignClass(verticalAlign))
245
137
 
246
138
  const textClass = cn(styles.text, isLink && styles.link, underline && styles.underline)
247
139
 
@@ -251,15 +143,15 @@ export const Text: React.FC<TextProps> = ({
251
143
  return (
252
144
  <div
253
145
  className={containerClass}
254
- ref={ref}
255
- style={containerStyle}
256
146
  onClick={onClick}
257
147
  onDoubleClick={onDoubleClick}
258
148
  onMouseEnter={onMouseEnter}
259
149
  onMouseLeave={onMouseLeave}
150
+ ref={ref}
151
+ style={containerStyle}
260
152
  >
261
153
  <a className={textClass} href={href} rel={relValue} style={textStyle} target={target}>
262
- {resolvedContent}
154
+ {data}
263
155
  </a>
264
156
  </div>
265
157
  )
@@ -269,15 +161,15 @@ export const Text: React.FC<TextProps> = ({
269
161
  return (
270
162
  <div
271
163
  className={containerClass}
272
- ref={ref}
273
- style={containerStyle}
274
164
  onClick={onClick}
275
165
  onDoubleClick={onDoubleClick}
276
166
  onMouseEnter={onMouseEnter}
277
167
  onMouseLeave={onMouseLeave}
168
+ ref={ref}
169
+ style={containerStyle}
278
170
  >
279
171
  <span className={textClass} style={textStyle}>
280
- {resolvedContent}
172
+ {data}
281
173
  </span>
282
174
  </div>
283
175
  )
package/src/configure.ts CHANGED
@@ -1,103 +1,12 @@
1
1
  /**
2
2
  * Text Configure
3
- * 文本组件配置 - 使用新的三 Tab 结构
3
+ * 文本组件配置
4
4
  */
5
5
 
6
- import type { Configure, FieldConfig } from '@easy-editor/core'
6
+ import type { FieldConfig } from '@easy-editor/core'
7
+ import { createCollapseGroup, createDataConfigGroup, createStandardConfigure } from '@easy-editor/materials-shared'
7
8
 
8
- /** 创建折叠组配置 */
9
- const createCollapseGroup = (title: string, items: FieldConfig[], props?: Record<string, unknown>): FieldConfig => ({
10
- type: 'group',
11
- title,
12
- setter: {
13
- componentName: 'CollapseSetter',
14
- props: {
15
- icon: false,
16
- ...props,
17
- },
18
- },
19
- items,
20
- })
21
-
22
- const globalConfigGroup: FieldConfig = {
23
- name: 'nodeInfo',
24
- title: '节点信息',
25
- setter: 'NodeInfoSetter',
26
- extraProps: {
27
- // @ts-expect-error label is not a valid extra prop
28
- label: false,
29
- },
30
- }
31
-
32
- /** 基础配置 - 所有组件通用 */
33
- const basicConfigGroup: FieldConfig = createCollapseGroup('基础配置', [
34
- {
35
- name: 'title',
36
- title: '标题',
37
- setter: 'StringSetter',
38
- extraProps: {
39
- getValue(target) {
40
- return target.getExtraPropValue('title')
41
- },
42
- setValue(target, value) {
43
- target.setExtraPropValue('title', value)
44
- },
45
- },
46
- },
47
- {
48
- name: 'rect',
49
- title: '位置尺寸',
50
- setter: 'RectSetter',
51
- extraProps: {
52
- getValue(target) {
53
- return target.getExtraPropValue('$dashboard.rect')
54
- },
55
- setValue(target, value) {
56
- target.setExtraPropValue('$dashboard.rect', value)
57
- },
58
- },
59
- },
60
- {
61
- name: 'rotation',
62
- title: '旋转角度',
63
- setter: {
64
- componentName: 'SliderSetter',
65
- props: {
66
- min: 0,
67
- max: 360,
68
- suffix: '°',
69
- },
70
- },
71
- extraProps: {
72
- defaultValue: 0,
73
- },
74
- },
75
- {
76
- name: 'opacity',
77
- title: '不透明度',
78
- setter: {
79
- componentName: 'SliderSetter',
80
- props: {
81
- min: 0,
82
- max: 100,
83
- suffix: '%',
84
- },
85
- },
86
- extraProps: {
87
- defaultValue: 100,
88
- },
89
- },
90
- {
91
- name: 'background',
92
- title: '背景颜色',
93
- setter: 'ColorSetter',
94
- extraProps: {
95
- defaultValue: 'transparent',
96
- },
97
- },
98
- ])
99
-
100
- /** 组件配置 - 文本组件独有 */
9
+ /** 组件配置 */
101
10
  const componentConfigGroup: FieldConfig = createCollapseGroup(
102
11
  '组件配置',
103
12
  [
@@ -274,115 +183,8 @@ const componentConfigGroup: FieldConfig = createCollapseGroup(
274
183
  )
275
184
 
276
185
  /** 数据配置 */
277
- const dataConfigGroup: FieldConfig = {
278
- name: '$data',
279
- title: '数据配置',
280
- setter: {
281
- componentName: 'DataSetter',
282
- props: {
283
- expectedFields: [
284
- { name: 'text', label: 'text', type: 'string', required: true, description: '文本内容' },
285
- ],
286
- showPreview: true,
287
- previewLimit: 10,
288
- },
289
- },
290
- extraProps: {
291
- // @ts-ignore
292
- label: false,
293
- },
294
- }
295
-
296
- /** 事件绑定配置 */
297
- const eventConfigGroup: FieldConfig = createCollapseGroup('事件绑定', [
298
- {
299
- name: 'events',
300
- title: '事件',
301
- setter: {
302
- componentName: 'EventSetter',
303
- props: {
304
- events: [
305
- {
306
- title: '点击事件',
307
- children: [
308
- { label: '点击', value: 'onClick', description: '鼠标点击时触发' },
309
- { label: '双击', value: 'onDoubleClick', description: '鼠标双击时触发' },
310
- ],
311
- },
312
- {
313
- title: '鼠标事件',
314
- children: [
315
- { label: '鼠标进入', value: 'onMouseEnter', description: '鼠标进入时触发' },
316
- { label: '鼠标离开', value: 'onMouseLeave', description: '鼠标离开时触发' },
317
- ],
318
- },
319
- ],
320
- },
321
- },
322
- extraProps: {
323
- // @ts-ignore
324
- label: false,
325
- },
326
- },
186
+ const dataConfigGroup: FieldConfig = createDataConfigGroup([
187
+ { name: 'text', label: 'text', type: 'string', required: true, description: '文本内容' },
327
188
  ])
328
189
 
329
- /** 高级配置 */
330
- const advancedConfigGroup: FieldConfig = createCollapseGroup('高级配置', [
331
- {
332
- title: '条件渲染',
333
- setter: 'SwitchSetter',
334
- extraProps: {
335
- supportVariable: true,
336
- getValue(target) {
337
- return target.getNode().getExtraPropValue('condition')
338
- },
339
- setValue(target, value: boolean) {
340
- target.getNode().setExtraProp('condition', value)
341
- },
342
- },
343
- },
344
- // {
345
- // name: 'loop',
346
- // title: '循环渲染',
347
- // setter: 'SwitchSetter',
348
- // extraProps: {
349
- // defaultValue: false,
350
- // },
351
- // },
352
- ])
353
-
354
- export const configure: Configure = {
355
- props: [
356
- {
357
- type: 'group',
358
- title: '属性',
359
- setter: 'TabSetter',
360
- items: [
361
- // 配置 Tab
362
- {
363
- type: 'group',
364
- key: 'config',
365
- title: '配置',
366
- items: [globalConfigGroup, basicConfigGroup, componentConfigGroup],
367
- },
368
- // 数据 Tab
369
- {
370
- type: 'group',
371
- key: 'data',
372
- title: '数据',
373
- items: [globalConfigGroup, dataConfigGroup],
374
- },
375
- // 高级 Tab
376
- {
377
- type: 'group',
378
- key: 'advanced',
379
- title: '高级',
380
- items: [globalConfigGroup, eventConfigGroup, advancedConfigGroup],
381
- },
382
- ],
383
- },
384
- ],
385
- component: {},
386
- supports: {},
387
- advanced: {},
388
- }
190
+ export const configure = createStandardConfigure(componentConfigGroup, dataConfigGroup)
package/src/meta.ts CHANGED
@@ -24,3 +24,5 @@ export const meta: ComponentMetadata = {
24
24
  configure,
25
25
  snippets,
26
26
  }
27
+
28
+ export default meta
package/src/snippets.ts CHANGED
@@ -5,24 +5,7 @@
5
5
 
6
6
  import type { Snippet } from '@easy-editor/core'
7
7
  import { COMPONENT_NAME } from './constants'
8
-
9
- // 生成静态数据源
10
- const generateStaticDataSource = (text: string) => {
11
- return {
12
- sourceType: "static",
13
- staticData: [
14
- {
15
- text
16
- }
17
- ],
18
- fieldMappings: [
19
- {
20
- componentField: "text",
21
- sourceField: "text"
22
- }
23
- ]
24
- }
25
- }
8
+ import { generateStaticDataSource } from '@easy-editor/materials-shared'
26
9
 
27
10
  export const snippets: Snippet[] = [
28
11
  {
@@ -37,7 +20,7 @@ export const snippets: Snippet[] = [
37
20
  rotation: 0,
38
21
  opacity: 100,
39
22
  background: 'transparent',
40
- $data: generateStaticDataSource('普通文本'),
23
+ $data: generateStaticDataSource({ text: '普通文本' }),
41
24
  },
42
25
  $dashboard: {
43
26
  rect: {
@@ -61,7 +44,7 @@ export const snippets: Snippet[] = [
61
44
  rotation: 0,
62
45
  opacity: 100,
63
46
  background: 'transparent',
64
- $data: generateStaticDataSource('标题文本'),
47
+ $data: generateStaticDataSource({ text: '标题文本' }),
65
48
  },
66
49
  $dashboard: {
67
50
  rect: {
@@ -88,7 +71,7 @@ export const snippets: Snippet[] = [
88
71
  rotation: 0,
89
72
  opacity: 100,
90
73
  background: 'transparent',
91
- $data: generateStaticDataSource('发光标题')
74
+ $data: generateStaticDataSource({ text: '发光标题' }),
92
75
  },
93
76
  $dashboard: {
94
77
  rect: {
@@ -114,7 +97,7 @@ export const snippets: Snippet[] = [
114
97
  rotation: 0,
115
98
  opacity: 100,
116
99
  background: 'transparent',
117
- $data: generateStaticDataSource('点击跳转'),
100
+ $data: generateStaticDataSource({ text: '点击跳转' }),
118
101
  },
119
102
  $dashboard: {
120
103
  rect: {
@@ -138,7 +121,7 @@ export const snippets: Snippet[] = [
138
121
  rotation: 0,
139
122
  opacity: 100,
140
123
  background: 'rgba(0, 212, 255, 0.2)',
141
- $data: generateStaticDataSource('标签'),
124
+ $data: generateStaticDataSource({ text: '标签' }),
142
125
  },
143
126
  $dashboard: {
144
127
  rect: {