@svelte-put/preprocess-inline-svg/dist/index.d.ts

minimal svg inliner from local resources at build time

import { S as SourceConfig, I as InlineSvgConfig } from './preprocessor.internals-yao1xFqK.js';
export { b as DEFAULT_INLINE_SVG_CONFIG, D as DEFAULT_SOURCES_CONFIG, f as findSvgSrc, c as resolveInlineSvgConfig, r as resolveSourceOptions, a as resolveSources, t as transform } from './preprocessor.internals-yao1xFqK.js';
import { PreprocessorGroup } from 'svelte/types/compiler/preprocess';
export { Source } from './sources.generated.js';
import 'magic-string';

/**
 * preprocess svelte markup and inline matching svgs
 *
 * @example
 *
 * Given this config
 *
 * ```javascript
 * // svelte.config.js
 *
 * import inlineSvg from '@svelte-put/preprocess-inline-svg';
 *
 * \/** @type {import('@sveltejs/kit').Config} *\/
 * const config = {
 *   preprocess: [
 *     inlineSvg([
 *       {
 *         directories: 'src/assets/icons',
 *         attributes: {
 *           class: 'icon',
 *           width: '20',
 *           height: '20',
 *         },
 *       },
 *       {
 *         directories: 'src/assets/pictograms',
 *       },
 *     ]),
 *     // other preprocessors
 *   ],
 * };
 * export default config;
 * ```
 *
 * and the assets files as follow
 *
 * ```tree
 * src/assets
 *     |
 *     |-- icons
 *          |-- svelte.svg
 *          |
 *          |-- google
 *                |-- arrow-right.svg
 *          |-- simpleicons
 *                |-- github.svg
 *     |
 *     |-- pictograms
 *          |-- diagram.svg
 * ```
 *
 * We can now do
 *
 * ```html
 * <!-- this will have width="20" height="20" as specified in the config -->
 * <svg data-inline-src="svelte"></svg>
 *
 * <!-- nested -->
 * <svg data-inline-src="google/arrow-right"></svg>
 * <svg data-inline-src="simpleicons/github"></svg>
 *
 * <!-- with custom attributes -->
 * <svg data-inline-src="diagram" width="100" height="100"></svg>
 *
 * <!-- alternatively, you can provide a per-case path that is relative to the current source file -->
 * <svg data-inline-src="./local-icon.svg"></svg>
 *
 * <!-- if the source svg is not found for any of the above, an error will be thrown -->
 * ```
 *
 *
 * @param sources - config for svg sources
 * @param config - global config for the svelte preprocessor
 * @returns svelte preprocessor
 */
declare function inlineSvg(sources?: SourceConfig | SourceConfig[], config?: InlineSvgConfig): PreprocessorGroup;

export { InlineSvgConfig, SourceConfig, inlineSvg as default, inlineSvg };