@pagopa/io-app-design-system 1.1.3 → 1.2.0

package/src/components/icons/Icon.tsx

@@ -3,148 +3,150 @@ import { ColorValue, StyleProp } from "react-native";
 import { IOColors } from "../../core/IOColors";
 
 /* Icons */
-import IconSpid from "./svg/IconSpid";
-import IconCie from "./svg/IconCie";
-import IconQrCode from "./svg/IconQrCode";
-import IconBell from "./svg/IconBell";
-import IconHome from "./svg/IconHome";
-import IconHomeFill from "./svg/IconHomeFill";
-import IconCopy from "./svg/IconCopy";
-import IconSelfCertification from "./svg/IconSelfCertification";
-import IconInstitution from "./svg/IconInstitution";
-import IconHourglass from "./svg/IconHourglass";
-import IconPEC from "./svg/IconPEC";
-import IconMessageLegal from "./svg/IconMessageLegal";
-import IconShareiOs from "./svg/IconShareiOs";
-import IconShareAndroid from "./svg/IconShareAndroid";
-import IconLockOn from "./svg/IconLockOn";
-import IconLockOff from "./svg/IconLockOff";
-import IconInitiatives from "./svg/IconInitiatives";
-import IconAnalytics from "./svg/IconAnalytics";
-import IconFornitori from "./svg/IconFornitori";
-import IconEyeShow from "./svg/IconEyeShow";
-import IconEyeHide from "./svg/IconEyeHide";
-import IconPinOff from "./svg/IconPinOff";
-import IconPinOn from "./svg/IconPinOn";
-import IconEmojiSad from "./svg/IconEmojiSad";
-import IconEmojiHappy from "./svg/IconEmojiHappy";
-import IconPhone from "./svg/IconPhone";
-import IconEmail from "./svg/IconEmail";
-import IconEmailFill from "./svg/IconEmailFill";
-import IconMessage from "./svg/IconMessage";
-import IconDocument from "./svg/IconDocument";
-import IconDocumentSign from "./svg/IconDocumentSign";
-import IconGiacenza from "./svg/IconGiacenza";
-import IconChat from "./svg/IconChat";
+import IconAbacus from "./svg/IconAbacus";
+import IconAdd from "./svg/IconAdd";
 import IconAgreement from "./svg/IconAgreement";
-import IconSave from "./svg/IconSave";
-import IconSuccess from "./svg/IconSuccess";
-import IconOk from "./svg/IconOk";
-import IconFiscalCodeIndividual from "./svg/IconFiscalCodeIndividual";
-import IconCreditCard from "./svg/IconCreditCard";
-import IconBonus from "./svg/IconBonus";
-import IconTransactions from "./svg/IconTransactions";
 import IconAmount from "./svg/IconAmount";
-import IconPSP from "./svg/IconPSP";
-import IconAdd from "./svg/IconAdd";
-import IconCoggle from "./svg/IconCoggle";
-import IconInfo from "./svg/IconInfo";
-import IconInfoFilled from "./svg/IconInfoFilled";
-import IconNotice from "./svg/IconNotice";
-import IconNoticeFilled from "./svg/IconNoticeFilled";
-import IconRefund from "./svg/IconRefund";
-import IconReload from "./svg/IconReload";
-import IconHistory from "./svg/IconHistory";
-import IconEdit from "./svg/IconEdit";
+import IconAnalytics from "./svg/IconAnalytics";
+import IconArchive from "./svg/IconArchive";
+import IconArrowBottom from "./svg/IconArrowBottom";
+import IconArrowLeft from "./svg/IconArrowLeft";
+import IconArrowRight from "./svg/IconArrowRight";
+import IconArrowTop from "./svg/IconArrowTop";
+import IconAttachment from "./svg/IconAttachment";
+import IconBackAndroid from "./svg/IconBackAndroid";
+import IconBackiOS from "./svg/IconBackiOS";
+import IconBarcode from "./svg/IconBarcode";
 import IconBattery from "./svg/IconBattery";
-import IconTrashcan from "./svg/IconTrashcan";
+import IconBell from "./svg/IconBell";
+import IconBiomFaceID from "./svg/IconBiomFaceID";
+import IconBiomFingerprint from "./svg/IconBiomFingerprint";
+import IconBonus from "./svg/IconBonus";
 import IconCalendar from "./svg/IconCalendar";
-import IconLightbulb from "./svg/IconLightbulb";
-import IconMagicWand from "./svg/IconMagicWand";
-import IconProfile from "./svg/IconProfile";
-import IconProfileFilled from "./svg/IconProfileFilled";
-import IconProfileAlt from "./svg/IconProfileAlt";
-import IconStarFilled from "./svg/IconStarFilled";
-import IconStarEmpty from "./svg/IconStarEmpty";
-import IconAbacus from "./svg/IconAbacus";
-import IconSwitchOff from "./svg/IconSwitchOff";
-import IconDevice from "./svg/IconDevice";
-import IconDotMenu from "./svg/IconDotMenu";
-import IconBarcode from "./svg/IconBarcode";
-import IconLogin from "./svg/IconLogin";
-import IconLogout from "./svg/IconLogout";
-import IconLadybug from "./svg/IconLadybug";
-import IconTag from "./svg/IconTag";
-import IconGallery from "./svg/IconGallery";
 import IconCancel from "./svg/IconCancel";
