v2.7.0

New Additions

• NsDataGrid:

  • Added the 'hide' property for column definitions, allowing support for hidden column filtering.
    • Extended the ColumnDef type to include an optional meta.hide property.
    • Updated the column filter in useReactTable to exclude columns with meta.hide set to true.
    • Resolved type compatibility issues with @tanstack/react-table by adding the second generic Value to ColumnDef.
  • Added the selectedRow property in NsDataGridOptions.
    • When an ID is passed, the table will preselect the specified row.

• NsSessionExpiredModal:

  • Introduced the new NsSessionExpiredModal pattern for session expiration handling.

Improved

• NsDataGrid:

  • Dynamically adapted the width of the ColumnVisibilityMenu dropdown menu to match content length.
  • Moved bodyTextAlign and headerJustifyContent properties from NsDataGridBaseProps to NsDataGridOptions for better organization.

• NsHeader:

  • Fixed notification issues.
  • Enabled userPanelMenuItems to render as menuItems.
  • Added hover effects, icons, and dropdown arrows for the menu.
  • Introduced additional configuration options.

• NsNotifier:

  • Simplified the component and enhanced its story.
  • Removed NsNotifierProps properties:
    • message
    • type
  • Added NsNotifierProps property:
    • anchorOrigin

Fixed

• NsDataGrid:

  • Corrected cell text alignment issues for consistency.

• NsHeader:

  • Resolved issues with the bell and user icons.

• NsLogin:

  • Removed the NsHeader component from the Login layout for cleaner design.

v2.6.0

New Additions

• NsNotificationList:

  • Introduced the new NsNotificationList component.
  • Added translation support.
  • Exported types for usage.
  • Created a Storybook story for demonstration.

• NsDataGrid:

  • Column Visibility Menu:
    Introduced a menu to manage column visibility, dynamically positionable using the render function within the table component.

• Storybook:

  • Added Figma integration within Storybook stories.

Improved

• NsCard:

  • Added sx support for enhanced customization.

• NsTooltip:

  • Expanded applicability, allowing tooltips to be applied to any element instead of just icons.

• Storybook:

  • Removed @storybook/addon-mdx-gfm as it is no longer necessary.
  • Integrated Remark to support GitHub Flavored Markdown (GFM) in Storybook documentation.
  • Upgraded Storybook to version 8.4.

• NsDataGrid:

  • Custom Layout Support:
    Updated NsDataGridClient to accept a custom renderer for flexible layouts.
  • Translation Structure:
    Introduced table.controls section for handling translations, starting with columnVisibility: "Columns Visibility".
  • Dynamic Alignment:
    The column visibility button is now right-aligned using justifyContent: 'flex-end'.
  • Removed Typography within table cells to enable full cell customization.

• NsNotification:

  • Added the ability to include links in notifications.
  • Introduced a markAllAsRead function.
  • Enhanced translation support.

• NsHeader:

  • Added cascading menu support via dropdown, with an example in Storybook.
  • Fixed infoBox positioning to align on the right.
  • Removed unnecessary SVG margins.

• NsFeedback:

  • Improved colors based on accessibility testing.

• NsDropdown:

  • Added support for disabling the overlay.

Fixed

• General:
  • Removed types.ts file; type declarations are now included within component files.
  • Resolved deprecated assert.CallTracker issue for compatibility with newer Node.js versions.

v2.5.0

New Additions

• NsSwitch:

  • Introduced the new NsSwitch component for toggle functionality.

• NsNumberInput:

  • Added NsNumberInput component to replace <input type="number"> for improved accessibility, non-incrementable fields (like passport numbers), and better user experience. The new component uses <input type="text" inputmode="numeric" pattern="[0-9]*"> for enhanced compatibility across devices.

Improved

• NsHeader:

  • Added infoBox prop allowing a React component to be centered within the header for greater customization.

• NsDataGrid:

  • Adjusted Typography to render as <div> instead of <p> to prevent nesting errors when including other elements inside it.

• NsPanel:

  • Provided an example usage to simulate a specific case and ensure the panel dynamically adapts to the parent container size.

• Storybook:

  • Updated the dark mode banner's "Need Help" color for better visibility.

Fixed

• Tooltip:

  • Removed the border for a cleaner visual appearance.

• Exports:

  • Exported the DynamicLink component for wider availability in the project.

v2.4.0

New Additions

• NsSelect:

  • Added support for "Multiselect" functionality, allowing the selection of multiple options. Added an example in the Storybook.

• NsSelectAutocomplete:

  • Added support for "Multiselect" functionality, enabling users to select multiple options. An example has been included in the Storybook.
  • Added checkboxes with options for multiple, groupBy, and disableCloseOnSelect for enhanced control over selection behavior.

