@tamagui/demos 1.37.3 → 1.38.1

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.
@@ -0,0 +1,158 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+ var ThemeBuilderDemo_exports = {};
20
+ __export(ThemeBuilderDemo_exports, {
21
+ ThemeBuilderDemo: () => ThemeBuilderDemo
22
+ });
23
+ module.exports = __toCommonJS(ThemeBuilderDemo_exports);
24
+ var import_jsx_runtime = require("react/jsx-runtime");
25
+ var import_tamagui = require("tamagui");
26
+ function ThemeBuilderDemo() {
27
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { fullscreen: true, ov: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { mah: 200, y: -100, x: -50, rotate: "-10deg", children: [
28
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { y: 35, bc: "$color9" }),
29
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$8", y: 30, bc: "$color7" }),
30
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$6", y: -50, bc: "$color5" }),
31
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$4", bc: "$color3" }),
32
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$2", bc: "$color1" }),
33
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$4", y: 50, bc: "$color3" }),
34
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$6", y: 80, bc: "$color5" }),
35
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$8", bc: "$color7" }),
36
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { bc: "$color9" }),
37
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$8", bc: "$color7" }),
38
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$6", y: 80, bc: "$color5" }),
39
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$4", y: 50, bc: "$color3" }),
40
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$2", bc: "$color1" }),
41
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$4", bc: "$color3" }),
42
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$6", y: -50, bc: "$color5" }),
43
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { size: "$8", y: 30, bc: "$color7" }),
44
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Col, { y: 35, bc: "$color9" })
45
+ ] }) });
46
+ }
47
+ function Col(props) {
48
+ const subTheme = props.subTheme ? `_${props.subTheme}` : "";
49
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { padding: "$2.5", space: "$3.5", children: [
50
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Square, { br: "$6", size: "$10", theme: props.subTheme, bg: "$background", ...props }),
51
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
52
+ import_tamagui.Square,
53
+ {
54
+ br: "$6",
55
+ size: "$10",
56
+ theme: "orange" + subTheme,
57
+ bg: "$background",
58
+ ...props
59
+ }
60
+ ),
61
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
62
+ import_tamagui.Square,
63
+ {
64
+ br: "$6",
65
+ size: "$10",
66
+ theme: "yellow" + subTheme,
67
+ bg: "$background",
68
+ ...props
69
+ }
70
+ ),
71
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
72
+ import_tamagui.Square,
73
+ {
74
+ br: "$6",
75
+ size: "$10",
76
+ theme: "green" + subTheme,
77
+ bg: "$background",
78
+ ...props
79
+ }
80
+ ),
81
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
82
+ import_tamagui.Square,
83
+ {
84
+ br: "$6",
85
+ size: "$10",
86
+ theme: "blue" + subTheme,
87
+ bg: "$background",
88
+ ...props
89
+ }
90
+ ),
91
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
92
+ import_tamagui.Square,
93
+ {
94
+ br: "$6",
95
+ size: "$10",
96
+ theme: "purple" + subTheme,
97
+ bg: "$background",
98
+ ...props
99
+ }
100
+ ),
101
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
102
+ import_tamagui.Square,
103
+ {
104
+ br: "$6",
105
+ size: "$10",
106
+ theme: "pink" + subTheme,
107
+ bg: "$background",
108
+ ...props
109
+ }
110
+ ),
111
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
112
+ import_tamagui.Square,
113
+ {
114
+ br: "$6",
115
+ size: "$10",
116
+ theme: "red" + subTheme,
117
+ bg: "$background",
118
+ ...props
119
+ }
120
+ ),
121
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Square, { br: "$6", size: "$10", theme: props.subTheme, bg: "$background", ...props }),
122
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
123
+ import_tamagui.Square,
124
+ {
125
+ br: "$6",
126
+ size: "$10",
127
+ theme: "orange" + subTheme,
128
+ bg: "$background",
129
+ ...props
130
+ }
131
+ ),
132
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
133
+ import_tamagui.Square,
134
+ {
135
+ br: "$6",
136
+ size: "$10",
137
+ theme: "yellow" + subTheme,
138
+ bg: "$background",
139
+ ...props
140
+ }
141
+ ),
142
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
143
+ import_tamagui.Square,
144
+ {
145
+ br: "$6",
146
+ size: "$10",
147
+ theme: "green" + subTheme,
148
+ bg: "$background",
149
+ ...props
150
+ }
151
+ )
152
+ ] });
153
+ }
154
+ // Annotate the CommonJS export names for ESM import in node:
155
+ 0 && (module.exports = {
156
+ ThemeBuilderDemo
157
+ });
158
+ //# sourceMappingURL=ThemeBuilderDemo.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/ThemeBuilderDemo.tsx"],
4
+ "mappings": "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",
5
+ "names": []
6
+ }
package/dist/cjs/index.js CHANGED
@@ -24,6 +24,7 @@ __reExport(src_exports, require("./AnimationsPresenceDemo"), module.exports);
24
24
  __reExport(src_exports, require("./AvatarDemo"), module.exports);
