playbook_ui 14.12.0.pre.alpha.PBNTR834advtablemaxHeightstickyheader5932 → 14.12.0.pre.alpha.PBNTR8335887

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +1 -52
  3. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +0 -3
  4. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx +0 -1
  5. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md +1 -3
  6. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -1
  7. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +1 -2
  8. data/app/pb_kits/playbook/pb_copy_button/_copy_button.scss +1 -2
  9. data/app/pb_kits/playbook/pb_copy_button/docs/example.yml +3 -3
  10. data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx +11 -7
  11. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.html.erb +11 -0
  12. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.jsx +22 -0
  13. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_rails.md +1 -0
  14. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_react.md +1 -0
  15. data/app/pb_kits/playbook/pb_home_address_street/docs/example.yml +2 -0
  16. data/app/pb_kits/playbook/pb_home_address_street/docs/index.js +1 -0
  17. data/app/pb_kits/playbook/pb_home_address_street/home_address_street.rb +11 -2
  18. data/app/pb_kits/playbook/pb_link/_link.tsx +0 -18
  19. data/app/pb_kits/playbook/pb_link/docs/example.yml +3 -5
  20. data/app/pb_kits/playbook/pb_link/docs/index.js +1 -2
  21. data/app/pb_kits/playbook/pb_link/link.html.erb +1 -1
  22. data/app/pb_kits/playbook/pb_link/link.rb +0 -6
  23. data/app/pb_kits/playbook/pb_link/link.test.jsx +0 -30
  24. data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tooltip.html.erb +6 -6
  25. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb +1 -1
  26. data/app/pb_kits/playbook/pb_tooltip/index.js +27 -45
  27. data/app/pb_kits/playbook/pb_tooltip/tooltip.rb +1 -5
  28. data/dist/chunks/{_typeahead-CkemExmL.js → _typeahead-W0hatdPs.js} +1 -1
  29. data/dist/chunks/_weekday_stacked-Be4uzzgn.js +45 -0
  30. data/dist/chunks/{lib-DjpLC8uO.js → lib-kMuhBuU7.js} +1 -1
  31. data/dist/chunks/{pb_form_validation-S56UaHZl.js → pb_form_validation-DBJ0wZuS.js} +1 -1
  32. data/dist/chunks/vendor.js +1 -1
  33. data/dist/menu.yml +2 -2
  34. data/dist/playbook-doc.js +1 -1
  35. data/dist/playbook-rails-react-bindings.js +1 -1
  36. data/dist/playbook-rails.js +1 -1
  37. data/dist/playbook.css +1 -1
  38. data/lib/playbook/version.rb +1 -1
  39. metadata +10 -15
  40. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx +0 -55
  41. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md +0 -3
  42. data/app/pb_kits/playbook/pb_copy_button/copy_button.html.erb +0 -15
  43. data/app/pb_kits/playbook/pb_copy_button/copy_button.rb +0 -28
  44. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.html.erb +0 -2
  45. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.html.erb +0 -5
  46. data/app/pb_kits/playbook/pb_copy_button/index.js +0 -47
  47. data/app/pb_kits/playbook/pb_link/docs/_link_target.html.erb +0 -15
  48. data/app/pb_kits/playbook/pb_link/docs/_link_target.jsx +0 -29
  49. data/dist/chunks/_weekday_stacked-DiNLeUtf.js +0 -45
@@ -1,4 +1,5 @@
1
1
  import PbEnhancedElement from '../pb_enhanced_element'