• NsWizard:

  • Added onStepCallback callback for individual steps. This allows specific actions to be executed when each step is reached, complementing the existing global callback for the entire wizard.

Improved

• NsCard:

  • Enhanced the layout for the clickable card.
  • Added new customization props for better flexibility.
  • Added a toggle feature for select/deselect functionality.

• NsDrawer:

  • Added MDX documentation for the NsDrawer story to improve component documentation.

Fixed

• NsCard:

  • Addressed layout issues with clickable cards.

• Basic Library Errors:

  • Resolved several TypeScript warnings and errors.
  • Removed unnecessary console.log statements for cleaner code.

• NsHeader:

  • Fixed text color issues in the header's menu and updated the theme for better visual consistency.

• NsNotifier:

  • Updated the useNotifier hook to support both legacy and new usage, addressing breaking changes introduced in version 1.9.0.

v2.3.0

New additions

• NsDrawer:

  • A new component called NsDrawer has been introduced to manage collapsible content.

• NsAutocomplete:

  • Added "Multiselect" functionality for the NsAutocomplete component, enabling multiple item selection.

Improved

• NsWizard:

  • Introduced dot notation support for accessing nested JSON properties, simplifying the handling of complex data structures.

• NsLogin:

  • The width of the NsLogin card can now be adjusted via the cardWidth prop, providing more flexibility in layout design.

• Storybook:

  • Upgraded to the latest version to enhance compatibility and overall performance.

Fixed

• NsLogin:
  • Resolved label issues with the DefaultButtons in the NsLogin component.

v2.2.0

New additions

• NsTimePicker:
  • A new component called NsTimePicker has been introduced, allowing intuitive time selection.

Improved

• NsDataGrid:

  • Added comprehensive documentation for the NsDataGrid component, including usage examples and configuration guidelines.

• NsFileUpload:

  • Enabled the NsFileUpload component to specify accepted file types. Additionally, arguments inherited from MUI's Input component have been integrated.

• NsPanel:

  • Added customization support through the sx property and inherited arguments. A new story has been created for documentation in Storybook.

Fixed

• NsAccordionDetails:
  • Exported the NsAccordionDetails component for consistent usage across the application.

v2.1.0

New additions

• NsDialog:
  • A new component called NsDialog has been created, which will replace NsModal in the future. We encourage you to switch to NsDialog as NsModal will be deprecated in future releases. Here are the improvements made:
    • The close button is now optional, and full customization is allowed (buttons, close X icon, etc.).
    • It is now possible to pass information outside of the dialog.
    • Added the ability to block closing the modal when clicking outside of it.
    • Detailed documentation has been written and is available in Storybook for further guidance on using NsDialog.

Fixed

• NsDataGrid:

  • Fixed an issue where an empty border was displayed when NsDataGrid was rendered without filter components.

• Translation:

  • Fixed an issue in the translation modal where a string was missing from the common.json translation file.

v2.0.0

Improved

NsPagination:

• Now allows customizable labels
• Added PaginationActions for greater paginator customization
• Updated documentation
• Added rowsPerPageOptions prop

NsPanel:

• Added functionality to toggle the panel open or closed via a button

NsAccordion:

• Improved the accordion to align with the design system
• Changed accordion content to use the children prop instead of the content prop for more idiomatic usage

NsLogin:

• Added a prop for customizing the login background

NsHeader:

• Added more Storybook examples to showcase title configuration
• Introduced a slim version that sticks to the top when scrolling
• Removed the title prop from NsHeader and integrated it into the logo prop (logo, title, or both)
• userPanelMenuItems now accepts a React node
• Hid the gray bar in the Header when the user dropdown is not set

NsSelectAutocomplete:

• Improved the default equality check for the MUI Autocomplete component, assuming that two SelectItem objects represent the same entity if they share the same value field

NsCard:

• Now exports a single NsCard component with a dynamic set of props based on the type
• Renamed the mainText property to title and removed the subtext property in favor of the standard React children prop
• Card title now accepts React elements as input

NsButton:

• Removed NsButton as a wrapper around the MUI Button, but it remains usable as a reference to the MUI Button

NsModal:

• Added option for modal without button
• Implemented configurable modal width

NsDragAndDrop:

• Added a label to the NsDragAndDrop component when a single file is uploaded
• Updated label translations

NsHttpStatus:

• Removed rounded edges from the NsHttpStatus component

Storybook:

• Upgraded from Storybook v7 to v8.1.6
• Improved dark mode support
• Dynamically generated release notes
• Created a Storybook page for the NsBreadcrumbs component
• Updated the Colors story
• Updated the Welcome story
• Fixed issues with astreaTheme

---

Fixes

