@youngonesworks/ui 0.1.18 → 0.1.19

package/dist/index.cjs

@@ -103322,70 +103322,6 @@ const BreadCrumb = ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
 });
 BreadCrumb.displayName = "BreadCrumb";
 
-//#endregion
-//#region src/components/checkbox/index.tsx
-const Checkbox = (0, react.forwardRef)(({ size: size$3 = "md", className, error: error$1, mediumBoldText, label, indeterminate = false, disabled = false,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-	className: cn("relative grid gap-2", className),
-	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
-		className: cn("flex cursor-pointer items-center gap-3"),
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: cn("relative grid shrink-0 place-content-center", size$3 === "sm" ? "size-4" : "size-5"),
-			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-					className: "checked:border-light-blue checked:bg-light-blue [&:not([disabled])]:checked:border-light-blue [&:not([disabled])]:checked:bg-light-blue peer absolute inset-0 shrink-0 appearance-none rounded-xs border border-gray-800 bg-white focus:outline-hidden disabled:border-gray-300 disabled:bg-gray-100 disabled:[&[checked]]:border-gray-100",
-					type: "checkbox",
-					"data-testid": "checkbox",
-					disabled,
-					ref,
-					...props
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-					className: cn("pointer-events-none absolute top-1/2 left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-white outline-hidden peer-checked:block", { "stroke-gray-300": disabled }, size$3 === "sm" ? "size-3" : "size-4"),
-					xmlns: "http://www.w3.org/2000/svg",
-					viewBox: "0 0 24 24",
-					fill: "none",
-					stroke: "currentColor",
-					strokeWidth: "4",
-					strokeLinecap: "round",
-					strokeLinejoin: "round",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("polyline", { points: "20 6 9 17 4 12" })
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-					className: cn("pointer-events-none absolute left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-black outline-hidden", { "stroke-gray-300": disabled }, size$3 === "sm" ? "top-[60%] size-3" : "top-1/2 size-4", { block: indeterminate }),
-					xmlns: "http://www.w3.org/2000/svg",
-					viewBox: "0 0 24 24",
-					fill: "none",
-					stroke: "currentColor",
-					strokeWidth: "4",
-					strokeLinecap: "round",
-					strokeLinejoin: "round",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
-						x1: "4",
-						y1: "12",
-						x2: "20",
-						y2: "12"
-					})
-				})
-			]
-		}), label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: cn("grow text-sm font-normal", { "font-medium": mediumBoldText }),
-			children: label
-		})]
-	}), error$1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("small", {
-		className: "text-xs font-normal text-red-500",
-		children: error$1
-	})]
-}));
-Checkbox.displayName = "Checkbox";
-
-//#endregion
-//#region src/components/divider/index.tsx
-const Divider = ({ className,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	"data-component": "divider",
-	className: clsx_default("block h-px w-full bg-[#CCCCCC]", className),
-	...props
-});
-
 //#endregion
 //#region src/icons/IconLoading.tsx
 const IconLoading = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
