@react-email/code-inline - npm Package Compare versions

Comparing version 0.0.5 to 0.0.6-tailwindv4.0

dist/index.d.mts.map

+{"version":3,"file":"index.d.mts","names":[],"sources":["../src/code-inline.tsx"],"sourcesContent":[],"mappings":";;;KAEK,SAAA,GAAY,KAAA,CAAM,mCACrB,KAAA,CAAM;KAEI,eAAA,GAAkB,SAAS;AALR;;;;AAGC,cAQnB,UARmB,EAQT,KAAA,CAAA,yBARS,CAQT,QARS,CAQT,SARS,CAAA,GAQT,KAAA,CAAA,aARS,CAQT,eARS,CAAA,CAAA"}

dist/index.d.ts.map

+{"version":3,"file":"index.d.ts","names":[],"sources":["../src/code-inline.tsx"],"sourcesContent":[],"mappings":";;;KAEK,SAAA,GAAY,KAAA,CAAM,mCACrB,KAAA,CAAM;KAEI,eAAA,GAAkB,SAAS;AALR;;;;AAGC,cAQnB,UARmB,EAQT,KAAA,CAAA,yBARS,CAQT,QARS,CAQT,SARS,CAAA,GAQT,KAAA,CAAA,aARS,CAQT,eARS,CAAA,CAAA"}

dist/index.mjs.map

+{"version":3,"file":"index.mjs","names":[],"sources":["../src/code-inline.tsx"],"sourcesContent":["import * as React from 'react';\n\ntype RootProps = React.ComponentPropsWithoutRef<'code'> &\n  React.ComponentPropsWithoutRef<'span'>;\n\nexport type CodeInlineProps = Readonly<RootProps>;\n\n/**\n * If you are sending emails for users that have the Orange.fr email client,\n * beware that this component will only work when you have a head containing meta tags.\n */\nexport const CodeInline = React.forwardRef<HTMLSpanElement, CodeInlineProps>(\n  ({ children, ...props }, ref) => {\n    return (\n      <>\n        {/* \n    This style tag is targeted at fixing an issue for the Orange.fr email client\n    See:\n    - https://www.caniemail.com/features/html-code/\n    - https://www.howtotarget.email/#2019-03-26-freenet-2\n\n    On that email client, the head and html elements are removed, making the meta tag a sibling of them\n    allowing us to use a selector on them. Also <style> tags are supported on it.\n    */}\n        <style>{`\n        meta ~ .cino {\n          display: none !important;\n          opacity: 0 !important;\n        }\n\n        meta ~ .cio {\n          display: block !important;\n        }\n      `}</style>\n\n        {/* Does not render on Orange.fr */}\n        <code\n          {...props}\n          className={`${props.className ? props.className : ''} cino`}\n        >\n          {children}\n        </code>\n\n        {/* Renders only on Orange.fr */}\n        <span\n          {...props}\n          className={`${props.className ? props.className : ''} cio`}\n          ref={ref}\n          style={{ display: 'none', ...props.style }}\n        >\n          {children}\n        </span>\n      </>\n    );\n  },\n);\n\nCodeInline.displayName = 'CodeInline';\n(CodeInline as any).tailwindTreatAsElement = true;\n"],"mappings":";;;;;;;;AAWA,MAAa,aAAa,MAAM,YAC7B,EAAE,SAAU,GAAG,SAAS,QAAQ;AAC/B,QACE;EAUE,oBAAC,qBAAO;;;;;;;;;UASA;EAGR,oBAAC;GACC,GAAI;GACJ,WAAW,GAAG,MAAM,YAAY,MAAM,YAAY,GAAG;GAEpD;IACI;EAGP,oBAAC;GACC,GAAI;GACJ,WAAW,GAAG,MAAM,YAAY,MAAM,YAAY,GAAG;GAChD;GACL,OAAO;IAAE,SAAS;IAAQ,GAAG,MAAM;IAAO;GAEzC;IACI;KACN;EAGR;AAED,WAAW,cAAc;AACzB,AAAC,WAAmB,yBAAyB"}

dist/index.d.mts

@@ -1,4 +0,5 @@
-import * as React from 'react';
+import * as React from "react";
 
-type RootProps = React.ComponentPropsWithoutRef<"code"> & React.ComponentPropsWithoutRef<"span">;
+//#region src/code-inline.d.ts
+type RootProps = React.ComponentPropsWithoutRef<'code'> & React.ComponentPropsWithoutRef<'span'>;
 type CodeInlineProps = Readonly<RootProps>;
