@bbl-digital/snorre 4.0.0-beta.5 → 4.0.0-beta.6

package/lib/icons/Icon.stories.js

@@ -193,75 +193,420 @@ export default {
 
 export const Standard = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconCheck, {}), /*#__PURE__*/_jsx(IconClose, {}), /*#__PURE__*/_jsx(IconPlus, {}), /*#__PURE__*/_jsx(IconMinus, {}), /*#__PURE__*/_jsx(IconGrid, {}), /*#__PURE__*/_jsx(IconHelp, {}), /*#__PURE__*/_jsx(IconCloseAlt, {}), /*#__PURE__*/_jsx(IconSearch, {}), /*#__PURE__*/_jsx(IconMenu, {}), /*#__PURE__*/_jsx(IconInbox, {}), /*#__PURE__*/_jsx(IconSettings, {}), /*#__PURE__*/_jsx(IconHistory, {}), /*#__PURE__*/_jsx(IconRefresh, {}), /*#__PURE__*/_jsx(IconBookmarkFilled, {}), /*#__PURE__*/_jsx(IconComment, {}), /*#__PURE__*/_jsx(IconImportantComment, {}), /*#__PURE__*/_jsx(IconBack, {}), /*#__PURE__*/_jsx(IconRedo, {}), /*#__PURE__*/_jsx(IconSave, {}), /*#__PURE__*/_jsx(IconArchives, {}), /*#__PURE__*/_jsx(IconSend, {}), /*#__PURE__*/_jsx(IconDraft, {}), /*#__PURE__*/_jsx(IconMail, {}), /*#__PURE__*/_jsx(IconVote, {}), /*#__PURE__*/_jsx(IconWarning, {}), /*#__PURE__*/_jsx(IconWarningBell, {}), /*#__PURE__*/_jsx(IconExternalLink, {}), /*#__PURE__*/_jsx(IconPhone, {}), /*#__PURE__*/_jsx(IconPlusAlt, {}), /*#__PURE__*/_jsx(IconBellOutline, {}), /*#__PURE__*/_jsx(IconFilterList, {}), /*#__PURE__*/_jsx(IconSort, {}), /*#__PURE__*/_jsx(IconEarth, {}), /*#__PURE__*/_jsx(IconUndo, {}), /*#__PURE__*/_jsx(IconCalendar, {}), /*#__PURE__*/_jsx(IconBlock, {}), /*#__PURE__*/_jsx(IconInfoOutline, {}), /*#__PURE__*/_jsx(IconInfoFilled, {}), /*#__PURE__*/_jsx(IconDelete, {}), /*#__PURE__*/_jsx(IconDoor, {}), /*#__PURE__*/_jsx(IconLabel, {}), /*#__PURE__*/_jsx(IconSliders, {}), /*#__PURE__*/_jsx(IconPinned, {}), /*#__PURE__*/_jsx(IconCases, {}), /*#__PURE__*/_jsx(IconImage, {}), /*#__PURE__*/_jsx(IconCamera, {})]
