@jedd-icons/react 0.0.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 jedd-labs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/Icon.cjs

@@ -0,0 +1,33 @@
+"use client";
+const require_defaultAttributes = require("./shared/dist/defaultAttributes.cjs");
+const require_resolveStrokeWidth = require("./shared/dist/resolveStrokeWidth.cjs");
+let react = require("react");
+//#region src/Icon.tsx
+const Icon = (0, react.forwardRef)(({ iconNode, variant = "stroke", size = 24, color = "currentColor", strokeWidth = 2, absoluteStrokeWidth = false, className, children, ...rest }, ref) => {
+	const defaults = require_defaultAttributes.variantDefaultsCamel[variant];
+	const hasA11y = "aria-label" in rest || "aria-labelledby" in rest || "role" in rest;
+	const svgProps = {
+		ref,
+		...defaults,
+		width: size,
+		height: size,
+		className,
+		...children || hasA11y ? {} : { "aria-hidden": true }
+	};
+	if (variant === "stroke") {
+		svgProps.stroke = color;
+		svgProps.strokeWidth = require_resolveStrokeWidth.resolveStrokeWidth(strokeWidth, size, absoluteStrokeWidth);
+	} else svgProps.fill = color;
+	return (0, react.createElement)("svg", {
+		...svgProps,
+		...rest
+	}, [...iconNode.map(function renderNode([tag, attrs, nested], i) {
+		return (0, react.createElement)(tag, {
+			key: `c-${i}`,
+			...attrs
+		}, ...nested?.map(renderNode) ?? []);
+	}), ...(Array.isArray(children) ? children : [children]).filter(Boolean)]);
+});
+Icon.displayName = "Icon";
+//#endregion
+exports.default = Icon;

package/dist/Icon.d.cts

@@ -0,0 +1,12 @@
+import { Variant } from "./shared/dist/defaultAttributes.cjs";
+import { IconNode } from "./shared/dist/types.cjs";
+import { IconProps } from "./types.cjs";
+
+//#region src/Icon.d.ts
+interface InternalProps extends IconProps {
+  iconNode: IconNode;
+  variant?: Variant;
+}
+declare const Icon: import("react").ForwardRefExoticComponent<InternalProps & import("react").RefAttributes<SVGSVGElement>>;
+//#endregion
+export { Icon };

package/dist/Icon.d.mts

@@ -0,0 +1,12 @@
+import { Variant } from "./shared/dist/defaultAttributes.mjs";
+import { IconNode } from "./shared/dist/types.mjs";
+import { IconProps } from "./types.mjs";
+
+//#region src/Icon.d.ts
+interface InternalProps extends IconProps {
+  iconNode: IconNode;
+  variant?: Variant;
+}
+declare const Icon: import("react").ForwardRefExoticComponent<InternalProps & import("react").RefAttributes<SVGSVGElement>>;
+//#endregion
+export { Icon };

package/dist/Icon.mjs

@@ -0,0 +1,33 @@
+"use client";
+import { variantDefaultsCamel } from "./shared/dist/defaultAttributes.mjs";
+import { resolveStrokeWidth } from "./shared/dist/resolveStrokeWidth.mjs";
+import { createElement, forwardRef } from "react";
+//#region src/Icon.tsx
+const Icon = forwardRef(({ iconNode, variant = "stroke", size = 24, color = "currentColor", strokeWidth = 2, absoluteStrokeWidth = false, className, children, ...rest }, ref) => {
+	const defaults = variantDefaultsCamel[variant];
+	const hasA11y = "aria-label" in rest || "aria-labelledby" in rest || "role" in rest;
+	const svgProps = {
+		ref,
+		...defaults,
+		width: size,
+		height: size,
+		className,
+		...children || hasA11y ? {} : { "aria-hidden": true }
+	};
+	if (variant === "stroke") {
+		svgProps.stroke = color;
+		svgProps.strokeWidth = resolveStrokeWidth(strokeWidth, size, absoluteStrokeWidth);
+	} else svgProps.fill = color;
+	return createElement("svg", {
+		...svgProps,
+		...rest
+	}, [...iconNode.map(function renderNode([tag, attrs, nested], i) {
+		return createElement(tag, {
+			key: `c-${i}`,
+			...attrs
+		}, ...nested?.map(renderNode) ?? []);
+	}), ...(Array.isArray(children) ? children : [children]).filter(Boolean)]);
+});
+Icon.displayName = "Icon";
+//#endregion
+export { Icon as default };

