@tamagui/spinner 2.7.7 → 3.0.0-beta.1091.1

package/dist/cjs/Spinner.cjs

@@ -1,51 +1,86 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Spinner_exports = {};
-__export(Spinner_exports, {
-  Spinner: () => Spinner
-});
+__export(Spinner_exports, { Spinner: () => Spinner });
 module.exports = __toCommonJS(Spinner_exports);
 var import_core = require("@tamagui/core");
 var import_stacks = require("@tamagui/stacks");
-var import_react_native = require("react-native-web");
+var React = __toESM(require("react"), 1);
 var import_jsx_runtime = require("react/jsx-runtime");
-const Spinner = import_stacks.YStack.styleable((props, ref) => {
-  const {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  const theme = (0, import_core.useTheme)();
-  let color = colorProp;
-  if (color && color[0] === "$") {
-    color = (0, import_core.variableToString)(theme[color]);
-  }
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_stacks.YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
-      size,
-      color
-    })
-  });
-});
+const sizes = {
+	small: 20,
+	large: 36
+};
+const Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, (props, ref) => {
+	const { size = "small", color: colorProp, ...stackProps } = props;
+	const theme = (0, import_core.useTheme)();
+	let color = colorProp || "#1976D2";
+	if (theme[color]) {
+		color = (0, import_core.variableToString)(theme[color]);
+	}
+	const svg = React.useRef(null);
+	React.useEffect(() => {
+		const animation = svg.current?.animate([{ transform: "rotate(0deg)" }, { transform: "rotate(360deg)" }], {
+			duration: 750,
+			iterations: Number.POSITIVE_INFINITY,
+			easing: "linear"
+		});
+		return () => animation?.cancel();
+	}, []);
+	const px = sizes[size];
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+		ref,
+		role: "progressbar",
+		alignItems: "center",
+		justifyContent: "center",
+		...stackProps,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", {
+			ref: svg,
+			width: px,
+			height: px,
+			viewBox: "0 0 32 32",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				opacity: .2
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				strokeDasharray: 80,
+				strokeDashoffset: 60
+			})]
+		})
+	});
+});

package/dist/cjs/Spinner.native.cjs

@@ -0,0 +1,45 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Spinner_native_exports = {};
+__export(Spinner_native_exports, { Spinner: () => Spinner });
+module.exports = __toCommonJS(Spinner_native_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_core = require("@tamagui/core");
+var import_stacks = require("@tamagui/stacks");
+var import_react_native = require("react-native");
+var Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {
+	var { size, color: colorProp, ...stackProps } = props;
+	var theme = (0, import_core.useTheme)();
+	var color = colorProp;
+	if (color && theme[color]) {
+		color = (0, import_core.variableToString)(theme[color]);
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+		ref,
+		...stackProps,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
+			size,
+			color
+		})
+	});
+});

package/dist/cjs/Spinner.native.js

@@ -5,50 +5,43 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var Spinner_exports = {};
-__export(Spinner_exports, {
-  Spinner: () => Spinner
-});
-module.exports = __toCommonJS(Spinner_exports);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Spinner_native_exports = {};
+__export(Spinner_native_exports, { Spinner: () => Spinner });
+module.exports = __toCommonJS(Spinner_native_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@tamagui/core");
 var import_stacks = require("@tamagui/stacks");
 var import_react_native = require("react-native");
-var Spinner = import_stacks.YStack.styleable(function (props, ref) {
-  var {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  var theme = (0, import_core.useTheme)();
-  var color = colorProp;
-  if (color && color[0] === "$") {
-    color = (0, import_core.variableToString)(theme[color]);
-  }
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_stacks.YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
-      size,
-      color
-    })
-  });
+var Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {
+	var { size, color: colorProp, ...stackProps } = props;
+	var theme = (0, import_core.useTheme)();
+	var color = colorProp;
+	if (color && theme[color]) {
+		color = (0, import_core.variableToString)(theme[color]);
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+		ref,
+		...stackProps,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
+			size,
+			color
+		})
+	});
 });
+
 //# sourceMappingURL=Spinner.native.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","Spinner_exports","__export","Spinner","module","exports","import_jsx_runtime","require","import_core","import_stacks","import_react_native","YStack","styleable","props","ref","size","color","colorProp","stackProps","theme","useTheme","variableToString","jsx"],"sources":["../../src/Spinner.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,eAAA;AAAAC,QAAA,CAAAD,eAAA;EAAAE,OAAA,EAAAA,CAAA,KAAAA;AAAA;AACAC,MAAA,CAAAC,OAAA,GAAAT,YAA2C,CAAAK,eAAA;AAE3C,IAAAK,kBAAuB,GAAAC,OAAA;AAEvB,IAAAC,WAAA,GAAAD,OAAA,CAAkC;AAkB5B,IAAAE,aAAA,GAAAF,OAAA;AAXC,IAAAG,mBAEH,GAAAH,OAAA,eAAkB;AACpB,IAAAJ,OAAQ,GAAAM,aAAa,CAAAE,MAAW,CAAAC,SAAG,WAAeC,KAAA,EAAAC,GAAA;EAClD;IAAMC,IAAA;IAAAC,KAAA,EAAQC,SAAA;IAAA,GAAAC;EAAS,IAAAL,KAAA;EACvB,IAAIM,KAAA,GAAQ,IAAAX,WAAA,CAAAY,QAAA;EACZ,IAAIJ,KAAA,GAAAC,SAAgB;EAClB,IAAAD,KAAA,IAAAA,KAAQ;IACVA,KAAA,OAAAR,WAAA,CAAAa,gBAAA,EAAAF,KAAA,CAAAH,KAAA;EACA;EAKD,0BAAAV,kBAAA,CAAAgB,GAAA,EAAAb,aAAA,CAAAE,MAAA","ignoreList":[]}