+    children: [/*#__PURE__*/_jsx(IconCheck, {
+      name: "IconCheck"
+    }), /*#__PURE__*/_jsx(IconClose, {
+      name: "IconClose"
+    }), /*#__PURE__*/_jsx(IconPlus, {
+      name: "IconPlus"
+    }), /*#__PURE__*/_jsx(IconMinus, {
+      name: "IconMinus"
+    }), /*#__PURE__*/_jsx(IconGrid, {
+      name: "IconGrid"
+    }), /*#__PURE__*/_jsx(IconHelp, {
+      name: "IconHelp"
+    }), /*#__PURE__*/_jsx(IconCloseAlt, {
+      name: "IconCloseAlt"
+    }), /*#__PURE__*/_jsx(IconSearch, {
+      name: "IconSearch"
+    }), /*#__PURE__*/_jsx(IconMenu, {
+      name: "IconMenu"
+    }), /*#__PURE__*/_jsx(IconInbox, {
+      name: "IconInbox"
+    }), /*#__PURE__*/_jsx(IconSettings, {
+      name: "IconSettings"
+    }), /*#__PURE__*/_jsx(IconHistory, {
+      name: "IconHistory"
+    }), /*#__PURE__*/_jsx(IconRefresh, {
+      name: "IconRefresh"
+    }), /*#__PURE__*/_jsx(IconBookmarkFilled, {
+      name: "IconBookmarkFilled"
+    }), /*#__PURE__*/_jsx(IconComment, {
+      name: "IconComment"
+    }), /*#__PURE__*/_jsx(IconImportantComment, {
+      name: "IconImportantComment"
+    }), /*#__PURE__*/_jsx(IconBack, {
+      name: "IconBack"
+    }), /*#__PURE__*/_jsx(IconRedo, {
+      name: "IconRedo"
+    }), /*#__PURE__*/_jsx(IconSave, {
+      name: "IconSave"
+    }), /*#__PURE__*/_jsx(IconArchives, {
+      name: "IconArchives"
+    }), /*#__PURE__*/_jsx(IconSend, {
+      name: "IconSend"
+    }), /*#__PURE__*/_jsx(IconDraft, {
+      name: "IconDraft"
+    }), /*#__PURE__*/_jsx(IconMail, {
+      name: "IconMail"
+    }), /*#__PURE__*/_jsx(IconVote, {
+      name: "IconVote"
+    }), /*#__PURE__*/_jsx(IconWarning, {
+      name: "IconWarning"
+    }), /*#__PURE__*/_jsx(IconWarningBell, {
+      name: "IconWarningBell"
+    }), /*#__PURE__*/_jsx(IconExternalLink, {
+      name: "IconExternalLink"
+    }), /*#__PURE__*/_jsx(IconPhone, {
+      name: "IconPhone"
+    }), /*#__PURE__*/_jsx(IconPlusAlt, {
+      name: "IconPlusAlt"
+    }), /*#__PURE__*/_jsx(IconBellOutline, {
+      name: "IconBellOutline"
+    }), /*#__PURE__*/_jsx(IconFilterList, {
+      name: "IconFilterList"
+    }), /*#__PURE__*/_jsx(IconSort, {
+      name: "IconSort"
+    }), /*#__PURE__*/_jsx(IconEarth, {
+      name: "IconEarth"
+    }), /*#__PURE__*/_jsx(IconUndo, {
+      name: "IconUndo"
+    }), /*#__PURE__*/_jsx(IconCalendar, {
+      name: "IconCalendar"
+    }), /*#__PURE__*/_jsx(IconBlock, {
+      name: "IconBlock"
+    }), /*#__PURE__*/_jsx(IconInfoOutline, {
+      name: "IconInfoOutline"
+    }), /*#__PURE__*/_jsx(IconInfoFilled, {
+      name: "IconInfoFilled"
+    }), /*#__PURE__*/_jsx(IconDelete, {
+      name: "IconDelete"
+    }), /*#__PURE__*/_jsx(IconDoor, {
+      name: "IconDoor"
+    }), /*#__PURE__*/_jsx(IconLabel, {
+      name: "IconLabel"
+    }), /*#__PURE__*/_jsx(IconSliders, {
+      name: "IconSliders"
+    }), /*#__PURE__*/_jsx(IconPinned, {
+      name: "IconPinned"
+    }), /*#__PURE__*/_jsx(IconCases, {
+      name: "IconCases"
+    }), /*#__PURE__*/_jsx(IconImage, {
+      name: "IconImage"
+    }), /*#__PURE__*/_jsx(IconCamera, {
+      name: "IconCamera"
+    })]
   }),
   name: 'Standard'
 };
 export const User = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconUser, {}), /*#__PURE__*/_jsx(IconUserThin, {}), /*#__PURE__*/_jsx(IconLock, {}), /*#__PURE__*/_jsx(IconBoard, {}), /*#__PURE__*/_jsx(IconHumans, {}), /*#__PURE__*/_jsx(IconFamily, {}), /*#__PURE__*/_jsx(IconPortalUser, {})]
+    children: [/*#__PURE__*/_jsx(IconUser, {
+      name: "IconUser"
+    }), /*#__PURE__*/_jsx(IconUserThin, {
+      name: "IconUserThin"
+    }), /*#__PURE__*/_jsx(IconLock, {
+      name: "IconLock"
+    }), /*#__PURE__*/_jsx(IconBoard, {
+      name: "IconBoard"
+    }), /*#__PURE__*/_jsx(IconHumans, {
+      name: "IconHumans"
+    }), /*#__PURE__*/_jsx(IconFamily, {
+      name: "IconFamily"
+    }), /*#__PURE__*/_jsx(IconPortalUser, {
+      name: "IconPortalUser"
+    })]
   }),
   name: 'User'
 };
 export const Navigation = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconCaretUp, {}), /*#__PURE__*/_jsx(IconCaretDown, {}), /*#__PURE__*/_jsx(IconCaretRight, {}), /*#__PURE__*/_jsx(IconCaretLeft, {}), /*#__PURE__*/_jsx(IconArrowUp, {}), /*#__PURE__*/_jsx(IconArrowDown, {}), /*#__PURE__*/_jsx(IconArrowRight, {}), /*#__PURE__*/_jsx(IconArrowLeft, {}), /*#__PURE__*/_jsx(IconChevronLeft, {}), /*#__PURE__*/_jsx(IconChevronRight, {}), /*#__PURE__*/_jsx(IconChevronDown, {})]
