From f3785255bf6eaedd069c322430696f7af2cee96a Mon Sep 17 00:00:00 2001 From: gucal Date: Tue, 13 Feb 2024 15:56:49 +0300 Subject: [PATCH] Fix #5946 - Remove CodeSandbox Demos --- components/doc/accordion/importdoc.js | 2 +- components/doc/accordion/theming/tailwinddoc.js | 2 +- components/doc/autocomplete/accessibilitydoc.js | 2 +- components/doc/autocomplete/importdoc.js | 2 +- components/doc/autocomplete/theming/tailwinddoc.js | 2 +- components/doc/avatar/importdoc.js | 2 +- components/doc/avatar/theming/tailwinddoc.js | 2 +- components/doc/badge/importdoc.js | 2 +- components/doc/badge/theming/tailwinddoc.js | 2 +- components/doc/blockui/importdoc.js | 2 +- components/doc/blockui/theming/tailwinddoc.js | 2 +- components/doc/breadcrumb/importdoc.js | 2 +- components/doc/breadcrumb/theming/tailwinddoc.js | 2 +- components/doc/button/accessibilitydoc.js | 2 +- components/doc/button/importdoc.js | 2 +- components/doc/button/theming/tailwinddoc.js | 2 +- components/doc/calendar/accessibilitydoc.js | 2 +- components/doc/calendar/importdoc.js | 2 +- components/doc/calendar/theming/tailwinddoc.js | 2 +- components/doc/captcha/importdoc.js | 2 +- components/doc/card/accessibilitydoc.js | 2 +- components/doc/card/importdoc.js | 2 +- components/doc/card/theming/tailwinddoc.js | 2 +- components/doc/carousel/importdoc.js | 2 +- components/doc/carousel/theming/tailwinddoc.js | 2 +- components/doc/cascadeselect/accessibilitydoc.js | 2 +- components/doc/cascadeselect/importdoc.js | 2 +- components/doc/cascadeselect/theming/tailwinddoc.js | 2 +- components/doc/chart/accessibilitydoc.js | 2 +- components/doc/chart/chartjsdoc.js | 2 +- components/doc/chart/importdoc.js | 2 +- components/doc/chart/theming/tailwinddoc.js | 2 +- components/doc/checkbox/accessibilitydoc.js | 2 +- components/doc/checkbox/importdoc.js | 2 +- components/doc/checkbox/theming/tailwinddoc.js | 2 +- components/doc/chip/importdoc.js | 2 +- components/doc/chip/theming/tailwinddoc.js | 2 +- components/doc/chips/accessibilitydoc.js | 2 +- components/doc/chips/importdoc.js | 2 +- components/doc/chips/theming/tailwinddoc.js | 2 +- components/doc/colorpicker/importdoc.js | 2 +- components/doc/colorpicker/theming/tailwinddoc.js | 2 +- components/doc/colors/overviewdoc.js | 2 +- components/doc/common/docsectioncode.js | 13 ------------- components/doc/configuration/appendtodoc.js | 2 +- components/doc/configuration/csstransitiondoc.js | 2 +- components/doc/configuration/filtermatchmodedoc.js | 2 +- components/doc/configuration/hideoverlaysdoc.js | 2 +- components/doc/configuration/inputstyledoc.js | 2 +- components/doc/configuration/locale/addlocaledoc.js | 2 +- components/doc/configuration/locale/importdoc.js | 2 +- components/doc/configuration/locale/setlocaledoc.js | 2 +- .../doc/configuration/locale/setuplocaledoc.js | 2 +- components/doc/configuration/noncedoc.js | 2 +- components/doc/configuration/nullsortorderdoc.js | 2 +- components/doc/configuration/rippledoc.js | 2 +- components/doc/configuration/stylecontainer.js | 2 +- components/doc/configuration/zindexdoc.js | 2 +- components/doc/confirmdialog/importdoc.js | 2 +- components/doc/confirmdialog/theming/tailwinddoc.js | 2 +- components/doc/confirmpopup/importdoc.js | 2 +- components/doc/confirmpopup/theming/tailwinddoc.js | 2 +- components/doc/contextmenu/importdoc.js | 2 +- components/doc/contextmenu/theming/tailwinddoc.js | 2 +- components/doc/csslayer/bootstrapdoc.js | 2 +- components/doc/csslayer/normalizedoc.js | 2 +- components/doc/csslayer/resetdoc.js | 2 +- components/doc/csslayer/specificitydoc.js | 2 +- components/doc/csslayer/tailwinddoc.js | 2 +- components/doc/customicons/fontawesomedoc.js | 2 +- components/doc/customicons/imagedoc.js | 2 +- components/doc/customicons/materialdoc.js | 2 +- components/doc/customicons/svgdoc.js | 2 +- components/doc/datascroller/importdoc.js | 2 +- components/doc/datascroller/theming/tailwinddoc.js | 2 +- components/doc/datatable/importdoc.js | 2 +- components/doc/datatable/theming/tailwinddoc.js | 2 +- components/doc/dataview/importdoc.js | 2 +- components/doc/dataview/theming/tailwinddoc.js | 2 +- components/doc/deferredcontent/importdoc.js | 2 +- components/doc/dialog/importdoc.js | 2 +- components/doc/dialog/theming/tailwinddoc.js | 2 +- components/doc/divider/importdoc.js | 2 +- components/doc/divider/theming/tailwinddoc.js | 2 +- components/doc/dock/importdoc.js | 2 +- components/doc/dock/theming/tailwinddoc.js | 2 +- components/doc/dropdown/accessibilitydoc.js | 2 +- components/doc/dropdown/importdoc.js | 2 +- components/doc/dropdown/theming/tailwinddoc.js | 2 +- components/doc/editor/importdoc.js | 2 +- components/doc/editor/quilldoc.js | 2 +- components/doc/editor/theming/tailwinddoc.js | 2 +- components/doc/fieldset/importdoc.js | 2 +- components/doc/fieldset/theming/tailwinddoc.js | 2 +- components/doc/fileupload/importdoc.js | 2 +- components/doc/fileupload/theming/tailwinddoc.js | 2 +- components/doc/galleria/importdoc.js | 2 +- components/doc/galleria/theming/tailwinddoc.js | 2 +- components/doc/gmap/importdoc.js | 2 +- components/doc/hooks/useclickoutside/importdoc.js | 2 +- components/doc/hooks/usecounter/importdoc.js | 2 +- components/doc/hooks/usedebounce/importdoc.js | 2 +- components/doc/hooks/useeventlistener/importdoc.js | 2 +- components/doc/hooks/usefavicon/importdoc.js | 2 +- .../doc/hooks/useintersectionobserver/importdoc.js | 2 +- components/doc/hooks/useinterval/importdoc.js | 2 +- components/doc/hooks/usemounteffect/importdoc.js | 2 +- components/doc/hooks/usemouse/importdoc.js | 2 +- components/doc/hooks/usemove/importdoc.js | 2 +- .../doc/hooks/useoverlaylistener/importdoc.js | 2 +- .../doc/hooks/useoverlayscrolllistener/importdoc.js | 2 +- components/doc/hooks/useprevious/importdoc.js | 2 +- components/doc/hooks/useresizelistener/importdoc.js | 2 +- components/doc/hooks/usestorage/importdoc.js | 2 +- components/doc/hooks/usetimeout/importdoc.js | 2 +- components/doc/hooks/useunmounteffect/importdoc.js | 2 +- components/doc/hooks/useupdateeffect/importdoc.js | 2 +- components/doc/icons/basicdoc.js | 2 +- components/doc/icons/colordoc.js | 2 +- components/doc/icons/constantsdoc.js | 2 +- components/doc/icons/downloaddoc.js | 2 +- components/doc/icons/importdoc.js | 2 +- components/doc/icons/sizedoc.js | 2 +- components/doc/icons/spindoc.js | 2 +- components/doc/image/importdoc.js | 2 +- components/doc/image/theming/tailwinddoc.js | 2 +- components/doc/inplace/importdoc.js | 2 +- components/doc/inplace/theming/tailwinddoc.js | 2 +- components/doc/inputmask/accessibilitydoc.js | 2 +- components/doc/inputmask/importdoc.js | 2 +- components/doc/inputmask/theming/tailwinddoc.js | 2 +- components/doc/inputnumber/accessibilitydoc.js | 2 +- components/doc/inputnumber/importdoc.js | 2 +- components/doc/inputnumber/theming/tailwinddoc.js | 2 +- components/doc/inputswitch/accessibilitydoc.js | 2 +- components/doc/inputswitch/importdoc.js | 2 +- components/doc/inputswitch/theming/tailwinddoc.js | 2 +- components/doc/inputtext/accessibilitydoc.js | 2 +- components/doc/inputtext/importdoc.js | 2 +- components/doc/inputtext/theming/tailwinddoc.js | 2 +- components/doc/inputtextarea/accessibilitydoc.js | 2 +- components/doc/inputtextarea/importdoc.js | 2 +- components/doc/inputtextarea/theming/tailwinddoc.js | 2 +- components/doc/installation/context.js | 4 ++-- components/doc/installation/downloaddoc.js | 2 +- components/doc/installation/styleddoc.js | 2 +- components/doc/installation/unstyledmodedoc.js | 2 +- components/doc/keyfilter/importdoc.js | 2 +- components/doc/knob/accessibilitydoc.js | 2 +- components/doc/knob/importdoc.js | 2 +- components/doc/knob/theming/tailwinddoc.js | 2 +- components/doc/listbox/accessibilitydoc.js | 2 +- components/doc/listbox/importdoc.js | 2 +- components/doc/listbox/theming/tailwinddoc.js | 2 +- components/doc/megamenu/commanddoc.js | 2 +- components/doc/megamenu/importdoc.js | 2 +- components/doc/megamenu/routerdoc.js | 2 +- components/doc/megamenu/theming/tailwinddoc.js | 2 +- components/doc/mention/accessibilitydoc.js | 2 +- components/doc/mention/importdoc.js | 2 +- components/doc/mention/theming/tailwinddoc.js | 2 +- components/doc/menu/importdoc.js | 2 +- components/doc/menu/theming/tailwinddoc.js | 2 +- components/doc/menubar/importdoc.js | 2 +- components/doc/menubar/theming/tailwinddoc.js | 2 +- components/doc/message/importdoc.js | 2 +- components/doc/message/theming/tailwinddoc.js | 2 +- components/doc/messages/importdoc.js | 2 +- components/doc/messages/theming/tailwinddoc.js | 2 +- components/doc/multiselect/accessibilitydoc.js | 2 +- components/doc/multiselect/importdoc.js | 2 +- components/doc/multiselect/theming/tailwinddoc.js | 2 +- .../doc/multistatecheckbox/accessibilitydoc.js | 2 +- components/doc/multistatecheckbox/importdoc.js | 2 +- .../doc/multistatecheckbox/theming/tailwinddoc.js | 2 +- components/doc/orderlist/accessibilitydoc.js | 2 +- components/doc/orderlist/importdoc.js | 2 +- components/doc/orderlist/theming/tailwinddoc.js | 2 +- components/doc/organizationchart/importdoc.js | 2 +- .../doc/organizationchart/theming/tailwinddoc.js | 2 +- components/doc/overlaypanel/importdoc.js | 2 +- components/doc/overlaypanel/theming/tailwinddoc.js | 2 +- components/doc/paginator/importdoc.js | 2 +- components/doc/paginator/theming/tailwinddoc.js | 2 +- components/doc/panel/importdoc.js | 2 +- components/doc/panel/theming/tailwinddoc.js | 2 +- components/doc/panelmenu/importdoc.js | 2 +- components/doc/panelmenu/theming/tailwinddoc.js | 2 +- components/doc/passthrough/customcss.js | 2 +- components/doc/passthrough/globalptdoc.js | 2 +- components/doc/passthrough/usepassthroughdoc.js | 10 +++++----- components/doc/password/accessibilitydoc.js | 2 +- components/doc/password/importdoc.js | 2 +- components/doc/password/theming/tailwinddoc.js | 2 +- components/doc/picklist/importdoc.js | 2 +- components/doc/picklist/theming/tailwinddoc.js | 2 +- components/doc/progressbar/importdoc.js | 2 +- components/doc/progressbar/theming/tailwinddoc.js | 2 +- components/doc/progressspinner/importdoc.js | 2 +- .../doc/progressspinner/theming/tailwinddoc.js | 2 +- components/doc/radiobutton/accessibilitydoc.js | 2 +- components/doc/radiobutton/importdoc.js | 2 +- components/doc/radiobutton/theming/tailwinddoc.js | 2 +- components/doc/rating/importdoc.js | 2 +- components/doc/rating/theming/tailwinddoc.js | 2 +- components/doc/ripple/configurationdoc.js | 2 +- components/doc/ripple/importdoc.js | 2 +- components/doc/ripple/theming/tailwinddoc.js | 2 +- components/doc/scrollpanel/importdoc.js | 2 +- components/doc/scrollpanel/theming/tailwinddoc.js | 2 +- components/doc/scrolltop/importdoc.js | 2 +- components/doc/scrolltop/theming/tailwinddoc.js | 2 +- components/doc/selectbutton/importdoc.js | 2 +- components/doc/selectbutton/theming/tailwinddoc.js | 2 +- components/doc/sidebar/importdoc.js | 2 +- components/doc/sidebar/theming/tailwinddoc.js | 2 +- components/doc/skeleton/importdoc.js | 2 +- components/doc/skeleton/theming/tailwinddoc.js | 2 +- components/doc/slider/accessibilitydoc.js | 2 +- components/doc/slider/importdoc.js | 2 +- components/doc/slider/theming/tailwinddoc.js | 2 +- components/doc/speeddial/accessibilitydoc.js | 2 +- components/doc/speeddial/importdoc.js | 2 +- components/doc/speeddial/theming/tailwinddoc.js | 2 +- components/doc/splitbutton/importdoc.js | 2 +- components/doc/splitbutton/theming/tailwinddoc.js | 2 +- components/doc/splitter/importdoc.js | 2 +- components/doc/splitter/theming/tailwinddoc.js | 2 +- components/doc/steps/importdoc.js | 2 +- components/doc/steps/theming/tailwinddoc.js | 2 +- components/doc/styleclass/importdoc.js | 2 +- components/doc/tabmenu/importdoc.js | 2 +- components/doc/tabmenu/theming/tailwinddoc.js | 2 +- components/doc/tabview/importdoc.js | 2 +- components/doc/tabview/theming/tailwinddoc.js | 2 +- components/doc/tag/importdoc.js | 2 +- components/doc/tag/theming/tailwinddoc.js | 2 +- components/doc/tailwind/csslayerdoc.js | 2 +- components/doc/tailwind/unstyledmode/setupdoc.js | 10 +++++----- components/doc/terminal/importdoc.js | 2 +- components/doc/terminal/theming/tailwinddoc.js | 2 +- components/doc/theming/builtinthemesdoc.js | 2 +- components/doc/theming/customthemedoc.js | 4 ++-- components/doc/theming/primeflexdoc.js | 2 +- components/doc/theming/scaledoc.js | 2 +- components/doc/theming/scopedstyling/cssinjsdoc.js | 2 +- .../doc/theming/scopedstyling/cssmodulesdoc.js | 4 ++-- .../doc/theming/scopedstyling/namedclassdoc.js | 4 ++-- components/doc/theming/switchthemesdoc.js | 6 +++--- components/doc/tieredmenu/importdoc.js | 2 +- components/doc/tieredmenu/theming/tailwinddoc.js | 2 +- components/doc/timeline/importdoc.js | 2 +- components/doc/timeline/theming/tailwinddoc.js | 2 +- components/doc/toast/importdoc.js | 2 +- components/doc/toast/theming/tailwinddoc.js | 2 +- components/doc/togglebutton/accessibilitydoc.js | 2 +- components/doc/togglebutton/importdoc.js | 2 +- components/doc/togglebutton/theming/tailwinddoc.js | 2 +- components/doc/toolbar/accessibilitydoc.js | 2 +- components/doc/toolbar/importdoc.js | 2 +- components/doc/toolbar/theming/tailwinddoc.js | 2 +- components/doc/tooltip/importdoc.js | 2 +- components/doc/tooltip/theming/tailwinddoc.js | 2 +- components/doc/tree/importdoc.js | 2 +- .../doc/tree/selection/checkboxselectiondoc.js | 2 +- .../doc/tree/selection/multipleselectiondoc.js | 2 +- components/doc/tree/theming/tailwinddoc.js | 2 +- components/doc/treeselect/accessibilitydoc.js | 2 +- components/doc/treeselect/checkboxdoc.js | 2 +- components/doc/treeselect/importdoc.js | 2 +- components/doc/treeselect/multipledoc.js | 2 +- components/doc/treeselect/theming/tailwinddoc.js | 2 +- components/doc/treetable/importdoc.js | 2 +- components/doc/treetable/selection/checkboxdoc.js | 2 +- components/doc/treetable/selection/multipledoc.js | 2 +- components/doc/treetable/theming/tailwinddoc.js | 2 +- components/doc/tristatecheckbox/accessibilitydoc.js | 2 +- components/doc/tristatecheckbox/importdoc.js | 2 +- .../doc/tristatecheckbox/theming/tailwinddoc.js | 2 +- components/doc/unstyled/setupdoc.js | 4 ++-- components/doc/unstyled/themedoc.js | 2 +- components/doc/virtualscroller/importdoc.js | 2 +- 282 files changed, 296 insertions(+), 309 deletions(-) diff --git a/components/doc/accordion/importdoc.js b/components/doc/accordion/importdoc.js index 1d300fe6ee..5005e9a39c 100644 --- a/components/doc/accordion/importdoc.js +++ b/components/doc/accordion/importdoc.js @@ -11,7 +11,7 @@ import { Accordion, AccordionTab } from 'primereact/accordion'; return ( <> - + ); } diff --git a/components/doc/accordion/theming/tailwinddoc.js b/components/doc/accordion/theming/tailwinddoc.js index 17113f8d90..1f92bc501a 100644 --- a/components/doc/accordion/theming/tailwinddoc.js +++ b/components/doc/accordion/theming/tailwinddoc.js @@ -99,7 +99,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/autocomplete/accessibilitydoc.js b/components/doc/autocomplete/accessibilitydoc.js index 1020bdc72b..3cebfe97c0 100644 --- a/components/doc/autocomplete/accessibilitydoc.js +++ b/components/doc/autocomplete/accessibilitydoc.js @@ -30,7 +30,7 @@ export function AccessibilityDoc() { input element.