-import IconQuestion from "./svg/IconQuestion";
-import IconSearch from "./svg/IconSearch";
+import IconCanceled from "./svg/IconCanceled";
+import IconCategCulture from "./svg/IconCategCulture";
+import IconCategFinance from "./svg/IconCategFinance";
+import IconCategHome from "./svg/IconCategHome";
+import IconCategJobOffers from "./svg/IconCategJobOffers";
+import IconCategLearning from "./svg/IconCategLearning";
+import IconCategMobility from "./svg/IconCategMobility";
+import IconCategShopping from "./svg/IconCategShopping";
+import IconCategSport from "./svg/IconCategSport";
+import IconCategSustainability from "./svg/IconCategSustainability";
+import IconCategTelco from "./svg/IconCategTelco";
+import IconCategTravel from "./svg/IconCategTravel";
+import IconCategWellness from "./svg/IconCategWellness";
+import IconChat from "./svg/IconChat";
+import IconCheckTick from "./svg/IconCheckTick";
+import IconCheckTickBig from "./svg/IconCheckTickBig";
+import IconChevronBottom from "./svg/IconChevronBottom";
+import IconChevronLeft from "./svg/IconChevronLeft";
+import IconChevronRight from "./svg/IconChevronRight";
+import IconChevronRightListItem from "./svg/IconChevronRightListItem";
+import IconChevronTop from "./svg/IconChevronTop";
+import IconCie from "./svg/IconCie";
 import IconCloseLarge from "./svg/IconCloseLarge";
+import IconCloseMedium from "./svg/IconCloseMedium";
 import IconCloseSmall from "./svg/IconCloseSmall";
+import IconCoggle from "./svg/IconCoggle";
+import IconCopy from "./svg/IconCopy";
+import IconCreditCard from "./svg/IconCreditCard";
+import IconDevice from "./svg/IconDevice";
+import IconDocument from "./svg/IconDocument";
 import IconDocumentAttachment from "./svg/IconDocumentAttachment";
 import IconDocumentAttachmentPDF from "./svg/IconDocumentAttachmentPDF";
-import IconAttachment from "./svg/IconAttachment";
-import IconLocationiOS from "./svg/IconLocationiOS";
-import IconLocationiOSFilled from "./svg/IconLocationiOSFilled";
-import IconLocationAndroid from "./svg/IconLocationAndroid";
-import IconExternalLink from "./svg/IconExternalLink";
-import IconWarningFilled from "./svg/IconWarningFilled";
-import IconCanceled from "./svg/IconCanceled";
+import IconDocumentSign from "./svg/IconDocumentSign";
+import IconDotMenu from "./svg/IconDotMenu";
+import IconEdit from "./svg/IconEdit";
+import IconEmail from "./svg/IconEmail";
+import IconEmailFill from "./svg/IconEmailFill";
+import IconEmojiHappy from "./svg/IconEmojiHappy";
+import IconEmojiSad from "./svg/IconEmojiSad";
 import IconErrorFilled from "./svg/IconErrorFilled";
+import IconExternalLink from "./svg/IconExternalLink";
+import IconEyeHide from "./svg/IconEyeHide";
+import IconEyeShow from "./svg/IconEyeShow";
+import IconFiscalCodeIndividual from "./svg/IconFiscalCodeIndividual";
+import IconFornitori from "./svg/IconFornitori";
+import IconGallery from "./svg/IconGallery";
+import IconGiacenza from "./svg/IconGiacenza";
+import IconHistory from "./svg/IconHistory";
+import IconHome from "./svg/IconHome";
+import IconHomeFill from "./svg/IconHomeFill";
+import IconHourglass from "./svg/IconHourglass";
+import IconInfo from "./svg/IconInfo";
+import IconInfoFilled from "./svg/IconInfoFilled";
+import IconInitiatives from "./svg/IconInitiatives";
+import IconInstitution from "./svg/IconInstitution";
+import IconLadybug from "./svg/IconLadybug";
 import IconLegalValue from "./svg/IconLegalValue";