+{"version":3,"file":"Spinner.native.js","names":[],"sources":["cjs/Spinner.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar Spinner_native_exports = {};\n__export(Spinner_native_exports, {\n  Spinner: () => Spinner\n});\nmodule.exports = __toCommonJS(Spinner_native_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_core = require(\"@tamagui/core\");\nvar import_stacks = require(\"@tamagui/stacks\");\nvar import_react_native = require(\"react-native\");\nvar Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {\n  var { size, color: colorProp, ...stackProps } = props;\n  var theme = (0, import_core.useTheme)();\n  var color = colorProp;\n  if (color && theme[color]) {\n    color = (0, import_core.variableToString)(theme[color]);\n  }\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {\n    ref,\n    ...stackProps,\n    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {\n      size,\n      color\n    })\n  });\n});\n//# sourceMappingURL=Spinner.native.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,YAAY,QAAQ,QAAQ;CAC9B,KAAK,IAAI,QAAQ,KACf,UAAU,QAAQ,MAAM;EAAE,KAAK,IAAI;EAAO,YAAY;CAAK,CAAC;AAChE;AACA,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,yBAAyB,CAAC;AAC9B,SAAS,wBAAwB,EAC/B,eAAe,QACjB,CAAC;AACD,OAAO,UAAU,aAAa,sBAAsB;AACpD,IAAI,qBAAqB,QAAQ,mBAAmB;AACpD,IAAI,cAAc,QAAQ,eAAe;AACzC,IAAI,gBAAgB,QAAQ,iBAAiB;AAC7C,IAAI,sBAAsB,QAAQ,cAAc;AAChD,IAAI,WAAW,GAAG,YAAY,gBAAe,CAAE,cAAc,QAAQ,SAAS,OAAO,KAAK;CACxF,IAAI,EAAE,MAAM,OAAO,WAAW,GAAG,eAAe;CAChD,IAAI,SAAS,GAAG,YAAY,SAAQ,CAAE;CACtC,IAAI,QAAQ;CACZ,IAAI,SAAS,MAAM,QAAQ;EACzB,SAAS,GAAG,YAAY,iBAAgB,CAAE,MAAM,MAAM;CACxD;CACA,OAAuB,iBAAC,GAAG,mBAAmB,IAAG,CAAE,cAAc,QAAQ;EACvE;EACA,GAAG;EACH,UAA0B,iBAAC,GAAG,mBAAmB,IAAG,CAAE,oBAAoB,mBAAmB;GAC3F;GACA;EACF,CAAC;CACH,CAAC;AACH,CAAC"}

package/dist/cjs/index.cjs

@@ -3,18 +3,16 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
 var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
 module.exports = __toCommonJS(index_exports);
-__reExport(index_exports, require("./Spinner.cjs"), module.exports);
+__reExport(index_exports, require("./Spinner.cjs"), module.exports);

package/dist/cjs/index.native.cjs

@@ -0,0 +1,20 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var index_exports = {};
+module.exports = __toCommonJS(index_exports);
+__reExport(index_exports, require("./Spinner.native.js"), module.exports);

package/dist/cjs/index.native.js

@@ -5,19 +5,18 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
 var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
 module.exports = __toCommonJS(index_exports);
 __reExport(index_exports, require("./Spinner.native.js"), module.exports);
+
 //# sourceMappingURL=index.native.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","index_exports","module","exports"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,aAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAP,YAAc,CAAAK,aAAA","ignoreList":[]}
+{"version":3,"file":"index.native.js","names":[],"sources":["cjs/index.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, \"default\"), secondTarget && __copyProps(secondTarget, mod, \"default\"));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar index_exports = {};\nmodule.exports = __toCommonJS(index_exports);\n__reExport(index_exports, require(\"./Spinner\"), module.exports);\n//# sourceMappingURL=index.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,cAAc,QAAQ,KAAK,kBAAkB,YAAY,QAAQ,KAAK,SAAS,GAAG,gBAAgB,YAAY,cAAc,KAAK,SAAS;AAC9I,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,gBAAgB,CAAC;AACrB,OAAO,UAAU,aAAa,aAAa;AAC3C,WAAW,eAAe,QAAQ,qBAAW,GAAG,OAAO,OAAO"}

package/dist/esm/Spinner.mjs

@@ -1,26 +1,61 @@
-import { useTheme, variableToString } from "@tamagui/core";
+import { createStyledHOC, useTheme, variableToString } from "@tamagui/core";
 import { YStack } from "@tamagui/stacks";
-import { ActivityIndicator } from "react-native-web";
-import { jsx } from "react/jsx-runtime";
-const Spinner = YStack.styleable((props, ref) => {
-  const {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  const theme = useTheme();
-  let color = colorProp;
-  if (color && color[0] === "$") {
-    color = variableToString(theme[color]);
-  }
-  return /* @__PURE__ */jsx(YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */jsx(ActivityIndicator, {
-      size,
-      color
-    })
-  });
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+const sizes = {
+	small: 20,
+	large: 36
+};
+const Spinner = createStyledHOC(YStack, (props, ref) => {
+	const { size = "small", color: colorProp, ...stackProps } = props;
+	const theme = useTheme();
+	let color = colorProp || "#1976D2";
+	if (theme[color]) {
+		color = variableToString(theme[color]);
+	}
+	const svg = React.useRef(null);
+	React.useEffect(() => {
+		const animation = svg.current?.animate([{ transform: "rotate(0deg)" }, { transform: "rotate(360deg)" }], {
+			duration: 750,
+			iterations: Number.POSITIVE_INFINITY,
+			easing: "linear"
+		});
+		return () => animation?.cancel();
+	}, []);
+	const px = sizes[size];
+	return /* @__PURE__ */ jsx(YStack, {
+		ref,
+		role: "progressbar",
+		alignItems: "center",
+		justifyContent: "center",
+		...stackProps,
+		children: /* @__PURE__ */ jsxs("svg", {
+			ref: svg,
+			width: px,
+			height: px,
+			viewBox: "0 0 32 32",
+			children: [/* @__PURE__ */ jsx("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				opacity: .2
+			}), /* @__PURE__ */ jsx("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				strokeDasharray: 80,
+				strokeDashoffset: 60
+			})]
+		})
+	});
 });
+
 export { Spinner };
 //# sourceMappingURL=Spinner.mjs.map

package/dist/esm/Spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useTheme","variableToString","YStack","ActivityIndicator","jsx","Spinner","styleable","props","ref","size","color","colorProp","stackProps","theme","children"],"sources":["../../src/Spinner.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,QAAA,EAAUC,gBAAA,QAAwB;AAE3C,SAASC,MAAA,QAAc;AAEvB,SAASC,iBAAA,QAAyB;AAkB5B,SAAAC,GAAA;AAXC,MAAMC,OAAA,GAETH,MAAA,CAAOI,SAAA,CAAU,CAACC,KAAA,EAAqBC,GAAA,KAAQ;EACjD,MAAM;IAAEC,IAAA;IAAMC,KAAA,EAAOC,SAAA;IAAW,GAAGC;EAAW,IAAIL,KAAA;EAClD,MAAMM,KAAA,GAAQb,QAAA,CAAS;EACvB,IAAIU,KAAA,GAAQC,SAAA;EACZ,IAAID,KAAA,IAASA,KAAA,CAAM,CAAC,MAAM,KAAK;IAC7BA,KAAA,GAAQT,gBAAA,CAAiBY,KAAA,CAAMH,KAAK,CAAC;EACvC;EACA,OACE,eAAAN,GAAA,CAACF,MAAA;IAAOM,GAAA;IAAW,GAAGI,UAAA;IACpBE,QAAA,iBAAAV,GAAA,CAACD,iBAAA;MAAkBM,IAAA;MAAYC;IAAA,CAAc;EAAA,CAC/C;AAEJ,CAAC","ignoreList":[]}
+{"version":3,"file":"Spinner.js","names":[],"sources":["esm/Spinner.js"],"sourcesContent":["import { createStyledHOC, useTheme, variableToString } from \"@tamagui/core\";\nimport { YStack } from \"@tamagui/stacks\";\nimport * as React from \"react\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst sizes = {\n  small: 20,\n  large: 36\n};\nconst Spinner = createStyledHOC(YStack, (props, ref) => {\n  const { size = \"small\", color: colorProp, ...stackProps } = props;\n  const theme = useTheme();\n  let color = colorProp || \"#1976D2\";\n  if (theme[color]) {\n    color = variableToString(theme[color]);\n  }\n  const svg = React.useRef(null);\n  React.useEffect(() => {\n    const animation = svg.current?.animate(\n      [{ transform: \"rotate(0deg)\" }, { transform: \"rotate(360deg)\" }],\n      { duration: 750, iterations: Number.POSITIVE_INFINITY, easing: \"linear\" }\n    );\n    return () => animation?.cancel();\n  }, []);\n  const px = sizes[size];\n  return /* @__PURE__ */ jsx(\n    YStack,\n    {\n      ref,\n      role: \"progressbar\",\n      alignItems: \"center\",\n      justifyContent: \"center\",\n      ...stackProps,\n      children: /* @__PURE__ */ jsxs(\"svg\", { ref: svg, width: px, height: px, viewBox: \"0 0 32 32\", children: [\n        /* @__PURE__ */ jsx(\n          \"circle\",\n          {\n            cx: \"16\",\n            cy: \"16\",\n            r: \"14\",\n            fill: \"none\",\n            strokeWidth: \"4\",\n            stroke: color,\n            opacity: 0.2\n          }\n        ),\n        /* @__PURE__ */ jsx(\n          \"circle\",\n          {\n            cx: \"16\",\n            cy: \"16\",\n            r: \"14\",\n            fill: \"none\",\n            strokeWidth: \"4\",\n            stroke: color,\n            strokeDasharray: 80,\n            strokeDashoffset: 60\n          }\n        )\n      ] })\n    }\n  );\n});\nexport {\n  Spinner\n};\n//# sourceMappingURL=Spinner.js.map\n"],"mappings":";;;;;;AAIA,MAAM,QAAQ;CACZ,OAAO;CACP,OAAO;AACT;AACA,MAAM,UAAU,gBAAgB,SAAS,OAAO,QAAQ;CACtD,MAAM,EAAE,OAAO,SAAS,OAAO,WAAW,GAAG,eAAe;CAC5D,MAAM,QAAQ,SAAS;CACvB,IAAI,QAAQ,aAAa;CACzB,IAAI,MAAM,QAAQ;EAChB,QAAQ,iBAAiB,MAAM,MAAM;CACvC;CACA,MAAM,MAAM,MAAM,OAAO,IAAI;CAC7B,MAAM,gBAAgB;EACpB,MAAM,YAAY,IAAI,SAAS,QAC7B,CAAC,EAAE,WAAW,eAAe,GAAG,EAAE,WAAW,iBAAiB,CAAC,GAC/D;GAAE,UAAU;GAAK,YAAY,OAAO;GAAmB,QAAQ;EAAS,CAC1E;EACA,aAAa,WAAW,OAAO;CACjC,GAAG,CAAC,CAAC;CACL,MAAM,KAAK,MAAM;CACjB,OAAuB,oBACrB,QACA;EACE;EACA,MAAM;EACN,YAAY;EACZ,gBAAgB;EAChB,GAAG;EACH,UAA0B,qBAAK,OAAO;GAAE,KAAK;GAAK,OAAO;GAAI,QAAQ;GAAI,SAAS;GAAa,UAAU,CACvF,oBACd,UACA;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAM;IACN,aAAa;IACb,QAAQ;IACR,SAAS;GACX,CACF,GACgB,oBACd,UACA;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAM;IACN,aAAa;IACb,QAAQ;IACR,iBAAiB;IACjB,kBAAkB;GACpB,CACF,CACF;EAAE,CAAC;CACL,CACF;AACF,CAAC"}

package/dist/esm/Spinner.native.js

@@ -1,26 +1,24 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useTheme, variableToString } from "@tamagui/core";
+import { jsx } from "react/jsx-runtime";
+import { createStyledHOC, useTheme, variableToString } from "@tamagui/core";
 import { YStack } from "@tamagui/stacks";
 import { ActivityIndicator } from "react-native";
-var Spinner = YStack.styleable(function (props, ref) {
-  var {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  var theme = useTheme();
-  var color = colorProp;
-  if (color && color[0] === "$") {
-    color = variableToString(theme[color]);
-  }
-  return /* @__PURE__ */_jsx(YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */_jsx(ActivityIndicator, {
-      size,
-      color
-    })
-  });
+
+var Spinner = createStyledHOC(YStack, function(props, ref) {
+	var { size, color: colorProp, ...stackProps } = props;
+	var theme = useTheme();
+	var color = colorProp;
+	if (color && theme[color]) {
+		color = variableToString(theme[color]);
+	}
+	return /* @__PURE__ */ jsx(YStack, {
+		ref,
+		...stackProps,
+		children: /* @__PURE__ */ jsx(ActivityIndicator, {
+			size,
+			color
+		})
+	});
 });
+
 export { Spinner };
 //# sourceMappingURL=Spinner.native.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","useTheme","variableToString","YStack","ActivityIndicator","Spinner","styleable","props","ref","size","color","colorProp","stackProps","theme"],"sources":["../../src/Spinner.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,GAAA,IAAAC,IAAU,2BAAwB;AAE3C,SAASC,QAAA,EAAAC,gBAAc;AAEvB,SAASC,MAAA,yBAAyB;AAkB5B,SAAAC,iBAAA;AAXC,IAAAC,OAAM,GAAAF,MAET,CAAAG,SAAO,WAAWC,KAAqB,EAAAC,GAAQ;EACjD;IAAMC,IAAE;IAAAC,KAAM,EAAAC,SAAO;IAAA,GAAWC;EAAG,IAAWL,KAAI;EAClD,IAAAM,KAAM,GAAAZ,QAAQ;EACd,IAAIS,KAAA,GAAQC,SAAA;EACZ,IAAID,KAAA,IAASA,KAAA,CAAM,CAAC,MAAM,KAAK;IAC7BA,KAAA,GAAQR,gBAAA,CAAiBW,KAAA,CAAMH,KAAK,CAAC;EACvC;EACA,OACE,eAAAV,IAAC,CAAAG,MAAA;IAIJK,GAAA","ignoreList":[]}
+{"version":3,"file":"Spinner.native.js","names":[],"sources":["esm/Spinner.native.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { createStyledHOC, useTheme, variableToString } from \"@tamagui/core\";\nimport { YStack } from \"@tamagui/stacks\";\nimport { ActivityIndicator } from \"react-native\";\nvar Spinner = createStyledHOC(YStack, function(props, ref) {\n  var { size, color: colorProp, ...stackProps } = props;\n  var theme = useTheme();\n  var color = colorProp;\n  if (color && theme[color]) {\n    color = variableToString(theme[color]);\n  }\n  return /* @__PURE__ */ _jsx(YStack, {\n    ref,\n    ...stackProps,\n    children: /* @__PURE__ */ _jsx(ActivityIndicator, {\n      size,\n      color\n    })\n  });\n});\nexport {\n  Spinner\n};\n//# sourceMappingURL=Spinner.native.js.map\n"],"mappings":";;;;;;AAIA,IAAI,UAAU,gBAAgB,QAAQ,SAAS,OAAO,KAAK;CACzD,IAAI,EAAE,MAAM,OAAO,WAAW,GAAG,eAAe;CAChD,IAAI,QAAQ,SAAS;CACrB,IAAI,QAAQ;CACZ,IAAI,SAAS,MAAM,QAAQ;EACzB,QAAQ,iBAAiB,MAAM,MAAM;CACvC;CACA,OAAuB,oBAAK,QAAQ;EAClC;EACA,GAAG;EACH,UAA0B,oBAAK,mBAAmB;GAChD;GACA;EACF,CAAC;CACH,CAAC;AACH,CAAC"}

package/dist/esm/index.js

@@ -1,2 +1 @@
-export * from "./Spinner.mjs";
-//# sourceMappingURL=index.js.map
+export * from "./Spinner.mjs"

package/dist/esm/index.mjs

@@ -1,2 +1 @@
-export * from "./Spinner.mjs";
-//# sourceMappingURL=index.mjs.map
+export * from "./Spinner.mjs"

package/dist/esm/index.native.js

@@ -1,2 +1 @@
-export * from "./Spinner.native.js";
-//# sourceMappingURL=index.native.js.map
+export * from "./Spinner.native.js"

package/dist/jsx/Spinner.mjs

@@ -1,26 +1,61 @@
-import { useTheme, variableToString } from "@tamagui/core";
+import { createStyledHOC, useTheme, variableToString } from "@tamagui/core";
 import { YStack } from "@tamagui/stacks";
-import { ActivityIndicator } from "react-native-web";
-import { jsx } from "react/jsx-runtime";
-const Spinner = YStack.styleable((props, ref) => {
-  const {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  const theme = useTheme();
-  let color = colorProp;
-  if (color && color[0] === "$") {
-    color = variableToString(theme[color]);
-  }
-  return /* @__PURE__ */jsx(YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */jsx(ActivityIndicator, {
-      size,
-      color
-    })
-  });
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+const sizes = {
+	small: 20,
+	large: 36
+};
+const Spinner = createStyledHOC(YStack, (props, ref) => {
+	const { size = "small", color: colorProp, ...stackProps } = props;
+	const theme = useTheme();
+	let color = colorProp || "#1976D2";
+	if (theme[color]) {
+		color = variableToString(theme[color]);
+	}
+	const svg = React.useRef(null);
+	React.useEffect(() => {
+		const animation = svg.current?.animate([{ transform: "rotate(0deg)" }, { transform: "rotate(360deg)" }], {
+			duration: 750,
+			iterations: Number.POSITIVE_INFINITY,
+			easing: "linear"
+		});
+		return () => animation?.cancel();
+	}, []);
+	const px = sizes[size];
+	return /* @__PURE__ */ jsx(YStack, {
+		ref,
+		role: "progressbar",
+		alignItems: "center",
+		justifyContent: "center",
+		...stackProps,
+		children: /* @__PURE__ */ jsxs("svg", {
+			ref: svg,
+			width: px,
+			height: px,
+			viewBox: "0 0 32 32",
+			children: [/* @__PURE__ */ jsx("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				opacity: .2
+			}), /* @__PURE__ */ jsx("circle", {
+				cx: "16",
+				cy: "16",
+				r: "14",
+				fill: "none",
+				strokeWidth: "4",
+				stroke: color,
+				strokeDasharray: 80,
+				strokeDashoffset: 60
+			})]
+		})
+	});
 });
+
 export { Spinner };
 //# sourceMappingURL=Spinner.mjs.map

package/dist/jsx/Spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useTheme","variableToString","YStack","ActivityIndicator","jsx","Spinner","styleable","props","ref","size","color","colorProp","stackProps","theme","children"],"sources":["../../src/Spinner.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,QAAA,EAAUC,gBAAA,QAAwB;AAE3C,SAASC,MAAA,QAAc;AAEvB,SAASC,iBAAA,QAAyB;AAkB5B,SAAAC,GAAA;AAXC,MAAMC,OAAA,GAETH,MAAA,CAAOI,SAAA,CAAU,CAACC,KAAA,EAAqBC,GAAA,KAAQ;EACjD,MAAM;IAAEC,IAAA;IAAMC,KAAA,EAAOC,SAAA;IAAW,GAAGC;EAAW,IAAIL,KAAA;EAClD,MAAMM,KAAA,GAAQb,QAAA,CAAS;EACvB,IAAIU,KAAA,GAAQC,SAAA;EACZ,IAAID,KAAA,IAASA,KAAA,CAAM,CAAC,MAAM,KAAK;IAC7BA,KAAA,GAAQT,gBAAA,CAAiBY,KAAA,CAAMH,KAAK,CAAC;EACvC;EACA,OACE,eAAAN,GAAA,CAACF,MAAA;IAAOM,GAAA;IAAW,GAAGI,UAAA;IACpBE,QAAA,iBAAAV,GAAA,CAACD,iBAAA;MAAkBM,IAAA;MAAYC;IAAA,CAAc;EAAA,CAC/C;AAEJ,CAAC","ignoreList":[]}
+{"version":3,"file":"Spinner.js","names":[],"sources":["jsx/Spinner.js"],"sourcesContent":["import { createStyledHOC, useTheme, variableToString } from \"@tamagui/core\";\nimport { YStack } from \"@tamagui/stacks\";\nimport * as React from \"react\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst sizes = {\n  small: 20,\n  large: 36\n};\nconst Spinner = createStyledHOC(YStack, (props, ref) => {\n  const { size = \"small\", color: colorProp, ...stackProps } = props;\n  const theme = useTheme();\n  let color = colorProp || \"#1976D2\";\n  if (theme[color]) {\n    color = variableToString(theme[color]);\n  }\n  const svg = React.useRef(null);\n  React.useEffect(() => {\n    const animation = svg.current?.animate(\n      [{ transform: \"rotate(0deg)\" }, { transform: \"rotate(360deg)\" }],\n      { duration: 750, iterations: Number.POSITIVE_INFINITY, easing: \"linear\" }\n    );\n    return () => animation?.cancel();\n  }, []);\n  const px = sizes[size];\n  return /* @__PURE__ */ jsx(\n    YStack,\n    {\n      ref,\n      role: \"progressbar\",\n      alignItems: \"center\",\n      justifyContent: \"center\",\n      ...stackProps,\n      children: /* @__PURE__ */ jsxs(\"svg\", { ref: svg, width: px, height: px, viewBox: \"0 0 32 32\", children: [\n        /* @__PURE__ */ jsx(\n          \"circle\",\n          {\n            cx: \"16\",\n            cy: \"16\",\n            r: \"14\",\n            fill: \"none\",\n            strokeWidth: \"4\",\n            stroke: color,\n            opacity: 0.2\n          }\n        ),\n        /* @__PURE__ */ jsx(\n          \"circle\",\n          {\n            cx: \"16\",\n            cy: \"16\",\n            r: \"14\",\n            fill: \"none\",\n            strokeWidth: \"4\",\n            stroke: color,\n            strokeDasharray: 80,\n            strokeDashoffset: 60\n          }\n        )\n      ] })\n    }\n  );\n});\nexport {\n  Spinner\n};\n//# sourceMappingURL=Spinner.js.map\n"],"mappings":";;;;;;AAIA,MAAM,QAAQ;CACZ,OAAO;CACP,OAAO;AACT;AACA,MAAM,UAAU,gBAAgB,SAAS,OAAO,QAAQ;CACtD,MAAM,EAAE,OAAO,SAAS,OAAO,WAAW,GAAG,eAAe;CAC5D,MAAM,QAAQ,SAAS;CACvB,IAAI,QAAQ,aAAa;CACzB,IAAI,MAAM,QAAQ;EAChB,QAAQ,iBAAiB,MAAM,MAAM;CACvC;CACA,MAAM,MAAM,MAAM,OAAO,IAAI;CAC7B,MAAM,gBAAgB;EACpB,MAAM,YAAY,IAAI,SAAS,QAC7B,CAAC,EAAE,WAAW,eAAe,GAAG,EAAE,WAAW,iBAAiB,CAAC,GAC/D;GAAE,UAAU;GAAK,YAAY,OAAO;GAAmB,QAAQ;EAAS,CAC1E;EACA,aAAa,WAAW,OAAO;CACjC,GAAG,CAAC,CAAC;CACL,MAAM,KAAK,MAAM;CACjB,OAAuB,oBACrB,QACA;EACE;EACA,MAAM;EACN,YAAY;EACZ,gBAAgB;EAChB,GAAG;EACH,UAA0B,qBAAK,OAAO;GAAE,KAAK;GAAK,OAAO;GAAI,QAAQ;GAAI,SAAS;GAAa,UAAU,CACvF,oBACd,UACA;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAM;IACN,aAAa;IACb,QAAQ;IACR,SAAS;GACX,CACF,GACgB,oBACd,UACA;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAM;IACN,aAAa;IACb,QAAQ;IACR,iBAAiB;IACjB,kBAAkB;GACpB,CACF,CACF;EAAE,CAAC;CACL,CACF;AACF,CAAC"}

package/dist/jsx/Spinner.native.cjs

@@ -0,0 +1,45 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Spinner_native_exports = {};
+__export(Spinner_native_exports, { Spinner: () => Spinner });
+module.exports = __toCommonJS(Spinner_native_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_core = require("@tamagui/core");
+var import_stacks = require("@tamagui/stacks");
+var import_react_native = require("react-native");
+var Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {
+	var { size, color: colorProp, ...stackProps } = props;
+	var theme = (0, import_core.useTheme)();
+	var color = colorProp;
+	if (color && theme[color]) {
+		color = (0, import_core.variableToString)(theme[color]);
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+		ref,
+		...stackProps,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
+			size,
+			color
+		})
+	});
+});

package/dist/jsx/Spinner.native.js

@@ -5,50 +5,43 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var Spinner_exports = {};
-__export(Spinner_exports, {
-  Spinner: () => Spinner
-});
-module.exports = __toCommonJS(Spinner_exports);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Spinner_native_exports = {};
+__export(Spinner_native_exports, { Spinner: () => Spinner });
+module.exports = __toCommonJS(Spinner_native_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@tamagui/core");
 var import_stacks = require("@tamagui/stacks");
 var import_react_native = require("react-native");
-var Spinner = import_stacks.YStack.styleable(function (props, ref) {
-  var {
-    size,
-    color: colorProp,
-    ...stackProps
-  } = props;
-  var theme = (0, import_core.useTheme)();
-  var color = colorProp;
-  if (color && color[0] === "$") {
-    color = (0, import_core.variableToString)(theme[color]);
-  }
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_stacks.YStack, {
-    ref,
-    ...stackProps,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
-      size,
-      color
-    })
-  });
+var Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {
+	var { size, color: colorProp, ...stackProps } = props;
+	var theme = (0, import_core.useTheme)();
+	var color = colorProp;
+	if (color && theme[color]) {
+		color = (0, import_core.variableToString)(theme[color]);
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+		ref,
+		...stackProps,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {
+			size,
+			color
+		})
+	});
 });