NsScrollTop:

• Fixed compilation warnings (pnpm build)

NsLogin:

• Fixed button styles
• Fixed the buttonsSlot prop, which was static and not functional

ErrorBoundary:

• Updated type definitions and fixed a compilation warning (pnpm build)

NsHeader:

• Fixed mobile version issues
• Fixed clickable areas

NsTextInput:

• Fixed the issue where the NsTextInput component didn’t pass the type prop, causing issues with password fields

NsTextArea:

• Fixed prop-related errors

Storybook:

• Fixed logo images not displaying correctly
• Renamed the folder containing the NsDragAndDrop.stories.tsx file to remove spaces
• Fixed the story for the ConfirmationPage component

---

New Additions

• Introduced the NsScrollTop component
• Introduced the NsDataGrid component, considering TanStack Table as a base
• Set up unit testing for the component library
• Added ESLint and Prettier configuration
• Introduced the NsBanner component
• Introduced the NsRadioGroup component

v1.9.1

Fixes

• NsDateCalendar:

  • Fixed locale issues by adding the adapterLocale property.

• NsFeedback:

  • Corrected icon size and padding.

• Themes:

  • Resolved an error associated with locale settings.

v1.9.0

Improved

• NsModal:

  • Adjusted backdrop color and modal title font sizes.

• ValidatedCheckbox:

  • Added a "Select all / Deselect all" version in the story.

• NsFeedback:

  • Updated line height on the feedback component.

• MuiAlert:

  • Updated the MuiAlert configuration in theme files to ensure proper operation of the Feedback component.

• Functional Enhancements:

  • Exported components and hooks including NsFormProps, NsForm, NsWizardStepper, NsWizardStepperProps, DefaultButtons, and useFormContext.
  • Introduced aliasing for certain components and interfaces for backward compatibility, including ValidatedForm, FormProps, WizardStepperProps, WizardStepper.

• Storybook Enhancements:

  • Sorted the order of sections, placing "Patterns" before "Layouts."
  • Enabled code display by default in Storybook.
  • Added the Astrea theme.
  • Adjusted the date format for Italian display in the datepicker.
  • Improved padding for NsSelectAutocomplete.

• Renaming and Deprecation:

  • Renamed components with the Ns prefix to unify naming conventions, including:
    • UserPanel to NsUserPanel
    • HttpStatus to NsHttpStatus
    • GridLayout to NsGridLayout
    • LabelInput to NsLabelInput
    • DragDrop to NsDragDrop
    • Notifier to NsNotifier
    • Login to NsLogin
    • FileUpload to NsFileUpload
    • Errors to NsErrors
    • ValidatedCheckbox to NsCheckbox
    • ValidatedDateCalendar to NsDateCalendar
    • ValidatedDragDrop to NsDragDrop
    • ValidatedFileUpload to NsFileUpload
    • ValidatedRadio to NsRadio
    • ValidatedSelect to NsSelect
    • ValidatedSelectAutocomplete to NsSelectAutocomplete
    • ValidatedTextArea to NsTextArea
    • ValidatedTextInput to NsTextInput
    • ValidatedForm to NsForm
    • Wizard to NsWizard
    • WizardFormStep to NsWizardFormStep
    • WizardStep to NsWizardStep
    • WizardProgressButtons to NsWizardProgressButtons
  • Components without the Ns prefix are still there, added deprecation messages for renamed components, from version 2.0 components without the prefix Ns will be removed.

• Refactors:

  • Removed all warnings during build (using pnpm build).
  • Removed unused code, including console logs.
  • Exported props interfaces and fixed imports.
  • Updated the NsPanel component and readme.md documentation.

Breaking Change: NsNotifier Improvements

In this release, we have made significant improvements to the NsNotifier component to enhance functionality and user experience. These changes introduce a breaking change, which means that users will need to adapt to the new approach by following the updated documentation available in Storybook.

For users who need more time to transition, we have provided a temporary hook that allows you to maintain compatibility with your existing implementation:

import { useCallback } from 'react';
import { useSnackbar } from 'notistack';

const useNotifier = () => {
  const { enqueueSnackbar, closeSnackbar } = useSnackbar();

  const notify = useCallback(({ type, message }) => {
    enqueueSnackbar(message, { variant: type });
  }, [enqueueSnackbar]);

  const dismiss = useCallback((key) => {
    closeSnackbar(key);
  }, [closeSnackbar]);

  return { notify, dismiss };
};

export default useNotifier;

This hook can be used temporarily to avoid breaking changes during the transition. With the release of version 2.4.0, this hook will no longer be necessary, and your implementation will continue to work without any breaking changes.

We encourage users to review the documentation and adapt to the new approach to ensure a smooth upgrade process.