@tamagui/demos 1.122.8 → 1.123.1

package/dist/cjs/ToggleGroupDemo.cjs

@@ -26,6 +26,13 @@ module.exports = __toCommonJS(ToggleGroupDemo_exports);
 var import_lucide_icons = require("@tamagui/lucide-icons"),
   import_tamagui = require("tamagui"),
   import_jsx_runtime = require("react/jsx-runtime");
+const Item = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
     paddingHorizontal: "$4",
@@ -79,15 +86,15 @@ function ToggleGroupComponent(props) {
       type: props.type,
       size: props.size,
       disableDeactivation: props.type === "single" ? !0 : void 0,
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(Item, {
         value: "left",
         "aria-label": "Left aligned",
         children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {})
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Item, {
         value: "center",
         "aria-label": "Center aligned",
         children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {})
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Item, {
         value: "right",
         "aria-label": "Right aligned",
         children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {})

package/dist/cjs/ToggleGroupDemo.js

@@ -18,6 +18,13 @@ __export(ToggleGroupDemo_exports, {
 });
 module.exports = __toCommonJS(ToggleGroupDemo_exports);
 var import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
+const Item = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { paddingHorizontal: "$4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { alignItems: "center", space: "$10", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { alignItems: "center", space: "$6", children: [
@@ -50,9 +57,9 @@ function ToggleGroupComponent(props) {
             size: props.size,
             disableDeactivation: props.type === "single" ? !0 : void 0,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, { value: "left", "aria-label": "Left aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, { value: "center", "aria-label": "Center aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, { value: "right", "aria-label": "Right aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {}) })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, { value: "left", "aria-label": "Left aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, { value: "center", "aria-label": "Center aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, { value: "right", "aria-label": "Right aligned", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {}) })
             ]
           }
         )

package/dist/cjs/ToggleGroupDemo.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/ToggleGroupDemo.tsx"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAmD,kCAEnD,iBAAmD,oBAM3C;AAJD,SAAS,kBAAkB;AAChC,SACE,4CAAC,yBAAO,mBAAkB,MACxB,uDAAC,yBAAO,YAAW,UAAS,OAAM,OAChC;AAAA,iDAAC,yBAAO,YAAW,UAAS,OAAM,MAChC;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,YAAW,UAAS,OAAM,MAChC;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,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,OAAM;AAAA,MAEN;AAAA,oDAAC,wBAAM,cAAa,MAAK,gBAAe,YAAW,MAAM,MAAM,MAAM,SAAS,IAC3E,gBAAM,SAAS,WAAW,WAAW,YACxC;AAAA,QAGA;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,YAEtD;AAAA,0DAAC,2BAAY,MAAZ,EAAiB,OAAM,QAAO,cAAW,gBACxC,sDAAC,iCAAU,GACb;AAAA,cACA,4CAAC,2BAAY,MAAZ,EAAiB,OAAM,UAAS,cAAW,kBAC1C,sDAAC,mCAAY,GACf;AAAA,cACA,4CAAC,2BAAY,MAAZ,EAAiB,OAAM,SAAQ,cAAW,iBACzC,sDAAC,kCAAW,GACd;AAAA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAmD,kCAEnD,iBAA2D,oBAenD;AAbR,MAAM,WAAO,uBAAO,2BAAY,MAAM;AAAA,EACpC,OAAO;AAAA,EAEP,YAAY;AAAA,IACV,OAAO;AAAA,IACP,iBAAiB;AAAA,EACnB;AACF,CAAC;AAEM,SAAS,kBAAkB;AAChC,SACE,4CAAC,yBAAO,mBAAkB,MACxB,uDAAC,yBAAO,YAAW,UAAS,OAAM,OAChC;AAAA,iDAAC,yBAAO,YAAW,UAAS,OAAM,MAChC;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,YAAW,UAAS,OAAM,MAChC;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,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,OAAM;AAAA,MAEN;AAAA,oDAAC,wBAAM,cAAa,MAAK,gBAAe,YAAW,MAAM,MAAM,MAAM,SAAS,IAC3E,gBAAM,SAAS,WAAW,WAAW,YACxC;AAAA,QAGA;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,YAEtD;AAAA,0DAAC,QAAK,OAAM,QAAO,cAAW,gBAC5B,sDAAC,iCAAU,GACb;AAAA,cACA,4CAAC,QAAK,OAAM,UAAS,cAAW,kBAC9B,sDAAC,mCAAY,GACf;AAAA,cACA,4CAAC,QAAK,OAAM,SAAQ,cAAW,iBAC7B,sDAAC,kCAAW,GACd;AAAA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/cjs/ToggleGroupDemo.native.js

@@ -18,7 +18,13 @@ __export(ToggleGroupDemo_exports, {
   ToggleGroupDemo: () => ToggleGroupDemo
 });
 module.exports = __toCommonJS(ToggleGroupDemo_exports);
-var import_jsx_runtime = require("react/jsx-runtime"), import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui");
+var import_jsx_runtime = require("react/jsx-runtime"), import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), Item = (0, import_tamagui.styled)(import_tamagui.ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
     paddingHorizontal: "$4",
@@ -86,17 +92,17 @@ function ToggleGroupComponent(props) {
         size: props.size,
         disableDeactivation: props.type === "single" ? !0 : void 0,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, {
             value: "left",
             "aria-label": "Left aligned",
             children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignLeft, {})
           }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, {
             value: "center",
             "aria-label": "Center aligned",
             children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignCenter, {})
           }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.ToggleGroup.Item, {
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Item, {
             value: "right",
             "aria-label": "Right aligned",
             children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.AlignRight, {})

package/dist/cjs/ToggleGroupDemo.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/demos/src/ToggleGroupDemo.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;uDAAA,sBAAmD,kCAEnD,iBAAmD;AAE5C,SAASA,kBAAAA;AACd,SACE,uCAAAC,KAACC,uBAAAA;IAAOC,mBAAkB;cACxB,uCAAAC,MAACC,uBAAAA;MAAOC,YAAW;MAASC,OAAM;;QAChC,uCAAAH,MAACF,uBAAAA;UAAOI,YAAW;UAASC,OAAM;;YAChC,uCAAAN,KAACO,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,uCAAAV,KAACO,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;QAE9D,uCAAAP,MAACC,uBAAAA;UAAOC,YAAW;UAASC,OAAM;;YAChC,uCAAAN,KAACO,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,uCAAAV,KAACO,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;;;;AAKtE;AAEA,SAASH,qBAAqBI,OAI7B;AACC,MAAMC,KAAK,UAAUD,MAAMF,KAAKI,SAAQ,EAAGC,MAAM,CAAA,CAAA,IAAMH,MAAMH,IAAI;AACjE,SACE,uCAAAL,MAACC,uBAAAA;IACCW,eAAeJ,MAAMD,gBAAgB,eAAe,QAAQ;IAC5DL,YAAW;IACXW,gBAAe;IACfV,OAAM;;MAEN,uCAAAN,KAACiB,sBAAAA;QAAMC,cAAa;QAAKF,gBAAe;QAAWP,MAAME,MAAMF;QAAMU,SAASP;kBAC3ED,MAAMH,SAAS,WAAW,WAAW;;;MAIxC,uCAAAL,MAACiB,4BAAAA;QACCV,aAAaC,MAAMD;QACnBE;QACAJ,MAAMG,MAAMH;;QACZC,MAAME,MAAMF;QACZY,qBAAqBV,MAAMH,SAAS,WAAW,KAAOc;;UAEtD,uCAAAtB,KAACoB,2BAAYG,MAAI;YAACC,OAAM;YAAOC,cAAW;sBACxC,uCAAAzB,KAAC0B,+BAAAA,CAAAA,CAAAA;;UAEH,uCAAA1B,KAACoB,2BAAYG,MAAI;YAACC,OAAM;YAASC,cAAW;sBAC1C,uCAAAzB,KAAC2B,iCAAAA,CAAAA,CAAAA;;UAEH,uCAAA3B,KAACoB,2BAAYG,MAAI;YAACC,OAAM;YAAQC,cAAW;sBACzC,uCAAAzB,KAAC4B,gCAAAA,CAAAA,CAAAA;;;;;;AAKX;",
-  "names": ["ToggleGroupDemo", "_jsx", "YStack", "paddingHorizontal", "_jsxs", "XStack", "alignItems", "space", "ToggleGroupComponent", "type", "size", "orientation", "props", "id", "toString", "slice", "flexDirection", "justifyContent", "Label", "paddingRight", "htmlFor", "ToggleGroup", "disableDeactivation", "undefined", "Item", "value", "aria-label", "AlignLeft", "AlignCenter", "AlignRight"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;uDAAA,sBAAmD,kCAEnD,iBAA2D,oBAErDA,WAAOC,uBAAOC,2BAAYF,MAAM;EACpCG,OAAO;EAEPC,YAAY;IACVD,OAAO;IACPE,iBAAiB;EACnB;AACF,CAAA;AAEO,SAASC,kBAAAA;AACd,SACE,uCAAAC,KAACC,uBAAAA;IAAOC,mBAAkB;cACxB,uCAAAC,MAACC,uBAAAA;MAAOC,YAAW;MAASC,OAAM;;QAChC,uCAAAH,MAACF,uBAAAA;UAAOI,YAAW;UAASC,OAAM;;YAChC,uCAAAN,KAACO,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,uCAAAV,KAACO,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;QAE9D,uCAAAP,MAACC,uBAAAA;UAAOC,YAAW;UAASC,OAAM;;YAChC,uCAAAN,KAACO,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,uCAAAV,KAACO,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;;;;AAKtE;AAEA,SAASH,qBAAqBI,OAI7B;AACC,MAAMC,KAAK,UAAUD,MAAMF,KAAKI,SAAQ,EAAGC,MAAM,CAAA,CAAA,IAAMH,MAAMH,IAAI;AACjE,SACE,uCAAAL,MAACC,uBAAAA;IACCW,eAAeJ,MAAMD,gBAAgB,eAAe,QAAQ;IAC5DL,YAAW;IACXW,gBAAe;IACfV,OAAM;;MAEN,uCAAAN,KAACiB,sBAAAA;QAAMC,cAAa;QAAKF,gBAAe;QAAWP,MAAME,MAAMF;QAAMU,SAASP;kBAC3ED,MAAMH,SAAS,WAAW,WAAW;;;MAIxC,uCAAAL,MAACR,4BAAAA;QACCe,aAAaC,MAAMD;QACnBE;QACAJ,MAAMG,MAAMH;;QACZC,MAAME,MAAMF;QACZW,qBAAqBT,MAAMH,SAAS,WAAW,KAAOa;;UAEtD,uCAAArB,KAACP,MAAAA;YAAK6B,OAAM;YAAOC,cAAW;sBAC5B,uCAAAvB,KAACwB,+BAAAA,CAAAA,CAAAA;;UAEH,uCAAAxB,KAACP,MAAAA;YAAK6B,OAAM;YAASC,cAAW;sBAC9B,uCAAAvB,KAACyB,iCAAAA,CAAAA,CAAAA;;UAEH,uCAAAzB,KAACP,MAAAA;YAAK6B,OAAM;YAAQC,cAAW;sBAC7B,uCAAAvB,KAAC0B,gCAAAA,CAAAA,CAAAA;;;;;;AAKX;",
+  "names": ["Item", "styled", "ToggleGroup", "color", "focusStyle", "backgroundColor", "ToggleGroupDemo", "_jsx", "YStack", "paddingHorizontal", "_jsxs", "XStack", "alignItems", "space", "ToggleGroupComponent", "type", "size", "orientation", "props", "id", "toString", "slice", "flexDirection", "justifyContent", "Label", "paddingRight", "htmlFor", "disableDeactivation", "undefined", "value", "aria-label", "AlignLeft", "AlignCenter", "AlignRight"]
 }

package/dist/esm/ToggleGroupDemo.js

@@ -1,6 +1,13 @@
 import { AlignCenter, AlignLeft, AlignRight } from "@tamagui/lucide-icons";
-import { Label, ToggleGroup, XStack, YStack } from "tamagui";
+import { Label, styled, ToggleGroup, XStack, YStack } from "tamagui";
 import { jsx, jsxs } from "react/jsx-runtime";
+const Item = styled(ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */ jsx(YStack, { paddingHorizontal: "$4", children: /* @__PURE__ */ jsxs(XStack, { alignItems: "center", space: "$10", children: [
     /* @__PURE__ */ jsxs(YStack, { alignItems: "center", space: "$6", children: [
@@ -33,9 +40,9 @@ function ToggleGroupComponent(props) {
             size: props.size,
             disableDeactivation: props.type === "single" ? !0 : void 0,
             children: [
-              /* @__PURE__ */ jsx(ToggleGroup.Item, { value: "left", "aria-label": "Left aligned", children: /* @__PURE__ */ jsx(AlignLeft, {}) }),
-              /* @__PURE__ */ jsx(ToggleGroup.Item, { value: "center", "aria-label": "Center aligned", children: /* @__PURE__ */ jsx(AlignCenter, {}) }),
-              /* @__PURE__ */ jsx(ToggleGroup.Item, { value: "right", "aria-label": "Right aligned", children: /* @__PURE__ */ jsx(AlignRight, {}) })
+              /* @__PURE__ */ jsx(Item, { value: "left", "aria-label": "Left aligned", children: /* @__PURE__ */ jsx(AlignLeft, {}) }),
+              /* @__PURE__ */ jsx(Item, { value: "center", "aria-label": "Center aligned", children: /* @__PURE__ */ jsx(AlignCenter, {}) }),
+              /* @__PURE__ */ jsx(Item, { value: "right", "aria-label": "Right aligned", children: /* @__PURE__ */ jsx(AlignRight, {}) })
             ]
           }
         )

package/dist/esm/ToggleGroupDemo.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/ToggleGroupDemo.tsx"],
-  "mappings": "AAAA,SAAS,aAAa,WAAW,kBAAkB;AAEnD,SAAS,OAAO,aAAa,QAAQ,cAAc;AAM3C,SACE,KADF;AAJD,SAAS,kBAAkB;AAChC,SACE,oBAAC,UAAO,mBAAkB,MACxB,+BAAC,UAAO,YAAW,UAAS,OAAM,OAChC;AAAA,yBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,0BAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,cAAa;AAAA,MACvE,oBAAC,wBAAqB,MAAK,YAAW,MAAK,MAAK,aAAY,cAAa;AAAA,OAC3E;AAAA,IACA,qBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,0BAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,YAAW;AAAA,MACrE,oBAAC,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,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,OAAM;AAAA,MAEN;AAAA,4BAAC,SAAM,cAAa,MAAK,gBAAe,YAAW,MAAM,MAAM,MAAM,SAAS,IAC3E,gBAAM,SAAS,WAAW,WAAW,YACxC;AAAA,QAGA;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,YAEtD;AAAA,kCAAC,YAAY,MAAZ,EAAiB,OAAM,QAAO,cAAW,gBACxC,8BAAC,aAAU,GACb;AAAA,cACA,oBAAC,YAAY,MAAZ,EAAiB,OAAM,UAAS,cAAW,kBAC1C,8BAAC,eAAY,GACf;AAAA,cACA,oBAAC,YAAY,MAAZ,EAAiB,OAAM,SAAQ,cAAW,iBACzC,8BAAC,cAAW,GACd;AAAA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "mappings": "AAAA,SAAS,aAAa,WAAW,kBAAkB;AAEnD,SAAS,OAAO,QAAQ,aAAa,QAAQ,cAAc;AAenD,SACE,KADF;AAbR,MAAM,OAAO,OAAO,YAAY,MAAM;AAAA,EACpC,OAAO;AAAA,EAEP,YAAY;AAAA,IACV,OAAO;AAAA,IACP,iBAAiB;AAAA,EACnB;AACF,CAAC;AAEM,SAAS,kBAAkB;AAChC,SACE,oBAAC,UAAO,mBAAkB,MACxB,+BAAC,UAAO,YAAW,UAAS,OAAM,OAChC;AAAA,yBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,0BAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,cAAa;AAAA,MACvE,oBAAC,wBAAqB,MAAK,YAAW,MAAK,MAAK,aAAY,cAAa;AAAA,OAC3E;AAAA,IACA,qBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,0BAAC,wBAAqB,MAAK,UAAS,MAAK,MAAK,aAAY,YAAW;AAAA,MACrE,oBAAC,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,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,OAAM;AAAA,MAEN;AAAA,4BAAC,SAAM,cAAa,MAAK,gBAAe,YAAW,MAAM,MAAM,MAAM,SAAS,IAC3E,gBAAM,SAAS,WAAW,WAAW,YACxC;AAAA,QAGA;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,YAEtD;AAAA,kCAAC,QAAK,OAAM,QAAO,cAAW,gBAC5B,8BAAC,aAAU,GACb;AAAA,cACA,oBAAC,QAAK,OAAM,UAAS,cAAW,kBAC9B,8BAAC,eAAY,GACf;AAAA,cACA,oBAAC,QAAK,OAAM,SAAQ,cAAW,iBAC7B,8BAAC,cAAW,GACd;AAAA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/ToggleGroupDemo.mjs

@@ -1,6 +1,13 @@
 import { AlignCenter, AlignLeft, AlignRight } from "@tamagui/lucide-icons";
-import { Label, ToggleGroup, XStack, YStack } from "tamagui";
+import { Label, styled, ToggleGroup, XStack, YStack } from "tamagui";
 import { jsx, jsxs } from "react/jsx-runtime";
+const Item = styled(ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */jsx(YStack, {
     paddingHorizontal: "$4",
@@ -54,15 +61,15 @@ function ToggleGroupComponent(props) {
       type: props.type,
       size: props.size,
       disableDeactivation: props.type === "single" ? !0 : void 0,
-      children: [/* @__PURE__ */jsx(ToggleGroup.Item, {
+      children: [/* @__PURE__ */jsx(Item, {
         value: "left",
         "aria-label": "Left aligned",
         children: /* @__PURE__ */jsx(AlignLeft, {})
-      }), /* @__PURE__ */jsx(ToggleGroup.Item, {
+      }), /* @__PURE__ */jsx(Item, {
         value: "center",
         "aria-label": "Center aligned",
         children: /* @__PURE__ */jsx(AlignCenter, {})
-      }), /* @__PURE__ */jsx(ToggleGroup.Item, {
+      }), /* @__PURE__ */jsx(Item, {
         value: "right",
         "aria-label": "Right aligned",
         children: /* @__PURE__ */jsx(AlignRight, {})

package/dist/esm/ToggleGroupDemo.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["AlignCenter","AlignLeft","AlignRight","Label","ToggleGroup","XStack","YStack","jsx","jsxs","ToggleGroupDemo","paddingHorizontal","children","alignItems","space","ToggleGroupComponent","type","size","orientation","props","id","toString","slice","flexDirection","justifyContent","paddingRight","htmlFor","disableDeactivation","Item","value"],"sources":["../../src/ToggleGroupDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,WAAA,EAAaC,SAAA,EAAWC,UAAA,QAAkB;AAEnD,SAASC,KAAA,EAAOC,WAAA,EAAaC,MAAA,EAAQC,MAAA,QAAc;AAM3C,SACEC,GAAA,EADFC,IAAA;AAJD,SAASC,gBAAA,EAAkB;EAChC,OACE,eAAAF,GAAA,CAACD,MAAA;IAAOI,iBAAA,EAAkB;IACxBC,QAAA,iBAAAH,IAAA,CAACH,MAAA;MAAOO,UAAA,EAAW;MAASC,KAAA,EAAM;MAChCF,QAAA,kBAAAH,IAAA,CAACF,MAAA;QAAOM,UAAA,EAAW;QAASC,KAAA,EAAM;QAChCF,QAAA,kBAAAJ,GAAA,CAACO,oBAAA;UAAqBC,IAAA,EAAK;UAASC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAa,GACvE,eAAAV,GAAA,CAACO,oBAAA;UAAqBC,IAAA,EAAK;UAAWC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAa;MAAA,CAC3E,GACA,eAAAT,IAAA,CAACH,MAAA;QAAOO,UAAA,EAAW;QAASC,KAAA,EAAM;QAChCF,QAAA,kBAAAJ,GAAA,CAACO,oBAAA;UAAqBC,IAAA,EAAK;UAASC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAW,GACrE,eAAAV,GAAA,CAACO,oBAAA;UAAqBC,IAAA,EAAK;UAAWC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAW;MAAA,CACzE;IAAA,CACF;EAAA,CACF;AAEJ;AAEA,SAASH,qBAAqBI,KAAA,EAI3B;EACD,MAAMC,EAAA,GAAK,UAAUD,KAAA,CAAMF,IAAA,CAAKI,QAAA,CAAS,EAAEC,KAAA,CAAM,CAAC,CAAC,IAAIH,KAAA,CAAMH,IAAI;EACjE,OACE,eAAAP,IAAA,CAACH,MAAA;IACCiB,aAAA,EAAeJ,KAAA,CAAMD,WAAA,KAAgB,eAAe,QAAQ;IAC5DL,UAAA,EAAW;IACXW,cAAA,EAAe;IACfV,KAAA,EAAM;IAENF,QAAA,kBAAAJ,GAAA,CAACJ,KAAA;MAAMqB,YAAA,EAAa;MAAKD,cAAA,EAAe;MAAWP,IAAA,EAAME,KAAA,CAAMF,IAAA;MAAMS,OAAA,EAASN,EAAA;MAC3ER,QAAA,EAAAO,KAAA,CAAMH,IAAA,KAAS,WAAW,WAAW;IAAA,CACxC,GAGA,eAAAP,IAAA,CAACJ,WAAA;MACCa,WAAA,EAAaC,KAAA,CAAMD,WAAA;MACnBE,EAAA;MACAJ,IAAA,EAAMG,KAAA,CAAMH,IAAA;MACZC,IAAA,EAAME,KAAA,CAAMF,IAAA;MACZU,mBAAA,EAAqBR,KAAA,CAAMH,IAAA,KAAS,WAAW,KAAO;MAEtDJ,QAAA,kBAAAJ,GAAA,CAACH,WAAA,CAAYuB,IAAA,EAAZ;QAAiBC,KAAA,EAAM;QAAO,cAAW;QACxCjB,QAAA,iBAAAJ,GAAA,CAACN,SAAA,IAAU;MAAA,CACb,GACA,eAAAM,GAAA,CAACH,WAAA,CAAYuB,IAAA,EAAZ;QAAiBC,KAAA,EAAM;QAAS,cAAW;QAC1CjB,QAAA,iBAAAJ,GAAA,CAACP,WAAA,IAAY;MAAA,CACf,GACA,eAAAO,GAAA,CAACH,WAAA,CAAYuB,IAAA,EAAZ;QAAiBC,KAAA,EAAM;QAAQ,cAAW;QACzCjB,QAAA,iBAAAJ,GAAA,CAACL,UAAA,IAAW;MAAA,CACd;IAAA,CACF;EAAA,CACF;AAEJ","ignoreList":[]}
+{"version":3,"names":["AlignCenter","AlignLeft","AlignRight","Label","styled","ToggleGroup","XStack","YStack","jsx","jsxs","Item","color","focusStyle","backgroundColor","ToggleGroupDemo","paddingHorizontal","children","alignItems","space","ToggleGroupComponent","type","size","orientation","props","id","toString","slice","flexDirection","justifyContent","paddingRight","htmlFor","disableDeactivation","value"],"sources":["../../src/ToggleGroupDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,WAAA,EAAaC,SAAA,EAAWC,UAAA,QAAkB;AAEnD,SAASC,KAAA,EAAOC,MAAA,EAAQC,WAAA,EAAaC,MAAA,EAAQC,MAAA,QAAc;AAenD,SACEC,GAAA,EADFC,IAAA;AAbR,MAAMC,IAAA,GAAON,MAAA,CAAOC,WAAA,CAAYK,IAAA,EAAM;EACpCC,KAAA,EAAO;EAEPC,UAAA,EAAY;IACVD,KAAA,EAAO;IACPE,eAAA,EAAiB;EACnB;AACF,CAAC;AAEM,SAASC,gBAAA,EAAkB;EAChC,OACE,eAAAN,GAAA,CAACD,MAAA;IAAOQ,iBAAA,EAAkB;IACxBC,QAAA,iBAAAP,IAAA,CAACH,MAAA;MAAOW,UAAA,EAAW;MAASC,KAAA,EAAM;MAChCF,QAAA,kBAAAP,IAAA,CAACF,MAAA;QAAOU,UAAA,EAAW;QAASC,KAAA,EAAM;QAChCF,QAAA,kBAAAR,GAAA,CAACW,oBAAA;UAAqBC,IAAA,EAAK;UAASC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAa,GACvE,eAAAd,GAAA,CAACW,oBAAA;UAAqBC,IAAA,EAAK;UAAWC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAa;MAAA,CAC3E,GACA,eAAAb,IAAA,CAACH,MAAA;QAAOW,UAAA,EAAW;QAASC,KAAA,EAAM;QAChCF,QAAA,kBAAAR,GAAA,CAACW,oBAAA;UAAqBC,IAAA,EAAK;UAASC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAW,GACrE,eAAAd,GAAA,CAACW,oBAAA;UAAqBC,IAAA,EAAK;UAAWC,IAAA,EAAK;UAAKC,WAAA,EAAY;QAAA,CAAW;MAAA,CACzE;IAAA,CACF;EAAA,CACF;AAEJ;AAEA,SAASH,qBAAqBI,KAAA,EAI3B;EACD,MAAMC,EAAA,GAAK,UAAUD,KAAA,CAAMF,IAAA,CAAKI,QAAA,CAAS,EAAEC,KAAA,CAAM,CAAC,CAAC,IAAIH,KAAA,CAAMH,IAAI;EACjE,OACE,eAAAX,IAAA,CAACH,MAAA;IACCqB,aAAA,EAAeJ,KAAA,CAAMD,WAAA,KAAgB,eAAe,QAAQ;IAC5DL,UAAA,EAAW;IACXW,cAAA,EAAe;IACfV,KAAA,EAAM;IAENF,QAAA,kBAAAR,GAAA,CAACL,KAAA;MAAM0B,YAAA,EAAa;MAAKD,cAAA,EAAe;MAAWP,IAAA,EAAME,KAAA,CAAMF,IAAA;MAAMS,OAAA,EAASN,EAAA;MAC3ER,QAAA,EAAAO,KAAA,CAAMH,IAAA,KAAS,WAAW,WAAW;IAAA,CACxC,GAGA,eAAAX,IAAA,CAACJ,WAAA;MACCiB,WAAA,EAAaC,KAAA,CAAMD,WAAA;MACnBE,EAAA;MACAJ,IAAA,EAAMG,KAAA,CAAMH,IAAA;MACZC,IAAA,EAAME,KAAA,CAAMF,IAAA;MACZU,mBAAA,EAAqBR,KAAA,CAAMH,IAAA,KAAS,WAAW,KAAO;MAEtDJ,QAAA,kBAAAR,GAAA,CAACE,IAAA;QAAKsB,KAAA,EAAM;QAAO,cAAW;QAC5BhB,QAAA,iBAAAR,GAAA,CAACP,SAAA,IAAU;MAAA,CACb,GACA,eAAAO,GAAA,CAACE,IAAA;QAAKsB,KAAA,EAAM;QAAS,cAAW;QAC9BhB,QAAA,iBAAAR,GAAA,CAACR,WAAA,IAAY;MAAA,CACf,GACA,eAAAQ,GAAA,CAACE,IAAA;QAAKsB,KAAA,EAAM;QAAQ,cAAW;QAC7BhB,QAAA,iBAAAR,GAAA,CAACN,UAAA,IAAW;MAAA,CACd;IAAA,CACF;EAAA,CACF;AAEJ","ignoreList":[]}

package/dist/esm/ToggleGroupDemo.native.js

@@ -1,6 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AlignCenter, AlignLeft, AlignRight } from "@tamagui/lucide-icons";
-import { Label, ToggleGroup, XStack, YStack } from "tamagui";
+import { Label, styled, ToggleGroup, XStack, YStack } from "tamagui";
+var Item = styled(ToggleGroup.Item, {
+  color: "$color10",
+  focusStyle: {
+    color: "$color1",
+    backgroundColor: "$color12"
+  }
+});
 function ToggleGroupDemo() {
   return /* @__PURE__ */ _jsx(YStack, {
     paddingHorizontal: "$4",
@@ -68,17 +75,17 @@ function ToggleGroupComponent(props) {
         size: props.size,
         disableDeactivation: props.type === "single" ? !0 : void 0,
         children: [
-          /* @__PURE__ */ _jsx(ToggleGroup.Item, {
+          /* @__PURE__ */ _jsx(Item, {
             value: "left",
             "aria-label": "Left aligned",
             children: /* @__PURE__ */ _jsx(AlignLeft, {})
           }),
-          /* @__PURE__ */ _jsx(ToggleGroup.Item, {
+          /* @__PURE__ */ _jsx(Item, {
             value: "center",
             "aria-label": "Center aligned",
             children: /* @__PURE__ */ _jsx(AlignCenter, {})
           }),
-          /* @__PURE__ */ _jsx(ToggleGroup.Item, {
+          /* @__PURE__ */ _jsx(Item, {
             value: "right",
             "aria-label": "Right aligned",
             children: /* @__PURE__ */ _jsx(AlignRight, {})

package/dist/esm/ToggleGroupDemo.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/demos/src/ToggleGroupDemo.tsx"],
-  "mappings": ";AAAA,SAASA,aAAaC,WAAWC,kBAAkB;AAEnD,SAASC,OAAOC,aAAaC,QAAQC,cAAc;AAE5C,SAASC,kBAAAA;AACd,SACE,qBAACD,QAAAA;IAAOE,mBAAkB;cACxB,sBAACH,QAAAA;MAAOI,YAAW;MAASC,OAAM;;QAChC,sBAACJ,QAAAA;UAAOG,YAAW;UAASC,OAAM;;YAChC,qBAACC,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,qBAACH,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;QAE9D,sBAACT,QAAAA;UAAOI,YAAW;UAASC,OAAM;;YAChC,qBAACC,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,qBAACH,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;;;;AAKtE;AAEA,SAASH,qBAAqBI,OAI7B;AACC,MAAMC,KAAK,UAAUD,MAAMF,KAAKI,SAAQ,EAAGC,MAAM,CAAA,CAAA,IAAMH,MAAMH,IAAI;AACjE,SACE,sBAACP,QAAAA;IACCc,eAAeJ,MAAMD,gBAAgB,eAAe,QAAQ;IAC5DL,YAAW;IACXW,gBAAe;IACfV,OAAM;;MAEN,qBAACP,OAAAA;QAAMkB,cAAa;QAAKD,gBAAe;QAAWP,MAAME,MAAMF;QAAMS,SAASN;kBAC3ED,MAAMH,SAAS,WAAW,WAAW;;;MAIxC,sBAACR,aAAAA;QACCU,aAAaC,MAAMD;QACnBE;QACAJ,MAAMG,MAAMH;;QACZC,MAAME,MAAMF;QACZU,qBAAqBR,MAAMH,SAAS,WAAW,KAAOY;;UAEtD,qBAACpB,YAAYqB,MAAI;YAACC,OAAM;YAAOC,cAAW;sBACxC,qBAAC1B,WAAAA,CAAAA,CAAAA;;UAEH,qBAACG,YAAYqB,MAAI;YAACC,OAAM;YAASC,cAAW;sBAC1C,qBAAC3B,aAAAA,CAAAA,CAAAA;;UAEH,qBAACI,YAAYqB,MAAI;YAACC,OAAM;YAAQC,cAAW;sBACzC,qBAACzB,YAAAA,CAAAA,CAAAA;;;;;;AAKX;",
-  "names": ["AlignCenter", "AlignLeft", "AlignRight", "Label", "ToggleGroup", "XStack", "YStack", "ToggleGroupDemo", "paddingHorizontal", "alignItems", "space", "ToggleGroupComponent", "type", "size", "orientation", "props", "id", "toString", "slice", "flexDirection", "justifyContent", "paddingRight", "htmlFor", "disableDeactivation", "undefined", "Item", "value", "aria-label"]
+  "mappings": ";AAAA,SAASA,aAAaC,WAAWC,kBAAkB;AAEnD,SAASC,OAAOC,QAAQC,aAAaC,QAAQC,cAAc;AAE3D,IAAMC,OAAOJ,OAAOC,YAAYG,MAAM;EACpCC,OAAO;EAEPC,YAAY;IACVD,OAAO;IACPE,iBAAiB;EACnB;AACF,CAAA;AAEO,SAASC,kBAAAA;AACd,SACE,qBAACL,QAAAA;IAAOM,mBAAkB;cACxB,sBAACP,QAAAA;MAAOQ,YAAW;MAASC,OAAM;;QAChC,sBAACR,QAAAA;UAAOO,YAAW;UAASC,OAAM;;YAChC,qBAACC,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,qBAACH,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;QAE9D,sBAACb,QAAAA;UAAOQ,YAAW;UAASC,OAAM;;YAChC,qBAACC,sBAAAA;cAAqBC,MAAK;cAASC,MAAK;cAAKC,aAAY;;YAC1D,qBAACH,sBAAAA;cAAqBC,MAAK;cAAWC,MAAK;cAAKC,aAAY;;;;;;;AAKtE;AAEA,SAASH,qBAAqBI,OAI7B;AACC,MAAMC,KAAK,UAAUD,MAAMF,KAAKI,SAAQ,EAAGC,MAAM,CAAA,CAAA,IAAMH,MAAMH,IAAI;AACjE,SACE,sBAACX,QAAAA;IACCkB,eAAeJ,MAAMD,gBAAgB,eAAe,QAAQ;IAC5DL,YAAW;IACXW,gBAAe;IACfV,OAAM;;MAEN,qBAACZ,OAAAA;QAAMuB,cAAa;QAAKD,gBAAe;QAAWP,MAAME,MAAMF;QAAMS,SAASN;kBAC3ED,MAAMH,SAAS,WAAW,WAAW;;;MAIxC,sBAACZ,aAAAA;QACCc,aAAaC,MAAMD;QACnBE;QACAJ,MAAMG,MAAMH;;QACZC,MAAME,MAAMF;QACZU,qBAAqBR,MAAMH,SAAS,WAAW,KAAOY;;UAEtD,qBAACrB,MAAAA;YAAKsB,OAAM;YAAOC,cAAW;sBAC5B,qBAAC9B,WAAAA,CAAAA,CAAAA;;UAEH,qBAACO,MAAAA;YAAKsB,OAAM;YAASC,cAAW;sBAC9B,qBAAC/B,aAAAA,CAAAA,CAAAA;;UAEH,qBAACQ,MAAAA;YAAKsB,OAAM;YAAQC,cAAW;sBAC7B,qBAAC7B,YAAAA,CAAAA,CAAAA;;;;;;AAKX;",
+  "names": ["AlignCenter", "AlignLeft", "AlignRight", "Label", "styled", "ToggleGroup", "XStack", "YStack", "Item", "color", "focusStyle", "backgroundColor", "ToggleGroupDemo", "paddingHorizontal", "alignItems", "space", "ToggleGroupComponent", "type", "size", "orientation", "props", "id", "toString", "slice", "flexDirection", "justifyContent", "paddingRight", "htmlFor", "disableDeactivation", "undefined", "value", "aria-label"]
 }

package/package.json

@@ -1,22 +1,21 @@
 {
   "name": "@tamagui/demos",
-  "version": "1.122.8",
+  "version": "1.123.1",
   "sideEffects": [
     "*.css"
   ],
   "source": "demos/src/index.tsx",
-  "types": "./types/index.d.ts",
+  "types": "./src",
   "main": "dist/cjs",
   "module": "dist/esm",
-  "module:jsx": "dist/jsx",
   "files": [
     "src",
     "types",
     "dist"
   ],
   "scripts": {
-    "build": "tamagui-build",
-    "watch": "tamagui-build --watch",
+    "build": "tamagui-build --skip-types",
+    "watch": "tamagui-build --skip-types --watch",
     "lint": "biome check src",
     "lint:fix": "biome check --write src",
     "clean": "tamagui-build clean",
@@ -30,7 +29,7 @@
         "import": "./dist/esm/index.native.js",
         "require": "./dist/cjs/index.native.js"
       },
-      "types": "./types/index.d.ts",
+      "types": "./src/index.tsx",
       "import": "./dist/esm/index.mjs",
       "require": "./dist/cjs/index.cjs",
       "default": "./dist/cjs/index.native.js"
@@ -46,29 +45,29 @@
     }
   },
   "dependencies": {
-    "@tamagui/avatar": "1.122.8",
-    "@tamagui/button": "1.122.8",
-    "@tamagui/config": "1.122.8",
-    "@tamagui/core": "1.122.8",
-    "@tamagui/list-item": "1.122.8",
-    "@tamagui/logo": "1.122.8",
-    "@tamagui/lucide-icons": "1.122.8",
-    "@tamagui/menu": "1.122.8",
-    "@tamagui/popover": "1.122.8",
-    "@tamagui/progress": "1.122.8",
-    "@tamagui/radio-group": "1.122.8",
-    "@tamagui/select": "1.122.8",
-    "@tamagui/sheet": "1.122.8",
-    "@tamagui/slider": "1.122.8",
-    "@tamagui/stacks": "1.122.8",
-    "@tamagui/toast": "1.122.8",
-    "tamagui": "1.122.8"
+    "@tamagui/avatar": "1.123.1",
+    "@tamagui/button": "1.123.1",
+    "@tamagui/config": "1.123.1",
+    "@tamagui/core": "1.123.1",
+    "@tamagui/list-item": "1.123.1",
+    "@tamagui/logo": "1.123.1",
+    "@tamagui/lucide-icons": "1.123.1",
+    "@tamagui/menu": "1.123.1",
+    "@tamagui/popover": "1.123.1",
+    "@tamagui/progress": "1.123.1",
+    "@tamagui/radio-group": "1.123.1",
+    "@tamagui/select": "1.123.1",
+    "@tamagui/sheet": "1.123.1",
+    "@tamagui/slider": "1.123.1",
+    "@tamagui/stacks": "1.123.1",
+    "@tamagui/toast": "1.123.1",
+    "tamagui": "1.123.1"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.122.8",
+    "@tamagui/build": "1.123.1",
     "react": "*"
   },
   "publishConfig": {

package/src/ToggleGroupDemo.tsx

@@ -1,6 +1,15 @@
 import { AlignCenter, AlignLeft, AlignRight } from '@tamagui/lucide-icons'
 import type { SizeTokens } from 'tamagui'
-import { Label, ToggleGroup, XStack, YStack } from 'tamagui'
+import { Label, styled, ToggleGroup, XStack, YStack } from 'tamagui'
+
+const Item = styled(ToggleGroup.Item, {
+  color: '$color10',
+
+  focusStyle: {
+    color: '$color1',
+    backgroundColor: '$color12',
+  },
+})
 
 export function ToggleGroupDemo() {
   return (
@@ -44,15 +53,15 @@ function ToggleGroupComponent(props: {
         size={props.size}
         disableDeactivation={props.type === 'single' ? true : undefined}
       >
-        <ToggleGroup.Item value="left" aria-label="Left aligned">
+        <Item value="left" aria-label="Left aligned">
           <AlignLeft />
-        </ToggleGroup.Item>
-        <ToggleGroup.Item value="center" aria-label="Center aligned">
+        </Item>
+        <Item value="center" aria-label="Center aligned">
           <AlignCenter />
-        </ToggleGroup.Item>
-        <ToggleGroup.Item value="right" aria-label="Right aligned">
+        </Item>
+        <Item value="right" aria-label="Right aligned">
           <AlignRight />
-        </ToggleGroup.Item>
+        </Item>
       </ToggleGroup>
     </XStack>
   )

package/dist/jsx/AccordionDemo.js

@@ -1,29 +0,0 @@
-import { ChevronDown } from "@tamagui/lucide-icons";
-import { Accordion, Paragraph, Square } from "tamagui";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function AccordionDemo() {
-  return /* @__PURE__ */ jsxs(Accordion, { overflow: "hidden", width: "$20", type: "multiple", children: [
-    /* @__PURE__ */ jsxs(Accordion.Item, { value: "a1", children: [
-      /* @__PURE__ */ jsx(Accordion.Trigger, { flexDirection: "row", justifyContent: "space-between", children: ({
-        open
-      }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Paragraph, { children: "1. Take a cold shower" }),
-        /* @__PURE__ */ jsx(Square, { animation: "quick", rotate: open ? "180deg" : "0deg", children: /* @__PURE__ */ jsx(ChevronDown, { size: "$1" }) })
-      ] }) }),
-      /* @__PURE__ */ jsx(Accordion.HeightAnimator, { animation: "medium", children: /* @__PURE__ */ jsx(Accordion.Content, { animation: "medium", exitStyle: { opacity: 0 }, children: /* @__PURE__ */ jsx(Paragraph, { children: "Cold showers can help reduce inflammation, relieve pain, improve circulation, lower stress levels, and reduce muscle soreness and fatigue." }) }) })
-    ] }),
-    /* @__PURE__ */ jsxs(Accordion.Item, { value: "a2", children: [
-      /* @__PURE__ */ jsx(Accordion.Trigger, { flexDirection: "row", justifyContent: "space-between", children: ({
-        open
-      }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Paragraph, { children: "2. Eat 4 eggs" }),
-        /* @__PURE__ */ jsx(Square, { animation: "quick", rotate: open ? "180deg" : "0deg", children: /* @__PURE__ */ jsx(ChevronDown, { size: "$1" }) })
-      ] }) }),
-      /* @__PURE__ */ jsx(Accordion.HeightAnimator, { animation: "medium", children: /* @__PURE__ */ jsx(Accordion.Content, { animation: "medium", exitStyle: { opacity: 0 }, children: /* @__PURE__ */ jsx(Paragraph, { children: "Eggs have been a dietary staple since time immemorial and there\u2019s good reason for their continued presence in our menus and meals." }) }) })
-    ] })
-  ] });
-}
-export {
-  AccordionDemo
-};
-//# sourceMappingURL=AccordionDemo.js.map

package/dist/jsx/AccordionDemo.js.map

@@ -1,6 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/AccordionDemo.tsx"],
-  "mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,WAAW,WAAW,cAAc;AAYjC,mBACE,KADF;AAVL,SAAS,gBAAgB;AAC9B,SACE,qBAAC,aAAU,UAAS,UAAS,OAAM,OAAM,MAAK,YAC5C;AAAA,yBAAC,UAAU,MAAV,EAAe,OAAM,MACpB;AAAA,0BAAC,UAAU,SAAV,EAAkB,eAAc,OAAM,gBAAe,iBACnD,WAAC;AAAA,QACA;AAAA,MACF,MAGE,iCACE;AAAA,4BAAC,aAAU,mCAAqB;AAAA,QAChC,oBAAC,UAAO,WAAU,SAAQ,QAAQ,OAAO,WAAW,QAClD,8BAAC,eAAY,MAAK,MAAK,GACzB;AAAA,SACF,GAEJ;AAAA,MACA,oBAAC,UAAU,gBAAV,EAAyB,WAAU,UAClC,8BAAC,UAAU,SAAV,EAAkB,WAAU,UAAS,WAAW,EAAE,SAAS,EAAE,GAC5D,8BAAC,aAAU,wJAGX,GACF,GACF;AAAA,OACF;AAAA,IAEA,qBAAC,UAAU,MAAV,EAAe,OAAM,MACpB;AAAA,0BAAC,UAAU,SAAV,EAAkB,eAAc,OAAM,gBAAe,iBACnD,WAAC;AAAA,QACA;AAAA,MACF,MAGE,iCACE;AAAA,4BAAC,aAAU,2BAAa;AAAA,QACxB,oBAAC,UAAO,WAAU,SAAQ,QAAQ,OAAO,WAAW,QAClD,8BAAC,eAAY,MAAK,MAAK,GACzB;AAAA,SACF,GAEJ;AAAA,MACA,oBAAC,UAAU,gBAAV,EAAyB,WAAU,UAClC,8BAAC,UAAU,SAAV,EAAkB,WAAU,UAAS,WAAW,EAAE,SAAS,EAAE,GAC5D,8BAAC,aAAU,qJAGX,GACF,GACF;AAAA,OACF;AAAA,KACF;AAEJ;",
-  "names": []
-}

package/dist/jsx/AccordionDemo.mjs

@@ -1,73 +0,0 @@
-import { ChevronDown } from "@tamagui/lucide-icons";
-import { Accordion, Paragraph, Square } from "tamagui";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function AccordionDemo() {
-  return /* @__PURE__ */jsxs(Accordion, {
-    overflow: "hidden",
-    width: "$20",
-    type: "multiple",
-    children: [/* @__PURE__ */jsxs(Accordion.Item, {
-      value: "a1",
-      children: [/* @__PURE__ */jsx(Accordion.Trigger, {
-        flexDirection: "row",
-        justifyContent: "space-between",
-        children: ({
-          open
-        }) => /* @__PURE__ */jsxs(Fragment, {
-          children: [/* @__PURE__ */jsx(Paragraph, {
-            children: "1. Take a cold shower"
-          }), /* @__PURE__ */jsx(Square, {
-            animation: "quick",
-            rotate: open ? "180deg" : "0deg",
-            children: /* @__PURE__ */jsx(ChevronDown, {
-              size: "$1"
-            })
-          })]
-        })
-      }), /* @__PURE__ */jsx(Accordion.HeightAnimator, {
-        animation: "medium",
-        children: /* @__PURE__ */jsx(Accordion.Content, {
-          animation: "medium",
-          exitStyle: {
-            opacity: 0
-          },
-          children: /* @__PURE__ */jsx(Paragraph, {
-            children: "Cold showers can help reduce inflammation, relieve pain, improve circulation, lower stress levels, and reduce muscle soreness and fatigue."
-          })
-        })
-      })]
-    }), /* @__PURE__ */jsxs(Accordion.Item, {
-      value: "a2",
-      children: [/* @__PURE__ */jsx(Accordion.Trigger, {
-        flexDirection: "row",
-        justifyContent: "space-between",
-        children: ({
-          open
-        }) => /* @__PURE__ */jsxs(Fragment, {
-          children: [/* @__PURE__ */jsx(Paragraph, {
-            children: "2. Eat 4 eggs"
-          }), /* @__PURE__ */jsx(Square, {
-            animation: "quick",
-            rotate: open ? "180deg" : "0deg",
-            children: /* @__PURE__ */jsx(ChevronDown, {
-              size: "$1"
-            })
-          })]
-        })
-      }), /* @__PURE__ */jsx(Accordion.HeightAnimator, {
-        animation: "medium",
-        children: /* @__PURE__ */jsx(Accordion.Content, {
-          animation: "medium",
-          exitStyle: {
-            opacity: 0
-          },
-          children: /* @__PURE__ */jsx(Paragraph, {
-            children: "Eggs have been a dietary staple since time immemorial and there\u2019s good reason for their continued presence in our menus and meals."
-          })
-        })
-      })]
-    })]
-  });
-}
-export { AccordionDemo };
-//# sourceMappingURL=AccordionDemo.mjs.map

package/dist/jsx/AccordionDemo.mjs.map

@@ -1 +0,0 @@
-{"version":3,"names":["ChevronDown","Accordion","Paragraph","Square","Fragment","jsx","jsxs","AccordionDemo","overflow","width","type","children","Item","value","Trigger","flexDirection","justifyContent","open","animation","rotate","size","HeightAnimator","Content","exitStyle","opacity"],"sources":["../../src/AccordionDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,WAAA,QAAmB;AAC5B,SAASC,SAAA,EAAWC,SAAA,EAAWC,MAAA,QAAc;AAYjC,SAAAC,QAAA,EACEC,GAAA,EADFC,IAAA;AAVL,SAASC,cAAA,EAAgB;EAC9B,OACE,eAAAD,IAAA,CAACL,SAAA;IAAUO,QAAA,EAAS;IAASC,KAAA,EAAM;IAAMC,IAAA,EAAK;IAC5CC,QAAA,kBAAAL,IAAA,CAACL,SAAA,CAAUW,IAAA,EAAV;MAAeC,KAAA,EAAM;MACpBF,QAAA,kBAAAN,GAAA,CAACJ,SAAA,CAAUa,OAAA,EAAV;QAAkBC,aAAA,EAAc;QAAMC,cAAA,EAAe;QACnDL,QAAA,EAAAA,CAAC;UACAM;QACF,MAGE,eAAAX,IAAA,CAAAF,QAAA;UACEO,QAAA,kBAAAN,GAAA,CAACH,SAAA;YAAUS,QAAA;UAAA,CAAqB,GAChC,eAAAN,GAAA,CAACF,MAAA;YAAOe,SAAA,EAAU;YAAQC,MAAA,EAAQF,IAAA,GAAO,WAAW;YAClDN,QAAA,iBAAAN,GAAA,CAACL,WAAA;cAAYoB,IAAA,EAAK;YAAA,CAAK;UAAA,CACzB;QAAA,CACF;MAAA,CAEJ,GACA,eAAAf,GAAA,CAACJ,SAAA,CAAUoB,cAAA,EAAV;QAAyBH,SAAA,EAAU;QAClCP,QAAA,iBAAAN,GAAA,CAACJ,SAAA,CAAUqB,OAAA,EAAV;UAAkBJ,SAAA,EAAU;UAASK,SAAA,EAAW;YAAEC,OAAA,EAAS;UAAE;UAC5Db,QAAA,iBAAAN,GAAA,CAACH,SAAA;YAAUS,QAAA;UAAA,CAGX;QAAA,CACF;MAAA,CACF;IAAA,CACF,GAEA,eAAAL,IAAA,CAACL,SAAA,CAAUW,IAAA,EAAV;MAAeC,KAAA,EAAM;MACpBF,QAAA,kBAAAN,GAAA,CAACJ,SAAA,CAAUa,OAAA,EAAV;QAAkBC,aAAA,EAAc;QAAMC,cAAA,EAAe;QACnDL,QAAA,EAAAA,CAAC;UACAM;QACF,MAGE,eAAAX,IAAA,CAAAF,QAAA;UACEO,QAAA,kBAAAN,GAAA,CAACH,SAAA;YAAUS,QAAA;UAAA,CAAa,GACxB,eAAAN,GAAA,CAACF,MAAA;YAAOe,SAAA,EAAU;YAAQC,MAAA,EAAQF,IAAA,GAAO,WAAW;YAClDN,QAAA,iBAAAN,GAAA,CAACL,WAAA;cAAYoB,IAAA,EAAK;YAAA,CAAK;UAAA,CACzB;QAAA,CACF;MAAA,CAEJ,GACA,eAAAf,GAAA,CAACJ,SAAA,CAAUoB,cAAA,EAAV;QAAyBH,SAAA,EAAU;QAClCP,QAAA,iBAAAN,GAAA,CAACJ,SAAA,CAAUqB,OAAA,EAAV;UAAkBJ,SAAA,EAAU;UAASK,SAAA,EAAW;YAAEC,OAAA,EAAS;UAAE;UAC5Db,QAAA,iBAAAN,GAAA,CAACH,SAAA;YAAUS,QAAA;UAAA,CAGX;QAAA,CACF;MAAA,CACF;IAAA,CACF;EAAA,CACF;AAEJ","ignoreList":[]}

package/dist/jsx/AccordionDemo.native.js

@@ -1,92 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ChevronDown } from "@tamagui/lucide-icons";
-import { Accordion, Paragraph, Square } from "tamagui";
-function AccordionDemo() {
-  return /* @__PURE__ */ _jsxs(Accordion, {
-    overflow: "hidden",
-    width: "$20",
-    type: "multiple",
-    children: [
-      /* @__PURE__ */ _jsxs(Accordion.Item, {
-        value: "a1",
-        children: [
-          /* @__PURE__ */ _jsx(Accordion.Trigger, {
-            flexDirection: "row",
-            justifyContent: "space-between",
-            children: function(param) {
-              var { open } = param;
-              return /* @__PURE__ */ _jsxs(_Fragment, {
-                children: [
-                  /* @__PURE__ */ _jsx(Paragraph, {
-                    children: "1. Take a cold shower"
-                  }),
-                  /* @__PURE__ */ _jsx(Square, {
-                    animation: "quick",
-                    rotate: open ? "180deg" : "0deg",
-                    children: /* @__PURE__ */ _jsx(ChevronDown, {
-                      size: "$1"
-                    })
-                  })
-                ]
-              });
-            }
-          }),
-          /* @__PURE__ */ _jsx(Accordion.HeightAnimator, {
-            animation: "medium",
-            children: /* @__PURE__ */ _jsx(Accordion.Content, {
-              animation: "medium",
-              exitStyle: {
-                opacity: 0
-              },
-              children: /* @__PURE__ */ _jsx(Paragraph, {
-                children: "Cold showers can help reduce inflammation, relieve pain, improve circulation, lower stress levels, and reduce muscle soreness and fatigue."
-              })
-            })
-          })
-        ]
-      }),
-      /* @__PURE__ */ _jsxs(Accordion.Item, {
-        value: "a2",
-        children: [
-          /* @__PURE__ */ _jsx(Accordion.Trigger, {
-            flexDirection: "row",
-            justifyContent: "space-between",
-            children: function(param) {
-              var { open } = param;
-              return /* @__PURE__ */ _jsxs(_Fragment, {
-                children: [
-                  /* @__PURE__ */ _jsx(Paragraph, {
-                    children: "2. Eat 4 eggs"
-                  }),
-                  /* @__PURE__ */ _jsx(Square, {
-                    animation: "quick",
-                    rotate: open ? "180deg" : "0deg",
-                    children: /* @__PURE__ */ _jsx(ChevronDown, {
-                      size: "$1"
-                    })
-                  })
-                ]
-              });
-            }
-          }),
-          /* @__PURE__ */ _jsx(Accordion.HeightAnimator, {
-            animation: "medium",
-            children: /* @__PURE__ */ _jsx(Accordion.Content, {
-              animation: "medium",
-              exitStyle: {
-                opacity: 0
-              },
-              children: /* @__PURE__ */ _jsx(Paragraph, {
-                children: "Eggs have been a dietary staple since time immemorial and there\u2019s good reason for their continued presence in our menus and meals."
-              })
-            })
-          })
-        ]
-      })
-    ]
-  });
-}
-export {
-  AccordionDemo
-};
-//# sourceMappingURL=AccordionDemo.js.map

package/dist/jsx/AccordionDemo.native.js.map

@@ -1,6 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/Users/n8/tamagui/code/demos/src/AccordionDemo.tsx"],
-  "mappings": ";AAAA,SAASA,mBAAmB;AAC5B,SAASC,WAAWC,WAAWC,cAAc;AAEtC,SAASC,gBAAAA;AACd,SACE,sBAACH,WAAAA;IAAUI,UAAS;IAASC,OAAM;IAAMC,MAAK;;MAC5C,sBAACN,UAAUO,MAAI;QAACC,OAAM;;UACpB,qBAACR,UAAUS,SAAO;YAACC,eAAc;YAAMC,gBAAe;sBACnD,SAAA,OAAA;kBAAC,EACAC,KAAI,IAGL;qBACC,sBAAA,WAAA;;kBACE,qBAACX,WAAAA;8BAAU;;kBACX,qBAACC,QAAAA;oBAAOW,WAAU;oBAAQC,QAAQF,OAAO,WAAW;8BAClD,qBAACb,aAAAA;sBAAYgB,MAAK;;;;;;;UAK1B,qBAACf,UAAUgB,gBAAc;YAACH,WAAU;sBAClC,qBAACb,UAAUiB,SAAO;cAACJ,WAAU;cAASK,WAAW;gBAAEC,SAAS;cAAE;wBAC5D,qBAAClB,WAAAA;0BAAU;;;;;;MAQjB,sBAACD,UAAUO,MAAI;QAACC,OAAM;;UACpB,qBAACR,UAAUS,SAAO;YAACC,eAAc;YAAMC,gBAAe;sBACnD,SAAA,OAAA;kBAAC,EACAC,KAAI,IAGL;qBACC,sBAAA,WAAA;;kBACE,qBAACX,WAAAA;8BAAU;;kBACX,qBAACC,QAAAA;oBAAOW,WAAU;oBAAQC,QAAQF,OAAO,WAAW;8BAClD,qBAACb,aAAAA;sBAAYgB,MAAK;;;;;;;UAK1B,qBAACf,UAAUgB,gBAAc;YAACH,WAAU;sBAClC,qBAACb,UAAUiB,SAAO;cAACJ,WAAU;cAASK,WAAW;gBAAEC,SAAS;cAAE;wBAC5D,qBAAClB,WAAAA;0BAAU;;;;;;;;AASvB;",
-  "names": ["ChevronDown", "Accordion", "Paragraph", "Square", "AccordionDemo", "overflow", "width", "type", "Item", "value", "Trigger", "flexDirection", "justifyContent", "open", "animation", "rotate", "size", "HeightAnimator", "Content", "exitStyle", "opacity"]
-}