@sap-ux/ui-components 1.21.3 → 1.22.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/Icons.d.ts +2 -0
- package/dist/components/Icons.d.ts.map +1 -1
- package/dist/components/Icons.js +9 -1
- package/dist/components/Icons.js.map +1 -1
- package/dist/components/UISection/UISections.d.ts +27 -0
- package/dist/components/UISection/UISections.d.ts.map +1 -1
- package/dist/components/UISection/UISections.js +92 -18
- package/dist/components/UISection/UISections.js.map +1 -1
- package/dist/components/UIToggle/UIToggle.d.ts +23 -0
- package/dist/components/UIToggle/UIToggle.d.ts.map +1 -1
- package/dist/components/UIToggle/UIToggle.js +147 -25
- package/dist/components/UIToggle/UIToggle.js.map +1 -1
- package/package.json +1 -1
- package/storybook/366.27cacbe0.iframe.bundle.js +1 -0
- package/storybook/UIContextualMenu-story.2b58f43e.iframe.bundle.js +2 -0
- package/storybook/UISections-story.7d6bc961.iframe.bundle.js +17 -0
- package/storybook/UIToggle-story.652dbdf4.iframe.bundle.js +2 -0
- package/storybook/iframe.html +2 -2
- package/storybook/index.json +1 -1
- package/storybook/main.581b6247.iframe.bundle.js +1 -0
- package/storybook/project.json +1 -1
- package/storybook/{runtime~main.11287822.iframe.bundle.js → runtime~main.0554ec73.iframe.bundle.js} +1 -1
- package/storybook/366.bcdd4ae6.iframe.bundle.js +0 -1
- package/storybook/UIContextualMenu-story.02280149.iframe.bundle.js +0 -2
- package/storybook/UISections-story.6dee6237.iframe.bundle.js +0 -17
- package/storybook/UIToggle-story.4f7caeb2.iframe.bundle.js +0 -2
- package/storybook/main.35f2217a.iframe.bundle.js +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
(()=>{var M=Object.defineProperty,A=Object.defineProperties;var j=Object.getOwnPropertyDescriptors;var I=Object.getOwnPropertySymbols;var R=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable;var O=(v,l,o)=>l in v?M(v,l,{enumerable:!0,configurable:!0,writable:!0,value:o}):v[l]=o,E=(v,l)=>{for(var o in l||(l={}))R.call(l,o)&&O(v,o,l[o]);if(I)for(var o of I(l))U.call(l,o)&&O(v,o,l[o]);return v},z=(v,l)=>A(v,j(l));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[366],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISection.scss":(v,l,o)=>{var b=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),u=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),m=u(b);m.push([v.id,"@keyframes delayedFadeOut{0%{opacity:1}99%{opacity:0;visibility:visible}100%{visibility:hidden}}.section{display:flex;flex-direction:column;overflow:hidden}.section__header>div{flex:0 1 auto;background:var(--vscode-sideBarSectionHeader-background);min-height:40px;display:flex;align-items:center;padding:0 1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--vscode-sideBarTitle-foreground)}.section__header__title{width:100%;overflow:hidden;text-overflow:ellipsis}.section__header__title.ui-medium-header{line-height:normal}.section__body{margin:1rem .75rem;flex:1 1 auto;padding:0 .25rem;height:100%}.section__body>.ui-loader-blocker:before{z-index:1}.section--clean .section__body{margin:0;padding:0}.section--scrollable .section__body{overflow:auto}.section--extended .section__header{background-color:var(--vscode-sideBar-background)}.section__collapse{position:absolute;top:0;left:0;width:13px}.section--hidden{animation:.5s delayedFadeOut;animation-fill-mode:forwards}",""]),v.exports=m},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISections.scss":(v,l,o)=>{var b=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),u=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),m=u(b);m.push([v.id,".sections{position:relative;overflow:hidden}.sections--horizontal{height:100%}.sections--horizontal .sections__item{height:100%}.sections--vertical{width:100%}.sections--vertical .sections__item{width:100%}.sections .sections__item{position:absolute}.sections--animated .sections__item{transition:all 300ms ease 0s}.sections--animated.sections--horizontal .sections__item{transition-property:transform,left,right}.sections--animated.sections--vertical .sections__item{transition-property:transform,top,bottom}.sections.sections--horizontal .sections__item--toggle.sections__item--hidden{transform:translateX(100%)}.sections.sections--horizontal .sections__item--toggle{max-width:calc(100% - 24px)}.sections.sections--horizontal>.sections__item:first-child{padding-right:7px}.sections.sections--vertical .sections__item--toggle.sections__item--hidden{transform:translateY(100%)}.sections.sections--vertical .sections__item--toggle{max-height:calc(100% - 24px)}",""]),v.exports=m},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISplitter.scss":(v,l,o)=>{var b=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),u=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),m=u(b);m.push([v.id,'@keyframes delayedFadeOut{0%{opacity:1}99%{opacity:0;visibility:visible}100%{visibility:hidden}}.splitter{background-color:var(--vscode-panelSection-border);position:absolute;outline:none}.splitter--horizontal{top:0;bottom:0;cursor:ew-resize}.splitter--horizontal:after{border-left:1px solid var(--vscode-contrastBorder);border-right:1px solid var(--vscode-contrastBorder)}.splitter--vertical{cursor:ns-resize;left:0;right:0}.splitter--vertical:after{border-top:1px solid var(--vscode-contrastBorder);border-bottom:1px solid var(--vscode-contrastBorder)}.splitter--compact{background:var(--vscode-editorWidget-border)}.splitter--compact.splitter--vertical .splitter__grip{height:3px}.splitter--compact.splitter--horizontal .splitter__grip{width:12px}.splitter--compact.splitter--horizontal .splitter__grip svg{transform-origin:5px 7px}.splitter--toggle{cursor:pointer}.splitter--toggle .splitter__grip{height:12px}.splitter--resize.splitter--horizontal{cursor:ew-resize}.splitter--resize.splitter--vertical{cursor:ns-resize}.splitter:after{content:"";top:0;left:0;right:0;bottom:0;position:absolute}.splitter__grip{position:absolute;height:16px;top:50%;transform:translateY(-50%);left:0;right:0}.splitter+.section .section__header__title,.splitter+.section .section__body{padding-left:7px}.splitter--toggle+.section .section__header__title,.splitter--toggle+.section .section__body{padding:0;margin:0}.splitter:hover{background-color:var(--vscode-focusBorder)}.splitter:hover .splitter__grip svg path{fill:var(--vscode-button-foreground)}.splitter--horizontal:hover:after{border-left:1px dashed var(--vscode-contrastActiveBorder);border-right:1px dashed var(--vscode-contrastActiveBorder)}.splitter--horizontal:focus:after{border-left:1px solid var(--vscode-focusBorder);border-right:1px solid var(--vscode-focusBorder)}.splitter--vertical:hover:after{border-top:1px dashed var(--vscode-contrastActiveBorder);border-bottom:1px dashed var(--vscode-contrastActiveBorder)}.splitter--vertical:focus:after{border-top:1px solid var(--vscode-focusBorder);border-bottom:1px solid var(--vscode-focusBorder)}.splitter--hidden{animation:.5s delayedFadeOut;animation-fill-mode:forwards}.splitter i.ts-icon{display:flex;height:100%}.splitter i.ts-icon svg{height:100%;width:100%}.splitter--toggle.splitter--horizontal .splitter__grip svg{transform:rotate(180deg)}.splitter--toggle.splitter--vertical .splitter__grip svg{transform:rotate(270deg)}.splitter--resize.splitter--standard.splitter--vertical .splitter__grip svg,.splitter--resize.splitter--compact.splitter--horizontal .splitter__grip svg{transform:rotate(90deg)}.splitter__overlay{position:absolute;z-index:1;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,0)}.splitter__overlay--horizontal{cursor:ew-resize}.splitter__overlay--vertical{cursor:ns-resize}.sections__item--hidden .splitter--toggle.splitter--horizontal .splitter__grip svg{transform:rotate(0) translateX(-1px)}.sections__item--hidden .splitter--toggle.splitter--vertical .splitter__grip svg{transform:rotate(90deg) translateX(-1px)}',""]),v.exports=m},"./src/components/UISection/UISection.scss":(v,l,o)=>{"use strict";o.r(l),o.d(l,{default:()=>y});var b=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),u=o.n(b),m=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),S=o.n(m),a=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),c=o.n(a),h=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),p=o.n(h),e=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),s=o.n(e),t=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),i=o.n(t),_=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISection.scss"),r=o.n(_),n={};for(const g in _)g!=="default"&&(n[g]=()=>_[g]);o.d(l,n);var d={};d.styleTagTransform=i(),d.setAttributes=p(),d.insert=c().bind(null,"head"),d.domAPI=S(),d.insertStyleElement=s();var f=u()(r(),d);const y=r()&&r().locals?r().locals:void 0},"./src/components/UISection/UISections.scss":(v,l,o)=>{"use strict";o.r(l),o.d(l,{default:()=>y});var b=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),u=o.n(b),m=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),S=o.n(m),a=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),c=o.n(a),h=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),p=o.n(h),e=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),s=o.n(e),t=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),i=o.n(t),_=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISections.scss"),r=o.n(_),n={};for(const g in _)g!=="default"&&(n[g]=()=>_[g]);o.d(l,n);var d={};d.styleTagTransform=i(),d.setAttributes=p(),d.insert=c().bind(null,"head"),d.domAPI=S(),d.insertStyleElement=s();var f=u()(r(),d);const y=r()&&r().locals?r().locals:void 0},"./src/components/UISection/UISplitter.scss":(v,l,o)=>{"use strict";o.r(l),o.d(l,{default:()=>y});var b=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),u=o.n(b),m=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),S=o.n(m),a=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),c=o.n(a),h=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),p=o.n(h),e=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),s=o.n(e),t=o("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),i=o.n(t),_=o("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UISection/UISplitter.scss"),r=o.n(_),n={};for(const g in _)g!=="default"&&(n[g]=()=>_[g]);o.d(l,n);var d={};d.styleTagTransform=i(),d.setAttributes=p(),d.insert=c().bind(null,"head"),d.domAPI=S(),d.insertStyleElement=s();var f=u()(r(),d);const y=r()&&r().locals?r().locals:void 0},"./src/components/UISection/UISection.tsx":function(v,l,o){"use strict";var b=this&&this.__importDefault||function(c){return c&&c.__esModule?c:{default:c}};Object.defineProperty(l,"__esModule",{value:!0}),l.UISection=l.UISectionLayout=void 0;const u=b(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),m=o("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js");o("./src/components/UISection/UISection.scss");var S;(function(c){c.Standard="standard",c.Extended="extended"})(S||(l.UISectionLayout=S={}));class a extends u.default.Component{onScroll(){this.props.onScroll&&this.props.onScroll()}render(){var t;const h=this.props.scrollable===void 0||this.props.scrollable,p={},e=(t=this.props.layout)!=null?t:S.Standard;"height"in this.props&&(p.height=this.props.height);const s=(0,m.getNativeProps)(this.props,m.divProperties,["onScroll","className","children"]);return u.default.createElement("div",z(E({},s),{className:`section${this.props.className?" "+this.props.className:""} section--${e}${h?" section--scrollable":""}${this.props.cleanPadding?" section--clean":""}${this.props.hidden?" section--hidden":""}`,style:p,ref:this.props.rootRef}),this.props.title&&u.default.createElement("div",{className:"section__header"},u.default.createElement("div",null,u.default.createElement("span",{className:"section__header__title ui-medium-header"},this.props.title))),u.default.createElement("div",{className:"section__body",onScroll:this.onScroll.bind(this)},this.props.children))}}l.UISection=a},"./src/components/UISection/UISections.tsx":function(v,l,o){"use strict";var b=this&&this.__importDefault||function(p){return p&&p.__esModule?p:{default:p}};Object.defineProperty(l,"__esModule",{value:!0}),l.UISections=l.ANIMATION_TIME=void 0;const u=b(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),m=o("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),S=o("./src/components/UISection/UISection.tsx"),a=o("./src/components/UISection/UISplitter.tsx");o("./src/components/UISection/UISections.scss"),l.ANIMATION_TIME=300;const c="sections--animated";class h extends u.default.Component{constructor(e){super(e),this.resizeSections=[],this.isFullScreen=!1,this.rootSize=0,this.ignoreAnimation=!1,this.state={sizes:void 0},this.onWindowResize=this.onWindowResize.bind(this),this.rootRef=u.default.createRef(),this.sizeProperty=e.vertical?"height":"width",this.domSizeProperty=e.vertical?"clientHeight":"clientWidth",this.startPositionProperty=e.vertical?"top":"left",this.endPositionProperty=e.vertical?"bottom":"right",this.sizeProperty=e.vertical?"height":"width",window.addEventListener("resize",this.onWindowResize)}updateStateSizes(e,s){let t=s;const i=this.getDynamicSectionIndex();let _=0;if(s.forEach((n,d)=>{var f;if(typeof n=="object"&&n.size===void 0){const y=this.getSectionPosition(n);n.size=Math.abs(this.rootSize-y.end-y.start)}d!==i&&(_+=(f=typeof n=="object"?n.size:n)!=null?f:0)}),_=e-_,typeof s[0]!="object"){t=[];let n=0;s.forEach((d,f)=>{d=i!==f?d:_,t.push({percentage:!1,size:d,start:n}),n+=d||0})}const r=t[i];return r&&(r.size=_),this.recalculatePositions(t),this.validateStateMinSizes(t),t}componentDidMount(){const{sizesAsPercents:e,sizes:s}=this.props;this.rootSize=this.getRootSize(),!e&&s&&this.setState({sizes:this.updateStateSizes(this.rootSize,s)})}componentDidUpdate(){this.ignoreAnimation=!1}static getDerivedStateFromProps(e,s){var r,n;let t=s.animate,i,_=0;if(Array.isArray(e.animation)){i=h.getVisibleSections(e.children);let d;for(let f=0;f<e.animation.length;f++)(i==null?void 0:i.includes(f))!==((r=s.visibleSections)==null?void 0:r.includes(f))&&(d=d||e.animation[f]);d!==void 0&&(t=d)}else t=e.animation;return(n=e.sizes)==null||n.forEach((d,f)=>{d===void 0&&(_=f)}),{animate:t,visibleSections:i,dynamicSection:_}}validateStateMinSizes(e){var n,d,f;let s=0,t=!1;const i=[];for(let y=0;y<this.props.children.length;y++){const g=(n=e[y].size)!=null?n:0,P=this.getMinSectionSize(y);P>g&&(t=!0),s+=P,i.push({size:g,minSize:P,spareSize:g-P})}const _=this.getRootSize();if(t&&_>=s){const y=this.calculateSectionSizes(i);for(let g=0;g<e.length;g++)e[g]=y[g]}const r=_<s;r!==this.isFullScreen&&(this.isFullScreen=r,(f=(d=this.props).onToggleFullscreen)==null||f.call(d,r))}onWindowResize(){let{sizes:e}=this.state;const s=this.getRootSize();if(e){e=this.updateStateSizes(s,e);for(let t=0;t<e.length;t++)this.resizeSections[t]&&(this.resizeSections[t].section=e[t]);this.ignoreAnimation=!0,this.setState({sizes:e})}this.rootSize=s}static getVisibleSections(e){const s=[];return e.forEach((t,i)=>{h.isSectionVisible(t)||s.push(i)}),s}static isSectionVisible(e){return e&&e.type===S.UISection?!e.props.hidden:!1}onSplitterResizeStart(){const e=this.rootRef.current,s=[];if(e!=null&&e.childNodes){e.classList.remove(c);for(let t=0;t<e.childNodes.length;t++){const i=this.getMinSectionSize(t),_=this.getMinSectionSize(t===0?1:0),r=e.children[t],n=Math.max(i,e[this.domSizeProperty]-_);s.push({size:r[this.domSizeProperty],dom:r,maxSize:n,section:this.resizeSections[t]?this.resizeSections[t].section:{percentage:!1}})}}this.resizeSections=s}onSplitterResize(e){const s=e!==0?this.resizeSections:[];let t=0;for(let i=0;i<s.length;i++){const _=this.getMinSectionSize(i),r=s[i];let n=r.size+(i===0?e:-e);if(_===r.maxSize)continue;n<_?(e=this.correctBoundaryPosition(e,_,n,i===0),n=_):n>r.maxSize&&(e=this.correctBoundaryPosition(e,r.maxSize,n,i===0),n=r.maxSize);const d={percentage:!1},f=s[i+1],y=f?f.size-e:0;i>0?(d.size=n,d.start=t,r.dom.style[this.startPositionProperty]=t+"px"):(d.start=0,r.dom.style[this.startPositionProperty]="0px"),d.end=y,r.dom.style[this.endPositionProperty]=y+"px",r.section=d,t+=n}return!1}correctBoundaryPosition(e,s,t,i){const _=s-t;return e+(i?_:-_)}onSplitterResizeEnd(){var t,i;const e=this.rootRef.current;e&&this.isAnimationEnabled()&&e.classList.add(c);const s=this.resizeSections.map(_=>_.section);s.some(_=>_.end!==void 0||_.start!==void 0||_.size!==void 0)&&this.setState({sizes:s}),(i=(t=this.props).onResize)==null||i.call(t,s)}onSplitterToggle(){this.props.onClose&&this.props.onClose()}getVisibleChildrenCount(){return this.props.children.filter(e=>e&&h.isSectionVisible(e)).length}getSizePercents(e,s,t=!1){const{sizes:i=[],sizesAsPercents:_}=this.props;let r=i[e];if(r===void 0&&e===this.state.dynamicSection){let n=100;i.every(d=>{d&&(n-=d)}),r=n}return r&&_?t?100-r:r:s>0?100/s:0}getSectionSize(e,s){if(this.props.sizesAsPercents||!this.props.sizes||s<2||e>=this.props.sizes.length&&e>=s)return;const t={[this.sizeProperty]:this.props.sizes[e]?this.props.sizes[e]+"px":this.props.sizes[e]};return e===0&&(t[this.startPositionProperty]=0),e===this.props.sizes.length-1?t[this.endPositionProperty]=0:this.props.sizes[e+1]&&(t[this.endPositionProperty]=this.props.sizes[e+1]+"px"),t}getPositionStyleValue(e,s){return e===1?"0%":s}getVisibleSectionStyle(e){var _;const s={visible:!0,style:{}},t=this.getVisibleChildrenCount(),i=(_=this.state.sizes)==null?void 0:_[e];if(t===this.props.children.length&&i)s.style=E(E({},i.start!==void 0&&{[this.startPositionProperty]:i.start+"px"}),i.end!==void 0&&{[this.endPositionProperty]:i.end+"px"}),i.size!==void 0&&(i.start===void 0||i.end===void 0)&&(s.style[this.sizeProperty]=i.size+"px");else{const r=this.getSectionSize(e,t);if(r)s.style=E(E({},s.style),r);else{const n=this.getSizePercents(e,t,!0);s.style={[this.startPositionProperty]:this.getPositionStyleValue(t,`${e*n}%`),[this.endPositionProperty]:this.getPositionStyleValue(t,`${(t-(e+1))*n}%`)}}}return s}getHiddenSectionStyle(e){var n,d;const s={visible:!1};let t=(n=this.state.sizes)==null?void 0:n[e];!t&&this.props.splitterType===a.UISplitterType.Toggle&&((d=this.props.sizes)!=null&&d[e])&&(t={size:this.props.sizes[e],percentage:!1});let i,_=0;if(t)i="px",t.size?_=t.size:(t==null?void 0:t.start)!==void 0&&(t==null?void 0:t.end)!==void 0&&(_=this.getRootSize()-t.end-t.start);else{const f=this.props.children.length,y=this.getSectionSize(e,f);y&&y.width?(_=parseFloat(y.width.toString()),i="px"):(_=this.getSizePercents(e,f),i="%")}const r=-_+i;return s.style={[this.endPositionProperty]:e===0?"100%":r,[this.startPositionProperty]:e===0?r:"100%"},s}getMinSectionSize(e){const s=this.props.minSectionSize;let t=0;return s&&(t=Array.isArray(s)?s[e]:s),t}getClassNames(e){let s=` ${this.props.vertical?"sections--vertical":"sections--horizontal"}`;const t=` ${c}`;return s+=`${this.isAnimationEnabled()?t:""}`,s+=`${e?" sections--full":""}`,s}getSection(e,s){const t=this.props.children[e],i=h.isSectionVisible(t)?this.getVisibleSectionStyle(e):this.getHiddenSectionStyle(e);if(!i)return;const{splitter:_,vertical:r,splitterTitle:n,splitterType:d=a.UISplitterType.Resize,splitterTabIndex:f,splitterLayoutType:y=a.UISplitterLayoutType.Standard}=this.props;let g=_&&e>0;const P=this.getVisibleChildrenCount()===1;return P&&!this.isAnimationEnabled()&&(g=!1),u.default.createElement("div",{key:e,className:`sections__item${g?" sections__item--"+d:""}${i.visible?"":" sections__item--hidden"}`,style:i.style},g&&t&&u.default.createElement(a.UISplitter,{vertical:r,onResize:this.onSplitterResize.bind(this),onResizeStart:this.onSplitterResizeStart.bind(this),onResizeEnd:this.onSplitterResizeEnd.bind(this),onToggle:this.onSplitterToggle.bind(this),hidden:s||P,type:d,splitterTabIndex:f,title:n,splitterLayoutType:y}),t)}isAnimationEnabled(){return!this.ignoreAnimation&&(this.props.animation===!0||this.state.animate)}getDynamicSectionIndex(){return this.state.dynamicSection!==void 0?this.state.dynamicSection:0}getSectionPosition(e){var s,t;return{start:(s=e.start)!=null?s:0,end:(t=e.end)!=null?t:0}}getSpareSize(e,s){let t=0,i=e.minSize-e.size;for(const _ of s)if(_!==e){if(_.spareSize>0){const r=Math.min(_.spareSize,i);t+=r,_.spareSize-=r,_.size-=r,i-=r}if(i<=0)break}return t}calculateSectionSizes(e){for(const t of e)if(t.size<t.minSize){const i=this.getSpareSize(t,e);i&&(t.size+=i)}const s=[];for(let t=0;t<e.length;t++){const i={percentage:!1},_=e[t],r=e[t+1],n=r?r.size:0;t>0?(i.size=_.size,i.start=void 0):i.start=0,i.end=n,s.push(i)}return s}recalculatePositions(e){var i;let s=0;e.forEach(_=>{var r;_.start=s,s+=(r=_.size)!=null?r:0});let t=0;for(let _=e.length-1;_>=0;_--)e[_].end=t,t+=(i=e[_].size)!=null?i:0}getRootSize(){var s;const e=this.rootRef.current;return(s=e==null?void 0:e.getBoundingClientRect()[this.sizeProperty])!=null?s:0}render(){const e=(0,m.getNativeProps)(this.props,m.divProperties,["className","children"]),s=[];let t=0;for(let i=0;i<this.props.children.length;i++){const _=this.props.children[i],r=!h.isSectionVisible(_);r||t++;const n=this.getSection(i,r);n&&s.push(n)}return u.default.createElement("div",z(E({},e),{ref:this.rootRef,className:`sections ${this.getClassNames(t===1)}`,style:E({},this.props.height&&{height:this.props.height})}),s)}}l.UISections=h,h.Section=S.UISection},"./src/components/UISection/UISplitter.tsx":function(v,l,o){"use strict";var b=this&&this.__importDefault||function(p){return p&&p.__esModule?p:{default:p}};Object.defineProperty(l,"__esModule",{value:!0}),l.UISplitter=l.UISplitterLayoutType=l.UISplitterType=void 0;const u=b(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js"));o("./src/components/UISection/UISplitter.scss");const m=o("./src/components/Icons.tsx"),S=o("./src/components/UIIcon/index.tsx");var a;(function(p){p.Resize="resize",p.Toggle="toggle"})(a||(l.UISplitterType=a={}));var c;(function(p){p.Standard="standard",p.Compact="compact"})(c||(l.UISplitterLayoutType=c={}));class h extends u.default.Component{constructor(e){super(e),this.mousedownPosition={x:0,y:0},this.size=14,this.compactSize=8,this.rootRef=u.default.createRef(),this.stopMousemoveResize=this.stopMousemoveResize.bind(this),this.doMousemoveResize=this.doMousemoveResize.bind(this),this.splitterOverlay=document.createElement("div"),this.splitterOverlay.setAttribute("class",`splitter__overlay ${e.vertical?"splitter__overlay--vertical":"splitter__overlay--horizontal"}`)}startSplitterMove(e){this.mousedownPosition.x=e.clientX,this.mousedownPosition.y=e.clientY,this.updateSplitterEvents(!0),e.stopPropagation()}doMousemoveResize(e){const s=this.props.vertical?"clientY":"clientX",t=this.props.vertical?"y":"x",i=e[s]-this.mousedownPosition[t];this.doResize(i)}doResize(e){const s=this.props.vertical?"top":"left";this.animationFrame&&window.cancelAnimationFrame(this.animationFrame),this.animationFrame=window.requestAnimationFrame(()=>{if(this.props.onResize(e)){const t=this.rootRef.current;t&&(t.style[s]=`${e-this.size/2}px`)}})}stopMousemoveResize(){this.updateSplitterEvents(!1)}updateSplitterEvents(e){e?(document.body.addEventListener("mouseup",this.stopMousemoveResize),document.body.addEventListener("mouseleave",this.stopMousemoveResize),document.body.addEventListener("mousemove",this.doMousemoveResize),document.body.appendChild(this.splitterOverlay)):(document.body.removeEventListener("mouseup",this.stopMousemoveResize),document.body.removeEventListener("mouseleave",this.stopMousemoveResize),document.body.removeEventListener("mousemove",this.doMousemoveResize),document.body.removeChild(this.splitterOverlay)),e&&this.props.onResizeStart?this.props.onResizeStart():!e&&this.props.onResizeEnd&&this.props.onResizeEnd()}toggleSplitter(){this.props.onToggle&&this.props.onToggle()}getIcon(e,s=c.Standard){return e===a.Toggle?m.UiIcons.ArrowLeft:s===c.Compact?m.UiIcons.Grabber:m.UiIcons.VerticalGrip}onKeyDown(e){if(this.props.type===a.Resize){let t=0;if(["ArrowLeft","ArrowUp"].includes(e.key)?t=-10:["ArrowRight","ArrowDown"].includes(e.key)&&(t=10),t===0)return;this.props.onResizeStart&&this.props.onResizeStart(),this.doResize(t),this.props.onResizeEnd&&this.props.onResizeEnd()}else this.props.type===a.Toggle&&e.key==="Enter"&&this.toggleSplitter()}getClassNames(){const{type:e,vertical:s,hidden:t,splitterLayoutType:i}=this.props;let _=`splitter splitter--${e}`;return _+=` ${s?"splitter--vertical":"splitter--horizontal"}`,t&&e===a.Resize&&(_+=" splitter--hidden"),_+=` ${i===c.Standard?"splitter--standard":"splitter--compact"}`,_}render(){var P;const{type:e,vertical:s,hidden:t,title:i,splitterLayoutType:_}=this.props,r=(P=this.props.splitterTabIndex)!=null?P:0,n=_===c.Standard?this.size:this.compactSize,d=e===a.Toggle?-n:-n/2,f=e===a.Toggle?"button":"separator",y=s?"horizontal":"vertical";let g;return e===a.Toggle&&(g=!t),u.default.createElement("div",{ref:this.rootRef,role:f,"aria-orientation":y,"aria-pressed":g,title:i,tabIndex:r,onKeyDown:this.onKeyDown.bind(this),style:E(E({},s&&{height:n,top:d}),!s&&{width:n,left:d}),onMouseDown:e===a.Resize?T=>this.startSplitterMove(T):void 0,onClick:e===a.Toggle?()=>this.toggleSplitter():void 0,className:this.getClassNames()},u.default.createElement("div",{className:"splitter__grip"},u.default.createElement(S.UIIcon,{iconName:this.getIcon(e,_)})))}}l.UISplitter=h},"./src/components/UISection/index.tsx":function(v,l,o){"use strict";var b=this&&this.__createBinding||(Object.create?function(m,S,a,c){c===void 0&&(c=a);var h=Object.getOwnPropertyDescriptor(S,a);(!h||("get"in h?!S.__esModule:h.writable||h.configurable))&&(h={enumerable:!0,get:function(){return S[a]}}),Object.defineProperty(m,c,h)}:function(m,S,a,c){c===void 0&&(c=a),m[c]=S[a]}),u=this&&this.__exportStar||function(m,S){for(var a in m)a!=="default"&&!Object.prototype.hasOwnProperty.call(S,a)&&b(S,m,a)};Object.defineProperty(l,"__esModule",{value:!0}),u(o("./src/components/UISection/UISections.tsx"),l),u(o("./src/components/UISection/UISection.tsx"),l),u(o("./src/components/UISection/UISplitter.tsx"),l)},"./src/components/UIToggle/UIToggle.tsx":function(v,l,o){"use strict";var b=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(l,"__esModule",{value:!0}),l.UIToggle=l.UIToggleSize=void 0;const u=b(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),m=o("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),S=o("./src/helper/ValidationMessage/index.tsx");var a;(function(s){s.Standard="Standard",s.Small="Small"})(a||(l.UIToggleSize=a={}));const c=new Map([[a.Small,{width:30,height:14,padding:"0 2px",margin:"0",label:{fontSize:13,padding:"2px 0"},circle:{width:10,height:10,borderWidth:5}}]]),h=.4,p={pill:{borderColor:"var(--vscode-contrastBorder, transparent)",unchecked:{background:"var(--vscode-titleBar-inactiveForeground)",hover:{background:"var(--vscode-editorHint-foreground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},checked:{background:"var(--vscode-button-background)",hover:{background:"var(--vscode-button-hoverBackground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},focus:{outline:"1px solid var(--vscode-focusBorder) !important"}},thumb:{background:"var(--vscode-button-foreground)"}};class e extends u.default.Component{constructor(t){super(t)}getMarginBottom(t){const{inlineLabel:i}=this.props;if(t)return i?0:4}render(){const{inlineLabelLeft:t,labelFlexGrow:i,size:_,inlineLabel:r}=this.props,n=c.get(_!=null?_:a.Standard),d=(0,S.getMessageInfo)(this.props),f=g=>({root:z(E({},i&&{flexGrow:1}),{margin:n==null?void 0:n.margin,marginBottom:this.getMarginBottom(d.message)}),label:z(E(E(E({color:"var(--vscode-foreground)",fontWeight:"normal",fontSize:n==null?void 0:n.label.fontSize,padding:n==null?void 0:n.label.padding},r&&{marginLeft:10}),t&&{order:0,marginLeft:0,marginRight:10}),i&&{flexGrow:1}),{opacity:this.props.disabled?h:"inherit"}),pill:z(E({height:n==null?void 0:n.height,width:n==null?void 0:n.width,padding:n==null?void 0:n.padding,background:p.pill.checked.background,borderColor:p.pill.borderColor,borderStyle:"solid",":hover":{background:p.pill.checked.hover.background,borderColor:p.pill.checked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:p.thumb.background},":disabled":{background:p.pill.checked.background,borderColor:p.pill.borderColor,opacity:h}},!g.checked&&{background:p.pill.unchecked.background,borderStyle:"dashed",":hover":{background:p.pill.unchecked.hover.background,borderColor:p.pill.unchecked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:p.thumb.background},":disabled":{background:p.pill.unchecked.background,borderColor:p.pill.borderColor,opacity:h}}),{selectors:{":focus::after":{border:"none !important",outline:p.pill.focus.outline}}}),thumb:{height:n==null?void 0:n.circle.height,width:n==null?void 0:n.circle.width,borderWidth:n==null?void 0:n.circle.borderWidth,background:p.thumb.background,":hover":{backgroundColor:p.thumb.background}}}),y=u.default.createElement(m.Toggle,z(E({},this.props),{styles:f}));return d.message?u.default.createElement(S.MessageWrapper,{message:d},y):y}}l.UIToggle=e},"./src/components/UIToggle/index.tsx":function(v,l,o){"use strict";var b=this&&this.__createBinding||(Object.create?function(m,S,a,c){c===void 0&&(c=a);var h=Object.getOwnPropertyDescriptor(S,a);(!h||("get"in h?!S.__esModule:h.writable||h.configurable))&&(h={enumerable:!0,get:function(){return S[a]}}),Object.defineProperty(m,c,h)}:function(m,S,a,c){c===void 0&&(c=a),m[c]=S[a]}),u=this&&this.__exportStar||function(m,S){for(var a in m)a!=="default"&&!Object.prototype.hasOwnProperty.call(S,a)&&b(S,m,a)};Object.defineProperty(l,"__esModule",{value:!0}),u(o("./src/components/UIToggle/UIToggle.tsx"),l)}}]);})();
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
(()=>{var B=Object.defineProperty,D=Object.defineProperties;var A=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable;var U=(s,u,o)=>u in s?B(s,u,{enumerable:!0,configurable:!0,writable:!0,value:o}):s[u]=o,y=(s,u)=>{for(var o in u||(u={}))L.call(u,o)&&U(s,o,u[o]);if(w)for(var o of w(u))P.call(u,o)&&U(s,o,u[o]);return s},C=(s,u)=>D(s,A(u));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[289],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js":s=>{"use strict";s.exports=function(u){var o=[];return o.toString=function(){return this.map(function(e){var t="",n=typeof e[5]!="undefined";return e[4]&&(t+="@supports (".concat(e[4],") {")),e[2]&&(t+="@media ".concat(e[2]," {")),n&&(t+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),t+=u(e),n&&(t+="}"),e[2]&&(t+="}"),e[4]&&(t+="}"),t}).join("")},o.i=function(e,t,n,r,m){typeof e=="string"&&(e=[[null,e,void 0]]);var i={};if(n)for(var a=0;a<this.length;a++){var g=this[a][0];g!=null&&(i[g]=!0)}for(var h=0;h<e.length;h++){var l=[].concat(e[h]);n&&i[l[0]]||(typeof m!="undefined"&&(typeof l[5]=="undefined"||(l[1]="@layer".concat(l[5].length>0?" ".concat(l[5]):""," {").concat(l[1],"}")),l[5]=m),t&&(l[2]&&(l[1]="@media ".concat(l[2]," {").concat(l[1],"}")),l[2]=t),r&&(l[4]?(l[1]="@supports (".concat(l[4],") {").concat(l[1],"}"),l[4]=r):l[4]="".concat(r)),o.push(l))}},o}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js":s=>{"use strict";s.exports=function(u){return u[1]}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":s=>{"use strict";var u=[];function o(t){for(var n=-1,r=0;r<u.length;r++)if(u[r].identifier===t){n=r;break}return n}function c(t,n){for(var r={},m=[],i=0;i<t.length;i++){var a=t[i],g=n.base?a[0]+n.base:a[0],h=r[g]||0,l="".concat(g," ").concat(h);r[g]=h+1;var p=o(l),v={css:a[1],media:a[2],sourceMap:a[3],supports:a[4],layer:a[5]};if(p!==-1)u[p].references++,u[p].updater(v);else{var f=e(v,n);n.byIndex=i,u.splice(i,0,{identifier:l,updater:f,references:1})}m.push(l)}return m}function e(t,n){var r=n.domAPI(n);r.update(t);var m=function(a){if(a){if(a.css===t.css&&a.media===t.media&&a.sourceMap===t.sourceMap&&a.supports===t.supports&&a.layer===t.layer)return;r.update(t=a)}else r.remove()};return m}s.exports=function(t,n){n=n||{},t=t||[];var r=c(t,n);return function(i){i=i||[];for(var a=0;a<r.length;a++){var g=r[a],h=o(g);u[h].references--}for(var l=c(i,n),p=0;p<r.length;p++){var v=r[p],f=o(v);u[f].references===0&&(u[f].updater(),u.splice(f,1))}r=l}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js":s=>{"use strict";var u={};function o(e){if(typeof u[e]=="undefined"){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(n){t=null}u[e]=t}return u[e]}function c(e,t){var n=o(e);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");n.appendChild(t)}s.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js":s=>{"use strict";function u(o){var c=document.createElement("style");return o.setAttributes(c,o.attributes),o.insert(c,o.options),c}s.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":(s,u,o)=>{"use strict";function c(e){var t=o.nc;t&&e.setAttribute("nonce",t)}s.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js":s=>{"use strict";function u(e,t,n){var r="";n.supports&&(r+="@supports (".concat(n.supports,") {")),n.media&&(r+="@media ".concat(n.media," {"));var m=typeof n.layer!="undefined";m&&(r+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),r+=n.css,m&&(r+="}"),n.media&&(r+="}"),n.supports&&(r+="}");var i=n.sourceMap;i&&typeof btoa!="undefined"&&(r+=`
|
|
2
|
-
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(i))))," */")),t.styleTagTransform(r,e,t.options)}function o(e){if(e.parentNode===null)return!1;e.parentNode.removeChild(e)}function c(e){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=e.insertStyleElement(e);return{update:function(r){u(t,e,r)},remove:function(){o(t)}}}s.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js":s=>{"use strict";function u(o,c){if(c.styleSheet)c.styleSheet.cssText=o;else{for(;c.firstChild;)c.removeChild(c.firstChild);c.appendChild(document.createTextNode(o))}}s.exports=u},"./src/components/UIToggle/UIToggle.tsx":function(s,u,o){"use strict";var c=this&&this.__importDefault||function(h){return h&&h.__esModule?h:{default:h}};Object.defineProperty(u,"__esModule",{value:!0}),u.UIToggle=u.UIToggleSize=void 0;const e=c(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=o("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),n=o("./src/helper/ValidationMessage/index.tsx");var r;(function(h){h.Standard="Standard",h.Small="Small"})(r||(u.UIToggleSize=r={}));const m=new Map([[r.Small,{width:30,height:14,padding:"0 2px",margin:"0",label:{fontSize:13,padding:"2px 0"},circle:{width:10,height:10,borderWidth:5}}]]),i=.4,a={pill:{borderColor:"var(--vscode-contrastBorder, transparent)",unchecked:{background:"var(--vscode-titleBar-inactiveForeground)",hover:{background:"var(--vscode-editorHint-foreground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},checked:{background:"var(--vscode-button-background)",hover:{background:"var(--vscode-button-hoverBackground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},focus:{outline:"1px solid var(--vscode-focusBorder) !important"}},thumb:{background:"var(--vscode-button-foreground)"}};class g extends e.default.Component{constructor(l){super(l)}getMarginBottom(l){const{inlineLabel:p}=this.props;if(l)return p?0:4}render(){const{inlineLabelLeft:l,labelFlexGrow:p,size:v,inlineLabel:f}=this.props,d=m.get(v!=null?v:r.Standard),x=(0,n.getMessageInfo)(this.props),b=k=>({root:C(y({},p&&{flexGrow:1}),{margin:d==null?void 0:d.margin,marginBottom:this.getMarginBottom(x.message)}),label:C(y(y(y({color:"var(--vscode-foreground)",fontWeight:"normal",fontSize:d==null?void 0:d.label.fontSize,padding:d==null?void 0:d.label.padding},f&&{marginLeft:10}),l&&{order:0,marginLeft:0,marginRight:10}),p&&{flexGrow:1}),{opacity:this.props.disabled?i:"inherit"}),pill:C(y({height:d==null?void 0:d.height,width:d==null?void 0:d.width,padding:d==null?void 0:d.padding,background:a.pill.checked.background,borderColor:a.pill.borderColor,borderStyle:"solid",":hover":{background:a.pill.checked.hover.background,borderColor:a.pill.checked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:a.thumb.background},":disabled":{background:a.pill.checked.background,borderColor:a.pill.borderColor,opacity:i}},!k.checked&&{background:a.pill.unchecked.background,borderStyle:"dashed",":hover":{background:a.pill.unchecked.hover.background,borderColor:a.pill.unchecked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:a.thumb.background},":disabled":{background:a.pill.unchecked.background,borderColor:a.pill.borderColor,opacity:i}}),{selectors:{":focus::after":{border:"none !important",outline:a.pill.focus.outline}}}),thumb:{height:d==null?void 0:d.circle.height,width:d==null?void 0:d.circle.width,borderWidth:d==null?void 0:d.circle.borderWidth,background:a.thumb.background,":hover":{backgroundColor:a.thumb.background}}}),S=e.default.createElement(t.Toggle,C(y({},this.props),{styles:b}));return x.message?e.default.createElement(n.MessageWrapper,{message:x},S):S}}u.UIToggle=g},"./src/components/UIToggle/index.tsx":function(s,u,o){"use strict";var c=this&&this.__createBinding||(Object.create?function(t,n,r,m){m===void 0&&(m=r);var i=Object.getOwnPropertyDescriptor(n,r);(!i||("get"in i?!n.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return n[r]}}),Object.defineProperty(t,m,i)}:function(t,n,r,m){m===void 0&&(m=r),t[m]=n[r]}),e=this&&this.__exportStar||function(t,n){for(var r in t)r!=="default"&&!Object.prototype.hasOwnProperty.call(n,r)&&c(n,t,r)};Object.defineProperty(u,"__esModule",{value:!0}),e(o("./src/components/UIToggle/UIToggle.tsx"),u)},"./stories/UIContextualMenu.story.tsx":function(s,u,o){"use strict";var c=this&&this.__importDefault||function(f){return f&&f.__esModule?f:{default:f}};Object.defineProperty(u,"__esModule",{value:!0}),u.ContextualMenu=void 0;const e=c(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=o("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),n=o("./src/components/UIContextualMenu/index.tsx"),r=o("./src/components/UIButton/index.tsx"),m=o("./src/components/UITreeDropdown/index.tsx"),i=o("./src/components/Icons.tsx"),a=o("./src/components/UIDropdown/index.tsx"),g=o("./src/components/UIToggle/index.tsx");u.default={title:"Dropdowns/ContextualMenu"};const h={childrenGap:40};function l(f=!1){return[{key:"item1",text:"Menu item 1",title:"Menu item 1",onClick:()=>console.log("New clicked")},{key:"item2",text:"Menu item 2",title:"Menu item 2",subMenuProps:C(y({},f&&{directionalHint:m.UIDirectionalHint.leftTopEdge}),{items:[{key:"submenuitem1",text:"Submenu item 1"},{key:"submenuitem2",text:"Submenu item 2",title:"Submenu item 2",subMenuProps:C(y({},f&&{directionalHint:m.UIDirectionalHint.leftTopEdge}),{items:[{key:"submenuitem21",text:"Submenu item 21",title:"Submenu item 21",canCheck:!0,checked:!0},{key:"submenuitem22",text:"Submenu item 22",title:"Submenu item 22",canCheck:!0}]})},{key:"submenuitem3",text:"Submenu item 3",title:"Submenu item 3"},{key:"submenuitem4",text:"Submenu item 1",title:"Submenu item 1"},{key:"submenuitem5",text:"Submenu item 2",title:"Submenu item 2"},{key:"submenuitem6",text:"Submenu item 3",title:"Submenu item 3"}]})}]}const p=[n.UIContextualMenuLayoutType.ContextualMenu,n.UIContextualMenuLayoutType.DropdownMenu].map(f=>({key:f.toString(),text:f.toString()})),v=()=>{const f=e.default.useRef(null),[d,x]=e.default.useState(n.UIContextualMenuLayoutType.ContextualMenu),[b,S]=e.default.useState(!0),[k,_]=e.default.useState(!1),T=e.default.useCallback(()=>{_(!0)},[]),I=e.default.useCallback(()=>_(!1),[]);return e.default.createElement(t.Stack,{tokens:h},e.default.createElement(a.UIDropdown,{label:"Layout",options:p,selectedKey:d.toString(),onChange:(E,M)=>{M&&x(n.UIContextualMenuLayoutType[M.key])}}),e.default.createElement(g.UIToggle,{checked:b,label:"showSubmenuBeneath",onChange:(E,M)=>{S(!!M)}}),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"Default UIContextualMenu rendering"),e.default.createElement("span",{ref:f,onClick:T},"Click for ContextualMenu"),e.default.createElement(n.UIContextualMenu,{hidden:!k,target:f,items:l(),onDismiss:I,layoutType:d,showSubmenuBeneath:b})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps of a UIButton elements"),e.default.createElement(t.Stack,{horizontal:!0,tokens:h},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIDefaultButton"),e.default.createElement(r.UIDefaultButton,{primary:!0,text:"Toggle Contextual menu",menuProps:{items:l(),layoutType:d,showSubmenuBeneath:b}})))),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps of a UIIconButton"),e.default.createElement(t.Stack,{horizontal:!0,tokens:h},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIIconButton"),e.default.createElement(r.UIIconButton,{iconProps:{iconName:i.UiIcons.Undo},menuProps:{items:l(),layoutType:d,showSubmenuBeneath:b}})))),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps with beak and showSubmenuBeneath - iconToLeft and open the menu towards left"),e.default.createElement(t.Stack,{horizontal:!0,tokens:h,horizontalAlign:"center"},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIIconButton"),e.default.createElement(r.UIIconButton,{iconProps:{iconName:i.UiIcons.ArrowLeft},menuProps:{items:l(!0),isBeakVisible:!0,iconToLeft:!0,layoutType:d,showSubmenuBeneath:b}})))))};u.ContextualMenu=v},"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/index.js":(s,u,o)=>{var c=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js"),e=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js"),t=e;t.v1=c,t.v4=e,s.exports=t},"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js":s=>{for(var u=[],o=0;o<256;++o)u[o]=(o+256).toString(16).substr(1);function c(e,t){var n=t||0,r=u;return[r[e[n++]],r[e[n++]],r[e[n++]],r[e[n++]],"-",r[e[n++]],r[e[n++]],"-",r[e[n++]],r[e[n++]],"-",r[e[n++]],r[e[n++]],"-",r[e[n++]],r[e[n++]],r[e[n++]],r[e[n++]],r[e[n++]],r[e[n++]]].join("")}s.exports=c},"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js":s=>{var u=typeof crypto!="undefined"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||typeof msCrypto!="undefined"&&typeof window.msCrypto.getRandomValues=="function"&&msCrypto.getRandomValues.bind(msCrypto);if(u){var o=new Uint8Array(16);s.exports=function(){return u(o),o}}else{var c=new Array(16);s.exports=function(){for(var t=0,n;t<16;t++)t&3||(n=Math.random()*4294967296),c[t]=n>>>((t&3)<<3)&255;return c}}},"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js":(s,u,o)=>{var c=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),e=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js"),t,n,r=0,m=0;function i(a,g,h){var l=g&&h||0,p=g||[];a=a||{};var v=a.node||t,f=a.clockseq!==void 0?a.clockseq:n;if(v==null||f==null){var d=c();v==null&&(v=t=[d[0]|1,d[1],d[2],d[3],d[4],d[5]]),f==null&&(f=n=(d[6]<<8|d[7])&16383)}var x=a.msecs!==void 0?a.msecs:new Date().getTime(),b=a.nsecs!==void 0?a.nsecs:m+1,S=x-r+(b-m)/1e4;if(S<0&&a.clockseq===void 0&&(f=f+1&16383),(S<0||x>r)&&a.nsecs===void 0&&(b=0),b>=1e4)throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");r=x,m=b,n=f,x+=122192928e5;var k=((x&268435455)*1e4+b)%4294967296;p[l++]=k>>>24&255,p[l++]=k>>>16&255,p[l++]=k>>>8&255,p[l++]=k&255;var _=x/4294967296*1e4&268435455;p[l++]=_>>>8&255,p[l++]=_&255,p[l++]=_>>>24&15|16,p[l++]=_>>>16&255,p[l++]=f>>>8|128,p[l++]=f&255;for(var T=0;T<6;++T)p[l+T]=v[T];return g||e(p)}s.exports=i},"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js":(s,u,o)=>{var c=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),e=o("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js");function t(n,r,m){var i=r&&m||0;typeof n=="string"&&(r=n==="binary"?new Array(16):null,n=null),n=n||{};var a=n.random||(n.rng||c)();if(a[6]=a[6]&15|64,a[8]=a[8]&63|128,r)for(var g=0;g<16;++g)r[i+g]=a[g];return r||e(a)}s.exports=t}}]);})();
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";(()=>{var O=Object.defineProperty,V=Object.defineProperties;var N=Object.getOwnPropertyDescriptors;var q=Object.getOwnPropertySymbols;var B=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var D=(l,n,a)=>n in l?O(l,n,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[n]=a,w=(l,n)=>{for(var a in n||(n={}))B.call(n,a)&&D(l,a,n[a]);if(q)for(var a of q(n))H.call(n,a)&&D(l,a,n[a]);return l},z=(l,n)=>V(l,N(n));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[177],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js":l=>{l.exports=function(n){var a=[];return a.toString=function(){return this.map(function(r){var t="",e=typeof r[5]!="undefined";return r[4]&&(t+="@supports (".concat(r[4],") {")),r[2]&&(t+="@media ".concat(r[2]," {")),e&&(t+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),t+=n(r),e&&(t+="}"),r[2]&&(t+="}"),r[4]&&(t+="}"),t}).join("")},a.i=function(r,t,e,i,d){typeof r=="string"&&(r=[[null,r,void 0]]);var p={};if(e)for(var u=0;u<this.length;u++){var S=this[u][0];S!=null&&(p[S]=!0)}for(var m=0;m<r.length;m++){var o=[].concat(r[m]);e&&p[o[0]]||(typeof d!="undefined"&&(typeof o[5]=="undefined"||(o[1]="@layer".concat(o[5].length>0?" ".concat(o[5]):""," {").concat(o[1],"}")),o[5]=d),t&&(o[2]&&(o[1]="@media ".concat(o[2]," {").concat(o[1],"}")),o[2]=t),i&&(o[4]?(o[1]="@supports (".concat(o[4],") {").concat(o[1],"}"),o[4]=i):o[4]="".concat(i)),a.push(o))}},a}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js":l=>{l.exports=function(n){return n[1]}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":l=>{var n=[];function a(t){for(var e=-1,i=0;i<n.length;i++)if(n[i].identifier===t){e=i;break}return e}function c(t,e){for(var i={},d=[],p=0;p<t.length;p++){var u=t[p],S=e.base?u[0]+e.base:u[0],m=i[S]||0,o="".concat(S," ").concat(m);i[S]=m+1;var b=a(o),U={css:u[1],media:u[2],sourceMap:u[3],supports:u[4],layer:u[5]};if(b!==-1)n[b].references++,n[b].updater(U);else{var _=r(U,e);e.byIndex=p,n.splice(p,0,{identifier:o,updater:_,references:1})}d.push(o)}return d}function r(t,e){var i=e.domAPI(e);i.update(t);var d=function(u){if(u){if(u.css===t.css&&u.media===t.media&&u.sourceMap===t.sourceMap&&u.supports===t.supports&&u.layer===t.layer)return;i.update(t=u)}else i.remove()};return d}l.exports=function(t,e){e=e||{},t=t||[];var i=c(t,e);return function(p){p=p||[];for(var u=0;u<i.length;u++){var S=i[u],m=a(S);n[m].references--}for(var o=c(p,e),b=0;b<i.length;b++){var U=i[b],_=a(U);n[_].references===0&&(n[_].updater(),n.splice(_,1))}i=o}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js":l=>{var n={};function a(r){if(typeof n[r]=="undefined"){var t=document.querySelector(r);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}n[r]=t}return n[r]}function c(r,t){var e=a(r);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)}l.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js":l=>{function n(a){var c=document.createElement("style");return a.setAttributes(c,a.attributes),a.insert(c,a.options),c}l.exports=n},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":(l,n,a)=>{function c(r){var t=a.nc;t&&r.setAttribute("nonce",t)}l.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js":l=>{function n(r,t,e){var i="";e.supports&&(i+="@supports (".concat(e.supports,") {")),e.media&&(i+="@media ".concat(e.media," {"));var d=typeof e.layer!="undefined";d&&(i+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),i+=e.css,d&&(i+="}"),e.media&&(i+="}"),e.supports&&(i+="}");var p=e.sourceMap;p&&typeof btoa!="undefined"&&(i+=`
|
|
2
|
-
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(p))))," */")),t.styleTagTransform(i,r,t.options)}function a(r){if(r.parentNode===null)return!1;r.parentNode.removeChild(r)}function c(r){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=r.insertStyleElement(r);return{update:function(i){n(t,r,i)},remove:function(){a(t)}}}l.exports=c},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js":l=>{function n(a,c){if(c.styleSheet)c.styleSheet.cssText=a;else{for(;c.firstChild;)c.removeChild(c.firstChild);c.appendChild(document.createTextNode(a))}}l.exports=n},"./stories/UISections.story.tsx":function(l,n,a){var c=this&&this.__createBinding||(Object.create?function(f,s,g,y){y===void 0&&(y=g);var T=Object.getOwnPropertyDescriptor(s,g);(!T||("get"in T?!s.__esModule:T.writable||T.configurable))&&(T={enumerable:!0,get:function(){return s[g]}}),Object.defineProperty(f,y,T)}:function(f,s,g,y){y===void 0&&(y=g),f[y]=s[g]}),r=this&&this.__setModuleDefault||(Object.create?function(f,s){Object.defineProperty(f,"default",{enumerable:!0,value:s})}:function(f,s){f.default=s}),t=this&&this.__importStar||function(f){if(f&&f.__esModule)return f;var s={};if(f!=null)for(var g in f)g!=="default"&&Object.prototype.hasOwnProperty.call(f,g)&&c(s,f,g);return r(s,f),s};Object.defineProperty(n,"__esModule",{value:!0}),n.VerticalSections=n.HorizontalSections=void 0;const e=t(a("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=a("./src/components/UISection/index.tsx"),d=a("./src/components/UIToggle/index.tsx"),p=a("./src/components/UIDropdown/index.tsx"),u=a("./src/components/UIButton/index.tsx");n.default={title:"Utilities/Splitter"};const S=`
|
|
3
|
-
.componentOptions {
|
|
4
|
-
display: flex;
|
|
5
|
-
}
|
|
6
|
-
.componentOptions > div {
|
|
7
|
-
min-width: 100px;
|
|
8
|
-
margin-right: 10px;
|
|
9
|
-
}
|
|
10
|
-
#storybook-root {
|
|
11
|
-
height: 100%;
|
|
12
|
-
}
|
|
13
|
-
`,m=`Lorem ipsum dolor sit amet, modo iriure prompta eos in, eos ex meis ponderum, veniam cetero imperdiet ex mel. Munere recteque nam ut, ipsum aeterno est ex. Duo porro nulla ea, ut iudicabit scriptorem sed. Eos senserit imperdiet consequuntur in.
|
|
14
|
-
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.
|
|
15
|
-
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.
|
|
16
|
-
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.
|
|
17
|
-
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.`,o=f=>f.map(s=>({key:s,text:s}));function b(f){var M;const[s,g]=(0,e.useState)({vertical:f.vertical,splitterType:i.UISplitterType.Resize,splitter:!0,splitterTabIndex:0,minSectionSize:[300,300],animation:!0,splitterLayoutType:i.UISplitterLayoutType.Standard,sizesAsPercents:!1,sizes:[400,void 0]}),[y,T]=(0,e.useState)(!0),[x,E]=(0,e.useState)(!0),L=(I,v)=>{g(z(w({},s),{[I]:v}))},P=(I,v)=>{L(I.currentTarget.id,v)},A=(I,v)=>{let h=s.animation;h===!0&&!v?(h=[!0,!0],h[I]=!1):!h&&v?(h=[!1,!1],h[I]=!0):h=v,L("animation",h)},C=(I,v,h,R)=>{L(I,h==null?void 0:h.key)};return e.default.createElement(e.default.Fragment,null,e.default.createElement("style",null,S),e.default.createElement("div",{style:{height:"100%",display:"flex",flexDirection:"column"}},e.default.createElement("div",{className:"componentOptions"},e.default.createElement(d.UIToggle,{id:"splitter",label:"splitter",checked:s.splitter,inlineLabel:!0,inlineLabelLeft:!0,size:d.UIToggleSize.Small,onChange:P}),e.default.createElement(p.UIDropdown,{id:"splitterType",label:"splitterType",selectedKey:s.splitterType,options:o([i.UISplitterType.Resize,i.UISplitterType.Toggle]),onChange:C.bind(this,"splitterType")}),e.default.createElement(p.UIDropdown,{id:"splitterTabIndex",label:"splitterTabIndex",selectedKey:(M=s.splitterTabIndex)==null?void 0:M.toString(),options:o(["-1","0"]),onChange:C.bind(this,"splitterTabIndex")}),e.default.createElement(p.UIDropdown,{id:"splitterLayoutType",label:"splitterLayoutType",selectedKey:s.splitterLayoutType,options:o([i.UISplitterLayoutType.Compact,i.UISplitterLayoutType.Standard]),onChange:C.bind(this,"splitterLayoutType")}),e.default.createElement("div",null,e.default.createElement(d.UIToggle,{id:"animation1",label:"Animate left section",checked:Array.isArray(s.animation)?s.animation[0]:s.animation,inlineLabel:!0,inlineLabelLeft:!0,size:d.UIToggleSize.Small,onChange:(I,v)=>A(0,v)}),e.default.createElement(d.UIToggle,{id:"animation1",label:"Animate right section",checked:Array.isArray(s.animation)?s.animation[1]:s.animation,inlineLabel:!0,inlineLabelLeft:!0,size:d.UIToggleSize.Small,onChange:(I,v)=>A(1,v)})),e.default.createElement("div",null,e.default.createElement(d.UIToggle,{id:"sectionVisible",label:"toggle left section",checked:y,inlineLabel:!0,inlineLabelLeft:!0,size:d.UIToggleSize.Small,onChange:()=>{T(!y)}}),e.default.createElement(d.UIToggle,{id:"sectionVisible",label:"toggle right section",checked:x,inlineLabel:!0,inlineLabelLeft:!0,size:d.UIToggleSize.Small,onChange:()=>{E(!x)}})),e.default.createElement("div",null,e.default.createElement(u.UIDefaultButton,{text:"Toggle sections",onClick:()=>{T(!y),E(!x)}}))),e.default.createElement("div",{style:{height:"100%"}},e.default.createElement(i.UISections,z(w({},s),{height:"100%",onClose:()=>{E(!x)}}),e.default.createElement(i.UISections.Section,{height:"100%",cleanPadding:!0,hidden:!y,"data-test":"test"},e.default.createElement("div",null,m,m,m)),e.default.createElement(i.UISections.Section,{height:"100%",cleanPadding:!0,hidden:!x},e.default.createElement("div",null,m,m,m))))))}const U=()=>e.default.createElement(b,{vertical:!1});n.HorizontalSections=U;const _=()=>e.default.createElement(b,{vertical:!0});n.VerticalSections=_}}]);})();
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
(()=>{var P=Object.defineProperty,O=Object.defineProperties;var A=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable;var S=(i,r,s)=>r in i?P(i,r,{enumerable:!0,configurable:!0,writable:!0,value:s}):i[r]=s,b=(i,r)=>{for(var s in r||(r={}))C.call(r,s)&&S(i,s,r[s]);if(T)for(var s of T(r))w.call(r,s)&&S(i,s,r[s]);return i},h=(i,r)=>O(i,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.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss":(i,r,s)=>{var u=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),e=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),t=e(u);t.push([i.id,".ts-icon{fill:var(--vscode-foreground)}",""]),i.exports=t},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss":(i,r,s)=>{var u=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),e=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),t=e(u);t.push([i.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}",""]),i.exports=t},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js":i=>{"use strict";i.exports=function(r){var s=[];return s.toString=function(){return this.map(function(e){var t="",n=typeof e[5]!="undefined";return e[4]&&(t+="@supports (".concat(e[4],") {")),e[2]&&(t+="@media ".concat(e[2]," {")),n&&(t+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),t+=r(e),n&&(t+="}"),e[2]&&(t+="}"),e[4]&&(t+="}"),t}).join("")},s.i=function(e,t,n,o,d){typeof e=="string"&&(e=[[null,e,void 0]]);var a={};if(n)for(var l=0;l<this.length;l++){var m=this[l][0];m!=null&&(a[m]=!0)}for(var p=0;p<e.length;p++){var _=[].concat(e[p]);n&&a[_[0]]||(typeof d!="undefined"&&(typeof _[5]=="undefined"||(_[1]="@layer".concat(_[5].length>0?" ".concat(_[5]):""," {").concat(_[1],"}")),_[5]=d),t&&(_[2]&&(_[1]="@media ".concat(_[2]," {").concat(_[1],"}")),_[2]=t),o&&(_[4]?(_[1]="@supports (".concat(_[4],") {").concat(_[1],"}"),_[4]=o):_[4]="".concat(o)),s.push(_))}},s}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js":i=>{"use strict";i.exports=function(r){return r[1]}},"./src/components/UIIcon/UIIcon.scss":(i,r,s)=>{"use strict";s.r(r),s.d(r,{default:()=>M});var u=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),e=s.n(u),t=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),n=s.n(t),o=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=s.n(o),a=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),l=s.n(a),m=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),p=s.n(m),_=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=s.n(_),E=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"),f=s.n(E),c={};for(const v in E)v!=="default"&&(c[v]=()=>E[v]);s.d(r,c);var g={};g.styleTagTransform=y(),g.setAttributes=l(),g.insert=d().bind(null,"head"),g.domAPI=n(),g.insertStyleElement=p();var I=e()(f(),g);const M=f()&&f().locals?f().locals:void 0},"./src/helper/ValidationMessage/MessageWrapper.scss":(i,r,s)=>{"use strict";s.r(r),s.d(r,{default:()=>M});var u=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),e=s.n(u),t=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),n=s.n(t),o=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=s.n(o),a=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),l=s.n(a),m=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),p=s.n(m),_=s("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=s.n(_),E=s("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss"),f=s.n(E),c={};for(const v in E)v!=="default"&&(c[v]=()=>E[v]);s.d(r,c);var g={};g.styleTagTransform=y(),g.setAttributes=l(),g.insert=d().bind(null,"head"),g.domAPI=n(),g.insertStyleElement=p();var I=e()(f(),g);const M=f()&&f().locals?f().locals:void 0},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":i=>{"use strict";var r=[];function s(t){for(var n=-1,o=0;o<r.length;o++)if(r[o].identifier===t){n=o;break}return n}function u(t,n){for(var o={},d=[],a=0;a<t.length;a++){var l=t[a],m=n.base?l[0]+n.base:l[0],p=o[m]||0,_="".concat(m," ").concat(p);o[m]=p+1;var y=s(_),E={css:l[1],media:l[2],sourceMap:l[3],supports:l[4],layer:l[5]};if(y!==-1)r[y].references++,r[y].updater(E);else{var f=e(E,n);n.byIndex=a,r.splice(a,0,{identifier:_,updater:f,references:1})}d.push(_)}return d}function e(t,n){var o=n.domAPI(n);o.update(t);var d=function(l){if(l){if(l.css===t.css&&l.media===t.media&&l.sourceMap===t.sourceMap&&l.supports===t.supports&&l.layer===t.layer)return;o.update(t=l)}else o.remove()};return d}i.exports=function(t,n){n=n||{},t=t||[];var o=u(t,n);return function(a){a=a||[];for(var l=0;l<o.length;l++){var m=o[l],p=s(m);r[p].references--}for(var _=u(a,n),y=0;y<o.length;y++){var E=o[y],f=s(E);r[f].references===0&&(r[f].updater(),r.splice(f,1))}o=_}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js":i=>{"use strict";var r={};function s(e){if(typeof r[e]=="undefined"){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(n){t=null}r[e]=t}return r[e]}function u(e,t){var n=s(e);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");n.appendChild(t)}i.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js":i=>{"use strict";function r(s){var u=document.createElement("style");return s.setAttributes(u,s.attributes),s.insert(u,s.options),u}i.exports=r},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":(i,r,s)=>{"use strict";function u(e){var t=s.nc;t&&e.setAttribute("nonce",t)}i.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js":i=>{"use strict";function r(e,t,n){var o="";n.supports&&(o+="@supports (".concat(n.supports,") {")),n.media&&(o+="@media ".concat(n.media," {"));var d=typeof n.layer!="undefined";d&&(o+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),o+=n.css,d&&(o+="}"),n.media&&(o+="}"),n.supports&&(o+="}");var a=n.sourceMap;a&&typeof btoa!="undefined"&&(o+=`
|
|
2
|
-
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),t.styleTagTransform(o,e,t.options)}function s(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(o){r(t,e,o)},remove:function(){s(t)}}}i.exports=u},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js":i=>{"use strict";function r(s,u){if(u.styleSheet)u.styleSheet.cssText=s;else{for(;u.firstChild;)u.removeChild(u.firstChild);u.appendChild(document.createTextNode(s))}}i.exports=r},"./src/components/UIIcon/UIIcon.tsx":function(i,r,s){"use strict";var u=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(r,"__esModule",{value:!0}),r.UIIcon=void 0;const e=u(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.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js");s("./src/components/UIIcon/UIIcon.scss");class n extends e.default.Component{constructor(d){super(d),this.setStyle=()=>({})}render(){const d=this.props.className?` ${this.props.className}`:"";return e.default.createElement(t.Icon,h(b({},this.props),{className:`ts-icon${d}`,styles:this.setStyle()}))}}r.UIIcon=n},"./src/components/UIIcon/index.tsx":function(i,r,s){"use strict";var u=this&&this.__createBinding||(Object.create?function(t,n,o,d){d===void 0&&(d=o);var a=Object.getOwnPropertyDescriptor(n,o);(!a||("get"in a?!n.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return n[o]}}),Object.defineProperty(t,d,a)}:function(t,n,o,d){d===void 0&&(d=o),t[d]=n[o]}),e=this&&this.__exportStar||function(t,n){for(var o in t)o!=="default"&&!Object.prototype.hasOwnProperty.call(n,o)&&u(n,t,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(s("./src/components/UIIcon/UIIcon.tsx"),r)},"./src/components/UIToggle/UIToggle.tsx":function(i,r,s){"use strict";var u=this&&this.__importDefault||function(p){return p&&p.__esModule?p:{default:p}};Object.defineProperty(r,"__esModule",{value:!0}),r.UIToggle=r.UIToggleSize=void 0;const e=u(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.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),n=s("./src/helper/ValidationMessage/index.tsx");var o;(function(p){p.Standard="Standard",p.Small="Small"})(o||(r.UIToggleSize=o={}));const d=new Map([[o.Small,{width:30,height:14,padding:"0 2px",margin:"0",label:{fontSize:13,padding:"2px 0"},circle:{width:10,height:10,borderWidth:5}}]]),a=.4,l={pill:{borderColor:"var(--vscode-contrastBorder, transparent)",unchecked:{background:"var(--vscode-titleBar-inactiveForeground)",hover:{background:"var(--vscode-editorHint-foreground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},checked:{background:"var(--vscode-button-background)",hover:{background:"var(--vscode-button-hoverBackground)",borderColor:"var(--vscode-contrastActiveBorder, transparent)"}},focus:{outline:"1px solid var(--vscode-focusBorder) !important"}},thumb:{background:"var(--vscode-button-foreground)"}};class m extends e.default.Component{constructor(_){super(_)}getMarginBottom(_){const{inlineLabel:y}=this.props;if(_)return y?0:4}render(){const{inlineLabelLeft:_,labelFlexGrow:y,size:E,inlineLabel:f}=this.props,c=d.get(E!=null?E:o.Standard),g=(0,n.getMessageInfo)(this.props),I=v=>({root:h(b({},y&&{flexGrow:1}),{margin:c==null?void 0:c.margin,marginBottom:this.getMarginBottom(g.message)}),label:h(b(b(b({color:"var(--vscode-foreground)",fontWeight:"normal",fontSize:c==null?void 0:c.label.fontSize,padding:c==null?void 0:c.label.padding},f&&{marginLeft:10}),_&&{order:0,marginLeft:0,marginRight:10}),y&&{flexGrow:1}),{opacity:this.props.disabled?a:"inherit"}),pill:h(b({height:c==null?void 0:c.height,width:c==null?void 0:c.width,padding:c==null?void 0:c.padding,background:l.pill.checked.background,borderColor:l.pill.borderColor,borderStyle:"solid",":hover":{background:l.pill.checked.hover.background,borderColor:l.pill.checked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:l.thumb.background},":disabled":{background:l.pill.checked.background,borderColor:l.pill.borderColor,opacity:a}},!v.checked&&{background:l.pill.unchecked.background,borderStyle:"dashed",":hover":{background:l.pill.unchecked.hover.background,borderColor:l.pill.unchecked.hover.borderColor},":hover .ms-Toggle-thumb":{backgroundColor:l.thumb.background},":disabled":{background:l.pill.unchecked.background,borderColor:l.pill.borderColor,opacity:a}}),{selectors:{":focus::after":{border:"none !important",outline:l.pill.focus.outline}}}),thumb:{height:c==null?void 0:c.circle.height,width:c==null?void 0:c.circle.width,borderWidth:c==null?void 0:c.circle.borderWidth,background:l.thumb.background,":hover":{backgroundColor:l.thumb.background}}}),M=e.default.createElement(t.Toggle,h(b({},this.props),{styles:I}));return g.message?e.default.createElement(n.MessageWrapper,{message:g},M):M}}r.UIToggle=m},"./src/components/UIToggle/index.tsx":function(i,r,s){"use strict";var u=this&&this.__createBinding||(Object.create?function(t,n,o,d){d===void 0&&(d=o);var a=Object.getOwnPropertyDescriptor(n,o);(!a||("get"in a?!n.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return n[o]}}),Object.defineProperty(t,d,a)}:function(t,n,o,d){d===void 0&&(d=o),t[d]=n[o]}),e=this&&this.__exportStar||function(t,n){for(var o in t)o!=="default"&&!Object.prototype.hasOwnProperty.call(n,o)&&u(n,t,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(s("./src/components/UIToggle/UIToggle.tsx"),r)},"./src/helper/ValidationMessage/MessageWrapper.tsx":function(i,r,s){"use strict";var u=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(r,"__esModule",{value:!0}),r.MESSAGE_ICONS_MAP=void 0,r.MessageWrapper=d;const e=u(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=s("./src/helper/ValidationMessage/utils.ts"),n=s("./src/components/Icons.tsx"),o=s("./src/components/UIIcon/index.tsx");s("./src/helper/ValidationMessage/MessageWrapper.scss"),r.MESSAGE_ICONS_MAP=new Map([[void 0,n.UiIcons.Error],[t.ErrorMessageType.Error,n.UiIcons.Error],[t.ErrorMessageType.Warning,n.UiIcons.Warning],[t.ErrorMessageType.Info,n.UiIcons.Info]]);function d(a){const{children:l,message:m}=a,p=m.message?t.MESSAGE_TYPES_CLASSNAME_MAP.get(m.type):void 0,_=r.MESSAGE_ICONS_MAP.get(m.type);return e.default.createElement("div",{className:`ts-message-wrapper ts-message-wrapper--${p}`},e.default.createElement("div",{className:"ts-message-target"},l),e.default.createElement("div",{className:"ts-message-body"},e.default.createElement(o.UIIcon,{iconName:_}),e.default.createElement("span",null,m.message)))}},"./src/helper/ValidationMessage/index.tsx":function(i,r,s){"use strict";var u=this&&this.__createBinding||(Object.create?function(t,n,o,d){d===void 0&&(d=o);var a=Object.getOwnPropertyDescriptor(n,o);(!a||("get"in a?!n.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return n[o]}}),Object.defineProperty(t,d,a)}:function(t,n,o,d){d===void 0&&(d=o),t[d]=n[o]}),e=this&&this.__exportStar||function(t,n){for(var o in t)o!=="default"&&!Object.prototype.hasOwnProperty.call(n,o)&&u(n,t,o)};Object.defineProperty(r,"__esModule",{value:!0}),e(s("./src/helper/ValidationMessage/MessageWrapper.tsx"),r),e(s("./src/helper/ValidationMessage/utils.ts"),r)},"./src/helper/ValidationMessage/utils.ts":(i,r)=>{"use strict";Object.defineProperty(r,"__esModule",{value:!0}),r.getMessageInfo=r.MESSAGE_TYPES_CLASSNAME_MAP=r.ErrorMessageType=void 0;var s;(function(a){a.Error="Error",a.Warning="Warning",a.Info="Info"})(s||(r.ErrorMessageType=s={}));const u=(a,l)=>{const m=`1px solid ${l}`;return{backgroundColor:a,borderLeft:m,borderRight:m,borderBottom:m,borderColor:l}},e={error:h(b({color:"var(--vscode-input-foreground)"},u("var(--vscode-inputValidation-errorBackground)","var(--vscode-inputValidation-errorBorder)")),{paddingTop:4,paddingBottom:5,paddingLeft:8,margin:0}),warning:{},info:{}};e.warning=b(b({},e.error),u("var(--vscode-inputValidation-warningBackground)","var(--vscode-inputValidation-warningBorder)")),e.info=b(b({},e.error),u("var(--vscode-inputValidation-infoBackground)","var(--vscode-inputValidation-infoBorder)")),r.MESSAGE_TYPES_CLASSNAME_MAP=new Map([[void 0,"error"],[s.Error,"error"],[s.Warning,"warning"],[s.Info,"info"]]);const t=a=>{let l;switch(a){case s.Warning:{l=e.warning;break}case s.Info:{l=e.info;break}default:{l=e.error;break}}return l},n=a=>{if(a){if(a.errorMessage)return s.Error;if(a.warningMessage)return s.Warning;if(a.infoMessage)return s.Info}return s.Error},o=a=>{const l=["errorMessage","warningMessage","infoMessage"];for(const m of l)if(a!=null&&a[m])return a[m]},d=a=>{const l=n(a);return{type:l,style:t(l),message:o(a)}};r.getMessageInfo=d},"./stories/UIToggle.story.tsx":function(i,r,s){"use strict";var u=this&&this.__importDefault||function(_){return _&&_.__esModule?_:{default:_}};Object.defineProperty(r,"__esModule",{value:!0}),r.withMessages=r.smallSize=r.withLabel=r.asDisabled=r.defaultUsage=void 0;const e=u(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.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),n=s("./src/components/UIToggle/index.tsx");r.default={title:"Basic Inputs/Toggle/Buttons"};const o={childrenGap:40},d=()=>e.default.createElement(t.Stack,{tokens:o,style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIToggle"),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"default"),e.default.createElement(n.UIToggle,null)),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"set to checked"),e.default.createElement(n.UIToggle,{defaultChecked:!0})));r.defaultUsage=d;const a=()=>e.default.createElement(t.Stack,{tokens:o,style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIToggle disabled"),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"default"),e.default.createElement(n.UIToggle,{disabled:!0})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"disabled as checked"),e.default.createElement(n.UIToggle,{disabled:!0,defaultChecked:!0})));r.asDisabled=a;const l=()=>e.default.createElement(t.Stack,{tokens:o,style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIToggle with label"),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"with inline label"),e.default.createElement(n.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode"})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"with inline label on the left"),e.default.createElement(n.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode",inlineLabelLeft:!0})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium",className:"textColor"},"with Grow label width"),e.default.createElement(n.UIToggle,{defaultChecked:!0,inlineLabel:!0,label:"Wizard mode",inlineLabelLeft:!0,labelFlexGrow:!0})));r.withLabel=l;const m=()=>e.default.createElement(t.Stack,{tokens:o,style:{width:300}},e.default.createElement(t.Text,{variant:"large",className:"textColor"},"UIToggle with label"),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"medium"},"small size"),e.default.createElement(n.UIToggle,{label:"Small toggle",inlineLabel:!0,inlineLabelLeft:!0,size:n.UIToggleSize.Small})));r.smallSize=m;const p=()=>{const _="Dummy message";return e.default.createElement(e.default.Fragment,null,e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(n.UIToggle,{label:"Error",errorMessage:_}),e.default.createElement(n.UIToggle,{label:"Warning",warningMessage:_}),e.default.createElement(n.UIToggle,{label:"Info",infoMessage:_})),e.default.createElement("div",{style:{marginTop:"30px",width:"300px"}},e.default.createElement(n.UIToggle,{label:"Error",inlineLabel:!0,errorMessage:_}),e.default.createElement(n.UIToggle,{label:"Warning",inlineLabel:!0,warningMessage:_,labelFlexGrow:!0}),e.default.createElement(n.UIToggle,{label:"Info",inlineLabel:!0,infoMessage:_})),e.default.createElement("div",{style:{marginTop:"30px",width:"300px"}},e.default.createElement(n.UIToggle,{label:"Error",inlineLabel:!0,inlineLabelLeft:!0,errorMessage:_}),e.default.createElement(n.UIToggle,{label:"Warning",inlineLabel:!0,inlineLabelLeft:!0,warningMessage:_}),e.default.createElement(n.UIToggle,{label:"Info",inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,infoMessage:_})))};r.withMessages=p}}]);})();
|