- +

Keyboard Support

diff --git a/components/doc/autocomplete/importdoc.js b/components/doc/autocomplete/importdoc.js index 709d44ac0d..5d32d28d68 100644 --- a/components/doc/autocomplete/importdoc.js +++ b/components/doc/autocomplete/importdoc.js @@ -11,7 +11,7 @@ import { AutoComplete } from 'primereact/autocomplete'; return ( <> - + ); } diff --git a/components/doc/autocomplete/theming/tailwinddoc.js b/components/doc/autocomplete/theming/tailwinddoc.js index b7f3a58f2b..9783e7648d 100644 --- a/components/doc/autocomplete/theming/tailwinddoc.js +++ b/components/doc/autocomplete/theming/tailwinddoc.js @@ -109,7 +109,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/avatar/importdoc.js b/components/doc/avatar/importdoc.js index 9ef33e3413..14c9c2dcd8 100644 --- a/components/doc/avatar/importdoc.js +++ b/components/doc/avatar/importdoc.js @@ -12,7 +12,7 @@ import { AvatarGroup } from 'primereact/avatargroup'; //Optional for grouping return ( <> - + ); } diff --git a/components/doc/avatar/theming/tailwinddoc.js b/components/doc/avatar/theming/tailwinddoc.js index 22fecac375..b0a3d7d24b 100644 --- a/components/doc/avatar/theming/tailwinddoc.js +++ b/components/doc/avatar/theming/tailwinddoc.js @@ -90,7 +90,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/badge/importdoc.js b/components/doc/badge/importdoc.js index cb5e4640fb..ae3a910a1d 100644 --- a/components/doc/badge/importdoc.js +++ b/components/doc/badge/importdoc.js @@ -11,7 +11,7 @@ import { Badge } from 'primereact/badge'; return ( <> - + ); } diff --git a/components/doc/badge/theming/tailwinddoc.js b/components/doc/badge/theming/tailwinddoc.js index bf70ebdb77..ab8a4ddf32 100644 --- a/components/doc/badge/theming/tailwinddoc.js +++ b/components/doc/badge/theming/tailwinddoc.js @@ -70,7 +70,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/blockui/importdoc.js b/components/doc/blockui/importdoc.js index a2cb196f75..8d1ab01b33 100644 --- a/components/doc/blockui/importdoc.js +++ b/components/doc/blockui/importdoc.js @@ -11,7 +11,7 @@ import { BlockUI } from 'primereact/blockui'; return ( <> - + ); } diff --git a/components/doc/blockui/theming/tailwinddoc.js b/components/doc/blockui/theming/tailwinddoc.js index 68e5211d43..b1a419c5b5 100644 --- a/components/doc/blockui/theming/tailwinddoc.js +++ b/components/doc/blockui/theming/tailwinddoc.js @@ -52,7 +52,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/breadcrumb/importdoc.js b/components/doc/breadcrumb/importdoc.js index 373804170a..9d34ccf089 100644 --- a/components/doc/breadcrumb/importdoc.js +++ b/components/doc/breadcrumb/importdoc.js @@ -11,7 +11,7 @@ import { BreadCrumb } from 'primereact/breadcrumb'; return ( <> - + ); } diff --git a/components/doc/breadcrumb/theming/tailwinddoc.js b/components/doc/breadcrumb/theming/tailwinddoc.js index 63f931e5b7..9b38f65f2e 100644 --- a/components/doc/breadcrumb/theming/tailwinddoc.js +++ b/components/doc/breadcrumb/theming/tailwinddoc.js @@ -52,7 +52,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/button/accessibilitydoc.js b/components/doc/button/accessibilitydoc.js index 0504d01973..85967b6f61 100644 --- a/components/doc/button/accessibilitydoc.js +++ b/components/doc/button/accessibilitydoc.js @@ -23,7 +23,7 @@ export function AccessibilityDoc() { icon only or custom templating is used, it is recommended to use aria-label so that screen readers would be able to read the element properly.

- +

Keyboard Support

diff --git a/components/doc/button/importdoc.js b/components/doc/button/importdoc.js index 1e2c513f2d..7456537579 100644 --- a/components/doc/button/importdoc.js +++ b/components/doc/button/importdoc.js @@ -11,7 +11,7 @@ import { Button } from 'primereact/button'; return ( <> - + ); } diff --git a/components/doc/button/theming/tailwinddoc.js b/components/doc/button/theming/tailwinddoc.js index 380a729139..1a6cd357d2 100644 --- a/components/doc/button/theming/tailwinddoc.js +++ b/components/doc/button/theming/tailwinddoc.js @@ -140,7 +140,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/calendar/accessibilitydoc.js b/components/doc/calendar/accessibilitydoc.js index 284012dba6..3d873264f1 100644 --- a/components/doc/calendar/accessibilitydoc.js +++ b/components/doc/calendar/accessibilitydoc.js @@ -49,7 +49,7 @@ export function AccessibilityDoc() { Calendar also includes a hidden section that is only available to screen readers with aria-live as "polite". This element is updated when the selected date changes to instruct the user about the current date selected.

- +

Choose Date Button Keyboard Support

diff --git a/components/doc/calendar/importdoc.js b/components/doc/calendar/importdoc.js index 79b6f55624..f60c3f195a 100644 --- a/components/doc/calendar/importdoc.js +++ b/components/doc/calendar/importdoc.js @@ -11,7 +11,7 @@ import { Calendar } from 'primereact/calendar'; return ( <> - + ); } diff --git a/components/doc/calendar/theming/tailwinddoc.js b/components/doc/calendar/theming/tailwinddoc.js index b01bdd8260..2b8cbf948a 100644 --- a/components/doc/calendar/theming/tailwinddoc.js +++ b/components/doc/calendar/theming/tailwinddoc.js @@ -167,7 +167,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/captcha/importdoc.js b/components/doc/captcha/importdoc.js index 36814b46f3..f4d8063806 100644 --- a/components/doc/captcha/importdoc.js +++ b/components/doc/captcha/importdoc.js @@ -11,7 +11,7 @@ import { Captcha } from 'primereact/captcha'; return ( <> - + ); } diff --git a/components/doc/card/accessibilitydoc.js b/components/doc/card/accessibilitydoc.js index 88a24c8bdd..99af585a8f 100644 --- a/components/doc/card/accessibilitydoc.js +++ b/components/doc/card/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { roles like region, you may use the role property.

- +

Keyboard Support

Component does not include any interactive elements.

diff --git a/components/doc/card/importdoc.js b/components/doc/card/importdoc.js index 8b6cbabe79..329c855554 100644 --- a/components/doc/card/importdoc.js +++ b/components/doc/card/importdoc.js @@ -11,7 +11,7 @@ import { Card } from 'primereact/card'; return ( <> - + ); } diff --git a/components/doc/card/theming/tailwinddoc.js b/components/doc/card/theming/tailwinddoc.js index 42cbd87da8..817e718761 100644 --- a/components/doc/card/theming/tailwinddoc.js +++ b/components/doc/card/theming/tailwinddoc.js @@ -66,7 +66,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/carousel/importdoc.js b/components/doc/carousel/importdoc.js index 4664dbe77d..5127af9535 100644 --- a/components/doc/carousel/importdoc.js +++ b/components/doc/carousel/importdoc.js @@ -11,7 +11,7 @@ import { Carousel } from 'primereact/carousel'; return ( <> - + ); } diff --git a/components/doc/carousel/theming/tailwinddoc.js b/components/doc/carousel/theming/tailwinddoc.js index 9d4a4f85d0..2e945cb313 100644 --- a/components/doc/carousel/theming/tailwinddoc.js +++ b/components/doc/carousel/theming/tailwinddoc.js @@ -129,7 +129,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/cascadeselect/accessibilitydoc.js b/components/doc/cascadeselect/accessibilitydoc.js index c50f463481..bc1396b699 100644 --- a/components/doc/cascadeselect/accessibilitydoc.js +++ b/components/doc/cascadeselect/accessibilitydoc.js @@ -27,7 +27,7 @@ export function AccessibilityDoc() { If filtering is enabled, filterInputProps can be defined to give aria-* props to the filter input element.

- +

Closed State Keyboard Support

diff --git a/components/doc/cascadeselect/importdoc.js b/components/doc/cascadeselect/importdoc.js index afa2a26ee1..aa589848cf 100644 --- a/components/doc/cascadeselect/importdoc.js +++ b/components/doc/cascadeselect/importdoc.js @@ -11,7 +11,7 @@ import { CascadeSelect } from 'primereact/cascadeselect'; return ( <> - + ); } diff --git a/components/doc/cascadeselect/theming/tailwinddoc.js b/components/doc/cascadeselect/theming/tailwinddoc.js index 994c1191b0..1adc21703b 100644 --- a/components/doc/cascadeselect/theming/tailwinddoc.js +++ b/components/doc/cascadeselect/theming/tailwinddoc.js @@ -150,7 +150,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/chart/accessibilitydoc.js b/components/doc/chart/accessibilitydoc.js index b127d465ef..db4391b50d 100644 --- a/components/doc/chart/accessibilitydoc.js +++ b/components/doc/chart/accessibilitydoc.js @@ -23,7 +23,7 @@ export function AccessibilityDoc() { guide for more information. The canvas element can be customized with canvasProps property to define aria roles and properties, in addition any content inside the component is directly passed as a child of the canvas to be able to provide fallback content like a table.

- + ); } diff --git a/components/doc/chart/chartjsdoc.js b/components/doc/chart/chartjsdoc.js index 66f2553957..09db954d38 100644 --- a/components/doc/chart/chartjsdoc.js +++ b/components/doc/chart/chartjsdoc.js @@ -15,7 +15,7 @@ npm install chart.js Chart component uses Chart.JS underneath so it needs to be installed as a dependency.