@@ -10,3 +11,4 @@ /**
 declare const CodeInline: React.ForwardRefExoticComponent<Readonly<RootProps> & React.RefAttributes<HTMLSpanElement>>;
-
+//#endregion
 export { CodeInline, CodeInlineProps };
+//# sourceMappingURL=index.d.mts.map

dist/index.d.ts

@@ -1,4 +0,5 @@
-import * as React from 'react';
+import * as React from "react";
 
-type RootProps = React.ComponentPropsWithoutRef<"code"> & React.ComponentPropsWithoutRef<"span">;
+//#region src/code-inline.d.ts
+type RootProps = React.ComponentPropsWithoutRef<'code'> & React.ComponentPropsWithoutRef<'span'>;
 type CodeInlineProps = Readonly<RootProps>;
@@ -10,3 +11,4 @@ /**
 declare const CodeInline: React.ForwardRefExoticComponent<Readonly<RootProps> & React.RefAttributes<HTMLSpanElement>>;
-
+//#endregion
 export { CodeInline, CodeInlineProps };
+//# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,74 +0,37 @@
-"use strict";
+//#region rolldown:runtime
 var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-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;
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, 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: true }) : target,
-  mod
-));
-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));
 
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  CodeInline: () => CodeInline
-});
-module.exports = __toCommonJS(src_exports);
+//#endregion
+let react = require("react");
+react = __toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = __toESM(react_jsx_runtime);
 
-// src/code-inline.tsx
-var React = __toESM(require("react"));
-var import_jsx_runtime = require("react/jsx-runtime");
-var CodeInline = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: `
+//#region src/code-inline.tsx
+/**
+* If you are sending emails for users that have the Orange.fr email client,
+* beware that this component will only work when you have a head containing meta tags.
+*/
+const CodeInline = react.forwardRef(({ children,...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: `
         meta ~ .cino {
@@ -83,25 +46,23 @@ display: none !important;
       ` }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "code",
-        __spreadProps(__spreadValues({}, props), {
-          className: `${props.className ? props.className : ""} cino`,
-          children
-        })
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "span",
-        __spreadProps(__spreadValues({}, props), {
-          className: `${props.className ? props.className : ""} cio`,
-          ref,
-          style: __spreadValues({ display: "none" }, props.style),
-          children
-        })
-      )
-    ] });
-  }
-);
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+			...props,
+			className: `${props.className ? props.className : ""} cino`,
+			children
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			...props,
+			className: `${props.className ? props.className : ""} cio`,
+			ref,
+			style: {
+				display: "none",
+				...props.style
+			},
+			children
+		})
+	] });
+});
 CodeInline.displayName = "CodeInline";
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  CodeInline
-});
+CodeInline.tailwindTreatAsElement = true;
+
+//#endregion
+exports.CodeInline = CodeInline;

dist/index.mjs

@@ -1,41 +0,12 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-
-// src/code-inline.tsx
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var CodeInline = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("style", { children: `
+
+//#region src/code-inline.tsx
+/**
+* If you are sending emails for users that have the Orange.fr email client,
+* beware that this component will only work when you have a head containing meta tags.
+*/
+const CodeInline = React.forwardRef(({ children,...props }, ref) => {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("style", { children: `
         meta ~ .cino {
@@ -50,24 +21,24 @@ display: none !important;
       ` }),
-      /* @__PURE__ */ jsx(
-        "code",
-        __spreadProps(__spreadValues({}, props), {
-          className: `${props.className ? props.className : ""} cino`,
-          children
-        })
-      ),
-      /* @__PURE__ */ jsx(
-        "span",
-        __spreadProps(__spreadValues({}, props), {
-          className: `${props.className ? props.className : ""} cio`,
-          ref,
-          style: __spreadValues({ display: "none" }, props.style),
-          children
-        })
-      )
-    ] });
-  }
-);
+		/* @__PURE__ */ jsx("code", {
+			...props,
+			className: `${props.className ? props.className : ""} cino`,
+			children
+		}),
+		/* @__PURE__ */ jsx("span", {
+			...props,
+			className: `${props.className ? props.className : ""} cio`,
+			ref,
+			style: {
+				display: "none",
+				...props.style
+			},
+			children
+		})
+	] });
+});
 CodeInline.displayName = "CodeInline";
-export {
-  CodeInline
-};
+CodeInline.tailwindTreatAsElement = true;
+
+//#endregion
+export { CodeInline };
+//# sourceMappingURL=index.mjs.map

package.json

 {
   "name": "@react-email/code-inline",
-  "version": "0.0.5",
+  "version": "0.0.6-tailwindv4.0",
   "description": "Display a predictable inline code HTML element that works on all email clients",
@@ -35,15 +35,11 @@ "sideEffects": false,
   "devDependencies": {
-    "tsup": "7.2.0",
-    "typescript": "5.1.6",
-    "vitest": "1.1.0",
-    "@react-email/render": "1.0.3",
-    "eslint-config-custom": "0.0.0",
+    "typescript": "5.8.3",
+    "@react-email/render": "1.3.1",
     "tsconfig": "0.0.0"
   },
   "scripts": {
-    "dev": "pnpm build --watch",
-    "clean": "rm -rf dist",
-    "build": "tsup src/index.ts --format esm,cjs --dts --external react",
-    "lint": "eslint ."
+    "build": "tsdown src/index.ts --format esm,cjs --dts --external react",
+    "build:watch": "tsdown src/index.ts --format esm,cjs --dts --external react --watch",
+    "clean": "rm -rf dist"
   }
 }

readme.md

@@ -7,7 +7,6 @@ ![React Email code-inline cover](https://react.email/static/covers/code-inline.png)
 <div align="center">
-<a href="https://react.email">Website</a> 
+<a href="https://react.email">Website</a>
 <span> · </span>
-<a href="https://github.com/resendlabs/react-email">GitHub</a> 
-<span> · </span>
-<a href="https://react.email/discord">Discord</a>
+<a href="https://github.com/resendlabs/react-email">GitHub</a>
+
 </div>
@@ -14,0 +13,0 @@

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Improved metrics

Dev dependency count

3

-50%

Number of package files

10

42.86%

Worsened metrics

Total package byte prevSize

12336

-1.34%

Lines of code

112

-38.46%

Number of lines in readme file

52

-1.89%

Number of medium supply chain risk alerts

1

Infinity%

No dependency changes