playbook_ui 7.14.0 → 7.15.0

data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes_dark.html.erb

@@ -1,29 +0,0 @@
-<%= pb_rails("icon_circle", props: {
-  dark: true,
-  icon: "comment",
-  size: "xs"
-}) %>
-<br />
-<%= pb_rails("icon_circle", props: {
-  dark: true,
-  icon: "comment",
-  size: "sm"
-}) %>
-<br />
-<%= pb_rails("icon_circle", props: {
-  dark: true,
-  icon: "comment",
-  size: "md"
-}) %>
-<br />
-<%= pb_rails("icon_circle", props: {
-  dark: true,
-  icon: "comment",
-  size: "lg"
-}) %>
-<br />
-<%= pb_rails("icon_circle", props: {
-  dark: true,
-  icon: "comment",
-  size: "xl"
-}) %>

data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes_dark.jsx

@@ -1,38 +0,0 @@
-import React from 'react'
-import { IconCircle } from '../..'
-
-const IconCircleSizesDark = (props) => {
-  return (
-    <div>
-      <IconCircle
-          dark
-          icon="rocket"
-          size="sm"
-          {...props}
-      />
-      <br />
-      <IconCircle
-          dark
-          icon="rocket"
-          size="md"
-          {...props}
-      />
-      <br />
-      <IconCircle
-          dark
-          icon="rocket"
-          size="lg"
-          {...props}
-      />
-      <br />
-      <IconCircle
-          dark
-          icon="rocket"
-          size="xl"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default IconCircleSizesDark

data/app/pb_kits/playbook/pb_icon_value/docs/_icon_value_align_dark.html.erb

@@ -1,23 +0,0 @@
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "heart",
-  text: "93"
-}) %>
-
-<br>
-
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "comment",
-  text: "5",
-  align: "center"
-}) %>
-
-<br>
-
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "clock",
-  text: "15m",
-  align: "right"
-}) %>

data/app/pb_kits/playbook/pb_icon_value/docs/_icon_value_align_dark.jsx

@@ -1,37 +0,0 @@
-import React from 'react'
-import { IconValue } from '../../'
-
-const IconValueAlignDark = (props) => {
-  return (
-    <div>
-      <IconValue
-          dark
-          icon="heart"
-          text="93"
-          {...props}
-      />
-
-      <br />
-
-      <IconValue
-          align="center"
-          dark
-          icon="comment"
-          text="5"
-          {...props}
-      />
-
-      <br />
-
-      <IconValue
-          align="right"
-          dark
-          icon="clock"
-          text="15min"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default IconValueAlignDark

data/app/pb_kits/playbook/pb_icon_value/docs/_icon_value_dark.html.erb

@@ -1,21 +0,0 @@
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "heart",
-  text: "93"
-}) %>
-
-<br>
-
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "comment",
-  text: "5"
-}) %>
-
-<br>
-
-<%= pb_rails("icon_value", props: {
-  dark: true,
-  icon: "clock",
-  text: "15m"
-}) %>

data/app/pb_kits/playbook/pb_icon_value/docs/_icon_value_dark.jsx

