@sap-ux/ui-components 1.27.9 → 2.0.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/components/UIButton/UIIconButton.d.ts.map +1 -1
- package/dist/components/UIButton/UIIconButton.js +2 -1
- package/dist/components/UIButton/UIIconButton.js.map +1 -1
- package/dist/components/UICallout/UICallout.js +1 -1
- package/dist/components/UICheckbox/UICheckbox.d.ts.map +1 -1
- package/dist/components/UICheckbox/UICheckbox.js +3 -1
- package/dist/components/UICheckbox/UICheckbox.js.map +1 -1
- package/dist/components/UIContextualMenu/_variables.scss +1 -1
- package/dist/components/UIInput/UITextInput.js +1 -1
- package/dist/styles/_variables.scss +1 -1
- package/package.json +2 -2
- package/storybook/13.1de7f853.iframe.bundle.js +1 -0
- package/storybook/174.71a8dd1c.iframe.bundle.js +1 -0
- package/storybook/195.3d7d3044.iframe.bundle.js +1 -0
- package/storybook/237.334c60ea.iframe.bundle.js +13 -0
- package/storybook/267.22cc1c06.iframe.bundle.js +7 -0
- package/storybook/321.18c353da.iframe.bundle.js +1 -0
- package/storybook/421.82fb543c.iframe.bundle.js +43 -0
- package/storybook/434.16b1a922.iframe.bundle.js +1 -0
- package/storybook/472.4283b7a6.iframe.bundle.js +10 -0
- package/storybook/473.fa931179.iframe.bundle.js +1 -0
- package/storybook/482.f9e43363.iframe.bundle.js +1 -0
- package/storybook/543.0c0837d6.iframe.bundle.js +1 -0
- package/storybook/618.0c2b25bb.iframe.bundle.js +1 -0
- package/storybook/625.874afe67.iframe.bundle.js +62 -0
- package/storybook/UIActionCallout-story.17b8bed9.iframe.bundle.js +2 -0
- package/storybook/UIButton-story.e7b86ff9.iframe.bundle.js +2 -0
- package/storybook/UICallout-story.f956caff.iframe.bundle.js +2 -0
- package/storybook/UICalloutCollisionTransform-story.ab856fec.iframe.bundle.js +1 -0
- package/storybook/UICheckbox-story.490ca9cb.iframe.bundle.js +2 -0
- package/storybook/UIChoiceGroup-story.9a573f7f.iframe.bundle.js +1 -0
- package/storybook/UICombobox-story.82435b80.iframe.bundle.js +1 -0
- package/storybook/UIContextualMenu-story.7f29a165.iframe.bundle.js +2 -0
- package/storybook/UICreateSelect-story.dd4c5fad.iframe.bundle.js +2 -0
- package/storybook/UIDatePicker-story.67b687bc.iframe.bundle.js +2 -0
- package/storybook/UIDialog-story.7dbbf082.iframe.bundle.js +2 -0
- package/storybook/UIDropdown-story.9665029e.iframe.bundle.js +1 -0
- package/storybook/UIFlexibleTable-story.218b515c.iframe.bundle.js +74 -0
- package/storybook/UIIcon-story.56526df5.iframe.bundle.js +1 -0
- package/storybook/UILabel-story.49795aba.iframe.bundle.js +1 -0
- package/storybook/UILink-story.16737a61.iframe.bundle.js +2 -0
- package/storybook/UILoader-story.0f747ffb.iframe.bundle.js +6 -0
- package/storybook/UIMessageBar-story.21443966.iframe.bundle.js +1 -0
- package/storybook/UIPersona-story.7276de7c.iframe.bundle.js +1 -0
- package/storybook/UIQuickNavigation-story.2d86a3e8.iframe.bundle.js +1 -0
- package/storybook/UISearchBox-story.b2e103c4.iframe.bundle.js +1 -0
- package/storybook/{UISections-story.4bdae700.iframe.bundle.js → UISections-story.bf185a2a.iframe.bundle.js} +2 -2
- package/storybook/UISeparator-story.fa052e00.iframe.bundle.js +1 -0
- package/storybook/UITable-story.c80d3a04.iframe.bundle.js +4 -0
- package/storybook/UITextInput-story.c00bbea7.iframe.bundle.js +2 -0
- package/storybook/UIToggle-story.bf57ab50.iframe.bundle.js +2 -0
- package/storybook/UIToggleGroup-story.d6ffea1a.iframe.bundle.js +2 -0
- package/storybook/UITooltip-story.1aaaa662.iframe.bundle.js +1 -0
- package/storybook/UITranslationInput-story.749bde8b.iframe.bundle.js +1 -0
- package/storybook/UITreedropdown-story.ee2c3a17.iframe.bundle.js +2 -0
- package/storybook/Utilities-story.7f8fd70e.iframe.bundle.js +1 -0
- package/storybook/iframe.html +5 -3
- package/storybook/main.e2aa1653.iframe.bundle.js +1 -0
- package/storybook/project.json +1 -1
- package/storybook/runtime~main.0ec101e6.iframe.bundle.js +2 -0
- package/storybook/sb-manager/globals-runtime.js +10691 -11043
- package/storybook/sb-preview/runtime.js +238 -238
- package/storybook/113.86052d99.iframe.bundle.js +0 -1
- package/storybook/173.6fa4f445.iframe.bundle.js +0 -1
- package/storybook/236.fd2f9f38.iframe.bundle.js +0 -1
- package/storybook/275.68b405ad.iframe.bundle.js +0 -17
- package/storybook/299.87eab481.iframe.bundle.js +0 -62
- package/storybook/368.e54fc3f9.iframe.bundle.js +0 -1
- package/storybook/441.ac29c9de.iframe.bundle.js +0 -7
- package/storybook/460.f6d7f47b.iframe.bundle.js +0 -1
- package/storybook/514.7b97def1.iframe.bundle.js +0 -1
- package/storybook/623.18990c1a.iframe.bundle.js +0 -1
- package/storybook/731.79239106.iframe.bundle.js +0 -43
- package/storybook/769.2fb98a19.iframe.bundle.js +0 -1
- package/storybook/875.7473ec4c.iframe.bundle.js +0 -1
- package/storybook/938.5fe0a303.iframe.bundle.js +0 -10
- package/storybook/UIActionCallout-story.a373962d.iframe.bundle.js +0 -2
- package/storybook/UIButton-story.676e6fbe.iframe.bundle.js +0 -2
- package/storybook/UICallout-story.a5167b23.iframe.bundle.js +0 -2
- package/storybook/UICalloutCollisionTransform-story.303f5e45.iframe.bundle.js +0 -1
- package/storybook/UICheckbox-story.04795d23.iframe.bundle.js +0 -2
- package/storybook/UIChoiceGroup-story.5164ad16.iframe.bundle.js +0 -1
- package/storybook/UICombobox-story.b8089d01.iframe.bundle.js +0 -1
- package/storybook/UIContextualMenu-story.e6b65667.iframe.bundle.js +0 -2
- package/storybook/UICreateSelect-story.07f42e08.iframe.bundle.js +0 -2
- package/storybook/UIDatePicker-story.53e97cc6.iframe.bundle.js +0 -2
- package/storybook/UIDialog-story.f395fac7.iframe.bundle.js +0 -2
- package/storybook/UIDropdown-story.aa45ccb5.iframe.bundle.js +0 -1
- package/storybook/UIFlexibleTable-story.ff022e8e.iframe.bundle.js +0 -74
- package/storybook/UIIcon-story.cd2eb53e.iframe.bundle.js +0 -1
- package/storybook/UILabel-story.b72e7eee.iframe.bundle.js +0 -1
- package/storybook/UILink-story.a43342a0.iframe.bundle.js +0 -2
- package/storybook/UILoader-story.24a46a6d.iframe.bundle.js +0 -6
- package/storybook/UIMessageBar-story.211efb09.iframe.bundle.js +0 -1
- package/storybook/UIPersona-story.be0866bd.iframe.bundle.js +0 -1
- package/storybook/UIQuickNavigation-story.9ad81852.iframe.bundle.js +0 -1
- package/storybook/UISearchBox-story.49983732.iframe.bundle.js +0 -1
- package/storybook/UISeparator-story.41a66ccf.iframe.bundle.js +0 -1
- package/storybook/UITable-story.9070437c.iframe.bundle.js +0 -4
- package/storybook/UITextInput-story.9b000936.iframe.bundle.js +0 -2
- package/storybook/UIToggle-story.61025a5c.iframe.bundle.js +0 -2
- package/storybook/UIToggleGroup-story.32bc9694.iframe.bundle.js +0 -2
- package/storybook/UITooltip-story.e421d7eb.iframe.bundle.js +0 -1
- package/storybook/UITranslationInput-story.c7f60404.iframe.bundle.js +0 -1
- package/storybook/UITreedropdown-story.2cc0adcd.iframe.bundle.js +0 -2
- package/storybook/Utilities-story.06c40764.iframe.bundle.js +0 -1
- package/storybook/main.356476a1.iframe.bundle.js +0 -1
- package/storybook/runtime~main.1eb088e7.iframe.bundle.js +0 -2
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use strict";(()=>{var Fe=Object.defineProperty,Ne=Object.defineProperties;var Le=Object.getOwnPropertyDescriptors;var Ie=Object.getOwnPropertySymbols;var Ue=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable;var Se=(R,w,m)=>w in R?Fe(R,w,{enumerable:!0,configurable:!0,writable:!0,value:m}):R[w]=m,_=(R,w)=>{for(var m in w||(w={}))Ue.call(w,m)&&Se(R,m,w[m]);if(Ie)for(var m of Ie(w))Pe.call(w,m)&&Se(R,m,w[m]);return R},B=(R,w)=>Ne(R,Le(w));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[812],{"./stories/UIFlexibleTable.story.tsx"(R,w,m){var ye=this&&this.__createBinding||(Object.create?(function(r,l,t,a){a===void 0&&(a=t);var s=Object.getOwnPropertyDescriptor(l,t);(!s||("get"in s?!l.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(r,a,s)}):(function(r,l,t,a){a===void 0&&(a=t),r[a]=l[t]})),De=this&&this.__setModuleDefault||(Object.create?(function(r,l){Object.defineProperty(r,"default",{enumerable:!0,value:l})}):function(r,l){r.default=l}),Ce=this&&this.__importStar||(function(){var r=function(l){return r=Object.getOwnPropertyNames||function(t){var a=[];for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(a[a.length]=s);return a},r(l)};return function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a=r(l),s=0;s<a.length;s++)a[s]!=="default"&&ye(t,l,a[s]);return De(t,l),t}})();Object.defineProperty(w,"__esModule",{value:!0}),w.WrappingTable=w.InlineFlexTable=void 0;const e=Ce(m("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),c=m("./src/components/index.tsx"),me=m("../../node_modules/.pnpm/react-movable@2.5.4_react-dom@16.14.0_react@16.14.0__react@16.14.0/node_modules/react-movable/lib/index.js");w.default={title:"Tables/UIFlexibleTable"};const F=["table1","table2"],N=Array.from({length:10}).map((r,l)=>({key:`column${l+1}`,title:l===0?"Beginning Column":`Column ${l+1}`,tooltip:`Tooltip for column #${l+1}`}));N.push({key:"preferred",title:"Preferred",hidden:!0});const Z=r=>{const l={};return N.forEach((t,a)=>{l[t.key]=a<5?`sample_${r}${a}`:"a"}),l},pe=[],ge=(r,l,t)=>r.map((s,f)=>{const x={};N.forEach((h,I)=>{x[h.key]={type:I<5?"input":l&&I===9?"link":"dropdown",value:r[f][h.key]}});const S=x.preferred.value==="1";return{key:f.toFixed(0),title:`Row ${f+1}`,className:t===f||t===100?"active-row":S?"preferred-row":"",cells:x,tooltip:`Tooltip for row #${f+1}`}});function xe(r,l,t,a){const s=r.value.value,f=r.colIndex===1&&r.rowIndex===2&&a,x=N[r.colIndex];switch(r.value.type){case"dropdown":{const S=["a","b","c"].map(h=>({key:h,text:`Option ${h.toUpperCase()}`}));return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:f?"spanned-cell":a&&r.rowIndex===2&&!f?"not-spanned-cell":void 0,content:e.default.createElement(c.UIDropdown,{options:S,selectedKey:s,disabled:l,onChange:(h,I,A)=>{var L;return t((L=I==null?void 0:I.key.toString())!=null?L:"")},title:x.tooltip})}}case"input":return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:[f?"spanned-cell":a&&r.rowIndex===2&&!f?"not-spanned-cell":""],content:e.default.createElement(ve,{value:s,readonly:l,onChange:S=>t(S),title:x.tooltip})};default:return{content:e.default.createElement(c.UILink,{href:"",title:"Tooltip for navigation"},"Link")}}}function ve(r){const[l,t]=(0,e.useState)("");(0,e.useEffect)(()=>{t(r.value)},[r.value]);const a=s=>{t(s)};return e.default.createElement(c.UITextInput,{value:l,readOnly:r.readonly,onChange:(s,f)=>a(f||""),onBlur:()=>{r.value!==l&&setTimeout(()=>{r.onChange(l)},0)},title:r.title})}function he(r){const l=Z(r.length);r.push(l)}const ke=`
|
|
2
|
+
.flexible-table {
|
|
3
|
+
font-size: 13px;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
body .flexible-table-content-table-row.dragged {
|
|
7
|
+
font-size: 13px;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
|
|
11
|
+
min-width: 130px !important;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.flexible-table-content-table-row.active-row {
|
|
15
|
+
background: #D0FFD0;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.table-column.fixed {
|
|
19
|
+
width: 100px;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.table-column.column-0 {
|
|
23
|
+
background: #FFD0B0;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.table-column.column-5 {
|
|
27
|
+
background: #D0B0FF;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.in-row .spanned-cell {
|
|
31
|
+
flex: 9;
|
|
32
|
+
|
|
33
|
+
}
|
|
34
|
+
.in-row .not-spanned-cell {
|
|
35
|
+
flex: 1;
|
|
36
|
+
}
|
|
37
|
+
`,Te=()=>{const[r,l]=(0,e.useState)(pe),[t,a]=(0,e.useState)([]),[s,f]=(0,e.useState)(!1),[x,S]=(0,e.useState)(!0),[h,I]=(0,e.useState)(!0),[A,L]=(0,e.useState)(!1),[$,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[M,te]=(0,e.useState)(!1),[C,ne]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[y,le]=(0,e.useState)(!1),[W,ae]=(0,e.useState)(!0),[v,re]=(0,e.useState)(!1),[O,z]=(0,e.useState)(!1),[j,se]=(0,e.useState)(!1),[H,G]=(0,e.useState)(-1),[k,de]=(0,e.useState)(!1),[V,ie]=(0,e.useState)(!1),[T,K]=(0,e.useState)(!1),[g,ce]=(0,e.useState)(!1),[J,ue]=(0,e.useState)(!0),i=(0,e.useRef)({}),Q=o=>{o.stopPropagation()},E=o=>{l(ge(o,v,H))};(0,e.useEffect)(()=>{for(const o in i.current){const b=i.current[o];b.current&&(b.current.removeEventListener("mousedown",Q),b.current.addEventListener("mousedown",Q))}}),(0,e.useEffect)(()=>{E(t)},[v,H]),(0,e.useEffect)(()=>{const o=Array.from({length:3}).map((b,D)=>Z(D));a(o),E(o)},[]);const X=()=>(he(t),a(t),E(t),{scrollToRow:t.length-1}),fe=o=>{t.splice(o.rowIndex,1),a(t),E(t)},be=o=>{const b=g&&o.oldIndex===0&&o.newIndex>1;if(!b){const D=(0,me.arrayMove)(t,o.oldIndex,o.newIndex);a(D),E(D)}return{isDropDisabled:b}},u=(o,b,D)=>e.default.createElement(c.UICheckbox,{label:o,checked:b,onChange:()=>{D(!b)}}),n=o=>{const b=`cell-${o.rowIndex}-${o.colIndex}`;i.current[b]||(i.current[b]=e.default.createRef());const Re=xe(o,y,Be=>{t[o.rowIndex][o.colKey]=Be,a(t),E(t)},j);return B(_({},Re),{content:e.default.createElement("div",{ref:i.current[b]},Re.content)})},d=o=>{if(o.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},p=o=>{G(o),new Promise(b=>{setTimeout(()=>b(!0),2e3)}).then(()=>{G(-1)})},Y=o=>[e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${o.rowIndex}`,actionName:"GotoCode",tableId:F[0],iconName:c.UiIcons.CodeSnippet,rowNumber:o.rowIndex,onClick:()=>p(o.rowIndex),title:"Navigation demo"})],we=o=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:F[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>p(100),title:"Navigation demo"})],_e=o=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:s||o.readonly,onClick:()=>{a([]),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",U,ee),u("Show titles",h,I),u("Show titles in cells",$,q),u("Show row headers",A,L),u("Show Index",W,ae),u("Show custom content",v,re),u("Span cells",j,se),u("Reorder enabled",x,S),u("Reorder restrictions",g,ce),u("Disable Adding",C,ne),u("Disable Deletion",P,oe),u("Readonly",y,le),u("No row background",M,te),u("Loading data",s,f),u("Column highlight",O,z),u("Is fixed max width",k,de),u("Lock vertically",V,ie),u("Reverse background",T,K),u("Disable drag using touch",J,ue)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,ke),e.default.createElement("div",{style:{maxWidth:U?"500px":"1300px"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:y?"Disabled due to read only mode":"",onClick:X},columns:N.map((o,b)=>B(_({},o),{className:`table-column column-${O?b:""}${v?"fixed":""}`})),id:F[0],layout:c.UIFlexibleTableLayout.InlineFlex,onRenderCell:n,rows:r,inRowLayoutMinWidth:1e3,onDeleteRow:fe,showColumnTitles:h,showColumnTitlesInCells:$,isContentLoading:s,onTableReorder:x?be:void 0,noRowBackground:M,isAddItemDisabled:C,showIndexColumn:W,readonly:y,onRenderDeleteAction:o=>({isDeleteDisabled:P&&o.rowIndex===0,tooltip:P&&o.rowIndex===0?"Disabled for demo purposes":"Click to delete the row"}),onRenderActions:Y,onRenderRowDataContent:v?d:void 0,onRenderReorderActions:o=>g?{up:{disabled:o.rowIndex===1,tooltip:o.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:o.rowIndex===1,tooltip:o.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:g?o=>({rows:o.rows.map((b,D)=>B(_({},b),{disabled:D===1}))}):void 0,onRenderRowContainer:g?o=>({isDropWarning:!o.isDragged&&!!o.rowIndex&&o.rowIndex>1}):void 0,maxScrollableContentHeight:U?700:220,showRowTitles:A,maxWidth:k?800:void 0,lockVertically:V,reverseBackground:T,onRenderPrimaryTableActions:_e,onRenderSecondaryTableActions:we,noDataText:"No data",isTouchDragDisabled:J}))))};w.InlineFlexTable=Te;const Ee=`
|
|
38
|
+
|
|
39
|
+
.flexible-table {
|
|
40
|
+
font-size: 13px;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
body .flexible-table-content-table-row.dragged {
|
|
44
|
+
font-size: 13px;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.flexible-table-content-table-row-item-actions, .flexible-table-content-table-title-row-item-actions {
|
|
48
|
+
min-width: 130px !important;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.flexible-table-content-table-row.preferred-row {
|
|
52
|
+
background: #FFD0D0;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.flexible-table-content-table-row.active-row {
|
|
56
|
+
background: #D0FFD0;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper {
|
|
60
|
+
width: 120px !important;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.table-column.column-0 {
|
|
64
|
+
background: #FFD0B0;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.table-column.column-5 {
|
|
68
|
+
background: #D0B0FF;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper.spanned-cell {
|
|
72
|
+
width: 240px !important;
|
|
73
|
+
}
|
|
74
|
+
`,Ae=()=>{const[r,l]=(0,e.useState)(pe),[t,a]=(0,e.useState)([]),[s,f]=(0,e.useState)(!1),[x,S]=(0,e.useState)(!0),[h,I]=(0,e.useState)(!0),[A,L]=(0,e.useState)(!1),[$,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[M,te]=(0,e.useState)(!1),[C,ne]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[y,le]=(0,e.useState)(!1),[W,ae]=(0,e.useState)(!1),[v,re]=(0,e.useState)(!1),[O,z]=(0,e.useState)(-1),[j,se]=(0,e.useState)(!1),[H,G]=(0,e.useState)(!1),[k,de]=(0,e.useState)(!1),[V,ie]=(0,e.useState)(!0),T=(0,e.useRef)({}),K=n=>{n.stopPropagation()},g=n=>{l(ge(n,y,O))};(0,e.useEffect)(()=>{for(const n in T.current){const d=T.current[n];d.current&&(d.current.removeEventListener("mousedown",K),d.current.addEventListener("mousedown",K))}}),(0,e.useEffect)(()=>{g(t)},[y,O]),(0,e.useEffect)(()=>{const n=Array.from({length:3}).map((d,p)=>Z(p));a(n),g(n)},[]);const ce=()=>(he(t),a(t),g(t),{scrollToRow:t.length-1}),J=n=>{t.splice(n.rowIndex,1),a(t),g(t)},ue=n=>{const d=k&&n.oldIndex===0&&n.newIndex>1;if(!d){const p=(0,me.arrayMove)(t,n.oldIndex,n.newIndex);a(p),g(p)}return{isDropDisabled:d}},i=(n,d,p)=>e.default.createElement(c.UICheckbox,{label:n,checked:d,onChange:()=>{p(!d)}}),Q=n=>{const d=`cell-${n.rowIndex}-${n.colIndex}`;T.current[d]||(T.current[d]=e.default.createRef());const Y=xe(n,C,we=>{t[n.rowIndex][n.colKey]=we,a(t),g(t)},v);return B(_({},Y),{content:e.default.createElement("div",{ref:T.current[d]},Y.content)})},E=n=>{if(n.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},X=n=>{z(n),new Promise(d=>{setTimeout(()=>d(!0),2e3)}).then(()=>{z(-1)})},fe=n=>[e.default.createElement(c.UIToggle,{key:"1",label:"Preferred",checked:n.cells.preferred.value==="1",onChange:(d,p)=>{t[n.rowIndex].preferred=p?"1":"0",a(t),g(t)},inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,size:c.UIToggleSize.Small,disabled:C}),e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${n.rowIndex}`,actionName:"GotoCode",tableId:F[1],iconName:c.UiIcons.CodeSnippet,rowNumber:n.rowIndex,onClick:()=>X(n.rowIndex),title:"Navigation demo"})],be=n=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:F[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>X(100),title:"Navigation demo"})],u=n=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:s||n.readonly,onClick:()=>{a([]),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",A,L),i("Show titles",h,I),i("Show Index",P,oe),i("Show custom content",y,le),i("Span cells",v,re),i("Reorder enabled",x,S),i("Reorder restrictions",k,de),i("Disable Adding",U,ee),i("Disable Deletion",M,te),i("Readonly",C,ne),i("No row background",$,q),i("Loading data",s,f),i("Column highlight",W,ae),i("Lock vertically",j,se),i("Reverse background",H,G),i("Disable drag using touch",V,ie)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ee),e.default.createElement("div",{style:{maxWidth:A?"500px":"fit-content"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:C?"Disabled due to read only mode":"",onClick:ce},columns:N.map((n,d)=>B(_({},n),{className:`table-column column-${W?d:""}`})),id:F[1],layout:c.UIFlexibleTableLayout.Wrapping,onRenderCell:Q,rows:r,onDeleteRow:J,showColumnTitles:h,isContentLoading:s,onTableReorder:x?ue:void 0,noRowBackground:$,isAddItemDisabled:U,showIndexColumn:P,readonly:C,onRenderDeleteAction:n=>({isDeleteDisabled:M&&n.rowIndex===0}),onRenderReorderActions:n=>k?{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:k?n=>({rows:n.rows.map((d,p)=>B(_({},d),{disabled:p===1}))}):void 0,onRenderRowContainer:k?n=>({isDropWarning:!n.isDragged&&!!n.rowIndex&&n.rowIndex>1}):void 0,onRenderRowDataContent:y?E:void 0,onRenderActions:fe,maxScrollableContentHeight:A?700:400,lockVertically:j,reverseBackground:H,onRenderPrimaryTableActions:u,onRenderSecondaryTableActions:be,isTouchDragDisabled:V}))))};w.WrappingTable=Ae}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[222],{"./src/index.tsx"(a,t,s){var l=this&&this.__createBinding||(Object.create?(function(r,n,e,c){c===void 0&&(c=e);var u=Object.getOwnPropertyDescriptor(n,e);(!u||("get"in u?!n.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return n[e]}}),Object.defineProperty(r,c,u)}):(function(r,n,e,c){c===void 0&&(c=e),r[c]=n[e]})),i=this&&this.__exportStar||function(r,n){for(var e in r)e!=="default"&&!Object.prototype.hasOwnProperty.call(n,e)&&l(n,r,e)};Object.defineProperty(t,"__esModule",{value:!0}),t.setIconOptions=void 0,i(s("./src/components/index.tsx"),t),i(s("./src/utilities/index.ts"),t),i(s("./src/theme/index.ts"),t);var d=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(t,"setIconOptions",{enumerable:!0,get:function(){return d.setIconOptions}})},"./stories/UIIcon.story.tsx"(a,t,s){var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(t,"__esModule",{value:!0}),t.SvgIcon=void 0;const i=l(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),r=s("./src/components/UIIcon/index.tsx"),n=s("./src/index.tsx");t.default={title:"Utilities/Icons"};const e=[];for(const o in n.UiIcons)e.push(o);e.sort();const c=[{key:"column1",name:"Icon",minWidth:50,maxWidth:60,onRender:o=>i.default.createElement(r.UIIcon,{style:{width:"16px",height:"16px"},iconName:o})},{key:"column2",name:"Name",minWidth:50,onRender:o=>i.default.createElement("span",null,o)}],u=()=>i.default.createElement("div",null,i.default.createElement(d.DetailsList,{selectionMode:d.SelectionMode.none,items:e,columns:c,isHeaderVisible:!0,selectionPreservedOnEmptyClick:!0}));t.SvgIcon=u}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var p=Object.defineProperty,m=Object.defineProperties;var y=Object.getOwnPropertyDescriptors;var _=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var f=(o,e,t)=>e in o?p(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,d=(o,e)=>{for(var t in e||(e={}))I.call(e,t)&&f(o,t,e[t]);if(_)for(var t of _(e))L.call(e,t)&&f(o,t,e[t]);return o},b=(o,e)=>m(o,y(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[69],{"./src/components/UILabel/UILabel.tsx"(o,e,t){var c=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(e,"__esModule",{value:!0}),e.UILabel=e.labelGlobalStyle=void 0;const u=c(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),l=t("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),s=t("./src/components/types.ts");e.labelGlobalStyle={fontWeight:"bold",fontSize:"13px",color:"var(--vscode-input-foreground)",padding:"4px 0"};class r extends u.default.Component{constructor(n){super(n)}render(){const n=i=>({root:[d({marginTop:25},e.labelGlobalStyle),i.disabled&&{opacity:"0.4"},i.required&&{selectors:{"::after":{content:s.REQUIRED_LABEL_INDICATOR,color:"var(--vscode-inputValidation-errorBorder)",paddingRight:12}}}]});return u.default.createElement(l.Label,b(d({},this.props),{styles:n}))}}e.UILabel=r},"./src/components/UILabel/index.tsx"(o,e,t){var c=this&&this.__createBinding||(Object.create?(function(l,s,r,a){a===void 0&&(a=r);var n=Object.getOwnPropertyDescriptor(s,r);(!n||("get"in n?!s.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return s[r]}}),Object.defineProperty(l,a,n)}):(function(l,s,r,a){a===void 0&&(a=r),l[a]=s[r]})),u=this&&this.__exportStar||function(l,s){for(var r in l)r!=="default"&&!Object.prototype.hasOwnProperty.call(s,r)&&c(s,l,r)};Object.defineProperty(e,"__esModule",{value:!0}),u(t("./src/components/UILabel/UILabel.tsx"),e)},"./src/components/types.ts"(o,e){Object.defineProperty(e,"__esModule",{value:!0}),e.REQUIRED_LABEL_INDICATOR=void 0,e.REQUIRED_LABEL_INDICATOR="' *' / ''"},"./stories/UILabel.story.tsx"(o,e,t){var c=this&&this.__importDefault||function(n){return n&&n.__esModule?n:{default:n}};Object.defineProperty(e,"__esModule",{value:!0}),e.defaultUsage=void 0;const u=c(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),l=t("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),s=t("./src/components/UILabel/index.tsx");e.default={title:"Basic Inputs/Label"};const r={childrenGap:40},a=()=>u.default.createElement(l.Stack,{tokens:r,style:{width:300}},u.default.createElement(l.Stack,{tokens:{childrenGap:16}},u.default.createElement(l.Text,{variant:"large",className:"textColor"},"UILabel"),u.default.createElement(s.UILabel,null,"Just a label")),u.default.createElement(l.Stack,{tokens:{childrenGap:16}},u.default.createElement(l.Text,{variant:"large",className:"textColor"},"UILabel with required on"),u.default.createElement(s.UILabel,{required:!0},"Just a label")));e.defaultUsage=a}}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";(()=>{var k=Object.defineProperty,x=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var g=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var y=(f,o,a)=>o in f?k(f,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):f[o]=a,v=(f,o)=>{for(var a in o||(o={}))I.call(o,a)&&y(f,a,o[a]);if(g)for(var a of g(o))S.call(o,a)&&y(f,a,o[a]);return f},m=(f,o)=>x(f,C(o));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[57],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"(f){f.exports=function(o){var a=[];return a.toString=function(){return this.map(function(s){var t="",e=typeof s[5]!="undefined";return s[4]&&(t+="@supports (".concat(s[4],") {")),s[2]&&(t+="@media ".concat(s[2]," {")),e&&(t+="@layer".concat(s[5].length>0?" ".concat(s[5]):""," {")),t+=o(s),e&&(t+="}"),s[2]&&(t+="}"),s[4]&&(t+="}"),t}).join("")},a.i=function(s,t,e,r,i){typeof s=="string"&&(s=[[null,s,void 0]]);var l={};if(e)for(var c=0;c<this.length;c++){var _=this[c][0];_!=null&&(l[_]=!0)}for(var d=0;d<s.length;d++){var n=[].concat(s[d]);e&&l[n[0]]||(typeof i!="undefined"&&(typeof n[5]=="undefined"||(n[1]="@layer".concat(n[5].length>0?" ".concat(n[5]):""," {").concat(n[1],"}")),n[5]=i),t&&(n[2]&&(n[1]="@media ".concat(n[2]," {").concat(n[1],"}")),n[2]=t),r&&(n[4]?(n[1]="@supports (".concat(n[4],") {").concat(n[1],"}"),n[4]=r):n[4]="".concat(r)),a.push(n))}},a}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(f){f.exports=function(o){return o[1]}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(f){var o=[];function a(t){for(var e=-1,r=0;r<o.length;r++)if(o[r].identifier===t){e=r;break}return e}function u(t,e){for(var r={},i=[],l=0;l<t.length;l++){var c=t[l],_=e.base?c[0]+e.base:c[0],d=r[_]||0,n="".concat(_," ").concat(d);r[_]=d+1;var p=a(n),h={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(p!==-1)o[p].references++,o[p].updater(h);else{var b=s(h,e);e.byIndex=l,o.splice(l,0,{identifier:n,updater:b,references:1})}i.push(n)}return i}function s(t,e){var r=e.domAPI(e);r.update(t);var i=function(c){if(c){if(c.css===t.css&&c.media===t.media&&c.sourceMap===t.sourceMap&&c.supports===t.supports&&c.layer===t.layer)return;r.update(t=c)}else r.remove()};return i}f.exports=function(t,e){e=e||{},t=t||[];var r=u(t,e);return function(l){l=l||[];for(var c=0;c<r.length;c++){var _=r[c],d=a(_);o[d].references--}for(var n=u(l,e),p=0;p<r.length;p++){var h=r[p],b=a(h);o[b].references===0&&(o[b].updater(),o.splice(b,1))}r=n}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"(f){var o={};function a(s){if(typeof o[s]=="undefined"){var t=document.querySelector(s);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}o[s]=t}return o[s]}function u(s,t){var e=a(s);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(t)}f.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(f){function o(a){var u=document.createElement("style");return a.setAttributes(u,a.attributes),a.insert(u,a.options),u}f.exports=o},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(f,o,a){function u(s){var t=a.nc;t&&s.setAttribute("nonce",t)}f.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(f){function o(s,t,e){var r="";e.supports&&(r+="@supports (".concat(e.supports,") {")),e.media&&(r+="@media ".concat(e.media," {"));var i=typeof e.layer!="undefined";i&&(r+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),r+=e.css,i&&(r+="}"),e.media&&(r+="}"),e.supports&&(r+="}");var l=e.sourceMap;l&&typeof btoa!="undefined"&&(r+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(l))))," */")),t.styleTagTransform(r,s,t.options)}function a(s){if(s.parentNode===null)return!1;s.parentNode.removeChild(s)}function u(s){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=s.insertStyleElement(s);return{update:function(r){o(t,s,r)},remove:function(){a(t)}}}f.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(f){function o(a,u){if(u.styleSheet)u.styleSheet.cssText=a;else{for(;u.firstChild;)u.removeChild(u.firstChild);u.appendChild(document.createTextNode(a))}}f.exports=o},"./src/components/UICheckbox/UICheckbox.tsx"(f,o,a){var u=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(o,"__esModule",{value:!0}),o.UICheckbox=void 0;const s=u(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),e=a("./src/helper/ValidationMessage/index.tsx"),r=a("./src/components/UIInput/index.tsx");class i extends s.default.Component{constructor(c){super(c),this.GlobalClassNames={root:"ms-Checkbox",label:"ms-Checkbox-label",checkbox:"ms-Checkbox-checkbox",checkmark:"ms-Checkbox-checkmark",text:"ms-Checkbox-text"},this.setStyle=(_,d)=>({root:[!d.disabled&&[!d.checked&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)",[t.HighContrastSelector]:{borderColor:"Highlight"}},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"var(--vscode-foreground)",opacity:0,[t.HighContrastSelector]:{color:"Highlight"}}},{[`:hover .${this.GlobalClassNames.text}, :focus .${this.GlobalClassNames.text}`]:{color:"var(--vscode-foreground)",[t.HighContrastSelector]:{color:d.disabled?"GrayText":"WindowText"}}}],d.checked&&!d.indeterminate&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:d.disabled?"":"var(--vscode-checkbox-background)",borderColor:d.disabled?"":"var(--vscode-focusBorder)"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[t.HighContrastSelector]:{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight",borderColor:"Highlight"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"}}},_.message&&{marginBottom:2}],input:{[`.${t.IsFocusVisibleClassName} &:focus + label::before`]:{content:"",position:"absolute",inset:-1,border:"1px solid transparent !important",outline:"1px solid var(--vscode-focusBorder) !important",[t.HighContrastSelector]:{outline:"1px solid WindowText"}}},checkbox:{backgroundColor:"var(--vscode-debugToolBar-background, var(--vscode-editorWidget-background))",borderColor:"var(--vscode-editorWidget-border)",opacity:d.disabled?.4:void 0,borderRadius:r.COMMON_INPUT_STYLES.borderRadius},checkmark:{color:"var(--vscode-checkbox-foreground, var(--vscode-editorWidget-foreground))"},text:{color:"var(--vscode-foreground)",opacity:d.disabled?.4:void 0}})}render(){const c=(0,e.getMessageInfo)(this.props),_=s.default.createElement(t.Checkbox,m(v({},this.props),{styles:d=>v(v({},this.setStyle(c,d)),this.props.styles)}));return c.message?s.default.createElement(e.MessageWrapper,{message:c},_):_}}o.UICheckbox=i},"./src/components/UICheckbox/index.tsx"(f,o,a){var u=this&&this.__createBinding||(Object.create?(function(t,e,r,i){i===void 0&&(i=r);var l=Object.getOwnPropertyDescriptor(e,r);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,l)}):(function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]})),s=this&&this.__exportStar||function(t,e){for(var r in t)r!=="default"&&!Object.prototype.hasOwnProperty.call(e,r)&&u(e,t,r)};Object.defineProperty(o,"__esModule",{value:!0}),s(a("./src/components/UICheckbox/UICheckbox.tsx"),o)},"./src/components/UILink/UILink.tsx"(f,o,a){var u=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};Object.defineProperty(o,"__esModule",{value:!0}),o.UILink=void 0;const s=u(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),e={primary:{color:"var(--vscode-textLink-foreground)",hoverColor:"var(--vscode-textLink-activeForeground)"},secondary:{color:"var(--vscode-foreground)",hoverColor:"var(--vscode-foreground)"}};class r extends s.default.Component{constructor(l){super(l)}render(){const{secondary:l,underline:c,disabled:_}=this.props,d=l?e.secondary:e.primary,n=()=>({root:{color:d.color,textDecoration:c===!1?void 0:"underline",selectors:_?void 0:{"&:hover, &:hover:focus, &:hover:active":{color:d.hoverColor,textDecoration:c===!1?"underline":"none"},"&:active, &:focus":{color:d.hoverColor,textDecoration:c===!1?"underline":"none",outline:"none"},".ms-Fabric--isFocusVisible &:focus":{boxShadow:"none",outline:"1px solid var(--vscode-focusBorder)",outlineOffset:"-1px"}},opacity:_?.4:void 0}});return s.default.createElement(t.Link,m(v({},this.props),{styles:n}))}}o.UILink=r},"./src/components/UILink/index.tsx"(f,o,a){var u=this&&this.__createBinding||(Object.create?(function(t,e,r,i){i===void 0&&(i=r);var l=Object.getOwnPropertyDescriptor(e,r);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,l)}):(function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]})),s=this&&this.__exportStar||function(t,e){for(var r in t)r!=="default"&&!Object.prototype.hasOwnProperty.call(e,r)&&u(e,t,r)};Object.defineProperty(o,"__esModule",{value:!0}),s(a("./src/components/UILink/UILink.tsx"),o)},"./stories/UILink.story.tsx"(f,o,a){var u=this&&this.__createBinding||(Object.create?(function(d,n,p,h){h===void 0&&(h=p);var b=Object.getOwnPropertyDescriptor(n,p);(!b||("get"in b?!n.__esModule:b.writable||b.configurable))&&(b={enumerable:!0,get:function(){return n[p]}}),Object.defineProperty(d,h,b)}):(function(d,n,p,h){h===void 0&&(h=p),d[h]=n[p]})),s=this&&this.__setModuleDefault||(Object.create?(function(d,n){Object.defineProperty(d,"default",{enumerable:!0,value:n})}):function(d,n){d.default=n}),t=this&&this.__importStar||(function(){var d=function(n){return d=Object.getOwnPropertyNames||function(p){var h=[];for(var b in p)Object.prototype.hasOwnProperty.call(p,b)&&(h[h.length]=b);return h},d(n)};return function(n){if(n&&n.__esModule)return n;var p={};if(n!=null)for(var h=d(n),b=0;b<h.length;b++)h[b]!=="default"&&u(p,n,h[b]);return s(p,n),p}})();Object.defineProperty(o,"__esModule",{value:!0}),o.defaultUsage=void 0;const e=t(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),r=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),i=a("./src/components/UILink/index.tsx"),l=a("./src/components/UICheckbox/index.tsx");o.default={title:"Basic Inputs/Link"};const c={childrenGap:40},_=()=>{const[d,n]=(0,e.useState)(!1);return e.default.createElement(r.Stack,{tokens:c},e.default.createElement(r.Stack,{tokens:c},e.default.createElement(r.Stack,{horizontal:!0,tokens:c},e.default.createElement(l.UICheckbox,{label:"Disabled",checked:d,onChange:(p,h)=>{n(!!h)}}))),e.default.createElement(r.Stack,{tokens:c},e.default.createElement(r.Text,{variant:"large",className:"textColor",block:!0},"Primary UILink"),e.default.createElement(r.Stack,{horizontal:!0,tokens:c},e.default.createElement(i.UILink,{href:"JavaScript:void(0)",disabled:d},"I am a link"))),e.default.createElement(r.Stack,{tokens:c},e.default.createElement(r.Text,{variant:"large",className:"textColor",block:!0},"Primary UILink with no underline"),e.default.createElement(r.Stack,{horizontal:!0,tokens:c},e.default.createElement(i.UILink,{underline:!1,href:"JavaScript:void(0)",disabled:d},"I am a link"))),e.default.createElement(r.Stack,{tokens:c},e.default.createElement(r.Text,{variant:"large",className:"textColor",block:!0},"Secondary UILink"),e.default.createElement(r.Stack,{horizontal:!0,tokens:c},e.default.createElement(i.UILink,{secondary:!0,href:"JavaScript:void(0)",disabled:d},"I am a secondary link"))))};o.defaultUsage=_}}]);})();
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[660],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss"(m,a,s){var d=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"),l=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"),t=l(d);t.push([m.id,":root{--ui-box-shadow-small: 0 4px 8px 0 var(--vscode-widget-shadow);--ui-box-shadow-medium: 0 6px 12px 0 var(--vscode-widget-shadow);--ui-box-shadow-large: 0 10px 20px 0 var(--vscode-widget-shadow)}.ui-box-shadow-small{box-shadow:var(--ui-box-shadow-small)}.ui-box-shadow-medium{box-shadow:var(--ui-box-shadow-medium)}.ui-box-shadow-large{box-shadow:var(--ui-box-shadow-large)}",""]),m.exports=t},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"(m){"use strict";m.exports=function(a){var s=[];return s.toString=function(){return this.map(function(l){var t="",e=typeof l[5]!="undefined";return l[4]&&(t+="@supports (".concat(l[4],") {")),l[2]&&(t+="@media ".concat(l[2]," {")),e&&(t+="@layer".concat(l[5].length>0?" ".concat(l[5]):""," {")),t+=a(l),e&&(t+="}"),l[2]&&(t+="}"),l[4]&&(t+="}"),t}).join("")},s.i=function(l,t,e,_,c){typeof l=="string"&&(l=[[null,l,void 0]]);var u={};if(e)for(var n=0;n<this.length;n++){var i=this[n][0];i!=null&&(u[i]=!0)}for(var w=0;w<l.length;w++){var r=[].concat(l[w]);e&&u[r[0]]||(typeof c!="undefined"&&(typeof r[5]=="undefined"||(r[1]="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {").concat(r[1],"}")),r[5]=c),t&&(r[2]&&(r[1]="@media ".concat(r[2]," {").concat(r[1],"}")),r[2]=t),_&&(r[4]?(r[1]="@supports (".concat(r[4],") {").concat(r[1],"}"),r[4]=_):r[4]="".concat(_)),s.push(r))}},s}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(m){"use strict";m.exports=function(a){return a[1]}},"./src/styles/_shadows.scss"(m,a,s){"use strict";s.r(a),s.d(a,{default:()=>p});var d=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),l=s.n(d),t=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"),e=s.n(t),_=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"),c=s.n(_),u=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),n=s.n(u),i=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"),w=s.n(i),r=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"),v=s.n(r),b=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss"),E=s.n(b),y={};for(const f in b)f!=="default"&&(y[f]=()=>b[f]);s.d(a,y);var o={};o.styleTagTransform=v(),o.setAttributes=n(),o.insert=c().bind(null,"head"),o.domAPI=e(),o.insertStyleElement=w();var h=l()(E(),o);const p=E()&&E().locals?E().locals:void 0},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(m){"use strict";var a=[];function s(t){for(var e=-1,_=0;_<a.length;_++)if(a[_].identifier===t){e=_;break}return e}function d(t,e){for(var _={},c=[],u=0;u<t.length;u++){var n=t[u],i=e.base?n[0]+e.base:n[0],w=_[i]||0,r="".concat(i," ").concat(w);_[i]=w+1;var v=s(r),b={css:n[1],media:n[2],sourceMap:n[3],supports:n[4],layer:n[5]};if(v!==-1)a[v].references++,a[v].updater(b);else{var E=l(b,e);e.byIndex=u,a.splice(u,0,{identifier:r,updater:E,references:1})}c.push(r)}return c}function l(t,e){var _=e.domAPI(e);_.update(t);var c=function(n){if(n){if(n.css===t.css&&n.media===t.media&&n.sourceMap===t.sourceMap&&n.supports===t.supports&&n.layer===t.layer)return;_.update(t=n)}else _.remove()};return c}m.exports=function(t,e){e=e||{},t=t||[];var _=d(t,e);return function(u){u=u||[];for(var n=0;n<_.length;n++){var i=_[n],w=s(i);a[w].references--}for(var r=d(u,e),v=0;v<_.length;v++){var b=_[v],E=s(b);a[E].references===0&&(a[E].updater(),a.splice(E,1))}_=r}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"(m){"use strict";var a={};function s(l){if(typeof a[l]=="undefined"){var t=document.querySelector(l);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}a[l]=t}return a[l]}function d(l,t){var e=s(l);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(t)}m.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(m){"use strict";function a(s){var d=document.createElement("style");return s.setAttributes(d,s.attributes),s.insert(d,s.options),d}m.exports=a},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(m,a,s){"use strict";function d(l){var t=s.nc;t&&l.setAttribute("nonce",t)}m.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(m){"use strict";function a(l,t,e){var _="";e.supports&&(_+="@supports (".concat(e.supports,") {")),e.media&&(_+="@media ".concat(e.media," {"));var c=typeof e.layer!="undefined";c&&(_+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),_+=e.css,c&&(_+="}"),e.media&&(_+="}"),e.supports&&(_+="}");var u=e.sourceMap;u&&typeof btoa!="undefined"&&(_+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(u))))," */")),t.styleTagTransform(_,l,t.options)}function s(l){if(l.parentNode===null)return!1;l.parentNode.removeChild(l)}function d(l){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=l.insertStyleElement(l);return{update:function(_){a(t,l,_)},remove:function(){s(t)}}}m.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(m){"use strict";function a(s,d){if(d.styleSheet)d.styleSheet.cssText=s;else{for(;d.firstChild;)d.removeChild(d.firstChild);d.appendChild(document.createTextNode(s))}}m.exports=a},"./stories/UILoader.story.tsx"(m,a,s){"use strict";var d=this&&this.__createBinding||(Object.create?(function(y,o,h,p){p===void 0&&(p=h);var f=Object.getOwnPropertyDescriptor(o,h);(!f||("get"in f?!o.__esModule:f.writable||f.configurable))&&(f={enumerable:!0,get:function(){return o[h]}}),Object.defineProperty(y,p,f)}):(function(y,o,h,p){p===void 0&&(p=h),y[p]=o[h]})),l=this&&this.__setModuleDefault||(Object.create?(function(y,o){Object.defineProperty(y,"default",{enumerable:!0,value:o})}):function(y,o){y.default=o}),t=this&&this.__importStar||(function(){var y=function(o){return y=Object.getOwnPropertyNames||function(h){var p=[];for(var f in h)Object.prototype.hasOwnProperty.call(h,f)&&(p[p.length]=f);return p},y(o)};return function(o){if(o&&o.__esModule)return o;var h={};if(o!=null)for(var p=y(o),f=0;f<p.length;f++)p[f]!=="default"&&d(h,o,p[f]);return l(h,o),h}})();Object.defineProperty(a,"__esModule",{value:!0}),a.Dialogs=a.Delayed=a.Loaders=void 0;const e=t(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),_=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),c=s("./src/components/UILoader/index.tsx"),u=s("./src/components/UIButton/index.tsx"),n=s("./src/components/UIDialog/index.ts");a.default={title:"Progress/Loader"};const i={childrenGap:40},w=()=>e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Default Loader"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,null))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Large loader"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{size:_.SpinnerSize.large}))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Medium loader"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{size:_.SpinnerSize.medium}))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Small loader"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{size:_.SpinnerSize.small}))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"xSmall loader"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{size:_.SpinnerSize.xSmall}))),e.default.createElement(_.Stack,{tokens:i,style:{position:"relative"}},e.default.createElement(_.Text,null,"Loader - block DOM"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{blockDOM:!0}))),e.default.createElement(_.Stack,{tokens:i,style:{position:"relative",height:"75px"}},e.default.createElement(_.Text,null,"Loader - block DOM with text..."),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{blockDOM:!0,label:"Loader label..."}))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Small loader - css class"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{className:"uiLoaderXSmall"}))),e.default.createElement(_.Stack,{tokens:i},e.default.createElement(_.Text,null,"Large loader - css class"),e.default.createElement(_.Stack,{horizontal:!0},e.default.createElement(c.UILoader,{className:"uiLoaderXLarge"}))));a.Loaders=w;const r=()=>{const[y,o]=(0,e.useState)(!1);return e.default.createElement(e.default.Fragment,null,e.default.createElement("div",null,e.default.createElement("div",{style:{position:"relative",height:"100px",width:"300px",textAlign:"center"}},e.default.createElement(_.Text,null,"Loader - delayed"),y&&e.default.createElement(c.UILoader,{delayed:!0,blockDOM:!0,label:"Delayed loader"})),e.default.createElement("div",null,e.default.createElement(u.UIDefaultButton,{text:"Toggle Loader",onClick:()=>{o(!y)}}))))};a.Delayed=r;const v=`
|
|
3
|
+
.popup--busy .ms-Dialog-content {
|
|
4
|
+
position: static;
|
|
5
|
+
}
|
|
6
|
+
`,b=y=>{const{delayed:o,text:h}=y,[p,f]=(0,e.useState)(!1),[g,D]=(0,e.useState)(!1),S=()=>{f(!p)},I=()=>{D(!0),setTimeout(()=>{D(!1),S()},500)};return e.default.createElement(e.default.Fragment,null,e.default.createElement(u.UIDefaultButton,{onClick:S,primary:!0},h),e.default.createElement(n.UIDialog,{isOpen:p,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel",onAccept:S,onCancel:S,onDismiss:S,modalProps:{className:"popup--busy"},footer:e.default.createElement("div",null,e.default.createElement(u.UIDefaultButton,{onClick:I},"Accept"))},e.default.createElement("div",null,"Dummy"),g&&e.default.createElement(c.UILoader,{className:"uiLoaderXLarge",blockDOM:!0,delayed:o})))},E=()=>e.default.createElement(e.default.Fragment,null,e.default.createElement("style",null,v),e.default.createElement("div",null,e.default.createElement(b,{delayed:!1,text:"Open Dialog with loader"})),e.default.createElement("div",null,e.default.createElement(b,{delayed:!0,text:"Open Dialog with delayed loader"})));a.Dialogs=E}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var m=Object.defineProperty,y=Object.defineProperties;var M=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var B=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var g=(c,e,s)=>e in c?m(c,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):c[e]=s,l=(c,e)=>{for(var s in e||(e={}))B.call(e,s)&&g(c,s,e[s]);if(p)for(var s of p(e))b.call(e,s)&&g(c,s,e[s]);return c},f=(c,e)=>y(c,M(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[733],{"./src/components/UIMessageBar/UIMessageBar.tsx"(c,e,s){var i=this&&this.__importDefault||function(n){return n&&n.__esModule?n:{default:n}};Object.defineProperty(e,"__esModule",{value:!0}),e.UIMessageBar=e.UIMessageBarType=void 0;const u=i(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(e,"UIMessageBarType",{enumerable:!0,get:function(){return t.MessageBarType}});const r=s("./src/components/Icons.tsx");class o extends u.default.Component{constructor(a){super(a),this.setStyle=_=>{const{messageBarType:d}=_;return{root:l({},(d===t.MessageBarType.error||d===t.MessageBarType.success||d===t.MessageBarType.info||d===t.MessageBarType.warning)&&{backgroundColor:"transparent"}),innerText:{fontSize:13,lineHeight:18,color:"var(--vscode-foreground)",selectors:{p:{margin:0}}}}}}getMessageTypeIcon(a){switch(a){case t.MessageBarType.error:return r.UiIcons.Error;case t.MessageBarType.info:return r.UiIcons.Info;case t.MessageBarType.warning:return r.UiIcons.Warning;default:return r.UiIcons.Success}}render(){const a=this.getMessageTypeIcon(this.props.messageBarType);return u.default.createElement(t.MessageBar,f(l({},this.props),{messageBarIconProps:{iconName:a},styles:this.setStyle(this.props)}),this.props.children)}}e.UIMessageBar=o},"./src/components/UIMessageBar/index.tsx"(c,e,s){var i=this&&this.__createBinding||(Object.create?(function(t,r,o,n){n===void 0&&(n=o);var a=Object.getOwnPropertyDescriptor(r,o);(!a||("get"in a?!r.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return r[o]}}),Object.defineProperty(t,n,a)}):(function(t,r,o,n){n===void 0&&(n=o),t[n]=r[o]})),u=this&&this.__exportStar||function(t,r){for(var o in t)o!=="default"&&!Object.prototype.hasOwnProperty.call(r,o)&&i(r,t,o)};Object.defineProperty(e,"__esModule",{value:!0}),u(s("./src/components/UIMessageBar/UIMessageBar.tsx"),e)},"./stories/UIMessageBar.story.tsx"(c,e,s){var i=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(e,"__esModule",{value:!0}),e.defaultUsage=void 0;const u=i(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),r=s("./src/components/UIMessageBar/index.tsx");e.default={title:"Utilities/MessageBar"};const o={childrenGap:40},n=()=>u.default.createElement(t.Stack,{tokens:o},u.default.createElement(r.UIMessageBar,{messageBarType:t.MessageBarType.success},u.default.createElement("div",null,"Success message bar")),u.default.createElement(r.UIMessageBar,{messageBarType:t.MessageBarType.error},u.default.createElement("div",null,"Error message bar")));e.defaultUsage=n}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var m=Object.defineProperty,_=Object.defineProperties;var P=Object.getOwnPropertyDescriptors;var f=Object.getOwnPropertySymbols;var U=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var u=(r,t,a)=>t in r?m(r,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):r[t]=a,d=(r,t)=>{for(var a in t||(t={}))U.call(t,a)&&u(r,a,t[a]);if(f)for(var a of f(t))b.call(t,a)&&u(r,a,t[a]);return r},p=(r,t)=>_(r,P(t));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[271],{"./src/components/UIPersona/UIPersona.tsx"(r,t,a){var l=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(t,"__esModule",{value:!0}),t.UIPersona=t.UIPersonaPresence=t.UIPersonaSize=void 0;const n=l(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(t,"UIPersonaSize",{enumerable:!0,get:function(){return i.PersonaSize}}),Object.defineProperty(t,"UIPersonaPresence",{enumerable:!0,get:function(){return i.PersonaPresence}});class e extends n.default.Component{constructor(c){super(c),this.personaStyles=o=>({root:{},details:{},primaryText:{},secondaryText:{},tertiaryText:{},optionalText:{},textContent:{}})}render(){return n.default.createElement(i.Persona,p(d({},this.props),{styles:this.personaStyles}))}}t.UIPersona=e},"./src/components/UIPersona/index.tsx"(r,t,a){var l=this&&this.__createBinding||(Object.create?(function(i,e,s,c){c===void 0&&(c=s);var o=Object.getOwnPropertyDescriptor(e,s);(!o||("get"in o?!e.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(i,c,o)}):(function(i,e,s,c){c===void 0&&(c=s),i[c]=e[s]})),n=this&&this.__exportStar||function(i,e){for(var s in i)s!=="default"&&!Object.prototype.hasOwnProperty.call(e,s)&&l(e,i,s)};Object.defineProperty(t,"__esModule",{value:!0}),n(a("./src/components/UIPersona/UIPersona.tsx"),t)},"./stories/UIPersona.story.tsx"(r,t,a){var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(t,"__esModule",{value:!0}),t.defaultUsage=void 0;const n=l(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),e=a("./src/components/UIPersona/index.tsx");t.default={title:"Utilities/Persona"};const s={childrenGap:40},c=()=>n.default.createElement(i.Stack,{tokens:s},n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size24}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size32}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size40}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size48}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size56}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size72}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size100}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size120}),n.default.createElement(e.UIPersona,{text:"John Doe",size:e.UIPersonaSize.size72}),n.default.createElement(e.UIPersona,{imageUrl:"https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png",size:e.UIPersonaSize.size120,text:"John Doe",presence:e.UIPersonaPresence.online,secondaryText:"Software Engineer",tertiaryText:"In a meeting",optionalText:"Available at 4:00pm"}));t.defaultUsage=c}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var p=Object.defineProperty;var o=Object.getOwnPropertySymbols;var g=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var s=(a,e,n)=>e in a?p(a,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):a[e]=n,r=(a,e)=>{for(var n in e||(e={}))g.call(e,n)&&s(a,n,e[n]);if(o)for(var n of o(e))y.call(e,n)&&s(a,n,e[n]);return a};(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[680],{"./stories/UIQuickNavigation.story.tsx"(a,e,n){var E=this&&this.__importDefault||function(u){return u&&u.__esModule?u:{default:u}};Object.defineProperty(e,"__esModule",{value:!0}),e.ExternalWithCustomOffset=e.External=e.Inline=void 0;const t=E(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=n("./src/components/index.tsx");e.default={title:"Utilities/Quick Navigation"};const k={name:"Hello, world!",html:"<span><strong>Tag:</strong> name</span>"},c=u=>{const{title:d}=u;return t.default.createElement("div",{style:{border:"1px solid red",margin:"20px 0",padding:10}},t.default.createElement("div",null,d),t.default.createElement(i.UITextInput,{label:"Dummy 1"}),t.default.createElement(i.UITextInput,{label:"Dummy 2"}),t.default.createElement(i.UIDefaultButton,null,"Submit"))},m=u=>{const{inline:d,offsets:l}=u;return t.default.createElement("div",{style:{margin:10}},t.default.createElement("div",null,`Inline = ${d}`),t.default.createElement(i.UIQuickNavigation,{inline:d},t.default.createElement("div",r({},(0,i.setQuickNavigationKey)("A",l==null?void 0:l[0])),t.default.createElement(c,{title:"Group 1"})),t.default.createElement("div",r({},(0,i.setQuickNavigationKey)("B",l==null?void 0:l[1])),t.default.createElement(c,{title:"Group 2"})),t.default.createElement("div",r({},(0,i.setQuickNavigationKey)("C",l==null?void 0:l[2])),t.default.createElement(c,{title:"Group 3"})),t.default.createElement("div",r({},(0,i.setQuickNavigationKey)("D",l==null?void 0:l[3])),t.default.createElement(c,{title:"Group 4"}))))},f=()=>t.default.createElement(m,{inline:!0});e.Inline=f;const v=()=>t.default.createElement(m,{inline:!1});e.External=v;const _=()=>t.default.createElement(m,{inline:!1,offsets:[{y:30,x:0},{y:0,x:30},{y:-15,x:-15}]});e.ExternalWithCustomOffset=_}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var O=Object.defineProperty,w=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var _=(s,t,r)=>t in s?O(s,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[t]=r,p=(s,t)=>{for(var r in t||(t={}))P.call(t,r)&&_(s,r,t[r]);if(h)for(var r of h(t))I.call(t,r)&&_(s,r,t[r]);return s},x=(s,t)=>w(s,C(t));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[104],{"./stories/UISearchBox.story.tsx"(s,t,r){var b=this&&this.__createBinding||(Object.create?(function(o,e,c,n){n===void 0&&(n=c);var a=Object.getOwnPropertyDescriptor(e,c);(!a||("get"in a?!e.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return e[c]}}),Object.defineProperty(o,n,a)}):(function(o,e,c,n){n===void 0&&(n=c),o[n]=e[c]})),m=this&&this.__setModuleDefault||(Object.create?(function(o,e){Object.defineProperty(o,"default",{enumerable:!0,value:e})}):function(o,e){o.default=e}),v=this&&this.__importStar||(function(){var o=function(e){return o=Object.getOwnPropertyNames||function(c){var n=[];for(var a in c)Object.prototype.hasOwnProperty.call(c,a)&&(n[n.length]=a);return n},o(e)};return function(e){if(e&&e.__esModule)return e;var c={};if(e!=null)for(var n=o(e),a=0;a<n.length;a++)n[a]!=="default"&&b(c,e,n[a]);return m(c,e),c}})();Object.defineProperty(t,"__esModule",{value:!0}),t.SearchBox=void 0;const u=v(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=r("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),S=r("./src/components/UISearchBox/index.tsx"),y=r("./src/components/index.tsx");t.default={title:"Basic Inputs/Search"};const g={childrenGap:40},j=()=>{const[o,e]=(0,u.useState)(""),c=(f,l)=>{l!==void 0&&e(l)},n=()=>{e("")},a=(f,l)=>{B(x(p({},d),{[f]:l}))},[d,B]=(0,u.useState)({value:o,onChange:c,onClear:n});return u.default.createElement(i.Stack,{tokens:g,style:{width:300}},u.default.createElement(i.Stack,{tokens:{childrenGap:16}},u.default.createElement(i.Text,{variant:"large",className:"textColor"},"UISearchBox"),u.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},u.default.createElement(y.UICheckbox,{label:"Disabled",checked:d.disabled,onChange:(f,l)=>{a("disabled",l)}})),u.default.createElement(S.UISearchBox,p({},d))))};t.SearchBox=j}}]);})();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";(()=>{var F=Object.defineProperty,K=Object.defineProperties;var Z=Object.getOwnPropertyDescriptors;var q=Object.getOwnPropertySymbols;var W=Object.prototype.hasOwnProperty,G=Object.prototype.propertyIsEnumerable;var w=(m,t,a)=>t in m?F(m,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):m[t]=a,
|
|
1
|
+
"use strict";(()=>{var F=Object.defineProperty,K=Object.defineProperties;var Z=Object.getOwnPropertyDescriptors;var q=Object.getOwnPropertySymbols;var W=Object.prototype.hasOwnProperty,G=Object.prototype.propertyIsEnumerable;var w=(m,t,a)=>t in m?F(m,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):m[t]=a,_=(m,t)=>{for(var a in t||(t={}))W.call(t,a)&&w(m,a,t[a]);if(q)for(var a of q(t))G.call(t,a)&&w(m,a,t[a]);return m},C=(m,t)=>K(m,Z(t));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[177],{"./src/index.tsx"(m,t,a){var T=this&&this.__createBinding||(Object.create?(function(e,o,s,f){f===void 0&&(f=s);var h=Object.getOwnPropertyDescriptor(o,s);(!h||("get"in h?!o.__esModule:h.writable||h.configurable))&&(h={enumerable:!0,get:function(){return o[s]}}),Object.defineProperty(e,f,h)}):(function(e,o,s,f){f===void 0&&(f=s),e[f]=o[s]})),S=this&&this.__exportStar||function(e,o){for(var s in e)s!=="default"&&!Object.prototype.hasOwnProperty.call(o,s)&&T(o,e,s)};Object.defineProperty(t,"__esModule",{value:!0}),t.setIconOptions=void 0,S(a("./src/components/index.tsx"),t),S(a("./src/utilities/index.ts"),t),S(a("./src/theme/index.ts"),t);var U=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(t,"setIconOptions",{enumerable:!0,get:function(){return U.setIconOptions}})},"./stories/UISections.story.tsx"(m,t,a){var T=this&&this.__createBinding||(Object.create?(function(l,n,d,i){i===void 0&&(i=d);var r=Object.getOwnPropertyDescriptor(n,d);(!r||("get"in r?!n.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return n[d]}}),Object.defineProperty(l,i,r)}):(function(l,n,d,i){i===void 0&&(i=d),l[i]=n[d]})),S=this&&this.__setModuleDefault||(Object.create?(function(l,n){Object.defineProperty(l,"default",{enumerable:!0,value:n})}):function(l,n){l.default=n}),U=this&&this.__importStar||(function(){var l=function(n){return l=Object.getOwnPropertyNames||function(d){var i=[];for(var r in d)Object.prototype.hasOwnProperty.call(d,r)&&(i[i.length]=r);return i},l(n)};return function(n){if(n&&n.__esModule)return n;var d={};if(n!=null)for(var i=l(n),r=0;r<i.length;r++)i[r]!=="default"&&T(d,n,i[r]);return S(d,n),d}})();Object.defineProperty(t,"__esModule",{value:!0}),t.VerticalSectionsThreeRows=t.HorizontalSectionsThreeColumns=t.VerticalSections=t.HorizontalSections=void 0;const e=U(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=a("./src/components/UISection/index.tsx"),s=a("./src/components/UIToggle/index.tsx"),f=a("./src/components/UIDropdown/index.tsx"),h=a("./src/components/UIButton/index.tsx"),A=a("./src/index.tsx");t.default={title:"Utilities/Splitter"};const V=`
|
|
2
2
|
.componentOptions {
|
|
3
3
|
display: flex;
|
|
4
4
|
}
|
|
@@ -16,4 +16,4 @@
|
|
|
16
16
|
Zril corpora ad per, id pri alia duis erant, elitr signiferumque eu duo. Offendit sententiae no vel, eos ad augue tibique definitionem, per ad aliquid graecis molestiae. No vero singulis sensibus nec, viris congue omnium an cum, eum cu veri maiorum suscipiantur. Ne comprehensam concludaturque nec. Eripuit deterruisset ei cum, cum elit debet sapientem ei.
|
|
17
17
|
At mollis integre inciderint usu. Eu eam inani affert populo, modus idque salutandi no ius. Ad qui nostro voluptua gloriatur. Novum gloriatur persequeris eu vel, vim te nominavi abhorreant expetendis. His assum possit officiis ut, et est affert nominati aliquando, nam ne omnes doming graecis. Pri ex tota idque appareat, fugit oporteat urbanitas eu pro.
|
|
18
18
|
Unum maluisset signiferumque has et, at persius intellegebat qui. Zril dolorum dignissim no ius, duo nostrud conceptam voluptatibus ut. Eam no noster fabellas, in meis tamquam expetendis pri. Id mel veri torquatos. Ridens facilisi constituto mei an, eos cu iriure facilis intellegam, cu magna graeci denique sea.
|
|
19
|
-
Unum consectetuer et pro, at ignota evertitur mei. Wisi meis officiis sed ne, ea errem veritus dissentiunt quo. Eum et meis persequeris eloquentiam, mei et platonem complectitur. Vidisse legendos tincidunt id quo, id inermis facilis deleniti ius.`,E=l=>l.map(n=>({key:n,text:n}));function y(l){var D;const[n,d]=(0,e.useState)(l.threeSections?200:400),[i,r]=(0,e.useState)({vertical:l.vertical,splitterType:o.UISplitterType.Resize,splitter:!0,splitterTabIndex:0,minSectionSize:l.threeSections?[100,100,100]:[300,300],animation:!0,splitterLayoutType:o.UISplitterLayoutType.Standard,sizesAsPercents:!1,sizes:l.threeSections?[n,void 0,200]:[n,void 0]}),[v,P]=(0,e.useState)(!0),[b,x]=(0,e.useState)(!0),I=(p,u)=>{r(_(
|
|
19
|
+
Unum consectetuer et pro, at ignota evertitur mei. Wisi meis officiis sed ne, ea errem veritus dissentiunt quo. Eum et meis persequeris eloquentiam, mei et platonem complectitur. Vidisse legendos tincidunt id quo, id inermis facilis deleniti ius.`,E=l=>l.map(n=>({key:n,text:n}));function y(l){var D;const[n,d]=(0,e.useState)(l.threeSections?200:400),[i,r]=(0,e.useState)({vertical:l.vertical,splitterType:o.UISplitterType.Resize,splitter:!0,splitterTabIndex:0,minSectionSize:l.threeSections?[100,100,100]:[300,300],animation:!0,splitterLayoutType:o.UISplitterLayoutType.Standard,sizesAsPercents:!1,sizes:l.threeSections?[n,void 0,200]:[n,void 0]}),[v,P]=(0,e.useState)(!0),[b,x]=(0,e.useState)(!0),I=(p,u)=>{r(C(_({},i),{[p]:u}))},R=(p,u)=>{I(p.currentTarget.id,u)},j=(p,u)=>{let c=i.animation;c===!0&&!u?(c=[!0,!0],c[p]=!1):!c&&u?(c=[!1,!1],c[p]=!0):c=u,I("animation",c)},O=(p,u,c,L)=>{I(p,c==null?void 0:c.key)},z=[e.default.createElement(o.UISections.Section,{key:"first",height:"100%",cleanPadding:!0,hidden:!v,"data-test":"test"},e.default.createElement("div",null,g,g,g))];return l.threeSections&&z.push(e.default.createElement(o.UISections.Section,{key:"second",height:"100%",cleanPadding:!0},e.default.createElement("div",null,g,g,g))),z.push(e.default.createElement(o.UISections.Section,{key:"last",height:"100%",cleanPadding:!0,hidden:!b},e.default.createElement("div",null,g,g,g))),e.default.createElement(e.default.Fragment,null,e.default.createElement("style",null,V),e.default.createElement("div",{style:{height:"100%",display:"flex",flexDirection:"column"}},e.default.createElement("div",{className:"componentOptions"},e.default.createElement(s.UIToggle,{id:"splitter",label:"splitter",checked:i.splitter,inlineLabel:!0,inlineLabelLeft:!0,size:s.UIToggleSize.Small,onChange:R}),e.default.createElement(f.UIDropdown,{id:"splitterType",label:"splitterType",selectedKey:i.splitterType,options:E([o.UISplitterType.Resize,o.UISplitterType.Toggle]),onChange:O.bind(this,"splitterType")}),e.default.createElement(f.UIDropdown,{id:"splitterTabIndex",label:"splitterTabIndex",selectedKey:(D=i.splitterTabIndex)==null?void 0:D.toString(),options:E(["-1","0"]),onChange:O.bind(this,"splitterTabIndex")}),e.default.createElement(f.UIDropdown,{id:"splitterLayoutType",label:"splitterLayoutType",selectedKey:i.splitterLayoutType,options:E([o.UISplitterLayoutType.Compact,o.UISplitterLayoutType.Standard]),onChange:O.bind(this,"splitterLayoutType")}),e.default.createElement(A.UITextInput,{label:"First section size",value:n,onChange:(p,u)=>{const c=parseFloat(u!=null?u:"");if(!isNaN(c)){d(c);const L=[...i.sizes];L[0]=c,I("sizes",L)}}}),e.default.createElement("div",null,e.default.createElement(s.UIToggle,{id:"animation1",label:"Animate left section",checked:Array.isArray(i.animation)?i.animation[0]:i.animation,inlineLabel:!0,inlineLabelLeft:!0,size:s.UIToggleSize.Small,onChange:(p,u)=>j(0,u)}),e.default.createElement(s.UIToggle,{id:"animation1",label:"Animate right section",checked:Array.isArray(i.animation)?i.animation[1]:i.animation,inlineLabel:!0,inlineLabelLeft:!0,size:s.UIToggleSize.Small,onChange:(p,u)=>j(1,u)})),e.default.createElement("div",null,e.default.createElement(s.UIToggle,{id:"sectionVisible",label:"toggle left section",checked:v,inlineLabel:!0,inlineLabelLeft:!0,size:s.UIToggleSize.Small,onChange:()=>{P(!v)}}),e.default.createElement(s.UIToggle,{id:"sectionVisible",label:"toggle right section",checked:b,inlineLabel:!0,inlineLabelLeft:!0,size:s.UIToggleSize.Small,onChange:()=>{x(!b)}})),e.default.createElement("div",null,e.default.createElement(h.UIDefaultButton,{text:"Toggle sections",onClick:()=>{P(!v),x(!b)}}))),e.default.createElement("div",{style:{height:"100%"}},e.default.createElement(o.UISections,C(_({},i),{height:"100%",onClose:()=>{x(!b)}}),z))))}const M=()=>e.default.createElement(y,{vertical:!1});t.HorizontalSections=M;const B=()=>e.default.createElement(y,{vertical:!0});t.VerticalSections=B;const H=()=>e.default.createElement(y,{vertical:!1,threeSections:!0});t.HorizontalSectionsThreeColumns=H;const N=()=>e.default.createElement(y,{vertical:!0,threeSections:!0});t.VerticalSectionsThreeRows=N}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var _=Object.defineProperty,m=Object.defineProperties;var b=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable;var i=(c,e,a)=>e in c?_(c,e,{enumerable:!0,configurable:!0,writable:!0,value:a}):c[e]=a,p=(c,e)=>{for(var a in e||(e={}))S.call(e,a)&&i(c,a,e[a]);if(d)for(var a of d(e))h.call(e,a)&&i(c,a,e[a]);return c},f=(c,e)=>m(c,b(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[930],{"./src/components/UISeparator/UISeparator.tsx"(c,e,a){var u=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(e,"__esModule",{value:!0}),e.UISeparator=void 0;const r=u(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");class n extends r.default.Component{constructor(l){super(l)}render(){const l=s=>({root:[{height:"100%",width:1,padding:"0 10px",selectors:{":before":{backgroundColor:"var(--vscode-editorWidget-border)",top:1,bottom:1}}},s.vertical&&{height:"100%",width:1,padding:"0 10px",selectors:{":after":{backgroundColor:"var(--vscode-editorWidget-border)",top:1,bottom:1}}}]});return r.default.createElement(o.Separator,f(p({},this.props),{styles:l}))}}e.UISeparator=n},"./src/components/UISeparator/index.tsx"(c,e,a){var u=this&&this.__createBinding||(Object.create?(function(o,n,t,l){l===void 0&&(l=t);var s=Object.getOwnPropertyDescriptor(n,t);(!s||("get"in s?!n.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return n[t]}}),Object.defineProperty(o,l,s)}):(function(o,n,t,l){l===void 0&&(l=t),o[l]=n[t]})),r=this&&this.__exportStar||function(o,n){for(var t in o)t!=="default"&&!Object.prototype.hasOwnProperty.call(n,t)&&u(n,o,t)};Object.defineProperty(e,"__esModule",{value:!0}),r(a("./src/components/UISeparator/UISeparator.tsx"),e)},"./stories/UISeparator.story.tsx"(c,e,a){var u=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(e,"__esModule",{value:!0}),e.defaultUsage=void 0;const r=u(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=a("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),n=a("./src/components/UISeparator/index.tsx");e.default={title:"Utilities/Separator"};const t={childrenGap:40},l=()=>r.default.createElement(o.Stack,{tokens:t},r.default.createElement(o.Stack,{tokens:t},r.default.createElement(o.Text,{variant:"large",className:"textColor",block:!0},"Vertical Separator"),r.default.createElement(o.Stack,{horizontal:!0,tokens:t},r.default.createElement("span",null,"Hello"),r.default.createElement(n.UISeparator,{vertical:!0}),r.default.createElement("span",null,"World"))),r.default.createElement(o.Stack,{tokens:t},r.default.createElement(o.Text,{variant:"large",className:"textColor",block:!0},"Horizontal Separator"),r.default.createElement(o.Stack,{horizontal:!0,tokens:t},r.default.createElement("span",null,"Hello"),r.default.createElement(n.UISeparator,null),r.default.createElement("span",null,"World"))));e.defaultUsage=l}}]);})();
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
"use strict";(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[967],{"./stories/UITable.story.tsx"(v,l,u){var m=this&&this.__createBinding||(Object.create?(function(t,e,n,a){a===void 0&&(a=n);var i=Object.getOwnPropertyDescriptor(e,n);(!i||("get"in i?!e.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(t,a,i)}):(function(t,e,n,a){a===void 0&&(a=n),t[a]=e[n]})),r=this&&this.__setModuleDefault||(Object.create?(function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}):function(t,e){t.default=e}),d=this&&this.__importStar||(function(){var t=function(e){return t=Object.getOwnPropertyNames||function(n){var a=[];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(a[a.length]=i);return a},t(e)};return function(e){if(e&&e.__esModule)return e;var n={};if(e!=null)for(var a=t(e),i=0;i<a.length;i++)a[i]!=="default"&&m(n,e,a[i]);return r(n,e),n}})();Object.defineProperty(l,"__esModule",{value:!0}),l.EditableTable2=l.EditableTable=l.ReadOnlyTable=void 0;const o=d(u("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=u("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),b=u("./src/components/UITable/index.tsx"),g=u("./src/components/Icons.tsx"),f=u("./src/components/UITable/types.ts"),c=u("./test/__mock__/table-data.ts");l.default={title:"Tables/UITable"};const p=Array.from({length:10}).map((t,e)=>{const n={key:"test"+(e+1),name:"Test "+(e+1),fieldName:"test"+(e+1),minWidth:100,maxWidth:200,isResizable:!0,editable:!1,validate:void 0,iconName:void 0,iconTooltip:void 0,columnControlType:f.ColumnControlType.UITextInput,comboboxOptions:void 0};return(e===1||e>=3)&&(n.name+=" (editable)",n.editable=!0,n.validate=h),e===1&&(n.iconName=g.UiIcons.Home,n.iconTooltip="Dummy tooltip"),e===3&&(n.columnControlType=f.ColumnControlType.UICombobox,n.comboboxOptions=["one","two","three"]),e===4&&(n.columnControlType=f.ColumnControlType.UIBooleanSelect),n}),_=p.map(t=>Object.assign({},t,{validate:void 0,editable:!1})),T=()=>o.default.createElement(s.Stack,null,o.default.createElement("div",{className:(0,s.mergeStyles)({height:"50vh",width:"100vh",position:"relative"})},o.default.createElement(b.UITable,{items:c.items,dataSetKey:"datasetkey",columns:_})));l.ReadOnlyTable=T;function S(t,e){var n;t&&(console.log("saving ",e,t),c.items[t==null?void 0:t.rowIndex][(n=t==null?void 0:t.column)==null?void 0:n.key]=e,console.log("saving ",c.items))}function y(t){console.log("selected",t)}function h(t){if(t==="hello")return'"hello" is not allowed here!'}const w=()=>{const[t,e]=(0,o.useState)(null),[n,a]=(0,o.useState)(null);return o.default.createElement(s.Stack,null,o.default.createElement("div",null,o.default.createElement("button",{onClick:()=>e(1)},"Scroll to 1st row"),"\xA0",o.default.createElement("button",{onClick:()=>e(9)},"Scroll to 9th row"),"\xA0",o.default.createElement("button",{onClick:()=>e(100)},"Scroll to 100th row"),"\xA0",o.default.createElement("button",{onClick:()=>a("column1")},"Scroll to 1st column"),"\xA0",o.default.createElement("button",{onClick:()=>a("column10")},"Scroll to 10th column"),"\xA0"),o.default.createElement("div",{className:(0,s.mergeStyles)({height:"90vh",width:"100vw",position:"relative"})},o.default.createElement(b.UITable,{dataSetKey:"datasetkey",items:c.items,columns:p,onSave:S,onSelectionChange:y,selectedRow:t,selectedColumnId:n,selectionMode:s.SelectionMode.multiple,checkboxVisibility:s.CheckboxVisibility.always,showRowNumbers:!0})))};l.EditableTable=w;const I=[{key:"",text:""},{key:"DZ",text:"Algeria"},{key:"AR",text:"Argentina"},{key:"AU",text:"Australia"},{key:"AT",text:"Austria"},{key:"BH",text:"Bahrain"}],E=Array.from({length:5}).map((t,e)=>{const n={key:"test"+(e+1),name:"Test "+(e+1),fieldName:"test"+(e+1),minWidth:100,maxWidth:200,isResizable:!0,editable:!1,validate:void 0,iconName:void 0,iconTooltip:void 0,columnControlType:f.ColumnControlType.UITextInput};return e>=1&&(n.name+=" (editable)",n.editable=!0,n.validate=h),e===1&&(n.columnControlType=f.ColumnControlType.UIDropdown,n.data={dropdownOptions:I}),n}),O=(t,e)=>e?o.default.createElement(s.Sticky,null,e(t)):null;function k(t,e){var n;t&&(console.log("saving ",e,t),c.items2[t==null?void 0:t.rowIndex][(n=t==null?void 0:t.column)==null?void 0:n.key]=e,console.log("saving ",c.items2))}const A=()=>o.default.createElement(s.Stack,null,o.default.createElement("div",{className:(0,s.mergeStyles)({height:"90vh",width:"100vw",position:"relative"})},o.default.createElement(b.UITable,{dataSetKey:"datasetkey",items:c.items2,columns:E,onSave:k,onSelectionChange:y,checkboxVisibility:s.CheckboxVisibility.always,headerRenderer:O,selectionMode:s.SelectionMode.multiple,renderInputs:f.RenderInputs.always})));l.EditableTable2=A},"./test/__mock__/table-data.ts"(v,l){Object.defineProperty(l,"__esModule",{value:!0}),l.items2=l.items=void 0;const u=`lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod tempor incididunt ut
|
|
2
|
+
labore et dolore magna aliqua ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut
|
|
3
|
+
aliquip ex ea commodo consequat duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
|
|
4
|
+
eu fugiat nulla pariatur excepteur sint occaecat cupidatat non proident sunt in culpa qui officia deserunt`;let m=0;function r(d=4){const o=u.split(" "),s=m+d>o.length?0:m;return m=s+d,o.slice(s,m).join(" ")}l.items=Array.from({length:200}).map((d,o)=>({key:o,test1:`row ${o}`,test2:r(),test3:r(),test4:r(),test5:r(),test6:r(),test7:r(),test8:r(),test9:r(),test10:r()})),l.items2=Array.from({length:4}).map((d,o)=>({key:o,test1:`test 1 row ${o}`,test2:`test 2 row ${o}`,test3:`test 3 row ${o}`,test4:`test 4 row ${o}`,test5:`test 5 row ${o}`}))}}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";(()=>{var C=Object.defineProperty,E=Object.defineProperties;var w=Object.getOwnPropertyDescriptors;var k=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable;var y=(d,r,n)=>r in d?C(d,r,{enumerable:!0,configurable:!0,writable:!0,value:n}):d[r]=n,h=(d,r)=>{for(var n in r||(r={}))S.call(r,n)&&y(d,n,r[n]);if(k)for(var n of k(r))U.call(r,n)&&y(d,n,r[n]);return d},m=(d,r)=>E(d,w(r));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[644],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"(d){d.exports=function(r){var n=[];return n.toString=function(){return this.map(function(e){var t="",a=typeof e[5]!="undefined";return e[4]&&(t+="@supports (".concat(e[4],") {")),e[2]&&(t+="@media ".concat(e[2]," {")),a&&(t+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),t+=r(e),a&&(t+="}"),e[2]&&(t+="}"),e[4]&&(t+="}"),t}).join("")},n.i=function(e,t,a,l,i){typeof e=="string"&&(e=[[null,e,void 0]]);var s={};if(a)for(var c=0;c<this.length;c++){var p=this[c][0];p!=null&&(s[p]=!0)}for(var f=0;f<e.length;f++){var o=[].concat(e[f]);a&&s[o[0]]||(typeof i!="undefined"&&(typeof o[5]=="undefined"||(o[1]="@layer".concat(o[5].length>0?" ".concat(o[5]):""," {").concat(o[1],"}")),o[5]=i),t&&(o[2]&&(o[1]="@media ".concat(o[2]," {").concat(o[1],"}")),o[2]=t),l&&(o[4]?(o[1]="@supports (".concat(o[4],") {").concat(o[1],"}"),o[4]=l):o[4]="".concat(l)),n.push(o))}},n}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(d){d.exports=function(r){return r[1]}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(d){var r=[];function n(t){for(var a=-1,l=0;l<r.length;l++)if(r[l].identifier===t){a=l;break}return a}function u(t,a){for(var l={},i=[],s=0;s<t.length;s++){var c=t[s],p=a.base?c[0]+a.base:c[0],f=l[p]||0,o="".concat(p," ").concat(f);l[p]=f+1;var b=n(o),v={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(b!==-1)r[b].references++,r[b].updater(v);else{var g=e(v,a);a.byIndex=s,r.splice(s,0,{identifier:o,updater:g,references:1})}i.push(o)}return i}function e(t,a){var l=a.domAPI(a);l.update(t);var i=function(c){if(c){if(c.css===t.css&&c.media===t.media&&c.sourceMap===t.sourceMap&&c.supports===t.supports&&c.layer===t.layer)return;l.update(t=c)}else l.remove()};return i}d.exports=function(t,a){a=a||{},t=t||[];var l=u(t,a);return function(s){s=s||[];for(var c=0;c<l.length;c++){var p=l[c],f=n(p);r[f].references--}for(var o=u(s,a),b=0;b<l.length;b++){var v=l[b],g=n(v);r[g].references===0&&(r[g].updater(),r.splice(g,1))}l=o}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"(d){var r={};function n(e){if(typeof r[e]=="undefined"){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(a){t=null}r[e]=t}return r[e]}function u(e,t){var a=n(e);if(!a)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");a.appendChild(t)}d.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(d){function r(n){var u=document.createElement("style");return n.setAttributes(u,n.attributes),n.insert(u,n.options),u}d.exports=r},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(d,r,n){function u(e){var t=n.nc;t&&e.setAttribute("nonce",t)}d.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(d){function r(e,t,a){var l="";a.supports&&(l+="@supports (".concat(a.supports,") {")),a.media&&(l+="@media ".concat(a.media," {"));var i=typeof a.layer!="undefined";i&&(l+="@layer".concat(a.layer.length>0?" ".concat(a.layer):""," {")),l+=a.css,i&&(l+="}"),a.media&&(l+="}"),a.supports&&(l+="}");var s=a.sourceMap;s&&typeof btoa!="undefined"&&(l+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(s))))," */")),t.styleTagTransform(l,e,t.options)}function n(e){if(e.parentNode===null)return!1;e.parentNode.removeChild(e)}function u(e){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=e.insertStyleElement(e);return{update:function(l){r(t,e,l)},remove:function(){n(t)}}}d.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(d){function r(n,u){if(u.styleSheet)u.styleSheet.cssText=n;else{for(;u.firstChild;)u.removeChild(u.firstChild);u.appendChild(document.createTextNode(n))}}d.exports=r},"./src/components/UICheckbox/UICheckbox.tsx"(d,r,n){var u=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(r,"__esModule",{value:!0}),r.UICheckbox=void 0;const e=u(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=n("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),a=n("./src/helper/ValidationMessage/index.tsx"),l=n("./src/components/UIInput/index.tsx");class i extends e.default.Component{constructor(c){super(c),this.GlobalClassNames={root:"ms-Checkbox",label:"ms-Checkbox-label",checkbox:"ms-Checkbox-checkbox",checkmark:"ms-Checkbox-checkmark",text:"ms-Checkbox-text"},this.setStyle=(p,f)=>({root:[!f.disabled&&[!f.checked&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)",[t.HighContrastSelector]:{borderColor:"Highlight"}},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"var(--vscode-foreground)",opacity:0,[t.HighContrastSelector]:{color:"Highlight"}}},{[`:hover .${this.GlobalClassNames.text}, :focus .${this.GlobalClassNames.text}`]:{color:"var(--vscode-foreground)",[t.HighContrastSelector]:{color:f.disabled?"GrayText":"WindowText"}}}],f.checked&&!f.indeterminate&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:f.disabled?"":"var(--vscode-checkbox-background)",borderColor:f.disabled?"":"var(--vscode-focusBorder)"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[t.HighContrastSelector]:{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight",borderColor:"Highlight"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"}}},p.message&&{marginBottom:2}],input:{[`.${t.IsFocusVisibleClassName} &:focus + label::before`]:{content:"",position:"absolute",inset:-1,border:"1px solid transparent !important",outline:"1px solid var(--vscode-focusBorder) !important",[t.HighContrastSelector]:{outline:"1px solid WindowText"}}},checkbox:{backgroundColor:"var(--vscode-debugToolBar-background, var(--vscode-editorWidget-background))",borderColor:"var(--vscode-editorWidget-border)",opacity:f.disabled?.4:void 0,borderRadius:l.COMMON_INPUT_STYLES.borderRadius},checkmark:{color:"var(--vscode-checkbox-foreground, var(--vscode-editorWidget-foreground))"},text:{color:"var(--vscode-foreground)",opacity:f.disabled?.4:void 0}})}render(){const c=(0,a.getMessageInfo)(this.props),p=e.default.createElement(t.Checkbox,m(h({},this.props),{styles:f=>h(h({},this.setStyle(c,f)),this.props.styles)}));return c.message?e.default.createElement(a.MessageWrapper,{message:c},p):p}}r.UICheckbox=i},"./src/components/UICheckbox/index.tsx"(d,r,n){var u=this&&this.__createBinding||(Object.create?(function(t,a,l,i){i===void 0&&(i=l);var s=Object.getOwnPropertyDescriptor(a,l);(!s||("get"in s?!a.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return a[l]}}),Object.defineProperty(t,i,s)}):(function(t,a,l,i){i===void 0&&(i=l),t[i]=a[l]})),e=this&&this.__exportStar||function(t,a){for(var l in t)l!=="default"&&!Object.prototype.hasOwnProperty.call(a,l)&&u(a,t,l)};Object.defineProperty(r,"__esModule",{value:!0}),e(n("./src/components/UICheckbox/UICheckbox.tsx"),r)},"./stories/UITextInput.story.tsx"(d,r,n){var u=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(r,"__esModule",{value:!0}),r.withMessages=r.accessibilityStates=r.defaultUsage=void 0;const e=u(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=n("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),a=n("./src/components/UIInput/index.tsx"),l=n("./src/components/UICheckbox/index.tsx");r.default={title:"Basic Inputs/Input"};const i={childrenGap:40},s={iconName:"FolderOpened"},c=()=>e.default.createElement(t.Stack,{tokens:i,style:{width:300}},e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput"),e.default.createElement(a.UITextInput,{label:"Enter your name"})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput with icon"),e.default.createElement(a.UITextInput,{label:"Select your folder",iconProps:s})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput disabled"),e.default.createElement(a.UITextInput,{label:"Enter your name",disabled:!0})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(a.UITextInput,{label:"Required",required:!0})));r.defaultUsage=c;const p=()=>{const[o,b]=e.default.useState(!1),[v,g]=e.default.useState("Content"),_={multiline:o,onChange:(I,x)=>{g(x||"")}};return e.default.createElement("div",null,e.default.createElement(t.Stack,{horizontal:!0,tokens:i},e.default.createElement(l.UICheckbox,{label:"Multi Line",checked:o,onChange:(I,x)=>{b(x)}})),e.default.createElement(t.Stack,{horizontal:!0,tokens:i},e.default.createElement("table",{style:{borderSpacing:20,width:"100%",maxWidth:750}},e.default.createElement("tr",null,e.default.createElement("td",{style:{minWidth:100,width:150}}),e.default.createElement("td",{style:{width:"50%"}},"Placeholder Text"),e.default.createElement("td",{style:{width:"50%"}},"Input Text")),e.default.createElement("tr",null,e.default.createElement("td",null,"Regular"),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{placeholder:"Placeholder"}))),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{value:v})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Error"),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{placeholder:"Placeholder",errorMessage:"Dummy error"}))),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{errorMessage:"Dummy error",value:v})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Disabled"),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{placeholder:"Placeholder",disabled:!0}))),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{value:v,disabled:!0})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Read Only"),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{placeholder:"Placeholder",readOnly:!0}))),e.default.createElement("td",null,e.default.createElement(a.UITextInput,m(h({},_),{value:v,readOnly:!0})))))))};r.accessibilityStates=p;const f=()=>{const o="Dummy message";return e.default.createElement(t.Stack,{tokens:i,style:{width:"100%"}},e.default.createElement(t.Stack,{tokens:{childrenGap:16},style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput with error message"),e.default.createElement(a.UITextInput,{label:"input field label",errorMessage:o})),e.default.createElement(t.Separator,null),e.default.createElement(t.Stack,{tokens:{childrenGap:16},style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput with warning message"),e.default.createElement(a.UITextInput,{label:"input field label",warningMessage:o})),e.default.createElement(t.Separator,null),e.default.createElement(t.Stack,{tokens:{childrenGap:16},style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIInput with info message"),e.default.createElement(a.UITextInput,{label:"input field label",infoMessage:o})))};r.withMessages=f}}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var P=Object.defineProperty,O=Object.defineProperties;var A=Object.getOwnPropertyDescriptors;var S=Object.getOwnPropertySymbols;var U=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable;var C=(u,r,_)=>r in u?P(u,r,{enumerable:!0,configurable:!0,writable:!0,value:_}):u[r]=_,y=(u,r)=>{for(var _ in r||(r={}))U.call(r,_)&&C(u,_,r[_]);if(S)for(var _ of S(r))j.call(r,_)&&C(u,_,r[_]);return u},I=(u,r)=>O(u,A(r));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[673],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"(u,r,_){var a=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"),e=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"),s=e(a);s.push([u.id,".ts-icon{fill:var(--vscode-foreground)}",""]),u.exports=s},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss"(u,r,_){var a=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"),e=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"),s=e(a);s.push([u.id,".ts-message-wrapper .ts-message-body{display:flex;font-size:11px}.ts-message-wrapper .ts-message-body>span{padding-top:1px}.ts-message-wrapper .ts-message-body>i{margin:1px 2px 0 0}.ts-message-wrapper--error .ts-message-body{color:var(--vscode-errorForeground)}.ts-message-wrapper--warning .ts-message-body{color:var(--vscode-editorMarkerNavigationWarning-background)}.ts-message-wrapper--info .ts-message-body{color:var(--vscode-inputValidation-infoBorder)}.ts-message-wrapper--info .ts-icon svg path{fill:var(--vscode-inputValidation-infoBorder)}.ts-message-wrapper--horizontal{display:flex}.ts-message-wrapper--horizontal .ts-message-body{align-self:flex-end;margin:0 0 7px 5px}",""]),u.exports=s},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"(u){"use strict";u.exports=function(r){var _=[];return _.toString=function(){return this.map(function(e){var s="",t=typeof e[5]!="undefined";return e[4]&&(s+="@supports (".concat(e[4],") {")),e[2]&&(s+="@media ".concat(e[2]," {")),t&&(s+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),s+=r(e),t&&(s+="}"),e[2]&&(s+="}"),e[4]&&(s+="}"),s}).join("")},_.i=function(e,s,t,o,n){typeof e=="string"&&(e=[[null,e,void 0]]);var l={};if(t)for(var c=0;c<this.length;c++){var p=this[c][0];p!=null&&(l[p]=!0)}for(var h=0;h<e.length;h++){var d=[].concat(e[h]);t&&l[d[0]]||(typeof n!="undefined"&&(typeof d[5]=="undefined"||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=n),s&&(d[2]&&(d[1]="@media ".concat(d[2]," {").concat(d[1],"}")),d[2]=s),o&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=o):d[4]="".concat(o)),_.push(d))}},_}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(u){"use strict";u.exports=function(r){return r[1]}},"./src/components/UIIcon/UIIcon.scss"(u,r,_){"use strict";_.r(r),_.d(r,{default:()=>m});var a=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),e=_.n(a),s=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"),t=_.n(s),o=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"),n=_.n(o),l=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),c=_.n(l),p=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"),h=_.n(p),d=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"),i=_.n(d),v=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"),f=_.n(v),b={};for(const w in v)w!=="default"&&(b[w]=()=>v[w]);_.d(r,b);var g={};g.styleTagTransform=i(),g.setAttributes=c(),g.insert=n().bind(null,"head"),g.domAPI=t(),g.insertStyleElement=h();var E=e()(f(),g);const m=f()&&f().locals?f().locals:void 0},"./src/helper/ValidationMessage/MessageWrapper.scss"(u,r,_){"use strict";_.r(r),_.d(r,{default:()=>m});var a=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),e=_.n(a),s=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"),t=_.n(s),o=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"),n=_.n(o),l=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),c=_.n(l),p=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"),h=_.n(p),d=_("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"),i=_.n(d),v=_("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss"),f=_.n(v),b={};for(const w in v)w!=="default"&&(b[w]=()=>v[w]);_.d(r,b);var g={};g.styleTagTransform=i(),g.setAttributes=c(),g.insert=n().bind(null,"head"),g.domAPI=t(),g.insertStyleElement=h();var E=e()(f(),g);const m=f()&&f().locals?f().locals:void 0},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(u){"use strict";var r=[];function _(s){for(var t=-1,o=0;o<r.length;o++)if(r[o].identifier===s){t=o;break}return t}function a(s,t){for(var o={},n=[],l=0;l<s.length;l++){var c=s[l],p=t.base?c[0]+t.base:c[0],h=o[p]||0,d="".concat(p," ").concat(h);o[p]=h+1;var i=_(d),v={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(i!==-1)r[i].references++,r[i].updater(v);else{var f=e(v,t);t.byIndex=l,r.splice(l,0,{identifier:d,updater:f,references:1})}n.push(d)}return n}function e(s,t){var o=t.domAPI(t);o.update(s);var n=function(c){if(c){if(c.css===s.css&&c.media===s.media&&c.sourceMap===s.sourceMap&&c.supports===s.supports&&c.layer===s.layer)return;o.update(s=c)}else o.remove()};return n}u.exports=function(s,t){t=t||{},s=s||[];var o=a(s,t);return function(l){l=l||[];for(var c=0;c<o.length;c++){var p=o[c],h=_(p);r[h].references--}for(var d=a(l,t),i=0;i<o.length;i++){var v=o[i],f=_(v);r[f].references===0&&(r[f].updater(),r.splice(f,1))}o=d}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"(u){"use strict";var r={};function _(e){if(typeof r[e]=="undefined"){var s=document.querySelector(e);if(window.HTMLIFrameElement&&s instanceof window.HTMLIFrameElement)try{s=s.contentDocument.head}catch(t){s=null}r[e]=s}return r[e]}function a(e,s){var t=_(e);if(!t)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");t.appendChild(s)}u.exports=a},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(u){"use strict";function r(_){var a=document.createElement("style");return _.setAttributes(a,_.attributes),_.insert(a,_.options),a}u.exports=r},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(u,r,_){"use strict";function a(e){var s=_.nc;s&&e.setAttribute("nonce",s)}u.exports=a},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(u){"use strict";function r(e,s,t){var o="";t.supports&&(o+="@supports (".concat(t.supports,") {")),t.media&&(o+="@media ".concat(t.media," {"));var n=typeof t.layer!="undefined";n&&(o+="@layer".concat(t.layer.length>0?" ".concat(t.layer):""," {")),o+=t.css,n&&(o+="}"),t.media&&(o+="}"),t.supports&&(o+="}");var l=t.sourceMap;l&&typeof btoa!="undefined"&&(o+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(l))))," */")),s.styleTagTransform(o,e,s.options)}function _(e){if(e.parentNode===null)return!1;e.parentNode.removeChild(e)}function a(e){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var s=e.insertStyleElement(e);return{update:function(o){r(s,e,o)},remove:function(){_(s)}}}u.exports=a},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(u){"use strict";function r(_,a){if(a.styleSheet)a.styleSheet.cssText=_;else{for(;a.firstChild;)a.removeChild(a.firstChild);a.appendChild(document.createTextNode(_))}}u.exports=r},"./src/components/UIIcon/UIIcon.tsx"(u,r,_){"use strict";var a=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(r,"__esModule",{value:!0}),r.UIIcon=void 0;const e=a(_("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=_("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");_("./src/components/UIIcon/UIIcon.scss");class t extends e.default.Component{constructor(n){super(n),this.setStyle=()=>({})}render(){const n=this.props.className?` ${this.props.className}`:"";return e.default.createElement(s.Icon,I(y({},this.props),{className:`ts-icon${n}`,styles:this.setStyle()}))}}r.UIIcon=t},"./src/components/UIIcon/index.tsx"(u,r,_){"use strict";var a=this&&this.__createBinding||(Object.create?(function(s,t,o,n){n===void 0&&(n=o);var l=Object.getOwnPropertyDescriptor(t,o);(!l||("get"in l?!t.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(s,n,l)}):(function(s,t,o,n){n===void 0&&(n=o),s[n]=t[o]})),e=this&&this.__exportStar||function(s,t){for(var o in s)o!=="default"&&!Object.prototype.hasOwnProperty.call(t,o)&&a(t,s,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(_("./src/components/UIIcon/UIIcon.tsx"),r)},"./src/components/UIToggle/UIToggle.tsx"(u,r,_){"use strict";var a=this&&this.__importDefault||function(f){return f&&f.__esModule?f:{default:f}};Object.defineProperty(r,"__esModule",{value:!0}),r.UIToggle=r.UIToggleSize=void 0;const e=a(_("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=a(_("../../node_modules/.pnpm/react-dom@16.14.0_react@16.14.0/node_modules/react-dom/index.js")),t=_("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),o=_("./src/helper/ValidationMessage/index.tsx"),n=_("./src/components/UIIcon/index.tsx"),l=_("./src/components/Icons.tsx");var c;(function(f){f.Standard="Standard",f.Small="Small"})(c||(r.UIToggleSize=c={}));const p={width:30,height:18,padding:"0 1px",margin:"0",label:{fontSize:13,padding:"0px 0px 1px 0px"},circle:{width:14,height:14,borderWidth:1}},h={display:"flex"},d=.4,i={pill:{unchecked:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-editorWidget-border)",hover:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-editorWidget-border)"}},checked:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-editorWidget-border))",hover:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-editorWidget-border))"}},focus:{outline:"1px solid var(--vscode-focusBorder) !important"}},thumb:{unchecked:{background:"var(--vscode-button-secondaryBackground)",borderColor:"var(--vscode-button-border, transparent)",hover:{borderColor:"var(--vscode-button-border, transparent)",background:"var(--vscode-contrastBorder, var(--vscode-button-secondaryHoverBackground))"}},checked:{background:"var(--vscode-button-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-button-border, transparent))",hover:{borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-button-border, transparent))",background:"var(--vscode-contrastActiveBorder, var(--vscode-button-hoverBackground))"}}}};class v extends e.default.Component{constructor(b){super(b),this.toggleRootRef=e.default.createRef(),this.handleChange=this.handleChange.bind(this),this.replaceThumbWithIcon=this.replaceThumbWithIcon.bind(this)}componentDidMount(){var b;this.replaceThumbWithIcon((b=this.props.checked)!=null?b:this.props.defaultChecked)}shouldComponentUpdate(b){return b.checked!==this.props.checked&&this.replaceThumbWithIcon(b.checked),!0}handleChange(b,g){var E,m;this.replaceThumbWithIcon(g),(m=(E=this.props).onChange)==null||m.call(E,b,g)}replaceThumbWithIcon(b=!1){var g;if(this.toggleRootRef.current){const E=(g=this.toggleRootRef.current)==null?void 0:g.querySelector(".ms-Toggle-thumb");E&&s.default.render(e.default.createElement(n.UIIcon,{iconName:b?l.UiIcons.SwitchOn:l.UiIcons.SwitchOff,style:h}),E)}}getMarginBottom(b){const{inlineLabel:g}=this.props;if(b)return g?0:4}render(){const{inlineLabelLeft:b,labelFlexGrow:g,inlineLabel:E}=this.props,m=p,w=(0,o.getMessageInfo)(this.props),k=M=>({root:I(y({},g&&{flexGrow:1,justifyContent:"space-between"}),{margin:m==null?void 0:m.margin,marginBottom:this.getMarginBottom(w.message)}),label:I(y(y({color:"var(--vscode-foreground)",fontWeight:"normal",fontSize:m==null?void 0:m.label.fontSize,padding:m==null?void 0:m.label.padding},E&&{marginLeft:10}),b&&{order:0,marginLeft:0,marginRight:10}),{opacity:this.props.disabled?d:"inherit"}),pill:I(y({height:m==null?void 0:m.height,width:m==null?void 0:m.width,padding:m==null?void 0:m.padding,background:i.pill.checked.background,borderColor:i.pill.checked.borderColor,borderStyle:"solid",":hover .ms-Toggle-thumb":{background:i.thumb.checked.hover.background,borderColor:i.thumb.checked.hover.borderColor},":hover":{background:i.pill.checked.hover.background,borderColor:i.pill.checked.hover.borderColor},":disabled":{background:i.pill.checked.background,borderColor:i.pill.checked.borderColor,opacity:d}},!M.checked&&{background:i.pill.unchecked.background,borderColor:i.pill.unchecked.borderColor,borderStyle:"solid",":hover .ms-Toggle-thumb":{background:i.thumb.unchecked.hover.background,borderColor:i.thumb.unchecked.hover.borderColor},":hover":{background:i.pill.unchecked.hover.background,borderColor:i.pill.unchecked.hover.borderColor},":disabled":{background:i.pill.unchecked.background,borderColor:i.pill.unchecked.borderColor,opacity:d}}),{selectors:{":focus::after":{border:"none !important",outline:i.pill.focus.outline}}}),thumb:I(y({height:m==null?void 0:m.circle.height,width:m==null?void 0:m.circle.width,borderWidth:m==null?void 0:m.circle.borderWidth,backgroundPosition:"center",borderColor:i.thumb.checked.borderColor,backgroundColor:i.thumb.checked.background,":hover":{background:i.thumb.checked.hover.background,borderColor:i.thumb.checked.hover.borderColor}},!M.checked&&{borderColor:i.thumb.unchecked.borderColor,backgroundColor:i.thumb.unchecked.background}),{svg:{width:"100%",height:"100%",path:{fill:M.checked?"var(--vscode-button-foreground)":"var(--vscode-button-secondaryForeground)"}}})}),T=e.default.createElement(t.Toggle,I(y({},this.props),{styles:k,ref:this.toggleRootRef,onChange:this.handleChange}));return w.message?e.default.createElement(o.MessageWrapper,{message:w},T):T}}r.UIToggle=v},"./src/components/UIToggle/index.tsx"(u,r,_){"use strict";var a=this&&this.__createBinding||(Object.create?(function(s,t,o,n){n===void 0&&(n=o);var l=Object.getOwnPropertyDescriptor(t,o);(!l||("get"in l?!t.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(s,n,l)}):(function(s,t,o,n){n===void 0&&(n=o),s[n]=t[o]})),e=this&&this.__exportStar||function(s,t){for(var o in s)o!=="default"&&!Object.prototype.hasOwnProperty.call(t,o)&&a(t,s,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(_("./src/components/UIToggle/UIToggle.tsx"),r)},"./src/helper/ValidationMessage/MessageWrapper.tsx"(u,r,_){"use strict";var a=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(r,"__esModule",{value:!0}),r.MESSAGE_ICONS_MAP=void 0,r.MessageWrapper=n;const e=a(_("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=_("./src/helper/ValidationMessage/utils.ts"),t=_("./src/components/Icons.tsx"),o=_("./src/components/UIIcon/index.tsx");_("./src/helper/ValidationMessage/MessageWrapper.scss"),r.MESSAGE_ICONS_MAP=new Map([[void 0,t.UiIcons.Error],[s.ErrorMessageType.Error,t.UiIcons.Error],[s.ErrorMessageType.Warning,t.UiIcons.Warning],[s.ErrorMessageType.Info,t.UiIcons.Info]]);function n(l){const{children:c,message:p}=l,h=p.message?s.MESSAGE_TYPES_CLASSNAME_MAP.get(p.type):void 0,d=r.MESSAGE_ICONS_MAP.get(p.type);return e.default.createElement("div",{className:`ts-message-wrapper ts-message-wrapper--${h}`},e.default.createElement("div",{className:"ts-message-target"},c),e.default.createElement("div",{className:"ts-message-body"},e.default.createElement(o.UIIcon,{iconName:d}),e.default.createElement("span",null,p.message)))}},"./src/helper/ValidationMessage/index.tsx"(u,r,_){"use strict";var a=this&&this.__createBinding||(Object.create?(function(s,t,o,n){n===void 0&&(n=o);var l=Object.getOwnPropertyDescriptor(t,o);(!l||("get"in l?!t.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(s,n,l)}):(function(s,t,o,n){n===void 0&&(n=o),s[n]=t[o]})),e=this&&this.__exportStar||function(s,t){for(var o in s)o!=="default"&&!Object.prototype.hasOwnProperty.call(t,o)&&a(t,s,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(_("./src/helper/ValidationMessage/MessageWrapper.tsx"),r),e(_("./src/helper/ValidationMessage/utils.ts"),r)},"./src/helper/ValidationMessage/utils.ts"(u,r){"use strict";Object.defineProperty(r,"__esModule",{value:!0}),r.getMessageInfo=r.MESSAGE_TYPES_CLASSNAME_MAP=r.ErrorMessageType=void 0;var _;(function(l){l.Error="Error",l.Warning="Warning",l.Info="Info"})(_||(r.ErrorMessageType=_={}));const a=(l,c)=>{const p=`1px solid ${c}`;return{backgroundColor:l,borderLeft:p,borderRight:p,borderBottom:p,borderColor:c}},e={error:I(y({color:"var(--vscode-input-foreground)"},a("var(--vscode-inputValidation-errorBackground)","var(--vscode-inputValidation-errorBorder)")),{paddingTop:4,paddingBottom:5,paddingLeft:8,margin:0}),warning:{},info:{}};e.warning=y(y({},e.error),a("var(--vscode-inputValidation-warningBackground)","var(--vscode-inputValidation-warningBorder)")),e.info=y(y({},e.error),a("var(--vscode-inputValidation-infoBackground)","var(--vscode-inputValidation-infoBorder)")),r.MESSAGE_TYPES_CLASSNAME_MAP=new Map([[void 0,"error"],[_.Error,"error"],[_.Warning,"warning"],[_.Info,"info"]]);const s=l=>{let c;switch(l){case _.Warning:{c=e.warning;break}case _.Info:{c=e.info;break}default:{c=e.error;break}}return c},t=l=>{if(l){if(l.errorMessage)return _.Error;if(l.warningMessage)return _.Warning;if(l.infoMessage)return _.Info}return _.Error},o=l=>{const c=["errorMessage","warningMessage","infoMessage"];for(const p of c)if(l!=null&&l[p])return l[p]},n=l=>{const c=t(l);return{type:c,style:s(c),message:o(l)}};r.getMessageInfo=n},"./stories/UIToggle.story.tsx"(u,r,_){"use strict";var a=this&&this.__importDefault||function(d){return d&&d.__esModule?d:{default:d}};Object.defineProperty(r,"__esModule",{value:!0}),r.withMessages=r.smallSize=r.withLabel=r.asDisabled=r.defaultUsage=void 0;const e=a(_("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=_("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),t=_("./src/components/UIToggle/index.tsx");r.default={title:"Basic Inputs/Toggle/Buttons"};const o={childrenGap:40},n=()=>e.default.createElement(s.Stack,{tokens:o,style:{width:300}},e.default.createElement(s.Text,{variant:"large",className:"textColor"},"UIToggle"),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"default"),e.default.createElement(t.UIToggle,null)),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"set to checked"),e.default.createElement(t.UIToggle,{defaultChecked:!0})));r.defaultUsage=n;const l=()=>e.default.createElement(s.Stack,{tokens:o,style:{width:300}},e.default.createElement(s.Text,{variant:"large",className:"textColor"},"UIToggle disabled"),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"default"),e.default.createElement(t.UIToggle,{disabled:!0})),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"disabled as checked"),e.default.createElement(t.UIToggle,{disabled:!0,defaultChecked:!0})));r.asDisabled=l;const c=()=>e.default.createElement(s.Stack,{tokens:o,style:{width:300}},e.default.createElement(s.Text,{variant:"large",className:"textColor"},"UIToggle with label"),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"with inline label"),e.default.createElement(t.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode"})),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"with inline label on the left"),e.default.createElement(t.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode",inlineLabelLeft:!0})),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium",className:"textColor"},"with Grow label width"),e.default.createElement(t.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode",inlineLabelLeft:!0,labelFlexGrow:!0})));r.withLabel=c;const p=()=>e.default.createElement(s.Stack,{tokens:o,style:{width:300}},e.default.createElement(s.Text,{variant:"large",className:"textColor"},"UIToggle with label"),e.default.createElement(s.Stack,{tokens:{childrenGap:16}},e.default.createElement(s.Text,{variant:"medium"},"small size"),e.default.createElement(t.UIToggle,{label:"Small toggle",inlineLabel:!0,inlineLabelLeft:!0,size:t.UIToggleSize.Small})));r.smallSize=p;const h=()=>{const d="Dummy message";return e.default.createElement(e.default.Fragment,null,e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(t.UIToggle,{label:"Error",errorMessage:d}),e.default.createElement(t.UIToggle,{label:"Warning",warningMessage:d}),e.default.createElement(t.UIToggle,{label:"Info",infoMessage:d})),e.default.createElement("div",{style:{marginTop:"30px",width:"300px"}},e.default.createElement(t.UIToggle,{label:"Error",inlineLabel:!0,errorMessage:d}),e.default.createElement(t.UIToggle,{label:"Warning",inlineLabel:!0,warningMessage:d,labelFlexGrow:!0}),e.default.createElement(t.UIToggle,{label:"Info",inlineLabel:!0,infoMessage:d})),e.default.createElement("div",{style:{marginTop:"30px",width:"300px"}},e.default.createElement(t.UIToggle,{label:"Error",inlineLabel:!0,inlineLabelLeft:!0,errorMessage:d}),e.default.createElement(t.UIToggle,{label:"Warning",inlineLabel:!0,inlineLabelLeft:!0,warningMessage:d}),e.default.createElement(t.UIToggle,{label:"Info",inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,infoMessage:d})))};r.withMessages=h}}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var T=Object.defineProperty,P=Object.defineProperties;var j=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var U=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable;var E=(u,e,s)=>e in u?T(u,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):u[e]=s,v=(u,e)=>{for(var s in e||(e={}))U.call(e,s)&&E(u,s,e[s]);if(w)for(var s of w(e))M.call(e,s)&&E(u,s,e[s]);return u},I=(u,e)=>P(u,j(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[218],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"(u,e,s){var l=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"),r=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"),n=r(l);n.push([u.id,".ts-icon{fill:var(--vscode-foreground)}",""]),u.exports=n},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"(u){"use strict";u.exports=function(e){var s=[];return s.toString=function(){return this.map(function(r){var n="",t=typeof r[5]!="undefined";return r[4]&&(n+="@supports (".concat(r[4],") {")),r[2]&&(n+="@media ".concat(r[2]," {")),t&&(n+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),n+=e(r),t&&(n+="}"),r[2]&&(n+="}"),r[4]&&(n+="}"),n}).join("")},s.i=function(r,n,t,_,o){typeof r=="string"&&(r=[[null,r,void 0]]);var a={};if(t)for(var i=0;i<this.length;i++){var m=this[i][0];m!=null&&(a[m]=!0)}for(var c=0;c<r.length;c++){var d=[].concat(r[c]);t&&a[d[0]]||(typeof o!="undefined"&&(typeof d[5]=="undefined"||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=o),n&&(d[2]&&(d[1]="@media ".concat(d[2]," {").concat(d[1],"}")),d[2]=n),_&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=_):d[4]="".concat(_)),s.push(d))}},s}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(u){"use strict";u.exports=function(e){return e[1]}},"./src/components/UIIcon/UIIcon.scss"(u,e,s){"use strict";s.r(e),s.d(e,{default:()=>O});var l=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),r=s.n(l),n=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"),t=s.n(n),_=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"),o=s.n(_),a=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),i=s.n(a),m=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"),c=s.n(m),d=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"),p=s.n(d),f=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"),b=s.n(f),g={};for(const h in f)h!=="default"&&(g[h]=()=>f[h]);s.d(e,g);var y={};y.styleTagTransform=p(),y.setAttributes=i(),y.insert=o().bind(null,"head"),y.domAPI=t(),y.insertStyleElement=c();var S=r()(b(),y);const O=b()&&b().locals?b().locals:void 0},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(u){"use strict";var e=[];function s(n){for(var t=-1,_=0;_<e.length;_++)if(e[_].identifier===n){t=_;break}return t}function l(n,t){for(var _={},o=[],a=0;a<n.length;a++){var i=n[a],m=t.base?i[0]+t.base:i[0],c=_[m]||0,d="".concat(m," ").concat(c);_[m]=c+1;var p=s(d),f={css:i[1],media:i[2],sourceMap:i[3],supports:i[4],layer:i[5]};if(p!==-1)e[p].references++,e[p].updater(f);else{var b=r(f,t);t.byIndex=a,e.splice(a,0,{identifier:d,updater:b,references:1})}o.push(d)}return o}function r(n,t){var _=t.domAPI(t);_.update(n);var o=function(i){if(i){if(i.css===n.css&&i.media===n.media&&i.sourceMap===n.sourceMap&&i.supports===n.supports&&i.layer===n.layer)return;_.update(n=i)}else _.remove()};return o}u.exports=function(n,t){t=t||{},n=n||[];var _=l(n,t);return function(a){a=a||[];for(var i=0;i<_.length;i++){var m=_[i],c=s(m);e[c].references--}for(var d=l(a,t),p=0;p<_.length;p++){var f=_[p],b=s(f);e[b].references===0&&(e[b].updater(),e.splice(b,1))}_=d}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"(u){"use strict";var e={};function s(r){if(typeof e[r]=="undefined"){var n=document.querySelector(r);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(t){n=null}e[r]=n}return e[r]}function l(r,n){var t=s(r);if(!t)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");t.appendChild(n)}u.exports=l},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(u){"use strict";function e(s){var l=document.createElement("style");return s.setAttributes(l,s.attributes),s.insert(l,s.options),l}u.exports=e},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(u,e,s){"use strict";function l(r){var n=s.nc;n&&r.setAttribute("nonce",n)}u.exports=l},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(u){"use strict";function e(r,n,t){var _="";t.supports&&(_+="@supports (".concat(t.supports,") {")),t.media&&(_+="@media ".concat(t.media," {"));var o=typeof t.layer!="undefined";o&&(_+="@layer".concat(t.layer.length>0?" ".concat(t.layer):""," {")),_+=t.css,o&&(_+="}"),t.media&&(_+="}"),t.supports&&(_+="}");var a=t.sourceMap;a&&typeof btoa!="undefined"&&(_+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),n.styleTagTransform(_,r,n.options)}function s(r){if(r.parentNode===null)return!1;r.parentNode.removeChild(r)}function l(r){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var n=r.insertStyleElement(r);return{update:function(_){e(n,r,_)},remove:function(){s(n)}}}u.exports=l},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(u){"use strict";function e(s,l){if(l.styleSheet)l.styleSheet.cssText=s;else{for(;l.firstChild;)l.removeChild(l.firstChild);l.appendChild(document.createTextNode(s))}}u.exports=e},"./src/components/UIIcon/UIIcon.tsx"(u,e,s){"use strict";var l=this&&this.__importDefault||function(_){return _&&_.__esModule?_:{default:_}};Object.defineProperty(e,"__esModule",{value:!0}),e.UIIcon=void 0;const r=l(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),n=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");s("./src/components/UIIcon/UIIcon.scss");class t extends r.default.Component{constructor(o){super(o),this.setStyle=()=>({})}render(){const o=this.props.className?` ${this.props.className}`:"";return r.default.createElement(n.Icon,I(v({},this.props),{className:`ts-icon${o}`,styles:this.setStyle()}))}}e.UIIcon=t},"./src/components/UIIcon/index.tsx"(u,e,s){"use strict";var l=this&&this.__createBinding||(Object.create?(function(n,t,_,o){o===void 0&&(o=_);var a=Object.getOwnPropertyDescriptor(t,_);(!a||("get"in a?!t.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return t[_]}}),Object.defineProperty(n,o,a)}):(function(n,t,_,o){o===void 0&&(o=_),n[o]=t[_]})),r=this&&this.__exportStar||function(n,t){for(var _ in n)_!=="default"&&!Object.prototype.hasOwnProperty.call(t,_)&&l(t,n,_)};Object.defineProperty(e,"__esModule",{value:!0}),r(s("./src/components/UIIcon/UIIcon.tsx"),e)},"./src/components/UILabel/UILabel.tsx"(u,e,s){"use strict";var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(e,"__esModule",{value:!0}),e.UILabel=e.labelGlobalStyle=void 0;const r=l(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),n=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),t=s("./src/components/types.ts");e.labelGlobalStyle={fontWeight:"bold",fontSize:"13px",color:"var(--vscode-input-foreground)",padding:"4px 0"};class _ extends r.default.Component{constructor(a){super(a)}render(){const a=i=>({root:[v({marginTop:25},e.labelGlobalStyle),i.disabled&&{opacity:"0.4"},i.required&&{selectors:{"::after":{content:t.REQUIRED_LABEL_INDICATOR,color:"var(--vscode-inputValidation-errorBorder)",paddingRight:12}}}]});return r.default.createElement(n.Label,I(v({},this.props),{styles:a}))}}e.UILabel=_},"./src/components/UILabel/index.tsx"(u,e,s){"use strict";var l=this&&this.__createBinding||(Object.create?(function(n,t,_,o){o===void 0&&(o=_);var a=Object.getOwnPropertyDescriptor(t,_);(!a||("get"in a?!t.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return t[_]}}),Object.defineProperty(n,o,a)}):(function(n,t,_,o){o===void 0&&(o=_),n[o]=t[_]})),r=this&&this.__exportStar||function(n,t){for(var _ in n)_!=="default"&&!Object.prototype.hasOwnProperty.call(t,_)&&l(t,n,_)};Object.defineProperty(e,"__esModule",{value:!0}),r(s("./src/components/UILabel/UILabel.tsx"),e)},"./src/components/types.ts"(u,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.REQUIRED_LABEL_INDICATOR=void 0,e.REQUIRED_LABEL_INDICATOR="' *' / ''"},"./src/utilities/Debounce.ts"(u,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.debounce=s;function s(l,r){let n;return(...t)=>{clearTimeout(n),n=window.setTimeout(()=>{l(...t)},r)}}},"./src/utilities/Dom.ts"(u,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.isHTMLElement=s,e.isHTMLInputElement=l;function s(r){return"title"in r}function l(r){return"value"in r&&"tagName"in r&&r.tagName==="INPUT"}},"./src/utilities/Focus.ts"(u,e,s){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.isElementTabbable=e.getPreviousElement=e.getNextElement=e.setUIFocusVisibility=e.getUILastFocusable=e.getUIFirstFocusable=void 0,e.focusToSibling=r;const l=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(e,"getUIFirstFocusable",{enumerable:!0,get:function(){return l.getFirstFocusable}}),Object.defineProperty(e,"getUILastFocusable",{enumerable:!0,get:function(){return l.getLastFocusable}}),Object.defineProperty(e,"setUIFocusVisibility",{enumerable:!0,get:function(){return l.setFocusVisibility}}),Object.defineProperty(e,"getNextElement",{enumerable:!0,get:function(){return l.getNextElement}}),Object.defineProperty(e,"getPreviousElement",{enumerable:!0,get:function(){return l.getPreviousElement}}),Object.defineProperty(e,"isElementTabbable",{enumerable:!0,get:function(){return l.isElementTabbable}});function r(n,t){const _=(0,l.getDocument)();if(_){let o=null;if(t?o=(0,l.getNextElement)(_.body,n,!1,!1,!0,!0):o=(0,l.getPreviousElement)(_.body,n,!1,!1,!0,!0),o)return o.focus(),o}return null}},"./src/utilities/Id.ts"(u,e,s){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.getUIId=void 0;const l=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(e,"getUIId",{enumerable:!0,get:function(){return l.getId}})},"./src/utilities/Keys.ts"(u,e,s){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.UIKeyCodes=void 0;const l=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(e,"UIKeyCodes",{enumerable:!0,get:function(){return l.KeyCodes}})},"./src/utilities/index.ts"(u,e,s){"use strict";var l=this&&this.__createBinding||(Object.create?(function(n,t,_,o){o===void 0&&(o=_);var a=Object.getOwnPropertyDescriptor(t,_);(!a||("get"in a?!t.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return t[_]}}),Object.defineProperty(n,o,a)}):(function(n,t,_,o){o===void 0&&(o=_),n[o]=t[_]})),r=this&&this.__exportStar||function(n,t){for(var _ in n)_!=="default"&&!Object.prototype.hasOwnProperty.call(t,_)&&l(t,n,_)};Object.defineProperty(e,"__esModule",{value:!0}),r(s("./src/utilities/Debounce.ts"),e),r(s("./src/utilities/Dom.ts"),e),r(s("./src/utilities/Focus.ts"),e),r(s("./src/utilities/Id.ts"),e),r(s("./src/utilities/Keys.ts"),e)},"./stories/UIToggleGroup.story.tsx"(u,e,s){"use strict";var l=this&&this.__createBinding||(Object.create?(function(m,c,d,p){p===void 0&&(p=d);var f=Object.getOwnPropertyDescriptor(c,d);(!f||("get"in f?!c.__esModule:f.writable||f.configurable))&&(f={enumerable:!0,get:function(){return c[d]}}),Object.defineProperty(m,p,f)}):(function(m,c,d,p){p===void 0&&(p=d),m[p]=c[d]})),r=this&&this.__setModuleDefault||(Object.create?(function(m,c){Object.defineProperty(m,"default",{enumerable:!0,value:c})}):function(m,c){m.default=c}),n=this&&this.__importStar||(function(){var m=function(c){return m=Object.getOwnPropertyNames||function(d){var p=[];for(var f in d)Object.prototype.hasOwnProperty.call(d,f)&&(p[p.length]=f);return p},m(c)};return function(c){if(c&&c.__esModule)return c;var d={};if(c!=null)for(var p=m(c),f=0;f<p.length;f++)p[f]!=="default"&&l(d,c,p[f]);return r(d,c),d}})();Object.defineProperty(e,"__esModule",{value:!0}),e.defaultUsage=void 0;const t=n(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),_=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),o=s("./src/components/UIToggleGroup/index.ts");e.default={title:"Basic Inputs/Toggle/Group"};const a={childrenGap:40},i=()=>{const[m,c]=(0,t.useState)(""),d=[{key:"high",text:"H",ariaLabel:"High",title:"High"},{key:"medium",text:"M",ariaLabel:"Medium",title:"Medium"},{key:"low",text:"L",ariaLabel:"Low",title:"Low"}],p=[{key:"high",text:"H"},{key:"medium",text:"M",disabled:!0},{key:"low",text:"L"},{key:"long_text",text:"Long Text"}],f=[{key:"chart",icon:"Chart"},{key:"star",icon:"Star"},{key:"settings",icon:"Settings"}],b=(g,y)=>{c(y?g:"")};return t.default.createElement(_.Stack,{tokens:a,style:{width:300}},t.default.createElement(_.Text,{variant:"large",className:"textColor"},"UIToggleGroup"),t.default.createElement(_.Stack,{tokens:{childrenGap:16}},t.default.createElement(_.Text,{variant:"medium",className:"textColor"},"UIToggleGroup, default usage"),t.default.createElement(o.UIToggleGroup,{options:d,label:"Test",ariaLabel:"test",onChange:b.bind(this)}),t.default.createElement("span",null,"selection: ",m)),t.default.createElement(_.Stack,{tokens:{childrenGap:16}},t.default.createElement(_.Text,{variant:"medium",className:"textColor"},"UIToggleGroup, required value"),t.default.createElement(o.UIToggleGroup,{options:d,label:"Test",required:!0})),t.default.createElement(_.Stack,{tokens:{childrenGap:16}},t.default.createElement(_.Text,{variant:"medium",className:"textColor"},"UIToggleGroup, with default selected value"),t.default.createElement(o.UIToggleGroup,{options:d,label:"Test",selectedKey:"medium"})),t.default.createElement(_.Stack,{tokens:{childrenGap:16}},t.default.createElement(_.Text,{variant:"medium",className:"textColor"},"UIToggleGroup, with a disabled option"),t.default.createElement(o.UIToggleGroup,{options:p,label:"Test"})),t.default.createElement(_.Stack,{tokens:{childrenGap:16}},t.default.createElement(_.Text,{variant:"medium",className:"textColor"},"UIToggleGroup, with icons option"),t.default.createElement(o.UIToggleGroup,{options:f,label:"Test"})))};e.defaultUsage=i}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(()=>{var O=Object.defineProperty,U=Object.defineProperties;var P=Object.getOwnPropertyDescriptors;var E=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var C=(u,e,s)=>e in u?O(u,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):u[e]=s,b=(u,e)=>{for(var s in e||(e={}))L.call(e,s)&&C(u,s,e[s]);if(E)for(var s of E(e))I.call(e,s)&&C(u,s,e[s]);return u},w=(u,e)=>U(u,P(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[406],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss"(u,e,s){var c=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/noSourceMaps.js"),n=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/runtime/api.js"),d=n(c);d.push([u.id,":root{--ui-box-shadow-small: 0 4px 8px 0 var(--vscode-widget-shadow);--ui-box-shadow-medium: 0 6px 12px 0 var(--vscode-widget-shadow);--ui-box-shadow-large: 0 10px 20px 0 var(--vscode-widget-shadow)}.ui-box-shadow-small{box-shadow:var(--ui-box-shadow-small)}.ui-box-shadow-medium{box-shadow:var(--ui-box-shadow-medium)}.ui-box-shadow-large{box-shadow:var(--ui-box-shadow-large)}",""]),u.exports=d},"./src/styles/_shadows.scss"(u,e,s){"use strict";s.r(e),s.d(e,{default:()=>S});var c=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),n=s.n(c),d=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleDomAPI.js"),_=s.n(d),t=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertBySelector.js"),l=s.n(t),o=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),p=s.n(o),y=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/insertStyleElement.js"),r=s.n(y),i=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/style-loader/dist/runtime/styleTagTransform.js"),m=s.n(i),f=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0_@swc+core@1.15.11_@swc+helpers@0.5.19__esbuild@0.27.2_/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0_@swc+core@1.15.11_@_4f1593e189c7da437313975f630f8314/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss"),a=s.n(f),T={};for(const g in f)g!=="default"&&(T[g]=()=>f[g]);s.d(e,T);var h={};h.styleTagTransform=m(),h.setAttributes=p(),h.insert=l().bind(null,"head"),h.domAPI=_(),h.insertStyleElement=r();var v=n()(a(),h);const S=a()&&a().locals?a().locals:void 0},"./src/components/UICallout/CalloutCollisionTransform.ts"(u,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.CalloutCollisionTransform=void 0;const s={target:".ms-Dialog-actions",container:".ms-Dialog-main",absolute:!0,minPagePadding:10},c=20;class n{constructor(_,t,l=s){this.originalStyle={},this.source=_,this.callout=t,this.props=l,this.applyTransformation=this.applyTransformation.bind(this),this.resetTransformation=this.resetTransformation.bind(this),this.preventDismissOnEvent=this.preventDismissOnEvent.bind(this)}createPlaceholder(_){const t=document.createElement("div");return t.classList.add("ts-Callout-transformation"),t.style.height=`${_}px`,t}getElements(){const _=this.source.current,t=_==null?void 0:_.closest(this.props.container);if(t&&_){const l=t==null?void 0:t.querySelector(this.props.target);if(l){const o={container:{dom:t,rect:t.getBoundingClientRect()},target:{dom:l,rect:l.getBoundingClientRect()},source:{dom:_,rect:_.getBoundingClientRect()}},p=this.callout.current;return p&&(o.callout={dom:p,rect:p.getBoundingClientRect()}),o}}}applyTransformation(){const _=this.getElements();if(!_)return;const{container:t,target:l,callout:o,source:p}=_;if(o){const y=window.innerHeight-s.minPagePadding,r=o.rect.height,i=p.rect.bottom;let m=i+r-l.rect.top,f=i+o.rect.height;if(m<=0||f>=y)return;if(f+=l.rect.height,f<=y&&(m+=c),this.props.absolute){const a=t.dom.style;this.originalStyle={transform:a.transform,position:a.position,top:a.top,left:a.left},a.transform="",a.position="absolute",a.top=`${t.rect.top}px`,a.left=`${t.rect.left}px`}this.placeholder=this.createPlaceholder(m),l.dom.prepend(this.placeholder)}}resetTransformation(){const _=this.getElements();if(!_)return;const{container:t}=_;for(const l in this.originalStyle){const o=this.originalStyle[l];typeof o=="string"&&(t.dom.style[l]=o)}this.originalStyle={},this.placeholder&&(this.placeholder.remove(),this.placeholder=void 0)}preventDismissOnEvent(_){const t=this.getElements();return!!(_.type==="focus"&&(t!=null&&t.target.dom.contains(_.target)))}}e.CalloutCollisionTransform=n},"./src/components/UICallout/UICallout.tsx"(u,e,s){"use strict";var c=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(e,"__esModule",{value:!0}),e.UICallout=e.getCalloutStyle=e.UICalloutContentPadding=e.CALLOUT_STYLES=void 0;const n=c(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),_=s("./src/utilities/index.ts");s("./src/styles/_shadows.scss"),e.CALLOUT_STYLES={background:"var(--vscode-editorWidget-background)",boxShadow:"var(--ui-box-shadow-small)",borderColor:"var(--vscode-editorWidget-border)",text:"var(--vscode-editorWidget-foreground)",borderRadius:4};var t;(function(r){r.None="None",r.Standard="Standard"})(t||(e.UICalloutContentPadding=t={}));const l=new Map([[t.Standard,8]]),o=(r,i)=>typeof r=="object"&&typeof r[i]=="object"?r[i]:{},p=r=>{var i,m;return{root:b({boxShadow:e.CALLOUT_STYLES.boxShadow,backgroundColor:e.CALLOUT_STYLES.background,borderRadius:e.CALLOUT_STYLES.borderRadius,border:`1px solid ${e.CALLOUT_STYLES.borderColor}`},o(r.styles,"root")),beak:b({backgroundColor:e.CALLOUT_STYLES.background,boxShadow:e.CALLOUT_STYLES.boxShadow},o(r.styles,"beak")),beakCurtain:b({backgroundColor:e.CALLOUT_STYLES.background,borderRadius:e.CALLOUT_STYLES.borderRadius},o(r.styles,"beakCurtain")),calloutMain:b({backgroundColor:"transparent",color:e.CALLOUT_STYLES.text,borderRadius:e.CALLOUT_STYLES.borderRadius,minWidth:(i=r.calloutMinWidth)!=null?i:300,boxSizing:"border-box",padding:l.get((m=r.contentPadding)!=null?m:t.None)},o(r.styles,"calloutMain")),container:o(r.styles,"container")}};e.getCalloutStyle=p;class y extends n.default.Component{constructor(i){super(i),this.onKeyDown=this.onKeyDown.bind(this)}onKeyDown(i){const{onKeyDown:m,focusTargetSiblingOnTabPress:f,target:a}=this.props;if(f&&i.key==="Tab"&&a){let T=null;if(typeof a=="string"){const h=(0,d.getDocument)();T=h==null?void 0:h.querySelector(a)}else"getBoundingClientRect"in a&&(0,_.isHTMLElement)(a)&&(T=a);T&&(0,_.focusToSibling)(T,!i.shiftKey)&&(i.stopPropagation(),i.preventDefault())}m==null||m(i)}render(){return n.default.createElement(d.Callout,w(b({},this.props),{onKeyDown:this.onKeyDown,styles:(0,e.getCalloutStyle)(this.props)}),this.props.children)}}e.UICallout=y},"./src/components/UICallout/index.tsx"(u,e,s){"use strict";var c=this&&this.__createBinding||(Object.create?(function(d,_,t,l){l===void 0&&(l=t);var o=Object.getOwnPropertyDescriptor(_,t);(!o||("get"in o?!_.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return _[t]}}),Object.defineProperty(d,l,o)}):(function(d,_,t,l){l===void 0&&(l=t),d[l]=_[t]})),n=this&&this.__exportStar||function(d,_){for(var t in d)t!=="default"&&!Object.prototype.hasOwnProperty.call(_,t)&&c(_,d,t)};Object.defineProperty(e,"__esModule",{value:!0}),n(s("./src/components/UICallout/CalloutCollisionTransform.ts"),e),n(s("./src/components/UICallout/UICallout.tsx"),e)},"./src/components/UITooltip/UITooltip.tsx"(u,e,s){"use strict";var c=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(e,"__esModule",{value:!0}),e.UITooltip=e.UITooltipDelay=void 0;const n=c(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js");Object.defineProperty(e,"UITooltipDelay",{enumerable:!0,get:function(){return d.TooltipDelay}});const _=s("./src/components/UICallout/index.tsx");class t extends n.default.Component{constructor(o){super(o)}render(){var m;const o=(m=this.props.maxWidth)!=null?m:200,p=()=>b({root:{display:"inline-block"},content:{backgroundColor:_.CALLOUT_STYLES.background,color:_.CALLOUT_STYLES.text}},this.props.styles),r={beakWidth:10,styles:()=>(0,_.getCalloutStyle)({calloutMinWidth:0,styles:{root:{display:"inline-block"},calloutMain:{padding:10,maxWidth:o}}})},i=n.default.createElement(d.TooltipHost,w(b({},this.props),{styles:p,calloutProps:b(b({},r),this.props.calloutProps)}));return this.props.showOnFocus?i:n.default.createElement("div",{onFocusCapture:f=>{var a;(a=f.target.parentElement)!=null&&a.classList.contains("ms-TooltipHost")&&f.stopPropagation()}},i)}}e.UITooltip=t},"./src/components/UITooltip/UITooltipUtils.tsx"(u,e,s){"use strict";var c=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(e,"__esModule",{value:!0}),e.UITooltipUtils=void 0;const n=c(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=c(s("../../node_modules/.pnpm/sanitize-html@2.17.1/node_modules/sanitize-html/index.js")),_=s("./src/components/UICallout/index.tsx");class t{static getStyles(){return{root:{},content:{background:_.CALLOUT_STYLES.background,color:_.CALLOUT_STYLES.text},subText:{}}}static renderContent(o){return{onRenderContent:()=>n.default.createElement("span",null,o!=null?o:""),styles:t.getStyles()}}static renderHTMLContent(o){const p=(0,d.default)(o);return{onRenderContent:()=>n.default.createElement("span",{dangerouslySetInnerHTML:{__html:p}}),styles:t.getStyles()}}}e.UITooltipUtils=t},"./src/components/UITooltip/index.tsx"(u,e,s){"use strict";var c=this&&this.__createBinding||(Object.create?(function(d,_,t,l){l===void 0&&(l=t);var o=Object.getOwnPropertyDescriptor(_,t);(!o||("get"in o?!_.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return _[t]}}),Object.defineProperty(d,l,o)}):(function(d,_,t,l){l===void 0&&(l=t),d[l]=_[t]})),n=this&&this.__exportStar||function(d,_){for(var t in d)t!=="default"&&!Object.prototype.hasOwnProperty.call(_,t)&&c(_,d,t)};Object.defineProperty(e,"__esModule",{value:!0}),n(s("./src/components/UITooltip/UITooltip.tsx"),e),n(s("./src/components/UITooltip/UITooltipUtils.tsx"),e)},"./stories/UITooltip.story.tsx"(u,e,s){"use strict";var c=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(e,"__esModule",{value:!0}),e.Tooltips=void 0;const n=c(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=s("./src/components/UITooltip/index.tsx"),_=s("./src/components/UIButton/index.tsx");e.default={title:"Dropdowns/Tooltip"};const t={name:"Hello, world!",html:"<span><strong>Tag:</strong> name</span>"},l=()=>n.default.createElement(n.default.Fragment,null,n.default.createElement("div",{style:{margin:20}},n.default.createElement(d.UITooltip,{tooltipProps:d.UITooltipUtils.renderContent(t.name)},t.name)),n.default.createElement("div",{style:{margin:20}},n.default.createElement(d.UITooltip,{tooltipProps:d.UITooltipUtils.renderHTMLContent(t.html)},"render HTML content")),n.default.createElement("div",null,n.default.createElement(d.UITooltip,{content:"This is the tooltip"},n.default.createElement(_.UIDefaultButton,null,"Show tooltip on hover and ignore focus"))),n.default.createElement("div",null,n.default.createElement(d.UITooltip,{content:"This is the tooltip",showOnFocus:!0},n.default.createElement(_.UIDefaultButton,null,"Show tooltip on hover and on focus"))));e.Tooltips=l},"?cff7"(){},"?3dda"(){},"?880e"(){},"?c3d3"(){},"?7b66"(){}}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var V=Object.defineProperty,K=Object.defineProperties;var M=Object.getOwnPropertyDescriptors;var g=Object.getOwnPropertySymbols;var O=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var v=(i,n,e)=>n in i?V(i,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[n]=e,m=(i,n)=>{for(var e in n||(n={}))O.call(n,e)&&v(i,e,n[e]);if(g)for(var e of g(n))z.call(n,e)&&v(i,e,n[e]);return i},B=(i,n)=>K(i,M(n));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[530],{"./stories/UITranslationInput.story.tsx"(i,n,e){var S=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(n,"__esModule",{value:!0}),n.translationInput=void 0;const t=S(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),T=e("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),f=e("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),d=e("./src/components/UITranslationInput/index.tsx"),D=e("./src/components/Icons.tsx"),U=e("./src/components/UITable/index.tsx"),C=e("./src/components/UIButton/index.tsx"),p=e("./src/components/UICheckbox/index.tsx");n.default={title:"Basic Inputs/Input"};const h={childrenGap:60},I="ui-components-i18n-bundle",_=()=>{let s={};try{s=JSON.parse(window.localStorage.getItem(I)||"")}catch(r){s={}}return s},b=s=>{window.localStorage.setItem(I,JSON.stringify(s))},w=()=>{const[s,r]=t.default.useState("Content"),[y,k]=t.default.useState(!1),[c,u]=t.default.useState(!1),[a,x]=t.default.useState(_()),P=(l,o)=>{r(o||"")},j=l=>{a[l.key.value]||(a[l.key.value]=[B(m({},l),{dummyPath:"dddd"})],b(a),x(m({},a)))},W=l=>{const o=document.querySelector(`div[data-i18n-key="${l.key.value}"]`);(o==null?void 0:o.parentElement).focus(),(0,T.setFocusVisibility)(!0,o==null?void 0:o.parentElement)},F=l=>{a[l]&&(delete a[l],b(a),x(m({},a)))},E=[];for(const l in a){const o=a[l];for(const R of o)E.push({key:l,value:R.value.value})}return t.default.createElement(f.Stack,{tokens:h,style:{width:"100%",height:"100%"}},t.default.createElement(f.Stack,{horizontal:!0,tokens:h},t.default.createElement(p.UICheckbox,{label:"Disabled",checked:y,onChange:(l,o)=>{k(o)}}),t.default.createElement(p.UICheckbox,{label:"Busy",checked:c,onChange:(l,o)=>{u(o)}})),t.default.createElement(f.Stack,{style:{width:"300px"}},t.default.createElement(d.UITranslationInput,{entries:a,id:"test",i18nPrefix:"i18n",allowedI18nPrefixes:["i18n","@i18n"],allowedPatterns:[d.TranslationTextPattern.SingleBracketBinding,d.TranslationTextPattern.DoubleBracketReplace],defaultPattern:d.TranslationTextPattern.SingleBracketBinding,value:s,onChange:P,onCreateNewEntry:j,onShowExistingEntry:W,disabled:y,busy:c?{busy:c,useMinWaitingTime:!0}:void 0})," "),t.default.createElement(N,{tableData:E,onDelete:F}))};n.translationInput=w;function N(s){const r=Array.from({length:3}).map((k,c)=>{const u={key:"test"+(c+1),name:"",fieldName:"",minWidth:100,maxWidth:300};return c===0?(u.name="Key",u.fieldName="key",u.onRender=a=>t.default.createElement("div",{"data-i18n-key":a.key},a.key)):c===1?(u.name="Value",u.fieldName="value"):c===2&&(u.name="Delete",u.minWidth=50,u.maxWidth=50,u.onRender=a=>t.default.createElement(C.UIIconButton,{onClick:()=>{s.onDelete(a.key)},iconProps:{iconName:D.UiIcons.TrashCan}})),u});return t.default.createElement(t.default.Fragment,null,t.default.createElement("style",null,".ms-Fabric--isFocusVisible .ms-DetailsList .ms-DetailsRow-cell:focus::after { z-index: -1; }"),t.default.createElement("div",{style:{position:"relative",height:"100%"}},t.default.createElement(U.UITable,{dataSetKey:"datasetkey",items:s.tableData,columns:r})))}}}]);})();
|