Fix RowItem

BouyguesTelecom · Nov 13, 2024 · 0bb77f1 · 0bb77f1
1 parent 97f9517
commit 0bb77f1
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 16 deletions.
diff --git a/examples/react-template/screens/Breadcrumb.tsx b/examples/react-template/screens/Breadcrumb.tsx
@@ -1,4 +1,5 @@
-import React, { useState } from 'react'
+import * as React from 'react'
+import { useState } from 'react'
 import {
   Box,
   BoxContent,
@@ -8,7 +9,7 @@ import {
   Card,
   CardContent,
   Container,
-  RowItem,
+  Row,
   Rows,
   Section,
   Text,
@@ -76,8 +77,8 @@ export const BreadcrumScreen = (): JSX.Element => {
       <Text typo={[TypographyBold.TEXT_WEIGHT_SEMIBOLD]}>Breadcrumb in rows</Text>
       <Container >
         <Rows>
-          <RowItem></RowItem>
-          <RowItem>
+          <Row></Row>
+          <Row>
             <Container >
               <Breadcrumb>
                 <BreadcrumbItem href='https://Home.fr'>Home</BreadcrumbItem>
@@ -86,7 +87,7 @@ export const BreadcrumScreen = (): JSX.Element => {
                 <BreadcrumbItem active>Current page</BreadcrumbItem>
               </Breadcrumb>
             </Container>
-          </RowItem>
+          </Row>
         </Rows>
       </Container>
     </Section>

diff --git a/examples/react-template/screens/Image.tsx b/examples/react-template/screens/Image.tsx
@@ -1,24 +1,24 @@
 import * as React from 'react'
-import { Image, RadiusValues, RowItem, Rows, Section } from '@trilogy-ds/react/components'
+import { Image, RadiusValues, Row, Rows, Section } from '@trilogy-ds/react/components'
 import { Alignable, Divider, Title, TitleLevels } from '@trilogy-ds/react'
 
 export const ImageScreen = (): JSX.Element => {
   return (
     <Section>
       <Title level={TitleLevels.THREE}>Image simple</Title>
       <Rows>
-        <RowItem>
+        <Row>
           <Image align={Alignable.ALIGNED_CENTER} width={150} height={150} src='https://picsum.photos/id/1/1500/600' />
-        </RowItem>
-        <RowItem>
+        </Row>
+        <Row>
           <Image radius={RadiusValues.SMALL} width={1000} height={250} src='https://picsum.photos/id/1/1500/600' />
-        </RowItem>
-        <RowItem>
+        </Row>
+        <Row>
           <Image radius={RadiusValues.MEDIUM} width={1000} height={250} src='https://picsum.photos/id/1/1500/600' />
-        </RowItem>
-        <RowItem>
+        </Row>
+        <Row>
           <Image radius={RadiusValues.LARGE} width={1000} height={250} src='https://picsum.photos/id/1/1500/600' />
-        </RowItem>
+        </Row>
       </Rows>
       <Divider />
       <Title level={TitleLevels.THREE}>Image circled</Title>

diff --git a/examples/react-template/screens/Popover.tsx b/examples/react-template/screens/Popover.tsx
@@ -23,7 +23,7 @@ export const PopoverScreen = (): JSX.Element => {
           <Column>
             <Popover>
               <PopoverContent>
-                <Tag variant={TagVariant.ERROR}>Test</Tag>
+                <Tag variant={TagVariant.ERROR} label="Test"/>
                 <Icon name={IconName.TIMES} />
               </PopoverContent>
               <Link>Simple</Link>
@@ -37,7 +37,7 @@ export const PopoverScreen = (): JSX.Element => {
           <Column>
             <Popover>
               <PopoverContent>
-                <Tag variant={TagVariant.ERROR}>Test</Tag>
+                <Tag variant={TagVariant.ERROR} label="Test"/>
                 <Icon name={IconName.TIMES} />
               </PopoverContent>
               <Button variant={'PRIMARY'}>Node content</Button>