playbook_ui 14.5.0.pre.alpha.PLAY1510railsformloading3977 → 14.5.0.pre.alpha.javascriptassets3926

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bf97291ca286d337161542d77a3d67b92ef889233fecf197ea5c3a53e081064b
-  data.tar.gz: 07c2d8774e6deb985b4faafddb225e8e34e3c1f557970082451f37c5807a3dae
+  metadata.gz: 0b893820d516fe98da09e06b94c9b3ebf312eeccfa42a8c3a59ae9426f9c0feb
+  data.tar.gz: 48bc0867779db4526810edf8716d95944f5c0bf81409d154a31d933a40f1b853
 SHA512:
-  metadata.gz: 48dc3ea53f09320edef603c1ef036d90d4db4b5d5ba7692d6b9baa69d65c22081ef13877401c76b30e8bc7117da2a92bb42956374f7ddc894d15b1f865968315
-  data.tar.gz: d14f6ceda05a81b1c020b541778c2bc9a8652a6ed208d810a9fb53477ee8d57489843d8519f4380dc3fcf862ab197d673cd14e3c6ba34e2299ec39d1fa79aea0
+  metadata.gz: 0b9d16196a6b1d5062f8289b1a14e8959dac6b073c831e9ad74b6be9972a01fa047ab7668eeb2e33a19d39ce209d60704ce4d8e82f369af6cb63a10f954401fb
+  data.tar.gz: d04022c85a0dcc86453e28d2fbf8fa629fde3a2b95986dc30afaa857c64ba860743640192d265bff56d07a4910caa63ab00699619eab9a7026244a6a241a7176

data/app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.html.erb

@@ -1,36 +1,13 @@
 <%= pb_rails("button", props: { text: "Open Dialog", data: {"open-dialog": "dialog-loading"} }) %>
 
