@fle-ui/next 1.0.0 → 1.0.4-alpha.0

package/docs-dist/components__button__button.md.js

@@ -108,7 +108,7 @@
               ? null
               : p,
           ),
-          w = Object(o['useRiddle'])(
+          _ = Object(o['useRiddle'])(
             (
               null === (a = p.hideActions) || void 0 === a
                 ? void 0
@@ -117,8 +117,8 @@
               ? null
               : p,
           ),
-          _ = Object(o['useMotions'])(p.motions || [], d.current),
-          y = u(_, 2),
+          w = Object(o['useMotions'])(p.motions || [], d.current),
+          y = u(w, 2),
           x = y[0],
           N = y[1],
           A = Object(o['useCopy'])(),
@@ -134,20 +134,20 @@
           T = R[0],
           B = R[1],
           U = Object(n['useState'])(Boolean(p.defaultShowCode)),
-          Z = u(U, 2),
-          q = Z[0],
-          z = Z[1],
-          H = Object(n['useState'])(Math.random()),
-          D = u(H, 2),
-          F = D[0],
-          J = D[1],
+          q = u(U, 2),
+          Z = q[0],
+          z = q[1],
+          D = Object(n['useState'])(Math.random()),
+          F = u(D, 2),
+          H = F[0],
+          J = F[1],
           $ = p.sources[S][T] || p.sources[S].content,
           G = Object(o['useTSPlaygroundUrl'])(E, $),
-          W = Object(n['useRef'])(),
-          X = Object(o['usePrefersColor'])(),
-          K = u(X, 1),
-          Q = K[0];
-        function V(e) {
+          X = Object(n['useRef'])(),
+          K = Object(o['usePrefersColor'])(),
+          Q = u(K, 1),
+          V = Q[0];
+        function W(e) {
           P(e), B(f(e, p.sources[e]));
         }
         return (
@@ -155,7 +155,7 @@
             function () {
               J(Math.random());
             },
-            [Q],
+            [V],
           ),
           l.a.createElement(
             'div',
@@ -194,9 +194,9 @@
                     style: {
                       height: String(p.iframe).replace(/(\d)$/, '$1px'),
                     },
-                    key: F,
+                    key: H,
                     src: h,
-                    ref: W,
+                    ref: X,
                   })
                 : p.children,
             ),
@@ -227,12 +227,12 @@
                   role: 'codesandbox',
                   onClick: g,
                 }),
-              w &&
+              _ &&
                 l.a.createElement('button', {
                   title: 'Open demo on Riddle',
                   className: '__dumi-default-icon',
                   role: 'riddle',
-                  onClick: w,
+                  onClick: _,
                 }),
               p.motions &&
                 l.a.createElement('button', {
@@ -277,7 +277,7 @@
                 },
               }),
               'tsx' === T &&
-                q &&
+                Z &&
                 l.a.createElement(
                   o['Link'],
                   { target: '_blank', to: G },
@@ -291,16 +291,16 @@
               l.a.createElement('button', {
                 title: 'Toggle source code panel',
                 className: '__dumi-default-icon'.concat(
-                  q ? ' __dumi-default-btn-expand' : '',
+                  Z ? ' __dumi-default-btn-expand' : '',
                 ),
                 role: 'source',
                 type: 'button',
                 onClick: function () {
-                  return z(!q);
+                  return z(!Z);
                 },
               }),
             ),