+    children: [/*#__PURE__*/_jsx(IconCaretUp, {
+      name: "IconCaretUp"
+    }), /*#__PURE__*/_jsx(IconCaretDown, {
+      name: "IconCaretDown"
+    }), /*#__PURE__*/_jsx(IconCaretRight, {
+      name: "IconCaretRight"
+    }), /*#__PURE__*/_jsx(IconCaretLeft, {
+      name: "IconCaretLeft"
+    }), /*#__PURE__*/_jsx(IconArrowUp, {
+      name: "IconArrowUp"
+    }), /*#__PURE__*/_jsx(IconArrowDown, {
+      name: "IconArrowDown"
+    }), /*#__PURE__*/_jsx(IconArrowRight, {
+      name: "IconArrowRight"
+    }), /*#__PURE__*/_jsx(IconArrowLeft, {
+      name: "IconArrowLeft"
+    }), /*#__PURE__*/_jsx(IconChevronLeft, {
+      name: "IconChevronLeft"
+    }), /*#__PURE__*/_jsx(IconChevronRight, {
+      name: "IconChevronRight"
+    }), /*#__PURE__*/_jsx(IconChevronDown, {
+      name: "IconChevronDown"
+    })]
   }),
   name: 'Navigation'
 };
 export const Files = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconFile, {}), /*#__PURE__*/_jsx(IconFileEdit, {}), /*#__PURE__*/_jsx(IconFileAdd, {}), /*#__PURE__*/_jsx(IconFileExcel, {}), /*#__PURE__*/_jsx(IconFilePDF, {}), /*#__PURE__*/_jsx(IconFileWord, {}), /*#__PURE__*/_jsx(IconArchives, {}), /*#__PURE__*/_jsx(IconReciept, {}), /*#__PURE__*/_jsx(IconFileCopy, {}), /*#__PURE__*/_jsx(IconPrint, {})]
+    children: [/*#__PURE__*/_jsx(IconFile, {
+      name: "IconFile"
+    }), /*#__PURE__*/_jsx(IconFileEdit, {
+      name: "IconFileEdit"
+    }), /*#__PURE__*/_jsx(IconFileAdd, {
+      name: "<IconFileAdd"
+    }), /*#__PURE__*/_jsx(IconFileExcel, {
+      name: "IconFileExcel"
+    }), /*#__PURE__*/_jsx(IconFilePDF, {
+      name: "IconFilePDF"
+    }), /*#__PURE__*/_jsx(IconFileWord, {
+      name: "IconFileWord"
+    }), /*#__PURE__*/_jsx(IconArchives, {
+      name: "IconArchives"
+    }), /*#__PURE__*/_jsx(IconReciept, {
+      name: "IconReciept"
+    }), /*#__PURE__*/_jsx(IconFileCopy, {
+      name: "IconFileCopy"
+    }), /*#__PURE__*/_jsx(IconPrint, {
+      name: "IconPrint"
+    })]
   }),
   name: 'Files'
 };
 export const Handling = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconFillOut, {}), /*#__PURE__*/_jsx(IconDownload, {}), /*#__PURE__*/_jsx(IconUpload, {}), /*#__PURE__*/_jsx(IconSign, {}), /*#__PURE__*/_jsx(IconEye, {}), /*#__PURE__*/_jsx(IconEyeDeny, {}), /*#__PURE__*/_jsx(IconAttachment, {}), /*#__PURE__*/_jsx(IconSwitch, {}), /*#__PURE__*/_jsx(IconEdit, {}), /*#__PURE__*/_jsx(IconChoice, {}), /*#__PURE__*/_jsx(IconReply, {}), /*#__PURE__*/_jsx(IconReplyAll, {}), /*#__PURE__*/_jsx(IconForward, {}), /*#__PURE__*/_jsx(IconRearrange, {})]
