playbook-ui 17.1.0-rc.3 → 17.1.0
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.
- package/dist/.vite/manifest.json +51 -51
- package/dist/advanced-table.js +1 -1
- package/dist/ai/all-schemas.json +56 -0
- package/dist/ai/index.json +11 -2
- package/dist/ai/kits/container.schema.json +56 -0
- package/dist/ai/playgrounds/container.json +1 -0
- package/dist/ai/playgrounds/image.json +1 -1
- package/dist/ai/playgrounds/index.json +1 -1
- package/dist/ai/visual-index.json +1 -1
- package/dist/charts.js +1 -1
- package/dist/chunks/_detail-CyTyC7gJ.js +5 -0
- package/dist/chunks/{_pb_line_graph-BGyCJjgG.js → _pb_line_graph-CUJ7NJIr.js} +1 -1
- package/dist/chunks/_table-DDKdCER5.js +1 -0
- package/dist/chunks/_typeahead-DdVBwRQT.js +1 -0
- package/dist/chunks/{globalProps-K1DCn3il.js → globalProps-DDcpyjvz.js} +1 -1
- package/dist/chunks/lib-D57mygNT.js +29 -0
- package/dist/chunks/time_picker_helper-B_FN8E9Y.js +1 -0
- package/dist/chunks/vendor.js +2 -2
- package/dist/playbook-advanced-table.js +1 -1
- package/dist/playbook-charts.js +1 -1
- package/dist/playbook-rails-charts-bindings.js +1 -1
- package/dist/playbook-rails-react-bindings.js +1 -1
- package/dist/playbook-rails.js +1 -1
- package/dist/playbook.css +1 -1
- package/dist/playbook.js +1 -1
- package/package.json +1 -2
- package/dist/chunks/_detail-B4-co8rv.js +0 -5
- package/dist/chunks/_table-SGw4kUye.js +0 -1
- package/dist/chunks/_typeahead-sT6HFKNd.js +0 -1
- package/dist/chunks/lib-7vm9BMqp.js +0 -29
- package/dist/chunks/time_picker_helper-CN-3p6mx.js +0 -1
package/dist/.vite/manifest.json
CHANGED
|
@@ -3,53 +3,53 @@
|
|
|
3
3
|
"file": "chunks/StickyLayoutHelper-DCzCcWUN.js",
|
|
4
4
|
"name": "StickyLayoutHelper"
|
|
5
5
|
},
|
|
6
|
-
"__detail-
|
|
7
|
-
"file": "chunks/_detail-
|
|
6
|
+
"__detail-CyTyC7gJ.js": {
|
|
7
|
+
"file": "chunks/_detail-CyTyC7gJ.js",
|
|
8
8
|
"name": "_detail",
|
|
9
9
|
"imports": [
|
|
10
|
-
"_lib-
|
|
11
|
-
"_globalProps-
|
|
10
|
+
"_lib-D57mygNT.js",
|
|
11
|
+
"_globalProps-DDcpyjvz.js"
|
|
12
12
|
]
|
|
13
13
|
},
|
|
14
|
-
"__pb_line_graph-
|
|
15
|
-
"file": "chunks/_pb_line_graph-
|
|
14
|
+
"__pb_line_graph-CUJ7NJIr.js": {
|
|
15
|
+
"file": "chunks/_pb_line_graph-CUJ7NJIr.js",
|
|
16
16
|
"name": "_pb_line_graph",
|
|
17
17
|
"imports": [
|
|
18
|
-
"_globalProps-
|
|
19
|
-
"_lib-
|
|
18
|
+
"_globalProps-DDcpyjvz.js",
|
|
19
|
+
"_lib-D57mygNT.js"
|
|
20
20
|
]
|
|
21
21
|
},
|
|
22
|
-
"__table-
|
|
23
|
-
"file": "chunks/_table-
|
|
22
|
+
"__table-DDKdCER5.js": {
|
|
23
|
+
"file": "chunks/_table-DDKdCER5.js",
|
|
24
24
|
"name": "_table",
|
|
25
25
|
"imports": [
|
|
26
|
-
"__detail-
|
|
27
|
-
"_globalProps-
|
|
28
|
-
"_lib-
|
|
26
|
+
"__detail-CyTyC7gJ.js",
|
|
27
|
+
"_globalProps-DDcpyjvz.js",
|
|
28
|
+
"_lib-D57mygNT.js"
|
|
29
29
|
]
|
|
30
30
|
},
|
|
31
|
-
"__typeahead-
|
|
32
|
-
"file": "chunks/_typeahead-
|
|
31
|
+
"__typeahead-DdVBwRQT.js": {
|
|
32
|
+
"file": "chunks/_typeahead-DdVBwRQT.js",
|
|
33
33
|
"name": "_typeahead",
|
|
34
34
|
"imports": [
|
|
35
|
-
"_lib-
|
|
36
|
-
"_globalProps-
|
|
37
|
-
"__detail-
|
|
35
|
+
"_lib-D57mygNT.js",
|
|
36
|
+
"_globalProps-DDcpyjvz.js",
|
|
37
|
+
"__detail-CyTyC7gJ.js"
|
|
38
38
|
]
|
|
39
39
|
},
|
|
40
40
|
"_componentRegistry-DRSp5D_e.js": {
|
|
41
41
|
"file": "chunks/componentRegistry-DRSp5D_e.js",
|
|
42
42
|
"name": "componentRegistry"
|
|
43
43
|
},
|
|
44
|
-
"_globalProps-
|
|
45
|
-
"file": "chunks/globalProps-
|
|
44
|
+
"_globalProps-DDcpyjvz.js": {
|
|
45
|
+
"file": "chunks/globalProps-DDcpyjvz.js",
|
|
46
46
|
"name": "globalProps",
|
|
47
47
|
"imports": [
|
|
48
|
-
"_lib-
|
|
48
|
+
"_lib-D57mygNT.js"
|
|
49
49
|
]
|
|
50
50
|
},
|
|
51
|
-
"_lib-
|
|
52
|
-
"file": "chunks/lib-
|
|
51
|
+
"_lib-D57mygNT.js": {
|
|
52
|
+
"file": "chunks/lib-D57mygNT.js",
|
|
53
53
|
"name": "lib",
|
|
54
54
|
"css": [
|
|
55
55
|
"lib.css"
|
|
@@ -59,11 +59,11 @@
|
|
|
59
59
|
"file": "lib.css",
|
|
60
60
|
"src": "_lib.css"
|
|
61
61
|
},
|
|
62
|
-
"_time_picker_helper-
|
|
63
|
-
"file": "chunks/time_picker_helper-
|
|
62
|
+
"_time_picker_helper-B_FN8E9Y.js": {
|
|
63
|
+
"file": "chunks/time_picker_helper-B_FN8E9Y.js",
|
|
64
64
|
"name": "time_picker_helper",
|
|
65
65
|
"imports": [
|
|
66
|
-
"_lib-
|
|
66
|
+
"_lib-D57mygNT.js"
|
|
67
67
|
]
|
|
68
68
|
},
|
|
69
69
|
"entrypoints/playbook-advanced-table.js": {
|
|
@@ -73,10 +73,10 @@
|
|
|
73
73
|
"isEntry": true,
|
|
74
74
|
"imports": [
|
|
75
75
|
"entrypoints/playbook-advanced-table.js",
|
|
76
|
-
"_globalProps-
|
|
77
|
-
"_lib-
|
|
78
|
-
"__table-
|
|
79
|
-
"__detail-
|
|
76
|
+
"_globalProps-DDcpyjvz.js",
|
|
77
|
+
"_lib-D57mygNT.js",
|
|
78
|
+
"__table-DDKdCER5.js",
|
|
79
|
+
"__detail-CyTyC7gJ.js",
|
|
80
80
|
"_StickyLayoutHelper-DCzCcWUN.js"
|
|
81
81
|
]
|
|
82
82
|
},
|
|
@@ -86,9 +86,9 @@
|
|
|
86
86
|
"src": "entrypoints/playbook-charts.js",
|
|
87
87
|
"isEntry": true,
|
|
88
88
|
"imports": [
|
|
89
|
-
"__pb_line_graph-
|
|
90
|
-
"_globalProps-
|
|
91
|
-
"_lib-
|
|
89
|
+
"__pb_line_graph-CUJ7NJIr.js",
|
|
90
|
+
"_globalProps-DDcpyjvz.js",
|
|
91
|
+
"_lib-D57mygNT.js"
|
|
92
92
|
]
|
|
93
93
|
},
|
|
94
94
|
"entrypoints/playbook-rails-charts-bindings.js": {
|
|
@@ -98,9 +98,9 @@
|
|
|
98
98
|
"isEntry": true,
|
|
99
99
|
"imports": [
|
|
100
100
|
"_componentRegistry-DRSp5D_e.js",
|
|
101
|
-
"__pb_line_graph-
|
|
102
|
-
"_globalProps-
|
|
103
|
-
"_lib-
|
|
101
|
+
"__pb_line_graph-CUJ7NJIr.js",
|
|
102
|
+
"_globalProps-DDcpyjvz.js",
|
|
103
|
+
"_lib-D57mygNT.js"
|
|
104
104
|
]
|
|
105
105
|
},
|
|
106
106
|
"entrypoints/playbook-rails-react-bindings.js": {
|
|
@@ -110,10 +110,10 @@
|
|
|
110
110
|
"isEntry": true,
|
|
111
111
|
"imports": [
|
|
112
112
|
"_componentRegistry-DRSp5D_e.js",
|
|
113
|
-
"__typeahead-
|
|
114
|
-
"_lib-
|
|
115
|
-
"_globalProps-
|
|
116
|
-
"__detail-
|
|
113
|
+
"__typeahead-DdVBwRQT.js",
|
|
114
|
+
"_lib-D57mygNT.js",
|
|
115
|
+
"_globalProps-DDcpyjvz.js",
|
|
116
|
+
"__detail-CyTyC7gJ.js"
|
|
117
117
|
]
|
|
118
118
|
},
|
|
119
119
|
"entrypoints/playbook-rails.js": {
|
|
@@ -122,13 +122,13 @@
|
|
|
122
122
|
"src": "entrypoints/playbook-rails.js",
|
|
123
123
|
"isEntry": true,
|
|
124
124
|
"imports": [
|
|
125
|
-
"_lib-
|
|
126
|
-
"__typeahead-
|
|
127
|
-
"_time_picker_helper-
|
|
125
|
+
"_lib-D57mygNT.js",
|
|
126
|
+
"__typeahead-DdVBwRQT.js",
|
|
127
|
+
"_time_picker_helper-B_FN8E9Y.js",
|
|
128
128
|
"_StickyLayoutHelper-DCzCcWUN.js",
|
|
129
129
|
"entrypoints/playbook-rails-react-bindings.js",
|
|
130
|
-
"_globalProps-
|
|
131
|
-
"__detail-
|
|
130
|
+
"_globalProps-DDcpyjvz.js",
|
|
131
|
+
"__detail-CyTyC7gJ.js",
|
|
132
132
|
"_componentRegistry-DRSp5D_e.js"
|
|
133
133
|
]
|
|
134
134
|
},
|
|
@@ -138,13 +138,13 @@
|
|
|
138
138
|
"src": "entrypoints/playbook.js",
|
|
139
139
|
"isEntry": true,
|
|
140
140
|
"imports": [
|
|
141
|
+
"__detail-CyTyC7gJ.js",
|
|
142
|
+
"__typeahead-DdVBwRQT.js",
|
|
141
143
|
"entrypoints/playbook.js",
|
|
142
|
-
"
|
|
143
|
-
"
|
|
144
|
-
"
|
|
145
|
-
"
|
|
146
|
-
"_lib-7vm9BMqp.js",
|
|
147
|
-
"_globalProps-K1DCn3il.js"
|
|
144
|
+
"__table-DDKdCER5.js",
|
|
145
|
+
"_lib-D57mygNT.js",
|
|
146
|
+
"_globalProps-DDcpyjvz.js",
|
|
147
|
+
"_time_picker_helper-B_FN8E9Y.js"
|
|
148
148
|
]
|
|
149
149
|
},
|
|
150
150
|
"entrypoints/playbook.scss": {
|
package/dist/advanced-table.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsx,jsxs,Fragment}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useRef,useState,useCallback,useEffect,useMemo,useContext,useLayoutEffect}from"react";import{d as classnames,e as buildCss,g as globalProps,b as buildAriaProps,a as buildDataProps,c as buildHtmlProps}from"./chunks/globalProps-K1DCn3il.js";import{C as Checkbox,P as PbReactPopover,S as SectionSeparator,L as LoadingInline,a as Pagination,F as FlexItem,T as Table}from"./chunks/_table-SGw4kUye.js";import{flushSync}from"react-dom";import{m as measureElementHeight,s as scheduleStickyActionBarHeightUpdate,b as updateStickyLayoutHeights}from"./chunks/StickyLayoutHelper-DCzCcWUN.js";import{I as Icon,F as Flex,C as Caption,D as Detail,a as Card,T as Tooltip}from"./chunks/_detail-B4-co8rv.js";import"./chunks/lib-7vm9BMqp.js";function memo$1(getDeps,fn,opts){let deps=opts.initialDeps??[];let result;return()=>{var _a,_b,_c,_d;let depTime;if(opts.key&&((_a=opts.debug)==null?void 0:_a.call(opts)))depTime=Date.now();const newDeps=getDeps();const depsChanged=newDeps.length!==deps.length||newDeps.some(((dep,index)=>deps[index]!==dep));if(!depsChanged){return result}deps=newDeps;let resultTime;if(opts.key&&((_b=opts.debug)==null?void 0:_b.call(opts)))resultTime=Date.now();result=fn(...newDeps);if(opts.key&&((_c=opts.debug)==null?void 0:_c.call(opts))){const depEndTime=Math.round((Date.now()-depTime)*100)/100;const resultEndTime=Math.round((Date.now()-resultTime)*100)/100;const resultFpsPercentage=resultEndTime/16;const pad=(str,num)=>{str=String(str);while(str.length<num){str=" "+str}return str};console.info(`%c⏱ ${pad(resultEndTime,5)} /${pad(depEndTime,5)} ms`,`\n font-size: .6rem;\n font-weight: bold;\n color: hsl(${Math.max(0,Math.min(120-120*resultFpsPercentage,120))}deg 100% 31%);`,opts==null?void 0:opts.key)}(_d=opts==null?void 0:opts.onChange)==null?void 0:_d.call(opts,result);return result}}function notUndefined(value,msg){if(value===void 0){throw new Error(`Unexpected undefined${""}`)}else{return value}}const approxEqual=(a,b)=>Math.abs(a-b)<1;const debounce=(targetWindow,fn,ms)=>{let timeoutId;return function(...args){targetWindow.clearTimeout(timeoutId);timeoutId=targetWindow.setTimeout((()=>fn.apply(this,args)),ms)}};const defaultKeyExtractor=index=>index;const defaultRangeExtractor=range=>{const start=Math.max(range.startIndex-range.overscan,0);const end=Math.min(range.endIndex+range.overscan,range.count-1);const arr=[];for(let i=start;i<=end;i++){arr.push(i)}return arr};const observeElementRect=(instance,cb)=>{const element=instance.scrollElement;if(!element){return}const targetWindow=instance.targetWindow;if(!targetWindow){return}const handler=rect=>{const{width:width,height:height}=rect;cb({width:Math.round(width),height:Math.round(height)})};handler(element.getBoundingClientRect());if(!targetWindow.ResizeObserver){return()=>{}}const observer=new targetWindow.ResizeObserver((entries=>{const run=()=>{const entry=entries[0];if(entry==null?void 0:entry.borderBoxSize){const box=entry.borderBoxSize[0];if(box){handler({width:box.inlineSize,height:box.blockSize});return}}handler(element.getBoundingClientRect())};instance.options.useAnimationFrameWithResizeObserver?requestAnimationFrame(run):run()}));observer.observe(element,{box:"border-box"});return()=>{observer.unobserve(element)}};const addEventListenerOptions={passive:true};const supportsScrollend=typeof window=="undefined"?true:"onscrollend"in window;const observeElementOffset=(instance,cb)=>{const element=instance.scrollElement;if(!element){return}const targetWindow=instance.targetWindow;if(!targetWindow){return}let offset=0;const fallback=instance.options.useScrollendEvent&&supportsScrollend?()=>void 0:debounce(targetWindow,(()=>{cb(offset,false)}),instance.options.isScrollingResetDelay);const createHandler=isScrolling=>()=>{const{horizontal:horizontal,isRtl:isRtl}=instance.options;offset=horizontal?element["scrollLeft"]*(isRtl&&-1||1):element["scrollTop"];fallback();cb(offset,isScrolling)};const handler=createHandler(true);const endHandler=createHandler(false);endHandler();element.addEventListener("scroll",handler,addEventListenerOptions);const registerScrollendEvent=instance.options.useScrollendEvent&&supportsScrollend;if(registerScrollendEvent){element.addEventListener("scrollend",endHandler,addEventListenerOptions)}return()=>{element.removeEventListener("scroll",handler);if(registerScrollendEvent){element.removeEventListener("scrollend",endHandler)}}};const measureElement=(element,entry,instance)=>{if(entry==null?void 0:entry.borderBoxSize){const box=entry.borderBoxSize[0];if(box){const size=Math.round(box[instance.options.horizontal?"inlineSize":"blockSize"]);return size}}return Math.round(element.getBoundingClientRect()[instance.options.horizontal?"width":"height"])};const elementScroll=(offset,{adjustments:adjustments=0,behavior:behavior},instance)=>{var _a,_b;const toOffset=offset+adjustments;(_b=(_a=instance.scrollElement)==null?void 0:_a.scrollTo)==null?void 0:_b.call(_a,{[instance.options.horizontal?"left":"top"]:toOffset,behavior:behavior})};class Virtualizer{constructor(opts){this.unsubs=[];this.scrollElement=null;this.targetWindow=null;this.isScrolling=false;this.scrollToIndexTimeoutId=null;this.measurementsCache=[];this.itemSizeCache=new Map;this.pendingMeasuredCacheIndexes=[];this.scrollRect=null;this.scrollOffset=null;this.scrollDirection=null;this.scrollAdjustments=0;this.elementsCache=new Map;this.observer=(()=>{let _ro=null;const get=()=>{if(_ro){return _ro}if(!this.targetWindow||!this.targetWindow.ResizeObserver){return null}return _ro=new this.targetWindow.ResizeObserver((entries=>{entries.forEach((entry=>{const run=()=>{this._measureElement(entry.target,entry)};this.options.useAnimationFrameWithResizeObserver?requestAnimationFrame(run):run()}))}))};return{disconnect:()=>{var _a;(_a=get())==null?void 0:_a.disconnect();_ro=null},observe:target=>{var _a;return(_a=get())==null?void 0:_a.observe(target,{box:"border-box"})},unobserve:target=>{var _a;return(_a=get())==null?void 0:_a.unobserve(target)}}})();this.range=null;this.setOptions=opts2=>{Object.entries(opts2).forEach((([key,value])=>{if(typeof value==="undefined")delete opts2[key]}));this.options={debug:false,initialOffset:0,overscan:1,paddingStart:0,paddingEnd:0,scrollPaddingStart:0,scrollPaddingEnd:0,horizontal:false,getItemKey:defaultKeyExtractor,rangeExtractor:defaultRangeExtractor,onChange:()=>{},measureElement:measureElement,initialRect:{width:0,height:0},scrollMargin:0,gap:0,indexAttribute:"data-index",initialMeasurementsCache:[],lanes:1,isScrollingResetDelay:150,enabled:true,isRtl:false,useScrollendEvent:true,useAnimationFrameWithResizeObserver:false,...opts2}};this.notify=sync=>{var _a,_b;(_b=(_a=this.options).onChange)==null?void 0:_b.call(_a,this,sync)};this.maybeNotify=memo$1((()=>{this.calculateRange();return[this.isScrolling,this.range?this.range.startIndex:null,this.range?this.range.endIndex:null]}),(isScrolling=>{this.notify(isScrolling)}),{key:false,debug:()=>this.options.debug,initialDeps:[this.isScrolling,this.range?this.range.startIndex:null,this.range?this.range.endIndex:null]});this.cleanup=()=>{this.unsubs.filter(Boolean).forEach((d=>d()));this.unsubs=[];this.observer.disconnect();this.scrollElement=null;this.targetWindow=null};this._didMount=()=>()=>{this.cleanup()};this._willUpdate=()=>{var _a;const scrollElement=this.options.enabled?this.options.getScrollElement():null;if(this.scrollElement!==scrollElement){this.cleanup();if(!scrollElement){this.maybeNotify();return}this.scrollElement=scrollElement;if(this.scrollElement&&"ownerDocument"in this.scrollElement){this.targetWindow=this.scrollElement.ownerDocument.defaultView}else{this.targetWindow=((_a=this.scrollElement)==null?void 0:_a.window)??null}this.elementsCache.forEach((cached=>{this.observer.observe(cached)}));this._scrollToOffset(this.getScrollOffset(),{adjustments:void 0,behavior:void 0});this.unsubs.push(this.options.observeElementRect(this,(rect=>{this.scrollRect=rect;this.maybeNotify()})));this.unsubs.push(this.options.observeElementOffset(this,((offset,isScrolling)=>{this.scrollAdjustments=0;this.scrollDirection=isScrolling?this.getScrollOffset()<offset?"forward":"backward":null;this.scrollOffset=offset;this.isScrolling=isScrolling;this.maybeNotify()})))}};this.getSize=()=>{if(!this.options.enabled){this.scrollRect=null;return 0}this.scrollRect=this.scrollRect??this.options.initialRect;return this.scrollRect[this.options.horizontal?"width":"height"]};this.getScrollOffset=()=>{if(!this.options.enabled){this.scrollOffset=null;return 0}this.scrollOffset=this.scrollOffset??(typeof this.options.initialOffset==="function"?this.options.initialOffset():this.options.initialOffset);return this.scrollOffset};this.getFurthestMeasurement=(measurements,index)=>{const furthestMeasurementsFound=new Map;const furthestMeasurements=new Map;for(let m=index-1;m>=0;m--){const measurement=measurements[m];if(furthestMeasurementsFound.has(measurement.lane)){continue}const previousFurthestMeasurement=furthestMeasurements.get(measurement.lane);if(previousFurthestMeasurement==null||measurement.end>previousFurthestMeasurement.end){furthestMeasurements.set(measurement.lane,measurement)}else if(measurement.end<previousFurthestMeasurement.end){furthestMeasurementsFound.set(measurement.lane,true)}if(furthestMeasurementsFound.size===this.options.lanes){break}}return furthestMeasurements.size===this.options.lanes?Array.from(furthestMeasurements.values()).sort(((a,b)=>{if(a.end===b.end){return a.index-b.index}return a.end-b.end}))[0]:void 0};this.getMeasurementOptions=memo$1((()=>[this.options.count,this.options.paddingStart,this.options.scrollMargin,this.options.getItemKey,this.options.enabled]),((count2,paddingStart,scrollMargin,getItemKey,enabled)=>{this.pendingMeasuredCacheIndexes=[];return{count:count2,paddingStart:paddingStart,scrollMargin:scrollMargin,getItemKey:getItemKey,enabled:enabled}}),{key:false});this.getMeasurements=memo$1((()=>[this.getMeasurementOptions(),this.itemSizeCache]),(({count:count2,paddingStart:paddingStart,scrollMargin:scrollMargin,getItemKey:getItemKey,enabled:enabled},itemSizeCache)=>{if(!enabled){this.measurementsCache=[];this.itemSizeCache.clear();return[]}if(this.measurementsCache.length===0){this.measurementsCache=this.options.initialMeasurementsCache;this.measurementsCache.forEach((item=>{this.itemSizeCache.set(item.key,item.size)}))}const min2=this.pendingMeasuredCacheIndexes.length>0?Math.min(...this.pendingMeasuredCacheIndexes):0;this.pendingMeasuredCacheIndexes=[];const measurements=this.measurementsCache.slice(0,min2);for(let i=min2;i<count2;i++){const key=getItemKey(i);const furthestMeasurement=this.options.lanes===1?measurements[i-1]:this.getFurthestMeasurement(measurements,i);const start=furthestMeasurement?furthestMeasurement.end+this.options.gap:paddingStart+scrollMargin;const measuredSize=itemSizeCache.get(key);const size=typeof measuredSize==="number"?measuredSize:this.options.estimateSize(i);const end=start+size;const lane=furthestMeasurement?furthestMeasurement.lane:i%this.options.lanes;measurements[i]={index:i,start:start,size:size,end:end,key:key,lane:lane}}this.measurementsCache=measurements;return measurements}),{key:false,debug:()=>this.options.debug});this.calculateRange=memo$1((()=>[this.getMeasurements(),this.getSize(),this.getScrollOffset()]),((measurements,outerSize,scrollOffset)=>this.range=measurements.length>0&&outerSize>0?calculateRange({measurements:measurements,outerSize:outerSize,scrollOffset:scrollOffset}):null),{key:false,debug:()=>this.options.debug});this.getVirtualIndexes=memo$1((()=>{let startIndex=null;let endIndex=null;const range=this.calculateRange();if(range){startIndex=range.startIndex;endIndex=range.endIndex}return[this.options.rangeExtractor,this.options.overscan,this.options.count,startIndex,endIndex]}),((rangeExtractor,overscan,count2,startIndex,endIndex)=>startIndex===null||endIndex===null?[]:rangeExtractor({startIndex:startIndex,endIndex:endIndex,overscan:overscan,count:count2})),{key:false,debug:()=>this.options.debug});this.indexFromElement=node=>{const attributeName=this.options.indexAttribute;const indexStr=node.getAttribute(attributeName);if(!indexStr){console.warn(`Missing attribute name '${attributeName}={index}' on measured element.`);return-1}return parseInt(indexStr,10)};this._measureElement=(node,entry)=>{const index=this.indexFromElement(node);const item=this.measurementsCache[index];if(!item){return}const key=item.key;const prevNode=this.elementsCache.get(key);if(prevNode!==node){if(prevNode){this.observer.unobserve(prevNode)}this.observer.observe(node);this.elementsCache.set(key,node)}if(node.isConnected){this.resizeItem(index,this.options.measureElement(node,entry,this))}};this.resizeItem=(index,size)=>{const item=this.measurementsCache[index];if(!item){return}const itemSize=this.itemSizeCache.get(item.key)??item.size;const delta=size-itemSize;if(delta!==0){if(this.shouldAdjustScrollPositionOnItemSizeChange!==void 0?this.shouldAdjustScrollPositionOnItemSizeChange(item,delta,this):item.start<this.getScrollOffset()+this.scrollAdjustments){this._scrollToOffset(this.getScrollOffset(),{adjustments:this.scrollAdjustments+=delta,behavior:void 0})}this.pendingMeasuredCacheIndexes.push(item.index);this.itemSizeCache=new Map(this.itemSizeCache.set(item.key,size));this.notify(false)}};this.measureElement=node=>{if(!node){this.elementsCache.forEach(((cached,key)=>{if(!cached.isConnected){this.observer.unobserve(cached);this.elementsCache.delete(key)}}));return}this._measureElement(node,void 0)};this.getVirtualItems=memo$1((()=>[this.getVirtualIndexes(),this.getMeasurements()]),((indexes,measurements)=>{const virtualItems=[];for(let k=0,len=indexes.length;k<len;k++){const i=indexes[k];const measurement=measurements[i];virtualItems.push(measurement)}return virtualItems}),{key:false,debug:()=>this.options.debug});this.getVirtualItemForOffset=offset=>{const measurements=this.getMeasurements();if(measurements.length===0){return void 0}return notUndefined(measurements[findNearestBinarySearch(0,measurements.length-1,(index=>notUndefined(measurements[index]).start),offset)])};this.getOffsetForAlignment=(toOffset,align)=>{const size=this.getSize();const scrollOffset=this.getScrollOffset();if(align==="auto"){if(toOffset>=scrollOffset+size){align="end"}}if(align==="end"){toOffset-=size}const scrollSizeProp=this.options.horizontal?"scrollWidth":"scrollHeight";const scrollSize=this.scrollElement?"document"in this.scrollElement?this.scrollElement.document.documentElement[scrollSizeProp]:this.scrollElement[scrollSizeProp]:0;const maxOffset=scrollSize-size;return Math.max(Math.min(maxOffset,toOffset),0)};this.getOffsetForIndex=(index,align="auto")=>{index=Math.max(0,Math.min(index,this.options.count-1));const item=this.measurementsCache[index];if(!item){return void 0}const size=this.getSize();const scrollOffset=this.getScrollOffset();if(align==="auto"){if(item.end>=scrollOffset+size-this.options.scrollPaddingEnd){align="end"}else if(item.start<=scrollOffset+this.options.scrollPaddingStart){align="start"}else{return[scrollOffset,align]}}const centerOffset=item.start-this.options.scrollPaddingStart+(item.size-size)/2;switch(align){case"center":return[this.getOffsetForAlignment(centerOffset,align),align];case"end":return[this.getOffsetForAlignment(item.end+this.options.scrollPaddingEnd,align),align];default:return[this.getOffsetForAlignment(item.start-this.options.scrollPaddingStart,align),align]}};this.isDynamicMode=()=>this.elementsCache.size>0;this.cancelScrollToIndex=()=>{if(this.scrollToIndexTimeoutId!==null&&this.targetWindow){this.targetWindow.clearTimeout(this.scrollToIndexTimeoutId);this.scrollToIndexTimeoutId=null}};this.scrollToOffset=(toOffset,{align:align="start",behavior:behavior}={})=>{this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}this._scrollToOffset(this.getOffsetForAlignment(toOffset,align),{adjustments:void 0,behavior:behavior})};this.scrollToIndex=(index,{align:initialAlign="auto",behavior:behavior}={})=>{index=Math.max(0,Math.min(index,this.options.count-1));this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}const offsetAndAlign=this.getOffsetForIndex(index,initialAlign);if(!offsetAndAlign)return;const[offset,align]=offsetAndAlign;this._scrollToOffset(offset,{adjustments:void 0,behavior:behavior});if(behavior!=="smooth"&&this.isDynamicMode()&&this.targetWindow){this.scrollToIndexTimeoutId=this.targetWindow.setTimeout((()=>{this.scrollToIndexTimeoutId=null;const elementInDOM=this.elementsCache.has(this.options.getItemKey(index));if(elementInDOM){const[latestOffset]=notUndefined(this.getOffsetForIndex(index,align));if(!approxEqual(latestOffset,this.getScrollOffset())){this.scrollToIndex(index,{align:align,behavior:behavior})}}else{this.scrollToIndex(index,{align:align,behavior:behavior})}}))}};this.scrollBy=(delta,{behavior:behavior}={})=>{this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}this._scrollToOffset(this.getScrollOffset()+delta,{adjustments:void 0,behavior:behavior})};this.getTotalSize=()=>{var _a;const measurements=this.getMeasurements();let end;if(measurements.length===0){end=this.options.paddingStart}else{end=this.options.lanes===1?((_a=measurements[measurements.length-1])==null?void 0:_a.end)??0:Math.max(...measurements.slice(-this.options.lanes).map((m=>m.end)))}return Math.max(end-this.options.scrollMargin+this.options.paddingEnd,0)};this._scrollToOffset=(offset,{adjustments:adjustments,behavior:behavior})=>{this.options.scrollToFn(offset,{behavior:behavior,adjustments:adjustments},this)};this.measure=()=>{this.itemSizeCache=new Map;this.notify(false)};this.setOptions(opts)}}const findNearestBinarySearch=(low,high,getCurrentValue,value)=>{while(low<=high){const middle=(low+high)/2|0;const currentValue=getCurrentValue(middle);if(currentValue<value){low=middle+1}else if(currentValue>value){high=middle-1}else{return middle}}if(low>0){return low-1}else{return 0}};function calculateRange({measurements:measurements,outerSize:outerSize,scrollOffset:scrollOffset}){const count2=measurements.length-1;const getOffset=index=>measurements[index].start;const startIndex=findNearestBinarySearch(0,count2,getOffset,scrollOffset);let endIndex=startIndex;while(endIndex<count2&&measurements[endIndex].end<scrollOffset+outerSize){endIndex++}return{startIndex:startIndex,endIndex:endIndex}}const useIsomorphicLayoutEffect=typeof document!=="undefined"?React.useLayoutEffect:React.useEffect;function useVirtualizerBase(options){const rerender=React.useReducer((()=>({})),{})[1];const resolvedOptions={...options,onChange:(instance2,sync)=>{var _a;if(sync){flushSync(rerender)}else{rerender()}(_a=options.onChange)==null?void 0:_a.call(options,instance2,sync)}};const[instance]=React.useState((()=>new Virtualizer(resolvedOptions)));instance.setOptions(resolvedOptions);useIsomorphicLayoutEffect((()=>instance._didMount()),[]);useIsomorphicLayoutEffect((()=>instance._willUpdate()));return instance}function useVirtualizer(options){return useVirtualizerBase({observeElementRect:observeElementRect,observeElementOffset:observeElementOffset,scrollToFn:elementScroll,...options})}const getVirtualizedContainerStyles=maxHeight=>{let heightValue="600px";if(maxHeight){switch(maxHeight){case"xs":heightValue="200px";break;case"sm":heightValue="300px";break;case"md":heightValue="400px";break;case"lg":heightValue="500px";break;case"xl":heightValue="600px";break;case"xxl":heightValue="700px";break;case"xxxl":heightValue="800px";break;default:if(maxHeight!=="auto"){heightValue=maxHeight}}}return{overflow:"auto",position:"relative",height:heightValue,width:"100%"}};const getVirtualizedRowStyle=startPosition=>({position:"absolute",top:0,left:0,height:"40px",transform:`translateY(${startPosition}px)`,tableLayout:"fixed"});const getRowHeightEstimate=rowType=>{switch(rowType){case"header":return 40;case"loading":return 30;case"footer":return 40;case"row":default:return 40}};const AdvancedTableContext=createContext({});const AdvancedTableProvider=({children:children,...props})=>{var _a;const tableContainerRef=useRef(null);const containerRef=props.tableContainerRef||tableContainerRef;const table=props.table;const isVirtualized=props.virtualizedRows||props.enableVirtualization;const headerRef=useRef(null);const sampleRowRef=useRef(null);const[headerHeight,setHeaderHeight]=useState(44);const[rowHeight,setRowHeight]=useState(38);const[actionBarHeight,setActionBarHeight]=useState(0);const measureHeights=useCallback((()=>{var _a2;const wrapper=((_a2=props.tableContainerRef)==null?void 0:_a2.current)||tableContainerRef.current;if(headerRef.current){const headerElement=headerRef.current;const headerRect=headerElement.getBoundingClientRect();if(headerRect.height>0){setHeaderHeight(headerRect.height)}}if(sampleRowRef.current){const rowRect=sampleRowRef.current.getBoundingClientRect();if(rowRect.height>0){setRowHeight(rowRect.height)}}if(wrapper){const actionBar=wrapper.querySelector(".row-selection-actions-card.is-visible, .row-selection-actions-card.show-action-card");const measuredActionBarHeight=actionBar?measureElementHeight(actionBar):0;setActionBarHeight(measuredActionBarHeight);wrapper.style.setProperty("--advanced-table-action-bar-height",`${measuredActionBarHeight}px`)}}),[props.tableContainerRef]);useEffect((()=>{var _a2;const resizeObserver=new ResizeObserver((()=>{measureHeights()}));if(headerRef.current){resizeObserver.observe(headerRef.current)}const wrapper=((_a2=props.tableContainerRef)==null?void 0:_a2.current)||tableContainerRef.current;const actionBar=wrapper==null?void 0:wrapper.querySelector(".row-selection-actions-card");if(actionBar){resizeObserver.observe(actionBar)}if(sampleRowRef.current){resizeObserver.observe(sampleRowRef.current)}const timeoutId=setTimeout(measureHeights,100);return()=>{resizeObserver.disconnect();clearTimeout(timeoutId)}}),[measureHeights]);const headerGroupCount=((_a=table==null?void 0:table.getHeaderGroups())==null?void 0:_a.length)??0;useEffect((()=>{measureHeights()}),[table==null?void 0:table.getRowModel().rows.length,headerGroupCount,props.isActionBarVisible,measureHeights]);const flattenedItems=useMemo((()=>{if(!isVirtualized||!table){return[]}const tableRows=table.getRowModel().rows;const items=[];const subRowHeaders=props.subRowHeaders;const inlineRowLoading=props.inlineRowLoading;const columnDefinitions=props.columnDefinitions;tableRows.forEach(((row,index)=>{var _a2,_b,_c;const isFirstChildofSubrow=row.depth>0&&row.index===0;if(isFirstChildofSubrow&&subRowHeaders){items.push({type:"header",row:row,id:`header-${row.id}-${index}`})}items.push({type:"row",row:row,id:`row-${row.id}-${index}`});const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a2=row.original)==null?void 0:_a2.children)&&!row.original.children.length?true:false;const isDataLoading=isExpandable&&(inlineRowLoading&&rowHasNoChildren)&&row.depth<(((_c=(_b=columnDefinitions[0])==null?void 0:_b.cellAccessors)==null?void 0:_c.length)||0);if(isDataLoading){items.push({type:"loading",row:row,id:`loading-${row.id}-${index}`})}}));const isFetching=props.isFetching||false;const shouldAddFooter=table&&!isFetching&&tableRows.length>0;if(shouldAddFooter){items.push({type:"footer",row:{},id:`footer-row`})}return items}),[isVirtualized,table,props.subRowHeaders,props.inlineRowLoading,props.columnDefinitions,table==null?void 0:table.getRowModel().rows.length,JSON.stringify((table==null?void 0:table.getState().sorting)||[]),JSON.stringify((table==null?void 0:table.getState().expanded)||{})]);const virtualizer=useVirtualizer({count:isVirtualized&&flattenedItems.length>0?flattenedItems.length:0,getScrollElement:()=>containerRef.current,estimateSize:index=>{if(!isVirtualized||flattenedItems.length===0)return 0;const item=flattenedItems[index];if(!item)return getRowHeightEstimate("row");return getRowHeightEstimate(item.type)},overscan:10,getItemKey:index=>{var _a2;if(!isVirtualized||flattenedItems.length===0||index>=flattenedItems.length){return`item-${index}`}return((_a2=flattenedItems[index])==null?void 0:_a2.id)||`item-${index}`}});useEffect((()=>{if(isVirtualized&&virtualizer&&table&&containerRef.current){virtualizer.setOptions({...virtualizer.options,count:flattenedItems.length});virtualizer.measure()}}),[isVirtualized,virtualizer,table,containerRef,JSON.stringify((table==null?void 0:table.getState().sorting)||[]),JSON.stringify((table==null?void 0:table.getState().expanded)||{}),flattenedItems.length]);const contextValue={...props,table:table,tableContainerRef:containerRef,virtualizer:isVirtualized?virtualizer:null,flattenedItems:flattenedItems,virtualizedRows:isVirtualized,enableVirtualization:isVirtualized,rowPinning:props.rowPinning,setRowPinning:props.setRowPinning,keepPinnedRows:props.keepPinnedRows,headerHeight:headerHeight,rowHeight:rowHeight,actionBarHeight:actionBarHeight,headerRef:headerRef,sampleRowRef:sampleRowRef,measureHeights:measureHeights};return jsx(AdvancedTableContext.Provider,{value:contextValue,children:children})};
|
|
1
|
+
import{jsx,jsxs,Fragment}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useRef,useState,useCallback,useEffect,useMemo,useContext,useLayoutEffect}from"react";import{d as classnames,e as buildCss,g as globalProps,b as buildAriaProps,a as buildDataProps,c as buildHtmlProps}from"./chunks/globalProps-DDcpyjvz.js";import{C as Checkbox,P as PbReactPopover,S as SectionSeparator,L as LoadingInline,a as Pagination,F as FlexItem,T as Table}from"./chunks/_table-DDKdCER5.js";import{flushSync}from"react-dom";import{m as measureElementHeight,s as scheduleStickyActionBarHeightUpdate,b as updateStickyLayoutHeights}from"./chunks/StickyLayoutHelper-DCzCcWUN.js";import{I as Icon,F as Flex,C as Caption,D as Detail,a as Card,T as Tooltip}from"./chunks/_detail-CyTyC7gJ.js";import"./chunks/lib-D57mygNT.js";function memo$1(getDeps,fn,opts){let deps=opts.initialDeps??[];let result;return()=>{var _a,_b,_c,_d;let depTime;if(opts.key&&((_a=opts.debug)==null?void 0:_a.call(opts)))depTime=Date.now();const newDeps=getDeps();const depsChanged=newDeps.length!==deps.length||newDeps.some(((dep,index)=>deps[index]!==dep));if(!depsChanged){return result}deps=newDeps;let resultTime;if(opts.key&&((_b=opts.debug)==null?void 0:_b.call(opts)))resultTime=Date.now();result=fn(...newDeps);if(opts.key&&((_c=opts.debug)==null?void 0:_c.call(opts))){const depEndTime=Math.round((Date.now()-depTime)*100)/100;const resultEndTime=Math.round((Date.now()-resultTime)*100)/100;const resultFpsPercentage=resultEndTime/16;const pad=(str,num)=>{str=String(str);while(str.length<num){str=" "+str}return str};console.info(`%c⏱ ${pad(resultEndTime,5)} /${pad(depEndTime,5)} ms`,`\n font-size: .6rem;\n font-weight: bold;\n color: hsl(${Math.max(0,Math.min(120-120*resultFpsPercentage,120))}deg 100% 31%);`,opts==null?void 0:opts.key)}(_d=opts==null?void 0:opts.onChange)==null?void 0:_d.call(opts,result);return result}}function notUndefined(value,msg){if(value===void 0){throw new Error(`Unexpected undefined${""}`)}else{return value}}const approxEqual=(a,b)=>Math.abs(a-b)<1;const debounce=(targetWindow,fn,ms)=>{let timeoutId;return function(...args){targetWindow.clearTimeout(timeoutId);timeoutId=targetWindow.setTimeout((()=>fn.apply(this,args)),ms)}};const defaultKeyExtractor=index=>index;const defaultRangeExtractor=range=>{const start=Math.max(range.startIndex-range.overscan,0);const end=Math.min(range.endIndex+range.overscan,range.count-1);const arr=[];for(let i=start;i<=end;i++){arr.push(i)}return arr};const observeElementRect=(instance,cb)=>{const element=instance.scrollElement;if(!element){return}const targetWindow=instance.targetWindow;if(!targetWindow){return}const handler=rect=>{const{width:width,height:height}=rect;cb({width:Math.round(width),height:Math.round(height)})};handler(element.getBoundingClientRect());if(!targetWindow.ResizeObserver){return()=>{}}const observer=new targetWindow.ResizeObserver((entries=>{const run=()=>{const entry=entries[0];if(entry==null?void 0:entry.borderBoxSize){const box=entry.borderBoxSize[0];if(box){handler({width:box.inlineSize,height:box.blockSize});return}}handler(element.getBoundingClientRect())};instance.options.useAnimationFrameWithResizeObserver?requestAnimationFrame(run):run()}));observer.observe(element,{box:"border-box"});return()=>{observer.unobserve(element)}};const addEventListenerOptions={passive:true};const supportsScrollend=typeof window=="undefined"?true:"onscrollend"in window;const observeElementOffset=(instance,cb)=>{const element=instance.scrollElement;if(!element){return}const targetWindow=instance.targetWindow;if(!targetWindow){return}let offset=0;const fallback=instance.options.useScrollendEvent&&supportsScrollend?()=>void 0:debounce(targetWindow,(()=>{cb(offset,false)}),instance.options.isScrollingResetDelay);const createHandler=isScrolling=>()=>{const{horizontal:horizontal,isRtl:isRtl}=instance.options;offset=horizontal?element["scrollLeft"]*(isRtl&&-1||1):element["scrollTop"];fallback();cb(offset,isScrolling)};const handler=createHandler(true);const endHandler=createHandler(false);endHandler();element.addEventListener("scroll",handler,addEventListenerOptions);const registerScrollendEvent=instance.options.useScrollendEvent&&supportsScrollend;if(registerScrollendEvent){element.addEventListener("scrollend",endHandler,addEventListenerOptions)}return()=>{element.removeEventListener("scroll",handler);if(registerScrollendEvent){element.removeEventListener("scrollend",endHandler)}}};const measureElement=(element,entry,instance)=>{if(entry==null?void 0:entry.borderBoxSize){const box=entry.borderBoxSize[0];if(box){const size=Math.round(box[instance.options.horizontal?"inlineSize":"blockSize"]);return size}}return Math.round(element.getBoundingClientRect()[instance.options.horizontal?"width":"height"])};const elementScroll=(offset,{adjustments:adjustments=0,behavior:behavior},instance)=>{var _a,_b;const toOffset=offset+adjustments;(_b=(_a=instance.scrollElement)==null?void 0:_a.scrollTo)==null?void 0:_b.call(_a,{[instance.options.horizontal?"left":"top"]:toOffset,behavior:behavior})};class Virtualizer{constructor(opts){this.unsubs=[];this.scrollElement=null;this.targetWindow=null;this.isScrolling=false;this.scrollToIndexTimeoutId=null;this.measurementsCache=[];this.itemSizeCache=new Map;this.pendingMeasuredCacheIndexes=[];this.scrollRect=null;this.scrollOffset=null;this.scrollDirection=null;this.scrollAdjustments=0;this.elementsCache=new Map;this.observer=(()=>{let _ro=null;const get=()=>{if(_ro){return _ro}if(!this.targetWindow||!this.targetWindow.ResizeObserver){return null}return _ro=new this.targetWindow.ResizeObserver((entries=>{entries.forEach((entry=>{const run=()=>{this._measureElement(entry.target,entry)};this.options.useAnimationFrameWithResizeObserver?requestAnimationFrame(run):run()}))}))};return{disconnect:()=>{var _a;(_a=get())==null?void 0:_a.disconnect();_ro=null},observe:target=>{var _a;return(_a=get())==null?void 0:_a.observe(target,{box:"border-box"})},unobserve:target=>{var _a;return(_a=get())==null?void 0:_a.unobserve(target)}}})();this.range=null;this.setOptions=opts2=>{Object.entries(opts2).forEach((([key,value])=>{if(typeof value==="undefined")delete opts2[key]}));this.options={debug:false,initialOffset:0,overscan:1,paddingStart:0,paddingEnd:0,scrollPaddingStart:0,scrollPaddingEnd:0,horizontal:false,getItemKey:defaultKeyExtractor,rangeExtractor:defaultRangeExtractor,onChange:()=>{},measureElement:measureElement,initialRect:{width:0,height:0},scrollMargin:0,gap:0,indexAttribute:"data-index",initialMeasurementsCache:[],lanes:1,isScrollingResetDelay:150,enabled:true,isRtl:false,useScrollendEvent:true,useAnimationFrameWithResizeObserver:false,...opts2}};this.notify=sync=>{var _a,_b;(_b=(_a=this.options).onChange)==null?void 0:_b.call(_a,this,sync)};this.maybeNotify=memo$1((()=>{this.calculateRange();return[this.isScrolling,this.range?this.range.startIndex:null,this.range?this.range.endIndex:null]}),(isScrolling=>{this.notify(isScrolling)}),{key:false,debug:()=>this.options.debug,initialDeps:[this.isScrolling,this.range?this.range.startIndex:null,this.range?this.range.endIndex:null]});this.cleanup=()=>{this.unsubs.filter(Boolean).forEach((d=>d()));this.unsubs=[];this.observer.disconnect();this.scrollElement=null;this.targetWindow=null};this._didMount=()=>()=>{this.cleanup()};this._willUpdate=()=>{var _a;const scrollElement=this.options.enabled?this.options.getScrollElement():null;if(this.scrollElement!==scrollElement){this.cleanup();if(!scrollElement){this.maybeNotify();return}this.scrollElement=scrollElement;if(this.scrollElement&&"ownerDocument"in this.scrollElement){this.targetWindow=this.scrollElement.ownerDocument.defaultView}else{this.targetWindow=((_a=this.scrollElement)==null?void 0:_a.window)??null}this.elementsCache.forEach((cached=>{this.observer.observe(cached)}));this._scrollToOffset(this.getScrollOffset(),{adjustments:void 0,behavior:void 0});this.unsubs.push(this.options.observeElementRect(this,(rect=>{this.scrollRect=rect;this.maybeNotify()})));this.unsubs.push(this.options.observeElementOffset(this,((offset,isScrolling)=>{this.scrollAdjustments=0;this.scrollDirection=isScrolling?this.getScrollOffset()<offset?"forward":"backward":null;this.scrollOffset=offset;this.isScrolling=isScrolling;this.maybeNotify()})))}};this.getSize=()=>{if(!this.options.enabled){this.scrollRect=null;return 0}this.scrollRect=this.scrollRect??this.options.initialRect;return this.scrollRect[this.options.horizontal?"width":"height"]};this.getScrollOffset=()=>{if(!this.options.enabled){this.scrollOffset=null;return 0}this.scrollOffset=this.scrollOffset??(typeof this.options.initialOffset==="function"?this.options.initialOffset():this.options.initialOffset);return this.scrollOffset};this.getFurthestMeasurement=(measurements,index)=>{const furthestMeasurementsFound=new Map;const furthestMeasurements=new Map;for(let m=index-1;m>=0;m--){const measurement=measurements[m];if(furthestMeasurementsFound.has(measurement.lane)){continue}const previousFurthestMeasurement=furthestMeasurements.get(measurement.lane);if(previousFurthestMeasurement==null||measurement.end>previousFurthestMeasurement.end){furthestMeasurements.set(measurement.lane,measurement)}else if(measurement.end<previousFurthestMeasurement.end){furthestMeasurementsFound.set(measurement.lane,true)}if(furthestMeasurementsFound.size===this.options.lanes){break}}return furthestMeasurements.size===this.options.lanes?Array.from(furthestMeasurements.values()).sort(((a,b)=>{if(a.end===b.end){return a.index-b.index}return a.end-b.end}))[0]:void 0};this.getMeasurementOptions=memo$1((()=>[this.options.count,this.options.paddingStart,this.options.scrollMargin,this.options.getItemKey,this.options.enabled]),((count2,paddingStart,scrollMargin,getItemKey,enabled)=>{this.pendingMeasuredCacheIndexes=[];return{count:count2,paddingStart:paddingStart,scrollMargin:scrollMargin,getItemKey:getItemKey,enabled:enabled}}),{key:false});this.getMeasurements=memo$1((()=>[this.getMeasurementOptions(),this.itemSizeCache]),(({count:count2,paddingStart:paddingStart,scrollMargin:scrollMargin,getItemKey:getItemKey,enabled:enabled},itemSizeCache)=>{if(!enabled){this.measurementsCache=[];this.itemSizeCache.clear();return[]}if(this.measurementsCache.length===0){this.measurementsCache=this.options.initialMeasurementsCache;this.measurementsCache.forEach((item=>{this.itemSizeCache.set(item.key,item.size)}))}const min2=this.pendingMeasuredCacheIndexes.length>0?Math.min(...this.pendingMeasuredCacheIndexes):0;this.pendingMeasuredCacheIndexes=[];const measurements=this.measurementsCache.slice(0,min2);for(let i=min2;i<count2;i++){const key=getItemKey(i);const furthestMeasurement=this.options.lanes===1?measurements[i-1]:this.getFurthestMeasurement(measurements,i);const start=furthestMeasurement?furthestMeasurement.end+this.options.gap:paddingStart+scrollMargin;const measuredSize=itemSizeCache.get(key);const size=typeof measuredSize==="number"?measuredSize:this.options.estimateSize(i);const end=start+size;const lane=furthestMeasurement?furthestMeasurement.lane:i%this.options.lanes;measurements[i]={index:i,start:start,size:size,end:end,key:key,lane:lane}}this.measurementsCache=measurements;return measurements}),{key:false,debug:()=>this.options.debug});this.calculateRange=memo$1((()=>[this.getMeasurements(),this.getSize(),this.getScrollOffset()]),((measurements,outerSize,scrollOffset)=>this.range=measurements.length>0&&outerSize>0?calculateRange({measurements:measurements,outerSize:outerSize,scrollOffset:scrollOffset}):null),{key:false,debug:()=>this.options.debug});this.getVirtualIndexes=memo$1((()=>{let startIndex=null;let endIndex=null;const range=this.calculateRange();if(range){startIndex=range.startIndex;endIndex=range.endIndex}return[this.options.rangeExtractor,this.options.overscan,this.options.count,startIndex,endIndex]}),((rangeExtractor,overscan,count2,startIndex,endIndex)=>startIndex===null||endIndex===null?[]:rangeExtractor({startIndex:startIndex,endIndex:endIndex,overscan:overscan,count:count2})),{key:false,debug:()=>this.options.debug});this.indexFromElement=node=>{const attributeName=this.options.indexAttribute;const indexStr=node.getAttribute(attributeName);if(!indexStr){console.warn(`Missing attribute name '${attributeName}={index}' on measured element.`);return-1}return parseInt(indexStr,10)};this._measureElement=(node,entry)=>{const index=this.indexFromElement(node);const item=this.measurementsCache[index];if(!item){return}const key=item.key;const prevNode=this.elementsCache.get(key);if(prevNode!==node){if(prevNode){this.observer.unobserve(prevNode)}this.observer.observe(node);this.elementsCache.set(key,node)}if(node.isConnected){this.resizeItem(index,this.options.measureElement(node,entry,this))}};this.resizeItem=(index,size)=>{const item=this.measurementsCache[index];if(!item){return}const itemSize=this.itemSizeCache.get(item.key)??item.size;const delta=size-itemSize;if(delta!==0){if(this.shouldAdjustScrollPositionOnItemSizeChange!==void 0?this.shouldAdjustScrollPositionOnItemSizeChange(item,delta,this):item.start<this.getScrollOffset()+this.scrollAdjustments){this._scrollToOffset(this.getScrollOffset(),{adjustments:this.scrollAdjustments+=delta,behavior:void 0})}this.pendingMeasuredCacheIndexes.push(item.index);this.itemSizeCache=new Map(this.itemSizeCache.set(item.key,size));this.notify(false)}};this.measureElement=node=>{if(!node){this.elementsCache.forEach(((cached,key)=>{if(!cached.isConnected){this.observer.unobserve(cached);this.elementsCache.delete(key)}}));return}this._measureElement(node,void 0)};this.getVirtualItems=memo$1((()=>[this.getVirtualIndexes(),this.getMeasurements()]),((indexes,measurements)=>{const virtualItems=[];for(let k=0,len=indexes.length;k<len;k++){const i=indexes[k];const measurement=measurements[i];virtualItems.push(measurement)}return virtualItems}),{key:false,debug:()=>this.options.debug});this.getVirtualItemForOffset=offset=>{const measurements=this.getMeasurements();if(measurements.length===0){return void 0}return notUndefined(measurements[findNearestBinarySearch(0,measurements.length-1,(index=>notUndefined(measurements[index]).start),offset)])};this.getOffsetForAlignment=(toOffset,align)=>{const size=this.getSize();const scrollOffset=this.getScrollOffset();if(align==="auto"){if(toOffset>=scrollOffset+size){align="end"}}if(align==="end"){toOffset-=size}const scrollSizeProp=this.options.horizontal?"scrollWidth":"scrollHeight";const scrollSize=this.scrollElement?"document"in this.scrollElement?this.scrollElement.document.documentElement[scrollSizeProp]:this.scrollElement[scrollSizeProp]:0;const maxOffset=scrollSize-size;return Math.max(Math.min(maxOffset,toOffset),0)};this.getOffsetForIndex=(index,align="auto")=>{index=Math.max(0,Math.min(index,this.options.count-1));const item=this.measurementsCache[index];if(!item){return void 0}const size=this.getSize();const scrollOffset=this.getScrollOffset();if(align==="auto"){if(item.end>=scrollOffset+size-this.options.scrollPaddingEnd){align="end"}else if(item.start<=scrollOffset+this.options.scrollPaddingStart){align="start"}else{return[scrollOffset,align]}}const centerOffset=item.start-this.options.scrollPaddingStart+(item.size-size)/2;switch(align){case"center":return[this.getOffsetForAlignment(centerOffset,align),align];case"end":return[this.getOffsetForAlignment(item.end+this.options.scrollPaddingEnd,align),align];default:return[this.getOffsetForAlignment(item.start-this.options.scrollPaddingStart,align),align]}};this.isDynamicMode=()=>this.elementsCache.size>0;this.cancelScrollToIndex=()=>{if(this.scrollToIndexTimeoutId!==null&&this.targetWindow){this.targetWindow.clearTimeout(this.scrollToIndexTimeoutId);this.scrollToIndexTimeoutId=null}};this.scrollToOffset=(toOffset,{align:align="start",behavior:behavior}={})=>{this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}this._scrollToOffset(this.getOffsetForAlignment(toOffset,align),{adjustments:void 0,behavior:behavior})};this.scrollToIndex=(index,{align:initialAlign="auto",behavior:behavior}={})=>{index=Math.max(0,Math.min(index,this.options.count-1));this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}const offsetAndAlign=this.getOffsetForIndex(index,initialAlign);if(!offsetAndAlign)return;const[offset,align]=offsetAndAlign;this._scrollToOffset(offset,{adjustments:void 0,behavior:behavior});if(behavior!=="smooth"&&this.isDynamicMode()&&this.targetWindow){this.scrollToIndexTimeoutId=this.targetWindow.setTimeout((()=>{this.scrollToIndexTimeoutId=null;const elementInDOM=this.elementsCache.has(this.options.getItemKey(index));if(elementInDOM){const[latestOffset]=notUndefined(this.getOffsetForIndex(index,align));if(!approxEqual(latestOffset,this.getScrollOffset())){this.scrollToIndex(index,{align:align,behavior:behavior})}}else{this.scrollToIndex(index,{align:align,behavior:behavior})}}))}};this.scrollBy=(delta,{behavior:behavior}={})=>{this.cancelScrollToIndex();if(behavior==="smooth"&&this.isDynamicMode()){console.warn("The `smooth` scroll behavior is not fully supported with dynamic size.")}this._scrollToOffset(this.getScrollOffset()+delta,{adjustments:void 0,behavior:behavior})};this.getTotalSize=()=>{var _a;const measurements=this.getMeasurements();let end;if(measurements.length===0){end=this.options.paddingStart}else{end=this.options.lanes===1?((_a=measurements[measurements.length-1])==null?void 0:_a.end)??0:Math.max(...measurements.slice(-this.options.lanes).map((m=>m.end)))}return Math.max(end-this.options.scrollMargin+this.options.paddingEnd,0)};this._scrollToOffset=(offset,{adjustments:adjustments,behavior:behavior})=>{this.options.scrollToFn(offset,{behavior:behavior,adjustments:adjustments},this)};this.measure=()=>{this.itemSizeCache=new Map;this.notify(false)};this.setOptions(opts)}}const findNearestBinarySearch=(low,high,getCurrentValue,value)=>{while(low<=high){const middle=(low+high)/2|0;const currentValue=getCurrentValue(middle);if(currentValue<value){low=middle+1}else if(currentValue>value){high=middle-1}else{return middle}}if(low>0){return low-1}else{return 0}};function calculateRange({measurements:measurements,outerSize:outerSize,scrollOffset:scrollOffset}){const count2=measurements.length-1;const getOffset=index=>measurements[index].start;const startIndex=findNearestBinarySearch(0,count2,getOffset,scrollOffset);let endIndex=startIndex;while(endIndex<count2&&measurements[endIndex].end<scrollOffset+outerSize){endIndex++}return{startIndex:startIndex,endIndex:endIndex}}const useIsomorphicLayoutEffect=typeof document!=="undefined"?React.useLayoutEffect:React.useEffect;function useVirtualizerBase(options){const rerender=React.useReducer((()=>({})),{})[1];const resolvedOptions={...options,onChange:(instance2,sync)=>{var _a;if(sync){flushSync(rerender)}else{rerender()}(_a=options.onChange)==null?void 0:_a.call(options,instance2,sync)}};const[instance]=React.useState((()=>new Virtualizer(resolvedOptions)));instance.setOptions(resolvedOptions);useIsomorphicLayoutEffect((()=>instance._didMount()),[]);useIsomorphicLayoutEffect((()=>instance._willUpdate()));return instance}function useVirtualizer(options){return useVirtualizerBase({observeElementRect:observeElementRect,observeElementOffset:observeElementOffset,scrollToFn:elementScroll,...options})}const getVirtualizedContainerStyles=maxHeight=>{let heightValue="600px";if(maxHeight){switch(maxHeight){case"xs":heightValue="200px";break;case"sm":heightValue="300px";break;case"md":heightValue="400px";break;case"lg":heightValue="500px";break;case"xl":heightValue="600px";break;case"xxl":heightValue="700px";break;case"xxxl":heightValue="800px";break;default:if(maxHeight!=="auto"){heightValue=maxHeight}}}return{overflow:"auto",position:"relative",height:heightValue,width:"100%"}};const getVirtualizedRowStyle=startPosition=>({position:"absolute",top:0,left:0,height:"40px",transform:`translateY(${startPosition}px)`,tableLayout:"fixed"});const getRowHeightEstimate=rowType=>{switch(rowType){case"header":return 40;case"loading":return 30;case"footer":return 40;case"row":default:return 40}};const AdvancedTableContext=createContext({});const AdvancedTableProvider=({children:children,...props})=>{var _a;const tableContainerRef=useRef(null);const containerRef=props.tableContainerRef||tableContainerRef;const table=props.table;const isVirtualized=props.virtualizedRows||props.enableVirtualization;const headerRef=useRef(null);const sampleRowRef=useRef(null);const[headerHeight,setHeaderHeight]=useState(44);const[rowHeight,setRowHeight]=useState(38);const[actionBarHeight,setActionBarHeight]=useState(0);const measureHeights=useCallback((()=>{var _a2;const wrapper=((_a2=props.tableContainerRef)==null?void 0:_a2.current)||tableContainerRef.current;if(headerRef.current){const headerElement=headerRef.current;const headerRect=headerElement.getBoundingClientRect();if(headerRect.height>0){setHeaderHeight(headerRect.height)}}if(sampleRowRef.current){const rowRect=sampleRowRef.current.getBoundingClientRect();if(rowRect.height>0){setRowHeight(rowRect.height)}}if(wrapper){const actionBar=wrapper.querySelector(".row-selection-actions-card.is-visible, .row-selection-actions-card.show-action-card");const measuredActionBarHeight=actionBar?measureElementHeight(actionBar):0;setActionBarHeight(measuredActionBarHeight);wrapper.style.setProperty("--advanced-table-action-bar-height",`${measuredActionBarHeight}px`)}}),[props.tableContainerRef]);useEffect((()=>{var _a2;const resizeObserver=new ResizeObserver((()=>{measureHeights()}));if(headerRef.current){resizeObserver.observe(headerRef.current)}const wrapper=((_a2=props.tableContainerRef)==null?void 0:_a2.current)||tableContainerRef.current;const actionBar=wrapper==null?void 0:wrapper.querySelector(".row-selection-actions-card");if(actionBar){resizeObserver.observe(actionBar)}if(sampleRowRef.current){resizeObserver.observe(sampleRowRef.current)}const timeoutId=setTimeout(measureHeights,100);return()=>{resizeObserver.disconnect();clearTimeout(timeoutId)}}),[measureHeights]);const headerGroupCount=((_a=table==null?void 0:table.getHeaderGroups())==null?void 0:_a.length)??0;useEffect((()=>{measureHeights()}),[table==null?void 0:table.getRowModel().rows.length,headerGroupCount,props.isActionBarVisible,measureHeights]);const flattenedItems=useMemo((()=>{if(!isVirtualized||!table){return[]}const tableRows=table.getRowModel().rows;const items=[];const subRowHeaders=props.subRowHeaders;const inlineRowLoading=props.inlineRowLoading;const columnDefinitions=props.columnDefinitions;tableRows.forEach(((row,index)=>{var _a2,_b,_c;const isFirstChildofSubrow=row.depth>0&&row.index===0;if(isFirstChildofSubrow&&subRowHeaders){items.push({type:"header",row:row,id:`header-${row.id}-${index}`})}items.push({type:"row",row:row,id:`row-${row.id}-${index}`});const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a2=row.original)==null?void 0:_a2.children)&&!row.original.children.length?true:false;const isDataLoading=isExpandable&&(inlineRowLoading&&rowHasNoChildren)&&row.depth<(((_c=(_b=columnDefinitions[0])==null?void 0:_b.cellAccessors)==null?void 0:_c.length)||0);if(isDataLoading){items.push({type:"loading",row:row,id:`loading-${row.id}-${index}`})}}));const isFetching=props.isFetching||false;const shouldAddFooter=table&&!isFetching&&tableRows.length>0;if(shouldAddFooter){items.push({type:"footer",row:{},id:`footer-row`})}return items}),[isVirtualized,table,props.subRowHeaders,props.inlineRowLoading,props.columnDefinitions,table==null?void 0:table.getRowModel().rows.length,JSON.stringify((table==null?void 0:table.getState().sorting)||[]),JSON.stringify((table==null?void 0:table.getState().expanded)||{})]);const virtualizer=useVirtualizer({count:isVirtualized&&flattenedItems.length>0?flattenedItems.length:0,getScrollElement:()=>containerRef.current,estimateSize:index=>{if(!isVirtualized||flattenedItems.length===0)return 0;const item=flattenedItems[index];if(!item)return getRowHeightEstimate("row");return getRowHeightEstimate(item.type)},overscan:10,getItemKey:index=>{var _a2;if(!isVirtualized||flattenedItems.length===0||index>=flattenedItems.length){return`item-${index}`}return((_a2=flattenedItems[index])==null?void 0:_a2.id)||`item-${index}`}});useEffect((()=>{if(isVirtualized&&virtualizer&&table&&containerRef.current){virtualizer.setOptions({...virtualizer.options,count:flattenedItems.length});virtualizer.measure()}}),[isVirtualized,virtualizer,table,containerRef,JSON.stringify((table==null?void 0:table.getState().sorting)||[]),JSON.stringify((table==null?void 0:table.getState().expanded)||{}),flattenedItems.length]);const contextValue={...props,table:table,tableContainerRef:containerRef,virtualizer:isVirtualized?virtualizer:null,flattenedItems:flattenedItems,virtualizedRows:isVirtualized,enableVirtualization:isVirtualized,rowPinning:props.rowPinning,setRowPinning:props.setRowPinning,keepPinnedRows:props.keepPinnedRows,headerHeight:headerHeight,rowHeight:rowHeight,actionBarHeight:actionBarHeight,headerRef:headerRef,sampleRowRef:sampleRowRef,measureHeights:measureHeights};return jsx(AdvancedTableContext.Provider,{value:contextValue,children:children})};
|
|
2
2
|
/**
|
|
3
3
|
* table-core
|
|
4
4
|
*
|
package/dist/ai/all-schemas.json
CHANGED
|
@@ -3185,6 +3185,62 @@
|
|
|
3185
3185
|
"category": "form_and_dashboard_text_patterns",
|
|
3186
3186
|
"status": "stable"
|
|
3187
3187
|
},
|
|
3188
|
+
"container": {
|
|
3189
|
+
"$schema": "https://playbook.powerapp.cloud/schemas/kit-schema.json",
|
|
3190
|
+
"name": "Container",
|
|
3191
|
+
"description": "The Container component is used as a wrapper for the content of a page or to any container.",
|
|
3192
|
+
"platforms": [
|
|
3193
|
+
"react",
|
|
3194
|
+
"rails"
|
|
3195
|
+
],
|
|
3196
|
+
"props": {
|
|
3197
|
+
"tag": {
|
|
3198
|
+
"type": "enum",
|
|
3199
|
+
"platforms": [
|
|
3200
|
+
"react",
|
|
3201
|
+
"rails"
|
|
3202
|
+
],
|
|
3203
|
+
"values": [
|
|
3204
|
+
"div",
|
|
3205
|
+
"span",
|
|
3206
|
+
"a",
|
|
3207
|
+
"button",
|
|
3208
|
+
"option",
|
|
3209
|
+
"table",
|
|
3210
|
+
"tbody",
|
|
3211
|
+
"thead",
|
|
3212
|
+
"tfoot",
|
|
3213
|
+
"tr",
|
|
3214
|
+
"td",
|
|
3215
|
+
"th",
|
|
3216
|
+
"img",
|
|
3217
|
+
"section",
|
|
3218
|
+
"article",
|
|
3219
|
+
"main",
|
|
3220
|
+
"header",
|
|
3221
|
+
"footer",
|
|
3222
|
+
"nav",
|
|
3223
|
+
"aside"
|
|
3224
|
+
],
|
|
3225
|
+
"default": "div"
|
|
3226
|
+
}
|
|
3227
|
+
},
|
|
3228
|
+
"globalProps": true,
|
|
3229
|
+
"usage": {
|
|
3230
|
+
"react": {
|
|
3231
|
+
"import": "import { Container } from 'playbook-ui'",
|
|
3232
|
+
"example": "<Container>\n Hello, I am a div container\n</Container>",
|
|
3233
|
+
"preset": "Default"
|
|
3234
|
+
},
|
|
3235
|
+
"rails": {
|
|
3236
|
+
"import": null,
|
|
3237
|
+
"example": "<%= pb_rails(\"container\") do %>\n Hello, I am a div container\n<% end %>",
|
|
3238
|
+
"preset": "Default"
|
|
3239
|
+
}
|
|
3240
|
+
},
|
|
3241
|
+
"category": "layout_and_structure",
|
|
3242
|
+
"status": "stable"
|
|
3243
|
+
},
|
|
3188
3244
|
"copy_button": {
|
|
3189
3245
|
"$schema": "https://playbook.powerapp.cloud/schemas/kit-schema.json",
|
|
3190
3246
|
"name": "CopyButton",
|
package/dist/ai/index.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "17.1.0
|
|
3
|
-
"generated": "2026-08-
|
|
2
|
+
"version": "17.1.0",
|
|
3
|
+
"generated": "2026-08-25T17:35:51.459Z",
|
|
4
4
|
"schemas": {
|
|
5
5
|
"globalProps": "global-props.schema.json",
|
|
6
6
|
"kits": {
|
|
@@ -18,6 +18,7 @@
|
|
|
18
18
|
"circle_icon_button": "kits/circle_icon_button.schema.json",
|
|
19
19
|
"collapsible": "kits/collapsible.schema.json",
|
|
20
20
|
"contact": "kits/contact.schema.json",
|
|
21
|
+
"container": "kits/container.schema.json",
|
|
21
22
|
"copy_button": "kits/copy_button.schema.json",
|
|
22
23
|
"currency": "kits/currency.schema.json",
|
|
23
24
|
"dashboard_value": "kits/dashboard_value.schema.json",
|
|
@@ -130,6 +131,7 @@
|
|
|
130
131
|
"circle_icon_button": "playgrounds/circle_icon_button.json",
|
|
131
132
|
"collapsible": "playgrounds/collapsible.json",
|
|
132
133
|
"contact": "playgrounds/contact.json",
|
|
134
|
+
"container": "playgrounds/container.json",
|
|
133
135
|
"copy_button": "playgrounds/copy_button.json",
|
|
134
136
|
"currency": "playgrounds/currency.json",
|
|
135
137
|
"dashboard_value": "playgrounds/dashboard_value.json",
|
|
@@ -325,6 +327,13 @@
|
|
|
325
327
|
"schema": "kits/contact.schema.json",
|
|
326
328
|
"playground": "playgrounds/contact.json"
|
|
327
329
|
},
|
|
330
|
+
"container": {
|
|
331
|
+
"category": "layout_and_structure",
|
|
332
|
+
"description": "The Container component is used as a wrapper for the content of a page or to any container.",
|
|
333
|
+
"status": "stable",
|
|
334
|
+
"schema": "kits/container.schema.json",
|
|
335
|
+
"playground": "playgrounds/container.json"
|
|
336
|
+
},
|
|
328
337
|
"copy_button": {
|
|
329
338
|
"category": "buttons",
|
|
330
339
|
"description": "Button that copies text to clipboard with visual feedback.",
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "https://playbook.powerapp.cloud/schemas/kit-schema.json",
|
|
3
|
+
"name": "Container",
|
|
4
|
+
"description": "The Container component is used as a wrapper for the content of a page or to any container.",
|
|
5
|
+
"platforms": [
|
|
6
|
+
"react",
|
|
7
|
+
"rails"
|
|
8
|
+
],
|
|
9
|
+
"props": {
|
|
10
|
+
"tag": {
|
|
11
|
+
"type": "enum",
|
|
12
|
+
"platforms": [
|
|
13
|
+
"react",
|
|
14
|
+
"rails"
|
|
15
|
+
],
|
|
16
|
+
"values": [
|
|
17
|
+
"div",
|
|
18
|
+
"span",
|
|
19
|
+
"a",
|
|
20
|
+
"button",
|
|
21
|
+
"option",
|
|
22
|
+
"table",
|
|
23
|
+
"tbody",
|
|
24
|
+
"thead",
|
|
25
|
+
"tfoot",
|
|
26
|
+
"tr",
|
|
27
|
+
"td",
|
|
28
|
+
"th",
|
|
29
|
+
"img",
|
|
30
|
+
"section",
|
|
31
|
+
"article",
|
|
32
|
+
"main",
|
|
33
|
+
"header",
|
|
34
|
+
"footer",
|
|
35
|
+
"nav",
|
|
36
|
+
"aside"
|
|
37
|
+
],
|
|
38
|
+
"default": "div"
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
"globalProps": true,
|
|
42
|
+
"usage": {
|
|
43
|
+
"react": {
|
|
44
|
+
"import": "import { Container } from 'playbook-ui'",
|
|
45
|
+
"example": "<Container>\n Hello, I am a div container\n</Container>",
|
|
46
|
+
"preset": "Default"
|
|
47
|
+
},
|
|
48
|
+
"rails": {
|
|
49
|
+
"import": null,
|
|
50
|
+
"example": "<%= pb_rails(\"container\") do %>\n Hello, I am a div container\n<% end %>",
|
|
51
|
+
"preset": "Default"
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
"category": "layout_and_structure",
|
|
55
|
+
"status": "stable"
|
|
56
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"presets":[{"name":"Default","props":{},"children":"Hello, I am a div container"},{"name":"Span","props":{"tag":"span"},"children":"Hello, I am a span container"},{"name":"Global Props","props":{"border":"default","borderRadius":"lg","hover":{"shadow":"deepest"},"maxWidth":"sm","padding":"md","shadow":"deep"},"children":"Hello, I am a styled container"}],"hints":{"link_tag":{"when":{"tag":"a"},"message":"Use htmlOptions to add href and other HTML attributes when tag is a.","type":"info"}},"conditionals":{},"template":"<Container{{props}}>\n {{children}}\n</Container>","children":{"editable":true,"default":"Hello, I am a div container"},"propTargets":{}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"presets":[{"name":"Default","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Misty forest","size":"md","transition":"fade"}},{"name":"Extra Small","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Extra small misty forest","size":"xs","transition":"fade"}},{"name":"Rounded","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Rounded misty forest","rounded":true,"size":"md","transition":"fade"}},{"name":"Blur Transition","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Blur transition image","size":"md","transition":"blur"}},{"name":"Scale Transition","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Scale transition image","size":"md","transition":"scale"}},{"name":"Custom Error Handler","props":{"url":"https://example.invalid/missing-image.jpg","alt":"Broken image example","onError":"() => console.log('image failed to load')","size":"md","transition":"fade"}}],"hints":{"default":{"presetName":"Default","message":"Use the url prop to pass the image URL.","type":"info"},"rounded":{"presetName":"Rounded","message":"rounded adds the rounded class while preserving the selected size.","type":"info"},"blur_transition":{"presetName":"Blur Transition","message":"Use the transition prop to select
|
|
1
|
+
{"presets":[{"name":"Default","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Misty forest","size":"md","transition":"fade"}},{"name":"Extra Small","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Extra small misty forest","size":"xs","transition":"fade"}},{"name":"Rounded","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Rounded misty forest","rounded":true,"size":"md","transition":"fade"}},{"name":"Blur Transition","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Blur transition image","size":"md","transition":"blur"}},{"name":"Scale Transition","props":{"url":"https://unsplash.it/500/400/?image=634","alt":"Scale transition image","size":"md","transition":"scale"}},{"name":"Custom Error Handler","props":{"url":"https://example.invalid/missing-image.jpg","alt":"Broken image example","onError":"() => console.log('image failed to load')","size":"md","transition":"fade"}}],"hints":{"default":{"presetName":"Default","message":"Use the url prop to pass the image URL.","type":"info"},"rounded":{"presetName":"Rounded","message":"rounded adds the rounded class while preserving the selected size.","type":"info"},"blur_transition":{"presetName":"Blur Transition","message":"Use the transition prop to select fade, blur, or scale.","type":"info"},"custom_error_handler":{"presetName":"Custom Error Handler","message":"Use the onError prop to pass a function to handle the image error.","type":"info"},"Extra Small":{"presetName":"Extra Small","message":"Use the size prop to change the size of the image.","type":"info"},"Rounded":{"presetName":"Rounded","message":"Use the rounded prop to add rounded corners to the image.","type":"info"}},"conditionals":{},"template":"<Image{{props}} />","customProps":{"alt":{"type":"string","platforms":["react"]},"url":{"type":"string","platforms":["react"]},"size":{"type":"enum","platforms":["react"],"values":["xs","sm","md","lg","xl"],"default":"md"},"rounded":{"type":"boolean","platforms":["react"],"default":false},"transition":{"type":"enum","platforms":["react"],"values":["blur","fade","scale"],"default":"fade"},"onError":{"type":"function","platforms":["react"]}},"propTargets":{}}
|