@salesforce-ux/design-system/__internal/chunked/docs/ui/components/markdown/docs.mdx.js

Salesforce Lightning Design System

var SLDS;!function(){"use strict";var e,t,n,l={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},5351:function(e,t,n){n.r(t),n.d(t,{getContents:function(){return S},getElement:function(){return O}});var l=n(1594),r=n.n(l),a=n(5671),o=n(6547),c=(n(3212),n(1374),n(6955),n(538),n(5619),n(806)),i=n(8342),u=n(7412),s=n.n(u),d=n(942),m=n.n(d),p=function(e){var t=e.children;return r().createElement("div",{className:m()("slds-markdown")},t)};p.propTypes={children:s().node},p.defaultProps={};var E=p,f=[{id:"default",label:"Default",element:r().createElement(E,null,r().createElement("h1",null,"Heading 1"),r().createElement("p",null,"Paragraph"),r().createElement("h2",null,"Heading 2"),r().createElement("p",null,"Paragraph"),r().createElement("h3",null,"Heading 3"),r().createElement("p",null,"Paragraph"),r().createElement("h4",null,"Heading 4"),r().createElement("p",null,"Paragraph"),r().createElement("h5",null,"Heading 5"),r().createElement("p",null,"Paragraph"),r().createElement("h6",null,"Heading 6"),r().createElement("p",null,"Paragraph"),r().createElement("ul",null,r().createElement("li",null,"List item 1"),r().createElement("li",null,"List item 2"),r().createElement("li",null,"List item 3")),r().createElement("ol",null,r().createElement("li",null,"List item 1"),r().createElement("li",null,"List item 2"),r().createElement("li",null,"List item 3",r().createElement("ul",null,r().createElement("li",null,"List item 1"),r().createElement("li",null,"List item 2"),r().createElement("li",null,"List item 3")))),r().createElement("ul",null,r().createElement("li",null,r().createElement("input",{type:"checkbox",disabled:!0})," Milk"),r().createElement("li",null,r().createElement("input",{type:"checkbox",disabled:!0,checked:!0})," Eggs")),r().createElement("blockquote",null,r().createElement("p",null,"Blockquote"),r().createElement("blockquote",null,r().createElement("p",null,"Blockquote"))),r().createElement("pre",null,r().createElement("code",null,"let message = 'Hello world'; alert(message);")),r().createElement("p",null,"Inline ",r().createElement("code",null,"code blocks")," are supported."),r().createElement("p",null,"Press ",r().createElement("kbd",null,"Ctrl")," + ",r().createElement("kbd",null,"C")," to copy."),r().createElement("p",null,"This is ",r().createElement("mark",null,"highlighted text")," and ",r().createElement("del",null,"deleted text"),"."),r().createElement("p",null,"E = mc",r().createElement("sup",null,"2")," and H",r().createElement("sub",null,"2"),"O are chemical formulas."),r().createElement("table",{role:"table"},r().createElement("thead",null,r().createElement("tr",null,r().createElement("th",null,"Tables"),r().createElement("th",{align:"center"},"Are"),r().createElement("th",{align:"right"},"Cool"))),r().createElement("tbody",null,r().createElement("tr",null,r().createElement("td",null,"Row 1"),r().createElement("td",{align:"center"},"right-aligned"),r().createElement("td",{align:"right"},"$1600")),r().createElement("tr",null,r().createElement("td",null,"Row 2"),r().createElement("td",{align:"center"},"centered"),r().createElement("td",{align:"right"},"$12")),r().createElement("tr",null,r().createElement("td",null,r().createElement("code",null,"Row 3")),r().createElement("td",{align:"center"},r().createElement("em",null,"Emphasis")),r().createElement("td",{align:"right"},r().createElement("strong",null,"Strong"))))),r().createElement("p",null,"Links ",r().createElement("a",{href:"#"},"are supported"),". Code ",r().createElement("a",{href:"#"},r().createElement("code",null,"links"))," are supported."),r().createElement("hr",null),r().createElement("p",null,"Paragraph"))}],h=a.XB.code,g=a.XB.h2,b=a.XB.h3,y=a.XB.li,k=a.XB.p,v=a.XB.strong,w=a.XB.ul,O=function(){return(0,l.createElement)(a.Ay,{},(0,l.createElement)("div",{className:"doc lead"},"Markdown formatting is applied to the wrapping element to style common markdown elements including headings, lists, code blocks, tables, and blockquotes."),(0,l.createElement)(o.A,{exampleOnly:!0},(0,c.NO)(f)),g({id:"About-Markdown"},"About Markdown"),k({},"The Markdown component provides consistent styling for markdown-formatted content. Wrap your markdown HTML output with the ",h({},".slds-markdown")," class to apply these styles."),b({id:"Supported-Elements"},"Supported Elements"),k({},"The component includes styling for:"),w({},y({},v({},"Headings")," (h1-h6) with appropriate sizing and spacing"),y({},v({},"Lists")," (ordered and unordered) with proper indentation and nesting"),y({},v({},"Code blocks")," (",h({},"pre > code"),") with background and borders"),y({},v({},"Inline code")," with distinct styling"),y({},v({},"Tables")," with bordered cells and header styling"),y({},v({},"Blockquotes")," with left border accent"),y({},v({},"Horizontal rules")," with vertical spacing"),y({},v({},"Links")," with focus states and accessibility support"),y({},v({},"Paragraphs")," with contextual spacing")),b({id:"Accessibility"},"Accessibility"),k({},"When using the Markdown component, ensure your content maintains proper semantic HTML structure. Use appropriate heading levels in order (h1, h2, h3, etc.) to create a logical document outline for screen readers."),g({id:"Base"},"Base"),(0,l.createElement)(o.A,null,(0,c.NO)(f)),g({id:"Styling-Hooks-Overview"},"Styling Hooks Overview"),(0,l.createElement)(i.A,{name:"markdown",type:"component"}))},S=function(){return(0,a.Qr)(O())}}},r={};function a(e){var t=r[e];if(void 0!==t)return t.exports;var n=r[e]={id:e,exports:{}};return l[e](n,n.exports,a),n.exports}a.m=l,a.amdO={},e=[],a.O=function(t,n,l,r){if(!n){var o=1/0;for(s=0;s<e.length;s++){n=e[s][0],l=e[s][1],r=e[s][2];for(var c=!0,i=0;i<n.length;i++)(!1&r||o>=r)&&Object.keys(a.O).every(function(e){return a.O[e](n[i])})?n.splice(i--,1):(c=!1,r<o&&(o=r));if(c){e.splice(s--,1);var u=l();void 0!==u&&(t=u)}}return t}r=r||0;for(var s=e.length;s>0&&e[s-1][2]>r;s--)e[s]=e[s-1];e[s]=[n,l,r]},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},a.t=function(e,l){if(1&l&&(e=this(e)),8&l)return e;if("object"==typeof e&&e){if(4&l&&e.__esModule)return e;if(16&l&&"function"==typeof e.then)return e}var r=Object.create(null);a.r(r);var o={};t=t||[null,n({}),n([]),n(n)];for(var c=2&l&&e;("object"==typeof c||"function"==typeof c)&&!~t.indexOf(c);c=n(c))Object.getOwnPropertyNames(c).forEach(function(t){o[t]=function(){return e[t]}});return o.default=function(){return e},a.d(r,o),r},a.d=function(e,t){for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.e=function(){return Promise.resolve()},a.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.j=5864,function(){var e={5864:0};a.O.j=function(t){return 0===e[t]};var t=function(t,n){var l,r,o=n[0],c=n[1],i=n[2],u=0;if(o.some(function(t){return 0!==e[t]})){for(l in c)a.o(c,l)&&(a.m[l]=c[l]);if(i)var s=i(a)}for(t&&t(n);u<o.length;u++)r=o[u],a.o(e,r)&&e[r]&&e[r][0](),e[r]=0;return a.O(s)},n=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}(),a.nc=void 0;var o=a.O(void 0,[3540],function(){return a(5351)});o=a.O(o),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/markdown/docs.mdx.js"]=o}();