@youngonesworks/ui 0.1.25 → 0.1.27

package/README.md

@@ -32,8 +32,8 @@ npm install @youngonesworks/ui
 ### Tailwind CSS v4 setup
 
 ```bash
-npm install tailwindcss@4 postcss autoprefixer
-npx tailwindcss init -p
+yarn add -D tailwindcss@4 postcss autoprefixer
+yarn tailwindcss init -p
 ```
 
 Update `tailwind.config.js`:

package/dist/components/rating/index.d.ts

@@ -5,6 +5,10 @@ interface IRating {
     setReview?: (val: number) => void;
     setReviewError?: (val: string) => void;
     error?: string;
+    ratings: {
+        value: number;
+        label: string;
+    }[];
 }
-export declare const Rating: ({ rating, size, setReview, className, setReviewError, error }: IRating) => import("react/jsx-runtime").JSX.Element;
+export declare const Rating: ({ rating, ratings, size, setReview, className, setReviewError, error }: IRating) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/reviews/index.d.ts

@@ -5,9 +5,13 @@ interface AggregatedRating {
 interface IReviewsProps {
     totalRatings: number;
     averageRating: number;
+    ratings: {
+        value: number;
+        label: string;
+    }[];
     aggregatedRating: AggregatedRating[];
     countStarsText: string[];
     numberOfReviewsText: string;
 }
-export declare const Reviews: ({ totalRatings, averageRating, aggregatedRating, countStarsText, numberOfReviewsText }: IReviewsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Reviews: ({ totalRatings, ratings, averageRating, aggregatedRating, countStarsText, numberOfReviewsText }: IReviewsProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/globals.css

@@ -0,0 +1,40 @@
+/**
+ * Global CSS Styles
+ * Main stylesheet for the YoungOnes B2B Dashboard
+ */
+
+@import "tailwindcss";
+
+@import "./styles/fonts.css";
+@import "./styles/variables.css";
+@import "./styles/utilities.css";
+ 
+ @keyframes spin {
+   from {
+     transform: rotate(0deg);
+   }
+   to {
+     transform: rotate(360deg);
+   }
+ }
+ 
+ .tiptap {
+   :first-child {
+     margin-top: 0;
+   }
+ 
+   /* List styles */
+   ul,
+   ol {
+     padding: 0 1rem;
+     margin: 1.25rem 1rem 1.25rem 0.4rem;
+ 
+     li p {
+       margin-top: 0.25em;
+       margin-bottom: 0.25em;
+     }
+   }
+ }
+ 
+/* Change this path to be relative to where this CSS file ends up after packaging this library. */
+@source "../dist"

package/dist/index.cjs

@@ -27,7 +27,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 const react = __toESM(require("react"));
 const react_jsx_runtime = __toESM(require("react/jsx-runtime"));
 const react_dom = __toESM(require("react-dom"));
-const next_font_local = __toESM(require("next/font/local"));
 
 //#region src/jsx-runtime-shim.ts
 const jsx$2 = react.createElement;
@@ -109785,7 +109784,7 @@ const IconStarHalfFilled = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs
 
 //#endregion
 //#region src/components/rating/index.tsx
-const Rating = ({ rating, size: size$3 = "normal", setReview, className, setReviewError, error: error$1 }) => {
+const Rating = ({ rating, ratings, size: size$3 = "normal", setReview, className, setReviewError, error: error$1 }) => {
 	const [hoveredStars, setHoveredStars] = (0, react.useState)(0);
 	const [hoveredSmallStars, setHoveredSmallStars] = (0, react.useState)(0);
 	const [reviewIsSet, setReviewIsSet] = (0, react.useState)(false);
@@ -109823,41 +109822,13 @@ const Rating = ({ rating, size: size$3 = "normal", setReview, className, setRevi
 		if (index$4 - roundedRating === .5) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarHalfFilled, { className: cn(className$1, "text-yellow") });
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarEmpty, { className: cn(className$1, "text-yellow") });
 	};
-	const ratings = [
-		{
-			value: 5,
-			label: "Excellent"
-		},
-		{
-			value: 4,
-			label: "Good"
-		},
-		{
-			value: 3,
-			label: "Average"
-		},
-		{
-			value: 2,
-			label: "Fair"
-		},
-		{
-			value: 1,
-			label: "Poor"
-		}
-	];
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 		className: cn("flex flex-col", className),
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				"data-component": "rating",
 				className: "flex flex-row gap-[2px]",
-				children: [
-					1,
-					2,
-					3,
-					4,
-					5
-				].map((index$4) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				children: ratings.map((_$1, index$4) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: cn("relative", setReview && "cursor-pointer"),
 					onClick: () => handleStarClick(index$4),
 					onMouseEnter: () => handleHover(index$4),
@@ -109935,7 +109906,7 @@ const ReviewsLine = ({ maxValue, amount, countStarsText }) => /* @__PURE__ */ (0
 function formatRating(rating) {
 	return rating === 0 ? 0 : rating.toFixed(1);
 }
-const Reviews = ({ totalRatings, averageRating, aggregatedRating, countStarsText, numberOfReviewsText }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+const Reviews = ({ totalRatings, ratings, averageRating, aggregatedRating, countStarsText, numberOfReviewsText }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 	className: "bg-ultra-light-gray flex w-full flex-col p-6 md:flex-row",
 	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "mb-5 flex flex-1 flex-row items-start justify-start gap-5 md:mb-0 md:flex-col md:justify-center md:gap-0",
@@ -109945,6 +109916,7 @@ const Reviews = ({ totalRatings, averageRating, aggregatedRating, countStarsText
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "flex flex-col",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Rating, {
+				ratings,
 				rating: averageRating,
 				size: "normal",
 				className: "mb-4"
@@ -109995,7 +109967,7 @@ const ScrollToTop = ({ scrollToTopTitle }) => {
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionIcon, {
 		title: scrollToTopTitle,
-		className: `bg-turquoise-700 hover:bg-turquoise-600 fixed -right-[10px] bottom-[105px] z-40 flex h-[43px] w-[62px] cursor-pointer items-center justify-center rounded-l-3xl border-0 px-2 text-black duration-500 ${isVisible ? "translate-x-0" : "translate-x-[60px]"}`,
+		className: `active:translate-y-[1px] content-center rounded-[4px] border-gray-200 hover:border-black child:p-10 disabled:text-gray-500 bg-turquoise-700 hover:bg-turquoise-600 fixed -right-[10px] bottom-[105px] z-40 flex h-[43px] w-[62px] cursor-pointer items-center justify-center rounded-l-3xl border-0 px-2 text-black duration-500 ${isVisible ? "translate-x-0" : "translate-x-[60px]"}`,
 		onClick: scrollToTop,
 		icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconChevronUp, {})
 	});
@@ -140329,130 +140301,12 @@ const CSS_VARIABLE_KEYS = [
 	"--color-warning-dark"
 ];
 const getCSSVariable = (variable) => {
-	if (typeof window !== "undefined") {
-		return getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
-	}
+	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 = (0, next_font_local.default)({
-	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"
+	if (typeof window !== "undefined") document.documentElement.style.setProperty(variable, value);
 };
-var fonts_default = gothamFont;
 
 //#endregion
 exports.AccordionItem = AccordionItem;
@@ -140470,9 +140324,6 @@ exports.Button = Button;
 exports.CSS_VARIABLE_KEYS = CSS_VARIABLE_KEYS;
 exports.Checkbox = Checkbox;
 exports.Divider = Divider;
-exports.FONT_CLASS_NAMES = FONT_CLASS_NAMES;
-exports.FONT_FAMILIES = FONT_FAMILIES;
-exports.FONT_WEIGHTS = FONT_WEIGHTS;
 exports.FavouriteButton = FavouriteButton;
 exports.Filters = Filters;
 exports.GoogleAppButtonIcon = GoogleAppButtonIcon;
@@ -140521,6 +140372,5 @@ exports.UnstyledButton = UnstyledButton;
 exports.WysiwygEditor = WysiwygEditor;
 exports.buttonVariants = buttonVariants;
 exports.getCSSVariable = getCSSVariable;
-exports.gothamFont = gothamFont;
 exports.setCSSVariable = setCSSVariable;
 //# sourceMappingURL=index.cjs.map