+    children: [/*#__PURE__*/_jsx(IconFillOut, {
+      name: "IconFillOut"
+    }), /*#__PURE__*/_jsx(IconDownload, {
+      name: "IconDownload"
+    }), /*#__PURE__*/_jsx(IconUpload, {
+      name: "IconUpload"
+    }), /*#__PURE__*/_jsx(IconSign, {
+      name: "IconSign"
+    }), /*#__PURE__*/_jsx(IconEye, {
+      name: "IconEye"
+    }), /*#__PURE__*/_jsx(IconEyeDeny, {
+      name: "IconEyeDeny"
+    }), /*#__PURE__*/_jsx(IconAttachment, {
+      name: "IconAttachment"
+    }), /*#__PURE__*/_jsx(IconSwitch, {
+      name: "IconSwitch"
+    }), /*#__PURE__*/_jsx(IconEdit, {
+      name: "IconEdit"
+    }), /*#__PURE__*/_jsx(IconChoice, {
+      name: "IconChoice"
+    }), /*#__PURE__*/_jsx(IconReply, {
+      name: "IconReply"
+    }), /*#__PURE__*/_jsx(IconReplyAll, {
+      name: "IconReplyAll"
+    }), /*#__PURE__*/_jsx(IconForward, {
+      name: "IconForward"
+    }), /*#__PURE__*/_jsx(IconRearrange, {
+      name: "IconRearrange"
+    })]
   }),
   name: 'Handling'
 };
 export const Buildings = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconApartment, {}), /*#__PURE__*/_jsx(IconHouse, {}), /*#__PURE__*/_jsx(IconStore, {}), /*#__PURE__*/_jsx(IconTypeOfBuilding, {}), /*#__PURE__*/_jsx(IconGarage, {}), /*#__PURE__*/_jsx(IconCompanyBuilding, {}), /*#__PURE__*/_jsx(IconCompanyBuildingOutline, {}), /*#__PURE__*/_jsx(IconCompanyBuildingFilled, {})]
+    children: [/*#__PURE__*/_jsx(IconApartment, {
+      name: "IconApartment"
+    }), /*#__PURE__*/_jsx(IconHouse, {
+      name: "IconHouse"
+    }), /*#__PURE__*/_jsx(IconStore, {
+      name: "IconStore"
+    }), /*#__PURE__*/_jsx(IconTypeOfBuilding, {
+      name: "IconTypeOfBuilding"
+    }), /*#__PURE__*/_jsx(IconGarage, {
+      name: "IconGarage"
+    }), /*#__PURE__*/_jsx(IconCompanyBuilding, {
+      name: "IconCompanyBuilding"
+    }), /*#__PURE__*/_jsx(IconCompanyBuildingOutline, {
+      name: "IconCompanyBuildingOutline"
+    }), /*#__PURE__*/_jsx(IconCompanyBuildingFilled, {
+      name: "IconCompanyBuildingFilled"
+    })]
   }),
   name: 'Buildings'
 };
 export const Housing = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconArea, {}), /*#__PURE__*/_jsx(IconRoom, {}), /*#__PURE__*/_jsx(IconFloor, {}), /*#__PURE__*/_jsx(IconBath, {}), /*#__PURE__*/_jsx(IconKey, {}), /*#__PURE__*/_jsx(IconMap, {}), /*#__PURE__*/_jsx(IconKitchen, {}), /*#__PURE__*/_jsx(IconElevator, {}), /*#__PURE__*/_jsx(IconParking, {}), /*#__PURE__*/_jsx(IconGym, {}), /*#__PURE__*/_jsx(IconLeisureTime, {}), /*#__PURE__*/_jsx(IconShopping, {}), /*#__PURE__*/_jsx(IconZip, {})]
+    children: [/*#__PURE__*/_jsx(IconArea, {
+      name: "IconArea"
+    }), /*#__PURE__*/_jsx(IconRoom, {
+      name: "IconRoom"
+    }), /*#__PURE__*/_jsx(IconFloor, {
+      name: "IconFloor"
+    }), /*#__PURE__*/_jsx(IconBath, {
+      name: "IconBath"
+    }), /*#__PURE__*/_jsx(IconKey, {
+      name: "IconKey"
+    }), /*#__PURE__*/_jsx(IconMap, {
+      name: "IconMap"
+    }), /*#__PURE__*/_jsx(IconKitchen, {
+      name: "IconKitchen"
+    }), /*#__PURE__*/_jsx(IconElevator, {
+      name: "IconElevator"
+    }), /*#__PURE__*/_jsx(IconParking, {
+      name: "IconParking"
+    }), /*#__PURE__*/_jsx(IconGym, {
+      name: "IconGym"
+    }), /*#__PURE__*/_jsx(IconLeisureTime, {
+      name: "IconLeisureTime"
+    }), /*#__PURE__*/_jsx(IconShopping, {
+      name: "IconShopping"
+    }), /*#__PURE__*/_jsx(IconZip, {
+      name: "IconZip"
+    })]
   }),
   name: 'Housing'
 };
 export const Transportation = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconTransport, {}), /*#__PURE__*/_jsx(IconBus, {}), /*#__PURE__*/_jsx(IconTram, {}), /*#__PURE__*/_jsx(IconTrain, {}), /*#__PURE__*/_jsx(IconSubway, {}), /*#__PURE__*/_jsx(IconWalk, {}), /*#__PURE__*/_jsx(IconCar, {}), /*#__PURE__*/_jsx(IconFerry, {})]
