docs

docs/assets/Analytics.stories-bb6ec258.js

@@ -1,4 +1,4 @@
-import{S as J,i as P,s as U,D as F,C as A,g as f,y as h,m as d,d as p,t as $,h as y,f as u,j as v,o as E,n as q}from"./index-4f5e5369.js";import{g as K,a as W}from"./spread-8a54911c.js";import{p as Q,M as X,T as z,S as b}from"./collect-stories-6e37d46b.js";import{w as H,b as L}from"./withParams-47e2ab71.js";const V=`Add Google and Chartbeat analytics to your page.
+import{S as J,i as P,s as U,D as F,C as A,c as f,y as w,m as d,b as p,t as $,a as y,f as u,d as v,o as E,n as q}from"./index-22a9b7f9.js";import{g as K,a as W}from"./spread-8a54911c.js";import{p as Q,M as X,T as z,S as N}from"./collect-stories-4618f393.js";import{w as H,b as L}from"./withParams-47e2ab71.js";const V=`Add Google and Chartbeat analytics to your page.
 
 \`\`\`svelte
 <script>
@@ -58,8 +58,8 @@ For example, here's how you can use SvelteKit's [\`afterNavigate\`](https://kit.
 
 <Analytics />
 \`\`\`
-`,O="G-W3Q2X6NTNM",I=`https://www.googletagmanager.com/gtag/js?id=${O}`,ee=()=>{if(document.querySelector(`script[src="${I}"]`))return;const a=document.createElement("script"),t=document.getElementsByTagName("script")[0];a.type="text/javascript",a.async=!0,a.src=I,t.parentNode.insertBefore(a,t)},te=()=>{try{window.dataLayer=window.dataLayer||[],window.gtag||(ee(),window.gtag=function(){window.dataLayer.push(arguments)},window.gtag("js",new Date),window.gtag("config",O,{send_page_view:!1}),ne())}catch(a){console.warn(`Error initialising Google Analytics: ${a}`)}},ne=()=>{typeof window>"u"||!window.gtag||window.gtag("event","page_view",{page_location:window.location.origin+window.location.pathname,page_title:document==null?void 0:document.title})},se=52639,B="//static.chartbeat.com/js/chartbeat.js",ae=()=>{if(document.querySelector(`script[src="${B}"]`))return;const a=document.createElement("script"),t=document.getElementsByTagName("script")[0];a.type="text/javascript",a.async=!0,a.src=B,t.parentNode.insertBefore(a,t)},oe=a=>{window._sf_async_config={uid:se,domain:"reuters.com",flickerControl:!1,useCanonical:!0,useCanonicalDomain:!0,sections:"Graphics",authors:a.map(t=>(t==null?void 0:t.name)||"").join(","),...window._sf_async_config||{}};try{ae()}catch(t){console.warn(`Error initialising Chartbeat Analytics: ${t}`)}};function re(a,t,i){let{authors:s=[]}=t;return F(()=>{te(),oe(s)}),a.$$set=r=>{"authors"in r&&i(0,s=r.authors)},[s]}class w extends J{constructor(t){super(),P(this,t,re,null,U,{authors:0})}}w.__docgen={version:3,name:"Analytics.svelte",data:[{keywords:[],visibility:"public",description:"Used to associate a page with its author(s) in Chartbeat.",name:"authors",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"array",type:"array"}}],computed:[],methods:[{keywords:[],visibility:"public",description:"Register virtual pageviews when using client-side routing in multipage applications.",name:"registerPageview",static:!0}],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function ie(a){let t,i,s,r;const n=[a[0]];let l={};for(let o=0;o<n.length;o+=1)l=A(l,n[o]);return t=new w({props:l}),{c(){f(t.$$.fragment),i=h(),s=E("div"),s.textContent="Nothing to see here"},m(o,m){d(t,o,m),p(o,i,m),p(o,s,m),r=!0},p(o,m){const g=m&1?K(n,[W(o[0])]):{};t.$set(g)},i(o){r||($(t.$$.fragment,o),r=!0)},o(o){y(t.$$.fragment,o),r=!1},d(o){o&&(u(i),u(s)),v(t,o)}}}function ce(a){let t,i,s,r;return t=new w({}),{c(){f(t.$$.fragment),i=h(),s=E("div"),s.textContent="Nothing to see here"},m(n,l){d(t,n,l),p(n,i,l),p(n,s,l),r=!0},p:q,i(n){r||($(t.$$.fragment,n),r=!0)},o(n){y(t.$$.fragment,n),r=!1},d(n){n&&(u(i),u(s)),v(t,n)}}}function le(a){let t,i,s,r;return t=new w({}),{c(){f(t.$$.fragment),i=h(),s=E("div"),s.textContent="Nothing to see here"},m(n,l){d(t,n,l),p(n,i,l),p(n,s,l),r=!0},p:q,i(n){r||($(t.$$.fragment,n),r=!0)},o(n){y(t.$$.fragment,n),r=!1},d(n){n&&(u(i),u(s)),v(t,n)}}}function pe(a){let t,i,s,r,n,l,o,m,g,_;const x=[{title:"Components/Analytics"},{component:w},H(V)];let M={};for(let e=0;e<x.length;e+=1)M=A(M,x[e]);t=new X({props:M}),s=new z({props:{$$slots:{default:[ie,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:a}}}),n=new b({props:{name:"Default",args:{authors:[{name:"Jane Doe"},{name:"John Doe"}]}}});const S=[{name:"Environments"},L(Y)];let C={$$slots:{default:[ce]},$$scope:{ctx:a}};for(let e=0;e<S.length;e+=1)C=A(C,S[e]);o=new b({props:C});const j=[{name:"Multipage apps"},L(Z)];let N={$$slots:{default:[le]},$$scope:{ctx:a}};for(let e=0;e<j.length;e+=1)N=A(N,j[e]);return g=new b({props:N}),{c(){f(t.$$.fragment),i=h(),f(s.$$.fragment),r=h(),f(n.$$.fragment),l=h(),f(o.$$.fragment),m=h(),f(g.$$.fragment)},m(e,c){d(t,e,c),p(e,i,c),d(s,e,c),p(e,r,c),d(n,e,c),p(e,l,c),d(o,e,c),p(e,m,c),d(g,e,c),_=!0},p(e,[c]){const R={};t.$set(R);const k={};c&3&&(k.$$scope={dirty:c,ctx:e}),s.$set(k);const G={};c&2&&(G.$$scope={dirty:c,ctx:e}),o.$set(G);const T={};c&2&&(T.$$scope={dirty:c,ctx:e}),g.$set(T)},i(e){_||($(t.$$.fragment,e),$(s.$$.fragment,e),$(n.$$.fragment,e),$(o.$$.fragment,e),$(g.$$.fragment,e),_=!0)},o(e){y(t.$$.fragment,e),y(s.$$.fragment,e),y(n.$$.fragment,e),y(o.$$.fragment,e),y(g.$$.fragment,e),_=!1},d(e){e&&(u(i),u(r),u(l),u(m)),v(t,e),v(s,e),v(n,e),v(o,e),v(g,e)}}}class ue extends J{constructor(t){super(),P(this,t,null,pe,U,{})}}const D=Q(ue,{meta:{title:"Components/Analytics"},stories:{"tpl:default":{name:"default",template:!0,source:`<Analytics {...args} />
+`,O="G-W3Q2X6NTNM",I=`https://www.googletagmanager.com/gtag/js?id=${O}`,ee=()=>{if(document.querySelector(`script[src="${I}"]`))return;const a=document.createElement("script"),t=document.getElementsByTagName("script")[0];a.type="text/javascript",a.async=!0,a.src=I,t.parentNode.insertBefore(a,t)},te=()=>{try{window.dataLayer=window.dataLayer||[],window.gtag||(ee(),window.gtag=function(){window.dataLayer.push(arguments)},window.gtag("js",new Date),window.gtag("config",O,{send_page_view:!1}),ne())}catch(a){console.warn(`Error initialising Google Analytics: ${a}`)}},ne=()=>{typeof window>"u"||!window.gtag||window.gtag("event","page_view",{page_location:window.location.origin+window.location.pathname,page_title:document==null?void 0:document.title})},se=52639,B="//static.chartbeat.com/js/chartbeat.js",ae=()=>{if(document.querySelector(`script[src="${B}"]`))return;const a=document.createElement("script"),t=document.getElementsByTagName("script")[0];a.type="text/javascript",a.async=!0,a.src=B,t.parentNode.insertBefore(a,t)},oe=a=>{window._sf_async_config={uid:se,domain:"reuters.com",flickerControl:!1,useCanonical:!0,useCanonicalDomain:!0,sections:"Graphics",authors:a.map(t=>(t==null?void 0:t.name)||"").join(","),...window._sf_async_config||{}};try{ae()}catch(t){console.warn(`Error initialising Chartbeat Analytics: ${t}`)}};function re(a,t,i){let{authors:s=[]}=t;return F(()=>{te(),oe(s)}),a.$$set=r=>{"authors"in r&&i(0,s=r.authors)},[s]}class h extends J{constructor(t){super(),P(this,t,re,null,U,{authors:0})}}h.__docgen={version:3,name:"Analytics.svelte",data:[{keywords:[],visibility:"public",description:"Used to associate a page with its author(s) in Chartbeat.",name:"authors",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"array",type:"array"}}],computed:[],methods:[{keywords:[],visibility:"public",description:"Register virtual pageviews when using client-side routing in multipage applications.",name:"registerPageview",static:!0}],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function ie(a){let t,i,s,r;const n=[a[0]];let l={};for(let o=0;o<n.length;o+=1)l=A(l,n[o]);return t=new h({props:l}),{c(){f(t.$$.fragment),i=w(),s=E("div"),s.textContent="Nothing to see here"},m(o,m){d(t,o,m),p(o,i,m),p(o,s,m),r=!0},p(o,m){const g=m&1?K(n,[W(o[0])]):{};t.$set(g)},i(o){r||($(t.$$.fragment,o),r=!0)},o(o){y(t.$$.fragment,o),r=!1},d(o){o&&(u(i),u(s)),v(t,o)}}}function ce(a){let t,i,s,r;return t=new h({}),{c(){f(t.$$.fragment),i=w(),s=E("div"),s.textContent="Nothing to see here"},m(n,l){d(t,n,l),p(n,i,l),p(n,s,l),r=!0},p:q,i(n){r||($(t.$$.fragment,n),r=!0)},o(n){y(t.$$.fragment,n),r=!1},d(n){n&&(u(i),u(s)),v(t,n)}}}function le(a){let t,i,s,r;return t=new h({}),{c(){f(t.$$.fragment),i=w(),s=E("div"),s.textContent="Nothing to see here"},m(n,l){d(t,n,l),p(n,i,l),p(n,s,l),r=!0},p:q,i(n){r||($(t.$$.fragment,n),r=!0)},o(n){y(t.$$.fragment,n),r=!1},d(n){n&&(u(i),u(s)),v(t,n)}}}function pe(a){let t,i,s,r,n,l,o,m,g,_;const x=[{title:"Components/Analytics"},{component:h},H(V)];let M={};for(let e=0;e<x.length;e+=1)M=A(M,x[e]);t=new X({props:M}),s=new z({props:{$$slots:{default:[ie,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:a}}}),n=new N({props:{name:"Default",args:{authors:[{name:"Jane Doe"},{name:"John Doe"}]}}});const S=[{name:"Environments"},L(Y)];let b={$$slots:{default:[ce]},$$scope:{ctx:a}};for(let e=0;e<S.length;e+=1)b=A(b,S[e]);o=new N({props:b});const j=[{name:"Multipage apps"},L(Z)];let C={$$slots:{default:[le]},$$scope:{ctx:a}};for(let e=0;e<j.length;e+=1)C=A(C,j[e]);return g=new N({props:C}),{c(){f(t.$$.fragment),i=w(),f(s.$$.fragment),r=w(),f(n.$$.fragment),l=w(),f(o.$$.fragment),m=w(),f(g.$$.fragment)},m(e,c){d(t,e,c),p(e,i,c),d(s,e,c),p(e,r,c),d(n,e,c),p(e,l,c),d(o,e,c),p(e,m,c),d(g,e,c),_=!0},p(e,[c]){const R={};t.$set(R);const k={};c&3&&(k.$$scope={dirty:c,ctx:e}),s.$set(k);const G={};c&2&&(G.$$scope={dirty:c,ctx:e}),o.$set(G);const T={};c&2&&(T.$$scope={dirty:c,ctx:e}),g.$set(T)},i(e){_||($(t.$$.fragment,e),$(s.$$.fragment,e),$(n.$$.fragment,e),$(o.$$.fragment,e),$(g.$$.fragment,e),_=!0)},o(e){y(t.$$.fragment,e),y(s.$$.fragment,e),y(n.$$.fragment,e),y(o.$$.fragment,e),y(g.$$.fragment,e),_=!1},d(e){e&&(u(i),u(r),u(l),u(m)),v(t,e),v(s,e),v(n,e),v(o,e),v(g,e)}}}class ue extends J{constructor(t){super(),P(this,t,null,pe,U,{})}}const D=Q(ue,{meta:{title:"Components/Analytics"},stories:{"tpl:default":{name:"default",template:!0,source:`<Analytics {...args} />
 <div>Nothing to see here</div>`,hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},Environments:{name:"Environments",template:!1,source:`<Analytics />
 <div>Nothing to see here</div>`,hasArgs:!1},MultipageApps:{name:"Multipage apps",template:!1,source:`<Analytics />
-<div>Nothing to see here</div>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","environmentsDocs","multipageDocs","Analytics","withComponentDocs","withStoryDocs"]}),$e=D.meta,ye=["Default","Environments","MultipageApps"],ve=D.stories.Default,he=D.stories.Environments,we=D.stories.MultipageApps;export{ve as Default,he as Environments,we as MultipageApps,ye as __namedExportsOrder,$e as default};
-//# sourceMappingURL=Analytics.stories-29b3816b.js.map
+<div>Nothing to see here</div>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","environmentsDocs","multipageDocs","Analytics","withComponentDocs","withStoryDocs"]}),$e=D.meta,ye=["Default","Environments","MultipageApps"],ve=D.stories.Default,we=D.stories.Environments,he=D.stories.MultipageApps;export{ve as Default,we as Environments,he as MultipageApps,ye as __namedExportsOrder,$e as default};
+//# sourceMappingURL=Analytics.stories-bb6ec258.js.map

docs/assets/Article-4f15f314.js

@@ -1,2 +1,2 @@
-import{S as b,i as y,s as _,l as w,o as f,b as u,p as m,d as h,e as p,G as k,u as j,q as g,r as v,I as A,t as S,h as V,f as W}from"./index-4f5e5369.js";const E=(s,i)=>(Object.entries(i).forEach(([t,n])=>{s.style.setProperty(`--${t}`,n)}),{update(t){Object.entries(t).forEach(([n,o])=>{s.style.setProperty(`--${n}`,o),delete i[n]}),Object.keys(i).forEach(n=>{s.style.removeProperty(`--${n}`)}),i=t}});function O(s){let i,t,n,o,d,c;const r=s[6].default,a=w(r,s,s[5],null);return{c(){i=f("main"),t=f("article"),a&&a.c(),u(t,"id",s[1]),u(t,"role",s[2]),u(t,"class","svelte-jd0c2r"),m(t,"embedded",s[0])},m(e,l){h(e,i,l),p(i,t),a&&a.m(t,null),o=!0,d||(c=k(n=E.call(null,t,s[3])),d=!0)},p(e,[l]){a&&a.p&&(!o||l&32)&&j(a,r,e,e[5],o?v(r,e[5],l,null):g(e[5]),null),(!o||l&2)&&u(t,"id",e[1]),(!o||l&4)&&u(t,"role",e[2]),n&&A(n.update)&&l&8&&n.update.call(null,e[3]),(!o||l&1)&&m(t,"embedded",e[0])},i(e){o||(S(a,e),o=!0)},o(e){V(a,e),o=!1},d(e){e&&W(i),a&&a.d(e),d=!1,c()}}}function q(s,i,t){let n,{$$slots:o={},$$scope:d}=i,{embedded:c=!1}=i,{id:r=null}=i,{role:a=null}=i,{columnWidths:e={narrower:330,narrow:510,normal:660,wide:930,wider:1200}}=i;return s.$$set=l=>{"embedded"in l&&t(0,c=l.embedded),"id"in l&&t(1,r=l.id),"role"in l&&t(2,a=l.role),"columnWidths"in l&&t(4,e=l.columnWidths),"$$scope"in l&&t(5,d=l.$$scope)},s.$$.update=()=>{s.$$.dirty&16&&t(3,n={"narrower-column-width":e.narrower+"px","narrow-column-width":e.narrow+"px","normal-column-width":e.normal+"px","wide-column-width":e.wide+"px","wider-column-width":e.wider+"px"})},[c,r,a,n,e,d,o]}class C extends b{constructor(i){super(),y(this,i,q,O,_,{embedded:0,id:1,role:2,columnWidths:4})}}C.__docgen={version:3,name:"Article.svelte",data:[{keywords:[],visibility:"public",description:"Set to true for embeddables.",name:"embedded",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1},{keywords:[],visibility:"public",description:"Add an id to the article tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"ARIA role of the article",name:"role",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"Set custom widths for the normal, wide and wider column dimensions",name:"columnWidths",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"}}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"Article content",name:"default"}],refs:[]};export{C as A};
-//# sourceMappingURL=Article-d7d48bf1.js.map
+import{S as b,i as y,s as _,l as w,o as f,h as u,p as m,b as h,k as p,G as k,u as j,q as g,r as v,I as A,t as S,a as V,f as W}from"./index-22a9b7f9.js";const E=(s,i)=>(Object.entries(i).forEach(([t,n])=>{s.style.setProperty(`--${t}`,n)}),{update(t){Object.entries(t).forEach(([n,o])=>{s.style.setProperty(`--${n}`,o),delete i[n]}),Object.keys(i).forEach(n=>{s.style.removeProperty(`--${n}`)}),i=t}});function O(s){let i,t,n,o,d,c;const r=s[6].default,a=w(r,s,s[5],null);return{c(){i=f("main"),t=f("article"),a&&a.c(),u(t,"id",s[1]),u(t,"role",s[2]),u(t,"class","svelte-jd0c2r"),m(t,"embedded",s[0])},m(e,l){h(e,i,l),p(i,t),a&&a.m(t,null),o=!0,d||(c=k(n=E.call(null,t,s[3])),d=!0)},p(e,[l]){a&&a.p&&(!o||l&32)&&j(a,r,e,e[5],o?v(r,e[5],l,null):g(e[5]),null),(!o||l&2)&&u(t,"id",e[1]),(!o||l&4)&&u(t,"role",e[2]),n&&A(n.update)&&l&8&&n.update.call(null,e[3]),(!o||l&1)&&m(t,"embedded",e[0])},i(e){o||(S(a,e),o=!0)},o(e){V(a,e),o=!1},d(e){e&&W(i),a&&a.d(e),d=!1,c()}}}function q(s,i,t){let n,{$$slots:o={},$$scope:d}=i,{embedded:c=!1}=i,{id:r=null}=i,{role:a=null}=i,{columnWidths:e={narrower:330,narrow:510,normal:660,wide:930,wider:1200}}=i;return s.$$set=l=>{"embedded"in l&&t(0,c=l.embedded),"id"in l&&t(1,r=l.id),"role"in l&&t(2,a=l.role),"columnWidths"in l&&t(4,e=l.columnWidths),"$$scope"in l&&t(5,d=l.$$scope)},s.$$.update=()=>{s.$$.dirty&16&&t(3,n={"narrower-column-width":e.narrower+"px","narrow-column-width":e.narrow+"px","normal-column-width":e.normal+"px","wide-column-width":e.wide+"px","wider-column-width":e.wider+"px"})},[c,r,a,n,e,d,o]}class C extends b{constructor(i){super(),y(this,i,q,O,_,{embedded:0,id:1,role:2,columnWidths:4})}}C.__docgen={version:3,name:"Article.svelte",data:[{keywords:[],visibility:"public",description:"Set to true for embeddables.",name:"embedded",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1},{keywords:[],visibility:"public",description:"Add an id to the article tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"ARIA role of the article",name:"role",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"Set custom widths for the normal, wide and wider column dimensions",name:"columnWidths",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"}}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"Article content",name:"default"}],refs:[]};export{C as A};
+//# sourceMappingURL=Article-4f15f314.js.map

docs/assets/Article-4f15f314.js.map

@@ -1 +1 @@
-{"version":3,"file":"Article-d7d48bf1.js","sources":["../../src/actions/cssVariables/index.js","../../src/components/Article/Article.svelte"],"sourcesContent":["// Shamelessly stolen from: https://github.com/kaisermann/svelte-css-vars\nexport default (node, props) => {\n  Object.entries(props).forEach(([key, value]) => {\n    node.style.setProperty(`--${key}`, value);\n  });\n\n  return {\n    update(newProps) {\n      Object.entries(newProps).forEach(([key, value]) => {\n        node.style.setProperty(`--${key}`, value);\n        delete props[key];\n      });\n\n      Object.keys(props).forEach((name) => {\n        node.style.removeProperty(`--${name}`);\n      });\n      props = newProps;\n    },\n  };\n};\n","<!-- @component `Article` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/layout-article--default) -->\n<script lang=\"ts\">\n  /** Set to true for embeddables. */\n  export let embedded: boolean = false;\n\n  /** Add an id to the article tag to target it with custom CSS. */\n  export let id: string | null = null;\n\n  /** ARIA role of the article */\n  export let role: string | null = null;\n\n  interface ColumnWidths {\n    /** Narrower column width */\n    narrower: number;\n    /** Narrow column width */\n    narrow: number;\n    /** Normal column width */\n    normal: number;\n    /** Wide column width */\n    wide: number;\n    /** Wider column width */\n    wider: number;\n  }\n\n  /** Set custom widths for the normal, wide and wider column dimensions */\n  export let columnWidths: ColumnWidths = {\n    narrower: 330,\n    narrow: 510,\n    normal: 660,\n    wide: 930,\n    wider: 1200,\n  };\n\n  import cssVariables from '../../actions/cssVariables/index.js';\n\n  $: columnWidthVars = {\n    'narrower-column-width': columnWidths.narrower + 'px',\n    'narrow-column-width': columnWidths.narrow + 'px',\n    'normal-column-width': columnWidths.normal + 'px',\n    'wide-column-width': columnWidths.wide + 'px',\n    'wider-column-width': columnWidths.wider + 'px',\n  };\n</script>\n\n<main>\n  <article\n    id=\"{id}\"\n    class:embedded=\"{embedded}\"\n    role=\"{role}\"\n    use:cssVariables=\"{columnWidthVars}\"\n  >\n    <!-- Article content -->\n    <slot />\n  </article>\n</main>\n\n<style lang=\"scss\">\n  article {\n    width: 100%;\n    display: block;\n    margin: 0;\n    padding: 0 15px;\n    background-color: var(--theme-colour-background, transparent);\n    &.embedded {\n      overflow: auto;\n    }\n  }\n</style>\n"],"names":["cssVariables","node","props","key","value","newProps","name","ctx","insert","target","main","anchor","append","article","embedded","$$props","id","role","columnWidths","columnWidthVars"],"mappings":"wJACA,MAAAA,EAAe,CAACC,EAAMC,KACpB,OAAO,QAAQA,CAAK,EAAE,QAAQ,CAAC,CAACC,EAAKC,CAAK,IAAM,CAC9CH,EAAK,MAAM,YAAY,KAAKE,CAAG,GAAIC,CAAK,CAC5C,CAAG,EAEM,CACL,OAAOC,EAAU,CACf,OAAO,QAAQA,CAAQ,EAAE,QAAQ,CAAC,CAACF,EAAKC,CAAK,IAAM,CACjDH,EAAK,MAAM,YAAY,KAAKE,CAAG,GAAIC,CAAK,EACxC,OAAOF,EAAMC,CAAG,CACxB,CAAO,EAED,OAAO,KAAKD,CAAK,EAAE,QAASI,GAAS,CACnCL,EAAK,MAAM,eAAe,KAAKK,CAAI,EAAE,CAC7C,CAAO,EACDJ,EAAQG,CACT,CACL,iIC4BSE,EAAE,CAAA,CAAA,aAEAA,EAAI,CAAA,CAAA,8CADMA,EAAQ,CAAA,CAAA,UAH7BC,EAUMC,EAAAC,EAAAC,CAAA,EATJC,EAQSF,EAAAG,CAAA,8CAJYN,EAAe,CAAA,CAAA,CAAA,wGAH7BA,EAAE,CAAA,CAAA,wBAEAA,EAAI,CAAA,CAAA,0CACQA,EAAe,CAAA,CAAA,4BAFjBA,EAAQ,CAAA,CAAA,iIA5ChB,CAAA,SAAAO,EAAoB,EAAK,EAAAC,EAGzB,CAAA,GAAAC,EAAoB,IAAI,EAAAD,EAGxB,CAAA,KAAAE,EAAsB,IAAI,EAAAF,GAgB1B,aAAAG,EAAY,CACrB,SAAU,IACV,OAAQ,IACR,OAAQ,IACR,KAAM,IACN,MAAO,6NAKNC,EAAe,CAChB,wBAAyBD,EAAa,SAAW,KACjD,sBAAuBA,EAAa,OAAS,KAC7C,sBAAuBA,EAAa,OAAS,KAC7C,oBAAqBA,EAAa,KAAO,KACzC,qBAAsBA,EAAa,MAAQ"}
+{"version":3,"file":"Article-4f15f314.js","sources":["../../src/actions/cssVariables/index.js","../../src/components/Article/Article.svelte"],"sourcesContent":["// Shamelessly stolen from: https://github.com/kaisermann/svelte-css-vars\nexport default (node, props) => {\n  Object.entries(props).forEach(([key, value]) => {\n    node.style.setProperty(`--${key}`, value);\n  });\n\n  return {\n    update(newProps) {\n      Object.entries(newProps).forEach(([key, value]) => {\n        node.style.setProperty(`--${key}`, value);\n        delete props[key];\n      });\n\n      Object.keys(props).forEach((name) => {\n        node.style.removeProperty(`--${name}`);\n      });\n      props = newProps;\n    },\n  };\n};\n","<!-- @component `Article` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/layout-article--default) -->\n<script lang=\"ts\">\n  /** Set to true for embeddables. */\n  export let embedded: boolean = false;\n\n  /** Add an id to the article tag to target it with custom CSS. */\n  export let id: string | null = null;\n\n  /** ARIA role of the article */\n  export let role: string | null = null;\n\n  interface ColumnWidths {\n    /** Narrower column width */\n    narrower: number;\n    /** Narrow column width */\n    narrow: number;\n    /** Normal column width */\n    normal: number;\n    /** Wide column width */\n    wide: number;\n    /** Wider column width */\n    wider: number;\n  }\n\n  /** Set custom widths for the normal, wide and wider column dimensions */\n  export let columnWidths: ColumnWidths = {\n    narrower: 330,\n    narrow: 510,\n    normal: 660,\n    wide: 930,\n    wider: 1200,\n  };\n\n  import cssVariables from '../../actions/cssVariables/index.js';\n\n  $: columnWidthVars = {\n    'narrower-column-width': columnWidths.narrower + 'px',\n    'narrow-column-width': columnWidths.narrow + 'px',\n    'normal-column-width': columnWidths.normal + 'px',\n    'wide-column-width': columnWidths.wide + 'px',\n    'wider-column-width': columnWidths.wider + 'px',\n  };\n</script>\n\n<main>\n  <article\n    id=\"{id}\"\n    class:embedded=\"{embedded}\"\n    role=\"{role}\"\n    use:cssVariables=\"{columnWidthVars}\"\n  >\n    <!-- Article content -->\n    <slot />\n  </article>\n</main>\n\n<style lang=\"scss\">\n  article {\n    width: 100%;\n    display: block;\n    margin: 0;\n    padding: 0 15px;\n    background-color: var(--theme-colour-background, transparent);\n    &.embedded {\n      overflow: auto;\n    }\n  }\n</style>\n"],"names":["cssVariables","node","props","key","value","newProps","name","ctx","insert","target","main","anchor","append","article","embedded","$$props","id","role","columnWidths","columnWidthVars"],"mappings":"wJACA,MAAAA,EAAe,CAACC,EAAMC,KACpB,OAAO,QAAQA,CAAK,EAAE,QAAQ,CAAC,CAACC,EAAKC,CAAK,IAAM,CAC9CH,EAAK,MAAM,YAAY,KAAKE,CAAG,GAAIC,CAAK,CAC5C,CAAG,EAEM,CACL,OAAOC,EAAU,CACf,OAAO,QAAQA,CAAQ,EAAE,QAAQ,CAAC,CAACF,EAAKC,CAAK,IAAM,CACjDH,EAAK,MAAM,YAAY,KAAKE,CAAG,GAAIC,CAAK,EACxC,OAAOF,EAAMC,CAAG,CACxB,CAAO,EAED,OAAO,KAAKD,CAAK,EAAE,QAASI,GAAS,CACnCL,EAAK,MAAM,eAAe,KAAKK,CAAI,EAAE,CAC7C,CAAO,EACDJ,EAAQG,CACT,CACL,iIC4BSE,EAAE,CAAA,CAAA,aAEAA,EAAI,CAAA,CAAA,8CADMA,EAAQ,CAAA,CAAA,UAH7BC,EAUMC,EAAAC,EAAAC,CAAA,EATJC,EAQSF,EAAAG,CAAA,8CAJYN,EAAe,CAAA,CAAA,CAAA,wGAH7BA,EAAE,CAAA,CAAA,wBAEAA,EAAI,CAAA,CAAA,0CACQA,EAAe,CAAA,CAAA,4BAFjBA,EAAQ,CAAA,CAAA,iIA5ChB,CAAA,SAAAO,EAAoB,EAAK,EAAAC,EAGzB,CAAA,GAAAC,EAAoB,IAAI,EAAAD,EAGxB,CAAA,KAAAE,EAAsB,IAAI,EAAAF,GAgB1B,aAAAG,EAAY,CACrB,SAAU,IACV,OAAQ,IACR,OAAQ,IACR,KAAM,IACN,MAAO,6NAKNC,EAAe,CAChB,wBAAyBD,EAAa,SAAW,KACjD,sBAAuBA,EAAa,OAAS,KAC7C,sBAAuBA,EAAa,OAAS,KAC7C,oBAAqBA,EAAa,KAAO,KACzC,qBAAsBA,EAAa,MAAQ"}

docs/assets/BeforeAfter.stories-c0f077ad.js

@@ -1,4 +1,4 @@
-import{S as Se,i as Ie,s as Me,k as Re,d as k,N as R,t as g,v as x,h as w,w as ee,f as A,O as Be,x as Ke,D as Ge,g as z,m as q,j as X,o as v,y as B,F as $,b as f,c as W,P as De,e as O,Q as Ce,Z as me,_ as ye,E as be,l as re,u as oe,q as ie,r as fe,C as te,n as ne,z as Qe}from"./index-4f5e5369.js";import{g as Pe,a as je}from"./spread-8a54911c.js";import{p as Ye,M as Ze,T as $e,S as se}from"./collect-stories-6e37d46b.js";import{g as xe}from"./globals-7f7f1b26.js";import{B as et}from"./Block-67c7bec3.js";import{P as tt}from"./PaddingReset-bdb61f35.js";import{t as nt}from"./throttle-dfed7c30.js";import{b as ge,w as at}from"./withParams-47e2ab71.js";import"./isObject-32699ff3.js";import"./now-bd49f550.js";import"./isSymbol-50749e90.js";const lt=`A before and after image comparison component.
+import{S as Se,i as Ie,s as Me,e as Re,b as k,N as R,t as g,v as x,a as w,w as ee,f as A,O as Be,x as Ke,D as Ge,c as z,m as q,d as X,o as v,y as B,F as $,h as f,j as W,P as De,k as O,Q as Ce,Z as me,_ as ye,E as be,l as re,u as oe,q as ie,r as fe,C as te,n as ne,z as Qe}from"./index-22a9b7f9.js";import{g as Pe,a as je}from"./spread-8a54911c.js";import{p as Ye,M as Ze,T as $e,S as se}from"./collect-stories-4618f393.js";import{g as xe}from"./globals-7f7f1b26.js";import{B as et}from"./Block-98bec5bc.js";import{P as tt}from"./PaddingReset-8f18545b.js";import{t as nt}from"./throttle-dfed7c30.js";import{b as ge,w as at}from"./withParams-47e2ab71.js";import"./isObject-32699ff3.js";import"./now-bd49f550.js";import"./isSymbol-50749e90.js";const lt=`A before and after image comparison component.
 
 \`\`\`svelte
 <script>
@@ -156,4 +156,4 @@ background: rgba(0, 0, 0, 0.45);
 div.overlay p {
 color: #ffffff;
 }</style>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","withOverlaysDocs","ariaDescriptionsDocs","BeforeAfter","beforeImg","afterImg","withComponentDocs","withStoryDocs"]}),Wt=ae.meta,zt=["Default","WithOverlays","ARIADescriptions"],qt=ae.stories.Default,Xt=ae.stories.WithOverlays,Lt=ae.stories.ARIADescriptions;export{Lt as ARIADescriptions,qt as Default,Xt as WithOverlays,zt as __namedExportsOrder,Wt as default};
-//# sourceMappingURL=BeforeAfter.stories-ba1f38fc.js.map
+//# sourceMappingURL=BeforeAfter.stories-c0f077ad.js.map

docs/assets/Block-98bec5bc.js

@@ -1,2 +1,2 @@
-import{S as y,i as k,s as m,l as _,o as h,b as d,p as b,d as p,u as g,q as w,r as v,t as A,h as S,f as V}from"./index-4f5e5369.js";function L(l){let e,n,a;const r=l[7].default,i=_(r,l,l[6],null);return{c(){e=h("div"),i&&i.c(),d(e,"id",l[1]),d(e,"class",n="article-block fmx-auto "+l[0]+" "+l[2]+" svelte-lsty9"),d(e,"role",l[4]),d(e,"aria-label",l[5]),b(e,"snap",l[3]&&l[0]!=="fluid"&&l[0]!=="widest")},m(t,o){p(t,e,o),i&&i.m(e,null),a=!0},p(t,[o]){i&&i.p&&(!a||o&64)&&g(i,r,t,t[6],a?v(r,t[6],o,null):w(t[6]),null),(!a||o&2)&&d(e,"id",t[1]),(!a||o&5&&n!==(n="article-block fmx-auto "+t[0]+" "+t[2]+" svelte-lsty9"))&&d(e,"class",n),(!a||o&16)&&d(e,"role",t[4]),(!a||o&32)&&d(e,"aria-label",t[5]),(!a||o&13)&&b(e,"snap",t[3]&&t[0]!=="fluid"&&t[0]!=="widest")},i(t){a||(A(i,t),a=!0)},o(t){S(i,t),a=!1},d(t){t&&V(e),i&&i.d(t)}}}function R(l,e,n){let{$$slots:a={},$$scope:r}=e,{width:i="normal"}=e,{id:t=""}=e,{class:o=""}=e,{snap:c=!1}=e,{role:f=null}=e,{ariaLabel:u=null}=e;return l.$$set=s=>{"width"in s&&n(0,i=s.width),"id"in s&&n(1,t=s.id),"class"in s&&n(2,o=s.class),"snap"in s&&n(3,c=s.snap),"role"in s&&n(4,f=s.role),"ariaLabel"in s&&n(5,u=s.ariaLabel),"$$scope"in s&&n(6,r=s.$$scope)},[i,t,o,c,f,u,r,a]}class j extends y{constructor(e){super(),k(this,e,R,L,m,{width:0,id:1,class:2,snap:3,role:4,ariaLabel:5})}}j.__docgen={version:3,name:"Block.svelte",data:[{keywords:[],visibility:"public",description:"Width of the block within the article well.",name:"width",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:"normal"},{keywords:[],visibility:"public",description:"Add an id to the block tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""},{visibility:"public",description:"Add extra classes to the block tag to target it with custom CSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""},{keywords:[],visibility:"public",description:"Snap block to column widths, rather than fluidly resizing them.",name:"snap",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1},{keywords:[],visibility:"public",description:"ARIA [role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) for the block",name:"role",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"ARIA [label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for the block",name:"ariaLabel",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"block content",name:"default"}],refs:[]};export{j as B};
-//# sourceMappingURL=Block-67c7bec3.js.map
+import{S as y,i as k,s as m,l as _,o as h,h as d,p as b,b as p,u as g,q as w,r as v,t as A,a as S,f as V}from"./index-22a9b7f9.js";function L(l){let e,n,a;const r=l[7].default,i=_(r,l,l[6],null);return{c(){e=h("div"),i&&i.c(),d(e,"id",l[1]),d(e,"class",n="article-block fmx-auto "+l[0]+" "+l[2]+" svelte-lsty9"),d(e,"role",l[4]),d(e,"aria-label",l[5]),b(e,"snap",l[3]&&l[0]!=="fluid"&&l[0]!=="widest")},m(t,o){p(t,e,o),i&&i.m(e,null),a=!0},p(t,[o]){i&&i.p&&(!a||o&64)&&g(i,r,t,t[6],a?v(r,t[6],o,null):w(t[6]),null),(!a||o&2)&&d(e,"id",t[1]),(!a||o&5&&n!==(n="article-block fmx-auto "+t[0]+" "+t[2]+" svelte-lsty9"))&&d(e,"class",n),(!a||o&16)&&d(e,"role",t[4]),(!a||o&32)&&d(e,"aria-label",t[5]),(!a||o&13)&&b(e,"snap",t[3]&&t[0]!=="fluid"&&t[0]!=="widest")},i(t){a||(A(i,t),a=!0)},o(t){S(i,t),a=!1},d(t){t&&V(e),i&&i.d(t)}}}function R(l,e,n){let{$$slots:a={},$$scope:r}=e,{width:i="normal"}=e,{id:t=""}=e,{class:o=""}=e,{snap:c=!1}=e,{role:f=null}=e,{ariaLabel:u=null}=e;return l.$$set=s=>{"width"in s&&n(0,i=s.width),"id"in s&&n(1,t=s.id),"class"in s&&n(2,o=s.class),"snap"in s&&n(3,c=s.snap),"role"in s&&n(4,f=s.role),"ariaLabel"in s&&n(5,u=s.ariaLabel),"$$scope"in s&&n(6,r=s.$$scope)},[i,t,o,c,f,u,r,a]}class j extends y{constructor(e){super(),k(this,e,R,L,m,{width:0,id:1,class:2,snap:3,role:4,ariaLabel:5})}}j.__docgen={version:3,name:"Block.svelte",data:[{keywords:[],visibility:"public",description:"Width of the block within the article well.",name:"width",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:"normal"},{keywords:[],visibility:"public",description:"Add an id to the block tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""},{visibility:"public",description:"Add extra classes to the block tag to target it with custom CSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""},{keywords:[],visibility:"public",description:"Snap block to column widths, rather than fluidly resizing them.",name:"snap",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1},{keywords:[],visibility:"public",description:"ARIA [role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) for the block",name:"role",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null},{keywords:[],visibility:"public",description:"ARIA [label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for the block",name:"ariaLabel",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"object",type:"object"},defaultValue:null}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"block content",name:"default"}],refs:[]};export{j as B};
+//# sourceMappingURL=Block-98bec5bc.js.map

docs/assets/Block-98bec5bc.js.map

@@ -1 +1 @@
-{"version":3,"file":"Block-67c7bec3.js","sources":["../../src/components/Block/Block.svelte"],"sourcesContent":["<!-- @component `Block` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/layout-block--default) -->\n<script lang=\"ts\">\n  import type { ContainerWidth } from '../@types/global';\n\n  /** Width of the block within the article well. */\n  export let width: ContainerWidth = 'normal';\n\n  /** Add an id to the block tag to target it with custom CSS. */\n  export let id: string = '';\n\n  /** Add extra classes to the block tag to target it with custom CSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  /** Snap block to column widths, rather than fluidly resizing them. */\n  export let snap: boolean = false;\n\n  /** ARIA [role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) for the block */\n  export let role: string | null = null;\n\n  /** ARIA [label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for the block */\n  export let ariaLabel: string | null = null;\n</script>\n\n<div\n  id=\"{id}\"\n  class=\"article-block fmx-auto {width} {cls}\"\n  class:snap=\"{snap && width !== 'fluid' && width !== 'widest'}\"\n  role=\"{role}\"\n  aria-label=\"{ariaLabel}\"\n>\n  <!-- block content -->\n  <slot />\n</div>\n\n<style lang=\"scss\">\n  @import '../../scss/mixins';\n\n  .article-block {\n    max-width: var(--normal-column-width, 660px);\n\n    &.narrower {\n      max-width: var(--narrower-column-width, 330px);\n    }\n\n    &.narrow {\n      max-width: var(--narrow-column-width, 510px);\n    }\n\n    &.wide {\n      max-width: var(--wide-column-width, 930px);\n    }\n\n    &.wider {\n      max-width: var(--wider-column-width, 1200px);\n    }\n\n    &.widest {\n      max-width: 100%;\n    }\n\n    &.fluid {\n      width: calc(100% + 30px);\n      margin-left: -15px;\n      max-width: none;\n    }\n\n    // Only setup for the default column widths, b/c can't use\n    // CSS vars in media queries.\n    &.snap {\n      @include block-snap-widths;\n    }\n  }\n</style>\n"],"names":["ctx","attr","div","div_class_value","toggle_class","insert","target","anchor","current","dirty","width","$$props","id","cls","snap","role","ariaLabel"],"mappings":"2OAyBOA,EAAE,CAAA,CAAA,EACwBC,EAAAC,EAAA,QAAAC,EAAA,0BAAAH,SAAQA,EAAG,CAAA,EAAA,eAAA,aAEnCA,EAAI,CAAA,CAAA,mBACEA,EAAS,CAAA,CAAA,EAFTI,EAAAF,EAAA,OAAAF,MAAQA,EAAK,CAAA,IAAK,SAAWA,OAAU,QAAQ,UAH9DK,EASKC,EAAAJ,EAAAK,CAAA,sHAREP,EAAE,CAAA,CAAA,GACwB,CAAAQ,GAAAC,EAAA,GAAAN,KAAAA,EAAA,0BAAAH,SAAQA,EAAG,CAAA,EAAA,yDAEnCA,EAAI,CAAA,CAAA,+BACEA,EAAS,CAAA,CAAA,cAFTI,EAAAF,EAAA,OAAAF,MAAQA,EAAK,CAAA,IAAK,SAAWA,OAAU,QAAQ,qHAtBjD,CAAA,MAAAU,EAAwB,QAAQ,EAAAC,EAGhC,CAAA,GAAAC,EAAa,EAAE,EAAAD,EAGtB,CAAA,MAAAE,EAAc,EAAE,EAAAF,EAIT,CAAA,KAAAG,EAAgB,EAAK,EAAAH,EAGrB,CAAA,KAAAI,EAAsB,IAAI,EAAAJ,EAG1B,CAAA,UAAAK,EAA2B,IAAI,EAAAL"}
+{"version":3,"file":"Block-98bec5bc.js","sources":["../../src/components/Block/Block.svelte"],"sourcesContent":["<!-- @component `Block` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/layout-block--default) -->\n<script lang=\"ts\">\n  import type { ContainerWidth } from '../@types/global';\n\n  /** Width of the block within the article well. */\n  export let width: ContainerWidth = 'normal';\n\n  /** Add an id to the block tag to target it with custom CSS. */\n  export let id: string = '';\n\n  /** Add extra classes to the block tag to target it with custom CSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  /** Snap block to column widths, rather than fluidly resizing them. */\n  export let snap: boolean = false;\n\n  /** ARIA [role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) for the block */\n  export let role: string | null = null;\n\n  /** ARIA [label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for the block */\n  export let ariaLabel: string | null = null;\n</script>\n\n<div\n  id=\"{id}\"\n  class=\"article-block fmx-auto {width} {cls}\"\n  class:snap=\"{snap && width !== 'fluid' && width !== 'widest'}\"\n  role=\"{role}\"\n  aria-label=\"{ariaLabel}\"\n>\n  <!-- block content -->\n  <slot />\n</div>\n\n<style lang=\"scss\">\n  @import '../../scss/mixins';\n\n  .article-block {\n    max-width: var(--normal-column-width, 660px);\n\n    &.narrower {\n      max-width: var(--narrower-column-width, 330px);\n    }\n\n    &.narrow {\n      max-width: var(--narrow-column-width, 510px);\n    }\n\n    &.wide {\n      max-width: var(--wide-column-width, 930px);\n    }\n\n    &.wider {\n      max-width: var(--wider-column-width, 1200px);\n    }\n\n    &.widest {\n      max-width: 100%;\n    }\n\n    &.fluid {\n      width: calc(100% + 30px);\n      margin-left: -15px;\n      max-width: none;\n    }\n\n    // Only setup for the default column widths, b/c can't use\n    // CSS vars in media queries.\n    &.snap {\n      @include block-snap-widths;\n    }\n  }\n</style>\n"],"names":["ctx","attr","div","div_class_value","toggle_class","insert","target","anchor","current","dirty","width","$$props","id","cls","snap","role","ariaLabel"],"mappings":"2OAyBOA,EAAE,CAAA,CAAA,EACwBC,EAAAC,EAAA,QAAAC,EAAA,0BAAAH,SAAQA,EAAG,CAAA,EAAA,eAAA,aAEnCA,EAAI,CAAA,CAAA,mBACEA,EAAS,CAAA,CAAA,EAFTI,EAAAF,EAAA,OAAAF,MAAQA,EAAK,CAAA,IAAK,SAAWA,OAAU,QAAQ,UAH9DK,EASKC,EAAAJ,EAAAK,CAAA,sHAREP,EAAE,CAAA,CAAA,GACwB,CAAAQ,GAAAC,EAAA,GAAAN,KAAAA,EAAA,0BAAAH,SAAQA,EAAG,CAAA,EAAA,yDAEnCA,EAAI,CAAA,CAAA,+BACEA,EAAS,CAAA,CAAA,cAFTI,EAAAF,EAAA,OAAAF,MAAQA,EAAK,CAAA,IAAK,SAAWA,OAAU,QAAQ,qHAtBjD,CAAA,MAAAU,EAAwB,QAAQ,EAAAC,EAGhC,CAAA,GAAAC,EAAa,EAAE,EAAAD,EAGtB,CAAA,MAAAE,EAAc,EAAE,EAAAF,EAIT,CAAA,KAAAG,EAAgB,EAAK,EAAAH,EAGrB,CAAA,KAAAI,EAAsB,IAAI,EAAAJ,EAG1B,CAAA,UAAAK,EAA2B,IAAI,EAAAL"}

docs/assets/BodyText-780d8761.js

@@ -1,2 +0,0 @@
-import{S as m,i as u,s as p,g as y,m as _,t as k,h as g,j as b,k as c,d,f,H as w}from"./index-4f5e5369.js";import{m as o}from"./marked.esm-76161808.js";import{B as h}from"./Block-67c7bec3.js";function r(a){let s,t=o.parse(a[0])+"",e;return{c(){s=new w(!1),e=c(),s.a=e},m(i,n){s.m(t,i,n),d(i,e,n)},p(i,n){n&1&&t!==(t=o.parse(i[0])+"")&&s.p(t)},d(i){i&&(f(e),s.d())}}}function S(a){let s,t=a[0]&&r(a);return{c(){t&&t.c(),s=c()},m(e,i){t&&t.m(e,i),d(e,s,i)},p(e,i){e[0]?t?t.p(e,i):(t=r(e),t.c(),t.m(s.parentNode,s)):t&&(t.d(1),t=null)},d(e){e&&f(s),t&&t.d(e)}}}function v(a){let s,t;return s=new h({props:{id:a[2],class:"fmy-6 "+a[1],$$slots:{default:[S]},$$scope:{ctx:a}}}),{c(){y(s.$$.fragment)},m(e,i){_(s,e,i),t=!0},p(e,[i]){const n={};i&4&&(n.id=e[2]),i&2&&(n.class="fmy-6 "+e[1]),i&9&&(n.$$scope={dirty:i,ctx:e}),s.$set(n)},i(e){t||(k(s.$$.fragment,e),t=!0)},o(e){g(s.$$.fragment,e),t=!1},d(e){b(s,e)}}}function x(a,s,t){let{text:e}=s,{class:i=""}=s,{id:n=""}=s;return a.$$set=l=>{"text"in l&&t(0,e=l.text),"class"in l&&t(1,i=l.class),"id"in l&&t(2,n=l.id)},[e,i,n]}class B extends m{constructor(s){super(),u(this,s,x,v,p,{text:0,class:1,id:2})}}B.__docgen={version:3,name:"BodyText.svelte",data:[{keywords:[{name:"type",description:"{string}"},{name:"required",description:""}],visibility:"public",description:"A markdown text string.",name:"text",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"}},{visibility:"public",description:"Add a class to target with SCSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""},{keywords:[],visibility:"public",description:"Add an id to the block tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};export{B};
-//# sourceMappingURL=BodyText-780d8761.js.map

docs/assets/BodyText-8b28ee70.js

@@ -0,0 +1,2 @@
+import{S as m,i as u,s as p,c as y,m as _,t as k,a as g,d as b,e as c,b as d,f,H as w}from"./index-22a9b7f9.js";import{m as o}from"./marked.esm-76161808.js";import{B as h}from"./Block-98bec5bc.js";function r(a){let s,t=o.parse(a[0])+"",e;return{c(){s=new w(!1),e=c(),s.a=e},m(i,n){s.m(t,i,n),d(i,e,n)},p(i,n){n&1&&t!==(t=o.parse(i[0])+"")&&s.p(t)},d(i){i&&(f(e),s.d())}}}function S(a){let s,t=a[0]&&r(a);return{c(){t&&t.c(),s=c()},m(e,i){t&&t.m(e,i),d(e,s,i)},p(e,i){e[0]?t?t.p(e,i):(t=r(e),t.c(),t.m(s.parentNode,s)):t&&(t.d(1),t=null)},d(e){e&&f(s),t&&t.d(e)}}}function v(a){let s,t;return s=new h({props:{id:a[2],class:"fmy-6 "+a[1],$$slots:{default:[S]},$$scope:{ctx:a}}}),{c(){y(s.$$.fragment)},m(e,i){_(s,e,i),t=!0},p(e,[i]){const n={};i&4&&(n.id=e[2]),i&2&&(n.class="fmy-6 "+e[1]),i&9&&(n.$$scope={dirty:i,ctx:e}),s.$set(n)},i(e){t||(k(s.$$.fragment,e),t=!0)},o(e){g(s.$$.fragment,e),t=!1},d(e){b(s,e)}}}function x(a,s,t){let{text:e}=s,{class:i=""}=s,{id:n=""}=s;return a.$$set=l=>{"text"in l&&t(0,e=l.text),"class"in l&&t(1,i=l.class),"id"in l&&t(2,n=l.id)},[e,i,n]}class B extends m{constructor(s){super(),u(this,s,x,v,p,{text:0,class:1,id:2})}}B.__docgen={version:3,name:"BodyText.svelte",data:[{keywords:[{name:"type",description:"{string}"},{name:"required",description:""}],visibility:"public",description:"A markdown text string.",name:"text",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"}},{visibility:"public",description:"Add a class to target with SCSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""},{keywords:[],visibility:"public",description:"Add an id to the block tag to target it with custom CSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};export{B};
+//# sourceMappingURL=BodyText-8b28ee70.js.map

docs/assets/BodyText-8b28ee70.js.map

@@ -1 +1 @@
-{"version":3,"file":"BodyText-780d8761.js","sources":["../../src/components/BodyText/BodyText.svelte"],"sourcesContent":["<!-- @component `BodyText` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-bodytext--default) -->\n<script lang=\"ts\">\n  /**\n   * A markdown text string.\n   * @type {string}\n   * @required\n   */\n  export let text: string;\n\n  /** Add a class to target with SCSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  /** Add an id to the block tag to target it with custom CSS. */\n  export let id: string = '';\n\n  import { marked } from 'marked';\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block id=\"{id}\" class=\"fmy-6 {cls}\">\n  {#if text}\n    {@html marked.parse(text)}\n  {/if}\n</Block>\n"],"names":["marked","ctx","html_tag","raw_value","create_if_block","text","$$props","cls","id"],"mappings":"sNAsBWA,EAAO,MAAMC,EAAI,CAAA,CAAA,EAAA,wFAAjBD,EAAO,MAAMC,EAAI,CAAA,CAAA,EAAA,KAAAC,EAAA,EAAAC,CAAA,gDADrBF,EAAI,CAAA,GAAAG,EAAAH,CAAA,iEAAJA,EAAI,CAAA,6IADCA,EAAE,CAAA,iBAAiBA,EAAG,CAAA,uHAAtBA,EAAE,CAAA,0BAAiBA,EAAG,CAAA,oJAbrB,KAAAI,CAAY,EAAAC,EAGnB,CAAA,MAAAC,EAAc,EAAE,EAAAD,EAIT,CAAA,GAAAE,EAAa,EAAE,EAAAF"}
+{"version":3,"file":"BodyText-8b28ee70.js","sources":["../../src/components/BodyText/BodyText.svelte"],"sourcesContent":["<!-- @component `BodyText` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-bodytext--default) -->\n<script lang=\"ts\">\n  /**\n   * A markdown text string.\n   * @type {string}\n   * @required\n   */\n  export let text: string;\n\n  /** Add a class to target with SCSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  /** Add an id to the block tag to target it with custom CSS. */\n  export let id: string = '';\n\n  import { marked } from 'marked';\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block id=\"{id}\" class=\"fmy-6 {cls}\">\n  {#if text}\n    {@html marked.parse(text)}\n  {/if}\n</Block>\n"],"names":["marked","ctx","html_tag","raw_value","create_if_block","text","$$props","cls","id"],"mappings":"2NAsBWA,EAAO,MAAMC,EAAI,CAAA,CAAA,EAAA,wFAAjBD,EAAO,MAAMC,EAAI,CAAA,CAAA,EAAA,KAAAC,EAAA,EAAAC,CAAA,gDADrBF,EAAI,CAAA,GAAAG,EAAAH,CAAA,iEAAJA,EAAI,CAAA,6IADCA,EAAE,CAAA,iBAAiBA,EAAG,CAAA,uHAAtBA,EAAE,CAAA,0BAAiBA,EAAG,CAAA,oJAbrB,KAAAI,CAAY,EAAAC,EAGnB,CAAA,MAAAC,EAAc,EAAE,EAAAD,EAIT,CAAA,GAAAE,EAAa,EAAE,EAAAF"}

docs/assets/BodyText.stories-c5b4399a.js

@@ -1,4 +1,4 @@
-import{S as C,i as D,s as j,C as T,g as c,y as b,m,d as g,t as p,h as u,f as y,j as d}from"./index-4f5e5369.js";import{g as q,a as A}from"./spread-8a54911c.js";import{p as M,M as F,T as V,S as w}from"./collect-stories-6e37d46b.js";import{B}from"./BodyText-780d8761.js";import{w as P}from"./withParams-47e2ab71.js";import"./marked.esm-76161808.js";import"./Block-67c7bec3.js";const E=`The \`BodyText\` creates the main text of your page. You can pass the \`text\` prop a [markdown-formatted](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) string, which will be parsed into paragraphs, headers, lists, blockquotes or whatever else you need.
+import{S as C,i as D,s as j,C as T,c,y as b,m,b as g,t as p,a as u,f as y,d}from"./index-22a9b7f9.js";import{g as q,a as A}from"./spread-8a54911c.js";import{p as M,M as F,T as V,S as w}from"./collect-stories-4618f393.js";import{B}from"./BodyText-8b28ee70.js";import{w as P}from"./withParams-47e2ab71.js";import"./marked.esm-76161808.js";import"./Block-98bec5bc.js";const E=`The \`BodyText\` creates the main text of your page. You can pass the \`text\` prop a [markdown-formatted](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) string, which will be parsed into paragraphs, headers, lists, blockquotes or whatever else you need.
 
 Use it like this:
 
@@ -91,4 +91,4 @@ Ham hock id porchetta elit. Sint spare ribs aute buffalo.
 
 <p class='body-correction'>Correction: Lorem ispsum dolor sit amet ameno dorime.</p>
 `}}}),{c(){c(o.$$.fragment),n=b(),c(a.$$.fragment),i=b(),c(t.$$.fragment),l=b(),c(s.$$.fragment)},m(e,r){m(o,e,r),g(e,n,r),m(a,e,r),g(e,i,r),m(t,e,r),g(e,l,r),m(s,e,r),f=!0},p(e,[r]){const S={};o.$set(S);const x={};r&3&&(x.$$scope={dirty:r,ctx:e}),a.$set(x)},i(e){f||(p(o.$$.fragment,e),p(a.$$.fragment,e),p(t.$$.fragment,e),p(s.$$.fragment,e),f=!0)},o(e){u(o.$$.fragment,e),u(a.$$.fragment,e),u(t.$$.fragment,e),u(s.$$.fragment,e),f=!1},d(e){e&&(y(n),y(i),y(l)),d(o,e),d(a,e),d(t,e),d(s,e)}}}class v extends C{constructor(o){super(),D(this,o,null,J,j,{})}}v.__docgen={version:3,name:"BodyText.stories.svelte",data:[],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const $=M(v,{meta:{title:"Components/BodyText"},stories:{"tpl:default":{name:"default",template:!0,source:"<BodyText {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},TypographySample:{name:"Typography sample",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","BodyText","withComponentDocs"]}),U=$.meta,Y=["Default","TypographySample"],z=$.stories.Default,N=$.stories.TypographySample;export{z as Default,N as TypographySample,Y as __namedExportsOrder,U as default};
-//# sourceMappingURL=BodyText.stories-8baed122.js.map
+//# sourceMappingURL=BodyText.stories-c5b4399a.js.map

docs/assets/Byline.stories-bb5d36ec.js

@@ -1,4 +1,4 @@
-import{S as v,i as A,s as C,C as B,g as l,y as d,m as f,d as y,t as u,h as c,f as D,j as $}from"./index-4f5e5369.js";import{g as h,a as T}from"./spread-8a54911c.js";import{p as M,M as P,T as Z,S as I}from"./collect-stories-6e37d46b.js";import{B as w}from"./Byline-45dd4719.js";import{w as O}from"./withParams-47e2ab71.js";import"./each-e59479a4.js";import"./Block-67c7bec3.js";import"./_commonjsHelpers-de833af9.js";import"./journalize-07958dc6.js";const j=`Byline and dateline.
+import{S as v,i as A,s as C,C as B,c as l,y as d,m as f,b as y,t as u,a as c,f as D,d as $}from"./index-22a9b7f9.js";import{g as h,a as T}from"./spread-8a54911c.js";import{p as M,M as P,T as Z,S as I}from"./collect-stories-4618f393.js";import{B as w}from"./Byline-0539bfbd.js";import{w as O}from"./withParams-47e2ab71.js";import"./each-e59479a4.js";import"./Block-98bec5bc.js";import"./_commonjsHelpers-de833af9.js";import"./journalize-07958dc6.js";const k=`Byline and dateline.
 
 \`\`\`svelte
 <script>
@@ -17,5 +17,5 @@ import{S as v,i as A,s as C,C as B,g as l,y as d,m as f,d as y,t as u,h as c,f a
   updateTime="2021-09-12T12:57:00.000Z"
 />
 \`\`\`
-`;function k(p){let n,r;const a=[p[1]];let i={};for(let t=0;t<a.length;t+=1)i=B(i,a[t]);return n=new w({props:i}),{c(){l(n.$$.fragment)},m(t,o){f(n,t,o),r=!0},p(t,o){const m=o&2?h(a,[T(t[1])]):{};n.$set(m)},i(t){r||(u(n.$$.fragment,t),r=!0)},o(t){c(n.$$.fragment,t),r=!1},d(t){$(n,t)}}}function K(p){let n,r,a,i,t,o;const m=[{title:"Components/Byline"},{component:w},p[0]];let g={};for(let e=0;e<m.length;e+=1)g=B(g,m[e]);return n=new P({props:g}),a=new Z({props:{$$slots:{default:[k,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:p}}}),t=new I({props:{name:"Default",args:{align:"left",authors:["Dea Bankova","Aditi Bhandari","Prasanta Kumar Dutta","Anurag Rao","Mariano Zafra"],publishTime:new Date("2021-09-12").toISOString(),updateTime:new Date("2021-09-12T13:57:00").toISOString()}}}),{c(){l(n.$$.fragment),r=d(),l(a.$$.fragment),i=d(),l(t.$$.fragment)},m(e,s){f(n,e,s),y(e,r,s),f(a,e,s),y(e,i,s),f(t,e,s),o=!0},p(e,[s]){const b=s&1?h(m,[m[0],m[1],T(e[0])]):{};n.$set(b);const _={};s&6&&(_.$$scope={dirty:s,ctx:e}),a.$set(_)},i(e){o||(u(n.$$.fragment,e),u(a.$$.fragment,e),u(t.$$.fragment,e),o=!0)},o(e){c(n.$$.fragment,e),c(a.$$.fragment,e),c(t.$$.fragment,e),o=!1},d(e){e&&(D(r),D(i)),$(n,e),$(a,e),$(t,e)}}}function R(p){return[{...O(j),argTypes:{align:{control:"select",options:["left","center"]}}}]}class q extends v{constructor(n){super(),A(this,n,R,K,C,{})}}const S=M(q,{meta:{title:"Components/Byline"},stories:{"tpl:default":{name:"default",template:!0,source:"<Byline {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","Byline","withComponentDocs"]}),Q=S.meta,U=["Default"],V=S.stories.Default;export{V as Default,U as __namedExportsOrder,Q as default};
-//# sourceMappingURL=Byline.stories-baac1079.js.map
+`;function K(p){let n,r;const a=[p[1]];let i={};for(let t=0;t<a.length;t+=1)i=B(i,a[t]);return n=new w({props:i}),{c(){l(n.$$.fragment)},m(t,o){f(n,t,o),r=!0},p(t,o){const m=o&2?h(a,[T(t[1])]):{};n.$set(m)},i(t){r||(u(n.$$.fragment,t),r=!0)},o(t){c(n.$$.fragment,t),r=!1},d(t){$(n,t)}}}function R(p){let n,r,a,i,t,o;const m=[{title:"Components/Byline"},{component:w},p[0]];let _={};for(let e=0;e<m.length;e+=1)_=B(_,m[e]);return n=new P({props:_}),a=new Z({props:{$$slots:{default:[K,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:p}}}),t=new I({props:{name:"Default",args:{align:"left",authors:["Dea Bankova","Aditi Bhandari","Prasanta Kumar Dutta","Anurag Rao","Mariano Zafra"],publishTime:new Date("2021-09-12").toISOString(),updateTime:new Date("2021-09-12T13:57:00").toISOString()}}}),{c(){l(n.$$.fragment),r=d(),l(a.$$.fragment),i=d(),l(t.$$.fragment)},m(e,s){f(n,e,s),y(e,r,s),f(a,e,s),y(e,i,s),f(t,e,s),o=!0},p(e,[s]){const b=s&1?h(m,[m[0],m[1],T(e[0])]):{};n.$set(b);const g={};s&6&&(g.$$scope={dirty:s,ctx:e}),a.$set(g)},i(e){o||(u(n.$$.fragment,e),u(a.$$.fragment,e),u(t.$$.fragment,e),o=!0)},o(e){c(n.$$.fragment,e),c(a.$$.fragment,e),c(t.$$.fragment,e),o=!1},d(e){e&&(D(r),D(i)),$(n,e),$(a,e),$(t,e)}}}function j(p){return[{...O(k),argTypes:{align:{control:"select",options:["left","center"]}}}]}class q extends v{constructor(n){super(),A(this,n,j,R,C,{})}}const S=M(q,{meta:{title:"Components/Byline"},stories:{"tpl:default":{name:"default",template:!0,source:"<Byline {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","Byline","withComponentDocs"]}),Q=S.meta,U=["Default"],V=S.stories.Default;export{V as Default,U as __namedExportsOrder,Q as default};
+//# sourceMappingURL=Byline.stories-bb5d36ec.js.map

docs/assets/Byline.stories-bb5d36ec.js.map

@@ -1 +1 @@
-{"version":3,"file":"Byline.stories-baac1079.js","sources":["../../src/components/Byline/stories/docs/component.md?raw","../../src/components/Byline/Byline.stories.svelte"],"sourcesContent":["export default \"Byline and dateline.\\n\\n```svelte\\n<script>\\n  import { Byline } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<Byline\\n  authors=\\\"{[\\n    'Dea Bankova',\\n    'Aditi Bhandari',\\n    'Prasanta Kumar Dutta',\\n    'Anurag Rao',\\n    'Mariano Zafra',\\n  ]}\\\"\\n  publishTime=\\\"2021-09-12T00:00:00.000Z\\\"\\n  updateTime=\\\"2021-09-12T12:57:00.000Z\\\"\\n/>\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import Byline from './Byline.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    // https://storybook.js.org/docs/svelte/essentials/controls\n    argTypes: {\n      align: {\n        control: 'select',\n        options: ['left', 'center'],\n      },\n    },\n  };\n</script>\n\n<Meta title=\"Components/Byline\" component=\"{Byline}\" {...metaProps} />\n\n<Template let:args>\n  <Byline {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    align: 'left',\n    authors: [\n      'Dea Bankova',\n      'Aditi Bhandari',\n      'Prasanta Kumar Dutta',\n      'Anurag Rao',\n      'Mariano Zafra',\n    ],\n    publishTime: new Date('2021-09-12').toISOString(),\n    updateTime: new Date('2021-09-12T13:57:00').toISOString(),\n  }}\"\n/>\n"],"names":["componentDocs","ctx","meta_spread_levels","Byline","withComponentDocs"],"mappings":"icAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCyBDC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,6HAH0B,MAAAC,EAAA,CAAA,CAAA,MAAA,mBAAA,EAAA,CAAA,UAAAC,GAAaF,EAAS,CAAA,CAAA,iNAS9D,MAAO,OACP,QAAO,CACL,cACA,iBACA,uBACA,aACA,iBAEF,YAAiB,IAAA,KAAK,YAAY,EAAE,YAAW,EAC/C,WAAgB,IAAA,KAAK,qBAAqB,EAAE,YAAW,2KAlBFA,EAAS,CAAA,CAAA,qRAZjD,CACV,GAAAG,EAAkBJ,CAAa,EAElC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,OAAQ,QAAQ"}
+{"version":3,"file":"Byline.stories-bb5d36ec.js","sources":["../../src/components/Byline/stories/docs/component.md?raw","../../src/components/Byline/Byline.stories.svelte"],"sourcesContent":["export default \"Byline and dateline.\\n\\n```svelte\\n<script>\\n  import { Byline } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<Byline\\n  authors=\\\"{[\\n    'Dea Bankova',\\n    'Aditi Bhandari',\\n    'Prasanta Kumar Dutta',\\n    'Anurag Rao',\\n    'Mariano Zafra',\\n  ]}\\\"\\n  publishTime=\\\"2021-09-12T00:00:00.000Z\\\"\\n  updateTime=\\\"2021-09-12T12:57:00.000Z\\\"\\n/>\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import Byline from './Byline.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    // https://storybook.js.org/docs/svelte/essentials/controls\n    argTypes: {\n      align: {\n        control: 'select',\n        options: ['left', 'center'],\n      },\n    },\n  };\n</script>\n\n<Meta title=\"Components/Byline\" component=\"{Byline}\" {...metaProps} />\n\n<Template let:args>\n  <Byline {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    align: 'left',\n    authors: [\n      'Dea Bankova',\n      'Aditi Bhandari',\n      'Prasanta Kumar Dutta',\n      'Anurag Rao',\n      'Mariano Zafra',\n    ],\n    publishTime: new Date('2021-09-12').toISOString(),\n    updateTime: new Date('2021-09-12T13:57:00').toISOString(),\n  }}\"\n/>\n"],"names":["componentDocs","ctx","meta_spread_levels","Byline","withComponentDocs"],"mappings":"icAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCyBDC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,6HAH0B,MAAAC,EAAA,CAAA,CAAA,MAAA,mBAAA,EAAA,CAAA,UAAAC,GAAaF,EAAS,CAAA,CAAA,iNAS9D,MAAO,OACP,QAAO,CACL,cACA,iBACA,uBACA,aACA,iBAEF,YAAiB,IAAA,KAAK,YAAY,EAAE,YAAW,EAC/C,WAAgB,IAAA,KAAK,qBAAqB,EAAE,YAAW,2KAlBFA,EAAS,CAAA,CAAA,qRAZjD,CACV,GAAAG,EAAkBJ,CAAa,EAElC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,OAAQ,QAAQ"}

docs/assets/DatawrapperChart.stories-0aeb9e47.js

@@ -1,4 +1,4 @@
-import{S as F,i as Y,s as z,g as y,m as _,t as h,h as g,j as k,x as ee,D as te,W as ie,y as W,o as V,k as ae,b as w,F as I,c as G,d as D,e as ne,v as E,w as M,f as C,E as re,l as H,u as J,q as K,r as Q,C as N,n as se}from"./index-4f5e5369.js";import{g as X,a as Z}from"./spread-8a54911c.js";import{p as oe,M as le,T as ce,S as q}from"./collect-stories-6e37d46b.js";import{G as fe}from"./GraphicBlock-fdcf18df.js";import{b as pe,w as de}from"./withParams-47e2ab71.js";import"./Block-67c7bec3.js";import"./PaddingReset-bdb61f35.js";import"./marked.esm-76161808.js";const me=`Easily add a responsive Datawrapper embed on your page.
+import{S as F,i as Y,s as z,c as y,m as _,t as h,a as g,d as k,x as ee,D as te,W as ie,y as W,o as V,e as ae,h as w,F as I,j as G,b as D,k as ne,v as E,w as M,f as C,E as re,l as H,u as J,q as K,r as Q,C as N,n as se}from"./index-22a9b7f9.js";import{g as X,a as Z}from"./spread-8a54911c.js";import{p as oe,M as le,T as ce,S as q}from"./collect-stories-4618f393.js";import{G as fe}from"./GraphicBlock-bbd26274.js";import{b as pe,w as de}from"./withParams-47e2ab71.js";import"./Block-98bec5bc.js";import"./PaddingReset-8f18545b.js";import"./marked.esm-76161808.js";const me=`Easily add a responsive Datawrapper embed on your page.
 
 \`\`\`svelte
 <script>
@@ -43,4 +43,4 @@ Source: Center for Reproductive Rights`}}),{c(){y(t.$$.fragment)},m(e,i){_(t,e,i
 
 Source: Center for Reproductive Rights'}"
 />`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","withChatterDocs","DatawrapperChart","withComponentDocs","withStoryDocs"]}),Oe=O.meta,Ve=["Default","WithChatter"],Ie=O.stories.Default,Ee=O.stories.WithChatter;export{Ie as Default,Ee as WithChatter,Ve as __namedExportsOrder,Oe as default};
-//# sourceMappingURL=DatawrapperChart.stories-6c636923.js.map
+//# sourceMappingURL=DatawrapperChart.stories-0aeb9e47.js.map

docs/assets/DocsRenderer-3PUGWF3O-21230d72.js

@@ -0,0 +1,2 @@
+import{D as d,d as n}from"./chunk-S4VUQJ4A-333d721b.js";import"./iframe-8327eba7.js";import"../sb-preview/runtime.js";import"./index-5b61f687.js";import"./_commonjsHelpers-de833af9.js";import"./index-d37d4223.js";import"./index-e04ae519.js";import"./index-356e4a49.js";export{d as DocsRenderer,n as defaultComponents};
+//# sourceMappingURL=DocsRenderer-3PUGWF3O-21230d72.js.map

docs/assets/DocsRenderer-3PUGWF3O-21230d72.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocsRenderer-3PUGWF3O-21230d72.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

docs/assets/DocsRenderer-3PUGWF3O-501df1db.js

@@ -1,2 +0,0 @@
-import{D as d,d as n}from"./chunk-S4VUQJ4A-5286fe72.js";import"./iframe-005a377d.js";import"../sb-preview/runtime.js";import"./index-355f1576.js";import"./_commonjsHelpers-de833af9.js";import"./index-d37d4223.js";import"./index-e04ae519.js";import"./index-356e4a49.js";export{d as DocsRenderer,n as defaultComponents};
-//# sourceMappingURL=DocsRenderer-3PUGWF3O-501df1db.js.map

docs/assets/DocsRenderer-3PUGWF3O-501df1db.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DocsRenderer-3PUGWF3O-501df1db.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

docs/assets/DocumentCloud.stories-8ae775be.js

@@ -1,4 +1,4 @@
-import{S as $,i as k,s as C,g as d,m as f,t as p,h as g,j as h,o as q,b as m,F as b,d as w,f as _,C as v,y as D}from"./index-4f5e5369.js";import{g as A,a as S}from"./spread-8a54911c.js";import{p as R,M,T as V,S as j}from"./collect-stories-6e37d46b.js";import{B}from"./Block-67c7bec3.js";import{w as E}from"./withParams-47e2ab71.js";const F=`Embed a document hosted by [DocumentCloud](https://documentcloud.org)
+import{S as $,i as k,s as C,c as d,m as f,t as p,a as g,d as h,o as q,h as m,F as b,b as w,f as _,C as v,y as D}from"./index-22a9b7f9.js";import{g as A,a as S}from"./spread-8a54911c.js";import{p as R,M,T as V,S as B}from"./collect-stories-4618f393.js";import{B as E}from"./Block-98bec5bc.js";import{w as F}from"./withParams-47e2ab71.js";const H=`Embed a document hosted by [DocumentCloud](https://documentcloud.org)
 
 ---
 
@@ -15,5 +15,5 @@ The document must have its access level set to public before it can be embedded.
   width="normal"
 />
 \`\`\`
-`;function H(a){let e,o;return{c(){e=q("iframe"),m(e,"class","h-screen"),b(e.src,o="https://embed.documentcloud.org/documents/"+a[1]+"/?embed=1&responsive=1&title=1")||m(e,"src",o),m(e,"title",a[2]),m(e,"width","700"),m(e,"height","540"),m(e,"sandbox","allow-scripts allow-same-origin allow-popups allow-forms allow-popups-to-escape-sandbox")},m(t,l){w(t,e,l)},p(t,l){l&2&&!b(e.src,o="https://embed.documentcloud.org/documents/"+t[1]+"/?embed=1&responsive=1&title=1")&&m(e,"src",o),l&4&&m(e,"title",t[2])},d(t){t&&_(e)}}}function P(a){let e,o;return e=new B({props:{width:a[0],id:a[3],class:"photo fmy-6 "+a[4],$$slots:{default:[H]},$$scope:{ctx:a}}}),{c(){d(e.$$.fragment)},m(t,l){f(e,t,l),o=!0},p(t,[l]){const s={};l&1&&(s.width=t[0]),l&8&&(s.id=t[3]),l&16&&(s.class="photo fmy-6 "+t[4]),l&38&&(s.$$scope={dirty:l,ctx:t}),e.$set(s)},i(t){o||(p(e.$$.fragment,t),o=!0)},o(t){g(e.$$.fragment,t),o=!1},d(t){h(e,t)}}}function L(a,e,o){let{width:t="normal"}=e,{slug:l}=e,{altText:s}=e,{id:r=""}=e,{class:u=""}=e;return a.$$set=i=>{"width"in i&&o(0,t=i.width),"slug"in i&&o(1,l=i.slug),"altText"in i&&o(2,s=i.altText),"id"in i&&o(3,r=i.id),"class"in i&&o(4,u=i.class)},[t,l,s,r,u]}class y extends ${constructor(e){super(),k(this,e,L,P,C,{width:0,slug:1,altText:2,id:3,class:4})}}y.__docgen={version:3,name:"DocumentCloud.svelte",data:[{keywords:[],visibility:"public",description:"Width of the container, one of: normal, wide, wider, widest or fluid",name:"width",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:"normal"},{keywords:[{name:"required",description:""}],visibility:"public",description:"The unique identifier for the document.",name:"slug",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"any",type:"any"}},{keywords:[{name:"required",description:""}],visibility:"public",description:"Alt text for the document.",name:"altText",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"any",type:"any"}},{keywords:[],visibility:"public",description:"Add an ID to target with SCSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""},{visibility:"public",description:"Add a class to target with SCSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function N(a){let e,o;const t=[a[1]];let l={};for(let s=0;s<t.length;s+=1)l=v(l,t[s]);return e=new y({props:l}),{c(){d(e.$$.fragment)},m(s,r){f(e,s,r),o=!0},p(s,r){const u=r&2?A(t,[S(s[1])]):{};e.$set(u)},i(s){o||(p(e.$$.fragment,s),o=!0)},o(s){g(e.$$.fragment,s),o=!1},d(s){h(e,s)}}}function O(a){let e,o,t,l,s,r;const u=[{title:"Components/DocumentCloud"},{component:y},a[0]];let i={};for(let n=0;n<u.length;n+=1)i=v(i,u[n]);return e=new M({props:i}),t=new V({props:{$$slots:{default:[N,({args:n})=>({1:n}),({args:n})=>n?2:0]},$$scope:{ctx:a}}}),s=new j({props:{name:"Default",args:{width:"normal",slug:"3259984-Trump-Intelligence-Allegations",altText:"These Reports Allege Trump Has Deep Ties To Russia"}}}),{c(){d(e.$$.fragment),o=D(),d(t.$$.fragment),l=D(),d(s.$$.fragment)},m(n,c){f(e,n,c),w(n,o,c),f(t,n,c),w(n,l,c),f(s,n,c),r=!0},p(n,[c]){const I=c&1?A(u,[u[0],u[1],S(n[0])]):{};e.$set(I);const T={};c&6&&(T.$$scope={dirty:c,ctx:n}),t.$set(T)},i(n){r||(p(e.$$.fragment,n),p(t.$$.fragment,n),p(s.$$.fragment,n),r=!0)},o(n){g(e.$$.fragment,n),g(t.$$.fragment,n),g(s.$$.fragment,n),r=!1},d(n){n&&(_(o),_(l)),h(e,n),h(t,n),h(s,n)}}}function U(a){return[{...E(F),argTypes:{width:{control:"select",options:["normal","wide","wider","widest","fluid"]}}}]}class W extends ${constructor(e){super(),k(this,e,U,O,C,{})}}const x=R(W,{meta:{title:"Components/DocumentCloud"},stories:{"tpl:default":{name:"default",template:!0,source:"<DocumentCloud {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","DocumentCloud","withComponentDocs"]}),X=x.meta,Y=["Default"],Z=x.stories.Default;export{Z as Default,Y as __namedExportsOrder,X as default};
-//# sourceMappingURL=DocumentCloud.stories-212a867c.js.map
+`;function P(a){let e,o;return{c(){e=q("iframe"),m(e,"class","h-screen"),b(e.src,o="https://embed.documentcloud.org/documents/"+a[1]+"/?embed=1&responsive=1&title=1")||m(e,"src",o),m(e,"title",a[2]),m(e,"width","700"),m(e,"height","540"),m(e,"sandbox","allow-scripts allow-same-origin allow-popups allow-forms allow-popups-to-escape-sandbox")},m(t,l){w(t,e,l)},p(t,l){l&2&&!b(e.src,o="https://embed.documentcloud.org/documents/"+t[1]+"/?embed=1&responsive=1&title=1")&&m(e,"src",o),l&4&&m(e,"title",t[2])},d(t){t&&_(e)}}}function j(a){let e,o;return e=new E({props:{width:a[0],id:a[3],class:"photo fmy-6 "+a[4],$$slots:{default:[P]},$$scope:{ctx:a}}}),{c(){d(e.$$.fragment)},m(t,l){f(e,t,l),o=!0},p(t,[l]){const s={};l&1&&(s.width=t[0]),l&8&&(s.id=t[3]),l&16&&(s.class="photo fmy-6 "+t[4]),l&38&&(s.$$scope={dirty:l,ctx:t}),e.$set(s)},i(t){o||(p(e.$$.fragment,t),o=!0)},o(t){g(e.$$.fragment,t),o=!1},d(t){h(e,t)}}}function L(a,e,o){let{width:t="normal"}=e,{slug:l}=e,{altText:s}=e,{id:r=""}=e,{class:u=""}=e;return a.$$set=i=>{"width"in i&&o(0,t=i.width),"slug"in i&&o(1,l=i.slug),"altText"in i&&o(2,s=i.altText),"id"in i&&o(3,r=i.id),"class"in i&&o(4,u=i.class)},[t,l,s,r,u]}class y extends ${constructor(e){super(),k(this,e,L,j,C,{width:0,slug:1,altText:2,id:3,class:4})}}y.__docgen={version:3,name:"DocumentCloud.svelte",data:[{keywords:[],visibility:"public",description:"Width of the container, one of: normal, wide, wider, widest or fluid",name:"width",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:"normal"},{keywords:[{name:"required",description:""}],visibility:"public",description:"The unique identifier for the document.",name:"slug",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"any",type:"any"}},{keywords:[{name:"required",description:""}],visibility:"public",description:"Alt text for the document.",name:"altText",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"any",type:"any"}},{keywords:[],visibility:"public",description:"Add an ID to target with SCSS.",name:"id",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"string",type:"string"},defaultValue:""},{visibility:"public",description:"Add a class to target with SCSS.",keywords:[],name:"class",kind:"const",static:!1,readonly:!0,type:{kind:"type",text:"string",type:"string"},localName:"cls",defaultValue:""}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function N(a){let e,o;const t=[a[1]];let l={};for(let s=0;s<t.length;s+=1)l=v(l,t[s]);return e=new y({props:l}),{c(){d(e.$$.fragment)},m(s,r){f(e,s,r),o=!0},p(s,r){const u=r&2?A(t,[S(s[1])]):{};e.$set(u)},i(s){o||(p(e.$$.fragment,s),o=!0)},o(s){g(e.$$.fragment,s),o=!1},d(s){h(e,s)}}}function O(a){let e,o,t,l,s,r;const u=[{title:"Components/DocumentCloud"},{component:y},a[0]];let i={};for(let n=0;n<u.length;n+=1)i=v(i,u[n]);return e=new M({props:i}),t=new V({props:{$$slots:{default:[N,({args:n})=>({1:n}),({args:n})=>n?2:0]},$$scope:{ctx:a}}}),s=new B({props:{name:"Default",args:{width:"normal",slug:"3259984-Trump-Intelligence-Allegations",altText:"These Reports Allege Trump Has Deep Ties To Russia"}}}),{c(){d(e.$$.fragment),o=D(),d(t.$$.fragment),l=D(),d(s.$$.fragment)},m(n,c){f(e,n,c),w(n,o,c),f(t,n,c),w(n,l,c),f(s,n,c),r=!0},p(n,[c]){const I=c&1?A(u,[u[0],u[1],S(n[0])]):{};e.$set(I);const T={};c&6&&(T.$$scope={dirty:c,ctx:n}),t.$set(T)},i(n){r||(p(e.$$.fragment,n),p(t.$$.fragment,n),p(s.$$.fragment,n),r=!0)},o(n){g(e.$$.fragment,n),g(t.$$.fragment,n),g(s.$$.fragment,n),r=!1},d(n){n&&(_(o),_(l)),h(e,n),h(t,n),h(s,n)}}}function U(a){return[{...F(H),argTypes:{width:{control:"select",options:["normal","wide","wider","widest","fluid"]}}}]}class W extends ${constructor(e){super(),k(this,e,U,O,C,{})}}const x=R(W,{meta:{title:"Components/DocumentCloud"},stories:{"tpl:default":{name:"default",template:!0,source:"<DocumentCloud {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","DocumentCloud","withComponentDocs"]}),X=x.meta,Y=["Default"],Z=x.stories.Default;export{Z as Default,Y as __namedExportsOrder,X as default};
+//# sourceMappingURL=DocumentCloud.stories-8ae775be.js.map

docs/assets/DocumentCloud.stories-8ae775be.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentCloud.stories-212a867c.js","sources":["../../src/components/DocumentCloud/stories/docs/component.md?raw","../../src/components/DocumentCloud/DocumentCloud.svelte","../../src/components/DocumentCloud/DocumentCloud.stories.svelte"],"sourcesContent":["export default \"Embed a document hosted by [DocumentCloud](https://documentcloud.org)\\n\\n---\\n\\nThe document must have its access level set to public before it can be embedded. The `slug` argument can be found after the final slash in the document's URL. For instance, the document included in the example is found at [documentcloud.org/documents/3259984-Trump-Intelligence-Allegations](https://www.documentcloud.org/documents/3259984-Trump-Intelligence-Allegations). The slug is \\\"3259984-Trump-Intelligence-Allegations\\\".\\n\\n```svelte\\n<script>\\n  import { DocumentCloud } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<DocumentCloud\\n  slug=\\\"3259984-Trump-Intelligence-Allegations\\\"\\n  altText=\\\"These Reports Allege Trump Has Deep Ties To Russia\\\"\\n  width=\\\"normal\\\"\\n/>\\n```\\n\"","<!-- @component `DocumentCloud` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-DocumentCloud--default) -->\n<script lang=\"ts\">\n  import type { ContainerWidth } from '../@types/global';\n  /** ✏️ DOCUMENT your chart's props using TypeScript and JSDoc comments like below! */\n\n  /**\n   * Width of the container, one of: normal, wide, wider, widest or fluid\n   */\n  export let width: ContainerWidth = 'normal';\n\n  /**\n   * The unique identifier for the document.\n   * @required\n   */\n  export let slug: string;\n\n  /**\n   * Alt text for the document.\n   * @required\n   */\n  export let altText: string;\n\n  /** Add an ID to target with SCSS. */\n  export let id: string = '';\n\n  /** Add a class to target with SCSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block width=\"{width}\" id=\"{id}\" class=\"photo fmy-6 {cls}\">\n  <iframe\n    class=\"h-screen\"\n    src=\"https://embed.documentcloud.org/documents/{slug}/?embed=1&amp;responsive=1&amp;title=1\"\n    title=\"{altText}\"\n    width=\"700\"\n    height=\"540\"\n    sandbox=\"allow-scripts allow-same-origin allow-popups allow-forms allow-popups-to-escape-sandbox\"\n  ></iframe>\n</Block>\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // Don't lose the \"?raw\" in markdown imports!\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import DocumentCloud from './DocumentCloud.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      width: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n    },\n  };\n</script>\n\n<Meta\n  title=\"Components/DocumentCloud\"\n  component=\"{DocumentCloud}\"\n  {...metaProps}\n/>\n\n<Template let:args>\n  <DocumentCloud {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    width: 'normal',\n    slug: '3259984-Trump-Intelligence-Allegations',\n    altText: 'These Reports Allege Trump Has Deep Ties To Russia',\n  }}\"\n/>\n"],"names":["componentDocs","ctx","attr","iframe","iframe_src_value","insert","target","anchor","width","$$props","slug","altText","id","cls","DocumentCloud","withComponentDocs"],"mappings":"4UAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gICmCqCC,EAAI,CAAA,EAAA,gCAAA,GAAAC,EAAAC,EAAA,MAAAC,CAAA,cAC5CH,EAAO,CAAA,CAAA,0JAHjBI,EAOSC,EAAAH,EAAAI,CAAA,uEALyCN,EAAI,CAAA,EAAA,gCAAA,iCAC5CA,EAAO,CAAA,CAAA,qEAJJA,EAAK,CAAA,KAAQA,EAAE,CAAA,uBAAuBA,EAAG,CAAA,0HAAzCA,EAAK,CAAA,cAAQA,EAAE,CAAA,iCAAuBA,EAAG,CAAA,iJAxB3C,GAAA,CAAA,MAAAO,EAAwB,QAAQ,EAAAC,GAMhC,KAAAC,CAAY,EAAAD,GAMZ,QAAAE,CAAe,EAAAF,EAGf,CAAA,GAAAG,EAAa,EAAE,EAAAH,EAGtB,CAAA,MAAAI,EAAc,EAAE,EAAAJ,q8CCGDR,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,oLALXa,CAAa,EACrBb,EAAS,CAAA,kNAUX,MAAO,SACP,KAAM,yCACN,QAAS,8NAZPA,EAAS,CAAA,CAAA,qRAdE,CACV,GAAAc,EAAkBf,CAAa,EAClC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO"}
+{"version":3,"file":"DocumentCloud.stories-8ae775be.js","sources":["../../src/components/DocumentCloud/stories/docs/component.md?raw","../../src/components/DocumentCloud/DocumentCloud.svelte","../../src/components/DocumentCloud/DocumentCloud.stories.svelte"],"sourcesContent":["export default \"Embed a document hosted by [DocumentCloud](https://documentcloud.org)\\n\\n---\\n\\nThe document must have its access level set to public before it can be embedded. The `slug` argument can be found after the final slash in the document's URL. For instance, the document included in the example is found at [documentcloud.org/documents/3259984-Trump-Intelligence-Allegations](https://www.documentcloud.org/documents/3259984-Trump-Intelligence-Allegations). The slug is \\\"3259984-Trump-Intelligence-Allegations\\\".\\n\\n```svelte\\n<script>\\n  import { DocumentCloud } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<DocumentCloud\\n  slug=\\\"3259984-Trump-Intelligence-Allegations\\\"\\n  altText=\\\"These Reports Allege Trump Has Deep Ties To Russia\\\"\\n  width=\\\"normal\\\"\\n/>\\n```\\n\"","<!-- @component `DocumentCloud` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-DocumentCloud--default) -->\n<script lang=\"ts\">\n  import type { ContainerWidth } from '../@types/global';\n  /** ✏️ DOCUMENT your chart's props using TypeScript and JSDoc comments like below! */\n\n  /**\n   * Width of the container, one of: normal, wide, wider, widest or fluid\n   */\n  export let width: ContainerWidth = 'normal';\n\n  /**\n   * The unique identifier for the document.\n   * @required\n   */\n  export let slug: string;\n\n  /**\n   * Alt text for the document.\n   * @required\n   */\n  export let altText: string;\n\n  /** Add an ID to target with SCSS. */\n  export let id: string = '';\n\n  /** Add a class to target with SCSS. */\n  let cls: string = '';\n  export { cls as class };\n\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block width=\"{width}\" id=\"{id}\" class=\"photo fmy-6 {cls}\">\n  <iframe\n    class=\"h-screen\"\n    src=\"https://embed.documentcloud.org/documents/{slug}/?embed=1&amp;responsive=1&amp;title=1\"\n    title=\"{altText}\"\n    width=\"700\"\n    height=\"540\"\n    sandbox=\"allow-scripts allow-same-origin allow-popups allow-forms allow-popups-to-escape-sandbox\"\n  ></iframe>\n</Block>\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // Don't lose the \"?raw\" in markdown imports!\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import DocumentCloud from './DocumentCloud.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      width: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n    },\n  };\n</script>\n\n<Meta\n  title=\"Components/DocumentCloud\"\n  component=\"{DocumentCloud}\"\n  {...metaProps}\n/>\n\n<Template let:args>\n  <DocumentCloud {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    width: 'normal',\n    slug: '3259984-Trump-Intelligence-Allegations',\n    altText: 'These Reports Allege Trump Has Deep Ties To Russia',\n  }}\"\n/>\n"],"names":["componentDocs","ctx","attr","iframe","iframe_src_value","insert","target","anchor","width","$$props","slug","altText","id","cls","DocumentCloud","withComponentDocs"],"mappings":"iVAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gICmCqCC,EAAI,CAAA,EAAA,gCAAA,GAAAC,EAAAC,EAAA,MAAAC,CAAA,cAC5CH,EAAO,CAAA,CAAA,0JAHjBI,EAOSC,EAAAH,EAAAI,CAAA,uEALyCN,EAAI,CAAA,EAAA,gCAAA,iCAC5CA,EAAO,CAAA,CAAA,qEAJJA,EAAK,CAAA,KAAQA,EAAE,CAAA,uBAAuBA,EAAG,CAAA,0HAAzCA,EAAK,CAAA,cAAQA,EAAE,CAAA,iCAAuBA,EAAG,CAAA,iJAxB3C,GAAA,CAAA,MAAAO,EAAwB,QAAQ,EAAAC,GAMhC,KAAAC,CAAY,EAAAD,GAMZ,QAAAE,CAAe,EAAAF,EAGf,CAAA,GAAAG,EAAa,EAAE,EAAAH,EAGtB,CAAA,MAAAI,EAAc,EAAE,EAAAJ,q8CCGDR,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,oLALXa,CAAa,EACrBb,EAAS,CAAA,kNAUX,MAAO,SACP,KAAM,yCACN,QAAS,8NAZPA,EAAS,CAAA,CAAA,qRAdE,CACV,GAAAc,EAAkBf,CAAa,EAClC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO"}

docs/assets/EmbedPreviewerLink.stories-e61b4c6c.js

@@ -1,4 +1,4 @@
-import{S as E,i as D,s as L,k as M,d as _,t as m,v as S,h as f,w as V,f as $,o as k,g as p,b as v,e as H,m as c,j as d,C as P,y as h}from"./index-4f5e5369.js";import{g as z,a as A}from"./spread-8a54911c.js";import{p as T,M as j,T as F,S as N}from"./collect-stories-6e37d46b.js";import{F as q}from"./fa-870bc0bd.js";import{w as I}from"./withParams-47e2ab71.js";const O=`An embed tool for development in graphics kit.
+import{S as E,i as D,s as L,e as M,b as _,t as m,v as S,a as f,w as V,f as $,o as k,c as p,h as v,k as H,m as c,d,C as P,y as h}from"./index-22a9b7f9.js";import{g as z,a as A}from"./spread-8a54911c.js";import{p as T,M as F,T as N,S as j}from"./collect-stories-4618f393.js";import{F as q}from"./fa-7568ec37.js";import{w as I}from"./withParams-47e2ab71.js";const O=`An embed tool for development in graphics kit.
 
 \`\`\`svelte
 <script>
@@ -12,5 +12,5 @@ import{S as E,i as D,s as L,k as M,d as _,t as m,v as S,h as f,w as V,f as $,o a
 `;/*!
  * Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com
  * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
- */var R={prefix:"far",iconName:"window-restore",icon:[512,512,[],"f2d2","M464 0H144c-26.5 0-48 21.5-48 48v48H48c-26.5 0-48 21.5-48 48v320c0 26.5 21.5 48 48 48h320c26.5 0 48-21.5 48-48v-48h48c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48zm-96 464H48V256h320v208zm96-96h-48V144c0-26.5-21.5-48-48-48H144V48h320v320z"]};function y(o){let t,a,e,n;return e=new q({props:{icon:R}}),{c(){t=k("div"),a=k("a"),p(e.$$.fragment),v(a,"rel","external"),v(a,"href","/embed-previewer"),v(a,"class","svelte-715e2e"),v(t,"class","svelte-715e2e")},m(r,i){_(r,t,i),H(t,a),c(e,a,null),n=!0},i(r){n||(m(e.$$.fragment,r),n=!0)},o(r){f(e.$$.fragment,r),n=!1},d(r){r&&$(t),d(e)}}}function W(o){let t,a,e=o[0]&&y();return{c(){e&&e.c(),t=M()},m(n,r){e&&e.m(n,r),_(n,t,r),a=!0},p(n,[r]){n[0]?e?r&1&&m(e,1):(e=y(),e.c(),m(e,1),e.m(t.parentNode,t)):e&&(S(),f(e,1,1,()=>{e=null}),V())},i(n){a||(m(e),a=!0)},o(n){f(e),a=!1},d(n){n&&$(t),e&&e.d(n)}}}function B(o,t,a){let{dev:e=!1}=t;return o.$$set=n=>{"dev"in n&&a(0,e=n.dev)},[e]}class g extends E{constructor(t){super(),D(this,t,B,W,L,{dev:0})}}g.__docgen={version:3,name:"EmbedPreviewerLink.svelte",data:[{visibility:"public",description:null,keywords:[],name:"dev",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function G(o){let t,a;const e=[o[0]];let n={};for(let r=0;r<e.length;r+=1)n=P(n,e[r]);return t=new g({props:n}),{c(){p(t.$$.fragment)},m(r,i){c(t,r,i),a=!0},p(r,i){const u=i&1?z(e,[A(r[0])]):{};t.$set(u)},i(r){a||(m(t.$$.fragment,r),a=!0)},o(r){f(t.$$.fragment,r),a=!1},d(r){d(t,r)}}}function J(o){let t,a,e,n,r,i;const u=[{title:"Components/EmbedPreviewerLink"},{component:g},I(O)];let w={};for(let s=0;s<u.length;s+=1)w=P(w,u[s]);return t=new j({props:w}),e=new F({props:{$$slots:{default:[G,({args:s})=>({0:s}),({args:s})=>s?1:0]},$$scope:{ctx:o}}}),r=new N({props:{name:"Default",args:{dev:!0}}}),{c(){p(t.$$.fragment),a=h(),p(e.$$.fragment),n=h(),p(r.$$.fragment)},m(s,l){c(t,s,l),_(s,a,l),c(e,s,l),_(s,n,l),c(r,s,l),i=!0},p(s,[l]){const C={};t.$set(C);const b={};l&3&&(b.$$scope={dirty:l,ctx:s}),e.$set(b)},i(s){i||(m(t.$$.fragment,s),m(e.$$.fragment,s),m(r.$$.fragment,s),i=!0)},o(s){f(t.$$.fragment,s),f(e.$$.fragment,s),f(r.$$.fragment,s),i=!1},d(s){s&&($(a),$(n)),d(t,s),d(e,s),d(r,s)}}}class K extends E{constructor(t){super(),D(this,t,null,J,L,{})}}const x=T(K,{meta:{title:"Components/EmbedPreviewerLink"},stories:{"tpl:default":{name:"default",template:!0,source:"<EmbedPreviewerLink {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","EmbedPreviewerLink","withComponentDocs"]}),ee=x.meta,te=["Default"],re=x.stories.Default;export{re as Default,te as __namedExportsOrder,ee as default};
-//# sourceMappingURL=EmbedPreviewerLink.stories-7ea2c556.js.map
+ */var R={prefix:"far",iconName:"window-restore",icon:[512,512,[],"f2d2","M464 0H144c-26.5 0-48 21.5-48 48v48H48c-26.5 0-48 21.5-48 48v320c0 26.5 21.5 48 48 48h320c26.5 0 48-21.5 48-48v-48h48c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48zm-96 464H48V256h320v208zm96-96h-48V144c0-26.5-21.5-48-48-48H144V48h320v320z"]};function y(o){let t,a,e,n;return e=new q({props:{icon:R}}),{c(){t=k("div"),a=k("a"),p(e.$$.fragment),v(a,"rel","external"),v(a,"href","/embed-previewer"),v(a,"class","svelte-715e2e"),v(t,"class","svelte-715e2e")},m(r,i){_(r,t,i),H(t,a),c(e,a,null),n=!0},i(r){n||(m(e.$$.fragment,r),n=!0)},o(r){f(e.$$.fragment,r),n=!1},d(r){r&&$(t),d(e)}}}function W(o){let t,a,e=o[0]&&y();return{c(){e&&e.c(),t=M()},m(n,r){e&&e.m(n,r),_(n,t,r),a=!0},p(n,[r]){n[0]?e?r&1&&m(e,1):(e=y(),e.c(),m(e,1),e.m(t.parentNode,t)):e&&(S(),f(e,1,1,()=>{e=null}),V())},i(n){a||(m(e),a=!0)},o(n){f(e),a=!1},d(n){n&&$(t),e&&e.d(n)}}}function B(o,t,a){let{dev:e=!1}=t;return o.$$set=n=>{"dev"in n&&a(0,e=n.dev)},[e]}class g extends E{constructor(t){super(),D(this,t,B,W,L,{dev:0})}}g.__docgen={version:3,name:"EmbedPreviewerLink.svelte",data:[{visibility:"public",description:null,keywords:[],name:"dev",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!1}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function G(o){let t,a;const e=[o[0]];let n={};for(let r=0;r<e.length;r+=1)n=P(n,e[r]);return t=new g({props:n}),{c(){p(t.$$.fragment)},m(r,i){c(t,r,i),a=!0},p(r,i){const u=i&1?z(e,[A(r[0])]):{};t.$set(u)},i(r){a||(m(t.$$.fragment,r),a=!0)},o(r){f(t.$$.fragment,r),a=!1},d(r){d(t,r)}}}function J(o){let t,a,e,n,r,i;const u=[{title:"Components/EmbedPreviewerLink"},{component:g},I(O)];let w={};for(let s=0;s<u.length;s+=1)w=P(w,u[s]);return t=new F({props:w}),e=new N({props:{$$slots:{default:[G,({args:s})=>({0:s}),({args:s})=>s?1:0]},$$scope:{ctx:o}}}),r=new j({props:{name:"Default",args:{dev:!0}}}),{c(){p(t.$$.fragment),a=h(),p(e.$$.fragment),n=h(),p(r.$$.fragment)},m(s,l){c(t,s,l),_(s,a,l),c(e,s,l),_(s,n,l),c(r,s,l),i=!0},p(s,[l]){const C={};t.$set(C);const b={};l&3&&(b.$$scope={dirty:l,ctx:s}),e.$set(b)},i(s){i||(m(t.$$.fragment,s),m(e.$$.fragment,s),m(r.$$.fragment,s),i=!0)},o(s){f(t.$$.fragment,s),f(e.$$.fragment,s),f(r.$$.fragment,s),i=!1},d(s){s&&($(a),$(n)),d(t,s),d(e,s),d(r,s)}}}class K extends E{constructor(t){super(),D(this,t,null,J,L,{})}}const x=T(K,{meta:{title:"Components/EmbedPreviewerLink"},stories:{"tpl:default":{name:"default",template:!0,source:"<EmbedPreviewerLink {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","EmbedPreviewerLink","withComponentDocs"]}),ee=x.meta,te=["Default"],re=x.stories.Default;export{re as Default,te as __namedExportsOrder,ee as default};
+//# sourceMappingURL=EmbedPreviewerLink.stories-e61b4c6c.js.map

docs/assets/EndNotes.stories-afd2fe54.js

@@ -1,4 +1,4 @@
-import{S as x,i as C,s as M,g as p,m as u,t as d,h as _,j as $,k as S,d as f,f as m,V as I,o as w,y,b as D,C as H}from"./index-4f5e5369.js";import{g as j,a as q}from"./spread-8a54911c.js";import{p as B,M as F,T as P,S as O}from"./collect-stories-6e37d46b.js";import{e as N}from"./each-e59479a4.js";import{m as g}from"./marked.esm-76161808.js";import{B as V}from"./Block-67c7bec3.js";import{w as z}from"./withParams-47e2ab71.js";const G=`End notes includes notes to the main article — usually things like sources, clarifiying notes and minor corrections at the end of a story.
+import{S as x,i as C,s as M,c as p,m as u,t as d,a as _,d as $,e as S,b as f,f as m,V as I,o as w,y,h as D,C as H}from"./index-22a9b7f9.js";import{g as q,a as B}from"./spread-8a54911c.js";import{p as F,M as P,T as j,S as O}from"./collect-stories-4618f393.js";import{e as N}from"./each-e59479a4.js";import{m as g}from"./marked.esm-76161808.js";import{B as V}from"./Block-98bec5bc.js";import{w as z}from"./withParams-47e2ab71.js";const G=`End notes includes notes to the main article — usually things like sources, clarifiying notes and minor corrections at the end of a story.
 
 \`\`\`svelte
 <script>
@@ -22,5 +22,5 @@ import{S as x,i as C,s as M,g as p,m as u,t as d,h as _,j as $,k as S,d as f,f a
 
 <EndNotes notes="{notes}" />
 \`\`\`
-`;function k(l,t,n){const e=l.slice();return e[1]=t[n],e}function T(l){let t,n=N(l[0]),e=[];for(let s=0;s<n.length;s+=1)e[s]=b(k(l,n,s));return{c(){for(let s=0;s<e.length;s+=1)e[s].c();t=S()},m(s,r){for(let o=0;o<e.length;o+=1)e[o]&&e[o].m(s,r);f(s,t,r)},p(s,r){if(r&1){n=N(s[0]);let o;for(o=0;o<n.length;o+=1){const i=k(s,n,o);e[o]?e[o].p(i,r):(e[o]=b(i),e[o].c(),e[o].m(t.parentNode,t))}for(;o<e.length;o+=1)e[o].d(1);e.length=n.length}},d(s){s&&m(t),I(e,s)}}}function b(l){let t,n=g.parse(l[1].title)+"",e,s,r=g.parse(l[1].text)+"";return{c(){t=w("div"),e=y(),s=w("div"),D(t,"class","note-title svelte-as9r96"),D(s,"class","note-content svelte-as9r96")},m(o,i){f(o,t,i),t.innerHTML=n,f(o,e,i),f(o,s,i),s.innerHTML=r},p(o,i){i&1&&n!==(n=g.parse(o[1].title)+"")&&(t.innerHTML=n),i&1&&r!==(r=g.parse(o[1].text)+"")&&(s.innerHTML=r)},d(o){o&&(m(t),m(e),m(s))}}}function J(l){let t,n=l[0]&&T(l);return{c(){n&&n.c(),t=S()},m(e,s){n&&n.m(e,s),f(e,t,s)},p(e,s){e[0]?n?n.p(e,s):(n=T(e),n.c(),n.m(t.parentNode,t)):n&&(n.d(1),n=null)},d(e){e&&m(t),n&&n.d(e)}}}function K(l){let t,n;return t=new V({props:{class:"notes fmt-6 fmb-8",$$slots:{default:[J]},$$scope:{ctx:l}}}),{c(){p(t.$$.fragment)},m(e,s){u(t,e,s),n=!0},p(e,[s]){const r={};s&17&&(r.$$scope={dirty:s,ctx:e}),t.$set(r)},i(e){n||(d(t.$$.fragment,e),n=!0)},o(e){_(t.$$.fragment,e),n=!1},d(e){$(t,e)}}}function Q(l,t,n){let{notes:e=[]}=t;return l.$$set=s=>{"notes"in s&&n(0,e=s.notes)},[e]}class v extends x{constructor(t){super(),C(this,t,Q,K,M,{notes:0})}}v.__docgen={version:3,name:"EndNotes.svelte",data:[{keywords:[{name:"required",description:""}],visibility:"public",description:"An array of endnote items.",name:"notes",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"array",type:"array"}}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const R=l=>l.map(t=>({title:t.Title,text:t.Text}));function U(l){let t,n;const e=[l[1]];let s={};for(let r=0;r<e.length;r+=1)s=H(s,e[r]);return t=new v({props:s}),{c(){p(t.$$.fragment)},m(r,o){u(t,r,o),n=!0},p(r,o){const i=o&2?j(e,[q(r[1])]):{};t.$set(i)},i(r){n||(d(t.$$.fragment,r),n=!0)},o(r){_(t.$$.fragment,r),n=!1},d(r){$(t,r)}}}function W(l){let t,n,e,s,r,o;const i=[{title:"Components/EndNotes"},{component:v},z(G)];let h={};for(let a=0;a<i.length;a+=1)h=H(h,i[a]);return t=new F({props:h}),e=new P({props:{$$slots:{default:[U,({args:a})=>({1:a}),({args:a})=>a?2:0]},$$scope:{ctx:l}}}),r=new O({props:{name:"Default",args:{notes:R(l[0])}}}),{c(){p(t.$$.fragment),n=y(),p(e.$$.fragment),s=y(),p(r.$$.fragment)},m(a,c){u(t,a,c),f(a,n,c),u(e,a,c),f(a,s,c),u(r,a,c),o=!0},p(a,[c]){const A={};t.$set(A);const E={};c&6&&(E.$$scope={dirty:c,ctx:a}),e.$set(E)},i(a){o||(d(t.$$.fragment,a),d(e.$$.fragment,a),d(r.$$.fragment,a),o=!0)},o(a){_(t.$$.fragment,a),_(e.$$.fragment,a),_(r.$$.fragment,a),o=!1},d(a){a&&(m(n),m(s)),$(t,a),$(e,a),$(r,a)}}}function X(l){return[[{Title:"Note",Text:"Data is current as of today."},{Title:"Sources",Text:"Data, Inc."},{Title:"Edited by",Text:'<a href="https://www.reuters.com/graphics/">Editor</a>, Copyeditor'}]]}class Y extends x{constructor(t){super(),C(this,t,X,W,M,{})}}const L=B(Y,{meta:{title:"Components/EndNotes"},stories:{"tpl:default":{name:"default",template:!0,source:"<EndNotes {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","EndNotes","getEndNotesPropsFromDoc","withComponentDocs"]}),ae=L.meta,le=["Default"],ie=L.stories.Default;export{ie as Default,le as __namedExportsOrder,ae as default};
-//# sourceMappingURL=EndNotes.stories-42e9b579.js.map
+`;function k(l,t,n){const e=l.slice();return e[1]=t[n],e}function T(l){let t,n=N(l[0]),e=[];for(let s=0;s<n.length;s+=1)e[s]=b(k(l,n,s));return{c(){for(let s=0;s<e.length;s+=1)e[s].c();t=S()},m(s,r){for(let o=0;o<e.length;o+=1)e[o]&&e[o].m(s,r);f(s,t,r)},p(s,r){if(r&1){n=N(s[0]);let o;for(o=0;o<n.length;o+=1){const i=k(s,n,o);e[o]?e[o].p(i,r):(e[o]=b(i),e[o].c(),e[o].m(t.parentNode,t))}for(;o<e.length;o+=1)e[o].d(1);e.length=n.length}},d(s){s&&m(t),I(e,s)}}}function b(l){let t,n=g.parse(l[1].title)+"",e,s,r=g.parse(l[1].text)+"";return{c(){t=w("div"),e=y(),s=w("div"),D(t,"class","note-title svelte-as9r96"),D(s,"class","note-content svelte-as9r96")},m(o,i){f(o,t,i),t.innerHTML=n,f(o,e,i),f(o,s,i),s.innerHTML=r},p(o,i){i&1&&n!==(n=g.parse(o[1].title)+"")&&(t.innerHTML=n),i&1&&r!==(r=g.parse(o[1].text)+"")&&(s.innerHTML=r)},d(o){o&&(m(t),m(e),m(s))}}}function J(l){let t,n=l[0]&&T(l);return{c(){n&&n.c(),t=S()},m(e,s){n&&n.m(e,s),f(e,t,s)},p(e,s){e[0]?n?n.p(e,s):(n=T(e),n.c(),n.m(t.parentNode,t)):n&&(n.d(1),n=null)},d(e){e&&m(t),n&&n.d(e)}}}function K(l){let t,n;return t=new V({props:{class:"notes fmt-6 fmb-8",$$slots:{default:[J]},$$scope:{ctx:l}}}),{c(){p(t.$$.fragment)},m(e,s){u(t,e,s),n=!0},p(e,[s]){const r={};s&17&&(r.$$scope={dirty:s,ctx:e}),t.$set(r)},i(e){n||(d(t.$$.fragment,e),n=!0)},o(e){_(t.$$.fragment,e),n=!1},d(e){$(t,e)}}}function Q(l,t,n){let{notes:e=[]}=t;return l.$$set=s=>{"notes"in s&&n(0,e=s.notes)},[e]}class v extends x{constructor(t){super(),C(this,t,Q,K,M,{notes:0})}}v.__docgen={version:3,name:"EndNotes.svelte",data:[{keywords:[{name:"required",description:""}],visibility:"public",description:"An array of endnote items.",name:"notes",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"array",type:"array"}}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const R=l=>l.map(t=>({title:t.Title,text:t.Text}));function U(l){let t,n;const e=[l[1]];let s={};for(let r=0;r<e.length;r+=1)s=H(s,e[r]);return t=new v({props:s}),{c(){p(t.$$.fragment)},m(r,o){u(t,r,o),n=!0},p(r,o){const i=o&2?q(e,[B(r[1])]):{};t.$set(i)},i(r){n||(d(t.$$.fragment,r),n=!0)},o(r){_(t.$$.fragment,r),n=!1},d(r){$(t,r)}}}function W(l){let t,n,e,s,r,o;const i=[{title:"Components/EndNotes"},{component:v},z(G)];let h={};for(let a=0;a<i.length;a+=1)h=H(h,i[a]);return t=new P({props:h}),e=new j({props:{$$slots:{default:[U,({args:a})=>({1:a}),({args:a})=>a?2:0]},$$scope:{ctx:l}}}),r=new O({props:{name:"Default",args:{notes:R(l[0])}}}),{c(){p(t.$$.fragment),n=y(),p(e.$$.fragment),s=y(),p(r.$$.fragment)},m(a,c){u(t,a,c),f(a,n,c),u(e,a,c),f(a,s,c),u(r,a,c),o=!0},p(a,[c]){const A={};t.$set(A);const E={};c&6&&(E.$$scope={dirty:c,ctx:a}),e.$set(E)},i(a){o||(d(t.$$.fragment,a),d(e.$$.fragment,a),d(r.$$.fragment,a),o=!0)},o(a){_(t.$$.fragment,a),_(e.$$.fragment,a),_(r.$$.fragment,a),o=!1},d(a){a&&(m(n),m(s)),$(t,a),$(e,a),$(r,a)}}}function X(l){return[[{Title:"Note",Text:"Data is current as of today."},{Title:"Sources",Text:"Data, Inc."},{Title:"Edited by",Text:'<a href="https://www.reuters.com/graphics/">Editor</a>, Copyeditor'}]]}class Y extends x{constructor(t){super(),C(this,t,X,W,M,{})}}const L=F(Y,{meta:{title:"Components/EndNotes"},stories:{"tpl:default":{name:"default",template:!0,source:"<EndNotes {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","EndNotes","getEndNotesPropsFromDoc","withComponentDocs"]}),ae=L.meta,le=["Default"],ie=L.stories.Default;export{ie as Default,le as __namedExportsOrder,ae as default};
+//# sourceMappingURL=EndNotes.stories-afd2fe54.js.map

docs/assets/EndNotes.stories-afd2fe54.js.map

@@ -1 +1 @@
-{"version":3,"file":"EndNotes.stories-42e9b579.js","sources":["../../src/components/EndNotes/stories/docs/component.md?raw","../../src/components/EndNotes/EndNotes.svelte","../../src/components/EndNotes/docProps.ts","../../src/components/EndNotes/EndNotes.stories.svelte"],"sourcesContent":["export default \"End notes includes notes to the main article — usually things like sources, clarifiying notes and minor corrections at the end of a story.\\n\\n```svelte\\n<script>\\n  import { EndNotes } from '@reuters-graphics/graphics-components';\\n\\n  const notes = [\\n    {\\n      title: 'Note',\\n      text: 'Data is current as of today.',\\n    },\\n    {\\n      title: 'Sources',\\n      text: 'Data, Inc.',\\n    },\\n    {\\n      title: 'Edited by',\\n      text: '<a href=\\\"https://www.reuters.com/graphics/\\\">Editor</a>, Copyeditor',\\n    },\\n  ];\\n</script>\\n\\n<EndNotes notes=\\\"{notes}\\\" />\\n```\\n\"","<!-- @component `EndNotes` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-EndNotes--default) -->\n<script lang=\"ts\">\n  interface EndNote {\n    /**\n     * Title of the note item\n     */\n    title: String;\n    /**\n     * Contents of the note as a markdown string\n     * @required\n     */\n    text: String;\n  }\n\n  /**\n   * An array of endnote items.\n   * @required\n   */\n  export let notes: EndNote[] = [];\n\n  import { marked } from 'marked';\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block class=\"notes fmt-6 fmb-8\">\n  {#if notes}\n    {#each notes as note}\n      <div class=\"note-title\">{@html marked.parse(note.title)}</div>\n      <div class=\"note-content\">{@html marked.parse(note.text)}</div>\n    {/each}\n  {/if}\n</Block>\n\n<!-- svelte-ignore css-unused-selector -->\n<style lang=\"scss\">\n  @import '../../scss/mixins';\n\n  .note-title {\n    :global(p) {\n      @include body-caption;\n      @include text-primary;\n      @include font-medium;\n      @include tracking-normal;\n      @include fmt-3;\n      margin-bottom: 0.125rem;\n      text-transform: none;\n    }\n  }\n\n  .note-content {\n    :global(p) {\n      @include body-caption;\n      @include fmt-0;\n    }\n  }\n</style>\n","interface EndNote {\n  Title: String;\n  Text: String;\n}\n\ntype EndNotes = EndNote[];\n\nexport const getEndNotesPropsFromDoc = (endNotes: EndNotes) => {\n  return endNotes.map((d) => {\n    return {\n      title: d.Title,\n      text: d.Text,\n    };\n  });\n};\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import EndNotes from './EndNotes.svelte';\n  import { getEndNotesPropsFromDoc } from './docProps';\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const notes = [\n    {\n      Title: 'Note',\n      Text: 'Data is current as of today.',\n    },\n    {\n      Title: 'Sources',\n      Text: 'Data, Inc.',\n    },\n    {\n      Title: 'Edited by',\n      Text: '<a href=\"https://www.reuters.com/graphics/\">Editor</a>, Copyeditor',\n    },\n  ];\n</script>\n\n<Meta\n  title=\"Components/EndNotes\"\n  component=\"{EndNotes}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <EndNotes {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{ notes: getEndNotesPropsFromDoc(notes) }}\" />\n"],"names":["componentDocs","ctx","i","raw0_value","marked","raw1_value","insert","target","div0","anchor","div1","dirty","create_if_block","notes","$$props","getEndNotesPropsFromDoc","endNotes","d","EndNotes","withComponentDocs"],"mappings":"4aAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;iFC0BJC,EAAK,CAAA,CAAA,uBAAV,OAAIC,GAAA,4JAACD,EAAK,CAAA,CAAA,oBAAV,OAAIC,GAAA,EAAA,yHAAJ,mDAC+BC,EAAAC,EAAO,MAAMH,KAAK,KAAK,EAAA,OACrBI,EAAAD,EAAO,MAAMH,KAAK,IAAI,EAAA,oIADvDK,EAA6DC,EAAAC,EAAAC,CAAA,yBAC7DH,EAA8DC,EAAAG,EAAAD,CAAA,wBAD/BE,EAAA,GAAAR,KAAAA,EAAAC,EAAO,MAAMH,KAAK,KAAK,EAAA,MAAAO,EAAA,UAAAL,GACrBQ,EAAA,GAAAN,KAAAA,EAAAD,EAAO,MAAMH,KAAK,IAAI,EAAA,MAAAS,EAAA,UAAAL,qDAHtDJ,EAAK,CAAA,GAAAW,EAAAX,CAAA,iEAALA,EAAK,CAAA,gaAPC,MAAAY,EAAK,EAAA,EAAAC,kdCXL,MAAAC,EAA2BC,GAC/BA,EAAS,IAAKC,IACZ,CACL,MAAOA,EAAE,MACT,KAAMA,EAAE,IAAA,EAEX,iCCoBahB,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,+KALNiB,CAAQ,EAChBC,EAAkBnB,CAAa,kNAON,MAAOe,EAAwBd,EAAK,CAAA,CAAA,uaA1BtD,EAEP,MAAO,OACP,KAAM,gCAGN,CAAA,MAAO,UACP,KAAM,YAAY,GAGlB,MAAO,YACP,KAAM"}
+{"version":3,"file":"EndNotes.stories-afd2fe54.js","sources":["../../src/components/EndNotes/stories/docs/component.md?raw","../../src/components/EndNotes/EndNotes.svelte","../../src/components/EndNotes/docProps.ts","../../src/components/EndNotes/EndNotes.stories.svelte"],"sourcesContent":["export default \"End notes includes notes to the main article — usually things like sources, clarifiying notes and minor corrections at the end of a story.\\n\\n```svelte\\n<script>\\n  import { EndNotes } from '@reuters-graphics/graphics-components';\\n\\n  const notes = [\\n    {\\n      title: 'Note',\\n      text: 'Data is current as of today.',\\n    },\\n    {\\n      title: 'Sources',\\n      text: 'Data, Inc.',\\n    },\\n    {\\n      title: 'Edited by',\\n      text: '<a href=\\\"https://www.reuters.com/graphics/\\\">Editor</a>, Copyeditor',\\n    },\\n  ];\\n</script>\\n\\n<EndNotes notes=\\\"{notes}\\\" />\\n```\\n\"","<!-- @component `EndNotes` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-EndNotes--default) -->\n<script lang=\"ts\">\n  interface EndNote {\n    /**\n     * Title of the note item\n     */\n    title: String;\n    /**\n     * Contents of the note as a markdown string\n     * @required\n     */\n    text: String;\n  }\n\n  /**\n   * An array of endnote items.\n   * @required\n   */\n  export let notes: EndNote[] = [];\n\n  import { marked } from 'marked';\n  import Block from '../Block/Block.svelte';\n</script>\n\n<Block class=\"notes fmt-6 fmb-8\">\n  {#if notes}\n    {#each notes as note}\n      <div class=\"note-title\">{@html marked.parse(note.title)}</div>\n      <div class=\"note-content\">{@html marked.parse(note.text)}</div>\n    {/each}\n  {/if}\n</Block>\n\n<!-- svelte-ignore css-unused-selector -->\n<style lang=\"scss\">\n  @import '../../scss/mixins';\n\n  .note-title {\n    :global(p) {\n      @include body-caption;\n      @include text-primary;\n      @include font-medium;\n      @include tracking-normal;\n      @include fmt-3;\n      margin-bottom: 0.125rem;\n      text-transform: none;\n    }\n  }\n\n  .note-content {\n    :global(p) {\n      @include body-caption;\n      @include fmt-0;\n    }\n  }\n</style>\n","interface EndNote {\n  Title: String;\n  Text: String;\n}\n\ntype EndNotes = EndNote[];\n\nexport const getEndNotesPropsFromDoc = (endNotes: EndNotes) => {\n  return endNotes.map((d) => {\n    return {\n      title: d.Title,\n      text: d.Text,\n    };\n  });\n};\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import EndNotes from './EndNotes.svelte';\n  import { getEndNotesPropsFromDoc } from './docProps';\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const notes = [\n    {\n      Title: 'Note',\n      Text: 'Data is current as of today.',\n    },\n    {\n      Title: 'Sources',\n      Text: 'Data, Inc.',\n    },\n    {\n      Title: 'Edited by',\n      Text: '<a href=\"https://www.reuters.com/graphics/\">Editor</a>, Copyeditor',\n    },\n  ];\n</script>\n\n<Meta\n  title=\"Components/EndNotes\"\n  component=\"{EndNotes}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <EndNotes {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{ notes: getEndNotesPropsFromDoc(notes) }}\" />\n"],"names":["componentDocs","ctx","i","raw0_value","marked","raw1_value","insert","target","div0","anchor","div1","dirty","create_if_block","notes","$$props","getEndNotesPropsFromDoc","endNotes","d","EndNotes","withComponentDocs"],"mappings":"4aAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;iFC0BJC,EAAK,CAAA,CAAA,uBAAV,OAAIC,GAAA,4JAACD,EAAK,CAAA,CAAA,oBAAV,OAAIC,GAAA,EAAA,yHAAJ,mDAC+BC,EAAAC,EAAO,MAAMH,KAAK,KAAK,EAAA,OACrBI,EAAAD,EAAO,MAAMH,KAAK,IAAI,EAAA,oIADvDK,EAA6DC,EAAAC,EAAAC,CAAA,yBAC7DH,EAA8DC,EAAAG,EAAAD,CAAA,wBAD/BE,EAAA,GAAAR,KAAAA,EAAAC,EAAO,MAAMH,KAAK,KAAK,EAAA,MAAAO,EAAA,UAAAL,GACrBQ,EAAA,GAAAN,KAAAA,EAAAD,EAAO,MAAMH,KAAK,IAAI,EAAA,MAAAS,EAAA,UAAAL,qDAHtDJ,EAAK,CAAA,GAAAW,EAAAX,CAAA,iEAALA,EAAK,CAAA,gaAPC,MAAAY,EAAK,EAAA,EAAAC,kdCXL,MAAAC,EAA2BC,GAC/BA,EAAS,IAAKC,IACZ,CACL,MAAOA,EAAE,MACT,KAAMA,EAAE,IAAA,EAEX,iCCoBahB,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,+KALNiB,CAAQ,EAChBC,EAAkBnB,CAAa,kNAON,MAAOe,EAAwBd,EAAK,CAAA,CAAA,uaA1BtD,EAEP,MAAO,OACP,KAAM,gCAGN,CAAA,MAAO,UACP,KAAM,YAAY,GAGlB,MAAO,YACP,KAAM"}

docs/assets/FeaturePhoto.stories-89783d17.js

@@ -1,4 +1,4 @@
-import{S as Q,i as G,s as q,C as y,g as m,y as _,m as f,d as T,t as h,h as u,f as w,j as g}from"./index-4f5e5369.js";import{g as E,a as M}from"./spread-8a54911c.js";import{p as W,M as z,T as L,S as I}from"./collect-stories-6e37d46b.js";import{F as v}from"./FeaturePhoto-d0380275.js";import{b as U,w as N}from"./withParams-47e2ab71.js";import"./Block-67c7bec3.js";import"./PaddingReset-bdb61f35.js";const O=`A full-width photo inside the text well.
+import{S as j,i as G,s as q,C as y,c as m,y as _,m as f,b as T,t as h,a as u,f as w,d as $}from"./index-22a9b7f9.js";import{g as E,a as M}from"./spread-8a54911c.js";import{p as W,M as z,T as L,S as I}from"./collect-stories-4618f393.js";import{F as v}from"./FeaturePhoto-afa92808.js";import{b as U,w as N}from"./withParams-47e2ab71.js";import"./Block-98bec5bc.js";import"./PaddingReset-8f18545b.js";const O=`A full-width photo inside the text well.
 
 \`\`\`svelte
 <script>
@@ -52,5 +52,5 @@ Caption: Carcharodon carcharias - REUTERS
   {/if}
 {/each}
 \`\`\`
-`,H="If your photo is missing `altText` a small warning will overlay the image.\n",S=""+new URL("shark-f4201fc0.jpg",import.meta.url).href;function J(c){let s,r;const n=[c[1]];let i={};for(let e=0;e<n.length;e+=1)i=y(i,n[e]);return s=new v({props:i}),{c(){m(s.$$.fragment)},m(e,p){f(s,e,p),r=!0},p(e,p){const a=p&2?E(n,[M(e[1])]):{};s.$set(a)},i(e){r||(h(s.$$.fragment,e),r=!0)},o(e){u(s.$$.fragment,e),r=!1},d(e){g(s,e)}}}function V(c){let s,r,n,i,e,p,a,k,l,d;const $=[{title:"Components/FeaturePhoto"},{component:v},c[0]];let A={};for(let t=0;t<$.length;t+=1)A=y(A,$[t]);s=new z({props:A}),n=new L({props:{$$slots:{default:[J,({args:t})=>({1:t}),({args:t})=>t?2:0]},$$scope:{ctx:c}}}),e=new I({props:{name:"Default",args:{src:S,altText:"A shark!",width:"normal",caption:"Carcharodon carcharias - REUTERS"}}});const P=[{name:"🚀 QUICKIT"},{args:{src:S,altText:"A shark!",width:"normal",caption:"Carcharodon carcharias - REUTERS"}},U(B)];let C={};for(let t=0;t<P.length;t+=1)C=y(C,P[t]);a=new I({props:C});const b=[{name:"Missing altText"},{args:{src:S,width:"normal",caption:"Carcharodon carcharias - REUTERS"}},U(H)];let D={};for(let t=0;t<b.length;t+=1)D=y(D,b[t]);return l=new I({props:D}),{c(){m(s.$$.fragment),r=_(),m(n.$$.fragment),i=_(),m(e.$$.fragment),p=_(),m(a.$$.fragment),k=_(),m(l.$$.fragment)},m(t,o){f(s,t,o),T(t,r,o),f(n,t,o),T(t,i,o),f(e,t,o),T(t,p,o),f(a,t,o),T(t,k,o),f(l,t,o),d=!0},p(t,[o]){const R=o&1?E($,[$[0],$[1],M(t[0])]):{};s.$set(R);const F={};o&6&&(F.$$scope={dirty:o,ctx:t}),n.$set(F);const K={};a.$set(K);const j={};l.$set(j)},i(t){d||(h(s.$$.fragment,t),h(n.$$.fragment,t),h(e.$$.fragment,t),h(a.$$.fragment,t),h(l.$$.fragment,t),d=!0)},o(t){u(s.$$.fragment,t),u(n.$$.fragment,t),u(e.$$.fragment,t),u(a.$$.fragment,t),u(l.$$.fragment,t),d=!1},d(t){t&&(w(r),w(i),w(p),w(k)),g(s,t),g(n,t),g(e,t),g(a,t),g(l,t)}}}function X(c){return[{...N(O),argTypes:{width:{control:"select",options:["normal","wide","wider","widest","fluid"]},textWidth:{control:"select",options:["normal","wide","wider","widest","fluid"]}}}]}class Y extends Q{constructor(s){super(),G(this,s,X,V,q,{})}}const x=W(Y,{meta:{title:"Components/FeaturePhoto"},stories:{"tpl:default":{name:"default",template:!0,source:"<FeaturePhoto {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},QUICKIT:{name:"🚀 QUICKIT",template:!1,source:"",hasArgs:!1},MissingAltText:{name:"Missing altText",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","quickitDocs","missingAltTextDocs","FeaturePhoto","sharkSrc","withComponentDocs","withStoryDocs"]}),rt=x.meta,it=["Default","QUICKIT","MissingAltText"],pt=x.stories.Default,lt=x.stories.QUICKIT,ct=x.stories.MissingAltText;export{pt as Default,ct as MissingAltText,lt as QUICKIT,it as __namedExportsOrder,rt as default};
-//# sourceMappingURL=FeaturePhoto.stories-965cb754.js.map
+`,H="If your photo is missing `altText` a small warning will overlay the image.\n",S=""+new URL("shark-f4201fc0.jpg",import.meta.url).href;function J(c){let s,r;const n=[c[1]];let i={};for(let e=0;e<n.length;e+=1)i=y(i,n[e]);return s=new v({props:i}),{c(){m(s.$$.fragment)},m(e,p){f(s,e,p),r=!0},p(e,p){const a=p&2?E(n,[M(e[1])]):{};s.$set(a)},i(e){r||(h(s.$$.fragment,e),r=!0)},o(e){u(s.$$.fragment,e),r=!1},d(e){$(s,e)}}}function V(c){let s,r,n,i,e,p,a,k,l,d;const g=[{title:"Components/FeaturePhoto"},{component:v},c[0]];let A={};for(let t=0;t<g.length;t+=1)A=y(A,g[t]);s=new z({props:A}),n=new L({props:{$$slots:{default:[J,({args:t})=>({1:t}),({args:t})=>t?2:0]},$$scope:{ctx:c}}}),e=new I({props:{name:"Default",args:{src:S,altText:"A shark!",width:"normal",caption:"Carcharodon carcharias - REUTERS"}}});const b=[{name:"🚀 QUICKIT"},{args:{src:S,altText:"A shark!",width:"normal",caption:"Carcharodon carcharias - REUTERS"}},U(B)];let C={};for(let t=0;t<b.length;t+=1)C=y(C,b[t]);a=new I({props:C});const P=[{name:"Missing altText"},{args:{src:S,width:"normal",caption:"Carcharodon carcharias - REUTERS"}},U(H)];let D={};for(let t=0;t<P.length;t+=1)D=y(D,P[t]);return l=new I({props:D}),{c(){m(s.$$.fragment),r=_(),m(n.$$.fragment),i=_(),m(e.$$.fragment),p=_(),m(a.$$.fragment),k=_(),m(l.$$.fragment)},m(t,o){f(s,t,o),T(t,r,o),f(n,t,o),T(t,i,o),f(e,t,o),T(t,p,o),f(a,t,o),T(t,k,o),f(l,t,o),d=!0},p(t,[o]){const R=o&1?E(g,[g[0],g[1],M(t[0])]):{};s.$set(R);const F={};o&6&&(F.$$scope={dirty:o,ctx:t}),n.$set(F);const K={};a.$set(K);const Q={};l.$set(Q)},i(t){d||(h(s.$$.fragment,t),h(n.$$.fragment,t),h(e.$$.fragment,t),h(a.$$.fragment,t),h(l.$$.fragment,t),d=!0)},o(t){u(s.$$.fragment,t),u(n.$$.fragment,t),u(e.$$.fragment,t),u(a.$$.fragment,t),u(l.$$.fragment,t),d=!1},d(t){t&&(w(r),w(i),w(p),w(k)),$(s,t),$(n,t),$(e,t),$(a,t),$(l,t)}}}function X(c){return[{...N(O),argTypes:{width:{control:"select",options:["normal","wide","wider","widest","fluid"]},textWidth:{control:"select",options:["normal","wide","wider","widest","fluid"]}}}]}class Y extends j{constructor(s){super(),G(this,s,X,V,q,{})}}const x=W(Y,{meta:{title:"Components/FeaturePhoto"},stories:{"tpl:default":{name:"default",template:!0,source:"<FeaturePhoto {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},QUICKIT:{name:"🚀 QUICKIT",template:!1,source:"",hasArgs:!1},MissingAltText:{name:"Missing altText",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","quickitDocs","missingAltTextDocs","FeaturePhoto","sharkSrc","withComponentDocs","withStoryDocs"]}),rt=x.meta,it=["Default","QUICKIT","MissingAltText"],pt=x.stories.Default,lt=x.stories.QUICKIT,ct=x.stories.MissingAltText;export{pt as Default,ct as MissingAltText,lt as QUICKIT,it as __namedExportsOrder,rt as default};
+//# sourceMappingURL=FeaturePhoto.stories-89783d17.js.map

docs/assets/FeaturePhoto.stories-89783d17.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeaturePhoto.stories-965cb754.js","sources":["../../src/components/FeaturePhoto/stories/docs/component.md?raw","../../src/components/FeaturePhoto/stories/docs/quickit.md?raw","../../src/components/FeaturePhoto/stories/docs/missingAltText.md?raw","../../src/components/FeaturePhoto/stories/shark.jpg","../../src/components/FeaturePhoto/FeaturePhoto.stories.svelte"],"sourcesContent":["export default \"A full-width photo inside the text well.\\n\\n```svelte\\n<script>\\n  import { FeaturePhoto } from '@reuters-graphics/graphics-components';\\n  import { assets } from '$app/paths'; // 👈 If using in the Graphics Kit...\\n</script>\\n\\n<FeaturePhoto\\n  src=\\\"{`${assets}/images/myImage.jpg`}\\\"\\n  altText=\\\"Some alt text\\\"\\n  caption=\\\"A caption\\\"\\n  lazy=\\\"{false}\\\"\\n  width=\\\"normal\\\"\\n/>\\n```\\n\"","export default \"An example of using `FeaturePhoto` in the Graphics Kit with a Google Doc.\\n\\n```yaml\\n# Google doc block\\nType: photo\\nWidth: normal\\nSrc: images/shark.jpg\\nAltText: The king of the sea\\nCaption: Carcharodon carcharias - REUTERS\\n```\\n\\n```svelte\\n<!-- App.svelte -->\\n<script>\\n  // Add FeaturePhoto to imports from graphics-components\\n  import { FeaturePhoto } from '@reuters-graphics/graphics-components';\\n\\n  // These should be already imported for you.\\n  import content from '$locales/en/content.json';\\n  import { assets } from '$app/paths';\\n</script>\\n\\n{#each content.blocks as block}\\n  {#if block.Type === 'text'}\\n    <!-- ... other blocks -->\\n\\n    <!-- Copy/paste into your blocks loop! -->\\n  {:else if block.Type === 'photo'}\\n    <FeaturePhoto\\n      width=\\\"{block.Width}\\\"\\n      src=\\\"{`${assets}/${block.Src}`}\\\"\\n      altText=\\\"{block.AltText}\\\"\\n      caption=\\\"{block.Caption}\\\"\\n    />\\n    <!-- END copy/paste -->\\n  {/if}\\n{/each}\\n```\\n\"","export default \"If your photo is missing `altText` a small warning will overlay the image.\\n\"","export default \"__VITE_ASSET__d597932c__\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n  // @ts-ignore\n  import quickitDocs from './stories/docs/quickit.md?raw';\n  // @ts-ignore\n  import missingAltTextDocs from './stories/docs/missingAltText.md?raw';\n\n  import FeaturePhoto from './FeaturePhoto.svelte';\n\n  // @ts-ignore\n  import sharkSrc from './stories/shark.jpg';\n\n  import {\n    withComponentDocs,\n    withStoryDocs,\n  } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      width: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n      textWidth: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n    },\n  };\n</script>\n\n<Meta\n  title=\"Components/FeaturePhoto\"\n  component=\"{FeaturePhoto}\"\n  {...metaProps}\n/>\n\n<Template let:args>\n  <FeaturePhoto {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    src: sharkSrc,\n    altText: 'A shark!',\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n/>\n\n<Story\n  name=\"🚀 QUICKIT\"\n  args=\"{{\n    src: sharkSrc,\n    altText: 'A shark!',\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n  {...withStoryDocs(quickitDocs)}\n/>\n\n<Story\n  name=\"Missing altText\"\n  args=\"{{\n    src: sharkSrc,\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n  {...withStoryDocs(missingAltTextDocs)}\n/>\n"],"names":["componentDocs","quickitDocs","missingAltTextDocs","sharkSrc","ctx","FeaturePhoto","withStoryDocs","withComponentDocs"],"mappings":"8YAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECAAC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECAAC,EAAA,+ECAAC,EAAA,GAAA,IAAA,IAAA,qBAAA,YAAA,GAAA,EAAA,oCC0CKC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,2LALVC,CAAY,EACpBD,EAAS,CAAA,2MAUX,IAAKD,EACL,QAAS,WACT,MAAO,SACP,QAAS,2EAOT,IAAKA,EACL,QAAS,WACT,MAAO,SACP,QAAS,qCAEPG,EAAcL,CAAW,gHAM3B,IAAKE,EACL,MAAO,SACP,QAAS,qCAEPG,EAAcJ,CAAkB,qUAnChCE,EAAS,CAAA,CAAA,maAlBE,CACV,GAAAG,EAAkBP,CAAa,EAClC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO,GAExD,UAAS,CACP,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO"}
+{"version":3,"file":"FeaturePhoto.stories-89783d17.js","sources":["../../src/components/FeaturePhoto/stories/docs/component.md?raw","../../src/components/FeaturePhoto/stories/docs/quickit.md?raw","../../src/components/FeaturePhoto/stories/docs/missingAltText.md?raw","../../src/components/FeaturePhoto/stories/shark.jpg","../../src/components/FeaturePhoto/FeaturePhoto.stories.svelte"],"sourcesContent":["export default \"A full-width photo inside the text well.\\n\\n```svelte\\n<script>\\n  import { FeaturePhoto } from '@reuters-graphics/graphics-components';\\n  import { assets } from '$app/paths'; // 👈 If using in the Graphics Kit...\\n</script>\\n\\n<FeaturePhoto\\n  src=\\\"{`${assets}/images/myImage.jpg`}\\\"\\n  altText=\\\"Some alt text\\\"\\n  caption=\\\"A caption\\\"\\n  lazy=\\\"{false}\\\"\\n  width=\\\"normal\\\"\\n/>\\n```\\n\"","export default \"An example of using `FeaturePhoto` in the Graphics Kit with a Google Doc.\\n\\n```yaml\\n# Google doc block\\nType: photo\\nWidth: normal\\nSrc: images/shark.jpg\\nAltText: The king of the sea\\nCaption: Carcharodon carcharias - REUTERS\\n```\\n\\n```svelte\\n<!-- App.svelte -->\\n<script>\\n  // Add FeaturePhoto to imports from graphics-components\\n  import { FeaturePhoto } from '@reuters-graphics/graphics-components';\\n\\n  // These should be already imported for you.\\n  import content from '$locales/en/content.json';\\n  import { assets } from '$app/paths';\\n</script>\\n\\n{#each content.blocks as block}\\n  {#if block.Type === 'text'}\\n    <!-- ... other blocks -->\\n\\n    <!-- Copy/paste into your blocks loop! -->\\n  {:else if block.Type === 'photo'}\\n    <FeaturePhoto\\n      width=\\\"{block.Width}\\\"\\n      src=\\\"{`${assets}/${block.Src}`}\\\"\\n      altText=\\\"{block.AltText}\\\"\\n      caption=\\\"{block.Caption}\\\"\\n    />\\n    <!-- END copy/paste -->\\n  {/if}\\n{/each}\\n```\\n\"","export default \"If your photo is missing `altText` a small warning will overlay the image.\\n\"","export default \"__VITE_ASSET__d597932c__\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n  // @ts-ignore\n  import quickitDocs from './stories/docs/quickit.md?raw';\n  // @ts-ignore\n  import missingAltTextDocs from './stories/docs/missingAltText.md?raw';\n\n  import FeaturePhoto from './FeaturePhoto.svelte';\n\n  // @ts-ignore\n  import sharkSrc from './stories/shark.jpg';\n\n  import {\n    withComponentDocs,\n    withStoryDocs,\n  } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      width: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n      textWidth: {\n        control: 'select',\n        options: ['normal', 'wide', 'wider', 'widest', 'fluid'],\n      },\n    },\n  };\n</script>\n\n<Meta\n  title=\"Components/FeaturePhoto\"\n  component=\"{FeaturePhoto}\"\n  {...metaProps}\n/>\n\n<Template let:args>\n  <FeaturePhoto {...args} />\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    src: sharkSrc,\n    altText: 'A shark!',\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n/>\n\n<Story\n  name=\"🚀 QUICKIT\"\n  args=\"{{\n    src: sharkSrc,\n    altText: 'A shark!',\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n  {...withStoryDocs(quickitDocs)}\n/>\n\n<Story\n  name=\"Missing altText\"\n  args=\"{{\n    src: sharkSrc,\n    width: 'normal',\n    caption: 'Carcharodon carcharias - REUTERS',\n  }}\"\n  {...withStoryDocs(missingAltTextDocs)}\n/>\n"],"names":["componentDocs","quickitDocs","missingAltTextDocs","sharkSrc","ctx","FeaturePhoto","withStoryDocs","withComponentDocs"],"mappings":"8YAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECAAC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECAAC,EAAA,+ECAAC,EAAA,GAAA,IAAA,IAAA,qBAAA,YAAA,GAAA,EAAA,oCC0CKC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,2LALVC,CAAY,EACpBD,EAAS,CAAA,2MAUX,IAAKD,EACL,QAAS,WACT,MAAO,SACP,QAAS,2EAOT,IAAKA,EACL,QAAS,WACT,MAAO,SACP,QAAS,qCAEPG,EAAcL,CAAW,gHAM3B,IAAKE,EACL,MAAO,SACP,QAAS,qCAEPG,EAAcJ,CAAkB,qUAnChCE,EAAS,CAAA,CAAA,maAlBE,CACV,GAAAG,EAAkBP,CAAa,EAClC,SAAQ,CACN,MAAK,CACH,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO,GAExD,UAAS,CACP,QAAS,SACT,QAAO,CAAG,SAAU,OAAQ,QAAS,SAAU,OAAO"}

docs/assets/GraphicBlock.stories-f89c713b.js

@@ -1,4 +1,4 @@
-import{S as F,i as ee,s as te,o as b,y as k,b as A,P as ne,d as u,e as V,Q as oe,n as C,f as y,C as $,g as m,m as c,t as d,h as v,j as h}from"./index-4f5e5369.js";import{g as se,a as ae}from"./spread-8a54911c.js";import{p as re,M as ge,T as me,S as _}from"./collect-stories-6e37d46b.js";import{G}from"./GraphicBlock-fdcf18df.js";import{b as P,w as ce}from"./withParams-47e2ab71.js";import"./Block-67c7bec3.js";import"./PaddingReset-bdb61f35.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.
+import{S as F,i as ee,s as te,o as b,y as k,h as A,P as ne,b as u,k as V,Q as oe,n as C,f as y,C as $,c as m,m as c,t as d,a as v,d as h}from"./index-22a9b7f9.js";import{g as se,a as ae}from"./spread-8a54911c.js";import{p as re,M as ge,T as me,S as _}from"./collect-stories-4618f393.js";import{G}from"./GraphicBlock-bbd26274.js";import{b as P,w as ce}from"./withParams-47e2ab71.js";import"./Block-98bec5bc.js";import"./PaddingReset-8f18545b.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:
 
@@ -181,4 +181,4 @@ Source: [Google research](https://google.com)`}}});const K=[{name:"🚀 QUICKIT"
 >
   <AiMap />
 </GraphicBlock>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","quickitDocs","customTextDocs","ai2svelteDocs","ariaDocs","GraphicBlock","AiMap","withComponentDocs","withStoryDocs","PlaceholderImg"]}),Ue=T.meta,Le=["Default","QUICKIT","CustomText","Ai2svelte","ARIA"],ze=T.stories.Default,je=T.stories.QUICKIT,Ve=T.stories.CustomText,Xe=T.stories.Ai2svelte,Je=T.stories.ARIA;export{Je as ARIA,Xe as Ai2svelte,Ve as CustomText,ze as Default,je as QUICKIT,Le as __namedExportsOrder,Ue as default};
-//# sourceMappingURL=GraphicBlock.stories-ea4a97e3.js.map
+//# sourceMappingURL=GraphicBlock.stories-f89c713b.js.map

docs/assets/Headline.stories-bc27e2f3.js

@@ -1,4 +1,4 @@
-import{S as at,i as nt,s as pt,o as T,y as $,b as p,P as vt,d as m,e as U,Q as ct,n as P,f,C as I,g as u,m as y,t as w,h as A,j as b,F as mt}from"./index-4f5e5369.js";import{g as gt,a as ot}from"./spread-8a54911c.js";import{p as ft,M as ht,T as xt,S as N}from"./collect-stories-6e37d46b.js";import{H as S}from"./Headline-e853d449.js";import{b as H,w as ut}from"./withParams-47e2ab71.js";import"./Block-67c7bec3.js";import"./Byline-45dd4719.js";import"./each-e59479a4.js";import"./_commonjsHelpers-de833af9.js";import"./journalize-07958dc6.js";import"./marked.esm-76161808.js";const yt=`Reuters Graphics headline
+import{S as at,i as nt,s as pt,o as T,y as $,h as p,P as vt,b as m,k as U,Q as ct,n as P,f,C as I,c as u,m as y,t as w,a as A,d as b,F as mt}from"./index-22a9b7f9.js";import{g as gt,a as ot}from"./spread-8a54911c.js";import{p as ft,M as ht,T as xt,S as N}from"./collect-stories-4618f393.js";import{H as S}from"./Headline-fc1d181c.js";import{b as H,w as ut}from"./withParams-47e2ab71.js";import"./Block-98bec5bc.js";import"./Byline-0539bfbd.js";import"./each-e59479a4.js";import"./_commonjsHelpers-de833af9.js";import"./journalize-07958dc6.js";import"./marked.esm-76161808.js";const yt=`Reuters Graphics headline
 
 \`\`\`svelte
 <script>
@@ -119,7 +119,7 @@ import{S as at,i as nt,s as pt,o as T,y as $,b as p,P as vt,d as m,e as U,Q as c
 
 .custom-dek span {
   background-color: #fde68a;
-}`,p(e,"lang","scss")},m(a,c){y(t,a,c),m(a,s,c),m(a,e,c),n=!0},p(a,c){const o={};c&4&&(o.$$scope={dirty:c,ctx:a}),t.$set(o)},i(a){n||(w(t.$$.fragment,a),n=!0)},o(a){A(t.$$.fragment,a),n=!1},d(a){a&&(f(s),f(e)),b(t,a)}}}function Gt(l){let t,s;return{c(){t=T("img"),p(t,"slot","crown"),mt(t.src,s=_t)||p(t,"src",s),p(t,"width","100"),p(t,"class","mx-auto mb-0"),p(t,"alt","Illustration of Europe")},m(e,n){m(e,t,n)},p:P,d(e){e&&f(t)}}}function Mt(l){let t;return{c(){t=T("h1"),t.textContent="Europa",p(t,"slot","hed"),p(t,"class","!font-serif !tracking-wide")},m(s,e){m(s,t,e)},p:P,d(s){s&&f(t)}}}function Bt(l){let t,s;return t=new S({props:{class:"!fmt-3",publishTime:new Date("2020-01-01").toISOString(),$$slots:{hed:[Mt],crown:[Gt]},$$scope:{ctx:l}}}),{c(){u(t.$$.fragment)},m(e,n){y(t,e,n),s=!0},p(e,n){const a={};n&4&&(a.$$scope={dirty:n,ctx:e}),t.$set(a)},i(e){s||(w(t.$$.fragment,e),s=!0)},o(e){A(t.$$.fragment,e),s=!1},d(e){b(t,e)}}}function Ot(l){let t,s,e;return s=new rt({}),{c(){t=T("div"),u(s.$$.fragment),p(t,"slot","crown")},m(n,a){m(n,t,a),y(s,t,null),e=!0},p:P,i(n){e||(w(s.$$.fragment,n),e=!0)},o(n){A(s.$$.fragment,n),e=!1},d(n){n&&f(t),b(s)}}}function Kt(l){let t,s;return t=new S({props:{width:"wider",class:"!fmt-1",hed:"Unfriendly skies",dek:"How Russia’s invasion of Ukraine is redrawing air routes",section:"Ukraine Crisis",authors:["Simon Scarr","Vijdan Mohammad Kawoosa"],publishTime:new Date("2022-03-04").toISOString(),$$slots:{crown:[Ot]},$$scope:{ctx:l}}}),{c(){u(t.$$.fragment)},m(e,n){y(t,e,n),s=!0},p(e,n){const a={};n&4&&(a.$$scope={dirty:n,ctx:e}),t.$set(a)},i(e){s||(w(t.$$.fragment,e),s=!0)},o(e){A(t.$$.fragment,e),s=!1},d(e){b(t,e)}}}function Ft(l){let t,s,e,n,a,c,o,h,d,x,v,r,_,C,k,E;const R=[{title:"Components/Headline"},{component:S},l[0]];let L={};for(let i=0;i<R.length;i+=1)L=I(L,R[i]);t=new ht({props:L}),e=new xt({props:{$$slots:{default:[Ht,({args:i})=>({1:i}),({args:i})=>i?2:0]},$$scope:{ctx:l}}}),a=new N({props:{name:"Default",args:{section:"World News",hed:"Reuters Graphics interactive",hedSize:"normal",dek:"",authors:[]}}});const K=[{name:"With dek"},H(At)];let W={$$slots:{default:[Et]},$$scope:{ctx:l}};for(let i=0;i<K.length;i+=1)W=I(W,K[i]);o=new N({props:W});const F=[{name:"With byline"},H(wt)];let G={$$slots:{default:[Ut]},$$scope:{ctx:l}};for(let i=0;i<F.length;i+=1)G=I(G,F[i]);d=new N({props:G});const Y=[{name:"With custom hed"},H(bt)];let M={$$slots:{default:[Wt]},$$scope:{ctx:l}};for(let i=0;i<Y.length;i+=1)M=I(M,Y[i]);v=new N({props:M});const j=[{name:"With crown image"},H($t)];let B={$$slots:{default:[Bt]},$$scope:{ctx:l}};for(let i=0;i<j.length;i+=1)B=I(B,j[i]);_=new N({props:B});const z=[{name:"With crown graphic"},H(Tt)];let O={$$slots:{default:[Kt]},$$scope:{ctx:l}};for(let i=0;i<z.length;i+=1)O=I(O,z[i]);return k=new N({props:O}),{c(){u(t.$$.fragment),s=$(),u(e.$$.fragment),n=$(),u(a.$$.fragment),c=$(),u(o.$$.fragment),h=$(),u(d.$$.fragment),x=$(),u(v.$$.fragment),r=$(),u(_.$$.fragment),C=$(),u(k.$$.fragment)},m(i,g){y(t,i,g),m(i,s,g),y(e,i,g),m(i,n,g),y(a,i,g),m(i,c,g),y(o,i,g),m(i,h,g),y(d,i,g),m(i,x,g),y(v,i,g),m(i,r,g),y(_,i,g),m(i,C,g),y(k,i,g),E=!0},p(i,[g]){const dt=g&1?gt(R,[R[0],R[1],ot(i[0])]):{};t.$set(dt);const V={};g&6&&(V.$$scope={dirty:g,ctx:i}),e.$set(V);const q={};g&4&&(q.$$scope={dirty:g,ctx:i}),o.$set(q);const X={};g&4&&(X.$$scope={dirty:g,ctx:i}),d.$set(X);const Z={};g&4&&(Z.$$scope={dirty:g,ctx:i}),v.$set(Z);const Q={};g&4&&(Q.$$scope={dirty:g,ctx:i}),_.$set(Q);const J={};g&4&&(J.$$scope={dirty:g,ctx:i}),k.$set(J)},i(i){E||(w(t.$$.fragment,i),w(e.$$.fragment,i),w(a.$$.fragment,i),w(o.$$.fragment,i),w(d.$$.fragment,i),w(v.$$.fragment,i),w(_.$$.fragment,i),w(k.$$.fragment,i),E=!0)},o(i){A(t.$$.fragment,i),A(e.$$.fragment,i),A(a.$$.fragment,i),A(o.$$.fragment,i),A(d.$$.fragment,i),A(v.$$.fragment,i),A(_.$$.fragment,i),A(k.$$.fragment,i),E=!1},d(i){i&&(f(s),f(n),f(c),f(h),f(x),f(r),f(C)),b(t,i),b(e,i),b(a,i),b(o,i),b(d,i),b(v,i),b(_,i),b(k,i)}}}function Yt(l){return[{...ut(yt),argTypes:{hedSize:{control:"select",options:["small","normal","big","bigger","biggest"]},width:{control:"select",options:["normal","wide","wider","widest"]}}}]}class jt extends at{constructor(t){super(),nt(this,t,Yt,Ft,pt,{})}}const D=ft(jt,{meta:{title:"Components/Headline"},stories:{"tpl:default":{name:"default",template:!0,source:"<Headline {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},WithDek:{name:"With dek",template:!1,source:`<Headline
+}`,p(e,"lang","scss")},m(a,c){y(t,a,c),m(a,s,c),m(a,e,c),n=!0},p(a,c){const o={};c&4&&(o.$$scope={dirty:c,ctx:a}),t.$set(o)},i(a){n||(w(t.$$.fragment,a),n=!0)},o(a){A(t.$$.fragment,a),n=!1},d(a){a&&(f(s),f(e)),b(t,a)}}}function Gt(l){let t,s;return{c(){t=T("img"),p(t,"slot","crown"),mt(t.src,s=_t)||p(t,"src",s),p(t,"width","100"),p(t,"class","mx-auto mb-0"),p(t,"alt","Illustration of Europe")},m(e,n){m(e,t,n)},p:P,d(e){e&&f(t)}}}function Mt(l){let t;return{c(){t=T("h1"),t.textContent="Europa",p(t,"slot","hed"),p(t,"class","!font-serif !tracking-wide")},m(s,e){m(s,t,e)},p:P,d(s){s&&f(t)}}}function Bt(l){let t,s;return t=new S({props:{class:"!fmt-3",publishTime:new Date("2020-01-01").toISOString(),$$slots:{hed:[Mt],crown:[Gt]},$$scope:{ctx:l}}}),{c(){u(t.$$.fragment)},m(e,n){y(t,e,n),s=!0},p(e,n){const a={};n&4&&(a.$$scope={dirty:n,ctx:e}),t.$set(a)},i(e){s||(w(t.$$.fragment,e),s=!0)},o(e){A(t.$$.fragment,e),s=!1},d(e){b(t,e)}}}function Ot(l){let t,s,e;return s=new rt({}),{c(){t=T("div"),u(s.$$.fragment),p(t,"slot","crown")},m(n,a){m(n,t,a),y(s,t,null),e=!0},p:P,i(n){e||(w(s.$$.fragment,n),e=!0)},o(n){A(s.$$.fragment,n),e=!1},d(n){n&&f(t),b(s)}}}function Kt(l){let t,s;return t=new S({props:{width:"wider",class:"!fmt-1",hed:"Unfriendly skies",dek:"How Russia’s invasion of Ukraine is redrawing air routes",section:"Ukraine Crisis",authors:["Simon Scarr","Vijdan Mohammad Kawoosa"],publishTime:new Date("2022-03-04").toISOString(),$$slots:{crown:[Ot]},$$scope:{ctx:l}}}),{c(){u(t.$$.fragment)},m(e,n){y(t,e,n),s=!0},p(e,n){const a={};n&4&&(a.$$scope={dirty:n,ctx:e}),t.$set(a)},i(e){s||(w(t.$$.fragment,e),s=!0)},o(e){A(t.$$.fragment,e),s=!1},d(e){b(t,e)}}}function Ft(l){let t,s,e,n,a,c,o,h,d,x,v,r,_,C,k,E;const R=[{title:"Components/Headline"},{component:S},l[0]];let L={};for(let i=0;i<R.length;i+=1)L=I(L,R[i]);t=new ht({props:L}),e=new xt({props:{$$slots:{default:[Ht,({args:i})=>({1:i}),({args:i})=>i?2:0]},$$scope:{ctx:l}}}),a=new N({props:{name:"Default",args:{section:"World News",hed:"Reuters Graphics interactive",hedSize:"normal",dek:"",authors:[]}}});const K=[{name:"With dek"},H(At)];let W={$$slots:{default:[Et]},$$scope:{ctx:l}};for(let i=0;i<K.length;i+=1)W=I(W,K[i]);o=new N({props:W});const F=[{name:"With byline"},H(wt)];let G={$$slots:{default:[Ut]},$$scope:{ctx:l}};for(let i=0;i<F.length;i+=1)G=I(G,F[i]);d=new N({props:G});const Y=[{name:"With custom hed"},H(bt)];let M={$$slots:{default:[Wt]},$$scope:{ctx:l}};for(let i=0;i<Y.length;i+=1)M=I(M,Y[i]);v=new N({props:M});const z=[{name:"With crown image"},H($t)];let B={$$slots:{default:[Bt]},$$scope:{ctx:l}};for(let i=0;i<z.length;i+=1)B=I(B,z[i]);_=new N({props:B});const j=[{name:"With crown graphic"},H(Tt)];let O={$$slots:{default:[Kt]},$$scope:{ctx:l}};for(let i=0;i<j.length;i+=1)O=I(O,j[i]);return k=new N({props:O}),{c(){u(t.$$.fragment),s=$(),u(e.$$.fragment),n=$(),u(a.$$.fragment),c=$(),u(o.$$.fragment),h=$(),u(d.$$.fragment),x=$(),u(v.$$.fragment),r=$(),u(_.$$.fragment),C=$(),u(k.$$.fragment)},m(i,g){y(t,i,g),m(i,s,g),y(e,i,g),m(i,n,g),y(a,i,g),m(i,c,g),y(o,i,g),m(i,h,g),y(d,i,g),m(i,x,g),y(v,i,g),m(i,r,g),y(_,i,g),m(i,C,g),y(k,i,g),E=!0},p(i,[g]){const dt=g&1?gt(R,[R[0],R[1],ot(i[0])]):{};t.$set(dt);const V={};g&6&&(V.$$scope={dirty:g,ctx:i}),e.$set(V);const q={};g&4&&(q.$$scope={dirty:g,ctx:i}),o.$set(q);const X={};g&4&&(X.$$scope={dirty:g,ctx:i}),d.$set(X);const Z={};g&4&&(Z.$$scope={dirty:g,ctx:i}),v.$set(Z);const Q={};g&4&&(Q.$$scope={dirty:g,ctx:i}),_.$set(Q);const J={};g&4&&(J.$$scope={dirty:g,ctx:i}),k.$set(J)},i(i){E||(w(t.$$.fragment,i),w(e.$$.fragment,i),w(a.$$.fragment,i),w(o.$$.fragment,i),w(d.$$.fragment,i),w(v.$$.fragment,i),w(_.$$.fragment,i),w(k.$$.fragment,i),E=!0)},o(i){A(t.$$.fragment,i),A(e.$$.fragment,i),A(a.$$.fragment,i),A(o.$$.fragment,i),A(d.$$.fragment,i),A(v.$$.fragment,i),A(_.$$.fragment,i),A(k.$$.fragment,i),E=!1},d(i){i&&(f(s),f(n),f(c),f(h),f(x),f(r),f(C)),b(t,i),b(e,i),b(a,i),b(o,i),b(d,i),b(v,i),b(_,i),b(k,i)}}}function Yt(l){return[{...ut(yt),argTypes:{hedSize:{control:"select",options:["small","normal","big","bigger","biggest"]},width:{control:"select",options:["normal","wide","wider","widest"]}}}]}class zt extends at{constructor(t){super(),nt(this,t,Yt,Ft,pt,{})}}const D=ft(zt,{meta:{title:"Components/Headline"},stories:{"tpl:default":{name:"default",template:!0,source:"<Headline {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},WithDek:{name:"With dek",template:!1,source:`<Headline
   hed="{'Reuters Graphics Interactive'}"
   dek="{'The beginning of a beautiful page'}"
   section="{'Global news'}"
@@ -172,4 +172,4 @@ background-color: #fde68a;
     <Map />
   </div>
 </Headline>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","withBylineDocs","withDekDocs","customHedDocs","withCrownImgDocs","withCrownGraphicDocs","crownImgSrc","Map","Headline","withComponentDocs","withStoryDocs"]}),le=D.meta,ae=["Default","WithDek","WithByline","WithCustomHed","WithCrownImage","WithCrownGraphic"],ne=D.stories.Default,pe=D.stories.WithDek,ge=D.stories.WithByline,oe=D.stories.WithCustomHed,re=D.stories.WithCrownImage,de=D.stories.WithCrownGraphic;export{ne as Default,ge as WithByline,de as WithCrownGraphic,re as WithCrownImage,oe as WithCustomHed,pe as WithDek,ae as __namedExportsOrder,le as default};
-//# sourceMappingURL=Headline.stories-27754cf1.js.map
+//# sourceMappingURL=Headline.stories-bc27e2f3.js.map

docs/assets/Hero.stories-9a63cc24.js

@@ -1,4 +1,4 @@
-import{S as Q,i as Y,s as Z,o as H,y as T,b as h,p as He,c as K,d as v,e as I,t as g,v as M,h as f,w as z,f as y,x as it,g as x,m as $,j as b,l as q,u as U,q as F,r as X,k as ce,P as Fe,Q as Xe,n as L,C,J}from"./index-4f5e5369.js";import{g as Je,a as Qe}from"./spread-8a54911c.js";import{p as st,M as at,T as nt,S as G}from"./collect-stories-6e37d46b.js";import{B as R}from"./Block-67c7bec3.js";import{S as N}from"./SiteHeader-96c4751d.js";import{H as ee}from"./Headline-e853d449.js";import{G as ge}from"./GraphicBlock-fdcf18df.js";import{B as lt}from"./Byline-45dd4719.js";import{P as ot}from"./PaddingReset-bdb61f35.js";import{F as rt}from"./FeaturePhoto-d0380275.js";import{V as Ye}from"./Video-820d2090.js";import{b as E,w as pt}from"./withParams-47e2ab71.js";import"./ReutersLogo-eb5a8075.js";import"./each-e59479a4.js";import"./index-2224dbf5.js";import"./time-f9db70de.js";import"./_commonjsHelpers-de833af9.js";import"./marked.esm-76161808.js";import"./journalize-07958dc6.js";import"./fa-870bc0bd.js";import"./index.es-a32769a3.js";const dt=`Reuters Graphics headline with a Hero media
+import{S as Q,i as Y,s as Z,o as H,y as T,h,p as He,j as K,b as v,k as I,t as g,v as M,a as f,w as z,f as y,x as it,c as x,m as $,d as b,l as q,u as U,q as F,r as X,e as ce,P as Fe,Q as Xe,n as L,C,J}from"./index-22a9b7f9.js";import{g as Je,a as Qe}from"./spread-8a54911c.js";import{p as st,M as at,T as nt,S as G}from"./collect-stories-4618f393.js";import{B as R}from"./Block-98bec5bc.js";import{S as N}from"./SiteHeader-42f5987c.js";import{H as ee}from"./Headline-fc1d181c.js";import{G as ge}from"./GraphicBlock-bbd26274.js";import{B as lt}from"./Byline-0539bfbd.js";import{P as ot}from"./PaddingReset-8f18545b.js";import{F as rt}from"./FeaturePhoto-afa92808.js";import{V as Ye}from"./Video-ae741b7a.js";import{b as E,w as pt}from"./withParams-47e2ab71.js";import"./ReutersLogo-f4fd87f3.js";import"./each-e59479a4.js";import"./index-2224dbf5.js";import"./time-f9db70de.js";import"./_commonjsHelpers-de833af9.js";import"./marked.esm-76161808.js";import"./journalize-07958dc6.js";import"./fa-7568ec37.js";import"./index.es-a32769a3.js";const dt=`Reuters Graphics headline with a Hero media
 
 \`\`\`svelte
 <script>
@@ -544,4 +544,4 @@ color: #ffffff;
 text-shadow: 1px 1px 8px #ff7c88;
 filter: drop-shadow(0px 0px 12px #ff7c88);
 }</style>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","backgroundGraphicDocs","inlineGraphicDocs","inlinePhotoDocs","transparentHeaderDocs","videoDocs","customHedDocs","polarImgSrc","eurovisImgSrc","Block","SiteHeader","HeroHeadline","GraphicBlock","FeaturePhoto","Video","CrashMap","QuakeMap","withComponentDocs","withStoryDocs"]}),Ki=B.meta,qi=["WithBackdropPhoto","WithTransparentHeader","WithBackdropGraphic","WithBackdropVideo","WithInlinePhoto","WithInlineGraphic","WithInlineVideo","WithCustomHed"],Ui=B.stories.WithBackdropPhoto,Fi=B.stories.WithTransparentHeader,Xi=B.stories.WithBackdropGraphic,Ji=B.stories.WithBackdropVideo,Qi=B.stories.WithInlinePhoto,Yi=B.stories.WithInlineGraphic,Zi=B.stories.WithInlineVideo,es=B.stories.WithCustomHed;export{Xi as WithBackdropGraphic,Ui as WithBackdropPhoto,Ji as WithBackdropVideo,es as WithCustomHed,Yi as WithInlineGraphic,Qi as WithInlinePhoto,Zi as WithInlineVideo,Fi as WithTransparentHeader,qi as __namedExportsOrder,Ki as default};
-//# sourceMappingURL=Hero.stories-4afa1dc7.js.map
+//# sourceMappingURL=Hero.stories-9a63cc24.js.map

docs/assets/ImportSnippet-059f6761.js

@@ -1,3 +0,0 @@
-import{R as t,r as o}from"./index-355f1576.js";import{S as i,p as m}from"./prism-40ece543.js";import{s as u}from"./scss-efc2351e.js";const d="_title_daft4_1",g="_table_daft4_20",f="_importsnippet_daft4_125",r={title:d,table:g,importsnippet:f};i.registerLanguage("scss",u);const _=s=>{const[e,c]=o.useState(!1);let a;o.useEffect(()=>{a&&clearTimeout(a),a=setTimeout(()=>{c(!1)},1500)},[e]);const n=async({partial:p})=>{const l=`@import "@reuters-graphics/graphics-components/dist/scss/colours/${p}";`;await navigator.clipboard.writeText(l),c(!0)};return t.createElement("button",{className:"copy-btn",onClick:()=>n(s)},t.createElement("span",{className:"material-symbols-outlined"},"content_copy"),e&&t.createElement("span",{className:"copy-tag"},"Copied"))},h=({included:s=!1,partial:e="thematic/_tr.scss"})=>s?t.createElement("div",{className:r.importsnippet},t.createElement("p",null,"Included")):t.createElement("div",{className:r.importsnippet},t.createElement(i,{language:"scss",style:m},`// global.scss 
-@import "@reuters-graphics/graphics-components/dist/scss/colours/${e}";`),t.createElement(_,{partial:e}));export{h as I,r as c};
-//# sourceMappingURL=ImportSnippet-059f6761.js.map

docs/assets/ImportSnippet-059f6761.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImportSnippet-059f6761.js","sources":["../../src/docs/docs-components/CopyColourTable/ImportSnippet.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport SyntaxHighlighter from 'react-syntax-highlighter/dist/esm/prism-light';\n// @ts-ignore\nimport classes from './styles.module.scss';\nimport prism from 'react-syntax-highlighter/dist/esm/styles/prism/prism';\nimport scss from 'react-syntax-highlighter/dist/esm/languages/prism/scss';\n\nSyntaxHighlighter.registerLanguage('scss', scss);\n\nconst Copyable = (props) => {\n  const [copied, setCopied] = useState(false);\n\n  let timeout;\n\n  useEffect(() => {\n    if(timeout) clearTimeout(timeout);\n    timeout = setTimeout(() => { setCopied(false); }, 1500);\n  }, [copied]);\n\n  const handleClick = async({ partial }) => {\n    const copyText = `@import \"@reuters-graphics/graphics-components/dist/scss/colours/${partial}\";`\n    await navigator.clipboard.writeText(copyText);\n    setCopied(true);\n  }\n\n  return (\n    <button className=\"copy-btn\" onClick={() => handleClick(props)}>\n      <span className=\"material-symbols-outlined\">content_copy</span>\n      {copied && <span className=\"copy-tag\">Copied</span>}\n    </button>\n  );\n}\n\nconst ImportSnippet = ({ included = false, partial = 'thematic/_tr.scss' }) => {\n  return included ? (\n    <div className={classes.importsnippet}>\n      <p>Included</p>\n    </div>\n  ) : (\n    <div className={classes.importsnippet}>\n      <SyntaxHighlighter language=\"scss\" style={prism}>\n        {`// global.scss \\n@import \"@reuters-graphics/graphics-components/dist/scss/colours/${partial}\";`}\n      </SyntaxHighlighter>\n      <Copyable partial={partial} />\n    </div>\n  )\n};\n\nexport default ImportSnippet;"],"names":["SyntaxHighlighter","scss","Copyable","props","copied","setCopied","useState","timeout","useEffect","handleClick","partial","copyText","React","ImportSnippet","included","classes","prism"],"mappings":"mPAQAA,EAAkB,iBAAiB,OAAQC,CAAI,EAE/C,MAAMC,EAAYC,GAAU,CAC1B,KAAM,CAACC,EAAQC,CAAS,EAAIC,WAAS,EAAK,EAEtC,IAAAC,EAEJC,EAAAA,UAAU,IAAM,CACXD,GAAS,aAAaA,CAAO,EAChCA,EAAU,WAAW,IAAM,CAAEF,EAAU,EAAK,GAAM,IAAI,CAAA,EACrD,CAACD,CAAM,CAAC,EAEX,MAAMK,EAAc,MAAM,CAAE,QAAAC,KAAc,CAClC,MAAAC,EAAW,oEAAoED,CAAO,KACtF,MAAA,UAAU,UAAU,UAAUC,CAAQ,EAC5CN,EAAU,EAAI,CAAA,EAId,OAAAO,EAAA,cAAC,UAAO,UAAU,WAAW,QAAS,IAAMH,EAAYN,CAAK,GAC3DS,EAAA,cAAC,QAAK,UAAU,2BAAA,EAA4B,cAAY,EACvDR,mBAAW,OAAK,CAAA,UAAU,UAAW,EAAA,QAAM,CAC9C,CAEJ,EAEMS,EAAgB,CAAC,CAAE,SAAAC,EAAW,GAAO,QAAAJ,EAAU,uBAC5CI,kBACJ,MAAI,CAAA,UAAWC,EAAQ,aACtB,EAAAH,EAAA,cAAC,SAAE,UAAQ,CACb,EAECA,EAAA,cAAA,MAAA,CAAI,UAAWG,EAAQ,aAAA,kBACrBf,EAAkB,CAAA,SAAS,OAAO,MAAOgB,CACvC,EAAA;AAAA,mEAAqFN,CAAO,IAC/F,EACCE,EAAA,cAAAV,EAAA,CAAS,QAAAQ,CAAkB,CAAA,CAC9B"}

docs/assets/ImportSnippet-503f745b.js

@@ -0,0 +1,3 @@
+import{R as e,r}from"./index-5b61f687.js";import{S as n,p as u}from"./prism-e6636ad9.js";import{s as g}from"./scss-efc2351e.js";const d="_title_daft4_1",f="_table_daft4_20",_="_importsnippet_daft4_125",o={title:d,table:f,importsnippet:_};n.registerLanguage("scss",g);const p=t=>t.replace(/\/_/,"/").replace(/\.scss$/,""),E=t=>{const[s,c]=r.useState(!1);let a;r.useEffect(()=>{a&&clearTimeout(a),a=setTimeout(()=>{c(!1)},1500)},[s]);const i=async({partial:l})=>{const m=`@import "@reuters-graphics/graphics-components/scss/colours/${p(l)}";`;await navigator.clipboard.writeText(m),c(!0)};return e.createElement("button",{className:"copy-btn",onClick:()=>i(t)},e.createElement("span",{className:"material-symbols-outlined"},"content_copy"),s&&e.createElement("span",{className:"copy-tag"},"Copied"))},x=({included:t=!1,partial:s="thematic/_tr.scss"})=>t?e.createElement("div",{className:o.importsnippet},e.createElement("p",null,"Included")):e.createElement("div",{className:o.importsnippet},e.createElement(n,{language:"scss",style:u},`// global.scss 
+@import "@reuters-graphics/graphics-components/scss/colours/${p(s)}";`),e.createElement(E,{partial:s}));export{x as I,o as c};
+//# sourceMappingURL=ImportSnippet-503f745b.js.map

docs/assets/ImportSnippet-503f745b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImportSnippet-503f745b.js","sources":["../../src/docs/docs-components/CopyColourTable/ImportSnippet.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport SyntaxHighlighter from 'react-syntax-highlighter/dist/esm/prism-light';\n// @ts-ignore\nimport classes from './styles.module.scss';\nimport prism from 'react-syntax-highlighter/dist/esm/styles/prism/prism';\nimport scss from 'react-syntax-highlighter/dist/esm/languages/prism/scss';\n\nSyntaxHighlighter.registerLanguage('scss', scss);\n\nconst formatPartial = (partial) => {\n  return partial.replace(/\\/_/, '/').replace(/\\.scss$/, '');\n};\n\nconst Copyable = (props) => {\n  const [copied, setCopied] = useState(false);\n\n  let timeout;\n\n  useEffect(() => {\n    if(timeout) clearTimeout(timeout);\n    timeout = setTimeout(() => { setCopied(false); }, 1500);\n  }, [copied]);\n\n  const handleClick = async({ partial }) => {\n    const copyText = `@import \"@reuters-graphics/graphics-components/scss/colours/${formatPartial(partial)}\";`\n    await navigator.clipboard.writeText(copyText);\n    setCopied(true);\n  }\n\n  return (\n    <button className=\"copy-btn\" onClick={() => handleClick(props)}>\n      <span className=\"material-symbols-outlined\">content_copy</span>\n      {copied && <span className=\"copy-tag\">Copied</span>}\n    </button>\n  );\n}\n\nconst ImportSnippet = ({ included = false, partial = 'thematic/_tr.scss' }) => {\n  return included ? (\n    <div className={classes.importsnippet}>\n      <p>Included</p>\n    </div>\n  ) : (\n    <div className={classes.importsnippet}>\n      <SyntaxHighlighter language=\"scss\" style={prism}>\n        {`// global.scss \\n@import \"@reuters-graphics/graphics-components/scss/colours/${formatPartial(partial)}\";`}\n      </SyntaxHighlighter>\n      <Copyable partial={partial} />\n    </div>\n  )\n};\n\nexport default ImportSnippet;"],"names":["SyntaxHighlighter","scss","formatPartial","partial","Copyable","props","copied","setCopied","useState","timeout","useEffect","handleClick","copyText","React","ImportSnippet","included","classes","prism"],"mappings":"8OAQAA,EAAkB,iBAAiB,OAAQC,CAAI,EAE/C,MAAMC,EAAiBC,GACdA,EAAQ,QAAQ,MAAO,GAAG,EAAE,QAAQ,UAAW,EAAE,EAGpDC,EAAYC,GAAU,CAC1B,KAAM,CAACC,EAAQC,CAAS,EAAIC,WAAS,EAAK,EAEtC,IAAAC,EAEJC,EAAAA,UAAU,IAAM,CACXD,GAAS,aAAaA,CAAO,EAChCA,EAAU,WAAW,IAAM,CAAEF,EAAU,EAAK,GAAM,IAAI,CAAA,EACrD,CAACD,CAAM,CAAC,EAEX,MAAMK,EAAc,MAAM,CAAE,QAAAR,KAAc,CACxC,MAAMS,EAAW,+DAA+DV,EAAcC,CAAO,CAAC,KAChG,MAAA,UAAU,UAAU,UAAUS,CAAQ,EAC5CL,EAAU,EAAI,CAAA,EAId,OAAAM,EAAA,cAAC,UAAO,UAAU,WAAW,QAAS,IAAMF,EAAYN,CAAK,GAC3DQ,EAAA,cAAC,QAAK,UAAU,2BAAA,EAA4B,cAAY,EACvDP,mBAAW,OAAK,CAAA,UAAU,UAAW,EAAA,QAAM,CAC9C,CAEJ,EAEMQ,EAAgB,CAAC,CAAE,SAAAC,EAAW,GAAO,QAAAZ,EAAU,uBAC5CY,kBACJ,MAAI,CAAA,UAAWC,EAAQ,aACtB,EAAAH,EAAA,cAAC,SAAE,UAAQ,CACb,EAECA,EAAA,cAAA,MAAA,CAAI,UAAWG,EAAQ,aAAA,kBACrBhB,EAAkB,CAAA,SAAS,OAAO,MAAOiB,CACvC,EAAA;AAAA,8DAAgFf,EAAcC,CAAO,CAAC,IACzG,EACCU,EAAA,cAAAT,EAAA,CAAS,QAAAD,EAAkB,CAC9B"}

docs/assets/PaddingReset-8f18545b.js

@@ -1,2 +1,2 @@
-import{S as v,i as g,s as h,k as w,d as _,v as I,h as u,w as F,t as c,f as p,l as m,u as b,q as k,r as y,o as P,b as R}from"./index-4f5e5369.js";function q(a){let t;const l=a[2].default,n=m(l,a,a[1],null);return{c(){n&&n.c()},m(e,s){n&&n.m(e,s),t=!0},p(e,s){n&&n.p&&(!t||s&2)&&b(n,l,e,e[1],t?y(l,e[1],s,null):k(e[1]),null)},i(e){t||(c(n,e),t=!0)},o(e){u(n,e),t=!1},d(e){n&&n.d(e)}}}function S(a){let t,l;const n=a[2].default,e=m(n,a,a[1],null);return{c(){t=P("div"),e&&e.c(),R(t,"class","svelte-vjyw8p")},m(s,i){_(s,t,i),e&&e.m(t,null),l=!0},p(s,i){e&&e.p&&(!l||i&2)&&b(e,n,s,s[1],l?y(n,s[1],i,null):k(s[1]),null)},i(s){l||(c(e,s),l=!0)},o(s){u(e,s),l=!1},d(s){s&&p(t),e&&e.d(s)}}}function j(a){let t,l,n,e;const s=[S,q],i=[];function f(o,r){return o[0]?0:1}return t=f(a),l=i[t]=s[t](a),{c(){l.c(),n=w()},m(o,r){i[t].m(o,r),_(o,n,r),e=!0},p(o,[r]){let d=t;t=f(o),t===d?i[t].p(o,r):(I(),u(i[d],1,1,()=>{i[d]=null}),F(),l=i[t],l?l.p(o,r):(l=i[t]=s[t](o),l.c()),c(l,1),l.m(n.parentNode,n))},i(o){e||(c(l),e=!0)},o(o){u(l),e=!1},d(o){o&&p(n),i[t].d(o)}}}function C(a,t,l){let{$$slots:n={},$$scope:e}=t,{containerIsFluid:s=!0}=t;return a.$$set=i=>{"containerIsFluid"in i&&l(0,s=i.containerIsFluid),"$$scope"in i&&l(1,e=i.$$scope)},[s,e,n]}class N extends v{constructor(t){super(),g(this,t,C,j,h,{containerIsFluid:0})}}N.__docgen={version:3,name:"PaddingReset.svelte",data:[{keywords:[],visibility:"public",description:"If parent container is fluid, which resets the padding around contained elements.",name:"containerIsFluid",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!0}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"Padded content",name:"default"}],refs:[]};export{N as P};
-//# sourceMappingURL=PaddingReset-bdb61f35.js.map
+import{S as v,i as g,s as h,e as w,b as _,v as I,a as u,w as F,t as c,f as p,l as m,u as b,q as k,r as y,o as P,h as R}from"./index-22a9b7f9.js";function q(a){let t;const l=a[2].default,n=m(l,a,a[1],null);return{c(){n&&n.c()},m(e,s){n&&n.m(e,s),t=!0},p(e,s){n&&n.p&&(!t||s&2)&&b(n,l,e,e[1],t?y(l,e[1],s,null):k(e[1]),null)},i(e){t||(c(n,e),t=!0)},o(e){u(n,e),t=!1},d(e){n&&n.d(e)}}}function S(a){let t,l;const n=a[2].default,e=m(n,a,a[1],null);return{c(){t=P("div"),e&&e.c(),R(t,"class","svelte-vjyw8p")},m(s,i){_(s,t,i),e&&e.m(t,null),l=!0},p(s,i){e&&e.p&&(!l||i&2)&&b(e,n,s,s[1],l?y(n,s[1],i,null):k(s[1]),null)},i(s){l||(c(e,s),l=!0)},o(s){u(e,s),l=!1},d(s){s&&p(t),e&&e.d(s)}}}function j(a){let t,l,n,e;const s=[S,q],i=[];function d(o,r){return o[0]?0:1}return t=d(a),l=i[t]=s[t](a),{c(){l.c(),n=w()},m(o,r){i[t].m(o,r),_(o,n,r),e=!0},p(o,[r]){let f=t;t=d(o),t===f?i[t].p(o,r):(I(),u(i[f],1,1,()=>{i[f]=null}),F(),l=i[t],l?l.p(o,r):(l=i[t]=s[t](o),l.c()),c(l,1),l.m(n.parentNode,n))},i(o){e||(c(l),e=!0)},o(o){u(l),e=!1},d(o){o&&p(n),i[t].d(o)}}}function C(a,t,l){let{$$slots:n={},$$scope:e}=t,{containerIsFluid:s=!0}=t;return a.$$set=i=>{"containerIsFluid"in i&&l(0,s=i.containerIsFluid),"$$scope"in i&&l(1,e=i.$$scope)},[s,e,n]}class N extends v{constructor(t){super(),g(this,t,C,j,h,{containerIsFluid:0})}}N.__docgen={version:3,name:"PaddingReset.svelte",data:[{keywords:[],visibility:"public",description:"If parent container is fluid, which resets the padding around contained elements.",name:"containerIsFluid",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"boolean",type:"boolean"},defaultValue:!0}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[{keywords:[],visibility:"public",description:"Padded content",name:"default"}],refs:[]};export{N as P};
+//# sourceMappingURL=PaddingReset-8f18545b.js.map

docs/assets/PaddingReset-8f18545b.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaddingReset-bdb61f35.js","sources":["../../src/components/PaddingReset/PaddingReset.svelte"],"sourcesContent":["<script>\n  /**\n   * If parent container is fluid, which resets the padding around contained elements.\n   */\n  export let containerIsFluid = true;\n</script>\n\n{#if containerIsFluid}\n  <div>\n    <!-- Padded content -->\n    <slot />\n  </div>\n{:else}\n  <!-- Padded content -->\n  <slot />\n{/if}\n\n<style>\n  div {\n    width: 100%;\n    padding: 0 15px;\n  }\n</style>\n"],"names":["insert","target","div","anchor","ctx","containerIsFluid","$$props"],"mappings":"ggBAQEA,EAGKC,EAAAC,EAAAC,CAAA,sOAJFC,EAAgB,CAAA,EAAA,wVAHR,CAAA,iBAAAC,EAAmB,EAAI,EAAAC"}
+{"version":3,"file":"PaddingReset-8f18545b.js","sources":["../../src/components/PaddingReset/PaddingReset.svelte"],"sourcesContent":["<script>\n  /**\n   * If parent container is fluid, which resets the padding around contained elements.\n   */\n  export let containerIsFluid = true;\n</script>\n\n{#if containerIsFluid}\n  <div>\n    <!-- Padded content -->\n    <slot />\n  </div>\n{:else}\n  <!-- Padded content -->\n  <slot />\n{/if}\n\n<style>\n  div {\n    width: 100%;\n    padding: 0 15px;\n  }\n</style>\n"],"names":["insert","target","div","anchor","ctx","containerIsFluid","$$props"],"mappings":"ggBAQEA,EAGKC,EAAAC,EAAAC,CAAA,sOAJFC,EAAgB,CAAA,EAAA,wVAHR,CAAA,iBAAAC,EAAmB,EAAI,EAAAC"}

docs/assets/PaddingReset.stories-51a5251e.js

@@ -1,4 +1,4 @@
-import{S as y,i as A,s as C,C as v,g as c,y as h,m,d as $,t as f,h as u,f as _,j as g,o as P,b as R,n as S}from"./index-4f5e5369.js";import{g as x,a as I}from"./spread-8a54911c.js";import{p as M,M as T,T as j,S as F}from"./collect-stories-6e37d46b.js";import{P as k}from"./PaddingReset-bdb61f35.js";import{B as q}from"./Block-67c7bec3.js";import{w as E}from"./withParams-47e2ab71.js";const O=`Sometimes you want a visual element to be fluid, i.e., edge-to-edge, but keep padding on text that's adajcent to it.
+import{S as y,i as A,s as C,C as v,c,y as h,m,b as $,t as f,a as u,f as _,d as g,o as P,h as R,n as S}from"./index-22a9b7f9.js";import{g as x,a as I}from"./spread-8a54911c.js";import{p as M,M as T,T as F,S as j}from"./collect-stories-4618f393.js";import{P as k}from"./PaddingReset-8f18545b.js";import{B as q}from"./Block-98bec5bc.js";import{w as E}from"./withParams-47e2ab71.js";const O=`Sometimes you want a visual element to be fluid, i.e., edge-to-edge, but keep padding on text that's adajcent to it.
 
 The \`PaddingReset\` component resets padding on the \`Article\` well that's been cancelled by a \`Block\` with a \`fluid\` width.
 
@@ -33,10 +33,10 @@ You can also add the padding conditionally by using the \`containerIsFluid\` pro
   </PaddingReset>
 </Block>
 \`\`\`
-`;function Y(l){let t;return{c(){t=P("div"),R(t,"class","inner svelte-2p4lln")},m(a,s){$(a,t,s)},p:S,d(a){a&&_(t)}}}function z(l){let t,a,s,o;const r=[l[0]];let d={$$slots:{default:[Y]},$$scope:{ctx:l}};for(let n=0;n<r.length;n+=1)d=v(d,r[n]);return s=new k({props:d}),{c(){t=P("div"),a=h(),c(s.$$.fragment),R(t,"class","outer svelte-2p4lln")},m(n,i){$(n,t,i),$(n,a,i),m(s,n,i),o=!0},p(n,i){const e=i&1?x(r,[I(n[0])]):{};i&2&&(e.$$scope={dirty:i,ctx:n}),s.$set(e)},i(n){o||(f(s.$$.fragment,n),o=!0)},o(n){u(s.$$.fragment,n),o=!1},d(n){n&&(_(t),_(a)),g(s,n)}}}function G(l){let t,a;return t=new q({props:{width:"fluid",$$slots:{default:[z]},$$scope:{ctx:l}}}),{c(){c(t.$$.fragment)},m(s,o){m(t,s,o),a=!0},p(s,o){const r={};o&3&&(r.$$scope={dirty:o,ctx:s}),t.$set(r)},i(s){a||(f(t.$$.fragment,s),a=!0)},o(s){u(t.$$.fragment,s),a=!1},d(s){g(t,s)}}}function H(l){let t,a,s,o,r,d;const n=[{title:"Components/PaddingReset"},{component:k},E(O)];let i={};for(let e=0;e<n.length;e+=1)i=v(i,n[e]);return t=new T({props:i}),s=new j({props:{$$slots:{default:[G,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:l}}}),r=new F({props:{name:"Default",args:{containerIsFluid:!0}}}),{c(){c(t.$$.fragment),a=h(),c(s.$$.fragment),o=h(),c(r.$$.fragment)},m(e,p){m(t,e,p),$(e,a,p),m(s,e,p),$(e,o,p),m(r,e,p),d=!0},p(e,[p]){const D={};t.$set(D);const w={};p&3&&(w.$$scope={dirty:p,ctx:e}),s.$set(w)},i(e){d||(f(t.$$.fragment,e),f(s.$$.fragment,e),f(r.$$.fragment,e),d=!0)},o(e){u(t.$$.fragment,e),u(s.$$.fragment,e),u(r.$$.fragment,e),d=!1},d(e){e&&(_(a),_(o)),g(t,e),g(s,e),g(r,e)}}}class B extends y{constructor(t){super(),A(this,t,null,H,C,{})}}B.__docgen={version:3,name:"PaddingReset.stories.svelte",data:[],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const b=M(B,{meta:{title:"Components/PaddingReset"},stories:{"tpl:default":{name:"default",template:!0,source:`<Block width="fluid">
+`;function Y(l){let t;return{c(){t=P("div"),R(t,"class","inner svelte-2p4lln")},m(a,s){$(a,t,s)},p:S,d(a){a&&_(t)}}}function z(l){let t,a,s,o;const r=[l[0]];let d={$$slots:{default:[Y]},$$scope:{ctx:l}};for(let n=0;n<r.length;n+=1)d=v(d,r[n]);return s=new k({props:d}),{c(){t=P("div"),a=h(),c(s.$$.fragment),R(t,"class","outer svelte-2p4lln")},m(n,i){$(n,t,i),$(n,a,i),m(s,n,i),o=!0},p(n,i){const e=i&1?x(r,[I(n[0])]):{};i&2&&(e.$$scope={dirty:i,ctx:n}),s.$set(e)},i(n){o||(f(s.$$.fragment,n),o=!0)},o(n){u(s.$$.fragment,n),o=!1},d(n){n&&(_(t),_(a)),g(s,n)}}}function G(l){let t,a;return t=new q({props:{width:"fluid",$$slots:{default:[z]},$$scope:{ctx:l}}}),{c(){c(t.$$.fragment)},m(s,o){m(t,s,o),a=!0},p(s,o){const r={};o&3&&(r.$$scope={dirty:o,ctx:s}),t.$set(r)},i(s){a||(f(t.$$.fragment,s),a=!0)},o(s){u(t.$$.fragment,s),a=!1},d(s){g(t,s)}}}function H(l){let t,a,s,o,r,d;const n=[{title:"Components/PaddingReset"},{component:k},E(O)];let i={};for(let e=0;e<n.length;e+=1)i=v(i,n[e]);return t=new T({props:i}),s=new F({props:{$$slots:{default:[G,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:l}}}),r=new j({props:{name:"Default",args:{containerIsFluid:!0}}}),{c(){c(t.$$.fragment),a=h(),c(s.$$.fragment),o=h(),c(r.$$.fragment)},m(e,p){m(t,e,p),$(e,a,p),m(s,e,p),$(e,o,p),m(r,e,p),d=!0},p(e,[p]){const D={};t.$set(D);const w={};p&3&&(w.$$scope={dirty:p,ctx:e}),s.$set(w)},i(e){d||(f(t.$$.fragment,e),f(s.$$.fragment,e),f(r.$$.fragment,e),d=!0)},o(e){u(t.$$.fragment,e),u(s.$$.fragment,e),u(r.$$.fragment,e),d=!1},d(e){e&&(_(a),_(o)),g(t,e),g(s,e),g(r,e)}}}class B extends y{constructor(t){super(),A(this,t,null,H,C,{})}}B.__docgen={version:3,name:"PaddingReset.stories.svelte",data:[],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const b=M(B,{meta:{title:"Components/PaddingReset"},stories:{"tpl:default":{name:"default",template:!0,source:`<Block width="fluid">
   <div class="outer"></div>
   <PaddingReset {...args}>
     <div class="inner"></div>
   </PaddingReset>
 </Block>`,hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!0}},allocatedIds:["default","Meta","Template","Story","componentDocs","PaddingReset","Block","withComponentDocs"]}),V=b.meta,W=["Default"],X=b.stories.Default;export{X as Default,W as __namedExportsOrder,V as default};
-//# sourceMappingURL=PaddingReset.stories-72291f3e.js.map
+//# sourceMappingURL=PaddingReset.stories-51a5251e.js.map

docs/assets/PaddingReset.stories-51a5251e.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaddingReset.stories-72291f3e.js","sources":["../../src/components/PaddingReset/stories/docs/component.md?raw","../../src/components/PaddingReset/PaddingReset.stories.svelte"],"sourcesContent":["export default \"Sometimes you want a visual element to be fluid, i.e., edge-to-edge, but keep padding on text that's adajcent to it.\\n\\nThe `PaddingReset` component resets padding on the `Article` well that's been cancelled by a `Block` with a `fluid` width.\\n\\n```svelte\\n<script>\\n  import { Block, PaddingReset } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<Block width=\\\"fluid\\\">\\n  <!-- An edge-to-edge image -->\\n  <img src=\\\"https//...\\\" alt=\\\"...\\\" width=\\\"100%\\\" />\\n  <PaddingReset>\\n    <p>A caption for the image that will still be padded.</p>\\n  </PaddingReset>\\n</Block>\\n```\\n\\nYou can also add the padding conditionally by using the `containerIsFluid` prop, which is what many other components in this library do.\\n\\n```svelte\\n<script>\\n  import { Block, PaddingReset } from '@reuters-graphics/graphics-components';\\n\\n  export let src = 'https://...';\\n  export let width = 'fluid';\\n</script>\\n\\n<Block width=\\\"{width}\\\">\\n  <img src=\\\"{src}\\\" alt=\\\"...\\\" width=\\\"100%\\\" />\\n  <PaddingReset containerIsFluid=\\\"{width === 'fluid'}\\\">\\n    <p>A caption for the image that will be padded when Block is fluid.</p>\\n  </PaddingReset>\\n</Block>\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import PaddingReset from './PaddingReset.svelte';\n  import Block from '../Block/Block.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/PaddingReset\"\n  component=\"{PaddingReset}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <Block width=\"fluid\">\n    <div class=\"outer\"></div>\n    <PaddingReset {...args}>\n      <div class=\"inner\"></div>\n    </PaddingReset>\n  </Block>\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    containerIsFluid: true,\n  }}\"\n  let:args\n/>\n\n<style lang=\"scss\">\n  div {\n    height: 30px;\n    width: 100%;\n    margin-bottom: 2px;\n    &.outer {\n      background: grey;\n    }\n    &.inner {\n      background: salmon;\n    }\n  }\n</style>\n"],"names":["componentDocs","insert","target","div","anchor","ctx","PaddingReset","withComponentDocs"],"mappings":"gYAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;uFCsBTC,EAAwBC,EAAAC,EAAAC,CAAA,yDADRC,EAAI,CAAA,CAAA,oMADtBJ,EAAwBC,EAAAC,EAAAC,CAAA,oDACNC,EAAI,CAAA,CAAA,CAAA,CAAA,igBAPZC,CAAY,EACpBC,EAAkBP,CAAa,4MAejC,KAAA,CAAA,iBAAkB,EAAI;;;;;"}
+{"version":3,"file":"PaddingReset.stories-51a5251e.js","sources":["../../src/components/PaddingReset/stories/docs/component.md?raw","../../src/components/PaddingReset/PaddingReset.stories.svelte"],"sourcesContent":["export default \"Sometimes you want a visual element to be fluid, i.e., edge-to-edge, but keep padding on text that's adajcent to it.\\n\\nThe `PaddingReset` component resets padding on the `Article` well that's been cancelled by a `Block` with a `fluid` width.\\n\\n```svelte\\n<script>\\n  import { Block, PaddingReset } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<Block width=\\\"fluid\\\">\\n  <!-- An edge-to-edge image -->\\n  <img src=\\\"https//...\\\" alt=\\\"...\\\" width=\\\"100%\\\" />\\n  <PaddingReset>\\n    <p>A caption for the image that will still be padded.</p>\\n  </PaddingReset>\\n</Block>\\n```\\n\\nYou can also add the padding conditionally by using the `containerIsFluid` prop, which is what many other components in this library do.\\n\\n```svelte\\n<script>\\n  import { Block, PaddingReset } from '@reuters-graphics/graphics-components';\\n\\n  export let src = 'https://...';\\n  export let width = 'fluid';\\n</script>\\n\\n<Block width=\\\"{width}\\\">\\n  <img src=\\\"{src}\\\" alt=\\\"...\\\" width=\\\"100%\\\" />\\n  <PaddingReset containerIsFluid=\\\"{width === 'fluid'}\\\">\\n    <p>A caption for the image that will be padded when Block is fluid.</p>\\n  </PaddingReset>\\n</Block>\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import PaddingReset from './PaddingReset.svelte';\n  import Block from '../Block/Block.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/PaddingReset\"\n  component=\"{PaddingReset}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <Block width=\"fluid\">\n    <div class=\"outer\"></div>\n    <PaddingReset {...args}>\n      <div class=\"inner\"></div>\n    </PaddingReset>\n  </Block>\n</Template>\n\n<Story\n  name=\"Default\"\n  args=\"{{\n    containerIsFluid: true,\n  }}\"\n  let:args\n/>\n\n<style lang=\"scss\">\n  div {\n    height: 30px;\n    width: 100%;\n    margin-bottom: 2px;\n    &.outer {\n      background: grey;\n    }\n    &.inner {\n      background: salmon;\n    }\n  }\n</style>\n"],"names":["componentDocs","insert","target","div","anchor","ctx","PaddingReset","withComponentDocs"],"mappings":"2XAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;uFCsBTC,EAAwBC,EAAAC,EAAAC,CAAA,yDADRC,EAAI,CAAA,CAAA,oMADtBJ,EAAwBC,EAAAC,EAAAC,CAAA,oDACNC,EAAI,CAAA,CAAA,CAAA,CAAA,igBAPZC,CAAY,EACpBC,EAAkBP,CAAa,4MAejC,KAAA,CAAA,iBAAkB,EAAI;;;;;"}

docs/assets/PhotoCarousel.stories-446263ce.js

@@ -1,4 +1,4 @@
-import{S as Et,i as bt,s as tt,a5 as Ge,C as ue,o as J,a4 as Ye,d as Q,v as nt,h as j,w as rt,t as F,f as ee,a3 as Ke,K as ei,D as ti,L as ni,a2 as Rn,E as ri,l as it,u as at,q as ot,r as st,g as ae,m as oe,j as se,b as Y,e as ne,a6 as Zn,x as ii,P as Er,Q as ai,y as Ae,k as In,V as oi,c as Be,n as Mt,z as Wt,A as Ht,a7 as si,p as Xn}from"./index-4f5e5369.js";import{g as $e,a as br}from"./spread-8a54911c.js";import{p as li,M as ci,T as ui,S as Yn}from"./collect-stories-6e37d46b.js";import{e as Kn}from"./each-e59479a4.js";import{B as Ar}from"./Block-67c7bec3.js";import{F as xn}from"./fa-870bc0bd.js";import{h as fi,i as di}from"./index.es-a32769a3.js";import{P as vi}from"./PaddingReset-bdb61f35.js";import{b as gi,w as mi}from"./withParams-47e2ab71.js";const hi=`A simple, accessible photo carousel with lazy-loading and mobile swipe built in.
+import{S as Et,i as bt,s as tt,a5 as Ge,C as ue,o as J,a4 as Ye,b as Q,v as nt,a as j,w as rt,t as F,f as ee,a3 as Ke,K as ei,D as ti,L as ni,a2 as Rn,E as ri,l as it,u as at,q as ot,r as st,c as ae,m as oe,d as se,h as Y,k as ne,a6 as Zn,x as ii,P as Er,Q as ai,y as Ae,e as In,V as oi,j as Be,n as Mt,z as Wt,A as Ht,a7 as si,p as Xn}from"./index-22a9b7f9.js";import{g as $e,a as br}from"./spread-8a54911c.js";import{p as li,M as ci,T as ui,S as Yn}from"./collect-stories-4618f393.js";import{e as Kn}from"./each-e59479a4.js";import{B as Ar}from"./Block-98bec5bc.js";import{F as xn}from"./fa-7568ec37.js";import{h as fi,i as di}from"./index.es-a32769a3.js";import{P as vi}from"./PaddingReset-8f18545b.js";import{b as gi,w as mi}from"./withParams-47e2ab71.js";const hi=`A simple, accessible photo carousel with lazy-loading and mobile swipe built in.
 
 \`\`\`svelte
 <script>
@@ -64,4 +64,4 @@ Can't ever be wider than \`width\`.`,name:"textWidth",kind:"let",static:!1,reado
   <p class="custom-credit" slot="credit" let:credit>{credit}</p>
   <p class="custom-caption" slot="caption" let:caption>{caption}</p>
 </PhotoCarousel>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","customDocs","PhotoCarousel","withComponentDocs","withStoryDocs","photosJson"]}),po=Hn.meta,_o=["Default","CustomCreditsAndCaptions"],yo=Hn.stories.Default,Eo=Hn.stories.CustomCreditsAndCaptions;export{Eo as CustomCreditsAndCaptions,yo as Default,_o as __namedExportsOrder,po as default};
-//# sourceMappingURL=PhotoCarousel.stories-787c17d4.js.map
+//# sourceMappingURL=PhotoCarousel.stories-446263ce.js.map

docs/assets/PymChild.stories-528fdcf7.js

@@ -1,4 +1,4 @@
-import{S as P,i as v,s as w,D as x,C as D,g as c,y as $,m as d,d as g,t as u,h as f,f as y,j as h,o as j}from"./index-4f5e5369.js";import{g as k,a as M}from"./spread-8a54911c.js";import{w as A,p as H,M as T,T as N,S as q}from"./collect-stories-6e37d46b.js";import{p as E}from"./pym.v1-7344f633.js";import{w as I}from"./withParams-47e2ab71.js";import"./_commonjsHelpers-de833af9.js";const O=`A Pym.js child instance for embeddables.
+import{S as P,i as v,s as w,D as x,C as D,c,y as g,m as d,b as y,t as u,a as f,f as $,d as h,o as k}from"./index-22a9b7f9.js";import{g as M,a as j}from"./spread-8a54911c.js";import{w as A,p as H,M as T,T as N,S as q}from"./collect-stories-4618f393.js";import{p as E}from"./pym.v1-7344f633.js";import{w as I}from"./withParams-47e2ab71.js";import"./_commonjsHelpers-de833af9.js";const O=`A Pym.js child instance for embeddables.
 
 \`\`\`svelte
 <script>
@@ -26,6 +26,6 @@ You can access the Pym.js child through its store in other components to send cu
 
 <button on:click="{updateHeight}">Update height</button>
 \`\`\`
-`,U=A(null);function V(p,t,l){let{polling:n=500}=t,r;return x(()=>{r=new E.Child({polling:n}),U.set(r)}),p.$$set=o=>{"polling"in o&&l(0,n=o.polling)},[n]}class _ extends P{constructor(t){super(),v(this,t,V,null,w,{polling:0})}}_.__docgen={version:3,name:"PymChild.svelte",data:[{keywords:[],visibility:"public",description:"Pym.js polling interval",name:"polling",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"number",type:"number"},defaultValue:500}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function Y(p){let t,l,n,r;const o=[p[0]];let a={};for(let s=0;s<o.length;s+=1)a=D(a,o[s]);return t=new _({props:a}),{c(){c(t.$$.fragment),l=$(),n=j("div"),n.textContent="Nothing to see here. 😎"},m(s,i){d(t,s,i),g(s,l,i),g(s,n,i),r=!0},p(s,i){const e=i&1?k(o,[M(s[0])]):{};t.$set(e)},i(s){r||(u(t.$$.fragment,s),r=!0)},o(s){f(t.$$.fragment,s),r=!1},d(s){s&&(y(l),y(n)),h(t,s)}}}function z(p){let t,l,n,r,o,a;const s=[{title:"Components/PymChild"},{component:_},I(O)];let i={};for(let e=0;e<s.length;e+=1)i=D(i,s[e]);return t=new T({props:i}),n=new N({props:{$$slots:{default:[Y,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:p}}}),o=new q({props:{name:"Default"}}),{c(){c(t.$$.fragment),l=$(),c(n.$$.fragment),r=$(),c(o.$$.fragment)},m(e,m){d(t,e,m),g(e,l,m),d(n,e,m),g(e,r,m),d(o,e,m),a=!0},p(e,[m]){const S={};t.$set(S);const C={};m&3&&(C.$$scope={dirty:m,ctx:e}),n.$set(C)},i(e){a||(u(t.$$.fragment,e),u(n.$$.fragment,e),u(o.$$.fragment,e),a=!0)},o(e){f(t.$$.fragment,e),f(n.$$.fragment,e),f(o.$$.fragment,e),a=!1},d(e){e&&(y(l),y(r)),h(t,e),h(n,e),h(o,e)}}}class B extends P{constructor(t){super(),v(this,t,null,z,w,{})}}const b=H(B,{meta:{title:"Components/PymChild"},stories:{"tpl:default":{name:"default",template:!0,source:`<PymChild {...args} />
+`,U=A(null);function V(p,t,l){let{polling:n=500}=t,r;return x(()=>{r=new E.Child({polling:n}),U.set(r)}),p.$$set=o=>{"polling"in o&&l(0,n=o.polling)},[n]}class _ extends P{constructor(t){super(),v(this,t,V,null,w,{polling:0})}}_.__docgen={version:3,name:"PymChild.svelte",data:[{keywords:[],visibility:"public",description:"Pym.js polling interval",name:"polling",kind:"let",static:!1,readonly:!1,type:{kind:"type",text:"number",type:"number"},defaultValue:500}],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};function Y(p){let t,l,n,r;const o=[p[0]];let i={};for(let s=0;s<o.length;s+=1)i=D(i,o[s]);return t=new _({props:i}),{c(){c(t.$$.fragment),l=g(),n=k("div"),n.textContent="Nothing to see here. 😎"},m(s,a){d(t,s,a),y(s,l,a),y(s,n,a),r=!0},p(s,a){const e=a&1?M(o,[j(s[0])]):{};t.$set(e)},i(s){r||(u(t.$$.fragment,s),r=!0)},o(s){f(t.$$.fragment,s),r=!1},d(s){s&&($(l),$(n)),h(t,s)}}}function z(p){let t,l,n,r,o,i;const s=[{title:"Components/PymChild"},{component:_},I(O)];let a={};for(let e=0;e<s.length;e+=1)a=D(a,s[e]);return t=new T({props:a}),n=new N({props:{$$slots:{default:[Y,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:p}}}),o=new q({props:{name:"Default"}}),{c(){c(t.$$.fragment),l=g(),c(n.$$.fragment),r=g(),c(o.$$.fragment)},m(e,m){d(t,e,m),y(e,l,m),d(n,e,m),y(e,r,m),d(o,e,m),i=!0},p(e,[m]){const S={};t.$set(S);const C={};m&3&&(C.$$scope={dirty:m,ctx:e}),n.$set(C)},i(e){i||(u(t.$$.fragment,e),u(n.$$.fragment,e),u(o.$$.fragment,e),i=!0)},o(e){f(t.$$.fragment,e),f(n.$$.fragment,e),f(o.$$.fragment,e),i=!1},d(e){e&&($(l),$(r)),h(t,e),h(n,e),h(o,e)}}}class B extends P{constructor(t){super(),v(this,t,null,z,w,{})}}const b=H(B,{meta:{title:"Components/PymChild"},stories:{"tpl:default":{name:"default",template:!0,source:`<PymChild {...args} />
 <div>Nothing to see here. 😎</div>`,hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","PymChild","withComponentDocs"]}),R=b.meta,W=["Default"],X=b.stories.Default;export{X as Default,W as __namedExportsOrder,R as default};
-//# sourceMappingURL=PymChild.stories-f22332f4.js.map
+//# sourceMappingURL=PymChild.stories-528fdcf7.js.map

docs/assets/PymChild.stories-528fdcf7.js.map

@@ -1 +1 @@
-{"version":3,"file":"PymChild.stories-f22332f4.js","sources":["../../src/components/PymChild/stories/docs/component.md?raw","../../src/components/PymChild/stores.js","../../src/components/PymChild/PymChild.svelte","../../src/components/PymChild/PymChild.stories.svelte"],"sourcesContent":["export default \"A Pym.js child instance for embeddables.\\n\\n```svelte\\n<script>\\n  import { PymChild } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<PymChild polling=\\\"{500}\\\" />\\n```\\n\\nYou can access the Pym.js child through its store in other components to send custom height updates to parent frames:\\n\\n```svelte\\n<script>\\n  import {\\n    PymChild,\\n    pymChildStore,\\n  } from '@reuters-graphics/graphics-components';\\n\\n  const updateHeight = () => {\\n    if ($pymChildStore) $pymChildStore.sendHeight();\\n  };\\n</script>\\n\\n<PymChild />\\n\\n<button on:click=\\\"{updateHeight}\\\">Update height</button>\\n```\\n\"","import { writable } from 'svelte/store';\n\nexport const pymChildStore = writable(null);\n","<!-- @component `PymChild` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/utilities-PymChild--default) -->\n<script lang=\"ts\">\n  /** Pym.js polling interval */\n  export let polling: number = 500;\n\n  import { onMount } from 'svelte';\n  import pym from 'pym.js';\n  import { pymChildStore } from './stores.js';\n\n  let pymChild;\n\n  onMount(() => {\n    pymChild = new pym.Child({ polling });\n    pymChildStore.set(pymChild);\n  });\n</script>\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import PymChild from './PymChild.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/PymChild\"\n  component=\"{PymChild}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <PymChild {...args} />\n  <div>Nothing to see here. 😎</div>\n</Template>\n\n<Story name=\"Default\" />\n"],"names":["componentDocs","pymChildStore","writable","polling","$$props","pymChild","onMount","pym","ctx","insert","target","div","anchor","PymChild","withComponentDocs"],"mappings":"8XAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECEFC,EAAgBC,EAAS,IAAI,oBCC7B,GAAA,CAAA,QAAAC,EAAkB,GAAG,EAAAC,EAM5BC,EAEJ,OAAAC,EAAO,IAAA,CACLD,EAAe,IAAAE,EAAI,OAAQ,QAAAJ,CAAO,CAAA,EAClCF,EAAc,IAAII,CAAQ,2eCKdG,EAAI,CAAA,CAAA,sLAClBC,EAAiCC,EAAAC,EAAAC,CAAA,kCADnBJ,EAAI,CAAA,CAAA,CAAA,CAAA,8LALNK,CAAQ,EAChBC,EAAkBd,CAAa;"}
+{"version":3,"file":"PymChild.stories-528fdcf7.js","sources":["../../src/components/PymChild/stories/docs/component.md?raw","../../src/components/PymChild/stores.js","../../src/components/PymChild/PymChild.svelte","../../src/components/PymChild/PymChild.stories.svelte"],"sourcesContent":["export default \"A Pym.js child instance for embeddables.\\n\\n```svelte\\n<script>\\n  import { PymChild } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<PymChild polling=\\\"{500}\\\" />\\n```\\n\\nYou can access the Pym.js child through its store in other components to send custom height updates to parent frames:\\n\\n```svelte\\n<script>\\n  import {\\n    PymChild,\\n    pymChildStore,\\n  } from '@reuters-graphics/graphics-components';\\n\\n  const updateHeight = () => {\\n    if ($pymChildStore) $pymChildStore.sendHeight();\\n  };\\n</script>\\n\\n<PymChild />\\n\\n<button on:click=\\\"{updateHeight}\\\">Update height</button>\\n```\\n\"","import { writable } from 'svelte/store';\n\nexport const pymChildStore = writable(null);\n","<!-- @component `PymChild` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/utilities-PymChild--default) -->\n<script lang=\"ts\">\n  /** Pym.js polling interval */\n  export let polling: number = 500;\n\n  import { onMount } from 'svelte';\n  import pym from 'pym.js';\n  import { pymChildStore } from './stores.js';\n\n  let pymChild;\n\n  onMount(() => {\n    pymChild = new pym.Child({ polling });\n    pymChildStore.set(pymChild);\n  });\n</script>\n","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import PymChild from './PymChild.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/PymChild\"\n  component=\"{PymChild}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <PymChild {...args} />\n  <div>Nothing to see here. 😎</div>\n</Template>\n\n<Story name=\"Default\" />\n"],"names":["componentDocs","pymChildStore","writable","polling","$$props","pymChild","onMount","pym","ctx","insert","target","div","anchor","PymChild","withComponentDocs"],"mappings":"yXAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECEFC,EAAgBC,EAAS,IAAI,oBCC7B,GAAA,CAAA,QAAAC,EAAkB,GAAG,EAAAC,EAM5BC,EAEJ,OAAAC,EAAO,IAAA,CACLD,EAAe,IAAAE,EAAI,OAAQ,QAAAJ,CAAO,CAAA,EAClCF,EAAc,IAAII,CAAQ,2eCKdG,EAAI,CAAA,CAAA,sLAClBC,EAAiCC,EAAAC,EAAAC,CAAA,kCADnBJ,EAAI,CAAA,CAAA,CAAA,CAAA,8LALNK,CAAQ,EAChBC,EAAkBd,CAAa;"}

docs/assets/ReutersGraphicsLogo.stories-63b350fd.js

@@ -1,4 +1,4 @@
-import{S as y,i as C,s as S,C as D,g as c,y as h,m as u,d,t as i,h as f,f as R,j as g}from"./index-4f5e5369.js";import{g as v,a as M}from"./spread-8a54911c.js";import{p as x,M as T,T as b,S as j}from"./collect-stories-6e37d46b.js";import{R as G}from"./ReutersGraphicsLogo-47c4d34b.js";import{w as A}from"./withParams-47e2ab71.js";const q=`Reuters Graphics' official logo.
+import{S as y,i as C,s as S,C as D,c,y as h,m as u,b as d,t as i,a as f,f as R,d as g}from"./index-22a9b7f9.js";import{g as v,a as M}from"./spread-8a54911c.js";import{p as b,M as x,T,S as A}from"./collect-stories-4618f393.js";import{R as G}from"./ReutersGraphicsLogo-8867c234.js";import{w as j}from"./withParams-47e2ab71.js";const q=`Reuters Graphics' official logo.
 
 > Generally, only used for internal tools. For public pages, use the [ReutersLogo](./?path=/docs/components-reuterslogo--default) component.
 
@@ -9,5 +9,5 @@ import{S as y,i as C,s as S,C as D,g as c,y as h,m as u,d,t as i,h as f,f as R,j
 
 <ReutersGraphicsLogo />
 \`\`\`
-`;function E(l){let s,r;const o=[l[0]];let p={};for(let t=0;t<o.length;t+=1)p=D(p,o[t]);return s=new G({props:p}),{c(){c(s.$$.fragment)},m(t,a){u(s,t,a),r=!0},p(t,a){const m=a&1?v(o,[M(t[0])]):{};s.$set(m)},i(t){r||(i(s.$$.fragment,t),r=!0)},o(t){f(s.$$.fragment,t),r=!1},d(t){g(s,t)}}}function F(l){let s,r,o,p,t,a;const m=[{title:"Components/ReutersGraphicsLogo"},{component:G},A(q)];let $={};for(let e=0;e<m.length;e+=1)$=D($,m[e]);return s=new T({props:$}),o=new b({props:{$$slots:{default:[E,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:l}}}),t=new j({props:{name:"Default",args:{}}}),{c(){c(s.$$.fragment),r=h(),c(o.$$.fragment),p=h(),c(t.$$.fragment)},m(e,n){u(s,e,n),d(e,r,n),u(o,e,n),d(e,p,n),u(t,e,n),a=!0},p(e,[n]){const w={};s.$set(w);const _={};n&3&&(_.$$scope={dirty:n,ctx:e}),o.$set(_)},i(e){a||(i(s.$$.fragment,e),i(o.$$.fragment,e),i(t.$$.fragment,e),a=!0)},o(e){f(s.$$.fragment,e),f(o.$$.fragment,e),f(t.$$.fragment,e),a=!1},d(e){e&&(R(r),R(p)),g(s,e),g(o,e),g(t,e)}}}class I extends y{constructor(s){super(),C(this,s,null,F,S,{})}}const L=x(I,{meta:{title:"Components/ReutersGraphicsLogo"},stories:{"tpl:default":{name:"default",template:!0,source:"<ReutersGraphicsLogo {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","ReutersGraphicsLogo","withComponentDocs"]}),J=L.meta,K=["Default"],N=L.stories.Default;export{N as Default,K as __namedExportsOrder,J as default};
-//# sourceMappingURL=ReutersGraphicsLogo.stories-c10573c2.js.map
+`;function E(l){let s,r;const o=[l[0]];let p={};for(let t=0;t<o.length;t+=1)p=D(p,o[t]);return s=new G({props:p}),{c(){c(s.$$.fragment)},m(t,a){u(s,t,a),r=!0},p(t,a){const m=a&1?v(o,[M(t[0])]):{};s.$set(m)},i(t){r||(i(s.$$.fragment,t),r=!0)},o(t){f(s.$$.fragment,t),r=!1},d(t){g(s,t)}}}function F(l){let s,r,o,p,t,a;const m=[{title:"Components/ReutersGraphicsLogo"},{component:G},j(q)];let $={};for(let e=0;e<m.length;e+=1)$=D($,m[e]);return s=new x({props:$}),o=new T({props:{$$slots:{default:[E,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:l}}}),t=new A({props:{name:"Default",args:{}}}),{c(){c(s.$$.fragment),r=h(),c(o.$$.fragment),p=h(),c(t.$$.fragment)},m(e,n){u(s,e,n),d(e,r,n),u(o,e,n),d(e,p,n),u(t,e,n),a=!0},p(e,[n]){const w={};s.$set(w);const _={};n&3&&(_.$$scope={dirty:n,ctx:e}),o.$set(_)},i(e){a||(i(s.$$.fragment,e),i(o.$$.fragment,e),i(t.$$.fragment,e),a=!0)},o(e){f(s.$$.fragment,e),f(o.$$.fragment,e),f(t.$$.fragment,e),a=!1},d(e){e&&(R(r),R(p)),g(s,e),g(o,e),g(t,e)}}}class I extends y{constructor(s){super(),C(this,s,null,F,S,{})}}const L=b(I,{meta:{title:"Components/ReutersGraphicsLogo"},stories:{"tpl:default":{name:"default",template:!0,source:"<ReutersGraphicsLogo {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","ReutersGraphicsLogo","withComponentDocs"]}),J=L.meta,K=["Default"],N=L.stories.Default;export{N as Default,K as __namedExportsOrder,J as default};
+//# sourceMappingURL=ReutersGraphicsLogo.stories-63b350fd.js.map

docs/assets/ReutersGraphicsLogo.stories-63b350fd.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReutersGraphicsLogo.stories-c10573c2.js","sources":["../../src/components/ReutersGraphicsLogo/stories/docs/component.md?raw","../../src/components/ReutersGraphicsLogo/ReutersGraphicsLogo.stories.svelte"],"sourcesContent":["export default \"Reuters Graphics' official logo.\\n\\n> Generally, only used for internal tools. For public pages, use the [ReutersLogo](./?path=/docs/components-reuterslogo--default) component.\\n\\n```svelte\\n<script>\\n  import { ReutersGraphicsLogo } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<ReutersGraphicsLogo />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // Don't lose the \"?raw\" in markdown imports!\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import ReutersGraphicsLogo from './ReutersGraphicsLogo.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/ReutersGraphicsLogo\"\n  component=\"{ReutersGraphicsLogo}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <ReutersGraphicsLogo {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{}}\" />\n"],"names":["componentDocs","ctx","ReutersGraphicsLogo","withComponentDocs"],"mappings":"0UAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCmBYC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,0LALjBC,CAAmB,EAC3BC,EAAkBH,CAAa"}
+{"version":3,"file":"ReutersGraphicsLogo.stories-63b350fd.js","sources":["../../src/components/ReutersGraphicsLogo/stories/docs/component.md?raw","../../src/components/ReutersGraphicsLogo/ReutersGraphicsLogo.stories.svelte"],"sourcesContent":["export default \"Reuters Graphics' official logo.\\n\\n> Generally, only used for internal tools. For public pages, use the [ReutersLogo](./?path=/docs/components-reuterslogo--default) component.\\n\\n```svelte\\n<script>\\n  import { ReutersGraphicsLogo } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<ReutersGraphicsLogo />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // Don't lose the \"?raw\" in markdown imports!\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import ReutersGraphicsLogo from './ReutersGraphicsLogo.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/ReutersGraphicsLogo\"\n  component=\"{ReutersGraphicsLogo}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <ReutersGraphicsLogo {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{}}\" />\n"],"names":["componentDocs","ctx","ReutersGraphicsLogo","withComponentDocs"],"mappings":"qUAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCmBYC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,0LALjBC,CAAmB,EAC3BC,EAAkBH,CAAa"}

docs/assets/ReutersLogo.stories-919cee7b.js

@@ -1,4 +1,4 @@
-import{S as v,i as y,s as M,C as h,g as u,y as d,m as f,d as D,t as c,h as i,f as R,j as g}from"./index-4f5e5369.js";import{g as L,a as C}from"./spread-8a54911c.js";import{p as j,M as x,T as A,S as P}from"./collect-stories-6e37d46b.js";import{R as w}from"./ReutersLogo-eb5a8075.js";import{w as b}from"./withParams-47e2ab71.js";const q=`The official home of the Reuters logo.
+import{S as v,i as y,s as M,C as h,c as u,y as d,m as f,b as D,t as c,a as i,f as R,d as g}from"./index-22a9b7f9.js";import{g as L,a as C}from"./spread-8a54911c.js";import{p as b,M as x,T as A,S as P}from"./collect-stories-4618f393.js";import{R as w}from"./ReutersLogo-f4fd87f3.js";import{w as j}from"./withParams-47e2ab71.js";const q=`The official home of the Reuters logo.
 
 \`\`\`svelte
 <script>
@@ -7,5 +7,5 @@ import{S as v,i as y,s as M,C as h,g as u,y as d,m as f,d as D,t as c,h as i,f a
 
 <ReutersLogo />
 \`\`\`
-`;function E(l){let o,n;const s=[l[1]];let m={};for(let t=0;t<s.length;t+=1)m=h(m,s[t]);return o=new w({props:m}),{c(){u(o.$$.fragment)},m(t,a){f(o,t,a),n=!0},p(t,a){const p=a&2?L(s,[C(t[1])]):{};o.$set(p)},i(t){n||(c(o.$$.fragment,t),n=!0)},o(t){i(o.$$.fragment,t),n=!1},d(t){g(o,t)}}}function I(l){let o,n,s,m,t,a;const p=[{title:"Components/ReutersLogo"},{component:w},l[0]];let $={};for(let e=0;e<p.length;e+=1)$=h($,p[e]);return o=new x({props:$}),s=new A({props:{$$slots:{default:[E,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:l}}}),t=new P({props:{name:"Default"}}),{c(){u(o.$$.fragment),n=d(),u(s.$$.fragment),m=d(),u(t.$$.fragment)},m(e,r){f(o,e,r),D(e,n,r),f(s,e,r),D(e,m,r),f(t,e,r),a=!0},p(e,[r]){const T=r&1?L(p,[p[0],p[1],C(e[0])]):{};o.$set(T);const _={};r&6&&(_.$$scope={dirty:r,ctx:e}),s.$set(_)},i(e){a||(c(o.$$.fragment,e),c(s.$$.fragment,e),c(t.$$.fragment,e),a=!0)},o(e){i(o.$$.fragment,e),i(s.$$.fragment,e),i(t.$$.fragment,e),a=!1},d(e){e&&(R(n),R(m)),g(o,e),g(s,e),g(t,e)}}}function O(l){return[{...b(q),argTypes:{logoColour:{control:"color"},textColour:{control:"color"}}}]}class k extends v{constructor(o){super(),y(this,o,O,I,M,{})}}const S=j(k,{meta:{title:"Components/ReutersLogo"},stories:{"tpl:default":{name:"default",template:!0,source:"<ReutersLogo {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","ReutersLogo","withComponentDocs"]}),J=S.meta,K=["Default"],N=S.stories.Default;export{N as Default,K as __namedExportsOrder,J as default};
-//# sourceMappingURL=ReutersLogo.stories-f0974c8f.js.map
+`;function E(l){let o,n;const s=[l[1]];let m={};for(let t=0;t<s.length;t+=1)m=h(m,s[t]);return o=new w({props:m}),{c(){u(o.$$.fragment)},m(t,a){f(o,t,a),n=!0},p(t,a){const p=a&2?L(s,[C(t[1])]):{};o.$set(p)},i(t){n||(c(o.$$.fragment,t),n=!0)},o(t){i(o.$$.fragment,t),n=!1},d(t){g(o,t)}}}function I(l){let o,n,s,m,t,a;const p=[{title:"Components/ReutersLogo"},{component:w},l[0]];let $={};for(let e=0;e<p.length;e+=1)$=h($,p[e]);return o=new x({props:$}),s=new A({props:{$$slots:{default:[E,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:l}}}),t=new P({props:{name:"Default"}}),{c(){u(o.$$.fragment),n=d(),u(s.$$.fragment),m=d(),u(t.$$.fragment)},m(e,r){f(o,e,r),D(e,n,r),f(s,e,r),D(e,m,r),f(t,e,r),a=!0},p(e,[r]){const T=r&1?L(p,[p[0],p[1],C(e[0])]):{};o.$set(T);const _={};r&6&&(_.$$scope={dirty:r,ctx:e}),s.$set(_)},i(e){a||(c(o.$$.fragment,e),c(s.$$.fragment,e),c(t.$$.fragment,e),a=!0)},o(e){i(o.$$.fragment,e),i(s.$$.fragment,e),i(t.$$.fragment,e),a=!1},d(e){e&&(R(n),R(m)),g(o,e),g(s,e),g(t,e)}}}function O(l){return[{...j(q),argTypes:{logoColour:{control:"color"},textColour:{control:"color"}}}]}class k extends v{constructor(o){super(),y(this,o,O,I,M,{})}}const S=b(k,{meta:{title:"Components/ReutersLogo"},stories:{"tpl:default":{name:"default",template:!0,source:"<ReutersLogo {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","ReutersLogo","withComponentDocs"]}),J=S.meta,K=["Default"],N=S.stories.Default;export{N as Default,K as __namedExportsOrder,J as default};
+//# sourceMappingURL=ReutersLogo.stories-919cee7b.js.map

docs/assets/ReutersLogo.stories-919cee7b.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReutersLogo.stories-f0974c8f.js","sources":["../../src/components/ReutersLogo/stories/docs/component.md?raw","../../src/components/ReutersLogo/ReutersLogo.stories.svelte"],"sourcesContent":["export default \"The official home of the Reuters logo.\\n\\n```svelte\\n<script>\\n  import { ReutersLogo } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<ReutersLogo />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import ReutersLogo from './ReutersLogo.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      logoColour: { control: 'color' },\n      textColour: { control: 'color' },\n    },\n  };\n</script>\n\n<Meta title=\"Components/ReutersLogo\" component=\"{ReutersLogo}\" {...metaProps} />\n\n<Template let:args>\n  <ReutersLogo {...args} />\n</Template>\n\n<Story name=\"Default\" />\n"],"names":["componentDocs","ctx","ReutersLogo","withComponentDocs"],"mappings":"uUAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCsBIC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,kLAH0BC,CAAW,EAAOD,EAAS,CAAA,oXAATA,EAAS,CAAA,CAAA,qRAT3D,CACV,GAAAE,EAAkBH,CAAa,EAClC,SAAQ,CACN,WAAU,CAAI,QAAS,OAAO,EAC9B,WAAU,CAAI,QAAS,OAAO"}
+{"version":3,"file":"ReutersLogo.stories-919cee7b.js","sources":["../../src/components/ReutersLogo/stories/docs/component.md?raw","../../src/components/ReutersLogo/ReutersLogo.stories.svelte"],"sourcesContent":["export default \"The official home of the Reuters logo.\\n\\n```svelte\\n<script>\\n  import { ReutersLogo } from '@reuters-graphics/graphics-components';\\n</script>\\n\\n<ReutersLogo />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import ReutersLogo from './ReutersLogo.svelte';\n\n  import { withComponentDocs } from '$lib/docs/utils/withParams.js';\n\n  const metaProps = {\n    ...withComponentDocs(componentDocs),\n    argTypes: {\n      logoColour: { control: 'color' },\n      textColour: { control: 'color' },\n    },\n  };\n</script>\n\n<Meta title=\"Components/ReutersLogo\" component=\"{ReutersLogo}\" {...metaProps} />\n\n<Template let:args>\n  <ReutersLogo {...args} />\n</Template>\n\n<Story name=\"Default\" />\n"],"names":["componentDocs","ctx","ReutersLogo","withComponentDocs"],"mappings":"uUAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCsBIC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,kLAH0BC,CAAW,EAAOD,EAAS,CAAA,oXAATA,EAAS,CAAA,CAAA,qRAT3D,CACV,GAAAE,EAAkBH,CAAa,EAClC,SAAQ,CACN,WAAU,CAAI,QAAS,OAAO,EAC9B,WAAU,CAAI,QAAS,OAAO"}

docs/assets/SearchInput.stories-204ba244.js

@@ -1,4 +1,4 @@
-import{S as C,i as x,s as y,C as I,g as u,y as g,m as l,d,t as f,h as i,f as S,j as $}from"./index-4f5e5369.js";import{g as T,a as M}from"./spread-8a54911c.js";import{p as b,M as A,T as j,S as k}from"./collect-stories-6e37d46b.js";import{S as D}from"./SearchInput-f4b7819b.js";import{w as q}from"./withParams-47e2ab71.js";const E=`Invite users to search for something.
+import{S as C,i as x,s as y,C as I,c as u,y as g,m as l,b as d,t as f,a as i,f as S,d as $}from"./index-22a9b7f9.js";import{g as T,a as b}from"./spread-8a54911c.js";import{p as M,M as A,T as j,S as k}from"./collect-stories-4618f393.js";import{S as D}from"./SearchInput-e008fa3f.js";import{w as q}from"./withParams-47e2ab71.js";const E=`Invite users to search for something.
 
 \`\`\`svelte
 <script>
@@ -15,5 +15,5 @@ import{S as C,i as x,s as y,C as I,g as u,y as g,m as l,d,t as f,h as i,f as S,j
 
 <SearchInput on:search="{handleSearchInput}" />
 \`\`\`
-`;function H(c){let s,a;const n=[c[0]];let p={};for(let t=0;t<n.length;t+=1)p=I(p,n[t]);return s=new D({props:p}),{c(){u(s.$$.fragment)},m(t,r){l(s,t,r),a=!0},p(t,r){const m=r&1?T(n,[M(t[0])]):{};s.$set(m)},i(t){a||(f(s.$$.fragment,t),a=!0)},o(t){i(s.$$.fragment,t),a=!1},d(t){$(s,t)}}}function O(c){let s,a,n,p,t,r;const m=[{title:"Components/SearchInput"},{component:D},q(E)];let h={};for(let e=0;e<m.length;e+=1)h=I(h,m[e]);return s=new A({props:h}),n=new j({props:{$$slots:{default:[H,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:c}}}),t=new k({props:{name:"Default",args:{}}}),{c(){u(s.$$.fragment),a=g(),u(n.$$.fragment),p=g(),u(t.$$.fragment)},m(e,o){l(s,e,o),d(e,a,o),l(n,e,o),d(e,p,o),l(t,e,o),r=!0},p(e,[o]){const w={};s.$set(w);const _={};o&3&&(_.$$scope={dirty:o,ctx:e}),n.$set(_)},i(e){r||(f(s.$$.fragment,e),f(n.$$.fragment,e),f(t.$$.fragment,e),r=!0)},o(e){i(s.$$.fragment,e),i(n.$$.fragment,e),i(t.$$.fragment,e),r=!1},d(e){e&&(S(a),S(p)),$(s,e),$(n,e),$(t,e)}}}class P extends C{constructor(s){super(),x(this,s,null,O,y,{})}}const v=b(P,{meta:{title:"Components/SearchInput"},stories:{"tpl:default":{name:"default",template:!0,source:"<SearchInput {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","SearchInput","withComponentDocs"]}),K=v.meta,L=["Default"],N=v.stories.Default;export{N as Default,L as __namedExportsOrder,K as default};
-//# sourceMappingURL=SearchInput.stories-95293211.js.map
+`;function H(c){let s,a;const n=[c[0]];let p={};for(let t=0;t<n.length;t+=1)p=I(p,n[t]);return s=new D({props:p}),{c(){u(s.$$.fragment)},m(t,r){l(s,t,r),a=!0},p(t,r){const m=r&1?T(n,[b(t[0])]):{};s.$set(m)},i(t){a||(f(s.$$.fragment,t),a=!0)},o(t){i(s.$$.fragment,t),a=!1},d(t){$(s,t)}}}function O(c){let s,a,n,p,t,r;const m=[{title:"Components/SearchInput"},{component:D},q(E)];let h={};for(let e=0;e<m.length;e+=1)h=I(h,m[e]);return s=new A({props:h}),n=new j({props:{$$slots:{default:[H,({args:e})=>({0:e}),({args:e})=>e?1:0]},$$scope:{ctx:c}}}),t=new k({props:{name:"Default",args:{}}}),{c(){u(s.$$.fragment),a=g(),u(n.$$.fragment),p=g(),u(t.$$.fragment)},m(e,o){l(s,e,o),d(e,a,o),l(n,e,o),d(e,p,o),l(t,e,o),r=!0},p(e,[o]){const w={};s.$set(w);const _={};o&3&&(_.$$scope={dirty:o,ctx:e}),n.$set(_)},i(e){r||(f(s.$$.fragment,e),f(n.$$.fragment,e),f(t.$$.fragment,e),r=!0)},o(e){i(s.$$.fragment,e),i(n.$$.fragment,e),i(t.$$.fragment,e),r=!1},d(e){e&&(S(a),S(p)),$(s,e),$(n,e),$(t,e)}}}class P extends C{constructor(s){super(),x(this,s,null,O,y,{})}}const v=M(P,{meta:{title:"Components/SearchInput"},stories:{"tpl:default":{name:"default",template:!0,source:"<SearchInput {...args} />",hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","SearchInput","withComponentDocs"]}),K=v.meta,L=["Default"],N=v.stories.Default;export{N as Default,L as __namedExportsOrder,K as default};
+//# sourceMappingURL=SearchInput.stories-204ba244.js.map

docs/assets/SearchInput.stories-204ba244.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.stories-95293211.js","sources":["../../src/components/SearchInput/stories/docs/component.md?raw","../../src/components/SearchInput/SearchInput.stories.svelte"],"sourcesContent":["export default \"Invite users to search for something.\\n\\n```svelte\\n<script>\\n  import { SearchInput } from '@reuters-graphics/graphics-components';\\n\\n  function handleSearchInput(event) {\\n    const searchText = event.detail.value;\\n    // Here's where you might update a variable,\\n    // filter a dataset or make an API call\\n    // based on the user's input.\\n    console.log(`Search for ${searchText}`);\\n  }\\n</script>\\n\\n<SearchInput on:search=\\\"{handleSearchInput}\\\" />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import SearchInput from './SearchInput.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/SearchInput\"\n  component=\"{SearchInput}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <SearchInput {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{}}\" />\n"],"names":["componentDocs","ctx","SearchInput","withComponentDocs"],"mappings":"kUAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCkBIC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,kLALTC,CAAW,EACnBC,EAAkBH,CAAa"}
+{"version":3,"file":"SearchInput.stories-204ba244.js","sources":["../../src/components/SearchInput/stories/docs/component.md?raw","../../src/components/SearchInput/SearchInput.stories.svelte"],"sourcesContent":["export default \"Invite users to search for something.\\n\\n```svelte\\n<script>\\n  import { SearchInput } from '@reuters-graphics/graphics-components';\\n\\n  function handleSearchInput(event) {\\n    const searchText = event.detail.value;\\n    // Here's where you might update a variable,\\n    // filter a dataset or make an API call\\n    // based on the user's input.\\n    console.log(`Search for ${searchText}`);\\n  }\\n</script>\\n\\n<SearchInput on:search=\\\"{handleSearchInput}\\\" />\\n```\\n\"","<script>\n  import { Meta, Template, Story } from '@storybook/addon-svelte-csf';\n\n  // @ts-ignore\n  import componentDocs from './stories/docs/component.md?raw';\n\n  import SearchInput from './SearchInput.svelte';\n\n  import { withComponentDocs } from '$docs/utils/withParams.js';\n</script>\n\n<Meta\n  title=\"Components/SearchInput\"\n  component=\"{SearchInput}\"\n  {...withComponentDocs(componentDocs)}\n/>\n\n<Template let:args>\n  <SearchInput {...args} />\n</Template>\n\n<Story name=\"Default\" args=\"{{}}\" />\n"],"names":["componentDocs","ctx","SearchInput","withComponentDocs"],"mappings":"uUAAA,MAAeA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCCkBIC,EAAI,CAAA,CAAA,oJAAJA,EAAI,CAAA,CAAA,CAAA,CAAA,kLALTC,CAAW,EACnBC,EAAkBH,CAAa"}

docs/assets/SiteFooter.stories-72e1d9a5.js

@@ -1,4 +1,4 @@
-import{S as W,i as E,s as U,a as G,z as H,b as a,d as L,e as u,n as F,f as R,P as dt,k as fe,N as pt,t as y,v as X,h as $,w as ee,o as h,y as T,V as ne,A as se,J as ue,g as z,m as B,j,c as oe,l as mt,u as ht,q as _t,r as gt,D as _e,E as vt,C as de}from"./index-4f5e5369.js";import{g as ge,a as Ke}from"./spread-8a54911c.js";import{p as wt,M as kt,T as yt,S as me}from"./collect-stories-6e37d46b.js";import{e as I}from"./each-e59479a4.js";import{n as q}from"./index-2224dbf5.js";import{T as bt}from"./Theme-180f949e.js";import{w as $t,b as ke}from"./withParams-47e2ab71.js";import"./light-59dc4e88.js";const Ct=`Reuters dotcom site footer with graphics referrals, ported from [Raptor UI components](https://github.com/tr/rcom-arc_raptor-ui/tree/develop/packages/rcom-raptor-ui_common/src/components/site-footer).
+import{S as W,i as E,s as U,g as G,z as H,h as a,b as L,k as u,n as F,f as R,P as dt,e as fe,N as pt,t as y,v as X,a as $,w as ee,o as h,y as T,V as ne,A as se,J as ue,c as z,m as B,d as j,j as oe,l as mt,u as ht,q as _t,r as gt,D as _e,E as vt,C as de}from"./index-22a9b7f9.js";import{g as ge,a as Ke}from"./spread-8a54911c.js";import{p as wt,M as kt,T as yt,S as me}from"./collect-stories-4618f393.js";import{e as I}from"./each-e59479a4.js";import{n as q}from"./index-2224dbf5.js";import{T as bt}from"./Theme-d43f33ce.js";import{w as $t,b as ke}from"./withParams-47e2ab71.js";import"./light-59dc4e88.js";const Ct=`Reuters dotcom site footer with graphics referrals, ported from [Raptor UI components](https://github.com/tr/rcom-arc_raptor-ui/tree/develop/packages/rcom-raptor-ui_common/src/components/site-footer).
 
 > **Note:** In the Graphics Kit, you can find this component in \`pages/+page.svelte\`. Customise it there for the default page.
 
@@ -59,4 +59,4 @@ import{S as W,i as E,s as U,a as G,z as H,b as a,d as L,e as u,n as F,f as R,P a
     <SiteFooter />
   </Theme>
 </div>`,hasArgs:!1},CustomisedReferrals:{name:"Customised referrals",template:!1,source:"",hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","darkThemeDocs","customReferralsDocs","SiteFooter","Theme","withComponentDocs","withStoryDocs"]}),xs=pe.meta,Ls=["Default","CustomisedTheme","CustomisedReferrals"],Rs=pe.stories.Default,Ts=pe.stories.CustomisedTheme,Ms=pe.stories.CustomisedReferrals;export{Ms as CustomisedReferrals,Ts as CustomisedTheme,Rs as Default,Ls as __namedExportsOrder,xs as default};
-//# sourceMappingURL=SiteFooter.stories-bd24c044.js.map
+//# sourceMappingURL=SiteFooter.stories-72e1d9a5.js.map

docs/assets/SiteHeader.stories-7b79f87f.js

@@ -1,4 +1,4 @@
-import{S as G,i as N,s as O,C as b,g as l,y as T,m as c,d as _,t as f,h as u,f as g,j as d,o as q,b as I}from"./index-4f5e5369.js";import{g as M,a as A}from"./spread-8a54911c.js";import{p as P,M as R,T as E,S as k}from"./collect-stories-6e37d46b.js";import{S as C}from"./SiteHeader-96c4751d.js";import{T as K}from"./Theme-180f949e.js";import{b as U,w as x}from"./withParams-47e2ab71.js";import"./ReutersLogo-eb5a8075.js";import"./each-e59479a4.js";import"./index-2224dbf5.js";import"./time-f9db70de.js";import"./_commonjsHelpers-de833af9.js";import"./light-59dc4e88.js";const B=`Reuters dotcom site header, ported from [Raptor UI components](https://github.com/tr/rcom-arc_raptor-ui/tree/develop/packages/rcom-raptor-ui_common/src/components/site-header).
+import{S as N,i as O,s as P,C as b,c as l,y as T,m as c,b as _,t as f,a as u,f as g,d,o as q,h as I}from"./index-22a9b7f9.js";import{g as M,a as A}from"./spread-8a54911c.js";import{p as R,M as j,T as E,S as k}from"./collect-stories-4618f393.js";import{S as C}from"./SiteHeader-42f5987c.js";import{T as K}from"./Theme-d43f33ce.js";import{b as U,w as x}from"./withParams-47e2ab71.js";import"./ReutersLogo-f4fd87f3.js";import"./each-e59479a4.js";import"./index-2224dbf5.js";import"./time-f9db70de.js";import"./_commonjsHelpers-de833af9.js";import"./light-59dc4e88.js";const B=`Reuters dotcom site header, ported from [Raptor UI components](https://github.com/tr/rcom-arc_raptor-ui/tree/develop/packages/rcom-raptor-ui_common/src/components/site-header).
 
 (Go to the "[Canvas](./?path=/story/components-siteheader--default)" tab to see this component better. It'll look a bit broken below... but it's NOT!)
 
@@ -22,11 +22,11 @@ import{S as G,i as N,s as O,C as b,g as l,y as T,m as c,d as _,t as f,h as u,f a
   <SiteHeader />
 </Theme>
 \`\`\`
-`;function J(p){let t,r,s;const n=[p[1]];let a={};for(let o=0;o<n.length;o+=1)a=b(a,n[o]);return r=new C({props:a}),{c(){t=q("div"),l(r.$$.fragment),I(t,"class","svelte-qq31zf")},m(o,i){_(o,t,i),c(r,t,null),s=!0},p(o,i){const $=i&2?M(n,[A(o[1])]):{};r.$set($)},i(o){s||(f(r.$$.fragment,o),s=!0)},o(o){u(r.$$.fragment,o),s=!1},d(o){o&&g(t),d(r)}}}function L(p){let t,r;return t=new C({}),{c(){l(t.$$.fragment)},m(s,n){c(t,s,n),r=!0},i(s){r||(f(t.$$.fragment,s),r=!0)},o(s){u(t.$$.fragment,s),r=!1},d(s){d(t,s)}}}function Q(p){let t,r,s;return r=new K({props:{base:"dark",$$slots:{default:[L]},$$scope:{ctx:p}}}),{c(){t=q("div"),l(r.$$.fragment),I(t,"class","svelte-qq31zf")},m(n,a){_(n,t,a),c(r,t,null),s=!0},p(n,a){const o={};a&4&&(o.$$scope={dirty:a,ctx:n}),r.$set(o)},i(n){s||(f(r.$$.fragment,n),s=!0)},o(n){u(r.$$.fragment,n),s=!1},d(n){n&&g(t),d(r)}}}function V(p){let t,r,s,n,a,o,i,$;const h=[{title:"Components/SiteHeader"},{component:C},p[0]];let v={};for(let e=0;e<h.length;e+=1)v=b(v,h[e]);t=new R({props:v}),s=new E({props:{$$slots:{default:[J,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:p}}}),a=new k({props:{name:"Default"}});const w=[{name:"Customised theme"},U(F)];let S={$$slots:{default:[Q]},$$scope:{ctx:p}};for(let e=0;e<w.length;e+=1)S=b(S,w[e]);return i=new k({props:S}),{c(){l(t.$$.fragment),r=T(),l(s.$$.fragment),n=T(),l(a.$$.fragment),o=T(),l(i.$$.fragment)},m(e,m){c(t,e,m),_(e,r,m),c(s,e,m),_(e,n,m),c(a,e,m),_(e,o,m),c(i,e,m),$=!0},p(e,[m]){const z=m&1?M(h,[h[0],h[1],A(e[0])]):{};t.$set(z);const H={};m&6&&(H.$$scope={dirty:m,ctx:e}),s.$set(H);const y={};m&4&&(y.$$scope={dirty:m,ctx:e}),i.$set(y)},i(e){$||(f(t.$$.fragment,e),f(s.$$.fragment,e),f(a.$$.fragment,e),f(i.$$.fragment,e),$=!0)},o(e){u(t.$$.fragment,e),u(s.$$.fragment,e),u(a.$$.fragment,e),u(i.$$.fragment,e),$=!1},d(e){e&&(g(r),g(n),g(o)),d(t,e),d(s,e),d(a,e),d(i,e)}}}function W(p){return[{...x(B),argsTypes:{themes:{control:{disable:!0}}}}]}class j extends G{constructor(t){super(),N(this,t,W,V,O,{})}}j.__docgen={version:3,name:"SiteHeader.stories.svelte",data:[],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const D=P(j,{meta:{title:"Components/SiteHeader"},stories:{"tpl:default":{name:"default",template:!0,source:`<div>
+`;function J(p){let t,r,s;const n=[p[1]];let a={};for(let o=0;o<n.length;o+=1)a=b(a,n[o]);return r=new C({props:a}),{c(){t=q("div"),l(r.$$.fragment),I(t,"class","svelte-qq31zf")},m(o,i){_(o,t,i),c(r,t,null),s=!0},p(o,i){const $=i&2?M(n,[A(o[1])]):{};r.$set($)},i(o){s||(f(r.$$.fragment,o),s=!0)},o(o){u(r.$$.fragment,o),s=!1},d(o){o&&g(t),d(r)}}}function L(p){let t,r;return t=new C({}),{c(){l(t.$$.fragment)},m(s,n){c(t,s,n),r=!0},i(s){r||(f(t.$$.fragment,s),r=!0)},o(s){u(t.$$.fragment,s),r=!1},d(s){d(t,s)}}}function Q(p){let t,r,s;return r=new K({props:{base:"dark",$$slots:{default:[L]},$$scope:{ctx:p}}}),{c(){t=q("div"),l(r.$$.fragment),I(t,"class","svelte-qq31zf")},m(n,a){_(n,t,a),c(r,t,null),s=!0},p(n,a){const o={};a&4&&(o.$$scope={dirty:a,ctx:n}),r.$set(o)},i(n){s||(f(r.$$.fragment,n),s=!0)},o(n){u(r.$$.fragment,n),s=!1},d(n){n&&g(t),d(r)}}}function V(p){let t,r,s,n,a,o,i,$;const h=[{title:"Components/SiteHeader"},{component:C},p[0]];let v={};for(let e=0;e<h.length;e+=1)v=b(v,h[e]);t=new j({props:v}),s=new E({props:{$$slots:{default:[J,({args:e})=>({1:e}),({args:e})=>e?2:0]},$$scope:{ctx:p}}}),a=new k({props:{name:"Default"}});const w=[{name:"Customised theme"},U(F)];let S={$$slots:{default:[Q]},$$scope:{ctx:p}};for(let e=0;e<w.length;e+=1)S=b(S,w[e]);return i=new k({props:S}),{c(){l(t.$$.fragment),r=T(),l(s.$$.fragment),n=T(),l(a.$$.fragment),o=T(),l(i.$$.fragment)},m(e,m){c(t,e,m),_(e,r,m),c(s,e,m),_(e,n,m),c(a,e,m),_(e,o,m),c(i,e,m),$=!0},p(e,[m]){const G=m&1?M(h,[h[0],h[1],A(e[0])]):{};t.$set(G);const H={};m&6&&(H.$$scope={dirty:m,ctx:e}),s.$set(H);const y={};m&4&&(y.$$scope={dirty:m,ctx:e}),i.$set(y)},i(e){$||(f(t.$$.fragment,e),f(s.$$.fragment,e),f(a.$$.fragment,e),f(i.$$.fragment,e),$=!0)},o(e){u(t.$$.fragment,e),u(s.$$.fragment,e),u(a.$$.fragment,e),u(i.$$.fragment,e),$=!1},d(e){e&&(g(r),g(n),g(o)),d(t,e),d(s,e),d(a,e),d(i,e)}}}function W(p){return[{...x(B),argsTypes:{themes:{control:{disable:!0}}}}]}class z extends N{constructor(t){super(),O(this,t,W,V,P,{})}}z.__docgen={version:3,name:"SiteHeader.stories.svelte",data:[],computed:[],methods:[],components:[],description:null,keywords:[],events:[],slots:[],refs:[]};const D=R(z,{meta:{title:"Components/SiteHeader"},stories:{"tpl:default":{name:"default",template:!0,source:`<div>
   <SiteHeader {...args} />
 </div>`,hasArgs:!0},Default:{name:"Default",template:!1,source:"",hasArgs:!1},CustomisedTheme:{name:"Customised theme",template:!1,source:`<div>
   <Theme base="dark">
     <SiteHeader />
   </Theme>
 </div>`,hasArgs:!1}},allocatedIds:["default","Meta","Template","Story","componentDocs","darkThemeDocs","SiteHeader","Theme","withComponentDocs","withStoryDocs"]}),pe=D.meta,le=["Default","CustomisedTheme"],ce=D.stories.Default,fe=D.stories.CustomisedTheme;export{fe as CustomisedTheme,ce as Default,le as __namedExportsOrder,pe as default};
-//# sourceMappingURL=SiteHeader.stories-80f5f8eb.js.map
+//# sourceMappingURL=SiteHeader.stories-7b79f87f.js.map