25
25
  __reExport(src_exports, require("./ButtonDemo"), module.exports);
26
26
  __reExport(src_exports, require("./BuildAButtonDemo"), module.exports);
27
+ __reExport(src_exports, require("./ThemeBuilderDemo"), module.exports);
27
28
  __reExport(src_exports, require("./CardDemo"), module.exports);
28
29
  __reExport(src_exports, require("./DialogDemo"), module.exports);
29
30
  __reExport(src_exports, require("./AddThemeDemo"), module.exports);
@@ -73,6 +74,7 @@ __reExport(src_exports, require("./useOnIntersecting"), module.exports);
73
74
  ...require("./AvatarDemo"),
74
75
  ...require("./ButtonDemo"),
75
76
  ...require("./BuildAButtonDemo"),
77
+ ...require("./ThemeBuilderDemo"),
76
78
  ...require("./CardDemo"),
77
79
  ...require("./DialogDemo"),
78
80
  ...require("./AddThemeDemo"),
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,8BAAd;AACA,wBAAc,6BADd;AAEA,wBAAc,kCAFd;AAGA,wBAAc,kCAHd;AAIA,wBAAc,mCAJd;AAKA,wBAAc,qCALd;AAMA,wBAAc,yBANd;AAOA,wBAAc,yBAPd;AAQA,wBAAc,+BARd;AASA,wBAAc,uBATd;AAUA,wBAAc,yBAVd;AAWA,wBAAc,2BAXd;AAYA,wBAAc,8BAZd;AAaA,wBAAc,+BAbd;AAcA,wBAAc,wBAdd;AAeA,wBAAc,yBAfd;AAgBA,wBAAc,wBAhBd;AAiBA,wBAAc,2BAjBd;AAkBA,wBAAc,wBAlBd;AAmBA,wBAAc,wBAnBd;AAoBA,wBAAc,iCApBd;AAqBA,wBAAc,2BArBd;AAsBA,wBAAc,8BAtBd;AAuBA,wBAAc,0BAvBd;AAwBA,wBAAc,2BAxBd;AAyBA,wBAAc,6BAzBd;AA0BA,wBAAc,yBA1Bd;AA2BA,wBAAc,4BA3Bd;AA4BA,wBAAc,yBA5Bd;AA6BA,wBAAc,6BA7Bd;AA8BA,wBAAc,wBA9Bd;AA+BA,wBAAc,yBA/Bd;AAgCA,wBAAc,0BAhCd;AAiCA,wBAAc,yBAjCd;AAkCA,wBAAc,yBAlCd;AAmCA,wBAAc,2BAnCd;AAoCA,wBAAc,uBApCd;AAqCA,wBAAc,+BArCd;AAsCA,wBAAc,0BAtCd;AAuCA,wBAAc,yBAvCd;AAwCA,wBAAc,yBAxCd;AAyCA,wBAAc,wBAzCd;AA0CA,wBAAc,iCA1Cd;AA2CA,wBAAc,uBA3Cd;AA4CA,wBAAc,+BA5Cd;AA6CA,wBAAc,8BA7Cd;AA8CA,wBAAc,gCA9Cd;",
4
+ "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,8BAAd;AACA,wBAAc,6BADd;AAEA,wBAAc,kCAFd;AAGA,wBAAc,kCAHd;AAIA,wBAAc,mCAJd;AAKA,wBAAc,qCALd;AAMA,wBAAc,yBANd;AAOA,wBAAc,yBAPd;AAQA,wBAAc,+BARd;AASA,wBAAc,+BATd;AAUA,wBAAc,uBAVd;AAWA,wBAAc,yBAXd;AAYA,wBAAc,2BAZd;AAaA,wBAAc,8BAbd;AAcA,wBAAc,+BAdd;AAeA,wBAAc,wBAfd;AAgBA,wBAAc,yBAhBd;AAiBA,wBAAc,wBAjBd;AAkBA,wBAAc,2BAlBd;AAmBA,wBAAc,wBAnBd;AAoBA,wBAAc,wBApBd;AAqBA,wBAAc,iCArBd;AAsBA,wBAAc,2BAtBd;AAuBA,wBAAc,8BAvBd;AAwBA,wBAAc,0BAxBd;AAyBA,wBAAc,2BAzBd;AA0BA,wBAAc,6BA1Bd;AA2BA,wBAAc,yBA3Bd;AA4BA,wBAAc,4BA5Bd;AA6BA,wBAAc,yBA7Bd;AA8BA,wBAAc,6BA9Bd;AA+BA,wBAAc,wBA/Bd;AAgCA,wBAAc,yBAhCd;AAiCA,wBAAc,0BAjCd;AAkCA,wBAAc,yBAlCd;AAmCA,wBAAc,yBAnCd;AAoCA,wBAAc,2BApCd;AAqCA,wBAAc,uBArCd;AAsCA,wBAAc,+BAtCd;AAuCA,wBAAc,0BAvCd;AAwCA,wBAAc,yBAxCd;AAyCA,wBAAc,yBAzCd;AA0CA,wBAAc,wBA1Cd;AA2CA,wBAAc,iCA3Cd;AA4CA,wBAAc,uBA5Cd;AA6CA,wBAAc,+BA7Cd;AA8CA,wBAAc,8BA9Cd;AA+CA,wBAAc,gCA/Cd;",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,134 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { Square, XStack, YStack } from "tamagui";
3
+ function ThemeBuilderDemo() {
4
+ return /* @__PURE__ */ jsx(YStack, { fullscreen: true, ov: "hidden", children: /* @__PURE__ */ jsxs(XStack, { mah: 200, y: -100, x: -50, rotate: "-10deg", children: [
5
+ /* @__PURE__ */ jsx(Col, { y: 35, bc: "$color9" }),
6
+ /* @__PURE__ */ jsx(Col, { size: "$8", y: 30, bc: "$color7" }),
7
+ /* @__PURE__ */ jsx(Col, { size: "$6", y: -50, bc: "$color5" }),
8
+ /* @__PURE__ */ jsx(Col, { size: "$4", bc: "$color3" }),
9
+ /* @__PURE__ */ jsx(Col, { size: "$2", bc: "$color1" }),
10
+ /* @__PURE__ */ jsx(Col, { size: "$4", y: 50, bc: "$color3" }),
11
+ /* @__PURE__ */ jsx(Col, { size: "$6", y: 80, bc: "$color5" }),
12
+ /* @__PURE__ */ jsx(Col, { size: "$8", bc: "$color7" }),
13
+ /* @__PURE__ */ jsx(Col, { bc: "$color9" }),
14
+ /* @__PURE__ */ jsx(Col, { size: "$8", bc: "$color7" }),
15
+ /* @__PURE__ */ jsx(Col, { size: "$6", y: 80, bc: "$color5" }),
16
+ /* @__PURE__ */ jsx(Col, { size: "$4", y: 50, bc: "$color3" }),
17
+ /* @__PURE__ */ jsx(Col, { size: "$2", bc: "$color1" }),
18
+ /* @__PURE__ */ jsx(Col, { size: "$4", bc: "$color3" }),
19
+ /* @__PURE__ */ jsx(Col, { size: "$6", y: -50, bc: "$color5" }),
20
+ /* @__PURE__ */ jsx(Col, { size: "$8", y: 30, bc: "$color7" }),
21
+ /* @__PURE__ */ jsx(Col, { y: 35, bc: "$color9" })
22
+ ] }) });
23
+ }
24
+ function Col(props) {
25
+ const subTheme = props.subTheme ? `_${props.subTheme}` : "";
26
+ return /* @__PURE__ */ jsxs(YStack, { padding: "$2.5", space: "$3.5", children: [
27
+ /* @__PURE__ */ jsx(Square, { br: "$6", size: "$10", theme: props.subTheme, bg: "$background", ...props }),
28
+ /* @__PURE__ */ jsx(
29
+ Square,
30
+ {
31
+ br: "$6",
32
+ size: "$10",
33
+ theme: "orange" + subTheme,
34
+ bg: "$background",
35
+ ...props
36
+ }
37
+ ),
38
+ /* @__PURE__ */ jsx(
39
+ Square,
40
+ {
41
+ br: "$6",
42
+ size: "$10",
43
+ theme: "yellow" + subTheme,
44
+ bg: "$background",
45
+ ...props
46
+ }
47
+ ),
48
+ /* @__PURE__ */ jsx(
49
+ Square,
50
+ {
51
+ br: "$6",
52
+ size: "$10",
53
+ theme: "green" + subTheme,
54
+ bg: "$background",
55
+ ...props
56
+ }
57
+ ),
58
+ /* @__PURE__ */ jsx(
59
+ Square,
60
+ {
61
+ br: "$6",
62
+ size: "$10",
63
+ theme: "blue" + subTheme,
64
+ bg: "$background",
65
+ ...props
66
+ }
67
+ ),
68
+ /* @__PURE__ */ jsx(
69
+ Square,
70
+ {
71
+ br: "$6",
72
+ size: "$10",
73
+ theme: "purple" + subTheme,
74
+ bg: "$background",
75
+ ...props
76
+ }
77
+ ),
78
+ /* @__PURE__ */ jsx(
79
+ Square,
80
+ {
81
+ br: "$6",
82
+ size: "$10",
83
+ theme: "pink" + subTheme,
84
+ bg: "$background",
85
+ ...props
86
+ }
87
+ ),
88
+ /* @__PURE__ */ jsx(
89
+ Square,
90
+ {
91
+ br: "$6",
92
+ size: "$10",
93
+ theme: "red" + subTheme,
94
+ bg: "$background",
95
+ ...props
96
+ }
97
+ ),
98
+ /* @__PURE__ */ jsx(Square, { br: "$6", size: "$10", theme: props.subTheme, bg: "$background", ...props }),
99
+ /* @__PURE__ */ jsx(
100
+ Square,
101
+ {
102
+ br: "$6",
103
+ size: "$10",
104
+ theme: "orange" + subTheme,
105
+ bg: "$background",
106
+ ...props
107
+ }
108
+ ),
109
+ /* @__PURE__ */ jsx(
110
+ Square,
111
+ {
112
+ br: "$6",
113
+ size: "$10",
114
+ theme: "yellow" + subTheme,
115
+ bg: "$background",
116
+ ...props
117
+ }
118
+ ),
119
+ /* @__PURE__ */ jsx(
120
+ Square,
121
+ {
122
+ br: "$6",
123
+ size: "$10",
124
+ theme: "green" + subTheme,
125
+ bg: "$background",
126
+ ...props
127
+ }
128
+ )
129
+ ] });
130
+ }
131
+ export {
132
+ ThemeBuilderDemo
133
+ };
134
+ //# sourceMappingURL=ThemeBuilderDemo.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/ThemeBuilderDemo.tsx"],
4
+ "mappings": "AAMM,SACE,KADF;AALN,SAAsB,QAAgC,QAAQ,cAAc;AAErE,SAAS,mBAAmB;AACjC,SACE,oBAAC,UAAO,YAAU,MAAC,IAAG,UACpB,+BAAC,UAAO,KAAK,KAAK,GAAG,MAAM,GAAG,KAAK,QAAO,UACxC;AAAA,wBAAC,OAAI,GAAG,IAAI,IAAG,WAAU;AAAA,IACzB,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,MAAK,MAAK,GAAG,KAAK,IAAG,WAAU;AAAA,IACpC,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,IAAG,WAAU;AAAA,IAClB,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,MAAK,MAAK,IAAG,WAAU;AAAA,IAC5B,oBAAC,OAAI,MAAK,MAAK,GAAG,KAAK,IAAG,WAAU;AAAA,IACpC,oBAAC,OAAI,MAAK,MAAK,GAAG,IAAI,IAAG,WAAU;AAAA,IACnC,oBAAC,OAAI,GAAG,IAAI,IAAG,WAAU;AAAA,KAC3B,GACF;AAEJ;AAEA,SAAS,IACP,OAGA;AACA,QAAM,WAAW,MAAM,WAAW,IAAI,MAAM,aAAa;AACzD,SACE,qBAAC,UAAO,SAAQ,QAAO,OAAM,QAC3B;AAAA,wBAAC,UAAO,IAAG,MAAK,MAAK,OAAM,OAAO,MAAM,UAAU,IAAG,eAAe,GAAG,OAAO;AAAA,IAC9E;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,WAAW;AAAA,QACnB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,WAAW;AAAA,QACnB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,UAAU;AAAA,QAClB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,SAAS;AAAA,QACjB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,WAAW;AAAA,QACnB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,SAAS;AAAA,QACjB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,QAAQ;AAAA,QAChB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA,oBAAC,UAAO,IAAG,MAAK,MAAK,OAAM,OAAO,MAAM,UAAU,IAAG,eAAe,GAAG,OAAO;AAAA,IAC9E;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,WAAW;AAAA,QACnB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,WAAW;AAAA,QACnB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,OAAQ,UAAU;AAAA,QAClB,IAAG;AAAA,QACF,GAAG;AAAA;AAAA,IACN;AAAA,KACF;AAEJ;",
5
+ "names": []
6
+ }
package/dist/esm/index.js CHANGED
@@ -7,6 +7,7 @@ export * from "./AnimationsPresenceDemo";
7
7
  export * from "./AvatarDemo";