package/dist/createJeddIcon.cjs

@@ -0,0 +1,22 @@
+"use client";
+const require_Icon = require("./Icon.cjs");
+let react = require("react");
+//#region src/createJeddIcon.tsx
+const toPascalCase = (s) => s.replace(/(^|-)([a-z0-9])/g, (_, __, c) => c.toUpperCase());
+function createJeddIcon(iconName, iconNode, variant = "stroke") {
+	const Component = (0, react.forwardRef)(({ className, ...props }, ref) => (0, react.createElement)(require_Icon.default, {
+		ref,
+		iconNode,
+		variant,
+		className: [
+			"jedd",
+			`jedd-${iconName}`,
+			className
+		].filter(Boolean).join(" "),
+		...props
+	}));
+	Component.displayName = toPascalCase(iconName);
+	return Component;
+}
+//#endregion
+exports.default = createJeddIcon;

package/dist/createJeddIcon.d.cts

@@ -0,0 +1,8 @@
+import { Variant } from "./shared/dist/defaultAttributes.cjs";
+import { IconNode } from "./shared/dist/types.cjs";
+import { JeddIcon } from "./types.cjs";
+
+//#region src/createJeddIcon.d.ts
+declare function createJeddIcon(iconName: string, iconNode: IconNode, variant?: Variant): JeddIcon;
+//#endregion
+export { createJeddIcon };

package/dist/createJeddIcon.d.mts

@@ -0,0 +1,8 @@
+import { Variant } from "./shared/dist/defaultAttributes.mjs";
+import { IconNode } from "./shared/dist/types.mjs";
+import { JeddIcon } from "./types.mjs";
+
+//#region src/createJeddIcon.d.ts
+declare function createJeddIcon(iconName: string, iconNode: IconNode, variant?: Variant): JeddIcon;
+//#endregion
+export { createJeddIcon };

package/dist/createJeddIcon.mjs

@@ -0,0 +1,22 @@
+"use client";
+import Icon from "./Icon.mjs";
+import { createElement, forwardRef } from "react";
+//#region src/createJeddIcon.tsx
+const toPascalCase = (s) => s.replace(/(^|-)([a-z0-9])/g, (_, __, c) => c.toUpperCase());
+function createJeddIcon(iconName, iconNode, variant = "stroke") {
+	const Component = forwardRef(({ className, ...props }, ref) => createElement(Icon, {
+		ref,
+		iconNode,
+		variant,
+		className: [
+			"jedd",
+			`jedd-${iconName}`,
+			className
+		].filter(Boolean).join(" "),
+		...props
+	}));
+	Component.displayName = toPascalCase(iconName);
+	return Component;
+}
+//#endregion
+export { createJeddIcon as default };

package/dist/defaultAttributes.cjs

@@ -0,0 +1,4 @@
+//#region src/defaultAttributes.ts
+var defaultAttributes_default = require("./shared/dist/defaultAttributes.cjs").defaultAttributesCamel;
+//#endregion
+exports.default = defaultAttributes_default;

package/dist/defaultAttributes.mjs

@@ -0,0 +1,5 @@
+import { defaultAttributesCamel } from "./shared/dist/defaultAttributes.mjs";
+//#region src/defaultAttributes.ts
+var defaultAttributes_default = defaultAttributesCamel;
+//#endregion
+export { defaultAttributes_default as default };

package/dist/fill.cjs

@@ -0,0 +1,4 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_arrow_down_left = require("./icons-fill/arrow-down-left.cjs");
+exports.ArrowDownLeft = require_arrow_down_left.default;

package/dist/fill.d.cts

@@ -0,0 +1,2 @@
+import { ArrowDownLeft } from "./icons-fill/arrow-down-left.cjs";
+export { ArrowDownLeft };

package/dist/fill.d.mts

@@ -0,0 +1,2 @@
+import { ArrowDownLeft } from "./icons-fill/arrow-down-left.mjs";
+export { ArrowDownLeft };

package/dist/fill.mjs

@@ -0,0 +1,3 @@
+"use client";
+import ArrowDownLeft from "./icons-fill/arrow-down-left.mjs";
+export { ArrowDownLeft };

package/dist/icons/arrow-down-left.cjs

@@ -0,0 +1,3 @@
+const ArrowDownLeft = require("../createJeddIcon.cjs").default("arrow-down-left", [["path", { "d": "M17 7L7 17M17 17H7V7" }]]);
+//#endregion
+exports.default = ArrowDownLeft;