- + ); } diff --git a/components/doc/chart/importdoc.js b/components/doc/chart/importdoc.js index 5dcec213e9..ef1f445ef7 100644 --- a/components/doc/chart/importdoc.js +++ b/components/doc/chart/importdoc.js @@ -11,7 +11,7 @@ import { Chart } from 'primereact/chart'; return ( <> - + ); } diff --git a/components/doc/chart/theming/tailwinddoc.js b/components/doc/chart/theming/tailwinddoc.js index 35dc63c4c3..1862e88f5f 100644 --- a/components/doc/chart/theming/tailwinddoc.js +++ b/components/doc/chart/theming/tailwinddoc.js @@ -73,7 +73,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/checkbox/accessibilitydoc.js b/components/doc/checkbox/accessibilitydoc.js index 85cf17845e..bd35f90b4f 100644 --- a/components/doc/checkbox/accessibilitydoc.js +++ b/components/doc/checkbox/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-labelledby, aria-label props.

- +

Keyboard Support

diff --git a/components/doc/checkbox/importdoc.js b/components/doc/checkbox/importdoc.js index 630bbbddce..b8f638a5d2 100644 --- a/components/doc/checkbox/importdoc.js +++ b/components/doc/checkbox/importdoc.js @@ -11,7 +11,7 @@ import { Checkbox } from 'primereact/checkbox'; return ( <> - + ); } diff --git a/components/doc/checkbox/theming/tailwinddoc.js b/components/doc/checkbox/theming/tailwinddoc.js index b82e318e25..802541acfc 100644 --- a/components/doc/checkbox/theming/tailwinddoc.js +++ b/components/doc/checkbox/theming/tailwinddoc.js @@ -54,7 +54,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/chip/importdoc.js b/components/doc/chip/importdoc.js index 37da39e5b0..e32938fe39 100644 --- a/components/doc/chip/importdoc.js +++ b/components/doc/chip/importdoc.js @@ -11,7 +11,7 @@ import { Chip } from 'primereact/chip'; return ( <> - + ); } diff --git a/components/doc/chip/theming/tailwinddoc.js b/components/doc/chip/theming/tailwinddoc.js index ace3f12e4c..bc30477550 100644 --- a/components/doc/chip/theming/tailwinddoc.js +++ b/components/doc/chip/theming/tailwinddoc.js @@ -48,7 +48,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/chips/accessibilitydoc.js b/components/doc/chips/accessibilitydoc.js index 4269f6e454..ce0174b365 100644 --- a/components/doc/chips/accessibilitydoc.js +++ b/components/doc/chips/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { set to horizontal whereas each chip has the option role with aria-label set to the label of the chip.

- +

Input Field Keyboard Support

diff --git a/components/doc/chips/importdoc.js b/components/doc/chips/importdoc.js index 87b52d28fc..78ee99c3e6 100644 --- a/components/doc/chips/importdoc.js +++ b/components/doc/chips/importdoc.js @@ -11,7 +11,7 @@ import { Chips } from 'primereact/chips'; return ( <> - + ); } diff --git a/components/doc/chips/theming/tailwinddoc.js b/components/doc/chips/theming/tailwinddoc.js index d8f2670976..3f2ffb8b77 100644 --- a/components/doc/chips/theming/tailwinddoc.js +++ b/components/doc/chips/theming/tailwinddoc.js @@ -59,7 +59,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/colorpicker/importdoc.js b/components/doc/colorpicker/importdoc.js index 555d4edc6f..1299c85497 100644 --- a/components/doc/colorpicker/importdoc.js +++ b/components/doc/colorpicker/importdoc.js @@ -11,7 +11,7 @@ import { ColorPicker } from 'primereact/colorpicker'; return ( <> - + ); } diff --git a/components/doc/colorpicker/theming/tailwinddoc.js b/components/doc/colorpicker/theming/tailwinddoc.js index 80ec24edae..2350e4e25e 100644 --- a/components/doc/colorpicker/theming/tailwinddoc.js +++ b/components/doc/colorpicker/theming/tailwinddoc.js @@ -78,7 +78,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/colors/overviewdoc.js b/components/doc/colors/overviewdoc.js index 29918626ef..0497d57e57 100644 --- a/components/doc/colors/overviewdoc.js +++ b/components/doc/colors/overviewdoc.js @@ -81,7 +81,7 @@ export function OverviewDoc(props) {
Highlighted Item
Primary Color
- + ); } diff --git a/components/doc/common/docsectioncode.js b/components/doc/common/docsectioncode.js index 1c1a8c9552..5fcbacff81 100644 --- a/components/doc/common/docsectioncode.js +++ b/components/doc/common/docsectioncode.js @@ -77,19 +77,6 @@ export function DocSectionCode(props) { ) : null} - {!props.hideCodeSandbox && ( - - )} {!props.hideStackBlitz && (
- +

Layers also make it possible to use CSS Modules, view the CSS Modules guide for examples.

diff --git a/components/doc/csslayer/tailwinddoc.js b/components/doc/csslayer/tailwinddoc.js index 41aadaebb1..c663e6a850 100644 --- a/components/doc/csslayer/tailwinddoc.js +++ b/components/doc/csslayer/tailwinddoc.js @@ -26,7 +26,7 @@ export function TailwindDoc(props) { . If you are using this feature, wrap the base and utilities in separate layers and make sure primereact layer comes after the base.{' '}

- + ); } diff --git a/components/doc/customicons/fontawesomedoc.js b/components/doc/customicons/fontawesomedoc.js index ea513ce369..899dedbbf0 100644 --- a/components/doc/customicons/fontawesomedoc.js +++ b/components/doc/customicons/fontawesomedoc.js @@ -19,7 +19,7 @@ export function FontAwesomeDoc(props) { Font Awesome is a popular icon library with a wide range of icons.

- + ); } diff --git a/components/doc/customicons/imagedoc.js b/components/doc/customicons/imagedoc.js index c676530e24..f636b0776e 100644 --- a/components/doc/customicons/imagedoc.js +++ b/components/doc/customicons/imagedoc.js @@ -13,7 +13,7 @@ export function ImageDoc(props) {

Any time of image can be used as an icon.

 - + ); } diff --git a/components/doc/customicons/materialdoc.js b/components/doc/customicons/materialdoc.js index 4f23ee6d8b..70fcccf499 100644 --- a/components/doc/customicons/materialdoc.js +++ b/components/doc/customicons/materialdoc.js @@ -17,7 +17,7 @@ import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'; Material icons is the official icon library based on Google Material Design.

- + ); } diff --git a/components/doc/customicons/svgdoc.js b/components/doc/customicons/svgdoc.js index 031b1262df..3dbfc0070b 100644 --- a/components/doc/customicons/svgdoc.js +++ b/components/doc/customicons/svgdoc.js @@ -18,7 +18,7 @@ export function SVGDoc(props) {

Inline SVGs are embedded inside the DOM.

 - + ); } diff --git a/components/doc/datascroller/importdoc.js b/components/doc/datascroller/importdoc.js index a7c6d2719a..28729c9114 100644 --- a/components/doc/datascroller/importdoc.js +++ b/components/doc/datascroller/importdoc.js @@ -11,7 +11,7 @@ import { DataScroller } from 'primereact/datascroller'; return ( <> - + ); } diff --git a/components/doc/datascroller/theming/tailwinddoc.js b/components/doc/datascroller/theming/tailwinddoc.js index 430d500df1..f6e9994395 100644 --- a/components/doc/datascroller/theming/tailwinddoc.js +++ b/components/doc/datascroller/theming/tailwinddoc.js @@ -96,7 +96,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/datatable/importdoc.js b/components/doc/datatable/importdoc.js index c10b66f088..09f4a7f768 100644 --- a/components/doc/datatable/importdoc.js +++ b/components/doc/datatable/importdoc.js @@ -12,7 +12,7 @@ import { Column } from 'primereact/column'; return ( <> - + ); } diff --git a/components/doc/datatable/theming/tailwinddoc.js b/components/doc/datatable/theming/tailwinddoc.js index 1dd344d10c..558dc2e625 100644 --- a/components/doc/datatable/theming/tailwinddoc.js +++ b/components/doc/datatable/theming/tailwinddoc.js @@ -569,7 +569,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/dataview/importdoc.js b/components/doc/dataview/importdoc.js index 0e7b6bf9f5..81ea7a36a0 100644 --- a/components/doc/dataview/importdoc.js +++ b/components/doc/dataview/importdoc.js @@ -11,7 +11,7 @@ import { DataView, DataViewLayoutOptions } from 'primereact/dataview'; return ( <> - + ); } diff --git a/components/doc/dataview/theming/tailwinddoc.js b/components/doc/dataview/theming/tailwinddoc.js index 81667a66bd..5d9859283e 100644 --- a/components/doc/dataview/theming/tailwinddoc.js +++ b/components/doc/dataview/theming/tailwinddoc.js @@ -170,7 +170,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/deferredcontent/importdoc.js b/components/doc/deferredcontent/importdoc.js index e06926187a..3d2defd0cd 100644 --- a/components/doc/deferredcontent/importdoc.js +++ b/components/doc/deferredcontent/importdoc.js @@ -11,7 +11,7 @@ import { DeferredContent } from 'primereact/deferredcontent'; return ( <> - + ); } diff --git a/components/doc/dialog/importdoc.js b/components/doc/dialog/importdoc.js index 1ec4b55f41..77a1fb1326 100644 --- a/components/doc/dialog/importdoc.js +++ b/components/doc/dialog/importdoc.js @@ -11,7 +11,7 @@ import { Dialog } from 'primereact/dialog'; return ( <> - + ); } diff --git a/components/doc/dialog/theming/tailwinddoc.js b/components/doc/dialog/theming/tailwinddoc.js index 51216af5a1..c1cafae6c2 100644 --- a/components/doc/dialog/theming/tailwinddoc.js +++ b/components/doc/dialog/theming/tailwinddoc.js @@ -112,7 +112,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/divider/importdoc.js b/components/doc/divider/importdoc.js index fbdf5bded1..fd0df38057 100644 --- a/components/doc/divider/importdoc.js +++ b/components/doc/divider/importdoc.js @@ -11,7 +11,7 @@ import { Divider } from 'primereact/divider'; return ( <> - + ); } diff --git a/components/doc/divider/theming/tailwinddoc.js b/components/doc/divider/theming/tailwinddoc.js index 8c1eb5c9dc..b4a1978f08 100644 --- a/components/doc/divider/theming/tailwinddoc.js +++ b/components/doc/divider/theming/tailwinddoc.js @@ -80,7 +80,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/dock/importdoc.js b/components/doc/dock/importdoc.js index 487febf0cf..3d8a6daf5e 100644 --- a/components/doc/dock/importdoc.js +++ b/components/doc/dock/importdoc.js @@ -11,7 +11,7 @@ import { Dock } from 'primereact/dock'; return ( <> - + ); } diff --git a/components/doc/dock/theming/tailwinddoc.js b/components/doc/dock/theming/tailwinddoc.js index a2b47010c9..e492eeab19 100644 --- a/components/doc/dock/theming/tailwinddoc.js +++ b/components/doc/dock/theming/tailwinddoc.js @@ -141,7 +141,7 @@ export default function BasicDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/dropdown/accessibilitydoc.js b/components/doc/dropdown/accessibilitydoc.js index c24792805d..35727b78e4 100644 --- a/components/doc/dropdown/accessibilitydoc.js +++ b/components/doc/dropdown/accessibilitydoc.js @@ -28,7 +28,7 @@ export function AccessibilityDoc() { If filtering is enabled, filterInputProps can be defined to give aria-* props to the filter input element.

- +

Closed State Keyboard Support

diff --git a/components/doc/dropdown/importdoc.js b/components/doc/dropdown/importdoc.js index c74eeda66c..7a5c87f673 100644 --- a/components/doc/dropdown/importdoc.js +++ b/components/doc/dropdown/importdoc.js @@ -11,7 +11,7 @@ import { Dropdown } from 'primereact/dropdown'; return ( <> - + ); } diff --git a/components/doc/dropdown/theming/tailwinddoc.js b/components/doc/dropdown/theming/tailwinddoc.js index c48a689670..836a6fc0db 100644 --- a/components/doc/dropdown/theming/tailwinddoc.js +++ b/components/doc/dropdown/theming/tailwinddoc.js @@ -114,7 +114,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/editor/importdoc.js b/components/doc/editor/importdoc.js index 9c1c5d96de..8c8563db6d 100644 --- a/components/doc/editor/importdoc.js +++ b/components/doc/editor/importdoc.js @@ -11,7 +11,7 @@ import { Editor } from 'primereact/editor'; return ( <> - + ); } diff --git a/components/doc/editor/quilldoc.js b/components/doc/editor/quilldoc.js index 57768944fc..2c5d0fecb7 100644 --- a/components/doc/editor/quilldoc.js +++ b/components/doc/editor/quilldoc.js @@ -15,7 +15,7 @@ npm install quill Editor uses Quill editor underneath so it needs to be installed as a dependency.

