@tamagui/linear-gradient 1.116.1 → 1.116.3

package/dist/cjs/LinearGradient.js

@@ -0,0 +1,57 @@
+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: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__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: !0 }), mod);
+var LinearGradient_exports = {};
+__export(LinearGradient_exports, {
+  LinearGradient: () => LinearGradient
+});
+module.exports = __toCommonJS(LinearGradient_exports);
+var import_core = require("@tamagui/core"), import_stacks = require("@tamagui/stacks"), import_linear_gradient = require("./linear-gradient"), import_jsx_runtime = require("react/jsx-runtime");
+const LinearGradientFrame = (0, import_core.styled)(import_stacks.YStack, {
+  name: "LinearGradient",
+  overflow: "hidden",
+  position: "relative"
+}), LinearGradient = LinearGradientFrame.styleable(
+  (propsIn, ref) => {
+    const props = (0, import_core.useProps)(propsIn), { start, end, colors: colorsProp, locations, children, ...stackProps } = props, theme = (0, import_core.useTheme)();
+    let colors = props.colors?.map((c) => theme[c]?.get("web") ?? c) || [];
+    return process.env.NODE_ENV !== "production" && colors.some((c) => {
+      const normalized = (0, import_core.normalizeColor)(c);
+      if (!normalized || normalized.startsWith("$"))
+        return !0;
+    }) && (console.error(
+      `LinearGradient: "colors" prop contains invalid color tokens: ${colors} fallback to default colors: ["#000", "#fff"]`
+    ), colors = ["#000", "#fff"]), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(LinearGradientFrame, { ref, ...stackProps, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_linear_gradient.LinearGradient,
+        {
+          start,
+          end,
+          colors,
+          locations,
+          style: gradientStyle
+        }
+      ),
+      children
+    ] });
+  }
+), gradientStyle = {
+  position: "absolute",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+  zIndex: 0
+};
+//# sourceMappingURL=LinearGradient.js.map

package/dist/cjs/index.js

@@ -0,0 +1,15 @@
+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))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+}, __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./LinearGradient"), module.exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/linear-gradient.js

@@ -0,0 +1,99 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
+  mod
+)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var linear_gradient_exports = {};
+__export(linear_gradient_exports, {
+  LinearGradient: () => LinearGradient
+});
+module.exports = __toCommonJS(linear_gradient_exports);
+var import_core = require("@tamagui/core"), React = __toESM(require("react")), import_react_native = require("react-native-web"), import_jsx_runtime = require("react/jsx-runtime");
+function LinearGradient({
+  colors,
+  locations,
+  start,
+  end,
+  ...props
+}) {
+  const [{ height, width }, setLayout] = React.useState({
+    height: 1,
+    width: 1
+  }), linearGradientBackgroundImage = React.useMemo(() => getLinearGradientBackgroundImage(
+    // @ts-expect-error ok
+    colors,
+    locations,
+    start,
+    end,
+    width,
+    height
+  ), [colors, locations, start, end, width, height]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_react_native.View,
+    {
+      ...props,
+      style: [
+        props.style,
+        // @ts-ignore: [ts] Property 'backgroundImage' does not exist on type 'ViewStyle'.
+        { backgroundImage: linearGradientBackgroundImage }
+      ],
+      onLayout: (event) => {
+        const { width: width2, height: height2 } = event.nativeEvent.layout;
+        setLayout((oldLayout) => width2 !== oldLayout.width || height2 !== oldLayout.height ? { height: height2, width: width2 } : oldLayout), props.onLayout && props.onLayout(event);
+      }
+    }
+  );
+}
+function getLinearGradientBackgroundImage(colors, locations, startPoint, endPoint, width = 1, height = 1) {
+  const gradientColors = calculateGradientColors(
+    // @ts-expect-error TODO fix numbers
+    colors,
+    locations
+  );
+  return `linear-gradient(${calculatePseudoAngle(width, height, startPoint, endPoint)}deg, ${gradientColors.join(", ")})`;
+}
+function calculatePseudoAngle(width, height, startPoint, endPoint) {
+  const getControlPoints = () => {
+    let correctedStartPoint = [0, 0];
+    Array.isArray(startPoint) && (correctedStartPoint = [
+      startPoint[0] != null ? startPoint[0] : 0,
+      startPoint[1] != null ? startPoint[1] : 0
+    ]);
+    let correctedEndPoint = [0, 1];
+    return Array.isArray(endPoint) && (correctedEndPoint = [
+      endPoint[0] != null ? endPoint[0] : 0,
+      endPoint[1] != null ? endPoint[1] : 1
+    ]), [correctedStartPoint, correctedEndPoint];
+  }, [start, end] = getControlPoints();
+  start[0] *= width, end[0] *= width, start[1] *= height, end[1] *= height;
+  const py = end[1] - start[1], px = end[0] - start[0];
+  return 90 + Math.atan2(py, px) * 180 / Math.PI;
+}
+function calculateGradientColors(colors, locations) {
+  return colors.map((color, index) => {
+    const output = (0, import_core.normalizeColor)(color);
+    if (locations && locations[index]) {
+      const percentage = Math.max(0, Math.min(1, locations[index])) * 100;
+      return `${output} ${percentage}%`;
+    }
+    return output;
+  });
+}
+//# sourceMappingURL=linear-gradient.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/linear-gradient",
-  "version": "1.116.1",
+  "version": "1.116.3",
   "sideEffects": [
     "*.css"
   ],
@@ -34,11 +34,11 @@
     }
   },
   "dependencies": {
-    "@tamagui/core": "1.116.1",
-    "@tamagui/stacks": "1.116.1"
+    "@tamagui/core": "1.116.3",
+    "@tamagui/stacks": "1.116.3"
   },
   "devDependencies": {
-    "@tamagui/build": "1.116.1",
+    "@tamagui/build": "1.116.3",
     "expo-linear-gradient": "~13.0.2",
     "react": "^18.2.0 || ^19.0.0"
   },

package/dist/cjs/linear-gradient.native.cjs

@@ -1,26 +0,0 @@
-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: !0
-    });
-  },
-  __copyProps = (to, from, except, desc) => {
-    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
-}), mod);
-var linear_gradient_native_exports = {};
-__export(linear_gradient_native_exports, {
-  LinearGradient: () => import_expo_linear_gradient.LinearGradient
-});
-module.exports = __toCommonJS(linear_gradient_native_exports);
-var import_expo_linear_gradient = require("expo-linear-gradient");

package/dist/cjs/linear-gradient.native.cjs.map

@@ -1,6 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/linear-gradient.native.tsx"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kCAA+B;",
-  "names": []
-}