playbook_ui 14.12.0.pre.alpha.PBNTR834advtablemaxHeightstickyheader5932 → 14.12.0.pre.alpha.PBNTR8335887
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +1 -52
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +0 -3
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md +1 -3
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_copy_button/_copy_button.scss +1 -2
- data/app/pb_kits/playbook/pb_copy_button/docs/example.yml +3 -3
- data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx +11 -7
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.html.erb +11 -0
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.jsx +22 -0
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_rails.md +1 -0
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_react.md +1 -0
- data/app/pb_kits/playbook/pb_home_address_street/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_home_address_street/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_home_address_street/home_address_street.rb +11 -2
- data/app/pb_kits/playbook/pb_link/_link.tsx +0 -18
- data/app/pb_kits/playbook/pb_link/docs/example.yml +3 -5
- data/app/pb_kits/playbook/pb_link/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_link/link.html.erb +1 -1
- data/app/pb_kits/playbook/pb_link/link.rb +0 -6
- data/app/pb_kits/playbook/pb_link/link.test.jsx +0 -30
- data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tooltip.html.erb +6 -6
- data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_tooltip/index.js +27 -45
- data/app/pb_kits/playbook/pb_tooltip/tooltip.rb +1 -5
- data/dist/chunks/{_typeahead-CkemExmL.js → _typeahead-W0hatdPs.js} +1 -1
- data/dist/chunks/_weekday_stacked-Be4uzzgn.js +45 -0
- data/dist/chunks/{lib-DjpLC8uO.js → lib-kMuhBuU7.js} +1 -1
- data/dist/chunks/{pb_form_validation-S56UaHZl.js → pb_form_validation-DBJ0wZuS.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +2 -2
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +10 -15
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx +0 -55
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md +0 -3
- data/app/pb_kits/playbook/pb_copy_button/copy_button.html.erb +0 -15
- data/app/pb_kits/playbook/pb_copy_button/copy_button.rb +0 -28
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.html.erb +0 -2
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.html.erb +0 -5
- data/app/pb_kits/playbook/pb_copy_button/index.js +0 -47
- data/app/pb_kits/playbook/pb_link/docs/_link_target.html.erb +0 -15
- data/app/pb_kits/playbook/pb_link/docs/_link_target.jsx +0 -29
- 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
|
-
|
20
|
-
|
21
|
-
if (method === 'click') {
|
22
|
-
trigger.addEventListener('click', () => {
|
20
|
+
trigger.addEventListener('mouseenter', () => {
|
21
|
+
this.mouseenterTimeout = setTimeout(() => {
|
23
22
|
this.showTooltip(trigger)
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
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
|
-
|
44
|
-
|
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 ===
|
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
|
-
|
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
|
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-
|
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
|