playbook_ui 4.15.0 → 4.15.1.alpha1

data/app/pb_kits/playbook/pb_progress_step/_progress_step.scss

@@ -1,388 +0,0 @@
-@import "../tokens/colors";
-@import "../tokens/spacing";
-@import "../tokens/opacity";
-@import "../tokens/typography";
-
-$pb_progress_step_circle_size: 14px;
-$pb_progress_step_connector_width: 3px;
-$pb_progress_step_connector_height_from_top: $pb_progress_step_circle_size/2 - $pb_progress_step_connector_width/2 + 2;
-$pb_progress_step_connector_height_from_left: $pb_progress_step_circle_size/2 - $pb_progress_step_connector_width/2;
-
-@mixin pb_progress_step_circle($background_color, $border_color, $border_width, $icon_color) {
-    display: flex;
-    flex-shrink: 0;
-    justify-content: center;
-    align-items: center;
-    padding-right: 0;
-    overflow: hidden;
-    height: $pb_progress_step_circle_size;
-    width: $pb_progress_step_circle_size;
-    background-color: $background_color;
-    color: $icon_color;
-    font-size: $font_smallest;
-    border-radius: $pb_progress_step_circle_size/2;
-    border: $border_width solid $border_color;
-    margin: 2px;
-}
-
-@mixin pb_progress_step_line($width, $height, $color, $margin) {
-    width: $width;
-    height: $height;
-    background-color: $color;
-    margin: $margin;
-    flex-grow: 1;
-}
-
-@mixin pb_progress_step_item_wrapper_horizontal {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-}
-
-@mixin pb_progress_step_item_wrapper_flex($flex_direction, $align_items, $align_self) {
-    display: flex;
-    flex-direction: $flex_direction;
-    align-items: $align_items;
-    align-self: $align_self;
-}
-
-[class^=pb_progress_step_kit] {
-    &[class*=_icon] {
-        [class^=pb_progress_step_item_kit_complete] {
-            [class=pb_progress_step_item_step_circle] {
-                svg {
-                    width: $pb_progress_step_circle_size;
-                    height: $pb_progress_step_circle_size - 2;
-                    color: $white;
-                }
-            }
-        }
-    }
-    &[class*=_horizontal] {
-        @include pb_progress_step_item_wrapper_horizontal;
-        >div {
-            &:first-child {
-                [class^=pb_progress_step_item] {
-                    &[class*=_connector_first], &[class*=_step_connector_first] {
-                        opacity: 0;
-                    }
-                }
-            }
-            &:last-child {
-                [class^=pb_progress_step_item] {
-                    &[class*=_connector_second], &[class*=_step_connector_second] {
-                        opacity: 0;
-                    }
-                }
-            }
-        }
-        [class*=pb_progress_step_item_kit] {
-            &[class*=_complete] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_horizontal;
-                    [class^=pb_progress_step_item] {
-                        &[class*=_connector_first], &[class*=_connector_second] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(column, center, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_horizontal;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first], &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($primary, $primary, 2px, $primary);
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-            &[class*=_active] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_horizontal;
-                    [class^=pb_progress_step_item] {
-                        &[class*=_connector_first] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                        &[class*=_connector_second] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_light, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(column, center, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_horizontal;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($white, $primary, 2px, $white);
-                                    svg {
-                                        display: none;
-                                    }
-                                }
-                                &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_light, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                            }
-                        }
-                    }
-                } 
-            }
-            &[class*=_inactive] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_horizontal;
-                    [class^=pb_progress_step_item] {
-                        &[class*=_connector_first], &[class*=_connector_second] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_light, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(column, center, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_horizontal;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first], &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_light, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($border_light, $border_light, 2px, $border_light);
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-        }
-        &[class*=_dark] {
-            [class*=pb_progress_step_item_kit] {
-                &[class*=_active] {
-                    [class^=pb_progress_step_item] {
-                        &[class*=_connector_first] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                        &[class*=_connector_second] {
-                            @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_dark, $pb_progress_step_connector_height_from_top 0 0 0);
-                        }
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        [class=pb_progress_step_item_step] {
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $primary, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($bg_dark, $primary, 2px, $bg_dark);
-                                    svg {
-                                        display: none;
-                                    }
-                                }
-                                &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_dark, $pb_progress_step_connector_height_from_top 0 0 0);
-                                }
-                            }
-                        }
-                    }
-                }
-                &[class*=_inactive] {
-                    [class=pb_progress_step_item_wrapper] {
-                        [class^=pb_progress_step_item] {
-                            &[class*=_connector_first], &[class*=_connector_second] {
-                                @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_dark, $pb_progress_step_connector_height_from_top 0 0 0);
-                            }
-                        }
-                        [class=pb_progress_step_item_step_wrapper] {
-                            [class=pb_progress_step_item_step] {
-                                [class^=pb_progress_step_item] {
-                                    &[class*=_step_connector_first], &[class*=_step_connector_second] {
-                                        @include pb_progress_step_line($space_sm, $pb_progress_step_connector_width, $border_dark, $pb_progress_step_connector_height_from_top 0 0 0);
-                                    }
-                                    &[class*=_step_circle] {
-                                        @include pb_progress_step_circle($border_dark, $border_dark, 0px, $border_dark);
-                                        svg {
-                                            display: none;
-                                        }
-                                    }
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-    &[class*=_vertical] {
-        @include pb_progress_step_item_wrapper_flex(column, flex-start, auto);
-        > div:first-child {
-            [class=pb_progress_step_item_wrapper] {
-                [class=pb_progress_step_item_connector_first] {
-                    opacity: 0;
-                    margin: 0 0 0 $pb_progress_step_connector_height_from_left;
-                }
-                [class=pb_progress_step_item_step_wrapper] {
-                    [class=pb_progress_step_item_step] {
-                        > div:first-child {
-                            opacity: 0;
-                        }
-                    }
-                }
-            }
-        }
-        >div:last-child {
-            [class=pb_progress_step_item_wrapper] {
-                [class=pb_progress_step_item_connector_second] {
-                    opacity: 0;
-                }
-                [class=pb_progress_step_item_step_wrapper] {
-                    [class=pb_progress_step_item_step] {
-                        > div:last-child {
-                            opacity: 0;
-                        }
-                    }
-                }
-            }
-        }
-        [class*=pb_progress_step_item_kit] {
-            &[class*=_complete] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_flex(column, baseline, auto);
-                    [class=pb_progress_step_item_connector_second] {
-                        @include pb_progress_step_line($pb_progress_step_connector_width, $space_md, $primary, 0 0 0 $pb_progress_step_connector_height_from_top);
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(row, flex-start, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_flex(column, center, stretch);
-                            margin-right: 4px;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first] {
-                                    display: none;
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($primary, $primary, 2px, $primary);
-                                }
-                                &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($pb_progress_step_connector_width, 100%, $primary, 0);
-                                }
-                            }
-                        }
-                    }
-                } 
-            }
-            &[class*=_active] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_flex(column, baseline, auto);
-                    [class=pb_progress_step_item_connector_second] {
-                        @include pb_progress_step_line($pb_progress_step_connector_width, $space_md, $border_light, 0 0 0 $pb_progress_step_connector_height_from_top);
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(row, flex-start, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_flex(column, center, stretch);
-                            margin-right: 4px;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first] {
-                                    display: none;
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($white, $primary, 2px, $white);
-                                    svg {
-                                        display: none;
-                                    }
-                                }
-                                &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($pb_progress_step_connector_width, 100%, $border_light, 0);
-                                }
-                            }
-                        }
-                    }
-                } 
-            }
-            &[class*=_inactive] {
-                flex-basis: 100%;
-                [class=pb_progress_step_item_wrapper] {
-                    @include pb_progress_step_item_wrapper_flex(column, baseline, auto);
-                    [class=pb_progress_step_item_connector_second] {
-                        @include pb_progress_step_line($pb_progress_step_connector_width, $space_md, $border_light, 0 0 0 $pb_progress_step_connector_height_from_top);
-                    }
-                    [class=pb_progress_step_item_step_wrapper] {
-                        @include pb_progress_step_item_wrapper_flex(row, flex-start, auto);
-                        [class=pb_progress_step_item_step] {
-                            @include pb_progress_step_item_wrapper_flex(column, center, stretch);
-                            margin-right: 4px;
-                            [class^=pb_progress_step_item] {
-                                &[class*=_step_connector_first] {
-                                    display: none;
-                                }
-                                &[class*=_step_circle] {
-                                    @include pb_progress_step_circle($border_light, $border_light, 2px, $border_light);
-                                }
-                                &[class*=_step_connector_second] {
-                                    @include pb_progress_step_line($pb_progress_step_connector_width, 100%, $border_light, 0);
-                                }
-                            }
-                        }
-                    }
-                }  
-            }
-        }
-        &[class*=_dark] {
-            [class^=pb_progress_step_item_kit] {
-                &[class*=_active] {
-                    [class=pb_progress_step_item_wrapper] {
-                        [class=pb_progress_step_item_connector_second] {
-                            @include pb_progress_step_line($pb_progress_step_connector_width, $space_md, $border_dark, 0 0 0 $pb_progress_step_connector_height_from_top);
-                        }
-                        [class=pb_progress_step_item_step_wrapper] {
-                            [class=pb_progress_step_item_step] {
-                                [class^=pb_progress_step_item] {
-                                    &[class*=_step_circle] {
-                                        @include pb_progress_step_circle(transparent, $primary, 2px, $bg_dark);
-                                        svg {
-                                            display: none;
-                                        }
-                                    }
-                                    &[class*=_step_connector_second] {
-                                        @include pb_progress_step_line($pb_progress_step_connector_width, 100%, $border_dark, 0);
-                                    }
-                                }
-                            }
-                        }
-                    } 
-                }
-                &[class*=_inactive] {
-                    [class=pb_progress_step_item_wrapper] {
-                        [class=pb_progress_step_item_connector_second] {
-                            @include pb_progress_step_line($pb_progress_step_connector_width, $space_md, $border_dark, 0 0 0 $pb_progress_step_connector_height_from_top);
-                        }
-                        [class=pb_progress_step_item_step_wrapper] {
-                            [class=pb_progress_step_item_step] {
-                                [class^=pb_progress_step_item] {
-                                    &[class*=_step_circle] {
-                                        @include pb_progress_step_circle($border_dark, $border_dark, 0px, $border_dark);
-                                        svg {
-                                            display: none;
-                                        }
-                                    }
-                                    &[class*=_step_connector_second] {
-                                        @include pb_progress_step_line($pb_progress_step_connector_width, 100%, $border_dark, 0);
-                                    }
-                                }
-                            }
-                        }
-                    }  
-                }
-            }
-        }
-    }
-}