@@ -1,35 +0,0 @@
-import React from 'react'
-import { IconValue } from '../../'
-
-const IconValueDark = (props) => {
-  return (
-    <div>
-      <IconValue
-          dark
-          icon="clipboard"
-          text="33-123456"
-          {...props}
-      />
-
-      <br />
-
-      <IconValue
-          dark
-          icon="heart"
-          text="93"
-          {...props}
-      />
-
-      <br />
-
-      <IconValue
-          dark
-          icon="clock"
-          text="15min"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default IconValueDark

data/app/pb_kits/playbook/pb_layout/docs/_layout_sizes_dark.html.erb

@@ -1,32 +0,0 @@
-<%= pb_rails("layout", props: {position: "left", size: "xs", collapse: "xs", variant: "dark"}) do %>
-  <%= pb_rails("layout/sidebar") do %> Side <% end %>
-  <%= pb_rails("layout/body") do %> Body <% end %>
-<% end %>
-
-<br/><br/>
-
-<%= pb_rails("layout", props: {position: "left", size: "sm", collapse: "sm", variant: "dark"}) do %>
-  <%= pb_rails("layout/sidebar") do %> Side <% end %>
-  <%= pb_rails("layout/body") do %> Body <% end %>
-<% end %>
-
-<br/><br/>
-
-<%= pb_rails("layout", props: {position: "left", size: "md", collapse: "sm", variant: "dark"}) do %>
-  <%= pb_rails("layout/sidebar") do %> Side <% end %>
-  <%= pb_rails("layout/body") do %> Body <% end %>
-<% end %>
-
-<br/><br/>
-
-<%= pb_rails("layout", props: {position: "left", size: "lg", collapse: "sm", variant: "dark"}) do %>
-  <%= pb_rails("layout/sidebar") do %> Side <% end %>
-  <%= pb_rails("layout/body") do %> Body <% end %>
-<% end %>
-
-<br/><br/>
-
-<%= pb_rails("layout", props: {position: "left", size: "xl", collapse: "sm", variant: "dark"}) do %>
-  <%= pb_rails("layout/sidebar") do %> Side <% end %>
-  <%= pb_rails("layout/body") do %> Body <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_layout/docs/_layout_sizes_dark.jsx

@@ -1,97 +0,0 @@
-import React from 'react'
-import { Layout } from '../../'
-
-const LayoutSizesDark = (props) => {
-  return (
-    <div>
-      <Layout
-          collapse="xs"
-          position="left"
-          size="xs"
-          variant="dark"
-          {...props}
-      >
-        <Layout.Side>
-          {'Side'}
-        </Layout.Side>
-        <Layout.Body>
-          {'Body'}
-        </Layout.Body>
-      </Layout>
-
-      <br />
-      <br />
-
-      <Layout
-          collapse="xs"
-          position="left"
-          size="sm"
-          variant="dark"
-          {...props}
-      >
-        <Layout.Side>
-          {'Side'}
-        </Layout.Side>
-        <Layout.Body>
-          {'Body'}
-        </Layout.Body>
-      </Layout>
-
-      <br />
-      <br />
-
-      <Layout
-          collapse="xs"
-          position="left"
-          size="md"
-          variant="dark"
-          {...props}
-      >
-        <Layout.Side>
-          {'Side'}
-        </Layout.Side>
-        <Layout.Body>
-          {'Body'}
-        </Layout.Body>
-      </Layout>
-
-      <br />
-      <br />
-
-      <Layout
-          collapse="xs"
-          position="left"
-          size="lg"
-          variant="dark"
-          {...props}
-      >
-        <Layout.Side>
-          {'Side'}
-        </Layout.Side>
-        <Layout.Body>
-          {'Body'}
-        </Layout.Body>
-      </Layout>
-
-      <br />
-      <br />
-
-      <Layout
-          collapse="xs"
-          position="left"
-          size="xl"
-          variant="dark"
-          {...props}
-      >
-        <Layout.Side>
-          {'Side'}
-        </Layout.Side>
-        <Layout.Body>
-          {'Body'}
-        </Layout.Body>
-      </Layout>
-    </div>
-  )
-}
-
-export default LayoutSizesDark

data/app/pb_kits/playbook/pb_popover/docs/_popover_close_dark.html.erb

@@ -1,43 +0,0 @@
-<%= pb_rails("flex", props: {dark: true, classname: "flex-container", spacing: "between"}) do %>
-  <span>
-    <%= pb_rails("button", props: { dark: true, text: "Click Inside", variant: "primary", id: 'inside-popover-2' }) %>
-    <%= pb_rails("popover", props: {
-      close_on_click: "inside",
-      trigger_element_id: "inside-popover-2",
-      tooltip_id: "inside-tooltip-2",
-      position: 'bottom',
-      offset: true
-    }) do %>
-      Click on me!
-    <% end %>
-  </span>
-  <span>
-    <%= pb_rails("button", props: { text: "Click Outside", variant: "primary", id: 'outside-popover-2' }) %>
-    <%= pb_rails("popover", props: {
-      close_on_click: "outside",
-      trigger_element_id: "outside-popover-2",
-      tooltip_id: "outside-tooltip-1",
-      position: 'left',
-      offset: true
-    }) do %>
-        Click anywhere but me!
-      <% end %>
-  </span>
-  <span>
-    <%= pb_rails("button", props: {
-      dark: true, 
-      text: "Click Anywhere",
-      variant: "primary",
-      id: 'any-popover-2'
-    }) %>
-    <%= pb_rails("popover", props: {
-      close_on_click: "any",
-      trigger_element_id: "any-popover-2",
-      tooltip_id: "any-tooltip-3",
-      position: 'top',
-      offset: true
-    }) do %>
-      Click anything!
-    <% end %>
-  </span>
-<% end %>

data/app/pb_kits/playbook/pb_popover/docs/_popover_close_dark.jsx

@@ -1,105 +0,0 @@
-import React, { useState } from 'react'
-import {
-  Button,
-  Flex,
-  PbReactPopover,
-} from '../..'
-
-const PopoverCloseDark = (props) => {
-  const [showInsidePopover, setInsideShowPopover] = useState(false)
-  const [showOutsidePopover, setOutsideShowPopover] = useState(false)
-  const [showAnyPopover, setAnyShowPopover] = useState(false)
-
-  const handleInsideShouldClosePopover = (shouldClosePopover) => {
-    setInsideShowPopover(!shouldClosePopover)
-  }
-
-  const handleInsideTogglePopover = () => {
-    setInsideShowPopover(!showInsidePopover)
-  }
-
-  const handleOutsideShouldClosePopover = (shouldClosePopover) => {
-    setOutsideShowPopover(!shouldClosePopover)
-  }
-
-  const handleOutsideTogglePopover = () => {
-    setOutsideShowPopover(!showOutsidePopover)
-  }
-
-  const handleAnyShouldClosePopover = (shouldClosePopover) => {
-    setAnyShowPopover(!shouldClosePopover)
-  }
-
-  const handleAnyTogglePopover = () => {
-    setAnyShowPopover(!showOutsidePopover)
-  }
-
-  const insidePopoverTrigger = (
-    <Button
-        dark
-        onClick={handleInsideTogglePopover}
-        text="Click Inside"
-        variant="primary"
-    />
-  )
-
-  const outsidePopoverTrigger = (
-    <Button
-        dark
-        onClick={handleOutsideTogglePopover}
-        text="Click Outside"
-        variant="primary"
-    />
-  )
-
-  const anyPopoverTrigger = (
-    <Button
-        dark
-        onClick={handleAnyTogglePopover}
-        text="Click Anywhere"
-        variant="primary"
-    />
-  )
-
-  return (
-    <Flex spacing="between">
-      <PbReactPopover
-          closeOnClick="inside"
-          offset
-          placement="bottom"
-          reference={insidePopoverTrigger}
-          shouldClosePopover={handleInsideShouldClosePopover}
-          show={showInsidePopover}
-          {...props}
-      >
-        {'Click on me!'}
-      </PbReactPopover>
-
-      <PbReactPopover
-          closeOnClick="outside"
-          offset
-          placement="top"
-          reference={outsidePopoverTrigger}
-          shouldClosePopover={handleOutsideShouldClosePopover}
-          show={showOutsidePopover}
-          {...props}
-      >
-        {'Click anywhere but me!'}
-      </PbReactPopover>
-
-      <PbReactPopover
-          closeOnClick="any"
-          offset
-          placement="right"
-          reference={anyPopoverTrigger}
-          shouldClosePopover={handleAnyShouldClosePopover}
-          show={showAnyPopover}
-          {...props}
-      >
-        {'Click anything!'}
-      </PbReactPopover>
-    </Flex>
-  )
-}
-
-export default PopoverCloseDark