playbook_ui 12.4.0.pre.alpha.map1 → 12.5.0.pre.alpha.datepicker1

data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb

@@ -0,0 +1,43 @@
+# frozen_string_literal: true
+
+module Playbook
+  module PbPhoneNumberInput
+    class PhoneNumberInput < Playbook::KitBase
+      prop :disabled, type: Playbook::Props::Boolean,
+                      default: false
+      prop :initial_country, type: Playbook::Props::String,
+                             default: ""
+      prop :is_valid
+      prop :label, type: Playbook::Props::String,
+                   default: ""
+      prop :name, type: Playbook::Props::String,
+                  default: ""
+      prop :onchange
+      prop :only_countries, type: Playbook::Props::Array,
+                            default: []
+      prop :preferred_countries, type: Playbook::Props::Array,
+                                 default: []
+      prop :value, type: Playbook::Props::String,
+                   default: ""
+
+      def classname
+        generate_classname("pb_phone_number_input")
+      end
+
+      def phone_number_input_options
+        {
+          id: id,
+          disabled: disabled,
+          initialCountry: initial_country,
+          isValid: is_valid,
+          label: label,
+          name: name,
+          onChange: onchange,
+          onlyCountries: only_countries,
+          preferredCountries: preferred_countries,
+          value: value,
+        }
+      end
+    end
+  end
+end

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

@@ -28,9 +28,9 @@ type PbPopoverProps = {
   offset?: boolean;
   reference: PopperReference & any;
   show?: boolean;
-  shouldClosePopover?: (arg0: boolean) => boolean | boolean;
-} & GlobalProps &
-  PopperProps<any>;
+  shouldClosePopover?: (arg0: boolean) => void;
+} & GlobalProps & Omit<PopperProps<any>, 'children'>
+& { children?: React.ReactChild[] | React.ReactChild }
 
 // Prop enabled default modifiers here
 // https://popper.js.org/docs/v2/modifiers

data/app/pb_kits/playbook/pb_selectable_list/_selectable_list.scss

