@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
1 lines • 3.23 kB
Source Map (JSON)
{"version":3,"file":"loader.cjs","names":[],"sources":["../../../components/loader/loader.vue"],"sourcesContent":["<template>\n <div\n class=\"d-loader\"\n :aria-label=\"ariaLabel || 'loading'\"\n data-qa=\"dt-loader\"\n >\n <svg\n :class=\"['d-icon', `d-icon--size-${size}`, 'd-loader__icon-track']\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"\n M12 0.0180664C18.6175 0.0180664 23.9819 5.38305 23.9819\n 12.0005C23.9819 18.6177 18.6175 23.9819 12 23.9819C5.38281\n 23.9819 0.0180664 18.6177 0.0180664 12.0005C0.0180664\n 5.38305 5.38281 0.0180664 12 0.0180664ZM12 3.26807C7.17773\n 3.26807 3.26807 7.17797 3.26807 12.0005C3.26807 16.8228\n 7.17773 20.7319 12 20.7319C16.8223 20.7319 20.7319 16.8228\n 20.7319 12.0005C20.7319 7.17797 16.8223 3.26807 12 3.26807Z\n \"\n />\n </svg>\n <svg\n :class=\"['d-icon', `d-icon--size-${size}`, 'd-loader__icon']\"\n data-qa=\"dt-loader-icon\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"\n M0.0180664 12.0005\n C0.0180664 5.38305 5.38305 0.0180664 12.0005 0.0180664\n C12.8977 0.0183302 13.6255 0.745766 13.6255 1.64307\n C13.6255 2.54037 12.8977 3.2678 12.0005 3.26807\n C7.17797 3.26807 3.26807 7.17797 3.26807 12.0005\n C3.26833 16.8228 7.17814 20.7319 12.0005 20.7319\n C16.8226 20.7317 20.7317 16.8226 20.7319 12.0005\n C20.7319 11.103 21.4595 10.3755 22.3569 10.3755\n C23.2544 10.3755 23.9819 11.103 23.9819 12.0005\n C23.9817 18.6175 18.6175 23.9817 12.0005 23.9819\n C5.38321 23.9819 0.0183303 18.6177 0.0180664 12.0005Z\n \"\n />\n </svg>\n </div>\n</template>\n\n<script>\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon';\n\nexport default {\n name: 'DtLoader',\n\n props: {\n /**\n * The label of the loader as read out by a screen reader.\n * Default is \"loading\"\n */\n ariaLabel: {\n type: String,\n default: '',\n },\n\n /**\n * The size of the icon.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n */\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n },\n },\n};\n</script>\n"],"mappings":"gQAuDA,IAAK,EAAU,CACb,KAAM,WAEN,MAAO,CAKL,UAAW,CACT,KAAM,OACN,QAAS,GACV,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,MACT,UAAY,GAAM,OAAO,KAAK,EAAA,oBAAoB,CAAC,SAAS,EAAE,CAC/D,CACF,CACF,2FA7BO,MAAA,CA/CJ,MAAM,WACL,aAAY,EAAA,WAAS,UACtB,UAAQ,0DAoBF,MAAA,CAjBH,OAAA,EAAA,EAAA,gBAAK,CAAA,SAAA,gBAA6B,EAAA,OAAI,uBAAA,CAAA,CACvC,QAAQ,YACR,KAAK,eACL,MAAM,6BACN,cAAY,kDAYV,OAAA,CATA,EAAE;;;;;;;;UAQD,CAAA,KAAA,GAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBA0BC,MAAA,CAtBH,OAAA,EAAA,EAAA,gBAAK,CAAA,SAAA,gBAA6B,EAAA,OAAI,iBAAA,CAAA,CACvC,UAAQ,iBACR,QAAQ,YACR,KAAK,eACL,MAAM,6BACN,cAAY,kDAgBV,OAAA,CAbA,EAAE;;;;;;;;;;;;UAYD,CAAA,KAAA,GAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA,EAAA,EAAA"}