Merge pull request #823 from Orfium/feat/new-icons

feat(icon): adding new search filled and keyword icons

src/__storyshots__/Updated Components/Icon-Collection.snap

@@ -1946,6 +1946,36 @@
               issue
             </span>
           </div>
+          <div
+            style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex-basis: 16.6%;"
+          >
+            <div
+              style="display: flex; gap: 8px; justify-content: center; align-items: center;"
+            >
+              <div
+                class="emotion-6"
+              >
+                <svg
+                  class="emotion-7"
+                  fill="none"
+                  viewBox="0 0 20 20"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M12.7779 2.5C15.3854 2.5 17.5 4.6369 17.5 7.27569C17.5 9.91273 15.3854 12.0514 12.7779 12.0514C12.3941 12.0514 12.0241 11.9993 11.6678 11.9124C11.2398 12.3453 10.6564 12.5889 10.0477 12.5889H8.57092V14.0444C8.57092 14.5967 8.1232 15.0444 7.57092 15.0444H6.14289V16.5C6.14289 17.0523 5.69518 17.5 5.14289 17.5H3.5C2.94772 17.5 2.5 17.0523 2.5 16.5V14.6383C2.5 14.1119 2.70755 13.6067 3.07762 13.2323L8.13305 8.11794C8.08497 7.84443 8.05578 7.56396 8.05578 7.27569C8.05578 4.6369 10.1696 2.5 12.7779 2.5ZM14.0134 4.5822C13.3025 4.5822 12.7255 5.16483 12.7255 5.88466C12.7255 6.60362 13.3025 7.18712 14.0134 7.18712C14.7251 7.18712 15.3012 6.60362 15.3012 5.88466C15.3012 5.16483 14.7251 4.5822 14.0134 4.5822Z"
+                    fill="#52567A"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </div>
+            </div>
+            <span
+              class="emotion-15"
+            >
+              keyword
+            </span>
+          </div>
           <div
             style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex-basis: 16.6%;"
           >
@@ -2030,6 +2060,36 @@
               report
             </span>
           </div>
+          <div
+            style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex-basis: 16.6%;"
+          >
+            <div
+              style="display: flex; gap: 8px; justify-content: center; align-items: center;"
+            >
+              <div
+                class="emotion-6"
+              >
+                <svg
+                  class="emotion-7"
+                  fill="none"
+                  viewBox="0 0 20 20"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M16.3195 14.9061C17.3728 13.5514 18 11.8489 18 10C18 5.58172 14.4183 2 10 2C5.58172 2 2 5.58172 2 10C2 14.4183 5.58172 18 10 18C11.849 18 13.5515 17.3727 14.9063 16.3194L11.8452 13.2583C10.3123 14.1637 8.30481 13.9579 6.98773 12.6409C5.42674 11.0799 5.42674 8.54902 6.98773 6.98804C8.54872 5.42705 11.0796 5.42705 12.6406 6.98804C13.9575 8.30495 14.1634 10.3122 13.2583 11.8449L16.3195 14.9061ZM11.2274 11.2274C12.0079 10.4469 12.0079 9.18152 11.2274 8.40103C10.4469 7.62053 9.18145 7.62053 8.40095 8.40103C7.62046 9.18152 7.62046 10.4469 8.40095 11.2274C9.18145 12.0079 10.4469 12.0079 11.2274 11.2274Z"
+                    fill="#52567A"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </div>
+            </div>
+            <span
+              class="emotion-15"
+            >
+              searchFilled
+            </span>
+          </div>
           <div
             style="display: flex; flex-direction: column; align-items: center; gap: 8px; flex-basis: 16.6%;"
           >

src/components/Icon/Icon.types.ts

@@ -56,6 +56,7 @@ export type GenericIcons =
   | 'file'
   | 'filter'
   | 'issue'
+  | 'keyword'
   | 'language'
   | 'legal'
   | 'location'
@@ -65,6 +66,7 @@ export type GenericIcons =
   | 'notification'
   | 'policy'
   | 'report'
+  | 'searchFilled'
   | 'settings'
   | 'tag';
 

src/components/Icon/assets/iconSelector.ts

@@ -53,6 +53,7 @@ import ExternalLink from './generic/externalLink.svg?react';
 import File from './generic/file.svg?react';
 import Filter from './generic/filter.svg?react';
 import Issue from './generic/issue.svg?react';
+import Keyword from './generic/keyword.svg?react';
 import Language from './generic/language.svg?react';
 import Legal from './generic/legal.svg?react';
 import Location from './generic/location.svg?react';
@@ -62,6 +63,7 @@ import MoreOptions from './generic/moreOptions.svg?react';
 import Notification from './generic/notification.svg?react';
 import Policy from './generic/policy.svg?react';
 import Report from './generic/report.svg?react';
+import SearchFilled from './generic/search filled.svg?react';
 import Settings from './generic/settings.svg?react';
 import Tag from './generic/tag.svg?react';
 /** Music Business */
@@ -206,6 +208,7 @@ const iconSelector: { [key in AcceptedIconNames]: React.FunctionComponent } = {
   file: File,
   filter: Filter,
   issue: Issue,
+  keyword: Keyword,
   language: Language,
   legal: Legal,
   location: Location,
@@ -215,6 +218,7 @@ const iconSelector: { [key in AcceptedIconNames]: React.FunctionComponent } = {
   notification: Notification,
   policy: Policy,
   report: Report,
+  searchFilled: SearchFilled,
   settings: Settings,
   tag: Tag,
   /** Music Business */

src/components/Icon/constants.ts

@@ -93,10 +93,12 @@ export const iconsSet: IconSet = {
       'delivery',
       'file',
       'issue',
+      'keyword',
       'policy',
       'legal',
       'report',
-      'tag'
+      'searchFilled',
+      'tag',
     ],
   },
   basicActions: {