@agilant/toga-blox 1.0.45 → 1.0.47

package/dist/components/Input/Input.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { UseFormRegister } from "react-hook-form";
 interface InputFieldProps {
     label?: string;
     value?: string | number;
@@ -25,6 +26,7 @@ interface InputFieldProps {
     labelClasses?: string;
     disabled?: boolean;
     hasAutoFocus?: boolean;
+    register?: UseFormRegister<any>;
     focusRingColor?: string;
 }
 declare const InputField: React.ForwardRefExoticComponent<InputFieldProps & React.RefAttributes<unknown>>;

package/dist/components/Input/Input.js

@@ -2,9 +2,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { faCircleInfo } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useState, forwardRef } from "react";
-const InputField = forwardRef(({ label, placeholder, required = false, checked, id, name, type = "text", firstIcon, secondIcon, iconPosition = "before", iconColor = "primary", isValid = true, isReadOnly = false, onChange, value, readOnlyInfo = "", toolTipText = "", hasToolTip = false, additionalClasses = "", labelClasses = "", hasAutoFocus, onIconClick, onKeyDown, disabled, 
-// register,
-focusRingColor = "focus:ring-transparent", }) => {
+const InputField = forwardRef(({ label, placeholder, required = false, checked, id, name, type = "text", firstIcon, secondIcon, iconPosition = "before", iconColor = "primary", isValid = true, isReadOnly = false, onChange, value, readOnlyInfo = "", toolTipText = "", hasToolTip = false, additionalClasses = "", labelClasses = "", hasAutoFocus, onIconClick, onKeyDown, disabled, register, focusRingColor = "focus:ring-transparent", }) => {
     const [isFocused, setIsFocused] = useState(false);
     const hasValue = value != null && !!value.toString().trim(); // Check if input value has at least one non-space character
     const isNumberInput = type === "number";
@@ -47,17 +45,15 @@ focusRingColor = "focus:ring-transparent", }) => {
                 return null;
         }
     };
-    // const registerProps = register
-    // 	? register(name || "", { required })
-    // 	: {};
+    const registerProps = register
+        ? register(name || "", { required })
+        : {};
     return isReadOnly ? (_jsxs("div", { className: "input-wrapper relative", children: [renderIcons(), _jsxs("label", { htmlFor: id, className: `block font-light text-left mb-1 ${labelClasses} `, children: [label, hasToolTip && (_jsxs("span", { className: "pl-4 group", children: [_jsx(FontAwesomeIcon, { icon: faCircleInfo, className: "text-primary group-hover:text-blue-600" }), _jsx("span", { className: "opacity-0 group-hover:opacity-100 bg-gray-800 text-white text-sm rounded-md px-2 py-1 absolute top-[-14px]", children: toolTipText })] }))] }), _jsx("div", { className: `
 					 text-left focus:outline-none focus:ring-2 block w-full py-2 px-2 rounded-lg shadow-input outline outline-0 outline-barelyPrimary focus:outline-4 md:w-full lg:w-full xl:w-full
 					${firstIcon ? "pl-10" : ""}
 					${secondIcon ? "pr-10" : ""}
 					${additionalClasses}
-				`, children: readOnlyInfo }), iconPosition === "after" && renderSecondIcon()] })) : (_jsxs(_Fragment, { children: [label && (_jsxs("label", { htmlFor: id, className: ` block font-light text-left mb-1 ${labelClasses}`, children: [label, hasToolTip && (_jsxs("span", { className: "pl-4 group", children: [_jsx(FontAwesomeIcon, { icon: faCircleInfo, className: "text-primary group-hover:text-blue-600" }), _jsx("span", { className: "opacity-0 group-hover:opacity-100 bg-gray-800 text-white text-sm rounded-md px-2 py-1 absolute top-[-14px]", children: toolTipText })] }))] })), _jsxs("div", { className: " input-wrapper relative", children: [renderIcons(), _jsx("input", { autoComplete: "", 
-                        // {...registerProps}
-                        className: `rounded-md focused:ring-0 ${focusRingColor} focus:ring-1
+				`, children: readOnlyInfo }), iconPosition === "after" && renderSecondIcon()] })) : (_jsxs(_Fragment, { children: [label && (_jsxs("label", { htmlFor: id, className: ` block font-light text-left mb-1 ${labelClasses}`, children: [label, hasToolTip && (_jsxs("span", { className: "pl-4 group", children: [_jsx(FontAwesomeIcon, { icon: faCircleInfo, className: "text-primary group-hover:text-blue-600" }), _jsx("span", { className: "opacity-0 group-hover:opacity-100 bg-gray-800 text-white text-sm rounded-md px-2 py-1 absolute top-[-14px]", children: toolTipText })] }))] })), _jsxs("div", { className: " input-wrapper relative", children: [renderIcons(), _jsx("input", { autoComplete: "", ...registerProps, className: `rounded-md focused:ring-0 ${focusRingColor} focus:ring-1
 						 focus:outline-none
 						${disabled
                             ? "border-gray-500 focus:ring-gray-500"

package/dist/components/MagnifyingIcon/MagnifyingIcon.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // src/components/MagnifyingIcon.tsx
 import { forwardRef, useEffect, useState } from "react";
 import { getFontAwesomeIcon } from "../../utils/getFontAwesomeIcon";
-const MagnifyingIcon = forwardRef(({ columnIndex, editingHeader, setEditingHeader, setHeaderValue, column, setSearchColumn, setActiveColumnFromSearch, setActiveColumn, iconColor = "text-blue-500", iconActiveColor = "text-green-500", iconActiveBackgroundColor = "bg-red-500", isActive, additionalIconClasses, setSearchText, searchText, isSearchOpen, }, ref) => {
+const MagnifyingIcon = forwardRef(({ columnIndex, editingHeader, setEditingHeader, setHeaderValue, column, setActiveColumn, iconColor = "text-blue-500", iconActiveColor = "text-green-500", iconActiveBackgroundColor = "bg-red-500", isActive, additionalIconClasses, setSearchText, searchText, isSearchOpen, }, ref) => {
     const [showActiveStyles, setShowActiveStyles] = useState(false);
     useEffect(() => {
         if (isActive !== undefined) {
@@ -49,8 +49,6 @@ const MagnifyingIcon = forwardRef(({ columnIndex, editingHeader, setEditingHeade
         }
         setEditingHeader(columnIndex);
         setHeaderValue(column.Header);
-        setSearchColumn(column);
-        setActiveColumnFromSearch(column.id);
         setActiveColumn(columnIndex);
     };
     return (_jsx("div", { ref: ref, "data-testid": "magnifying-icon-test-id", className: `flex items-center cursor-pointer size-[18px] rounded relative ml-1  ${iconColor} ${showActiveStyles

package/dist/components/MagnifyingIcon/MagnifyingIcon.stories.js

@@ -35,8 +35,6 @@ export const Default = {
         setHeaderValue: () => { },
         additionalIconClasses: "p-4",
         column: mockColumnInstance,
-        setSearchColumn: () => { },
-        setActiveColumnFromSearch: () => { },
         setActiveColumn: () => { },
         isActive: false,
     },

package/dist/components/MagnifyingIcon/types.d.ts

@@ -1,12 +1,10 @@
-import { Column, ColumnInstance } from "react-table";
+import { ColumnInstance } from "react-table";
 export interface MagnifyingIconProps<T extends object> {
     columnIndex: number;
     editingHeader: number | null;
     setEditingHeader: (index: number | null) => void;
     setHeaderValue: (value: string) => void;
     column: ColumnInstance<T>;
-    setSearchColumn?: (col: Column<T>) => void;
-    setActiveColumnFromSearch?: (id: string) => void;
     setActiveColumn: (index: number) => void;
     iconColor?: string;
     iconBackgroundColor?: string;

package/dist/components/MagnifyingIcon/types.js

@@ -1,2 +1 @@
-// src/components/MagnifyingIcon/types.ts
 export {};

package/dist/components/PrimaryTableHeader/PrimaryTableHeader.js

@@ -66,7 +66,7 @@ const PrimaryTableHeader = ({ headerGroups, editingHeader, searchText, setSearch
                                             })()] }) }), PortalComponent] })) : (_jsx(TableHeaderContent, { column: updatedColumn })), _jsx("div", { className: "ml-1", children: _jsx(SortArrows, { slug: mappingField || "", parentIndex: parentIndex, isNested: isNested, column: {
                                     ...updatedColumn,
                                     accessor: updatedColumn.id,
-                                }, setSortColumn: setSortColumn, onSortChange: handleSortChange }) }), shouldRenderMagnifyingIcon && (_jsx(MagnifyingIcon, { ref: magnifyingIconRef, column: updatedColumn, setSearchColumn: handleMagnifyingSetSearchColumn, editingHeader: editingHeader, columnIndex: columnIndex, setEditingHeader: setEditingHeader, setHeaderValue: setHeaderValue, isActive: activeColumn === columnIndex, setActiveColumn: setActiveColumn, setActiveColumnFromSearch: setActiveColumnFromSearch, setSearchText: setSearchText, searchText: searchText, isSearchOpen: editingHeader !== null }))] })));
+                                }, setSortColumn: setSortColumn, onSortChange: handleSortChange }) }), shouldRenderMagnifyingIcon && (_jsx(MagnifyingIcon, { ref: magnifyingIconRef, column: updatedColumn, editingHeader: editingHeader, columnIndex: columnIndex, setEditingHeader: setEditingHeader, setHeaderValue: setHeaderValue, isActive: activeColumn === columnIndex, setActiveColumn: setActiveColumn, setSearchText: setSearchText, searchText: searchText, isSearchOpen: editingHeader !== null }))] })));
         })))) }));
 };
 export default PrimaryTableHeader;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@agilant/toga-blox",
 	"private": false,
-	"version": "1.0.45",
+	"version": "1.0.47",
 	"description": "",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",