RubyGems - playbook_ui - Versions diffs - 7.14.0 → 7.15.0 - Mend

playbook_ui 7.14.0 → 7.15.0

Files changed (154) hide show

data/app/pb_kits/playbook/pb_popover/docs/_popover_dark.html.erb DELETED

@@ -1,25 +0,0 @@
-<%= pb_rails("flex", props: {
-    dark: true,
-    orientation: "row",
-    vertical: "center"
-    }) do %>
-    <%= pb_rails("body", props: {
-        dark: true,
-        text: "Click info for more details"
-    }) %>
-    &nbsp;
-    <%= pb_rails("circle_icon_button", props: {
-        dark: true,
-        variant: "secondary",
-        icon: "info",
-        id: "regular-popover-5"
-    }) %>
-    <%= pb_rails("popover", props: {
-        trigger_element_id: "regular-popover-5",
-        tooltip_id: "tooltip-5",
-        offset: true,
-        position: "top",
-    }) do %>
-        I'm a popover. I can show content of any size.
-    <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_popover/docs/_popover_dark.jsx DELETED

@@ -1,51 +0,0 @@
-import React, { useState } from 'react'
-import {
-  Body,
-  CircleIconButton,
-  Flex,
-  PbReactPopover,
-} from '../..'
-const PopoverDark = (props) => {
-  const [showPopover, setShowPopover] = useState(false)
-  const handleTogglePopover = () => {
-    setShowPopover(!showPopover)
-  }
-  const popoverReference = (
-    <CircleIconButton
-        dark
-        icon="info"
-        onClick={handleTogglePopover}
-        variant="secondary"
-    />
-  )
-  return (
-    <Flex
-        dark
-        orientation="row"
-        vertical="center"
-        {...props}
-    >
-      <Body
-          dark
-          text="Click info for more details"
-          {...props}
-      />
-      &nbsp;
-      <PbReactPopover
-          dark
-          offset
-          placement="top"
-          reference={popoverReference}
-          show={showPopover}
-          {...props}
-      >
-        {'I\'m a popover. I can show content of any size.'}
-      </PbReactPopover>
-    </Flex>
-  )
-}
-export default PopoverDark

data/app/pb_kits/playbook/pb_popover/docs/_popover_list_dark.html.erb DELETED

@@ -1,13 +0,0 @@
-<%= pb_rails("button", props: { dark: true, variant: "primary", id: 'list-5' }) do %>
-    Filter By
-    <%= pb_rails("icon", props: { dark: true, icon: "angle-down"}) %>
-<% end %>
-<%= pb_rails("popover", props: {trigger_element_id: "list-5", tooltip_id: "list-tooltip-5", position: 'bottom', padding: "none"}) do %>
-    <%= pb_rails("list", props: {ordered: false, dark: true, borderless: false, xpadding: true}) do %>
-        <%= pb_rails("list/item") do %><a>Popularity</a><% end %>
-        <%= pb_rails("list/item") do %><a>Title</a><% end %>
-        <%= pb_rails("list/item") do %><a>Duration</a><% end %>
-        <%= pb_rails("list/item") do %><a>Date Started</a><% end %>
-        <%= pb_rails("list/item") do %><a>Date Ended </a><% end %>
-    <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_popover/docs/_popover_list_dark.jsx DELETED

@@ -1,54 +0,0 @@
-import React, { useState } from 'react'
-import {
-  Button,
-  Icon,
-  List,
-  ListItem,
-  PbReactPopover,
-} from '../..'
-const PopoverWithButton = (props) => {
-  const [showPopover, setShowPopover] = useState(false)
-  const handleTogglePopover = () => {
-    setShowPopover(!showPopover)
-  }
-  const popoverReference = (
-    <Button
-        dark
-        onClick={handleTogglePopover}
-        variant="primary"
-        {...props}
-    >
-      {'Filter By'}
-      <Icon
-          dark
-          fixedWidth
-          icon="angle-down"
-          {...props}
-      />
-    </Button>
-  )
-  return (
-    <PbReactPopover
-        dark
-        padding="none"
-        placement="bottom"
-        reference={popoverReference}
-        show={showPopover}
-        {...props}
-    >
-      <List xpadding>
-        <ListItem><a>{'Popularity'}</a></ListItem>
-        <ListItem><a>{'Title'}</a></ListItem>
-        <ListItem><a>{'Duration'}</a></ListItem>
-        <ListItem><a>{'Date Started'}</a></ListItem>
-        <ListItem><a>{'Date Ended'}</a></ListItem>
-      </List>
-    </PbReactPopover>
-  )
-}
-export default PopoverWithButton