-            q &&
+            Z &&
               l.a.createElement(
                 'div',
                 { className: '__dumi-default-previewer-source-wrapper' },
@@ -312,7 +312,7 @@
                       prefixCls: '__dumi-default-tabs',
                       moreIcon: '\xb7\xb7\xb7',
                       defaultActiveKey: S,
-                      onChange: V,
+                      onChange: W,
                     },
                     Object.keys(p.sources).map(function (e) {
                       return l.a.createElement(r['a'], {
@@ -1018,8 +1018,8 @@
                 '\u3002',
               ),
               l.a.createElement('img', {
-                src: 'https://gw.alipayobjects.com/zos/antfincdn/MY%26THAPZrW/38f06cb9-293a-4b42-b183-9f443e79ffea.png',
-                style: { boxShadow: 'none', margin: '0', width: '100px' },
+                src: 'https://oss.elebuys.com/resource/fle-ui/202112231711360003662499.png',
+                style: { boxShadow: 'none', margin: '0', width: '300px' },
                 alt: '\u79fb\u9664\u4e24\u4e2a\u6c49\u5b57\u4e4b\u95f4\u7684\u7a7a\u683c',
               }),
               l.a.createElement('style', {

package/docs-dist/components__form__form.md.js

@@ -3588,7 +3588,7 @@
               n.a.createElement('style', {
                 dangerouslySetInnerHTML: {
                   __html:
-                    '\n.ant-form:not(.ant-form-inline):not(.ant-form-vertical) {\n  max-width: 600px;\n}\n.markdown.api-container table td:nth-of-type(4) {\n  white-space: nowrap;\n  word-wrap: break-word;\n}\n.ant-btn {\n  margin-right: 8px;\n}\n',
+                    '\n.ant-form:not(.ant-form-inline):not(.ant-form-vertical) {\n  max-width: 600px;\n}\n.markdown.api-container table td:nth-of-type(4) {\n  white-space: nowrap;\n  word-wrap: break-word;\n}\n.__dumi-default-previewer-demo .ant-btn {\n  margin-right: 8px;\n}\n\n',
                 },
               }),
               n.a.createElement(

package/docs-dist/components__layout__layout.md.js

@@ -876,7 +876,7 @@
               l.a.createElement('style', {
                 dangerouslySetInnerHTML: {
                   __html:
-                    '\n  [data-theme="dark"] .site-layout-background {\n    background: #141414;\n  }\n  [data-theme="dark"] .site-layout-header-background {\n    background: #1f1f1f;\n  }\n\n  [data-theme="dark"] .site-layout-content {\n    background: #141414;\n  }\n\n   [data-theme="dark"] .site-layout .site-layout-background {\n    background: #141414;\n  }\n\n  [data-theme="dark"] .site-layout-sub-header-background {\n    background: #141414;\n  }\n\n  #layout-basic {\n  text-align: center;\n}\n#layout-basic .ant-layout-header,\n#layout-basic .ant-layout-footer {\n  color: #fff;\n  background: #7dbcea;\n}\n[data-theme="dark"] #layout-basic .ant-layout-header {\n  background: #6aa0c7;\n}\n[data-theme="dark"] #layout-basic .ant-layout-footer {\n  background: #6aa0c7;\n}\n#layout-basic .ant-layout-footer {\n  line-height: 1.5;\n}\n#layout-basic .ant-layout-sider {\n  color: #fff;\n  line-height: 120px;\n  background: #3ba0e9;\n}\n[data-theme="dark"] #layout-basic .ant-layout-sider {\n  background: #3499ec;\n}\n#layout-basic .ant-layout-content {\n  min-height: 120px;\n  color: #fff;\n  line-height: 120px;\n  background: rgba(16, 142, 233, 1);\n}\n[data-theme="dark"] #layout-basic .ant-layout-content {\n  background: #107bcb;\n}\n#layout-basic .ant-layout + .ant-layout {\n  margin-top: 48px;\n}\n\n.site-layout-content {\n  min-height: 280px;\n  padding: 24px;\n  background: #fff;\n}\n#layout-top .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n.ant-row-rtl #layout-top .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n#layout-topside2 .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.ant-row-rtl #layout-topside2 .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n  \n\n#layout-topside .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.ant-row-rtl #layout-topside .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n\n\n#layout-customtrigger .trigger {\n  padding: 0 24px;\n  font-size: 18px;\n  line-height: 64px;\n  cursor: pointer;\n  transition: color 0.3s;\n}\n\n#layout-customtrigger .trigger:hover {\n  color: #1890ff;\n}\n\n#layout-customtrigger .logo {\n  height: 32px;\n  margin: 16px;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.site-layout .site-layout-background {\n  background: #fff;\n}\n\n\n#layout-responsive .logo {\n  height: 32px;\n  margin: 16px;\n  background: rgba(255, 255, 255, 0.2);\n}\n\n.site-layout-sub-header-background {\n  background: #fff;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n\n',
+                    '\n  [data-theme="dark"] .site-layout-background {\n    background: #141414;\n  }\n  [data-theme="dark"] .site-layout-header-background {\n    background: #1f1f1f;\n  }\n\n  [data-theme="dark"] .site-layout-content {\n    background: #141414;\n  }\n\n   [data-theme="dark"] .site-layout .site-layout-background {\n    background: #141414;\n  }\n\n  [data-theme="dark"] .site-layout-sub-header-background {\n    background: #141414;\n  }\n\n  #layout-basic {\n  text-align: center;\n}\n#layout-basic .ant-layout-header,\n#layout-basic .ant-layout-footer {\n  color: #fff;\n  background: #7dbcea;\n}\n[data-theme="dark"] #layout-basic .ant-layout-header {\n  background: #6aa0c7;\n}\n[data-theme="dark"] #layout-basic .ant-layout-footer {\n  background: #6aa0c7;\n}\n#layout-basic .ant-layout-footer {\n  line-height: 1.5;\n}\n#layout-basic .ant-layout-sider {\n  color: #fff;\n  line-height: 120px;\n  background: #3ba0e9;\n}\n[data-theme="dark"] #layout-basic .ant-layout-sider {\n  background: #3499ec;\n}\n#layout-basic .ant-layout-content {\n  min-height: 120px;\n  color: #fff;\n  line-height: 120px;\n  background: rgba(16, 142, 233, 1);\n}\n[data-theme="dark"] #layout-basic .ant-layout-content {\n  background: #107bcb;\n}\n#layout-basic .ant-layout + .ant-layout {\n  margin-top: 48px;\n}\n\n.site-layout-content {\n  min-height: 280px;\n  padding: 24px;\n  background: #fff;\n}\n#layout-top .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n.ant-row-rtl #layout-top .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n#layout-topside2 .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.ant-row-rtl #layout-topside2 .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n  \n\n#layout-topside .logo {\n  float: left;\n  width: 120px;\n  height: 31px;\n  margin: 16px 24px 16px 0;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.ant-row-rtl #layout-topside .logo {\n  float: right;\n  margin: 16px 0 16px 24px;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n\n\n#layout-customtrigger .trigger {\n  padding: 0 24px;\n  font-size: 18px;\n  line-height: 64px;\n  cursor: pointer;\n  transition: color 0.3s;\n}\n\n#layout-customtrigger .trigger:hover {\n  color: #2c68ff;\n}\n\n#layout-customtrigger .logo {\n  height: 32px;\n  margin: 16px;\n  background: rgba(255, 255, 255, 0.3);\n}\n\n.site-layout .site-layout-background {\n  background: #fff;\n}\n\n\n#layout-responsive .logo {\n  height: 32px;\n  margin: 16px;\n  background: rgba(255, 255, 255, 0.2);\n}\n\n.site-layout-sub-header-background {\n  background: #fff;\n}\n\n.site-layout-background {\n  background: #fff;\n}\n\n',
                 },
               }),
             ),

package/docs-dist/components__modal__modal.md.js

@@ -30,7 +30,7 @@
         k = n.a.memo(o['default']['modal-button-props'].component),
         v = n.a.memo(o['default']['modal-hooks'].component),
         x = n.a.memo(o['default']['modal-modal-render'].component),
-        N = n.a.memo(o['default']['modal-width'].component);
+        y = n.a.memo(o['default']['modal-width'].component);
       t['default'] = (e) => (
         n.a.useEffect(() => {
           var t;
@@ -405,7 +405,7 @@
             n.a.createElement(
               c['default'],
               o['default']['modal-width'].previewerProps,
-              n.a.createElement(N, null),
+              n.a.createElement(y, null),
             ),
             n.a.createElement(
               'div',
@@ -1475,6 +1475,12 @@
                 ),
                 ' \u8fdb\u884c\u8bbe\u7f6e\u3002',
               ),
+              n.a.createElement('style', {
+                dangerouslySetInnerHTML: {
+                  __html:
+                    '\n\n .ant-modal-confirm-content p {\n  margin-bottom: 3px !important;\n}\n\n',
+                },
+              }),
             ),
           ),
         )
@@ -1579,7 +1585,7 @@
               ? null
               : f,
           ),
-          N = Object(m['useRiddle'])(
+          y = Object(m['useRiddle'])(
             (
               null === (l = f.hideActions) || void 0 === l
                 ? void 0
@@ -1588,16 +1594,16 @@
               ? null
               : f,
           ),
-          y = Object(m['useMotions'])(f.motions || [], E.current),
-          M = d(y, 2),
+          N = Object(m['useMotions'])(f.motions || [], E.current),
+          M = d(N, 2),
           g = M[0],
           w = M[1],
           C = Object(m['useCopy'])(),
           A = d(C, 2),
           L = A[0],
-          P = A[1],
-          _ = Object(a['useState'])('_'),
-          I = d(_, 2),
+          _ = A[1],
+          P = Object(a['useState'])('_'),
+          I = d(P, 2),
           S = I[0],
           O = I[1],
           R = Object(a['useState'])(p(S, f.sources[S])),
@@ -1698,12 +1704,12 @@
                   role: 'codesandbox',
                   onClick: x,
                 }),
-              N &&
+              y &&
                 n.a.createElement('button', {
                   title: 'Open demo on Riddle',
                   className: '__dumi-default-icon',
                   role: 'riddle',
-                  onClick: N,
+                  onClick: y,
                 }),
               f.motions &&
                 n.a.createElement('button', {
@@ -1742,7 +1748,7 @@
                 title: 'Copy source code',
                 className: '__dumi-default-icon',
                 role: 'copy',
-                'data-status': P,
+                'data-status': _,
                 onClick: function () {
                   return L(z);
                 },

package/docs-dist/components__popconfirm__popconfirm.md.js

@@ -1,14 +1,14 @@
 (window['webpackJsonp'] = window['webpackJsonp'] || []).push([
   [46],
   {
-    Hh86: function (e, t, a) {
+    Hh86: function (e, t, n) {
       'use strict';
-      a.r(t);
-      var n = a('q1tI'),
-        l = a.n(n),
-        r = a('dEAq'),
-        c = a('Zxc8'),
-        o = a('JjdP'),
+      n.r(t);
+      var a = n('q1tI'),
+        l = n.n(a),
+        r = n('dEAq'),
+        c = n('Zxc8'),
+        o = n('JjdP'),
         i = l.a.memo(o['default']['popconfirm-basic'].component),
         m = l.a.memo(o['default']['popconfirm-locale'].component),
         d = l.a.memo(o['default']['popconfirm-placement'].component),
@@ -448,7 +448,7 @@
               l.a.createElement('style', {
                 dangerouslySetInnerHTML: {
                   __html:
-                    '\n.demo {\n  overflow: auto;\n}\n.ant-popover-wrap > a {\n  margin-right: 8px;\n}\n.ant-btn {\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n#popconfirm-placement .ant-btn {\n  width: 70px;\n  text-align: center;\n  padding: 0;\n}\n',
+                    '\n.demo {\n  overflow: auto;\n}\n.ant-popover-wrap > a {\n  margin-right: 8px;\n}\n\n.popconfirm-placement-demo .ant-btn {\n  margin-right: 8px;\n  margin-bottom: 8px;\n} \n \n#popconfirm-placement .ant-btn {\n  width: 70px;\n  text-align: center;\n  padding: 0;\n}\n',
                 },
               }),
             ),
@@ -456,25 +456,25 @@
         )
       );
     },
-    MZF8: function (e, t, a) {
+    MZF8: function (e, t, n) {
       'use strict';
-      var n = a('ogwx');
-      a.d(t, 'a', function () {
-        return n['b'];
+      var a = n('ogwx');
+      n.d(t, 'a', function () {
+        return a['b'];
       });
-      a('VCU9');
+      n('VCU9');
     },
-    RZMt: function (e, t, a) {},
-    Zxc8: function (e, t, a) {
+    RZMt: function (e, t, n) {},
+    Zxc8: function (e, t, n) {
       'use strict';
-      a.r(t);
-      var n = a('q1tI'),
-        l = a.n(n),
-        r = a('k3GJ'),
-        c = a('MZF8'),
-        o = a('dEAq'),
-        i = a('H1Ra');
-      a('RZMt');
+      n.r(t);
+      var a = n('q1tI'),
+        l = n.n(a),
+        r = n('k3GJ'),
+        c = n('MZF8'),
+        o = n('dEAq'),
+        i = n('H1Ra');
+      n('RZMt');
       function m(e, t) {
         return p(e) || E(e, t) || u(e, t) || d();
       }
@@ -486,13 +486,13 @@
       function u(e, t) {
         if (e) {
           if ('string' === typeof e) return s(e, t);
-          var a = Object.prototype.toString.call(e).slice(8, -1);
+          var n = Object.prototype.toString.call(e).slice(8, -1);
           return (
-            'Object' === a && e.constructor && (a = e.constructor.name),
-            'Map' === a || 'Set' === a
+            'Object' === n && e.constructor && (n = e.constructor.name),
+            'Map' === n || 'Set' === n
               ? Array.from(e)
-              : 'Arguments' === a ||
-                /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)
+              : 'Arguments' === n ||
+                /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)
               ? s(e, t)
               : void 0
           );
@@ -500,29 +500,29 @@
       }
       function s(e, t) {
         (null == t || t > e.length) && (t = e.length);
-        for (var a = 0, n = new Array(t); a < t; a++) n[a] = e[a];
-        return n;
+        for (var n = 0, a = new Array(t); n < t; n++) a[n] = e[n];
+        return a;
       }
       function E(e, t) {
-        var a =
+        var n =
           null == e
             ? null
             : ('undefined' !== typeof Symbol && e[Symbol.iterator]) ||
               e['@@iterator'];
-        if (null != a) {
-          var n,
+        if (null != n) {
+          var a,
             l,
             r = [],
             c = !0,
             o = !1;
           try {
-            for (a = a.call(e); !(c = (n = a.next()).done); c = !0)
-              if ((r.push(n.value), t && r.length === t)) break;
+            for (n = n.call(e); !(c = (a = n.next()).done); c = !0)
+              if ((r.push(a.value), t && r.length === t)) break;
           } catch (i) {
             (o = !0), (l = i);
           } finally {
             try {
-              c || null == a['return'] || a['return']();
+              c || null == n['return'] || n['return']();
             } finally {
               if (o) throw l;
             }
@@ -534,17 +534,17 @@
         if (Array.isArray(e)) return e;
       }
       function f(e, t) {
-        var a,
-          n =
-            null === (a = e.match(/\.(\w+)$/)) || void 0 === a ? void 0 : a[1];
-        return n || (n = t.tsx ? 'tsx' : 'jsx'), n;
+        var n,
+          a =
+            null === (n = e.match(/\.(\w+)$/)) || void 0 === n ? void 0 : n[1];
+        return a || (a = t.tsx ? 'tsx' : 'jsx'), a;
       }
       var h = function (e) {
         var t,
-          a,
+          n,
           d,
-          u = Object(n['useRef'])(),
-          s = Object(n['useContext'])(o['context']),
+          u = Object(a['useRef'])(),
+          s = Object(a['useContext'])(o['context']),
           E = s.locale,
           p = Object(o['useLocaleProps'])(E, e),
           h = Object(o['useDemoUrl'])(p.identifier),
@@ -565,9 +565,9 @@
           ),
           _ = Object(o['useRiddle'])(
             (
-              null === (a = p.hideActions) || void 0 === a
+              null === (n = p.hideActions) || void 0 === n
                 ? void 0
-                : a.includes('RIDDLE')
+                : n.includes('RIDDLE')
             )
               ? null
               : p,
@@ -580,25 +580,25 @@
           I = m(A, 2),
           j = I[0],
           C = I[1],
-          L = Object(n['useState'])('_'),
+          L = Object(a['useState'])('_'),
           O = m(L, 2),
           P = O[0],
           S = O[1],
-          R = Object(n['useState'])(f(P, p.sources[P])),
+          R = Object(a['useState'])(f(P, p.sources[P])),
           M = m(R, 2),
           T = M[0],
           B = M[1],
-          U = Object(n['useState'])(Boolean(p.defaultShowCode)),
+          U = Object(a['useState'])(Boolean(p.defaultShowCode)),
           Z = m(U, 2),
           F = Z[0],
           J = Z[1],
-          q = Object(n['useState'])(Math.random()),
+          q = Object(a['useState'])(Math.random()),
           H = m(q, 2),
           $ = H[0],
           D = H[1],
           G = p.sources[P][T] || p.sources[P].content,
           X = Object(o['useTSPlaygroundUrl'])(E, G),
-          K = Object(n['useRef'])(),
+          K = Object(a['useRef'])(),
           V = Object(o['usePrefersColor'])(),
           z = m(V, 1),
           Q = z[0];
@@ -606,7 +606,7 @@
           S(e), B(f(e, p.sources[e]));
         }
         return (
-          Object(n['useEffect'])(
+          Object(a['useEffect'])(
             function () {
               D(Math.random());
             },

package/docs-dist/components__skeleton__skeleton.md.chunk.css

@@ -0,0 +1 @@
+.__dumi-default-previewer{background-color:#fff;border:1px solid #ebedf1;border-radius:1px}[data-prefers-color=dark] .__dumi-default-previewer{background-color:#141414;border-color:#6b6c6d}.__dumi-default-previewer[data-debug]{margin-top:32px;border-color:#ffcb00}.__dumi-default-previewer[data-debug]:before{content:"DEV ONLY";float:left;margin-left:-1px;margin-top:-18px;padding:3px 6px;font-size:12px;line-height:1;background-color:#ffcb00;color:#735600;text-shadow:.5px .5px 0 hsla(0,0%,100%,.5);border-top-left-radius:1px;border-top-right-radius:1px}.__dumi-default-previewer[data-iframe] .__dumi-default-previewer-browser-nav{padding:2px 6px;background-color:#ebedf1}.__dumi-default-previewer[data-iframe] .__dumi-default-previewer-browser-nav:before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#fd6458;box-shadow:20px 0 0 #ffbf2b,40px 0 0 #24cc3d}.__dumi-default-previewer[data-iframe] .__dumi-default-previewer-demo>iframe{border:0;width:100%;height:300px}.__dumi-default-previewer+.__dumi-default-previewer{margin-top:32px}.__dumi-default-previewer-demo{padding:40px 24px}.__dumi-default-previewer-target{border-color:rgba(69,105,212,.5);box-shadow:0 0 0 5px rgba(69,105,212,.05)}.__dumi-default-previewer-desc>div:last-child{padding:1.2em 1em 1em;color:#454d64;border-top:1px solid #ebedf1}[data-prefers-color=dark] .__dumi-default-previewer-desc>div:last-child{border-color:#6b6c6d}.__dumi-default-previewer-desc .markdown>p:first-child{margin-top:0}.__dumi-default-previewer-desc .markdown>p:last-child{margin-bottom:0}.__dumi-default-previewer-desc[data-title]{position:relative}.__dumi-default-previewer-desc[data-title]>a:first-child{position:absolute;top:0;left:1em;margin-left:-4px;padding:0 4px;color:#454d64;font-size:inherit;font-weight:500;background:linear-gradient(0deg,#fff,#fff 50%,hsla(0,0%,100%,0)) 100%;transform:translateY(-50%);pointer-events:auto;cursor:pointer}[data-prefers-color=dark] .__dumi-default-previewer-desc[data-title]>a:first-child{color:hsla(0,0%,100%,.85);background:linear-gradient(0deg,#141414,#141414 50%,hsla(0,0%,100%,0)) 100%}.__dumi-default-previewer-desc[data-title]:empty{padding-top:0}.__dumi-default-previewer-desc[data-title]:empty+.__dumi-default-previewer-actions{height:46px;border-top-style:solid}.__dumi-default-previewer-actions{display:flex;height:40px;padding:0 1em;align-items:center;border-top:1px dashed #ebedf1}[data-prefers-color=dark] .__dumi-default-previewer-actions{border-color:#6b6c6d}.__dumi-default-previewer-actions>a:not(:last-child),.__dumi-default-previewer-actions>button:not(:last-child){margin-right:8px}.__dumi-default-previewer-actions>a{display:flex}.__dumi-default-previewer-actions button{position:relative;display:inline-block;width:16px;height:16px;padding:0;border:0;box-sizing:border-box;cursor:pointer;opacity:.6;outline:none;transition:opacity .2s,background .2s}[data-prefers-color=dark] .__dumi-default-previewer-actions button{opacity:1}.__dumi-default-previewer-actions button:after{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px}.__dumi-default-previewer-actions button:hover{opacity:.8}.__dumi-default-previewer-actions button:active{opacity:.9}.__dumi-default-previewer-actions button:disabled{opacity:.2;cursor:not-allowed}.__dumi-default-previewer-actions button[role=codesandbox]{background-position:-18px 0}.__dumi-default-previewer-actions button[role=codepen]{background-position:-36px 0}.__dumi-default-previewer-actions button[role=source]{background-position:-72px 0}.__dumi-default-previewer-actions button[role=change-jsx]{background-position:-90px 0}.__dumi-default-previewer-actions button[role=change-tsx]{background-position:-108px 0}.__dumi-default-previewer-actions button[role=open-demo]{background-position:-126px 0}.__dumi-default-previewer-actions button[role=motions]{background-position:-162px 0}.__dumi-default-previewer-actions button[role=sketch-component]{background-position:-182px 0}.__dumi-default-previewer-actions button[role=sketch-group]{background-position:-200px 0}.__dumi-default-previewer-actions button[role=copy][data-status=ready]{background-position:-54px 0}.__dumi-default-previewer-actions button[role=copy][data-status=copied]{pointer-events:none;background-position:-54px -16px}.__dumi-default-previewer-actions button[role=refresh]{background-position-x:-144px}.__dumi-default-previewer-actions>span{flex:1 1;display:inline-block}.__dumi-default-previewer-source{border-top:1px dashed #ebedf1}[data-prefers-color=dark] .__dumi-default-previewer-source{border-color:#6b6c6d}.__dumi-default-previewer-source-tab{border-top:1px dashed #ebedf1}[data-prefers-color=dark] .__dumi-default-previewer-source-tab{border-color:#6b6c6d}.__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn{position:relative;padding-left:32px}.__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn:after,.__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn:before{content:"";position:absolute;margin-right:4px;display:inline-block;box-sizing:border-box}.__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn:before{left:16px;top:50%;margin-top:-6px;width:10px;height:12px;border:1px solid #717484}.__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn:after{top:50%;left:23px;margin-top:-7px;width:4px;height:4px;background:#fff;border-bottom:1px solid #717484;transform:rotate(45deg)}[data-prefers-color=dark] .__dumi-default-previewer-source-tab .__dumi-default-tabs-tab-btn:after{background:#141414}.__dumi-default-tabs{overflow:hidden}.__dumi-default-tabs.__dumi-default-tabs-top{flex-direction:column}.__dumi-default-tabs.__dumi-default-tabs-top .__dumi-default-tabs-ink-bar{bottom:0}.__dumi-default-tabs-nav{display:flex}.__dumi-default-tabs-nav-wrap{display:flex;white-space:nowrap;overflow:hidden}.__dumi-default-tabs-nav-wrap.__dumi-default-tabs-nav-wrap-ping-left{box-shadow:inset 5px 0 5px -5px rgba(0,0,0,.1)}.__dumi-default-tabs-nav-wrap.__dumi-default-tabs-nav-wrap-ping-right~*>.__dumi-default-tabs-nav-more{box-shadow:0 0 5px rgba(0,0,0,.1)}.__dumi-default-tabs-nav-list{position:relative;display:flex;transition:transform .2s}.__dumi-default-tabs-nav-more{height:100%;cursor:pointer;background:none;border:0;transition:box-shadow .2s}.__dumi-default-tabs-tab{display:flex}.__dumi-default-tabs-tab-btn{padding:0 16px;font-size:14px;line-height:36px;border:0;outline:none;background:transparent;box-sizing:border-box;cursor:pointer}.__dumi-default-tabs-tab-btn:hover{color:#4569d4}.__dumi-default-tabs-ink-bar{position:absolute;height:2px;background:#4569d4;transition:left .2s,width .2s;pointer-events:none}[data-prefers-color=dark] .__dumi-default-tabs-ink-bar{background:#7395f7}.__dumi-default-tabs-dropdown{position:absolute;background:#fff;border:1px solid #ebedf1;max-height:200px;overflow:auto}.__dumi-default-tabs-dropdown>ul{list-style:none;margin:0;padding:0}.__dumi-default-tabs-dropdown>ul>li{padding:4px 12px;font-size:14px;cursor:pointer}.__dumi-default-tabs-dropdown>ul>li:hover{color:#4569d4}.__dumi-default-tabs-dropdown>ul>li:not(:last-child){border-bottom:1px dashed #ebedf1}.__dumi-default-tabs-dropdown-hidden{display:none}