package/dist/icons/arrow-down-left.d.cts

@@ -0,0 +1,5 @@
+import { JeddIcon } from "../types.cjs";
+//#region src/icons/arrow-down-left.d.ts
+declare const ArrowDownLeft: JeddIcon;
+//#endregion
+export { ArrowDownLeft };

package/dist/icons/arrow-down-left.d.mts

@@ -0,0 +1,5 @@
+import { JeddIcon } from "../types.mjs";
+//#region src/icons/arrow-down-left.d.ts
+declare const ArrowDownLeft: JeddIcon;
+//#endregion
+export { ArrowDownLeft };

package/dist/icons/arrow-down-left.mjs

@@ -0,0 +1,4 @@
+import createJeddIcon from "../createJeddIcon.mjs";
+const ArrowDownLeft = createJeddIcon("arrow-down-left", [["path", { "d": "M17 7L7 17M17 17H7V7" }]]);
+//#endregion
+export { ArrowDownLeft as default };

package/dist/icons/index.d.cts

@@ -0,0 +1 @@
+import { ArrowDownLeft } from "./arrow-down-left.cjs";

package/dist/icons/index.d.mts

@@ -0,0 +1 @@
+import { ArrowDownLeft } from "./arrow-down-left.mjs";

package/dist/icons-fill/arrow-down-left.cjs

@@ -0,0 +1,3 @@
+const ArrowDownLeft = require("../createJeddIcon.cjs").default("arrow-down-left", [["path", { "d": "M18 7.41406L12.207 13.207L17 18H6V7L10.793 11.793L16.5859 6L18 7.41406Z" }]], "fill");
+//#endregion
+exports.default = ArrowDownLeft;

package/dist/icons-fill/arrow-down-left.d.cts

@@ -0,0 +1,5 @@
+import { JeddIcon } from "../types.cjs";
+//#region src/icons-fill/arrow-down-left.d.ts
+declare const ArrowDownLeft: JeddIcon;
+//#endregion
+export { ArrowDownLeft };

package/dist/icons-fill/arrow-down-left.d.mts

@@ -0,0 +1,5 @@
+import { JeddIcon } from "../types.mjs";
+//#region src/icons-fill/arrow-down-left.d.ts
+declare const ArrowDownLeft: JeddIcon;
+//#endregion
+export { ArrowDownLeft };

package/dist/icons-fill/arrow-down-left.mjs

@@ -0,0 +1,4 @@
+import createJeddIcon from "../createJeddIcon.mjs";
+const ArrowDownLeft = createJeddIcon("arrow-down-left", [["path", { "d": "M18 7.41406L12.207 13.207L17 18H6V7L10.793 11.793L16.5859 6L18 7.41406Z" }]], "fill");
+//#endregion
+export { ArrowDownLeft as default };

package/dist/icons-fill/index.d.cts

@@ -0,0 +1 @@
+import { ArrowDownLeft } from "./arrow-down-left.cjs";

package/dist/icons-fill/index.d.mts

@@ -0,0 +1 @@
+import { ArrowDownLeft } from "./arrow-down-left.mjs";

package/dist/index.cjs

@@ -0,0 +1,10 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_Icon = require("./Icon.cjs");
+const require_createJeddIcon = require("./createJeddIcon.cjs");
+const require_defaultAttributes = require("./defaultAttributes.cjs");
+const require_arrow_down_left = require("./icons/arrow-down-left.cjs");
+exports.ArrowDownLeft = require_arrow_down_left.default;
+exports.Icon = require_Icon.default;
+exports.createJeddIcon = require_createJeddIcon.default;
+exports.defaultAttributes = require_defaultAttributes.default;

package/dist/index.d.cts

@@ -0,0 +1,7 @@
+import { Variant, defaultAttributesCamel } from "./shared/dist/defaultAttributes.cjs";
+import { IconNode } from "./shared/dist/types.cjs";
+import { IconProps, JeddIcon } from "./types.cjs";
+import { createJeddIcon } from "./createJeddIcon.cjs";
+import { Icon } from "./Icon.cjs";
+import { ArrowDownLeft } from "./icons/arrow-down-left.cjs";
+export { ArrowDownLeft, Icon, type IconNode, type IconProps, type JeddIcon, type Variant, createJeddIcon, defaultAttributesCamel as defaultAttributes };

