Docs: New and updated component svgs (#3108)

pinterest · Jul 27, 2023 · 19fc323 · 19fc323
1 parent 71c6c87
commit 19fc323
Show file tree

Hide file tree

Showing 9 changed files with 232 additions and 10 deletions.
diff --git a/docs/docs-components/data/components.js b/docs/docs-components/data/components.js
@@ -8,7 +8,6 @@ import Layer from '../../graphics/building-blocks/Layer.svg';
 import Letterbox from '../../graphics/building-blocks/Letterbox.svg';
 import Mask from '../../graphics/building-blocks/Mask.svg';
 import Pog from '../../graphics/building-blocks/Pog.svg';
-import Popover from '../../graphics/building-blocks/Popover.svg';
 import ScrollBoundaryContainer from '../../graphics/building-blocks/ScrollBoundaryContainer.svg';
 import SheetMobile from '../../graphics/building-blocks/SheetMobile.svg';
 import Sticky from '../../graphics/building-blocks/Sticky.svg';
@@ -22,6 +21,7 @@ import Button from '../../graphics/general/Button.svg';
 import ButtonGroup from '../../graphics/general/ButtonGroup.svg';
 import ButtonLink from '../../graphics/general/ButtonLink.svg';
 import Callout from '../../graphics/general/Callout.svg';
+import Card from '../../graphics/general/Card.svg';
 import Checkbox from '../../graphics/general/Checkbox.svg';
 import Collage from '../../graphics/general/Collage.svg';
 import ComboBox from '../../graphics/general/ComboBox.svg';
@@ -47,6 +47,8 @@ import Module from '../../graphics/general/Module.svg';
 import NumberField from '../../graphics/general/NumberField.svg';
 import OverlayPanel from '../../graphics/general/OverlayPanel.svg';
 import PageHeader from '../../graphics/general/PageHeader.svg';
+import Popover from '../../graphics/general/Popover.svg';
+import PopoverEducational from '../../graphics/general/PopoverEducational.svg';
 import Pulsar from '../../graphics/general/Pulsar.svg';
 import RadioGroup from '../../graphics/general/RadioGroup.svg';
 import SearchField from '../../graphics/general/SearchField.svg';
@@ -70,10 +72,10 @@ import Tooltip from '../../graphics/general/Tooltip.svg';
 import Upsell from '../../graphics/general/Upsell.svg';
 import Video from '../../graphics/general/Video.svg';
 import WashAnimated from '../../graphics/general/WashAnimated.svg';
+import GlobalEventsHandlerProvider from '../../graphics/utilities/GlobalEventsHandlerProvider.svg';
 import HookFocusVisible from '../../graphics/utilities/hook-focus-visible.svg';
 import HookReducedMotion from '../../graphics/utilities/hook-reduced-motion.svg';
 import ProviderColorScheme from '../../graphics/utilities/provider-color-scheme.svg';
-import ProviderHandlers from '../../graphics/utilities/provider-global-events-handler.svg';
 
 const componentData: $ReadOnlyArray<ComponentData> = [
   {
@@ -471,6 +473,26 @@ const componentData: $ReadOnlyArray<ComponentData> = [
       },
     },
   },
+  {
+    id: 'Card',
+    platform: {
+      ios: {
+        name: 'Card',
+        visual: {
+          svg: <Card />,
+        },
+        path: '/ios/card/card',
+        alias: ['Entry Card', 'Module', 'Panel', 'Teaser'],
+        description:
+          'Card is a semi-modular container used to house Card.Header and a variant of the available preview blocks.',
+        category: ['Pins and imagery'],
+        status: {
+          documentation: 'ready',
+          status: 'planned',
+        },
+      },
+    },
+  },
   {
     id: 'Checkbox',
     platform: {
@@ -869,7 +891,7 @@ const componentData: $ReadOnlyArray<ComponentData> = [
       web: {
         name: 'GlobalEventsHandlerProvider',
         visual: {
-          svg: <ProviderHandlers />,
+          svg: <GlobalEventsHandlerProvider />,
         },
         alias: ['OnLinkNavigationProvider'],
         path: '/web/utilities/globaleventshandlerprovider',
@@ -1539,7 +1561,7 @@ const componentData: $ReadOnlyArray<ComponentData> = [
         alias: ['Flyout'],
         description:
           'Popover is a floating view that contains a task related to the content on screen.',
-        category: ['Building blocks'],
+        category: ['Overlays'],
         status: {
           accessible: {
             summary: 'partial',
@@ -1571,7 +1593,7 @@ const componentData: $ReadOnlyArray<ComponentData> = [
       web: {
         name: 'PopoverEducational',
         visual: {
-          svg: <Popover />,
+          svg: <PopoverEducational />,
         },
         description:
           'PopoverEducational is a floating container that introduces users to elements on the screen. Used for education or onboarding experiences.',

diff --git a/docs/graphics/building-blocks/Popover.svg b/docs/graphics/building-blocks/Popover.svg
diff --git a/docs/graphics/general/DateField.svg b/docs/graphics/general/DateField.svg
diff --git a/docs/graphics/general/DatePicker.svg b/docs/graphics/general/DatePicker.svg