@easy-editor/materials-dashboard-text 0.0.10 → 0.0.11

package/dist/component.min.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextComponent={},e.jsxRuntime)}(this,function(e,t){"use strict";e.default=e=>{const{ref:i,text:n="Text",fontSize:o=14,color:f="#ffffff",fontWeight:r="normal",textAlign:l="left",lineHeight:s=1.5,className:a="",style:d}=e,u={...{width:"100%",height:"100%",fontSize:"number"==typeof o?`${o}px`:o,color:f,fontWeight:r,textAlign:l,lineHeight:s,wordBreak:"break-word",whiteSpace:"pre-wrap"},...d};return t.jsx("div",{className:a,ref:i,style:u,children:n})},Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsTextComponent={},e.jsxRuntime)}(this,function(e,t){"use strict";function n(e){var t,o,i="";if("string"==typeof e||"number"==typeof e)i+=e;else if("object"==typeof e)if(Array.isArray(e)){var l=e.length;for(t=0;t<l;t++)e[t]&&(o=n(e[t]))&&(i&&(i+=" "),i+=o)}else for(o in e)e[o]&&(i&&(i+=" "),i+=o);return i}function o(...e){return function(){for(var e,t,o=0,i="",l=arguments.length;o<l;o++)(e=arguments[o])&&(t=n(e))&&(i&&(i+=" "),i+=t);return i}(e)}var i="component-module__container___VbZSk",l="component-module__text___nFUOn",r="component-module__link___20asF",_="component-module__underline___0oAJz",a="component-module__alignLeft___IOvpO",c="component-module__alignCenter___EIwIC",d="component-module__alignRight___p3ReL",s="component-module__valignTop___-5DmK",m="component-module__valignMiddle___i0are",f="component-module__valignBottom___97zzw";!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.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 u=({ref:e,content:n="文本内容",fontSize:u=16,fontWeight:p="normal",fontFamily:g="inherit",color:h="#ffffff",textAlign:x="left",verticalAlign:y="middle",lineHeight:v=1.5,letterSpacing:b=0,isLink:j=!1,href:w="",target:k="_blank",underline:C=!1,glowEnable:S=!1,glowColor:T="#00d4ff",glowIntensity:z=1,style:A})=>{const E={fontSize:u,fontWeight:p,fontFamily:g,color:h,lineHeight:v,letterSpacing:b,textShadow:S?`0 0 ${10*z}px ${T}, 0 0 ${20*z}px ${T}, 0 0 ${30*z}px ${T}`:void 0},F=o(i,(e=>{switch(e){case"left":default:return a;case"center":return c;case"right":return d}})(x),(e=>{switch(e){case"top":return s;case"middle":default:return m;case"bottom":return f}})(y)),I=o(l,j&&r,C&&_);if(j&&w){const o="_blank"===k?"noopener noreferrer":"";return t.jsx("div",{className:F,ref:e,style:A,children:t.jsx("a",{className:I,href:w,rel:o,style:E,target:k,children:n})})}return t.jsx("div",{className:F,ref:e,style:A,children:t.jsx("span",{className:I,style:E,children:n})})};e.Text=u,e.default=u,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=component.min.js.map

package/dist/component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.min.js","sources":["../src/component.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from 'react'\n\ninterface TextProps {\n  ref?: Ref<HTMLDivElement>\n  text?: string\n  fontSize?: number | string\n  color?: string\n  fontWeight?: string | number\n  textAlign?: 'left' | 'center' | 'right' | 'justify'\n  lineHeight?: number | string\n  className?: string\n  style?: CSSProperties\n}\n\nconst Text = (props: TextProps) => {\n  const {\n    ref,\n    text = 'Text',\n    fontSize = 14,\n    color = '#ffffff',\n    fontWeight = 'normal',\n    textAlign = 'left',\n    lineHeight = 1.5,\n    className = '',\n    style: externalStyle,\n  } = props\n\n  const internalStyle: CSSProperties = {\n    width: '100%',\n    height: '100%',\n    fontSize: typeof fontSize === 'number' ? `${fontSize}px` : fontSize,\n    color,\n    fontWeight,\n    textAlign,\n    lineHeight,\n    wordBreak: 'break-word',\n    whiteSpace: 'pre-wrap',\n  }\n\n  const mergedStyle = { ...internalStyle, ...externalStyle }\n\n  return (\n    <div className={className} ref={ref} style={mergedStyle}>\n      {text}\n    </div>\n  )\n}\n\nexport default Text\n"],"names":["props","ref","text","fontSize","color","fontWeight","textAlign","lineHeight","className","style","externalStyle","mergedStyle","width","height","wordBreak","whiteSpace","_jsx","children"],"mappings":"iVAccA,IACZ,MAAMC,IACJA,EAAGC,KACHA,EAAO,OAAMC,SACbA,EAAW,GAAEC,MACbA,EAAQ,UAASC,WACjBA,EAAa,SAAQC,UACrBA,EAAY,OAAMC,WAClBA,EAAa,IAAGC,UAChBA,EAAY,GACZC,MAAOC,GACLV,EAcEW,EAAc,IAZiB,CACnCC,MAAO,OACPC,OAAQ,OACRV,SAA8B,iBAAbA,EAAwB,GAAGA,MAAeA,EAC3DC,QACAC,aACAC,YACAC,aACAO,UAAW,aACXC,WAAY,eAG6BL,GAE3C,OACEM,EAAAA,IAAA,MAAA,CAAKR,UAAWA,EAAWP,IAAKA,EAAKQ,MAAOE,EAAYM,SACrDf"}
+{"version":3,"file":"component.min.js","sources":["../../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../../../../shared/src/lib/utils.ts","../../../../../node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.js","../src/component.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import { clsx, type ClassValue } from 'clsx'\n\nexport function cn(...inputs: ClassValue[]) {\n  return clsx(inputs)\n}\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","/**\n * Text Component\n * 文本组件 - 支持普通文本、链接、标题、发光效果\n */\n\nimport type { CSSProperties, Ref } from 'react'\nimport { cn } from '@easy-editor/materials-shared'\nimport styles from './component.module.css'\n\nexport type TextAlign = 'left' | 'center' | 'right'\nexport type VerticalAlign = 'top' | 'middle' | 'bottom'\n\nexport interface TextProps {\n  ref?: Ref<HTMLDivElement>\n  /** 文本内容 */\n  content?: string\n  /** 字体大小 */\n  fontSize?: number\n  /** 字体粗细 */\n  fontWeight?: number | 'normal' | 'bold'\n  /** 字体家族 */\n  fontFamily?: string\n  /** 颜色 */\n  color?: string\n  /** 水平对齐 */\n  textAlign?: TextAlign\n  /** 垂直对齐 */\n  verticalAlign?: VerticalAlign\n  /** 行高 */\n  lineHeight?: number\n  /** 字间距 */\n  letterSpacing?: number\n  /** 是否为链接 */\n  isLink?: boolean\n  /** 链接地址 */\n  href?: string\n  /** 链接打开方式 */\n  target?: '_self' | '_blank'\n  /** 下划线 */\n  underline?: boolean\n  /** 发光效果 */\n  glowEnable?: boolean\n  /** 发光颜色 */\n  glowColor?: string\n  /** 发光强度 */\n  glowIntensity?: number\n  /** 显隐控制 */\n  condition?: boolean\n  /** 外部样式 */\n  style?: CSSProperties\n}\n\nconst getAlignClass = (align: TextAlign): string => {\n  switch (align) {\n    case 'left':\n      return styles.alignLeft\n    case 'center':\n      return styles.alignCenter\n    case 'right':\n      return styles.alignRight\n    default:\n      return styles.alignLeft\n  }\n}\n\nconst getValignClass = (align: VerticalAlign): string => {\n  switch (align) {\n    case 'top':\n      return styles.valignTop\n    case 'middle':\n      return styles.valignMiddle\n    case 'bottom':\n      return styles.valignBottom\n    default:\n      return styles.valignMiddle\n  }\n}\n\nexport const Text: React.FC<TextProps> = ({\n  ref,\n  content = '文本内容',\n  fontSize = 16,\n  fontWeight = 'normal',\n  fontFamily = 'inherit',\n  color = '#ffffff',\n  textAlign = 'left',\n  verticalAlign = 'middle',\n  lineHeight = 1.5,\n  letterSpacing = 0,\n  isLink = false,\n  href = '',\n  target = '_blank',\n  underline = false,\n  glowEnable = false,\n  glowColor = '#00d4ff',\n  glowIntensity = 1,\n  style: externalStyle,\n}) => {\n  // 计算发光效果\n  const textShadow = glowEnable\n    ? `0 0 ${10 * glowIntensity}px ${glowColor}, 0 0 ${20 * glowIntensity}px ${glowColor}, 0 0 ${30 * glowIntensity}px ${glowColor}`\n    : undefined\n\n  const textStyle: CSSProperties = {\n    fontSize,\n    fontWeight,\n    fontFamily,\n    color,\n    lineHeight,\n    letterSpacing,\n    textShadow,\n  }\n\n  const containerClass = cn(styles.container, getAlignClass(textAlign), getValignClass(verticalAlign))\n\n  const textClass = cn(styles.text, isLink && styles.link, underline && styles.underline)\n\n  // 链接模式\n  if (isLink && href) {\n    const relValue = target === '_blank' ? 'noopener noreferrer' : ''\n    return (\n      <div className={containerClass} ref={ref} style={externalStyle}>\n        <a className={textClass} href={href} rel={relValue} style={textStyle} target={target}>\n          {content}\n        </a>\n      </div>\n    )\n  }\n\n  // 普通文本\n  return (\n    <div className={containerClass} ref={ref} style={externalStyle}>\n      <span className={textClass} style={textStyle}>\n        {content}\n      </span>\n    </div>\n  )\n}\n\nexport default Text\n"],"names":["r","e","t","f","n","Array","isArray","o","length","cn","inputs","arguments","clsx","css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","Text","content","fontSize","fontWeight","fontFamily","color","textAlign","verticalAlign","lineHeight","letterSpacing","isLink","href","target","underline","glowEnable","glowColor","glowIntensity","externalStyle","textStyle","textShadow","undefined","containerClass","styles","align","getAlignClass","getValignClass","textClass","relValue","_jsx","className","children","rel"],"mappings":"uUAAA,SAASA,EAAEC,GAAG,IAAIC,EAAEC,EAAEC,EAAE,GAAG,GAAG,iBAAiBH,GAAG,iBAAiBA,EAAEG,GAAGH,OAAO,GAAG,iBAAiBA,EAAE,GAAGI,MAAMC,QAAQL,GAAG,CAAC,IAAIM,EAAEN,EAAEO,OAAO,IAAIN,EAAE,EAAEA,EAAEK,EAAEL,IAAID,EAAEC,KAAKC,EAAEH,EAAEC,EAAEC,OAAOE,IAAIA,GAAG,KAAKA,GAAGD,EAAE,MAAM,IAAIA,KAAKF,EAAEA,EAAEE,KAAKC,IAAIA,GAAG,KAAKA,GAAGD,GAAG,OAAOC,CAAC,CCEzO,SAASK,KAAMC,GACpB,ODHsP,WAAgB,IAAI,IAAIT,EAAEC,EAAEC,EAAE,EAAEC,EAAE,GAAGG,EAAEI,UAAUH,OAAOL,EAAEI,EAAEJ,KAAKF,EAAEU,UAAUR,MAAMD,EAAEF,EAAEC,MAAMG,IAAIA,GAAG,KAAKA,GAAGF,GAAG,OAAOE,CAAC,CCGtWQ,CAAKF,EACd,qZCJA,SAAqBG,EAAKC,QACX,IAARA,IAAiBA,EAAM,CAAA,GAC5B,IAAIC,EAAWD,EAAIC,SAEnB,GAAgC,oBAAbC,SAAnB,CAEA,IAAIC,EAAOD,SAASC,MAAQD,SAASE,qBAAqB,QAAQ,GAC9DC,EAAQH,SAASI,cAAc,SACnCD,EAAME,KAAO,WAEI,QAAbN,GACEE,EAAKK,WACPL,EAAKM,aAAaJ,EAAOF,EAAKK,YAKhCL,EAAKO,YAAYL,GAGfA,EAAMM,WACRN,EAAMM,WAAWC,QAAUb,EAE3BM,EAAMK,YAAYR,SAASW,eAAed,GAnBW,CAqBzD,8wBC2BA,MA0Bae,EAA4BA,EACvCd,MACAe,UAAU,OACVC,WAAW,GACXC,aAAa,SACbC,aAAa,UACbC,QAAQ,UACRC,YAAY,OACZC,gBAAgB,SAChBC,aAAa,IACbC,gBAAgB,EAChBC,UAAS,EACTC,OAAO,GACPC,SAAS,SACTC,aAAY,EACZC,cAAa,EACbC,YAAY,UACZC,gBAAgB,EAChBzB,MAAO0B,MAGP,MAIMC,EAA2B,CAC/BhB,WACAC,aACAC,aACAC,QACAG,aACAC,gBACAU,WAXiBL,EACf,OAAO,GAAKE,OAAmBD,UAAkB,GAAKC,OAAmBD,UAAkB,GAAKC,OAAmBD,SACnHK,GAYEC,EAAiBxC,EAAGyC,EA7DLC,KACrB,OAAQA,GACN,IAAK,OAML,QACE,OAAOD,EALT,IAAK,SACH,OAAOA,EACT,IAAK,QACH,OAAOA,IAsDiCE,CAAclB,GAhDpCiB,KACtB,OAAQA,GACN,IAAK,MACH,OAAOD,EACT,IAAK,SAIL,QACE,OAAOA,EAHT,IAAK,SACH,OAAOA,IAyC2DG,CAAelB,IAE/EmB,EAAY7C,EAAGyC,EAAaZ,GAAUY,EAAaT,GAAaS,GAGtE,GAAIZ,GAAUC,EAAM,CAClB,MAAMgB,EAAsB,WAAXf,EAAsB,sBAAwB,GAC/D,OACEgB,EAAAA,IAAA,MAAA,CAAKC,UAAWR,EAAgBnC,IAAKA,EAAKK,MAAO0B,EAAca,SAC7DF,EAAAA,IAAA,IAAA,CAAGC,UAAWH,EAAWf,KAAMA,EAAMoB,IAAKJ,EAAUpC,MAAO2B,EAAWN,OAAQA,EAAOkB,SAClF7B,KAIT,CAGA,OACE2B,EAAAA,IAAA,MAAA,CAAKC,UAAWR,EAAgBnC,IAAKA,EAAKK,MAAO0B,EAAca,SAC7DF,EAAAA,IAAA,OAAA,CAAMC,UAAWH,EAAWnC,MAAO2B,EAAUY,SAC1C7B","x_google_ignoreList":[0,2]}

package/dist/index.cjs

@@ -2,60 +2,161 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
+
+function cn(...inputs) {
+  return clsx(inputs);
+}
+
 const MaterialGroup = {
   BASIC: 'basic'};
 
-const COMPONENT_NAME = 'EasyEditorMaterialsText';
-const PACKAGE_NAME = '@easy-editor/materials-dashboard-text';
+function styleInject(css, ref) {
+  if (ref === void 0) ref = {};
+  var insertAt = ref.insertAt;
+  if (typeof document === 'undefined') {
+    return;
+  }
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
 
-const Text = props => {
-  const {
-    ref,
-    text = 'Text',
-    fontSize = 14,
-    color = '#ffffff',
-    fontWeight = 'normal',
-    textAlign = 'left',
-    lineHeight = 1.5,
-    className = '',
-    style: externalStyle
-  } = props;
-  const internalStyle = {
-    width: '100%',
-    height: '100%',
-    fontSize: typeof fontSize === 'number' ? `${fontSize}px` : fontSize,
-    color,
+var css_248z = ".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}";
+var styles = {"container":"component-module__container___VbZSk","text":"component-module__text___nFUOn","link":"component-module__link___20asF","underline":"component-module__underline___0oAJz","alignLeft":"component-module__alignLeft___IOvpO","alignCenter":"component-module__alignCenter___EIwIC","alignRight":"component-module__alignRight___p3ReL","valignTop":"component-module__valignTop___-5DmK","valignMiddle":"component-module__valignMiddle___i0are","valignBottom":"component-module__valignBottom___97zzw"};
+styleInject(css_248z);
+
+/**
+ * Text Component
+ * 文本组件 - 支持普通文本、链接、标题、发光效果
+ */
+
+const getAlignClass = align => {
+  switch (align) {
+    case 'left':
+      return styles.alignLeft;
+    case 'center':
+      return styles.alignCenter;
+    case 'right':
+      return styles.alignRight;
+    default:
+      return styles.alignLeft;
+  }
+};
+const getValignClass = align => {
+  switch (align) {
+    case 'top':
+      return styles.valignTop;
+    case 'middle':
+      return styles.valignMiddle;
+    case 'bottom':
+      return styles.valignBottom;
+    default:
+      return styles.valignMiddle;
+  }
+};
+const Text = ({
+  ref,
+  content = '文本内容',
+  fontSize = 16,
+  fontWeight = 'normal',
+  fontFamily = 'inherit',
+  color = '#ffffff',
+  textAlign = 'left',
+  verticalAlign = 'middle',
+  lineHeight = 1.5,
+  letterSpacing = 0,
+  isLink = false,
+  href = '',
+  target = '_blank',
+  underline = false,
+  glowEnable = false,
+  glowColor = '#00d4ff',
+  glowIntensity = 1,
+  style: externalStyle
+}) => {
+  // 计算发光效果
+  const textShadow = glowEnable ? `0 0 ${10 * glowIntensity}px ${glowColor}, 0 0 ${20 * glowIntensity}px ${glowColor}, 0 0 ${30 * glowIntensity}px ${glowColor}` : undefined;
+  const textStyle = {
+    fontSize,
     fontWeight,
-    textAlign,
+    fontFamily,
+    color,
     lineHeight,
-    wordBreak: 'break-word',
-    whiteSpace: 'pre-wrap'
-  };
-  const mergedStyle = {
-    ...internalStyle,
-    ...externalStyle
+    letterSpacing,
+    textShadow
   };
+  const containerClass = cn(styles.container, getAlignClass(textAlign), getValignClass(verticalAlign));
+  const textClass = cn(styles.text, isLink && styles.link, underline && styles.underline);
+
+  // 链接模式
+  if (isLink && href) {
+    const relValue = target === '_blank' ? 'noopener noreferrer' : '';
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: containerClass,
+      ref: ref,
+      style: externalStyle,
+      children: /*#__PURE__*/jsxRuntime.jsx("a", {
+        className: textClass,
+        href: href,
+        rel: relValue,
+        style: textStyle,
+        target: target,
+        children: content
+      })
+    });
+  }
+
+  // 普通文本
   return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: className,
+    className: containerClass,
     ref: ref,
-    style: mergedStyle,
-    children: text
+    style: externalStyle,
+    children: /*#__PURE__*/jsxRuntime.jsx("span", {
+      className: textClass,
+      style: textStyle,
+      children: content
+    })
   });
 };
 
 const configure = {
   props: [{
     type: 'group',
-    title: '功能',
+    title: '属性',
     setter: 'TabSetter',
     items: [{
       type: 'group',
-      key: 'basic',
-      title: '基本',
-      items: [{
+      key: 'config',
+      title: '配置',
+      setter: {
+        componentName: 'CollapseSetter',
+        props: {
+          icon: false
+        }
+      },
+      items: [
+      {
         name: 'id',
         title: 'ID',
-        setter: 'NodeIdSetter'
+        setter: 'NodeIdSetter',
+        extraProps: {
+          label: false
+        }
       }, {
         name: 'title',
         title: '标题',
@@ -90,13 +191,56 @@ const configure = {
             }
           }
         }]
-      }, {
-        name: 'text',
-        title: '文本内容',
-        setter: 'StringSetter'
+      },
+      {
+        type: 'group',
+        title: '内容',
+        setter: {
+          componentName: 'CollapseSetter',
+          props: {
+            icon: false
+          }
+        },
+        items: [{
+          name: 'content',
+          title: '文本内容',
+          setter: 'TextAreaSetter',
+          extraProps: {
+            defaultValue: '文本内容'
+          }
+        }, {
+          name: 'isLink',
+          title: '作为链接',
+          setter: 'SwitchSetter',
+          extraProps: {
+            defaultValue: false
+          }
+        }, {
+          name: 'href',
+          title: '链接地址',
+          setter: 'StringSetter'
+        }, {
+          name: 'target',
+          title: '打开方式',
+          setter: {
+            componentName: 'SelectSetter',
+            props: {
+              options: [{
+                label: '新窗口',
+                value: '_blank'
+              }, {
+                label: '当前窗口',
+                value: '_self'
+              }]
+            }
+          },
+          extraProps: {
+            defaultValue: '_blank'
+          }
+        }]
       }, {
         type: 'group',
-        title: '字体样式',
+        title: '字体',
         setter: {
           componentName: 'CollapseSetter',
           props: {
@@ -108,14 +252,32 @@ const configure = {
           title: '字体大小',
           setter: 'NumberSetter',
           extraProps: {
-            defaultValue: 14
+            defaultValue: 16
+          }
+        }, {
+          name: 'fontWeight',
+          title: '字体粗细',
+          setter: {
+            componentName: 'SelectSetter',
+            props: {
+              options: [{
+                label: '正常',
+                value: 'normal'
+              }, {
+                label: '粗体',
+                value: 'bold'
+              }]
+            }
+          },
+          extraProps: {
+            defaultValue: 'normal'
           }
         }, {
           name: 'color',
-          title: '文字颜色',
+          title: '颜色',
           setter: 'ColorSetter',
           extraProps: {
-            defaultValue: '#000000'
+            defaultValue: '#ffffff'
           }
         }, {
           name: 'lineHeight',
@@ -125,14 +287,9 @@ const configure = {
             defaultValue: 1.5
           }
         }]
-      }]
-    }, {
-      type: 'group',
-      key: 'advanced',
-      title: '高级',
-      items: [{
+      }, {
         type: 'group',
-        title: '高级设置',
+        title: '对齐',
         setter: {
           componentName: 'CollapseSetter',
           props: {
@@ -140,38 +297,121 @@ const configure = {
           }
         },
         items: [{
-          title: '显隐',
-          setter: 'SwitchSetter',
+          name: 'textAlign',
+          title: '水平对齐',
+          setter: {
+            componentName: 'SegmentedSetter',
+            props: {
+              options: [{
+                label: '左',
+                value: 'left'
+              }, {
+                label: '中',
+                value: 'center'
+              }, {
+                label: '右',
+                value: 'right'
+              }]
+            }
+          },
           extraProps: {
-            supportVariable: true,
-            getValue(target) {
-              return target.getExtraPropValue('condition');
-            },
-            setValue(target, value) {
-              target.setExtraPropValue('condition', value);
+            defaultValue: 'left'
+          }
+        }, {
+          name: 'verticalAlign',
+          title: '垂直对齐',
+          setter: {
+            componentName: 'SegmentedSetter',
+            props: {
+              options: [{
+                label: '上',
+                value: 'top'
+              }, {
+                label: '中',
+                value: 'middle'
+              }, {
+                label: '下',
+                value: 'bottom'
+              }]
             }
+          },
+          extraProps: {
+            defaultValue: 'middle'
           }
         }]
+      }, {
+        type: 'group',
+        title: '效果',
+        setter: {
+          componentName: 'CollapseSetter',
+          props: {
+            icon: false
+          }
+        },
+        items: [{
+          name: 'underline',
+          title: '下划线',
+          setter: 'SwitchSetter',
+          extraProps: {
+            defaultValue: false
+          }
+        }, {
+          name: 'glowEnable',
+          title: '发光效果',
+          setter: 'SwitchSetter',
+          extraProps: {
+            defaultValue: false
+          }
+        }, {
+          name: 'glowColor',
+          title: '发光颜色',
+          setter: 'ColorSetter',
+          extraProps: {
+            defaultValue: '#00d4ff'
+          }
+        }]
+      }]
+    }, {
+      type: 'group',
+      key: 'data',
+      title: '数据',
+      items: [{
+        name: 'dataBinding',
+        title: '数据绑定',
+        setter: 'DataBindingSetter'
+      }]
+    }, {
+      type: 'group',
+      key: 'advanced',
+      title: '高级',
+      items: [{
+        name: 'condition',
+        title: '显隐控制',
+        setter: 'SwitchSetter',
+        extraProps: {
+          defaultValue: true,
+          supportVariable: true
+        }
       }]
     }]
   }],
   component: {},
   supports: {},
-  advanced: {
-    view: Text
-  }
+  advanced: {}
 };
 
+const COMPONENT_NAME = 'EasyEditorMaterialsText';
+const PACKAGE_NAME = '@easy-editor/materials-dashboard-text';
+
 const snippets = [{
-  title: 'Text',
-  screenshot: 'https://img.alicdn.com/imgextra/i3/O1CN01n5wpxc1bi862KuXFz_!!6000000003498-55-tps-50-50.svg',
+  title: '普通文本',
+  screenshot: '',
   schema: {
     componentName: COMPONENT_NAME,
     props: {
-      text: 'Text Text Text',
-      fontSize: 14,
-      color: '#ffffff',
-      textAlign: 'left'
+      content: '这是一段普通文本',
+      fontSize: 16,
+      color: '#ffffff'
     },
     $dashboard: {
       rect: {
@@ -181,39 +421,87 @@ const snippets = [{
     }
   }
 }, {
-  title: 'Heading',
-  screenshot: 'https://img.alicdn.com/imgextra/i3/O1CN01n5wpxc1bi862KuXFz_!!6000000003498-55-tps-50-50.svg',
+  title: '标题文本',
+  screenshot: '',
   schema: {
     componentName: COMPONENT_NAME,
     props: {
-      text: 'Heading',
-      fontSize: 24,
-      color: '#ffffff',
+      content: '标题文本',
+      fontSize: 32,
       fontWeight: 'bold',
+      color: '#ffffff',
       textAlign: 'center'
     },
     $dashboard: {
       rect: {
         width: 200,
-        height: 50
+        height: 60
+      }
+    }
+  }
+}, {
+  title: '发光标题',
+  screenshot: '',
+  schema: {
+    componentName: COMPONENT_NAME,
+    props: {
+      content: '发光标题',
+      fontSize: 36,
+      fontWeight: 'bold',
+      color: '#00d4ff',
+      textAlign: 'center',
+      glowEnable: true,
+      glowColor: '#00d4ff',
+      glowIntensity: 1.5
+    },
+    $dashboard: {
+      rect: {
+        width: 240,
+        height: 80
+      }
+    }
+  }
+}, {
+  title: '链接文本',
+  screenshot: '',
+  schema: {
+    componentName: COMPONENT_NAME,
+    props: {
+      content: '点击跳转',
+      fontSize: 16,
+      color: '#00d4ff',
+      isLink: true,
+      href: 'https://easy-editor-docs.vercel.app/',
+      target: '_blank',
+      underline: true
+    },
+    $dashboard: {
+      rect: {
+        width: 120,
+        height: 40
       }
     }
   }
 }];
 
+var version = "0.0.10";
+var pkg = {
+	version: version};
+
 const meta = {
   componentName: COMPONENT_NAME,
-  title: 'Text',
+  title: '文本',
+  category: 'dashboard',
   group: MaterialGroup.BASIC,
   devMode: 'proCode',
   npm: {
     package: PACKAGE_NAME,
-    version: 'latest',
+    version: pkg.version,
     globalName: COMPONENT_NAME,
     componentName: COMPONENT_NAME
   },
-  snippets,
-  configure
+  configure,
+  snippets
 };
 
 exports.component = Text;