- + ); } diff --git a/components/doc/editor/theming/tailwinddoc.js b/components/doc/editor/theming/tailwinddoc.js index 4d97ef1bb9..6298d02401 100644 --- a/components/doc/editor/theming/tailwinddoc.js +++ b/components/doc/editor/theming/tailwinddoc.js @@ -45,7 +45,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/fieldset/importdoc.js b/components/doc/fieldset/importdoc.js index 550358d7e3..b991233c3b 100644 --- a/components/doc/fieldset/importdoc.js +++ b/components/doc/fieldset/importdoc.js @@ -11,7 +11,7 @@ import { Fieldset } from 'primereact/fieldset'; return ( <> - + ); } diff --git a/components/doc/fieldset/theming/tailwinddoc.js b/components/doc/fieldset/theming/tailwinddoc.js index 125987f289..59a92c16d1 100644 --- a/components/doc/fieldset/theming/tailwinddoc.js +++ b/components/doc/fieldset/theming/tailwinddoc.js @@ -78,7 +78,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/fileupload/importdoc.js b/components/doc/fileupload/importdoc.js index f4cdaf17bf..0ad6837071 100644 --- a/components/doc/fileupload/importdoc.js +++ b/components/doc/fileupload/importdoc.js @@ -11,7 +11,7 @@ import { FileUpload } from 'primereact/fileupload'; return ( <> - + ); } diff --git a/components/doc/fileupload/theming/tailwinddoc.js b/components/doc/fileupload/theming/tailwinddoc.js index 0e5e4bfa42..52afd3ba1e 100644 --- a/components/doc/fileupload/theming/tailwinddoc.js +++ b/components/doc/fileupload/theming/tailwinddoc.js @@ -63,7 +63,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/galleria/importdoc.js b/components/doc/galleria/importdoc.js index f41c05ba4a..75eceedf26 100644 --- a/components/doc/galleria/importdoc.js +++ b/components/doc/galleria/importdoc.js @@ -11,7 +11,7 @@ import { Galleria } from 'primereact/galleria'; return ( <> - + ); } diff --git a/components/doc/galleria/theming/tailwinddoc.js b/components/doc/galleria/theming/tailwinddoc.js index 402c604cd6..0bea93b25a 100644 --- a/components/doc/galleria/theming/tailwinddoc.js +++ b/components/doc/galleria/theming/tailwinddoc.js @@ -145,7 +145,7 @@ export default function UnstyleDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/gmap/importdoc.js b/components/doc/gmap/importdoc.js index 4ae1a7f6dc..2475e6f134 100644 --- a/components/doc/gmap/importdoc.js +++ b/components/doc/gmap/importdoc.js @@ -11,7 +11,7 @@ import { GMap } from 'primereact/gmap'; return ( <> - + ); } diff --git a/components/doc/hooks/useclickoutside/importdoc.js b/components/doc/hooks/useclickoutside/importdoc.js index 72fab26036..e68e6a182a 100644 --- a/components/doc/hooks/useclickoutside/importdoc.js +++ b/components/doc/hooks/useclickoutside/importdoc.js @@ -11,7 +11,7 @@ import { useClickOutside } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usecounter/importdoc.js b/components/doc/hooks/usecounter/importdoc.js index 174f3b4336..e7ed9dc6fc 100644 --- a/components/doc/hooks/usecounter/importdoc.js +++ b/components/doc/hooks/usecounter/importdoc.js @@ -11,7 +11,7 @@ import { useCounter } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usedebounce/importdoc.js b/components/doc/hooks/usedebounce/importdoc.js index ac4fbab719..cce68227b8 100644 --- a/components/doc/hooks/usedebounce/importdoc.js +++ b/components/doc/hooks/usedebounce/importdoc.js @@ -11,7 +11,7 @@ import { useDebounce } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useeventlistener/importdoc.js b/components/doc/hooks/useeventlistener/importdoc.js index 66cde4cdad..0f8d3bc158 100644 --- a/components/doc/hooks/useeventlistener/importdoc.js +++ b/components/doc/hooks/useeventlistener/importdoc.js @@ -11,7 +11,7 @@ import { useEventListener } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usefavicon/importdoc.js b/components/doc/hooks/usefavicon/importdoc.js index 3fda703872..13bfe0922a 100644 --- a/components/doc/hooks/usefavicon/importdoc.js +++ b/components/doc/hooks/usefavicon/importdoc.js @@ -11,7 +11,7 @@ import { useFavicon } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useintersectionobserver/importdoc.js b/components/doc/hooks/useintersectionobserver/importdoc.js index 3e2e45db8e..d2c5e11400 100644 --- a/components/doc/hooks/useintersectionobserver/importdoc.js +++ b/components/doc/hooks/useintersectionobserver/importdoc.js @@ -11,7 +11,7 @@ import { useIntersectionObserver } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useinterval/importdoc.js b/components/doc/hooks/useinterval/importdoc.js index c1c4f949c3..b56bb3217c 100644 --- a/components/doc/hooks/useinterval/importdoc.js +++ b/components/doc/hooks/useinterval/importdoc.js @@ -11,7 +11,7 @@ import { useInterval } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usemounteffect/importdoc.js b/components/doc/hooks/usemounteffect/importdoc.js index 25b149c43e..006fb6cca0 100644 --- a/components/doc/hooks/usemounteffect/importdoc.js +++ b/components/doc/hooks/usemounteffect/importdoc.js @@ -11,7 +11,7 @@ import { useMountEffect } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usemouse/importdoc.js b/components/doc/hooks/usemouse/importdoc.js index 5f4e86577e..7daaddf0ea 100644 --- a/components/doc/hooks/usemouse/importdoc.js +++ b/components/doc/hooks/usemouse/importdoc.js @@ -11,7 +11,7 @@ import { useMouse } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usemove/importdoc.js b/components/doc/hooks/usemove/importdoc.js index 85258044dd..a87b24fbd0 100644 --- a/components/doc/hooks/usemove/importdoc.js +++ b/components/doc/hooks/usemove/importdoc.js @@ -11,7 +11,7 @@ import { useMove } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useoverlaylistener/importdoc.js b/components/doc/hooks/useoverlaylistener/importdoc.js index 0008c00888..5b3f51c154 100644 --- a/components/doc/hooks/useoverlaylistener/importdoc.js +++ b/components/doc/hooks/useoverlaylistener/importdoc.js @@ -11,7 +11,7 @@ import { useOverlayListener } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useoverlayscrolllistener/importdoc.js b/components/doc/hooks/useoverlayscrolllistener/importdoc.js index 991efcfb2c..f3a9a93234 100644 --- a/components/doc/hooks/useoverlayscrolllistener/importdoc.js +++ b/components/doc/hooks/useoverlayscrolllistener/importdoc.js @@ -11,7 +11,7 @@ import { useOverlayScrollListener } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useprevious/importdoc.js b/components/doc/hooks/useprevious/importdoc.js index 728f58b1e3..ba99ac9737 100644 --- a/components/doc/hooks/useprevious/importdoc.js +++ b/components/doc/hooks/useprevious/importdoc.js @@ -11,7 +11,7 @@ import { usePrevious } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useresizelistener/importdoc.js b/components/doc/hooks/useresizelistener/importdoc.js index 2ff5731f20..d4ad9e634a 100644 --- a/components/doc/hooks/useresizelistener/importdoc.js +++ b/components/doc/hooks/useresizelistener/importdoc.js @@ -11,7 +11,7 @@ import { useResizeListener } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usestorage/importdoc.js b/components/doc/hooks/usestorage/importdoc.js index 5dca32f62e..a1f6881305 100644 --- a/components/doc/hooks/usestorage/importdoc.js +++ b/components/doc/hooks/usestorage/importdoc.js @@ -12,7 +12,7 @@ import { useSessionStorage } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/usetimeout/importdoc.js b/components/doc/hooks/usetimeout/importdoc.js index a06c71ec7d..36e35fb00b 100644 --- a/components/doc/hooks/usetimeout/importdoc.js +++ b/components/doc/hooks/usetimeout/importdoc.js @@ -11,7 +11,7 @@ import { useTimout } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useunmounteffect/importdoc.js b/components/doc/hooks/useunmounteffect/importdoc.js index 42fb07376f..ec8e67ffaf 100644 --- a/components/doc/hooks/useunmounteffect/importdoc.js +++ b/components/doc/hooks/useunmounteffect/importdoc.js @@ -11,7 +11,7 @@ import { useUnmountEffect } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/hooks/useupdateeffect/importdoc.js b/components/doc/hooks/useupdateeffect/importdoc.js index 1a59f0b772..0b7d8fb1fe 100644 --- a/components/doc/hooks/useupdateeffect/importdoc.js +++ b/components/doc/hooks/useupdateeffect/importdoc.js @@ -11,7 +11,7 @@ import { useUpdateEffect } from 'primereact/hooks'; return ( <> - + ); } diff --git a/components/doc/icons/basicdoc.js b/components/doc/icons/basicdoc.js index dad86d836b..7edb9255ce 100644 --- a/components/doc/icons/basicdoc.js +++ b/components/doc/icons/basicdoc.js @@ -24,7 +24,7 @@ export function BasicDoc(props) {
- + ); } diff --git a/components/doc/icons/colordoc.js b/components/doc/icons/colordoc.js index cea183ec34..f3e73d34f4 100644 --- a/components/doc/icons/colordoc.js +++ b/components/doc/icons/colordoc.js @@ -24,7 +24,7 @@ export function ColorDoc(props) {
- + ); } diff --git a/components/doc/icons/constantsdoc.js b/components/doc/icons/constantsdoc.js index aeb4bc0f0d..35e2c769f8 100644 --- a/components/doc/icons/constantsdoc.js +++ b/components/doc/icons/constantsdoc.js @@ -46,7 +46,7 @@ export default function ConstantsDemo() {
- + ); } diff --git a/components/doc/icons/downloaddoc.js b/components/doc/icons/downloaddoc.js index 7818c5cf08..be443e79a5 100644 --- a/components/doc/icons/downloaddoc.js +++ b/components/doc/icons/downloaddoc.js @@ -13,7 +13,7 @@ npm install primeicons

PrimeIcons is available at npm, run the following command to download it to your project.

 - + ); } diff --git a/components/doc/icons/importdoc.js b/components/doc/icons/importdoc.js index 39268dea10..ef9428b9c3 100644 --- a/components/doc/icons/importdoc.js +++ b/components/doc/icons/importdoc.js @@ -13,7 +13,7 @@ import 'primeicons/primeicons.css';

CSS file of the icon library needs to be imported in your application.

 - + ); } diff --git a/components/doc/icons/sizedoc.js b/components/doc/icons/sizedoc.js index c4c9794393..4d91098893 100644 --- a/components/doc/icons/sizedoc.js +++ b/components/doc/icons/sizedoc.js @@ -22,7 +22,7 @@ export function SizeDoc(props) {
- + ); } diff --git a/components/doc/icons/spindoc.js b/components/doc/icons/spindoc.js index e6aa30fbd3..b03a91a67b 100644 --- a/components/doc/icons/spindoc.js +++ b/components/doc/icons/spindoc.js @@ -20,7 +20,7 @@ export function SpinDoc(props) {
- + ); } diff --git a/components/doc/image/importdoc.js b/components/doc/image/importdoc.js index 9da10ccbd0..603b81db1c 100644 --- a/components/doc/image/importdoc.js +++ b/components/doc/image/importdoc.js @@ -11,7 +11,7 @@ import { Image } from 'primereact/image'; return ( <> - + ); } diff --git a/components/doc/image/theming/tailwinddoc.js b/components/doc/image/theming/tailwinddoc.js index c191c4ba6b..6727d82ab8 100644 --- a/components/doc/image/theming/tailwinddoc.js +++ b/components/doc/image/theming/tailwinddoc.js @@ -99,7 +99,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inplace/importdoc.js b/components/doc/inplace/importdoc.js index 26dfb0db5b..a8a1cb5442 100644 --- a/components/doc/inplace/importdoc.js +++ b/components/doc/inplace/importdoc.js @@ -11,7 +11,7 @@ import { Inplace, InplaceDisplay, InplaceContent } from 'primereact/inplace'; return ( <> - + ); } diff --git a/components/doc/inplace/theming/tailwinddoc.js b/components/doc/inplace/theming/tailwinddoc.js index 4e4b9b6e70..6180c4a749 100644 --- a/components/doc/inplace/theming/tailwinddoc.js +++ b/components/doc/inplace/theming/tailwinddoc.js @@ -47,7 +47,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inputmask/accessibilitydoc.js b/components/doc/inputmask/accessibilitydoc.js index ada6d741d1..630e508057 100644 --- a/components/doc/inputmask/accessibilitydoc.js +++ b/components/doc/inputmask/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-label props.

- +

Keyboard Support

diff --git a/components/doc/inputmask/importdoc.js b/components/doc/inputmask/importdoc.js index 9c52381058..1f5a764bd5 100644 --- a/components/doc/inputmask/importdoc.js +++ b/components/doc/inputmask/importdoc.js @@ -11,7 +11,7 @@ import { InputMask } from 'primereact/inputmask'; return ( <> - + ); } diff --git a/components/doc/inputmask/theming/tailwinddoc.js b/components/doc/inputmask/theming/tailwinddoc.js index c515dfcafa..6755b17a4f 100644 --- a/components/doc/inputmask/theming/tailwinddoc.js +++ b/components/doc/inputmask/theming/tailwinddoc.js @@ -37,7 +37,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inputnumber/accessibilitydoc.js b/components/doc/inputnumber/accessibilitydoc.js index 5f163c5525..18df032273 100644 --- a/components/doc/inputnumber/accessibilitydoc.js +++ b/components/doc/inputnumber/accessibilitydoc.js @@ -23,7 +23,7 @@ export function AccessibilityDoc() { and input.

- +

Keyboard Support

diff --git a/components/doc/inputnumber/importdoc.js b/components/doc/inputnumber/importdoc.js index 040e4f8807..e1a21a5ec7 100644 --- a/components/doc/inputnumber/importdoc.js +++ b/components/doc/inputnumber/importdoc.js @@ -11,7 +11,7 @@ import { InputNumber } from 'primereact/inputnumber'; return ( <> - + ); } diff --git a/components/doc/inputnumber/theming/tailwinddoc.js b/components/doc/inputnumber/theming/tailwinddoc.js index 962a9856f4..520bee5c7b 100644 --- a/components/doc/inputnumber/theming/tailwinddoc.js +++ b/components/doc/inputnumber/theming/tailwinddoc.js @@ -73,7 +73,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inputswitch/accessibilitydoc.js b/components/doc/inputswitch/accessibilitydoc.js index 32c569f4d2..a980ac52da 100644 --- a/components/doc/inputswitch/accessibilitydoc.js +++ b/components/doc/inputswitch/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { inputId prop or using aria-labelledby, aria-label props.

- +

Keyboard Support

diff --git a/components/doc/inputswitch/importdoc.js b/components/doc/inputswitch/importdoc.js index abb07b004e..25238bf246 100644 --- a/components/doc/inputswitch/importdoc.js +++ b/components/doc/inputswitch/importdoc.js @@ -11,7 +11,7 @@ import { InputSwitch } from 'primereact/inputswitch'; return ( <> - + ); } diff --git a/components/doc/inputswitch/theming/tailwinddoc.js b/components/doc/inputswitch/theming/tailwinddoc.js index 9d9fb746f2..cabaaf18f7 100644 --- a/components/doc/inputswitch/theming/tailwinddoc.js +++ b/components/doc/inputswitch/theming/tailwinddoc.js @@ -54,7 +54,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inputtext/accessibilitydoc.js b/components/doc/inputtext/accessibilitydoc.js index ed86af7735..6f15812091 100644 --- a/components/doc/inputtext/accessibilitydoc.js +++ b/components/doc/inputtext/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-label props.