-import IconChevronRight from "./svg/IconChevronRight";
-import IconChevronTop from "./svg/IconChevronTop";
-import IconChevronBottom from "./svg/IconChevronBottom";
-import IconChevronLeft from "./svg/IconChevronLeft";
-import IconChevronRightListItem from "./svg/IconChevronRightListItem";
-import IconArrowBottom from "./svg/IconArrowBottom";
-import IconArrowLeft from "./svg/IconArrowLeft";
-import IconArrowTop from "./svg/IconArrowTop";
-import IconArrowRight from "./svg/IconArrowRight";
-import IconBackiOS from "./svg/IconBackiOS";
-import IconBackAndroid from "./svg/IconBackAndroid";
+import IconLight from "./svg/IconLight";
+import IconLightFilled from "./svg/IconLightFilled";
+import IconLightbulb from "./svg/IconLightbulb";
+import IconLocationAndroid from "./svg/IconLocationAndroid";
+import IconLocationiOS from "./svg/IconLocationiOS";
+import IconLocationiOSFilled from "./svg/IconLocationiOSFilled";
+import IconLockOff from "./svg/IconLockOff";
+import IconLockOn from "./svg/IconLockOn";
+import IconLogin from "./svg/IconLogin";
+import IconLogout from "./svg/IconLogout";
+import IconMagicWand from "./svg/IconMagicWand";
+import IconMerchant from "./svg/IconMerchant";
+import IconMessage from "./svg/IconMessage";
+import IconMessageLegal from "./svg/IconMessageLegal";
 import IconNavMessages from "./svg/IconNavMessages";
-import IconNavWallet from "./svg/IconNavWallet";
+import IconNavMessagesFocused from "./svg/IconNavMessagesFocused";
+import IconNavProfile from "./svg/IconNavProfile";
+import IconNavProfileFocused from "./svg/IconNavProfileFocused";
 import IconNavScan from "./svg/IconNavScan";
 import IconNavServices from "./svg/IconNavServices";
-import IconNavProfile from "./svg/IconNavProfile";
-import IconNavMessagesFocused from "./svg/IconNavMessagesFocused";
-import IconNavWalletFocused from "./svg/IconNavWalletFocused";
 import IconNavServicesFocused from "./svg/IconNavServicesFocused";
-import IconNavProfileFocused from "./svg/IconNavProfileFocused";
-import IconBiomFingerprint from "./svg/IconBiomFingerprint";
-import IconBiomFaceID from "./svg/IconBiomFaceID";
-import IconCategCulture from "./svg/IconCategCulture";
-import IconCategWellness from "./svg/IconCategWellness";
-import IconCategLearning from "./svg/IconCategLearning";
-import IconCategSport from "./svg/IconCategSport";
-import IconCategHome from "./svg/IconCategHome";
-import IconCategTelco from "./svg/IconCategTelco";
-import IconCategFinance from "./svg/IconCategFinance";
-import IconCategTravel from "./svg/IconCategTravel";
-import IconCategMobility from "./svg/IconCategMobility";
-import IconCategJobOffers from "./svg/IconCategJobOffers";
-import IconCategShopping from "./svg/IconCategShopping";
-import IconCategSustainability from "./svg/IconCategSustainability";
+import IconNavWallet from "./svg/IconNavWallet";
+import IconNavWalletFocused from "./svg/IconNavWalletFocused";
+import IconNotice from "./svg/IconNotice";
+import IconNoticeFilled from "./svg/IconNoticeFilled";
+import IconOk from "./svg/IconOk";
+import IconPEC from "./svg/IconPEC";
+import IconPSP from "./svg/IconPSP";
+import IconPhone from "./svg/IconPhone";
+import IconPinOff from "./svg/IconPinOff";
+import IconPinOn from "./svg/IconPinOn";
 import IconProductIOApp from "./svg/IconProductIOApp";
 import IconProductIOAppBlueBg from "./svg/IconProductIOAppBlueBg";
 import IconProductPagoPA from "./svg/IconProductPagoPA";
-import IconWebsite from "./svg/IconWebsite";
+import IconProfile from "./svg/IconProfile";
+import IconProfileAlt from "./svg/IconProfileAlt";
+import IconProfileFilled from "./svg/IconProfileFilled";
+import IconQrCode from "./svg/IconQrCode";
+import IconQuestion from "./svg/IconQuestion";
+import IconRefund from "./svg/IconRefund";
+import IconReload from "./svg/IconReload";
+import IconSave from "./svg/IconSave";
+import IconSearch from "./svg/IconSearch";
 import IconSecurity from "./svg/IconSecurity";
-import LegIconRadioOn from "./svg/LegIconRadioOn";
-import LegIconRadioOff from "./svg/LegIconRadioOff";
-import LegIconCheckOn from "./svg/LegIconCheckOn";
-import LegIconCheckOff from "./svg/LegIconCheckOff";
-import IconCloseMedium from "./svg/IconCloseMedium";
-import IconCheckTick from "./svg/IconCheckTick";
-import IconCheckTickBig from "./svg/IconCheckTickBig";
-import IconMerchant from "./svg/IconMerchant";
+import IconSelfCertification from "./svg/IconSelfCertification";
+import IconShareAndroid from "./svg/IconShareAndroid";
+import IconShareiOs from "./svg/IconShareiOs";
+import IconSpid from "./svg/IconSpid";
+import IconStarEmpty from "./svg/IconStarEmpty";
+import IconStarFilled from "./svg/IconStarFilled";
+import IconSuccess from "./svg/IconSuccess";
+import IconSwitchOff from "./svg/IconSwitchOff";
+import IconSystemAppsAndroid from "./svg/IconSystemAppsAndroid";
+import IconSystemNotificationsInstructions from "./svg/IconSystemNotificationsInstructions";
 import IconSystemSettingsAndroid from "./svg/IconSystemSettingsAndroid";
 import IconSystemSettingsiOS from "./svg/IconSystemSettingsiOS";
 import IconSystemToggleInstructions from "./svg/IconSystemToggleInstructions";