+    children: [/*#__PURE__*/_jsx(IconTransport, {
+      name: "IconTransport"
+    }), /*#__PURE__*/_jsx(IconBus, {
+      name: "IconBus"
+    }), /*#__PURE__*/_jsx(IconTram, {
+      name: "IconTram"
+    }), /*#__PURE__*/_jsx(IconTrain, {
+      name: "IconTrain"
+    }), /*#__PURE__*/_jsx(IconSubway, {
+      name: "IconSubway"
+    }), /*#__PURE__*/_jsx(IconWalk, {
+      name: "IconWalk"
+    }), /*#__PURE__*/_jsx(IconCar, {
+      name: "IconCar"
+    }), /*#__PURE__*/_jsx(IconFerry, {
+      name: "IconFerry"
+    })]
   }),
   name: 'Transportation'
 };
 export const Toggles = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconHearth, {}), /*#__PURE__*/_jsx(IconHearthOutline, {}), /*#__PURE__*/_jsx(IconStarFilled, {}), /*#__PURE__*/_jsx(IconStarHalf, {}), /*#__PURE__*/_jsx(IconStarOutline, {}), /*#__PURE__*/_jsx(IconCheckedFilled, {}), /*#__PURE__*/_jsx(IconCheckedOutline, {}), /*#__PURE__*/_jsx(IconErrorFilled, {}), /*#__PURE__*/_jsx(IconErrorOutline, {}), /*#__PURE__*/_jsx(IconDotFilled, {}), /*#__PURE__*/_jsx(IconDotOutline, {}), /*#__PURE__*/_jsx(IconLockLocked, {}), /*#__PURE__*/_jsx(IconLockOpen, {}), /*#__PURE__*/_jsx(IconBookmarkFilled, {}), /*#__PURE__*/_jsx(IconBookmarkOutline, {}), /*#__PURE__*/_jsx(IconDashboard, {}), /*#__PURE__*/_jsx(IconDashboardFilled, {}), /*#__PURE__*/_jsx(IconCommunication, {}), /*#__PURE__*/_jsx(IconCommunicationFilled, {}), /*#__PURE__*/_jsx(IconEconomy, {}), /*#__PURE__*/_jsx(IconEconomyFilled, {}), /*#__PURE__*/_jsx(IconWork, {}), /*#__PURE__*/_jsx(IconWorkFilled, {}), /*#__PURE__*/_jsx(IconProfile, {}), /*#__PURE__*/_jsx(IconProfileFilled, {}), /*#__PURE__*/_jsx(IconLookup, {}), /*#__PURE__*/_jsx(IconLookupFilled, {}), /*#__PURE__*/_jsx(IconDocument, {}), /*#__PURE__*/_jsx(IconDocumentFilled, {}), /*#__PURE__*/_jsx(IconMembership, {}), /*#__PURE__*/_jsx(IconMembershipFilled, {}), /*#__PURE__*/_jsx(IconHouse, {}), /*#__PURE__*/_jsx(IconHouseOutline, {}), /*#__PURE__*/_jsx(IconMinusAltFilled, {}), /*#__PURE__*/_jsx(IconMinusAlt, {}), /*#__PURE__*/_jsx(IconTypeOfBuilding, {}), /*#__PURE__*/_jsx(IconTypeOfBuildingOutline, {}), /*#__PURE__*/_jsx(IconFullscreenClose, {}), /*#__PURE__*/_jsx(IconFullscreenOpen, {}), /*#__PURE__*/_jsx(IconLeafFilled, {}), /*#__PURE__*/_jsx(IconLeafOutline, {}), /*#__PURE__*/_jsx(IconHomeFilled, {}), /*#__PURE__*/_jsx(IconHomeOutline, {}), /*#__PURE__*/_jsx(IconHouseBlockFilled, {}), /*#__PURE__*/_jsx(IconHouseBlockOutline, {}), /*#__PURE__*/_jsx(IconAuditorFilled, {}), /*#__PURE__*/_jsx(IconAuditorOutline, {}), /*#__PURE__*/_jsx(IconJanitorFilled, {}), /*#__PURE__*/_jsx(IconJanitorOutline, {})]