8
8
  export * from "./ButtonDemo";
9
9
  export * from "./BuildAButtonDemo";
10
+ export * from "./ThemeBuilderDemo";
10
11
  export * from "./CardDemo";
11
12
  export * from "./DialogDemo";
12
13
  export * from "./AddThemeDemo";
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
4
+ "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
5
5
  "names": []
6
6
  }
@@ -0,0 +1,103 @@
1
+ import { Square, XStack, YStack } from "tamagui";
2
+ function ThemeBuilderDemo() {
3
+ return <YStack fullscreen ov="hidden"><XStack mah={200} y={-100} x={-50} rotate="-10deg">
4
+ <Col y={35} bc="$color9" />
5
+ <Col size="$8" y={30} bc="$color7" />
6
+ <Col size="$6" y={-50} bc="$color5" />
7
+ <Col size="$4" bc="$color3" />
8
+ <Col size="$2" bc="$color1" />
9
+ <Col size="$4" y={50} bc="$color3" />
10
+ <Col size="$6" y={80} bc="$color5" />
11
+ <Col size="$8" bc="$color7" />
12
+ <Col bc="$color9" />
13
+ <Col size="$8" bc="$color7" />
14
+ <Col size="$6" y={80} bc="$color5" />
15
+ <Col size="$4" y={50} bc="$color3" />
16
+ <Col size="$2" bc="$color1" />
17
+ <Col size="$4" bc="$color3" />
18
+ <Col size="$6" y={-50} bc="$color5" />
19
+ <Col size="$8" y={30} bc="$color7" />
20
+ <Col y={35} bc="$color9" />
21
+ </XStack></YStack>;
22
+ }
23
+ function Col(props) {
24
+ const subTheme = props.subTheme ? `_${props.subTheme}` : "";
25
+ return <YStack padding="$2.5" space="$3.5">
26
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
27
+ <Square
28
+ br="$6"
29
+ size="$10"
30
+ theme={"orange" + subTheme}
31
+ bg="$background"
32
+ {...props}
33
+ />
34
+ <Square
35
+ br="$6"
36
+ size="$10"
37
+ theme={"yellow" + subTheme}
38
+ bg="$background"
39
+ {...props}
40
+ />
41
+ <Square
42
+ br="$6"
43
+ size="$10"
44
+ theme={"green" + subTheme}
45
+ bg="$background"
46
+ {...props}
47
+ />
48
+ <Square
49
+ br="$6"
50
+ size="$10"
51
+ theme={"blue" + subTheme}
52
+ bg="$background"
53
+ {...props}
54
+ />
55
+ <Square
56
+ br="$6"
57
+ size="$10"
58
+ theme={"purple" + subTheme}
59
+ bg="$background"
60
+ {...props}
61
+ />
62
+ <Square
63
+ br="$6"
64
+ size="$10"
65
+ theme={"pink" + subTheme}
66
+ bg="$background"
67
+ {...props}
68
+ />
69
+ <Square
70
+ br="$6"
71
+ size="$10"
72
+ theme={"red" + subTheme}
73
+ bg="$background"
74
+ {...props}
75
+ />
76
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
77
+ <Square
78
+ br="$6"
79
+ size="$10"
80
+ theme={"orange" + subTheme}
81
+ bg="$background"
82
+ {...props}
83
+ />
84
+ <Square
85
+ br="$6"
86
+ size="$10"
87
+ theme={"yellow" + subTheme}
88
+ bg="$background"
89
+ {...props}
90
+ />
91
+ <Square
92
+ br="$6"
93
+ size="$10"
94
+ theme={"green" + subTheme}
95
+ bg="$background"
96
+ {...props}
97
+ />
98
+ </YStack>;
99
+ }
100
+ export {
101
+ ThemeBuilderDemo
102
+ };
103
+ //# sourceMappingURL=ThemeBuilderDemo.js.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/ThemeBuilderDemo.tsx"],
4
+ "mappings": "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",
5
+ "names": []
6
+ }
@@ -0,0 +1,103 @@
1
+ import { Square, XStack, YStack } from "tamagui";
2
+ function ThemeBuilderDemo() {
3
+ return <YStack fullscreen ov="hidden"><XStack mah={200} y={-100} x={-50} rotate="-10deg">
4
+ <Col y={35} bc="$color9" />
5
+ <Col size="$8" y={30} bc="$color7" />
6
+ <Col size="$6" y={-50} bc="$color5" />
7
+ <Col size="$4" bc="$color3" />
8
+ <Col size="$2" bc="$color1" />
9
+ <Col size="$4" y={50} bc="$color3" />
10
+ <Col size="$6" y={80} bc="$color5" />
11
+ <Col size="$8" bc="$color7" />
12
+ <Col bc="$color9" />
13
+ <Col size="$8" bc="$color7" />
14
+ <Col size="$6" y={80} bc="$color5" />
15
+ <Col size="$4" y={50} bc="$color3" />
16
+ <Col size="$2" bc="$color1" />
17
+ <Col size="$4" bc="$color3" />
18
+ <Col size="$6" y={-50} bc="$color5" />
19
+ <Col size="$8" y={30} bc="$color7" />
20
+ <Col y={35} bc="$color9" />
21
+ </XStack></YStack>;
22
+ }
23
+ function Col(props) {
24
+ const subTheme = props.subTheme ? `_${props.subTheme}` : "";
25
+ return <YStack padding="$2.5" space="$3.5">
26
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
27
+ <Square
28
+ br="$6"
29
+ size="$10"
30
+ theme={"orange" + subTheme}
31
+ bg="$background"
32
+ {...props}
33
+ />
34
+ <Square
35
+ br="$6"
36
+ size="$10"
37
+ theme={"yellow" + subTheme}
38
+ bg="$background"
39
+ {...props}
40
+ />
41
+ <Square
42
+ br="$6"
43
+ size="$10"
44
+ theme={"green" + subTheme}
45
+ bg="$background"
46
+ {...props}
47
+ />
48
+ <Square
49
+ br="$6"
50
+ size="$10"
51
+ theme={"blue" + subTheme}
52
+ bg="$background"
53
+ {...props}
54
+ />
55
+ <Square
56
+ br="$6"
57
+ size="$10"
58
+ theme={"purple" + subTheme}
59
+ bg="$background"
60
+ {...props}
61
+ />
62
+ <Square
63
+ br="$6"
64
+ size="$10"
65
+ theme={"pink" + subTheme}
66
+ bg="$background"
67
+ {...props}
68
+ />
69
+ <Square
70
+ br="$6"
71
+ size="$10"
72
+ theme={"red" + subTheme}
73
+ bg="$background"
74
+ {...props}
75
+ />
76
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
77
+ <Square
78
+ br="$6"
79
+ size="$10"
80
+ theme={"orange" + subTheme}
81
+ bg="$background"
82
+ {...props}
83
+ />
84
+ <Square
85
+ br="$6"
86
+ size="$10"
87
+ theme={"yellow" + subTheme}
88
+ bg="$background"
89
+ {...props}
90
+ />
91
+ <Square
92
+ br="$6"
93
+ size="$10"
94
+ theme={"green" + subTheme}
95
+ bg="$background"
96
+ {...props}
97
+ />
98
+ </YStack>;
99
+ }
100
+ export {
101
+ ThemeBuilderDemo
102
+ };
103
+ //# sourceMappingURL=ThemeBuilderDemo.mjs.map
@@ -0,0 +1,6 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/ThemeBuilderDemo.tsx"],
4
+ "mappings": "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",
5
+ "names": []
6
+ }
package/dist/jsx/index.js CHANGED
@@ -7,6 +7,7 @@ export * from "./AnimationsPresenceDemo";
7
7
  export * from "./AvatarDemo";
