@szc-ft/szcd 1.1.7

package/dist/meta__docs.9bc21701.async.js

@@ -0,0 +1 @@
+(self.webpackChunk_szc_ft_szcd=self.webpackChunk_szc_ft_szcd||[]).push([[1904],{30789:function(e,n,r){"use strict";r.r(n),r.d(n,{copyText:function(){return t}});var l=r(28801);function t(e){var n=document.createElement("input");n.setAttribute("id","copy_input_id"),n.value="<".concat(e," />"),document.getElementsByTagName("body")[0].appendChild(n);var r=document.getElementById("copy_input_id");r&&r.select(),document.execCommand("copy"),r&&r.remove(),l.message.destroy(),l.message.success("<".concat(e," /> copied 🎉"))}},31408:function(e,n,r){"use strict";var l;r.r(n),r.d(n,{demos:function(){return m}});var t,o=r(15009),a=r.n(o),d=r(49677),c=r.n(d),i=r(99289),s=r.n(i),p=r(67294),v=r(28801),u=r(2901),m={"docs-color-demo-0":{component:p.memo(p.lazy(s()(a()().mark(function e(){var n,l,t,o,d,i,s,p;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,Promise.resolve().then(r.bind(r,28801));case 2:return n=e.sent,l=n.default,e.t0=c(),e.next=7,Promise.resolve().then(r.bind(r,2901));case 7:return e.t1=e.sent,(0,e.t0)(e.t1),e.next=11,Promise.resolve().then(r.t.bind(r,67294,19));case 11:return t=e.sent,o=t.default,(new l).load(document.body),e.next=16,Promise.resolve().then(r.bind(r,28801));case 16:return d=e.sent,i=d.Col,s=d.Divider,p=d.Row,e.abrupt("return",{default:function(){return o.createElement("div",null,o.createElement(s,{orientation:"left"},"品牌色（控件提供的品牌色专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--brand-default-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--brand-default-color)"),o.createElement("p",null,"品牌色-默认"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--brand-hover-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--brand-hover-color)"),o.createElement("p",null,"品牌色-hover"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--brand-focus-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--brand-focus-color)"),o.createElement("p",null,"品牌色-focus"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--brand-disable-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--brand-disable-color)"),o.createElement("p",null,"品牌色-禁用")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"图标色（控件提供的图标专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--icon-default-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--icon-default-color)"),o.createElement("p",null,"图标色-默认"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--icon-hover-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--icon-hover-color)"),o.createElement("p",null,"图标色-禁用"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--icon-disable-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--icon-disable-color)"),o.createElement("p",null,"图标色-hover/选中"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--icon-selectedhover-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--icon-selectedhover-color)"),o.createElement("p",null,"图标色-选中+hover"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--icon-background-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--icon-background-color)"),o.createElement("p",null,"图标色-底色")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"文本色（控件提供的文本专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-main-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-main-color)"),o.createElement("p",null,"文本色-主要文字"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-thead-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-thead-color)"),o.createElement("p",null,"文本色-表头文字"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-secondary-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-secondary-color)"),o.createElement("p",null,"文本色-次要文字"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-description-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-description-color)"),o.createElement("p",null,"文本色-说明文字"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-placeholder-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-placeholder-color)"),o.createElement("p",null,"文本色-输入框提示文字"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-link-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-link-color)"),o.createElement("p",null,"文本色-超链接/文本按钮"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-hover-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-hover-color)"),o.createElement("p",null,"文本色-hover/选中"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--text-disable-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--text-disable-color)"),o.createElement("p",null,"文本色-禁用")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"边框色（框架/控件边框专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-default-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--border-default-color)"),o.createElement("p",null,"边框色-默认描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-hover-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--border-hover-color)"),o.createElement("p",null,"边框色-悬浮态描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-selected-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--border-selected-color)"),o.createElement("p",null,"边框色-选中描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-focus-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--border-focus-color)"),o.createElement("p",null,"边框色-聚焦描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-disable-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--border-disable-color)"),o.createElement("p",null,"边框色-禁用描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-layout-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--border-layout-color)"),o.createElement("p",null,"边框色-框架/布局描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-tr-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--border-tr-color)"),o.createElement("p",null,"边框色-表格描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-split-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--border-split-color)"),o.createElement("p",null,"边框色-列表描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--border-error-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--border-error-color)"),o.createElement("p",null,"边框色-错误描边")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"填充色（框架/控件的背景填充专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-default-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-default-color)"),o.createElement("p",null,"填充色-默认"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-hover-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-hover-color)"),o.createElement("p",null,"填充色-悬浮态描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-selected-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-selected-color)"),o.createElement("p",null,"填充色-选中描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-disable-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-disable-color)"),o.createElement("p",null,"填充色-禁用描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-thead-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-thead-color)"),o.createElement("p",null,"填充色-表头描边"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-nav-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--fill-nav-color)"),o.createElement("p",null,"填充色-导航"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-page-color)",color:"#666",padding:"20px"}},o.createElement("div",null,"var(--fill-page-color)"),o.createElement("p",null,"填充色-页面"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--fill-card-color)",color:"#666",border:"#F3F4F6 1px solid",padding:"20px"}},o.createElement("div",null,"var(--fill-card-color)"),o.createElement("p",null,"填充色-模块/卡片")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"状态色（系统状态专用场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--system-error-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--system-error-color)"),o.createElement("p",null,"状态色-紧急告警色"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--system-warn-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--system-warn-color)"),o.createElement("p",null,"状态色-重要告警色"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--system-alarm-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--system-alarm-color)"),o.createElement("p",null,"状态色-次要告警色"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--system-success-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--system-success-color)"),o.createElement("p",null,"状态色-成功/安全"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{backgroundColor:"var(--system-info-color)",color:"#fff",padding:"20px"}},o.createElement("div",null,"var(--system-info-color)"),o.createElement("p",null,"状态色-提示/运行中")))),o.createElement("br",null),o.createElement(s,{orientation:"left"},"投影色（控件投影场景色）"),o.createElement(p,{gutter:[16,16]},o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{color:"#666",padding:"20px",boxShadow:"var(--shadow-default-color)"}},o.createElement("div",null,"var(--shadow-default-color)"),o.createElement("p",null,"投影色-卡片背景色"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{color:"#666",padding:"20px",boxShadow:"var(--shadow-aside-color)"}},o.createElement("div",null,"var(--shadow-aside-color)"),o.createElement("p",null,"投影色-抽屉弹窗/侧滑面板"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{color:"#666",padding:"20px",boxShadow:"var(--shadow-modal-color)"}},o.createElement("div",null,"var(--shadow-modal-color)"),o.createElement("p",null,"投影色-弹窗/下拉选择框"))),o.createElement(i,{xs:12,md:8,lg:6,xxl:4},o.createElement("div",{style:{color:"#666",padding:"20px",boxShadow:"var(--shadow-popup-color)"}},o.createElement("div",null,"var(--shadow-popup-color)"),o.createElement("p",null,"投影色-气泡弹窗")))))}});case 21:case"end":return e.stop()}},e)})))),asset:{type:"BLOCK",id:"docs-color-demo-0",refAtomIds:[],dependencies:{"index.tsx":{type:"FILE",value:"import Theme from '@szc-ft/szcd';\nimport '@szc-ft/szcd/index.less';\nimport React from 'react';\nnew Theme().load(document.body);\n\nimport { Col, Divider, Row } from \"@szc-ft/szcd\";\n\nexport default () => (\n  <div>\n    <Divider orientation=\"left\">品牌色（控件提供的品牌色专用场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--brand-default-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--brand-default-color)</div>\n          <p>品牌色-默认</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--brand-hover-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--brand-hover-color)</div>\n          <p>品牌色-hover</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--brand-focus-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--brand-focus-color)</div>\n          <p>品牌色-focus</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--brand-disable-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--brand-disable-color)</div>\n          <p>品牌色-禁用</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">图标色（控件提供的图标专用场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--icon-default-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--icon-default-color)</div>\n          <p>图标色-默认</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--icon-hover-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--icon-hover-color)</div>\n          <p>图标色-禁用</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--icon-disable-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--icon-disable-color)</div>\n          <p>图标色-hover/选中</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--icon-selectedhover-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--icon-selectedhover-color)</div>\n          <p>图标色-选中+hover</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--icon-background-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--icon-background-color)</div>\n          <p>图标色-底色</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">文本色（控件提供的文本专用场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-main-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-main-color)</div>\n          <p>文本色-主要文字</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-thead-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-thead-color)</div>\n          <p>文本色-表头文字</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-secondary-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-secondary-color)</div>\n          <p>文本色-次要文字</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-description-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-description-color)</div>\n          <p>文本色-说明文字</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-placeholder-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-placeholder-color)</div>\n          <p>文本色-输入框提示文字</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-link-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-link-color)</div>\n          <p>文本色-超链接/文本按钮</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-hover-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-hover-color)</div>\n          <p>文本色-hover/选中</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--text-disable-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--text-disable-color)</div>\n          <p>文本色-禁用</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">边框色（框架/控件边框专用场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-default-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-default-color)</div>\n          <p>边框色-默认描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-hover-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-hover-color)</div>\n          <p>边框色-悬浮态描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-selected-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-selected-color)</div>\n          <p>边框色-选中描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-focus-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-focus-color)</div>\n          <p>边框色-聚焦描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-disable-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-disable-color)</div>\n          <p>边框色-禁用描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-layout-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-layout-color)</div>\n          <p>边框色-框架/布局描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-tr-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-tr-color)</div>\n          <p>边框色-表格描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-split-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-split-color)</div>\n          <p>边框色-列表描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--border-error-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--border-error-color)</div>\n          <p>边框色-错误描边</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">\n      填充色（框架/控件的背景填充专用场景色）\n    </Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-default-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-default-color)</div>\n          <p>填充色-默认</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-hover-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-hover-color)</div>\n          <p>填充色-悬浮态描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-selected-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-selected-color)</div>\n          <p>填充色-选中描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-disable-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-disable-color)</div>\n          <p>填充色-禁用描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-thead-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-thead-color)</div>\n          <p>填充色-表头描边</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-nav-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-nav-color)</div>\n          <p>填充色-导航</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-page-color)',\n            color: '#666',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-page-color)</div>\n          <p>填充色-页面</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--fill-card-color)',\n            color: '#666',\n            border: '#F3F4F6 1px solid',\n            padding: '20px',\n          }}\n        >\n          <div>var(--fill-card-color)</div>\n          <p>填充色-模块/卡片</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">状态色（系统状态专用场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--system-error-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--system-error-color)</div>\n          <p>状态色-紧急告警色</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--system-warn-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--system-warn-color)</div>\n          <p>状态色-重要告警色</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--system-alarm-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--system-alarm-color)</div>\n          <p>状态色-次要告警色</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--system-success-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--system-success-color)</div>\n          <p>状态色-成功/安全</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            backgroundColor: 'var(--system-info-color)',\n            color: '#fff',\n            padding: '20px',\n          }}\n        >\n          <div>var(--system-info-color)</div>\n          <p>状态色-提示/运行中</p>\n        </div>\n      </Col>\n    </Row>\n    <br />\n    <Divider orientation=\"left\">投影色（控件投影场景色）</Divider>\n    <Row gutter={[16, 16]}>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            color: '#666',\n            padding: '20px',\n            boxShadow: 'var(--shadow-default-color)',\n          }}\n        >\n          <div>var(--shadow-default-color)</div>\n          <p>投影色-卡片背景色</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            color: '#666',\n            padding: '20px',\n            boxShadow: 'var(--shadow-aside-color)',\n          }}\n        >\n          <div>var(--shadow-aside-color)</div>\n          <p>投影色-抽屉弹窗/侧滑面板</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            color: '#666',\n            padding: '20px',\n            boxShadow: 'var(--shadow-modal-color)',\n          }}\n        >\n          <div>var(--shadow-modal-color)</div>\n          <p>投影色-弹窗/下拉选择框</p>\n        </div>\n      </Col>\n      <Col xs={12} md={8} lg={6} xxl={4}>\n        <div\n          style={{\n            color: '#666',\n            padding: '20px',\n            boxShadow: 'var(--shadow-popup-color)',\n          }}\n        >\n          <div>var(--shadow-popup-color)</div>\n          <p>投影色-气泡弹窗</p>\n        </div>\n      </Col>\n    </Row>\n  </div>\n);"},"@szc-ft/szcd":{type:"NPM",value:"1.1.7"},react:{type:"NPM",value:"18.3.1"}},entry:"index.tsx"},context:{"@szc-ft/szcd":v,"@szc-ft/szcd/index.less":u,react:l||(l=r.t(p,2))},renderOpts:{compile:(t=s()(a()().mark(function e(){var n,l=arguments;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,r.e(250).then(r.bind(r,90250));case 2:return e.abrupt("return",(n=e.sent).default.apply(n,l));case 3:case"end":return e.stop()}},e)})),function(){return t.apply(this,arguments)})}}}},56993:function(e,n,r){"use strict";var l;r.r(n),r.d(n,{demos:function(){return m}});var t,o=r(15009),a=r.n(o),d=r(49677),c=r.n(d),i=r(99289),s=r.n(i),p=r(67294),v=r(28801),u=r(2901),m={"docs-front-demo-0":{component:p.memo(p.lazy(s()(a()().mark(function e(){var n,l,t,o,d,i;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,Promise.resolve().then(r.bind(r,28801));case 2:return n=e.sent,l=n.default,e.t0=c(),e.next=7,Promise.resolve().then(r.bind(r,2901));case 7:return e.t1=e.sent,(0,e.t0)(e.t1),e.next=11,Promise.resolve().then(r.t.bind(r,67294,19));case 11:return t=e.sent,o=t.default,(new l).load(document.body),e.next=16,Promise.resolve().then(r.bind(r,28801));case 16:return d=e.sent,i=d.Divider,e.abrupt("return",{default:function(){return o.createElement("div",null,o.createElement("div",{style:{fontSize:"48px",lineHeight:"60px"}},"标题."),o.createElement("p",null,"字体大小:48px. 行高:60px. 用途:仪表盘当前值"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"32px",lineHeight:"48px"}},"标题."),o.createElement("p",null,"字体大小:32px. 行高:48px. 用途:图表关键数值"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"20px",lineHeight:"28px"}},"标题."),o.createElement("p",null,"字体大小:20px. 行高:28px. 用途:图表&表单&手风琴导航&弹窗&层级树标题&页面级页签等"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"18px",lineHeight:"24px"}},"标题."),o.createElement("p",null,"字体大小:18px. 行高:24px. 用途:手风琴等"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"16px",lineHeight:"24px"}},"标题."),o.createElement("p",null,"字体大小:16px. 行高:24px. 用途:卡片标题&导航栏下拉菜单一级文本等"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"14px",lineHeight:"20px"}},"标题."),o.createElement("p",null,"字体大小:14px. 行高:20px. 用途:导航栏下拉菜单二级文本&表单section标题&表头等"),o.createElement(i,null),o.createElement("div",{style:{fontSize:"12px",lineHeight:"20px"}},"标题."),o.createElement("p",null,"字体大小:12px. 行高:20px. 用途:菜单分组标题&下拉选择分组标题等"),o.createElement(i,null),o.createElement("br",null),o.createElement("br",null),o.createElement("br",null),o.createElement("div",{style:{fontSize:"16px",lineHeight:"24px"}},o.createElement("div",null,"标准字."),o.createElement("p",null,"字体大小:16px. 行高:24px. 用途:标准页签")),o.createElement(i,null),o.createElement("div",{style:{fontSize:"14px",lineHeight:"20px"}},o.createElement("div",null,"标准字. "),o.createElement("p",null,"字体大小:14px. 行高:20px. 用途:菜单&导航下拉菜单三级文本&次级页签&弹窗正文等&局部位置按钮文本&文本按钮")),o.createElement(i,null),o.createElement("div",{style:{fontSize:"12px",lineHeight:"20px"}},o.createElement("div",null,"标准字."),o.createElement("p",null,"字体大小:12px. 行高:20px. 用途:弹窗辅助文本&进度指示器辅助文本&卡片说明文本等")),o.createElement(i,null))}});case 19:case"end":return e.stop()}},e)})))),asset:{type:"BLOCK",id:"docs-front-demo-0",refAtomIds:[],dependencies:{"index.tsx":{type:"FILE",value:"import Theme from '@szc-ft/szcd';\nimport '@szc-ft/szcd/index.less';\nimport React from 'react';\nnew Theme().load(document.body);\n\nimport { Divider } from \"@szc-ft/szcd\";\n\nexport default () => (\n  <div>\n    <div style={{ fontSize: '48px', lineHeight: '60px' }}>标题.</div>\n    <p>字体大小:48px. 行高:60px. 用途:仪表盘当前值</p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '32px', lineHeight: '48px' }}>标题.</div>\n    <p>字体大小:32px. 行高:48px. 用途:图表关键数值</p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '20px', lineHeight: '28px' }}>标题.</div>\n    <p>\n      字体大小:20px. 行高:28px.\n      用途:图表&表单&手风琴导航&弹窗&层级树标题&页面级页签等\n    </p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '18px', lineHeight: '24px' }}>标题.</div>\n    <p>字体大小:18px. 行高:24px. 用途:手风琴等</p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '16px', lineHeight: '24px' }}>标题.</div>\n    <p>字体大小:16px. 行高:24px. 用途:卡片标题&导航栏下拉菜单一级文本等</p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '14px', lineHeight: '20px' }}>标题.</div>\n    <p>\n      字体大小:14px. 行高:20px.\n      用途:导航栏下拉菜单二级文本&表单section标题&表头等\n    </p>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '12px', lineHeight: '20px' }}>标题.</div>\n    <p>字体大小:12px. 行高:20px. 用途:菜单分组标题&下拉选择分组标题等</p>\n    <Divider></Divider>\n\n    <br />\n    <br />\n    <br />\n\n    <div style={{ fontSize: '16px', lineHeight: '24px' }}>\n      <div>标准字.</div>\n      <p>字体大小:16px. 行高:24px. 用途:标准页签</p>\n    </div>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '14px', lineHeight: '20px' }}>\n      <div>标准字. </div>\n      <p>\n        字体大小:14px. 行高:20px.\n        用途:菜单&导航下拉菜单三级文本&次级页签&弹窗正文等&局部位置按钮文本&文本按钮\n      </p>\n    </div>\n    <Divider></Divider>\n\n    <div style={{ fontSize: '12px', lineHeight: '20px' }}>\n      <div>标准字.</div>\n      <p>\n        字体大小:12px. 行高:20px.\n        用途:弹窗辅助文本&进度指示器辅助文本&卡片说明文本等\n      </p>\n    </div>\n    <Divider></Divider>\n  </div>\n);"},"@szc-ft/szcd":{type:"NPM",value:"1.1.7"},react:{type:"NPM",value:"18.3.1"}},entry:"index.tsx"},context:{"@szc-ft/szcd":v,"@szc-ft/szcd/index.less":u,react:l||(l=r.t(p,2))},renderOpts:{compile:(t=s()(a()().mark(function e(){var n,l=arguments;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,r.e(250).then(r.bind(r,90250));case 2:return e.abrupt("return",(n=e.sent).default.apply(n,l));case 3:case"end":return e.stop()}},e)})),function(){return t.apply(this,arguments)})}}}},60810:function(e,n,r){"use strict";r.r(n),r.d(n,{demos:function(){return l}});r(67294);var l={}},65627:function(e,n,r){"use strict";var l;r.r(n),r.d(n,{demos:function(){return x}});var t,o=r(15009),a=r.n(o),d=r(49677),c=r.n(d),i=r(99289),s=r.n(i),p=r(67294),v=r(30789),u=r(28801),m=r(2901),x={"docs-icon-demo-0":{component:p.memo(p.lazy(s()(a()().mark(function e(){var n,l,t,o,d,i,s,p,v,u,m,x,f,g,b;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return b=function(e){return e.toLowerCase().replace(/( |^)[a-z]/g,function(e){return e.toUpperCase()})},e.next=3,Promise.resolve().then(r.bind(r,30789));case 3:return n=e.sent,l=n.copyText,e.next=7,Promise.resolve().then(r.bind(r,28801));case 7:return t=e.sent,e.next=10,Promise.resolve().then(r.bind(r,28801));case 10:return o=e.sent,d=o.default,e.t0=c(),e.next=15,Promise.resolve().then(r.bind(r,2901));case 15:return e.t1=e.sent,(0,e.t0)(e.t1),e.next=19,Promise.resolve().then(r.bind(r,28801));case 19:return i=e.sent,s=i.Divider,e.next=23,Promise.resolve().then(r.t.bind(r,67294,19));case 23:return p=e.sent,v=p.default,(new d).load(document.body),u=["step-backward","step-forward","fast-backward","fast-forward","shrink","arrows-alt","down","up","left","right","caret-up","caret-down","caret-left","caret-right","up-circle","down-circle","left-circle","right-circle","double-left","double-right","vertical-left","vertical-right","vertical-align-top","vertical-align-middle","vertical-align-bottom","rollback","enter","retweet","swap","swap-left","swap-right","arrow-up","arrow-down","arrow-right","arrow-left","play-circle","up-square","down-square","left-square","right-square","login","logout","menu-fold","menu-unfold","fullscreen","fullscreen-exit"],m=["question-circle","plus","plus-circle","pause","pause-circle","minus","minus-circle","plus-square","minus-square","info-circle","exclamation","exclamation-circle","close","close-square","check","check-circle","check-square","clock-circle","warning","stop"],x=["edit","form","copy","scissor","delete","highlight","align-center","align-left","align-right","bold","italic","underline","strikethrough","redo","undo","zoom-in","zoom-out","font-colors","font-size","line-height","dash","small-dash","unordered-list","sort-ascending","drag"],f=["lock","unlock","filter","search","more","eye","eye-invisible","appstore","mail","paper-clip","star","picture","history","download","link","user","setting","poweroff","folder","folder-add","file","reload","bell","sync","border","file-search","upload","calendar"],g=function(e){var n=e.icon;return v.createElement(t[n])},e.abrupt("return",{default:function(){return v.createElement("div",null,v.createElement(s,{orientation:"left"},"方向性图标"),v.createElement("ul",{className:"szc-icon-list"},u.map(function(e){var n=e.split("-").map(function(e){return b(e)}).join("")+"Outlined";return v.createElement("li",{key:n,onClick:function(){return l(n)}},v.createElement(g,{icon:n}),v.createElement("p",null,e))})),v.createElement("br",null),v.createElement(s,{orientation:"left"},"提示建议性图标"),v.createElement("ul",{className:"szc-icon-list"},m.map(function(e){var n=e.split("-").map(function(e){return b(e)}).join("")+"Outlined";return v.createElement("li",{key:n,onClick:function(){return l(n)}},v.createElement(g,{icon:n}),v.createElement("p",null,e))})),v.createElement(s,{orientation:"left"},"编辑类图标"),v.createElement("ul",{className:"szc-icon-list"},x.map(function(e){var n=e.split("-").map(function(e){return b(e)}).join("")+"Outlined";return v.createElement("li",{key:n,onClick:function(){return l(n)}},v.createElement(g,{icon:n}),v.createElement("p",null,e))})),v.createElement(s,{orientation:"left"},"数据类图标"),v.createElement(s,{orientation:"left"},"网站通用类图标"),v.createElement("ul",{className:"szc-icon-list"},f.map(function(e){var n=e.split("-").map(function(e){return b(e)}).join("")+"Outlined";return v.createElement("li",{key:n,onClick:function(){return l(n)}},v.createElement(g,{icon:n}),v.createElement("p",null,e))})))}});case 32:case"end":return e.stop()}},e)})))),asset:{type:"BLOCK",id:"docs-icon-demo-0",refAtomIds:[],dependencies:{"index.tsx":{type:"FILE",value:"import { copyText } from '@/utils/utils';\nimport * as Icons from '@szc-ft/szcd';\nimport Theme from '@szc-ft/szcd';\nimport '@szc-ft/szcd/index.less';\nimport { Divider } from \"@szc-ft/szcd\";\nimport React from 'react';\nnew Theme().load(document.body);\nconst iconDirectivityList = [\n  'step-backward',\n  'step-forward',\n  'fast-backward',\n  'fast-forward',\n  'shrink',\n  'arrows-alt',\n  'down',\n  'up',\n  'left',\n  'right',\n  'caret-up',\n  'caret-down',\n  'caret-left',\n  'caret-right',\n  'up-circle',\n  'down-circle',\n  'left-circle',\n  'right-circle',\n  'double-left',\n  'double-right',\n  'vertical-left',\n  'vertical-right',\n  'vertical-align-top',\n  'vertical-align-middle',\n  'vertical-align-bottom',\n  'rollback',\n  'enter',\n  'retweet',\n  'swap',\n  'swap-left',\n  'swap-right',\n  'arrow-up',\n  'arrow-down',\n  'arrow-right',\n  'arrow-left',\n  'play-circle',\n  'up-square',\n  'down-square',\n  'left-square',\n  'right-square',\n  'login',\n  'logout',\n  'menu-fold',\n  'menu-unfold',\n  'fullscreen',\n  'fullscreen-exit',\n];\nconst iconHintList = [\n  'question-circle',\n  'plus',\n  'plus-circle',\n  'pause',\n  'pause-circle',\n  'minus',\n  'minus-circle',\n  'plus-square',\n  'minus-square',\n  // 'info',\n  'info-circle',\n  'exclamation',\n  'exclamation-circle',\n  'close',\n  // 'close-circle',\n  'close-square',\n  'check',\n  'check-circle',\n  'check-square',\n  'clock-circle',\n  'warning',\n  // 'issues-close',\n  'stop',\n];\nconst editList = [\n  'edit',\n  'form',\n  'copy',\n  'scissor',\n  'delete',\n  'highlight',\n  'align-center',\n  'align-left',\n  'align-right',\n  // 'bg-colors',\n  'bold',\n  'italic',\n  'underline',\n  'strikethrough',\n  'redo',\n  'undo',\n  'zoom-in',\n  'zoom-out',\n  'font-colors',\n  'font-size',\n  'line-height',\n  'dash',\n  'small-dash',\n  'unordered-list',\n  'sort-ascending',\n  //  'sort-descending',\n  'drag',\n];\nconst websiteUniver = [\n  'lock',\n  'unlock',\n  'filter',\n  'search',\n  'more',\n\n  'eye',\n  'eye-invisible',\n  'appstore',\n  'mail',\n  'paper-clip',\n  'star',\n  'picture',\n  'history',\n  'download',\n  'link',\n  'user',\n  'setting',\n  'poweroff',\n  'folder',\n  'folder-add',\n  'file',\n  'reload',\n  'bell',\n  'sync',\n  'border',\n  'file-search',\n  'upload',\n  'calendar',\n];\nconst Iconfont = (props) => {\n  const { icon } = props;\n  return React.createElement(Icons[icon]);\n};\n\n//ES6写法\nfunction titleCase5(str) {\n  return str.toLowerCase().replace(/( |^)[a-z]/g, (L) => L.toUpperCase());\n}\nexport default () => (\n  <div>\n    <Divider orientation=\"left\">方向性图标</Divider>\n\n    <ul className=\"szc-icon-list\">\n      {iconDirectivityList.map((key) => {\n        let comName =\n          key\n            .split('-')\n            .map((word) => titleCase5(word))\n            .join('') + 'Outlined';\n        {\n          /* console.log(comName) */\n        }\n        return (\n          <li key={comName} onClick={() => copyText(comName)}>\n            <Iconfont icon={comName} />\n            <p>{key}</p>\n          </li>\n        );\n      })}\n    </ul>\n    {/* <Row gutter={[18,18]}>\n      <Col span={3}>\n        <Icon type=\"down\" />\n        <p>down</p>\n   \n      </Col>\n      <Col span={3}>\n           <Icon type=\"left\" />\n          <p>left</p>\n\n      </Col>\n    </Row> */}\n    <br />\n    <Divider orientation=\"left\">提示建议性图标</Divider>\n    <ul className=\"szc-icon-list\">\n      {iconHintList.map((key) => {\n        let comName =\n          key\n            .split('-')\n            .map((word) => titleCase5(word))\n            .join('') + 'Outlined';\n        {\n          /* console.log(comName) */\n        }\n        return (\n          <li key={comName} onClick={() => copyText(comName)}>\n            <Iconfont icon={comName} />\n            <p>{key}</p>\n          </li>\n        );\n      })}\n    </ul>\n    <Divider orientation=\"left\">编辑类图标</Divider>\n    <ul className=\"szc-icon-list\">\n      {editList.map((key) => {\n        let comName =\n          key\n            .split('-')\n            .map((word) => titleCase5(word))\n            .join('') + 'Outlined';\n        {\n          /* console.log(comName) */\n        }\n        return (\n          <li key={comName} onClick={() => copyText(comName)}>\n            <Iconfont icon={comName} />\n            <p>{key}</p>\n          </li>\n        );\n      })}\n    </ul>\n    <Divider orientation=\"left\">数据类图标</Divider>\n    <Divider orientation=\"left\">网站通用类图标</Divider>\n    <ul className=\"szc-icon-list\">\n      {websiteUniver.map((key) => {\n        let comName =\n          key\n            .split('-')\n            .map((word) => titleCase5(word))\n            .join('') + 'Outlined';\n        {\n          /* console.log(comName) */\n        }\n        return (\n          <li key={comName} onClick={() => copyText(comName)}>\n            <Iconfont icon={comName} />\n            <p>{key}</p>\n          </li>\n        );\n      })}\n    </ul>\n  </div>\n);"},"@szc-ft/szcd":{type:"NPM",value:"1.1.7"},react:{type:"NPM",value:"18.3.1"}},entry:"index.tsx"},context:{"@/utils/utils":v,"@szc-ft/szcd":u,"@szc-ft/szcd/index.less":m,react:l||(l=r.t(p,2))},renderOpts:{compile:(t=s()(a()().mark(function e(){var n,l=arguments;return a()().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,r.e(250).then(r.bind(r,90250));case 2:return e.abrupt("return",(n=e.sent).default.apply(n,l));case 3:case"end":return e.stop()}},e)})),function(){return t.apply(this,arguments)})}}}},11171:function(e,n,r){"use strict";r.r(n),r.d(n,{demos:function(){return l}});r(67294);var l={}},88851:function(e,n,r){"use strict";r.r(n),r.d(n,{demos:function(){return l}});r(67294);var l={}},99618:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:"颜色有助于表达层次结构，建立品牌形象，赋予意义，并指示元素状态。",paraId:0,tocIndex:0},{value:"样式变量采用 less 写法，变量已注入 element 中的 root 中，在项目中需使用可以直接使用样式变量",paraId:1,tocIndex:0}]},27146:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:"字体的总体使用原则：中文优先调用用户系统字体，windows 系统推荐使 ",paraId:0,tocIndex:0},{value:"微软雅黑",paraId:0,tocIndex:0},{value:"，MAC 系统推荐调用 ",paraId:0,tocIndex:0},{value:"苹方",paraId:0,tocIndex:0}]},87799:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:"szcd 组件集 系集成 ",paraId:0,tocIndex:0},{value:"Antd Design@^5.5.1",paraId:0,tocIndex:0},{value:"、",paraId:0,tocIndex:0},{value:"@ant-design/pro-components@^2.3.57",paraId:0,tocIndex:0},{value:"、",paraId:0,tocIndex:0},{value:"@ant-design/icons@^5.2.5",paraId:0,tocIndex:0},{value:" 的高级组件集合。",paraId:0,tocIndex:0},{value:"并且在 Ant Design 上进行了自己的封装，更加易用，与 Ant Design 设计体系一脉相承，无缝对接 antd 项目。",paraId:0,tocIndex:0},{value:"样式风格与 antd 一脉相承，无需魔改，浑然天成。默认好用的主题系统，组件使用 TypeScript 开发，提供完整的类型定义文件，无需频繁打开官网。",paraId:0,tocIndex:0},{value:"// 方法一 安装的同时，需要确保 @szc-ft 的包源是指定内网的nexus地址\nregistry=http://maven.smartcitysz.work/repository/registry.npmmirror.com/\n@szc-ft:registry=http://maven.smartcitysz.work/repository/szc-ft-component/\n\n// 方法二 指定coding为您项目的包源\n; 请妥善保管您的配置\nregistry=http://e-kjr1wok-npm.pkg.coding.smartcitysz.work/p-rpj2pdk/szc-front-pkg/\nalways-auth=true\n//e-kjr1wok-npm.pkg.coding.smartcitysz.work/p-rpj2pdk/szc-front-pkg/:username=szc-front-pkg-1685934532761\n//e-kjr1wok-npm.pkg.coding.smartcitysz.work/p-rpj2pdk/szc-front-pkg/:_password=N2ZhOTc2MDIyZWExYzBkYjViMDY1OGExMGQ5YTU1NmQ2NGRmNDhiMQ==\n//e-kjr1wok-npm.pkg.coding.smartcitysz.work/p-rpj2pdk/szc-front-pkg/:email=zhouyicheng@smartcitysz.com\n",paraId:1,tocIndex:2},{value:"如需使用szcd，你可能需要安装 @szc-ft/szcd 组件包集合：",paraId:2,tocIndex:3},{value:"npm install @szc-ft/szcd\n",paraId:3,tocIndex:3},{value:"// 引入provider的ts格式类型 与 szcd组件库的主题token配置包\nimport type { ConfigProviderProps } from 'antd/es/config-provider'\nimport tokenConfig from '@szc-ft/szcd/dist/theme/tokenConfig.json';\n\nexport default defineConfig({\n  // 在antd里面进行配置\n  antd: {\n    theme: {\n    ...tokenConfig\n    } as ConfigProviderProps['theme']\n  },\n\n  // 设置项目 alias, @szc-ft/szcd => szcd\n  chainWebpack(memo, { env, webpack }) {\n    memo.resolve.alias.set('szcd', '@szc-ft/szcd');\n  },\n})\n",paraId:4,tocIndex:4},{value:"import React from 'react';\n// 引入组件，要使用@ant-design/pro-components、@ant-design/icons也是同样的引入szcd即可。\nimport { Button, Space } from 'szcd';\n\nconst App: React.FC = () => (\n  <Space wrap>\n    <Button type=\"primary\">Primary Button</Button>\n  </Space>\n);\n\nexport default App;\n",paraId:5,tocIndex:5},{value:"本组件的publish源为nexus，因此 nexus 为镜像包的根源。",paraId:6,tocIndex:6},{value:"上传nexus后，可通过 coding 获取资源包。获取资源包同时，coding会进行一个自备份操作。",paraId:7,tocIndex:6},{value:"注意：发布时，需指定publish源为 ",paraId:8,tocIndex:6},{value:"http://maven.smartcitysz.work/repository/szc-ft-component/",paraId:8,tocIndex:6},{value:"使用过程中，如有使用建议、反馈或纠正，请与 ",paraId:9,tocIndex:7},{value:"常剑",paraId:9,tocIndex:7},{value:"(wx：carmancj)",paraId:9,tocIndex:7},{value:" 、",paraId:9,tocIndex:7},{value:"周异成",paraId:9,tocIndex:7},{value:"(wx：a277220239)",paraId:9,tocIndex:7},{value:" 或 ",paraId:9,tocIndex:7},{value:"李冠霖",paraId:9,tocIndex:7},{value:"(wx:LIGUANLIN760)",paraId:9,tocIndex:7},{value:" 联系，感谢您的支持与付出。",paraId:9,tocIndex:7}]},62537:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:"以下图标为直接基于 antd 基础上进行覆盖，所以用法直接用 antd icon 即可",paraId:0,tocIndex:0},{value:'<Icon type="xxx" />\n',paraId:1,tocIndex:1},{value:"使用 Icon 标签声明组件，指定图标对应的 type 属性。可以通过 theme 属性来设置不同的主题风格的图标，也可以通过设置 spin 属性来实现动画旋转效果。",paraId:2,tocIndex:1}]},51446:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:" ",paraId:0}]},26947:function(e,n,r){"use strict";r.r(n),r.d(n,{texts:function(){return l}});const l=[{value:"一般为周五进行版本的更新（排除其它客观影响）",paraId:0,tocIndex:0},{value:"本日志记录每个版本迭代更新内容作为更新参考",paraId:0,tocIndex:0},{value:"\n1.调整IconfontWapper动态加载构建使用了绝对路径的问题；\n\n\n",paraId:1,tocIndex:2},{value:"\n1.调整TableOrList合并分页参数的逻辑，修复编辑态没使用hook时的内置方法调用问题；\n\n\n",paraId:2,tocIndex:3},{value:"\n1.适配next,编写less转css的脚本文件，更改打包构建逻辑，增加css文件转换less文件逻辑，适配next.js等对less或sass，styled等预编译有要求的开发场景；\n\n\n",paraId:3,tocIndex:4},{value:"\n1.修复TableOrList组件在使用EditTable类型做表单编辑因表单托管状态时，假设实例不销毁导致表单数据丢失的问题，增加数据源更新时，自动setValue的逻辑；\n2.修复tootltip全局样式表样式冲突问题；\n\n\n",paraId:4,tocIndex:5},{value:"\n1.修复FormItemOrDetailItem组件使用formItemsReFresh强制刷新，在version1.0参数影响时没执行的问题；\n2.修复TableOrList初始化分页参数默认值未覆盖的问题；\n\n\n",paraId:5,tocIndex:6},{value:"\n1.修复ModelOrDrawer组件获取值回调中没有对数据格式化成功的问题；\n2.调整antd的版本，确保新的api使用；\n\n\n",paraId:6,tocIndex:7},{value:"\n1.修复TableOrList组件在请求异常时没返回响应未调用whenError回调的问题；\n2.修复checkbox使用indeterminate样式问题；\n\n\n",paraId:7,tocIndex:8},{value:"\n1.修复tootltip组件最大高度样式超出一屏的问题；\n2.修复checkbox背景颜色样式问题；\n\n\n",paraId:8,tocIndex:9},{value:"\n1.修复FormItemOrDetailItem组件边框算法重新排列的计算问题\n\n\n",paraId:9,tocIndex:10},{value:"\n1.修复FormItemOrDetailItem组件边框label样式高度的问题\n\n\n",paraId:10,tocIndex:11},{value:"\n1.修复LeftTree组件使用CustomTreeNode为空时的单击，双击事件的回调nodeProps不完整的问题\n\n\n",paraId:11,tocIndex:12},{value:"\n1.修复LeftTree组件使用fieldNames映射children传空的问题\n\n\n",paraId:12,tocIndex:13},{value:"\n1.重构图标组件动态加载静态资源，兼容vite构建打包异常的问题\n2.新增iconfont组件本地加载iconfont的使用示例;\n   \n",paraId:13,tocIndex:14},{value:"\n1.调整Query;\n   无边框枚举样式调整\n\n  \n",paraId:14,tocIndex:15},{value:"\n1.调整FormItemOrDetailItem;\n  增加classNames的透传接受自定义\n  调整Tooltip的使用方式\n2.调整LeftTree;\n  新增api - getdataRUNAsync便于处理await语法糖\n3.调整TableOrList;\n  新增api - getdataRUNAsync便于处理await语法糖\n\n  \n",paraId:15,tocIndex:16},{value:"\n1.调整FormItemOrDetailItem;\n  调整拖拽api：新增CustomPreviewBoxStyle，CustomPreviewDomStyle，defaultOffsetX，afterDrapFinish(拖拽完成回调)\n  调整Tooltip的使用方式\n2.调整TableOrList;\n  去掉不需要的表头padding样式\n3.调整ModelOrDrawer\n  修复ModeStyle样式表在组件重新打开时没有重新插入样式表的问题；\n  去掉Modal弹窗默认的页脚多余margin-top:24px;\n4.调整Tooltip组件默认的样式\n  \n",paraId:16,tocIndex:17},{value:"\n1.调整FormItemOrDetailItem;\n  修复部分拖拽完成预览未消失的问题；\n  修复部分节点拖拽查询重排后找不到索引的问题;\n  \n",paraId:17,tocIndex:18},{value:"\n1.调整FormItemOrDetailItem;\n  增加version-控制是否开2.0版本的组件缓存模式与拖拽模块；\n  兼容旧模式保证原代码运行；\n\n",paraId:18,tocIndex:19},{value:"\n1.调整FormItemOrDetailItem;\n  补充自定义renderFormItem或者render时的拖拽逻辑；\n  增加unNeedDrap，控制单个表单元素是否需要拖拽；\n\n",paraId:19,tocIndex:20},{value:"\n1.调整FormItemOrDetailItem;\n   增加自定义拖拽功能模块（结合react-dnd库）；\n2.组件库集成react-dnd并导出hook\n   HTML5Backend，\n   DndProvider,\n   DragPreviewImage,\n   useDrag,\n   useDrop,\n   useDragDropManager,\n   useDragLayer,\n\n",paraId:20,tocIndex:21},{value:"\n1.调整ModelOrDrawer;\n  调整ModeStyle的运行时渲染方式，变更为内部转换css插入style,去掉warpper，避免了性能影响；\n\n",paraId:21,tocIndex:22},{value:"\n1.调整ModelOrDrawer;\n  调整children的运行时渲染方式,避免prop的循环引用；\n2.调整IconfontWapper; \n  更新数据平台和技术平台的icon源；\n\n",paraId:22,tocIndex:23},{value:"\n1.调整ModelOrDrawer;\n  考虑旧代码的影响，恢复ModelOrDrawer组件的ModeStyle透传，提示ModelOrDrawer使用ModeStyle构建复杂样式的性能考虑；\n2.调整ModelOrDrawer; \n  调整默认的页脚paddingTop,增加24px；\n\n",paraId:23,tocIndex:24},{value:"\n1.调整FormItemOrDetailItem;\n   修复边框算法的部分边界问题；\n2.调整LeftTree的滚动加载更多高度的兼容，接受字符串，数字，计算高度\n\n",paraId:24,tocIndex:25},{value:"\n1.调整ModelOrDrawer;\n   增加api自定义页脚样式透传customFooterStyle；\n   考虑性能问题，去掉ModelOrDrawer组件的ModeStyle透传；\n\n",paraId:25,tocIndex:26},{value:"\n1.调整Table滚动轴样式;\n2.兼容因antd升级，影响的botton禁用态样式；\n\n",paraId:26,tocIndex:27},{value:"\n1.调整通用用户头像组件ModeAvatar应用在FormItemOrDetailItem等表单中的逻辑;\n\n",paraId:27,tocIndex:28},{value:"\n1.调整query的一些边界情况处理，过滤子元素数据为null遍历的问题;\n2.增加通用用户头像组件ModeAvatar\n\n\n",paraId:28,tocIndex:29},{value:"\n修复因样式调整导致的表格高度有误影响了查询弹窗等下拉\n\n",paraId:29,tocIndex:30},{value:"\n调整样式重绘逻辑，优化组件抽屉弹窗性能卡顿问题\n\n",paraId:30,tocIndex:31},{value:"\n修复因antd的升级影响破坏了部分默认样式标准；\n调整全局滚动条样式\n增加插件控制去掉线上环境的console.log\n\n\n",paraId:31,tocIndex:32},{value:"\n因antd的升级影响破坏了部分默认样式标准\n调整button的部分样式兼容\n调整TableOrList空值时的滚动样式;\n\n\n",paraId:32,tocIndex:33},{value:"\n调整LeftTree\n调整TableOrList;\n增加whenError请求异常回调，默认在请求异常时清空组件的source\n\n",paraId:33,tocIndex:34},{value:"\n调整FormItemOrDetailItem样式\n调整FormItemOrDetailItem开启描述态与编辑态共存时，间隔样式标准,回归文档流\n\n",paraId:34,tocIndex:35},{value:"\n调整因antd版本升级影响的部分样式\n调整TreeSelect样式\n\n",paraId:35,tocIndex:36},{value:"\n调整LeftTree\n1.部分生产环境的样式问题\n2.增加beforeSelect回调\n3.修复边界场景未选中问题\n调整query\n修复valueType类型为search时clear事件未触发查询\n调整TreeSelect导出缺失部分showpath等属性的问题\n调整TableOrList;\n1.调整树结构的样式，最后一级字体缩进16px\n\n",paraId:36,tocIndex:37},{value:"调整query\n1.新增配置unNeedFirstEvent：控制是否需要首次触发查询\n调整TableOrList;\n1.调整树结构的样式，节点字体对齐\n调整工具函数\n1.调整暴露的工具函数getBelongCate；优化children字段映射；\n\n",paraId:37,tocIndex:38},{value:"调整FormItemOrDetailItem \n1.整formitem-or-detailitem的extra定位样式；\n调整TableOrList的请求catchError的loading关闭\n调整tabs的底部的border；\n\n",paraId:38,tocIndex:39},{value:"调整FormItemOrDetailItem \n1.调整只读模式描述的边框算法；\n调整ModelOrDrawer的model模式下的footer默认样式\n调整TableOrList的最后一列默认样式\n\n",paraId:39,tocIndex:40},{value:"调整LeftTree \n1.调整默认节点的padding-left样式\n2.调整FormItemOrDetailItem开启描述态与编辑态共存时，间隔样式标准\n3.调整FormItemOrDetailItem开启提示时的间隔标准\n4.调整ModelOrDrawer的model模式下的footer默认样式\n5.调整TableOrList的树结构模式下的默认样式\n\n",paraId:40,tocIndex:41},{value:"调整LeftTree \n1.兼容长列表，增加长列表滚动加载更多回调\n  | needList | 选择兼容长列表 | boolean  | false |  |\n  | loadMoreData | 长列表滚动到底部加载更多 | fn  | - |  |\n2.调整FormItemOrDetailItem开启描述边框时，存在多个分组的情况下的样式问题\n3.修复ModelOrDrawer的ModeStyle不生效的问题\n\n",paraId:41,tocIndex:42},{value:"修复FormItemOrDetailItem盒模型继承的问题\n\n",paraId:42,tocIndex:43},{value:"组件库样式调整(根据UI要求)\n1.样式调整\n调整LeftTree \n调整TableOrList\n调整FormItemOrDetailItem\n调整Query\n调整button\n调整input\n调整picker\n调整treeSelect\n调整breadcrumb\n调整badge\n调整pagination\n调整radioButton\n调整slider\n调整tag\n调整modal\n调整tabs\n调整upload\n调整timeline\n调整space\n\n2.FormItemOrDetailItem增加只读模式下，descriptions边框模式\n  api增加needBorder（建议只在只读模式下使用）\n\n",paraId:43,tocIndex:44},{value:"组件自动过滤了不必要的参数-根据辅助安全扫描要求\n调整LeftTree \n1.增加adjustRequest回调（过滤请求入参）\n调整TableOrList\n1.增加adjustRequest回调（过滤请求入参）\n\n",paraId:44,tocIndex:45},{value:"调整LeftTree \n1.增加afterExpand，展开节点回调，调整全局暴露的工具函数getparentDataById增加第四个参数modifyFunc，参数为函数，处理遍历节点时操作树节点\n调整TableOrList\n1.调整默认固定表头时的滚轴样式；\n2.修改默认的空数据展示-增加暂无数据描述；\n调整FormItemOrDetailItem\n1.修复error提示与extra额外提示语的兼容样式；\n2.修复空label时自定义渲染的样式兼容；\n\n\n",paraId:45,tocIndex:46},{value:"调整LeftTree\n1.调整LeftTree开启前端查询刷新树的顺序逻辑；\n新增时空平台icon枚举；\n1.时空平台assets枚举：stPlatforms\n调整TableOrList\n1.调整删除最后一项向前翻页逻辑的paginationMapName映射；\n\n\n",paraId:46,tocIndex:47},{value:"\n调整LeftTree\n1.增加api(isDoubleClick控制是否开启双击模式)；\n2.优化searchKey为null时请求不携带额外参数；\n3.api增加Typographya，提供默认item排版props透传；调整默认文本溢出省略浮层挂载方向，避免拖拽行为被影响\n调整Query\n1.增加暴露配置按钮组的api（\n| SearchbtnProps | 暴露查询按钮props | props  | - |  |\n| ResetbtnProps |  暴露重置按钮props | props  | - |  |\n| SearchText | 查询按钮文本 | string  | '查询' |  |\n| ResetText | 重置按钮文本 | string  | '重置' |  |\n| btnStyle | 暴露按钮组的样式 | css  | - |  ）\n\n",paraId:47,tocIndex:48},{value:"\n1.恢复ModelOrDrawer的默认挂载节点为当前节点，避免打开抽屉弹窗拿不到子组件，渲染时机问题，调整多层遮罩层的push影响；\n2.优化query使用placement调整浮层位置；\n\n",paraId:48,tocIndex:49}]},49677:function(e){e.exports=function(e){if(null==e)throw new TypeError("Cannot destructure "+e)},e.exports.__esModule=!0,e.exports.default=e.exports}}]);