- +

Keyboard Support

diff --git a/components/doc/inputtext/importdoc.js b/components/doc/inputtext/importdoc.js index e42861d2a6..37e8b905d2 100644 --- a/components/doc/inputtext/importdoc.js +++ b/components/doc/inputtext/importdoc.js @@ -11,7 +11,7 @@ import { InputText } from 'primereact/inputtext'; return ( <> - + ); } diff --git a/components/doc/inputtext/theming/tailwinddoc.js b/components/doc/inputtext/theming/tailwinddoc.js index db48398a7d..345db0ded3 100644 --- a/components/doc/inputtext/theming/tailwinddoc.js +++ b/components/doc/inputtext/theming/tailwinddoc.js @@ -51,7 +51,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/inputtextarea/accessibilitydoc.js b/components/doc/inputtextarea/accessibilitydoc.js index faeeacbb19..0a926dcca2 100644 --- a/components/doc/inputtextarea/accessibilitydoc.js +++ b/components/doc/inputtextarea/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-labelledby, aria-label props.

- +

Keyboard Support

diff --git a/components/doc/inputtextarea/importdoc.js b/components/doc/inputtextarea/importdoc.js index 211c90af6b..1e0a45b7ed 100644 --- a/components/doc/inputtextarea/importdoc.js +++ b/components/doc/inputtextarea/importdoc.js @@ -11,7 +11,7 @@ import { InputTextarea } from 'primereact/inputtextarea'; return ( <> - + ); } diff --git a/components/doc/inputtextarea/theming/tailwinddoc.js b/components/doc/inputtextarea/theming/tailwinddoc.js index d8e7936985..e0cd265844 100644 --- a/components/doc/inputtextarea/theming/tailwinddoc.js +++ b/components/doc/inputtextarea/theming/tailwinddoc.js @@ -44,7 +44,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/installation/context.js b/components/doc/installation/context.js index e8e2f262af..8f639fd99c 100644 --- a/components/doc/installation/context.js +++ b/components/doc/installation/context.js @@ -30,13 +30,13 @@ export default function MyApp({ Component, pageProps }) { Configuration is managed by the PrimeReactProvider and PrimeReactContext imported from primereact/api.

- +

The PrimeReactProvider component is used to wrap the application and the PrimeReactContext is used to access the configuration options.

- + ); } diff --git a/components/doc/installation/downloaddoc.js b/components/doc/installation/downloaddoc.js index 3119c44c5a..321f7595ba 100644 --- a/components/doc/installation/downloaddoc.js +++ b/components/doc/installation/downloaddoc.js @@ -19,7 +19,7 @@ yarn add primereact PrimeReact is available for download at npm.

- + ); } diff --git a/components/doc/installation/styleddoc.js b/components/doc/installation/styleddoc.js index 41c7b72051..dcec89a2d7 100644 --- a/components/doc/installation/styleddoc.js +++ b/components/doc/installation/styleddoc.js @@ -16,7 +16,7 @@ import "primereact/resources/themes/lara-light-cyan/theme.css"; 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.

- + ); diff --git a/components/doc/installation/unstyledmodedoc.js b/components/doc/installation/unstyledmodedoc.js index 3321e9c5dd..9b8018e6bf 100644 --- a/components/doc/installation/unstyledmodedoc.js +++ b/components/doc/installation/unstyledmodedoc.js @@ -22,7 +22,7 @@ return( Unstyled mode is disabled by default for all components. Using the PrimeReactContext during installation, set unstyled as true to enable it globally. Visit the Unstyled mode documentation for more information and examples.

- + ); diff --git a/components/doc/keyfilter/importdoc.js b/components/doc/keyfilter/importdoc.js index e42861d2a6..37e8b905d2 100644 --- a/components/doc/keyfilter/importdoc.js +++ b/components/doc/keyfilter/importdoc.js @@ -11,7 +11,7 @@ import { InputText } from 'primereact/inputtext'; return ( <> - + ); } diff --git a/components/doc/knob/accessibilitydoc.js b/components/doc/knob/accessibilitydoc.js index 4ade12588c..88b0dce489 100644 --- a/components/doc/knob/accessibilitydoc.js +++ b/components/doc/knob/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-labelledby and aria-label props.

- +

Keyboard Support

