playbook_ui 3.1.0 → 3.2.0

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

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

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

@@ -1,19 +1,30 @@
-import React from "react"
-import {Textarea} from "../../"
+import React from 'react'
+import { Textarea } from '../../'
 
-function TextareaDefault() {
+const TextareaDefault = () => {
   return (
     <div>
-      <Textarea label="Label"rows={4}/>
+      <Textarea
+          label="Label"
+          rows={4}
+      />
 
-      <br/>
+      <br />
 
-      <Textarea label="Label" placeholder="Placeholder text"/>
+      <Textarea
+          label="Label"
+          placeholder="Placeholder text"
+      />
 
-      <br/>
+      <br />
+
+      <Textarea
+          label="Label"
+          name="comment"
+          placeholder="Placeholder text"
+          value="Default value text"
+      />
 
-      <Textarea label="Label" name="comment" placeholder="Placeholder text" value="Default value text"/>
-      
     </div>
   )
 }

data/app/pb_kits/playbook/pb_textarea/docs/index.js

@@ -1,3 +1,3 @@
-export {default as TextareaDefault} from './_textarea_default.jsx';
-export {default as TextareaCustom} from './_textarea_custom.jsx';
-export {default as TextareaDark} from './_textarea_dark.jsx';
+export { default as TextareaDefault } from './_textarea_default.jsx'
+export { default as TextareaCustom } from './_textarea_custom.jsx'
+export { default as TextareaDark } from './_textarea_dark.jsx'

data/app/pb_kits/playbook/pb_time/_time.jsx

@@ -1,21 +1,21 @@
-import React from 'react';
-import PropTypes from "prop-types";
+import React from 'react'
+import PropTypes from 'prop-types'
 
 const propTypes = {
   className: PropTypes.string,
-  id: PropTypes.string
-};
+  id: PropTypes.string,
+}
 
 class Time extends React.Component {
   render() {
     return (
       <div className="pb_time">
-        <span>TIME CONTENT</span>
+        <span>{'TIME CONTENT'}</span>
       </div>
     )
   }
 }
 
-Time.propTypes = propTypes;
+Time.propTypes = propTypes
 
-export default Time;
+export default Time

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

@@ -1,10 +1,9 @@
-import React from "react"
-import {Time} from "../../"
+import React from 'react'
 
-function TimeDefault() {
+const TimeDefault = () => {
   return (
-    <h1>{`Coming Soon...`}</h1>
+    <h1>{'Coming Soon...'}</h1>
   )
 }
 
-export default TimeDefault;
+export default TimeDefault

data/app/pb_kits/playbook/pb_time/docs/index.js

@@ -1 +1 @@
-export {default as TimeDefault} from './_time_default.jsx';
+export { default as TimeDefault } from './_time_default.jsx'

data/app/pb_kits/playbook/pb_timestamp/_timestamp.jsx

@@ -1,21 +1,21 @@
-import React from 'react';
-import PropTypes from "prop-types";
+import React from 'react'
+import PropTypes from 'prop-types'
 
 const propTypes = {
   className: PropTypes.string,
-  id: PropTypes.string
-};
+  id: PropTypes.string,
+}
 
 class Timestamp extends React.Component {
   render() {
     return (
       <div className="pb_timestamp">
-        <span>TIMESTAMP CONTENT</span>
+        <span>{'TIMESTAMP CONTENT'}</span>
       </div>
     )
   }
 }
 
-Timestamp.propTypes = propTypes;
+Timestamp.propTypes = propTypes
 
-export default Timestamp;
+export default Timestamp

data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.jsx

@@ -1,9 +1,8 @@
-import React from "react"
-import {Timestamp} from "../../"
+import React from 'react'
 