2
+
2
3
  import {
3
4
  createPopperLite as createPopper,
4
5
  flip,
@@ -16,34 +17,27 @@ export default class PbTooltip extends PbEnhancedElement {
16
17
 
17
18
  connect() {
18
19
  this.triggerElements.forEach((trigger) => {
19
- const method = this.triggerMethod
20
-
21
- if (method === 'click') {
22
- trigger.addEventListener('click', () => {
20
+ trigger.addEventListener('mouseenter', () => {
21
+ this.mouseenterTimeout = setTimeout(() => {
23
22
  this.showTooltip(trigger)
24
- })
25
- } else {
26
- trigger.addEventListener('mouseenter', () => {
27
- this.mouseenterTimeout = setTimeout(() => {
28
- this.showTooltip(trigger)
29
- this.checkCloseTooltip(trigger)
30
- }, TOOLTIP_TIMEOUT)
31
-
32
- trigger.addEventListener('mouseleave', () => {
33
- clearTimeout(this.mouseenterTimeout)
34
- setTimeout(() => {
35
- this.hideTooltip()
36
- }, 0)
37
- }, { once: true })
38
- })
39
-
40
- this.tooltip.addEventListener('mouseenter', () => {
23
+ this.checkCloseTooltip(trigger)
24
+ }, TOOLTIP_TIMEOUT)
25
+
26
+ trigger.addEventListener('mouseleave', () => {
41
27
  clearTimeout(this.mouseenterTimeout)
42
- })
43
- this.tooltip.addEventListener('mouseleave', () => {
44
- this.hideTooltip()
45
- })
46
- }
28
+
29
+ setTimeout(() => {
30
+ this.hideTooltip()
31
+ }, 0)
32
+ }, { once: true })
33
+ })
34
+ })
35
+
36
+ this.tooltip.addEventListener('mouseenter', () => {
37
+ clearTimeout(this.mouseenterTimeout)
38
+ })
39
+ this.tooltip.addEventListener('mouseleave', () => {
40
+ this.hideTooltip()
47
41
  })
48
42
  }
49
43
 
@@ -60,7 +54,7 @@ export default class PbTooltip extends PbEnhancedElement {
60
54
  }
61
55
 
62
56
  showTooltip(trigger) {
63
- if (this.shouldShowTooltip === 'false') return
57
+ if (this.shouldShowTooltip === "false") return
64
58
 
65
59
  this.popper = createPopper(trigger, this.tooltip, {
66
60
  placement: this.position,
@@ -84,13 +78,6 @@ export default class PbTooltip extends PbEnhancedElement {
84
78
  ],
85
79
  })
86
80
  this.tooltip.classList.add('show')
87
-
88
- if (this.triggerMethod === 'click') {
89
- clearTimeout(this.autoHideTimeout)
90
- this.autoHideTimeout = setTimeout(() => {
91
- this.hideTooltip()
92
- }, 1000)
93
- }
94
81
  }
95
82
 
96
83
  hideTooltip() {
@@ -107,26 +94,25 @@ export default class PbTooltip extends PbEnhancedElement {
107
94
  let triggerEl
108
95
 
109
96
  if (this.triggerElementId) {
110
- triggerEl = document.querySelector(`#${this.triggerElementId}`)
97
+ triggerEl = document.querySelector(`#${this.triggerElementId}`) //deprecated
111
98
  } else {
112
99
  const selectorIsId = this.triggerElementSelector.indexOf('#') > -1
113
- triggerEl = selectorIsId
114
- ? document.querySelector(`${this.triggerElementSelector}`)
115
- : document.querySelectorAll(`${this.triggerElementSelector}`)
100
+ triggerEl = selectorIsId ? document.querySelector(`${this.triggerElementSelector}`) :
101
+ document.querySelectorAll(`${this.triggerElementSelector}`)
116
102
  }
117
103
 
118
104
  if (!triggerEl) {
105
+ /* eslint no-console: ["error", { allow: ["warn", "error"] }] */
119
106
  console.error('Tooltip Kit: an invalid or unavailable DOM reference was provided!')
120
107
  return []
121
108
  }
122
109
 
123
110
  if (!triggerEl.length) triggerEl = [triggerEl]
124
- return (this._triggerElements = this._triggerElements || triggerEl)
111
+ return this._triggerElements = (this._triggerElements || triggerEl)
125
112
  }
126
113
 
127
114
  get tooltip() {
128
- return (this._tooltip =
129
- this._tooltip || this.element.querySelector(`#${this.tooltipId}`))
115
+ return this._tooltip = (this._tooltip || this.element.querySelector(`#${this.tooltipId}`))
130
116
  }
131
117
 
132
118
  get position() {
@@ -148,8 +134,4 @@ export default class PbTooltip extends PbEnhancedElement {
148
134
  get shouldShowTooltip() {
149
135
  return this.element.dataset.pbTooltipShowTooltip
150
136
  }
151
-
152
- get triggerMethod() {
153
- return this.element.dataset.pbTooltipTriggerMethod || 'hover'
154
- }
155
137
  }
@@ -9,9 +9,6 @@ module Playbook
9
9
  prop :tooltip_id
10
10
  prop :dark, type: Playbook::Props::Boolean,
11
11
  default: false
12
- prop :trigger_method, type: Playbook::Props::Enum,
13
- values: %w[hover click],
14
- default: "hover"
15
12
 
16
13
  def classname
17
14
  generate_classname("pb_tooltip_kit", dark_class)
@@ -24,8 +21,7 @@ module Playbook
24
21
  pb_tooltip_trigger_element_selector: trigger_element_selector,
25
22
  pb_tooltip_trigger_element_id: trigger_element_id,
26
23
  pb_tooltip_tooltip_id: tooltip_id,
27
- pb_tooltip_show_tooltip: true,
28
- pb_tooltip_trigger_method: trigger_method
24
+ pb_tooltip_show_tooltip: true
29
25
  )
30
26
  end
31
27
 
@@ -1,4 +1,4 @@
1
- import{jsx as jsx$1,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useReducer,useEffect,useMemo,useContext,useRef,createElement,useState,useLayoutEffect,forwardRef,useCallback,useImperativeHandle,Component,Fragment as Fragment$1}from"react";import{r as getDefaultExportFromCjs,x as filter,y as omit,u as useCollapsible,z as get,j as getAllIcons,q as commonjsGlobal,w as colors$1,t as highchartsTheme,A as merge,s as highchartsDarkTheme,B as getAugmentedNamespace,C as createPopper,E as uniqueId,F as typography,G as cloneDeep,H as isString}from"./lib-DjpLC8uO.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";import{TrixEditor}from"react-trix";import Trix from"trix";import require$$0 from"react-is";const initialState={items:[],dragData:{id:"",initialGroup:""},isDragging:"",activeContainer:""};const reducer=(state,action)=>{switch(action.type){case"SET_ITEMS":return Object.assign(Object.assign({},state),{items:action.payload});case"SET_DRAG_DATA":return Object.assign(Object.assign({},state),{dragData:action.payload});case"SET_IS_DRAGGING":return Object.assign(Object.assign({},state),{isDragging:action.payload});case"SET_ACTIVE_CONTAINER":return Object.assign(Object.assign({},state),{activeContainer:action.payload});case"CHANGE_CATEGORY":return Object.assign(Object.assign({},state),{items:state.items.map((item=>item.id===action.payload.itemId?Object.assign(Object.assign({},item),{container:action.payload.container}):item))});case"REORDER_ITEMS":{const{dragId:dragId,targetId:targetId}=action.payload;const newItems=[...state.items];const draggedItem=newItems.find((item=>item.id===dragId));const draggedIndex=newItems.indexOf(draggedItem);const targetIndex=newItems.findIndex((item=>item.id===targetId));newItems.splice(draggedIndex,1);newItems.splice(targetIndex,0,draggedItem);return Object.assign(Object.assign({},state),{items:newItems})}default:return state}};const DragContext=createContext({});const DraggableContext=()=>useContext(DragContext);const DraggableProvider=({children:children,initialItems:initialItems,onReorder:onReorder,onDragStart:onDragStart,onDragEnter:onDragEnter,onDragEnd:onDragEnd,onDrop:onDrop,onDragOver:onDragOver})=>{const[state,dispatch]=useReducer(reducer,initialState);useEffect((()=>{dispatch({type:"SET_ITEMS",payload:initialItems})}),[initialItems]);useEffect((()=>{onReorder(state.items)}),[state.items]);const handleDragStart=(id,container)=>{dispatch({type:"SET_DRAG_DATA",payload:{id:id,initialGroup:container}});dispatch({type:"SET_IS_DRAGGING",payload:id});if(onDragStart)onDragStart(id,container)};const handleDragEnter=(id,container)=>{if(state.dragData.id!==id){dispatch({type:"REORDER_ITEMS",payload:{dragId:state.dragData.id,targetId:id}});dispatch({type:"SET_DRAG_DATA",payload:{id:state.dragData.id,initialGroup:container}})}if(onDragEnter)onDragEnter(id,container)};const handleDragEnd=()=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});if(onDragEnd)onDragEnd()};const changeCategory=(itemId,container)=>{dispatch({type:"CHANGE_CATEGORY",payload:{itemId:itemId,container:container}})};const handleDrop=container=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});changeCategory(state.dragData.id,container);if(onDrop)onDrop(container)};const handleDragOver=(e,container)=>{e.preventDefault();dispatch({type:"SET_ACTIVE_CONTAINER",payload:container});if(onDragOver)onDragOver(e,container)};const contextValue=useMemo((()=>({items:state.items,dragData:state.dragData,isDragging:state.isDragging,activeContainer:state.activeContainer,handleDragStart:handleDragStart,handleDragEnter:handleDragEnter,handleDragEnd:handleDragEnd,handleDrop:handleDrop,handleDragOver:handleDragOver})),[state]);return jsx$1(DragContext.Provider,Object.assign({value:contextValue},{children:children}),void 0)};var classnames$1={exports:{}};
1
+ import{jsx as jsx$1,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useReducer,useEffect,useMemo,useContext,useRef,createElement,useState,useLayoutEffect,forwardRef,useCallback,useImperativeHandle,Component,Fragment as Fragment$1}from"react";import{r as getDefaultExportFromCjs,x as filter,y as omit,u as useCollapsible,z as get,j as getAllIcons,q as commonjsGlobal,w as colors$1,t as highchartsTheme,A as merge,s as highchartsDarkTheme,B as getAugmentedNamespace,C as createPopper,E as uniqueId,F as typography,G as cloneDeep,H as isString}from"./lib-kMuhBuU7.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";import{TrixEditor}from"react-trix";import Trix from"trix";import require$$0 from"react-is";const initialState={items:[],dragData:{id:"",initialGroup:""},isDragging:"",activeContainer:""};const reducer=(state,action)=>{switch(action.type){case"SET_ITEMS":return Object.assign(Object.assign({},state),{items:action.payload});case"SET_DRAG_DATA":return Object.assign(Object.assign({},state),{dragData:action.payload});case"SET_IS_DRAGGING":return Object.assign(Object.assign({},state),{isDragging:action.payload});case"SET_ACTIVE_CONTAINER":return Object.assign(Object.assign({},state),{activeContainer:action.payload});case"CHANGE_CATEGORY":return Object.assign(Object.assign({},state),{items:state.items.map((item=>item.id===action.payload.itemId?Object.assign(Object.assign({},item),{container:action.payload.container}):item))});case"REORDER_ITEMS":{const{dragId:dragId,targetId:targetId}=action.payload;const newItems=[...state.items];const draggedItem=newItems.find((item=>item.id===dragId));const draggedIndex=newItems.indexOf(draggedItem);const targetIndex=newItems.findIndex((item=>item.id===targetId));newItems.splice(draggedIndex,1);newItems.splice(targetIndex,0,draggedItem);return Object.assign(Object.assign({},state),{items:newItems})}default:return state}};const DragContext=createContext({});const DraggableContext=()=>useContext(DragContext);const DraggableProvider=({children:children,initialItems:initialItems,onReorder:onReorder,onDragStart:onDragStart,onDragEnter:onDragEnter,onDragEnd:onDragEnd,onDrop:onDrop,onDragOver:onDragOver})=>{const[state,dispatch]=useReducer(reducer,initialState);useEffect((()=>{dispatch({type:"SET_ITEMS",payload:initialItems})}),[initialItems]);useEffect((()=>{onReorder(state.items)}),[state.items]);const handleDragStart=(id,container)=>{dispatch({type:"SET_DRAG_DATA",payload:{id:id,initialGroup:container}});dispatch({type:"SET_IS_DRAGGING",payload:id});if(onDragStart)onDragStart(id,container)};const handleDragEnter=(id,container)=>{if(state.dragData.id!==id){dispatch({type:"REORDER_ITEMS",payload:{dragId:state.dragData.id,targetId:id}});dispatch({type:"SET_DRAG_DATA",payload:{id:state.dragData.id,initialGroup:container}})}if(onDragEnter)onDragEnter(id,container)};const handleDragEnd=()=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});if(onDragEnd)onDragEnd()};const changeCategory=(itemId,container)=>{dispatch({type:"CHANGE_CATEGORY",payload:{itemId:itemId,container:container}})};const handleDrop=container=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});changeCategory(state.dragData.id,container);if(onDrop)onDrop(container)};const handleDragOver=(e,container)=>{e.preventDefault();dispatch({type:"SET_ACTIVE_CONTAINER",payload:container});if(onDragOver)onDragOver(e,container)};const contextValue=useMemo((()=>({items:state.items,dragData:state.dragData,isDragging:state.isDragging,activeContainer:state.activeContainer,handleDragStart:handleDragStart,handleDragEnter:handleDragEnter,handleDragEnd:handleDragEnd,handleDrop:handleDrop,handleDragOver:handleDragOver})),[state]);return jsx$1(DragContext.Provider,Object.assign({value:contextValue},{children:children}),void 0)};var classnames$1={exports:{}};
2
2
  /*!
3
3
  Copyright (c) 2018 Jed Watson.
4
4
  Licensed under the MIT License (MIT), see