@sap-ux/ui-components 1.13.2 → 1.13.3

package/storybook/UIFlexibleTable-story.3606536e.iframe.bundle.js

@@ -0,0 +1,74 @@
+"use strict";(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[210],{"./stories/UIFlexibleTable.story.tsx":function(Ue,T,V){var ve=Object.defineProperty,Se=Object.defineProperties,ye=Object.getOwnPropertyDescriptors,we=Object.getOwnPropertySymbols,De=Object.prototype.hasOwnProperty,Ce=Object.prototype.propertyIsEnumerable,pe=(o,l,t)=>l in o?ve(o,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[l]=t,E=(o,l)=>{for(var t in l||(l={}))De.call(l,t)&&pe(o,t,l[t]);if(we)for(var t of we(l))Ce.call(l,t)&&pe(o,t,l[t]);return o},_=(o,l)=>Se(o,ye(l)),ke=this&&this.__createBinding||(Object.create?function(o,l,t,r){r===void 0&&(r=t);var d=Object.getOwnPropertyDescriptor(l,t);(!d||("get"in d?!l.__esModule:d.writable||d.configurable))&&(d={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(o,r,d)}:function(o,l,t,r){r===void 0&&(r=t),o[r]=l[t]}),Te=this&&this.__setModuleDefault||(Object.create?function(o,l){Object.defineProperty(o,"default",{enumerable:!0,value:l})}:function(o,l){o.default=l}),Ee=this&&this.__importStar||function(o){if(o&&o.__esModule)return o;var l={};if(o!=null)for(var t in o)t!=="default"&&Object.prototype.hasOwnProperty.call(o,t)&&ke(l,o,t);return Te(l,o),l};Object.defineProperty(T,"__esModule",{value:!0}),T.WrappingTable=T.InlineFlexTable=void 0;const e=Ee(V("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),c=V("./src/components/index.tsx"),me=V("../../node_modules/.pnpm/react-movable@2.4.0_react-dom@16.14.0_react@16.14.0/node_modules/react-movable/lib/index.js");(0,V("./src/components/Icons.tsx").initIcons)(),T.default={title:"Tables/UIFlexibleTable"};const A=["table1","table2"],F=Array.from({length:10}).map((o,l)=>({key:`column${l+1}`,title:l===0?"Beginning Column":`Column ${l+1}`,tooltip:`Tooltip for column #${l+1}`}));F.push({key:"preferred",title:"Preferred",hidden:!0});const Y=o=>{const l={};return F.forEach((t,r)=>{l[t.key]=r<5?`sample_${o}${r}`:"a"}),l},ge=[],xe=(o,l,t)=>o.map((d,b)=>{const m={};F.forEach((g,h)=>{m[g.key]={type:h<5?"input":l&&h===9?"link":"dropdown",value:o[b][g.key]}});const x=m.preferred.value==="1";return{key:b.toFixed(0),title:`Row ${b+1}`,className:t===b||t===100?"active-row":x?"preferred-row":"",cells:m,tooltip:`Tooltip for row #${b+1}`}});function he(o,l,t,r){const d=o.value.value,b=o.colIndex===1&&o.rowIndex===2&&r,m=F[o.colIndex];switch(o.value.type){case"dropdown":{const x=["a","b","c"].map(g=>({key:g,text:`Option ${g.toUpperCase()}`}));return{title:b?"Custom Title for spanned cell":void 0,isSpan:b,cellClassNames:b?"spanned-cell":r&&o.rowIndex===2&&!b?"not-spanned-cell":void 0,content:e.default.createElement(c.UIDropdown,{options:x,selectedKey:d,disabled:l,onChange:(g,h,k)=>{var B;return t((B=h==null?void 0:h.key.toString())!=null?B:"")},title:m.tooltip})}}case"input":return{title:b?"Custom Title for spanned cell":void 0,isSpan:b,cellClassNames:[b?"spanned-cell":r&&o.rowIndex===2&&!b?"not-spanned-cell":""],content:e.default.createElement(_e,{value:d,readonly:l,onChange:x=>t(x),title:m.tooltip})};default:return{content:e.default.createElement(c.UILink,{href:"",title:"Tooltip for navigation"},"Link")}}}function _e(o){const[l,t]=(0,e.useState)("");(0,e.useEffect)(()=>{t(o.value)},[o.value]);const r=d=>{t(d)};return e.default.createElement(c.UITextInput,{value:l,readOnly:o.readonly,onChange:(d,b)=>r(b||""),onBlur:()=>{o.value!==l&&setTimeout(()=>{o.onChange(l)},0)},title:o.title})}function Ie(o){const l=Y(o.length);o.push(l)}const Ae=`
+.flexible-table {
+    font-size: 13px;
+}
+
+body .flexible-table-content-table-row.dragged {
+    font-size: 13px;
+}
+
+.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
+    min-width: 130px !important;
+}
+
+.flexible-table-content-table-row.active-row {
+    background: #D0FFD0;
+}
+
+.table-column.fixed {
+    width: 100px;
+}
+
+.table-column.column-0 {
+    background: #FFD0B0;
+}
+
+.table-column.column-5 {
+    background: #D0B0FF;
+}
+
+.in-row .spanned-cell {
+    flex: 9;
+    
+}
+.in-row .not-spanned-cell {
+    flex: 1;
+}
+`,Fe=()=>{const[o,l]=(0,e.useState)(ge),[t,r]=(0,e.useState)([]),[d,b]=(0,e.useState)(!1),[m,x]=(0,e.useState)(!0),[g,h]=(0,e.useState)(!0),[k,B]=(0,e.useState)(!1),[L,Z]=(0,e.useState)(!1),[N,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[v,te]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[I,ne]=(0,e.useState)(!1),[O,le]=(0,e.useState)(!0),[S,ae]=(0,e.useState)(!1),[$,H]=(0,e.useState)(!1),[M,re]=(0,e.useState)(!1),[W,z]=(0,e.useState)(-1),[y,se]=(0,e.useState)(!1),[j,ie]=(0,e.useState)(!1),[D,G]=(0,e.useState)(!1),[p,ce]=(0,e.useState)(!1),[K,de]=(0,e.useState)(!0),i=(0,e.useRef)({}),J=a=>{a.stopPropagation()},C=a=>{l(xe(a,S,W))};(0,e.useEffect)(()=>{for(const a in i.current){const f=i.current[a];f.current&&(f.current.removeEventListener("mousedown",J),f.current.addEventListener("mousedown",J))}}),(0,e.useEffect)(()=>{C(t)},[S,W]),(0,e.useEffect)(()=>{const a=Array.from({length:3}).map((f,R)=>Y(R));r(a),C(a)},[]);const Q=()=>(Ie(t),r(t),C(t),{scrollToRow:t.length-1}),ue=a=>{t.splice(a.rowIndex,1),r(t),C(t)},be=a=>{const f=p&&a.oldIndex===0&&a.newIndex>1;if(!f){const R=(0,me.arrayMove)(t,a.oldIndex,a.newIndex);r(R),C(R)}return{isDropDisabled:f}},u=(a,f,R)=>e.default.createElement(c.UICheckbox,{label:a,checked:f,onChange:()=>{R(!f)}}),n=a=>{const f=`cell-${a.rowIndex}-${a.colIndex}`;i.current[f]||(i.current[f]=e.default.createRef());const Re=he(a,I,Le=>{t[a.rowIndex][a.colKey]=Le,r(t),C(t)},M);return _(E({},Re),{content:e.default.createElement("div",{ref:i.current[f]},Re.content)})},s=a=>{if(a.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},w=a=>{z(a),new Promise(f=>{setTimeout(()=>f(!0),2e3)}).then(()=>{z(-1)})},X=a=>[e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${a.rowIndex}`,actionName:"GotoCode",tableId:A[0],iconName:c.UiIcons.CodeSnippet,rowNumber:a.rowIndex,onClick:()=>w(a.rowIndex),title:"Navigation demo"})],fe=a=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:A[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>w(100),title:"Navigation demo"})],Pe=a=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:d||a.readonly,onClick:()=>{r([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("h3",null,"In-line layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},u("Vertical layout",N,q),u("Show titles",g,h),u("Show titles in cells",L,Z),u("Show row headers",k,B),u("Show Index",O,le),u("Show custom content",S,ae),u("Span cells",M,re),u("Reorder enabled",m,x),u("Reorder restrictions",p,ce),u("Disable Adding",v,te),u("Disable Deletion",P,oe),u("Readonly",I,ne),u("No row background",U,ee),u("Loading data",d,b),u("Column highlight",$,H),u("Is fixed max width",y,se),u("Lock vertically",j,ie),u("Reverse background",D,G),u("Disable drag using touch",K,de)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ae),e.default.createElement("div",{style:{maxWidth:N?"500px":"1300px"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:I?"Disabled due to read only mode":"",onClick:Q},columns:F.map((a,f)=>_(E({},a),{className:`table-column column-${$?f:""}${S?"fixed":""}`})),id:A[0],layout:c.UIFlexibleTableLayout.InlineFlex,onRenderCell:n,rows:o,inRowLayoutMinWidth:1e3,onDeleteRow:ue,showColumnTitles:g,showColumnTitlesInCells:L,isContentLoading:d,onTableReorder:m?be:void 0,noRowBackground:U,isAddItemDisabled:v,showIndexColumn:O,readonly:I,onRenderDeleteAction:a=>({isDeleteDisabled:P&&a.rowIndex===0,tooltip:P&&a.rowIndex===0?"Disabled for demo purposes":"Click to delete the row"}),onRenderActions:X,onRenderRowDataContent:S?s:void 0,onRenderReorderActions:a=>p?{up:{disabled:a.rowIndex===1,tooltip:a.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:a.rowIndex===1,tooltip:a.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:p?a=>({rows:a.rows.map((f,R)=>_(E({},f),{disabled:R===1}))}):void 0,onRenderRowContainer:p?a=>({isDropWarning:!a.isDragged&&!!a.rowIndex&&a.rowIndex>1}):void 0,maxScrollableContentHeight:N?700:220,showRowTitles:k,maxWidth:y?800:void 0,lockVertically:j,reverseBackground:D,onRenderPrimaryTableActions:Pe,onRenderSecondaryTableActions:fe,noDataText:"No data",isTouchDragDisabled:K}))))};T.InlineFlexTable=Fe;const Be=`
+
+.flexible-table {
+    font-size: 13px;
+}
+
+body .flexible-table-content-table-row.dragged {
+    font-size: 13px;
+}
+
+.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
+    min-width: 130px !important;
+}
+
+.flexible-table-content-table-row.preferred-row {
+    background: #FFD0D0;
+}
+
+.flexible-table-content-table-row.active-row {
+    background: #D0FFD0;
+}
+
+.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper {
+    width: 120px !important;
+}
+
+.table-column.column-0 {
+    background: #FFD0B0;
+}
+
+.table-column.column-5 {
+    background: #D0B0FF;
+}
+
+.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper.spanned-cell {
+    width: 240px !important;
+}
+`,Ne=()=>{const[o,l]=(0,e.useState)(ge),[t,r]=(0,e.useState)([]),[d,b]=(0,e.useState)(!1),[m,x]=(0,e.useState)(!0),[g,h]=(0,e.useState)(!0),[k,B]=(0,e.useState)(!1),[L,Z]=(0,e.useState)(!1),[N,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[v,te]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[I,ne]=(0,e.useState)(!1),[O,le]=(0,e.useState)(!1),[S,ae]=(0,e.useState)(!1),[$,H]=(0,e.useState)(-1),[M,re]=(0,e.useState)(!1),[W,z]=(0,e.useState)(!1),[y,se]=(0,e.useState)(!1),[j,ie]=(0,e.useState)(!0),D=(0,e.useRef)({}),G=n=>{n.stopPropagation()},p=n=>{l(xe(n,I,$))};(0,e.useEffect)(()=>{for(const n in D.current){const s=D.current[n];s.current&&(s.current.removeEventListener("mousedown",G),s.current.addEventListener("mousedown",G))}}),(0,e.useEffect)(()=>{p(t)},[I,$]),(0,e.useEffect)(()=>{const n=Array.from({length:3}).map((s,w)=>Y(w));r(n),p(n)},[]);const ce=()=>(Ie(t),r(t),p(t),{scrollToRow:t.length-1}),K=n=>{t.splice(n.rowIndex,1),r(t),p(t)},de=n=>{const s=y&&n.oldIndex===0&&n.newIndex>1;if(!s){const w=(0,me.arrayMove)(t,n.oldIndex,n.newIndex);r(w),p(w)}return{isDropDisabled:s}},i=(n,s,w)=>e.default.createElement(c.UICheckbox,{label:n,checked:s,onChange:()=>{w(!s)}}),J=n=>{const s=`cell-${n.rowIndex}-${n.colIndex}`;D.current[s]||(D.current[s]=e.default.createRef());const X=he(n,v,fe=>{t[n.rowIndex][n.colKey]=fe,r(t),p(t)},S);return _(E({},X),{content:e.default.createElement("div",{ref:D.current[s]},X.content)})},C=n=>{if(n.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},Q=n=>{H(n),new Promise(s=>{setTimeout(()=>s(!0),2e3)}).then(()=>{H(-1)})},ue=n=>[e.default.createElement(c.UIToggle,{key:"1",label:"Preferred",checked:n.cells.preferred.value==="1",onChange:(s,w)=>{t[n.rowIndex].preferred=w?"1":"0",r(t),p(t)},inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,size:c.UIToggleSize.Small,disabled:v}),e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${n.rowIndex}`,actionName:"GotoCode",tableId:A[1],iconName:c.UiIcons.CodeSnippet,rowNumber:n.rowIndex,onClick:()=>Q(n.rowIndex),title:"Navigation demo"})],be=n=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:A[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>Q(100),title:"Navigation demo"})],u=n=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:d||n.readonly,onClick:()=>{r([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("hr",null),e.default.createElement("h3",null,"Wrapping layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},i("Compact size",k,B),i("Show titles",g,h),i("Show Index",P,oe),i("Show custom content",I,ne),i("Span cells",S,ae),i("Reorder enabled",m,x),i("Reorder restrictions",y,se),i("Disable Adding",N,q),i("Disable Deletion",U,ee),i("Readonly",v,te),i("No row background",L,Z),i("Loading data",d,b),i("Column highlight",O,le),i("Lock vertically",M,re),i("Reverse background",W,z),i("Disable drag using touch",j,ie)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Be),e.default.createElement("div",{style:{maxWidth:k?"500px":"fit-content"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:v?"Disabled due to read only mode":"",onClick:ce},columns:F.map((n,s)=>_(E({},n),{className:`table-column column-${O?s:""}`})),id:A[1],layout:c.UIFlexibleTableLayout.Wrapping,onRenderCell:J,rows:o,onDeleteRow:K,showColumnTitles:g,isContentLoading:d,onTableReorder:m?de:void 0,noRowBackground:L,isAddItemDisabled:N,showIndexColumn:P,readonly:v,onRenderDeleteAction:n=>({isDeleteDisabled:U&&n.rowIndex===0}),onRenderReorderActions:n=>y?{up:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:y?n=>({rows:n.rows.map((s,w)=>_(E({},s),{disabled:w===1}))}):void 0,onRenderRowContainer:y?n=>({isDropWarning:!n.isDragged&&!!n.rowIndex&&n.rowIndex>1}):void 0,onRenderRowDataContent:I?C:void 0,onRenderActions:ue,maxScrollableContentHeight:k?700:400,lockVertically:M,reverseBackground:W,onRenderPrimaryTableActions:u,onRenderSecondaryTableActions:be,isTouchDragDisabled:j}))))};T.WrappingTable=Ne}}]);})();

package/storybook/iframe.html

@@ -364,7 +364,7 @@
             window['DOCS_OPTIONS'] = {};</script><script type="module">import './sb-preview/runtime.js';
 
       
-      import './runtime~main.a391da1c.iframe.bundle.js';
+      import './runtime~main.f4509474.iframe.bundle.js';
       
       import './565.d2884ebb.iframe.bundle.js';
       

package/storybook/project.json

@@ -1 +1 @@
-{"generatedAt":1700728191413,"hasCustomBabel":false,"hasCustomWebpack":true,"hasStaticDirs":false,"hasStorybookEslint":true,"refCount":0,"monorepo":"Nx","packageManager":{"type":"pnpm","version":"8.6.12"},"framework":{"name":"@storybook/react-webpack5","options":{}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.4.3","storybookVersionSpecifier":"7.4.3","language":"typescript","storybookPackages":{"@storybook/react":{"version":"7.4.3"},"@storybook/react-webpack5":{"version":"7.4.3"},"eslint-plugin-storybook":{"version":"0.6.13"},"storybook":{"version":"7.4.3"}},"addons":{"storybook-addon-turbo-build":{"version":"2.0.1"}}}
+{"generatedAt":1700734539652,"hasCustomBabel":false,"hasCustomWebpack":true,"hasStaticDirs":false,"hasStorybookEslint":true,"refCount":0,"monorepo":"Nx","packageManager":{"type":"pnpm","version":"8.6.12"},"framework":{"name":"@storybook/react-webpack5","options":{}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.4.3","storybookVersionSpecifier":"7.4.3","language":"typescript","storybookPackages":{"@storybook/react":{"version":"7.4.3"},"@storybook/react-webpack5":{"version":"7.4.3"},"eslint-plugin-storybook":{"version":"0.6.13"},"storybook":{"version":"7.4.3"}},"addons":{"storybook-addon-turbo-build":{"version":"2.0.1"}}}

package/storybook/{runtime~main.a391da1c.iframe.bundle.js → runtime~main.f4509474.iframe.bundle.js}

@@ -1,2 +1,2 @@
-(()=>{(()=>{"use strict";var y={},g={};function r(e){var f=g[e];if(f!==void 0)return f.exports;var t=g[e]={id:e,loaded:!1,exports:{}};return y[e].call(t.exports,t,t.exports,r),t.loaded=!0,t.exports}r.m=y,(()=>{var e=[];r.O=(f,t,a,i)=>{if(t){i=i||0;for(var n=e.length;n>0&&e[n-1][2]>i;n--)e[n]=e[n-1];e[n]=[t,a,i];return}for(var o=1/0,n=0;n<e.length;n++){for(var[t,a,i]=e[n],l=!0,s=0;s<t.length;s++)(i&!1||o>=i)&&Object.keys(r.O).every(p=>r.O[p](t[s]))?t.splice(s--,1):(l=!1,i<o&&(o=i));if(l){e.splice(n--,1);var d=a();d!==void 0&&(f=d)}}return f}})(),r.n=e=>{var f=e&&e.__esModule?()=>e.default:()=>e;return r.d(f,{a:f}),f},(()=>{var e=Object.getPrototypeOf?t=>Object.getPrototypeOf(t):t=>t.__proto__,f;r.t=function(t,a){if(a&1&&(t=this(t)),a&8||typeof t=="object"&&t&&(a&4&&t.__esModule||a&16&&typeof t.then=="function"))return t;var i=Object.create(null);r.r(i);var n={};f=f||[null,e({}),e([]),e(e)];for(var o=a&2&&t;typeof o=="object"&&!~f.indexOf(o);o=e(o))Object.getOwnPropertyNames(o).forEach(l=>n[l]=()=>t[l]);return n.default=()=>t,r.d(i,n),i}})(),r.d=(e,f)=>{for(var t in f)r.o(f,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:f[t]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce((f,t)=>(r.f[t](e,f),f),[])),r.u=e=>""+({29:"UITreedropdown-story",84:"UIActionCallout-story",210:"UIFlexibleTable-story",218:"UIPersona-story",244:"UICalloutCollisionTransform-story",248:"UISections-story",292:"UICallout-story",294:"UICheckbox-story",295:"UICombobox-story",302:"UITranslationInput-story",309:"UITable-story",328:"UIMessageBar-story",398:"UILabel-story",456:"UISeparator-story",469:"UILink-story",520:"UIDropdown-story",524:"UIIcon-story",626:"UIToggle-story",682:"UILoader-story",693:"UIDialog-story",740:"UIButton-story",761:"UICreateSelect-story",778:"UIContextualMenu-story",786:"UISearchBox-story",797:"UITextInput-story",835:"UIDatePicker-story",844:"UIToggleGroup-story",900:"UIChoiceGroup-story",963:"UITooltip-story"}[e]||e)+"."+{29:"5ff8c2a8",84:"c4c2ba89",169:"3cef0c60",210:"2c13d1e8",218:"9d5750d4",239:"df74670d",244:"cc07045d",248:"233ac58f",277:"b4eb5ff2",292:"ae31276b",294:"ef3a5b0a",295:"9da4ca1c",302:"9e4a233b",307:"9b1e7ad5",308:"ee260d41",309:"4fbef46b",314:"88c87a07",328:"28245a77",398:"fe877da7",405:"2472d9fb",456:"608804ec",469:"cb4bc655",494:"1829058d",520:"c229d439",524:"98a0771b",580:"f238ed95",626:"1eb81da9",666:"98ab036d",682:"177c9825",693:"3223c2f8",740:"f98ff4fa",761:"e2f32e1b",763:"3cd34b10",778:"8c94e82e",786:"9133a6d6",797:"171bd469",835:"3319a11e",844:"6f3e7d06",900:"136500c4",909:"ce148956",930:"1b3c5615",959:"6d7ed24c",963:"eda2d811"}[e]+".iframe.bundle.js",r.g=function(){if(typeof globalThis=="object")return globalThis;try{return this||new Function("return this")()}catch(e){if(typeof window=="object")return window}}(),r.o=(e,f)=>Object.prototype.hasOwnProperty.call(e,f),(()=>{var e={},f="@sap-ux/ui-components:";r.l=(t,a,i,n)=>{if(e[t]){e[t].push(a);return}var o,l;if(i!==void 0)for(var s=document.getElementsByTagName("script"),d=0;d<s.length;d++){var c=s[d];if(c.getAttribute("src")==t||c.getAttribute("data-webpack")==f+i){o=c;break}}o||(l=!0,o=document.createElement("script"),o.charset="utf-8",o.timeout=120,r.nc&&o.setAttribute("nonce",r.nc),o.setAttribute("data-webpack",f+i),o.src=t),e[t]=[a];var b=(_,p)=>{o.onerror=o.onload=null,clearTimeout(u);var h=e[t];if(delete e[t],o.parentNode&&o.parentNode.removeChild(o),h&&h.forEach(U=>U(p)),_)return _(p)},u=setTimeout(b.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=b.bind(null,o.onerror),o.onload=b.bind(null,o.onload),l&&document.head.appendChild(o)}})(),r.r=e=>{typeof Symbol!="undefined"&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),r.p="",(()=>{var e={303:0};r.f.j=(a,i)=>{var n=r.o(e,a)?e[a]:void 0;if(n!==0)if(n)i.push(n[2]);else if(a!=303){var o=new Promise((c,b)=>n=e[a]=[c,b]);i.push(n[2]=o);var l=r.p+r.u(a),s=new Error,d=c=>{if(r.o(e,a)&&(n=e[a],n!==0&&(e[a]=void 0),n)){var b=c&&(c.type==="load"?"missing":c.type),u=c&&c.target&&c.target.src;s.message="Loading chunk "+a+` failed.
+(()=>{(()=>{"use strict";var y={},g={};function r(e){var f=g[e];if(f!==void 0)return f.exports;var t=g[e]={id:e,loaded:!1,exports:{}};return y[e].call(t.exports,t,t.exports,r),t.loaded=!0,t.exports}r.m=y,(()=>{var e=[];r.O=(f,t,a,i)=>{if(t){i=i||0;for(var n=e.length;n>0&&e[n-1][2]>i;n--)e[n]=e[n-1];e[n]=[t,a,i];return}for(var o=1/0,n=0;n<e.length;n++){for(var[t,a,i]=e[n],l=!0,s=0;s<t.length;s++)(i&!1||o>=i)&&Object.keys(r.O).every(p=>r.O[p](t[s]))?t.splice(s--,1):(l=!1,i<o&&(o=i));if(l){e.splice(n--,1);var d=a();d!==void 0&&(f=d)}}return f}})(),r.n=e=>{var f=e&&e.__esModule?()=>e.default:()=>e;return r.d(f,{a:f}),f},(()=>{var e=Object.getPrototypeOf?t=>Object.getPrototypeOf(t):t=>t.__proto__,f;r.t=function(t,a){if(a&1&&(t=this(t)),a&8||typeof t=="object"&&t&&(a&4&&t.__esModule||a&16&&typeof t.then=="function"))return t;var i=Object.create(null);r.r(i);var n={};f=f||[null,e({}),e([]),e(e)];for(var o=a&2&&t;typeof o=="object"&&!~f.indexOf(o);o=e(o))Object.getOwnPropertyNames(o).forEach(l=>n[l]=()=>t[l]);return n.default=()=>t,r.d(i,n),i}})(),r.d=(e,f)=>{for(var t in f)r.o(f,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:f[t]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce((f,t)=>(r.f[t](e,f),f),[])),r.u=e=>""+({29:"UITreedropdown-story",84:"UIActionCallout-story",210:"UIFlexibleTable-story",218:"UIPersona-story",244:"UICalloutCollisionTransform-story",248:"UISections-story",292:"UICallout-story",294:"UICheckbox-story",295:"UICombobox-story",302:"UITranslationInput-story",309:"UITable-story",328:"UIMessageBar-story",398:"UILabel-story",456:"UISeparator-story",469:"UILink-story",520:"UIDropdown-story",524:"UIIcon-story",626:"UIToggle-story",682:"UILoader-story",693:"UIDialog-story",740:"UIButton-story",761:"UICreateSelect-story",778:"UIContextualMenu-story",786:"UISearchBox-story",797:"UITextInput-story",835:"UIDatePicker-story",844:"UIToggleGroup-story",900:"UIChoiceGroup-story",963:"UITooltip-story"}[e]||e)+"."+{29:"5ff8c2a8",84:"c4c2ba89",169:"3cef0c60",210:"3606536e",218:"9d5750d4",239:"df74670d",244:"cc07045d",248:"233ac58f",277:"b4eb5ff2",292:"ae31276b",294:"ef3a5b0a",295:"9da4ca1c",302:"9e4a233b",307:"9b1e7ad5",308:"ee260d41",309:"4fbef46b",314:"88c87a07",328:"28245a77",398:"fe877da7",405:"2472d9fb",456:"608804ec",469:"cb4bc655",494:"1829058d",520:"c229d439",524:"98a0771b",580:"f238ed95",626:"1eb81da9",666:"bb0aac95",682:"177c9825",693:"3223c2f8",740:"f98ff4fa",761:"e2f32e1b",763:"3cd34b10",778:"8c94e82e",786:"9133a6d6",797:"171bd469",835:"3319a11e",844:"6f3e7d06",900:"136500c4",909:"ce148956",930:"1b3c5615",959:"6d7ed24c",963:"eda2d811"}[e]+".iframe.bundle.js",r.g=function(){if(typeof globalThis=="object")return globalThis;try{return this||new Function("return this")()}catch(e){if(typeof window=="object")return window}}(),r.o=(e,f)=>Object.prototype.hasOwnProperty.call(e,f),(()=>{var e={},f="@sap-ux/ui-components:";r.l=(t,a,i,n)=>{if(e[t]){e[t].push(a);return}var o,l;if(i!==void 0)for(var s=document.getElementsByTagName("script"),d=0;d<s.length;d++){var c=s[d];if(c.getAttribute("src")==t||c.getAttribute("data-webpack")==f+i){o=c;break}}o||(l=!0,o=document.createElement("script"),o.charset="utf-8",o.timeout=120,r.nc&&o.setAttribute("nonce",r.nc),o.setAttribute("data-webpack",f+i),o.src=t),e[t]=[a];var b=(_,p)=>{o.onerror=o.onload=null,clearTimeout(u);var h=e[t];if(delete e[t],o.parentNode&&o.parentNode.removeChild(o),h&&h.forEach(U=>U(p)),_)return _(p)},u=setTimeout(b.bind(null,void 0,{type:"timeout",target:o}),12e4);o.onerror=b.bind(null,o.onerror),o.onload=b.bind(null,o.onload),l&&document.head.appendChild(o)}})(),r.r=e=>{typeof Symbol!="undefined"&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),r.p="",(()=>{var e={303:0};r.f.j=(a,i)=>{var n=r.o(e,a)?e[a]:void 0;if(n!==0)if(n)i.push(n[2]);else if(a!=303){var o=new Promise((c,b)=>n=e[a]=[c,b]);i.push(n[2]=o);var l=r.p+r.u(a),s=new Error,d=c=>{if(r.o(e,a)&&(n=e[a],n!==0&&(e[a]=void 0),n)){var b=c&&(c.type==="load"?"missing":c.type),u=c&&c.target&&c.target.src;s.message="Loading chunk "+a+` failed.
 (`+b+": "+u+")",s.name="ChunkLoadError",s.type=b,s.request=u,n[1](s)}};r.l(l,d,"chunk-"+a,a)}else e[a]=0},r.O.j=a=>e[a]===0;var f=(a,i)=>{var[n,o,l]=i,s,d,c=0;if(n.some(u=>e[u]!==0)){for(s in o)r.o(o,s)&&(r.m[s]=o[s]);if(l)var b=l(r)}for(a&&a(i);c<n.length;c++)d=n[c],r.o(e,d)&&e[d]&&e[d][0](),e[d]=0;return r.O(b)},t=self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[];t.forEach(f.bind(null,0)),t.push=f.bind(null,t.push.bind(t))})(),r.nc=void 0})();})();

package/storybook/UIFlexibleTable-story.2c13d1e8.iframe.bundle.js

@@ -1,74 +0,0 @@
-"use strict";(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[210],{"./stories/UIFlexibleTable.story.tsx":function(Pe,E,V){var Ie=Object.defineProperty,Re=Object.defineProperties,ve=Object.getOwnPropertyDescriptors,fe=Object.getOwnPropertySymbols,ye=Object.prototype.hasOwnProperty,Se=Object.prototype.propertyIsEnumerable,we=(o,l,t)=>l in o?Ie(o,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[l]=t,_=(o,l)=>{for(var t in l||(l={}))ye.call(l,t)&&we(o,t,l[t]);if(fe)for(var t of fe(l))Se.call(l,t)&&we(o,t,l[t]);return o},A=(o,l)=>Re(o,ve(l)),Ce=this&&this.__createBinding||(Object.create?function(o,l,t,r){r===void 0&&(r=t);var c=Object.getOwnPropertyDescriptor(l,t);(!c||("get"in c?!l.__esModule:c.writable||c.configurable))&&(c={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(o,r,c)}:function(o,l,t,r){r===void 0&&(r=t),o[r]=l[t]}),De=this&&this.__setModuleDefault||(Object.create?function(o,l){Object.defineProperty(o,"default",{enumerable:!0,value:l})}:function(o,l){o.default=l}),ke=this&&this.__importStar||function(o){if(o&&o.__esModule)return o;var l={};if(o!=null)for(var t in o)t!=="default"&&Object.prototype.hasOwnProperty.call(o,t)&&Ce(l,o,t);return De(l,o),l};Object.defineProperty(E,"__esModule",{value:!0}),E.WrappingTable=E.InlineFlexTable=void 0;const e=ke(V("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=V("./src/components/index.tsx"),be=V("../../node_modules/.pnpm/react-movable@2.4.0_react-dom@16.14.0_react@16.14.0/node_modules/react-movable/lib/index.js");(0,V("./src/components/Icons.tsx").initIcons)(),E.default={title:"Tables/UIFlexibleTable"};const F=["table1","table2"],B=Array.from({length:10}).map((o,l)=>({key:`column${l+1}`,title:l===0?"Beginning Column":`Column ${l+1}`,tooltip:`Tooltip for column #${l+1}`}));B.push({key:"preferred",title:"Preferred",hidden:!0});const X=o=>{const l={};return B.forEach((t,r)=>{l[t.key]=r<5?`sample_${o}${r}`:"a"}),l},pe=[],me=(o,l,t)=>o.map((c,u)=>{const p={};B.forEach((m,h)=>{p[m.key]={type:h<5?"input":l&&h===9?"link":"dropdown",value:o[u][m.key]}});const g=p.preferred.value==="1";return{key:u.toFixed(0),title:`Row ${u+1}`,className:t===u||t===100?"active-row":g?"preferred-row":"",cells:p,tooltip:`Tooltip for row #${u+1}`}});function xe(o,l,t,r){const c=o.value.value,u=o.colIndex===1&&o.rowIndex===2&&r,p=B[o.colIndex];switch(o.value.type){case"dropdown":{const g=["a","b","c"].map(m=>({key:m,text:`Option ${m.toUpperCase()}`}));return{title:u?"Custom Title for spanned cell":void 0,isSpan:u,cellClassNames:u?"spanned-cell":r&&o.rowIndex===2&&!u?"not-spanned-cell":void 0,content:e.default.createElement(i.UIDropdown,{options:g,selectedKey:c,disabled:l,onChange:(m,h,k)=>{var N;return t((N=h==null?void 0:h.key.toString())!=null?N:"")},title:p.tooltip})}}case"input":return{title:u?"Custom Title for spanned cell":void 0,isSpan:u,cellClassNames:[u?"spanned-cell":r&&o.rowIndex===2&&!u?"not-spanned-cell":""],content:e.default.createElement(Te,{value:c,readonly:l,onChange:g=>t(g),title:p.tooltip})};default:return{content:e.default.createElement(i.UILink,{href:"",title:"Tooltip for navigation"},"Link")}}}function Te(o){const[l,t]=(0,e.useState)("");(0,e.useEffect)(()=>{t(o.value)},[o.value]);const r=c=>{t(c)};return e.default.createElement(i.UITextInput,{value:l,readOnly:o.readonly,onChange:(c,u)=>r(u||""),onBlur:()=>{o.value!==l&&setTimeout(()=>{o.onChange(l)},0)},title:o.title})}function ge(o){const l=X(o.length);o.push(l)}const Ee=`
-.flexible-table {
-    font-size: 13px;
-}
-
-body .flexible-table-content-table-row.dragged {
-    font-size: 13px;
-}
-
-.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
-    min-width: 130px !important;
-}
-
-.flexible-table-content-table-row.active-row {
-    background: #D0FFD0;
-}
-
-.table-column.fixed {
-    width: 100px;
-}
-
-.table-column.column-0 {
-    background: #FFD0B0;
-}
-
-.table-column.column-5 {
-    background: #D0B0FF;
-}
-
-.in-row .spanned-cell {
-    flex: 9;
-    
-}
-.in-row .not-spanned-cell {
-    flex: 1;
-}
-`,_e=()=>{const[o,l]=(0,e.useState)(pe),[t,r]=(0,e.useState)([]),[c,u]=(0,e.useState)(!1),[p,g]=(0,e.useState)(!0),[m,h]=(0,e.useState)(!0),[k,N]=(0,e.useState)(!1),[U,Y]=(0,e.useState)(!1),[P,Z]=(0,e.useState)(!1),[O,q]=(0,e.useState)(!1),[v,ee]=(0,e.useState)(!1),[L,te]=(0,e.useState)(!1),[I,oe]=(0,e.useState)(!1),[$,ne]=(0,e.useState)(!0),[y,le]=(0,e.useState)(!1),[M,H]=(0,e.useState)(!1),[W,ae]=(0,e.useState)(!1),[j,z]=(0,e.useState)(-1),[S,re]=(0,e.useState)(!1),[C,G]=(0,e.useState)(!1),[x,se]=(0,e.useState)(!1),[T,ie]=(0,e.useState)(!1),d=(0,e.useRef)({}),K=a=>{a.stopPropagation()},D=a=>{l(me(a,y,j))};(0,e.useEffect)(()=>{for(const a in d.current){const w=d.current[a];w.current&&(w.current.removeEventListener("mousedown",K),w.current.addEventListener("mousedown",K))}}),(0,e.useEffect)(()=>{D(t)},[y,j]),(0,e.useEffect)(()=>{const a=Array.from({length:3}).map((w,R)=>X(R));r(a),D(a)},[]);const J=()=>(ge(t),r(t),D(t),{scrollToRow:t.length-1}),ce=a=>{t.splice(a.rowIndex,1),r(t),D(t)},de=a=>{const w=T&&a.oldIndex===0&&a.newIndex>1;if(!w){const R=(0,be.arrayMove)(t,a.oldIndex,a.newIndex);r(R),D(R)}return{isDropDisabled:w}},f=(a,w,R)=>e.default.createElement(i.UICheckbox,{label:a,checked:w,onChange:()=>{R(!w)}}),n=a=>{const w=`cell-${a.rowIndex}-${a.colIndex}`;d.current[w]||(d.current[w]=e.default.createRef());const he=xe(a,I,Ne=>{t[a.rowIndex][a.colKey]=Ne,r(t),D(t)},W);return A(_({},he),{content:e.default.createElement("div",{ref:d.current[w]},he.content)})},s=a=>{if(a.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},b=a=>{z(a),new Promise(w=>{setTimeout(()=>w(!0),2e3)}).then(()=>{z(-1)})},Q=a=>[e.default.createElement(i.UIFlexibleTableRowActionButton,{key:`goto-code-row-${a.rowIndex}`,actionName:"GotoCode",tableId:F[0],iconName:i.UiIcons.CodeSnippet,rowNumber:a.rowIndex,onClick:()=>b(a.rowIndex),title:"Navigation demo"})],ue=a=>[e.default.createElement(i.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:F[0],iconName:i.UiIcons.CodeSnippet,onClick:()=>b(100),title:"Navigation demo"})],Be=a=>[e.default.createElement(i.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:c||a.readonly,onClick:()=>{r([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("h3",null,"In-line layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},f("Vertical layout",P,Z),f("Show titles",m,h),f("Show titles in cells",U,Y),f("Show row headers",k,N),f("Show Index",$,ne),f("Show custom content",y,le),f("Span cells",W,ae),f("Reorder enabled",p,g),f("Reorder restrictions",T,ie),f("Disable Adding",v,ee),f("Disable Deletion",L,te),f("Readonly",I,oe),f("No row background",O,q),f("Loading data",c,u),f("Column highlight",M,H),f("Is fixed max width",S,re),f("Lock vertically",C,G),f("Reverse background",x,se)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ee),e.default.createElement("div",{style:{maxWidth:P?"500px":"1300px"}},e.default.createElement(i.UIFlexibleTable,{addRowButton:{label:"Add row",title:I?"Disabled due to read only mode":"",onClick:J},columns:B.map((a,w)=>A(_({},a),{className:`table-column column-${M?w:""}${y?"fixed":""}`})),id:F[0],layout:i.UIFlexibleTableLayout.InlineFlex,onRenderCell:n,rows:o,inRowLayoutMinWidth:1e3,onDeleteRow:ce,showColumnTitles:m,showColumnTitlesInCells:U,isContentLoading:c,onTableReorder:p?de:void 0,noRowBackground:O,isAddItemDisabled:v,showIndexColumn:$,readonly:I,onRenderDeleteAction:a=>({isDeleteDisabled:L&&a.rowIndex===0,tooltip:L&&a.rowIndex===0?"Disabled for demo purposes":"Click to delete the row"}),onRenderActions:Q,onRenderRowDataContent:y?s:void 0,onRenderReorderActions:a=>T?{up:{disabled:a.rowIndex===1,tooltip:a.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:a.rowIndex===1,tooltip:a.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:T?a=>({rows:a.rows.map((w,R)=>A(_({},w),{disabled:R===1}))}):void 0,onRenderRowContainer:T?a=>({isDropWarning:!a.isDragged&&!!a.rowIndex&&a.rowIndex>1}):void 0,maxScrollableContentHeight:P?700:220,showRowTitles:k,maxWidth:S?800:void 0,lockVertically:C,reverseBackground:x,onRenderPrimaryTableActions:Be,onRenderSecondaryTableActions:ue,noDataText:"No data"}))))};E.InlineFlexTable=_e;const Ae=`
-
-.flexible-table {
-    font-size: 13px;
-}
-
-body .flexible-table-content-table-row.dragged {
-    font-size: 13px;
-}
-
-.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
-    min-width: 130px !important;
-}
-
-.flexible-table-content-table-row.preferred-row {
-    background: #FFD0D0;
-}
-
-.flexible-table-content-table-row.active-row {
-    background: #D0FFD0;
-}
-
-.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper {
-    width: 120px !important;
-}
-
-.table-column.column-0 {
-    background: #FFD0B0;
-}
-
-.table-column.column-5 {
-    background: #D0B0FF;
-}
-
-.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper.spanned-cell {
-    width: 240px !important;
-}
-`,Fe=()=>{const[o,l]=(0,e.useState)(pe),[t,r]=(0,e.useState)([]),[c,u]=(0,e.useState)(!1),[p,g]=(0,e.useState)(!0),[m,h]=(0,e.useState)(!0),[k,N]=(0,e.useState)(!1),[U,Y]=(0,e.useState)(!1),[P,Z]=(0,e.useState)(!1),[O,q]=(0,e.useState)(!1),[v,ee]=(0,e.useState)(!1),[L,te]=(0,e.useState)(!1),[I,oe]=(0,e.useState)(!1),[$,ne]=(0,e.useState)(!1),[y,le]=(0,e.useState)(!1),[M,H]=(0,e.useState)(-1),[W,ae]=(0,e.useState)(!1),[j,z]=(0,e.useState)(!1),[S,re]=(0,e.useState)(!1),C=(0,e.useRef)({}),G=n=>{n.stopPropagation()},x=n=>{l(me(n,I,M))};(0,e.useEffect)(()=>{for(const n in C.current){const s=C.current[n];s.current&&(s.current.removeEventListener("mousedown",G),s.current.addEventListener("mousedown",G))}}),(0,e.useEffect)(()=>{x(t)},[I,M]),(0,e.useEffect)(()=>{const n=Array.from({length:3}).map((s,b)=>X(b));r(n),x(n)},[]);const se=()=>(ge(t),r(t),x(t),{scrollToRow:t.length-1}),T=n=>{t.splice(n.rowIndex,1),r(t),x(t)},ie=n=>{const s=S&&n.oldIndex===0&&n.newIndex>1;if(!s){const b=(0,be.arrayMove)(t,n.oldIndex,n.newIndex);r(b),x(b)}return{isDropDisabled:s}},d=(n,s,b)=>e.default.createElement(i.UICheckbox,{label:n,checked:s,onChange:()=>{b(!s)}}),K=n=>{const s=`cell-${n.rowIndex}-${n.colIndex}`;C.current[s]||(C.current[s]=e.default.createRef());const Q=xe(n,v,ue=>{t[n.rowIndex][n.colKey]=ue,r(t),x(t)},y);return A(_({},Q),{content:e.default.createElement("div",{ref:C.current[s]},Q.content)})},D=n=>{if(n.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},J=n=>{H(n),new Promise(s=>{setTimeout(()=>s(!0),2e3)}).then(()=>{H(-1)})},ce=n=>[e.default.createElement(i.UIToggle,{key:"1",label:"Preferred",checked:n.cells.preferred.value==="1",onChange:(s,b)=>{t[n.rowIndex].preferred=b?"1":"0",r(t),x(t)},inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,size:i.UIToggleSize.Small,disabled:v}),e.default.createElement(i.UIFlexibleTableRowActionButton,{key:`goto-code-row-${n.rowIndex}`,actionName:"GotoCode",tableId:F[1],iconName:i.UiIcons.CodeSnippet,rowNumber:n.rowIndex,onClick:()=>J(n.rowIndex),title:"Navigation demo"})],de=n=>[e.default.createElement(i.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:F[0],iconName:i.UiIcons.CodeSnippet,onClick:()=>J(100),title:"Navigation demo"})],f=n=>[e.default.createElement(i.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:c||n.readonly,onClick:()=>{r([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("hr",null),e.default.createElement("h3",null,"Wrapping layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},d("Compact size",k,N),d("Show titles",m,h),d("Show Index",L,te),d("Show custom content",I,oe),d("Span cells",y,le),d("Reorder enabled",p,g),d("Reorder restrictions",S,re),d("Disable Adding",P,Z),d("Disable Deletion",O,q),d("Readonly",v,ee),d("No row background",U,Y),d("Loading data",c,u),d("Column highlight",$,ne),d("Lock vertically",W,ae),d("Reverse background",j,z)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ae),e.default.createElement("div",{style:{maxWidth:k?"500px":"fit-content"}},e.default.createElement(i.UIFlexibleTable,{addRowButton:{label:"Add row",title:v?"Disabled due to read only mode":"",onClick:se},columns:B.map((n,s)=>A(_({},n),{className:`table-column column-${$?s:""}`})),id:F[1],layout:i.UIFlexibleTableLayout.Wrapping,onRenderCell:K,rows:o,onDeleteRow:T,showColumnTitles:m,isContentLoading:c,onTableReorder:p?ie:void 0,noRowBackground:U,isAddItemDisabled:P,showIndexColumn:L,readonly:v,onRenderDeleteAction:n=>({isDeleteDisabled:O&&n.rowIndex===0}),onRenderReorderActions:n=>S?{up:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:S?n=>({rows:n.rows.map((s,b)=>A(_({},s),{disabled:b===1}))}):void 0,onRenderRowContainer:S?n=>({isDropWarning:!n.isDragged&&!!n.rowIndex&&n.rowIndex>1}):void 0,onRenderRowDataContent:I?D:void 0,onRenderActions:ce,maxScrollableContentHeight:k?700:400,lockVertically:W,reverseBackground:j,onRenderPrimaryTableActions:f,onRenderSecondaryTableActions:de}))))};E.WrappingTable=Fe}}]);})();