diff --git a/components/doc/knob/importdoc.js b/components/doc/knob/importdoc.js index 7e39914778..d99c28c1d7 100644 --- a/components/doc/knob/importdoc.js +++ b/components/doc/knob/importdoc.js @@ -11,7 +11,7 @@ import { Knob } from 'primereact/knob'; return ( <> - + ); } diff --git a/components/doc/knob/theming/tailwinddoc.js b/components/doc/knob/theming/tailwinddoc.js index 67020b4c86..70d6e868a6 100644 --- a/components/doc/knob/theming/tailwinddoc.js +++ b/components/doc/knob/theming/tailwinddoc.js @@ -44,7 +44,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/listbox/accessibilitydoc.js b/components/doc/listbox/accessibilitydoc.js index 14785a41b5..4ca69b769d 100644 --- a/components/doc/listbox/accessibilitydoc.js +++ b/components/doc/listbox/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { If filtering is enabled, filterInputProps can be defined to give aria-* props to the input element. Alternatively filterPlaceholder is usually utilized by the screen readers as well.

- +

Keyboard Support

diff --git a/components/doc/listbox/importdoc.js b/components/doc/listbox/importdoc.js index 5bdbfc0693..61314dd422 100644 --- a/components/doc/listbox/importdoc.js +++ b/components/doc/listbox/importdoc.js @@ -11,7 +11,7 @@ import { ListBox } from 'primereact/listbox'; return ( <> - + ); } diff --git a/components/doc/listbox/theming/tailwinddoc.js b/components/doc/listbox/theming/tailwinddoc.js index b3b7186761..2669e3f0d2 100644 --- a/components/doc/listbox/theming/tailwinddoc.js +++ b/components/doc/listbox/theming/tailwinddoc.js @@ -75,7 +75,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/megamenu/commanddoc.js b/components/doc/megamenu/commanddoc.js index fc175435ed..75b52fb07e 100644 --- a/components/doc/megamenu/commanddoc.js +++ b/components/doc/megamenu/commanddoc.js @@ -21,7 +21,7 @@ export function CommandDoc(props) { The command property of a menuitem defines the callback to run when an item is activated by click or a key event.

- + ); } diff --git a/components/doc/megamenu/importdoc.js b/components/doc/megamenu/importdoc.js index 60736b9dbe..397c7509a9 100644 --- a/components/doc/megamenu/importdoc.js +++ b/components/doc/megamenu/importdoc.js @@ -11,7 +11,7 @@ import { MegaMenu } from 'primereact/megamenu'; return ( <> - + ); } diff --git a/components/doc/megamenu/routerdoc.js b/components/doc/megamenu/routerdoc.js index a0da8a3042..9b47d037e6 100644 --- a/components/doc/megamenu/routerdoc.js +++ b/components/doc/megamenu/routerdoc.js @@ -22,7 +22,7 @@ export function RouterDoc(props) { Items with navigation are defined with command property to be able to use a router link component, an external link or programmatic navigation.

- + ); } diff --git a/components/doc/megamenu/theming/tailwinddoc.js b/components/doc/megamenu/theming/tailwinddoc.js index 8cd444fe8b..0232f7323a 100644 --- a/components/doc/megamenu/theming/tailwinddoc.js +++ b/components/doc/megamenu/theming/tailwinddoc.js @@ -202,7 +202,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/mention/accessibilitydoc.js b/components/doc/mention/accessibilitydoc.js index 0226406d4f..d839b5fc42 100644 --- a/components/doc/mention/accessibilitydoc.js +++ b/components/doc/mention/accessibilitydoc.js @@ -27,7 +27,7 @@ export function AccessibilityDoc() { input element.

- +

Keyboard Support

diff --git a/components/doc/mention/importdoc.js b/components/doc/mention/importdoc.js index c2249cb399..2478d89ef4 100644 --- a/components/doc/mention/importdoc.js +++ b/components/doc/mention/importdoc.js @@ -11,7 +11,7 @@ import { Mention } from 'primereact/mention'; return ( <> - + ); } diff --git a/components/doc/mention/theming/tailwinddoc.js b/components/doc/mention/theming/tailwinddoc.js index 6e2229cc53..578de9d6ed 100644 --- a/components/doc/mention/theming/tailwinddoc.js +++ b/components/doc/mention/theming/tailwinddoc.js @@ -93,7 +93,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/menu/importdoc.js b/components/doc/menu/importdoc.js index fb53fd5ff5..7c89480b05 100644 --- a/components/doc/menu/importdoc.js +++ b/components/doc/menu/importdoc.js @@ -11,7 +11,7 @@ import { Menu } from 'primereact/menu'; return ( <> - + ); } diff --git a/components/doc/menu/theming/tailwinddoc.js b/components/doc/menu/theming/tailwinddoc.js index 6514a52130..fb852ed014 100644 --- a/components/doc/menu/theming/tailwinddoc.js +++ b/components/doc/menu/theming/tailwinddoc.js @@ -73,7 +73,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/menubar/importdoc.js b/components/doc/menubar/importdoc.js index 1ee0ccac37..ebabffb8a9 100644 --- a/components/doc/menubar/importdoc.js +++ b/components/doc/menubar/importdoc.js @@ -11,7 +11,7 @@ import { Menubar } from 'primereact/menubar'; return ( <> - + ); } diff --git a/components/doc/menubar/theming/tailwinddoc.js b/components/doc/menubar/theming/tailwinddoc.js index 67e82db7ec..48294a6f6d 100644 --- a/components/doc/menubar/theming/tailwinddoc.js +++ b/components/doc/menubar/theming/tailwinddoc.js @@ -219,7 +219,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/message/importdoc.js b/components/doc/message/importdoc.js index b14dc2c657..b8368acafe 100644 --- a/components/doc/message/importdoc.js +++ b/components/doc/message/importdoc.js @@ -11,7 +11,7 @@ import { Message } from 'primereact/message'; return ( <> - + ); } diff --git a/components/doc/message/theming/tailwinddoc.js b/components/doc/message/theming/tailwinddoc.js index d6bd3075d9..e1858a7a65 100644 --- a/components/doc/message/theming/tailwinddoc.js +++ b/components/doc/message/theming/tailwinddoc.js @@ -46,7 +46,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/messages/importdoc.js b/components/doc/messages/importdoc.js index 36f1b6d6d0..977cd0c128 100644 --- a/components/doc/messages/importdoc.js +++ b/components/doc/messages/importdoc.js @@ -11,7 +11,7 @@ import { Messages } from 'primereact/messages'; return ( <> - + ); } diff --git a/components/doc/messages/theming/tailwinddoc.js b/components/doc/messages/theming/tailwinddoc.js index 23e6e6d442..237a035117 100644 --- a/components/doc/messages/theming/tailwinddoc.js +++ b/components/doc/messages/theming/tailwinddoc.js @@ -74,7 +74,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/multiselect/accessibilitydoc.js b/components/doc/multiselect/accessibilitydoc.js index 2ab867d793..1b0997a053 100644 --- a/components/doc/multiselect/accessibilitydoc.js +++ b/components/doc/multiselect/accessibilitydoc.js @@ -36,7 +36,7 @@ export function AccessibilityDoc() { Close button uses close key of the aria property from the locale API as the aria-label by default, this can be overriden with the closeButtonProps.

- +

Closed State Keyboard Support

diff --git a/components/doc/multiselect/importdoc.js b/components/doc/multiselect/importdoc.js index df1afb7cfc..b14e4c6475 100644 --- a/components/doc/multiselect/importdoc.js +++ b/components/doc/multiselect/importdoc.js @@ -11,7 +11,7 @@ import { MultiSelect } from 'primereact/multiselect'; return ( <> - + ); } diff --git a/components/doc/multiselect/theming/tailwinddoc.js b/components/doc/multiselect/theming/tailwinddoc.js index a9e2832c3f..ccedbc75b3 100644 --- a/components/doc/multiselect/theming/tailwinddoc.js +++ b/components/doc/multiselect/theming/tailwinddoc.js @@ -152,7 +152,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/multistatecheckbox/accessibilitydoc.js b/components/doc/multistatecheckbox/accessibilitydoc.js index 875eeaa225..ba475f4113 100644 --- a/components/doc/multistatecheckbox/accessibilitydoc.js +++ b/components/doc/multistatecheckbox/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { between the component design and the WCAG specification.

- +

Keyboard Support

diff --git a/components/doc/multistatecheckbox/importdoc.js b/components/doc/multistatecheckbox/importdoc.js index 792d783733..9c0bfc6bb0 100644 --- a/components/doc/multistatecheckbox/importdoc.js +++ b/components/doc/multistatecheckbox/importdoc.js @@ -11,7 +11,7 @@ import { MultiStateCheckbox } from 'primereact/multistatecheckbox'; return ( <> - + ); } diff --git a/components/doc/multistatecheckbox/theming/tailwinddoc.js b/components/doc/multistatecheckbox/theming/tailwinddoc.js index cc4eba2f4f..01dc7d9ac9 100644 --- a/components/doc/multistatecheckbox/theming/tailwinddoc.js +++ b/components/doc/multistatecheckbox/theming/tailwinddoc.js @@ -58,7 +58,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/orderlist/accessibilitydoc.js b/components/doc/orderlist/accessibilitydoc.js index 721600e531..d19cd2aea4 100644 --- a/components/doc/orderlist/accessibilitydoc.js +++ b/components/doc/orderlist/accessibilitydoc.js @@ -25,7 +25,7 @@ export function AccessibilityDoc() { moveTopButtonProps, moveUpButtonProps, moveDownButtonProps and moveBottomButtonProps to customize the buttons like overriding the default aria-label attributes.

- +

ListBox Keyboard Support

diff --git a/components/doc/orderlist/importdoc.js b/components/doc/orderlist/importdoc.js index 0796467398..2e92133f3c 100644 --- a/components/doc/orderlist/importdoc.js +++ b/components/doc/orderlist/importdoc.js @@ -11,7 +11,7 @@ import { OrderList } from 'primereact/orderlist'; return ( <> - + ); } diff --git a/components/doc/orderlist/theming/tailwinddoc.js b/components/doc/orderlist/theming/tailwinddoc.js index 0fa5a76c53..6d50bb5cc5 100644 --- a/components/doc/orderlist/theming/tailwinddoc.js +++ b/components/doc/orderlist/theming/tailwinddoc.js @@ -142,7 +142,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/organizationchart/importdoc.js b/components/doc/organizationchart/importdoc.js index 2b41f595bd..e569200c5a 100644 --- a/components/doc/organizationchart/importdoc.js +++ b/components/doc/organizationchart/importdoc.js @@ -11,7 +11,7 @@ import { OrganizationChart } from 'primereact/organizationchart'; return ( <> - + ); } diff --git a/components/doc/organizationchart/theming/tailwinddoc.js b/components/doc/organizationchart/theming/tailwinddoc.js index 429efe3322..46c83accaf 100644 --- a/components/doc/organizationchart/theming/tailwinddoc.js +++ b/components/doc/organizationchart/theming/tailwinddoc.js @@ -127,7 +127,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/overlaypanel/importdoc.js b/components/doc/overlaypanel/importdoc.js index 724ff3f410..b586ca12d0 100644 --- a/components/doc/overlaypanel/importdoc.js +++ b/components/doc/overlaypanel/importdoc.js @@ -11,7 +11,7 @@ import { OverlayPanel } from 'primereact/overlaypanel'; return ( <> - + ); } diff --git a/components/doc/overlaypanel/theming/tailwinddoc.js b/components/doc/overlaypanel/theming/tailwinddoc.js index ae802885b0..9f55cb0b47 100644 --- a/components/doc/overlaypanel/theming/tailwinddoc.js +++ b/components/doc/overlaypanel/theming/tailwinddoc.js @@ -63,7 +63,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/paginator/importdoc.js b/components/doc/paginator/importdoc.js index 0315da9f25..fcd84bc9fc 100644 --- a/components/doc/paginator/importdoc.js +++ b/components/doc/paginator/importdoc.js @@ -11,7 +11,7 @@ import { Paginator } from 'primereact/paginator'; return ( <> - + ); } diff --git a/components/doc/paginator/theming/tailwinddoc.js b/components/doc/paginator/theming/tailwinddoc.js index bbf04a093f..aa0ae7bdea 100644 --- a/components/doc/paginator/theming/tailwinddoc.js +++ b/components/doc/paginator/theming/tailwinddoc.js @@ -217,7 +217,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/panel/importdoc.js b/components/doc/panel/importdoc.js index ee07ceeb5c..fdfe930ff4 100644 --- a/components/doc/panel/importdoc.js +++ b/components/doc/panel/importdoc.js @@ -11,7 +11,7 @@ import { Panel } from 'primereact/panel'; return ( <> - + ); } diff --git a/components/doc/panel/theming/tailwinddoc.js b/components/doc/panel/theming/tailwinddoc.js index 4b8ebe25de..2a51cd7b8c 100644 --- a/components/doc/panel/theming/tailwinddoc.js +++ b/components/doc/panel/theming/tailwinddoc.js @@ -77,7 +77,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/panelmenu/importdoc.js b/components/doc/panelmenu/importdoc.js index 12f9c46796..9c98375525 100644 --- a/components/doc/panelmenu/importdoc.js +++ b/components/doc/panelmenu/importdoc.js @@ -11,7 +11,7 @@ import { PanelMenu } from 'primereact/panelmenu'; return ( <> - + ); } diff --git a/components/doc/panelmenu/theming/tailwinddoc.js b/components/doc/panelmenu/theming/tailwinddoc.js index e61c184961..85d413af90 100644 --- a/components/doc/panelmenu/theming/tailwinddoc.js +++ b/components/doc/panelmenu/theming/tailwinddoc.js @@ -201,7 +201,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/passthrough/customcss.js b/components/doc/passthrough/customcss.js index 7928b55f21..a7f09cdd4c 100644 --- a/components/doc/passthrough/customcss.js +++ b/components/doc/passthrough/customcss.js @@ -57,7 +57,7 @@ export default function CustomCSSDemo() {

- + ); } diff --git a/components/doc/passthrough/globalptdoc.js b/components/doc/passthrough/globalptdoc.js index 0f91db55c3..1d372c8534 100644 --- a/components/doc/passthrough/globalptdoc.js +++ b/components/doc/passthrough/globalptdoc.js @@ -35,7 +35,7 @@ export default function GlobalPTDemo() { settings can be overriden by a particular component as components pt property has higher precedence over global pt.

- + ); } diff --git a/components/doc/passthrough/usepassthroughdoc.js b/components/doc/passthrough/usepassthroughdoc.js index 555efc9c91..a06c416dc7 100644 --- a/components/doc/passthrough/usepassthroughdoc.js +++ b/components/doc/passthrough/usepassthroughdoc.js @@ -109,7 +109,7 @@ const CustomTailwind = usePassThrough( An existing pass through configuration is customized with the usePassThrough utility. The first parameter is the object to customize, the second parameter is the customizations and the final parameter is the behavior of merging. One of the example use cases is customizing existing unstyled themes like Tailwind.

- +

The mergeSections defines whether the sections from the main configuration gets added and the mergeProps controls whether to override or merge the defined props. Defaults are true for mergeSections and false for mergeProps. @@ -119,10 +119,10 @@ const CustomTailwind = usePassThrough( define how class names will be merged.

- - - - + + + + ); } diff --git a/components/doc/password/accessibilitydoc.js b/components/doc/password/accessibilitydoc.js index cce7ea22db..c3e58e1763 100644 --- a/components/doc/password/accessibilitydoc.js +++ b/components/doc/password/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { password using a section that has aria-live while typing.

- +

Keyboard Support

diff --git a/components/doc/password/importdoc.js b/components/doc/password/importdoc.js index 036415573a..e62579b635 100644 --- a/components/doc/password/importdoc.js +++ b/components/doc/password/importdoc.js @@ -11,7 +11,7 @@ import { Password } from 'primereact/password'; return ( <> - + ); } diff --git a/components/doc/password/theming/tailwinddoc.js b/components/doc/password/theming/tailwinddoc.js index 5b6a12b4c0..1ff18a5c48 100644 --- a/components/doc/password/theming/tailwinddoc.js +++ b/components/doc/password/theming/tailwinddoc.js @@ -70,7 +70,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/picklist/importdoc.js b/components/doc/picklist/importdoc.js index f3f40927e4..86b430f21a 100644 --- a/components/doc/picklist/importdoc.js +++ b/components/doc/picklist/importdoc.js @@ -11,7 +11,7 @@ import { PickList } from 'primereact/picklist'; return ( <> - + ); } diff --git a/components/doc/picklist/theming/tailwinddoc.js b/components/doc/picklist/theming/tailwinddoc.js index 1e9b4144cc..e921f478c3 100644 --- a/components/doc/picklist/theming/tailwinddoc.js +++ b/components/doc/picklist/theming/tailwinddoc.js @@ -215,7 +215,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/progressbar/importdoc.js b/components/doc/progressbar/importdoc.js index 2999d6b836..42ff7bfe70 100644 --- a/components/doc/progressbar/importdoc.js +++ b/components/doc/progressbar/importdoc.js @@ -11,7 +11,7 @@ import { ProgressBar } from 'primereact/progressbar'; return ( <> - + ); } diff --git a/components/doc/progressbar/theming/tailwinddoc.js b/components/doc/progressbar/theming/tailwinddoc.js index 79580ba778..f274f4be5b 100644 --- a/components/doc/progressbar/theming/tailwinddoc.js +++ b/components/doc/progressbar/theming/tailwinddoc.js @@ -107,7 +107,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/progressspinner/importdoc.js b/components/doc/progressspinner/importdoc.js index 5a3723ebfb..56b2d91b7a 100644 --- a/components/doc/progressspinner/importdoc.js +++ b/components/doc/progressspinner/importdoc.js @@ -11,7 +11,7 @@ import { ProgressSpinner } from 'primereact/progressspinner'; return ( <> - + ); } diff --git a/components/doc/progressspinner/theming/tailwinddoc.js b/components/doc/progressspinner/theming/tailwinddoc.js index 64d2670987..5517df7637 100644 --- a/components/doc/progressspinner/theming/tailwinddoc.js +++ b/components/doc/progressspinner/theming/tailwinddoc.js @@ -79,7 +79,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/radiobutton/accessibilitydoc.js b/components/doc/radiobutton/accessibilitydoc.js index d0e27dc331..4086464dd9 100644 --- a/components/doc/radiobutton/accessibilitydoc.js +++ b/components/doc/radiobutton/accessibilitydoc.js @@ -22,7 +22,7 @@ export function AccessibilityDoc() { aria-labelledby, aria-label props.

- +

Keyboard Support

diff --git a/components/doc/radiobutton/importdoc.js b/components/doc/radiobutton/importdoc.js index abfdd9126f..67b1b9d25d 100644 --- a/components/doc/radiobutton/importdoc.js +++ b/components/doc/radiobutton/importdoc.js @@ -11,7 +11,7 @@ import { RadioButton } from 'primereact/radiobutton'; return ( <> - + ); } diff --git a/components/doc/radiobutton/theming/tailwinddoc.js b/components/doc/radiobutton/theming/tailwinddoc.js index 0053935095..dff43339c5 100644 --- a/components/doc/radiobutton/theming/tailwinddoc.js +++ b/components/doc/radiobutton/theming/tailwinddoc.js @@ -76,7 +76,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/rating/importdoc.js b/components/doc/rating/importdoc.js index ea60b1b487..4fc1e4e51b 100644 --- a/components/doc/rating/importdoc.js +++ b/components/doc/rating/importdoc.js @@ -11,7 +11,7 @@ import { Rating } from 'primereact/rating'; return ( <> - + ); } diff --git a/components/doc/rating/theming/tailwinddoc.js b/components/doc/rating/theming/tailwinddoc.js index f4e119eb26..f322550e4d 100644 --- a/components/doc/rating/theming/tailwinddoc.js +++ b/components/doc/rating/theming/tailwinddoc.js @@ -67,7 +67,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/ripple/configurationdoc.js b/components/doc/ripple/configurationdoc.js index 8b97add307..283c5e0d21 100644 --- a/components/doc/ripple/configurationdoc.js +++ b/components/doc/ripple/configurationdoc.js @@ -30,7 +30,7 @@ export default function MyApp({ Component }) { To start with, Ripple needs to be enabled globally. See the Configuration API for details.

- + ); } diff --git a/components/doc/ripple/importdoc.js b/components/doc/ripple/importdoc.js index e561207bce..ef53f717e7 100644 --- a/components/doc/ripple/importdoc.js +++ b/components/doc/ripple/importdoc.js @@ -11,7 +11,7 @@ import { Ripple } from 'primereact/ripple'; return ( <> - + ); } diff --git a/components/doc/ripple/theming/tailwinddoc.js b/components/doc/ripple/theming/tailwinddoc.js index e75730b45b..672af3b2a6 100644 --- a/components/doc/ripple/theming/tailwinddoc.js +++ b/components/doc/ripple/theming/tailwinddoc.js @@ -49,7 +49,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/scrollpanel/importdoc.js b/components/doc/scrollpanel/importdoc.js index d0851b459d..2d2f29dbd6 100644 --- a/components/doc/scrollpanel/importdoc.js +++ b/components/doc/scrollpanel/importdoc.js @@ -11,7 +11,7 @@ import { ScrollPanel } from 'primereact/scrollpanel'; return ( <> - + ); } diff --git a/components/doc/scrollpanel/theming/tailwinddoc.js b/components/doc/scrollpanel/theming/tailwinddoc.js index e5c4803303..30f8cba86a 100644 --- a/components/doc/scrollpanel/theming/tailwinddoc.js +++ b/components/doc/scrollpanel/theming/tailwinddoc.js @@ -61,7 +61,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/scrolltop/importdoc.js b/components/doc/scrolltop/importdoc.js index 85b173e2eb..fe2b513ea8 100644 --- a/components/doc/scrolltop/importdoc.js +++ b/components/doc/scrolltop/importdoc.js @@ -11,7 +11,7 @@ import { ScrollTop } from 'primereact/scrolltop'; return ( <> - + ); } diff --git a/components/doc/scrolltop/theming/tailwinddoc.js b/components/doc/scrolltop/theming/tailwinddoc.js index 5d3e8848f1..a508175732 100644 --- a/components/doc/scrolltop/theming/tailwinddoc.js +++ b/components/doc/scrolltop/theming/tailwinddoc.js @@ -55,7 +55,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/selectbutton/importdoc.js b/components/doc/selectbutton/importdoc.js index 3fcdda5da1..4e0fab102a 100644 --- a/components/doc/selectbutton/importdoc.js +++ b/components/doc/selectbutton/importdoc.js @@ -11,7 +11,7 @@ import { SelectButton } from 'primereact/selectbutton'; return ( <> - + ); } diff --git a/components/doc/selectbutton/theming/tailwinddoc.js b/components/doc/selectbutton/theming/tailwinddoc.js index ee369548f5..4d6a15d2d0 100644 --- a/components/doc/selectbutton/theming/tailwinddoc.js +++ b/components/doc/selectbutton/theming/tailwinddoc.js @@ -55,7 +55,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/sidebar/importdoc.js b/components/doc/sidebar/importdoc.js index 2a9270fb0f..c967446f7e 100644 --- a/components/doc/sidebar/importdoc.js +++ b/components/doc/sidebar/importdoc.js @@ -11,7 +11,7 @@ import { Sidebar } from 'primereact/sidebar'; return ( <> - + ); } diff --git a/components/doc/sidebar/theming/tailwinddoc.js b/components/doc/sidebar/theming/tailwinddoc.js index ba672902f9..0766004e58 100644 --- a/components/doc/sidebar/theming/tailwinddoc.js +++ b/components/doc/sidebar/theming/tailwinddoc.js @@ -136,7 +136,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/skeleton/importdoc.js b/components/doc/skeleton/importdoc.js index 1995f7ddb5..efc4d99933 100644 --- a/components/doc/skeleton/importdoc.js +++ b/components/doc/skeleton/importdoc.js @@ -11,7 +11,7 @@ import { Skeleton } from 'primereact/skeleton'; return ( <> - + ); } diff --git a/components/doc/skeleton/theming/tailwinddoc.js b/components/doc/skeleton/theming/tailwinddoc.js index 1c6d700285..7e1dd3852e 100644 --- a/components/doc/skeleton/theming/tailwinddoc.js +++ b/components/doc/skeleton/theming/tailwinddoc.js @@ -79,7 +79,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/slider/accessibilitydoc.js b/components/doc/slider/accessibilitydoc.js index f300e77124..8dc0f69ed2 100644 --- a/components/doc/slider/accessibilitydoc.js +++ b/components/doc/slider/accessibilitydoc.js @@ -20,7 +20,7 @@ export function AccessibilityDoc() { aria-labelledby and aria-label props.

- +

Keyboard Support

diff --git a/components/doc/slider/importdoc.js b/components/doc/slider/importdoc.js index 8d06533aa0..3ce256e2e8 100644 --- a/components/doc/slider/importdoc.js +++ b/components/doc/slider/importdoc.js @@ -11,7 +11,7 @@ import { Slider } from 'primereact/slider'; return ( <> - + ); } diff --git a/components/doc/slider/theming/tailwinddoc.js b/components/doc/slider/theming/tailwinddoc.js index d62354acc1..bd5d5ada22 100644 --- a/components/doc/slider/theming/tailwinddoc.js +++ b/components/doc/slider/theming/tailwinddoc.js @@ -62,7 +62,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/speeddial/accessibilitydoc.js b/components/doc/speeddial/accessibilitydoc.js index 2aa79979a2..605d825cee 100644 --- a/components/doc/speeddial/accessibilitydoc.js +++ b/components/doc/speeddial/accessibilitydoc.js @@ -20,7 +20,7 @@ export function AccessibilityDoc() { The popup overlay uses menu role on the list and each action item has a menuitem role with an aria-label as the menuitem label. The id of the menu refers to the aria-controls of the button.

- +

Menu Button Keyboard Support

diff --git a/components/doc/speeddial/importdoc.js b/components/doc/speeddial/importdoc.js index 3e663a0431..bf97297146 100644 --- a/components/doc/speeddial/importdoc.js +++ b/components/doc/speeddial/importdoc.js @@ -11,7 +11,7 @@ import { SpeedDial } from 'primereact/speeddial'; return ( <> - + ); } diff --git a/components/doc/speeddial/theming/tailwinddoc.js b/components/doc/speeddial/theming/tailwinddoc.js index c372782072..c8bbbe4f49 100644 --- a/components/doc/speeddial/theming/tailwinddoc.js +++ b/components/doc/speeddial/theming/tailwinddoc.js @@ -107,7 +107,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/splitbutton/importdoc.js b/components/doc/splitbutton/importdoc.js index 9fc42c57ee..12b52e7afa 100644 --- a/components/doc/splitbutton/importdoc.js +++ b/components/doc/splitbutton/importdoc.js @@ -11,7 +11,7 @@ import { SplitButton } from 'primereact/splitbutton'; return ( <> - + ); } diff --git a/components/doc/splitbutton/theming/tailwinddoc.js b/components/doc/splitbutton/theming/tailwinddoc.js index 925a5e0799..2b2cee543c 100644 --- a/components/doc/splitbutton/theming/tailwinddoc.js +++ b/components/doc/splitbutton/theming/tailwinddoc.js @@ -108,7 +108,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/splitter/importdoc.js b/components/doc/splitter/importdoc.js index b9ce20bf51..4ba8a30cbc 100644 --- a/components/doc/splitter/importdoc.js +++ b/components/doc/splitter/importdoc.js @@ -11,7 +11,7 @@ import { Splitter, SplitterPanel } from 'primereact/splitter'; return ( <> - + ); } diff --git a/components/doc/splitter/theming/tailwinddoc.js b/components/doc/splitter/theming/tailwinddoc.js index ed5a72f46a..1cda64d0b7 100644 --- a/components/doc/splitter/theming/tailwinddoc.js +++ b/components/doc/splitter/theming/tailwinddoc.js @@ -55,7 +55,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/steps/importdoc.js b/components/doc/steps/importdoc.js index 86922e4699..23e3a15543 100644 --- a/components/doc/steps/importdoc.js +++ b/components/doc/steps/importdoc.js @@ -11,7 +11,7 @@ import { Steps } from 'primereact/steps'; return ( <> - + ); } diff --git a/components/doc/steps/theming/tailwinddoc.js b/components/doc/steps/theming/tailwinddoc.js index 8d285783ea..68fb3658c3 100644 --- a/components/doc/steps/theming/tailwinddoc.js +++ b/components/doc/steps/theming/tailwinddoc.js @@ -70,7 +70,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/styleclass/importdoc.js b/components/doc/styleclass/importdoc.js index 9fddc1ff81..c389a6dd49 100644 --- a/components/doc/styleclass/importdoc.js +++ b/components/doc/styleclass/importdoc.js @@ -11,7 +11,7 @@ import { StyleClass } from 'primereact/styleclass'; return ( <> - + ); } diff --git a/components/doc/tabmenu/importdoc.js b/components/doc/tabmenu/importdoc.js index 90fa35f71c..cd688b972d 100644 --- a/components/doc/tabmenu/importdoc.js +++ b/components/doc/tabmenu/importdoc.js @@ -11,7 +11,7 @@ import { TabMenu } from 'primereact/tabmenu'; return ( <> - + ); } diff --git a/components/doc/tabmenu/theming/tailwinddoc.js b/components/doc/tabmenu/theming/tailwinddoc.js index c3f02614fc..8f31407b77 100644 --- a/components/doc/tabmenu/theming/tailwinddoc.js +++ b/components/doc/tabmenu/theming/tailwinddoc.js @@ -60,7 +60,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tabview/importdoc.js b/components/doc/tabview/importdoc.js index 5860b2b0db..5fb37db0ee 100644 --- a/components/doc/tabview/importdoc.js +++ b/components/doc/tabview/importdoc.js @@ -11,7 +11,7 @@ import { TabView, TabPanel } from 'primereact/tabview'; return ( <> - + ); } diff --git a/components/doc/tabview/theming/tailwinddoc.js b/components/doc/tabview/theming/tailwinddoc.js index d583a401d4..6251d2e739 100644 --- a/components/doc/tabview/theming/tailwinddoc.js +++ b/components/doc/tabview/theming/tailwinddoc.js @@ -101,7 +101,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tag/importdoc.js b/components/doc/tag/importdoc.js index 0a433058f1..45f7ee18a2 100644 --- a/components/doc/tag/importdoc.js +++ b/components/doc/tag/importdoc.js @@ -11,7 +11,7 @@ import { Tag } from 'primereact/tag'; return ( <> - + ); } diff --git a/components/doc/tag/theming/tailwinddoc.js b/components/doc/tag/theming/tailwinddoc.js index eb73dfa06e..b7861dce0c 100644 --- a/components/doc/tag/theming/tailwinddoc.js +++ b/components/doc/tag/theming/tailwinddoc.js @@ -58,7 +58,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tailwind/csslayerdoc.js b/components/doc/tailwind/csslayerdoc.js index c923b36a80..bf307090f3 100644 --- a/components/doc/tailwind/csslayerdoc.js +++ b/components/doc/tailwind/csslayerdoc.js @@ -24,7 +24,7 @@ export function CSSLayerDoc(props) { Tailwind CSS can be used with styled or unstyled modes of PrimeReact. In both cases, preflight mode may break styling of the core functionality so @layer configuration in your style file that includes tailwind styles is necessary for compatibility.

- + ); diff --git a/components/doc/tailwind/unstyledmode/setupdoc.js b/components/doc/tailwind/unstyledmode/setupdoc.js index 8d1d98f762..22f963326b 100644 --- a/components/doc/tailwind/unstyledmode/setupdoc.js +++ b/components/doc/tailwind/unstyledmode/setupdoc.js @@ -143,7 +143,7 @@ export default function MyApp({ Component, pageProps }) { classes utilized in the theme will be removed as well.

- +

@@ -151,14 +151,14 @@ export default function MyApp({ Component, pageProps }) { application at this stage, functionality and accessibility of the components will still work but everything will be transparent as there is no style.

- +

Optional: specify the built in Tailwind style of pre-configured Tailwind settings.

- +

@@ -166,7 +166,7 @@ export default function MyApp({ Component, pageProps }) { global pass through from overriding those specified via pass through in your application.

- +

@@ -174,7 +174,7 @@ export default function MyApp({ Component, pageProps }) { you'll able to copy paste instead of starting from scratch. Example below styles, inputtext and panel components;

- +

Voilà 💙, you now have 90+ awesome React UI components styled with Tailwind that will work in harmony with the rest of your application. Time to customize it to bring in your own style with Tailwind.

diff --git a/components/doc/terminal/importdoc.js b/components/doc/terminal/importdoc.js index c6a6ac9294..f042348591 100644 --- a/components/doc/terminal/importdoc.js +++ b/components/doc/terminal/importdoc.js @@ -12,7 +12,7 @@ import { TerminalService } from 'primereact/terminalservice'; return ( <> - + ); } diff --git a/components/doc/terminal/theming/tailwinddoc.js b/components/doc/terminal/theming/tailwinddoc.js index 317e5f9a11..6ad15fa0f6 100644 --- a/components/doc/terminal/theming/tailwinddoc.js +++ b/components/doc/terminal/theming/tailwinddoc.js @@ -85,7 +85,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/theming/builtinthemesdoc.js b/components/doc/theming/builtinthemesdoc.js index ed5fbe35ff..d7bed03356 100644 --- a/components/doc/theming/builtinthemesdoc.js +++ b/components/doc/theming/builtinthemesdoc.js @@ -58,7 +58,7 @@ primereact/resources/themes/arya-purple/theme.css at the topbar to switch themes.

- + ); } diff --git a/components/doc/theming/customthemedoc.js b/components/doc/theming/customthemedoc.js index 7a8334a115..b7397463ab 100644 --- a/components/doc/theming/customthemedoc.js +++ b/components/doc/theming/customthemedoc.js @@ -44,11 +44,11 @@ import './assets/theme.css';

Once your theme is ready run the following command to compile it. Note that sass command should be available in your terminal.

- +

Then copy and import the theme.css file in your application. For example, in Next.js, ideal location could be the _app.js.

- +

Build Time Compilation

diff --git a/components/doc/theming/primeflexdoc.js b/components/doc/theming/primeflexdoc.js index 30e1e37a9b..d1225c10d9 100644 --- a/components/doc/theming/primeflexdoc.js +++ b/components/doc/theming/primeflexdoc.js @@ -29,7 +29,7 @@ export function PrimeFlexDoc(props) {

- + ); } diff --git a/components/doc/theming/scaledoc.js b/components/doc/theming/scaledoc.js index f16dcd81e2..7d30cc577b 100644 --- a/components/doc/theming/scaledoc.js +++ b/components/doc/theming/scaledoc.js @@ -18,7 +18,7 @@ html { document. Code below sets the scale of the components based on 16px. If you reqire bigger or smaller components, just change this variable and components will scale accordingly.

- + ); } diff --git a/components/doc/theming/scopedstyling/cssinjsdoc.js b/components/doc/theming/scopedstyling/cssinjsdoc.js index f3d6a5c336..dd487ea9e2 100644 --- a/components/doc/theming/scopedstyling/cssinjsdoc.js +++ b/components/doc/theming/scopedstyling/cssinjsdoc.js @@ -57,7 +57,7 @@ export default function PanelDemo() {

- + ); } diff --git a/components/doc/theming/scopedstyling/cssmodulesdoc.js b/components/doc/theming/scopedstyling/cssmodulesdoc.js index 968c564cf2..0bae939647 100644 --- a/components/doc/theming/scopedstyling/cssmodulesdoc.js +++ b/components/doc/theming/scopedstyling/cssmodulesdoc.js @@ -50,8 +50,8 @@ export default function PanelDemo() {

- - + + ); } diff --git a/components/doc/theming/scopedstyling/namedclassdoc.js b/components/doc/theming/scopedstyling/namedclassdoc.js index ad1a9b402f..d0f954e3ab 100644 --- a/components/doc/theming/scopedstyling/namedclassdoc.js +++ b/components/doc/theming/scopedstyling/namedclassdoc.js @@ -48,8 +48,8 @@ export default function PanelDemo() {

- - + + ); } diff --git a/components/doc/theming/switchthemesdoc.js b/components/doc/theming/switchthemesdoc.js index 05c4581a21..aa3c785539 100644 --- a/components/doc/theming/switchthemesdoc.js +++ b/components/doc/theming/switchthemesdoc.js @@ -39,20 +39,20 @@ changeTheme(currentTheme: string, newTheme: string, linkElementId: string, callb to the changeTheme function.

- +

If you have access to the index.html directly, the link can be placed at head section.

- +

Next.js applications can configure the link element using next/head component or custom{' '} document.

- + ); } diff --git a/components/doc/tieredmenu/importdoc.js b/components/doc/tieredmenu/importdoc.js index 6ecf209461..b80fd498f1 100644 --- a/components/doc/tieredmenu/importdoc.js +++ b/components/doc/tieredmenu/importdoc.js @@ -11,7 +11,7 @@ import { TieredMenu } from 'primereact/tieredmenu'; return ( <> - + ); } diff --git a/components/doc/tieredmenu/theming/tailwinddoc.js b/components/doc/tieredmenu/theming/tailwinddoc.js index 5040725a52..70e659a11b 100644 --- a/components/doc/tieredmenu/theming/tailwinddoc.js +++ b/components/doc/tieredmenu/theming/tailwinddoc.js @@ -205,7 +205,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/timeline/importdoc.js b/components/doc/timeline/importdoc.js index 9de510a0d6..ba43ecb966 100644 --- a/components/doc/timeline/importdoc.js +++ b/components/doc/timeline/importdoc.js @@ -11,7 +11,7 @@ import { Timeline } from 'primereact/timeline'; return ( <> - + ); } diff --git a/components/doc/timeline/theming/tailwinddoc.js b/components/doc/timeline/theming/tailwinddoc.js index 374103b40d..4b1dd0aeeb 100644 --- a/components/doc/timeline/theming/tailwinddoc.js +++ b/components/doc/timeline/theming/tailwinddoc.js @@ -99,7 +99,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/toast/importdoc.js b/components/doc/toast/importdoc.js index 81b2bac6cc..f61e49a643 100644 --- a/components/doc/toast/importdoc.js +++ b/components/doc/toast/importdoc.js @@ -11,7 +11,7 @@ import { Toast } from 'primereact/toast'; return ( <> - + ); } diff --git a/components/doc/toast/theming/tailwinddoc.js b/components/doc/toast/theming/tailwinddoc.js index adfde3215c..dffe262e65 100644 --- a/components/doc/toast/theming/tailwinddoc.js +++ b/components/doc/toast/theming/tailwinddoc.js @@ -87,7 +87,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/togglebutton/accessibilitydoc.js b/components/doc/togglebutton/accessibilitydoc.js index 18ccc75d1c..110ac85520 100644 --- a/components/doc/togglebutton/accessibilitydoc.js +++ b/components/doc/togglebutton/accessibilitydoc.js @@ -20,7 +20,7 @@ export function AccessibilityDoc() { that does not change related to state.

- +

Keyboard Support

diff --git a/components/doc/togglebutton/importdoc.js b/components/doc/togglebutton/importdoc.js index c9cde6bcef..e23b8c98fd 100644 --- a/components/doc/togglebutton/importdoc.js +++ b/components/doc/togglebutton/importdoc.js @@ -11,7 +11,7 @@ import { ToggleButton } from 'primereact/togglebutton'; return ( <> - + ); } diff --git a/components/doc/togglebutton/theming/tailwinddoc.js b/components/doc/togglebutton/theming/tailwinddoc.js index d1a59b9e77..e7a56bd0e4 100644 --- a/components/doc/togglebutton/theming/tailwinddoc.js +++ b/components/doc/togglebutton/theming/tailwinddoc.js @@ -59,7 +59,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/toolbar/accessibilitydoc.js b/components/doc/toolbar/accessibilitydoc.js index d197760a22..09cfb19b62 100644 --- a/components/doc/toolbar/accessibilitydoc.js +++ b/components/doc/toolbar/accessibilitydoc.js @@ -18,7 +18,7 @@ export function AccessibilityDoc() { aria-labelledby and aria-labelled to define the element if required.

- +

Keyboard Support

Component does not include any interactive elements. Arbitrary content can be placed with templating and elements like buttons inside should follow the page tab sequence.

diff --git a/components/doc/toolbar/importdoc.js b/components/doc/toolbar/importdoc.js index 83c8d18e65..2a1785fe3f 100644 --- a/components/doc/toolbar/importdoc.js +++ b/components/doc/toolbar/importdoc.js @@ -11,7 +11,7 @@ import { Toolbar } from 'primereact/toolbar'; return ( <> - + ); } diff --git a/components/doc/toolbar/theming/tailwinddoc.js b/components/doc/toolbar/theming/tailwinddoc.js index c939f15b85..954bb944bf 100644 --- a/components/doc/toolbar/theming/tailwinddoc.js +++ b/components/doc/toolbar/theming/tailwinddoc.js @@ -85,7 +85,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tooltip/importdoc.js b/components/doc/tooltip/importdoc.js index 9741810aa8..eb8d3a15db 100644 --- a/components/doc/tooltip/importdoc.js +++ b/components/doc/tooltip/importdoc.js @@ -11,7 +11,7 @@ import { Tooltip } from 'primereact/tooltip'; return ( <> - + ); } diff --git a/components/doc/tooltip/theming/tailwinddoc.js b/components/doc/tooltip/theming/tailwinddoc.js index b3b1b540b5..94ef90ddab 100644 --- a/components/doc/tooltip/theming/tailwinddoc.js +++ b/components/doc/tooltip/theming/tailwinddoc.js @@ -56,7 +56,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tree/importdoc.js b/components/doc/tree/importdoc.js index fb65ec512c..d7ac22855e 100644 --- a/components/doc/tree/importdoc.js +++ b/components/doc/tree/importdoc.js @@ -11,7 +11,7 @@ import { Tree } from 'primereact/tree'; return ( <> - + ); } diff --git a/components/doc/tree/selection/checkboxselectiondoc.js b/components/doc/tree/selection/checkboxselectiondoc.js index 7560c3f0ad..7851fbb01c 100644 --- a/components/doc/tree/selection/checkboxselectiondoc.js +++ b/components/doc/tree/selection/checkboxselectiondoc.js @@ -109,7 +109,7 @@ export default function CheckboxSelectionDemo() { In checkbox selection mode, value binding should be a key-value pair where key is the node key and value is an object that has checked and partialChecked properties to represent the checked state of a node.

- +
setSelectedKeys(e.value)} className="w-full md:w-30rem" />
diff --git a/components/doc/tree/selection/multipleselectiondoc.js b/components/doc/tree/selection/multipleselectiondoc.js index 9e18a01440..720e9e3d6b 100644 --- a/components/doc/tree/selection/multipleselectiondoc.js +++ b/components/doc/tree/selection/multipleselectiondoc.js @@ -124,7 +124,7 @@ export default function MultipleSelectionDemo() {

In multiple selection mode, value binding should be a key-value pair where key is the node key and value is a boolean to indicate selection.

- +
setMetaKey(e.value)} /> diff --git a/components/doc/tree/theming/tailwinddoc.js b/components/doc/tree/theming/tailwinddoc.js index ce6cce1ae6..ab1b2e4a67 100644 --- a/components/doc/tree/theming/tailwinddoc.js +++ b/components/doc/tree/theming/tailwinddoc.js @@ -102,7 +102,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/treeselect/accessibilitydoc.js b/components/doc/treeselect/accessibilitydoc.js index 2c4ec6cbd9..1e548ccb46 100644 --- a/components/doc/treeselect/accessibilitydoc.js +++ b/components/doc/treeselect/accessibilitydoc.js @@ -29,7 +29,7 @@ export function AccessibilityDoc() { If filtering is enabled, filterInputProps can be defined to give aria-* props to the filter input element.

- +

Closed State Keyboard Support

diff --git a/components/doc/treeselect/checkboxdoc.js b/components/doc/treeselect/checkboxdoc.js index 3b43fdb573..cc1db3286b 100644 --- a/components/doc/treeselect/checkboxdoc.js +++ b/components/doc/treeselect/checkboxdoc.js @@ -113,7 +113,7 @@ export default function CheckboxDemo() { indicate selection.

- +
- + ); } diff --git a/components/doc/treeselect/multipledoc.js b/components/doc/treeselect/multipledoc.js index e44f3d1b10..851858c489 100644 --- a/components/doc/treeselect/multipledoc.js +++ b/components/doc/treeselect/multipledoc.js @@ -109,7 +109,7 @@ export default function MultipleDemo() {

In multiple selection mode, value binding should be a key-value pair where key is the node key and value is a boolean to indicate selection.

- +
setSelectedNodeKeys(e.value)} options={nodes} metaKeySelection={false} className="md:w-20rem w-full" selectionMode="multiple" placeholder="Select Items">
diff --git a/components/doc/treeselect/theming/tailwinddoc.js b/components/doc/treeselect/theming/tailwinddoc.js index a64455d6ad..f836ce0ab2 100644 --- a/components/doc/treeselect/theming/tailwinddoc.js +++ b/components/doc/treeselect/theming/tailwinddoc.js @@ -73,7 +73,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/treetable/importdoc.js b/components/doc/treetable/importdoc.js index a9cdf6e139..2746b49cf9 100644 --- a/components/doc/treetable/importdoc.js +++ b/components/doc/treetable/importdoc.js @@ -12,7 +12,7 @@ import { Column } from 'primereact/column'; return ( <> - + ); } diff --git a/components/doc/treetable/selection/checkboxdoc.js b/components/doc/treetable/selection/checkboxdoc.js index 2ae27f576b..b54d2ae460 100644 --- a/components/doc/treetable/selection/checkboxdoc.js +++ b/components/doc/treetable/selection/checkboxdoc.js @@ -124,7 +124,7 @@ export default function CheckboxRowSelectionDemo() { In checkbox selection mode, value binding should be a key-value pair where key is the node key and value is an object that has checked and partialChecked properties to represent the checked state of a node.

- +
setSelectedNodeKeys(e.value)} tableStyle={{ minWidth: '50rem' }}> diff --git a/components/doc/treetable/selection/multipledoc.js b/components/doc/treetable/selection/multipledoc.js index 541ae8519e..5575c0ddfe 100644 --- a/components/doc/treetable/selection/multipledoc.js +++ b/components/doc/treetable/selection/multipledoc.js @@ -137,7 +137,7 @@ export default function MultipleRowsSelectionDemo() {

In multiple selection mode, value binding should be a key-value pair where key is the node key and value is a boolean to indicate selection.

- +
setMetaKey(e.value)} /> diff --git a/components/doc/treetable/theming/tailwinddoc.js b/components/doc/treetable/theming/tailwinddoc.js index 2d4f5f0bc3..0b4e98c7ba 100644 --- a/components/doc/treetable/theming/tailwinddoc.js +++ b/components/doc/treetable/theming/tailwinddoc.js @@ -196,7 +196,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/tristatecheckbox/accessibilitydoc.js b/components/doc/tristatecheckbox/accessibilitydoc.js index a645c7bdec..779aebf8f2 100644 --- a/components/doc/tristatecheckbox/accessibilitydoc.js +++ b/components/doc/tristatecheckbox/accessibilitydoc.js @@ -21,7 +21,7 @@ export function AccessibilityDoc() { property from the locale API. This is an example of a custom accessibility implementation as there is no one to one mapping between the component design and the WCAG specification.

- +

Keyboard Support

diff --git a/components/doc/tristatecheckbox/importdoc.js b/components/doc/tristatecheckbox/importdoc.js index d56b71b5d4..24f864c184 100644 --- a/components/doc/tristatecheckbox/importdoc.js +++ b/components/doc/tristatecheckbox/importdoc.js @@ -11,7 +11,7 @@ import { TriStateCheckbox } from 'primereact/tristatecheckbox'; return ( <> - + ); } diff --git a/components/doc/tristatecheckbox/theming/tailwinddoc.js b/components/doc/tristatecheckbox/theming/tailwinddoc.js index 654fe96687..95a0056c5a 100644 --- a/components/doc/tristatecheckbox/theming/tailwinddoc.js +++ b/components/doc/tristatecheckbox/theming/tailwinddoc.js @@ -54,7 +54,7 @@ export default function UnstyledDemo() { PrimeReact offers a built-in Tailwind theme to get you started quickly. The default values related to the component are displayed below. The component can easily be styled with your own design based on Tailwind utilities, see the{' '} Tailwind Customization section for an example.

- +

A playground sample with the pre-built Tailwind theme.

diff --git a/components/doc/unstyled/setupdoc.js b/components/doc/unstyled/setupdoc.js index 458d96f53d..806d307550 100644 --- a/components/doc/unstyled/setupdoc.js +++ b/components/doc/unstyled/setupdoc.js @@ -26,14 +26,14 @@ return(

Unstyled mode is enabled for the whole suite by setting unstyled as true during PrimeReact installation.

- +

Alternatively even in the default styled mode, a particular component can still be used as unstyled by adding the unstyled prop of the component.

- + ); diff --git a/components/doc/unstyled/themedoc.js b/components/doc/unstyled/themedoc.js index 066c8577cd..23ba3ec48d 100644 --- a/components/doc/unstyled/themedoc.js +++ b/components/doc/unstyled/themedoc.js @@ -38,7 +38,7 @@ return( and the global setting is merged with component having higher precedencee.

- + ); } diff --git a/components/doc/virtualscroller/importdoc.js b/components/doc/virtualscroller/importdoc.js index 52e3bae68e..586de09ec1 100644 --- a/components/doc/virtualscroller/importdoc.js +++ b/components/doc/virtualscroller/importdoc.js @@ -11,7 +11,7 @@ import { VirtualScroller } from 'primereact/virtualscroller'; return ( <> - + ); }