playbook_ui 10.0.3.pre.alpha.walkthrough → 10.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7d8d8989dd23f539baf18ba85a01dd08457cf3a1e0770b549a909567ac8be0d8
-  data.tar.gz: d1d92d88f08b6c88acc436126d8b6bd219e1778a63df8113179cbb8304dc3dc8
+  metadata.gz: 8b178f062785d89be15c032908f55e96f3d1fe70f18af9818fd074b2a3e18008
+  data.tar.gz: 7ebd1388f01b4235d8cee6932bd5ad66c5f99b2a23cb7587e5f0f7603e96a7cb
 SHA512:
-  metadata.gz: 43244a13a534d399aa2b4e80760a2cfe0cbdf012bca40c54da11ef75b269a99f1f1a17259a81c5dec1f2a85f3e1e88d6c1e6a3324d66821e15fb1b7b9b8a0a22
-  data.tar.gz: 77024ce1631997dd284b58c98e083555e184d98b31a865e7c1f90817530b42ffe2aac7385505c24823569023e682cce93ef5d4fa29adaeb412be2a3ff0b6913a
+  metadata.gz: 246f7e177b640539519d0e4a48c375afd08a5a0c836345d8ab6054cd3efbbdf937d404d8ba5f68811708c267da34156df9662d3a89b06498dd6ce5a5d25da28b
+  data.tar.gz: a75a04eda5a1a142cb7517909bf0db0ad2ffd60bad691776741b55bff90e34e8d03cb24bf420de385e5a9243d109eb5b44fcb3b65021bc589f87c48038d8e977

data/app/pb_kits/playbook/index.js

@@ -4,7 +4,7 @@ import 'lazysizes/plugins/attrchange/ls.attrchange'
 import 'lazysizes'
 
 // vvv React Component JSX Imports from the React Kits vvv
-export { default as Walkthrough } from './pb_walkthrough/_walkthrough.jsx'
+export { default as Walkthrough } from './pb_walkthrough/_walkthrough'
 export { default as Avatar } from './pb_avatar/_avatar'
 export { default as AvatarActionButton } from './pb_avatar_action_button/_avatar_action_button'
 export { default as Background } from './pb_background/_background'

data/app/pb_kits/playbook/pb_popover/_popover.scss

@@ -19,14 +19,6 @@
   to {
     opacity: 0;
   }