data/app/pb_kits/playbook/pb_popover/docs/_popover_scroll_height_dark.html.erb DELETED

@@ -1,25 +0,0 @@
-<%= pb_rails("button", props: { dark: true, variant: "primary", id: 'scroll-height-5', text: "Click Me" }) %>
-<%= pb_rails("popover", props: {
-    trigger_element_id: "scroll-height-5",
-    tooltip_id: "scroll-height-5",
-    position: 'top',
-    close_on_click: "any",
-    max_height: "150px",
-    max_width: "240px",
-    offset: true
-    }) do %>
-    <%= pb_rails("body", props: {
-        margin_bottom: "sm",
-        text: "So many people live within unhappy circumstances and yet will
-          not take the initiative to change their situation because they are
-          conditioned to a life of security, conformity, and conservation, all of
-          which may appear to give one peace of mind, but in reality, nothing is
-          more damaging to the adventurous spirit."
-    }) %>
-    <%= pb_rails("title", props: {
-        dark:true,
-        size: 4,
-        text: "- Christopher McCandless"
-    }) %>
-<% end %>

data/app/pb_kits/playbook/pb_popover/docs/_popover_scroll_height_dark.jsx DELETED

@@ -1,57 +0,0 @@
-import React, { useState } from 'react'
-import {
-  Body,
-  Button,
-  PbReactPopover,
-  Title,
-} from '../..'
-const PopoverScrollHeightDark = (props) => {
-  const [showPopover, setShowPopover] = useState(false)
-  const handleTogglePopover = () => {
-    setShowPopover(!showPopover)
-  }
-  const handleShouldClosePopover = (shouldClosePopover) => {
-    setShowPopover(!shouldClosePopover)
-  }
-  const popoverTrigger = (
-    <Button
-        dark
-        onClick={handleTogglePopover}
-        text="Click Me"
-        variant="primary"
-    />
-  )
-  return (
-    <PbReactPopover
-        closeOnClick="any"
-        maxHeight="150px"
-        maxWidth="240px"
-        offset
-        placement="top"
-        reference={popoverTrigger}
-        shouldClosePopover={handleShouldClosePopover}
-        show={showPopover}
-        {...props}
-    >
-      <Body
-          marginBottom="sm"
-          text=" Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal. Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battle-field of that war. We have come to dedicate a portion of that field, as a final resting place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this."
-          {...props}
-      />
-      <Title
-          dark
-          size={4}
-          text="- Abraham Lincoln"
-          {...props}
-      />
-    </PbReactPopover>
-  )
-}
-export default PopoverScrollHeightDark

data/app/pb_kits/playbook/pb_popover/docs/_popover_z_index_dark.html.erb DELETED

@@ -1,14 +0,0 @@
-<div style="position: relative; z-index: 2">
-    <%= pb_rails("body", props: {text: "I've got a z-index of 2", margin_bottom: "md"}) %>
-</div>
-<%= pb_rails("button", props: { variant: "primary", id: 'tooltip-z-index-5', text: "Click Me", }) %>
-<%= pb_rails("popover", props: {
-    trigger_element_id: "tooltip-z-index-5",
-    tooltip_id: "tooltip-z-index-5",
-    position: 'top',
-    z_index: "3",
-    offset: true
-}) do %>
-    I've got a z-index of 3
-<% end %>

