@tamagui/demos 2.0.0-1768636514428 → 2.0.0-1768699687560
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/dist/cjs/ColorsDemo.cjs +41 -29
- package/dist/cjs/ColorsDemo.js +40 -28
- package/dist/cjs/ColorsDemo.js.map +1 -1
- package/dist/cjs/ColorsDemo.native.js +26 -23
- package/dist/cjs/ColorsDemo.native.js.map +1 -1
- package/dist/cjs/ContextMenuDemo.cjs +1 -1
- package/dist/cjs/ContextMenuDemo.js +1 -1
- package/dist/cjs/ContextMenuDemo.js.map +1 -1
- package/dist/cjs/ContextMenuDemo.native.js +1 -1
- package/dist/cjs/RadioGroupUnstyledDemo.cjs +1 -1
- package/dist/cjs/RadioGroupUnstyledDemo.js +1 -1
- package/dist/cjs/RadioGroupUnstyledDemo.js.map +1 -1
- package/dist/cjs/RadioGroupUnstyledDemo.native.js +1 -1
- package/dist/cjs/RadioGroupUnstyledDemo.native.js.map +1 -1
- package/dist/cjs/SelectDemo.cjs +1 -1
- package/dist/cjs/SelectDemo.js +1 -1
- package/dist/cjs/SelectDemo.js.map +1 -1
- package/dist/cjs/SelectDemo.native.js +1 -1
- package/dist/cjs/SelectDemo.native.js.map +1 -1
- package/dist/cjs/TabsHeadlessDemo.cjs +1 -1
- package/dist/cjs/TabsHeadlessDemo.js +1 -1
- package/dist/cjs/TabsHeadlessDemo.js.map +1 -1
- package/dist/cjs/TabsHeadlessDemo.native.js +1 -1
- package/dist/cjs/TabsHeadlessDemo.native.js.map +1 -1
- package/dist/cjs/ToggleGroupDemo.cjs +14 -20
- package/dist/cjs/ToggleGroupDemo.js +10 -19
- package/dist/cjs/ToggleGroupDemo.js.map +1 -1
- package/dist/cjs/ToggleGroupDemo.native.js +14 -20
- package/dist/cjs/ToggleGroupDemo.native.js.map +1 -1
- package/dist/esm/ColorsDemo.js +51 -36
- package/dist/esm/ColorsDemo.js.map +1 -1
- package/dist/esm/ColorsDemo.mjs +41 -29
- package/dist/esm/ColorsDemo.mjs.map +1 -1
- package/dist/esm/ColorsDemo.native.js +27 -24
- package/dist/esm/ColorsDemo.native.js.map +1 -1
- package/dist/esm/ContextMenuDemo.js +1 -1
- package/dist/esm/ContextMenuDemo.js.map +1 -1
- package/dist/esm/ContextMenuDemo.mjs +1 -1
- package/dist/esm/ContextMenuDemo.native.js +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.js +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.js.map +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.mjs +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.mjs.map +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.native.js +1 -1
- package/dist/esm/RadioGroupUnstyledDemo.native.js.map +1 -1
- package/dist/esm/SelectDemo.js +1 -1
- package/dist/esm/SelectDemo.js.map +1 -1
- package/dist/esm/SelectDemo.mjs +1 -1
- package/dist/esm/SelectDemo.mjs.map +1 -1
- package/dist/esm/SelectDemo.native.js +1 -1
- package/dist/esm/TabsHeadlessDemo.js +1 -1
- package/dist/esm/TabsHeadlessDemo.js.map +1 -1
- package/dist/esm/TabsHeadlessDemo.mjs +1 -1
- package/dist/esm/TabsHeadlessDemo.mjs.map +1 -1
- package/dist/esm/TabsHeadlessDemo.native.js +1 -1
- package/dist/esm/TabsHeadlessDemo.native.js.map +1 -1
- package/dist/esm/ToggleGroupDemo.js +10 -19
- package/dist/esm/ToggleGroupDemo.js.map +1 -1
- package/dist/esm/ToggleGroupDemo.mjs +14 -20
- package/dist/esm/ToggleGroupDemo.mjs.map +1 -1
- package/dist/esm/ToggleGroupDemo.native.js +14 -20
- package/dist/esm/ToggleGroupDemo.native.js.map +1 -1
- package/package.json +35 -34
- package/src/ColorsDemo.tsx +47 -38
- package/src/ContextMenuDemo.tsx +1 -1
- package/src/RadioGroupUnstyledDemo.tsx +1 -1
- package/src/SelectDemo.tsx +1 -1
- package/src/TabsHeadlessDemo.tsx +1 -1
- package/src/ToggleGroupDemo.tsx +12 -17
|
@@ -26,11 +26,12 @@ module.exports = __toCommonJS(ToggleGroupDemo_exports);
|
|
|
26
26
|
var import_lucide_icons = require("@tamagui/lucide-icons"),
|
|
27
27
|
import_tamagui = require("tamagui"),
|
|
28
28
|
import_jsx_runtime = require("react/jsx-runtime");
|
|
29
|
-
const
|
|
30
|
-
|
|
29
|
+
const StyledItem = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
|
|
30
|
+
hoverStyle: {
|
|
31
|
+
backgroundColor: "$color5"
|
|
32
|
+
},
|
|
31
33
|
toggledStyle: {
|
|
32
|
-
backgroundColor: "$
|
|
33
|
-
color: "$yellow9"
|
|
34
|
+
backgroundColor: "$color6"
|
|
34
35
|
}
|
|
35
36
|
});
|
|
36
37
|
function ToggleGroupDemo() {
|
|
@@ -86,35 +87,28 @@ function ToggleGroupComponent(props) {
|
|
|
86
87
|
type: props.type,
|
|
87
88
|
size: props.size,
|
|
88
89
|
disableDeactivation: props.type === "single" ? !0 : void 0,
|
|
89
|
-
children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(
|
|
90
|
+
children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(StyledItem, {
|
|
90
91
|
value: "left",
|
|
91
92
|
"aria-label": "Left aligned",
|
|
92
|
-
focusStyle: {
|
|
93
|
-
background: "$color12"
|
|
94
|
-
},
|
|
95
93
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {})
|
|
96
94
|
}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
|
|
97
95
|
value: "center",
|
|
98
96
|
"aria-label": "Center aligned",
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
backgroundColor: "$blue9",
|
|
102
|
-
color: "$green9"
|
|
97
|
+
hoverStyle: {
|
|
98
|
+
backgroundColor: "$color5"
|
|
103
99
|
},
|
|
104
|
-
|
|
105
|
-
|
|
100
|
+
toggledStyle: {
|
|
101
|
+
backgroundColor: "$color6"
|
|
106
102
|
},
|
|
107
103
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {})
|
|
108
104
|
}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
|
|
109
105
|
value: "right",
|
|
110
106
|
"aria-label": "Right aligned",
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
backgroundColor: "$red9",
|
|
114
|
-
color: "$blue9"
|
|
107
|
+
hoverStyle: {
|
|
108
|
+
backgroundColor: "$color5"
|
|
115
109
|
},
|
|
116
|
-
|
|
117
|
-
|
|
110
|
+
toggledStyle: {
|
|
111
|
+
backgroundColor: "$color6"
|
|
118
112
|
},
|
|
119
113
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {})
|
|
120
114
|
})]
|
|
@@ -18,11 +18,12 @@ __export(ToggleGroupDemo_exports, {
|
|
|
18
18
|
});
|
|
19
19
|
module.exports = __toCommonJS(ToggleGroupDemo_exports);
|
|
20
20
|
var import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
|
|
21
|
-
const
|
|
22
|
-
|
|
21
|
+
const StyledItem = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
|
|
22
|
+
hoverStyle: {
|
|
23
|
+
backgroundColor: "$color5"
|
|
24
|
+
},
|
|
23
25
|
toggledStyle: {
|
|
24
|
-
backgroundColor: "$
|
|
25
|
-
color: "$yellow9"
|
|
26
|
+
backgroundColor: "$color6"
|
|
26
27
|
}
|
|
27
28
|
});
|
|
28
29
|
function ToggleGroupDemo() {
|
|
@@ -57,23 +58,14 @@ function ToggleGroupComponent(props) {
|
|
|
57
58
|
size: props.size,
|
|
58
59
|
disableDeactivation: props.type === "single" ? !0 : void 0,
|
|
59
60
|
children: [
|
|
60
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
61
|
-
GreenItem,
|
|
62
|
-
{
|
|
63
|
-
value: "left",
|
|
64
|
-
"aria-label": "Left aligned",
|
|
65
|
-
focusStyle: { background: "$color12" },
|
|
66
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {})
|
|
67
|
-
}
|
|
68
|
-
),
|
|
61
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledItem, { value: "left", "aria-label": "Left aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {}) }),
|
|
69
62
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
70
63
|
import_tamagui.ToggleGroup.Item,
|
|
71
64
|
{
|
|
72
65
|
value: "center",
|
|
73
66
|
"aria-label": "Center aligned",
|
|
74
|
-
|
|
75
|
-
toggledStyle: { backgroundColor: "$
|
|
76
|
-
focusStyle: { background: "$color12" },
|
|
67
|
+
hoverStyle: { backgroundColor: "$color5" },
|
|
68
|
+
toggledStyle: { backgroundColor: "$color6" },
|
|
77
69
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {})
|
|
78
70
|
}
|
|
79
71
|
),
|
|
@@ -82,9 +74,8 @@ function ToggleGroupComponent(props) {
|
|
|
82
74
|
{
|
|
83
75
|
value: "right",
|
|
84
76
|
"aria-label": "Right aligned",
|
|
85
|
-
|
|
86
|
-
toggledStyle: { backgroundColor: "$
|
|
87
|
-
focusStyle: { background: "$color12" },
|
|
77
|
+
hoverStyle: { backgroundColor: "$color5" },
|
|
78
|
+
toggledStyle: { backgroundColor: "$color6" },
|
|
88
79
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {})
|
|
89
80
|
}
|
|
90
81
|
)
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ToggleGroupDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAmD,kCAEnD,iBAA2D,
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAmD,kCAEnD,iBAA2D,oBAgBnD;AAbR,MAAM,iBAAa,uBAAO,2BAAY,MAAM;AAAA,EAC1C,YAAY;AAAA,IACV,iBAAiB;AAAA,EACnB;AAAA,EACA,cAAc;AAAA,IACZ,iBAAiB;AAAA,EACnB;AACF,CAAC;AAEM,SAAS,kBAAkB;AAChC,SACE,4CAAC,yBAAO,IAAG,MACT,uDAAC,yBAAO,OAAM,UAAS,KAAI,OACzB;AAAA,iDAAC,yBAAO,OAAM,UAAS,KAAI,MACzB;AAAA,kDAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,cAAa;AAAA,MACvE,4CAAC,wBAAqB,MAAK,YAAW,MAAK,MAAK,aAAY,cAAa;AAAA,OAC3E;AAAA,IACA,6CAAC,yBAAO,OAAM,UAAS,KAAI,MACzB;AAAA,kDAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,YAAW;AAAA,MACrE,4CAAC,wBAAqB,MAAK,YAAW,MAAK,MAAK,aAAY,YAAW;AAAA,OACzE;AAAA,KACF,GACF;AAEJ;AAEA,SAAS,qBAAqB,OAI3B;AACD,QAAM,KAAK,UAAU,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC,CAAC,IAAI,MAAM,IAAI;AACjE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAe,MAAM,gBAAgB,eAAe,QAAQ;AAAA,MAC5D,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,KAAI;AAAA,MAEJ;AAAA,oDAAC,wBAAM,IAAG,MAAK,SAAQ,YAAW,MAAM,MAAM,MAAM,SAAS,IAC1D,gBAAM,SAAS,WAAW,WAAW,YACxC;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa,MAAM;AAAA,YACnB;AAAA,YACA,MAAM,MAAM;AAAA,YACZ,MAAM,MAAM;AAAA,YACZ,qBAAqB,MAAM,SAAS,WAAW,KAAO;AAAA,YAGtD;AAAA,0DAAC,cAAW,OAAM,QAAO,cAAW,gBAClC,sDAAC,iCAAU,GACb;AAAA,cAGA;AAAA,gBAAC,2BAAY;AAAA,gBAAZ;AAAA,kBACC,OAAM;AAAA,kBACN,cAAW;AAAA,kBACX,YAAY,EAAE,iBAAiB,UAAU;AAAA,kBACzC,cAAc,EAAE,iBAAiB,UAAU;AAAA,kBAE3C,sDAAC,mCAAY;AAAA;AAAA,cACf;AAAA,cAGA;AAAA,gBAAC,2BAAY;AAAA,gBAAZ;AAAA,kBACC,OAAM;AAAA,kBACN,cAAW;AAAA,kBACX,YAAY,EAAE,iBAAiB,UAAU;AAAA,kBACzC,cAAc,EAAE,iBAAiB,UAAU;AAAA,kBAE3C,sDAAC,kCAAW;AAAA;AAAA,cACd;AAAA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -28,11 +28,12 @@ module.exports = __toCommonJS(ToggleGroupDemo_exports);
|
|
|
28
28
|
var import_jsx_runtime = require("react/jsx-runtime"),
|
|
29
29
|
import_lucide_icons = require("@tamagui/lucide-icons"),
|
|
30
30
|
import_tamagui = require("tamagui"),
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
StyledItem = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
|
|
32
|
+
hoverStyle: {
|
|
33
|
+
backgroundColor: "$color5"
|
|
34
|
+
},
|
|
33
35
|
toggledStyle: {
|
|
34
|
-
backgroundColor: "$
|
|
35
|
-
color: "$yellow9"
|
|
36
|
+
backgroundColor: "$color6"
|
|
36
37
|
}
|
|
37
38
|
});
|
|
38
39
|
function ToggleGroupDemo() {
|
|
@@ -90,37 +91,30 @@ function ToggleGroupComponent(props) {
|
|
|
90
91
|
size: props.size,
|
|
91
92
|
disableDeactivation: props.type === "single" ? !0 : void 0,
|
|
92
93
|
children: [/* Using styled() component */
|
|
93
|
-
/* @__PURE__ */(0, import_jsx_runtime.jsx)(
|
|
94
|
+
/* @__PURE__ */(0, import_jsx_runtime.jsx)(StyledItem, {
|
|
94
95
|
value: "left",
|
|
95
96
|
"aria-label": "Left aligned",
|
|
96
|
-
focusStyle: {
|
|
97
|
-
background: "$color12"
|
|
98
|
-
},
|
|
99
97
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {})
|
|
100
98
|
}), /* Using inline toggledStyle prop */
|
|
101
99
|
/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
|
|
102
100
|
value: "center",
|
|
103
101
|
"aria-label": "Center aligned",
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
backgroundColor: "$blue9",
|
|
107
|
-
color: "$green9"
|
|
102
|
+
hoverStyle: {
|
|
103
|
+
backgroundColor: "$color5"
|
|
108
104
|
},
|
|
109
|
-
|
|
110
|
-
|
|
105
|
+
toggledStyle: {
|
|
106
|
+
backgroundColor: "$color6"
|
|
111
107
|
},
|
|
112
108
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {})
|
|
113
109
|
}), /* Using inline toggledStyle prop */
|
|
114
110
|
/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
|
|
115
111
|
value: "right",
|
|
116
112
|
"aria-label": "Right aligned",
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
backgroundColor: "$red9",
|
|
120
|
-
color: "$blue9"
|
|
113
|
+
hoverStyle: {
|
|
114
|
+
backgroundColor: "$color5"
|
|
121
115
|
},
|
|
122
|
-
|
|
123
|
-
|
|
116
|
+
toggledStyle: {
|
|
117
|
+
backgroundColor: "$color6"
|
|
124
118
|
},
|
|
125
119
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {})
|
|
126
120
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToggleGroupDemo_exports","__export","ToggleGroupDemo","module","exports","import_jsx_runtime","require","import_lucide_icons","import_tamagui","
|
|
1
|
+
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToggleGroupDemo_exports","__export","ToggleGroupDemo","module","exports","import_jsx_runtime","require","import_lucide_icons","import_tamagui","StyledItem","styled","ToggleGroup","Item","hoverStyle","backgroundColor","toggledStyle","jsx","YStack","px","children","jsxs","XStack","items","gap","ToggleGroupComponent","type","size","orientation","props","id","toString","slice","flexDirection","justify","Label","pr","htmlFor"],"sources":["../../src/ToggleGroupDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,uBAAA;AAAAC,QAAA,CAAAD,uBAAA;EAAAE,eAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAmD,CAAAK,uBAAA;AAKnD,IAAAK,kBAAM,GAAaC,OAAA,oBAAO;EAAAC,mBAAY,GAAAD,OAAM;EAAAE,cAAA,GAAAF,OAAA;EAAAG,UAAA,OAAAD,cAAA,CAAAE,MAAA,EAAAF,cAAA,CAAAG,WAAA,CAAAC,IAAA;IAC1CC,UAAA,EAAY;MACVC,eAAA,EAAiB;IACnB;IACAC,YAAA,EAAc;MACZD,eAAA,EAAiB;IACnB;EACF,CAAC;AAEM,SAASZ,gBAAA,EAAkB;EAChC,OACE,mBAAAG,kBAAA,CAAAW,GAAA,EAACR,cAAA,CAAAS,MAAA;IAEGC,EAAA;IACEC,QAAA,qBAAAd,kBAAC,CAAAe,IAAA,EAAAZ,cAAA,CAAqBa,MAAK;MAC3BC,KAAA;MAAyEC,GAC3E;MACAJ,QAAA,GACE,mBAAAd,kBAAA,CAAAe,IAAC,EAAAZ,cAAA,CAAAS,MAAqB;QACtBK,KAAA;QACFC,GAAA;QAEJJ,QAAA,GAEJ,mBAAAd,kBAAA,CAAAW,GAAA,EAAAQ,oBAAA;UAESC,IAAA;UAKIC,IAAA,MAAU;UAEnBC,WAAA;QAAC,uBAAAtB,kBAAA,CAAAW,GAAA,EAAAQ,oBAAA;UACCC,IAAA,YAAqB;UACfC,IAAA;UACNC,WAAQ;QACJ;MAEJ,IAGA,mBAAAtB,kBAAA,CAAAe,IAAA,EAAAZ,cAAA,CAAAa,MAAA;QAACC,KAAA;QAAAC,GAAA;QAAAJ,QACC,GACA,mBAAAd,kBAAA,CAAAW,GAAA,EAAAQ,oBAAA;UACAC,IAAM,UAAM;UACZC,IAAM,MAAM;UACZC,WAAA;QAGA,uBAAAtB,kBAAA,CAAAW,GAAA,EAAAQ,oBAAY;UAKZC,IAAA;UAAAC,IAAC;UAAYC,WAAZ;QAAA;MAEY;IAEgC;EAE9B;AAAA;AACf,SAAAH,oBAGAA,CAAAI,KAAA;EAAA,IAAAC,EAAA,aAACD,KAAA,CAAAF,IAAA,CAAAI,QAAA,GAAYC,KAAA,OAAAH,KAAA,CAAAH,IAAA;EAAA,sBAAZ,IAAApB,kBAAA,CAAAe,IAAA,EAAAZ,cAAA,CAAAa,MAAA;IAAAW,aAAA,EACCJ,KAAA,CAAMD,WAAA;IAAAL,KAAA,UACN;IAAWW,OAAA,UACX;IAAyCV,GAAA;IACEJ,QAAA,GAE/B,mBAAAd,kBAAA,CAAAW,GAAA,EAAAR,cAAA,CAAA0B,KAAA;MAAAC,EAAA,MACd;MAAAF,OAAA;MAAAP,IAAA,EAAAE,KAAA,CAAAF,IAAA;MACFU,OAAA,EAAAP,EAAA;MAAAV,QAAA,EAAAS,KAAA,CAAAH,IAAA;IAAA,IACF,mBAAApB,kBAAA,CAAAe,IAAA,EAAAZ,cAAA,CAAAG,WAAA;MAEJgB,WAAA,EAAAC,KAAA,CAAAD,WAAA","ignoreList":[]}
|
package/dist/esm/ColorsDemo.js
CHANGED
|
@@ -1,46 +1,66 @@
|
|
|
1
1
|
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
2
|
+
blue,
|
|
3
|
+
blueDark,
|
|
4
|
+
gray,
|
|
5
|
+
grayDark,
|
|
6
|
+
green,
|
|
7
|
+
greenDark,
|
|
8
|
+
red,
|
|
9
|
+
redDark,
|
|
10
|
+
yellow,
|
|
11
|
+
yellowDark
|
|
12
|
+
} from "@tamagui/colors";
|
|
13
|
+
import { H2, Paragraph, Separator, Square, XStack, YStack } from "tamagui";
|
|
11
14
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
|
-
const colorGroups = ["
|
|
15
|
+
const colorGroups = ["gray", "blue", "green", "yellow", "red"], lightColors = {
|
|
16
|
+
gray,
|
|
17
|
+
blue,
|
|
18
|
+
green,
|
|
19
|
+
yellow,
|
|
20
|
+
red
|
|
21
|
+
}, darkColors = {
|
|
22
|
+
gray: grayDark,
|
|
23
|
+
blue: blueDark,
|
|
24
|
+
green: greenDark,
|
|
25
|
+
yellow: yellowDark,
|
|
26
|
+
red: redDark
|
|
27
|
+
};
|
|
13
28
|
function ColorsDemo() {
|
|
14
|
-
const colors = getTokens({ prefixed: !1 }).color, [colorsLight, colorsDark] = [getColors(colors), getColors(colors, !0)];
|
|
15
29
|
return /* @__PURE__ */ jsxs(YStack, { mt: "$4", gap: "$8", children: [
|
|
16
|
-
/* @__PURE__ */ jsx(ColorsRow, { title: "Light",
|
|
30
|
+
/* @__PURE__ */ jsx(ColorsRow, { title: "Light", colorSets: lightColors }),
|
|
17
31
|
/* @__PURE__ */ jsx(Separator, {}),
|
|
18
|
-
/* @__PURE__ */ jsx(ColorsRow, { title: "Dark",
|
|
32
|
+
/* @__PURE__ */ jsx(ColorsRow, { title: "Dark", colorSets: darkColors })
|
|
19
33
|
] });
|
|
20
34
|
}
|
|
21
|
-
function ColorsRow({
|
|
35
|
+
function ColorsRow({
|
|
36
|
+
title,
|
|
37
|
+
colorSets
|
|
38
|
+
}) {
|
|
22
39
|
return /* @__PURE__ */ jsxs(YStack, { gap: "$4", $sm: { gap: "$2" }, children: [
|
|
23
40
|
/* @__PURE__ */ jsx(H2, { size: "$2", children: title }),
|
|
24
41
|
/* @__PURE__ */ jsxs(XStack, { gap: "$4", self: "center", children: [
|
|
25
42
|
/* @__PURE__ */ jsxs(YStack, { gap: "$4", $sm: { gap: "$2" }, self: "center", children: [
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
{
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
43
|
+
colorGroups.map((groupName) => {
|
|
44
|
+
const colorSet = colorSets[groupName], colors = Object.values(colorSet);
|
|
45
|
+
return /* @__PURE__ */ jsx(XStack, { gap: "$2", children: colors.map((color, index) => /* @__PURE__ */ jsx(
|
|
46
|
+
Square,
|
|
47
|
+
{
|
|
48
|
+
rounded: "$2",
|
|
49
|
+
size: "$4",
|
|
50
|
+
height: "$4",
|
|
51
|
+
borderWidth: 1,
|
|
52
|
+
bg: color,
|
|
53
|
+
borderColor: "$color7",
|
|
54
|
+
$sm: {
|
|
55
|
+
size: "$2"
|
|
56
|
+
},
|
|
57
|
+
$xs: {
|
|
58
|
+
size: "$1"
|
|
59
|
+
}
|
|
37
60
|
},
|
|
38
|
-
$
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
},
|
|
42
|
-
`${color.key}${index}`
|
|
43
|
-
)) }, index)),
|
|
61
|
+
`${groupName}${index}`
|
|
62
|
+
)) }, groupName);
|
|
63
|
+
}),
|
|
44
64
|
/* @__PURE__ */ jsx(XStack, { gap: "$2", self: "center", children: new Array(13).fill(0).slice(1).map((_, index) => /* @__PURE__ */ jsx(
|
|
45
65
|
Paragraph,
|
|
46
66
|
{
|
|
@@ -78,11 +98,6 @@ function ColorsRow({ title, colors }) {
|
|
|
78
98
|
] })
|
|
79
99
|
] });
|
|
80
100
|
}
|
|
81
|
-
function getColors(colors, dark = !1) {
|
|
82
|
-
return colors ? colorGroups.map((group) => Object.keys(colors).filter(
|
|
83
|
-
(color) => color.startsWith(group) && (dark ? color.endsWith("Dark") : !color.endsWith("Dark"))
|
|
84
|
-
).map((key) => colors[key])) : (console.warn("\u26A0\uFE0F no colors?", colors), []);
|
|
85
|
-
}
|
|
86
101
|
export {
|
|
87
102
|
ColorsDemo
|
|
88
103
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ColorsDemo.tsx"],
|
|
4
|
-
"mappings": "
|
|
4
|
+
"mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,IAAI,WAAW,WAAW,QAAQ,QAAQ,cAAc;AAsB7D,SACE,KADF;AApBJ,MAAM,cAAc,CAAC,QAAQ,QAAQ,SAAS,UAAU,KAAK,GAEvD,cAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEM,aAAa;AAAA,EACjB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AACP;AAEO,SAAS,aAAa;AAC3B,SACE,qBAAC,UAAO,IAAG,MAAK,KAAI,MAClB;AAAA,wBAAC,aAAU,OAAM,SAAQ,WAAW,aAAa;AAAA,IACjD,oBAAC,aAAU;AAAA,IACX,oBAAC,aAAU,OAAM,QAAO,WAAW,YAAY;AAAA,KACjD;AAEJ;AAIA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA;AACF,GAGG;AACD,SACE,qBAAC,UAAO,KAAI,MAAK,KAAK,EAAE,KAAK,KAAK,GAChC;AAAA,wBAAC,MAAG,MAAK,MAAM,iBAAM;AAAA,IAErB,qBAAC,UAAO,KAAI,MAAK,MAAK,UACpB;AAAA,2BAAC,UAAO,KAAI,MAAK,KAAK,EAAE,KAAK,KAAK,GAAG,MAAK,UACvC;AAAA,oBAAY,IAAI,CAAC,cAAc;AAC9B,gBAAM,WAAW,UAAU,SAAS,GAC9B,SAAS,OAAO,OAAO,QAAQ;AACrC,iBACE,oBAAC,UAAO,KAAI,MACT,iBAAO,IAAI,CAAC,OAAO,UAEhB;AAAA,YAAC;AAAA;AAAA,cAEC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,QAAO;AAAA,cACP,aAAa;AAAA,cACb,IAAI;AAAA,cACJ,aAAY;AAAA,cACZ,KAAK;AAAA,gBACH,MAAM;AAAA,cACR;AAAA,cACA,KAAK;AAAA,gBACH,MAAM;AAAA,cACR;AAAA;AAAA,YAZK,GAAG,SAAS,GAAG,KAAK;AAAA,UAa3B,CAEH,KAnBmB,SAoBtB;AAAA,QAEJ,CAAC;AAAA,QAED,oBAAC,UAAO,KAAI,MAAK,MAAK,UACnB,cAAI,MAAM,EAAE,EACV,KAAK,CAAC,EACN,MAAM,CAAC,EACP,IAAI,CAAC,GAAG,UAEL;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,OAAM;AAAA,YACN,KAAK;AAAA,cACH,OAAO;AAAA,YACT;AAAA,YACA,KAAK;AAAA,cACH,OAAO;AAAA,YACT;AAAA,YAGC;AAAA;AAAA,UAFI;AAAA,QAGP,CAEH,GACL;AAAA,SACF;AAAA,MAEA,oBAAC,UAAO,KAAI,MAAK,IAAG,MACjB,sBAAY,IAAI,CAAC,SAChB;AAAA,QAAC;AAAA;AAAA,UACC,OAAO;AAAA,UACP,OAAM;AAAA,UACN,QAAO;AAAA,UACP,QAAO;AAAA,UACP,KAAK;AAAA,YACH,QAAQ;AAAA,UACV;AAAA,UACA,KAAK;AAAA,YACH,QAAQ;AAAA,UACV;AAAA,UAGC;AAAA;AAAA,QAFI;AAAA,MAGP,CACD,GACH;AAAA,OACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/esm/ColorsDemo.mjs
CHANGED
|
@@ -1,26 +1,37 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { blue, blueDark, gray, grayDark, green, greenDark, red, redDark, yellow, yellowDark } from "@tamagui/colors";
|
|
2
|
+
import { H2, Paragraph, Separator, Square, XStack, YStack } from "tamagui";
|
|
2
3
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
const colorGroups = ["
|
|
4
|
+
const colorGroups = ["gray", "blue", "green", "yellow", "red"],
|
|
5
|
+
lightColors = {
|
|
6
|
+
gray,
|
|
7
|
+
blue,
|
|
8
|
+
green,
|
|
9
|
+
yellow,
|
|
10
|
+
red
|
|
11
|
+
},
|
|
12
|
+
darkColors = {
|
|
13
|
+
gray: grayDark,
|
|
14
|
+
blue: blueDark,
|
|
15
|
+
green: greenDark,
|
|
16
|
+
yellow: yellowDark,
|
|
17
|
+
red: redDark
|
|
18
|
+
};
|
|
4
19
|
function ColorsDemo() {
|
|
5
|
-
const colors = getTokens({
|
|
6
|
-
prefixed: !1
|
|
7
|
-
}).color,
|
|
8
|
-
[colorsLight, colorsDark] = [getColors(colors), getColors(colors, !0)];
|
|
9
20
|
return /* @__PURE__ */jsxs(YStack, {
|
|
10
21
|
mt: "$4",
|
|
11
22
|
gap: "$8",
|
|
12
23
|
children: [/* @__PURE__ */jsx(ColorsRow, {
|
|
13
24
|
title: "Light",
|
|
14
|
-
|
|
25
|
+
colorSets: lightColors
|
|
15
26
|
}), /* @__PURE__ */jsx(Separator, {}), /* @__PURE__ */jsx(ColorsRow, {
|
|
16
27
|
title: "Dark",
|
|
17
|
-
|
|
28
|
+
colorSets: darkColors
|
|
18
29
|
})]
|
|
19
30
|
});
|
|
20
31
|
}
|
|
21
32
|
function ColorsRow({
|
|
22
33
|
title,
|
|
23
|
-
|
|
34
|
+
colorSets
|
|
24
35
|
}) {
|
|
25
36
|
return /* @__PURE__ */jsxs(YStack, {
|
|
26
37
|
gap: "$4",
|
|
@@ -39,23 +50,27 @@ function ColorsRow({
|
|
|
39
50
|
gap: "$2"
|
|
40
51
|
},
|
|
41
52
|
self: "center",
|
|
42
|
-
children: [
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
53
|
+
children: [colorGroups.map(groupName => {
|
|
54
|
+
const colorSet = colorSets[groupName],
|
|
55
|
+
colors = Object.values(colorSet);
|
|
56
|
+
return /* @__PURE__ */jsx(XStack, {
|
|
57
|
+
gap: "$2",
|
|
58
|
+
children: colors.map((color, index) => /* @__PURE__ */jsx(Square, {
|
|
59
|
+
rounded: "$2",
|
|
60
|
+
size: "$4",
|
|
61
|
+
height: "$4",
|
|
62
|
+
borderWidth: 1,
|
|
63
|
+
bg: color,
|
|
64
|
+
borderColor: "$color7",
|
|
65
|
+
$sm: {
|
|
66
|
+
size: "$2"
|
|
67
|
+
},
|
|
68
|
+
$xs: {
|
|
69
|
+
size: "$1"
|
|
70
|
+
}
|
|
71
|
+
}, `${groupName}${index}`))
|
|
72
|
+
}, groupName);
|
|
73
|
+
}), /* @__PURE__ */jsx(XStack, {
|
|
59
74
|
gap: "$2",
|
|
60
75
|
self: "center",
|
|
61
76
|
children: new Array(13).fill(0).slice(1).map((_, index) => /* @__PURE__ */jsx(Paragraph, {
|
|
@@ -91,8 +106,5 @@ function ColorsRow({
|
|
|
91
106
|
})]
|
|
92
107
|
});
|
|
93
108
|
}
|
|
94
|
-
function getColors(colors, dark = !1) {
|
|
95
|
-
return colors ? colorGroups.map(group => Object.keys(colors).filter(color => color.startsWith(group) && (dark ? color.endsWith("Dark") : !color.endsWith("Dark"))).map(key => colors[key])) : (console.warn("\u26A0\uFE0F no colors?", colors), []);
|
|
96
|
-
}
|
|
97
109
|
export { ColorsDemo };
|
|
98
110
|
//# sourceMappingURL=ColorsDemo.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["blue","blueDark","gray","grayDark","green","greenDark","red","redDark","yellow","yellowDark","H2","Paragraph","Separator","Square","XStack","YStack","jsx","jsxs","colorGroups","lightColors","darkColors","ColorsDemo","mt","gap","children","ColorsRow","title","colorSets","$sm","size","self","map","groupName","colorSet","colors","Object","values","color","index","rounded","height","borderWidth","bg","borderColor","$xs","Array","fill","slice","_","text","width","name","theme","rotate"],"sources":["../../src/ColorsDemo.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -1,27 +1,38 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
|
|
2
|
+
import { blue, blueDark, gray, grayDark, green, greenDark, red, redDark, yellow, yellowDark } from "@tamagui/colors";
|
|
3
|
+
import { H2, Paragraph, Separator, Square, XStack, YStack } from "tamagui";
|
|
4
|
+
var colorGroups = ["gray", "blue", "green", "yellow", "red"],
|
|
5
|
+
lightColors = {
|
|
6
|
+
gray,
|
|
7
|
+
blue,
|
|
8
|
+
green,
|
|
9
|
+
yellow,
|
|
10
|
+
red
|
|
11
|
+
},
|
|
12
|
+
darkColors = {
|
|
13
|
+
gray: grayDark,
|
|
14
|
+
blue: blueDark,
|
|
15
|
+
green: greenDark,
|
|
16
|
+
yellow: yellowDark,
|
|
17
|
+
red: redDark
|
|
18
|
+
};
|
|
4
19
|
function ColorsDemo() {
|
|
5
|
-
var colors = getTokens({
|
|
6
|
-
prefixed: !1
|
|
7
|
-
}).color,
|
|
8
|
-
[colorsLight, colorsDark] = [getColors(colors), getColors(colors, !0)];
|
|
9
20
|
return /* @__PURE__ */_jsxs(YStack, {
|
|
10
21
|
mt: "$4",
|
|
11
22
|
gap: "$8",
|
|
12
23
|
children: [/* @__PURE__ */_jsx(ColorsRow, {
|
|
13
24
|
title: "Light",
|
|
14
|
-
|
|
25
|
+
colorSets: lightColors
|
|
15
26
|
}), /* @__PURE__ */_jsx(Separator, {}), /* @__PURE__ */_jsx(ColorsRow, {
|
|
16
27
|
title: "Dark",
|
|
17
|
-
|
|
28
|
+
colorSets: darkColors
|
|
18
29
|
})]
|
|
19
30
|
});
|
|
20
31
|
}
|
|
21
32
|
function ColorsRow(param) {
|
|
22
33
|
var {
|
|
23
34
|
title,
|
|
24
|
-
|
|
35
|
+
colorSets
|
|
25
36
|
} = param;
|
|
26
37
|
return /* @__PURE__ */_jsxs(YStack, {
|
|
27
38
|
gap: "$4",
|
|
@@ -40,16 +51,18 @@ function ColorsRow(param) {
|
|
|
40
51
|
gap: "$2"
|
|
41
52
|
},
|
|
42
53
|
self: "center",
|
|
43
|
-
children: [
|
|
54
|
+
children: [colorGroups.map(function (groupName) {
|
|
55
|
+
var colorSet = colorSets[groupName],
|
|
56
|
+
colors = Object.values(colorSet);
|
|
44
57
|
return /* @__PURE__ */_jsx(XStack, {
|
|
45
58
|
gap: "$2",
|
|
46
|
-
children:
|
|
59
|
+
children: colors.map(function (color, index) {
|
|
47
60
|
return /* @__PURE__ */_jsx(Square, {
|
|
48
61
|
rounded: "$2",
|
|
49
62
|
size: "$4",
|
|
50
63
|
height: "$4",
|
|
51
64
|
borderWidth: 1,
|
|
52
|
-
bg:
|
|
65
|
+
bg: color,
|
|
53
66
|
borderColor: "$color7",
|
|
54
67
|
$sm: {
|
|
55
68
|
size: "$2"
|
|
@@ -57,9 +70,9 @@ function ColorsRow(param) {
|
|
|
57
70
|
$xs: {
|
|
58
71
|
size: "$1"
|
|
59
72
|
}
|
|
60
|
-
}, `${
|
|
73
|
+
}, `${groupName}${index}`);
|
|
61
74
|
})
|
|
62
|
-
},
|
|
75
|
+
}, groupName);
|
|
63
76
|
}), /* @__PURE__ */_jsx(XStack, {
|
|
64
77
|
gap: "$2",
|
|
65
78
|
self: "center",
|
|
@@ -100,15 +113,5 @@ function ColorsRow(param) {
|
|
|
100
113
|
})]
|
|
101
114
|
});
|
|
102
115
|
}
|
|
103
|
-
function getColors(colors) {
|
|
104
|
-
var dark = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1;
|
|
105
|
-
return colors ? colorGroups.map(function (group) {
|
|
106
|
-
return Object.keys(colors).filter(function (color) {
|
|
107
|
-
return color.startsWith(group) && (dark ? color.endsWith("Dark") : !color.endsWith("Dark"));
|
|
108
|
-
}).map(function (key) {
|
|
109
|
-
return colors[key];
|
|
110
|
-
});
|
|
111
|
-
}) : (console.warn("\u26A0\uFE0F no colors?", colors), []);
|
|
112
|
-
}
|
|
113
116
|
export { ColorsDemo };
|
|
114
117
|
//# sourceMappingURL=ColorsDemo.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","blue","blueDark","gray","grayDark","green","greenDark","red","redDark","yellow","yellowDark","H2","Paragraph","Separator","Square","XStack","YStack","colorGroups","lightColors","darkColors","ColorsDemo","mt","gap","children","ColorsRow","title","colorSets","param","$sm","size","self","map","groupName","colorSet","colors","Object","values","color","index","rounded","height","borderWidth","bg","borderColor","$xs","Array","fill","slice","_","text","width"],"sources":["../../src/ColorsDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAAAA,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAAA,SACEC,IAAA,EAAAC,QAAA,EAAAC,IAAA,EAAAC,QAAA,EAAAC,KAAA,EAAAC,SAAA,EAAAC,GAAA,EAAAC,OAAA,EAAAC,MAAA,EAAAC,UAAA;AAAA,SACAC,EAAA,EAAAC,SAAA,EAAAC,SAAA,EAAAC,MAAA,EAAAC,MAAA,EAAAC,MAAA;AAAA,IACAC,WAAA,IACA,QACA,QACA,SACA,UACA;EACAC,WAAA;IACAf,IAAA;IAAAF,IAAA;IAEFI,KAAA;IAsBII,MAAA;IApBJF;EAEoB;EAClBY,UAAA;IACAhB,IAAA,EAAAC,QAAA;IACAH,IAAA,EAAAC,QAAA;IACAG,KAAA,EAAAC,SAAA;IACAG,MAAA,EAAAC,UAAA;IACFH,GAEM,EAAAC;EAAa;AACX,SACAY,WAAA;EACN,OAAO,eAAApB,KAAA,CAAAgB,MAAA;IACPK,EAAA,MAAQ;IACRC,GAAK;IACPC,QAAA,GAEO,eAAsBzB,IAAA,CAAA0B,SAAA;MAC3BC,KACE;MACEC,SAAA,EAAAR;IACA,IACA,eAAApB,IAAC,CAAAe,SAAA,EAAU,KACb,eAAAf,IAAA,CAAA0B,SAAA;MAEJC,KAAA;MAIAC,SAAS,EAAUP;IACjB;EAEF,CAGG;AACD;AAEI,SAAAK,UAAAG,KAAC;EAAoB,IAErB;IAAAF,KAAA;IAAAC;EAAC,IAAAC,KAAA;EACC,sBAAA3B,KAAC,CAAAgB,MAAO;IACLM,GAAA;IACCM,GAAA;MAEAN,GAAA;IAIQ;IAACC,QAAA,kBAECzB,IAAQ,CAAAa,EAAA;MAAAkB,IAAA,EACR;MAAKN,QACL,EAAAE;IAAO,IACM,eACTzB,KAAA,CAAAe,MAAA;MAAAO,GAAA,MACJ;MAAYQ,IAAA,EACZ,QAAK;MAAAP,QACH,GAAM,eACRvB,KAAA,CAAAgB,MAAA;QAAAM,GACA,MAAK;QAAAM,GAAA,EACH;UACFN,GAAA;QAAA;QAZKQ,IAAG,UAAS;QAetBP,QAnBmB,GAsBzBN,WAAA,CAAAc,GAAA,WAAAC,SAAA;UAED,IAAAC,QAAC,GAAAP,SAAO,CAAAM,SAAS;YAAAE,MAAK,GAAAC,MACnB,CAAAC,MAAA,CAAAH,QAAI,CAAM;UAKJ,sBAAAnC,IAAA,CAAAiB,MAAA;YAAAO,GAAA;YACCC,QAAM,EAAAW,MAAA,CAAAH,GAAA,WAAAM,KAAA,EAAAC,KAAA;cACD,sBAAAxC,IAAA,CAAAgB,MAAA;gBACCyB,OAAA;gBACDV,IAAA;gBACIW,MAAA;gBACTC,WAAA;gBACKC,EAAA,EAAAL,KAAA;gBACIM,WAAA;gBACTf,GAAA;kBAGCC,IAAA;gBAAA;gBAFIe,GAAA;kBAMff,IAAA;gBACF;cAEA,MAACG,SAAA,GAAOM,KAAI;YAEP;UAAA,GAAAN,SAAA;QACC,IACA,eAAMlC,IAAA,CAAAiB,MAAA;UACNO,GAAO;UACPQ,IAAO;UACFP,QAAA,MAAAsB,KAAA,KAAAC,IAAA,IAAAC,KAAA,IAAAhB,GAAA,WAAAiB,CAAA,EAAAV,KAAA;YACH,OAAQ,eAAAxC,IAAA,CAAAc,SAAA;cACVyB,KAAA;cACKY,IAAA;cACKC,KAAA;cACVtB,GAAA;gBAGCsB,KAAA;cAAA;cAFIN,GAAA;gBAKXM,KAAA;cACF;cACF3B,QAAA,EAAAe;YAEJ,GAAAA,KAAA","ignoreList":[]}
|
|
@@ -8,7 +8,7 @@ function ContextMenuDemo() {
|
|
|
8
8
|
console.info("onSelect");
|
|
9
9
|
};
|
|
10
10
|
return /* @__PURE__ */ jsxs(ContextMenu, { allowFlip: !0, native, placement: "bottom-start", offset: 14, children: [
|
|
11
|
-
/* @__PURE__ */ jsx(ContextMenu.Trigger, { asChild: !0, children: /* @__PURE__ */ jsx(Text, { text: "center", select: null, children: "Right Click or
|
|
11
|
+
/* @__PURE__ */ jsx(ContextMenu.Trigger, { asChild: !0, children: /* @__PURE__ */ jsx(Text, { text: "center", select: null, children: "Right Click or Long Press" }) }),
|
|
12
12
|
/* @__PURE__ */ jsx(ContextMenu.Portal, { zIndex: 100, children: /* @__PURE__ */ jsxs(
|
|
13
13
|
ContextMenu.Content,
|
|
14
14
|
{
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ContextMenuDemo.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,UAAU,OAAO,oBAAoB;AAC9C,OAAO,WAAW;AAClB,SAAS,MAAM,cAAc;AAiBrB,cAoDE,YApDF;AAXD,SAAS,kBAAkB;AAChC,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,MAAM,SAAS,EAAI,GAC7D,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,EAAI,GAEzC,WAAW,MAAM;AACrB,YAAQ,KAAK,UAAU;AAAA,EACzB;AAEA,SACE,qBAAC,eAAY,WAAS,IAAC,QAAgB,WAAU,gBAAe,QAAQ,IACtE;AAAA,wBAAC,YAAY,SAAZ,EAAoB,SAAO,IAC1B,8BAAC,QAAK,MAAK,UAAS,QAAQ,MAAM,
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|