diff --git a/example/src/pages/Pictograms.tsx b/example/src/pages/Pictograms.tsx index 9dad0a4c..116031d7 100644 --- a/example/src/pages/Pictograms.tsx +++ b/example/src/pages/Pictograms.tsx @@ -14,11 +14,11 @@ import { hexToRgba } from "@pagopa/io-app-design-system"; import * as React from "react"; -import { StyleSheet, View } from "react-native"; import { useContext } from "react"; +import { StyleSheet, View } from "react-native"; import { AssetViewerBox, assetItemGutter } from "../components/AssetViewerBox"; -import { Screen } from "../components/Screen"; import { ComponentViewerBox } from "../components/ComponentViewerBox"; +import { Screen } from "../components/Screen"; const styles = StyleSheet.create({ itemsWrapper: { @@ -50,6 +50,15 @@ const filterPictogramSet = ( ) ); +const sortPictogramSet = ( + pictogramSetObject: PictogramSetObject +): PictogramSetObject => + Object.fromEntries( + [...Object.entries(pictogramSetObject)].sort(([l], [r]) => + l.localeCompare(r) + ) + ); + const filteredIOPictograms = filterPictogramSet( { ...IOPictogramsObject, @@ -58,6 +67,11 @@ const filteredIOPictograms = filterPictogramSet( IOPictograms ); +const sortedIOPictograms = sortPictogramSet(filteredIOPictograms); +const sortedIOPictogramsBleed = sortPictogramSet(IOPictogramsBleed); +const sortedIOPictogramsObject = sortPictogramSet(IOPictogramsObject); +const sortedIOPictogramsLegacy = sortPictogramSet(IOPictogramsLegacy); + export const Pictograms = () => { const theme = useContext(IOThemeContext); return ( @@ -73,7 +87,7 @@ export const Pictograms = () => { Pictograms - {Object.entries(filteredIOPictograms).map(([pictogramItemName]) => ( + {Object.entries(sortedIOPictograms).map(([pictogramItemName]) => ( { Bleed Pictograms - {Object.entries(IOPictogramsBleed).map(([pictogramItemName]) => ( + {Object.entries(sortedIOPictogramsBleed).map(([pictogramItemName]) => ( { Objects Pictograms - {Object.entries(IOPictogramsObject).map(([pictogramItemName]) => ( + {Object.entries(sortedIOPictogramsObject).map(([pictogramItemName]) => ( { Legacy Pictograms - {Object.entries(IOPictogramsLegacy).map(([pictogramItemName]) => ( + {Object.entries(sortedIOPictogramsLegacy).map(([pictogramItemName]) => ( ( + + + + + + + + + + + + + + + + + + + + + + +); + +export default PictogramComunicationProblem; diff --git a/src/components/pictograms/svg/PictogramEventClose.tsx b/src/components/pictograms/svg/PictogramEventClose.tsx new file mode 100644 index 00000000..b7ef496b --- /dev/null +++ b/src/components/pictograms/svg/PictogramEventClose.tsx @@ -0,0 +1,34 @@ +import React from "react"; +import { Svg, Path } from "react-native-svg"; +import { SVGPictogramProps } from "../Pictogram"; + +const PictogramEventClose = ({ + size, + colorValues, + ...props +}: SVGPictogramProps) => ( + + + + + + + +); + +export default PictogramEventClose; diff --git a/src/components/pictograms/svg/PictogramHello.tsx b/src/components/pictograms/svg/PictogramHello.tsx new file mode 100644 index 00000000..9f216c6c --- /dev/null +++ b/src/components/pictograms/svg/PictogramHello.tsx @@ -0,0 +1,54 @@ +import React from "react"; +import { Svg, Path } from "react-native-svg"; +import { SVGPictogramProps } from "../Pictogram"; + +const PictogramHello = ({ size, colorValues, ...props }: SVGPictogramProps) => ( + + + + + + + + + + +); + +export default PictogramHello; diff --git a/src/components/pictograms/svg/originals/PictogramComunicationProblem.svg b/src/components/pictograms/svg/originals/PictogramComunicationProblem.svg new file mode 100644 index 00000000..a94524f3 --- /dev/null +++ b/src/components/pictograms/svg/originals/PictogramComunicationProblem.svg @@ -0,0 +1,91 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +; diff --git a/src/components/pictograms/svg/originals/PictogramEventClose.svg b/src/components/pictograms/svg/originals/PictogramEventClose.svg new file mode 100644 index 00000000..b10f61fd --- /dev/null +++ b/src/components/pictograms/svg/originals/PictogramEventClose.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + +; diff --git a/src/components/pictograms/svg/originals/PictogramHello.svg b/src/components/pictograms/svg/originals/PictogramHello.svg new file mode 100644 index 00000000..3b28a5b7 --- /dev/null +++ b/src/components/pictograms/svg/originals/PictogramHello.svg @@ -0,0 +1,46 @@ + + + + + + + + + +;