data/app/pb_kits/playbook/pb_progress_step/_progress_step_item.html.erb

@@ -1,23 +0,0 @@
-<%= content_tag(:div,
-  id: object.id,
-  data: object.data,
-  class: object.classname) do %>
-  
-  <div class="pb_progress_step_item_wrapper">
-    <div class="pb_progress_step_item_connector_first"></div>
-    <div class="pb_progress_step_item_step_wrapper">
-      <div class="pb_progress_step_item_step">
-        <div class="pb_progress_step_item_step_connector_first"></div>
-        <div class="pb_progress_step_item_step_circle">
-          <%= pb_rails("icon", props: { icon: "check", size: "xs" }) %>
-        </div>
-        <div class="pb_progress_step_item_step_connector_second"></div>
-      </div>
-      <div>
-        <%= capture(&object.children) %>
-      </div>
-    </div>
-    <div class="pb_progress_step_item_connector_second"></div>
-  </div>
-
-<% end %>

data/app/pb_kits/playbook/pb_progress_step/_progress_step_item.jsx

@@ -1,44 +0,0 @@
-/* @flow */
-
-import React from 'react'
-import classnames from 'classnames'
-import { buildCss } from '../utilities/props'
-import { Icon } from '..'
-
-type ProgressStepItemProps = {
-  className?: String,
-  status?: 'complete' | 'active' | 'inactive',
-  children?: React.Node,
-}
-
-const ProgressStepItem = ({
-  className,
-  status = 'inactive',
-  children,
-}: ProgressStepItemProps) => {
-  const progressStepItem = buildCss('pb_progress_step_item_kit', status)
-
-  return (
-    <div className={classnames(progressStepItem, className)}>
-      <div className="pb_progress_step_item_wrapper">
-        <div className="pb_progress_step_item_connector_first" />
-        <div className="pb_progress_step_item_step_wrapper">
-          <div className="pb_progress_step_item_step">
-            <div className="pb_progress_step_item_step_connector_first" />
-            <div className="pb_progress_step_item_step_circle">
-              <Icon
-                  icon="check"
-              />
-            </div>
-            <div className="pb_progress_step_item_step_connector_second" />
-          </div>
-          <div>
-            {children}
-          </div>
-        </div>
-        <div className="pb_progress_step_item_connector_second" />
-      </div>
-    </div>
-  )
-}
-export default ProgressStepItem

