playbook_ui 7.0.0.pre.alpha7 → 7.0.0.pre.alpha12

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_dark.html.erb

@@ -1,5 +0,0 @@
-<%= pb_rails("text_input", props: { label: "First Name", placeholder: "Enter first name", value: "Timothy Wenhold", dark: true }) %>
-<%= pb_rails("text_input", props: { label: "Last Name", placeholder: "Enter last name", dark: true }) %>
-<%= pb_rails("text_input", props: { label: "Phone Number", type: "phone", placeholder: "Enter phone number", dark: true }) %>
-<%= pb_rails("text_input", props: { label: "Email Address", type: "email", placeholder: "Enter email address", dark: true }) %>
-<%= pb_rails("text_input", props: { label: "Zip Code", type: "number", placeholder: "Enter zip code", dark: true }) %>

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_dark.jsx

@@ -1,78 +0,0 @@
-import React from 'react'
-import {
-  Caption,
-  TextInput,
-  Title,
-} from '../../'
-
-class TextInputDark extends React.Component {
-    state = {
-      firstName: '',
-    }
-
-    render() {
-      const handleOnChange = ({ target }) => this.setState({ firstName: target.value })
-
-      const {
-        firstName,
-      } = this.state
-
-      return (
-        <div>
-          <TextInput
-              dark
-              label="First Name"
-              placeholder="Enter first name"
-              value="Timothy Wenhold"
-          />
-          <TextInput
-              dark
-              label="Last Name"
-              placeholder="Enter last name"
-          />
-          <TextInput
-              dark
-              label="Phone Number"
-              placeholder="Enter phone number"
-              type="phone"
-          />
-          <TextInput
-              dark
-              label="Email Address"
-              placeholder="Enter email address"
-              type="email"
-          />
-          <TextInput
-              dark
-              label="Zip Code"
-              placeholder="Enter zip code"
-              type="number"
-          />
-
-          <br />
-          <br />
-
-          <Title dark>{'Event Handler Props'}</Title>
-
-          <br />
-          <Caption>{'onChange'}</Caption>
-
-          <br />
-
-          <TextInput
-              dark
-              label="First Name"
-              onChange={handleOnChange}
-              placeholder="Enter first name"
-              value={firstName}
-          />
-
-          <If condition={firstName !== ''}>
-            {`First name is: ${firstName}`}
-          </If>
-        </div>
-      )
-    }
-}
-
-export default TextInputDark

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_dark_error.html.erb

@@ -1,14 +0,0 @@
-<%= pb_rails("text_input", props: {
-  dark: true,
-  error: "Please enter a valid email address",
-  label: "Email Address",
-  type: "email",
-  placeholder: "Enter email address"
-}) %>
-
-<%= pb_rails("text_input", props: {
-  dark: true,
-  label: "Confirm Email Address",
-  type: "email",
-  placeholder: "Confirm email address"
-}) %>

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_dark_error.jsx

@@ -1,18 +0,0 @@
-import React from 'react'
-import {
-  TextInput,
-} from '../..'
-
-const TextInputDarkError = () => (
-  <div>
-    <TextInput
-        dark
-        error="Please enter a valid email address"
-        label="Email Address"
-        placeholder="Enter email address"
-        type="email"
-    />
-  </div>
-)
-
-export default TextInputDarkError

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_dark.html.erb

@@ -1,9 +0,0 @@
-<%= pb_rails("textarea", props: { label: "Label", rows: 4, dark: true }) %>
-
-<br/>
-
-<%= pb_rails("textarea", props: { label: "Label", placeholder: "Placeholder text", dark: true }) %>
-
-<br/>
-
-<%= pb_rails("textarea", props: { label: "Label", name: "comment", value: "Default value text", dark: true }) %>

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_dark.jsx

@@ -1,34 +0,0 @@
-import React from 'react'
-import { Textarea } from '../../'
-
-const TextareaDark = () => {
-  return (
-    <div>
-      <Textarea
-          dark
-          label="Label"
-          rows={4}
-      />
-
-      <br />
-
-      <Textarea
-          dark
-          label="Label"
-          placeholder="Placeholder text"
-      />
-
-      <br />
-
-      <Textarea
-          dark
-          label="Label"
-          name="comment"
-          placeholder="Placeholder text"
-          value="Default value text"
-      />
-    </div>
-  )
-}
-
-export default TextareaDark

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_dark_error.html.erb

@@ -1,6 +0,0 @@
-<%= pb_rails("textarea", props: {
-  dark: true,
-  error: "This field has an error!",
-  label: "Label",
-  rows: 4
-}) %>

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_dark_error.jsx

@@ -1,19 +0,0 @@
-import React from 'react'
-import { Textarea } from '../..'
-
-const TextareaDarkError = () => {
-  return (
-    <div>
-      <Textarea
-          dark
-          error="This field has an error!"
-          label="Label"
-          name="comment"
-          placeholder="Placeholder text"
-          value="Default value text"
-      />
-    </div>
-  )
-}
-
-export default TextareaDarkError

data/app/pb_kits/playbook/pb_time/docs/_time_dark.jsx

@@ -1,26 +0,0 @@
-import React from 'react'
-import Time from '../_time.jsx'
-
-const TimeDark = () => {
-  return (
-    <div>
-      <Time
-          dark
-          date={new Date()}
-      />
-      <br />
-      <Time
-          dark
-          date={new Date()}
-          size="lg"
-      />
-      <br />
-      <Time
-          dark
-          date={new Date()}
-      />
-    </div>
-  )
-}
-
-export default TimeDark

data/app/pb_kits/playbook/pb_time_range_inline/docs/_time_range_inline_dark.html.erb

