import{S as F,i as ee,s as te,l as b,p as k,h as A,Q as ne,b as u,k as V,R as oe,n as C,f as y,C as $,c,m,t as d,a as v,d as h}from"./index-2c1648fc.js";import{g as se,a as ae}from"./spread-8a54911c.js";import{p as re,M as ge,T as ce,S as _}from"./collect-stories-640c7888.js";import{G}from"./GraphicBlock-3f8c4735.js";import{b as P,w as me}from"./withParams-47e2ab71.js";import"./Block-d69850f9.js";import"./PaddingReset-05774ed0.js";import"./marked.esm-76161808.js";const de=`The \`GraphicBlock\` component is a special derivative of the [\`Block\`](./?path=/docs/layout-block) component that also handles text elements around a graphic. Many other components use this one to wrap graphics with styled text. When you use it, you'll also wrap your chart elements or component with it like this: --- \`\`\`svelte