feat(ui-icons): adding IconUp and IconDown (#450)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Introduced new icons: `arrow-up` (IconUp) and `arrow-down` (IconDown)
for upward and downward arrows, respectively, with customization
options.
- **Documentation**
- Updated configuration to monitor changes in UI icons more efficiently.
- **Tests**
- Added tests for the newly introduced `IconUp` and `IconDown`
components to ensure proper rendering with specific properties.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

packages/documentation/nodemon.json

@@ -6,6 +6,7 @@
 		"../ui-components/src/**/*.*",
 		"../ui-components/lib/**/*.*",
 		"../ui-styles/src/**/*.*",
-		"../ui-form/src/**/*.*"
+		"../ui-form/src/**/*.*",
+		"../ui-icons/src/**/*.*"
 	]
 }

packages/ui-icons/lib/icons/config.json

@@ -86,5 +86,15 @@
 		"name": "IconBrightness",
 		"title": "Brightness",
 		"monotone": true
+	},
+	"arrow-up": {
+		"name": "IconUp",
+		"title": "Up",
+		"monotone": true
+	},
+	"arrow-down": {
+		"name": "IconDown",
+		"title": "Down",
+		"monotone": true
 	}
 }

packages/ui-icons/src/components/Icons/IconDown.tsx

@@ -0,0 +1,49 @@
+/**
+ * This file was automatically generated.
+ * Please do not edit manually.
+ *
+ * To update this file, run `yarn build:icons`.
+ *
+ * Original name: arrow-down.svg
+ *
+ * !Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+ *
+ */
+
+import { SvgIcon } from "@versini/ui-private";
+
+import type { IconsProps } from "./IconsTypes";
+
+export const IconDown = ({
+	className,
+	viewBox,
+	spacing,
+	title,
+
+	monotone,
+	...rest
+}: IconsProps) => {
+	/* v8 ignore next 1 */
+	const opacity = monotone ? "1" : "0.4";
+	return (
+		<SvgIcon
+			defaultViewBox="0 0 384 512"
+			defaultClassName="h-5 w-5"
+			viewBox={viewBox}
+			className={className}
+			spacing={spacing}
+			title={title || "Down"}
+			{...rest}
+		>
+			<path
+				className="fa-secondary"
+				opacity={opacity}
+				d="M160 370.7V64c0-17.7 14.3-32 32-32s32 14.3 32 32V370.7l-32 32-32-32z"
+			/>
+			<path
+				className="fa-primary"
+				d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 402.7 54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
+			/>
+		</SvgIcon>
+	);
+};

packages/ui-icons/src/components/Icons/IconUp.tsx

@@ -0,0 +1,49 @@
+/**
+ * This file was automatically generated.
+ * Please do not edit manually.
+ *
+ * To update this file, run `yarn build:icons`.
+ *
+ * Original name: arrow-up.svg
+ *
+ * !Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+ *
+ */
+
+import { SvgIcon } from "@versini/ui-private";
+
+import type { IconsProps } from "./IconsTypes";
+
+export const IconUp = ({
+	className,
+	viewBox,
+	spacing,
+	title,
+
+	monotone,
+	...rest
+}: IconsProps) => {
+	/* v8 ignore next 1 */
+	const opacity = monotone ? "1" : "0.4";
+	return (
+		<SvgIcon
+			defaultViewBox="0 0 384 512"
+			defaultClassName="h-5 w-5"
+			viewBox={viewBox}
+			className={className}
+			spacing={spacing}
+			title={title || "Up"}
+			{...rest}
+		>
+			<path
+				className="fa-secondary"
+				opacity={opacity}
+				d="M160 141.3V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.3l-32-32-32 32z"
+			/>
+			<path
+				className="fa-primary"
+				d="M169.4 41.4c12.5-12.5 32.8-12.5 45.3 0l160 160c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L192 109.3 54.6 246.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l160-160z"
+			/>
+		</SvgIcon>
+	);
+};

packages/ui-icons/src/components/Icons/__tests__/Icons.test.tsx

@@ -10,6 +10,7 @@ import {
 	IconCopy,
 	IconDelete,
 	IconDog,
+	IconDown,
 	IconEdit,
 	IconGitHub,
 	IconHide,
@@ -21,6 +22,7 @@ import {
 	IconRestore,
 	IconSettings,
 	IconShow,
+	IconUp,
 	IconUser,
 } from "../..";
 
@@ -201,6 +203,20 @@ describe("Generic Icons prop tests", () => {
 						viewBox={viewBox}
 						spacing={spacing}
 					/>
+					<IconDown
+						data-testid="icon-down"
+						className={className}
+						fill={fill}
+						viewBox={viewBox}
+						spacing={spacing}
+					/>
+					<IconUp
+						data-testid="icon-up"
+						className={className}
+						fill={fill}
+						viewBox={viewBox}
+						spacing={spacing}
+					/>
 				</>,
 			);
 
@@ -224,6 +240,8 @@ describe("Generic Icons prop tests", () => {
 				"icon-previous",
 				"icon-github",
 				"icon-brightness",
+				"icon-down",
+				"icon-up",
 			].forEach(async (dataTestId) => {
 				await renderExpected({
 					dataTestId,

packages/ui-icons/src/components/index.ts

@@ -6,6 +6,7 @@ import { IconCopied } from "./Icons/IconCopied";
 import { IconCopy } from "./Icons/IconCopy";
 import { IconDelete } from "./Icons/IconDelete";
 import { IconDog } from "./Icons/IconDog";
+import { IconDown } from "./Icons/IconDown";
 import { IconEdit } from "./Icons/IconEdit";
 import { IconGitHub } from "./Icons/IconGitHub";
 import { IconHide } from "./Icons/IconHide";
@@ -17,6 +18,7 @@ import { IconProfile } from "./Icons/IconProfile";
 import { IconRestore } from "./Icons/IconRestore";
 import { IconSettings } from "./Icons/IconSettings";
 import { IconShow } from "./Icons/IconShow";
+import { IconUp } from "./Icons/IconUp";
 import { IconUser } from "./Icons/IconUser";
 
 export {
@@ -28,6 +30,7 @@ export {
 	IconCopy,
 	IconDelete,
 	IconDog,
+	IconDown,
 	IconEdit,
 	IconGitHub,
 	IconHide,
@@ -39,5 +42,6 @@ export {
 	IconRestore,
 	IconSettings,
 	IconShow,
+	IconUp,
 	IconUser,
 };