@@ -1,72 +0,0 @@
-<%= pb_rails("time_range_inline", props: {
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "xs",
-    dark: true
-}) %>
-<br />
-<%= pb_rails("time_range_inline", props: {
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "sm",
-    dark: true
-}) %>
-<br />
-<br />
-<%= pb_rails("time_range_inline", props: {
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "xs",
-    timezone: true,
-    alignment: "center",
-    dark: true
-}) %>
-<br />
-<%= pb_rails("time_range_inline", props: {
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "sm",
-    timezone: true,
-    alignment: "center",
-    dark: true
-}) %>
-<br />
-<br />
-<%= pb_rails("time_range_inline", props: {
-    icon: true,
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "xs",
-    alignment: "center",
-    dark: true
-}) %>
-<br />
-<%= pb_rails("time_range_inline", props: {
-    icon: true,
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "sm",
-    alignment: "center",
-    dark: true
-}) %>
-<br />
-<br />
-<%= pb_rails("time_range_inline", props: {
-    icon: true,
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "xs",
-    timezone: true,
-    alignment: "right",
-    dark: true
-}) %>
-<br />
-<%= pb_rails("time_range_inline", props: {
-    icon: true,
-    start_time: "2012-08-02T15:49:29Z",
-    end_time: "2012-08-02T17:49:29Z",
-    size: "sm",
-    timezone: true,
-    alignment: "right",
-    dark: true
-}) %>

data/app/pb_kits/playbook/pb_time_range_inline/docs/_time_range_inline_dark.jsx

@@ -1,81 +0,0 @@
-import React from 'react'
-import { TimeRangeInline } from '../../'
-
-const TimeRangeInlineDark = () => (
-  <div>
-    <TimeRangeInline
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        size="xs"
-        startTime="2012-08-02T15:49:29Z"
-    />
-    <br />
-    <TimeRangeInline
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        size="sm"
-        startTime="2012-08-02T15:49:29Z"
-    />
-    <br />
-    <br />
-    <TimeRangeInline
-        alignment="center"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        size="xs"
-        startTime="2012-08-02T15:49:29Z"
-        timezone="true"
-    />
-    <br />
-    <TimeRangeInline
-        alignment="center"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        size="sm"
-        startTime="2012-08-02T15:49:29Z"
-        timezone="true"
-    />
-    <br />
-    <br />
-    <TimeRangeInline
-        alignment="center"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        icon="true"
-        size="xs"
-        startTime="2012-08-02T15:49:29Z"
-    />
-    <br />
-    <TimeRangeInline
-        alignment="center"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        icon="true"
-        size="sm"
-        startTime="2012-08-02T15:49:29Z"
-    />
-    <br />
-    <br />
-    <TimeRangeInline
-        alignment="right"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        icon="true"
-        size="xs"
-        startTime="2012-08-02T15:49:29Z"
-        timezone="true"
-    />
-    <br />
-    <TimeRangeInline
-        alignment="right"
-        dark
-        endTime="2012-08-02T17:49:29Z"
-        icon="true"
-        size="sm"
-        startTime="2012-08-02T15:49:29Z"
-        timezone="true"
-    />
-  </div>
-)
-
-export default TimeRangeInlineDark

data/app/pb_kits/playbook/pb_time_stacked/docs/_time_stacked_dark.html.erb

@@ -1 +0,0 @@
-<%= pb_rails("time_stacked", props: { date: DateTime.now, dark: true }) %>

data/app/pb_kits/playbook/pb_time_stacked/docs/_time_stacked_dark.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import TimeStacked from '../_time_stacked.jsx'
-
-const TimeStackedDark = () => {
-  return (
-    <div>
-      <TimeStacked
-          dark
-          date={new Date()}
-      />
-    </div>
-  )
-}
-
-export default TimeStackedDark

data/app/pb_kits/playbook/pb_title/docs/_title_dark.html.erb

@@ -1,8 +0,0 @@
-<%= pb_rails("title", props: { text: "Default Title", dark: true }) %>
-
-<br/>
-
-<%= pb_rails("title", props: { text: "Title 4", tag: "h4", size: 4, dark: true }) %>
-<%= pb_rails("title", props: { text: "Title 3", tag: "h3", size: 3, dark: true }) %>
-<%= pb_rails("title", props: { text: "Title 2", tag: "h2", size: 2, dark: true }) %>
-<%= pb_rails("title", props: { text: "Title 1", tag: "h1", size: 1, dark: true }) %>

data/app/pb_kits/playbook/pb_title/docs/_title_dark.jsx

@@ -1,35 +0,0 @@
-import React from 'react'
-import { Title } from '../../'
-
-const TitleDark = () => {
-  return (
-    <div>
-      <Title
-          dark
-          size={4}
-          tag="h4"
-          text="Title 4"
-      />
-      <Title
-          dark
-          size={3}
-          tag="h3"
-          text="Title 3"
-      />
-      <Title
-          dark
-          size={2}
-          tag="h2"
-          text="Title 2"
-      />
-      <Title
-          dark
-          size={1}
-          tag="h1"
-          text="Title 1"
-      />
-    </div>
-  )
-}
-
-export default TitleDark

data/app/pb_kits/playbook/pb_title_count/docs/_title_count_align_dark.html.erb

@@ -1,23 +0,0 @@
-<%= pb_rails("title_count", props: {
-  dark: true,
-  title: "Remodeling Consultants",
-  count: 527
-}) %>
-
-<br>
-
-<%= pb_rails("title_count", props: {
-  dark: true,
-  title: "Remodeling Consultants",
-  count: 527,
-  align: "center"
-}) %>
-
-<br>
-
-<%= pb_rails("title_count", props: {
-  dark: true,
-  title: "Remodeling Consultants",
-  count: 527,
-  align: "right"
-}) %>