8
8
  export * from "./ButtonDemo";
9
9
  export * from "./BuildAButtonDemo";
10
+ export * from "./ThemeBuilderDemo";
10
11
  export * from "./CardDemo";
11
12
  export * from "./DialogDemo";
12
13
  export * from "./AddThemeDemo";
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
4
+ "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
5
5
  "names": []
6
6
  }
@@ -7,6 +7,7 @@ export * from "./AnimationsPresenceDemo";
7
7
  export * from "./AvatarDemo";
8
8
  export * from "./ButtonDemo";
9
9
  export * from "./BuildAButtonDemo";
10
+ export * from "./ThemeBuilderDemo";
10
11
  export * from "./CardDemo";
11
12
  export * from "./DialogDemo";
12
13
  export * from "./AddThemeDemo";
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
4
+ "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
5
5
  "names": []
6
6
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/demos",
3
- "version": "1.37.3",
3
+ "version": "1.38.1",
4
4
  "sideEffects": [
5
5
  "*.css"
6
6
  ],
@@ -33,29 +33,29 @@
33
33
  }
34
34
  },
35
35
  "dependencies": {
36
- "@tamagui/avatar": "1.37.3",
37
- "@tamagui/button": "1.37.3",
38
- "@tamagui/config": "1.37.3",
39
- "@tamagui/core": "1.37.3",
40
- "@tamagui/list-item": "1.37.3",
41
- "@tamagui/logo": "1.37.3",
42
- "@tamagui/menu": "1.37.3",
43
- "@tamagui/popover": "1.37.3",
44
- "@tamagui/progress": "1.37.3",
45
- "@tamagui/radio-group": "1.37.3",
46
- "@tamagui/select": "1.37.3",
47
- "@tamagui/sheet": "1.37.3",
48
- "@tamagui/slider": "1.37.3",
49
- "@tamagui/stacks": "1.37.3",
50
- "@tamagui/toast": "1.37.3",
51
- "tamagui": "1.37.3"
36
+ "@tamagui/avatar": "1.38.1",
37
+ "@tamagui/button": "1.38.1",
38
+ "@tamagui/config": "1.38.1",
39
+ "@tamagui/core": "1.38.1",
40
+ "@tamagui/list-item": "1.38.1",
41
+ "@tamagui/logo": "1.38.1",
42
+ "@tamagui/menu": "1.38.1",
43
+ "@tamagui/popover": "1.38.1",
44
+ "@tamagui/progress": "1.38.1",
45
+ "@tamagui/radio-group": "1.38.1",
46
+ "@tamagui/select": "1.38.1",
47
+ "@tamagui/sheet": "1.38.1",
48
+ "@tamagui/slider": "1.38.1",
49
+ "@tamagui/stacks": "1.38.1",
50
+ "@tamagui/toast": "1.38.1",
51
+ "tamagui": "1.38.1"
52
52
  },
