playbook_ui 14.13.0.pre.alpha.play1834depupdatesass6024 → 14.13.0.pre.alpha.play1884progresspill6064
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_icon_button/docs/_icon_button_default.html.erb +1 -2
- data/app/pb_kits/playbook/pb_icon_button/docs/_icon_button_sizes.html.erb +27 -0
- data/app/pb_kits/playbook/pb_icon_button/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_icon_button/icon_button.html.erb +1 -1
- data/app/pb_kits/playbook/pb_icon_button/icon_button.rb +3 -0
- data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.scss +2 -1
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.html.erb +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.jsx +7 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.md +1 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.html.erb +47 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.jsx +88 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.md +1 -0
- data/app/pb_kits/playbook/pb_table/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_table/docs/index.js +2 -1
- data/dist/chunks/{_typeahead-DQTwAd_2.js → _typeahead-btjo1UN5.js} +1 -1
- data/dist/chunks/{_weekday_stacked-CnPEqV7l.js → _weekday_stacked-TIh9nTmZ.js} +1 -1
- data/dist/chunks/{lib-WQEeEj3t.js → lib-DjpLC8uO.js} +1 -1
- data/dist/chunks/{pb_form_validation-Cq64l4zn.js → pb_form_validation-S56UaHZl.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- 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 +11 -6
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 21317a1c7d5325bd88ac09a06b74859e30a5fcf6748c6b4b710c500189733796
|
4
|
+
data.tar.gz: 0f6e8ac0625c5ba45989ab65b84603c15e777699e9726e2a7769d6e2aa57dd5e
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a7555df6aeccfb138dd8a45ff0a86b1e1843ba3ae6640a29d27899f2a9972b717f26cda50b79da966a5681b5eea56394f0a97823b165e27194add95c3e892158
|
7
|
+
data.tar.gz: 275833538e43720396649195b958886d4d4cca24f5b9e8e977fc1b7ec520d6e1151665de6d02086b11e05c45414f2b9c03d941df3fd43ad2fcd78ce403f4472b
|
@@ -0,0 +1,27 @@
|
|
1
|
+
<%= pb_rails("flex", props: { align: "center"}) do %>
|
2
|
+
<%= pb_rails("icon_button", props: {size: "lg"}) %> <span>Large</span>
|
3
|
+
<% end %>
|
4
|
+
|
5
|
+
<%= pb_rails("flex", props: { align: "center" }) do %>
|
6
|
+
<%= pb_rails("icon_button", props: {size: "sm"}) %> <span>Small</span>
|
7
|
+
<% end %>
|
8
|
+
|
9
|
+
<%= pb_rails("flex", props: { align: "center" }) do %>
|
10
|
+
<%= pb_rails("icon_button", props: {size: "xs"}) %> <span>XSmall</span>
|
11
|
+
<% end %>
|
12
|
+
|
13
|
+
<%= pb_rails("flex", props: { align: "center", margin_top: "md" }) do %>
|
14
|
+
<%= pb_rails("icon_button", props: {size: "1x"}) %> <span>1x</span>
|
15
|
+
<% end %>
|
16
|
+
|
17
|
+
<%= pb_rails("flex", props: { align: "center" }) do %>
|
18
|
+
<%= pb_rails("icon_button", props: {size: "2x"}) %> <span>2x</span>
|
19
|
+
<% end %>
|
20
|
+
|
21
|
+
<%= pb_rails("flex", props: { align: "center" }) do %>
|
22
|
+
<%= pb_rails("icon_button", props: {size: "3x"}) %> <span>3x</span>
|
23
|
+
<% end %>
|
24
|
+
|
25
|
+
<%= pb_rails("flex", props: { align: "center" }) do %>
|
26
|
+
<%= pb_rails("icon_button", props: {size: "4x"}) %> <span>4x</span>
|
27
|
+
<% end %>
|
@@ -14,6 +14,9 @@ module Playbook
|
|
14
14
|
prop :variant, type: Playbook::Props::Enum,
|
15
15
|
values: %w[default link],
|
16
16
|
default: "default"
|
17
|
+
prop :size, type: Playbook::Props::Enum,
|
18
|
+
values: %w[1x 2x 3x 4x 5x 6x 7x 8x 9x 10x xs sm lg],
|
19
|
+
default: "2x"
|
17
20
|
def classname
|
18
21
|
generate_classname("pb_icon_button_kit", variant)
|
19
22
|
end
|
@@ -0,0 +1 @@
|
|
1
|
+
Progress pills start at `45px` wide if the container allows, but will shrink down to `1px` as the container gets smaller. Resize this window to see each pill shrink.
|
@@ -0,0 +1,47 @@
|
|
1
|
+
<%= pb_rails("table", props: { size: "sm" }) do %>
|
2
|
+
<%= pb_rails("table/table_head") do %>
|
3
|
+
<%= pb_rails("table/table_row") do %>
|
4
|
+
<%= pb_rails("table/table_header", props: { text: "Column 1" }) %>
|
5
|
+
<%= pb_rails("table/table_header", props: { text: "Column 2" }) %>
|
6
|
+
<%= pb_rails("table/table_header", props: { text: "Column 3" }) %>
|
7
|
+
<%= pb_rails("table/table_header", props: { text: "Column 4" }) %>
|
8
|
+
<%= pb_rails("table/table_header", props: { text: "Column 5" }) %>
|
9
|
+
<%= pb_rails("table/table_header", props: { text: "" }) %>
|
10
|
+
<% end %>
|
11
|
+
<% end %>
|
12
|
+
<%= pb_rails("table/table_body") do %>
|
13
|
+
<%= pb_rails("table/table_row", props: { cursor: "pointer", html_options: { onclick: "alert('Row 1 clicked')" } }) do %>
|
14
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 1" }) %>
|
15
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 2" }) %>
|
16
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 3" }) %>
|
17
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 4" }) %>
|
18
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 5" }) %>
|
19
|
+
<%= pb_rails("table/table_cell", props: { text_align: "right" }) do %>
|
20
|
+
<%= pb_rails("icon", props: { color: "primary_action", fixed_width: true, icon: "chevron-right", size: "xs" }) %>
|
21
|
+
<% end %>
|
22
|
+
<% end %>
|
23
|
+
|
24
|
+
<%= pb_rails("table/table_row", props: { cursor: "pointer", html_options: { onclick: "alert('Row 2 clicked')" } }) do %>
|
25
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 1" }) %>
|
26
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 2" }) %>
|
27
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 3" }) %>
|
28
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 4" }) %>
|
29
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 5" }) %>
|
30
|
+
<%= pb_rails("table/table_cell", props: { text_align: "right" }) do %>
|
31
|
+
<%= pb_rails("icon", props: { color: "primary_action", fixed_width: true, icon: "chevron-right", size: "xs" }) %>
|
32
|
+
<% end %>
|
33
|
+
<% end %>
|
34
|
+
|
35
|
+
<%= pb_rails("table/table_row", props: { cursor: "pointer", html_options: { onclick: "alert('Row 3 clicked')" } }) do %>
|
36
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 1" }) %>
|
37
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 2" }) %>
|
38
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 3" }) %>
|
39
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 4" }) %>
|
40
|
+
<%= pb_rails("table/table_cell", props: { text: "Value 5" }) %>
|
41
|
+
<%= pb_rails("table/table_cell", props: { text_align: "right" }) do %>
|
42
|
+
<%= pb_rails("icon", props: { color: "primary_action", fixed_width: true, icon: "chevron-right", size: "xs" }) %>
|
43
|
+
<% end %>
|
44
|
+
<% end %>
|
45
|
+
<% end %>
|
46
|
+
<% end %>
|
47
|
+
|
@@ -0,0 +1,88 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
import { Table, Icon } from 'playbook-ui'
|
3
|
+
|
4
|
+
const TableWithClickableRows = (props) => {
|
5
|
+
|
6
|
+
|
7
|
+
return (
|
8
|
+
<Table
|
9
|
+
size="sm"
|
10
|
+
{...props}
|
11
|
+
>
|
12
|
+
<Table.Head>
|
13
|
+
<Table.Row>
|
14
|
+
<Table.Header>{"Column 1"}</Table.Header>
|
15
|
+
<Table.Header>{"Column 2"}</Table.Header>
|
16
|
+
<Table.Header>{"Column 3"}</Table.Header>
|
17
|
+
<Table.Header>{"Column 4"}</Table.Header>
|
18
|
+
<Table.Header>{"Column 5"}</Table.Header>
|
19
|
+
<Table.Header>{""}</Table.Header>
|
20
|
+
</Table.Row>
|
21
|
+
</Table.Head>
|
22
|
+
<Table.Body>
|
23
|
+
<Table.Row
|
24
|
+
cursor="pointer"
|
25
|
+
htmlOptions={{ onClick: () => alert("Row 1 clicked") }}
|
26
|
+
{...props}
|
27
|
+
>
|
28
|
+
<Table.Cell>{"Value 1"}</Table.Cell>
|
29
|
+
<Table.Cell>{"Value 2"}</Table.Cell>
|
30
|
+
<Table.Cell>{"Value 3"}</Table.Cell>
|
31
|
+
<Table.Cell>{"Value 4"}</Table.Cell>
|
32
|
+
<Table.Cell>{"Value 5"}</Table.Cell>
|
33
|
+
<Table.Cell textAlign="right">
|
34
|
+
<Icon
|
35
|
+
color="primary_action"
|
36
|
+
fixedWidth
|
37
|
+
icon="chevron-right"
|
38
|
+
size="xs"
|
39
|
+
{...props}
|
40
|
+
/>
|
41
|
+
</Table.Cell>
|
42
|
+
</Table.Row>
|
43
|
+
<Table.Row
|
44
|
+
cursor="pointer"
|
45
|
+
htmlOptions={{ onClick: () => alert("Row 2 clicked") }}
|
46
|
+
{...props}
|
47
|
+
>
|
48
|
+
<Table.Cell>{"Value 1"}</Table.Cell>
|
49
|
+
<Table.Cell>{"Value 2"}</Table.Cell>
|
50
|
+
<Table.Cell>{"Value 3"}</Table.Cell>
|
51
|
+
<Table.Cell>{"Value 4"}</Table.Cell>
|
52
|
+
<Table.Cell>{"Value 5"}</Table.Cell>
|
53
|
+
<Table.Cell textAlign="right">
|
54
|
+
<Icon
|
55
|
+
color="primary_action"
|
56
|
+
fixedWidth
|
57
|
+
icon="chevron-right"
|
58
|
+
size="xs"
|
59
|
+
{...props}
|
60
|
+
/>
|
61
|
+
</Table.Cell>
|
62
|
+
</Table.Row>
|
63
|
+
<Table.Row
|
64
|
+
cursor="pointer"
|
65
|
+
htmlOptions={{ onClick: () => alert("Row 3 clicked") }}
|
66
|
+
{...props}
|
67
|
+
>
|
68
|
+
<Table.Cell>{"Value 1"}</Table.Cell>
|
69
|
+
<Table.Cell>{"Value 2"}</Table.Cell>
|
70
|
+
<Table.Cell>{"Value 3"}</Table.Cell>
|
71
|
+
<Table.Cell>{"Value 4"}</Table.Cell>
|
72
|
+
<Table.Cell>{"Value 5"}</Table.Cell>
|
73
|
+
<Table.Cell textAlign="right">
|
74
|
+
<Icon
|
75
|
+
color="primary_action"
|
76
|
+
fixedWidth
|
77
|
+
icon="chevron-right"
|
78
|
+
size="xs"
|
79
|
+
{...props}
|
80
|
+
/>
|
81
|
+
</Table.Cell>
|
82
|
+
</Table.Row>
|
83
|
+
</Table.Body>
|
84
|
+
</Table>
|
85
|
+
)
|
86
|
+
}
|
87
|
+
|
88
|
+
export default TableWithClickableRows
|
@@ -0,0 +1 @@
|
|
1
|
+
Clickable table rows do not require any additional props. This doc example showcases how to set them up using `html_options`/`htmlOptions` and click events. Using the global prop for cursor to set it to "pointer" is also recommended for better UX.
|
@@ -34,6 +34,7 @@ examples:
|
|
34
34
|
- table_with_collapsible_with_custom_content_rails: Table with Collapsible with Custom Content
|
35
35
|
- table_with_collapsible_with_nested_rows_rails: Table with Collapsible with Nested Rows
|
36
36
|
- table_with_collapsible_with_nested_table_rails: Table with Collapsible with Nested Table
|
37
|
+
- table_with_clickable_rows: Table with Clickable Rows
|
37
38
|
|
38
39
|
react:
|
39
40
|
- table_sm: Small
|
@@ -70,3 +71,4 @@ examples:
|
|
70
71
|
- table_with_collapsible_with_custom_content: Table with Collapsible with Custom Content
|
71
72
|
- table_with_collapsible_with_nested_rows: Table with Collapsible with Nested Rows
|
72
73
|
- table_with_collapsible_with_nested_table: Table with Collapsible with Nested Table
|
74
|
+
- table_with_clickable_rows: Table with Clickable Rows
|
@@ -32,4 +32,5 @@ export { default as TableWithCollapsible } from './_table_with_collapsible.jsx'
|
|
32
32
|
export { default as TableWithCollapsibleWithCustomContent } from './_table_with_collapsible_with_custom_content.jsx'
|
33
33
|
export { default as TableWithCollapsibleWithNestedTable } from './_table_with_collapsible_with_nested_table.jsx'
|
34
34
|
export { default as TableWithCollapsibleWithNestedRows } from './_table_with_collapsible_with_nested_rows.jsx'
|
35
|
-
export { default as TableWithCollapsibleWithCustomClick } from './_table_with_collapsible_with_custom_click.jsx'
|
35
|
+
export { default as TableWithCollapsibleWithCustomClick } from './_table_with_collapsible_with_custom_click.jsx'
|
36
|
+
export { default as TableWithClickableRows } from './_table_with_clickable_rows.jsx'
|
@@ -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-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:{}};
|
2
2
|
/*!
|
3
3
|
Copyright (c) 2018 Jed Watson.
|
4
4
|
Licensed under the MIT License (MIT), see
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{r as requireLazysizes}from"./lazysizes-B7xYodB-.js";import{jsx,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{useEffect,createContext,useContext,useState,useCallback,useRef,createElement,forwardRef,useImperativeHandle,useMemo,useReducer,Fragment as Fragment$1,useLayoutEffect,isValidElement}from"react";import{h as buildAriaProps,i as buildDataProps,j as buildHtmlProps,k as classnames,l as globalProps,m as buildCss,n as Collapsible,o as globalInlineProps,F as Flex,p as Checkbox,q as Icon,r as FlexItem,s as Body$1,t as Caption,u as Card,A as Avatar,v as domSafeProps,w as Tooltip$1,x as Button,y as Title,S as SectionSeparator,z as Draggable,E as TextInput,H as PropTypes,J as noop$5,K as isEmpty,N as PbReactPopover,O as CircleIconButton,Q as HighchartsReact,U as Badge,V as joinPresent,W as titleize,X as IconCircle,Y as Image,Z as Radio}from"./_typeahead-
|
1
|
+
import{r as requireLazysizes}from"./lazysizes-B7xYodB-.js";import{jsx,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{useEffect,createContext,useContext,useState,useCallback,useRef,createElement,forwardRef,useImperativeHandle,useMemo,useReducer,Fragment as Fragment$1,useLayoutEffect,isValidElement}from"react";import{h as buildAriaProps,i as buildDataProps,j as buildHtmlProps,k as classnames,l as globalProps,m as buildCss,n as Collapsible,o as globalInlineProps,F as Flex,p as Checkbox,q as Icon,r as FlexItem,s as Body$1,t as Caption,u as Card,A as Avatar,v as domSafeProps,w as Tooltip$1,x as Button,y as Title,S as SectionSeparator,z as Draggable,E as TextInput,H as PropTypes,J as noop$5,K as isEmpty,N as PbReactPopover,O as CircleIconButton,Q as HighchartsReact,U as Badge,V as joinPresent,W as titleize,X as IconCircle,Y as Image,Z as Radio}from"./_typeahead-btjo1UN5.js";import{u as useCollapsible,j as getAllIcons,D as DateTime$1,a as datePickerHelper,k as useDropdown,o as omitBy,l as isEmpty$1,m as map,p as partial,n as find$1,q as commonjsGlobal,r as getDefaultExportFromCjs,s as highchartsDarkTheme,t as highchartsTheme,v as noop$6,w as colors,i as PbTextarea}from"./lib-DjpLC8uO.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";var ls_attrchange={exports:{}};(function(module){(function(window2,factory){if(!window2){return}var globalInstall=function(){factory(window2.lazySizes);window2.removeEventListener("lazyunveilread",globalInstall,true)};factory=factory.bind(null,window2,window2.document);if(module.exports){factory(requireLazysizes())}else if(window2.lazySizes){globalInstall()}else{window2.addEventListener("lazyunveilread",globalInstall,true)}})(typeof window!="undefined"?window:0,(function(window2,document2,lazySizes){var addObserver=function(){var connect,disconnect,observer,connected;var lsCfg=lazySizes.cfg;var attributes={"data-bgset":1,"data-include":1,"data-poster":1,"data-bg":1,"data-script":1};var regClassTest="(\\s|^)("+lsCfg.loadedClass;var docElem=document2.documentElement;var setClass=function(target){lazySizes.rAF((function(){lazySizes.rC(target,lsCfg.loadedClass);if(lsCfg.unloadedClass){lazySizes.rC(target,lsCfg.unloadedClass)}lazySizes.aC(target,lsCfg.lazyClass);if(target.style.display=="none"||target.parentNode&&target.parentNode.style.display=="none"){setTimeout((function(){lazySizes.loader.unveil(target)}),0)}}))};var onMutation=function(mutations){var i,len,mutation,target;for(i=0,len=mutations.length;i<len;i++){mutation=mutations[i];target=mutation.target;if(!target.getAttribute(mutation.attributeName)){continue}if(target.localName=="source"&&target.parentNode){target=target.parentNode.querySelector("img")}if(target&®ClassTest.test(target.className)){setClass(target)}}};if(lsCfg.unloadedClass){regClassTest+="|"+lsCfg.unloadedClass}regClassTest+="|"+lsCfg.loadingClass+")(\\s|$)";regClassTest=new RegExp(regClassTest);attributes[lsCfg.srcAttr]=1;attributes[lsCfg.srcsetAttr]=1;if(window2.MutationObserver){observer=new MutationObserver(onMutation);connect=function(){if(!connected){connected=true;observer.observe(docElem,{subtree:true,attributes:true,attributeFilter:Object.keys(attributes)})}};disconnect=function(){if(connected){connected=false;observer.disconnect()}}}else{docElem.addEventListener("DOMAttrModified",function(){var runs;var modifications=[];var callMutations=function(){onMutation(modifications);modifications=[];runs=false};return function(e){if(connected&&attributes[e.attrName]&&e.newValue){modifications.push({target:e.target,attributeName:e.attrName});if(!runs){setTimeout(callMutations);runs=true}}}}(),true);connect=function(){connected=true};disconnect=function(){connected=false}}addEventListener("lazybeforeunveil",disconnect,true);addEventListener("lazybeforeunveil",connect);addEventListener("lazybeforesizes",disconnect,true);addEventListener("lazybeforesizes",connect);connect();removeEventListener("lazybeforeunveil",addObserver)};addEventListener("lazybeforeunveil",addObserver)}))})(ls_attrchange);
|
2
2
|
/**
|
3
3
|
* table-core
|
4
4
|
*
|