@youngonesworks/ui 0.1.20 → 0.1.24

package/dist/index.d.ts

@@ -13,6 +13,7 @@ export { Button } from './components/button';
 export { buttonVariants } from './components/button/buttonVariants';
 export { Checkbox } from './components/checkbox';
 export { Divider } from './components/divider';
+export { FavouriteButton } from './components/favouriteButton';
 export { Filters } from './components/filters';
 export { GoogleAppButtonIcon } from './components/googleAppButtonIcon';
 export { HamburgerMenuButton } from './components/hamburgerMenuButton';
@@ -57,3 +58,4 @@ export { UnorderedList } from './components/unorderedList';
 export { UnorderedListItem } from './components/unorderedListItem';
 export { UnstyledButton } from './components/unstyledButton';
 export { WysiwygEditor } from './components/wysiwygEditor';
+export * from './theme';

package/dist/index.js

@@ -3,6 +3,7 @@ import React, { Component, Fragment, cloneElement, createContext, createElement,
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import * as ReactDOM$1 from "react-dom";
 import ReactDOM, { createPortal, flushSync } from "react-dom";
+import localFont from "next/font/local";
 
 //#region rolldown:runtime
 var __create = Object.create;
@@ -103440,7 +103441,7 @@ function Button({ type = "button", variant = "primary", ariaLabel, block = false
 		type,
 		"aria-label": ariaLabel,
 		"data-testid": dataTestId,
-		className: cn(buttonVariants[variant], className, block && "w-full"),
+		className: cn(buttonVariants[variant], className, block && "w-full text-sm"),
 		onClick: handleOnClick,
 		...props,
 		children: [
@@ -103454,7 +103455,7 @@ Button.displayName = "Button";
 
 //#endregion
 //#region src/components/checkbox/index.tsx
-const Checkbox = forwardRef(({ size: size$3 = "md", className, error: error$1, mediumBoldText, label, indeterminate = false, disabled = false,...props }, ref) => /* @__PURE__ */ jsxs("div", {
+const CheckboxComponent = ({ size: size$3 = "md", className, error: error$1, mediumBoldText, label, indeterminate = false, disabled = false,...props }, ref) => /* @__PURE__ */ jsxs("div", {
 	className: cn("relative grid gap-2", className),
 	children: [/* @__PURE__ */ jsxs("label", {
 		className: cn("flex cursor-pointer items-center gap-3"),
@@ -103466,8 +103467,8 @@ const Checkbox = forwardRef(({ size: size$3 = "md", className, error: error$1, m
 					type: "checkbox",
 					"data-testid": "checkbox",
 					disabled,
-					ref,
-					...props
+					...props,
+					ref
 				}),
 				/* @__PURE__ */ 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"),
@@ -103505,17 +103506,35 @@ const Checkbox = forwardRef(({ size: size$3 = "md", className, error: error$1, m
 		className: "text-xs font-normal text-red-500",
 		children: error$1
 	})]
-}));
-Checkbox.displayName = "Checkbox";
+});
+const Checkbox = forwardRef(CheckboxComponent);
 
 //#endregion
 //#region src/components/divider/index.tsx
 const Divider = ({ className,...props }) => /* @__PURE__ */ jsx("div", {
 	"data-component": "divider",
-	className: clsx_default("block h-px w-full bg-[#CCCCCC]", className),
+	className: clsx_default("block h-px w-full bg-gray-200", className),
 	...props
 });
 
+//#endregion
+//#region src/components/favouriteButton/index.tsx
+const FavouriteButton = forwardRef((props, ref) => {
+	const { onClick, favourite, iconFilled, iconOutline, favouriteTitle, iconColorSelected = "text-pink", iconColor = "text-gray-800", iconSize, className = "", styleVariant = "transparent", children,...rest } = props;
+	return /* @__PURE__ */ jsx(ActionIcon, {
+		onClick,
+		"data-component": "favouriteButton",
+		title: favouriteTitle || "Favorite",
+		styleVariant,
+		className: `${favourite ? iconColorSelected : iconColor} ${className}`.trim(),
+		iconSize,
+		ref,
+		icon: favourite ? iconFilled ?? /* @__PURE__ */ jsx(IconHeartFilled, {}) : iconOutline ?? /* @__PURE__ */ jsx(IconHeart, {}),
+		...rest,
+		children
+	});
+});
+
 //#endregion
 //#region src/components/filters/FilterButton.tsx
 const FilterButton = ({ onClick, hasFilters, reset, filtersText, resetText }) => /* @__PURE__ */ jsxs("div", {
@@ -137802,37 +137821,8 @@ function isClassComponent(Component$1) {
 * @returns {boolean}
 */
 function isForwardRefComponent(Component$1) {
-	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;
+	var _a;
+	return !!(typeof Component$1 === "object" && ((_a = Component$1.$$typeof) === null || _a === void 0 ? void 0 : _a.toString()) === "Symbol(react.forward_ref)");
 }
 /**
 * Check if we're running React 19+ by detecting if function components support ref props
@@ -137890,15 +137880,19 @@ var ReactRenderer = class {
 		const props = this.props;
 		const editor = this.editor;
 		const isReact19 = isReact19Plus();
-		const componentCanReceiveRef = canReceiveRef(Component$1);
+		const isClassComp = isClassComponent(Component$1);
+		const isForwardRefComp = isForwardRefComponent(Component$1);
 		const elementProps = { ...props };
-		if (elementProps.ref && !(isReact19 || componentCanReceiveRef)) {
-			delete elementProps.ref;
-		}
-		if (!elementProps.ref && (isReact19 || componentCanReceiveRef)) {
-			elementProps.ref = (ref) => {
-				this.ref = ref;
-			};
+		if (!elementProps.ref) {
+			if (isReact19) {
+				elementProps.ref = (ref) => {
+					this.ref = ref;
+				};
+			} else if (isClassComp || isForwardRefComp) {
+				elementProps.ref = (ref) => {
+					this.ref = ref;
+				};
+			}
 		}
 		this.reactElement = React.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);
@@ -140317,5 +140311,151 @@ const WysiwygEditor = forwardRef(({ id, content, className, placeholder, onChang
 });
 
 //#endregion
-export { AccordionItem, AccordionWrapper, ActionIcon, Alert, AppleAppButtonIcon, AutoCompleteInput, Avatar, AvatarIndicator, Badge, BigBadge, BreadCrumb, Button, Checkbox, Divider, Filters, GoogleAppButtonIcon, HR, HamburgerMenuButton, Island, Label, LinkText, Loader, LogoBlack, Modal, NavButtons, NumberField, NumberedStepper, PageUnavailable, PasswordInput, Popover, ProgressBar, RadioButton, Rating, RegionSelector, Reviews, ScrollToTop, SearchInput, Select, SettingsCard, Skeleton, SkillPill, Stepper, StickyMobileButtonWrapper, Table, TableCell, TableHeader, TableHeaderItem, TableHeaderRow, TableRow, TextInput, Textarea, ThemeIcon, Toggle, Tooltip, TruncatedText, UnorderedList, UnorderedListItem, UnstyledButton, WysiwygEditor, buttonVariants };
+//#region src/theme/variables.ts
+const CSS_VARIABLE_KEYS = [
+	"--color-primary",
+	"--color-primary-light",
+	"--color-primary-dark",
+	"--color-black",
+	"--color-navy-blue",
+	"--color-white",
+	"--color-accent-blue",
+	"--color-ultra-light-blue",
+	"--color-green",
+	"--color-green-light",
+	"--color-pink",
+	"--color-purple",
+	"--color-orange",
+	"--color-warning",
+	"--color-warning-light",
+	"--color-warning-dark"
+];
+const getCSSVariable = (variable) => {
+	if (typeof window !== "undefined") {
+		return getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
+	}
+	return "";
+};
+const setCSSVariable = (variable, value) => {
+	if (typeof window !== "undefined") {
+		document.documentElement.style.setProperty(variable, value);
+	}
+};
+
+//#endregion
+//#region src/theme/fonts.ts
+const gothamFont = localFont({
+	src: [
+		{
+			path: "../assets/fonts/woff2/Gotham-Thin_Web.woff2",
+			weight: "100",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-ThinItalic_Web.woff2",
+			weight: "100",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-XLight_Web.woff2",
+			weight: "200",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-XLightItalic_Web.woff2",
+			weight: "200",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Light_Web.woff2",
+			weight: "300",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-LightItalic_Web.woff2",
+			weight: "300",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Book_Web.woff2",
+			weight: "400",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-BookItalic_Web.woff2",
+			weight: "400",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Medium_Web.woff2",
+			weight: "500",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-MediumItalic_Web.woff2",
+			weight: "500",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Bold_Web.woff2",
+			weight: "700",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-BoldItalic_Web.woff2",
+			weight: "700",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Black_Web.woff2",
+			weight: "800",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-BlackItalic_Web.woff2",
+			weight: "800",
+			style: "italic"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-Ultra_Web.woff2",
+			weight: "900",
+			style: "normal"
+		},
+		{
+			path: "../assets/fonts/woff2/Gotham-UltraItalic_Web.woff2",
+			weight: "900",
+			style: "italic"
+		}
+	],
+	variable: "--font-gotham",
+	display: "swap",
+	preload: true
+});
+const FONT_FAMILIES = {
+	gotham: "var(--font-gotham), Gotham, ui-sans-serif, system-ui, sans-serif",
+	sans: "ui-sans-serif, system-ui, sans-serif",
+	serif: "ui-serif, Georgia, serif",
+	mono: "ui-monospace, SFMono-Regular, Consolas, monospace"
+};
+const FONT_WEIGHTS = {
+	thin: "100",
+	extraLight: "200",
+	light: "300",
+	normal: "400",
+	medium: "500",
+	semiBold: "600",
+	bold: "700",
+	extraBold: "800",
+	black: "900"
+};
+const FONT_CLASS_NAMES = {
+	gotham: gothamFont.className,
+	sans: "font-sans",
+	serif: "font-serif",
+	mono: "font-mono"
+};
+var fonts_default = gothamFont;
+
+//#endregion
+export { AccordionItem, AccordionWrapper, ActionIcon, Alert, AppleAppButtonIcon, AutoCompleteInput, Avatar, AvatarIndicator, Badge, BigBadge, BreadCrumb, Button, CSS_VARIABLE_KEYS, Checkbox, Divider, FONT_CLASS_NAMES, FONT_FAMILIES, FONT_WEIGHTS, FavouriteButton, Filters, GoogleAppButtonIcon, HR, HamburgerMenuButton, Island, Label, LinkText, Loader, LogoBlack, Modal, NavButtons, NumberField, NumberedStepper, PageUnavailable, PasswordInput, Popover, ProgressBar, RadioButton, Rating, RegionSelector, Reviews, ScrollToTop, SearchInput, Select, SettingsCard, Skeleton, SkillPill, Stepper, StickyMobileButtonWrapper, Table, TableCell, TableHeader, TableHeaderItem, TableHeaderRow, TableRow, TextInput, Textarea, ThemeIcon, Toggle, Tooltip, TruncatedText, UnorderedList, UnorderedListItem, UnstyledButton, WysiwygEditor, buttonVariants, getCSSVariable, gothamFont, setCSSVariable };
 //# sourceMappingURL=index.js.map