+
 //# sourceMappingURL=Spinner.native.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call"],"sources":["../../src/Spinner.tsx"],"sourcesContent":[null],"mappings":"AACA,YAAS;;AAET,IAAAA,SAAS,GAAAC,MAAA,CAAcC,cAAA;AAEvB,IAAAC,gBAAS,GAAAF,MAAA,CAAAG,wBAAyB;AAkB5B,IAAAC,iBAAA,GAAAJ,MAAA,CAAAK,mBAAA;AAXC,IAAAC,YAEH,GAAAN,MAAO,CAAAO,SAAW,CAAAC,cAA6B;AACjD,IAAAC,QAAQ,GAAAA,CAAMC,MAAA,EAAOC,GAAA;EACrB,SAAMC,IAAA,IAAQD,GAAA,EACdZ,SAAI,CAAQW,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AACZ;AACE,IAAAC,WAAQ,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAiBC,MAAM,EAAAC,IAAM;EACvC,IAAAF,IAAA,WAAAA,IAAA,wBAAAA,IAAA;IACA,KACE,IAAAG,GAAA,IAAAhB,iBAAC,CAAAa,IAAO,GAIX,KAAAX,YAAA,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAAA,GAAA,KAAAF,MAAA,E","ignoreList":[]}
+{"version":3,"file":"Spinner.native.js","names":[],"sources":["jsx/Spinner.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar Spinner_native_exports = {};\n__export(Spinner_native_exports, {\n  Spinner: () => Spinner\n});\nmodule.exports = __toCommonJS(Spinner_native_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_core = require(\"@tamagui/core\");\nvar import_stacks = require(\"@tamagui/stacks\");\nvar import_react_native = require(\"react-native\");\nvar Spinner = (0, import_core.createStyledHOC)(import_stacks.YStack, function(props, ref) {\n  var { size, color: colorProp, ...stackProps } = props;\n  var theme = (0, import_core.useTheme)();\n  var color = colorProp;\n  if (color && theme[color]) {\n    color = (0, import_core.variableToString)(theme[color]);\n  }\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {\n    ref,\n    ...stackProps,\n    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ActivityIndicator, {\n      size,\n      color\n    })\n  });\n});\n//# sourceMappingURL=Spinner.native.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,YAAY,QAAQ,QAAQ;CAC9B,KAAK,IAAI,QAAQ,KACf,UAAU,QAAQ,MAAM;EAAE,KAAK,IAAI;EAAO,YAAY;CAAK,CAAC;AAChE;AACA,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,yBAAyB,CAAC;AAC9B,SAAS,wBAAwB,EAC/B,eAAe,QACjB,CAAC;AACD,OAAO,UAAU,aAAa,sBAAsB;AACpD,IAAI,qBAAqB,QAAQ,mBAAmB;AACpD,IAAI,cAAc,QAAQ,eAAe;AACzC,IAAI,gBAAgB,QAAQ,iBAAiB;AAC7C,IAAI,sBAAsB,QAAQ,cAAc;AAChD,IAAI,WAAW,GAAG,YAAY,gBAAe,CAAE,cAAc,QAAQ,SAAS,OAAO,KAAK;CACxF,IAAI,EAAE,MAAM,OAAO,WAAW,GAAG,eAAe;CAChD,IAAI,SAAS,GAAG,YAAY,SAAQ,CAAE;CACtC,IAAI,QAAQ;CACZ,IAAI,SAAS,MAAM,QAAQ;EACzB,SAAS,GAAG,YAAY,iBAAgB,CAAE,MAAM,MAAM;CACxD;CACA,OAAuB,iBAAC,GAAG,mBAAmB,IAAG,CAAE,cAAc,QAAQ;EACvE;EACA,GAAG;EACH,UAA0B,iBAAC,GAAG,mBAAmB,IAAG,CAAE,oBAAoB,mBAAmB;GAC3F;GACA;EACF,CAAC;CACH,CAAC;AACH,CAAC"}

package/dist/jsx/index.js

@@ -1,2 +1 @@
-export * from "./Spinner.mjs";
-//# sourceMappingURL=index.js.map
+export * from "./Spinner.mjs"

package/dist/jsx/index.mjs

@@ -1,2 +1 @@
-export * from "./Spinner.mjs";
-//# sourceMappingURL=index.mjs.map
+export * from "./Spinner.mjs"

package/dist/jsx/index.native.cjs

@@ -0,0 +1,20 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var index_exports = {};
+module.exports = __toCommonJS(index_exports);
+__reExport(index_exports, require("./Spinner.native.js"), module.exports);

package/dist/jsx/index.native.js

@@ -5,19 +5,18 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
 var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
 module.exports = __toCommonJS(index_exports);
 __reExport(index_exports, require("./Spinner.native.js"), module.exports);
+
 //# sourceMappingURL=index.native.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"file":"index.native.js","names":[],"sources":["jsx/index.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, \"default\"), secondTarget && __copyProps(secondTarget, mod, \"default\"));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar index_exports = {};\nmodule.exports = __toCommonJS(index_exports);\n__reExport(index_exports, require(\"./Spinner\"), module.exports);\n//# sourceMappingURL=index.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,cAAc,QAAQ,KAAK,kBAAkB,YAAY,QAAQ,KAAK,SAAS,GAAG,gBAAgB,YAAY,cAAc,KAAK,SAAS;AAC9I,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,gBAAgB,CAAC;AACrB,OAAO,UAAU,aAAa,aAAa;AAC3C,WAAW,eAAe,QAAQ,qBAAW,GAAG,OAAO,OAAO"}

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@tamagui/spinner",
-  "version": "2.7.7",
+  "version": "3.0.0-beta.1091.1",
+  "license": "MIT",
   "source": "src/index.ts",
   "files": [
     "src",
@@ -34,16 +35,17 @@
     "clean:build": "tamagui-build clean:build"
   },
   "dependencies": {
-    "@tamagui/core": "2.7.7",
-    "@tamagui/stacks": "2.7.7"
+    "@tamagui/core": "3.0.0-beta.1091.1",
+    "@tamagui/stacks": "3.0.0-beta.1091.1"
   },
   "devDependencies": {
-    "@tamagui/build": "2.7.7",
-    "react": ">=19",
-    "react-native": "0.83.2"
+    "@tamagui/build": "3.0.0-beta.1091.1",
+    "react": "19.2.3",
+    "react-native": "0.86.2"
   },
   "peerDependencies": {
-    "react": ">=19"
+    "react": ">=19",
+    "react-native-web": "*"
   },
   "module:jsx": "dist/jsx",
   "repository": {

package/src/Spinner.native.tsx

@@ -0,0 +1,27 @@
+import type { ColorTokens, ThemeTokens } from '@tamagui/core'
+import { createStyledHOC, useTheme, variableToString } from '@tamagui/core'
+import type { YStackProps } from '@tamagui/stacks'
+import { YStack } from '@tamagui/stacks'
+import { ActivityIndicator } from 'react-native'
+
+type SpinnerExtraProps = {
+  size?: 'small' | 'large'
+  color?: (ColorTokens | ThemeTokens | (string & {})) | null
+}
+
+export type SpinnerProps = Omit<YStackProps, 'children' | keyof SpinnerExtraProps> &
+  SpinnerExtraProps
+
+export const Spinner = createStyledHOC(YStack, (props: SpinnerProps, ref) => {
+  const { size, color: colorProp, ...stackProps } = props
+  const theme = useTheme()
+  let color = colorProp as string
+  if (color && theme[color]) {
+    color = variableToString(theme[color])
+  }
+  return (
+    <YStack ref={ref} {...stackProps}>
+      <ActivityIndicator size={size} color={color} />
+    </YStack>
+  )
+})

package/src/Spinner.tsx

@@ -1,27 +1,83 @@
 import type { ColorTokens, ThemeTokens } from '@tamagui/core'
-import { useTheme, variableToString } from '@tamagui/core'
+import { createStyledHOC, useTheme, variableToString } from '@tamagui/core'
 import type { YStackProps } from '@tamagui/stacks'
 import { YStack } from '@tamagui/stacks'
-import type * as React from 'react'
-import { ActivityIndicator } from 'react-native'
+import * as React from 'react'
 
-export type SpinnerProps = Omit<YStackProps, 'children'> & {
+type SpinnerExtraProps = {
   size?: 'small' | 'large'
   color?: (ColorTokens | ThemeTokens | (string & {})) | null
 }
 
-export const Spinner: React.ForwardRefExoticComponent<
-  SpinnerProps & React.RefAttributes<any>
-> = YStack.styleable((props: SpinnerProps, ref) => {
-  const { size, color: colorProp, ...stackProps } = props
+export type SpinnerProps = Omit<YStackProps, 'children' | keyof SpinnerExtraProps> &
+  SpinnerExtraProps
+
+const sizes = {
+  small: 20,
+  large: 36,
+}
+
+/**
+ * The same two circles react-native-web draws, at the same sizes and the same
+ * 0.75s linear turn, so the web spinner looks like it always has without going
+ * through react-native.
+ *
+ * The turn is driven by the web animations api rather than a keyframe rule: a
+ * keyframe would have to reach a stylesheet this package does not own, and the
+ * compiled-CSS build strips the one place components can insert rules at
+ * runtime.
+ */
+export const Spinner = createStyledHOC(YStack, (props: SpinnerProps, ref) => {
+  const { size = 'small', color: colorProp, ...stackProps } = props
   const theme = useTheme()
-  let color = colorProp as string
-  if (color && color[0] === '$') {
+  // svg's default stroke is `none`, so an unset color has to land on something.
+  // react-native-web's ActivityIndicator picks this same blue
+  let color = (colorProp as string) || '#1976D2'
+  if (theme[color]) {
     color = variableToString(theme[color])
   }
+
+  const svg = React.useRef<SVGSVGElement>(null)
+
+  React.useEffect(() => {
+    const animation = svg.current?.animate(
+      [{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }],
+      { duration: 750, iterations: Number.POSITIVE_INFINITY, easing: 'linear' }
+    )
+    return () => animation?.cancel()
+  }, [])
+
+  const px = sizes[size]
+
   return (
-    <YStack ref={ref} {...stackProps}>
-      <ActivityIndicator size={size} color={color} />
+    <YStack
+      ref={ref}
+      role="progressbar"
+      alignItems="center"
+      justifyContent="center"
+      {...stackProps}
+    >
+      <svg ref={svg} width={px} height={px} viewBox="0 0 32 32">
+        <circle
+          cx="16"
+          cy="16"
+          r="14"
+          fill="none"
+          strokeWidth="4"
+          stroke={color}
+          opacity={0.2}
+        />
+        <circle
+          cx="16"
+          cy="16"
+          r="14"
+          fill="none"
+          strokeWidth="4"
+          stroke={color}
+          strokeDasharray={80}
+          strokeDashoffset={60}
+        />
+      </svg>
     </YStack>
   )
 })

package/types/Spinner.d.ts

@@ -1,9 +1,24 @@
 import type { ColorTokens, ThemeTokens } from '@tamagui/core';
 import type { YStackProps } from '@tamagui/stacks';
-import type * as React from 'react';
-export type SpinnerProps = Omit<YStackProps, 'children'> & {
+type SpinnerExtraProps = {
     size?: 'small' | 'large';
     color?: (ColorTokens | ThemeTokens | (string & {})) | null;
 };
-export declare const Spinner: React.ForwardRefExoticComponent<SpinnerProps & React.RefAttributes<any>>;
+export type SpinnerProps = Omit<YStackProps, 'children' | keyof SpinnerExtraProps> & SpinnerExtraProps;
+/**
+ * The same two circles react-native-web draws, at the same sizes and the same
+ * 0.75s linear turn, so the web spinner looks like it always has without going
+ * through react-native.
+ *
+ * The turn is driven by the web animations api rather than a keyframe rule: a
+ * keyframe would have to reach a stylesheet this package does not own, and the
+ * compiled-CSS build strips the one place components can insert rules at
+ * runtime.
+ */
+export declare const Spinner: import("@tamagui/core").TamaguiComponent<Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
+    elevation?: number | false | import("@tamagui/core").Size | undefined;
+}>, "accessibilityActions" | "accessibilityElementsHidden" | "accessibilityHint" | "accessibilityIgnoresInvertColors" | "accessibilityLabel" | "accessibilityLabelledBy" | "accessibilityLanguage" | "accessibilityLargeContentTitle" | "accessibilityLiveRegion" | "accessibilityRespondsToUserInteraction" | "accessibilityRole" | "accessibilityShowsLargeContentViewer" | "accessibilityState" | "accessibilityValue" | "accessibilityViewIsModal" | "accessible" | "alignContent" | "alignItems" | "alignSelf" | "animatePresence" | "animatedBy" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-hidden" | "aria-label" | "aria-labelledby" | "aria-live" | "aria-modal" | "aria-selected" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "asChild" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "blockSize" | "border" | "borderBlock" | "borderBlockColor" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBlockStyle" | "borderBlockWidth" | "borderBottomColor" | "borderBottomEndRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStartRadius" | "borderBottomWidth" | "borderColor" | "borderCurve" | "borderEndColor" | "borderEndEndRadius" | "borderEndStartRadius" | "borderEndWidth" | "borderImage" | "borderInline" | "borderInlineColor" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderInlineStyle" | "borderInlineWidth" | "borderLeftColor" | "borderLeftWidth" | "borderRadius" | "borderRightColor" | "borderRightWidth" | "borderStartColor" | "borderStartEndRadius" | "borderStartStartRadius" | "borderStartWidth" | "borderStyle" | "borderTopColor" | "borderTopEndRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStartRadius" | "borderTopWidth" | "borderWidth" | "bottom" | "boxShadow" | "boxSizing" | "caretColor" | "className" | "clipPath" | "collapsable" | "collapsableChildren" | "columnGap" | "contain" | "container" | "containerName" | "containerType" | "cursor" | "dangerouslySetInnerHTML" | "debug" | "direction" | "disableClassName" | "disableNativeStyle" | "disableOptimization" | "disabled" | "display" | "download" | "elevation" | "elevationAndroid" | "end" | "experimental_backgroundImage" | "experimental_backgroundPosition" | "experimental_backgroundRepeat" | "experimental_backgroundSize" | "filter" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "forceStyle" | "gap" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "group" | "hasTVPreferredFocus" | "height" | "hitSlop" | "htmlFor" | "id" | "importantForAccessibility" | "inlineSize" | "inset" | "insetBlock" | "insetBlockEnd" | "insetBlockStart" | "insetInline" | "insetInlineEnd" | "insetInlineStart" | "isTVSelectable" | "isolation" | "justifyContent" | "left" | "margin" | "marginBlock" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginEnd" | "marginHorizontal" | "marginInline" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginStart" | "marginTop" | "marginVertical" | "mask" | "maskBorder" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "matrix" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "name" | "nativeID" | "needsOffscreenAlphaCompositing" | "objectFit" | "onAccessibilityAction" | "onAccessibilityEscape" | "onAccessibilityTap" | "onBeforeInput" | "onBlur" | "onChange" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onDoubleClick" | "onDrag" | "onDragEnd" | "onDragEnter" | "onDragLeave" | "onDragOver" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onKeyDown" | "onKeyUp" | "onLayout" | "onLongPress" | "onMagicTap" | "onMouseDown" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onMouseUp" | "onMoveShouldSetResponder" | "onMoveShouldSetResponderCapture" | "onPaste" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPress" | "onPressIn" | "onPressOut" | "onResponderEnd" | "onResponderGrant" | "onResponderMove" | "onResponderReject" | "onResponderRelease" | "onResponderStart" | "onResponderTerminate" | "onResponderTerminationRequest" | "onScroll" | "onScrollShouldSetResponder" | "onScrollShouldSetResponderCapture" | "onSelectionChangeShouldSetResponder" | "onSelectionChangeShouldSetResponderCapture" | "onStartShouldSetResponder" | "onStartShouldSetResponderCapture" | "onTouchCancel" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchStart" | "onTransition" | "onWheel" | "opacity" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowBlock" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "padding" | "paddingBlock" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingEnd" | "paddingHorizontal" | "paddingInline" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingStart" | "paddingTop" | "paddingVertical" | "passThrough" | "perspective" | "pointerEvents" | "position" | "rel" | "removeClippedSubviews" | "render" | "renderToHardwareTextureAndroid" | "resize" | "right" | "role" | "rotate" | "rotateX" | "rotateY" | "rotateZ" | "rotation" | "rowGap" | "scale" | "scaleX" | "scaleY" | "screenReaderFocusable" | "shadowColor" | "shadowOffset" | "shadowOpacity" | "shadowRadius" | "shouldRasterizeIOS" | "skewX" | "skewY" | "start" | "style" | "tabIndex" | "target" | "testID" | "textEmphasis" | "textWrap" | "theme" | "themeShallow" | "top" | "transform" | "transformMatrix" | "transformOrigin" | "transformStyle" | "transition" | "translateX" | "translateY" | "tvParallaxMagnification" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "untilMeasured" | "userSelect" | "verticalAlign" | "visibility" | "width" | "wordWrap" | "x" | "y" | "zIndex" | keyof SpinnerExtraProps> & Omit<YStackProps, "children" | keyof SpinnerExtraProps> & SpinnerExtraProps, import("@tamagui/core").TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps & Omit<YStackProps, "children" | keyof SpinnerExtraProps> & SpinnerExtraProps, import("@tamagui/core").StackStyleBase, {
+    elevation?: number | false | import("@tamagui/core").Size | undefined;
+}, import("@tamagui/core").StaticConfigPublic>;
+export {};
 //# sourceMappingURL=Spinner.d.ts.map

package/types/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../src/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAElD,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAGnC,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,GAAG;IACzD,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;IACxB,KAAK,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,GAAG,IAAI,CAAA;CAC3D,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,yBAAyB,CACnD,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAavC,CAAA"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../src/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAIlD,KAAK,iBAAiB,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;IACxB,KAAK,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,GAAG,IAAI,CAAA;CAC3D,CAAA;AAED,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,MAAM,iBAAiB,CAAC,GAChF,iBAAiB,CAAA;AAOnB;;;;;;;;;GASG;AACH,eAAO,MAAM,OAAO;;;;8CAqDlB,CAAA"}

package/types/Spinner.native.d.ts

@@ -0,0 +1,14 @@
+import type { ColorTokens, ThemeTokens } from '@tamagui/core';
+import type { YStackProps } from '@tamagui/stacks';
+type SpinnerExtraProps = {
+    size?: 'small' | 'large';
+    color?: (ColorTokens | ThemeTokens | (string & {})) | null;
+};
+export type SpinnerProps = Omit<YStackProps, 'children' | keyof SpinnerExtraProps> & SpinnerExtraProps;
+export declare const Spinner: import("@tamagui/core").TamaguiComponent<Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
+    elevation?: number | false | import("@tamagui/core").Size | undefined;
+}>, "accessibilityActions" | "accessibilityElementsHidden" | "accessibilityHint" | "accessibilityIgnoresInvertColors" | "accessibilityLabel" | "accessibilityLabelledBy" | "accessibilityLanguage" | "accessibilityLargeContentTitle" | "accessibilityLiveRegion" | "accessibilityRespondsToUserInteraction" | "accessibilityRole" | "accessibilityShowsLargeContentViewer" | "accessibilityState" | "accessibilityValue" | "accessibilityViewIsModal" | "accessible" | "alignContent" | "alignItems" | "alignSelf" | "animatePresence" | "animatedBy" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-hidden" | "aria-label" | "aria-labelledby" | "aria-live" | "aria-modal" | "aria-selected" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "asChild" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "blockSize" | "border" | "borderBlock" | "borderBlockColor" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBlockStyle" | "borderBlockWidth" | "borderBottomColor" | "borderBottomEndRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStartRadius" | "borderBottomWidth" | "borderColor" | "borderCurve" | "borderEndColor" | "borderEndEndRadius" | "borderEndStartRadius" | "borderEndWidth" | "borderImage" | "borderInline" | "borderInlineColor" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderInlineStyle" | "borderInlineWidth" | "borderLeftColor" | "borderLeftWidth" | "borderRadius" | "borderRightColor" | "borderRightWidth" | "borderStartColor" | "borderStartEndRadius" | "borderStartStartRadius" | "borderStartWidth" | "borderStyle" | "borderTopColor" | "borderTopEndRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStartRadius" | "borderTopWidth" | "borderWidth" | "bottom" | "boxShadow" | "boxSizing" | "caretColor" | "className" | "clipPath" | "collapsable" | "collapsableChildren" | "columnGap" | "contain" | "container" | "containerName" | "containerType" | "cursor" | "dangerouslySetInnerHTML" | "debug" | "direction" | "disableClassName" | "disableNativeStyle" | "disableOptimization" | "disabled" | "display" | "download" | "elevation" | "elevationAndroid" | "end" | "experimental_backgroundImage" | "experimental_backgroundPosition" | "experimental_backgroundRepeat" | "experimental_backgroundSize" | "filter" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "forceStyle" | "gap" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "group" | "hasTVPreferredFocus" | "height" | "hitSlop" | "htmlFor" | "id" | "importantForAccessibility" | "inlineSize" | "inset" | "insetBlock" | "insetBlockEnd" | "insetBlockStart" | "insetInline" | "insetInlineEnd" | "insetInlineStart" | "isTVSelectable" | "isolation" | "justifyContent" | "left" | "margin" | "marginBlock" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginEnd" | "marginHorizontal" | "marginInline" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginStart" | "marginTop" | "marginVertical" | "mask" | "maskBorder" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "matrix" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "name" | "nativeID" | "needsOffscreenAlphaCompositing" | "objectFit" | "onAccessibilityAction" | "onAccessibilityEscape" | "onAccessibilityTap" | "onBeforeInput" | "onBlur" | "onChange" | "onClick" | "onContextMenu" | "onCopy" | "onCut" | "onDoubleClick" | "onDrag" | "onDragEnd" | "onDragEnter" | "onDragLeave" | "onDragOver" | "onDragStart" | "onDrop" | "onFocus" | "onInput" | "onKeyDown" | "onKeyUp" | "onLayout" | "onLongPress" | "onMagicTap" | "onMouseDown" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseOut" | "onMouseOver" | "onMouseUp" | "onMoveShouldSetResponder" | "onMoveShouldSetResponderCapture" | "onPaste" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPress" | "onPressIn" | "onPressOut" | "onResponderEnd" | "onResponderGrant" | "onResponderMove" | "onResponderReject" | "onResponderRelease" | "onResponderStart" | "onResponderTerminate" | "onResponderTerminationRequest" | "onScroll" | "onScrollShouldSetResponder" | "onScrollShouldSetResponderCapture" | "onSelectionChangeShouldSetResponder" | "onSelectionChangeShouldSetResponderCapture" | "onStartShouldSetResponder" | "onStartShouldSetResponderCapture" | "onTouchCancel" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchStart" | "onTransition" | "onWheel" | "opacity" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowBlock" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "padding" | "paddingBlock" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingEnd" | "paddingHorizontal" | "paddingInline" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingStart" | "paddingTop" | "paddingVertical" | "passThrough" | "perspective" | "pointerEvents" | "position" | "rel" | "removeClippedSubviews" | "render" | "renderToHardwareTextureAndroid" | "resize" | "right" | "role" | "rotate" | "rotateX" | "rotateY" | "rotateZ" | "rotation" | "rowGap" | "scale" | "scaleX" | "scaleY" | "screenReaderFocusable" | "shadowColor" | "shadowOffset" | "shadowOpacity" | "shadowRadius" | "shouldRasterizeIOS" | "skewX" | "skewY" | "start" | "style" | "tabIndex" | "target" | "testID" | "textEmphasis" | "textWrap" | "theme" | "themeShallow" | "top" | "transform" | "transformMatrix" | "transformOrigin" | "transformStyle" | "transition" | "translateX" | "translateY" | "tvParallaxMagnification" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "untilMeasured" | "userSelect" | "verticalAlign" | "visibility" | "width" | "wordWrap" | "x" | "y" | "zIndex" | keyof SpinnerExtraProps> & Omit<YStackProps, "children" | keyof SpinnerExtraProps> & SpinnerExtraProps, import("@tamagui/core").TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps & Omit<YStackProps, "children" | keyof SpinnerExtraProps> & SpinnerExtraProps, import("@tamagui/core").StackStyleBase, {
+    elevation?: number | false | import("@tamagui/core").Size | undefined;
+}, import("@tamagui/core").StaticConfigPublic>;
+export {};
+//# sourceMappingURL=Spinner.native.d.ts.map

package/types/Spinner.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.native.d.ts","sourceRoot":"","sources":["../src/Spinner.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAIlD,KAAK,iBAAiB,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;IACxB,KAAK,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,GAAG,IAAI,CAAA;CAC3D,CAAA;AAED,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,MAAM,iBAAiB,CAAC,GAChF,iBAAiB,CAAA;AAEnB,eAAO,MAAM,OAAO;;;;8CAYlB,CAAA"}

package/dist/esm/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,cAAc","ignoreList":[]}

package/dist/esm/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,cAAc","ignoreList":[]}

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

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,cAAc","ignoreList":[]}

package/dist/jsx/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,cAAc","ignoreList":[]}

package/dist/jsx/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,cAAc","ignoreList":[]}