+    children: [/*#__PURE__*/_jsx(IconHearth, {
+      name: "IconHearth"
+    }), /*#__PURE__*/_jsx(IconHearthOutline, {
+      name: "IconHearthOutline"
+    }), /*#__PURE__*/_jsx(IconStarFilled, {
+      name: "IconStarFilled"
+    }), /*#__PURE__*/_jsx(IconStarHalf, {
+      name: "IconStarHalf"
+    }), /*#__PURE__*/_jsx(IconStarOutline, {
+      name: "IconStarOutline"
+    }), /*#__PURE__*/_jsx(IconCheckedFilled, {
+      name: "IconCheckedFilled"
+    }), /*#__PURE__*/_jsx(IconCheckedOutline, {
+      name: "IconCheckedOutline"
+    }), /*#__PURE__*/_jsx(IconErrorFilled, {
+      name: "IconErrorFilled"
+    }), /*#__PURE__*/_jsx(IconErrorOutline, {
+      name: "IconErrorOutline"
+    }), /*#__PURE__*/_jsx(IconDotFilled, {
+      name: "IconDotFilled"
+    }), /*#__PURE__*/_jsx(IconDotOutline, {
+      name: "IconDotOutline"
+    }), /*#__PURE__*/_jsx(IconLockLocked, {
+      name: "IconLockLocked"
+    }), /*#__PURE__*/_jsx(IconLockOpen, {
+      name: "IconLockOpen"
+    }), /*#__PURE__*/_jsx(IconBookmarkFilled, {
+      name: "IconBookmarkFilled"
+    }), /*#__PURE__*/_jsx(IconBookmarkOutline, {
+      name: "IconBookmarkOutline"
+    }), /*#__PURE__*/_jsx(IconDashboard, {
+      name: "IconDashboard"
+    }), /*#__PURE__*/_jsx(IconDashboardFilled, {
+      name: "IconDashboardFilled"
+    }), /*#__PURE__*/_jsx(IconCommunication, {
+      name: "IconCommunication"
+    }), /*#__PURE__*/_jsx(IconCommunicationFilled, {
+      name: "IconCommunicationFilled"
+    }), /*#__PURE__*/_jsx(IconEconomy, {
+      name: "IconEconomy"
+    }), /*#__PURE__*/_jsx(IconEconomyFilled, {
+      name: "IconEconomyFilled"
+    }), /*#__PURE__*/_jsx(IconWork, {
+      name: "IconWork"
+    }), /*#__PURE__*/_jsx(IconWorkFilled, {
+      name: "IconWorkFilled"
+    }), /*#__PURE__*/_jsx(IconProfile, {
+      name: "IconProfile"
+    }), /*#__PURE__*/_jsx(IconProfileFilled, {
+      name: "IconProfileFilled"
+    }), /*#__PURE__*/_jsx(IconLookup, {
+      name: "IconLookup"
+    }), /*#__PURE__*/_jsx(IconLookupFilled, {
+      name: "IconLookupFilled"
+    }), /*#__PURE__*/_jsx(IconDocument, {
+      name: "IconDocument"
+    }), /*#__PURE__*/_jsx(IconDocumentFilled, {
+      name: "IconDocumentFilled"
+    }), /*#__PURE__*/_jsx(IconMembership, {
+      name: "IconMembership"
+    }), /*#__PURE__*/_jsx(IconMembershipFilled, {
+      name: "IconMembershipFilled"
+    }), /*#__PURE__*/_jsx(IconHouse, {
+      name: "IconHouse"
+    }), /*#__PURE__*/_jsx(IconHouseOutline, {
+      name: "IconHouseOutline"
+    }), /*#__PURE__*/_jsx(IconMinusAltFilled, {
+      name: "IconMinusAltFilled"
+    }), /*#__PURE__*/_jsx(IconMinusAlt, {
+      name: "IconMinusAlt"
+    }), /*#__PURE__*/_jsx(IconTypeOfBuilding, {
+      name: "IconTypeOfBuilding"
+    }), /*#__PURE__*/_jsx(IconTypeOfBuildingOutline, {
+      name: "IconTypeOfBuildingOutline"
+    }), /*#__PURE__*/_jsx(IconFullscreenClose, {
+      name: "IconFullscreenClose"
+    }), /*#__PURE__*/_jsx(IconFullscreenOpen, {
+      name: "IconFullscreenOpen"
+    }), /*#__PURE__*/_jsx(IconLeafFilled, {
+      name: "IconLeafFilled"
+    }), /*#__PURE__*/_jsx(IconLeafOutline, {
+      name: "IconLeafOutline"
+    }), /*#__PURE__*/_jsx(IconHomeFilled, {
+      name: "IconHomeFilled"
+    }), /*#__PURE__*/_jsx(IconHomeOutline, {
+      name: "IconHomeOutline"
+    }), /*#__PURE__*/_jsx(IconHouseBlockFilled, {
+      name: "IconHouseBlockFilled"
+    }), /*#__PURE__*/_jsx(IconHouseBlockOutline, {
+      name: "IconHouseBlockOutline"
+    }), /*#__PURE__*/_jsx(IconAuditorFilled, {
+      name: "IconAuditorFilled"
+    }), /*#__PURE__*/_jsx(IconAuditorOutline, {
+      name: "IconAuditorOutline"
+    }), /*#__PURE__*/_jsx(IconJanitorFilled, {
+      name: "IconJanitorFilled"
+    }), /*#__PURE__*/_jsx(IconJanitorOutline, {
+      name: "IconJanitorOutline"
+    })]
   }),
   name: 'Transportation'
 };
 export const Values = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