data/app/pb_kits/playbook/pb_progress_step/docs/_description.md

@@ -1 +0,0 @@
-Progress step kit is used to show the progress of a process. There are three types of steps in this kit: completed, active, and inactive. Completed steps are indicated by a solid, blue circle (with or without an icon). The current, or active, step is indicated by an outlined blue circle. The inactive, or future, step is indicated by a solid gray circle. 

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_dark.html.erb

@@ -1,8 +0,0 @@
-<%= pb_rails("progress_step", props: {orientation: "horizontal", icon: true, dark: true}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_dark.jsx

@@ -1,18 +0,0 @@
-import React from 'react'
-import ProgressStep from '../_progress_step.jsx'
-import ProgressStepItem from '../_progress_step_item.jsx'
-
-const ProgressStepDark = () => (
-  <div>
-    <ProgressStep
-        dark
-        icon
-    >
-      <ProgressStepItem status="complete" />
-      <ProgressStepItem status="active" />
-      <ProgressStepItem status="inactive" />
-    </ProgressStep>
-  </div>
-)
-
-export default ProgressStepDark

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_default.html.erb

@@ -1,33 +0,0 @@
-<%= pb_rails("progress_step", props: {orientation: "horizontal", icon: true}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-  <% end %>
-<% end %>
-
-<br /><br />
-
-<%= pb_rails("progress_step", props: {orientation: "horizontal"}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-  <% end %>
-<% end %>
-
-<br /><br />
-
-<%= pb_rails("progress_step", props: {orientation: "horizontal"}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-      Child
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-      Child
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-      Child
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_default.jsx

@@ -1,39 +0,0 @@
-import React from 'react'
-import ProgressStep from '../_progress_step.jsx'
-import ProgressStepItem from '../_progress_step_item.jsx'
-
-const ProgressStepDefault = () => (
-  <div>
-    <ProgressStep icon>
-      <ProgressStepItem status="complete" />
-      <ProgressStepItem status="active" />
-      <ProgressStepItem status="inactive" />
-    </ProgressStep>
-
-    <br />
-    <br />
-
-    <ProgressStep>
-      <ProgressStepItem status="complete" />
-      <ProgressStepItem status="active" />
-      <ProgressStepItem status="inactive" />
-    </ProgressStep>
-
-    <br />
-    <br />
-
-    <ProgressStep>
-      <ProgressStepItem status="complete">
-        {'Child'}
-      </ProgressStepItem>
-      <ProgressStepItem status="active">
-        {'Child'}
-      </ProgressStepItem>
-      <ProgressStepItem status="inactive">
-        {'Child'}
-      </ProgressStepItem>
-    </ProgressStep>
-  </div>
-)
-
-export default ProgressStepDefault

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_vertical.html.erb

@@ -1,33 +0,0 @@
-<%= pb_rails("progress_step", props: {orientation: "vertical", icon: true}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-  <% end %>
-<% end %>
-
-<br />
-
-<%= pb_rails("progress_step", props: {orientation: "vertical"}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-  <% end %>
-<% end %>
-
-<br />
-
-<%= pb_rails("progress_step", props: {orientation: "vertical"}) do %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete"}) do %>
-    Child
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "active"}) do %>
-    Child
-  <% end %>
-  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive"}) do %>
-    Child
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_vertical.jsx

@@ -1,40 +0,0 @@
-import React from 'react'
-import ProgressStep from '../_progress_step.jsx'
-import ProgressStepItem from '../_progress_step_item.jsx'
-
-const ProgressStepVertical = () => (
-  <div>
-    <ProgressStep
-        icon
-        orientation="vertical"
-    >
-      <ProgressStepItem status="complete" />
-      <ProgressStepItem status="active" />
-      <ProgressStepItem status="inactive" />
-    </ProgressStep>
-
-    <br />
-
-    <ProgressStep orientation="vertical">
-      <ProgressStepItem status="complete" />
-      <ProgressStepItem status="active" />
-      <ProgressStepItem status="inactive" />
-    </ProgressStep>
-
-    <br />
-
-    <ProgressStep orientation="vertical">
-      <ProgressStepItem status="complete">
-        {'Child'}
-      </ProgressStepItem>
-      <ProgressStepItem status="active">
-        {'Child'}
-      </ProgressStepItem>
-      <ProgressStepItem status="inactive">
-        {'Child'}
-      </ProgressStepItem>
-    </ProgressStep>
-  </div>
-)
-
-export default ProgressStepVertical

data/app/pb_kits/playbook/pb_progress_step/docs/example.yml

@@ -1,12 +0,0 @@
-examples:
-  
-  rails:
-  - progress_step_default: Default
-  - progress_step_vertical: Vertical
-  - progress_step_dark: Dark
-  
-  
-  react:
-  - progress_step_default: Default
-  - progress_step_vertical: Vertical
-  - progress_step_dark: Dark

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

@@ -1,3 +0,0 @@
-export { default as ProgressStepDefault } from './_progress_step_default.jsx'
-export { default as ProgressStepVertical } from './_progress_step_vertical.jsx'
-export { default as ProgressStepDark } from './_progress_step_dark.jsx'