playbook_ui 14.5.0.pre.alpha.PLAY1485selectablecardoverflowoutlinebug4216 → 14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3930

data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_size.html.erb

@@ -1,336 +0,0 @@
-<%= pb_rails("title", props: {size: 4, text: "S", padding_top: "sm"}) %>
-
-<%= pb_rails("flex") do %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-
-    <%= pb_rails("multiple_users_stacked", props: {
-      variant: "bubble",
-      size: "sm",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        }
-      ]
-    }) %>
-
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "sm",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-        size: "sm",
-        variant: "bubble",
-        users: [
-          {
-            name: "Patrick Welch",
-            image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-          },
-          {
-            name: "Lucille Sanchez",
-            image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-          },
-          {
-            name: "Beverly Reyes",
-            image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-          },
-        ]
-      }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: { 
-      size: "sm",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        },
-        {
-          name: "Beverly Reyes",
-          image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-        },
-        {
-          name: "Keith Craig",
-          image_url: "https://randomuser.me/api/portraits/men/40.jpg",
-        },
-        {
-          name: "Alicia Cooper",
-          image_url: "https://randomuser.me/api/portraits/women/46.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-<% end %>
-
-
-
-<%= pb_rails("title", props: {size: 4, text: "M", padding_top: "sm"}) %>
-
-<%= pb_rails("flex") do %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "md",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        }
-      ]
-    }) %>
-
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "md",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        }
-      ]
-    }) %>
-    <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-      <%= pb_rails("multiple_users_stacked", props: {
-        size: "md",
-        variant: "bubble",
-        users: [
-          {
-            name: "Patrick Welch",
-            image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-          },
-          {
-            name: "Lucille Sanchez",
-            image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-          },
-          {
-            name: "Beverly Reyes",
-            image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-          },
-        ]
-      }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "md",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        },
-        {
-          name: "Beverly Reyes",
-          image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-        },
-        {
-          name: "Keith Craig",
-          image_url: "https://randomuser.me/api/portraits/men/40.jpg",
-        },
-        {
-          name: "Alicia Cooper",
-          image_url: "https://randomuser.me/api/portraits/women/46.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-<% end %>
-
-
-
-<%= pb_rails("title", props: {size: 4, text: "L", padding_top: "sm"}) %>
-
-<%= pb_rails("flex") do %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "lg",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        }
-      ]
-    }) %>
-
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "lg",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-      <%= pb_rails("multiple_users_stacked", props: {
-        size: "lg",
-        variant: "bubble",
-        users: [
-          {
-            name: "Patrick Welch",
-            image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-          },
-          {
-            name: "Lucille Sanchez",
-            image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-          },
-          {
-            name: "Beverly Reyes",
-            image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-          },
-        ]
-      }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "lg",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        },
-        {
-          name: "Beverly Reyes",
-          image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-        },
-        {
-          name: "Keith Craig",
-          image_url: "https://randomuser.me/api/portraits/men/40.jpg",
-        },
-        {
-          name: "Alicia Cooper",
-          image_url: "https://randomuser.me/api/portraits/women/46.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-<% end %>
-
-
-<%= pb_rails("title", props: {size: 4, text: "XL", padding_top: "sm"}) %>
-
-<%= pb_rails("flex") do %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "xl",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        }
-      ]
-    }) %>
-
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "xl",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-      <%= pb_rails("multiple_users_stacked", props: {
-        size: "xl",
-        variant: "bubble",
-        users: [
-          {
-            name: "Patrick Welch",
-            image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-          },
-          {
-            name: "Lucille Sanchez",
-            image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-          },
-          {
-            name: "Beverly Reyes",
-            image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-          },
-        ]
-      }) %>
-  <% end %>
-  <%= pb_rails("flex/flex_item", props: { padding_right: "md" }) do %>
-    <%= pb_rails("multiple_users_stacked", props: {
-      size: "xl",
-      variant: "bubble",
-      users: [
-        {
-          name: "Patrick Welch",
-          image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-        },
-        {
-          name: "Lucille Sanchez",
-          image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-        },
-        {
-          name: "Beverly Reyes",
-          image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-        },
-        {
-          name: "Keith Craig",
-          image_url: "https://randomuser.me/api/portraits/men/40.jpg",
-        },
-        {
-          name: "Alicia Cooper",
-          image_url: "https://randomuser.me/api/portraits/women/46.jpg",
-        }
-      ]
-    }) %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_size.jsx

@@ -1,97 +0,0 @@
-import React from 'react'
-import Flex from '../../pb_flex/_flex'
-import Title from '../../pb_title/_title'
-import MultipleUsersStacked from '../_multiple_users_stacked'
-
-const MultipleUsersStackedSize = (props) => {
-  const sizes = [
-    { label: 'S', size: 'sm' },
-    { label: 'M', size: 'md' },
-    { label: 'L', size: 'lg' },
-    { label: 'XL', size: 'xl' },
-  ]
-
-  const usersList = [
-    [
-      {
-        name: 'Patrick Welch',
-        imageUrl: 'https://randomuser.me/api/portraits/men/9.jpg',
-      },
-    ],
-    [
-      {
-        name: 'Patrick Welch',
-        imageUrl: 'https://randomuser.me/api/portraits/men/9.jpg',
-      },
-      {
-        name: 'Lucille Sanchez',
-        imageUrl: 'https://randomuser.me/api/portraits/women/6.jpg',
-      },
-    ],
-    [
-      {
-        name: 'Patrick Welch',
-        imageUrl: 'https://randomuser.me/api/portraits/men/9.jpg',
-      },
-      {
-        name: 'Lucille Sanchez',
-        imageUrl: 'https://randomuser.me/api/portraits/women/6.jpg',
-      },
-      {
-        name: 'Beverly Reyes',
-        imageUrl: 'https://randomuser.me/api/portraits/women/74.jpg',
-      },
-    ],
-    [
-      {
-        name: 'Patrick Welch',
-        imageUrl: 'https://randomuser.me/api/portraits/men/9.jpg',
-      },
-      {
-        name: 'Lucille Sanchez',
-        imageUrl: 'https://randomuser.me/api/portraits/women/6.jpg',
-      },
-      {
-        name: 'Beverly Reyes',
-        imageUrl: 'https://randomuser.me/api/portraits/women/74.jpg',
-      },
-      {
-        name: 'Keith Craig',
-        imageUrl: 'https://randomuser.me/api/portraits/men/40.jpg',
-      },
-      {
-        name: 'Alicia Cooper',
-        imageUrl: 'https://randomuser.me/api/portraits/women/46.jpg',
-      },
-    ],
-  ]
-
-  return (
-    <>
-      {sizes.map(({ label, size }) => (
-        <Flex key={size}
-            orientation="column"
-        >
-          <Title paddingTop='sm' >{label}</Title>
-          <Flex>
-            {usersList.map((users, index) => (
-              <Flex key={index}
-                  paddingRight='sm'
-              >
-                <MultipleUsersStacked
-                    size={size}
-                    users={users}
-                    variant="bubble"
-                    {...props}
-                />
-              </Flex>
-            ))}
-          </Flex>
-          <br />
-        </Flex>
-      ))}
-    </>
-  )
-}
-
-export default MultipleUsersStackedSize