-import IconSystemAppsAndroid from "./svg/IconSystemAppsAndroid";
-import IconSystemNotificationsInstructions from "./svg/IconSystemNotificationsInstructions";
-import IconArchive from "./svg/IconArchive";
+import IconTag from "./svg/IconTag";
+import IconTransactions from "./svg/IconTransactions";
+import IconTrashcan from "./svg/IconTrashcan";
+import IconWarningFilled from "./svg/IconWarningFilled";
+import IconWebsite from "./svg/IconWebsite";
+import LegIconCheckOff from "./svg/LegIconCheckOff";
+import LegIconCheckOn from "./svg/LegIconCheckOn";
+import LegIconRadioOff from "./svg/LegIconRadioOff";
+import LegIconRadioOn from "./svg/LegIconRadioOn";
 
 export const IOIcons = {
   archive: IconArchive,
@@ -284,6 +286,8 @@ export const IOIcons = {
   checkTick: IconCheckTick,
   checkTickBig: IconCheckTickBig,
   merchant: IconMerchant,
+  light: IconLight,
+  lightFilled: IconLightFilled,
   systemSettingsAndroid: IconSystemSettingsAndroid,
   systemSettingsiOS: IconSystemSettingsiOS,
   systemToggleInstructions: IconSystemToggleInstructions,

package/src/components/icons/svg/IconLight.tsx

@@ -0,0 +1,16 @@
+import React from "react";
+import { Svg, Path } from "react-native-svg";
+import { SVGIconProps } from "../Icon";
+
+const IconLadybug = ({ size, style, ...props }: SVGIconProps) => (
+  <Svg width={size} height={size} viewBox="0 0 24 24" style={style} {...props}>
+    <Path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M8.52556 7.36919L5 4.02177V2H19V4.02177L15.4862 7.35806L15.4817 7.36231C14.8473 7.96113 14.5 8.79051 14.5 9.64538V22H9.5V9.64538C9.5 8.78028 9.14259 7.95878 8.52556 7.36919ZM16.8562 8.81519L20.6438 5.21888C20.87 5.00278 21 4.70203 21 4.38868V1.13994C21 0.509642 20.496 0 19.8728 0H4.12723C3.50396 0 3 0.509642 3 1.13994V4.38868C3 4.70383 3.12822 5.00458 3.35615 5.21888L7.14385 8.81519C7.37 9.03129 7.5 9.33203 7.5 9.64538V22.8601C7.5 23.4904 8.00396 24 8.62723 24H15.3728C15.996 24 16.5 23.4904 16.5 22.8601V9.64538C16.5 9.33023 16.6282 9.02949 16.8562 8.81519ZM11.0098 9.82483V8.07369C11.0098 7.52736 11.4527 7.08447 11.999 7.08447C12.5453 7.08447 12.9882 7.52736 12.9882 8.07369V9.82483C12.9882 10.3712 12.5453 10.814 11.999 10.814C11.4527 10.814 11.0098 10.3712 11.0098 9.82483Z"
+      fill="currentColor"
+    />
+  </Svg>
+);
+
+export default IconLadybug;

package/src/components/icons/svg/IconLightFilled.tsx

@@ -0,0 +1,16 @@
+import React from "react";
+import { Svg, Path } from "react-native-svg";
+import { SVGIconProps } from "../Icon";
+
+const IconLadybug = ({ size, style, ...props }: SVGIconProps) => (
+  <Svg width={size} height={size} viewBox="0 0 24 24" style={style} {...props}>
+    <Path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M19.8728 0H4.12723C3.50396 0 3 0.509642 3 1.13994V4.38868C3 4.70383 3.12822 5.00458 3.35615 5.21888L7.14385 8.81519C7.37 9.03129 7.5 9.33203 7.5 9.64538V22.8601C7.5 23.4904 8.00396 24 8.62723 24H15.3728C15.996 24 16.5 23.4904 16.5 22.8601V9.64538C16.5 9.33023 16.6282 9.02949 16.8562 8.81519L20.6438 5.21888C20.87 5.00278 21 4.70203 21 4.38868V1.13994C21 0.509642 20.496 0 19.8728 0ZM12.9883 9.82492C12.9883 10.3712 12.5454 10.8141 11.9991 10.8141C11.4528 10.8141 11.0099 10.3712 11.0099 9.82492V8.07378C11.0099 7.52745 11.4528 7.08457 11.9991 7.08457C12.5454 7.08457 12.9883 7.52745 12.9883 8.07378V9.82492Z"
+      fill="currentColor"
+    />
+  </Svg>
+);
+
+export default IconLadybug;

package/src/components/icons/svg/originals/IconLight.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.52556 7.36919L5 4.02177V2H19V4.02177L15.4862 7.35806L15.4817 7.36231C14.8473 7.96113 14.5 8.79051 14.5 9.64538V22H9.5V9.64538C9.5 8.78028 9.14259 7.95878 8.52556 7.36919ZM16.8562 8.81519L20.6438 5.21888C20.87 5.00278 21 4.70203 21 4.38868V1.13994C21 0.509642 20.496 0 19.8728 0H4.12723C3.50396 0 3 0.509642 3 1.13994V4.38868C3 4.70383 3.12822 5.00458 3.35615 5.21888L7.14385 8.81519C7.37 9.03129 7.5 9.33203 7.5 9.64538V22.8601C7.5 23.4904 8.00396 24 8.62723 24H15.3728C15.996 24 16.5 23.4904 16.5 22.8601V9.64538C16.5 9.33023 16.6282 9.02949 16.8562 8.81519ZM11.0098 9.82483V8.07369C11.0098 7.52736 11.4527 7.08447 11.999 7.08447C12.5453 7.08447 12.9882 7.52736 12.9882 8.07369V9.82483C12.9882 10.3712 12.5453 10.814 11.999 10.814C11.4527 10.814 11.0098 10.3712 11.0098 9.82483Z" fill="white"/>
+</svg>

package/src/components/icons/svg/originals/IconLightFilled.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.8728 0H4.12723C3.50396 0 3 0.509642 3 1.13994V4.38868C3 4.70383 3.12822 5.00458 3.35615 5.21888L7.14385 8.81519C7.37 9.03129 7.5 9.33203 7.5 9.64538V22.8601C7.5 23.4904 8.00396 24 8.62723 24H15.3728C15.996 24 16.5 23.4904 16.5 22.8601V9.64538C16.5 9.33023 16.6282 9.02949 16.8562 8.81519L20.6438 5.21888C20.87 5.00278 21 4.70203 21 4.38868V1.13994C21 0.509642 20.496 0 19.8728 0ZM12.9883 9.82492C12.9883 10.3712 12.5454 10.8141 11.9991 10.8141C11.4528 10.8141 11.0099 10.3712 11.0099 9.82492V8.07378C11.0099 7.52745 11.4528 7.08457 11.9991 7.08457C12.5454 7.08457 12.9883 7.52745 12.9883 8.07378V9.82492Z" fill="white"/>
+</svg>

package/src/components/index.tsx

@@ -15,4 +15,5 @@ export * from "./radio";
 export * from "./spacer";
 export * from "./switch";
 export * from "./tag";
+export * from "./tabs";
 export * from "./typography";

package/src/components/pictograms/Pictogram.tsx

@@ -2,44 +2,45 @@ import React from "react";
 import { ColorValue } from "react-native";
 import { IOColors } from "../../core/IOColors";
 
+import PictogramAbacus from "./svg/PictogramAbacus";
 import PictogramAirBaloon from "./svg/PictogramAirBaloon";
-import PictogramHeart from "./svg/PictogramHeart";
+import PictogramAirship from "./svg/PictogramAirship";
+import PictogramAttention from "./svg/PictogramAttention";
+import PictogramBaloons from "./svg/PictogramBaloons";
+import PictogramBeerMug from "./svg/PictogramBeerMug";
+import PictogramCameraRequest from "./svg/PictogramCameraRequest";
 import PictogramCompleted from "./svg/PictogramCompleted";
-import PictogramEmailValidation from "./svg/PictogramEmailValidation";
+import PictogramDonation from "./svg/PictogramDonation";
 import PictogramEmailToValidate from "./svg/PictogramEmailToValidate";
-import PictogramAbacus from "./svg/PictogramAbacus";
-import PictogramPiggyBank from "./svg/PictogramPiggyBank";
-import PictogramProcessing from "./svg/PictogramProcessing";
-import PictogramBaloons from "./svg/PictogramBaloons";
-import PictogramPlaces from "./svg/PictogramPlaces";
-import PictogramNotAvailable from "./svg/PictogramNotAvailable";
-import PictogramAirship from "./svg/PictogramAirship";
-import PictogramSearch from "./svg/PictogramSearch";
-import PictogramUnrecognized from "./svg/PictogramUnrecognized";
+import PictogramEmailValidation from "./svg/PictogramEmailValidation";
+import PictogramEmptyArchive from "./svg/PictogramEmptyArchive";
 import PictogramError from "./svg/PictogramError";
-import PictogramUmbrella from "./svg/PictogramUmbrella";
-import PictogramInProgress from "./svg/PictogramInProgress";
+import PictogramFeedback from "./svg/PictogramFeedback";
 import PictogramFireworks from "./svg/PictogramFireworks";
-import PictogramPuzzle from "./svg/PictogramPuzzle";
-import PictogramQuestion from "./svg/PictogramQuestion";
-import PictogramPin from "./svg/PictogramPin";
-import PictogramTimeout from "./svg/PictogramTimeout";
-import PictogramUploadFile from "./svg/PictogramUploadFile";
+import PictogramFollowMessage from "./svg/PictogramFollowMessage";
+import PictogramHeart from "./svg/PictogramHeart";
 import PictogramHourglass from "./svg/PictogramHourglass";
-import PictogramTeaBreak from "./svg/PictogramTeaBreak";
-import PictogramSms from "./svg/PictogramSms";
-import PictogramInbox from "./svg/PictogramInbox";
-import PictogramBeerMug from "./svg/PictogramBeerMug";
 import PictogramIBANCard from "./svg/PictogramIBANCard";
-import PictogramFollowMessage from "./svg/PictogramFollowMessage";
+import PictogramInProgress from "./svg/PictogramInProgress";
+import PictogramInbox from "./svg/PictogramInbox";
 import PictogramManual from "./svg/PictogramManual";
+import PictogramNotAvailable from "./svg/PictogramNotAvailable";
+import PictogramPiggyBank from "./svg/PictogramPiggyBank";
+import PictogramPin from "./svg/PictogramPin";
+import PictogramPlaces from "./svg/PictogramPlaces";
+import PictogramProcessing from "./svg/PictogramProcessing";
+import PictogramPuzzle from "./svg/PictogramPuzzle";
+import PictogramQuestion from "./svg/PictogramQuestion";
+import PictogramSearch from "./svg/PictogramSearch";
 import PictogramSetup from "./svg/PictogramSetup";
-import PictogramDonation from "./svg/PictogramDonation";
-import PictogramAttention from "./svg/PictogramAttention";
-import PictogramEmptyArchive from "./svg/PictogramEmptyArchive";
+import PictogramSms from "./svg/PictogramSms";
+import PictogramTeaBreak from "./svg/PictogramTeaBreak";
+import PictogramTimeout from "./svg/PictogramTimeout";
+import PictogramUmbrella from "./svg/PictogramUmbrella";
 import PictogramUmbrellaNew from "./svg/PictogramUmbrellaNew";
-import PictogramFeedback from "./svg/PictogramFeedback";
-import PictogramCameraRequest from "./svg/PictogramCameraRequest";
+import PictogramUnrecognized from "./svg/PictogramUnrecognized";
+import PictogramUploadFile from "./svg/PictogramUploadFile";
+import PictogramSuccess from "./svg/PictogramSuccess";
 
 export const IOPictograms = {
   airBaloon: PictogramAirBaloon,
@@ -79,7 +80,8 @@ export const IOPictograms = {
   emptyArchive: PictogramEmptyArchive,
   umbrellaNew: PictogramUmbrellaNew,
   feedback: PictogramFeedback,
-  cameraRequest: PictogramCameraRequest
+  cameraRequest: PictogramCameraRequest,
+  success: PictogramSuccess
 };
 
 export type IOPictograms = keyof typeof IOPictograms;

package/src/components/pictograms/svg/PictogramSuccess.tsx

@@ -0,0 +1,49 @@
+import React from "react";
+import Svg, { Circle, ClipPath, Defs, G, Path, Rect } from "react-native-svg";
+import { SVGPictogramProps } from "../Pictogram";
+
+const PictogramSuccess = ({ size, color, ...props }: SVGPictogramProps) => (
+  <Svg width={size} height={size} viewBox="0 0 124 124" {...props}>
+    <G clip-path="url(#clip0_9323_4689)">
+      <Path
+        d="M57.5222 99.433C59.3522 99.433 60.7207 98.8733 61.6085 97.7578C63.8145 94.9833 61.8916 89.9179 61.8063 89.706L60.1082 90.4056C60.5618 91.581 61.4573 94.9793 60.1896 96.5665C59.4297 97.518 57.9099 97.7818 55.6613 97.3541C50.8733 96.4425 47.4965 92.1847 46.3838 88.6146C45.8488 86.8994 45.8798 85.3922 46.4613 84.7725L45.1432 83.4652C44.0538 84.6326 43.8677 86.7195 44.6392 89.1943C45.9108 93.2842 49.7994 98.1616 55.3279 99.2131C56.1188 99.361 56.8477 99.437 57.5184 99.437L57.5222 99.433Z"
+        fill="#0B3EE3"
+      />
+      <Path
+        d="M59.348 90.3617C62.3721 90.3617 63.6592 89.2983 64.1865 88.2028C64.9774 86.5597 64.1438 84.4408 62.9187 83.4173L61.7672 84.8845C62.3565 85.3723 62.9342 86.5517 62.5465 87.3633C62.0425 88.4147 59.6078 89.0584 54.2886 87.7191C46.6472 85.7961 44.7824 80.3389 44.352 77.2605C44.1582 75.8572 44.4955 74.4899 45.2786 73.5024C46.1509 72.403 47.1124 72.2391 48.3996 72.9747L49.2874 71.3275C47.2326 70.1521 45.3096 70.5 43.8674 72.311C42.7586 73.7023 42.274 75.6093 42.5454 77.5323C43.0416 81.0825 45.174 87.3633 53.8583 89.5541C56.1379 90.1298 57.9368 90.3617 59.3519 90.3617H59.348Z"
+        fill="#0B3EE3"
+      />
+      <Path
+        d="M62.3059 85.1124C62.7169 85.1124 63.1045 85.0685 63.469 84.9765C64.7135 84.6727 65.6905 83.8571 66.3767 82.5578C66.8497 81.6582 67.09 80.111 65.5431 77.8402C64.4266 76.201 62.4997 74.4379 60.4644 73.1026C62.2555 70.388 61.5034 67.7574 60.7745 66.6579C59.2276 64.2912 57.0953 63.1438 54.6141 63.3556C51.1093 63.6475 48.2481 66.7779 47.9651 70.6359C47.6549 74.8137 48.9847 78.0921 51.7994 80.115C56.5448 83.5213 59.8634 85.1084 62.3098 85.1084L62.3059 85.1124ZM54.9824 72.8148C57.103 72.8148 61.9027 75.7812 64.0466 78.9236C64.5002 79.5913 65.202 80.8346 64.7716 81.6542C64.3335 82.4898 63.7869 82.9615 63.0503 83.1415C61.1234 83.6132 57.7893 82.118 52.8462 78.5678C50.5588 76.9247 49.5275 74.306 49.7911 70.7798C50.0082 67.8373 52.1483 65.4546 54.7653 65.2347C56.6184 65.0788 58.0762 65.8943 59.2664 67.7174C59.3207 67.8054 60.538 69.7723 58.8748 72.1591C57.2116 71.2836 55.5988 70.7838 54.4241 70.9717L54.6993 72.8348C54.7885 72.8228 54.8854 72.8148 54.9862 72.8148H54.9824Z"
+        fill="#0B3EE3"
+      />
+      <Path
+        d="M88.1897 80.003C95.5985 80.003 103.461 77.8641 107.078 76.1929L106.33 74.4738C103.542 75.7612 97.8471 77.3883 91.9309 77.916C87.1313 78.3438 80.5948 78.1999 76.7217 75.0815C74.1862 73.0426 71.7864 70.6878 71.3793 67.2935C70.6465 61.2286 67.607 56.555 64.5636 56.9029C61.148 57.2827 59.9113 65.7543 59.6128 68.341L61.4311 68.5649C61.9622 63.9592 63.4277 58.9258 64.7613 58.7779C66.2578 58.606 68.8903 61.9363 69.561 67.5294C70.0534 71.6153 72.8874 74.3939 75.5974 76.5727C78.7416 79.1034 83.3706 80.007 88.1936 80.007L88.1897 80.003Z"
+        fill="#0B3EE3"
+      />
+      <Path
+        d="M97.598 106.433C107.43 106.433 117.211 103.371 124 93.9159L122.531 92.7925C104.282 118.191 62.5466 94.6315 62.1279 94.3917L61.2362 96.0388C61.5154 96.1987 79.6323 106.429 97.598 106.429V106.433Z"
+        fill="#0B3EE3"
+      />
+    </G>
+    <Circle cx="25.0589" cy="44.6917" r="21.4417" fill="#AAEEEF" />
+    <Path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M36.2598 37.0147C36.6982 37.4552 36.6966 38.1678 36.2563 38.6064L22.4373 52.3704C21.9983 52.8076 21.2886 52.8076 20.8497 52.3704L13.2492 44.8002C12.8089 44.3616 12.8074 43.649 13.2458 43.2085C13.6842 42.7681 14.3965 42.7665 14.8369 43.2051L21.6435 49.9846L34.6687 37.0113C35.109 36.5727 35.8213 36.5742 36.2598 37.0147Z"
+      fill="#00C5CA"
+    />
+    <Defs>
+      <ClipPath id="clip0_9323_4689">
+        <Rect
+          width="81.532"
+          height="49.5505"
+          fill="white"
+          transform="matrix(-1 0 0 1 124 56.8829)"
+        />
+      </ClipPath>
+    </Defs>
+  </Svg>
+);
+
+export default PictogramSuccess;

package/src/components/pictograms/svg/originals/PictogramSuccess.svg

@@ -0,0 +1,35 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 124 124">
+    <g clip-path="url(#clip0_9323_4689)">
+        <path 
+            d="M57.5222 99.433C59.3522 99.433 60.7207 98.8733 61.6085 97.7578C63.8145 94.9833 61.8916 89.9179 61.8063 89.706L60.1082 90.4056C60.5618 91.581 61.4573 94.9793 60.1896 96.5665C59.4297 97.518 57.9099 97.7818 55.6613 97.3541C50.8733 96.4425 47.4965 92.1847 46.3838 88.6146C45.8488 86.8994 45.8798 85.3922 46.4613 84.7725L45.1432 83.4652C44.0538 84.6326 43.8677 86.7195 44.6392 89.1943C45.9108 93.2842 49.7994 98.1616 55.3279 99.2131C56.1188 99.361 56.8477 99.437 57.5184 99.437L57.5222 99.433Z" 
+            fill="#0B3EE3"
+        />
+        <path 
+            d="M59.348 90.3617C62.3721 90.3617 63.6592 89.2983 64.1865 88.2028C64.9774 86.5597 64.1438 84.4408 62.9187 83.4173L61.7672 84.8845C62.3565 85.3723 62.9342 86.5517 62.5465 87.3633C62.0425 88.4147 59.6078 89.0584 54.2886 87.7191C46.6472 85.7961 44.7824 80.3389 44.352 77.2605C44.1582 75.8572 44.4955 74.4899 45.2786 73.5024C46.1509 72.403 47.1124 72.2391 48.3996 72.9747L49.2874 71.3275C47.2326 70.1521 45.3096 70.5 43.8674 72.311C42.7586 73.7023 42.274 75.6093 42.5454 77.5323C43.0416 81.0825 45.174 87.3633 53.8583 89.5541C56.1379 90.1298 57.9368 90.3617 59.3519 90.3617H59.348Z" 
+            fill="#0B3EE3"
+        />
+        <path 
+            d="M62.3059 85.1124C62.7169 85.1124 63.1045 85.0685 63.469 84.9765C64.7135 84.6727 65.6905 83.8571 66.3767 82.5578C66.8497 81.6582 67.09 80.111 65.5431 77.8402C64.4266 76.201 62.4997 74.4379 60.4644 73.1026C62.2555 70.388 61.5034 67.7574 60.7745 66.6579C59.2276 64.2912 57.0953 63.1438 54.6141 63.3556C51.1093 63.6475 48.2481 66.7779 47.9651 70.6359C47.6549 74.8137 48.9847 78.0921 51.7994 80.115C56.5448 83.5213 59.8634 85.1084 62.3098 85.1084L62.3059 85.1124ZM54.9824 72.8148C57.103 72.8148 61.9027 75.7812 64.0466 78.9236C64.5002 79.5913 65.202 80.8346 64.7716 81.6542C64.3335 82.4898 63.7869 82.9615 63.0503 83.1415C61.1234 83.6132 57.7893 82.118 52.8462 78.5678C50.5588 76.9247 49.5275 74.306 49.7911 70.7798C50.0082 67.8373 52.1483 65.4546 54.7653 65.2347C56.6184 65.0788 58.0762 65.8943 59.2664 67.7174C59.3207 67.8054 60.538 69.7723 58.8748 72.1591C57.2116 71.2836 55.5988 70.7838 54.4241 70.9717L54.6993 72.8348C54.7885 72.8228 54.8854 72.8148 54.9862 72.8148H54.9824Z" 
+            fill="#0B3EE3"
+        />
+        <path 
+            d="M88.1897 80.003C95.5985 80.003 103.461 77.8641 107.078 76.1929L106.33 74.4738C103.542 75.7612 97.8471 77.3883 91.9309 77.916C87.1313 78.3438 80.5948 78.1999 76.7217 75.0815C74.1862 73.0426 71.7864 70.6878 71.3793 67.2935C70.6465 61.2286 67.607 56.555 64.5636 56.9029C61.148 57.2827 59.9113 65.7543 59.6128 68.341L61.4311 68.5649C61.9622 63.9592 63.4277 58.9258 64.7613 58.7779C66.2578 58.606 68.8903 61.9363 69.561 67.5294C70.0534 71.6153 72.8874 74.3939 75.5974 76.5727C78.7416 79.1034 83.3706 80.007 88.1936 80.007L88.1897 80.003Z" 
+            fill="#0B3EE3"
+        />
+        <path 
+            d="M97.598 106.433C107.43 106.433 117.211 103.371 124 93.9159L122.531 92.7925C104.282 118.191 62.5466 94.6315 62.1279 94.3917L61.2362 96.0388C61.5154 96.1987 79.6323 106.429 97.598 106.429V106.433Z" 
+            fill="#0B3EE3"
+        />
+    </g>
+    <circle cx="25.0589" cy="44.6917" r="21.4417" fill="#AAEEEF"/>
+    <path 
+        fill-rule="evenodd" 
+        clip-rule="evenodd"
+        d="M36.2598 37.0147C36.6982 37.4552 36.6966 38.1678 36.2563 38.6064L22.4373 52.3704C21.9983 52.8076 21.2886 52.8076 20.8497 52.3704L13.2492 44.8002C12.8089 44.3616 12.8074 43.649 13.2458 43.2085C13.6842 42.7681 14.3965 42.7665 14.8369 43.2051L21.6435 49.9846L34.6687 37.0113C35.109 36.5727 35.8213 36.5742 36.2598 37.0147Z" fill="#00C5CA"
+    />
+    <defs>
+        <clipPath id="clip0_9323_4689">
+            <rect width="81.532" height="49.5505" fill="white" transform="matrix(-1 0 0 1 124 56.8829)"/>
+        </clipPath>
+    </defs>
+</svg>