@@ -103511,6 +103447,70 @@ const Button = (0, react.forwardRef)(({ type = "button", variant = "primary", ar
 });
 Button.displayName = "Button";
 
+//#endregion
+//#region src/components/checkbox/index.tsx
+const Checkbox = (0, react.forwardRef)(({ size: size$3 = "md", className, error: error$1, mediumBoldText, label, indeterminate = false, disabled = false,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+	className: cn("relative grid gap-2", className),
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		className: cn("flex cursor-pointer items-center gap-3"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: cn("relative grid shrink-0 place-content-center", size$3 === "sm" ? "size-4" : "size-5"),
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					className: "checked:border-light-blue checked:bg-light-blue [&:not([disabled])]:checked:border-light-blue [&:not([disabled])]:checked:bg-light-blue peer absolute inset-0 shrink-0 appearance-none rounded-xs border border-gray-800 bg-white focus:outline-hidden disabled:border-gray-300 disabled:bg-gray-100 disabled:[&[checked]]:border-gray-100",
+					type: "checkbox",
+					"data-testid": "checkbox",
+					disabled,
+					ref,
+					...props
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+					className: cn("pointer-events-none absolute top-1/2 left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-white outline-hidden peer-checked:block", { "stroke-gray-300": disabled }, size$3 === "sm" ? "size-3" : "size-4"),
+					xmlns: "http://www.w3.org/2000/svg",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "4",
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("polyline", { points: "20 6 9 17 4 12" })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+					className: cn("pointer-events-none absolute left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-black outline-hidden", { "stroke-gray-300": disabled }, size$3 === "sm" ? "top-[60%] size-3" : "top-1/2 size-4", { block: indeterminate }),
+					xmlns: "http://www.w3.org/2000/svg",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "4",
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+						x1: "4",
+						y1: "12",
+						x2: "20",
+						y2: "12"
+					})
+				})
+			]
+		}), label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: cn("grow text-sm font-normal", { "font-medium": mediumBoldText }),
+			children: label
+		})]
+	}), error$1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("small", {
+		className: "text-xs font-normal text-red-500",
+		children: error$1
+	})]
+}));
+Checkbox.displayName = "Checkbox";
+
+//#endregion
+//#region src/components/divider/index.tsx
+const Divider = ({ className,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	"data-component": "divider",
+	className: clsx_default("block h-px w-full bg-[#CCCCCC]", className),
+	...props
+});
+
 //#endregion
 //#region src/components/filters/FilterButton.tsx
 const FilterButton = ({ onClick, hasFilters, reset, filtersText, resetText }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -137797,8 +137797,37 @@ function isClassComponent(Component$1) {
 * @returns {boolean}
 */
 function isForwardRefComponent(Component$1) {
-	var _a;
-	return !!(typeof Component$1 === "object" && ((_a = Component$1.$$typeof) === null || _a === void 0 ? void 0 : _a.toString()) === "Symbol(react.forward_ref)");
+	return !!(typeof Component$1 === "object" && Component$1.$$typeof && (Component$1.$$typeof.toString() === "Symbol(react.forward_ref)" || Component$1.$$typeof.description === "react.forward_ref"));
+}
+/**
+* Check if a component is a memoized component.
+* @param Component
+* @returns {boolean}
+*/
+function isMemoComponent(Component$1) {
+	return !!(typeof Component$1 === "object" && Component$1.$$typeof && (Component$1.$$typeof.toString() === "Symbol(react.memo)" || Component$1.$$typeof.description === "react.memo"));
+}
+/**
+* Check if a component can safely receive a ref prop.
+* This includes class components, forwardRef components, and memoized components
+* that wrap forwardRef or class components.
+* @param Component
+* @returns {boolean}
+*/
+function canReceiveRef(Component$1) {
+	if (isClassComponent(Component$1)) {
+		return true;
+	}
+	if (isForwardRefComponent(Component$1)) {
+		return true;
+	}
+	if (isMemoComponent(Component$1)) {
+		const wrappedComponent = Component$1.type;
+		if (wrappedComponent) {
+			return isClassComponent(wrappedComponent) || isForwardRefComponent(wrappedComponent);
+		}
+	}
+	return false;
 }
 /**
 * Check if we're running React 19+ by detecting if function components support ref props
@@ -137856,19 +137885,15 @@ var ReactRenderer = class {
 		const props = this.props;
 		const editor = this.editor;
 		const isReact19 = isReact19Plus();
-		const isClassComp = isClassComponent(Component$1);
-		const isForwardRefComp = isForwardRefComponent(Component$1);
+		const componentCanReceiveRef = canReceiveRef(Component$1);
 		const elementProps = { ...props };
-		if (!elementProps.ref) {
-			if (isReact19) {
-				elementProps.ref = (ref) => {
-					this.ref = ref;
-				};
-			} else if (isClassComp || isForwardRefComp) {
-				elementProps.ref = (ref) => {
-					this.ref = ref;
-				};
-			}
+		if (elementProps.ref && !(isReact19 || componentCanReceiveRef)) {
+			delete elementProps.ref;
+		}
+		if (!elementProps.ref && (isReact19 || componentCanReceiveRef)) {
+			elementProps.ref = (ref) => {
+				this.ref = ref;
+			};
 		}
 		this.reactElement = react.default.createElement(Component$1, { ...elementProps });
 		(_a = editor === null || editor === void 0 ? void 0 : editor.contentComponent) === null || _a === void 0 ? void 0 : _a.setRenderer(this.id, this);
@@ -140298,6 +140323,7 @@ exports.AvatarIndicator = AvatarIndicator;
 exports.Badge = Badge;
 exports.BigBadge = BigBadge;
 exports.BreadCrumb = BreadCrumb;
+exports.Button = Button;
 exports.Checkbox = Checkbox;
 exports.Divider = Divider;
 exports.Filters = Filters;
@@ -140345,4 +140371,5 @@ exports.UnorderedList = UnorderedList;
 exports.UnorderedListItem = UnorderedListItem;
 exports.UnstyledButton = UnstyledButton;
 exports.WysiwygEditor = WysiwygEditor;
+exports.buttonVariants = buttonVariants;
 //# sourceMappingURL=index.cjs.map