@@ -8,7 +8,7 @@
       background-color: $bg_light;
     }
     &[class*=checked_item] {
-      background-color: $bg_light;
+      background-color: $active_light;
     }
   }
   [class^=pb_radio_kit] {

data/app/pb_kits/playbook/pb_test/_test.scss

@@ -0,0 +1,3 @@
+.pb_test {
+
+}

data/app/pb_kits/playbook/pb_test/_test.tsx

@@ -0,0 +1,41 @@
+
+
+/* @flow */
+
+import React from 'react'
+import classnames from 'classnames'
+import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
+import { globalProps } from '../utilities/globalProps'
+
+type TestProps = {
+  aria?: { [key: string]: string },
+  className?: string,
+  data?: { [key: string]: string },
+  id?: string,
+}
+
+const Test = (props: TestProps) => {
+  const {
+    aria = {},
+  className,
+  data = {},
+  id,
+  } = props
+
+  const ariaProps = buildAriaProps(aria)
+  const dataProps = buildDataProps(data)
+  const classes = classnames(buildCss('pb_test'), globalProps(props), className)
+
+  return (
+    <div
+        {...ariaProps}
+        {...dataProps}
+        className={classes}
+        id={id}
+    >
+      {className}
+    </div>
+  )
+}
+
+export default Test

data/app/pb_kits/playbook/pb_test/docs/_test_default.html.erb

@@ -0,0 +1 @@
+<%= pb_rails("test") %>

data/app/pb_kits/playbook/pb_test/docs/_test_default.jsx

@@ -0,0 +1,12 @@
+import React from 'react'
+import Test from '../_Test'
+
+const TestDefault = (props) => (
+  <div>
+    <Test
+      {...props}
+    />
+  </div>
+)
+
+export default TestDefault

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

@@ -0,0 +1,9 @@
+examples:
+  
+  rails:
+  - test_default: Default
+  
+  
+  react:
+  - test_default: Default
+  

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

@@ -0,0 +1 @@
+export { default as TestDefault } from './_test_default.jsx'

data/app/pb_kits/playbook/pb_test/test.html.erb

@@ -0,0 +1,7 @@
+<%= content_tag(:div,
+    aria: object.aria,
+    class: object.classname,
+    data: object.data,
+    id: object.id) do %>
+  <span>TEST CONTENT</span>
+<% end %>

data/app/pb_kits/playbook/pb_test/test.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Playbook
+  module PbTest
+    class Test < ::Playbook::KitBase
+    end
+  end
+end

data/app/pb_kits/playbook/pb_test/test.test.jsx

@@ -0,0 +1,17 @@
+import { ensureAccessible, renderKit } from '../utilities/test-utils'
+
+import { Test } from '../'
+
+/* See these resources for more testing info:
+  - https://github.com/testing-library/jest-dom#usage for useage and examples
+  - https://jestjs.io/docs/en/using-matchers
+*/
+
+test('generated scaffold test - update me', () => {
+  const props = {
+    data: { testid: 'default' }
+  }
+
+  const kit = renderKit(Test , props)
+  expect(kit).toBeInTheDocument()
+})

data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss

@@ -183,6 +183,10 @@
   }
  
   .typeahead-kit-select__menu {
+    .typeahead-kit-select__menu-list {
+      padding: 0;
+    }
+
     .typeahead-kit-select__option {
       &.typeahead-kit-select__option--is-focused {
         background-color: $hover_light;

data/app/pb_kits/playbook/playbook-rails-react-bindings.js

@@ -17,6 +17,7 @@ import Passphrase from './pb_passphrase/_passphrase'
 import RichTextEditor from './pb_rich_text_editor/_rich_text_editor'
 import TreemapChart from './pb_treemap_chart/_treemap_chart'
 import Typeahead from './pb_typeahead/_typeahead'
+import PhoneNumberInput from './pb_phone_number_input/_phone_number_input'
 
 WebpackerReact.registerComponents({
   BarGraph,
@@ -33,6 +34,7 @@ WebpackerReact.registerComponents({
   TreemapChart,
   Typeahead,
   Gauge,
+  PhoneNumberInput
 })
 
 ujs.setup(

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "12.4.0"
-  VERSION = "12.4.0.pre.alpha.map1"
+  PREVIOUS_VERSION = "12.5.0"
+  VERSION = "12.5.0.pre.alpha.datepicker1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 12.4.0.pre.alpha.map1
+  version: 12.5.0.pre.alpha.datepicker1
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-02-24 00:00:00.000000000 Z
+date: 2023-03-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -332,6 +332,15 @@ files:
 - app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml
 - app/pb_kits/playbook/pb_avatar_action_button/docs/index.js
 - app/pb_kits/playbook/pb_avatar_action_button/pb_avatar_action_button.test.js
+- app/pb_kits/playbook/pb_awesome/_awesome.scss
+- app/pb_kits/playbook/pb_awesome/_awesome.tsx
+- app/pb_kits/playbook/pb_awesome/awesome.html.erb
+- app/pb_kits/playbook/pb_awesome/awesome.rb
+- app/pb_kits/playbook/pb_awesome/awesome.test.jsx
+- app/pb_kits/playbook/pb_awesome/docs/_awesome_default.html.erb
+- app/pb_kits/playbook/pb_awesome/docs/_awesome_default.jsx
+- app/pb_kits/playbook/pb_awesome/docs/example.yml
+- app/pb_kits/playbook/pb_awesome/docs/index.js
 - app/pb_kits/playbook/pb_background/_background.scss
 - app/pb_kits/playbook/pb_background/_background.tsx
 - app/pb_kits/playbook/pb_background/background.html.erb
@@ -635,6 +644,24 @@ files:
 - app/pb_kits/playbook/pb_contact/docs/_description.md
 - app/pb_kits/playbook/pb_contact/docs/example.yml
 - app/pb_kits/playbook/pb_contact/docs/index.js
+- app/pb_kits/playbook/pb_cool/_cool.scss
+- app/pb_kits/playbook/pb_cool/_cool.tsx
+- app/pb_kits/playbook/pb_cool/cool.html.erb
+- app/pb_kits/playbook/pb_cool/cool.rb
+- app/pb_kits/playbook/pb_cool/cool.test.jsx
+- app/pb_kits/playbook/pb_cool/docs/_cool_default.html.erb
+- app/pb_kits/playbook/pb_cool/docs/_cool_default.jsx
+- app/pb_kits/playbook/pb_cool/docs/example.yml
+- app/pb_kits/playbook/pb_cool/docs/index.js
+- app/pb_kits/playbook/pb_coolness/_coolness.scss
+- app/pb_kits/playbook/pb_coolness/_coolness.tsx
+- app/pb_kits/playbook/pb_coolness/coolness.html.erb
+- app/pb_kits/playbook/pb_coolness/coolness.rb
+- app/pb_kits/playbook/pb_coolness/coolness.test.jsx
+- app/pb_kits/playbook/pb_coolness/docs/_coolness_default.html.erb
+- app/pb_kits/playbook/pb_coolness/docs/_coolness_default.jsx
+- app/pb_kits/playbook/pb_coolness/docs/example.yml
+- app/pb_kits/playbook/pb_coolness/docs/index.js
 - app/pb_kits/playbook/pb_currency/_currency.scss
 - app/pb_kits/playbook/pb_currency/_currency.tsx
 - app/pb_kits/playbook/pb_currency/currency.html.erb
@@ -754,6 +781,7 @@ files:
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_flatpickr_styles.scss
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_header_styles.scss
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_inline_styles.scss
+- app/pb_kits/playbook/pb_date_picker/sass_partials/_input_styles.scss
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_month_and_year_styles.scss
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_overrides.scss
 - app/pb_kits/playbook/pb_date_picker/sass_partials/_time_selection_styles.scss
@@ -1379,8 +1407,8 @@ files:
 - app/pb_kits/playbook/pb_list/item.rb
 - app/pb_kits/playbook/pb_list/list.html.erb
 - app/pb_kits/playbook/pb_list/list.rb
-- app/pb_kits/playbook/pb_loading_inline/_loading_inline.jsx
 - app/pb_kits/playbook/pb_loading_inline/_loading_inline.scss
+- app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx
 - app/pb_kits/playbook/pb_loading_inline/docs/_description.md
 - app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_light.html.erb
 - app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_light.jsx
@@ -1388,6 +1416,7 @@ files:
 - app/pb_kits/playbook/pb_loading_inline/docs/index.js
 - app/pb_kits/playbook/pb_loading_inline/loading_inline.html.erb
 - app/pb_kits/playbook/pb_loading_inline/loading_inline.rb
+- app/pb_kits/playbook/pb_loading_inline/loading_inline.test.js
 - app/pb_kits/playbook/pb_logistic/_logistic.jsx
 - app/pb_kits/playbook/pb_map/_map.scss
 - app/pb_kits/playbook/pb_map/_map.tsx
@@ -1399,8 +1428,8 @@ files:
 - app/pb_kits/playbook/pb_map/docs/index.js
 - app/pb_kits/playbook/pb_map/map.test.jsx
 - app/pb_kits/playbook/pb_map/pbMapTheme.ts
-- app/pb_kits/playbook/pb_message/_message.jsx
 - app/pb_kits/playbook/pb_message/_message.scss
+- app/pb_kits/playbook/pb_message/_message.tsx
 - app/pb_kits/playbook/pb_message/_message_mixins.scss
 - app/pb_kits/playbook/pb_message/docs/_description.md
 - app/pb_kits/playbook/pb_message/docs/_footer.md
@@ -1413,6 +1442,7 @@ files:
 - app/pb_kits/playbook/pb_message/docs/index.js
 - app/pb_kits/playbook/pb_message/message.html.erb
 - app/pb_kits/playbook/pb_message/message.rb
+- app/pb_kits/playbook/pb_message/message.test.js
 - app/pb_kits/playbook/pb_multiple_users/_multiple_users.jsx
 - app/pb_kits/playbook/pb_multiple_users/_multiple_users.scss
 - app/pb_kits/playbook/pb_multiple_users/docs/_description.md
@@ -1497,8 +1527,8 @@ files:
 - app/pb_kits/playbook/pb_pagination/docs/example.yml
 - app/pb_kits/playbook/pb_pagination/pagination.html.erb
 - app/pb_kits/playbook/pb_pagination/pagination.rb
-- app/pb_kits/playbook/pb_passphrase/_passphrase.jsx
 - app/pb_kits/playbook/pb_passphrase/_passphrase.scss
+- app/pb_kits/playbook/pb_passphrase/_passphrase.tsx
 - app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.html.erb
 - app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.jsx
 - app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.md
@@ -1554,18 +1584,25 @@ files:
 - app/pb_kits/playbook/pb_person_contact/docs/index.js
 - app/pb_kits/playbook/pb_person_contact/person_contact.html.erb
 - app/pb_kits/playbook/pb_person_contact/person_contact.rb
+- app/pb_kits/playbook/pb_phone_number_input/PhoneNumberHelper.js
 - app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.scss
 - app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx
+- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.md
+- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.md
+- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_only_countries.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_only_countries.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_only_countries.md
+- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.md
 - app/pb_kits/playbook/pb_phone_number_input/docs/example.yml
 - app/pb_kits/playbook/pb_phone_number_input/docs/index.js
+- app/pb_kits/playbook/pb_phone_number_input/phone_number_input.html.erb
+- app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb
 - app/pb_kits/playbook/pb_phone_number_input/phone_number_input.test.js
 - app/pb_kits/playbook/pb_phone_number_input/types.d.ts
 - app/pb_kits/playbook/pb_pill/_pill.scss
@@ -1951,6 +1988,15 @@ files:
 - app/pb_kits/playbook/pb_table/table.test.js
 - app/pb_kits/playbook/pb_table/table_row.html.erb
 - app/pb_kits/playbook/pb_table/table_row.rb
+- app/pb_kits/playbook/pb_test/_test.scss
+- app/pb_kits/playbook/pb_test/_test.tsx
+- app/pb_kits/playbook/pb_test/docs/_test_default.html.erb
+- app/pb_kits/playbook/pb_test/docs/_test_default.jsx
+- app/pb_kits/playbook/pb_test/docs/example.yml
+- app/pb_kits/playbook/pb_test/docs/index.js
+- app/pb_kits/playbook/pb_test/test.html.erb
+- app/pb_kits/playbook/pb_test/test.rb
+- app/pb_kits/playbook/pb_test/test.test.jsx
 - app/pb_kits/playbook/pb_text_input/_text_input.scss
 - app/pb_kits/playbook/pb_text_input/_text_input.tsx
 - app/pb_kits/playbook/pb_text_input/add_on.html.erb

data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.jsx

@@ -1,37 +0,0 @@
-/* @flow */
-
-import React from 'react'
-import classnames from 'classnames'
-
-import { globalProps } from '../utilities/globalProps'
-
-import Body from '../pb_body/_body'
-import Icon from '../pb_icon/_icon'
-type LoadingInlineProps = {
-  align?: "left" | "center" | "right",
-  className?: string,
-  dark?: boolean,
-  data?: string,
-  id?: string,
-}
-
-const LoadingInline = (props: LoadingInlineProps) => {
-  const { align = 'left' } = props
-  return (
-    <div
-        className={classnames(`pb_loading_inline_kit_${align}`, globalProps(props))}
-    >
-      <Body color="light">
-        <Icon
-            aria={{ label: 'loading icon' }}
-            fixedWidth
-            icon="spinner"
-            pulse
-        />
-        {' Loading'}
-      </Body>
-    </div>
-  )
-}
-
-export default LoadingInline