@sap-ux/ui-components/storybook/UIDialog-story.4173109f.iframe.bundle.js

SAP UI Components Library

"use strict";(()=>{var O=Object.defineProperty,M=Object.defineProperties;var B=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable;var S=(c,a,o)=>a in c?O(c,a,{enumerable:!0,configurable:!0,writable:!0,value:o}):c[a]=o,T=(c,a)=>{for(var o in a||(a={}))w.call(a,o)&&S(c,o,a[o]);if(C)for(var o of C(a))P.call(a,o)&&S(c,o,a[o]);return c},A=(c,a)=>M(c,B(a));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[937],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js":c=>{c.exports=function(a){var o=[];return o.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("")},o.i=function(l,t,e,n,h){typeof l=="string"&&(l=[[null,l,void 0]]);var p={};if(e)for(var r=0;r<this.length;r++){var y=this[r][0];y!=null&&(p[y]=!0)}for(var I=0;I<l.length;I++){var u=[].concat(l[I]);e&&p[u[0]]||(typeof h!="undefined"&&(typeof u[5]=="undefined"||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=h),t&&(u[2]&&(u[1]="@media ".concat(u[2]," {").concat(u[1],"}")),u[2]=t),n&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=n):u[4]="".concat(n)),o.push(u))}},o}},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js":c=>{c.exports=function(a){return a[1]}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":c=>{var a=[];function o(t){for(var e=-1,n=0;n<a.length;n++)if(a[n].identifier===t){e=n;break}return e}function d(t,e){for(var n={},h=[],p=0;p<t.length;p++){var r=t[p],y=e.base?r[0]+e.base:r[0],I=n[y]||0,u="".concat(y," ").concat(I);n[y]=I+1;var m=o(u),E={css:r[1],media:r[2],sourceMap:r[3],supports:r[4],layer:r[5]};if(m!==-1)a[m].references++,a[m].updater(E);else{var v=l(E,e);e.byIndex=p,a.splice(p,0,{identifier:u,updater:v,references:1})}h.push(u)}return h}function l(t,e){var n=e.domAPI(e);n.update(t);var h=function(r){if(r){if(r.css===t.css&&r.media===t.media&&r.sourceMap===t.sourceMap&&r.supports===t.supports&&r.layer===t.layer)return;n.update(t=r)}else n.remove()};return h}c.exports=function(t,e){e=e||{},t=t||[];var n=d(t,e);return function(p){p=p||[];for(var r=0;r<n.length;r++){var y=n[r],I=o(y);a[I].references--}for(var u=d(p,e),m=0;m<n.length;m++){var E=n[m],v=o(E);a[v].references===0&&(a[v].updater(),a.splice(v,1))}n=u}}},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js":c=>{var a={};function o(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=o(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)}c.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js":c=>{function a(o){var d=document.createElement("style");return o.setAttributes(d,o.attributes),o.insert(d,o.options),d}c.exports=a},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":(c,a,o)=>{function d(l){var t=o.nc;t&&l.setAttribute("nonce",t)}c.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js":c=>{function a(l,t,e){var n="";e.supports&&(n+="@supports (".concat(e.supports,") {")),e.media&&(n+="@media ".concat(e.media," {"));var h=typeof e.layer!="undefined";h&&(n+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),n+=e.css,h&&(n+="}"),e.media&&(n+="}"),e.supports&&(n+="}");var p=e.sourceMap;p&&typeof btoa!="undefined"&&(n+=`
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(p))))," */")),t.styleTagTransform(n,l,t.options)}function o(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(n){a(t,l,n)},remove:function(){o(t)}}}c.exports=d},"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js":c=>{function a(o,d){if(d.styleSheet)d.styleSheet.cssText=o;else{for(;d.firstChild;)d.removeChild(d.firstChild);d.appendChild(document.createTextNode(o))}}c.exports=a},"./stories/UIDialog.story.tsx":function(c,a,o){var d=this&&this.__createBinding||(Object.create?function(s,i,g,f){f===void 0&&(f=g);var x=Object.getOwnPropertyDescriptor(i,g);(!x||("get"in x?!i.__esModule:x.writable||x.configurable))&&(x={enumerable:!0,get:function(){return i[g]}}),Object.defineProperty(s,f,x)}:function(s,i,g,f){f===void 0&&(f=g),s[f]=i[g]}),l=this&&this.__setModuleDefault||(Object.create?function(s,i){Object.defineProperty(s,"default",{enumerable:!0,value:i})}:function(s,i){s.default=i}),t=this&&this.__importStar||function(s){if(s&&s.__esModule)return s;var i={};if(s!=null)for(var g in s)g!=="default"&&Object.prototype.hasOwnProperty.call(s,g)&&d(i,s,g);return l(i,s),i};Object.defineProperty(a,"__esModule",{value:!0}),a.Dialog=void 0;const e=t(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),n=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"),h=o("./src/components/UIDialog/index.ts"),p=o("./src/components/UIButton/index.tsx"),r=o("./src/components/UIInput/index.tsx"),y=o("./src/components/UIDropdown/index.tsx"),I=o("./src/components/UIComboBox/index.tsx"),u=o("./src/components/UICheckbox/index.tsx");a.default={title:"Dialogs/Dialogs"};const m={childrenGap:40},E={main:{".ms-TextField-wrapper > .ms-Label":{margin:0}}};class v extends e.default.Component{constructor(){super(...arguments),this.state={isOpen:!1,text:"Some Text"},this.onChange=i=>{this.setState({text:i.target.value})},this.onToggle=()=>{this.setState({isOpen:!this.state.isOpen})},this.onAccept=()=>{alert(`You wrote: ${this.state.text}`),this.setState({isOpen:!1})}}render(){const{draggable:i}=this.props,g=[{key:"111",text:"Dummy option 111"},{key:"222",text:"Dummy option 222"}],f=this.props.draggable?{modalProps:{dragOptions:{moveMenuItemText:"Move",closeMenuItemText:"Close",menu:n.ContextualMenu,keepInBounds:!0}}}:void 0;return e.default.createElement(e.default.Fragment,null,e.default.createElement(p.UIDefaultButton,{onClick:this.onToggle,primary:!0},i?"Open Draggable Dialog":"Open Dialog"),e.default.createElement(h.UIDialog,A(T({isOpen:this.state.isOpen,isOpenAnimated:this.props.openAnimation,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel"},f),{onAccept:this.onAccept,styles:E,onCancel:this.onToggle,onDismiss:this.onToggle}),e.default.createElement(r.UITextInput,{label:"Dialog Content",value:this.state.text,onChange:this.onChange}),e.default.createElement(y.UIDropdown,{label:"Dummy",options:g}),e.default.createElement(I.UIComboBox,{label:"Dummy",highlight:!0,options:g})))}}const D=s=>{const[i,g]=(0,e.useState)(!1),f=()=>{g(!i)},x=T({},E.main),{size:b}=s;b&&(x.height=b);let U="Open Large Dialog";return b&&(U+=` height=${b}`),e.default.createElement(e.default.Fragment,null,e.default.createElement(p.UIDefaultButton,{onClick:f,primary:!0},U),e.default.createElement(h.UIDialog,{isOpen:i,isOpenAnimated:s.openAnimation,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel",styles:{main:x},onAccept:f,onCancel:f,onDismiss:f},e.default.createElement(y.UIDropdown,{label:"Dummy",options:[]}),e.default.createElement(r.UITextInput,{label:"Username"}),e.default.createElement(r.UITextInput,{label:"Email"}),e.default.createElement(r.UITextInput,{label:"Password",type:"password"}),e.default.createElement(r.UITextInput,{label:"Email"}),e.default.createElement(r.UITextInput,{label:"First name"}),e.default.createElement(r.UITextInput,{label:"Last name"}),e.default.createElement(r.UITextInput,{label:"Address"}),e.default.createElement(r.UITextInput,{label:"State"}),e.default.createElement(r.UITextInput,{label:"Country"}),e.default.createElement(r.UITextInput,{label:"Phone"}),e.default.createElement(r.UITextInput,{label:"Dummy 1"}),e.default.createElement(r.UITextInput,{label:"Dummy 2"}),e.default.createElement(r.UITextInput,{label:"Dummy 3"}),e.default.createElement(r.UITextInput,{label:"Dummy 4"}),e.default.createElement(r.UITextInput,{label:"Dummy 5"})))},_=s=>{const[i,g]=(0,e.useState)(!1),f=()=>{g(!i)};return e.default.createElement(e.default.Fragment,null,e.default.createElement(p.UIDefaultButton,{onClick:f,primary:!0},"Open Confirm Dialog"),e.default.createElement(h.UIDialog,{isOpen:i,isOpenAnimated:s.openAnimation,isBlocking:!0,onAccept:f,onCancel:f,onDismiss:f,acceptButtonText:"Yes",cancelButtonText:"No",title:"Delete Confirmation",dialogContentProps:{subText:"Are you sure you want to delete entry? This action cannot be undone."}}))},k=()=>{const[s,i]=(0,e.useState)(!0);return e.default.createElement(n.Stack,{tokens:m},e.default.createElement(n.Stack,{tokens:m},e.default.createElement(n.Text,{variant:"large",block:!0},"Dialogs"),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UICheckbox,{label:"Open animation enabled",checked:s,onChange:(g,f)=>{i(f)}})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(v,{draggable:!1,openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(v,{draggable:!1,openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(v,{draggable:!0,openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(D,{openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(D,{size:400,openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(D,{openAnimation:s})),e.default.createElement(n.Stack,{horizontal:!0,tokens:m},e.default.createElement(_,{openAnimation:s}))))};a.Dialog=k}}]);})();