@tamagui/logo 1.61.3 → 1.62.0

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.
Files changed (63) hide show
  1. package/dist/cjs/LogoIcon.js +27 -35
  2. package/dist/cjs/LogoIcon.js.map +1 -1
  3. package/dist/cjs/LogoIcon.native.js +47 -0
  4. package/dist/cjs/LogoIcon.native.js.map +6 -0
  5. package/dist/cjs/LogoWords.js +13 -33
  6. package/dist/cjs/LogoWords.js.map +1 -1
  7. package/dist/cjs/LogoWords.native.js +150 -0
  8. package/dist/cjs/LogoWords.native.js.map +6 -0
  9. package/dist/cjs/TamaguiLogo.js +21 -31
  10. package/dist/cjs/TamaguiLogo.js.map +1 -1
  11. package/dist/cjs/TamaguiLogo.native.js +43 -0
  12. package/dist/cjs/TamaguiLogo.native.js.map +6 -0
  13. package/dist/cjs/TamaguiLogoSvg.js +5 -9
  14. package/dist/cjs/TamaguiLogoSvg.js.map +1 -1
  15. package/dist/cjs/TamaguiLogoSvg.native.js +39 -0
  16. package/dist/cjs/TamaguiLogoSvg.native.js.map +6 -0
  17. package/dist/cjs/index.js +4 -8
  18. package/dist/cjs/index.js.map +1 -1
  19. package/dist/cjs/index.native.js +28 -0
  20. package/dist/cjs/index.native.js.map +6 -0
  21. package/dist/cjs/tints.js +15 -31
  22. package/dist/cjs/tints.js.map +1 -1
  23. package/dist/cjs/tints.native.js +62 -0
  24. package/dist/cjs/tints.native.js.map +6 -0
  25. package/dist/cjs/useTint.js +16 -38
  26. package/dist/cjs/useTint.js.map +1 -1
  27. package/dist/cjs/useTint.native.js +73 -0
  28. package/dist/cjs/useTint.native.js.map +6 -0
  29. package/dist/esm/LogoIcon.js +22 -24
  30. package/dist/esm/LogoIcon.js.map +1 -1
  31. package/dist/esm/LogoWords.js +8 -21
  32. package/dist/esm/LogoWords.js.map +1 -1
  33. package/dist/esm/TamaguiLogo.js +16 -18
  34. package/dist/esm/TamaguiLogo.js.map +1 -1
  35. package/dist/esm/tints.js +10 -22
  36. package/dist/esm/tints.js.map +1 -1
  37. package/dist/esm/useTint.js +11 -26
  38. package/dist/esm/useTint.js.map +1 -1
  39. package/dist/jsx/LogoIcon.js +14 -16
  40. package/dist/jsx/LogoIcon.js.map +1 -1
  41. package/dist/jsx/LogoIcon.native.js +20 -0
  42. package/dist/jsx/LogoIcon.native.js.map +6 -0
  43. package/dist/jsx/LogoWords.js +7 -20
  44. package/dist/jsx/LogoWords.js.map +1 -1
  45. package/dist/jsx/LogoWords.native.js +99 -0
  46. package/dist/jsx/LogoWords.native.js.map +6 -0
  47. package/dist/jsx/TamaguiLogo.js +11 -13
  48. package/dist/jsx/TamaguiLogo.js.map +1 -1
  49. package/dist/jsx/TamaguiLogo.native.js +21 -0
  50. package/dist/jsx/TamaguiLogo.native.js.map +6 -0
  51. package/dist/jsx/TamaguiLogoSvg.native.js +14 -0
  52. package/dist/jsx/TamaguiLogoSvg.native.js.map +6 -0
  53. package/dist/jsx/index.native.js +6 -0
  54. package/dist/jsx/index.native.js.map +6 -0
  55. package/dist/jsx/tints.js +10 -22
  56. package/dist/jsx/tints.js.map +1 -1
  57. package/dist/jsx/tints.native.js +37 -0
  58. package/dist/jsx/tints.native.js.map +6 -0
  59. package/dist/jsx/useTint.js +10 -25
  60. package/dist/jsx/useTint.js.map +1 -1
  61. package/dist/jsx/useTint.native.js +59 -0
  62. package/dist/jsx/useTint.native.js.map +6 -0
  63. package/package.json +3 -3
package/dist/esm/tints.js CHANGED
@@ -3,9 +3,7 @@ const familiesValues = {
3
3
  tamagui: ["orange", "yellow", "green", "blue", "purple", "pink", "red"],
4
4
  xmas: ["red", "green", "red", "green", "red", "green", "red"],
5
5
  easter: ["yellow", "pink", "yellow", "pink", "yellow", "pink", "yellow"]
6
- };
7
- const familiesNames = Object.keys(familiesValues);
8
- const families = familiesValues;
6
+ }, familiesNames = Object.keys(familiesValues), families = familiesValues;
9
7
  let fam = "tamagui";
