playbook_ui 9.14.1 → 9.17.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ac52100757b7a77673deacf90cb3c92c2c53e36611bea82739556081a7351f7a
-  data.tar.gz: 5cbd39cfdc2c35ee0002a908b2464b29461161a5f366861d733c0d998eea4b9a
+  metadata.gz: 910e4092e8a35d776f1c8aaed3d3affffcbccf5482fa1dd25b0bbeccb8410ca6
+  data.tar.gz: 57aa2a44fd3a8c8fc691774ddf9e484dd461db2386fbdf05e049a699c9186f87
 SHA512:
-  metadata.gz: 05a9cc1143df406e74845f19004c58c6db3a931f1a9295447930dc9376f17f4c17e81df3795e23308ac7d901b116d847462bc44666ca89b4178d8ed521260a10
-  data.tar.gz: 210590e03979d8be499c4f1596f47c9dca835b380efd6a9cfb1b643ebb84c6b7dc921f219e7fb2dce298c1b87591a1cc012c9f3546018778b9a0b1ab8644c3aa
+  metadata.gz: 8737b69eda6c1ed2abc12765f42e69ce15c184ae118726539f3dae3921fde3397dc1d8db8f2f2b5ed2c479483008189546cf78ccb6e72763c3c2d80b184ca2b4
+  data.tar.gz: 42feb68b57bd9e3f3752062d277365f33b5bbbc1757e042dfffa8d5c9b70bab3fde1d2649e3ba70a1122201dfa5c61c194a6f97fa592c84e573ff75f921a160d

data/app/pb_kits/playbook/pb_radio/_radio.jsx

