Security News
Cloudflare Adds Security.txt Setup Wizard
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
By Sarah Gooding - Sep 30, 2024
@mondaychen/primereact
Advanced tools
@mondaychen/primereact
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
PrimeReact
PrimeReact is a rich set of open source UI Components for React. See PrimeReact homepage for live showcase and documentation.
Download
PrimeReact is available at npm.
# Using npm
npm install primereact
# Using yarn
yarn add primereact
# Using pnpm
pnpm add primereact
Import
Each component can be imported individually so that you only bundle what you use. Import path is available in the documentation of the corresponding component.
//import { ComponentName } from 'primereact/{componentname}';
import { Button } from 'primereact/button';
export default function MyComponent() {
return (
<Button label="PrimeReact" />
)
}
Theming
PrimeReact has two theming has modes; styled or unstyled.
Styled Mode
Styled mode is based on pre-skinned components with opinionated themes like Material, Bootstrap or PrimeOne themes. Theme is the required css file to be imported, visit the Themes section for the complete list of available themes to choose from.
// theme
import 'primereact/resources/themes/lara-light-cyan/theme.css';
Unstyled Mode
Unstyled mode is disabled by default for all components. Using the PrimeReact context, set unstyled as true to enable it globally. Visit the Unstyled mode documentation for more information and examples.
Contributors
10.3.0 (2024-01-05)
New Features:
- ConfirmDialog/ConfirmPopup: Add defaultFocus option like PrimeVue #4051
Enhancements:
- Dialog: DialogProps missing footerClassName #5661
- DataTable: disable the rowEditor prop dynamically, as is done in rowExpansion #5640
- TreeSelect: TreeSelect component is not supporting tooltips and is an issue in multiple select mode. #5613
- Calendar:about disabled logic #5581
- TreeTable: Incorrect typing for sortable prop #5591
- InputNumber: Support roundingMode for the InputNumber #5528
- Chip: onRemove callback function doesn't return the removed value #5530
- confirmPopup: Remove deprecated code imports #5520
- confirmPopup: Remove deprecated code imports #5520
- Accessibility | Messages #5428
- Accessibility | Media Section #5422
- Headless Mode Update
- Dialog, ConfirmDialog, ConfirmPopup, Sidebar, Toast
- Showcase Updates
Fixed bugs:
- PrimeReactProvider: Error next14 app router #5127
- TabView: Doesn't render in NextJS 14 #5395
- Issue with fileUpload progressBarTemplate #5664
- Calendar: When enabledDates array is set, user will get stuck on month/year selection #5662
- DataTable: Subheader row group along with date sorting not working as intended #5651
- Ripple effect is not working on buttons inside the sidebar #5652
- Input Number: Value pasted by the user is not entered when suffix and decimals are used. #4802
- SideBar: aria-label disappear on close button #5637
- A maximizable dialog cannot be maximized properly after its position has been changed #5635
- InputNumber:format error when Locale set de-DE #5633
- TreeTable/Datatable: Calendar not showing correctly #5529
- Image preview zoom in bug #5627
- Otherprops not working for InputSwitch #5623
- InputNumber: (Germany) second step of currency can't changed #5589
- InputNumber: Incorrect duplication of fractional part of number #5607
- InputNumber: Cursor stuck when using minFractionDigits and comma as decimal separator #5548
- When RadioButton is selected, clicking on it does not trigger the onClick event. #5610
- TreeTable: missing import #5600
- TreeTable: Column "align" prop aligns the header rather than the content #5597
- Dialog: breakpoints are janky #5551
- TreeTable: sorting not triggered when clicking header with custom HTML #5584
- Calendar: After the currentview changed, the panel position is wrong #5577
- DataTable: appendTo on HTML element doesn't work #5266
- Calendar position error when appendTo: 'self' is set #5058
- select components: props appendTo Incorrect first time mount #5311
- MultiSelect: selectAllLabel property error inside React Router #5572
- Inplace: active prop not working #5561
- DataTable: Error when updating a cell #5556
- Calender: even with the viewDate prop the user can scroll past viewable dates #5558
- InputNumber: Text selection not working on input focus when using a suffix or prefix #5537
- TreeTable: Plenty of warnings in codesandbox demos #5542
- DataTable: Resize "fit" doesnt work with unstyled #5489
- Calendar: viewDate change does not update displayed year #4147
- Incorrect year display in Calendar after navigating to next year #5533
- Calendar: InputText does not immediately reflect locale changes #5535
- BlockUI lost focus #5523
- TreeTable: Header's columns not aligned with body's columns in scrollable mode #5487
- TreeTable: Rows are not aligned when frozen #5508
- useDebounce is wrong #5490
- Messages: No animations in v10 #5485
- ComponentBase: fkey used before declaration #5477
- Tabview: There is No style when use PrimeReact & Tailwind #5445
- Dialog: "esc" close dialogs in wrong order #5019
- CascadeSelect: activeOptionState not working as expected #5425
- Calendar: Size of picker panel when in month view #5435
- DataTable demo performance | Add DeferredDemo component #5688
- TreeSelect: panel hide after uncheck #5447
- InputText: className is added twice #5440
- TreeTable: Errors "React does not recognize the xxx prop on a DOM element" on rendering TreeTable component #5427
- CascadeSelect: onInputKeyDown error in unstyled model #5424
- Datatable: Cell editor ColumnEditorOptions param is broken #5233
- Dropdown: component interactable in disabled div #5414
- Dropdown: Tailwind optionDisabled with function not working #5676
- ConfirmDialog：confirmDialog method in unstyled mode, the pop-up window style not apply #5656
- ConfirmDialog: acceptButton's pt don't respect button #5653
- ToggleButton (Tailwind): Imported theming from documentation crashes button #5609
- Calendar (Tailwind): Calendar Input border rounded when showIcon is set #5590
- Calendar (Tailwind): Calendar missing styling #5579
- MultiSelect: PT filterInput not work #5568
- DataTable (Tailwind): frozen is undefined when data is empty array #5555
- TreeTable: need to be converted to data- lookups instead of className lookups #5553
- Accordion (Tailwind): Prop type error in console #5546
- OverlayPanel (Tailwind): showCloseIcon is at wrong position #5543
- DataTable: need to be converted to data- lookups instead of className lookups #5524
- Dropdown (Tailwind): Focus shadow not working #5512
- FileUpload: Missing basicButton theming in Tailwind #5515
- Button: Loading Spinner has no margin by default (Tailwind) #5509
- CascadeSelect: missing some values in pt #5479
- Picklist Tailwind is not responsive #5417
- Tailwind: Chips camelCase properties #5500
- Tailwind: Autocomplete camelCase #5499
- Tailwind: Multiselect issues and camelCase on properties #5493
- Tailwind: Listbox camelCase properties and Context property focused is missing #5492
- Tailwind: Calendar dropdownbutton #5471
- Tailwind: Button in Speedial does not have access to parent #5467
- Tailwind: InputNumber input is not a function #5464
- Tailwind: Tooltip missing context #5468
- Tailwind: Slider starthandler and endhandler, deprecated? #5466
- Tailwind: SidebarPassThroughOptions closeButtonIcon property missing #5465
- Tailwind: Dropdown itemGroup camelCase missing #5469
- Tailwind: ConfirmDialogPassThroughOptions does not a transition property #5463
- Tailwind: Card subtitle vs subTitle and similar issues #5461
- Tailwind: CascadeSelectPassThroughOptions is missing sublist #5462
- TabMenu: activeIndex not rerendering tabs with Tailwind #5457
- Tailwind: Rating readOnly property seems incorrect #5443
- Tailwind: modelValue property #5444
- RadioButton: data selector and Hook Form doc display error #5679
- ScrollPanel: test failed #5672
- Table: Sort icons are not showing correct amount directions #5617
- TreeTable: Wrong typing for emptyMessage #5588
- Button (Tailwind): Theming Documentation is missing attributes for button without label #5526
- Updating demo environments to Vite #5455
- Animated Text Highlight Problem #5480
- RowEdit: Programmatic Demo #5452
- Calendar: lag when navigating between months #5202
- Datatable: CRUD Filter but #5691
FAQs
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
We found that @mondaychen/primereact demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Package last updated on 10 Dec 2023
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Security News
Malicious “express-dompurify” npm Package Steals Browser and Cryptocurrency Wallet Data
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
By Socket Research Team - Sep 27, 2024
Security News
ENISA 2024 Threat Landscape Report Warns of Increasing State-Sponsored Supply Chain Attacks on Open Source Software
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.
By Sarah Gooding - Sep 27, 2024