@xhsreds/reds-rn-next 0.0.13 → 0.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/coverage/coverage-final.json +5 -4
- package/lib/cjs/components/Switch/index.js +32 -46
- package/lib/cjs/components/Switch/index.js.map +1 -1
- package/lib/cjs/components/Switch/styles.js +29 -0
- package/lib/cjs/components/Switch/styles.js.map +1 -0
- package/lib/cjs/index.js +1 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/esm/components/Switch/index.js +32 -46
- package/lib/esm/components/Switch/index.js.map +1 -1
- package/lib/esm/components/Switch/styles.js +25 -0
- package/lib/esm/components/Switch/styles.js.map +1 -0
- package/lib/esm/index.js +1 -0
- package/lib/esm/index.js.map +1 -1
- package/lib/types/packages/reds-rn/src/components/ConfigProvider/demo/base.d.ts +3 -0
- package/lib/types/packages/reds-rn/src/components/ConfigProvider/demo/token.d.ts +3 -0
- package/lib/types/packages/reds-rn/src/components/ConfigProvider/test/base.d.ts +3 -0
- package/lib/types/packages/reds-rn/src/components/ConfigProvider/test/index.test.d.ts +1 -1
- package/lib/types/packages/reds-rn/src/components/Switch/index.d.ts +1 -1
- package/lib/types/packages/reds-rn/src/components/Switch/styles.d.ts +20 -0
- package/package.json +1 -1
- package/src/components/ConfigProvider/demo/{base.jsx → base.tsx} +9 -8
- package/src/components/ConfigProvider/doc/index.mdx +1 -1
- package/src/components/ConfigProvider/doc/token.mdx +1 -1
- package/src/components/ConfigProvider/test/base.tsx +131 -0
- package/src/components/ConfigProvider/test/index.test.tsx +20 -5
- package/src/components/Switch/index.tsx +26 -39
- package/src/components/Switch/styles.tsx +24 -0
- package/src/components/ConfigProvider/demo/index.jsx +0 -50
- /package/src/components/ConfigProvider/demo/{token.jsx → token.tsx} +0 -0
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
{"/builds/fe/infra/reds/packages/reds-rn/src/components/Button/index.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Button/index.tsx","statementMap":{"0":{"start":{"line":4,"column":30},"end":{"line":23,"column":null}},"1":{"start":{"line":5,"column":2},"end":{"line":21,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":4,"column":47},"end":{"line":4,"column":48}},"loc":{"start":{"line":4,"column":68},"end":{"line":23,"column":1}}}},"branchMap":{},"s":{"0":0,"1":0},"f":{"0":0},"b":{}}
|
|
2
2
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Button/interface/index.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Button/interface/index.ts","statementMap":{"0":{"start":{"line":13,"column":40},"end":{"line":18,"column":null}},"1":{"start":{"line":19,"column":46},"end":{"line":24,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":0,"1":0},"f":{},"b":{}}
|
|
3
|
-
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/ConfigProvider.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/ConfigProvider.tsx","statementMap":{"0":{"start":{"line":6,"column":54},"end":{"line":47,"column":null}},"1":{"start":{"line":15,"column":6},"end":{"line":15,"column":null}},"2":{"start":{"line":17,"column":21},"end":{"line":34,"column":null}},"3":{"start":{"line":36,"column":2},"end":{"line":40,"column":null}},"4":{"start":{"line":42,"column":61},"end":{"line":44,"column":null}},"5":{"start":{"line":46,"column":2},"end":{"line":46,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":6,"column":54},"end":{"line":6,"column":55}},"loc":{"start":{"line":6,"column":86},"end":{"line":47,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":8,"column":4},"end":{"line":8,"column":null}},"type":"default-arg","locations":[{"start":{"line":8,"column":9},"end":{"line":8,"column":null}}]},"1":{"loc":{"start":{"line":9,"column":4},"end":{"line":12,"column":null}},"type":"default-arg","locations":[{"start":{"line":9,"column":12},"end":{"line":12,"column":null}}]},"2":{"loc":{"start":{"line":13,"column":4},"end":{"line":13,"column":null}},"type":"default-arg","locations":[{"start":{"line":13,"column":15},"end":{"line":13,"column":null}}]},"3":{"loc":{"start":{"line":18,"column":15},"end":{"line":18,"column":null}},"type":"binary-expr","locations":[{"start":{"line":18,"column":15},"end":{"line":18,"column":34}},{"start":{"line":18,"column":34},"end":{"line":18,"column":null}}]}},"s":{"0":
|
|
4
|
-
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigCache/ConfigCache.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigCache/ConfigCache.ts","statementMap":{"0":{"start":{"line":5,"column":53},"end":{"line":5,"column":null}},"1":{"start":{"line":6,"column":43},"end":{"line":6,"column":null}},"2":{"start":{"line":9,"column":27},"end":{"line":22,"column":null}},"3":{"start":{"line":23,"column":4},"end":{"line":23,"column":null}},"4":{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},"5":{"start":{"line":28,"column":6},"end":{"line":28,"column":null}},"6":{"start":{"line":29,"column":6},"end":{"line":49,"column":null}},"7":{"start":{"line":51,"column":6},"end":{"line":51,"column":null}},"8":{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},"9":{"start":{"line":53,"column":8},"end":{"line":53,"column":null}},"10":{"start":{"line":59,"column":4},"end":{"line":59,"column":null}},"11":{"start":{"line":63,"column":4},"end":{"line":63,"column":null}},"12":{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},"13":{"start":{"line":68,"column":6},"end":{"line":68,"column":null}},"14":{"start":{"line":70,"column":6},"end":{"line":70,"column":null}},"15":{"start":{"line":75,"column":4},"end":{"line":75,"column":null}},"16":{"start":{"line":79,"column":4},"end":{"line":79,"column":null}},"17":{"start":{"line":83,"column":4},"end":{"line":83,"column":null}},"18":{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},"19":{"start":{"line":92,"column":29},"end":{"line":95,"column":null}},"20":{"start":{"line":96,"column":6},"end":{"line":96,"column":null}},"21":{"start":{"line":98,"column":6},"end":{"line":98,"column":null}},"22":{"start":{"line":103,"column":4},"end":{"line":103,"column":null}},"23":{"start":{"line":107,"column":4},"end":{"line":107,"column":null}},"24":{"start":{"line":111,"column":4},"end":{"line":111,"column":null}},"25":{"start":{"line":115,"column":27},"end":{"line":115,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":8,"column":2},"end":{"line":8,"column":14}},"loc":{"start":{"line":8,"column":48},"end":{"line":24,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":26,"column":2},"end":{"line":26,"column":20}},"loc":{"start":{"line":26,"column":64},"end":{"line":56,"column":null}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":58,"column":2},"end":{"line":58,"column":18}},"loc":{"start":{"line":58,"column":82},"end":{"line":60,"column":null}}},"3":{"name":"(anonymous_3)","decl":{"start":{"line":62,"column":2},"end":{"line":62,"column":19}},"loc":{"start":{"line":62,"column":31},"end":{"line":64,"column":null}}},"4":{"name":"(anonymous_4)","decl":{"start":{"line":66,"column":2},"end":{"line":66,"column":15}},"loc":{"start":{"line":66,"column":116},"end":{"line":72,"column":null}}},"5":{"name":"(anonymous_5)","decl":{"start":{"line":74,"column":2},"end":{"line":74,"column":20}},"loc":{"start":{"line":74,"column":61},"end":{"line":76,"column":null}}},"6":{"name":"(anonymous_6)","decl":{"start":{"line":78,"column":2},"end":{"line":78,"column":19}},"loc":{"start":{"line":78,"column":60},"end":{"line":80,"column":null}}},"7":{"name":"(anonymous_7)","decl":{"start":{"line":82,"column":2},"end":{"line":82,"column":21}},"loc":{"start":{"line":82,"column":62},"end":{"line":84,"column":null}}},"8":{"name":"(anonymous_8)","decl":{"start":{"line":86,"column":2},"end":{"line":86,"column":null}},"loc":{"start":{"line":90,"column":9},"end":{"line":100,"column":null}}},"9":{"name":"(anonymous_9)","decl":{"start":{"line":102,"column":2},"end":{"line":102,"column":32}},"loc":{"start":{"line":102,"column":66},"end":{"line":104,"column":null}}},"10":{"name":"(anonymous_10)","decl":{"start":{"line":106,"column":2},"end":{"line":106,"column":31}},"loc":{"start":{"line":106,"column":65},"end":{"line":108,"column":null}}},"11":{"name":"(anonymous_11)","decl":{"start":{"line":110,"column":2},"end":{"line":110,"column":33}},"loc":{"start":{"line":110,"column":67},"end":{"line":112,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},"type":"if","locations":[{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},{"start":{"line":50,"column":11},"end":{"line":55,"column":null}}]},"1":{"loc":{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},"type":"if","locations":[{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},{"start":{"line":52,"column":6},"end":{"line":54,"column":null}}]},"2":{"loc":{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},"type":"if","locations":[{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},{"start":{"line":69,"column":11},"end":{"line":71,"column":null}}]},"3":{"loc":{"start":{"line":70,"column":31},"end":{"line":70,"column":73}},"type":"binary-expr","locations":[{"start":{"line":70,"column":31},"end":{"line":70,"column":65}},{"start":{"line":70,"column":65},"end":{"line":70,"column":73}}]},"4":{"loc":{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},"type":"if","locations":[{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},{"start":{"line":97,"column":11},"end":{"line":99,"column":null}}]},"5":{"loc":{"start":{"line":98,"column":43},"end":{"line":98,"column":85}},"type":"binary-expr","locations":[{"start":{"line":98,"column":43},"end":{"line":98,"column":77}},{"start":{"line":98,"column":77},"end":{"line":98,"column":85}}]}},"s":{"0":
|
|
5
|
-
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigContext/ConfigContext.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigContext/ConfigContext.ts","statementMap":{"0":{"start":{"line":7,"column":37},"end":{"line":9,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":
|
|
3
|
+
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/ConfigProvider.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/ConfigProvider.tsx","statementMap":{"0":{"start":{"line":6,"column":54},"end":{"line":47,"column":null}},"1":{"start":{"line":15,"column":6},"end":{"line":15,"column":null}},"2":{"start":{"line":17,"column":21},"end":{"line":34,"column":null}},"3":{"start":{"line":36,"column":2},"end":{"line":40,"column":null}},"4":{"start":{"line":42,"column":61},"end":{"line":44,"column":null}},"5":{"start":{"line":46,"column":2},"end":{"line":46,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":6,"column":54},"end":{"line":6,"column":55}},"loc":{"start":{"line":6,"column":86},"end":{"line":47,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":8,"column":4},"end":{"line":8,"column":null}},"type":"default-arg","locations":[{"start":{"line":8,"column":9},"end":{"line":8,"column":null}}]},"1":{"loc":{"start":{"line":9,"column":4},"end":{"line":12,"column":null}},"type":"default-arg","locations":[{"start":{"line":9,"column":12},"end":{"line":12,"column":null}}]},"2":{"loc":{"start":{"line":13,"column":4},"end":{"line":13,"column":null}},"type":"default-arg","locations":[{"start":{"line":13,"column":15},"end":{"line":13,"column":null}}]},"3":{"loc":{"start":{"line":18,"column":15},"end":{"line":18,"column":null}},"type":"binary-expr","locations":[{"start":{"line":18,"column":15},"end":{"line":18,"column":34}},{"start":{"line":18,"column":34},"end":{"line":18,"column":null}}]}},"s":{"0":1,"1":1,"2":1,"3":1,"4":1,"5":1},"f":{"0":1},"b":{"0":[0],"1":[0],"2":[0],"3":[1,0]}}
|
|
4
|
+
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigCache/ConfigCache.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigCache/ConfigCache.ts","statementMap":{"0":{"start":{"line":5,"column":53},"end":{"line":5,"column":null}},"1":{"start":{"line":6,"column":43},"end":{"line":6,"column":null}},"2":{"start":{"line":9,"column":27},"end":{"line":22,"column":null}},"3":{"start":{"line":23,"column":4},"end":{"line":23,"column":null}},"4":{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},"5":{"start":{"line":28,"column":6},"end":{"line":28,"column":null}},"6":{"start":{"line":29,"column":6},"end":{"line":49,"column":null}},"7":{"start":{"line":51,"column":6},"end":{"line":51,"column":null}},"8":{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},"9":{"start":{"line":53,"column":8},"end":{"line":53,"column":null}},"10":{"start":{"line":59,"column":4},"end":{"line":59,"column":null}},"11":{"start":{"line":63,"column":4},"end":{"line":63,"column":null}},"12":{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},"13":{"start":{"line":68,"column":6},"end":{"line":68,"column":null}},"14":{"start":{"line":70,"column":6},"end":{"line":70,"column":null}},"15":{"start":{"line":75,"column":4},"end":{"line":75,"column":null}},"16":{"start":{"line":79,"column":4},"end":{"line":79,"column":null}},"17":{"start":{"line":83,"column":4},"end":{"line":83,"column":null}},"18":{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},"19":{"start":{"line":92,"column":29},"end":{"line":95,"column":null}},"20":{"start":{"line":96,"column":6},"end":{"line":96,"column":null}},"21":{"start":{"line":98,"column":6},"end":{"line":98,"column":null}},"22":{"start":{"line":103,"column":4},"end":{"line":103,"column":null}},"23":{"start":{"line":107,"column":4},"end":{"line":107,"column":null}},"24":{"start":{"line":111,"column":4},"end":{"line":111,"column":null}},"25":{"start":{"line":115,"column":27},"end":{"line":115,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":8,"column":2},"end":{"line":8,"column":14}},"loc":{"start":{"line":8,"column":48},"end":{"line":24,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":26,"column":2},"end":{"line":26,"column":20}},"loc":{"start":{"line":26,"column":64},"end":{"line":56,"column":null}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":58,"column":2},"end":{"line":58,"column":18}},"loc":{"start":{"line":58,"column":82},"end":{"line":60,"column":null}}},"3":{"name":"(anonymous_3)","decl":{"start":{"line":62,"column":2},"end":{"line":62,"column":19}},"loc":{"start":{"line":62,"column":31},"end":{"line":64,"column":null}}},"4":{"name":"(anonymous_4)","decl":{"start":{"line":66,"column":2},"end":{"line":66,"column":15}},"loc":{"start":{"line":66,"column":116},"end":{"line":72,"column":null}}},"5":{"name":"(anonymous_5)","decl":{"start":{"line":74,"column":2},"end":{"line":74,"column":20}},"loc":{"start":{"line":74,"column":61},"end":{"line":76,"column":null}}},"6":{"name":"(anonymous_6)","decl":{"start":{"line":78,"column":2},"end":{"line":78,"column":19}},"loc":{"start":{"line":78,"column":60},"end":{"line":80,"column":null}}},"7":{"name":"(anonymous_7)","decl":{"start":{"line":82,"column":2},"end":{"line":82,"column":21}},"loc":{"start":{"line":82,"column":62},"end":{"line":84,"column":null}}},"8":{"name":"(anonymous_8)","decl":{"start":{"line":86,"column":2},"end":{"line":86,"column":null}},"loc":{"start":{"line":90,"column":9},"end":{"line":100,"column":null}}},"9":{"name":"(anonymous_9)","decl":{"start":{"line":102,"column":2},"end":{"line":102,"column":32}},"loc":{"start":{"line":102,"column":66},"end":{"line":104,"column":null}}},"10":{"name":"(anonymous_10)","decl":{"start":{"line":106,"column":2},"end":{"line":106,"column":31}},"loc":{"start":{"line":106,"column":65},"end":{"line":108,"column":null}}},"11":{"name":"(anonymous_11)","decl":{"start":{"line":110,"column":2},"end":{"line":110,"column":33}},"loc":{"start":{"line":110,"column":67},"end":{"line":112,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},"type":"if","locations":[{"start":{"line":27,"column":4},"end":{"line":55,"column":null}},{"start":{"line":50,"column":11},"end":{"line":55,"column":null}}]},"1":{"loc":{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},"type":"if","locations":[{"start":{"line":52,"column":6},"end":{"line":54,"column":null}},{"start":{"line":52,"column":6},"end":{"line":54,"column":null}}]},"2":{"loc":{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},"type":"if","locations":[{"start":{"line":67,"column":4},"end":{"line":71,"column":null}},{"start":{"line":69,"column":11},"end":{"line":71,"column":null}}]},"3":{"loc":{"start":{"line":70,"column":31},"end":{"line":70,"column":73}},"type":"binary-expr","locations":[{"start":{"line":70,"column":31},"end":{"line":70,"column":65}},{"start":{"line":70,"column":65},"end":{"line":70,"column":73}}]},"4":{"loc":{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},"type":"if","locations":[{"start":{"line":91,"column":4},"end":{"line":99,"column":null}},{"start":{"line":97,"column":11},"end":{"line":99,"column":null}}]},"5":{"loc":{"start":{"line":98,"column":43},"end":{"line":98,"column":85}},"type":"binary-expr","locations":[{"start":{"line":98,"column":43},"end":{"line":98,"column":77}},{"start":{"line":98,"column":77},"end":{"line":98,"column":85}}]}},"s":{"0":1,"1":1,"2":1,"3":1,"4":2,"5":1,"6":1,"7":1,"8":1,"9":0,"10":0,"11":0,"12":0,"13":0,"14":0,"15":0,"16":0,"17":0,"18":0,"19":0,"20":0,"21":0,"22":0,"23":0,"24":0,"25":1},"f":{"0":1,"1":2,"2":0,"3":0,"4":0,"5":0,"6":0,"7":0,"8":0,"9":0,"10":0,"11":0},"b":{"0":[1,1],"1":[0,1],"2":[0,0],"3":[0,0],"4":[0,0],"5":[0,0]}}
|
|
5
|
+
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigContext/ConfigContext.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/ConfigContext/ConfigContext.ts","statementMap":{"0":{"start":{"line":7,"column":37},"end":{"line":9,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":1},"f":{},"b":{}}
|
|
6
6
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/themeToken/useThemeToken.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/hooks/themeToken/useThemeToken.ts","statementMap":{"0":{"start":{"line":7,"column":20},"end":{"line":10,"column":null}},"1":{"start":{"line":19,"column":29},"end":{"line":42,"column":null}},"2":{"start":{"line":20,"column":13},"end":{"line":20,"column":null}},"3":{"start":{"line":21,"column":33},"end":{"line":39,"column":null}},"4":{"start":{"line":25,"column":8},"end":{"line":27,"column":null}},"5":{"start":{"line":26,"column":10},"end":{"line":26,"column":null}},"6":{"start":{"line":28,"column":8},"end":{"line":36,"column":null}},"7":{"start":{"line":29,"column":10},"end":{"line":31,"column":null}},"8":{"start":{"line":33,"column":10},"end":{"line":35,"column":null}},"9":{"start":{"line":41,"column":2},"end":{"line":41,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":19,"column":29},"end":{"line":19,"column":30}},"loc":{"start":{"line":19,"column":116},"end":{"line":42,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":24,"column":6},"end":{"line":24,"column":32}},"loc":{"start":{"line":24,"column":64},"end":{"line":37,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":19,"column":53},"end":{"line":19,"column":116}},"type":"default-arg","locations":[{"start":{"line":19,"column":99},"end":{"line":19,"column":116}}]},"1":{"loc":{"start":{"line":25,"column":8},"end":{"line":27,"column":null}},"type":"if","locations":[{"start":{"line":25,"column":8},"end":{"line":27,"column":null}},{"start":{"line":25,"column":8},"end":{"line":27,"column":null}}]},"2":{"loc":{"start":{"line":28,"column":8},"end":{"line":36,"column":null}},"type":"if","locations":[{"start":{"line":28,"column":8},"end":{"line":36,"column":null}},{"start":{"line":32,"column":15},"end":{"line":36,"column":null}}]},"3":{"loc":{"start":{"line":29,"column":17},"end":{"line":31,"column":null}},"type":"cond-expr","locations":[{"start":{"line":30,"column":14},"end":{"line":30,"column":null}},{"start":{"line":31,"column":14},"end":{"line":31,"column":null}}]},"4":{"loc":{"start":{"line":33,"column":17},"end":{"line":35,"column":null}},"type":"cond-expr","locations":[{"start":{"line":34,"column":14},"end":{"line":34,"column":null}},{"start":{"line":35,"column":14},"end":{"line":35,"column":null}}]}},"s":{"0":0,"1":0,"2":0,"3":0,"4":0,"5":0,"6":0,"7":0,"8":0,"9":0},"f":{"0":0,"1":0},"b":{"0":[0],"1":[0,0],"2":[0,0],"3":[0,0],"4":[0,0]}}
|
|
7
7
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/interface/index.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/ConfigProvider/interface/index.ts","statementMap":{"0":{"start":{"line":39,"column":48},"end":{"line":54,"column":null}},"1":{"start":{"line":55,"column":62},"end":{"line":70,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":0,"1":0},"f":{},"b":{}}
|
|
8
8
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/component.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/component.tsx","statementMap":{"0":{"start":{"line":4,"column":28},"end":{"line":36,"column":null}},"1":{"start":{"line":14,"column":2},"end":{"line":14,"column":null}},"2":{"start":{"line":14,"column":18},"end":{"line":14,"column":null}},"3":{"start":{"line":15,"column":2},"end":{"line":34,"column":null}},"4":{"start":{"line":18,"column":23},"end":{"line":18,"column":null}},"5":{"start":{"line":38,"column":21},"end":{"line":57,"column":null}},"6":{"start":{"line":39,"column":2},"end":{"line":55,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":13,"column":2},"end":{"line":13,"column":3}},"loc":{"start":{"line":13,"column":66},"end":{"line":36,"column":1}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":18,"column":17},"end":{"line":18,"column":23}},"loc":{"start":{"line":18,"column":23},"end":{"line":18,"column":null}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":38,"column":69},"end":{"line":38,"column":70}},"loc":{"start":{"line":38,"column":96},"end":{"line":57,"column":1}}}},"branchMap":{"0":{"loc":{"start":{"line":14,"column":2},"end":{"line":14,"column":null}},"type":"if","locations":[{"start":{"line":14,"column":2},"end":{"line":14,"column":null}},{"start":{"line":14,"column":2},"end":{"line":14,"column":null}}]},"1":{"loc":{"start":{"line":14,"column":25},"end":{"line":14,"column":null}},"type":"cond-expr","locations":[{"start":{"line":14,"column":35},"end":{"line":14,"column":46}},{"start":{"line":14,"column":46},"end":{"line":14,"column":null}}]},"2":{"loc":{"start":{"line":20,"column":44},"end":{"line":20,"column":56}},"type":"binary-expr","locations":[{"start":{"line":20,"column":44},"end":{"line":20,"column":55}},{"start":{"line":20,"column":55},"end":{"line":20,"column":56}}]}},"s":{"0":1,"1":22,"2":16,"3":6,"4":1,"5":1,"6":8},"f":{"0":22,"1":1,"2":8},"b":{"0":[16,6],"1":[6,10],"2":[6,0]}}
|
|
9
9
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/hook.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/hook.ts","statementMap":{"0":{"start":{"line":7,"column":27},"end":{"line":66,"column":null}},"1":{"start":{"line":8,"column":19},"end":{"line":8,"column":null}},"2":{"start":{"line":9,"column":25},"end":{"line":9,"column":null}},"3":{"start":{"line":10,"column":21},"end":{"line":10,"column":null}},"4":{"start":{"line":11,"column":21},"end":{"line":11,"column":null}},"5":{"start":{"line":12,"column":71},"end":{"line":22,"column":null}},"6":{"start":{"line":25,"column":2},"end":{"line":34,"column":null}},"7":{"start":{"line":26,"column":4},"end":{"line":33,"column":null}},"8":{"start":{"line":27,"column":6},"end":{"line":27,"column":null}},"9":{"start":{"line":28,"column":6},"end":{"line":32,"column":null}},"10":{"start":{"line":29,"column":8},"end":{"line":31,"column":null}},"11":{"start":{"line":30,"column":10},"end":{"line":30,"column":null}},"12":{"start":{"line":36,"column":2},"end":{"line":65,"column":null}},"13":{"start":{"line":37,"column":35},"end":{"line":37,"column":null}},"14":{"start":{"line":38,"column":36},"end":{"line":38,"column":null}},"15":{"start":{"line":43,"column":23},"end":{"line":43,"column":null}},"16":{"start":{"line":44,"column":6},"end":{"line":44,"column":null}},"17":{"start":{"line":45,"column":6},"end":{"line":45,"column":null}},"18":{"start":{"line":48,"column":25},"end":{"line":48,"column":null}},"19":{"start":{"line":49,"column":6},"end":{"line":49,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":7,"column":27},"end":{"line":7,"column":28}},"loc":{"start":{"line":7,"column":118},"end":{"line":66,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":28,"column":35},"end":{"line":28,"column":36}},"loc":{"start":{"line":28,"column":69},"end":{"line":32,"column":null}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":29,"column":75},"end":{"line":29,"column":76}},"loc":{"start":{"line":29,"column":95},"end":{"line":31,"column":9}}},"3":{"name":"(anonymous_3)","decl":{"start":{"line":37,"column":20},"end":{"line":37,"column":24}},"loc":{"start":{"line":37,"column":35},"end":{"line":37,"column":null}}},"4":{"name":"(anonymous_4)","decl":{"start":{"line":38,"column":21},"end":{"line":38,"column":25}},"loc":{"start":{"line":38,"column":36},"end":{"line":38,"column":null}}},"5":{"name":"(anonymous_5)","decl":{"start":{"line":42,"column":23},"end":{"line":42,"column":24}},"loc":{"start":{"line":42,"column":83},"end":{"line":46,"column":null}}},"6":{"name":"(anonymous_6)","decl":{"start":{"line":47,"column":22},"end":{"line":47,"column":23}},"loc":{"start":{"line":47,"column":52},"end":{"line":50,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":25,"column":2},"end":{"line":34,"column":null}},"type":"if","locations":[{"start":{"line":25,"column":2},"end":{"line":34,"column":null}},{"start":{"line":25,"column":2},"end":{"line":34,"column":null}}]},"1":{"loc":{"start":{"line":25,"column":6},"end":{"line":25,"column":55}},"type":"binary-expr","locations":[{"start":{"line":25,"column":6},"end":{"line":25,"column":35}},{"start":{"line":25,"column":35},"end":{"line":25,"column":55}}]},"2":{"loc":{"start":{"line":26,"column":4},"end":{"line":33,"column":null}},"type":"if","locations":[{"start":{"line":26,"column":4},"end":{"line":33,"column":null}},{"start":{"line":26,"column":4},"end":{"line":33,"column":null}}]},"3":{"loc":{"start":{"line":54,"column":4},"end":{"line":57,"column":null}},"type":"cond-expr","locations":[{"start":{"line":56,"column":10},"end":{"line":56,"column":null}},{"start":{"line":57,"column":10},"end":{"line":57,"column":null}}]},"4":{"loc":{"start":{"line":54,"column":4},"end":{"line":55,"column":null}},"type":"binary-expr","locations":[{"start":{"line":55,"column":7},"end":{"line":55,"column":30}},{"start":{"line":55,"column":30},"end":{"line":55,"column":53}},{"start":{"line":55,"column":53},"end":{"line":55,"column":null}}]},"5":{"loc":{"start":{"line":60,"column":12},"end":{"line":60,"column":null}},"type":"cond-expr","locations":[{"start":{"line":60,"column":46},"end":{"line":60,"column":71}},{"start":{"line":60,"column":71},"end":{"line":60,"column":null}}]},"6":{"loc":{"start":{"line":61,"column":11},"end":{"line":61,"column":null}},"type":"cond-expr","locations":[{"start":{"line":61,"column":62},"end":{"line":61,"column":87}},{"start":{"line":61,"column":87},"end":{"line":61,"column":null}}]},"7":{"loc":{"start":{"line":62,"column":17},"end":{"line":62,"column":null}},"type":"cond-expr","locations":[{"start":{"line":62,"column":68},"end":{"line":62,"column":87}},{"start":{"line":62,"column":87},"end":{"line":62,"column":null}}]}},"s":{"0":1,"1":33,"2":33,"3":33,"4":33,"5":33,"6":33,"7":0,"8":0,"9":0,"10":0,"11":0,"12":33,"13":16,"14":44,"15":0,"16":0,"17":0,"18":0,"19":0},"f":{"0":33,"1":0,"2":0,"3":16,"4":44,"5":0,"6":0},"b":{"0":[0,33],"1":[33,0],"2":[0,0],"3":[0,33],"4":[33,33,0],"5":[0,33],"6":[0,33],"7":[0,33]}}
|
|
10
10
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/index.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/index.tsx","statementMap":{"0":{"start":{"line":20,"column":32},"end":{"line":20,"column":null}},"1":{"start":{"line":21,"column":20},"end":{"line":21,"column":null}},"2":{"start":{"line":21,"column":34},"end":{"line":21,"column":49}},"3":{"start":{"line":31,"column":6},"end":{"line":34,"column":null}},"4":{"start":{"line":35,"column":2},"end":{"line":37,"column":null}},"5":{"start":{"line":36,"column":4},"end":{"line":36,"column":null}},"6":{"start":{"line":39,"column":23},"end":{"line":49,"column":null}},"7":{"start":{"line":40,"column":4},"end":{"line":48,"column":null}},"8":{"start":{"line":51,"column":2},"end":{"line":125,"column":null}},"9":{"start":{"line":54,"column":8},"end":{"line":81,"column":null}},"10":{"start":{"line":55,"column":10},"end":{"line":79,"column":null}},"11":{"start":{"line":58,"column":16},"end":{"line":64,"column":null}},"12":{"start":{"line":59,"column":18},"end":{"line":63,"column":null}},"13":{"start":{"line":60,"column":20},"end":{"line":60,"column":null}},"14":{"start":{"line":62,"column":20},"end":{"line":62,"column":null}},"15":{"start":{"line":67,"column":16},"end":{"line":67,"column":null}},"16":{"start":{"line":70,"column":16},"end":{"line":70,"column":null}},"17":{"start":{"line":82,"column":8},"end":{"line":82,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":8,"column":15},"end":{"line":8,"column":16}},"loc":{"start":{"line":19,"column":19},"end":{"line":127,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":21,"column":28},"end":{"line":21,"column":34}},"loc":{"start":{"line":21,"column":34},"end":{"line":21,"column":49}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":35,"column":12},"end":{"line":35,"column":18}},"loc":{"start":{"line":35,"column":18},"end":{"line":37,"column":5}}},"3":{"name":"(anonymous_3)","decl":{"start":{"line":39,"column":31},"end":{"line":39,"column":37}},"loc":{"start":{"line":39,"column":37},"end":{"line":49,"column":5}}},"4":{"name":"(anonymous_4)","decl":{"start":{"line":53,"column":36},"end":{"line":53,"column":37}},"loc":{"start":{"line":53,"column":54},"end":{"line":83,"column":7}}},"5":{"name":"(anonymous_5)","decl":{"start":{"line":57,"column":23},"end":{"line":57,"column":29}},"loc":{"start":{"line":57,"column":29},"end":{"line":65,"column":null}}},"6":{"name":"(anonymous_6)","decl":{"start":{"line":66,"column":25},"end":{"line":66,"column":31}},"loc":{"start":{"line":66,"column":31},"end":{"line":68,"column":null}}},"7":{"name":"(anonymous_7)","decl":{"start":{"line":69,"column":26},"end":{"line":69,"column":32}},"loc":{"start":{"line":69,"column":32},"end":{"line":71,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":9,"column":2},"end":{"line":9,"column":null}},"type":"default-arg","locations":[{"start":{"line":9,"column":9},"end":{"line":9,"column":null}}]},"1":{"loc":{"start":{"line":10,"column":2},"end":{"line":10,"column":null}},"type":"default-arg","locations":[{"start":{"line":10,"column":12},"end":{"line":10,"column":null}}]},"2":{"loc":{"start":{"line":13,"column":2},"end":{"line":13,"column":null}},"type":"default-arg","locations":[{"start":{"line":13,"column":14},"end":{"line":13,"column":null}}]},"3":{"loc":{"start":{"line":14,"column":2},"end":{"line":14,"column":null}},"type":"default-arg","locations":[{"start":{"line":14,"column":22},"end":{"line":14,"column":null}}]},"4":{"loc":{"start":{"line":15,"column":2},"end":{"line":15,"column":null}},"type":"default-arg","locations":[{"start":{"line":15,"column":12},"end":{"line":15,"column":null}}]},"5":{"loc":{"start":{"line":16,"column":2},"end":{"line":16,"column":null}},"type":"default-arg","locations":[{"start":{"line":16,"column":11},"end":{"line":16,"column":null}}]},"6":{"loc":{"start":{"line":17,"column":11},"end":{"line":17,"column":null}},"type":"default-arg","locations":[{"start":{"line":17,"column":28},"end":{"line":17,"column":null}}]},"7":{"loc":{"start":{"line":40,"column":11},"end":{"line":48,"column":null}},"type":"cond-expr","locations":[{"start":{"line":41,"column":8},"end":{"line":44,"column":null}},{"start":{"line":45,"column":8},"end":{"line":48,"column":null}}]},"8":{"loc":{"start":{"line":54,"column":8},"end":{"line":81,"column":null}},"type":"if","locations":[{"start":{"line":54,"column":8},"end":{"line":81,"column":null}},{"start":{"line":54,"column":8},"end":{"line":81,"column":null}}]},"9":{"loc":{"start":{"line":54,"column":12},"end":{"line":54,"column":50}},"type":"binary-expr","locations":[{"start":{"line":54,"column":12},"end":{"line":54,"column":27}},{"start":{"line":54,"column":27},"end":{"line":54,"column":50}}]},"10":{"loc":{"start":{"line":58,"column":16},"end":{"line":64,"column":null}},"type":"if","locations":[{"start":{"line":58,"column":16},"end":{"line":64,"column":null}},{"start":{"line":58,"column":16},"end":{"line":64,"column":null}}]},"11":{"loc":{"start":{"line":59,"column":18},"end":{"line":63,"column":null}},"type":"if","locations":[{"start":{"line":59,"column":18},"end":{"line":63,"column":null}},{"start":{"line":61,"column":25},"end":{"line":63,"column":null}}]},"12":{"loc":{"start":{"line":67,"column":16},"end":{"line":67,"column":null}},"type":"binary-expr","locations":[{"start":{"line":67,"column":16},"end":{"line":67,"column":39}},{"start":{"line":67,"column":39},"end":{"line":67,"column":null}}]},"13":{"loc":{"start":{"line":70,"column":16},"end":{"line":70,"column":null}},"type":"binary-expr","locations":[{"start":{"line":70,"column":16},"end":{"line":70,"column":39}},{"start":{"line":70,"column":39},"end":{"line":70,"column":null}}]},"14":{"loc":{"start":{"line":91,"column":9},"end":{"line":122,"column":null}},"type":"binary-expr","locations":[{"start":{"line":91,"column":9},"end":{"line":91,"column":null}},{"start":{"line":92,"column":10},"end":{"line":122,"column":null}}]}},"s":{"0":33,"1":33,"2":4,"3":33,"4":33,"5":11,"6":33,"7":4,"8":33,"9":42,"10":33,"11":5,"12":5,"13":3,"14":2,"15":1,"16":1,"17":9},"f":{"0":33,"1":4,"2":11,"3":4,"4":42,"5":5,"6":1,"7":1},"b":{"0":[33],"1":[18],"2":[33],"3":[27],"4":[24],"5":[33],"6":[33],"7":[4,0],"8":[33,9],"9":[42,33],"10":[5,0],"11":[3,2],"12":[1,1],"13":[1,1],"14":[33,12]}}
|
|
11
11
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/interface/index.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Popover/interface/index.ts","statementMap":{"0":{"start":{"line":17,"column":48},"end":{"line":25,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":0},"f":{},"b":{}}
|
|
12
|
-
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/index.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/index.tsx","statementMap":{"0":{"start":{"line":6,"column":15},"end":{"line":
|
|
12
|
+
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/index.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/index.tsx","statementMap":{"0":{"start":{"line":6,"column":15},"end":{"line":45,"column":null}},"1":{"start":{"line":7,"column":23},"end":{"line":7,"column":null}},"2":{"start":{"line":8,"column":26},"end":{"line":8,"column":null}},"3":{"start":{"line":10,"column":24},"end":{"line":10,"column":null}},"4":{"start":{"line":11,"column":26},"end":{"line":11,"column":null}},"5":{"start":{"line":13,"column":2},"end":{"line":15,"column":null}},"6":{"start":{"line":14,"column":4},"end":{"line":14,"column":null}},"7":{"start":{"line":17,"column":2},"end":{"line":19,"column":null}},"8":{"start":{"line":18,"column":4},"end":{"line":18,"column":null}},"9":{"start":{"line":21,"column":23},"end":{"line":24,"column":null}},"10":{"start":{"line":22,"column":4},"end":{"line":22,"column":null}},"11":{"start":{"line":23,"column":4},"end":{"line":23,"column":null}},"12":{"start":{"line":23,"column":44},"end":{"line":23,"column":46}},"13":{"start":{"line":26,"column":24},"end":{"line":36,"column":null}},"14":{"start":{"line":27,"column":4},"end":{"line":31,"column":null}},"15":{"start":{"line":32,"column":4},"end":{"line":35,"column":null}},"16":{"start":{"line":38,"column":2},"end":{"line":43,"column":null}},"17":{"start":{"line":39,"column":46},"end":{"line":39,"column":null}},"18":{"start":{"line":47,"column":0},"end":{"line":47,"column":null}}},"fnMap":{"0":{"name":"(anonymous_0)","decl":{"start":{"line":6,"column":15},"end":{"line":6,"column":16}},"loc":{"start":{"line":6,"column":104},"end":{"line":45,"column":null}}},"1":{"name":"(anonymous_1)","decl":{"start":{"line":13,"column":12},"end":{"line":13,"column":18}},"loc":{"start":{"line":13,"column":18},"end":{"line":15,"column":5}}},"2":{"name":"(anonymous_2)","decl":{"start":{"line":17,"column":12},"end":{"line":17,"column":18}},"loc":{"start":{"line":17,"column":18},"end":{"line":19,"column":5}}},"3":{"name":"(anonymous_3)","decl":{"start":{"line":21,"column":35},"end":{"line":21,"column":36}},"loc":{"start":{"line":21,"column":65},"end":{"line":24,"column":5}}},"4":{"name":"(anonymous_4)","decl":{"start":{"line":23,"column":37},"end":{"line":23,"column":38}},"loc":{"start":{"line":23,"column":44},"end":{"line":23,"column":46}}},"5":{"name":"(anonymous_5)","decl":{"start":{"line":26,"column":32},"end":{"line":26,"column":38}},"loc":{"start":{"line":26,"column":38},"end":{"line":36,"column":5}}},"6":{"name":"(anonymous_6)","decl":{"start":{"line":39,"column":39},"end":{"line":39,"column":40}},"loc":{"start":{"line":39,"column":46},"end":{"line":39,"column":null}}}},"branchMap":{"0":{"loc":{"start":{"line":10,"column":50},"end":{"line":10,"column":71}},"type":"cond-expr","locations":[{"start":{"line":10,"column":65},"end":{"line":10,"column":70}},{"start":{"line":10,"column":70},"end":{"line":10,"column":71}}]},"1":{"loc":{"start":{"line":18,"column":4},"end":{"line":18,"column":null}},"type":"binary-expr","locations":[{"start":{"line":18,"column":4},"end":{"line":18,"column":28}},{"start":{"line":18,"column":28},"end":{"line":18,"column":null}}]},"2":{"loc":{"start":{"line":23,"column":4},"end":{"line":23,"column":null}},"type":"binary-expr","locations":[{"start":{"line":23,"column":4},"end":{"line":23,"column":29}},{"start":{"line":23,"column":29},"end":{"line":23,"column":null}}]},"3":{"loc":{"start":{"line":28,"column":15},"end":{"line":28,"column":null}},"type":"cond-expr","locations":[{"start":{"line":28,"column":22},"end":{"line":28,"column":27}},{"start":{"line":28,"column":27},"end":{"line":28,"column":null}}]},"4":{"loc":{"start":{"line":33,"column":23},"end":{"line":33,"column":null}},"type":"cond-expr","locations":[{"start":{"line":33,"column":30},"end":{"line":33,"column":45}},{"start":{"line":33,"column":45},"end":{"line":33,"column":null}}]}},"s":{"0":1,"1":3,"2":3,"3":3,"4":3,"5":3,"6":3,"7":3,"8":1,"9":3,"10":2,"11":2,"12":2,"13":3,"14":3,"15":3,"16":3,"17":2,"18":1},"f":{"0":3,"1":3,"2":1,"3":2,"4":2,"5":3,"6":2},"b":{"0":[0,3],"1":[1,0],"2":[2,2],"3":[1,2],"4":[1,2]}}
|
|
13
|
+
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/styles.tsx": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/styles.tsx","statementMap":{"0":{"start":{"line":4,"column":15},"end":{"line":22,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":1},"f":{},"b":{}}
|
|
13
14
|
,"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/interface/index.ts": {"path":"/builds/fe/infra/reds/packages/reds-rn/src/components/Switch/interface/index.ts","statementMap":{"0":{"start":{"line":14,"column":46},"end":{"line":20,"column":null}}},"fnMap":{},"branchMap":{},"s":{"0":1},"f":{},"b":{}}
|
|
14
15
|
}
|
|
@@ -6,80 +6,66 @@ var _rollupPluginBabelHelpers = require('../../_chunks/CAyGJuk1.js');
|
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var reactNative = require('react-native');
|
|
8
8
|
var components_Switch_interface_index = require('./interface/index.js');
|
|
9
|
-
var
|
|
9
|
+
var components_Switch_styles = require('./styles.js');
|
|
10
|
+
require('@xhsreds/reds-token-next');
|
|
10
11
|
|
|
11
12
|
var Switch = function Switch(_ref) {
|
|
12
|
-
var
|
|
13
|
+
var value = _ref.value,
|
|
13
14
|
defaultValue = _ref.defaultValue,
|
|
14
15
|
onChange = _ref.onChange,
|
|
15
16
|
onClick = _ref.onClick,
|
|
16
17
|
trackOnColor = _ref.trackOnColor,
|
|
17
18
|
trackOffColor = _ref.trackOffColor;
|
|
18
|
-
var isControlled =
|
|
19
|
+
var isControlled = React.useRef(value !== void 0);
|
|
19
20
|
var _useState = React.useState(defaultValue),
|
|
20
21
|
_useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
|
|
21
|
-
|
|
22
|
-
|
|
22
|
+
isOn = _useState2[0],
|
|
23
|
+
setIsOn = _useState2[1];
|
|
23
24
|
var animatedValue = React.useRef(new reactNative.Animated.Value(defaultValue ? 18 : 2)).current;
|
|
24
|
-
var thumbTranslateX =
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
25
|
+
var thumbTranslateX = animatedValue.interpolate({
|
|
26
|
+
inputRange: [2, 18],
|
|
27
|
+
outputRange: [2, 18]
|
|
28
|
+
});
|
|
29
|
+
React.useEffect(function () {
|
|
30
|
+
onChange === null || onChange === void 0 || onChange(!!isOn);
|
|
31
|
+
}, [isOn]);
|
|
32
|
+
React.useEffect(function () {
|
|
33
|
+
isControlled.current && setIsOn(value);
|
|
34
|
+
}, [value]);
|
|
35
|
+
var toggleSwitch = React.useCallback(function (e) {
|
|
36
|
+
onClick === null || onClick === void 0 || onClick(e);
|
|
37
|
+
!isControlled.current && setIsOn(function (v) {
|
|
38
|
+
return !v;
|
|
28
39
|
});
|
|
29
40
|
}, []);
|
|
30
|
-
React.
|
|
31
|
-
onChange === null || onChange === void 0 || onChange(!!value);
|
|
41
|
+
var dynamicStyles = React.useMemo(function () {
|
|
32
42
|
reactNative.Animated.timing(animatedValue, {
|
|
33
|
-
toValue:
|
|
43
|
+
toValue: isOn ? 18 : 2,
|
|
34
44
|
duration: 200,
|
|
35
45
|
useNativeDriver: true
|
|
36
46
|
}).start();
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
47
|
+
return {
|
|
48
|
+
backgroundColor: isOn ? trackOnColor : trackOffColor,
|
|
49
|
+
transform: [{
|
|
50
|
+
translateX: thumbTranslateX
|
|
51
|
+
}]
|
|
52
|
+
};
|
|
40
53
|
}, [isOn]);
|
|
41
|
-
var toggleSwitch = function toggleSwitch(e) {
|
|
42
|
-
onClick === null || onClick === void 0 || onClick(e);
|
|
43
|
-
!isControlled && setValue(function (v) {
|
|
44
|
-
return !v;
|
|
45
|
-
});
|
|
46
|
-
};
|
|
47
54
|
return /* @__PURE__ */React.createElement(reactNative.TouchableWithoutFeedback, {
|
|
48
55
|
onPress: function onPress(e) {
|
|
49
56
|
return toggleSwitch(e);
|
|
50
57
|
}
|
|
51
58
|
}, /* @__PURE__ */React.createElement(reactNative.View, {
|
|
52
|
-
style: [
|
|
53
|
-
backgroundColor:
|
|
59
|
+
style: [components_Switch_styles.default.switchContainer, {
|
|
60
|
+
backgroundColor: dynamicStyles.backgroundColor
|
|
54
61
|
}]
|
|
55
62
|
}, /* @__PURE__ */React.createElement(reactNative.Animated.View, {
|
|
56
|
-
style: [
|
|
57
|
-
transform:
|
|
58
|
-
translateX: thumbTranslateX
|
|
59
|
-
}]
|
|
63
|
+
style: [components_Switch_styles.default.thumb, {
|
|
64
|
+
transform: dynamicStyles.transform
|
|
60
65
|
}]
|
|
61
66
|
})));
|
|
62
67
|
};
|
|
63
68
|
Switch.defaultProps = components_Switch_interface_index.SwitchDefaultProps;
|
|
64
|
-
var styles = reactNative.StyleSheet.create({
|
|
65
|
-
switchContainer: {
|
|
66
|
-
width: 40,
|
|
67
|
-
height: 24,
|
|
68
|
-
borderRadius: 15,
|
|
69
|
-
justifyContent: "center",
|
|
70
|
-
alignItems: "center"
|
|
71
|
-
},
|
|
72
|
-
thumb: {
|
|
73
|
-
width: 20,
|
|
74
|
-
height: 20,
|
|
75
|
-
borderRadius: 10,
|
|
76
|
-
backgroundColor: redsTokenNext.alwaysColor.White,
|
|
77
|
-
justifyContent: "center",
|
|
78
|
-
alignItems: "center",
|
|
79
|
-
position: "absolute",
|
|
80
|
-
left: 0
|
|
81
|
-
}
|
|
82
|
-
});
|
|
83
69
|
|
|
84
70
|
exports.default = Switch;
|
|
85
71
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from \"react\";\nimport { View, TouchableWithoutFeedback,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo, useCallback } from \"react\";\nimport { View, TouchableWithoutFeedback, Animated, GestureResponderEvent } from \"react-native\";\nimport { RedsSwitch, SwitchDefaultProps } from \"./interface/index\";\nimport styles from \"./styles\";\n\nconst Switch = ({ value, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsSwitch) => {\n const isControlled = useRef(value !== undefined);\n const [isOn, setIsOn] = useState(defaultValue);\n\n const animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;\n const thumbTranslateX = animatedValue.interpolate({ inputRange: [2, 18], outputRange: [2, 18] });\n\n useEffect(() => {\n onChange?.(!!isOn);\n }, [isOn]);\n\n useEffect(() => {\n isControlled.current && setIsOn(value);\n }, [value]);\n\n const toggleSwitch = useCallback((e: GestureResponderEvent) => {\n onClick?.(e);\n !isControlled.current && setIsOn((v) => !v);\n }, []);\n\n const dynamicStyles = useMemo(() => {\n Animated.timing(animatedValue, {\n toValue: isOn ? 18 : 2,\n duration: 200,\n useNativeDriver: true,\n }).start();\n return {\n backgroundColor: isOn ? trackOnColor : trackOffColor,\n transform: [{ translateX: thumbTranslateX }],\n };\n }, [isOn]);\n\n return (\n <TouchableWithoutFeedback onPress={(e) => toggleSwitch(e)}>\n <View style={[styles.switchContainer, { backgroundColor: dynamicStyles.backgroundColor }]}>\n <Animated.View style={[styles.thumb, { transform: dynamicStyles.transform }]}></Animated.View>\n </View>\n </TouchableWithoutFeedback>\n );\n};\n\nSwitch.defaultProps = SwitchDefaultProps;\n\nexport default Switch;\n"],"names":["Switch","_ref","value","defaultValue","onChange","onClick","trackOnColor","trackOffColor","isControlled","useRef","_useState","useState","_useState2","_slicedToArray","isOn","setIsOn","animatedValue","Animated","Value","current","thumbTranslateX","interpolate","inputRange","outputRange","useEffect","toggleSwitch","useCallback","e","v","dynamicStyles","useMemo","timing","toValue","duration","useNativeDriver","start","backgroundColor","transform","translateX","React","createElement","TouchableWithoutFeedback","onPress","View","style","styles","switchContainer","thumb","defaultProps","SwitchDefaultProps"],"mappings":"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"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var redsTokenNext = require('@xhsreds/reds-token-next');
|
|
6
|
+
var reactNative = require('react-native');
|
|
7
|
+
|
|
8
|
+
var styles = reactNative.StyleSheet.create({
|
|
9
|
+
switchContainer: {
|
|
10
|
+
width: 40,
|
|
11
|
+
height: 24,
|
|
12
|
+
borderRadius: 15,
|
|
13
|
+
justifyContent: "center",
|
|
14
|
+
alignItems: "center"
|
|
15
|
+
},
|
|
16
|
+
thumb: {
|
|
17
|
+
width: 20,
|
|
18
|
+
height: 20,
|
|
19
|
+
borderRadius: 10,
|
|
20
|
+
backgroundColor: redsTokenNext.alwaysColor.White,
|
|
21
|
+
justifyContent: "center",
|
|
22
|
+
alignItems: "center",
|
|
23
|
+
position: "absolute",
|
|
24
|
+
left: 0
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
exports.default = styles;
|
|
29
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../src/components/Switch/styles.tsx"],"sourcesContent":["import { alwaysColor } from \"@xhsreds/reds-token-next\";\nimport { StyleSheet } from \"react-native\";\n\nconst styles = StyleSheet.create({\n switchContainer: {\n width: 40,\n height: 24,\n borderRadius: 15,\n justifyContent: \"center\",\n alignItems: \"center\",\n },\n thumb: {\n width: 20,\n height: 20,\n borderRadius: 10,\n backgroundColor: alwaysColor.White,\n justifyContent: \"center\",\n alignItems: \"center\",\n position: \"absolute\",\n left: 0,\n },\n});\n\nexport default styles;\n"],"names":["styles","StyleSheet","create","switchContainer","width","height","borderRadius","justifyContent","alignItems","thumb","backgroundColor","alwaysColor","White","position","left"],"mappings":";;;;;;;AAGA,IAAMA,MAAA,GAASC,uBAAWC,MAAO,CAAA;AAC/BC,EAAAA,eAAiB,EAAA;AACfC,IAAAA,KAAO,EAAA,EAAA;AACPC,IAAAA,MAAQ,EAAA,EAAA;AACRC,IAAAA,YAAc,EAAA,EAAA;AACdC,IAAAA,cAAgB,EAAA,QAAA;AAChBC,IAAAA,UAAY,EAAA,QAAA;GACd;AACAC,EAAAA,KAAO,EAAA;AACLL,IAAAA,KAAO,EAAA,EAAA;AACPC,IAAAA,MAAQ,EAAA,EAAA;AACRC,IAAAA,YAAc,EAAA,EAAA;IACdI,iBAAiBC,yBAAY,CAAAC,KAAA;AAC7BL,IAAAA,cAAgB,EAAA,QAAA;AAChBC,IAAAA,UAAY,EAAA,QAAA;AACZK,IAAAA,QAAU,EAAA,UAAA;AACVC,IAAAA,IAAM,EAAA,CAAA;AACR,GAAA;AACF,CAAC;;;;"}
|
package/lib/cjs/index.js
CHANGED
|
@@ -14,6 +14,7 @@ require('./components/Popover/hook.js');
|
|
|
14
14
|
require('@floating-ui/react-native');
|
|
15
15
|
require('@xhsreds/reds-token-next');
|
|
16
16
|
require('./components/Switch/interface/index.js');
|
|
17
|
+
require('./components/Switch/styles.js');
|
|
17
18
|
require('./components/ConfigProvider/hooks/ConfigCache/ConfigCache.js');
|
|
18
19
|
require('./components/ConfigProvider/hooks/ConfigContext/ConfigContext.js');
|
|
19
20
|
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,81 +1,67 @@
|
|
|
1
1
|
import { a as _slicedToArray } from '../../_chunks/BHmvJnIm.js';
|
|
2
|
-
import React, { useState,
|
|
3
|
-
import {
|
|
2
|
+
import React, { useRef, useState, useEffect, useCallback, useMemo } from 'react';
|
|
3
|
+
import { Animated, TouchableWithoutFeedback, View } from 'react-native';
|
|
4
4
|
import { SwitchDefaultProps } from './interface/index.js';
|
|
5
|
-
import
|
|
5
|
+
import styles from './styles.js';
|
|
6
|
+
import '@xhsreds/reds-token-next';
|
|
6
7
|
|
|
7
8
|
var Switch = function Switch(_ref) {
|
|
8
|
-
var
|
|
9
|
+
var value = _ref.value,
|
|
9
10
|
defaultValue = _ref.defaultValue,
|
|
10
11
|
onChange = _ref.onChange,
|
|
11
12
|
onClick = _ref.onClick,
|
|
12
13
|
trackOnColor = _ref.trackOnColor,
|
|
13
14
|
trackOffColor = _ref.trackOffColor;
|
|
14
|
-
var isControlled =
|
|
15
|
+
var isControlled = useRef(value !== void 0);
|
|
15
16
|
var _useState = useState(defaultValue),
|
|
16
17
|
_useState2 = _slicedToArray(_useState, 2),
|
|
17
|
-
|
|
18
|
-
|
|
18
|
+
isOn = _useState2[0],
|
|
19
|
+
setIsOn = _useState2[1];
|
|
19
20
|
var animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;
|
|
20
|
-
var thumbTranslateX =
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
var thumbTranslateX = animatedValue.interpolate({
|
|
22
|
+
inputRange: [2, 18],
|
|
23
|
+
outputRange: [2, 18]
|
|
24
|
+
});
|
|
25
|
+
useEffect(function () {
|
|
26
|
+
onChange === null || onChange === void 0 || onChange(!!isOn);
|
|
27
|
+
}, [isOn]);
|
|
28
|
+
useEffect(function () {
|
|
29
|
+
isControlled.current && setIsOn(value);
|
|
30
|
+
}, [value]);
|
|
31
|
+
var toggleSwitch = useCallback(function (e) {
|
|
32
|
+
onClick === null || onClick === void 0 || onClick(e);
|
|
33
|
+
!isControlled.current && setIsOn(function (v) {
|
|
34
|
+
return !v;
|
|
24
35
|
});
|
|
25
36
|
}, []);
|
|
26
|
-
|
|
27
|
-
onChange === null || onChange === void 0 || onChange(!!value);
|
|
37
|
+
var dynamicStyles = useMemo(function () {
|
|
28
38
|
Animated.timing(animatedValue, {
|
|
29
|
-
toValue:
|
|
39
|
+
toValue: isOn ? 18 : 2,
|
|
30
40
|
duration: 200,
|
|
31
41
|
useNativeDriver: true
|
|
32
42
|
}).start();
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
43
|
+
return {
|
|
44
|
+
backgroundColor: isOn ? trackOnColor : trackOffColor,
|
|
45
|
+
transform: [{
|
|
46
|
+
translateX: thumbTranslateX
|
|
47
|
+
}]
|
|
48
|
+
};
|
|
36
49
|
}, [isOn]);
|
|
37
|
-
var toggleSwitch = function toggleSwitch(e) {
|
|
38
|
-
onClick === null || onClick === void 0 || onClick(e);
|
|
39
|
-
!isControlled && setValue(function (v) {
|
|
40
|
-
return !v;
|
|
41
|
-
});
|
|
42
|
-
};
|
|
43
50
|
return /* @__PURE__ */React.createElement(TouchableWithoutFeedback, {
|
|
44
51
|
onPress: function onPress(e) {
|
|
45
52
|
return toggleSwitch(e);
|
|
46
53
|
}
|
|
47
54
|
}, /* @__PURE__ */React.createElement(View, {
|
|
48
55
|
style: [styles.switchContainer, {
|
|
49
|
-
backgroundColor:
|
|
56
|
+
backgroundColor: dynamicStyles.backgroundColor
|
|
50
57
|
}]
|
|
51
58
|
}, /* @__PURE__ */React.createElement(Animated.View, {
|
|
52
59
|
style: [styles.thumb, {
|
|
53
|
-
transform:
|
|
54
|
-
translateX: thumbTranslateX
|
|
55
|
-
}]
|
|
60
|
+
transform: dynamicStyles.transform
|
|
56
61
|
}]
|
|
57
62
|
})));
|
|
58
63
|
};
|
|
59
64
|
Switch.defaultProps = SwitchDefaultProps;
|
|
60
|
-
var styles = StyleSheet.create({
|
|
61
|
-
switchContainer: {
|
|
62
|
-
width: 40,
|
|
63
|
-
height: 24,
|
|
64
|
-
borderRadius: 15,
|
|
65
|
-
justifyContent: "center",
|
|
66
|
-
alignItems: "center"
|
|
67
|
-
},
|
|
68
|
-
thumb: {
|
|
69
|
-
width: 20,
|
|
70
|
-
height: 20,
|
|
71
|
-
borderRadius: 10,
|
|
72
|
-
backgroundColor: alwaysColor.White,
|
|
73
|
-
justifyContent: "center",
|
|
74
|
-
alignItems: "center",
|
|
75
|
-
position: "absolute",
|
|
76
|
-
left: 0
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
65
|
|
|
80
66
|
export { Switch as default };
|
|
81
67
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from \"react\";\nimport { View, TouchableWithoutFeedback,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Switch/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo, useCallback } from \"react\";\nimport { View, TouchableWithoutFeedback, Animated, GestureResponderEvent } from \"react-native\";\nimport { RedsSwitch, SwitchDefaultProps } from \"./interface/index\";\nimport styles from \"./styles\";\n\nconst Switch = ({ value, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsSwitch) => {\n const isControlled = useRef(value !== undefined);\n const [isOn, setIsOn] = useState(defaultValue);\n\n const animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;\n const thumbTranslateX = animatedValue.interpolate({ inputRange: [2, 18], outputRange: [2, 18] });\n\n useEffect(() => {\n onChange?.(!!isOn);\n }, [isOn]);\n\n useEffect(() => {\n isControlled.current && setIsOn(value);\n }, [value]);\n\n const toggleSwitch = useCallback((e: GestureResponderEvent) => {\n onClick?.(e);\n !isControlled.current && setIsOn((v) => !v);\n }, []);\n\n const dynamicStyles = useMemo(() => {\n Animated.timing(animatedValue, {\n toValue: isOn ? 18 : 2,\n duration: 200,\n useNativeDriver: true,\n }).start();\n return {\n backgroundColor: isOn ? trackOnColor : trackOffColor,\n transform: [{ translateX: thumbTranslateX }],\n };\n }, [isOn]);\n\n return (\n <TouchableWithoutFeedback onPress={(e) => toggleSwitch(e)}>\n <View style={[styles.switchContainer, { backgroundColor: dynamicStyles.backgroundColor }]}>\n <Animated.View style={[styles.thumb, { transform: dynamicStyles.transform }]}></Animated.View>\n </View>\n </TouchableWithoutFeedback>\n );\n};\n\nSwitch.defaultProps = SwitchDefaultProps;\n\nexport default Switch;\n"],"names":["Switch","_ref","value","defaultValue","onChange","onClick","trackOnColor","trackOffColor","isControlled","useRef","_useState","useState","_useState2","_slicedToArray","isOn","setIsOn","animatedValue","Animated","Value","current","thumbTranslateX","interpolate","inputRange","outputRange","useEffect","toggleSwitch","useCallback","e","v","dynamicStyles","useMemo","timing","toValue","duration","useNativeDriver","start","backgroundColor","transform","translateX","React","createElement","TouchableWithoutFeedback","onPress","View","style","styles","switchContainer","thumb","defaultProps","SwitchDefaultProps"],"mappings":"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"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { alwaysColor } from '@xhsreds/reds-token-next';
|
|
2
|
+
import { StyleSheet } from 'react-native';
|
|
3
|
+
|
|
4
|
+
var styles = StyleSheet.create({
|
|
5
|
+
switchContainer: {
|
|
6
|
+
width: 40,
|
|
7
|
+
height: 24,
|
|
8
|
+
borderRadius: 15,
|
|
9
|
+
justifyContent: "center",
|
|
10
|
+
alignItems: "center"
|
|
11
|
+
},
|
|
12
|
+
thumb: {
|
|
13
|
+
width: 20,
|
|
14
|
+
height: 20,
|
|
15
|
+
borderRadius: 10,
|
|
16
|
+
backgroundColor: alwaysColor.White,
|
|
17
|
+
justifyContent: "center",
|
|
18
|
+
alignItems: "center",
|
|
19
|
+
position: "absolute",
|
|
20
|
+
left: 0
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
export { styles as default };
|
|
25
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../src/components/Switch/styles.tsx"],"sourcesContent":["import { alwaysColor } from \"@xhsreds/reds-token-next\";\nimport { StyleSheet } from \"react-native\";\n\nconst styles = StyleSheet.create({\n switchContainer: {\n width: 40,\n height: 24,\n borderRadius: 15,\n justifyContent: \"center\",\n alignItems: \"center\",\n },\n thumb: {\n width: 20,\n height: 20,\n borderRadius: 10,\n backgroundColor: alwaysColor.White,\n justifyContent: \"center\",\n alignItems: \"center\",\n position: \"absolute\",\n left: 0,\n },\n});\n\nexport default styles;\n"],"names":["styles","StyleSheet","create","switchContainer","width","height","borderRadius","justifyContent","alignItems","thumb","backgroundColor","alwaysColor","White","position","left"],"mappings":";;;AAGA,IAAMA,MAAA,GAASC,WAAWC,MAAO,CAAA;AAC/BC,EAAAA,eAAiB,EAAA;AACfC,IAAAA,KAAO,EAAA,EAAA;AACPC,IAAAA,MAAQ,EAAA,EAAA;AACRC,IAAAA,YAAc,EAAA,EAAA;AACdC,IAAAA,cAAgB,EAAA,QAAA;AAChBC,IAAAA,UAAY,EAAA,QAAA;GACd;AACAC,EAAAA,KAAO,EAAA;AACLL,IAAAA,KAAO,EAAA,EAAA;AACPC,IAAAA,MAAQ,EAAA,EAAA;AACRC,IAAAA,YAAc,EAAA,EAAA;IACdI,iBAAiBC,WAAY,CAAAC,KAAA;AAC7BL,IAAAA,cAAgB,EAAA,QAAA;AAChBC,IAAAA,UAAY,EAAA,QAAA;AACZK,IAAAA,QAAU,EAAA,UAAA;AACVC,IAAAA,IAAM,EAAA,CAAA;AACR,GAAA;AACF,CAAC;;;;"}
|
package/lib/esm/index.js
CHANGED
|
@@ -12,6 +12,7 @@ import './components/Popover/hook.js';
|
|
|
12
12
|
import '@floating-ui/react-native';
|
|
13
13
|
import '@xhsreds/reds-token-next';
|
|
14
14
|
import './components/Switch/interface/index.js';
|
|
15
|
+
import './components/Switch/styles.js';
|
|
15
16
|
import './components/ConfigProvider/hooks/ConfigCache/ConfigCache.js';
|
|
16
17
|
import './components/ConfigProvider/hooks/ConfigContext/ConfigContext.js';
|
|
17
18
|
//# sourceMappingURL=index.js.map
|
package/lib/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { RedsSwitch } from "./interface/index";
|
|
3
3
|
declare const Switch: {
|
|
4
|
-
({ value
|
|
4
|
+
({ value, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsSwitch): React.JSX.Element;
|
|
5
5
|
defaultProps: RedsSwitch;
|
|
6
6
|
};
|
|
7
7
|
export default Switch;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
declare const styles: {
|
|
2
|
+
switchContainer: {
|
|
3
|
+
width: number;
|
|
4
|
+
height: number;
|
|
5
|
+
borderRadius: number;
|
|
6
|
+
justifyContent: "center";
|
|
7
|
+
alignItems: "center";
|
|
8
|
+
};
|
|
9
|
+
thumb: {
|
|
10
|
+
width: number;
|
|
11
|
+
height: number;
|
|
12
|
+
borderRadius: number;
|
|
13
|
+
backgroundColor: string;
|
|
14
|
+
justifyContent: "center";
|
|
15
|
+
alignItems: "center";
|
|
16
|
+
position: "absolute";
|
|
17
|
+
left: number;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
export default styles;
|
package/package.json
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useState } from "react";
|
|
2
|
-
import { Text, TouchableOpacity } from "react-native";
|
|
2
|
+
import { Text, View, TouchableOpacity } from "react-native";
|
|
3
3
|
import { ConfigProvider, useThemeColor } from "@xhs/reds-rn-next";
|
|
4
4
|
|
|
5
|
+
type ColorMode = "light" | "dark";
|
|
5
6
|
const App = () => {
|
|
6
7
|
const themeColor = useThemeColor();
|
|
7
8
|
return (
|
|
@@ -22,15 +23,15 @@ const App2 = () => {
|
|
|
22
23
|
|
|
23
24
|
export default () => {
|
|
24
25
|
// 切换主题
|
|
25
|
-
const [colorMode, setColorMode] = useState
|
|
26
|
+
const [colorMode, setColorMode] = useState<ColorMode>("light");
|
|
26
27
|
const changeColorMode = () => {
|
|
27
28
|
setColorMode((preColorMode) => (preColorMode === "light" ? "dark" : "light"));
|
|
28
29
|
};
|
|
29
30
|
|
|
30
31
|
// 主题定制
|
|
31
|
-
const [colorMode2, setColorMode2] = useState
|
|
32
|
-
const [infoLightColor, setInfoLightColor] = useState
|
|
33
|
-
const [infoDarkColor, setInfoDarkColor] = useState
|
|
32
|
+
const [colorMode2, setColorMode2] = useState<ColorMode>("light");
|
|
33
|
+
const [infoLightColor, setInfoLightColor] = useState<string>("red");
|
|
34
|
+
const [infoDarkColor, setInfoDarkColor] = useState<string>("black");
|
|
34
35
|
const changeInfoToken = () => {
|
|
35
36
|
setInfoLightColor((preInfoLightColor) => (preInfoLightColor === "red" ? "blue" : "red"));
|
|
36
37
|
setInfoDarkColor((preInfoDarkColor) => (preInfoDarkColor === "black" ? "white" : "black"));
|
|
@@ -40,9 +41,9 @@ export default () => {
|
|
|
40
41
|
};
|
|
41
42
|
|
|
42
43
|
// 组件级主题定制
|
|
43
|
-
const [colorMode3, setColorMode3] = useState
|
|
44
|
-
const [infoLightColor3, setInfoLightColor3] = useState
|
|
45
|
-
const [infoDarkColor3, setInfoDarkColor3] = useState
|
|
44
|
+
const [colorMode3, setColorMode3] = useState<ColorMode>("light");
|
|
45
|
+
const [infoLightColor3, setInfoLightColor3] = useState<string>("red");
|
|
46
|
+
const [infoDarkColor3, setInfoDarkColor3] = useState<string>("black");
|
|
46
47
|
const changeInfoToken3 = () => {
|
|
47
48
|
setInfoLightColor3((preInfoLightColor) => (preInfoLightColor === "red" ? "blue" : "red"));
|
|
48
49
|
setInfoDarkColor3((preInfoDarkColor) => (preInfoDarkColor === "black" ? "white" : "black"));
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import { useState } from "react";
|
|
2
|
+
import { Text, View, TouchableOpacity } from "react-native";
|
|
3
|
+
import { ConfigProvider, useThemeColor } from "@xhs/reds-rn-next";
|
|
4
|
+
|
|
5
|
+
type ColorMode = "light" | "dark";
|
|
6
|
+
|
|
7
|
+
const App = () => {
|
|
8
|
+
const themeColor = useThemeColor();
|
|
9
|
+
return (
|
|
10
|
+
<View style={{ height: 200, backgroundColor: themeColor.Bg }}>
|
|
11
|
+
<Text testID={"themeChangeDiv"} style={{ color: themeColor.Info }}>
|
|
12
|
+
主题定制文字展示
|
|
13
|
+
</Text>
|
|
14
|
+
</View>
|
|
15
|
+
);
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
const App2 = () => {
|
|
19
|
+
const themeColor = useThemeColor();
|
|
20
|
+
return (
|
|
21
|
+
<View style={{ height: 200, backgroundColor: themeColor.Bg }}>
|
|
22
|
+
<Text testID={"themeCustomDiv"} style={{ color: themeColor.Info }}>
|
|
23
|
+
主题定制文字展示
|
|
24
|
+
</Text>
|
|
25
|
+
</View>
|
|
26
|
+
);
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
const App3 = () => {
|
|
30
|
+
const themeColor = useThemeColor("Button");
|
|
31
|
+
return (
|
|
32
|
+
<View style={{ height: 200, backgroundColor: themeColor.Bg }}>
|
|
33
|
+
<Text testID={"themeComponentCustomDiv"} style={{ color: themeColor.Info }}>
|
|
34
|
+
主题定制文字展示
|
|
35
|
+
</Text>
|
|
36
|
+
</View>
|
|
37
|
+
);
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
export default () => {
|
|
41
|
+
// 切换主题
|
|
42
|
+
const [colorMode, setColorMode] = useState<ColorMode>("light");
|
|
43
|
+
const changeColorMode = () => {
|
|
44
|
+
setColorMode((preColorMode) => (preColorMode === "light" ? "dark" : "light"));
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// 主题定制
|
|
48
|
+
const [colorMode2, setColorMode2] = useState<ColorMode>("light");
|
|
49
|
+
const [infoLightColor, setInfoLightColor] = useState<string>("red");
|
|
50
|
+
const [infoDarkColor, setInfoDarkColor] = useState<string>("black");
|
|
51
|
+
const changeInfoToken = () => {
|
|
52
|
+
setInfoLightColor((preInfoLightColor) => (preInfoLightColor === "red" ? "blue" : "red"));
|
|
53
|
+
setInfoDarkColor((preInfoDarkColor) => (preInfoDarkColor === "black" ? "white" : "black"));
|
|
54
|
+
};
|
|
55
|
+
const changeColorMode2 = () => {
|
|
56
|
+
setColorMode2((preColorMode) => (preColorMode === "light" ? "dark" : "light"));
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
// 组件级主题定制
|
|
60
|
+
const [colorMode3, setColorMode3] = useState<ColorMode>("light");
|
|
61
|
+
const [infoLightColor3, setInfoLightColor3] = useState<string>("red");
|
|
62
|
+
const [infoDarkColor3, setInfoDarkColor3] = useState<string>("black");
|
|
63
|
+
const changeInfoToken3 = () => {
|
|
64
|
+
setInfoLightColor3((preInfoLightColor) => (preInfoLightColor === "red" ? "blue" : "red"));
|
|
65
|
+
setInfoDarkColor3((preInfoDarkColor) => (preInfoDarkColor === "black" ? "white" : "black"));
|
|
66
|
+
};
|
|
67
|
+
const changeColorMode3 = () => {
|
|
68
|
+
setColorMode3((preColorMode) => (preColorMode === "light" ? "dark" : "light"));
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
return (
|
|
72
|
+
<>
|
|
73
|
+
<TouchableOpacity testID={"themeChangeButton"} onPress={changeColorMode}>
|
|
74
|
+
<Text>切换主题</Text>
|
|
75
|
+
</TouchableOpacity>
|
|
76
|
+
<ConfigProvider
|
|
77
|
+
theme={{
|
|
78
|
+
colorMode: colorMode,
|
|
79
|
+
}}
|
|
80
|
+
>
|
|
81
|
+
<App />
|
|
82
|
+
</ConfigProvider>
|
|
83
|
+
<TouchableOpacity testID={"themeChangeCustomButton"} onPress={changeColorMode2}>
|
|
84
|
+
<Text>切换主题</Text>
|
|
85
|
+
</TouchableOpacity>
|
|
86
|
+
<TouchableOpacity testID={"themeChangeCustomTokenButton"} onPress={changeInfoToken}>
|
|
87
|
+
<Text>主题定制</Text>
|
|
88
|
+
</TouchableOpacity>
|
|
89
|
+
<ConfigProvider
|
|
90
|
+
theme={{
|
|
91
|
+
colorMode: colorMode2,
|
|
92
|
+
token: {
|
|
93
|
+
lightColor: {
|
|
94
|
+
Info: infoLightColor,
|
|
95
|
+
},
|
|
96
|
+
darkColor: {
|
|
97
|
+
Info: infoDarkColor,
|
|
98
|
+
},
|
|
99
|
+
},
|
|
100
|
+
}}
|
|
101
|
+
>
|
|
102
|
+
<App2 />
|
|
103
|
+
</ConfigProvider>
|
|
104
|
+
<TouchableOpacity testID={"themeChangeCustoComponentButton"} onPress={changeColorMode3}>
|
|
105
|
+
<Text>切换主题</Text>
|
|
106
|
+
</TouchableOpacity>
|
|
107
|
+
<TouchableOpacity testID={"themeChangeCustomComponentButton"} onPress={changeInfoToken3}>
|
|
108
|
+
<Text>组件级主题切换</Text>
|
|
109
|
+
</TouchableOpacity>
|
|
110
|
+
<ConfigProvider
|
|
111
|
+
theme={{
|
|
112
|
+
colorMode: colorMode3,
|
|
113
|
+
token: {
|
|
114
|
+
components: {
|
|
115
|
+
Button: {
|
|
116
|
+
lightColor: {
|
|
117
|
+
Info: infoLightColor3,
|
|
118
|
+
},
|
|
119
|
+
darkColor: {
|
|
120
|
+
Info: infoDarkColor3,
|
|
121
|
+
},
|
|
122
|
+
},
|
|
123
|
+
},
|
|
124
|
+
},
|
|
125
|
+
}}
|
|
126
|
+
>
|
|
127
|
+
<App3 />
|
|
128
|
+
</ConfigProvider>
|
|
129
|
+
</>
|
|
130
|
+
);
|
|
131
|
+
};
|
|
@@ -1,9 +1,24 @@
|
|
|
1
|
-
import { describe, it, expect } from "vitest";
|
|
1
|
+
import { describe, it, expect, beforeEach, afterEach } from "vitest";
|
|
2
2
|
import { render, fireEvent, userEvent } from "@testing-library/react-native";
|
|
3
|
-
import "
|
|
4
|
-
import { Pressable, Text, View } from "react-native";
|
|
5
|
-
import ConfigProvider from "../index";
|
|
3
|
+
import TestConfigProvider from "../ConfigProvider";
|
|
6
4
|
|
|
7
5
|
describe("ConfigProvider", () => {
|
|
8
|
-
|
|
6
|
+
const wrapper = render(
|
|
7
|
+
<TestConfigProvider
|
|
8
|
+
theme={{
|
|
9
|
+
colorMode: "light",
|
|
10
|
+
inherit: true,
|
|
11
|
+
}}
|
|
12
|
+
id={"root"}
|
|
13
|
+
parentId={"root"}
|
|
14
|
+
children={"123"}
|
|
15
|
+
></TestConfigProvider>,
|
|
16
|
+
);
|
|
17
|
+
|
|
18
|
+
it(":themeChange", async () => {
|
|
19
|
+
expect(wrapper.UNSAFE_root.props.id).toBe("root");
|
|
20
|
+
expect(wrapper.UNSAFE_root.props.parentId).toBe("root");
|
|
21
|
+
expect(wrapper.UNSAFE_root.props.theme.colorMode).toBe("light");
|
|
22
|
+
expect(wrapper.UNSAFE_root.props.theme.inherit).toBe(true);
|
|
23
|
+
});
|
|
9
24
|
});
|
|
@@ -1,37 +1,44 @@
|
|
|
1
|
-
import React, { useState, useRef, useEffect, useMemo } from "react";
|
|
2
|
-
import { View, TouchableWithoutFeedback,
|
|
1
|
+
import React, { useState, useRef, useEffect, useMemo, useCallback } from "react";
|
|
2
|
+
import { View, TouchableWithoutFeedback, Animated, GestureResponderEvent } from "react-native";
|
|
3
3
|
import { RedsSwitch, SwitchDefaultProps } from "./interface/index";
|
|
4
|
-
import
|
|
4
|
+
import styles from "./styles";
|
|
5
5
|
|
|
6
|
-
const Switch = ({ value
|
|
7
|
-
const isControlled =
|
|
8
|
-
const [
|
|
6
|
+
const Switch = ({ value, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsSwitch) => {
|
|
7
|
+
const isControlled = useRef(value !== undefined);
|
|
8
|
+
const [isOn, setIsOn] = useState(defaultValue);
|
|
9
9
|
|
|
10
10
|
const animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;
|
|
11
|
+
const thumbTranslateX = animatedValue.interpolate({ inputRange: [2, 18], outputRange: [2, 18] });
|
|
11
12
|
|
|
12
|
-
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
onChange?.(!!isOn);
|
|
15
|
+
}, [isOn]);
|
|
13
16
|
|
|
14
17
|
useEffect(() => {
|
|
15
|
-
|
|
18
|
+
isControlled.current && setIsOn(value);
|
|
19
|
+
}, [value]);
|
|
20
|
+
|
|
21
|
+
const toggleSwitch = useCallback((e: GestureResponderEvent) => {
|
|
22
|
+
onClick?.(e);
|
|
23
|
+
!isControlled.current && setIsOn((v) => !v);
|
|
24
|
+
}, []);
|
|
25
|
+
|
|
26
|
+
const dynamicStyles = useMemo(() => {
|
|
16
27
|
Animated.timing(animatedValue, {
|
|
17
|
-
toValue:
|
|
28
|
+
toValue: isOn ? 18 : 2,
|
|
18
29
|
duration: 200,
|
|
19
30
|
useNativeDriver: true,
|
|
20
31
|
}).start();
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
32
|
+
return {
|
|
33
|
+
backgroundColor: isOn ? trackOnColor : trackOffColor,
|
|
34
|
+
transform: [{ translateX: thumbTranslateX }],
|
|
35
|
+
};
|
|
24
36
|
}, [isOn]);
|
|
25
37
|
|
|
26
|
-
const toggleSwitch = (e: GestureResponderEvent) => {
|
|
27
|
-
onClick?.(e);
|
|
28
|
-
!isControlled && setValue((v) => !v);
|
|
29
|
-
};
|
|
30
|
-
|
|
31
38
|
return (
|
|
32
39
|
<TouchableWithoutFeedback onPress={(e) => toggleSwitch(e)}>
|
|
33
|
-
<View style={[styles.switchContainer, { backgroundColor:
|
|
34
|
-
<Animated.View style={[styles.thumb, { transform:
|
|
40
|
+
<View style={[styles.switchContainer, { backgroundColor: dynamicStyles.backgroundColor }]}>
|
|
41
|
+
<Animated.View style={[styles.thumb, { transform: dynamicStyles.transform }]}></Animated.View>
|
|
35
42
|
</View>
|
|
36
43
|
</TouchableWithoutFeedback>
|
|
37
44
|
);
|
|
@@ -39,24 +46,4 @@ const Switch = ({ value: isOn, defaultValue, onChange, onClick, trackOnColor, tr
|
|
|
39
46
|
|
|
40
47
|
Switch.defaultProps = SwitchDefaultProps;
|
|
41
48
|
|
|
42
|
-
const styles = StyleSheet.create({
|
|
43
|
-
switchContainer: {
|
|
44
|
-
width: 40,
|
|
45
|
-
height: 24,
|
|
46
|
-
borderRadius: 15,
|
|
47
|
-
justifyContent: "center",
|
|
48
|
-
alignItems: "center",
|
|
49
|
-
},
|
|
50
|
-
thumb: {
|
|
51
|
-
width: 20,
|
|
52
|
-
height: 20,
|
|
53
|
-
borderRadius: 10,
|
|
54
|
-
backgroundColor: alwaysColor.White,
|
|
55
|
-
justifyContent: "center",
|
|
56
|
-
alignItems: "center",
|
|
57
|
-
position: "absolute",
|
|
58
|
-
left: 0,
|
|
59
|
-
},
|
|
60
|
-
});
|
|
61
|
-
|
|
62
49
|
export default Switch;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { alwaysColor } from "@xhs/reds-token-next";
|
|
2
|
+
import { StyleSheet } from "react-native";
|
|
3
|
+
|
|
4
|
+
const styles = StyleSheet.create({
|
|
5
|
+
switchContainer: {
|
|
6
|
+
width: 40,
|
|
7
|
+
height: 24,
|
|
8
|
+
borderRadius: 15,
|
|
9
|
+
justifyContent: "center",
|
|
10
|
+
alignItems: "center",
|
|
11
|
+
},
|
|
12
|
+
thumb: {
|
|
13
|
+
width: 20,
|
|
14
|
+
height: 20,
|
|
15
|
+
borderRadius: 10,
|
|
16
|
+
backgroundColor: alwaysColor.White,
|
|
17
|
+
justifyContent: "center",
|
|
18
|
+
alignItems: "center",
|
|
19
|
+
position: "absolute",
|
|
20
|
+
left: 0,
|
|
21
|
+
},
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
export default styles;
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import React, { useRef, useEffect, useState } from "react";
|
|
2
|
-
import { View, Text, StyleSheet, FlatList, ScrollView } from "react-native";
|
|
3
|
-
import { ConfigProvider, Button } from "@xhs/reds-rn-next";
|
|
4
|
-
|
|
5
|
-
const styles = StyleSheet.create({
|
|
6
|
-
container: {
|
|
7
|
-
flex: 1,
|
|
8
|
-
justifyContent: "center",
|
|
9
|
-
paddingTop: 100,
|
|
10
|
-
paddingBottom: 100,
|
|
11
|
-
},
|
|
12
|
-
scrollView: {
|
|
13
|
-
backgroundColor: "pink",
|
|
14
|
-
},
|
|
15
|
-
root: {
|
|
16
|
-
flex: 1,
|
|
17
|
-
backgroundColor: "blue",
|
|
18
|
-
},
|
|
19
|
-
});
|
|
20
|
-
const Desc = ({ children = "" }) => {
|
|
21
|
-
return <Text>{children}</Text>;
|
|
22
|
-
};
|
|
23
|
-
const Br = (props) => <View style={{ height: props.height || 20 }}></View>;
|
|
24
|
-
|
|
25
|
-
export default function App() {
|
|
26
|
-
const [value, setValue] = useState(false);
|
|
27
|
-
const [valueStr, setValueStr] = useState(value.toString());
|
|
28
|
-
const onClick = (e) => setValue((v) => !v);
|
|
29
|
-
const onChange = (v) => setValueStr(v.toString());
|
|
30
|
-
return (
|
|
31
|
-
<View style={styles.container}>
|
|
32
|
-
<Desc>默认用法</Desc>
|
|
33
|
-
<ConfigProvider></ConfigProvider>
|
|
34
|
-
<Br />
|
|
35
|
-
|
|
36
|
-
<Desc>设置默认值</Desc>
|
|
37
|
-
<ConfigProvider defaultValue={true}></ConfigProvider>
|
|
38
|
-
<Br />
|
|
39
|
-
|
|
40
|
-
<Desc>修改开关颜色</Desc>
|
|
41
|
-
<ConfigProvider trackOnColor={"#1b8bcd"} trackOffColor={"#da36c9"}></ConfigProvider>
|
|
42
|
-
<Br />
|
|
43
|
-
|
|
44
|
-
<Desc>受控用法</Desc>
|
|
45
|
-
<Text>当前值:{valueStr}</Text>
|
|
46
|
-
<ConfigProvider value={value} onClick={onClick} onChange={onChange}></ConfigProvider>
|
|
47
|
-
<Br />
|
|
48
|
-
</View>
|
|
49
|
-
);
|
|
50
|
-
}
|
|
File without changes
|