data/app/pb_kits/playbook/pb_popover/docs/_popover_z_index_dark.jsx DELETED

@@ -1,54 +0,0 @@
-import React, { useState } from 'react'
-import {
-  Body,
-  Button,
-  PbReactPopover,
-} from '../..'
-const PopoverZIndexDark = (props) => {
-  const [showPopover, setShowPopover] = useState(false)
-  const handleTogglePopover = () => {
-    setShowPopover(!showPopover)
-  }
-  const handleShouldClosePopover = (shouldClosePopover) => {
-    setShowPopover(!shouldClosePopover)
-  }
-  const popoverTrigger = (
-    <Button
-        dark
-        onClick={handleTogglePopover}
-        text="Click Me"
-        variant="primary"
-    />
-  )
-  return (
-    <>
-      <div style={{ position: 'relative', zIndex: 2 }}>
-        <Body
-            dark
-            marginBottom="md"
-            text="I've got a z-index of 2"
-            {...props}
-        />
-      </div>
-      <PbReactPopover
-          closeOnClick="outside"
-          offset
-          placement="top"
-          reference={popoverTrigger}
-          shouldClosePopover={handleShouldClosePopover}
-          show={showPopover}
-          zIndex={3}
-          {...props}
-      >
-        {'I have a custom z-index of 3'}
-      </PbReactPopover>
-    </>
-  )
-}
-export default PopoverZIndexDark

data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed_align.html.erb DELETED

@@ -1,54 +0,0 @@
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: true,
-  text: "Maricris Nonato",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: false,
-  align: "left"
-}) %>
-<br><br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: true,
-  text: "Maricris Nonato",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: false,
-  align: "center"
-}) %>
-<br><br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: true,
-  text: "Maricris Nonato",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  variant: "elapsed",
-  show_user: false,
-  align: "right"
-}) %>

data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed_align.jsx DELETED

@@ -1,73 +0,0 @@
-import React from 'react'
-import Timestamp from '../_timestamp.jsx'
-const TimestampUpdatedAlign = (props) => {
-  return (
-    <div>
-      <Timestamp
-          align="left"
-          showUser="true"
-          text="Maricris Nonato"
-          timestamp={new Date().getTime()}
-          variant="elapsed"
-          {...props}
-      />
-      <br />
-      <Timestamp
-          align="left"
-          showUser="false"
-          timestamp={new Date((new Date()).getFullYear(), new Date().getMonth(), new Date().getDate()).getTime()}
-          variant="elapsed"
-          {...props}
-      />
-      <br />
-      <br />
-      <Timestamp
-          align="center"
-          showUser="true"
-          text="Maricris Nonato"
-          timestamp={new Date().getTime()}
-          variant="elapsed"
-          {...props}
-      />
-      <br />
-      <Timestamp
-          align="center"
-          showUser="false"
-          timestamp={new Date((new Date()).getFullYear(), new Date().getMonth(), new Date().getDate()).getTime()}
-          variant="elapsed"
-          {...props}
-      />
-      <br />
-      <br />
-      <Timestamp
-          align="right"
-          showUser="true"
-          text="Maricris Nonato"
-          timestamp={new Date().getTime()}
-          variant="elapsed"
-          {...props}
-      />
-      <br />
-      <Timestamp
-          align="right"
-          showUser="false"
-          timestamp={new Date((new Date()).getFullYear(), new Date().getMonth(), new Date().getDate()).getTime()}
-          variant="elapsed"
-          {...props}
-      />
-    </div>
-  )
-}
-export default TimestampUpdatedAlign

data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones_align.html.erb DELETED

@@ -1,177 +0,0 @@
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "left"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "left"
-}) %>
-<br><br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "center"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "center"
-}) %>
-<br><br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "America/New_York",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: false,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "right"
-}) %>
-<br>
-<%= pb_rails("timestamp", props: {
-  timestamp: DateTime.now + 4.years,
-  show_date: true,
-  show_timezone: true,
-  timezone: "Asia/Hong_Kong",
-  align: "right"
-}) %>