modal-and-popover-confirm-dialog-confirm-dialog-stories-mdx.75eba0e0.iframe.bundle.js

(self.webpackChunk_freud_ds_web=self.webpackChunk_freud_ds_web||[]).push([[6849],{"./stories/modal-and-popover/confirm-dialog/confirm-dialog.stories.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{_Default_:()=>_Default_,__namedExportsOrder:()=>confirm_dialog_stories_namedExportsOrder,default:()=>confirm_dialog_stories});__webpack_require__("./node_modules/react/index.js");var lib=__webpack_require__("./node_modules/@storybook/addon-docs/node_modules/@mdx-js/react/lib/index.js"),dist=__webpack_require__("./node_modules/@storybook/addon-docs/dist/index.mjs"),angular_dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),public_api=__webpack_require__("./projects/web-components/src/public-api.ts"),header_component=__webpack_require__("./stories/header/header.component.tsx"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.mjs"),core=__webpack_require__("./node_modules/@angular/core/fesm2022/core.mjs"),common=__webpack_require__("./node_modules/@angular/common/fesm2022/common.mjs"),example_componentngResource=__webpack_require__("./stories/modal-and-popover/modal-and-popover-examples/example.component.scss?ngResource"),example_componentngResource_default=__webpack_require__.n(example_componentngResource),confirmation_service=__webpack_require__("./projects/web-components/src/services/confirmation.service.ts");let FreudConfirmationDialogExampleComponent=class FreudConfirmationDialogExampleComponent{constructor(confirmationService){this.confirmationService=confirmationService}confirm(){this.confirmationService.confirm({header:"Confirme",message:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",acceptLabel:"Aceitar",rejectLabel:"Rejeitar"})}static#_=this.ctorParameters=()=>[{type:confirmation_service.N}]};FreudConfirmationDialogExampleComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"freud-confirm-dialog-example",template:'\n    <freud-confirm-dialog></freud-confirm-dialog>\n    <freud-button (click)="confirm()">Clique aqui!</freud-button>\n  ',styles:[example_componentngResource_default()]})],FreudConfirmationDialogExampleComponent);let FreudModalExampleModule=class FreudModalExampleModule{};FreudModalExampleModule=(0,tslib_es6.gn)([(0,core.NgModule)({imports:[common.CommonModule,public_api.CZ,public_api.v7],declarations:[FreudConfirmationDialogExampleComponent],exports:[FreudConfirmationDialogExampleComponent]})],FreudModalExampleModule);var animations=__webpack_require__("./node_modules/@angular/platform-browser/fesm2022/animations.mjs");const Default=(()=>({template:'\n    <div style="min-height: 400px;">\n      <freud-confirm-dialog-example></freud-confirm-dialog-example>\n    </div>\n  '})).bind({});(0,angular_dist.applicationConfig)({providers:[(0,core.importProvidersFrom)(animations.BrowserAnimationsModule)]});var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");function _createMdxContent(props){const _components=Object.assign({h2:"h2",pre:"pre",code:"code",p:"p",h3:"h3"},(0,lib.ah)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(dist.h_,{decorators:[(0,angular_dist.moduleMetadata)({imports:[public_api.CZ,FreudModalExampleModule]})],parameters:{layout:"centered",viewMode:"docs",previewTabs:{canvas:{hidden:!0}},backgrounds:{default:"Default",values:[{name:"Default",value:"#FFFFFF"},{name:"BgColor",value:"#6732D1"}]}},title:"@freud-ds/web-components/Modal e Popover/ConfirmDialog",component:public_api.QL}),"\n",(0,jsx_runtime.jsx)(header_component.z,{title:"ConfirmDialog",description:"Para exibir facilmente janelas de confirmação que podem ser compartilhadas por várias ações no mesmo componente."}),"\n",(0,jsx_runtime.jsxs)(_components.h2,{id:"import",children:[(0,jsx_runtime.jsx)("a",{id:"importing"}),"Import"]}),"\n",(0,jsx_runtime.jsx)(_components.pre,{children:(0,jsx_runtime.jsx)(_components.code,{className:"language-ts",children:"import { FreudConfirmDialogModule } from '@freud-ds/web-components';\n"})}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"getting-started",children:"Getting Started"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"FreudConfirmDialog é definido usando a tag freud-confirm-dialog e uma instância de FreudConfirmationService é necessária para exibi-lo chamando o método confirm."}),"\n",(0,jsx_runtime.jsx)(_components.pre,{children:(0,jsx_runtime.jsx)(_components.code,{className:"language-html",children:'<freud-confirm-dialog></freud-confirm-dialog>\n<freud-button (click)="confirm()">Clique aqui!</freud-button>\n'})}),"\n",(0,jsx_runtime.jsx)(_components.pre,{children:(0,jsx_runtime.jsx)(_components.code,{className:"language-ts",children:"import { FreudConfirmationService } from '@freud-ds/web-components';\n\nexport class ConfirmDialogDemo {\n  constructor(private confirmationService: FreudConfirmationService) {}\n\n  confirm() {\n    this.confirmationService.confirm({\n      header: 'Confirme',\n      message: 'Mensagem.',\n      acceptLabel: 'Aceitar',\n      rejectLabel: 'Rejeitar',\n      accept: () => {\n        //Ação quando o usuário aceitar\n      },\n      reject: () => {\n        // Ação quando o usuário rejeitar\n      },\n    });\n  }\n}\n"})}),"\n",(0,jsx_runtime.jsxs)(_components.h2,{id:"exemplo",children:[(0,jsx_runtime.jsx)("a",{id:"exemplos"}),"Exemplo"]}),"\n",(0,jsx_runtime.jsx)("br",{}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"default",children:"Default"}),"\n",(0,jsx_runtime.jsx)(dist.Xz,{children:(0,jsx_runtime.jsx)(dist.oG,{story:Default})})]})}const _Default_=Default,componentMeta={title:"@freud-ds/web-components/Modal e Popover/ConfirmDialog",parameters:{layout:"centered",viewMode:"docs",previewTabs:{canvas:{hidden:!0}},backgrounds:{default:"Default",values:[{name:"Default",value:"#FFFFFF"},{name:"BgColor",value:"#6732D1"}]}},decorators:[(0,angular_dist.moduleMetadata)({imports:[public_api.CZ,FreudModalExampleModule]})],component:public_api.QL,tags:["stories-mdx"],includeStories:["_Default_"]};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs={...componentMeta.parameters.docs||{},page:function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.ah)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{...props})}):_createMdxContent(props)}};const confirm_dialog_stories=componentMeta,confirm_dialog_stories_namedExportsOrder=["_Default_"]},"./stories/modal-and-popover/modal-and-popover-examples/example.component.scss?ngResource":(module,__unused_webpack_exports,__webpack_require__)=>{var ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___=__webpack_require__("./node_modules/css-loader/dist/runtime/noSourceMaps.js"),___CSS_LOADER_EXPORT___=__webpack_require__("./node_modules/css-loader/dist/runtime/api.js")(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);___CSS_LOADER_EXPORT___.push([module.id,"",""]),module.exports=___CSS_LOADER_EXPORT___.toString()}}]);