\n \n Dette er en feilmelding.\n \n\n \n Dette er en suksessmelding.\n \n\n \n Dette er en informasjonsmelding.\n \n\n \n Dette er en advarsel.\n \n

\n );\n};",{"_10":226,"_215":227,"_217":218},"AllColorsEn","const AllColorsEn = () => {\n return (\n

\n \n This is an error message.\n \n\n \n This is a success message.\n \n\n \n This is an informational message.\n \n\n \n This is a warning message.\n \n

\n );\n};","dodont",[],"mdxCode","var Component=(()=>{var p=Object.create;var s=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var g=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),y=(t,e)=>{for(var o in e)s(t,o,{get:e[o],enumerable:!0})},c=(t,e,o,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of l(e))!x.call(t,r)&&r!==o&&s(t,r,{get:()=>e[r],enumerable:!(i=h(e,r))||i.enumerable});return t};var _=(t,e,o)=>(o=t!=null?p(f(t)):{},c(e||!t||!t.__esModule?s(o,\"default\",{value:t,enumerable:!0}):o,t)),b=t=>c(s({},\"__esModule\",{value:!0}),t);var d=g((v,a)=>{a.exports=_jsx_runtime});var k={};y(k,{default:()=>m,frontmatter:()=>j});var n=_(d()),j=void 0;function u(t){let e={a:\"a\",p:\"p\",...t.components},{Alert:o}=e;return o||w(\"Alert\",!0),(0,n.jsx)(o,{\"data-color\":\"info\",children:(0,n.jsxs)(e.p,{children:[\"We are working to improve the accessibility documentation for this component. If you have questions or see something that should be prioritised, please contact us on \",(0,n.jsx)(e.a,{href:\"https://github.com/digdir/designsystemet/issues/new?template=1bug_report.yml\",children:\"Github\"}),\" or \",(0,n.jsx)(e.a,{href:\"https://designsystemet.no/slack\",children:\"Slack\"}),\".\"]})})}function m(t={}){let{wrapper:e}=t.components||{};return e?(0,n.jsx)(e,{...t,children:(0,n.jsx)(u,{...t})}):u(t)}function w(t,e){throw new Error(\"Expected \"+(e?\"component\":\"object\")+\" `\"+t+\"` to be defined: you likely forgot to import, pass, or provide it.\")}return b(k);})();\n;return Component;","metadata",{"_50":182,"_234":235,"_236":237},"subtitle","var Component=(()=>{var m=Object.create;var r=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var p=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var h=(e,n)=>()=>(n||e((n={exports:{}}).exports,n),n.exports),j=(e,n)=>{for(var t in n)r(e,t,{get:n[t],enumerable:!0})},c=(e,n,t,a)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let s of l(n))!_.call(e,s)&&s!==t&&r(e,s,{get:()=>n[s],enumerable:!(a=x(n,s))||a.enumerable});return e};var M=(e,n,t)=>(t=e!=null?m(p(e)):{},c(n||!e||!e.__esModule?r(t,\"default\",{value:e,enumerable:!0}):t,e)),g=e=>c(r({},\"__esModule\",{value:!0}),e);var d=h((D,i)=>{i.exports=_jsx_runtime});var y={};j(y,{default:()=>f,frontmatter:()=>w});var o=M(d()),w=void 0;function u(e){let n={code:\"code\",p:\"p\",...e.components};return(0,o.jsxs)(n.p,{children:[(0,o.jsx)(n.code,{children:\"ValidationMessage\"}),\" is used to display feedback related to the validation of user input, such as error messages or warnings in forms.\"]})}function f(e={}){let{wrapper:n}=e.components||{};return n?(0,o.jsx)(n,{...e,children:(0,o.jsx)(u,{...e})}):u(e)}return g(y);})();\n;return Component;","image","ValidationMessage.svg","linkMetadata",[240,242,246,250,252,254,257,259,261,264],{"_50":241},"ValidationMessage - Designsystemet",{"_10":243,"_244":245},"description","content","`ValidationMessage` is used to display feedback related to the validation of user input, such as error messages or warnings in forms.",{"_247":248,"_244":249},"property","og:image","/img/designsystemet-meta.png",{"_247":251,"_244":182},"og:title",{"_247":253,"_244":245},"og:description",{"_247":255,"_244":256},"og:url","https://designsystemet.no",{"_247":258,"_244":182},"twitter:title",{"_247":260,"_244":245},"twitter:description",{"_247":262,"_244":263},"twitter:card","summary_large_image",{"_247":265,"_244":249},"twitter:image","cssSource",".ds-validation-message{--dsc-validation-message-icon-url:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M7.74 2.47a.75.75 0 0 1 .53-.22h7.46a.75.75 0 0 1 .53.22l5.27 5.27c.14.14.22.33.22.53v7.46a.75.75 0 0 1-.22.53l-5.27 5.27a.75.75 0 0 1-.53.22H8.27a.75.75 0 0 1-.53-.22l-5.27-5.27a.75.75 0 0 1-.22-.53V8.27a.75.75 0 0 1 .22-.53zm1.29 5.5a.75.75 0 0 0-1.06 1.06L10.94 12l-2.97 2.97a.75.75 0 1 0 1.06 1.06L12 13.06l2.97 2.97a.75.75 0 1 0 1.06-1.06L13.06 12l2.97-2.97a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E\");--dsc-validation-message-icon-size:var(--ds-size-7);--dsc-validation-message-spacing:var(--ds-size-2);--dsc-validation-message-color:var(--ds-color-danger-text-subtle);color:var(--dsc-validation-message-color);margin:0;-webkit-padding-start:calc(var(--dsc-validation-message-icon-size) + var(--dsc-validation-message-spacing));padding-inline-start:calc(var(--dsc-validation-message-icon-size) + var(--dsc-validation-message-spacing));position:relative;-webkit-print-color-adjust:exact;print-color-adjust:exact}.ds-validation-message:before{background:currentcolor;content:\"\";height:var(--dsc-validation-message-icon-size);margin-inline:calc((var(--dsc-validation-message-icon-size) + var(--dsc-validation-message-spacing))*-1);-webkit-mask:var(--dsc-validation-message-icon-url) center /contain no-repeat;mask:var(--dsc-validation-message-icon-url) center /contain no-repeat;position:absolute;translate:0 calc((1lh - var(--dsc-validation-message-icon-size))/2);width:var(--dsc-validation-message-icon-size)}@media (forced-colors:active){.ds-validation-message:before{background:CanvasText}}.ds-validation-message[data-color=success]{--dsc-validation-message-icon-url:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 21.75a9.75 9.75 0 1 0 0-19.5 9.75 9.75 0 0 0 0 19.5m4.95-12.47a.81.81 0 0 0-1.24-1.05l-5.39 6.36-2.62-2.62a.81.81 0 0 0-1.15 1.15l3.25 3.25a.81.81 0 0 0 1.2-.05z'/%3E%3C/svg%3E\");--dsc-validation-message-color:var(--ds-color-success-text-subtle)}.ds-validation-message[data-color=warning]{--dsc-validation-message-icon-url:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2.25a.75.75 0 0 1 .66.39l9.52 17.25a.75.75 0 0 1-.65 1.11H2.47a.75.75 0 0 1-.65-1.11l9.52-17.25a.75.75 0 0 1 .66-.39m0 6.5a.75.75 0 0 1 .75.75v4a.75.75 0 0 1-1.5 0v-4a.75.75 0 0 1 .75-.75m-1 7.75a1 1 0 1 1 2 0 1 1 0 0 1-2 0'/%3E%3C/svg%3E\");--dsc-validation-message-color:var(--ds-color-warning-text-subtle)}.ds-validation-message[data-color=info]{--dsc-validation-message-icon-url:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M3.25 4A.75.75 0 0 1 4 3.25h16a.75.75 0 0 1 .75.75v16a.75.75 0 0 1-.75.75H4a.75.75 0 0 1-.75-.75zM11 7.75a1 1 0 1 1 2 0 1 1 0 0 1-2 0m-1.25 3a.75.75 0 0 1 .75-.75H12a.75.75 0 0 1 .75.75v4.75h.75a.75.75 0 0 1 0 1.5h-3a.75.75 0 0 1 0-1.5h.75v-4h-.75a.75.75 0 0 1-.75-.75'/%3E%3C/svg%3E\");--dsc-validation-message-color:var(--ds-color-info-text-subtle)}","cssVars",{"_270":271,"_272":273,"_274":275,"_276":277},"--dsc-validation-message-icon-url","url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M7.74 2.47a.75.75 0 0 1 .53-.22h7.46a.75.75 0 0 1 .53.22l5.27 5.27c.14.14.22.33.22.53v7.46a.75.75 0 0 1-.22.53l-5.27 5.27a.75.75 0 0 1-.53.22H8.27a.75.75 0 0 1-.53-.22l-5.27-5.27a.75.75 0 0 1-.22-.53V8.27a.75.75 0 0 1 .22-.53zm1.29 5.5a.75.75 0 0 0-1.06 1.06L10.94 12l-2.97 2.97a.75.75 0 1 0 1.06 1.06L12 13.06l2.97 2.97a.75.75 0 1 0 1.06-1.06L13.06 12l2.97-2.97a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E\")","--dsc-validation-message-icon-size","var(--ds-size-7)","--dsc-validation-message-spacing","var(--ds-size-2)","--dsc-validation-message-color","var(--ds-color-danger-text-subtle)","cssAttrs",{},"toc",[],"componentDocs",[284],{"_285":286,"_289":290,"_243":291,"_292":182,"_293":294,"_295":296},"tags",{"_287":288},"example","This is a danger validation message","filePath","/usr/src/app/packages/react/src/components/validation-message/validation-message.tsx","Use `ValidationMessage` to display validation text","displayName","methods",[],"props",{"_297":298},"asChild",{"_299":300,"_243":303,"_10":297,"_304":-7,"_305":306,"_311":312,"_313":314},"defaultValue",{"_301":302},"value","false","Change the default rendered element for the one passed as a child, merging their props and behavior.","parent","declarations",[307],{"_308":309,"_10":310},"fileName","app/packages/react/src/components/validation-message/validation-message.tsx","TypeLiteral","required",false,"type",{"_10":315},"boolean","navigation",{"_318":319,"_320":321,"_322":323},"overviewLink","/en/components/docs/validation-message/overview","codeLink","/en/components/docs/validation-message/code","accessibilityLink","/en/components/docs/validation-message/accessibility","githubLink","https://github.com/digdir/designsystemet/tree/main/apps/www/app/content/components/validation-message/en/accessibility.mdx","actionData","errors"]