10
8
  function getTints() {
11
9
  return {
@@ -16,29 +14,19 @@ function getTints() {
16
14
  }
17
15
  function useTints() {
18
16
  const [val, setVal] = useState(getTints());
19
- useEffect(() => {
20
- return onTintFamilyChange(() => {
21
- setVal(getTints());
22
- });
23
- }, []);
24
- return val;
17
+ return useEffect(() => onTintFamilyChange(() => {
18
+ setVal(getTints());
19
+ }), []), val;
25
20
  }
26
21
  const setTintFamily = (next) => {
27
22
  if (!families[next])
28
- throw `impossible`;
29
- fam = next;
30
- listeners.forEach((l) => l(next));
31
- };
32
- const setNextTintFamily = () => {
23
+ throw "impossible";
24
+ fam = next, listeners.forEach((l) => l(next));
25
+ }, setNextTintFamily = () => {
33
26
  setTintFamily(familiesNames[(familiesNames.indexOf(fam) + 1) % familiesNames.length]);
34
- };
35
- const listeners = /* @__PURE__ */ new Set();
36
- const onTintFamilyChange = (cb) => {
37
- listeners.add(cb);
38
- return () => {
39
- listeners.delete(cb);
40
- };
41
- };
27
+ }, listeners = /* @__PURE__ */ new Set(), onTintFamilyChange = (cb) => (listeners.add(cb), () => {
28
+ listeners.delete(cb);
29
+ });
42
30
  export {
43
31
  getTints,
44
32
  onTintFamilyChange,
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/tints.tsx"],
4
- "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,MAAM,iBAAiB;AAAA,EACrB,SAAS,CAAC,UAAU,UAAU,SAAS,QAAQ,UAAU,QAAQ,KAAK;AAAA,EACtE,MAAM,CAAC,OAAO,SAAS,OAAO,SAAS,OAAO,SAAS,KAAK;AAAA,EAC5D,QAAQ,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,QAAQ;AACzE;AAIA,MAAM,gBAAgB,OAAO,KAAK,cAAc;AAEhD,MAAM,WAAW;AAMjB,IAAI,MAAkB;AAEf,SAAS,WAAW;AACzB,SAAO;AAAA,IACL,MAAM,OAAO;AAAA,IACb,OAAO,SAAS,GAAG,KAAK,SAAS;AAAA,IACjC;AAAA,EACF;AACF;AAEO,SAAS,WAAW;AACzB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,SAAS,CAAC;AAEzC,YAAU,MAAM;AACd,WAAO,mBAAmB,MAAM;AAC9B,aAAO,SAAS,CAAC;AAAA,IACnB,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;AAEO,MAAM,gBAAgB,CAAC,SAAqB;AACjD,MAAI,CAAC,SAAS,IAAI;AAAG,UAAM;AAC3B,QAAM;AACN,YAAU,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;AAClC;AAEO,MAAM,oBAAoB,MAAM;AACrC,gBAAc,eAAe,cAAc,QAAQ,GAAG,IAAI,KAAK,cAAc,MAAM,CAAC;AACtF;AAIA,MAAM,YAAY,oBAAI,IAAmB;AAElC,MAAM,qBAAqB,CAAC,OAAsB;AACvD,YAAU,IAAI,EAAE;AAChB,SAAO,MAAM;AACX,cAAU,OAAO,EAAE;AAAA,EACrB;AACF;",
4
+ "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,MAAM,iBAAiB;AAAA,EACrB,SAAS,CAAC,UAAU,UAAU,SAAS,QAAQ,UAAU,QAAQ,KAAK;AAAA,EACtE,MAAM,CAAC,OAAO,SAAS,OAAO,SAAS,OAAO,SAAS,KAAK;AAAA,EAC5D,QAAQ,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,QAAQ;AACzE,GAIM,gBAAgB,OAAO,KAAK,cAAc,GAE1C,WAAW;AAMjB,IAAI,MAAkB;AAEf,SAAS,WAAW;AACzB,SAAO;AAAA,IACL,MAAM,OAAO;AAAA,IACb,OAAO,SAAS,GAAG,KAAK,SAAS;AAAA,IACjC;AAAA,EACF;AACF;AAEO,SAAS,WAAW;AACzB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,SAAS,CAAC;AAEzC,mBAAU,MACD,mBAAmB,MAAM;AAC9B,WAAO,SAAS,CAAC;AAAA,EACnB,CAAC,GACA,CAAC,CAAC,GAEE;AACT;AAEO,MAAM,gBAAgB,CAAC,SAAqB;AACjD,MAAI,CAAC,SAAS,IAAI;AAAG,UAAM;AAC3B,QAAM,MACN,UAAU,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;AAClC,GAEa,oBAAoB,MAAM;AACrC,gBAAc,eAAe,cAAc,QAAQ,GAAG,IAAI,KAAK,cAAc,MAAM,CAAC;AACtF,GAIM,YAAY,oBAAI,IAAmB,GAE5B,qBAAqB,CAAC,QACjC,UAAU,IAAI,EAAE,GACT,MAAM;AACX,YAAU,OAAO,EAAE;AACrB;",
5
5
  "names": []
6
6
  }
@@ -1,34 +1,22 @@
1
- import { jsx } from "react/jsx-runtime";
2
1
  import { startTransition, useMemo, useSyncExternalStore } from "react";
3
2
  import { Theme } from "tamagui";
4
3
  import { getTints, setNextTintFamily, useTints } from "./tints";
4
+ import { jsx } from "react/jsx-runtime";
5
5
  const initialTint = 3;
6
6
  let current = initialTint;
7
- const listeners = /* @__PURE__ */ new Set();
8
- const onTintChange = (listener) => {
9
- listeners.add(listener);
10
- return () => {
11
- listeners.delete(listener);
12
- };
13
- };
14
- const numTints = getTints().tints.length;
15
- const setTintIndex = (next) => {
7
+ const listeners = /* @__PURE__ */ new Set(), onTintChange = (listener) => (listeners.add(listener), () => {
8
+ listeners.delete(listener);
9
+ }), numTints = getTints().tints.length, setTintIndex = (next) => {
16
10
  const val = next % numTints;
17
- if (val === current)
18
- return;
19
- current = val;
20
- startTransition(() => {
11
+ val !== current && (current = val, startTransition(() => {
21
12
  listeners.forEach((x) => x(val));
22
- });
23
- };
24
- const useTint = () => {
13
+ }));
14
+ }, useTint = () => {
25
15
  const index = useSyncExternalStore(
26
16
  onTintChange,
27
17
  () => current,
28
18
  () => initialTint
29
- );
30
- const tintsContext = useTints();
31
- const { tints } = tintsContext;
19
+ ), tintsContext = useTints(), { tints } = tintsContext;
32
20
  return {
33
21
  ...tintsContext,
34
22
  tints: tintsContext.tints,
@@ -40,18 +28,15 @@ const useTint = () => {
40
28
  setTintIndex(index + 1);
41
29
  }
42
30
  };
43
- };
44
- const ThemeTint = (props) => {
31
+ }, ThemeTint = (props) => {
45
32
  const curTint = useTint().tint;
46
33
  return /* @__PURE__ */ jsx(Theme, { name: props.disable ? null : curTint, children: useMemo(() => props.children, [props.children]) });
47
- };
48
- const ThemeTintAlt = ({
34
+ }, ThemeTintAlt = ({
49
35
  children,
50
36
  disable,
51
37
  offset = 2
52
38
  }) => {
53
- const tint = useTint();
54
- const curTint = tint.tints[(tint.tintIndex + offset) % tint.tints.length];
39
+ const tint = useTint(), curTint = tint.tints[(tint.tintIndex + offset) % tint.tints.length];
55
40
  return /* @__PURE__ */ jsx(Theme, { name: disable ? null : curTint, children: useMemo(() => children, [children]) });
56
41
  };
57
42
  export {
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/useTint.tsx"],
4
- "mappings": "AA4DI;AA5DJ,SAAS,iBAAiB,SAAS,4BAA4B;AAC/D,SAAS,aAAwB;AAEjC,SAAS,UAAU,mBAAmB,gBAAgB;AAO/C,MAAM,cAAc;AAE3B,IAAI,UAAU;AAEd,MAAM,YAAY,oBAAI,IAAc;AAE7B,MAAM,eAAe,CAAC,aAAoC;AAC/D,YAAU,IAAI,QAAQ;AACtB,SAAO,MAAM;AACX,cAAU,OAAO,QAAQ;AAAA,EAC3B;AACF;AAEA,MAAM,WAAW,SAAS,EAAE,MAAM;AAE3B,MAAM,eAAe,CAAC,SAAiB;AAC5C,QAAM,MAAM,OAAO;AACnB,MAAI,QAAQ;AAAS;AACrB,YAAU;AACV,kBAAgB,MAAM;AACpB,cAAU,QAAQ,CAAC,MAAM,EAAE,GAAG,CAAC;AAAA,EACjC,CAAC;AACH;AAEO,MAAM,UAAU,MAAM;AAC3B,QAAM,QAAQ;AAAA,IACZ;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AACA,QAAM,eAAe,SAAS;AAC9B,QAAM,EAAE,MAAM,IAAI;AAElB,SAAO;AAAA,IACL,GAAG;AAAA,IACH,OAAO,aAAa;AAAA,IACpB,WAAW;AAAA,IACX,MAAM,MAAM,KAAK;AAAA,IACjB;AAAA,IACA;AAAA,IACA,aAAa,MAAM;AACjB,mBAAa,QAAQ,CAAC;AAAA,IACxB;AAAA,EACF;AACF;AAEO,MAAM,YAAY,CAAC,UAAgD;AACxE,QAAM,UAAU,QAAQ,EAAE;AAE1B,SACE,oBAAC,SAAM,MAAM,MAAM,UAAU,OAAO,SAEjC,kBAAQ,MAAM,MAAM,UAAU,CAAC,MAAM,QAAQ,CAAC,GACjD;AAEJ;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAIM;AACJ,QAAM,OAAO,QAAQ;AACrB,QAAM,UAAU,KAAK,OAAO,KAAK,YAAY,UAAU,KAAK,MAAM,MAAM;AAExE,SACE,oBAAC,SAAM,MAAM,UAAU,OAAO,SAE3B,kBAAQ,MAAM,UAAU,CAAC,QAAQ,CAAC,GACrC;AAEJ;",
4
+ "mappings": "AAAA,SAAS,iBAAiB,SAAS,4BAA4B;AAC/D,SAAS,aAAwB;AAEjC,SAAS,UAAU,mBAAmB,gBAAgB;AAyDlD;AAlDG,MAAM,cAAc;AAE3B,IAAI,UAAU;AAEd,MAAM,YAAY,oBAAI,IAAc,GAEvB,eAAe,CAAC,cAC3B,UAAU,IAAI,QAAQ,GACf,MAAM;AACX,YAAU,OAAO,QAAQ;AAC3B,IAGI,WAAW,SAAS,EAAE,MAAM,QAErB,eAAe,CAAC,SAAiB;AAC5C,QAAM,MAAM,OAAO;AACnB,EAAI,QAAQ,YACZ,UAAU,KACV,gBAAgB,MAAM;AACpB,cAAU,QAAQ,CAAC,MAAM,EAAE,GAAG,CAAC;AAAA,EACjC,CAAC;AACH,GAEa,UAAU,MAAM;AAC3B,QAAM,QAAQ;AAAA,IACZ;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,EACR,GACM,eAAe,SAAS,GACxB,EAAE,MAAM,IAAI;AAElB,SAAO;AAAA,IACL,GAAG;AAAA,IACH,OAAO,aAAa;AAAA,IACpB,WAAW;AAAA,IACX,MAAM,MAAM,KAAK;AAAA,IACjB;AAAA,IACA;AAAA,IACA,aAAa,MAAM;AACjB,mBAAa,QAAQ,CAAC;AAAA,IACxB;AAAA,EACF;AACF,GAEa,YAAY,CAAC,UAAgD;AACxE,QAAM,UAAU,QAAQ,EAAE;AAE1B,SACE,oBAAC,SAAM,MAAM,MAAM,UAAU,OAAO,SAEjC,kBAAQ,MAAM,MAAM,UAAU,CAAC,MAAM,QAAQ,CAAC,GACjD;AAEJ,GAEa,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAIM;AACJ,QAAM,OAAO,QAAQ,GACf,UAAU,KAAK,OAAO,KAAK,YAAY,UAAU,KAAK,MAAM,MAAM;AAExE,SACE,oBAAC,SAAM,MAAM,UAAU,OAAO,SAE3B,kBAAQ,MAAM,UAAU,CAAC,QAAQ,CAAC,GACrC;AAEJ;",
5
5
  "names": []
6
6
  }
@@ -1,21 +1,19 @@
1
1
  import { YStack } from "tamagui";
2
2
  import { TamaguiIconSvg } from "./TamaguiLogoSvg";
3
- const LogoIcon = ({ downscale = 2 }) => {
4
- return <YStack
5
- tag="span"
6
- className="unselectable"
7
- alignSelf="center"
8
- marginVertical={-10}
9
- pressStyle={{
10
- opacity: 0.7,
11
- scaleX: -1
12
- }}
13
- ><TamaguiIconSvg
14
- className="tamagui-icon"
15
- width={450 / 8 / downscale}
16
- height={420 / 8 / downscale}
17
- /></YStack>;
18
- };
3
+ const LogoIcon = ({ downscale = 2 }) => <YStack
4
+ tag="span"
5
+ className="unselectable"
6
+ alignSelf="center"
7
+ marginVertical={-10}
8
+ pressStyle={{
9
+ opacity: 0.7,
10
+ scaleX: -1
11
+ }}
12
+ ><TamaguiIconSvg
13
+ className="tamagui-icon"
14
+ width={450 / 8 / downscale}
15
+ height={420 / 8 / downscale}
16
+ /></YStack>;
19
17
  export {
20
18
  LogoIcon
21
19
  };
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/LogoIcon.tsx"],
4
- "mappings": "AAAA,SAAS,cAAc;AAEvB,SAAS,sBAAsB;AAExB,MAAM,WAAW,CAAC,EAAE,YAAY,EAAE,MAAW;AAClD,SACE,CAAC;AAAA,IACC,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,YAAY;AAAA,MACV,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,GAEA,CAAC;AAAA,IACC,UAAU;AAAA,IACV,OAAO,MAAM,IAAI;AAAA,IACjB,QAAQ,MAAM,IAAI;AAAA,EACpB,EACF,EAfC;AAiBL;",
4
+ "mappings": "AAAA,SAAS,cAAc;AAEvB,SAAS,sBAAsB;AAExB,MAAM,WAAW,CAAC,EAAE,YAAY,EAAE,MAErC,CAAC;AAAA,EACC,IAAI;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,YAAY;AAAA,IACV,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,CAEA,CAAC;AAAA,EACC,UAAU;AAAA,EACV,OAAO,MAAM,IAAI;AAAA,EACjB,QAAQ,MAAM,IAAI;AACpB,EACF,EAfC;",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,20 @@
1
+ import { YStack } from "tamagui";
2
+ import { TamaguiIconSvg } from "./TamaguiLogoSvg";
3
+ const LogoIcon = ({ downscale = 2 }) => <YStack
4
+ tag="span"
5
+ className="unselectable"
6
+ alignSelf="center"
7
+ marginVertical={-10}
8
+ pressStyle={{
9
+ opacity: 0.7,
10
+ scaleX: -1
11
+ }}
12
+ ><TamaguiIconSvg
13
+ className="tamagui-icon"
14
+ width={450 / 8 / downscale}
15
+ height={420 / 8 / downscale}
16
+ /></YStack>;
17
+ export {
18
+ LogoIcon
19
+ };
20
+ //# sourceMappingURL=LogoIcon.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/LogoIcon.tsx"],
4
+ "mappings": "AAAA,SAAS,cAAc;AAEvB,SAAS,sBAAsB;AAExB,MAAM,WAAW,CAAC,EAAE,YAAY,EAAE,MAErC,CAAC;AAAA,EACC,IAAI;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,YAAY;AAAA,IACV,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,CAEA,CAAC;AAAA,EACC,UAAU;AAAA,EACV,OAAO,MAAM,IAAI;AAAA,EACjB,QAAQ,MAAM,IAAI;AACpB,EACF,EAfC;",
5
+ "names": []
6
+ }
@@ -7,38 +7,25 @@ const LogoWords = memo(
7
7
  animated,
8
8
  ...props
9
9
  }) => {
10
- const Tint = useTint();
11
- const { tintIndex: index, tint } = Tint;
12
- const tints = Tint.tints.map((t) => `var(--${t}9)`);
13
- const [hovered, setHovered] = useState(false);
14
- const [mounted, setMounted] = useState("start");
10
+ const Tint = useTint(), { tintIndex: index, tint } = Tint, tints = Tint.tints.map((t) => `var(--${t}9)`), [hovered, setHovered] = useState(!1), [mounted, setMounted] = useState("start");
15
11
  useEffect(() => {
16
- const idle = window.requestIdleCallback || setTimeout;
17
- idle(() => {
12
+ (window.requestIdleCallback || setTimeout)(() => {
18
13
  setTimeout(() => {
19
14
  setMounted("animate");
20
- }, 50);
21
- setTimeout(() => {
15
+ }, 50), setTimeout(() => {
22
16
  setMounted("done");
23
17
  }, 1500);
24
18
  });
25
19
  }, []);
26
20
  const getColor = (i) => {
27
21
  const isActive = mounted !== "start" && i === index;
28
- if (mounted !== "done" || hovered) {
29
- return isActive ? "var(--color)" : tints[index];
30
- }
31
- if (hovered && isActive) {
32
- return "var(--color)";
33
- }
34
- return tints[i];
35
- };
36
- const x = Math.round(
22
+ return mounted !== "done" || hovered ? isActive ? "var(--color)" : tints[index] : hovered && isActive ? "var(--color)" : tints[i];
23
+ }, x = Math.round(
37
24
  index * 18.5 + 18 / 2 * (index / tints.length) + 3 + (index === 6 ? -3 : 0)
38
25
  );
39
26
  return <XStack
40
- onHoverIn={() => setHovered(true)}
41
- onHoverOut={() => setHovered(false)}
27
+ onHoverIn={() => setHovered(!0)}
28
+ onHoverOut={() => setHovered(!1)}
42
29
  paddingVertical="$2"
43
30
  marginVertical="$-2"
44
31
  position="relative"
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/LogoWords.tsx"],
4
- "mappings": "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",
4
+ "mappings": "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",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,99 @@
1
+ import { memo, useEffect, useState } from "react";
2
+ import { Circle, XStack } from "tamagui";
3
+ import { useTint } from "./useTint";
4
+ const LogoWords = memo(
5
+ ({
6
+ downscale = 1,
7
+ animated,
8
+ ...props
9
+ }) => {
10
+ const Tint = useTint(), { tintIndex: index, tint } = Tint, tints = Tint.tints.map((t) => `var(--${t}9)`), [hovered, setHovered] = useState(!1), [mounted, setMounted] = useState("start");
11
+ useEffect(() => {
12
+ (window.requestIdleCallback || setTimeout)(() => {
13
+ setTimeout(() => {
14
+ setMounted("animate");
15
+ }, 50), setTimeout(() => {
16
+ setMounted("done");
17
+ }, 1500);
18
+ });
19
+ }, []);
20
+ const getColor = (i) => {
21
+ const isActive = mounted !== "start" && i === index;
22
+ return mounted !== "done" || hovered ? isActive ? "var(--color)" : tints[index] : hovered && isActive ? "var(--color)" : tints[i];
23
+ }, x = Math.round(
24
+ index * 18.5 + 18 / 2 * (index / tints.length) + 3 + (index === 6 ? -3 : 0)
25
+ );
26
+ return <XStack
27
+ onHoverIn={() => setHovered(!0)}
28
+ onHoverOut={() => setHovered(!1)}
29
+ paddingVertical="$2"
30
+ marginVertical="$-2"
31
+ position="relative"
32
+ {...props}
33
+ >
34
+ {animated && <Circle
35
+ animation="quick"
36
+ position="absolute"
37
+ top={0}
38
+ left={0}
39
+ y={mounted === "start" ? -30 : -3}
40
+ x={x}
41
+ size={4}
42
+ backgroundColor="$color9"
43
+ />}
44
+ <svg
45
+ width={373 * (1 / downscale) * 0.333333334}
46
+ height={41 * (1 / downscale) * 0.333333334}
47
+ viewBox="0 0 373 41"
48
+ >
49
+ <polygon
50
+ shapeRendering="crispEdges"
51
+ fill={getColor(0)}
52
+ points="24.3870968 40.1612903 24.3870968 8.67741935 32.2580645 8.67741935 32.2580645 0.806451613 0.774193548 0.806451613 0.774193548 8.67741935 8.64516129 8.67741935 8.64516129 40.1612903"
53
+ onMouseEnter={() => Tint.setTintIndex(0)}
54
+ />
55
+ <path
56
+ shapeRendering="crispEdges"
57
+ fill={getColor(1)}
58
+ d="M87.3548387,0.806451613 L87.3548387,8.67741935 L95.2258065,8.67741935 L95.2258065,40.1612903 L79.483871,40.1612903 L79.483871,24.4193548 L71.6129032,24.4193548 L71.6129032,40.1612903 L55.8709677,40.1612903 L55.8709677,8.67741935 L63.7419355,8.67741935 L63.7419355,0.806451613 L87.3548387,0.806451613 Z M79.483871,8.67741935 L71.6129032,8.67741935 L71.6129032,16.5483871 L79.483871,16.5483871 L79.483871,8.67741935 Z"
59
+ fillRule="nonzero"
60
+ onMouseEnter={() => Tint.setTintIndex(1)}
61
+ />
62
+ <polygon
63
+ shapeRendering="crispEdges"
64
+ fill={getColor(2)}
65
+ points="130.645161 40.1612903 130.645161 22.4516129 138.516129 22.4516129 138.516129 40.1612903 154.258065 40.1612903 154.258065 0.806451613 142.451613 0.806451613 142.451613 8.67741935 126.709677 8.67741935 126.709677 0.806451613 114.903226 0.806451613 114.903226 40.1612903"
66
+ onMouseEnter={() => Tint.setTintIndex(2)}
67
+ />
68
+ <path
69
+ fill={getColor(3)}
70
+ d="M205.419355,0.806451613 L205.419355,8.67741935 L213.290323,8.67741935 L213.290323,40.1612903 L197.548387,40.1612903 L197.548387,24.4193548 L189.677419,24.4193548 L189.677419,40.1612903 L173.935484,40.1612903 L173.935484,8.67741935 L181.806452,8.67741935 L181.806452,0.806451613 L205.419355,0.806451613 Z M197.548387,8.67741935 L189.677419,8.67741935 L189.677419,16.5483871 L197.548387,16.5483871 L197.548387,8.67741935 Z"
71
+ fillRule="nonzero"
72
+ onMouseEnter={() => Tint.setTintIndex(3)}
73
+ />
74
+ <polygon
75
+ shapeRendering="crispEdges"
76
+ fill={getColor(4)}
77
+ points="264.451613 40.1612903 264.451613 32.2903226 272.322581 32.2903226 272.322581 16.5483871 256.580645 16.5483871 256.580645 32.2903226 248.709677 32.2903226 248.709677 8.67741935 272.322581 8.67741935 272.322581 0.806451613 240.83871 0.806451613 240.83871 8.67741935 232.967742 8.67741935 232.967742 32.2903226 240.83871 32.2903226 240.83871 40.1612903"
78
+ onMouseEnter={() => Tint.setTintIndex(4)}
79
+ />
80
+ <polygon
81
+ shapeRendering="crispEdges"
82
+ fill={getColor(5)}
83
+ points="323.483871 40.1612903 323.483871 32.2903226 331.354839 32.2903226 331.354839 0.806451613 315.612903 0.806451613 315.612903 32.2903226 307.741935 32.2903226 307.741935 0.806451613 292 0.806451613 292 32.2903226 299.870968 32.2903226 299.870968 40.1612903"
84
+ onMouseEnter={() => Tint.setTintIndex(5)}
85
+ />
86
+ <polygon
87
+ shapeRendering="crispEdges"
88
+ fill={getColor(6)}
89
+ points="372.677419 40.1612903 372.677419 0.806451613 356.935484 0.806451613 356.935484 40.1612903"
90
+ onMouseEnter={() => Tint.setTintIndex(6)}
91
+ />
92
+ </svg>
93
+ </XStack>;
94
+ }
95
+ );
96
+ export {
97
+ LogoWords
98
+ };
99
+ //# sourceMappingURL=LogoWords.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/LogoWords.tsx"],
4
+ "mappings": "AAAA,SAAS,MAAM,WAAW,gBAAgB;AAC1C,SAAS,QAAQ,cAA2B;AAE5C,SAAS,eAAe;AAEjB,MAAM,YAAY;AAAA,EACvB,CAAC;AAAA,IACC,YAAY;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EACL,MAAgE;AAC9D,UAAM,OAAO,QAAQ,GACf,EAAE,WAAW,OAAO,KAAK,IAAI,MAC7B,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,SAAS,CAAC,IAAI,GAC5C,CAAC,SAAS,UAAU,IAAI,SAAS,EAAK,GACtC,CAAC,SAAS,UAAU,IAAI,SAAuC,OAAO;AAE5E,cAAU,MAAM;AAEd,OADa,OAAO,uBAAuB,YACtC,MAAM;AACT,mBAAW,MAAM;AACf,qBAAW,SAAS;AAAA,QACtB,GAAG,EAAE,GAEL,WAAW,MAAM;AACf,qBAAW,MAAM;AAAA,QACnB,GAAG,IAAI;AAAA,MACT,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAEL,UAAM,WAAW,CAAC,MAAc;AAC9B,YAAM,WAAW,YAAY,WAAW,MAAM;AAC9C,aAAI,YAAY,UAAU,UACjB,WAAW,iBAAiB,MAAM,KAAK,IAE5C,WAAW,WACN,iBAEF,MAAM,CAAC;AAAA,IAChB,GAEM,IAAI,KAAK;AAAA,MACb,QAAQ,OAAQ,KAAK,KAAM,QAAQ,MAAM,UAAU,KAAK,UAAU,IAAI,KAAK;AAAA,IAC7E;AAEA,WACE,CAAC;AAAA,MACC,WAAW,MAAM,WAAW,EAAI;AAAA,MAChC,YAAY,MAAM,WAAW,EAAK;AAAA,MAClC,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,SAAS;AAAA,UACL;AAAA;AAAA,OAEH,YACC,CAAC;AAAA,QACC,UAAU;AAAA,QACV,SAAS;AAAA,QACT,KAAK;AAAA,QACL,MAAM;AAAA,QAIN,GAAG,YAAY,UAAU,MAAM;AAAA,QAE/B,GAAG;AAAA,QACH,MAAM;AAAA,QACN,gBAAgB;AAAA,MAClB;AAAA,MAEF,CAAC;AAAA,QACC,OAAO,OAAO,IAAI,aAAa;AAAA,QAC/B,QAAQ,MAAM,IAAI,aAAa;AAAA,QAC/B,QAAQ;AAAA;AAAA,QAER,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,OAAO;AAAA,UACP,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,EAAE;AAAA,UACF,SAAS;AAAA,UACT,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,OAAO;AAAA,UACP,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,MAAM,SAAS,CAAC;AAAA,UAChB,EAAE;AAAA,UACF,SAAS;AAAA,UACT,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,OAAO;AAAA,UACP,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,OAAO;AAAA,UACP,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,QACA,CAAC;AAAA,UACC,eAAe;AAAA,UACf,MAAM,SAAS,CAAC;AAAA,UAChB,OAAO;AAAA,UACP,cAAc,MAAM,KAAK,aAAa,CAAC;AAAA,QACzC;AAAA,MACF,EAhDC;AAAA,IAiDH,EAzEC;AAAA,EA2EL;AACF;",
5
+ "names": []
6
+ }
@@ -3,19 +3,17 @@ import { XStack, YStack } from "tamagui";
3
3
  import { LogoIcon } from "./LogoIcon";
4
4
  import { LogoWords } from "./LogoWords";
5
5
  const TamaguiLogo = forwardRef(
6
- ({ showWords, downscale, animated, ...props }, ref) => {
7
- return <XStack
8
- tag="span"
9
- ref={ref}
10
- alignItems="center"
11
- justifyContent="center"
12
- space="$5"
13
- {...props}
14
- >
15
- <LogoIcon downscale={(downscale ?? 1) * (showWords ? 2 : 1.5)} />
16
- {showWords && <YStack tag="span" marginBottom={-4}><LogoWords animated={animated} downscale={downscale ?? 2} /></YStack>}
17
- </XStack>;
18
- }
6
+ ({ showWords, downscale, animated, ...props }, ref) => <XStack
7
+ tag="span"
8
+ ref={ref}
9
+ alignItems="center"
10
+ justifyContent="center"
11
+ space="$5"
12
+ {...props}
13
+ >
14
+ <LogoIcon downscale={(downscale ?? 1) * (showWords ? 2 : 1.5)} />
15
+ {showWords && <YStack tag="span" marginBottom={-4}><LogoWords animated={animated} downscale={downscale ?? 2} /></YStack>}
16
+ </XStack>
19
17
  );
20
18
  export {
21
19
  TamaguiLogo
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/TamaguiLogo.tsx"],
4
- "mappings": "AAAA,SAAS,kBAAkB;AAC3B,SAAS,QAAqB,cAAc;AAE5C,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAQnB,MAAM,cAAc;AAAA,EACzB,CAAC,EAAE,WAAW,WAAW,UAAU,GAAG,MAAM,GAAc,QAAQ;AAChE,WACE,CAAC;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW;AAAA,MACX,eAAe;AAAA,MACf,MAAM;AAAA,UACF;AAAA;AAAA,MAEJ,CAAC,SAAS,YAAY,aAAa,MAAM,YAAY,IAAI,MAAM;AAAA,OAC9D,aACC,CAAC,OAAO,IAAI,OAAO,cAAc,IAC/B,CAAC,UAAU,UAAU,UAAU,WAAW,aAAa,GAAG,EAC5D,EAFC;AAAA,IAIL,EAdC;AAAA,EAgBL;AACF;",
4
+ "mappings": "AAAA,SAAS,kBAAkB;AAC3B,SAAS,QAAqB,cAAc;AAE5C,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAQnB,MAAM,cAAc;AAAA,EACzB,CAAC,EAAE,WAAW,WAAW,UAAU,GAAG,MAAM,GAAc,QAEtD,CAAC;AAAA,IACC,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACX,eAAe;AAAA,IACf,MAAM;AAAA,QACF;AAAA;AAAA,IAEJ,CAAC,SAAS,YAAY,aAAa,MAAM,YAAY,IAAI,MAAM;AAAA,KAC9D,aACC,CAAC,OAAO,IAAI,OAAO,cAAc,IAC/B,CAAC,UAAU,UAAU,UAAU,WAAW,aAAa,GAAG,EAC5D,EAFC;AAAA,EAIL,EAdC;AAiBP;",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,21 @@
1
+ import { forwardRef } from "react";
2
+ import { XStack, YStack } from "tamagui";
3
+ import { LogoIcon } from "./LogoIcon";
4
+ import { LogoWords } from "./LogoWords";
5
+ const TamaguiLogo = forwardRef(
6
+ ({ showWords, downscale, animated, ...props }, ref) => <XStack
7
+ tag="span"
8
+ ref={ref}
9
+ alignItems="center"
10
+ justifyContent="center"
11
+ space="$5"
12
+ {...props}
13
+ >
14
+ <LogoIcon downscale={(downscale ?? 1) * (showWords ? 2 : 1.5)} />
15
+ {showWords && <YStack tag="span" marginBottom={-4}><LogoWords animated={animated} downscale={downscale ?? 2} /></YStack>}
16
+ </XStack>
17
+ );
18
+ export {
19
+ TamaguiLogo
20
+ };
21
+ //# sourceMappingURL=TamaguiLogo.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TamaguiLogo.tsx"],
4
+ "mappings": "AAAA,SAAS,kBAAkB;AAC3B,SAAS,QAAqB,cAAc;AAE5C,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAQnB,MAAM,cAAc;AAAA,EACzB,CAAC,EAAE,WAAW,WAAW,UAAU,GAAG,MAAM,GAAc,QAEtD,CAAC;AAAA,IACC,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACX,eAAe;AAAA,IACf,MAAM;AAAA,QACF;AAAA;AAAA,IAEJ,CAAC,SAAS,YAAY,aAAa,MAAM,YAAY,IAAI,MAAM;AAAA,KAC9D,aACC,CAAC,OAAO,IAAI,OAAO,cAAc,IAC/B,CAAC,UAAU,UAAU,UAAU,WAAW,aAAa,GAAG,EAC5D,EAFC;AAAA,EAIL,EAdC;AAiBP;",
5
+ "names": []
6
+ }
@@ -0,0 +1,14 @@
1
+ const TamaguiIconSvg = (props) => <svg width={424} height={394} viewBox="0 0 424 394" {...props}><g fill="none" fillRule="evenodd">
2
+ <path
3
+ d="M310.786 30v28.75H372.5l-.001 28.75H426.5v86.25h-54.001l.001 28.75h-61.714v115h-28.929V375h-202.5v-57.5H21.5v-230h57.857V30h231.429Z"
4
+ opacity={0.267}
5
+ />
6
+ <g fill="var(--color)">
7
+ <path d="M279.5 0h-20v20h20zM250.7 0h-20v20h20zM221.9 0h-20v20h20zM193.1 0h-20v20h20zM164.3 0h-20v20h20zM135.5 0h-20v20h20zM106.7 28.714h-20v20h20zM77.9 57.429h-20v20h20zM49.1 86.143h-20v20h20zM49.1 114.857h-20v20h20zM49.1 143.571h-20v20h20zM49.1 172.286h-20v20h20zM20.3 201H.3v20h20zM20.3 229.714H.3v20h20zM20.3 258.429H.3v20h20zM49.1 287.143h-20v20h20zM77.9 315.857h-20v20h20zM106.7 344.571h-20v20h20zM135.5 373.286h-20v20h20zM164.3 373.286h-20v20h20zM193.1 344.571h-20v20h20zM221.9 344.571h-20v20h20zM221.9 373.286h-20v20h20zM250.7 373.286h-20v20h20zM279.5 344.571h-20v20h20zM279.5 315.857h-20v20h20zM308.3 287.143h-20v20h20zM337.1 229.714h-20v20h20zM337.1 258.429h-20v20h20zM337.1 201h-20v20h20zM365.9 172.286h-20v20h20zM394.7 172.286h-20v20h20zM423.5 143.571h-20v20h20zM394.7 114.857h-20v20h20zM365.9 114.857h-20v20h20zM337.1 114.857h-20v20h20zM423.5 86.143h-20v20h20zM423.5 114.857h-20v20h20zM394.7 57.429h-20v20h20z" />
8
+ <path d="M394.7 57.429h-20v20h20zM365.9 57.429h-20v20h20zM308.3 28.714h-20v20h20zM279.5 57.429h-20v20h20zM193.1 86.143h-20v20h20zM193.1 201h-20v20h20zM193.1 229.714h-20v20h20zM164.3 258.429h-20v20h20zM135.5 229.714h-20v20h20zM135.5 201h-20v20h20zM337.1 57.429h-20v20h20z" />
9
+ </g>
10
+ </g></svg>;
11
+ export {
12
+ TamaguiIconSvg
13
+ };
14
+ //# sourceMappingURL=TamaguiLogoSvg.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TamaguiLogoSvg.tsx"],
4
+ "mappings": "AAAO,MAAM,iBAAiB,CAAC,UAC7B,CAAC,IAAI,OAAO,KAAK,QAAQ,KAAK,QAAQ,kBAAkB,OACtD,CAAC,EAAE,KAAK,OAAO,SAAS;AAAA,EACtB,CAAC;AAAA,IACC,EAAE;AAAA,IACF,SAAS;AAAA,EACX;AAAA,EACA,CAAC,EAAE,KAAK;AAAA,IACN,CAAC,KAAK,EAAE,o5BAAo5B;AAAA,IAC55B,CAAC,KAAK,EAAE,wQAAwQ;AAAA,EAClR,EAHC;AAIH,EATC,EAUH,EAXC;",
5
+ "names": []
6
+ }
@@ -0,0 +1,6 @@
1
+ export * from "./TamaguiLogo";
2
+ export * from "./LogoWords";
3
+ export * from "./LogoIcon";
4
+ export * from "./tints";
5
+ export * from "./useTint";
6
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx"],
4
+ "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
5
+ "names": []
6
+ }
package/dist/jsx/tints.js CHANGED
@@ -3,9 +3,7 @@ const familiesValues = {
3
3
  tamagui: ["orange", "yellow", "green", "blue", "purple", "pink", "red"],
4
4
  xmas: ["red", "green", "red", "green", "red", "green", "red"],
5
5
  easter: ["yellow", "pink", "yellow", "pink", "yellow", "pink", "yellow"]
6
- };
7
- const familiesNames = Object.keys(familiesValues);
8
- const families = familiesValues;
6
+ }, familiesNames = Object.keys(familiesValues), families = familiesValues;
9
7
  let fam = "tamagui";