-function TimestampDefault() {
+const TimestampDefault = () => {
   return (
-    <h1>{`Coming Soon...`}</h1>
+    <h1>{'Coming Soon...'}</h1>
   )
 }
 

data/app/pb_kits/playbook/pb_timestamp/docs/index.js

@@ -1 +1 @@
-export {default as TimestampDefault} from './_timestamp_default.jsx';
+export { default as TimestampDefault } from './_timestamp_default.jsx'

data/app/pb_kits/playbook/pb_title/_title.jsx

@@ -13,12 +13,12 @@ type TitleProps = {
 }
 
 const tagCSS = ({
-  dark=false,
-  size=3,
+  dark = false,
+  size = 3,
 }) => {
   let css = ''
 
-  css += `_${size}` 
+  css += `_${size}`
   css += dark === true ? '_dark' : ''
 
   return css
@@ -29,11 +29,11 @@ const Title = (props: TitleProps) => {
     className,
     children,
     text,
-    tag='h3',
+    tag = 'h3',
   } = props
 
   const Tag = `${tag}`
-  
+
   return (
     <Tag className={classnames(`pb_title_kit${tagCSS(props)}`, className)}>
       { text || children }

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

@@ -1,15 +1,35 @@
-import React from "react"
-import {Title} from "../../"
+import React from 'react'
+import { Title } from '../../'
 
-function TitleDark() {
+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" />
+      <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;
+export default TitleDark

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

@@ -1,16 +1,33 @@
-import React from "react"
-import {Title} from "../../"
+import React from 'react'
+import { Title } from '../../'
 
-function TitleLight() {
+const TitleLight = () => {
   return (
     <div>
-      <Title text="Default Title"/><br/>
-      <Title size={4} tag="h4" text="Title 4" />
-      <Title size={3} tag="h3" text="Title 3" />
-      <Title size={2} tag="h2" text="Title 2" />
-      <Title size={1} tag="h1" text="Title 1" />
+      <Title text="Default Title" />
+      <br />
+      <Title
+          size={4}
+          tag="h4"
+          text="Title 4"
+      />
+      <Title
+          size={3}
+          tag="h3"
+          text="Title 3"
+      />
+      <Title
+          size={2}
+          tag="h2"
+          text="Title 2"
+      />
+      <Title
+          size={1}
+          tag="h1"
+          text="Title 1"
+      />
     </div>
   )
 }
 
-export default TitleLight;
+export default TitleLight

data/app/pb_kits/playbook/pb_title/docs/index.js

@@ -1,2 +1,2 @@
-export {default as TitleLight} from './_title_light.jsx';
-export {default as TitleDark} from './_title_dark.jsx';
+export { default as TitleLight } from './_title_light.jsx'
+export { default as TitleDark } from './_title_dark.jsx'

data/app/pb_kits/playbook/pb_title_count/_title_count.jsx

@@ -1,21 +1,21 @@
-import React from 'react';
-import PropTypes from "prop-types";
+import React from 'react'
+import PropTypes from 'prop-types'
 
 const propTypes = {
   className: PropTypes.string,
-  id: PropTypes.string
-};
+  id: PropTypes.string,
+}
 
 class TitleCount extends React.Component {
   render() {
     return (
       <div className="pb_title_count">
-        <span>TITLE COUNT CONTENT</span>
+        <span>{'TITLE COUNT CONTENT'}</span>
       </div>
     )
   }
 }
 
-TitleCount.propTypes = propTypes;
+TitleCount.propTypes = propTypes
 
-export default TitleCount;
+export default TitleCount

data/app/pb_kits/playbook/pb_title_count/docs/_title_count_default.jsx

@@ -1,10 +1,9 @@
-import React from "react"
-import {TitleCount} from "../../"
+import React from 'react'
 
-function TitleCountDefault() {
+const TitleCountDefault = () => {
   return (
-    <h1>{`Coming Soon...`}</h1>
+    <h1>{'Coming Soon...'}</h1>
   )
 }
 
-export default TitleCountDefault;
+export default TitleCountDefault

data/app/pb_kits/playbook/pb_title_count/docs/index.js

@@ -1 +1 @@
-export {default as TitleCountDefault} from './_title_count_default.jsx';
+export { default as TitleCountDefault } from './_title_count_default.jsx'

data/app/pb_kits/playbook/pb_title_detail/_title_detail.jsx

@@ -1,21 +1,21 @@
-import React from 'react';
-import PropTypes from "prop-types";
+import React from 'react'
+import PropTypes from 'prop-types'
 
 const propTypes = {
   className: PropTypes.string,
-  id: PropTypes.string
-};
+  id: PropTypes.string,
+}
 
 class TitleDetail extends React.Component {
   render() {
     return (
       <div className="pb_title_detail">
-        <span>TITLE DETAIL CONTENT</span>
+        <span>{'TITLE DETAIL CONTENT'}</span>
       </div>
     )
   }
 }
 
-TitleDetail.propTypes = propTypes;
+TitleDetail.propTypes = propTypes
 
-export default TitleDetail;
+export default TitleDetail

data/app/pb_kits/playbook/pb_title_detail/docs/_title_detail_default.jsx

@@ -1,10 +1,9 @@
-import React from "react"
-import {TitleDetail} from "../../"
+import React from 'react'
 
-function TitleDetailDefault() {
+const TitleDetailDefault = () => {
   return (
-    <h1>{`Coming Soon...`}</h1>
+    <h1>{'Coming Soon...'}</h1>
   )
 }
 
-export default TitleDetailDefault;
+export default TitleDetailDefault

data/app/pb_kits/playbook/pb_title_detail/docs/index.js

@@ -1 +1 @@
-export {default as TitleDetailDefault} from './_title_detail_default.jsx';
+export { default as TitleDetailDefault } from './_title_detail_default.jsx'

data/app/pb_kits/playbook/pb_toggle/_toggle.jsx

@@ -3,13 +3,13 @@
 import React from 'react'
 
 import type {
-  InputCallback
-} from "../types"
+  InputCallback,
+} from '../types'
 
 import {
   buildAriaProps,
-  buildDataProps,
   buildCss,
+  buildDataProps,
   noop,
 } from '../utilities/props'
 
@@ -32,10 +32,10 @@ const Toggle = ({
   onUncheck = noop,
   size = 'md',
   ...props
-}: Props) =>{
+}: Props) => {
   const ariaProps = buildAriaProps(aria)
   const dataProps = buildDataProps(data)
-  const handleChange = event => {
+  const handleChange = (event) => {
     onChange(event)
     event.target.checked ?
       onCheck(event) :
@@ -50,13 +50,17 @@ const Toggle = ({
   })
 
   return (
-    <div {...ariaProps} {...dataProps} className={css}>
+    <div
+        {...ariaProps}
+        {...dataProps}
+        className={css}
+    >
       <label className="pb_toggle_wrapper">
         <input
             {...props}
-            type="checkbox"
             checked={checked}
             onChange={handleChange}
+            type="checkbox"
         />
 
         <div className="pb_toggle_control" />