@tamagui/linear-gradient 3.0.0-beta.924.1 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/linear-gradient.cjs +5 -6
- package/dist/cjs/linear-gradient.native.cjs +101 -11
- package/dist/cjs/linear-gradient.native.js +101 -11
- package/dist/cjs/linear-gradient.native.js.map +1 -1
- package/dist/esm/LinearGradient.mjs.map +1 -1
- package/dist/esm/LinearGradient.native.js.map +1 -1
- package/dist/esm/linear-gradient.mjs +5 -6
- package/dist/esm/linear-gradient.mjs.map +1 -1
- package/dist/esm/linear-gradient.native.js +92 -8
- package/dist/esm/linear-gradient.native.js.map +1 -1
- package/dist/jsx/LinearGradient.mjs.map +1 -1
- package/dist/jsx/linear-gradient.mjs +5 -6
- package/dist/jsx/linear-gradient.mjs.map +1 -1
- package/dist/jsx/linear-gradient.native.cjs +101 -11
- package/dist/jsx/linear-gradient.native.js +101 -11
- package/dist/jsx/linear-gradient.native.js.map +1 -1
- package/package.json +9 -8
- package/src/LinearGradient.tsx +5 -6
- package/src/linear-gradient.tsx +27 -34
- package/types/LinearGradient.d.ts +1 -9
- package/types/LinearGradient.d.ts.map +1 -1
- package/types/linear-gradient.d.ts +13 -2
- package/types/linear-gradient.d.ts.map +1 -1
- package/src/linear-gradient.native.tsx +0 -15
- package/types/linear-gradient.native.d.ts +0 -3
- package/types/linear-gradient.native.d.ts.map +0 -1
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
9
|
var __export = (target, all) => {
|
|
8
10
|
for (var name in all) __defProp(target, name, {
|
|
@@ -19,18 +21,106 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
19
21
|
}
|
|
20
22
|
return to;
|
|
21
23
|
};
|
|
24
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
25
|
+
value: mod,
|
|
26
|
+
enumerable: true
|
|
27
|
+
}) : target, mod));
|
|
22
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
23
|
-
var
|
|
24
|
-
__export(
|
|
25
|
-
module.exports = __toCommonJS(
|
|
29
|
+
var linear_gradient_exports = {};
|
|
30
|
+
__export(linear_gradient_exports, { LinearGradient: () => LinearGradient });
|
|
31
|
+
module.exports = __toCommonJS(linear_gradient_exports);
|
|
26
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
+
var import_core = require("@tamagui/core");
|
|
34
|
+
var React = __toESM(require("react"), 1);
|
|
35
|
+
var GradientView = import_core.View;
|
|
36
|
+
function needsDimensionAwareAngle(start, end) {
|
|
37
|
+
if (!start && !end) return false;
|
|
38
|
+
var _start_;
|
|
39
|
+
var startX = (_start_ = start === null || start === void 0 ? void 0 : start[0]) !== null && _start_ !== void 0 ? _start_ : .5;
|
|
40
|
+
var _end_;
|
|
41
|
+
var endX = (_end_ = end === null || end === void 0 ? void 0 : end[0]) !== null && _end_ !== void 0 ? _end_ : .5;
|
|
42
|
+
return startX !== endX;
|
|
43
|
+
}
|
|
44
|
+
function LinearGradient(param) {
|
|
45
|
+
var { colors, locations, start, end, ...props } = param;
|
|
46
|
+
var normalizedStart = start ? Array.isArray(start) ? start : [start.x, start.y] : void 0;
|
|
47
|
+
var normalizedEnd = end ? Array.isArray(end) ? end : [end.x, end.y] : void 0;
|
|
48
|
+
var needsLayout = needsDimensionAwareAngle(normalizedStart, normalizedEnd);
|
|
49
|
+
var [{ height, width }, setLayout] = React.useState({
|
|
50
|
+
height: 1,
|
|
51
|
+
width: 1
|
|
52
|
+
});
|
|
53
|
+
var linearGradientBackgroundImage = React.useMemo(function() {
|
|
54
|
+
return getLinearGradientBackgroundImage(colors, locations, normalizedStart, normalizedEnd, width, height);
|
|
55
|
+
}, [
|
|
56
|
+
colors,
|
|
57
|
+
locations,
|
|
58
|
+
normalizedStart,
|
|
59
|
+
normalizedEnd,
|
|
60
|
+
width,
|
|
61
|
+
height
|
|
62
|
+
]);
|
|
63
|
+
if (!needsLayout) {
|
|
64
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {
|
|
65
|
+
...props,
|
|
66
|
+
backgroundImage: linearGradientBackgroundImage
|
|
67
|
+
});
|
|
33
68
|
}
|
|
34
|
-
|
|
35
|
-
|
|
69
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {
|
|
70
|
+
...props,
|
|
71
|
+
backgroundImage: linearGradientBackgroundImage,
|
|
72
|
+
onLayout: function(event) {
|
|
73
|
+
var { width: width2, height: height2 } = event.nativeEvent.layout;
|
|
74
|
+
setLayout(function(oldLayout) {
|
|
75
|
+
if (width2 !== oldLayout.width || height2 !== oldLayout.height) {
|
|
76
|
+
return {
|
|
77
|
+
height: height2,
|
|
78
|
+
width: width2
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
return oldLayout;
|
|
82
|
+
});
|
|
83
|
+
if (props.onLayout) {
|
|
84
|
+
props.onLayout(event);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
function getLinearGradientBackgroundImage(colors, locations, startPoint, endPoint) {
|
|
90
|
+
var width = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : 1, height = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : 1;
|
|
91
|
+
var gradientColors = calculateGradientColors(colors, locations);
|
|
92
|
+
var angle = calculatePseudoAngle(width, height, startPoint, endPoint);
|
|
93
|
+
return `linear-gradient(${angle}deg, ${gradientColors.join(", ")})`;
|
|
94
|
+
}
|
|
95
|
+
function calculatePseudoAngle(width, height, startPoint, endPoint) {
|
|
96
|
+
var getControlPoints = function() {
|
|
97
|
+
var correctedStartPoint = [0, 0];
|
|
98
|
+
if (Array.isArray(startPoint)) {
|
|
99
|
+
correctedStartPoint = [startPoint[0] != null ? startPoint[0] : 0, startPoint[1] != null ? startPoint[1] : 0];
|
|
100
|
+
}
|
|
101
|
+
var correctedEndPoint = [0, 1];
|
|
102
|
+
if (Array.isArray(endPoint)) {
|
|
103
|
+
correctedEndPoint = [endPoint[0] != null ? endPoint[0] : 0, endPoint[1] != null ? endPoint[1] : 1];
|
|
104
|
+
}
|
|
105
|
+
return [correctedStartPoint, correctedEndPoint];
|
|
106
|
+
};
|
|
107
|
+
var [start, end] = getControlPoints();
|
|
108
|
+
start[0] *= width;
|
|
109
|
+
end[0] *= width;
|
|
110
|
+
start[1] *= height;
|
|
111
|
+
end[1] *= height;
|
|
112
|
+
var py = end[1] - start[1];
|
|
113
|
+
var px = end[0] - start[0];
|
|
114
|
+
return 90 + Math.atan2(py, px) * 180 / Math.PI;
|
|
115
|
+
}
|
|
116
|
+
function calculateGradientColors(colors, locations) {
|
|
117
|
+
return colors.map(function(color, index) {
|
|
118
|
+
var output = (0, import_core.normalizeColor)(color);
|
|
119
|
+
if (locations && locations[index] !== void 0) {
|
|
120
|
+
var location = Math.max(0, Math.min(1, locations[index]));
|
|
121
|
+
var percentage = location * 100;
|
|
122
|
+
return `${output} ${percentage}%`;
|
|
123
|
+
}
|
|
124
|
+
return output;
|
|
125
|
+
});
|
|
36
126
|
}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
9
|
var __export = (target, all) => {
|
|
8
10
|
for (var name in all) __defProp(target, name, {
|
|
@@ -19,20 +21,108 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
19
21
|
}
|
|
20
22
|
return to;
|
|
21
23
|
};
|
|
24
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
25
|
+
value: mod,
|
|
26
|
+
enumerable: true
|
|
27
|
+
}) : target, mod));
|
|
22
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
23
|
-
var
|
|
24
|
-
__export(
|
|
25
|
-
module.exports = __toCommonJS(
|
|
29
|
+
var linear_gradient_exports = {};
|
|
30
|
+
__export(linear_gradient_exports, { LinearGradient: () => LinearGradient });
|
|
31
|
+
module.exports = __toCommonJS(linear_gradient_exports);
|
|
26
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
+
var import_core = require("@tamagui/core");
|
|
34
|
+
var React = __toESM(require("react"), 1);
|
|
35
|
+
var GradientView = import_core.View;
|
|
36
|
+
function needsDimensionAwareAngle(start, end) {
|
|
37
|
+
if (!start && !end) return false;
|
|
38
|
+
var _start_;
|
|
39
|
+
var startX = (_start_ = start === null || start === void 0 ? void 0 : start[0]) !== null && _start_ !== void 0 ? _start_ : .5;
|
|
40
|
+
var _end_;
|
|
41
|
+
var endX = (_end_ = end === null || end === void 0 ? void 0 : end[0]) !== null && _end_ !== void 0 ? _end_ : .5;
|
|
42
|
+
return startX !== endX;
|
|
43
|
+
}
|
|
44
|
+
function LinearGradient(param) {
|
|
45
|
+
var { colors, locations, start, end, ...props } = param;
|
|
46
|
+
var normalizedStart = start ? Array.isArray(start) ? start : [start.x, start.y] : void 0;
|
|
47
|
+
var normalizedEnd = end ? Array.isArray(end) ? end : [end.x, end.y] : void 0;
|
|
48
|
+
var needsLayout = needsDimensionAwareAngle(normalizedStart, normalizedEnd);
|
|
49
|
+
var [{ height, width }, setLayout] = React.useState({
|
|
50
|
+
height: 1,
|
|
51
|
+
width: 1
|
|
52
|
+
});
|
|
53
|
+
var linearGradientBackgroundImage = React.useMemo(function() {
|
|
54
|
+
return getLinearGradientBackgroundImage(colors, locations, normalizedStart, normalizedEnd, width, height);
|
|
55
|
+
}, [
|
|
56
|
+
colors,
|
|
57
|
+
locations,
|
|
58
|
+
normalizedStart,
|
|
59
|
+
normalizedEnd,
|
|
60
|
+
width,
|
|
61
|
+
height
|
|
62
|
+
]);
|
|
63
|
+
if (!needsLayout) {
|
|
64
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {
|
|
65
|
+
...props,
|
|
66
|
+
backgroundImage: linearGradientBackgroundImage
|
|
67
|
+
});
|
|
33
68
|
}
|
|
34
|
-
|
|
35
|
-
|
|
69
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {
|
|
70
|
+
...props,
|
|
71
|
+
backgroundImage: linearGradientBackgroundImage,
|
|
72
|
+
onLayout: function(event) {
|
|
73
|
+
var { width: width2, height: height2 } = event.nativeEvent.layout;
|
|
74
|
+
setLayout(function(oldLayout) {
|
|
75
|
+
if (width2 !== oldLayout.width || height2 !== oldLayout.height) {
|
|
76
|
+
return {
|
|
77
|
+
height: height2,
|
|
78
|
+
width: width2
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
return oldLayout;
|
|
82
|
+
});
|
|
83
|
+
if (props.onLayout) {
|
|
84
|
+
props.onLayout(event);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
function getLinearGradientBackgroundImage(colors, locations, startPoint, endPoint) {
|
|
90
|
+
var width = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : 1, height = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : 1;
|
|
91
|
+
var gradientColors = calculateGradientColors(colors, locations);
|
|
92
|
+
var angle = calculatePseudoAngle(width, height, startPoint, endPoint);
|
|
93
|
+
return `linear-gradient(${angle}deg, ${gradientColors.join(", ")})`;
|
|
94
|
+
}
|
|
95
|
+
function calculatePseudoAngle(width, height, startPoint, endPoint) {
|
|
96
|
+
var getControlPoints = function() {
|
|
97
|
+
var correctedStartPoint = [0, 0];
|
|
98
|
+
if (Array.isArray(startPoint)) {
|
|
99
|
+
correctedStartPoint = [startPoint[0] != null ? startPoint[0] : 0, startPoint[1] != null ? startPoint[1] : 0];
|
|
100
|
+
}
|
|
101
|
+
var correctedEndPoint = [0, 1];
|
|
102
|
+
if (Array.isArray(endPoint)) {
|
|
103
|
+
correctedEndPoint = [endPoint[0] != null ? endPoint[0] : 0, endPoint[1] != null ? endPoint[1] : 1];
|
|
104
|
+
}
|
|
105
|
+
return [correctedStartPoint, correctedEndPoint];
|
|
106
|
+
};
|
|
107
|
+
var [start, end] = getControlPoints();
|
|
108
|
+
start[0] *= width;
|
|
109
|
+
end[0] *= width;
|
|
110
|
+
start[1] *= height;
|
|
111
|
+
end[1] *= height;
|
|
112
|
+
var py = end[1] - start[1];
|
|
113
|
+
var px = end[0] - start[0];
|
|
114
|
+
return 90 + Math.atan2(py, px) * 180 / Math.PI;
|
|
115
|
+
}
|
|
116
|
+
function calculateGradientColors(colors, locations) {
|
|
117
|
+
return colors.map(function(color, index) {
|
|
118
|
+
var output = (0, import_core.normalizeColor)(color);
|
|
119
|
+
if (locations && locations[index] !== void 0) {
|
|
120
|
+
var location = Math.max(0, Math.min(1, locations[index]));
|
|
121
|
+
var percentage = location * 100;
|
|
122
|
+
return `${output} ${percentage}%`;
|
|
123
|
+
}
|
|
124
|
+
return output;
|
|
125
|
+
});
|
|
36
126
|
}
|
|
37
127
|
|
|
38
128
|
//# sourceMappingURL=linear-gradient.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"linear-gradient.native.js","names":[],"sources":["jsx/linear-gradient.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
|
|
1
|
+
{"version":3,"file":"linear-gradient.native.js","names":[],"sources":["jsx/linear-gradient.native.js"],"sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n // If the importer is in node compatibility mode or this is not an ESM\n // file that has been converted to a CommonJS file using a Babel-\n // compatible transform (i.e. \"__esModule\" has not been set), then set\n // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar linear_gradient_exports = {};\n__export(linear_gradient_exports, {\n LinearGradient: () => LinearGradient\n});\nmodule.exports = __toCommonJS(linear_gradient_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_core = require(\"@tamagui/core\");\nvar React = __toESM(require(\"react\"), 1);\nvar GradientView = import_core.View;\nfunction needsDimensionAwareAngle(start, end) {\n if (!start && !end) return false;\n var _start_;\n var startX = (_start_ = start === null || start === void 0 ? void 0 : start[0]) !== null && _start_ !== void 0 ? _start_ : 0.5;\n var _end_;\n var endX = (_end_ = end === null || end === void 0 ? void 0 : end[0]) !== null && _end_ !== void 0 ? _end_ : 0.5;\n return startX !== endX;\n}\nfunction LinearGradient(param) {\n var { colors, locations, start, end, ...props } = param;\n var normalizedStart = start ? Array.isArray(start) ? start : [\n start.x,\n start.y\n ] : void 0;\n var normalizedEnd = end ? Array.isArray(end) ? end : [\n end.x,\n end.y\n ] : void 0;\n var needsLayout = needsDimensionAwareAngle(normalizedStart, normalizedEnd);\n var [{ height, width }, setLayout] = React.useState({\n height: 1,\n width: 1\n });\n var linearGradientBackgroundImage = React.useMemo(function() {\n return getLinearGradientBackgroundImage(colors, locations, normalizedStart, normalizedEnd, width, height);\n }, [\n colors,\n locations,\n normalizedStart,\n normalizedEnd,\n width,\n height\n ]);\n if (!needsLayout) {\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {\n ...props,\n backgroundImage: linearGradientBackgroundImage\n });\n }\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GradientView, {\n ...props,\n backgroundImage: linearGradientBackgroundImage,\n onLayout: function(event) {\n var { width: width2, height: height2 } = event.nativeEvent.layout;\n setLayout(function(oldLayout) {\n if (width2 !== oldLayout.width || height2 !== oldLayout.height) {\n return {\n height: height2,\n width: width2\n };\n }\n return oldLayout;\n });\n if (props.onLayout) {\n props.onLayout(event);\n }\n }\n });\n}\nfunction getLinearGradientBackgroundImage(colors, locations, startPoint, endPoint) {\n var width = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : 1, height = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : 1;\n var gradientColors = calculateGradientColors(colors, locations);\n var angle = calculatePseudoAngle(width, height, startPoint, endPoint);\n return `linear-gradient(${angle}deg, ${gradientColors.join(\", \")})`;\n}\nfunction calculatePseudoAngle(width, height, startPoint, endPoint) {\n var getControlPoints = function() {\n var correctedStartPoint = [\n 0,\n 0\n ];\n if (Array.isArray(startPoint)) {\n correctedStartPoint = [\n startPoint[0] != null ? startPoint[0] : 0,\n startPoint[1] != null ? startPoint[1] : 0\n ];\n }\n var correctedEndPoint = [\n 0,\n 1\n ];\n if (Array.isArray(endPoint)) {\n correctedEndPoint = [\n endPoint[0] != null ? endPoint[0] : 0,\n endPoint[1] != null ? endPoint[1] : 1\n ];\n }\n return [\n correctedStartPoint,\n correctedEndPoint\n ];\n };\n var [start, end] = getControlPoints();\n start[0] *= width;\n end[0] *= width;\n start[1] *= height;\n end[1] *= height;\n var py = end[1] - start[1];\n var px = end[0] - start[0];\n return 90 + Math.atan2(py, px) * 180 / Math.PI;\n}\nfunction calculateGradientColors(colors, locations) {\n return colors.map(function(color, index) {\n var output = (0, import_core.normalizeColor)(color);\n if (locations && locations[index] !== void 0) {\n var location = Math.max(0, Math.min(1, locations[index]));\n var percentage = location * 100;\n return `${output} ${percentage}%`;\n }\n return output;\n });\n}\n//# sourceMappingURL=linear-gradient.js.map\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/linear-gradient",
|
|
3
|
-
"version": "3.0.0
|
|
3
|
+
"version": "3.0.0",
|
|
4
|
+
"license": "MIT",
|
|
4
5
|
"source": "src/index.ts",
|
|
5
6
|
"files": [
|
|
6
7
|
"src",
|
|
@@ -34,15 +35,14 @@
|
|
|
34
35
|
"clean:build": "tamagui-build clean:build"
|
|
35
36
|
},
|
|
36
37
|
"dependencies": {
|
|
37
|
-
"@tamagui/core": "3.0.0
|
|
38
|
-
"@tamagui/native": "3.0.0
|
|
39
|
-
"@tamagui/stacks": "3.0.0
|
|
38
|
+
"@tamagui/core": "3.0.0",
|
|
39
|
+
"@tamagui/react-native-types": "3.0.0",
|
|
40
|
+
"@tamagui/stacks": "3.0.0"
|
|
40
41
|
},
|
|
41
42
|
"devDependencies": {
|
|
42
|
-
"@tamagui/build": "3.0.0
|
|
43
|
-
"expo-linear-gradient": "~57.0.1",
|
|
43
|
+
"@tamagui/build": "3.0.0",
|
|
44
44
|
"react": "19.2.3",
|
|
45
|
-
"react-native": "0.
|
|
45
|
+
"react-native": "0.87.1"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
48
|
"react": ">=19",
|
|
@@ -53,5 +53,6 @@
|
|
|
53
53
|
"type": "git",
|
|
54
54
|
"url": "git+https://github.com/tamagui/tamagui.git",
|
|
55
55
|
"directory": "code/ui/linear-gradient"
|
|
56
|
-
}
|
|
56
|
+
},
|
|
57
|
+
"releaseSourceCommit": "15fbca480b143f876f6975601e23a17d3f90d2ee"
|
|
57
58
|
}
|
package/src/LinearGradient.tsx
CHANGED
|
@@ -8,12 +8,11 @@ import {
|
|
|
8
8
|
useTheme,
|
|
9
9
|
} from '@tamagui/core'
|
|
10
10
|
import { YStack } from '@tamagui/stacks'
|
|
11
|
-
import type { ViewStyle } from 'react-native'
|
|
11
|
+
import type { ViewStyle } from '@tamagui/react-native-types'
|
|
12
12
|
|
|
13
13
|
import type { LinearGradientPoint } from './linear-gradient'
|
|
14
|
-
import { LinearGradient as
|
|
14
|
+
import { LinearGradient as GradientBackground } from './linear-gradient'
|
|
15
15
|
|
|
16
|
-
// taken from expo-linear-gradient
|
|
17
16
|
export type LinearGradientExtraProps = {
|
|
18
17
|
colors?: (ColorTokens | ThemeTokens | (string & {}))[]
|
|
19
18
|
locations?: number[] | null
|
|
@@ -61,11 +60,11 @@ export const LinearGradient = createStyledHOC(
|
|
|
61
60
|
|
|
62
61
|
return (
|
|
63
62
|
<LinearGradientFrame ref={ref as any} {...stackProps}>
|
|
64
|
-
<
|
|
63
|
+
<GradientBackground
|
|
65
64
|
start={start}
|
|
66
65
|
end={end}
|
|
67
|
-
colors={colors
|
|
68
|
-
locations={locations
|
|
66
|
+
colors={colors}
|
|
67
|
+
locations={locations}
|
|
69
68
|
style={gradientStyle}
|
|
70
69
|
/>
|
|
71
70
|
{children}
|
package/src/linear-gradient.tsx
CHANGED
|
@@ -7,17 +7,26 @@
|
|
|
7
7
|
*/
|
|
8
8
|
|
|
9
9
|
import { View, normalizeColor } from '@tamagui/core'
|
|
10
|
-
import
|
|
11
|
-
LinearGradientPoint,
|
|
12
|
-
LinearGradientProps,
|
|
13
|
-
NativeLinearGradientPoint,
|
|
14
|
-
} from 'expo-linear-gradient'
|
|
10
|
+
import * as React from 'react'
|
|
15
11
|
|
|
16
|
-
|
|
12
|
+
type NativeLinearGradientPoint = [x: number, y: number]
|
|
17
13
|
|
|
18
|
-
|
|
14
|
+
export type LinearGradientPoint = { x: number; y: number } | NativeLinearGradientPoint
|
|
15
|
+
|
|
16
|
+
// start and end are the gradient's points here, not View's logical insets.
|
|
17
|
+
export type LinearGradientProps = Omit<
|
|
18
|
+
React.ComponentProps<typeof View>,
|
|
19
|
+
'start' | 'end'
|
|
20
|
+
> & {
|
|
21
|
+
colors: readonly string[]
|
|
22
|
+
locations?: readonly number[] | null
|
|
23
|
+
start?: LinearGradientPoint | null
|
|
24
|
+
end?: LinearGradientPoint | null
|
|
25
|
+
}
|
|
19
26
|
|
|
20
|
-
|
|
27
|
+
// one path on every platform: a backgroundImage gradient, which react native
|
|
28
|
+
// draws natively (experimental_backgroundImage) and the web draws as css.
|
|
29
|
+
const GradientView = View as React.ComponentType<any>
|
|
21
30
|
|
|
22
31
|
// check if start/end points require dimension-aware angle calculation
|
|
23
32
|
function needsDimensionAwareAngle(
|
|
@@ -62,7 +71,6 @@ export function LinearGradient({
|
|
|
62
71
|
|
|
63
72
|
const linearGradientBackgroundImage = React.useMemo(() => {
|
|
64
73
|
return getLinearGradientBackgroundImage(
|
|
65
|
-
// @ts-expect-error ok
|
|
66
74
|
colors,
|
|
67
75
|
locations,
|
|
68
76
|
normalizedStart as NativeLinearGradientPoint,
|
|
@@ -74,27 +82,13 @@ export function LinearGradient({
|
|
|
74
82
|
|
|
75
83
|
// if we don't need dimension-aware angles, skip the onLayout overhead
|
|
76
84
|
if (!needsLayout) {
|
|
77
|
-
return
|
|
78
|
-
<WebView
|
|
79
|
-
{...props}
|
|
80
|
-
onLayout={props.onLayout}
|
|
81
|
-
style={[
|
|
82
|
-
props.style,
|
|
83
|
-
// @ts-ignore: [ts] Property 'backgroundImage' does not exist on type 'ViewStyle'.
|
|
84
|
-
{ backgroundImage: linearGradientBackgroundImage },
|
|
85
|
-
]}
|
|
86
|
-
/>
|
|
87
|
-
)
|
|
85
|
+
return <GradientView {...props} backgroundImage={linearGradientBackgroundImage} />
|
|
88
86
|
}
|
|
89
87
|
|
|
90
88
|
return (
|
|
91
|
-
<
|
|
89
|
+
<GradientView
|
|
92
90
|
{...props}
|
|
93
|
-
|
|
94
|
-
props.style,
|
|
95
|
-
// @ts-ignore: [ts] Property 'backgroundImage' does not exist on type 'ViewStyle'.
|
|
96
|
-
{ backgroundImage: linearGradientBackgroundImage },
|
|
97
|
-
]}
|
|
91
|
+
backgroundImage={linearGradientBackgroundImage}
|
|
98
92
|
onLayout={(event) => {
|
|
99
93
|
const { width, height } = event.nativeEvent.layout
|
|
100
94
|
|
|
@@ -116,18 +110,14 @@ export function LinearGradient({
|
|
|
116
110
|
}
|
|
117
111
|
|
|
118
112
|
function getLinearGradientBackgroundImage(
|
|
119
|
-
colors:
|
|
120
|
-
locations?: number[] | null,
|
|
113
|
+
colors: readonly string[],
|
|
114
|
+
locations?: readonly number[] | null,
|
|
121
115
|
startPoint?: NativeLinearGradientPoint | null,
|
|
122
116
|
endPoint?: NativeLinearGradientPoint | null,
|
|
123
117
|
width = 1,
|
|
124
118
|
height = 1
|
|
125
119
|
) {
|
|
126
|
-
const gradientColors = calculateGradientColors(
|
|
127
|
-
// @ts-expect-error TODO fix numbers
|
|
128
|
-
colors,
|
|
129
|
-
locations
|
|
130
|
-
)
|
|
120
|
+
const gradientColors = calculateGradientColors(colors, locations)
|
|
131
121
|
const angle = calculatePseudoAngle(width, height, startPoint, endPoint)
|
|
132
122
|
return `linear-gradient(${angle}deg, ${gradientColors.join(', ')})`
|
|
133
123
|
}
|
|
@@ -167,7 +157,10 @@ function calculatePseudoAngle(
|
|
|
167
157
|
return 90 + (Math.atan2(py, px) * 180) / Math.PI
|
|
168
158
|
}
|
|
169
159
|
|
|
170
|
-
function calculateGradientColors(
|
|
160
|
+
function calculateGradientColors(
|
|
161
|
+
colors: readonly string[],
|
|
162
|
+
locations?: readonly number[] | null
|
|
163
|
+
) {
|
|
171
164
|
return colors.map((color: string, index: number): string | void => {
|
|
172
165
|
const output = normalizeColor(color)
|
|
173
166
|
if (locations && locations[index] !== undefined) {
|
|
@@ -6,14 +6,6 @@ export type LinearGradientExtraProps = {
|
|
|
6
6
|
start?: LinearGradientPoint | null;
|
|
7
7
|
end?: LinearGradientPoint | null;
|
|
8
8
|
};
|
|
9
|
-
export declare const LinearGradient: import("@tamagui/core").TamaguiComponent<Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
|
|
10
|
-
elevation?: number | false | import("@tamagui/core").Size | undefined;
|
|
11
|
-
}>, "alignContent" | "alignItems" | "alignSelf" | "animateOnly" | "animatePresence" | "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" | "clipPath" | "color" | "columnGap" | "contain" | "containerName" | "containerType" | "cursor" | "direction" | "display" | "elevation" | "experimental_backgroundImage" | "experimental_backgroundPosition" | "experimental_backgroundRepeat" | "experimental_backgroundSize" | "filter" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "gap" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "height" | "inlineSize" | "inset" | "insetBlock" | "insetBlockEnd" | "insetBlockStart" | "insetInline" | "insetInlineEnd" | "insetInlineStart" | "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" | "objectFit" | "onTransition" | "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" | "resize" | "right" | "rotate" | "rotateX" | "rotateY" | "rotateZ" | "rotation" | "rowGap" | "scale" | "scaleX" | "scaleY" | "shadowColor" | "shadowOffset" | "shadowOpacity" | "shadowRadius" | "skewX" | "skewY" | "textEmphasis" | "textWrap" | "top" | "transform" | "transformMatrix" | "transformOrigin" | "transformStyle" | "transition" | "translateX" | "translateY" | "userSelect" | "verticalAlign" | "visibility" | "width" | "wordWrap" | "x" | "y" | "zIndex" | keyof LinearGradientExtraProps | keyof import("@tamagui/core").RNTamaguiViewNonStyleProps> & Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
|
|
12
|
-
elevation?: number | false | import("@tamagui/core").Size | undefined;
|
|
13
|
-
}>, keyof LinearGradientExtraProps> & LinearGradientExtraProps, import("@tamagui/core").TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps & Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
|
|
14
|
-
elevation?: number | false | import("@tamagui/core").Size | undefined;
|
|
15
|
-
}>, keyof LinearGradientExtraProps> & LinearGradientExtraProps, import("@tamagui/core").StackStyleBase, {
|
|
16
|
-
elevation?: number | false | import("@tamagui/core").Size | undefined;
|
|
17
|
-
}, import("@tamagui/core").StaticConfigPublic>;
|
|
9
|
+
export declare const LinearGradient: import("@tamagui/core").TamaguiComponent<import("@tamagui/core").TamaDefer, import("@tamagui/core").TamaguiElement, Omit<import("@tamagui/core").RNTamaguiViewNonStyleProps, "KhtmlBoxAlign" | "KhtmlBoxDirection" | "KhtmlBoxFlex" | "KhtmlBoxFlexGroup" | "KhtmlBoxLines" | "KhtmlBoxOrdinalGroup" | "KhtmlBoxOrient" | "KhtmlBoxPack" | "KhtmlLineBreak" | "KhtmlOpacity" | "KhtmlUserSelect" | "OAnimation" | "OAnimationDelay" | "OAnimationDirection" | "OAnimationDuration" | "OAnimationFillMode" | "OAnimationIterationCount" | "OAnimationName" | "OAnimationPlayState" | "OAnimationTimingFunction" | "OBackgroundSize" | "OBorderImage" | "OObjectFit" | "OObjectPosition" | "OTabSize" | "OTextOverflow" | "OTransform" | "OTransformOrigin" | "OTransition" | "OTransitionDelay" | "OTransitionDuration" | "OTransitionProperty" | "OTransitionTimingFunction" | "accentColor" | "alignContent" | "alignItems" | "alignSelf" | "alignTracks" | "alignmentBaseline" | "all" | "anchorName" | "anchorScope" | "animatePresence" | "animation" | "animationComposition" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationRange" | "animationRangeEnd" | "animationRangeStart" | "animationTimeline" | "animationTimingFunction" | "appearance" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "baselineShift" | "blockSize" | "border" | "borderBlock" | "borderBlockColor" | "borderBlockEnd" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStart" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBlockStyle" | "borderBlockWidth" | "borderBottom" | "borderBottomColor" | "borderBottomEndRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStartRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderColor" | "borderCurve" | "borderEndColor" | "borderEndEndRadius" | "borderEndStartRadius" | "borderEndWidth" | "borderImage" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderInline" | "borderInlineColor" | "borderInlineEnd" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStart" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderInlineStyle" | "borderInlineWidth" | "borderLeft" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRadius" | "borderRight" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStartColor" | "borderStartEndRadius" | "borderStartStartRadius" | "borderStartWidth" | "borderStyle" | "borderTop" | "borderTopColor" | "borderTopEndRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStartRadius" | "borderTopStyle" | "borderTopWidth" | "borderWidth" | "bottom" | "boxAlign" | "boxDecorationBreak" | "boxDirection" | "boxFlex" | "boxFlexGroup" | "boxLines" | "boxOrdinalGroup" | "boxOrient" | "boxPack" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "captionSide" | "caret" | "caretColor" | "caretShape" | "clear" | "clip" | "clipPath" | "clipRule" | "color" | "colorAdjust" | "colorInterpolation" | "colorInterpolationFilters" | "colorRendering" | "colorScheme" | "columnCount" | "columnFill" | "columnGap" | "columnRule" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "columns" | "contain" | "containIntrinsicBlockSize" | "containIntrinsicHeight" | "containIntrinsicInlineSize" | "containIntrinsicSize" | "containIntrinsicWidth" | "containerName" | "containerType" | "content" | "contentVisibility" | "counterIncrement" | "counterReset" | "counterSet" | "cursor" | "cx" | "cy" | "d" | "direction" | "display" | "dominantBaseline" | "emptyCells" | "experimental_backgroundImage" | "experimental_backgroundPosition" | "experimental_backgroundRepeat" | "experimental_backgroundSize" | "fieldSizing" | "fill" | "fillOpacity" | "fillRule" | "filter" | "flex" | "flexBasis" | "flexDirection" | "flexFlow" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "floodColor" | "floodOpacity" | "font" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontLanguageOverride" | "fontOpticalSizing" | "fontPalette" | "fontSize" | "fontSizeAdjust" | "fontSmooth" | "fontStretch" | "fontStyle" | "fontSynthesis" | "fontSynthesisPosition" | "fontSynthesisSmallCaps" | "fontSynthesisStyle" | "fontSynthesisWeight" | "fontVariant" | "fontVariantAlternates" | "fontVariantCaps" | "fontVariantEastAsian" | "fontVariantEmoji" | "fontVariantLigatures" | "fontVariantNumeric" | "fontVariantPosition" | "fontVariationSettings" | "fontWeight" | "fontWidth" | "forcedColorAdjust" | "gap" | "glyphOrientationVertical" | "grid" | "gridArea" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridGap" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplate" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "hangingPunctuation" | "height" | "hyphenateCharacter" | "hyphenateLimitChars" | "hyphens" | "imageOrientation" | "imageRendering" | "imageResolution" | "imeMode" | "initialLetter" | "initialLetterAlign" | "inlineSize" | "inset" | "insetArea" | "insetBlock" | "insetBlockEnd" | "insetBlockStart" | "insetInline" | "insetInlineEnd" | "insetInlineStart" | "interpolateSize" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "justifyTracks" | "left" | "letterSpacing" | "lightingColor" | "lineBreak" | "lineClamp" | "lineHeight" | "lineHeightStep" | "listStyle" | "listStyleImage" | "listStylePosition" | "listStyleType" | "margin" | "marginBlock" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginEnd" | "marginHorizontal" | "marginInline" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginStart" | "marginTop" | "marginTrim" | "marginVertical" | "marker" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "maskBorder" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "masonryAutoFlow" | "mathDepth" | "mathShift" | "mathStyle" | "matrix" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxLines" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "motion" | "motionDistance" | "motionPath" | "motionRotation" | "objectFit" | "objectPosition" | "objectViewBox" | "offset" | "offsetAnchor" | "offsetBlock" | "offsetBlockEnd" | "offsetBlockStart" | "offsetDistance" | "offsetInline" | "offsetInlineEnd" | "offsetInlineStart" | "offsetPath" | "offsetPosition" | "offsetRotate" | "offsetRotation" | "onTransition" | "opacity" | "order" | "orphans" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowAnchor" | "overflowBlock" | "overflowClipBox" | "overflowClipMargin" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "overlay" | "overscrollBehavior" | "overscrollBehaviorBlock" | "overscrollBehaviorInline" | "overscrollBehaviorX" | "overscrollBehaviorY" | "padding" | "paddingBlock" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingEnd" | "paddingHorizontal" | "paddingInline" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingStart" | "paddingTop" | "paddingVertical" | "page" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "paintOrder" | "passThrough" | "perspective" | "perspectiveOrigin" | "placeContent" | "placeItems" | "placeSelf" | "pointerEvents" | "position" | "positionAnchor" | "positionArea" | "positionTry" | "positionTryFallbacks" | "positionTryOptions" | "positionTryOrder" | "positionVisibility" | "printColorAdjust" | "quotes" | "r" | "resize" | "right" | "rotate" | "rotateX" | "rotateY" | "rotateZ" | "rowGap" | "rubyAlign" | "rubyMerge" | "rubyOverhang" | "rubyPosition" | "rx" | "ry" | "scale" | "scaleX" | "scaleY" | "scrollBehavior" | "scrollInitialTarget" | "scrollMargin" | "scrollMarginBlock" | "scrollMarginBlockEnd" | "scrollMarginBlockStart" | "scrollMarginBottom" | "scrollMarginInline" | "scrollMarginInlineEnd" | "scrollMarginInlineStart" | "scrollMarginLeft" | "scrollMarginRight" | "scrollMarginTop" | "scrollPadding" | "scrollPaddingBlock" | "scrollPaddingBlockEnd" | "scrollPaddingBlockStart" | "scrollPaddingBottom" | "scrollPaddingInline" | "scrollPaddingInlineEnd" | "scrollPaddingInlineStart" | "scrollPaddingLeft" | "scrollPaddingRight" | "scrollPaddingTop" | "scrollSnapAlign" | "scrollSnapCoordinate" | "scrollSnapDestination" | "scrollSnapMargin" | "scrollSnapMarginBottom" | "scrollSnapMarginLeft" | "scrollSnapMarginRight" | "scrollSnapMarginTop" | "scrollSnapPointsX" | "scrollSnapPointsY" | "scrollSnapStop" | "scrollSnapType" | "scrollSnapTypeX" | "scrollSnapTypeY" | "scrollTimeline" | "scrollTimelineAxis" | "scrollTimelineName" | "scrollbarColor" | "scrollbarGutter" | "scrollbarWidth" | "shadowColor" | "shadowOffset" | "shadowOpacity" | "shadowRadius" | "shapeImageThreshold" | "shapeMargin" | "shapeOutside" | "shapeRendering" | "skewX" | "skewY" | "speakAs" | "stopColor" | "stopOpacity" | "stroke" | "strokeColor" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "tabSize" | "tableLayout" | "textAlign" | "textAlignLast" | "textAnchor" | "textAutospace" | "textBox" | "textBoxEdge" | "textBoxTrim" | "textCombineUpright" | "textDecoration" | "textDecorationColor" | "textDecorationLine" | "textDecorationSkip" | "textDecorationSkipInk" | "textDecorationStyle" | "textDecorationThickness" | "textEmphasis" | "textEmphasisColor" | "textEmphasisPosition" | "textEmphasisStyle" | "textIndent" | "textJustify" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textSizeAdjust" | "textSpacingTrim" | "textTransform" | "textUnderlineOffset" | "textUnderlinePosition" | "textWrap" | "textWrapMode" | "textWrapStyle" | "timelineScope" | "top" | "touchAction" | "transform" | "transformBox" | "transformOrigin" | "transformStyle" | "transition" | "transitionBehavior" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "translate" | "unicodeBidi" | "userSelect" | "vectorEffect" | "verticalAlign" | "viewTimeline" | "viewTimelineAxis" | "viewTimelineInset" | "viewTimelineName" | "viewTransitionClass" | "viewTransitionName" | "visibility" | "whiteSpace" | "whiteSpaceCollapse" | "widows" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "writingMode" | "x" | "y" | "zIndex" | "zoom" | keyof LinearGradientExtraProps | keyof import("@tamagui/core").RNTamaguiViewNonStyleProps> & Omit<import("@tamagui/core").GetFinalProps<import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {}>, keyof LinearGradientExtraProps> & LinearGradientExtraProps, import("@tamagui/core").StackStyleBase, Omit<{}, "KhtmlBoxAlign" | "KhtmlBoxDirection" | "KhtmlBoxFlex" | "KhtmlBoxFlexGroup" | "KhtmlBoxLines" | "KhtmlBoxOrdinalGroup" | "KhtmlBoxOrient" | "KhtmlBoxPack" | "KhtmlLineBreak" | "KhtmlOpacity" | "KhtmlUserSelect" | "OAnimation" | "OAnimationDelay" | "OAnimationDirection" | "OAnimationDuration" | "OAnimationFillMode" | "OAnimationIterationCount" | "OAnimationName" | "OAnimationPlayState" | "OAnimationTimingFunction" | "OBackgroundSize" | "OBorderImage" | "OObjectFit" | "OObjectPosition" | "OTabSize" | "OTextOverflow" | "OTransform" | "OTransformOrigin" | "OTransition" | "OTransitionDelay" | "OTransitionDuration" | "OTransitionProperty" | "OTransitionTimingFunction" | "accentColor" | "alignContent" | "alignItems" | "alignSelf" | "alignTracks" | "alignmentBaseline" | "all" | "anchorName" | "anchorScope" | "animatePresence" | "animation" | "animationComposition" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationRange" | "animationRangeEnd" | "animationRangeStart" | "animationTimeline" | "animationTimingFunction" | "appearance" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "background" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "baselineShift" | "blockSize" | "border" | "borderBlock" | "borderBlockColor" | "borderBlockEnd" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStart" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBlockStyle" | "borderBlockWidth" | "borderBottom" | "borderBottomColor" | "borderBottomEndRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStartRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderColor" | "borderCurve" | "borderEndColor" | "borderEndEndRadius" | "borderEndStartRadius" | "borderEndWidth" | "borderImage" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderInline" | "borderInlineColor" | "borderInlineEnd" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStart" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderInlineStyle" | "borderInlineWidth" | "borderLeft" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRadius" | "borderRight" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStartColor" | "borderStartEndRadius" | "borderStartStartRadius" | "borderStartWidth" | "borderStyle" | "borderTop" | "borderTopColor" | "borderTopEndRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStartRadius" | "borderTopStyle" | "borderTopWidth" | "borderWidth" | "bottom" | "boxAlign" | "boxDecorationBreak" | "boxDirection" | "boxFlex" | "boxFlexGroup" | "boxLines" | "boxOrdinalGroup" | "boxOrient" | "boxPack" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "captionSide" | "caret" | "caretColor" | "caretShape" | "clear" | "clip" | "clipPath" | "clipRule" | "color" | "colorAdjust" | "colorInterpolation" | "colorInterpolationFilters" | "colorRendering" | "colorScheme" | "columnCount" | "columnFill" | "columnGap" | "columnRule" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "columns" | "contain" | "containIntrinsicBlockSize" | "containIntrinsicHeight" | "containIntrinsicInlineSize" | "containIntrinsicSize" | "containIntrinsicWidth" | "containerName" | "containerType" | "content" | "contentVisibility" | "counterIncrement" | "counterReset" | "counterSet" | "cursor" | "cx" | "cy" | "d" | "direction" | "display" | "dominantBaseline" | "emptyCells" | "experimental_backgroundImage" | "experimental_backgroundPosition" | "experimental_backgroundRepeat" | "experimental_backgroundSize" | "fieldSizing" | "fill" | "fillOpacity" | "fillRule" | "filter" | "flex" | "flexBasis" | "flexDirection" | "flexFlow" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "floodColor" | "floodOpacity" | "font" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontLanguageOverride" | "fontOpticalSizing" | "fontPalette" | "fontSize" | "fontSizeAdjust" | "fontSmooth" | "fontStretch" | "fontStyle" | "fontSynthesis" | "fontSynthesisPosition" | "fontSynthesisSmallCaps" | "fontSynthesisStyle" | "fontSynthesisWeight" | "fontVariant" | "fontVariantAlternates" | "fontVariantCaps" | "fontVariantEastAsian" | "fontVariantEmoji" | "fontVariantLigatures" | "fontVariantNumeric" | "fontVariantPosition" | "fontVariationSettings" | "fontWeight" | "fontWidth" | "forcedColorAdjust" | "gap" | "glyphOrientationVertical" | "grid" | "gridArea" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumn" | "gridColumnEnd" | "gridColumnGap" | "gridColumnStart" | "gridGap" | "gridRow" | "gridRowEnd" | "gridRowGap" | "gridRowStart" | "gridTemplate" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "hangingPunctuation" | "height" | "hyphenateCharacter" | "hyphenateLimitChars" | "hyphens" | "imageOrientation" | "imageRendering" | "imageResolution" | "imeMode" | "initialLetter" | "initialLetterAlign" | "inlineSize" | "inset" | "insetArea" | "insetBlock" | "insetBlockEnd" | "insetBlockStart" | "insetInline" | "insetInlineEnd" | "insetInlineStart" | "interpolateSize" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "justifyTracks" | "left" | "letterSpacing" | "lightingColor" | "lineBreak" | "lineClamp" | "lineHeight" | "lineHeightStep" | "listStyle" | "listStyleImage" | "listStylePosition" | "listStyleType" | "margin" | "marginBlock" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginEnd" | "marginHorizontal" | "marginInline" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginStart" | "marginTop" | "marginTrim" | "marginVertical" | "marker" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "maskBorder" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "masonryAutoFlow" | "mathDepth" | "mathShift" | "mathStyle" | "matrix" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxLines" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "motion" | "motionDistance" | "motionPath" | "motionRotation" | "objectFit" | "objectPosition" | "objectViewBox" | "offset" | "offsetAnchor" | "offsetBlock" | "offsetBlockEnd" | "offsetBlockStart" | "offsetDistance" | "offsetInline" | "offsetInlineEnd" | "offsetInlineStart" | "offsetPath" | "offsetPosition" | "offsetRotate" | "offsetRotation" | "onTransition" | "opacity" | "order" | "orphans" | "outline" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowAnchor" | "overflowBlock" | "overflowClipBox" | "overflowClipMargin" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "overlay" | "overscrollBehavior" | "overscrollBehaviorBlock" | "overscrollBehaviorInline" | "overscrollBehaviorX" | "overscrollBehaviorY" | "padding" | "paddingBlock" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingEnd" | "paddingHorizontal" | "paddingInline" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingStart" | "paddingTop" | "paddingVertical" | "page" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "paintOrder" | "passThrough" | "perspective" | "perspectiveOrigin" | "placeContent" | "placeItems" | "placeSelf" | "pointerEvents" | "position" | "positionAnchor" | "positionArea" | "positionTry" | "positionTryFallbacks" | "positionTryOptions" | "positionTryOrder" | "positionVisibility" | "printColorAdjust" | "quotes" | "r" | "resize" | "right" | "rotate" | "rotateX" | "rotateY" | "rotateZ" | "rowGap" | "rubyAlign" | "rubyMerge" | "rubyOverhang" | "rubyPosition" | "rx" | "ry" | "scale" | "scaleX" | "scaleY" | "scrollBehavior" | "scrollInitialTarget" | "scrollMargin" | "scrollMarginBlock" | "scrollMarginBlockEnd" | "scrollMarginBlockStart" | "scrollMarginBottom" | "scrollMarginInline" | "scrollMarginInlineEnd" | "scrollMarginInlineStart" | "scrollMarginLeft" | "scrollMarginRight" | "scrollMarginTop" | "scrollPadding" | "scrollPaddingBlock" | "scrollPaddingBlockEnd" | "scrollPaddingBlockStart" | "scrollPaddingBottom" | "scrollPaddingInline" | "scrollPaddingInlineEnd" | "scrollPaddingInlineStart" | "scrollPaddingLeft" | "scrollPaddingRight" | "scrollPaddingTop" | "scrollSnapAlign" | "scrollSnapCoordinate" | "scrollSnapDestination" | "scrollSnapMargin" | "scrollSnapMarginBottom" | "scrollSnapMarginLeft" | "scrollSnapMarginRight" | "scrollSnapMarginTop" | "scrollSnapPointsX" | "scrollSnapPointsY" | "scrollSnapStop" | "scrollSnapType" | "scrollSnapTypeX" | "scrollSnapTypeY" | "scrollTimeline" | "scrollTimelineAxis" | "scrollTimelineName" | "scrollbarColor" | "scrollbarGutter" | "scrollbarWidth" | "shadowColor" | "shadowOffset" | "shadowOpacity" | "shadowRadius" | "shapeImageThreshold" | "shapeMargin" | "shapeOutside" | "shapeRendering" | "skewX" | "skewY" | "speakAs" | "stopColor" | "stopOpacity" | "stroke" | "strokeColor" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "tabSize" | "tableLayout" | "textAlign" | "textAlignLast" | "textAnchor" | "textAutospace" | "textBox" | "textBoxEdge" | "textBoxTrim" | "textCombineUpright" | "textDecoration" | "textDecorationColor" | "textDecorationLine" | "textDecorationSkip" | "textDecorationSkipInk" | "textDecorationStyle" | "textDecorationThickness" | "textEmphasis" | "textEmphasisColor" | "textEmphasisPosition" | "textEmphasisStyle" | "textIndent" | "textJustify" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textSizeAdjust" | "textSpacingTrim" | "textTransform" | "textUnderlineOffset" | "textUnderlinePosition" | "textWrap" | "textWrapMode" | "textWrapStyle" | "timelineScope" | "top" | "touchAction" | "transform" | "transformBox" | "transformOrigin" | "transformStyle" | "transition" | "transitionBehavior" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "translate" | "unicodeBidi" | "userSelect" | "vectorEffect" | "verticalAlign" | "viewTimeline" | "viewTimelineAxis" | "viewTimelineInset" | "viewTimelineName" | "viewTransitionClass" | "viewTransitionName" | "visibility" | "whiteSpace" | "whiteSpaceCollapse" | "widows" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "writingMode" | "x" | "y" | "zIndex" | "zoom" | keyof LinearGradientExtraProps | keyof import("@tamagui/core").RNTamaguiViewNonStyleProps>, import("@tamagui/core").StaticConfigPublic>;
|
|
18
10
|
export type LinearGradientProps = GetProps<typeof LinearGradient>;
|
|
19
11
|
//# sourceMappingURL=LinearGradient.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinearGradient.d.ts","sourceRoot":"","sources":["../src/LinearGradient.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAYvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;
|
|
1
|
+
{"version":3,"file":"LinearGradient.d.ts","sourceRoot":"","sources":["../src/LinearGradient.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAYvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAG5D,MAAM,MAAM,wBAAwB,GAAG;IACrC,MAAM,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,EAAE,CAAA;IACtD,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;IAC3B,KAAK,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAA;IAClC,GAAG,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAA;CACjC,CAAA;AAQD,eAAO,MAAM,cAAc,snsBA6C1B,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAA"}
|
|
@@ -5,8 +5,19 @@
|
|
|
5
5
|
* MIT License
|
|
6
6
|
* Copyright (c) 2015-present 650 Industries, Inc. (aka Expo)
|
|
7
7
|
*/
|
|
8
|
-
import
|
|
9
|
-
export type { LinearGradientPoint, LinearGradientProps } from 'expo-linear-gradient';
|
|
8
|
+
import { View } from '@tamagui/core';
|
|
10
9
|
import * as React from 'react';
|
|
10
|
+
type NativeLinearGradientPoint = [x: number, y: number];
|
|
11
|
+
export type LinearGradientPoint = {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
} | NativeLinearGradientPoint;
|
|
15
|
+
export type LinearGradientProps = Omit<React.ComponentProps<typeof View>, 'start' | 'end'> & {
|
|
16
|
+
colors: readonly string[];
|
|
17
|
+
locations?: readonly number[] | null;
|
|
18
|
+
start?: LinearGradientPoint | null;
|
|
19
|
+
end?: LinearGradientPoint | null;
|
|
20
|
+
};
|
|
11
21
|
export declare function LinearGradient({ colors, locations, start, end, ...props }: LinearGradientProps): React.JSX.Element;
|
|
22
|
+
export {};
|
|
12
23
|
//# sourceMappingURL=linear-gradient.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"linear-gradient.d.ts","sourceRoot":"","sources":["../src/linear-gradient.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;
|
|
1
|
+
{"version":3,"file":"linear-gradient.d.ts","sourceRoot":"","sources":["../src/linear-gradient.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,IAAI,EAAkB,MAAM,eAAe,CAAA;AACpD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,KAAK,yBAAyB,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,CAAA;AAEvD,MAAM,MAAM,mBAAmB,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,yBAAyB,CAAA;AAGtF,MAAM,MAAM,mBAAmB,GAAG,IAAI,CACpC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EACjC,OAAO,GAAG,KAAK,CAChB,GAAG;IACF,MAAM,EAAE,SAAS,MAAM,EAAE,CAAA;IACzB,SAAS,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI,CAAA;IACpC,KAAK,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAA;IAClC,GAAG,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAA;CACjC,CAAA;AAuBD,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,mBAAmB,qBAwDrB"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { getLinearGradient } from '@tamagui/native'
|
|
2
|
-
|
|
3
|
-
export type { LinearGradientProps, LinearGradientPoint } from 'expo-linear-gradient'
|
|
4
|
-
|
|
5
|
-
export function LinearGradient(props: any) {
|
|
6
|
-
const state = getLinearGradient().state
|
|
7
|
-
if (state.enabled && state.Component) {
|
|
8
|
-
const ExpoLinearGradient = state.Component
|
|
9
|
-
return <ExpoLinearGradient {...props} />
|
|
10
|
-
}
|
|
11
|
-
console.warn(
|
|
12
|
-
`Warning: Must call import '@tamagui/native/setup-expo-linear-gradient' at root`
|
|
13
|
-
)
|
|
14
|
-
return
|
|
15
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"linear-gradient.native.d.ts","sourceRoot":"","sources":["../src/linear-gradient.native.tsx"],"names":[],"mappings":"AAEA,YAAY,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAA;AAEpF,wBAAgB,cAAc,CAAC,KAAK,EAAE,GAAG,2CAUxC"}
|