package/dist/index.d.mts

@@ -0,0 +1,7 @@
+import { Variant, defaultAttributesCamel } from "./shared/dist/defaultAttributes.mjs";
+import { IconNode } from "./shared/dist/types.mjs";
+import { IconProps, JeddIcon } from "./types.mjs";
+import { createJeddIcon } from "./createJeddIcon.mjs";
+import { Icon } from "./Icon.mjs";
+import { ArrowDownLeft } from "./icons/arrow-down-left.mjs";
+export { ArrowDownLeft, Icon, type IconNode, type IconProps, type JeddIcon, type Variant, createJeddIcon, defaultAttributesCamel as defaultAttributes };

package/dist/index.mjs

@@ -0,0 +1,6 @@
+"use client";
+import Icon from "./Icon.mjs";
+import createJeddIcon from "./createJeddIcon.mjs";
+import defaultAttributes_default from "./defaultAttributes.mjs";
+import ArrowDownLeft from "./icons/arrow-down-left.mjs";
+export { ArrowDownLeft, Icon, createJeddIcon, defaultAttributes_default as defaultAttributes };

package/dist/shared/dist/defaultAttributes.cjs

@@ -0,0 +1,31 @@
+//#region ../shared/dist/defaultAttributes.mjs
+const kebabToCamel = (s) => s.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+function toCamel(attrs) {
+	return Object.fromEntries(Object.entries(attrs).map(([k, v]) => [kebabToCamel(k), v]));
+}
+const strokeDefaultsCamel = toCamel({
+	xmlns: "http://www.w3.org/2000/svg",
+	width: 24,
+	height: 24,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": 2,
+	"stroke-linecap": "butt",
+	"stroke-linejoin": "miter"
+});
+const variantDefaultsCamel = {
+	stroke: strokeDefaultsCamel,
+	fill: toCamel({
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "currentColor",
+		stroke: "none"
+	})
+};
+const defaultAttributesCamel = strokeDefaultsCamel;
+//#endregion
+exports.defaultAttributesCamel = defaultAttributesCamel;
+exports.variantDefaultsCamel = variantDefaultsCamel;

package/dist/shared/dist/defaultAttributes.d.cts

@@ -0,0 +1,16 @@
+//#region ../shared/dist/defaultAttributes.d.mts
+//#region src/defaultAttributes.d.ts
+type Variant = "stroke" | "fill";
+declare const defaultAttributesCamel: {
+  xmlns: string;
+  width: number;
+  height: number;
+  viewBox: string;
+  fill: string;
+  stroke: string;
+  strokeWidth: number;
+  strokeLinecap: string;
+  strokeLinejoin: string;
+}; //#endregion
+//#endregion
+export { Variant, defaultAttributesCamel };

package/dist/shared/dist/defaultAttributes.d.mts

@@ -0,0 +1,16 @@
+//#region ../shared/dist/defaultAttributes.d.mts
+//#region src/defaultAttributes.d.ts
+type Variant = "stroke" | "fill";
+declare const defaultAttributesCamel: {
+  xmlns: string;
+  width: number;
+  height: number;
+  viewBox: string;
+  fill: string;
+  stroke: string;
+  strokeWidth: number;
+  strokeLinecap: string;
+  strokeLinejoin: string;
+}; //#endregion
+//#endregion
+export { Variant, defaultAttributesCamel };

package/dist/shared/dist/defaultAttributes.mjs

@@ -0,0 +1,30 @@
+//#region ../shared/dist/defaultAttributes.mjs
+const kebabToCamel = (s) => s.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+function toCamel(attrs) {
+	return Object.fromEntries(Object.entries(attrs).map(([k, v]) => [kebabToCamel(k), v]));
+}
+const strokeDefaultsCamel = toCamel({
+	xmlns: "http://www.w3.org/2000/svg",
+	width: 24,
+	height: 24,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": 2,
+	"stroke-linecap": "butt",
+	"stroke-linejoin": "miter"
+});
+const variantDefaultsCamel = {
+	stroke: strokeDefaultsCamel,
+	fill: toCamel({
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "currentColor",
+		stroke: "none"
+	})
+};
+const defaultAttributesCamel = strokeDefaultsCamel;
+//#endregion
+export { defaultAttributesCamel, variantDefaultsCamel };

package/dist/shared/dist/resolveStrokeWidth.cjs