10
8
  function getTints() {
11
9
  return {
@@ -16,29 +14,19 @@ function getTints() {
16
14
  }
17
15
  function useTints() {
18
16
  const [val, setVal] = useState(getTints());
19
- useEffect(() => {
20
- return onTintFamilyChange(() => {
21
- setVal(getTints());
22
- });
23
- }, []);
24
- return val;
17
+ return useEffect(() => onTintFamilyChange(() => {
18
+ setVal(getTints());
19
+ }), []), val;
25
20
  }
26
21
  const setTintFamily = (next) => {
27
22
  if (!families[next])
28
- throw `impossible`;
29
- fam = next;
30
- listeners.forEach((l) => l(next));
31
- };
32
- const setNextTintFamily = () => {
23
+ throw "impossible";
24
+ fam = next, listeners.forEach((l) => l(next));
25
+ }, setNextTintFamily = () => {
33
26
  setTintFamily(familiesNames[(familiesNames.indexOf(fam) + 1) % familiesNames.length]);
34
- };
35
- const listeners = /* @__PURE__ */ new Set();
36
- const onTintFamilyChange = (cb) => {
37
- listeners.add(cb);
38
- return () => {
39
- listeners.delete(cb);
40
- };
41
- };
27
+ }, listeners = /* @__PURE__ */ new Set(), onTintFamilyChange = (cb) => (listeners.add(cb), () => {
28
+ listeners.delete(cb);
29
+ });
42
30
  export {
43
31
  getTints,
44
32
  onTintFamilyChange,
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/tints.tsx"],
4
- "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,MAAM,iBAAiB;AAAA,EACrB,SAAS,CAAC,UAAU,UAAU,SAAS,QAAQ,UAAU,QAAQ,KAAK;AAAA,EACtE,MAAM,CAAC,OAAO,SAAS,OAAO,SAAS,OAAO,SAAS,KAAK;AAAA,EAC5D,QAAQ,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,QAAQ;AACzE;AAIA,MAAM,gBAAgB,OAAO,KAAK,cAAc;AAEhD,MAAM,WAAW;AAMjB,IAAI,MAAkB;AAEf,SAAS,WAAW;AACzB,SAAO;AAAA,IACL,MAAM,OAAO;AAAA,IACb,OAAO,SAAS,GAAG,KAAK,SAAS;AAAA,IACjC;AAAA,EACF;AACF;AAEO,SAAS,WAAW;AACzB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,SAAS,CAAC;AAEzC,YAAU,MAAM;AACd,WAAO,mBAAmB,MAAM;AAC9B,aAAO,SAAS,CAAC;AAAA,IACnB,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;AAEO,MAAM,gBAAgB,CAAC,SAAqB;AACjD,MAAI,CAAC,SAAS,IAAI;AAAG,UAAM;AAC3B,QAAM;AACN,YAAU,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;AAClC;AAEO,MAAM,oBAAoB,MAAM;AACrC,gBAAc,eAAe,cAAc,QAAQ,GAAG,IAAI,KAAK,cAAc,MAAM,CAAC;AACtF;AAIA,MAAM,YAAY,oBAAI,IAAmB;AAElC,MAAM,qBAAqB,CAAC,OAAsB;AACvD,YAAU,IAAI,EAAE;AAChB,SAAO,MAAM;AACX,cAAU,OAAO,EAAE;AAAA,EACrB;AACF;",
4
+ "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,MAAM,iBAAiB;AAAA,EACrB,SAAS,CAAC,UAAU,UAAU,SAAS,QAAQ,UAAU,QAAQ,KAAK;AAAA,EACtE,MAAM,CAAC,OAAO,SAAS,OAAO,SAAS,OAAO,SAAS,KAAK;AAAA,EAC5D,QAAQ,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,QAAQ;AACzE,GAIM,gBAAgB,OAAO,KAAK,cAAc,GAE1C,WAAW;AAMjB,IAAI,MAAkB;AAEf,SAAS,WAAW;AACzB,SAAO;AAAA,IACL,MAAM,OAAO;AAAA,IACb,OAAO,SAAS,GAAG,KAAK,SAAS;AAAA,IACjC;AAAA,EACF;AACF;AAEO,SAAS,WAAW;AACzB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,SAAS,CAAC;AAEzC,mBAAU,MACD,mBAAmB,MAAM;AAC9B,WAAO,SAAS,CAAC;AAAA,EACnB,CAAC,GACA,CAAC,CAAC,GAEE;AACT;AAEO,MAAM,gBAAgB,CAAC,SAAqB;AACjD,MAAI,CAAC,SAAS,IAAI;AAAG,UAAM;AAC3B,QAAM,MACN,UAAU,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;AAClC,GAEa,oBAAoB,MAAM;AACrC,gBAAc,eAAe,cAAc,QAAQ,GAAG,IAAI,KAAK,cAAc,MAAM,CAAC;AACtF,GAIM,YAAY,oBAAI,IAAmB,GAE5B,qBAAqB,CAAC,QACjC,UAAU,IAAI,EAAE,GACT,MAAM;AACX,YAAU,OAAO,EAAE;AACrB;",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,37 @@
1
+ import { useEffect, useState } from "react";
2
+ const familiesValues = {
3
+ tamagui: ["orange", "yellow", "green", "blue", "purple", "pink", "red"],
4
+ xmas: ["red", "green", "red", "green", "red", "green", "red"],
5
+ easter: ["yellow", "pink", "yellow", "pink", "yellow", "pink", "yellow"]
6
+ }, familiesNames = Object.keys(familiesValues), families = familiesValues;
7
+ let fam = "tamagui";
8
+ function getTints() {
9
+ return {
10
+ name: fam || "tamagui",
11
+ tints: families[fam] || families.tamagui,
12
+ families
13
+ };
14
+ }
15
+ function useTints() {
16
+ const [val, setVal] = useState(getTints());
17
+ return useEffect(() => onTintFamilyChange(() => {
18
+ setVal(getTints());
19
+ }), []), val;
20
+ }
21
+ const setTintFamily = (next) => {
22
+ if (!families[next])
23
+ throw "impossible";
24
+ fam = next, listeners.forEach((l) => l(next));
25
+ }, setNextTintFamily = () => {
26
+ setTintFamily(familiesNames[(familiesNames.indexOf(fam) + 1) % familiesNames.length]);
27
+ }, listeners = /* @__PURE__ */ new Set(), onTintFamilyChange = (cb) => (listeners.add(cb), () => {
28
+ listeners.delete(cb);
29
+ });
30
+ export {
31
+ getTints,
32
+ onTintFamilyChange,
33
+ setNextTintFamily,
34
+ setTintFamily,
35
+ useTints
36
+ };
37
+ //# sourceMappingURL=tints.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tints.tsx"],
4
+ "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAGpC,MAAM,iBAAiB;AAAA,EACrB,SAAS,CAAC,UAAU,UAAU,SAAS,QAAQ,UAAU,QAAQ,KAAK;AAAA,EACtE,MAAM,CAAC,OAAO,SAAS,OAAO,SAAS,OAAO,SAAS,KAAK;AAAA,EAC5D,QAAQ,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,QAAQ,QAAQ;AACzE,GAIM,gBAAgB,OAAO,KAAK,cAAc,GAE1C,WAAW;AAMjB,IAAI,MAAkB;AAEf,SAAS,WAAW;AACzB,SAAO;AAAA,IACL,MAAM,OAAO;AAAA,IACb,OAAO,SAAS,GAAG,KAAK,SAAS;AAAA,IACjC;AAAA,EACF;AACF;AAEO,SAAS,WAAW;AACzB,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,SAAS,CAAC;AAEzC,mBAAU,MACD,mBAAmB,MAAM;AAC9B,WAAO,SAAS,CAAC;AAAA,EACnB,CAAC,GACA,CAAC,CAAC,GAEE;AACT;AAEO,MAAM,gBAAgB,CAAC,SAAqB;AACjD,MAAI,CAAC,SAAS,IAAI;AAAG,UAAM;AAC3B,QAAM,MACN,UAAU,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC;AAClC,GAEa,oBAAoB,MAAM;AACrC,gBAAc,eAAe,cAAc,QAAQ,GAAG,IAAI,KAAK,cAAc,MAAM,CAAC;AACtF,GAIM,YAAY,oBAAI,IAAmB,GAE5B,qBAAqB,CAAC,QACjC,UAAU,IAAI,EAAE,GACT,MAAM;AACX,YAAU,OAAO,EAAE;AACrB;",
5
+ "names": []
6
+ }