text: (self.webpackChunkdocusaurus_template=self.webpackChunkdocusaurus_template||[]).push([[12169],{62435:function(e,n,t){"use strict";t.d(n,{wF:function(){return r},l3:function(){return i},VG:function(){return o}});var a=t.p+"assets/medias/browser-privileged-update-d9baeff585c2a00d88b6d4b42614317f.mp4",s=t.p+"assets/medias/browser-privileged-update-1f0a8534724a1c3e63af722453ea483e.webm",i={browser:{label:"Browser UI",image:t(30442).Z,alt:"User Profile HTML Form with validation errors"},missing:{label:"Not An Email",language:"shell",code:t(86866).Z}},r={browser:{label:"Browser UI",image:t(7837).Z,alt:"User Registration HTML Form with validation errors"},missing:{label:"Missing Password",language:"shell",code:t(64785).Z},wrong:{label:"Password Policy Violation",language:"shell",code:t(49122).Z}},o={mp4:a,webm:s}},58215:function(e,n,t){"use strict";var a=t(67294);n.Z=function(e){var n=e.children,t=e.hidden,s=e.className;return a.createElement("div",{role:"tabpanel",hidden:t,className:s},n)}},55064:function(e,n,t){"use strict";t.d(n,{Z:function(){return u}});var a=t(22122),s=t(67294),i=t(72389),r=t(79443);var o=function(){var e=(0,s.useContext)(r.Z);if(null==e)throw new Error('"useUserPreferencesContext" is used outside of "Layout" component.');return e},l=t(83039),c=t(86010),d="tabItem_1uMI";function p(e){var n,t,a,i=e.lazy,r=e.block,p=e.defaultValue,u=e.values,m=e.groupId,f=e.className,h=s.Children.map(e.children,(function(e){if((0,s.isValidElement)(e)&&void 0!==e.props.value)return e;throw new Error("Docusaurus error: Bad <Tabs> child <"+("string"==typeof e.type?e.type:e.type.name)+'>: all children of the <Tabs> component should be <TabItem>, and every <TabItem> should have a unique "value" prop.')})),g=null!=u?u:h.map((function(e){var n=e.props;return{value:n.value,label:n.label}})),v=(0,l.lx)(g,(function(e,n){return e.value===n.value}));if(v.length>0)throw new Error('Docusaurus error: Duplicate values "'+v.map((function(e){return e.value})).join(", ")+'" found in <Tabs>. Every value needs to be unique.');var w=null===p?p:null!=(n=null!=p?p:null==(t=h.find((function(e){return e.props.default})))?void 0:t.props.value)?n:null==(a=h[0])?void 0:a.props.value;if(null!==w&&!g.some((function(e){return e.value===w})))throw new Error('Docusaurus error: The <Tabs> has a defaultValue "'+w+'" but none of its children has the corresponding value. Available values are: '+g.map((function(e){return e.value})).join(", ")+". If you intend to show no default tab, use defaultValue={null} instead.");var b=o(),k=b.tabGroupChoices,y=b.setTabGroupChoices,T=(0,s.useState)(w),x=T[0],N=T[1],S=[],E=(0,l.o5)().blockElementScrollPositionUntilNextRender;if(null!=m){var j=k[m];null!=j&&j!==x&&g.some((function(e){return e.value===j}))&&N(j)}var C=function(e){var n=e.currentTarget,t=S.indexOf(n),a=g[t].value;a!==x&&(E(n),N(a),null!=m&&y(m,a))},F=function(e){var n,t=null;switch(e.key){case"ArrowRight":var a=S.indexOf(e.currentTarget)+1;t=S[a]||S[0];break;case"ArrowLeft":var s=S.indexOf(e.currentTarget)-1;t=S[s]||S[S.length-1]}null==(n=t)||n.focus()};return s.createElement("div",{className:"tabs-container"},s.createElement("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,c.Z)("tabs",{"tabs--block":r},f)},g.map((function(e){var n=e.value,t=e.label;return s.createElement("li",{role:"tab",tabIndex:x===n?0:-1,"aria-selected":x===n,className:(0,c.Z)("tabs__item",d,{"tabs__item--active":x===n}),key:n,ref:function(e){return S.push(e)},onKeyDown:F,onFocus:C,onClick:C},null!=t?t:n)}))),i?(0,s.cloneElement)(h.filter((function(e){return e.props.value===x}))[0],{className:"margin-vert--md"}):s.createElement("div",{className:"margin-vert--md"},h.map((function(e,n){return(0,s.cloneElement)(e,{key:n,hidden:e.props.value!==x})}))))}function u(e){var n=(0,i.Z)();return s.createElement(p,(0,a.Z)({key:String(n)},e))}},79443:function(e,n,t){"use strict";var a=(0,t(67294).createContext)(void 0);n.Z=a},26133:function(e,n,t){"use strict";var a=t(67294);n.Z=function(e){var n=e.severity,t=void 0===n?"info":n;return a.createElement("div",{className:"admonition admonition-warning alert alert--"+t},a.createElement("div",{className:"admonition-heading"},a.createElement("h5",null,a.createElement("span",{className:"admonition-icon"},a.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},a.createElement("path",{fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"severity")),a.createElement("div",{className:"admonition-content"},a.createElement("p",null,"This flow requires AJAX and you need to ensure that all cookies are sent using the appropriate CORS and ",a.createElement("code",null,"includeCredentials")," ","configurations. Additionally, Ory Kratos and your app must be hosted on the same domain.")))}},88821:function(e,n,t){"use strict";var a=t(67294);n.Z=function(){return a.createElement("div",{className:"admonition admonition-warning alert alert--danger"},a.createElement("div",{className:"admonition-heading"},a.createElement("h5",null,a.createElement("span",{className:"admonition-icon"},a.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},a.createElement("path",{fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"warning")),a.createElement("div",{className:"admonition-content"},a.createElement("p",null,"Never use API flows to implement Browser applications! Using API flows in Single-Page-Apps as well as server-side apps opens up several potential attack vectors, including Login and other CSRF attacks.")))}},12669:function(e,n,t){"use strict";var a=t(55064),s=t(58215),i=t(67294),r=t(11756),o=t(73295),l=t(25108),c=function(e){var n=e.item;return n.code?(l.warn(n.code,"asfd"),i.createElement(r.Z,{className:"language-"+n.language,children:n.code})):n.image?i.createElement("img",{src:n.image,alt:n.alt}):n.codeFromRemote?i.createElement(o.Z,{language:n.language,link:n.codeFromRemote.link,src:n.codeFromRemote.src}):i.createElement("span",null,"Unknown item type: $",JSON.stringify(n))};n.Z=function(e){var n=e.items;return i.createElement(a.Z,{defaultValue:Object.keys(n)[0],values:Object.keys(n).map((function(e){return{label:n[e].label,value:e}}))},Object.keys(n).map((function(e){return i.createElement(s.Z,{key:e,value:e},i.createElement(c,{item:n[e]}))})))}},15654:function(e,n,t){"use strict";t.d(n,{Z:function(){return u}});var a=t(55064),s=t(58215),i=t(67294),r=t(73295),o=t.p+"assets/images/browser-61597c2d37644d2e9a6cd62143a17d19.png",l=t.p+"assets/images/browser-3fffa4ddf3b8dbaa9171845af0b1ace3.png",c=t.p+"assets/images/browser-95c5fd81e495c104256cf0460ebd835a.png",d=t.p+"assets/images/browser-22673e53b8fd2d5b86732105f965b818.png",p=function(e){return e.charAt(0).toUpperCase()+e.slice(1)},u=function(e){var n,t=e.flow;switch(t){case"registration":n=i.createElement("img",{src:c,alt:"User Registration HTML Form"});break;case"login":n=i.createElement("img",{src:o,alt:"User Login HTML Form"});break;case"settings":n=i.createElement("img",{src:l,alt:"Profile Settings HTML Form"});break;case"recovery":n=i.createElement("img",{src:d,alt:"Account Recovery HTML Form"});break;case"verification":n=i.createElement("img",{src:d,alt:"Email Verification HTML Form"})}return i.createElement(a.Z,{defaultValue:"browser",values:[{label:"Browser UI",value:"browser"},{label:"Golang (API Flow)",value:"golang"},{label:"ExpressJS",value:"express"},{label:"ReactJS",value:"react"},{label:"React Native",value:"react-native"}]},i.createElement(s.Z,{value:"browser"},n),i.createElement(s.Z,{value:"express"},i.createElement(r.Z,{lang:"js",link:"https://github.com/ory/kratos-selfservice-ui-node/blob/master/src/routes/"+t+".ts",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-node/master/src/routes/"+t+".ts"}),"The views can be rather simple, as Ory Kratos provides you with all the information you need for rendering the forms. The following examples use Handlebars and a generic form generator to render the Flow:",i.createElement(a.Z,{defaultValue:"view",values:[{label:p(t)+" View",value:"view"},{label:"Generic Form View",value:"generic-form"},{label:"Example Input Form Element",value:"input-form"}]},i.createElement(s.Z,{value:"view"},i.createElement(r.Z,{lang:"handlebars",link:"https://github.com/ory/kratos-selfservice-ui-node/blob/master/views/"+t+".hbs",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-node/master/views/"+t+".hbs"})),i.createElement(s.Z,{value:"generic-form"},i.createElement(r.Z,{lang:"handlebars",link:"https://github.com/ory/kratos-selfservice-ui-node/blob/master/views/partials/ui.hbs",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-node/master/views/partials/ui.hbs"})),i.createElement(s.Z,{value:"input-form"},i.createElement(r.Z,{lang:"handlebars",link:"https://github.com/ory/kratos-selfservice-ui-node/blob/master/views/partials/ui_node_input_default.hbs",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-node/master/views/partials/ui_node_input_default.hbs"}))),"The rest of the form partials can be found"," ",i.createElement("a",{href:"https://github.com/ory/kratos-selfservice-ui-node/tree/master/views/partials"},"here"),"."),i.createElement(s.Z,{value:"react"},"A React example is currently in the making."),i.createElement(s.Z,{value:"golang"},i.createElement(r.Z,{lang:"tsx",link:"https://github.com/ory/kratos/blob/master/examples/go/selfservice/"+t+"/main.go.tsx",src:"https://raw.githubusercontent.com/ory/kratos/master/examples/go/selfservice/"+t+"/main.go"}),"The rest of the code examples partials can be found"," ",i.createElement("a",{href:"https://github.com/ory/kratos/blob/master/examples"},"here")),i.createElement(s.Z,{value:"react-native"},i.createElement(r.Z,{lang:"tsx",link:"https://github.com/ory/kratos-selfservice-ui-react-native/blob/master/src/components/Routes/"+p(t)+".tsx",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-react-native/master/src/components/Routes/"+p(t)+".tsx"}),"The views can be rather simple, as Ory Kratos provides you with all the information you need for rendering the forms.",i.createElement(a.Z,{defaultValue:"generic-form",values:[{label:"Generic Form View",value:"generic-form"},{label:"Example Input Form Element",value:"input-form"}]},i.createElement(s.Z,{value:"generic-form"},i.createElement(r.Z,{lang:"handlebars",link:"https://github.com/ory/kratos-selfservice-ui-react-native/blob/master/src/components/Form/Form.tsx",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-react-native/master/src/components/Form/Form.tsx"})),i.createElement(s.Z,{value:"input-form"},i.createElement(r.Z,{lang:"handlebars",link:"https://github.com/ory/kratos-selfservice-ui-react-native/blob/master/src/components/Form/Field.tsxs",src:"https://raw.githubusercontent.com/ory/kratos-selfservice-ui-react-native/master/src/components/Form/Field.tsx"}))),"The rest of the form partials can be found"," ",i.createElement("a",{href:"https://github.com/ory/kratos-selfservice-ui-react-native/tree/master/src"},"here")))}},73295:function(e,n,t){"use strict";t.d(n,{Z:function(){return d}});var a=t(67294),s=t(83300),i=t.n(s),r=t(11756),o="container_2x1S",l=t(25108),c=function(e,n){if(!e)return 0;var t=n.findIndex((function(n){return n.indexOf(e)>-1}));return-1===t?0:t},d=function(e){var n=e.src,t=e.title,s=(0,a.useState)(""),d=s[0],p=s[1];(0,a.useEffect)((function(){var t,a,s;i()(n.replace("github.com","raw.githubusercontent.com").replace("/blob/","/")).then((function(e){return e.text()})).then((t=e,a=t.startAt,s=t.endAt,function(e){var n=e.split("\n"),t=c(a,n);t>0&&(n=["// ..."].concat(n.slice(t,-1)));var i=c(s,n);return i>0&&(n=[].concat(n.slice(0,i+1),["// ..."])),n.join("\n")})).then(p).catch(l.error)}),[]);var u="language-"+function(e){var n=e.split(".").pop();switch(n){case"jsx":return"jsx";case"tsx":return"tsx";case"ts":return"typescript";case"go":return"go";case"yaml":case"yml":return"yaml";case"js":return"javascript";case"html":return"html";case"pug":return"pug";default:return n}}(n),m='title="'+(t||function(e){var n=e.match(new RegExp("https://github.com/[^/]+/[^/]+/blob/[^/]+/(.+)","i"))||[];return n.length>=2?n[1]:e}(n))+'"';return a.createElement("div",{className:o},a.createElement(r.Z,{metastring:m,className:u,children:d}))}},92256:function(e,n,t){"use strict";var a=t(67294);n.Z=function(e){var n=e.severity,t=void 0===n?"info":n;return a.createElement("div",{className:"admonition admonition-warning alert alert--"+t},a.createElement("div",{className:"admonition-heading"},a.createElement("h5",null,a.createElement("span",{className:"admonition-icon"},a.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},a.createElement("path",{fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"severity")),a.createElement("div",{className:"admonition-content"},a.createElement("p",null,"Ory Kratos and your UI must be on the hosted on same top level domain! You can not host Ory Kratos and your UI on separate top level domains:"),a.createElement("ul",null,a.createElement("li",null,a.createElement("code",null,"kratos.bar.com")," and ",a.createElement("code",null,"ui.bar.com")," will work;"),a.createElement("li",null,a.createElement("code",null,"kratos.bar.com")," and ",a.createElement("code",null,"bar.com")," will work;"),a.createElement("li",null,a.createElement("code",null,"kratos.bar.com")," and ",a.createElement("code",null,"not-ar.com")," will not work."))))}},32527:function(e,n,t){"use strict";t.d(n,{Z:function(){return m}});var a=t(67294),s=t(21140),i=t.n(s),r="graph_1lrJ",o="pointer_3d8u",l="overlay_2fuY",c="visible_2Z3U",d="backdrop_2z5L",p=t(94184),u=t.n(p);i().initialize({startOnLoad:!0,logLevel:"fatal",securityLevel:"strict",arrowMarkerAbsolute:!1,theme:"neutral",flowchart:{useMaxWidth:!0,htmlLabels:!0,rankSpacing:65,nodeSpacing:30,curve:"basis"},sequence:{useMaxWidth:!0},gantt:{useMaxWidth:!0}});var m=function(e){var n,t=e.chart,s=(0,a.useState)(!1),p=s[0],m=s[1],f=(0,a.useState)(void 0),h=f[0],g=f[1],v=(0,a.useState)("mermaid-"+Math.random().toString(36).substr(2,-1))[0],w=function(){return m(!p)};return(0,a.useEffect)((function(){i().render(v,t,(function(e){g(e)}))}),[]),a.createElement(a.Fragment,null,a.createElement("div",{onClick:w,className:u()(r,o),dangerouslySetInnerHTML:{__html:h}}),a.createElement("div",{onClick:w,className:u()(l,o,r,(n={},n[c]=p,n))},a.createElement("div",{onClick:function(e){return e.stopPropagation()},className:u()(d,r),dangerouslySetInnerHTML:{__html:h}})))}},19582:function(e,n,t){"use strict";var a=t(67294),s=t(32527);n.Z=function(e){return a.createElement(s.Z,{chart:(n=e,t=n.flows,i=void 0===t?["login","registration","settings","..."]:t,r=n.interactions,o=void 0===r?['"Log in"','"Sign Up"','"Update Email"',"..."]:r,l=n.success,c=void 0===l?"Perform flow-specific action (e.g. create user, set session cookie, ...)":l,d=i.length>1?"<"+i.join("|")+">":""+i.join("|"),"\nsequenceDiagram\n  participant B as API Client\n  participant K as Ory Kratos\n\n  B->>K: REST GET /self-service/"+d+"/api\n  K--\x3e>K: Create and store new "+i.join(", ")+" flow\n  K->>B: HTTP 200 OK with flow as application/json payload\n  B--\x3e>B: Render form using e.g. Native iOS UI Elements\n  B--\x3e>B: User fills out forms, clicks e.g. "+o+"\n  B->>K: REST POST to e.g. /self-service/"+d+"?flow=...>\n  K--\x3e>K: Validates and processes payload\n  alt Form payload is valid\n    K->>B: "+c+"\n  else Form payload invalid\n    K--\x3e>K: Update and store flow (e.g. add form validation errors)\n    K->>B: Respond with e.g. HTTP 400 Bad Request and updated flow as payload\n    B--\x3e>B: Render form and validation errors using e.g. Native iOS UI Elements\n    B--\x3e>K: Repeat flow with input data, submit, validate, ...\n  end\n")});var n,t,i,r,o,l,c,d}},64923:function(e,n,t){"use strict";var a=t(67294),s=t(32527);n.Z=function(e){return a.createElement(a.Fragment,null,a.createElement(s.Z,{chart:(n=e,t=n.flows,i=void 0===t?["login","registration","settings","..."]:t,r=n.interactions,o=void 0===r?['"Log in"','"Sign Up"','"Update Email"',"..."]:r,l=n.success,c=void 0===l?"Perform flow-specific action (e.g. create user, set session cookie, ...)":l,d=i.length>1?"<"+i.join("|")+">":""+i.join("|"),"\nsequenceDiagram\n\n  participant B as Browser\n  participant K as Ory Kratos\n  participant A as Flow UI\n\n  B->>K: Follow link to /self-service/"+d+"/browser\n  K--\x3e>K: Create and store new "+i.join(", ")+" flow\n  K->>B: HTTP 302 Found <selfservice.flows."+d+".ui_url>?flow=<flow-id>\n\n  B->>A: Opens <selfservice.flows.<"+i.join("|")+">.ui_url>?flow=<flow-id>\n  A--\x3e>K: Fetches data to render forms using /selfservice/"+d+"/flows?id=<flow-id>\n  B--\x3e>A: Fills out forms, clicks e.g. "+o.join(", ")+"\n  B->>K: Submits form\n  K--\x3e>K: Validates and processes form payloads\n\n  alt Form payload is valid\n    K->>B: "+c+"\n  else Form payload invalid\n    K--\x3e>K: Update and store flow (e.g. add form validation errors)\n    K--\x3e>B: HTTP 302 Found <selfservice.flows."+d+".ui_url>?flow=<flow-id>\n    B->>A: Opens <selfservice.flows."+d+"?flow=<flow-id>\n    A--\x3e>K: Fetches data to render form fields and errors\n    B->>K: Repeat flow with input data, submit, validate, ...\n  end\n")}),a.createElement("p",null,"The ",a.createElement("em",null,"Flow UI")," (",a.createElement("strong",null,"your application!"),') is responsible for rendering the actual Login and Registration HTML Forms. You can of course implement one app for rendering all the Login, Registration, ... screens, and another app (think "Service Oriented Architecture", "Micro-Services" or "Service Mesh") is responsible for rendering your Dashboards, Management Screens, and so on.'));var n,t,i,r,o,l,c,d}},44212:function(e,n,t){"use strict";var a=t(67294),s=t(32527);n.Z=function(e){return a.createElement(s.Z,{chart:(n=e,t=n.flows,i=void 0===t?["login","registration","settings","..."]:t,r=n.interactions,o=void 0===r?['"Log in"','"Sign Up"','"Update Email"',"..."]:r,l=n.success,c=void 0===l?"Perform flow-specific action (e.g. create user, set session cookie, ...)":l,d=i.length>1?"<"+i.join("|")+">":""+i.join("|"),"\nsequenceDiagram\n  participant B as AJAX Client\n  participant K as Ory Kratos\n\n  B->>K: REST GET /self-service/"+d+"/browser\n  K--\x3e>K: Create and store new "+i.join(", ")+" flow\n  K->>B: HTTP 200 OK with flow as application/json payload\n  B--\x3e>B: Render form using HTML input elements\n  B--\x3e>B: User fills out forms, clicks e.g. "+o+"\n  B->>K: REST POST to e.g. /self-service/"+d+"?flow=...>\n  K--\x3e>K: Validates and processes payload\n  alt Form payload is valid\n    K->>B: "+c+"\n  else Form payload invalid\n    K--\x3e>K: Update and store flow (e.g. add form validation errors)\n    K->>B: Respond with e.g. HTTP 400 Bad Request and updated flow as payload\n    B--\x3e>B: Render form and validation errors using HTML input elements\n    B--\x3e>K: Repeat flow with input data, submit, validate, ...\n  end\n")});var n,t,i,r,o,l,c,d}},99797:function(e,n,t){"use strict";t.r(n),t.d(n,{frontMatter:function(){return b},contentTitle:function(){return k},metadata:function(){return y},toc:function(){return T},default:function(){return N}});var a=t(22122),s=t(19756),i=(t(67294),t(3905)),r=t(32527),o=t(88821),l=t(64923),c=t(19582),d=t(44212),p=t(12669),u=t(62435),m=t(15654),f=t(26133),h=t(55064),g=t(58215),v=t(92256),w=["components"],b={id:"user-settings",title:"User Settings and Profile Updates"},k=void 0,y={unversionedId:"self-service/flows/user-settings",id:"self-service/flows/user-settings",isDocsHomePage:!1,title:"User Settings and Profile Updates",description:"getFlowMethodPasswordWithErrors,",source:"@site/docs/self-service/flows/user-settings.mdx",sourceDirName:"self-service/flows",slug:"/self-service/flows/user-settings",permalink:"/kratos/docs/next/self-service/flows/user-settings",editUrl:"https://github.com/ory/kratos/edit/master/docs/docs/self-service/flows/user-settings.mdx",tags:[],version:"current",lastUpdatedBy:"Vincent",lastUpdatedAt:1628585413,formattedLastUpdatedAt:"8/10/2021",frontMatter:{id:"user-settings",title:"User Settings and Profile Updates"},sidebar:"docs",previous:{title:"User Login",permalink:"/kratos/docs/next/self-service/flows/user-login"},next:{title:"Account Recovery and Password Reset",permalink:"/kratos/docs/next/self-service/flows/account-recovery"}},T=[{value:"Updating Privileged Fields",id:"updating-privileged-fields",children:[],level:3},{value:"Initialize Settings Flow",id:"initialize-settings-flow",children:[{value:"User and Profile Settings for Server-Side Browser Clients",id:"user-and-profile-settings-for-server-side-browser-clients",children:[],level:3},{value:"User and Profile Settings for Client-Side (AJAX) Browser Clients",id:"user-and-profile-settings-for-client-side-ajax-browser-clients",children:[],level:3},{value:"User and Profile Settings Updates for API Clients and Clients without Browsers",id:"user-and-profile-settings-updates-for-api-clients-and-clients-without-browsers",children:[],level:3}],level:2},{value:"Settings Flow Payloads",id:"settings-flow-payloads",children:[{value:"Update Profile",id:"update-profile",children:[],level:3},{value:"Update Password",id:"update-password",children:[],level:3},{value:"Link and Unlink from Google, Facebook, GitHub, ..., OpenID Connect / OAuth 2.0",id:"link-and-unlink-from-google-facebook-github--openid-connect--oauth-20",children:[],level:3}],level:2},{value:"Settings Form Validation",id:"settings-form-validation",children:[{value:"Update Profile",id:"update-profile-1",children:[],level:3},{value:"Update Password",id:"update-password-1",children:[],level:3},{value:"Un-/Linking from/with Google, Facebook, GitHub, ..., OpenID Connect / OAuth 2.0",id:"un-linking-fromwith-google-facebook-github--openid-connect--oauth-20",children:[],level:3}],level:2},{value:"Successful Settings Update",id:"successful-settings-update",children:[{value:"Server-Side Browser Clients",id:"server-side-browser-clients",children:[],level:3},{value:"Client-Side Browser Clients",id:"client-side-browser-clients",children:[],level:3},{value:"API Clients and Clients without Browsers",id:"api-clients-and-clients-without-browsers",children:[],level:3}],level:2},{value:"Code Examples for NodeJS, ReactJS, Go, ...",id:"code-examples-for-nodejs-reactjs-go-",children:[],level:2},{value:"Hooks",id:"hooks",children:[],level:2}],x={toc:T};function N(e){var n=e.components,t=(0,s.Z)(e,w);return(0,i.kt)("wrapper",(0,a.Z)({},x,t,{components:n,mdxType:"MDXLayout"}),(0,i.kt)("div",{className:"admonition admonition-info alert alert--info"},(0,i.kt)("div",{parentName:"div",className:"admonition-heading"},(0,i.kt)("h5",{parentName:"div"},(0,i.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,i.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"14",height:"16",viewBox:"0 0 14 16"},(0,i.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"}))),"info")),(0,i.kt)("div",{parentName:"div",className:"admonition-content"},(0,i.kt)("p",{parentName:"div"},"Please read the ",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/self-service"},"Self-Service Flows")," overview before\ncontinuing with this document."))),(0,i.kt)("p",null,"Ory Kratos allows users to update their own settings and profile information\nusing two principal flows:"),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"Flows where the user sits in front of the Browser and the application is",(0,i.kt)("ul",{parentName:"li"},(0,i.kt)("li",{parentName:"ul"},"a server-side application (e.g. NodeJS, Java, ...)"),(0,i.kt)("li",{parentName:"ul"},"a client-side application (e.g. ReactJS, AngularJS, ...)"))),(0,i.kt)("li",{parentName:"ul"},"Flows where API interaction is required (e.g. mobile app, Smart TV, ...)")),(0,i.kt)("p",null,"The Settings Flow is composed of several high-level steps summarized in this\nstate diagram:"),(0,i.kt)(r.Z,{chart:'\nstateDiagram\n  s1: Flow is initialized\n  s2: Execute Before Settings Hook(s)\n  s3: User Interface renders Settings Flow Forms\n  s4: Check if privileged fields were updated\n  s8: Ask user to sign in again/confirm with password\n  s7: Execute After Settings Hook(s)\n  s5: Update Settings Flow with error context(s)\n  s6: Settings update successful\n\t[*] --\x3e s1 : User clicks "Save changes"\n  s1 --\x3e s2\n  s2 --\x3e Error : A hook fails\n  s2 --\x3e s3\n  s3 --\x3e s4 : User provides valid form data\n  s3 --\x3e s5 : User provides invalid form data\n  s5 --\x3e s3\n  s7 --\x3e Error : A hook fails\n  s4 --\x3e s8: yes\n  s4 --\x3es7: no\n  s8--\x3e s7: Authentication successful\n  s7 --\x3e s6\n  s6 --\x3e [*]\n  Error --\x3e [*]\n',mdxType:"Mermaid"}),(0,i.kt)("p",null,"Currently, three settings methods are supported:"),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},(0,i.kt)("inlineCode",{parentName:"li"},"password")," for updating the password used to sign in;"),(0,i.kt)("li",{parentName:"ul"},(0,i.kt)("inlineCode",{parentName:"li"},"oidc")," for un-/linking from social sign in providers such as Google or\nFacebook;"),(0,i.kt)("li",{parentName:"ul"},(0,i.kt)("inlineCode",{parentName:"li"},"profile")," for updating an identity's traits (e.g. change the first name). The\nupdated traits must be valid against the Identity Schema defined for its\n",(0,i.kt)("a",{parentName:"li",href:"/kratos/docs/next/concepts/identity-schema"},"Identity Traits"),".")),(0,i.kt)(h.Z,{defaultValue:"oss",values:[{label:"Ory Cloud Platform",value:"ocp"},{label:"Ory Kratos",value:"oss"}],mdxType:"Tabs"},(0,i.kt)(g.Z,{value:"ocp",mdxType:"TabItem"},(0,i.kt)("p",null,"Currently, only the password and profile method are enabled.")),(0,i.kt)(g.Z,{value:"oss",mdxType:"TabItem"},(0,i.kt)("p",null,"You can configure which methods to use in the Ory Kratos config:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-yaml",metastring:'title="path/to/my/kratos/config.yml"',title:'"path/to/my/kratos/config.yml"'},"selfservice:\n  methods:\n    password:\n      enabled: true\n    oidc:\n      enabled: true\n    profile:\n      enabled: true\n  # ...\n")))),(0,i.kt)("h3",{id:"updating-privileged-fields"},"Updating Privileged Fields"),(0,i.kt)("p",null,"Most Settings Flow Methods allow the user to update fields which are considered\nprotected:"),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"The ",(0,i.kt)("inlineCode",{parentName:"li"},"password")," method allows updating the password, which is a protected\nfield;"),(0,i.kt)("li",{parentName:"ul"},"The ",(0,i.kt)("inlineCode",{parentName:"li"},"profile")," method allows updating protected fields such as",(0,i.kt)("ul",{parentName:"li"},(0,i.kt)("li",{parentName:"ul"},"the username or email address used to sign in;"),(0,i.kt)("li",{parentName:"ul"},"the recovery email address;"))),(0,i.kt)("li",{parentName:"ul"},"The ",(0,i.kt)("inlineCode",{parentName:"li"},"oidc")," method allows linking and unlinking from Google, Facebook, Github,\n... which is considered a privileged action (check out the\n",(0,i.kt)("a",{parentName:"li",href:"/kratos/docs/next/guides/sign-in-with-github-google-facebook-linkedin"},"set up guide"),").")),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-yaml",metastring:'title="path/to/kratos/config.yml"',title:'"path/to/kratos/config.yml"'},"selfservice:\n  flows:\n    settings:\n      # Sessions older than a minute requires the user to sign in again before\n      # the password is changed.\n      privileged_session_max_age: 1m\n")),(0,i.kt)(h.Z,{defaultValue:"oss",values:[{label:"Ory Cloud Platform",value:"ocp"},{label:"Ory Kratos",value:"oss"}],mdxType:"Tabs"},(0,i.kt)(g.Z,{value:"ocp",mdxType:"TabItem"},(0,i.kt)("p",null,"If any of these fields are changed, the Ory Kratos Login Session must not be\nolder than the configured ",(0,i.kt)("inlineCode",{parentName:"p"},"privileged_session_max_age")," value."),(0,i.kt)("p",null,"An option to configure this value is on the roadmap for OCP.")),(0,i.kt)(g.Z,{value:"oss",mdxType:"TabItem"},(0,i.kt)("p",null,"If any of these fields are changed, the Ory Kratos Login Session must not be\nolder than the configured ",(0,i.kt)("inlineCode",{parentName:"p"},"privileged_session_max_age")," value:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-yaml",metastring:'title="path/to/kratos/config.yml"',title:'"path/to/kratos/config.yml"'},"selfservice:\n  flows:\n    settings:\n      # Sessions older than a minute requires the user to sign in again before\n      # the password is changed.\n      privileged_session_max_age: 1m\n")))),(0,i.kt)("p",null,"If the Ory Kratos Login Session is older than the specified amount, the user is\nprompted to re-authenticate similar to the\n",(0,i.kt)("a",{parentName:"p",href:"https://help.github.com/en/github/authenticating-to-github/sudo-mode"},"GitHub sudo mode"),":"),(0,i.kt)("video",{controls:!0,width:"100%"},(0,i.kt)("source",{src:u.VG.webm,type:"video/webm"}),(0,i.kt)("source",{src:u.VG.mp4,type:"video/mp4"}),"Sorry, your browser doesn't support embedded videos."),(0,i.kt)("p",null,"This end-user experience currently works only for Browser-based Settings Flows.\nAPI-based flows will simply return a 403 Forbidden status message which require\nyou to request a new Ory Kratos Login session using the\n",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/self-service/flows/user-login"},"API-based Login Flow"),"."),(0,i.kt)("h2",{id:"initialize-settings-flow"},"Initialize Settings Flow"),(0,i.kt)(v.Z,{mdxType:"DomainWarning"}),(0,i.kt)("p",null,"The first step is to initialize the settings flow. This allows pre-settings\nhooks to run, set up Anti-CSRF tokens, and more. Each Settings Flow also has a\n",(0,i.kt)("inlineCode",{parentName:"p"},"state")," field which can either be ",(0,i.kt)("inlineCode",{parentName:"p"},"success")," or ",(0,i.kt)("inlineCode",{parentName:"p"},"show_form"),":"),(0,i.kt)(r.Z,{chart:"\nstateDiagram\n  [*] --\x3e show_form\n  show_form --\x3e show_form : Form payload is not valid\n  show_form --\x3e success : Form payload is valid\n  success --\x3e [*]\n",mdxType:"Mermaid"}),(0,i.kt)("p",null,"Keep in mind that initializing a Settings Flow requires a valid Ory Session\nToken (for API-based flows) or Ory Session Cookie (for Browser-based flows)!"),(0,i.kt)("p",null,"Before we start with the examples below, let's create a user using the API-based\nRegistration Flow. This will yield a session token which then use to perform the\nSettings Flow on this page:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'username=dev+docs.$(date +%s)@ory.sh\npassword=$(openssl rand -base64 12)\n\nactionUrl=$(curl -s -H "Accept: application/json" \\\n  \'https://playground.projects.oryapis.com/api/kratos/public/self-service/registration/api\' | jq -r \'.ui.action\')\n\nsession=$(curl -s  -X POST -H "Accept: application/json" -H "Content-Type: application/json" \\\n  --data \'{ "traits.email": "\'$username\'", "password": "\'$password\'", "method": "password" }\' \\\n  "$actionUrl")\n\nsessionToken=$(echo $session | jq -r \'.session_token\')\necho $sessionToken\n')),(0,i.kt)("h3",{id:"user-and-profile-settings-for-server-side-browser-clients"},"User and Profile Settings for Server-Side Browser Clients"),(0,i.kt)("p",null,"The settings flow for browser clients relies on HTTP redirects between Ory\nKratos, your Settings UI, and the end-user's browser:"),(0,i.kt)(l.Z,{flows:["settings"],success:"Identity Updated and HTTP 302 redirect to Success Flow",interactions:['"Save Profile Changes"'],mdxType:"SelfServiceBrowserFlow"}),(0,i.kt)("p",null,"Before we start, we need to log in the user we created:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell"},'# We use this cookie jar to initiate the settings flow in the next step!\ncookieJar=$(mktemp)\n\n# Initialize the flow\nflow=$( \\\n    curl -s -H "Accept: application/json"  --cookie $cookieJar --cookie-jar $cookieJar \\\n      \'https://playground.projects.oryapis.com/api/kratos/public/self-service/login/browser\' \\\n  )\n\n# Get the action URL\nactionUrl=$(echo $flow | jq -r \'.ui.action\')\n\n# Get the CSRF Token\ncsrfToken=$(echo $flow | jq -r \'.ui.nodes[] | select(.attributes.name=="csrf_token") | .attributes.value\')\n\n# Complete the login (with the user we created before)\nsession=$( \\\n  curl -s --cookie $cookieJar --cookie-jar $cookieJar -X POST \\\n    -H "Accept: application/json" -H "Content-Type: application/json" \\\n    --data \'{ "password_identifier": "\'$username\'", "password": "\'$password\'", "method": "password", "csrf_token": "\'$csrfToken\'" }\' \\\n    "$actionUrl" \\\n)\n\necho $session | jq\n')),(0,i.kt)("p",null,"To initialize the Settings Flow, point the Browser to the initialization\nendpoint:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell-session"},'$ curl -s -i -X GET \\\n    --cookie $cookieJar --cookie-jar $cookieJar \\\n    -H "Accept: text/html" \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser\n\nHTTP/2 302\ndate: Fri, 09 Jul 2021 11:07:48 GMT\ncontent-type: text/html; charset=utf-8\ncontent-length: 120\nlocation: https://playground.projects.oryapis.com/hosted/settings?flow=95efce11-0bd2-4f55-abce-180ced8b69d7\ncache-control: private, no-cache, no-store, must-revalidate\nvary: Origin\nvary: Cookie\nstrict-transport-security: max-age=15724800; includeSubDomains\n\n<a href="https://playground.projects.oryapis.com/hosted/settings?flow=95efce11-0bd2-4f55-abce-180ced8b69d7">Found</a>.\n')),(0,i.kt)("p",null,"The server responds with a HTTP 302 redirect to the Settings UI, appending the\n",(0,i.kt)("inlineCode",{parentName:"p"},"?flow=<flow-id>")," query parameter (see the curl example) to the configured\nsettings URL."),(0,i.kt)(h.Z,{defaultValue:"oss",values:[{label:"Ory Cloud Platform",value:"ocp"},{label:"Ory Kratos",value:"oss"}],mdxType:"Tabs"},(0,i.kt)(g.Z,{value:"ocp",mdxType:"TabItem"},(0,i.kt)("p",null,"The Ory Cloud Platform offers a default UI implementation. Pointing to another\nUI endpoint will be supported in the future.")),(0,i.kt)(g.Z,{value:"oss",mdxType:"TabItem"},(0,i.kt)("p",null,"You can configure which login URL to use in the Ory Kratos config:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-yaml",metastring:'title="path/to/config/kratos.yml"',title:'"path/to/config/kratos.yml"'},"selfservice:\n  flows:\n    settings:\n      # becomes http://127.0.0.1:4455/auth/settings?flow=df607aa1-d555-4b2a-b3e4-0f5a1d2fe6f3\n      ui_url: http://127.0.0.1:4455/auth/settings\n")))),(0,i.kt)("h3",{id:"user-and-profile-settings-for-client-side-ajax-browser-clients"},"User and Profile Settings for Client-Side (AJAX) Browser Clients"),(0,i.kt)("p",null,"The Settings Flow for client-side browser clients relies on AJAX requests."),(0,i.kt)(f.Z,{mdxType:"AjaxWarning"}),(0,i.kt)(d.Z,{flows:["settings"],success:"Identity Updated and HTTP 200 OK",interactions:['"Save Profile Changes"'],mdxType:"SelfServiceSpaFlow"}),(0,i.kt)("p",null,"To initialize the Settings Flow, point the Browser to the initialization\nendpoint:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell-session"},'$ curl -v -s -X GET \\\n    --cookie $cookieJar --cookie-jar $cookieJar \\\n    -H "Accept: application/json"  \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser | jq\n\n> GET /api/kratos/public/self-service/settings/browser HTTP/2\n> Host: playground.projects.oryapis.com\n> User-Agent: curl/7.64.1\n> Accept: application/json\n\n< HTTP/2 200\n< date: Fri, 09 Jul 2021 09:36:34 GMT\n< content-type: application/json; charset=utf-8\n< content-length: 1241\n< cache-control: private, no-cache, no-store, must-revalidate\n< set-cookie: aHR0cHM6Ly9wbGF5Z3JvdW5kLnByb2plY3RzLm9yeWFwaXMuY29tL2FwaS9rcmF0b3MvcHVibGlj_csrf_token=wSDoLSdDqNJv2uWVWdv5euaQo9UimCFS1GhXokTLU3o=; Path=/api/kratos/public; Domain=playground.projects.oryapis.com; Max-Age=31536000; HttpOnly; Secure; SameSite=None\n< vary: Origin\n< vary: Cookie\n< strict-transport-security: max-age=15724800; includeSubDomains\n<\n\n{\n  "id": "4074acf9-5025-469b-be9c-9bc776b4a862",\n  "type": "browser",\n  "expires_at": "2021-07-09T10:36:34.04310083Z",\n  "issued_at": "2021-07-09T09:36:34.04310083Z",\n  "request_url": "http://playground.projects.oryapis.com/self-service/settings/browser",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings?flow=4074acf9-5025-469b-be9c-9bc776b4a862",\n    "method": "POST",\n    "nodes": [ /* ... */ ]\n  }\n}\n')),(0,i.kt)("h3",{id:"user-and-profile-settings-updates-for-api-clients-and-clients-without-browsers"},"User and Profile Settings Updates for API Clients and Clients without Browsers"),(0,i.kt)(o.Z,{mdxType:"ApiWarning"}),(0,i.kt)("p",null,"The Settings Flow for API clients does not use HTTP Redirects and can be\nsummarized as follows:"),(0,i.kt)(c.Z,{flows:["settings"],success:"Identity Updated and HTTP 200 OK",interactions:['"Save Profile Changes"'],mdxType:"SelfServiceApiFlow"}),(0,i.kt)("p",null,"To initialize the API flow, the client calls the API-flow initialization\nendpoint\n(",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/reference/api#initialize-settings-flow-for-api-clients"},"REST API Reference"),")\nwhich returns a JSON response:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell-session"},'$ curl -s -X GET \\\n    -H "Accept: application/json" \\\n    -H "Authorization: bearer $sessionToken" \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/api | jq\n\n{\n  "id": "20d5c364-663f-47e6-bd06-2944aa288f55",\n  "type": "api",\n  "expires_at": "2021-07-09T12:10:36.109455077Z",\n  "issued_at": "2021-07-09T11:10:36.109455077Z",\n  "request_url": "http://playground.projects.oryapis.com/self-service/settings/api",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings?flow=20d5c364-663f-47e6-bd06-2944aa288f55",\n    "method": "POST",\n    "nodes": [ /* ... */ ]\n  },\n  "identity": {\n    "id": "7130f345-8506-4c13-869b-d0e8341ff585",\n    "schema_id": "default",\n    "schema_url": "https://playground.projects.oryapis.com/api/kratos/public/schemas/default",\n    "state": "active",\n    "state_changed_at": "2021-07-09T11:06:02.23703Z",\n    "traits": {\n      "email": "dev+docs.1625828760@ory.sh"\n    },\n    "verifiable_addresses": [\n      {\n        "id": "a5c0a49b-aa8d-44fd-ae20-361136a7260e",\n        "value": "dev+docs.1625828760@ory.sh",\n        "verified": false,\n        "via": "email",\n        "status": "sent",\n        "verified_at": null,\n        "created_at": "2021-07-09T11:06:02.244136Z",\n        "updated_at": "2021-07-09T11:06:02.244136Z"\n      }\n    ],\n    "recovery_addresses": [\n      {\n        "id": "ac4b8521-905c-4492-9b9c-c877d94ca7db",\n        "value": "dev+docs.1625828760@ory.sh",\n        "via": "email",\n        "created_at": "2021-07-09T11:06:02.249405Z",\n        "updated_at": "2021-07-09T11:06:02.249405Z"\n      }\n    ],\n    "created_at": "2021-07-09T11:06:02.239075Z",\n    "updated_at": "2021-07-09T11:06:02.239075Z"\n  },\n  "state": "show_form"\n}\n')),(0,i.kt)("h2",{id:"settings-flow-payloads"},"Settings Flow Payloads"),(0,i.kt)("p",null,"Fetching the Settings Flow\n(",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/reference/api#get-settings-flow"},"REST API Reference"),") is usually\nonly required for browser clients but also works for Settings Flows initialized\nby API clients. All you need is a valid flow ID:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell-session"},'$ flowId=$(curl -s -X GET \\\n    -H "Accept: application/json" \\\n    -H "Authorization: bearer $sessionToken" \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/api | jq -r \'.id\')\n\n$ curl -s -X GET \\\n    -H "Accept: application/json" \\\n    -H "Authorization: bearer $sessionToken" \\\n    "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=$flowId" | jq\n\n{\n  "id": "260196cc-cd99-40b8-a9b1-8afc06c08afc",\n  "type": "api",\n  "expires_at": "2021-07-09T11:05:43.388907Z",\n  "issued_at": "2021-07-09T10:05:43.388907Z",\n  "request_url": "http://playground.projects.oryapis.com/self-service/registration/api",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/registration?flow=260196cc-cd99-40b8-a9b1-8afc06c08afc",\n    "method": "POST",\n    "nodes": [ /* ... */ ]\n  }\n}\n')),(0,i.kt)("h3",{id:"update-profile"},"Update Profile"),(0,i.kt)("p",null,"When the ",(0,i.kt)("inlineCode",{parentName:"p"},"profile")," method is enabled, it will be part of the ",(0,i.kt)("inlineCode",{parentName:"p"},"methods")," payload\nin the Settings Flow:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken"  \\\n    -H "Accept: application/json"  \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/api | jq -r \'.ui.nodes[] | select(.group=="profile")\'\n\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "traits.email",\n    "type": "email",\n    "value": "dev+docs.1625828760@ory.sh",\n    "disabled": false\n  },\n  "messages": [],\n  "meta": {\n    "label": {\n      "id": 1070002,\n      "text": "E-Mail",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "method",\n    "type": "submit",\n    "value": "profile",\n    "disabled": false\n  },\n  "messages": [],\n  "meta": {\n    "label": {\n      "id": 1070003,\n      "text": "Save",\n      "type": "info"\n    }\n  }\n}\n')),(0,i.kt)("p",null,"The form fields depend on the\n",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/concepts/identity-schema"},"Identity Schema"),"."),(0,i.kt)("h3",{id:"update-password"},"Update Password"),(0,i.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,i.kt)("div",{parentName:"div",className:"admonition-heading"},(0,i.kt)("h5",{parentName:"div"},(0,i.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,i.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,i.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"Before you start")),(0,i.kt)("div",{parentName:"div",className:"admonition-content"},(0,i.kt)("p",{parentName:"div"},"Please read the\n",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/concepts/credentials/username-email-password"},"Username / Email & Password Credentials Documentation"),"\nfirst."))),(0,i.kt)("p",null,"When the ",(0,i.kt)("inlineCode",{parentName:"p"},"password")," method is enabled, it will be part of the ",(0,i.kt)("inlineCode",{parentName:"p"},"methods")," payload\nin the Settings Flow:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken"  \\\n    -H "Accept: application/json"  \\\n    https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/api | jq -r \'.ui.nodes[] | select(.group=="password")\'\n\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "password",\n    "type": "password",\n    "required": true,\n    "disabled": false\n  },\n  "messages": [],\n  "meta": {\n    "label": {\n      "id": 1070001,\n      "text": "Password",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "method",\n    "type": "submit",\n    "value": "password",\n    "disabled": false\n  },\n  "messages": [],\n  "meta": {\n    "label": {\n      "id": 1070003,\n      "text": "Save",\n      "type": "info"\n    }\n  }\n}\n')),(0,i.kt)("h3",{id:"link-and-unlink-from-google-facebook-github--openid-connect--oauth-20"},"Link and Unlink from Google, Facebook, GitHub, ..., OpenID Connect / OAuth 2.0"),(0,i.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,i.kt)("div",{parentName:"div",className:"admonition-heading"},(0,i.kt)("h5",{parentName:"div"},(0,i.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,i.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,i.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"Before you start")),(0,i.kt)("div",{parentName:"div",className:"admonition-content"},(0,i.kt)("p",{parentName:"div"},"Check out the\n",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/guides/sign-in-with-github-google-facebook-linkedin"},"Sign in with GitHub, Google, ... Guide"),"\nand learn how to set up this method!"))),(0,i.kt)("p",null,"When the ",(0,i.kt)("inlineCode",{parentName:"p"},"oidc")," method is enabled, it will be part of the ",(0,i.kt)("inlineCode",{parentName:"p"},"methods")," payload in\nthe Settings Flow:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken"  \\\n    -H "Accept: application/json"  \\\n    \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=14cbf9a7-0c71-46e9-b3b9-806cb7859145\' | \\\n      jq -r \'.ui.nodes[] | select(.group=="oidc")\'\n\n{\n  "type": "input",\n  "group": "oidc",\n  "attributes": {\n    "name": "link",\n    "type": "submit",\n    "value": "github",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1050002,\n      "text": "Link github",\n      "type": "info",\n      "context": {\n        "provider": "github"\n      }\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "oidc",\n  "attributes": {\n    "name": "unlink",\n    "type": "submit",\n    "value": "google",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1050003,\n      "text": "Unlink google",\n      "type": "info",\n      "context": {\n        "provider": "google"\n      }\n    }\n  }\n}\n')),(0,i.kt)("div",{className:"admonition admonition-warning alert alert--danger"},(0,i.kt)("div",{parentName:"div",className:"admonition-heading"},(0,i.kt)("h5",{parentName:"div"},(0,i.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,i.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,i.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"warning")),(0,i.kt)("div",{parentName:"div",className:"admonition-content"},(0,i.kt)("p",{parentName:"div"},"Social Sign In is currently not possible for API Clients. It will be possible in\na future version, which is partially tracked as\n",(0,i.kt)("a",{parentName:"p",href:"https://github.com/ory/kratos/issues/273"},"kratos#273")))),(0,i.kt)("h2",{id:"settings-form-validation"},"Settings Form Validation"),(0,i.kt)("p",null,"The form payloads are then submitted to Ory Kratos which follows up with:"),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"An HTTP 302 Found redirect pointing to the Registration UI for Browser\nClients;"),(0,i.kt)("li",{parentName:"ul"},"An ",(0,i.kt)("inlineCode",{parentName:"li"},"application/json")," response for API Clients and Client-Side Browser\napplications (e.g. Single Page Apps).")),(0,i.kt)("p",null,"When validation errors happen, browser clients receive a HTTP 302 Found redirect\nto the Settings Flow UI, containing the Settings Flow ID which includes the\nerror payloads. For API Clients, the server typically responds with HTTP 400 Bad\nRequest ",(0,i.kt)("inlineCode",{parentName:"p"},"application/json")," and the Settings Flow in the response payload as\nJSON."),(0,i.kt)("h3",{id:"update-profile-1"},"Update Profile"),(0,i.kt)("p",null,"To complete the profile update, the end-user fills out the presented profile\nform (e.g. updates their first name or email address). Possible validation\nerrors include JSON Schema validation errors (e.g. ",(0,i.kt)("inlineCode",{parentName:"p"},'"format": "email"')," not\nrespected):"),(0,i.kt)(p.Z,{items:u.l3,mdxType:"CodeTabs"}),(0,i.kt)("h3",{id:"update-password-1"},"Update Password"),(0,i.kt)("p",null,"To change the password, the end-user fills out the presented form and provides a\nnew password. Possible validation errors include not providing the password or\nproviding a password which does not match the password policy:"),(0,i.kt)(p.Z,{items:u.wF,mdxType:"CodeTabs"}),(0,i.kt)("h3",{id:"un-linking-fromwith-google-facebook-github--openid-connect--oauth-20"},"Un-/Linking from/with Google, Facebook, GitHub, ..., OpenID Connect / OAuth 2.0"),(0,i.kt)("p",null,"To link or unlink from an OpenID Connect or OAuth2 provider such as Google,\nGitHub, Facebook, the user either clicks the unlink or link button depending on\nthe interaction."),(0,i.kt)("p",null,"There are no expected validation errors except for an error where the profile\n(e.g. Google) to be linked is already linked with another identity in the\nsystem. This will currently result in a system error but will be a validation\nerror in the future (tracked as\n",(0,i.kt)("a",{parentName:"p",href:"https://github.com/ory/kratos/issues/694"},"kratos#694"),")."),(0,i.kt)("h2",{id:"successful-settings-update"},"Successful Settings Update"),(0,i.kt)("p",null,"Completing the settings update behaves differently for Browser and API Clients."),(0,i.kt)("h3",{id:"server-side-browser-clients"},"Server-Side Browser Clients"),(0,i.kt)("p",null,"When the profile update is completed successfully, Ory Kratos responds with a\nHTTP 302 Redirect to the Settings UI which now contains the success state\n(",(0,i.kt)("inlineCode",{parentName:"p"},"state: success"),") as well as the updated identity:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell-session"},'$ curl -s -X GET \\\n    --cookie $cookieJar --cookie-jar $cookieJar \\\n    -H "Accept: application/json"  \\\n    \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=f71743cd-700d-4a30-9275-8edc90de07cc\' | \\\n      jq\n\n{\n  "id": "f71743cd-700d-4a30-9275-8edc90de07cc",\n  "type": "browser",\n  "expires_at": "2021-04-28T12:39:36.804397011Z",\n  "issued_at": "2021-04-28T11:39:36.804397011Z",\n  "request_url": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings?flow=f71743cd-700d-4a30-9275-8edc90de07cc",\n    "method": "POST",\n    "nodes": [\n      {\n        "type": "input",\n        "group": "default",\n        "attributes": {\n          "name": "csrf_token",\n          "type": "hidden",\n          "value": "ZujkLxomQjFczI0iVkG7E8+yGQ3ouIF2E9msj9gvHPjZPs+wnptmG2Qeg6RVNVh1NktGMfwYBP9AqzYna2m0nw==",\n          "required": true,\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {}\n      },\n      {\n        "type": "input",\n        "group": "profile",\n        "attributes": {\n          "name": "traits.email",\n          "type": "email",\n          "value": "notanemail",\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070002,\n            "text": "E-Mail",\n            "type": "info"\n          }\n        }\n      },\n      {\n        "type": "input",\n        "group": "profile",\n        "attributes": {\n          "name": "traits.name.first",\n          "type": "text",\n          "value": "",\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070002,\n            "text": "First Name",\n            "type": "info"\n          }\n        }\n      },\n      {\n        "type": "input",\n        "group": "profile",\n        "attributes": {\n          "name": "traits.name.last",\n          "type": "text",\n          "value": "",\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070002,\n            "text": "Last Name",\n            "type": "info"\n          }\n        }\n      },\n      {\n        "type": "input",\n        "group": "profile",\n        "attributes": {\n          "name": "method",\n          "type": "submit",\n          "value": "profile",\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070003,\n            "text": "Save",\n            "type": "info"\n          }\n        }\n      },\n      {\n        "type": "input",\n        "group": "password",\n        "attributes": {\n          "name": "password",\n          "type": "password",\n          "required": true,\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070001,\n            "text": "Password",\n            "type": "info"\n          }\n        }\n      },\n      {\n        "type": "input",\n        "group": "password",\n        "attributes": {\n          "name": "method",\n          "type": "submit",\n          "value": "password",\n          "disabled": false\n        },\n        "messages": null,\n        "meta": {\n          "label": {\n            "id": 1070003,\n            "text": "Save",\n            "type": "info"\n          }\n        }\n      }\n    ],\n    "messages": [\n      {\n        "id": 1050001,\n        "text": "Your changes have been saved!",\n        "type": "info"\n      }\n    ]\n  },\n  "identity": {\n    "id": "5b23b651-c186-4398-8717-f15ac72cbc7e",\n    "schema_id": "default",\n    "schema_url": "https://playground.projects.oryapis.com/api/kratos/public/schemas/default",\n    "traits": {\n      "email": "example.user@ory.sh"\n    },\n    "verifiable_addresses": [\n      {\n        "id": "d2214ea2-8b0e-49c0-a9e0-9998ea4527aa",\n        "value": "example.user@ory.sh",\n        "verified": false,\n        "via": "email",\n        "status": "pending",\n        "verified_at": null\n      }\n    ],\n    "recovery_addresses": [\n      {\n        "id": "29ef1378-0f13-4f2e-a9cf-683320771d5b",\n        "value": "example.user@ory.sh",\n        "via": "email"\n      }\n    ]\n  },\n  "state": "success"\n}\n')),(0,i.kt)("p",null,"You may also\n",(0,i.kt)("a",{parentName:"p",href:"../../concepts/browser-redirect-flow-completion"},"configure a redirect URL"),"\ninstead which would send the end-user to that configured URL."),(0,i.kt)("h3",{id:"client-side-browser-clients"},"Client-Side Browser Clients"),(0,i.kt)("p",null,"When the update is completed successfully, Ory Kratos response with a HTTP 200\nOK message containing the updated identity:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'password=ByS8NWuFSkDgMjbe\n\n# Initialize the flow\nflow=$( \\\n    curl -s -H "Accept: application/json" --cookie $cookieJar --cookie-jar $cookieJar \\\n      \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser\' \\\n  )\n\n# Get the action URL\nactionUrl=$(echo $flow | jq -r \'.ui.action\')\n\n# Get the CSRF Token\ncsrfToken=$(echo $flow | jq -r \'.ui.nodes[] | select(.attributes.name=="csrf_token") | .attributes.value\')\n\n# Complete the login (with the user we created before)\nsession=$( \\\n  curl -s --cookie $cookieJar --cookie-jar $cookieJar -X POST \\\n    -H "Accept: application/json" -H "Content-Type: application/json" \\\n    --data \'{"password": "\'$password\'", "method": "password", "csrf_token": "\'$csrfToken\'" }\' \\\n    "$actionUrl" \\\n)\n\n{\n  "id": "f71743cd-700d-4a30-9275-8edc90de07cc",\n  "type": "browser",\n  "expires_at": "2021-04-28T12:39:36.804397011Z",\n  "issued_at": "2021-04-28T11:39:36.804397011Z",\n  "request_url": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings?flow=f71743cd-700d-4a30-9275-8edc90de07cc",\n    "method": "POST",\n    "nodes": [\n      // ...\n    ],\n    "messages": [\n      {\n        "id": 1050001,\n        "text": "Your changes have been saved!",\n        "type": "info"\n      }\n    ]\n  },\n  "identity": {\n    "id": "5b23b651-c186-4398-8717-f15ac72cbc7e",\n    "schema_id": "default",\n    "schema_url": "https://playground.projects.oryapis.com/api/kratos/public/schemas/default",\n    "traits": {\n      "email": "example.user@ory.sh"\n    },\n    "verifiable_addresses": [\n      {\n        "id": "d2214ea2-8b0e-49c0-a9e0-9998ea4527aa",\n        "value": "example.user@ory.sh",\n        "verified": false,\n        "via": "email",\n        "status": "pending",\n        "verified_at": null\n      }\n    ],\n    "recovery_addresses": [\n      {\n        "id": "29ef1378-0f13-4f2e-a9cf-683320771d5b",\n        "value": "example.user@ory.sh",\n        "via": "email"\n      }\n    ]\n  },\n  "state": "success"\n}\n')),(0,i.kt)("h3",{id:"api-clients-and-clients-without-browsers"},"API Clients and Clients without Browsers"),(0,i.kt)("p",null,"For API Clients, Ory Kratos responds with a JSON payload which includes the\nupdated identity:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-shell",metastring:"script",script:!0},'password=ByS8NWuFSkDgMjbe\n\nactionUrl=$(curl -s -H "Accept: application/json" \\\n  -H "Authorization: bearer $sessionToken" \\\n  \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/api\' | jq -r \'.ui.action\')\n\ncurl -s -X POST -H "Accept: application/json" -H "Content-Type: application/json" \\\n    -H "Authorization: bearer $sessionToken" \\\n    -d \'{"password": "\'$password\'", "method": "password"}\' \\\n    "$actionUrl" | jq\n\n{\n  "id": "f71743cd-700d-4a30-9275-8edc90de07cc",\n  "type": "browser",\n  "expires_at": "2021-04-28T12:39:36.804397011Z",\n  "issued_at": "2021-04-28T11:39:36.804397011Z",\n  "request_url": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/browser",\n  "ui": {\n    "action": "https://playground.projects.oryapis.com/api/kratos/public/self-service/settings?flow=f71743cd-700d-4a30-9275-8edc90de07cc",\n    "method": "POST",\n    "nodes": [\n      // ...\n    ],\n    "messages": [\n      {\n        "id": 1050001,\n        "text": "Your changes have been saved!",\n        "type": "info"\n      }\n    ]\n  },\n  "identity": {\n    "id": "5b23b651-c186-4398-8717-f15ac72cbc7e",\n    "schema_id": "default",\n    "schema_url": "https://playground.projects.oryapis.com/api/kratos/public/schemas/default",\n    "traits": {\n      "email": "example.user@ory.sh"\n    },\n    "verifiable_addresses": [\n      {\n        "id": "d2214ea2-8b0e-49c0-a9e0-9998ea4527aa",\n        "value": "example.user@ory.sh",\n        "verified": false,\n        "via": "email",\n        "status": "pending",\n        "verified_at": null\n      }\n    ],\n    "recovery_addresses": [\n      {\n        "id": "29ef1378-0f13-4f2e-a9cf-683320771d5b",\n        "value": "example.user@ory.sh",\n        "via": "email"\n      }\n    ]\n  },\n  "state": "success"\n}\n')),(0,i.kt)("h2",{id:"code-examples-for-nodejs-reactjs-go-"},"Code Examples for NodeJS, ReactJS, Go, ..."),(0,i.kt)("p",null,"The Settings User Interface is a route (page / site) in your application\n(server, native app, single page app) that should render a settings form."),(0,i.kt)("p",null,"In stark contrast to other Identity Systems, Ory Kratos does not render this\nHTML. Instead, you need to implement the HTML code in your application (e.g.\nNodeJS + ExpressJS, Java, PHP, ReactJS, ...), which gives you extreme\nflexibility and customizability in your user interface flows and designs."),(0,i.kt)("p",null,"You will use the Settings Flow JSON response to render the settings form UI,\nwhich could looks as follows depending on your programming language and web\nframework:"),(0,i.kt)(m.Z,{flow:"settings",mdxType:"RenderFlow"}),(0,i.kt)("h2",{id:"hooks"},"Hooks"),(0,i.kt)("p",null,"Ory Kratos allows you to configure hooks that run before and after a profile\nupdate was successful. For more information about hooks please read the\n",(0,i.kt)("a",{parentName:"p",href:"/kratos/docs/next/self-service/hooks"},"Hook Documentation"),"."))}N.isMDXComponent=!0},11748:function(e,n,t){var a={"./locale":89234,"./locale.js":89234};function s(e){var n=i(e);return t(n)}function i(e){if(!t.o(a,e)){var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}return a[e]}s.keys=function(){return Object.keys(a)},s.resolve=i,e.exports=s,s.id=11748},83300:function(e,n){"use strict";var t=function(){if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;if(void 0!==t)return t;throw new Error("unable to locate global object")}();e.exports=n=t.fetch,t.fetch&&(n.default=t.fetch.bind(t)),n.Headers=t.Headers,n.Request=t.Request,n.Response=t.Response},64785:function(e,n){"use strict";n.Z='$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken"  \\\n    -H "Accept: application/json"  \\\n    \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=f71743cd-700d-4a30-9275-8edc90de07cc\' | \\\n      jq -r \'.ui.nodes[] | select(.group=="password")\'\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "password",\n    "type": "password",\n    "required": true,\n    "disabled": false\n  },\n  "messages": [\n    {\n      "id": 4000001,\n      "text": "length must be >= 1, but got 0",\n      "type": "error"\n    }\n  ],\n  "meta": {\n    "label": {\n      "id": 1070001,\n      "text": "Password",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "method",\n    "type": "submit",\n    "value": "password",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1070003,\n      "text": "Save",\n      "type": "info"\n    }\n  }\n}\n'},49122:function(e,n){"use strict";n.Z='$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken"  \\\n    -H "Accept: application/json"  \\\n    \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=f71743cd-700d-4a30-9275-8edc90de07cc\' | \\\n      jq -r \'.ui.nodes[] | select(.group=="password")\'\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "password",\n    "type": "password",\n    "required": true,\n    "disabled": false\n  },\n  "messages": [\n    {\n      "id": 4000005,\n      "text": "The password can not be used because the password has been found in data breaches and must no longer be used.",\n      "type": "error",\n      "context": {\n        "reason": "the password has been found in data breaches and must no longer be used."\n      }\n    }\n  ],\n  "meta": {\n    "label": {\n      "id": 1070001,\n      "text": "Password",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "password",\n  "attributes": {\n    "name": "method",\n    "type": "submit",\n    "value": "password",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1070003,\n      "text": "Save",\n      "type": "info"\n    }\n  }\n}\n'},86866:function(e,n){"use strict";n.Z='$ curl -s -X GET \\\n    -H "Authorization: Bearer $sessionToken" \\\n    -H "Accept: application/json" \\\n    \'https://playground.projects.oryapis.com/api/kratos/public/self-service/settings/flows?id=f71743cd-700d-4a30-9275-8edc90de07cc\' | \\\n      jq -r \'.ui.nodes[] | select(.group=="profile")\'\n\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "traits.email",\n    "type": "email",\n    "value": "notanemail",\n    "disabled": false\n  },\n  "messages": [\n    {\n      "id": 4000001,\n      "text": "\\"notanemail\\" is not valid \\"email\\"",\n      "type": "error"\n    }\n  ],\n  "meta": {\n    "label": {\n      "id": 1070002,\n      "text": "E-Mail",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "traits.name.first",\n    "type": "text",\n    "value": "",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1070002,\n      "text": "First Name",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "traits.name.last",\n    "type": "text",\n    "value": "",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1070002,\n      "text": "Last Name",\n      "type": "info"\n    }\n  }\n}\n{\n  "type": "input",\n  "group": "profile",\n  "attributes": {\n    "name": "method",\n    "type": "submit",\n    "value": "profile",\n    "disabled": false\n  },\n  "messages": null,\n  "meta": {\n    "label": {\n      "id": 1070003,\n      "text": "Save",\n      "type": "info"\n    }\n  }\n}\n'},7837:function(e,n,t){"use strict";n.Z=t.p+"assets/images/browser-password-missing-82cf4700a84269454ba45634383943fe.png"},30442:function(e,n,t){"use strict";n.Z=t.p+"assets/images/browser-profile-invalid-f0aee09bf26012c1338bc2b7b1ef69d9.png"}}]);