@@ -9,6 +9,7 @@ import { globalProps } from '../utilities/globalProps.js'
 
 type RadioProps = {
   aria?: object,
+  alignment?: String,
   checked?: Boolean,
   children?: Node,
   className?: String,
@@ -25,6 +26,7 @@ type RadioProps = {
 
 const Radio = ({
   aria = {},
+  alignment = '',
   children,
   className,
   dark = false,
@@ -40,7 +42,7 @@ const Radio = ({
 }: RadioProps, ref) => {
   const ariaProps = buildAriaProps(aria)
   const dataProps = buildDataProps(data)
-  const classes = classnames(buildCss('pb_radio_kit'), { error }, { dark }, globalProps(props), className)
+  const classes = classnames(buildCss('pb_radio_kit'), { error }, { dark }, globalProps(props), alignment, className)
 
   return (
     <label

data/app/pb_kits/playbook/pb_radio/_radio.scss

@@ -38,6 +38,16 @@
       }
     }
   }
+
+  &.vertical {
+    flex-direction: column;
+    align-items: center;
+    .pb_radio_button {
+      margin-right: 0px;
+      margin-bottom: $space_xs;
+    }
+  }
+
   &.dark {
     .pb_radio_button {
       border-color: $border_dark;

data/app/pb_kits/playbook/pb_radio/docs/_radio_alignment.html.erb

@@ -0,0 +1,27 @@
+<%= pb_rails("flex") do %>
+  <%= pb_rails("radio", props: {
+    alignment: "vertical",
+    text: "Power",
+    input_options: {
+      tabindex: 0
+    },
+    margin_right: "sm",
+    name: "group 1",
+    value: "Power"
+  }) %>
+
+  <%= pb_rails("radio", props: {
+    alignment: "vertical",
+    text: "Nitro",
+    margin_right: "sm",
+    name: "group 1",
+    value: "Nitro"
+  }) %>
+
+  <%= pb_rails("radio", props: {
+    alignment: "vertical",
+    text: "Google",
+    name: "group 1",
+    value: "Google"
+  }) %>
+<% end %>

data/app/pb_kits/playbook/pb_radio/docs/_radio_alignment.jsx

@@ -0,0 +1,36 @@
+import React from 'react'
+import { Flex, Radio } from '../../'
+
+const RadioAlignment = () => {
+  return (
+    <Flex>
+      <Radio
+          alignment="vertical"
+          label="Power"
+          marginRight="sm"
+          name="Group2"
+          tabIndex={0}
+          value="Power"
+      />
+      <br />
+      <Radio
+          alignment="vertical"
+          defaultChecked={false}
+          label="Nitro"
+          marginRight="sm"
+          name="Group2"
+          value="Nitro"
+      />
+      <br />
+      <Radio
+          alignment="vertical"
+          defaultChecked={false}
+          label="Google"
+          name="Group2"
+          value="Google"
+      />
+    </Flex>
+  )
+}
+
+export default RadioAlignment

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

@@ -5,8 +5,10 @@ examples:
   - radio_custom: Custom
   - radio_error: With Error
   - radio_options: With Options
+  - radio_alignment: Alignment
 
   react:
   - radio_default: Default
   - radio_custom: Custom
   - radio_error: With Error
+  - radio_alignment: Alignment

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

@@ -1,3 +1,4 @@
 export { default as RadioDefault } from './_radio_default.jsx'
 export { default as RadioCustom } from './_radio_custom.jsx'
 export { default as RadioError } from './_radio_error.jsx'
+export { default as RadioAlignment } from './_radio_alignment.jsx'

data/app/pb_kits/playbook/pb_radio/radio.rb

@@ -5,6 +5,8 @@ require "action_view"
 module Playbook
   module PbRadio
     class Radio < Playbook::KitBase
+      prop :alignment, type: Playbook::Props::String,
+                       default: ""
       prop :checked, type: Playbook::Props::Boolean,
                      default: false
       prop :error, type: Playbook::Props::Boolean,
@@ -19,7 +21,7 @@ module Playbook
                    default: "radio_text"
 
       def classname
-        generate_classname("pb_radio_kit") + error_class
+        generate_classname("pb_radio_kit") + error_class + alignment_class
       end
 
       def selected
@@ -35,6 +37,10 @@ module Playbook
       def error_class
         error ? " error" : ""
       end
+
+      def alignment_class
+        alignment == "vertical" ? " vertical" : ""
+      end
     end
   end
 end

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

@@ -82,8 +82,6 @@ const Timestamp = (props: TimestampProps) => {
     return `Last updated ${userDisplay} ${dateTimestamp.value.fromNow()}`
   }
 
-  const datetimeOrText = timestamp ? fullDateDisplay() : text
-
   const captionText = () => {
     switch (variant) {
     case 'updated':
@@ -91,7 +89,7 @@ const Timestamp = (props: TimestampProps) => {
     case 'elapsed':
       return formatElapsedString(userDisplay, timeDisplay)
     default:
-      return showDate ? datetimeOrText : fullTimeDisplay()
+      return showDate ? timestamp ? fullDateDisplay() : text : fullTimeDisplay()
     }
   }
 

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "9.13.0"
-  VERSION = "9.14.1"
+  PREVIOUS_VERSION = "9.16.0"
+  VERSION = "9.17.0"
 end

metadata

@@ -1,15 +1,15 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 9.14.1
+  version: 9.17.0
 platform: ruby
 authors:
 - Power UX
 - Power Devs
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-05-12 00:00:00.000000000 Z
+date: 2021-06-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -299,22 +299,22 @@ dependencies:
   name: rspec-rails
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: 3.8.0
     - - "~>"
       - !ruby/object:Gem::Version
         version: '3.8'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.8.0
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: 3.8.0
     - - "~>"
       - !ruby/object:Gem::Version
         version: '3.8'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.8.0
 - !ruby/object:Gem::Dependency
   name: rubocop
   requirement: !ruby/object:Gem::Requirement
@@ -1536,6 +1536,8 @@ files:
 - app/pb_kits/playbook/pb_radio/_radio.scss
 - app/pb_kits/playbook/pb_radio/docs/_description.md
 - app/pb_kits/playbook/pb_radio/docs/_footer.md
+- app/pb_kits/playbook/pb_radio/docs/_radio_alignment.html.erb
+- app/pb_kits/playbook/pb_radio/docs/_radio_alignment.jsx
 - app/pb_kits/playbook/pb_radio/docs/_radio_custom.html.erb
 - app/pb_kits/playbook/pb_radio/docs/_radio_custom.jsx
 - app/pb_kits/playbook/pb_radio/docs/_radio_default.html.erb
@@ -2157,7 +2159,7 @@ homepage: http://playbook.powerapp.cloud
 licenses:
 - MIT
 metadata: {}
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -2172,8 +2174,9 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.0.3
-signing_key: 
+rubyforge_project:
+rubygems_version: 2.7.3
+signing_key:
 specification_version: 4
 summary: Playbook Design System
 test_files: []