From 32c33c1d04725c159a3b746781b06029d01e79a6 Mon Sep 17 00:00:00 2001 From: Pavel Klibani Date: Sat, 16 Sep 2023 19:52:51 +0200 Subject: [PATCH 1/2] Docs(web-react): Add Pagination demo DS-903 - Pagination demo in web-react is now same as demo in web and web-twig --- .../demo/PaginationCurrentFirst.tsx | 52 +++++------ .../demo/PaginationCurrentFirstCentered.tsx | 53 +++++------ .../Pagination/demo/PaginationCurrentLast.tsx | 52 +++++------ .../demo/PaginationCurrentMiddle.tsx | 58 ++++++------ .../src/components/Pagination/demo/index.tsx | 91 +------------------ 5 files changed, 99 insertions(+), 207 deletions(-) diff --git a/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirst.tsx b/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirst.tsx index 01ed3a980a..3c60b68917 100644 --- a/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirst.tsx +++ b/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirst.tsx @@ -1,36 +1,30 @@ import React from 'react'; -import { ComponentStory } from '@storybook/react'; -import { SpiritPaginationProps } from '../../../types'; import Pagination from '../Pagination'; import PaginationItem from '../PaginationItem'; import PaginationLink from '../PaginationLink'; import PaginationLinkNext from '../PaginationLinkNext'; -const Story: ComponentStory = (args: SpiritPaginationProps) => ; +const PaginationCurrentFirst = () => ( + + + + + + + + + + + + + + + + + + + + +); -Story.args = { - children: ( - <> - - - - - - - - - - - - - - - - - - - - ), -}; - -export default Story; +export default PaginationCurrentFirst; diff --git a/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirstCentered.tsx b/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirstCentered.tsx index 6423b1049d..15ec297f3c 100644 --- a/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirstCentered.tsx +++ b/packages/web-react/src/components/Pagination/demo/PaginationCurrentFirstCentered.tsx @@ -1,37 +1,30 @@ import React from 'react'; -import { ComponentStory } from '@storybook/react'; -import { SpiritPaginationProps } from '../../../types'; import Pagination from '../Pagination'; import PaginationItem from '../PaginationItem'; import PaginationLink from '../PaginationLink'; import PaginationLinkNext from '../PaginationLinkNext'; -const Story: ComponentStory = (args: SpiritPaginationProps) => ; +const PaginationCurrentFirstCentered = () => ( + + + + + + + + + + + + + + + + + + + + +); -Story.args = { - UNSAFE_className: 'text-center', - children: ( - <> - - - - - - - - - - - - - - - - - - - - ), -}; - -export default Story; +export default PaginationCurrentFirstCentered; diff --git a/packages/web-react/src/components/Pagination/demo/PaginationCurrentLast.tsx b/packages/web-react/src/components/Pagination/demo/PaginationCurrentLast.tsx index 7b5006a62a..57c30b9a2a 100644 --- a/packages/web-react/src/components/Pagination/demo/PaginationCurrentLast.tsx +++ b/packages/web-react/src/components/Pagination/demo/PaginationCurrentLast.tsx @@ -1,36 +1,30 @@ import React from 'react'; -import { ComponentStory } from '@storybook/react'; -import { SpiritPaginationProps } from '../../../types'; import Pagination from '../Pagination'; import PaginationItem from '../PaginationItem'; import PaginationLink from '../PaginationLink'; import PaginationLinkPrevious from '../PaginationLinkPrevious'; -const Story: ComponentStory = (args: SpiritPaginationProps) => ; +const PaginationCurrentLast = () => ( + + + + + + + + + + + + + + + + + + + + +); -Story.args = { - children: ( - <> - - - - - - - - - - - - - - - - - - - - ), -}; - -export default Story; +export default PaginationCurrentLast; diff --git a/packages/web-react/src/components/Pagination/demo/PaginationCurrentMiddle.tsx b/packages/web-react/src/components/Pagination/demo/PaginationCurrentMiddle.tsx index ec4d6a6990..1620c1cc97 100644 --- a/packages/web-react/src/components/Pagination/demo/PaginationCurrentMiddle.tsx +++ b/packages/web-react/src/components/Pagination/demo/PaginationCurrentMiddle.tsx @@ -1,40 +1,34 @@ import React from 'react'; -import { ComponentStory } from '@storybook/react'; -import { SpiritPaginationProps } from '../../../types'; import Pagination from '../Pagination'; import PaginationItem from '../PaginationItem'; import PaginationLink from '../PaginationLink'; import PaginationLinkNext from '../PaginationLinkNext'; import PaginationLinkPrevious from '../PaginationLinkPrevious'; -const Story: ComponentStory = (args: SpiritPaginationProps) => ; +const PaginationCurrentMiddle = () => ( + + + + + + + + + + + + + + + + + + + + + + + +); -Story.args = { - children: ( - <> - - - - - - - - - - - - - - - - - - - - - - - ), -}; - -export default Story; +export default PaginationCurrentMiddle; diff --git a/packages/web-react/src/components/Pagination/demo/index.tsx b/packages/web-react/src/components/Pagination/demo/index.tsx index cd5c0052f7..b9994150f1 100644 --- a/packages/web-react/src/components/Pagination/demo/index.tsx +++ b/packages/web-react/src/components/Pagination/demo/index.tsx @@ -11,104 +11,21 @@ import PaginationCurrentFirst from './PaginationCurrentFirst'; import PaginationCurrentMiddle from './PaginationCurrentMiddle'; import PaginationCurrentLast from './PaginationCurrentLast'; import PaginationCurrentFirstCentered from './PaginationCurrentFirstCentered'; -import PaginationItem from '../PaginationItem'; -import PaginationLink from '../PaginationLink'; -import PaginationLinkNext from '../PaginationLinkNext'; -import PaginationLinkPrevious from '../PaginationLinkPrevious'; ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( - - - - - - - - - - - - - - - - - - - - + - - - - - - - - - - - - - - - - - - - - - - - + - - - - - - - - - - - - - - - - - - - - + - - - - - - - - - - - - - - - - - - - - + , From ad26e54b1f89b3dc934ef410247676fbca8bf3dd Mon Sep 17 00:00:00 2001 From: Pavel Klibani Date: Sat, 16 Sep 2023 19:53:42 +0200 Subject: [PATCH 2/2] Docs(web): Add Pagination demo DS-903 - Pagination demo in web is now same as demo in web-react and web-twig --- .../src/scss/components/Pagination/index.html | 432 ++++++++++-------- 1 file changed, 237 insertions(+), 195 deletions(-) diff --git a/packages/web/src/scss/components/Pagination/index.html b/packages/web/src/scss/components/Pagination/index.html index 4c5449479c..c6da976c95 100644 --- a/packages/web/src/scss/components/Pagination/index.html +++ b/packages/web/src/scss/components/Pagination/index.html @@ -1,199 +1,241 @@ {{#> layout/plain }} - - - - - - - +
+ +

Pagination Current First

+ +
+ + + +
+ +
+ + + +
+ +

Pagination Current Middle

+ +
+ + + +
+ +
+ +
+ +

Pagination Current Last

+ +
+ + + +
+ +
+ +
+ +

Pagination Current First Centered

+ +
+ + + +
+ +
{{/layout/plain }}