53
53
  "peerDependencies": {
54
54
  "react": "*",
55
55
  "react-dom": "*"
56
56
  },
57
57
  "devDependencies": {
58
- "@tamagui/build": "1.37.3",
58
+ "@tamagui/build": "1.38.1",
59
59
  "react": "^18.2.0",
60
60
  "react-dom": "^18.2.0"
61
61
  },
@@ -0,0 +1,112 @@
1
+ import { Drumstick, Hand } from '@tamagui/lucide-icons'
2
+ import { ButtonProps, Square, SquareProps, ThemeName, XStack, YStack } from 'tamagui'
3
+
4
+ export function ThemeBuilderDemo() {
5
+ return (
6
+ <YStack fullscreen ov="hidden">
7
+ <XStack mah={200} y={-100} x={-50} rotate="-10deg">
8
+ <Col y={35} bc="$color9" />
9
+ <Col size="$8" y={30} bc="$color7" />
10
+ <Col size="$6" y={-50} bc="$color5" />
11
+ <Col size="$4" bc="$color3" />
12
+ <Col size="$2" bc="$color1" />
13
+ <Col size="$4" y={50} bc="$color3" />
14
+ <Col size="$6" y={80} bc="$color5" />
15
+ <Col size="$8" bc="$color7" />
16
+ <Col bc="$color9" />
17
+ <Col size="$8" bc="$color7" />
18
+ <Col size="$6" y={80} bc="$color5" />
19
+ <Col size="$4" y={50} bc="$color3" />
20
+ <Col size="$2" bc="$color1" />
21
+ <Col size="$4" bc="$color3" />
22
+ <Col size="$6" y={-50} bc="$color5" />
23
+ <Col size="$8" y={30} bc="$color7" />
24
+ <Col y={35} bc="$color9" />
25
+ </XStack>
26
+ </YStack>
27
+ )
28
+ }
29
+
30
+ function Col(
31
+ props: SquareProps & {
32
+ subTheme?: any
33
+ }
34
+ ) {
35
+ const subTheme = props.subTheme ? `_${props.subTheme}` : ''
36
+ return (
37
+ <YStack padding="$2.5" space="$3.5">
38
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
39
+ <Square
40
+ br="$6"
41
+ size="$10"
42
+ theme={('orange' + subTheme) as ThemeName}
43
+ bg="$background"
44
+ {...props}
45
+ />
46
+ <Square
47
+ br="$6"
48
+ size="$10"
49
+ theme={('yellow' + subTheme) as ThemeName}
50
+ bg="$background"
51
+ {...props}
52
+ />
53
+ <Square
54
+ br="$6"
55
+ size="$10"
56
+ theme={('green' + subTheme) as ThemeName}
57
+ bg="$background"
58
+ {...props}
59
+ />
60
+ <Square
61
+ br="$6"
62
+ size="$10"
63
+ theme={('blue' + subTheme) as ThemeName}
64
+ bg="$background"
65
+ {...props}
66
+ />
67
+ <Square
68
+ br="$6"
69
+ size="$10"
70
+ theme={('purple' + subTheme) as ThemeName}
71
+ bg="$background"
72
+ {...props}
73
+ />
74
+ <Square
75
+ br="$6"
76
+ size="$10"
77
+ theme={('pink' + subTheme) as ThemeName}
78
+ bg="$background"
79
+ {...props}
80
+ />
81
+ <Square
82
+ br="$6"
83
+ size="$10"
84
+ theme={('red' + subTheme) as ThemeName}
85
+ bg="$background"
86
+ {...props}
87
+ />
88
+ <Square br="$6" size="$10" theme={props.subTheme} bg="$background" {...props} />
89
+ <Square
90
+ br="$6"
91
+ size="$10"
92
+ theme={('orange' + subTheme) as ThemeName}
93
+ bg="$background"
94
+ {...props}
95
+ />
96
+ <Square
97
+ br="$6"
98
+ size="$10"
99
+ theme={('yellow' + subTheme) as ThemeName}
100
+ bg="$background"
101
+ {...props}
102
+ />
103
+ <Square
104
+ br="$6"
105
+ size="$10"
106
+ theme={('green' + subTheme) as ThemeName}
107
+ bg="$background"
108
+ {...props}
109
+ />
110
+ </YStack>
111
+ )
112
+ }
package/src/index.tsx CHANGED
@@ -7,6 +7,7 @@ export * from './AnimationsPresenceDemo'
7
7
  export * from './AvatarDemo'
8
8
  export * from './ButtonDemo'
9
9
  export * from './BuildAButtonDemo'
10
+ export * from './ThemeBuilderDemo'
10
11
  export * from './CardDemo'
11
12
  export * from './DialogDemo'
12
13
  export * from './AddThemeDemo'
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ export declare function ThemeBuilderDemo(): JSX.Element;
3
+ //# sourceMappingURL=ThemeBuilderDemo.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ThemeBuilderDemo.d.ts","sourceRoot":"","sources":["../src/ThemeBuilderDemo.tsx"],"names":[],"mappings":";AAGA,wBAAgB,gBAAgB,gBAwB/B"}
package/types/index.d.ts CHANGED
@@ -7,6 +7,7 @@ export * from './AnimationsPresenceDemo';
7
7
  export * from './AvatarDemo';
8
8
  export * from './ButtonDemo';
9
9
  export * from './BuildAButtonDemo';
10
+ export * from './ThemeBuilderDemo';
10
11
  export * from './CardDemo';
11
12
  export * from './DialogDemo';
12
13
  export * from './AddThemeDemo';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,kBAAkB,CAAA;AAChC,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,kBAAkB,CAAA;AAChC,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA"}