-<%= pb_rails("dialog", props: {
-    id:"dialog-loading",
-    size: "sm",
-    title: "Loading Example",
-    text: "Make a loading request?",
-    cancel_button: "Cancel Button",
+<%= pb_rails("dialog", props: { 
+    id:"dialog-loading", 
+    size: "sm", 
+    title: "Loading Exmaple", 
+    text: "Make a loading request?", 
+    cancel_button: "Cancel Button", 
     cancel_button_id: "cancel-button-loading",
-    confirm_button: "Okay",
+    confirm_button: "Okay", 
     confirm_button_id: "confirm-button-loading",
     loading: true,
 }) %>
-
-<script>
-    const loadingButton = document.querySelector('[data-disable-with="Loading"]');
-    if (loadingButton) {
-        loadingButton.addEventListener("click", function() {
-        const okayLoadingButton = document.querySelector('[data-disable-with="Loading"]');
-        const cancelButton = document.querySelector('[data-disable-cancel-with="Loading"]');
-        let currentClass = okayLoadingButton.className;
-        let cancelClass = cancelButton ? cancelButton.className : "";
-
-        setTimeout(function() {
-            okayLoadingButton.disabled = false;
-            okayLoadingButton.className = currentClass.replace("_disabled_loading", "_enabled");
-
-            if (cancelButton) {
-            cancelButton.disabled = false;
-            cancelButton.className = cancelClass.replace("_disabled", "_enabled");
-            }
-        }, 5000);
-
-        });
-  }
-</script>

data/app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.md

@@ -1 +1,3 @@
 Pressing the "Okay" button will trigger a loading state where the button content is replaced by a spinner icon and both buttons are disabled.
+
+Currently, the loading state cannot be undone and will require a page refresh to reset the dialog.

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

@@ -3,4 +3,3 @@ examples:
   rails:
   - form_form_with: Default
   - form_form_with_validate: Default + Validation
-  - form_form_with_loading: Default + Loading

data/app/pb_kits/playbook/pb_form/form.rb

@@ -7,7 +7,6 @@ module Playbook
                          type: Playbook::Props::Base
       prop :form_system_options, deprecated: "Use options instead",
                                  type: Playbook::Props::Base
-      prop :loading, type: Playbook::Props::Boolean, default: false
       prop :options, type: Playbook::Props::Base
       prop :validate, type: Playbook::Props::Boolean, default: false
 
@@ -23,7 +22,6 @@ module Playbook
           aria: aria,
           class: classname,
           data: data,
-          loading: loading,
           validate: validate,
         }.merge(prop(:options) || prop(:form_system_options) || {})
       end

data/app/pb_kits/playbook/pb_form_pill/_form_pill.tsx

@@ -47,13 +47,9 @@ const FormPill = (props: FormPillProps): React.ReactElement => {
 
   const iconClass = icon ? "_icon" : ""
   const closeIconSize = size === "small" ? "xs" : "sm"
-
-  const filteredProps: FormPillProps = {...props}
-  delete filteredProps.truncate
-
   const css = classnames(
     `pb_form_pill_kit_${color}${iconClass}`,
-    globalProps(filteredProps),
+    globalProps(props),
     className,
     size === 'small' ? 'small' : null,
     textTransform,
@@ -81,7 +77,6 @@ const FormPill = (props: FormPillProps): React.ReactElement => {
               className="pb_form_pill_text"
               size={4}
               text={name}
-              truncate={props.truncate}
           />
         </>
       )}
@@ -97,7 +92,6 @@ const FormPill = (props: FormPillProps): React.ReactElement => {
               className="pb_form_pill_text"
               size={4}
               text={name}
-              truncate={props.truncate}
           />
           <Icon
               className="pb_form_pill_icon"
@@ -117,7 +111,6 @@ const FormPill = (props: FormPillProps): React.ReactElement => {
               className="pb_form_pill_tag"
               size={4}
               text={text}
-              truncate={props.truncate}
           />
         </>
       )}
@@ -126,7 +119,6 @@ const FormPill = (props: FormPillProps): React.ReactElement => {
             className="pb_form_pill_tag"
             size={4}
             text={text}
-            truncate={props.truncate}
         />
       )}
       <div

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

@@ -3,7 +3,6 @@ examples:
   rails:
   - form_pill_user: Form Pill User
   - form_pill_size: Form Pill Size
-  - form_pill_truncated_text: Truncated Text
   - form_pill_tag: Form Pill Tag
   - form_pill_example: Example
   - form_pill_icon: Form Pill Icon
@@ -12,7 +11,6 @@ examples:
   react:
   - form_pill_user: Form Pill User
   - form_pill_size: Form Pill Size
-  - form_pill_truncated_text: Truncated Text
   - form_pill_tag: Form Pill Tag
   - form_pill_example: Example
   - form_pill_icon: Form Pill Icon

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

@@ -4,4 +4,3 @@ export { default as FormPillTag } from './_form_pill_tag.jsx'
 export { default as FormPillExample } from './_form_pill_example.jsx'
 export { default as FormPillIcon } from './_form_pill_icon.jsx'
 export { default as FormPillColors } from './_form_pill_colors.jsx'
-export { default as FormPillTruncatedText } from './_form_pill_truncated_text.jsx'

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

@@ -136,15 +136,12 @@ const Typeahead = ({
     }
   }
 
-  const filteredProps: TypeaheadProps = {...props}
-  delete filteredProps.truncate
-
   const dataProps = buildDataProps(data)
   const htmlProps = buildHtmlProps(htmlOptions)
   const classes = classnames(
     'pb_typeahead_kit react-select',
     `mb_${marginBottom}`,
-    globalProps(filteredProps),
+    globalProps(props),
     className
   )
 

data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx

@@ -16,7 +16,7 @@ type Props = {
 const MultiValue = (props: Props) => {
   const { removeProps } = props
   const { imageUrl, label } = props.data
-  const { dark, multiKit, pillColor, truncate } = props.selectProps
+  const { dark, multiKit, pillColor } = props.selectProps
 
   const formPillProps = {
     marginRight: 'xs',
@@ -51,7 +51,6 @@ const MultiValue = (props: Props) => {
             name={label}
             size={multiKit === 'smallPill' ? 'small' : ''}
             text=''
-            truncate={truncate}
             {...props}
         />
       }
@@ -65,7 +64,6 @@ const MultiValue = (props: Props) => {
             name=''
             size={multiKit === 'smallPill' ? 'small' : ''}
             text={label}
-            truncate={truncate}
             {...props}
         />
       }

data/app/pb_kits/playbook/pb_typeahead/typeahead.rb

@@ -65,10 +65,10 @@ module Playbook
       def typeahead_react_options
         base_options = {
           className: classname,
+          pillColor: pill_color,
           dark: dark,
           defaultValue: default_options,
           error: error,
-          htmlOptions: html_options,
           id: id,
           inline: inline,
           isMulti: is_multi,
@@ -77,10 +77,8 @@ module Playbook
           multiKit: multi_kit,
           name: name,
           options: options,
-          pillColor: pill_color,
           placeholder: placeholder,
           plusIcon: plus_icon,
-          truncate: truncate,
         }
 
         base_options[:getOptionLabel] = get_option_label if get_option_label.present?