-  .pb_popover_body {
-    @include pb_card;
-    border: 0;
-    box-shadow: $shadow_deeper;
-  }
-  .overflow_handling {
-    overflow: auto;
-  }
 }
 
 .pb_popover_tooltip {

data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.scss

@@ -23,8 +23,6 @@
   overflow-x: auto;
 }
 [class^=pb_rich_text_editor_kit] {
-  // Fixes flex container resizing bug
-  overflow-x: auto;
   // Disables File Attatchment Button in Toolbar
   trix-toolbar [data-trix-button-group="file-tools"] {
     display: none;

data/app/pb_kits/playbook/pb_walkthrough/_walkthrough.jsx

@@ -3,14 +3,12 @@
 
 /* @flow */
 
-import React, { useState } from 'react'
+import React from 'react'
 import classnames from 'classnames'
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
 import { globalProps } from '../utilities/globalProps.js'
-import Joyride, { ACTIONS, EVENTS, STATUS } from 'react-joyride'
-import CircleIconButton from '../pb_circle_icon_button/_circle_icon_button'
+import Joyride from 'react-joyride'
 import Button from '../pb_button/_button'
-import Card from '../pb_card/_card'
 import Flex from '../pb_flex/_flex'
 import SectionSeparator from '../pb_section_separator/_section_separator'
 import Title from '../pb_title/_title'
@@ -73,79 +71,75 @@ type TooltipProps = {
 
 const Tooltip = React.forwardRef((props: TooltipProps, ref) => (
   <div
+      className="pb_card_kit_border_none p_none"
       {...props.tooltipProps}
   >
-    <Card
-        borderNone
-        padding="none"
-    >
-      {props.step.title && <div>
-        <Flex
-            align="center"
-            justify="between"
-            padding="xs"
-        >
-          <Title
-              paddingLeft="xs"
-              size={4}
-          >
-            {props.step.title}
-          </Title>
-          {props.skip && (<Button
-              {...props.skipProps}
-              id="skip"
-              text="Skip Tour"
-              variant="link"
-                          />)}
-          <Button
-              {...props.skipProps}
-              id="skip"
-              text="Skip Tour"
-              variant="link"
-          />
-        </Flex>
-        <SectionSeparator />
-        </div>}
-
-      <Flex padding="sm">{props.step.content}</Flex>
-      <SectionSeparator />
+    {props.step.title && <div>
       <Flex
-          justify={props.index == 0 ? 'end' : 'between'}
+          align="center"
+          justify="between"
           padding="xs"
       >
+        <Title
+            paddingLeft="xs"
+            size={4}
+        >
+          {props.step.title}
+        </Title>
+        {props.skip && (<Button
+            {...props.skipProps}
+            id="skip"
+            text="Skip Tour"
+            variant="link"
+                        />)}
+        <Button
+            {...props.skipProps}
+            id="skip"
+            text="Skip Tour"
+            variant="link"
+        />
+      </Flex>
+      <SectionSeparator />
+    </div>}
+
+    <Flex padding="sm">{props.step.content}</Flex>
+    <SectionSeparator />
+    <Flex
+        justify={props.index == 0 ? 'end' : 'between'}
+        padding="xs"
+    >
 
-        {props.index > 0 && (
+      {props.index > 0 && (
+      <Button
+          {...props.backProps}
+          id="back"
+          text="Back"
+      />
+        )}
+      <Choose>
+        <When condition={props.continuous && !props.isLastStep}>
           <Button
-              {...props.backProps}
-              id="back"
-              text="Back"
+              {...props.primaryProps}
+              id="next"
+              text="Next"
           />
-        )}
-        <Choose>
-          <When condition={props.continuous && !props.isLastStep}>
-            <Button
-                {...props.primaryProps}
-                id="next"
-                text="Next"
-            />
-          </When>
-          <When condition={!props.continuous}>
-            <Button
-                {...props.closeProps}
-                id="close"
-                text="Close"
-            />
-          </When>
-          <Otherwise>
-            <Button
-                {...props.closeProps}
-                id="close"
-                text="Close"
-            />
-          </Otherwise>
-        </Choose>
-      </Flex>
-    </Card>
+        </When>
+        <When condition={!props.continuous}>
+          <Button
+              {...props.closeProps}
+              id="close"
+              text="Close"
+          />
+        </When>
+        <Otherwise>
+          <Button
+              {...props.closeProps}
+              id="close"
+              text="Close"
+          />
+        </Otherwise>
+      </Choose>
+    </Flex>
   </div>
 ))
 
@@ -157,10 +151,17 @@ const Walkthrough = (props: WalkthroughProps) => {
     continuous = false,
     data = {},
     disableOverlay,
+    floaterProps = {
+      offset: 50,
+    },
     id,
     run = false,
     steps,
-    styles,
+    styles = {
+      options: {
+        zIndex: 20000,
+      },
+    },
     showSkipButton,
   } = props
 
@@ -180,6 +181,7 @@ const Walkthrough = (props: WalkthroughProps) => {
           continuous={continuous}
           disableOverlay={disableOverlay}
           disableScrolling
+          floaterProps={floaterProps}
           run={run}
           showSkipButton={showSkipButton}
           steps={steps}
@@ -188,6 +190,7 @@ const Walkthrough = (props: WalkthroughProps) => {
           {...props}
       />
     </div>
+
   )
 }
 

data/dist/reset.css

@@ -1,61 +1,2 @@
-/* CLEAN UP AND REMOVE */
-/* Headings */
-/* Standard Font Weights */
-/* Non_Standard Font Weights */
-/*=====================================
-Base colors should not be documented.
-Only document color use.
-
-Colors -----------------------------*/
-/* Specialty Gradient -----------------*/
-/* Interface colors -------------------*/
-/* Main colors ------------------------*/
-/*=====================================
-
-Background colors ------------------*/
-/* Card colors ------------------*/
-/* Active colors ----------------------*/
-/* Hover colors -----------------------*/
-/* Focus colors -----------------------*/
-/* Border colors ----------------------*/
-/* Shadow colors ----------------------*/
-/* Text colors ------------------------*/
-/* Data colors ------------------------*/
-/* Status colors ----------------------*/
-/* Link colors ------------------------*/
-/* Product colors ---------------------*/
-/* Category colors ---------------------*/
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0; }
-  *:before, *:after {
-    box-sizing: border-box; }
-
-html {
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  height: 100vh;
-  overflow-x: hidden; }
-
-body {
-  font-family: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans_serif;
-  font-size: 16px;
-  line-height: 1.5;
-  background-color: #F3F7FB;
-  height: 100%;
-  letter-spacing: 0;
-  font-weight: 400;
-  font-style: normal;
-  text-rendering: optimizeLegibility;
-  -moz-font-feature-settings: "liga" on;
-  color: #242B42;
-  margin: 0 !important;
-  padding: 0 !important;
-  box-sizing: border-box;
-  min-height: 100vh;
-  padding: 50px; }
-
-a {
-  text-decoration: none;
-  color: #0056CF; }
+*{box-sizing:border-box;margin:0;padding:0}*:before,*:after{box-sizing:border-box}html{-webkit-tap-highlight-color:rgba(0,0,0,0);height:100vh;overflow-x:hidden}body{font-family:"Proxima Nova","Helvetica Neue",Helvetica,Arial,sans_serif;font-size:16px;line-height:1.5;background-color:#F3F7FB;height:100%;letter-spacing:0;font-weight:400;font-style:normal;text-rendering:optimizeLegibility;-moz-font-feature-settings:"liga" on;color:#242B42;margin:0 !important;padding:0 !important;box-sizing:border-box;min-height:100vh;padding:50px}a{text-decoration:none;color:#0056CF}
 

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "10.0.0"
-  VERSION = "10.0.3.pre.alpha.walkthrough"
+  PREVIOUS_VERSION = "10.2.0"
+  VERSION = "10.2.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 10.0.3.pre.alpha.walkthrough
+  version: 10.2.1
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-07-14 00:00:00.000000000 Z
+date: 2021-07-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -2076,12 +2076,11 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">"
+  - - ">="
     - !ruby/object:Gem::Version
-      version: 1.3.1
+      version: '0'
 requirements: []
-rubyforge_project:
-rubygems_version: 2.7.3
+rubygems_version: 3.1.4
 signing_key:
 specification_version: 4
 summary: Playbook Design System