"use strict";(self.webpackChunkangular_storybook_project=self.webpackChunkangular_storybook_project||[]).push([[3112],{"./src/common/shared/models-mdx/Step.mdx"(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>MDXContent});var react=__webpack_require__("./node_modules/react/index.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),lib=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),dist=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");const StepReader=()=>react.createElement("div",{className:"panel-content"},react.createElement(dist.oz,null,'# Step\n\nDocumentazione dettagliata della custom class **Step**, usata nei componenti di Internet Webkit v17. \n**Step** viene utilizzato per creare l\'oggetto `Step` di un componente <a href="?path=/story/components-wizard--wizard">Wizard</a>, che serve per connettere un template alla logica di un passo di un <a href="?path=/story/components-wizard--wizard">Wizard</a> a fasi multiple.\n\n## Implementazione\n<div class="table-responsive">`import { Step } from \'@inail/internet-webkit\';`</div>\n<br />\n\n***Struttura:***\n`constructor(id: any,\n  title: string,\n  hasError: boolean,\n  disabled: boolean,\n  visited?: boolean | undefined,\n  visible?: boolean,\n  hasWarning?: boolean | undefined)`\n\n***Esempio d\'uso:***\n<br />\n`step = new Step(\'step3\', \'Warning/Error Step\', true, false, false, true, true)`\n\n## API\n<div class="table-responsive">\n  <table class="table">\n  <thead>\n    <tr>\n      <th><strong>Campo</strong></th>\n      <th><strong>Descrizione</strong></th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td><code>id</code></td>\n      <td>\n        Campo di tipo any che assegna un id a uno step.\n      </td>\n    </tr>\n    <tr>\n      <td><code>title</code></td>\n      <td>\n        Campo di tipo string che imposta il titolo che viene visualizzatto nel <a href="?path=/story/components-wizard--wizard">Wizard</a>.\n      </td>\n    </tr>\n    <tr>\n      <td><code>hasError</code></td>\n      <td>\n        Campo di tipo booleano che indica se lo step presenta un errore, influenzando anche la sua visualizzazione. La logica può essere gestita in base alle necessità dell\'uso di uno step del <a href="?path=/story/components-wizard--wizard">Wizard</a>.\n        <br />\n        ***Esempio:*** Uno step del <a href="?path=/story/components-wizard--wizard">Wizard</a> contiene un form con dei campi obbligatori non completati dall\'utente. Se l\'utente passa a un altro step, questo mostrerà un\'icona di errore e diventerà rosso per segnalare l\'errore all\'utente.\n      </td>\n    </tr>\n    <tr>\n      <td><code>disabled</code></td>\n      <td>\n        Campo di tipo booleano che si usa per disabilitare uno step del <a href="?path=/story/components-wizard--wizard">Wizard</a>.\n      </td>\n    </tr>\n    <tr>\n      <td><code>visited</code></td>\n      <td>\n        Campo di tipo booleano non obbligatorio che si usa per segnalare che uno step del <a href="?path=/story/components-wizard--wizard">Wizard</a> è stato gia visitato. Se non ci sono errori in questo step (segnalati tramite `hasError`) lo step mostrerà un\' icona check e diventerà verde.\n      </td>\n    </tr>\n    <tr>\n      <td><code>visible</code></td>\n      <td>\n        Campo booleano non obbligatorio che si usa per mostrare/nascondere uno step.\n      </td>\n    </tr>\n    <tr>\n      <td><code>hasWarning</code></td>\n      <td>\n        Campo di tipo booleano non obbligatorio che viene utilizzato per mostrare un\'icona di warning al posto del numero di step normalmente visualizzato.\n      </td>\n    </tr>\n  </tbody>\n</table>\n</div>\n\n## Casi d\'utilizzo\n<br />\n<a href="?path=/story/components-wizard--wizard">Wizard</a>\n'));function _createMdxContent(props){return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(dist.W8,{title:"Resources/Models/Step"}),"\n",(0,jsx_runtime.jsx)(StepReader,{})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={...(0,lib.R)(),...props.components};return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,{...props,children:(0,jsx_runtime.jsx)(_createMdxContent,{...props})}):_createMdxContent()}}}]);