1import{f as d,e as u,i as f,o as _,w as o,l as e,a5 as p,s,a1 as c,q as n,k as i}from"./theme-compass-group.B4kTmzyZ.js";import{_ as g}from"./CompassCard.vue_vue_type_style_index_0_lang.a2Z_BXEU.js";import{u as v}from"./useThemes.DMtjuddy.js";import{S as h}from"./Story.lw_e82ZF.js";import{C as m}from"./CompassCardHeading.vue_vue_type_style_index_0_lang.M9yajH4W.js";const y=d({__name:"LoadersStory",setup(C){const{selectedTheme:r}=v(),t=u(!1),l=()=>{t.value=!t.value,setTimeout(l,3e3)};return l(),(k,a)=>(_(),f(h,null,{default:o(()=>[e(p,{level:3},{default:o(()=>a[0]||(a[0]=[s("Content loaders",-1)])),_:1,__:[0]}),e(c),e(n,{"margin-medium-vertical":""},{default:o(()=>a[1]||(a[1]=[s(" Use these when asyncronous content is being loaded, eg. saving data or loading more data rows. ",-1)])),_:1,__:[1]}),e(m,{theme:i(r)},null,8,["theme"]),e(n,{"margin-medium-vertical":""},{default:o(()=>a[2]||(a[2]=[s(" You can make a cool animation to pop out the loader, like so: ",-1)])),_:1,__:[2]}),e(g,{centered:"",height:"150px"},{default:o(()=>[e(m,{theme:i(r),visible:t.value},null,8,["theme","visible"])]),_:1})]),_:1}))}});export{y as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.