-    children: [/*#__PURE__*/_jsx(IconMoney, {}), /*#__PURE__*/_jsx(IconJointcost, {}), /*#__PURE__*/_jsx(IconJointcost2, {}), /*#__PURE__*/_jsx(IconPaymentCard, {})]
+    children: [/*#__PURE__*/_jsx(IconMoney, {
+      name: "IconMoney"
+    }), /*#__PURE__*/_jsx(IconJointcost, {
+      name: "IconJointcost"
+    }), /*#__PURE__*/_jsx(IconJointcost2, {
+      name: "IconJointcost2"
+    }), /*#__PURE__*/_jsx(IconPaymentCard, {
+      name: "IconPaymentCard"
+    })]
   }),
   name: 'Values'
 };
 export const Logos = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
     children: [/*#__PURE__*/_jsx(IconVisa, {
+      name: "IconVisa",
       size: "50px"
     }), /*#__PURE__*/_jsx(IconMasterCard, {
+      name: "IconMasterCard",
       size: "50px"
     }), /*#__PURE__*/_jsx(IconBankAxept, {
+      name: "IconBankAxept",
       size: "50px"
     }), /*#__PURE__*/_jsx(IconAmericanExpress, {
+      name: "IconAmericanExpress",
       size: "50px"
     }), /*#__PURE__*/_jsx(IconOffice365, {
+      name: "IconOffice365",
       size: "50px"
     }), /*#__PURE__*/_jsx(IconGmail, {})]
   }),