@@ -0,0 +1,6 @@
+//#region ../shared/dist/resolveStrokeWidth.mjs
+function resolveStrokeWidth(strokeWidth, size, absolute) {
+	return absolute ? Number(strokeWidth) * 24 / Number(size) : strokeWidth;
+}
+//#endregion
+exports.resolveStrokeWidth = resolveStrokeWidth;

package/dist/shared/dist/resolveStrokeWidth.mjs

@@ -0,0 +1,6 @@
+//#region ../shared/dist/resolveStrokeWidth.mjs
+function resolveStrokeWidth(strokeWidth, size, absolute) {
+	return absolute ? Number(strokeWidth) * 24 / Number(size) : strokeWidth;
+}
+//#endregion
+export { resolveStrokeWidth };

package/dist/shared/dist/types.d.cts

@@ -0,0 +1,6 @@
+//#region ../shared/dist/types.d.mts
+//#region src/types.d.ts
+type IconNodeChild = [tag: string, attrs: Record<string, string | number>, children?: IconNodeChild[]];
+type IconNode = IconNodeChild[]; //#endregion
+//#endregion
+export { IconNode, IconNodeChild };

package/dist/shared/dist/types.d.mts

@@ -0,0 +1,6 @@
+//#region ../shared/dist/types.d.mts
+//#region src/types.d.ts
+type IconNodeChild = [tag: string, attrs: Record<string, string | number>, children?: IconNodeChild[]];
+type IconNode = IconNodeChild[]; //#endregion
+//#endregion
+export { IconNode, IconNodeChild };

package/dist/types.d.cts

@@ -0,0 +1,14 @@
+import { Variant } from "./shared/dist/defaultAttributes.cjs";
+import { IconNode, IconNodeChild } from "./shared/dist/types.cjs";
+import { SVGProps } from "react";
+
+//#region src/types.d.ts
+interface IconProps extends Omit<SVGProps<SVGSVGElement>, "ref"> {
+  absoluteStrokeWidth?: boolean;
+  color?: string;
+  size?: number | string;
+  strokeWidth?: number | string;
+}
+type JeddIcon = React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
+//#endregion
+export { IconProps, JeddIcon };

package/dist/types.d.mts

@@ -0,0 +1,14 @@
+import { Variant } from "./shared/dist/defaultAttributes.mjs";
+import { IconNode, IconNodeChild } from "./shared/dist/types.mjs";
+import { SVGProps } from "react";
+
+//#region src/types.d.ts
+interface IconProps extends Omit<SVGProps<SVGSVGElement>, "ref"> {
+  absoluteStrokeWidth?: boolean;
+  color?: string;
+  size?: number | string;
+  strokeWidth?: number | string;
+}
+type JeddIcon = React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
+//#endregion
+export { IconProps, JeddIcon };

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@jedd-icons/react",
+  "version": "0.0.2",
+  "description": "Jedd icons for React.",
+  "license": "MIT",
+  "author": "Marcello Novelli",
+  "homepage": "https://jeddicons.com/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jedd-labs/jedd-icons.git",
+    "directory": "packages/react"
+  },
+  "bugs": {
+    "url": "https://github.com/jedd-labs/jedd-icons/issues"
+  },
+  "keywords": [
+    "jedd",
+    "jedd-icons",
+    "icons",
+    "icon",
+    "svg",
+    "react",
+    "react-icons",
+    "components",
+    "ui"
+  ],
+  "type": "module",
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
+  "exports": {
+    ".": {
+      "types": {
+        "import": "./dist/index.d.mts",
+        "require": "./dist/index.d.cts"
+      },
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./fill": {
+      "types": {
+        "import": "./dist/fill.d.mts",
+        "require": "./dist/fill.d.cts"
+      },
+      "import": "./dist/fill.mjs",
+      "require": "./dist/fill.cjs"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "fill": [
+        "./dist/fill.d.mts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "react": "^17 || ^18 || ^19"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "react": "^19.2.6",
+    "tsdown": "^0.22.1",
+    "tsx": "^4.19.2",
+    "typescript": "^6.0.3",
+    "@jedd-icons/shared": "0.0.1"
+  },
+  "scripts": {
+    "gen": "tsx ../../tools/build-icons/build.ts",
+    "build": "pnpm gen && tsdown --config-loader tsx",
+    "dev": "pnpm gen && tsdown --config-loader tsx --watch",
+    "typecheck": "tsc --noEmit"
+  }
+}