719332d272
We currently serve icons in the form of 141 separate svg files. This is pretty inefficient: it results in 141 http requests each with its own overheads and costs. Each one is generally less than 1kb of data. This PR merges all of our icons into a single 44kb icon file. Each item in the svg has an ID, and we use the ID in the asset url to target the specific icon. This also fixes a lot of the icon preloading issues: because the icon file is already loaded, there's no extra request needed when panels open etc. I was messing with this whilst killing time before a late meeting so made a shitty overengineered code generator, dont at me ### Change type - [x] `improvement` ### Release notes - Serve icons more efficiently, and make sure they're still available if tldraw goes offline.
289 lines
15 KiB
JavaScript
289 lines
15 KiB
JavaScript
// This file is automatically generated by scripts/refresh-assets.ts.
|
|
// Do not edit manually. Or do, I'm a comment, not a cop.
|
|
|
|
// eslint-disable-next-line @typescript-eslint/triple-slash-reference
|
|
/// <reference path="./modules.d.ts" />
|
|
import { formatAssetUrl } from './utils.js'
|
|
|
|
import embedIconsCodepenPng from './embed-icons/codepen.png'
|
|
import embedIconsCodesandboxPng from './embed-icons/codesandbox.png'
|
|
import embedIconsDesmosPng from './embed-icons/desmos.png'
|
|
import embedIconsExcalidrawPng from './embed-icons/excalidraw.png'
|
|
import embedIconsFeltPng from './embed-icons/felt.png'
|
|
import embedIconsFigmaPng from './embed-icons/figma.png'
|
|
import embedIconsGithubGistPng from './embed-icons/github_gist.png'
|
|
import embedIconsGoogleCalendarPng from './embed-icons/google_calendar.png'
|
|
import embedIconsGoogleMapsPng from './embed-icons/google_maps.png'
|
|
import embedIconsGoogleSlidesPng from './embed-icons/google_slides.png'
|
|
import embedIconsObservablePng from './embed-icons/observable.png'
|
|
import embedIconsReplitPng from './embed-icons/replit.png'
|
|
import embedIconsScratchPng from './embed-icons/scratch.png'
|
|
import embedIconsSpotifyPng from './embed-icons/spotify.png'
|
|
import embedIconsTldrawPng from './embed-icons/tldraw.png'
|
|
import embedIconsValTownPng from './embed-icons/val_town.png'
|
|
import embedIconsVimeoPng from './embed-icons/vimeo.png'
|
|
import embedIconsYoutubePng from './embed-icons/youtube.png'
|
|
import fontsIBMPlexMonoMediumWoff2 from './fonts/IBMPlexMono-Medium.woff2'
|
|
import fontsIBMPlexSansMediumWoff2 from './fonts/IBMPlexSans-Medium.woff2'
|
|
import fontsIBMPlexSerifMediumWoff2 from './fonts/IBMPlexSerif-Medium.woff2'
|
|
import fontsShantellSansTldrawishWoff2 from './fonts/Shantell_Sans-Tldrawish.woff2'
|
|
import iconsIcon0MergedSvg from './icons/icon/0_merged.svg'
|
|
import translationsArJson from './translations/ar.json'
|
|
import translationsCaJson from './translations/ca.json'
|
|
import translationsCsJson from './translations/cs.json'
|
|
import translationsDaJson from './translations/da.json'
|
|
import translationsDeJson from './translations/de.json'
|
|
import translationsEnJson from './translations/en.json'
|
|
import translationsEsJson from './translations/es.json'
|
|
import translationsFaJson from './translations/fa.json'
|
|
import translationsFiJson from './translations/fi.json'
|
|
import translationsFrJson from './translations/fr.json'
|
|
import translationsGlJson from './translations/gl.json'
|
|
import translationsHeJson from './translations/he.json'
|
|
import translationsHiInJson from './translations/hi-in.json'
|
|
import translationsHrJson from './translations/hr.json'
|
|
import translationsHuJson from './translations/hu.json'
|
|
import translationsIdJson from './translations/id.json'
|
|
import translationsItJson from './translations/it.json'
|
|
import translationsJaJson from './translations/ja.json'
|
|
import translationsKoKrJson from './translations/ko-kr.json'
|
|
import translationsKuJson from './translations/ku.json'
|
|
import translationsLanguagesJson from './translations/languages.json'
|
|
import translationsMainJson from './translations/main.json'
|
|
import translationsMyJson from './translations/my.json'
|
|
import translationsNeJson from './translations/ne.json'
|
|
import translationsNoJson from './translations/no.json'
|
|
import translationsPlJson from './translations/pl.json'
|
|
import translationsPtBrJson from './translations/pt-br.json'
|
|
import translationsPtPtJson from './translations/pt-pt.json'
|
|
import translationsRoJson from './translations/ro.json'
|
|
import translationsRuJson from './translations/ru.json'
|
|
import translationsSlJson from './translations/sl.json'
|
|
import translationsSvJson from './translations/sv.json'
|
|
import translationsTeJson from './translations/te.json'
|
|
import translationsThJson from './translations/th.json'
|
|
import translationsTrJson from './translations/tr.json'
|
|
import translationsUkJson from './translations/uk.json'
|
|
import translationsViJson from './translations/vi.json'
|
|
import translationsZhCnJson from './translations/zh-cn.json'
|
|
import translationsZhTwJson from './translations/zh-tw.json'
|
|
|
|
/**
|
|
* @param {AssetUrlOptions} [opts]
|
|
* @public
|
|
*/
|
|
export function getAssetUrlsByImport(opts) {
|
|
const iconsIcon0MergedSvg2 = formatAssetUrl(iconsIcon0MergedSvg, opts)
|
|
return {
|
|
fonts: {
|
|
monospace: formatAssetUrl(fontsIBMPlexMonoMediumWoff2, opts),
|
|
sansSerif: formatAssetUrl(fontsIBMPlexSansMediumWoff2, opts),
|
|
serif: formatAssetUrl(fontsIBMPlexSerifMediumWoff2, opts),
|
|
draw: formatAssetUrl(fontsShantellSansTldrawishWoff2, opts),
|
|
},
|
|
icons: {
|
|
'align-bottom': iconsIcon0MergedSvg2 + '#align-bottom',
|
|
'align-center-horizontal': iconsIcon0MergedSvg2 + '#align-center-horizontal',
|
|
'align-center-vertical': iconsIcon0MergedSvg2 + '#align-center-vertical',
|
|
'align-left': iconsIcon0MergedSvg2 + '#align-left',
|
|
'align-right': iconsIcon0MergedSvg2 + '#align-right',
|
|
'align-top': iconsIcon0MergedSvg2 + '#align-top',
|
|
'arrow-left': iconsIcon0MergedSvg2 + '#arrow-left',
|
|
'arrowhead-arrow': iconsIcon0MergedSvg2 + '#arrowhead-arrow',
|
|
'arrowhead-bar': iconsIcon0MergedSvg2 + '#arrowhead-bar',
|
|
'arrowhead-diamond': iconsIcon0MergedSvg2 + '#arrowhead-diamond',
|
|
'arrowhead-dot': iconsIcon0MergedSvg2 + '#arrowhead-dot',
|
|
'arrowhead-none': iconsIcon0MergedSvg2 + '#arrowhead-none',
|
|
'arrowhead-square': iconsIcon0MergedSvg2 + '#arrowhead-square',
|
|
'arrowhead-triangle-inverted': iconsIcon0MergedSvg2 + '#arrowhead-triangle-inverted',
|
|
'arrowhead-triangle': iconsIcon0MergedSvg2 + '#arrowhead-triangle',
|
|
blob: iconsIcon0MergedSvg2 + '#blob',
|
|
'bring-forward': iconsIcon0MergedSvg2 + '#bring-forward',
|
|
'bring-to-front': iconsIcon0MergedSvg2 + '#bring-to-front',
|
|
broken: iconsIcon0MergedSvg2 + '#broken',
|
|
'check-circle': iconsIcon0MergedSvg2 + '#check-circle',
|
|
check: iconsIcon0MergedSvg2 + '#check',
|
|
'chevron-down': iconsIcon0MergedSvg2 + '#chevron-down',
|
|
'chevron-left': iconsIcon0MergedSvg2 + '#chevron-left',
|
|
'chevron-right': iconsIcon0MergedSvg2 + '#chevron-right',
|
|
'chevron-up': iconsIcon0MergedSvg2 + '#chevron-up',
|
|
'chevrons-ne': iconsIcon0MergedSvg2 + '#chevrons-ne',
|
|
'chevrons-sw': iconsIcon0MergedSvg2 + '#chevrons-sw',
|
|
'clipboard-copied': iconsIcon0MergedSvg2 + '#clipboard-copied',
|
|
'clipboard-copy': iconsIcon0MergedSvg2 + '#clipboard-copy',
|
|
color: iconsIcon0MergedSvg2 + '#color',
|
|
'cross-2': iconsIcon0MergedSvg2 + '#cross-2',
|
|
'cross-circle': iconsIcon0MergedSvg2 + '#cross-circle',
|
|
'dash-dashed': iconsIcon0MergedSvg2 + '#dash-dashed',
|
|
'dash-dotted': iconsIcon0MergedSvg2 + '#dash-dotted',
|
|
'dash-draw': iconsIcon0MergedSvg2 + '#dash-draw',
|
|
'dash-solid': iconsIcon0MergedSvg2 + '#dash-solid',
|
|
disconnected: iconsIcon0MergedSvg2 + '#disconnected',
|
|
discord: iconsIcon0MergedSvg2 + '#discord',
|
|
'distribute-horizontal': iconsIcon0MergedSvg2 + '#distribute-horizontal',
|
|
'distribute-vertical': iconsIcon0MergedSvg2 + '#distribute-vertical',
|
|
dot: iconsIcon0MergedSvg2 + '#dot',
|
|
'dots-horizontal': iconsIcon0MergedSvg2 + '#dots-horizontal',
|
|
'dots-vertical': iconsIcon0MergedSvg2 + '#dots-vertical',
|
|
'drag-handle-dots': iconsIcon0MergedSvg2 + '#drag-handle-dots',
|
|
duplicate: iconsIcon0MergedSvg2 + '#duplicate',
|
|
edit: iconsIcon0MergedSvg2 + '#edit',
|
|
'external-link': iconsIcon0MergedSvg2 + '#external-link',
|
|
'fill-fill': iconsIcon0MergedSvg2 + '#fill-fill',
|
|
'fill-none': iconsIcon0MergedSvg2 + '#fill-none',
|
|
'fill-pattern': iconsIcon0MergedSvg2 + '#fill-pattern',
|
|
'fill-semi': iconsIcon0MergedSvg2 + '#fill-semi',
|
|
'fill-solid': iconsIcon0MergedSvg2 + '#fill-solid',
|
|
follow: iconsIcon0MergedSvg2 + '#follow',
|
|
following: iconsIcon0MergedSvg2 + '#following',
|
|
'font-draw': iconsIcon0MergedSvg2 + '#font-draw',
|
|
'font-mono': iconsIcon0MergedSvg2 + '#font-mono',
|
|
'font-sans': iconsIcon0MergedSvg2 + '#font-sans',
|
|
'font-serif': iconsIcon0MergedSvg2 + '#font-serif',
|
|
'geo-arrow-down': iconsIcon0MergedSvg2 + '#geo-arrow-down',
|
|
'geo-arrow-left': iconsIcon0MergedSvg2 + '#geo-arrow-left',
|
|
'geo-arrow-right': iconsIcon0MergedSvg2 + '#geo-arrow-right',
|
|
'geo-arrow-up': iconsIcon0MergedSvg2 + '#geo-arrow-up',
|
|
'geo-check-box': iconsIcon0MergedSvg2 + '#geo-check-box',
|
|
'geo-cloud': iconsIcon0MergedSvg2 + '#geo-cloud',
|
|
'geo-diamond': iconsIcon0MergedSvg2 + '#geo-diamond',
|
|
'geo-ellipse': iconsIcon0MergedSvg2 + '#geo-ellipse',
|
|
'geo-heart': iconsIcon0MergedSvg2 + '#geo-heart',
|
|
'geo-hexagon': iconsIcon0MergedSvg2 + '#geo-hexagon',
|
|
'geo-octagon': iconsIcon0MergedSvg2 + '#geo-octagon',
|
|
'geo-oval': iconsIcon0MergedSvg2 + '#geo-oval',
|
|
'geo-pentagon': iconsIcon0MergedSvg2 + '#geo-pentagon',
|
|
'geo-rectangle': iconsIcon0MergedSvg2 + '#geo-rectangle',
|
|
'geo-rhombus-2': iconsIcon0MergedSvg2 + '#geo-rhombus-2',
|
|
'geo-rhombus': iconsIcon0MergedSvg2 + '#geo-rhombus',
|
|
'geo-star': iconsIcon0MergedSvg2 + '#geo-star',
|
|
'geo-trapezoid': iconsIcon0MergedSvg2 + '#geo-trapezoid',
|
|
'geo-triangle': iconsIcon0MergedSvg2 + '#geo-triangle',
|
|
'geo-x-box': iconsIcon0MergedSvg2 + '#geo-x-box',
|
|
github: iconsIcon0MergedSvg2 + '#github',
|
|
group: iconsIcon0MergedSvg2 + '#group',
|
|
'horizontal-align-end': iconsIcon0MergedSvg2 + '#horizontal-align-end',
|
|
'horizontal-align-middle': iconsIcon0MergedSvg2 + '#horizontal-align-middle',
|
|
'horizontal-align-start': iconsIcon0MergedSvg2 + '#horizontal-align-start',
|
|
'info-circle': iconsIcon0MergedSvg2 + '#info-circle',
|
|
leading: iconsIcon0MergedSvg2 + '#leading',
|
|
link: iconsIcon0MergedSvg2 + '#link',
|
|
lock: iconsIcon0MergedSvg2 + '#lock',
|
|
menu: iconsIcon0MergedSvg2 + '#menu',
|
|
minus: iconsIcon0MergedSvg2 + '#minus',
|
|
mixed: iconsIcon0MergedSvg2 + '#mixed',
|
|
pack: iconsIcon0MergedSvg2 + '#pack',
|
|
plus: iconsIcon0MergedSvg2 + '#plus',
|
|
'question-mark-circle': iconsIcon0MergedSvg2 + '#question-mark-circle',
|
|
'question-mark': iconsIcon0MergedSvg2 + '#question-mark',
|
|
redo: iconsIcon0MergedSvg2 + '#redo',
|
|
'reset-zoom': iconsIcon0MergedSvg2 + '#reset-zoom',
|
|
'rotate-ccw': iconsIcon0MergedSvg2 + '#rotate-ccw',
|
|
'rotate-cw': iconsIcon0MergedSvg2 + '#rotate-cw',
|
|
'send-backward': iconsIcon0MergedSvg2 + '#send-backward',
|
|
'send-to-back': iconsIcon0MergedSvg2 + '#send-to-back',
|
|
'share-1': iconsIcon0MergedSvg2 + '#share-1',
|
|
'size-extra-large': iconsIcon0MergedSvg2 + '#size-extra-large',
|
|
'size-large': iconsIcon0MergedSvg2 + '#size-large',
|
|
'size-medium': iconsIcon0MergedSvg2 + '#size-medium',
|
|
'size-small': iconsIcon0MergedSvg2 + '#size-small',
|
|
'spline-cubic': iconsIcon0MergedSvg2 + '#spline-cubic',
|
|
'spline-line': iconsIcon0MergedSvg2 + '#spline-line',
|
|
'stack-horizontal': iconsIcon0MergedSvg2 + '#stack-horizontal',
|
|
'stack-vertical': iconsIcon0MergedSvg2 + '#stack-vertical',
|
|
'status-offline': iconsIcon0MergedSvg2 + '#status-offline',
|
|
'stretch-horizontal': iconsIcon0MergedSvg2 + '#stretch-horizontal',
|
|
'stretch-vertical': iconsIcon0MergedSvg2 + '#stretch-vertical',
|
|
'text-align-center': iconsIcon0MergedSvg2 + '#text-align-center',
|
|
'text-align-left': iconsIcon0MergedSvg2 + '#text-align-left',
|
|
'text-align-right': iconsIcon0MergedSvg2 + '#text-align-right',
|
|
'toggle-off': iconsIcon0MergedSvg2 + '#toggle-off',
|
|
'toggle-on': iconsIcon0MergedSvg2 + '#toggle-on',
|
|
'tool-arrow': iconsIcon0MergedSvg2 + '#tool-arrow',
|
|
'tool-eraser': iconsIcon0MergedSvg2 + '#tool-eraser',
|
|
'tool-frame': iconsIcon0MergedSvg2 + '#tool-frame',
|
|
'tool-hand': iconsIcon0MergedSvg2 + '#tool-hand',
|
|
'tool-highlight': iconsIcon0MergedSvg2 + '#tool-highlight',
|
|
'tool-laser': iconsIcon0MergedSvg2 + '#tool-laser',
|
|
'tool-line': iconsIcon0MergedSvg2 + '#tool-line',
|
|
'tool-media': iconsIcon0MergedSvg2 + '#tool-media',
|
|
'tool-note': iconsIcon0MergedSvg2 + '#tool-note',
|
|
'tool-pencil': iconsIcon0MergedSvg2 + '#tool-pencil',
|
|
'tool-pointer': iconsIcon0MergedSvg2 + '#tool-pointer',
|
|
'tool-screenshot': iconsIcon0MergedSvg2 + '#tool-screenshot',
|
|
'tool-text': iconsIcon0MergedSvg2 + '#tool-text',
|
|
trash: iconsIcon0MergedSvg2 + '#trash',
|
|
twitter: iconsIcon0MergedSvg2 + '#twitter',
|
|
undo: iconsIcon0MergedSvg2 + '#undo',
|
|
ungroup: iconsIcon0MergedSvg2 + '#ungroup',
|
|
unlock: iconsIcon0MergedSvg2 + '#unlock',
|
|
'vertical-align-end': iconsIcon0MergedSvg2 + '#vertical-align-end',
|
|
'vertical-align-middle': iconsIcon0MergedSvg2 + '#vertical-align-middle',
|
|
'vertical-align-start': iconsIcon0MergedSvg2 + '#vertical-align-start',
|
|
'warning-triangle': iconsIcon0MergedSvg2 + '#warning-triangle',
|
|
'zoom-in': iconsIcon0MergedSvg2 + '#zoom-in',
|
|
'zoom-out': iconsIcon0MergedSvg2 + '#zoom-out',
|
|
},
|
|
translations: {
|
|
ar: formatAssetUrl(translationsArJson, opts),
|
|
ca: formatAssetUrl(translationsCaJson, opts),
|
|
cs: formatAssetUrl(translationsCsJson, opts),
|
|
da: formatAssetUrl(translationsDaJson, opts),
|
|
de: formatAssetUrl(translationsDeJson, opts),
|
|
en: formatAssetUrl(translationsEnJson, opts),
|
|
es: formatAssetUrl(translationsEsJson, opts),
|
|
fa: formatAssetUrl(translationsFaJson, opts),
|
|
fi: formatAssetUrl(translationsFiJson, opts),
|
|
fr: formatAssetUrl(translationsFrJson, opts),
|
|
gl: formatAssetUrl(translationsGlJson, opts),
|
|
he: formatAssetUrl(translationsHeJson, opts),
|
|
'hi-in': formatAssetUrl(translationsHiInJson, opts),
|
|
hr: formatAssetUrl(translationsHrJson, opts),
|
|
hu: formatAssetUrl(translationsHuJson, opts),
|
|
id: formatAssetUrl(translationsIdJson, opts),
|
|
it: formatAssetUrl(translationsItJson, opts),
|
|
ja: formatAssetUrl(translationsJaJson, opts),
|
|
'ko-kr': formatAssetUrl(translationsKoKrJson, opts),
|
|
ku: formatAssetUrl(translationsKuJson, opts),
|
|
languages: formatAssetUrl(translationsLanguagesJson, opts),
|
|
main: formatAssetUrl(translationsMainJson, opts),
|
|
my: formatAssetUrl(translationsMyJson, opts),
|
|
ne: formatAssetUrl(translationsNeJson, opts),
|
|
no: formatAssetUrl(translationsNoJson, opts),
|
|
pl: formatAssetUrl(translationsPlJson, opts),
|
|
'pt-br': formatAssetUrl(translationsPtBrJson, opts),
|
|
'pt-pt': formatAssetUrl(translationsPtPtJson, opts),
|
|
ro: formatAssetUrl(translationsRoJson, opts),
|
|
ru: formatAssetUrl(translationsRuJson, opts),
|
|
sl: formatAssetUrl(translationsSlJson, opts),
|
|
sv: formatAssetUrl(translationsSvJson, opts),
|
|
te: formatAssetUrl(translationsTeJson, opts),
|
|
th: formatAssetUrl(translationsThJson, opts),
|
|
tr: formatAssetUrl(translationsTrJson, opts),
|
|
uk: formatAssetUrl(translationsUkJson, opts),
|
|
vi: formatAssetUrl(translationsViJson, opts),
|
|
'zh-cn': formatAssetUrl(translationsZhCnJson, opts),
|
|
'zh-tw': formatAssetUrl(translationsZhTwJson, opts),
|
|
},
|
|
embedIcons: {
|
|
codepen: formatAssetUrl(embedIconsCodepenPng, opts),
|
|
codesandbox: formatAssetUrl(embedIconsCodesandboxPng, opts),
|
|
desmos: formatAssetUrl(embedIconsDesmosPng, opts),
|
|
excalidraw: formatAssetUrl(embedIconsExcalidrawPng, opts),
|
|
felt: formatAssetUrl(embedIconsFeltPng, opts),
|
|
figma: formatAssetUrl(embedIconsFigmaPng, opts),
|
|
github_gist: formatAssetUrl(embedIconsGithubGistPng, opts),
|
|
google_calendar: formatAssetUrl(embedIconsGoogleCalendarPng, opts),
|
|
google_maps: formatAssetUrl(embedIconsGoogleMapsPng, opts),
|
|
google_slides: formatAssetUrl(embedIconsGoogleSlidesPng, opts),
|
|
observable: formatAssetUrl(embedIconsObservablePng, opts),
|
|
replit: formatAssetUrl(embedIconsReplitPng, opts),
|
|
scratch: formatAssetUrl(embedIconsScratchPng, opts),
|
|
spotify: formatAssetUrl(embedIconsSpotifyPng, opts),
|
|
tldraw: formatAssetUrl(embedIconsTldrawPng, opts),
|
|
val_town: formatAssetUrl(embedIconsValTownPng, opts),
|
|
vimeo: formatAssetUrl(embedIconsVimeoPng, opts),
|
|
youtube: formatAssetUrl(embedIconsYoutubePng, opts),
|
|
},
|
|
}
|
|
}
|