@@ -270,10 +615,13 @@ export const Logos = {
 export const Insurance = {
   render: () => /*#__PURE__*/_jsxs(SbIconGrid, {
     children: [/*#__PURE__*/_jsx(IconBblFlame, {
+      name: "IconBblFlame",
       size: "60px"
     }), /*#__PURE__*/_jsx(IconBblWater, {
+      name: "IconBblWater",
       size: "60px"
     }), /*#__PURE__*/_jsx(IconBblShield, {
+      name: "IconBblShield",
       size: "60px"
     })]
   }),

package/lib/icons/withIcon.d.ts

@@ -18,6 +18,8 @@ export declare type WithIconWrapperProps = {
     primary?: boolean;
     /** Default secondary color */
     secondary?: boolean;
+    /** For title in story */
+    name?: string;
 };
 export declare type Props = {
     focusable: SVGAttributes<unknown>['focusable'];

package/lib/icons/withIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withIcon.d.ts","sourceRoot":"","sources":["../../src/packages/icons/withIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAI5C,oBAAY,oBAAoB,GAAG;IACjC,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,qGAAqG;IACrG,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,0CAA0C;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,wBAAwB;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,4BAA4B;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,KAAK,CAAC,aAAa,CAAA;CAC3B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,IAAI,EAAE,MAAM,sBAEvB,MAAM,aAAa,CAAC,KAAK,CAAC,KAC3C,MAAM,aAAa,CAAC,oBAAoB,CAAC,CA0D7C"}
+{"version":3,"file":"withIcon.d.ts","sourceRoot":"","sources":["../../src/packages/icons/withIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAI5C,oBAAY,oBAAoB,GAAG;IACjC,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,qGAAqG;IACrG,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,0CAA0C;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,wBAAwB;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,4BAA4B;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,yBAAyB;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,KAAK,CAAC,aAAa,CAAA;CAC3B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,IAAI,EAAE,MAAM,sBAEvB,MAAM,aAAa,CAAC,KAAK,CAAC,KAC3C,MAAM,aAAa,CAAC,oBAAoB,CAAC,CAyD7C"}

package/lib/shared/components/SbIconGrid/index.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 interface IProps {
     children: any[];
 }

package/lib/shared/components/SbIconGrid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/components/SbIconGrid/index.tsx"],"names":[],"mappings":";AAaA,UAAU,MAAM;IACd,QAAQ,EAAE,GAAG,EAAE,CAAA;CAChB;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAQhC,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/components/SbIconGrid/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAazB,UAAU,MAAM;IACd,QAAQ,EAAE,GAAG,EAAE,CAAA;CAChB;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAQhC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/lib/shared/components/SbIconGrid/index.js

@@ -1,5 +1,6 @@
 import _styled from "@emotion/styled/base";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+import React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 const Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "e4tbyf10"
@@ -12,14 +13,14 @@ const Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
 } : {
   name: "9jww75",
   styles: "display:grid;grid-auto-flow:row;grid-column-gap:10px;grid-template-columns:repeat(13, 1fr);grid-row-gap:10px;margin-top:10px;margin-bottom:40px;max-width:500px",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvY29tcG9uZW50cy9TYkljb25HcmlkL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFMEIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9jb21wb25lbnRzL1NiSWNvbkdyaWQvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBncmlkO1xuICBncmlkLWF1dG8tZmxvdzogcm93O1xuICBncmlkLWNvbHVtbi1nYXA6IDEwcHg7XG4gIGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KDEzLCAxZnIpO1xuICBncmlkLXJvdy1nYXA6IDEwcHg7XG4gIG1hcmdpbi10b3A6IDEwcHg7XG4gIG1hcmdpbi1ib3R0b206IDQwcHg7XG4gIG1heC13aWR0aDogNTAwcHg7XG5gXG5cbmludGVyZmFjZSBJUHJvcHMge1xuICBjaGlsZHJlbjogYW55W11cbn1cblxuY29uc3QgU2JJY29uR3JpZDogUmVhY3QuRkM8SVByb3BzPiA9ICh7IGNoaWxkcmVuIH0pID0+IChcbiAgPFdyYXBwZXI+XG4gICAge2NoaWxkcmVuLm1hcCgoaXRlbSwga2V5KSA9PiAoXG4gICAgICA8c3BhbiBrZXk9e2tleX0gdGl0bGU9e2l0ZW0/LnByb3BzPy5tZHhUeXBlIHx8ICcnfT5cbiAgICAgICAge2l0ZW19XG4gICAgICA8L3NwYW4+XG4gICAgKSl9XG4gIDwvV3JhcHBlcj5cbilcblxuZXhwb3J0IGRlZmF1bHQgU2JJY29uR3JpZFxuIl19 */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvY29tcG9uZW50cy9TYkljb25HcmlkL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFHMEIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9jb21wb25lbnRzL1NiSWNvbkdyaWQvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5cbmNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBncmlkO1xuICBncmlkLWF1dG8tZmxvdzogcm93O1xuICBncmlkLWNvbHVtbi1nYXA6IDEwcHg7XG4gIGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KDEzLCAxZnIpO1xuICBncmlkLXJvdy1nYXA6IDEwcHg7XG4gIG1hcmdpbi10b3A6IDEwcHg7XG4gIG1hcmdpbi1ib3R0b206IDQwcHg7XG4gIG1heC13aWR0aDogNTAwcHg7XG5gXG5cbmludGVyZmFjZSBJUHJvcHMge1xuICBjaGlsZHJlbjogYW55W11cbn1cblxuY29uc3QgU2JJY29uR3JpZDogUmVhY3QuRkM8SVByb3BzPiA9ICh7IGNoaWxkcmVuIH0pID0+IChcbiAgPFdyYXBwZXI+XG4gICAge2NoaWxkcmVuLm1hcCgoaXRlbSwga2V5KSA9PiAoXG4gICAgICA8c3BhbiBrZXk9e2tleX0gdGl0bGU9e2l0ZW0/LnByb3BzPy5uYW1lIHx8ICcnfT5cbiAgICAgICAge2l0ZW19XG4gICAgICA8L3NwYW4+XG4gICAgKSl9XG4gIDwvV3JhcHBlcj5cbilcblxuZXhwb3J0IGRlZmF1bHQgU2JJY29uR3JpZFxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const SbIconGrid = ({
   children
 }) => /*#__PURE__*/_jsx(Wrapper, {
   children: children.map((item, key) => /*#__PURE__*/_jsx("span", {
-    title: item?.props?.mdxType || '',
+    title: item?.props?.name || '',
     children: item
   }, key))
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "4.0.0-beta.5",
+  "version": "4.0.0-beta.6",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",