react-inlinesvg
- Version 4.3.0
- Published
- 189 kB
- 1 dependency
- MIT license
Install
npm i react-inlinesvgyarn add react-inlinesvgpnpm add react-inlinesvgOverview
An SVG loader for React
Index
Variables
variable cacheStore
const cacheStore: CacheStore;Functions
Interfaces
interface FetchError
interface FetchError extends Error {}interface State
interface State {}interface StorageItem
interface StorageItem {}Type Aliases
type ErrorCallback
type ErrorCallback = (error: Error | FetchError) => void;Called when loading the SVG fails.
type LoadCallback
type LoadCallback = (src: string, isCached: boolean) => void;Called when the SVG loads successfully.
type PreProcessorCallback
type PreProcessorCallback = (code: string) => string;Pre-processes the SVG string before parsing. Must return a string.
type Props
type Props = Simplify< Omit<SVGProps<SVGElement>, 'onLoad' | 'onError' | 'ref'> & { /** * A URL to prepend to url() references inside the SVG when using `uniquifyIDs`. * Only required if your page uses an HTML `<base>` tag. */ baseURL?: string; /** * Cache remote SVGs in memory. * * When used with the CacheProvider, requests are also persisted in the browser cache. * @default true */ cacheRequests?: boolean; /** * Fallback content rendered on fetch error or unsupported browser. */ children?: ReactNode; /** * A description for the SVG. * Overrides an existing `<desc>` tag. */ description?: string; /** * Custom options for the fetch request. */ fetchOptions?: RequestInit; /** * A ref to the rendered SVG element. * Not available on initial render — use `onLoad` instead. */ innerRef?: Ref<SVGElement | null>; /** * A component shown while the SVG is loading. */ loader?: ReactNode; /** * Called when loading the SVG fails. * Receives an `Error` or `FetchError`. */ onError?: ErrorCallback; /** * Called when the SVG loads successfully. * Receives the `src` and an `isCached` flag. */ onLoad?: LoadCallback; /** * A function to pre-process the SVG string before parsing. * Must return a string. */ preProcessor?: PreProcessorCallback; /** * The SVG to load. * Accepts a URL or path, a data URI (base64 or URL-encoded), or a raw SVG string. */ src: string; /** * A title for the SVG. Overrides an existing `<title>` tag. * Pass `null` to remove it. */ title?: string | null; /** * A string to use with `uniquifyIDs`. * @default random 8-character alphanumeric string */ uniqueHash?: string; /** * Create unique IDs for each icon. * @default false */ uniquifyIDs?: boolean; }>;type Simplify
type Simplify<T> = { [KeyType in keyof T]: T[KeyType];} & {};type Status
type Status = (typeof STATUS)[keyof typeof STATUS];Package Files (2)
Dependencies (1)
Dev Dependencies (31)
- @arethetypeswrong/cli
- @gilbarbara/eslint-config
- @gilbarbara/prettier-config
- @gilbarbara/tsconfig
- @size-limit/preset-small-lib
- @testing-library/jest-dom
- @testing-library/react
- @types/node
- @types/react
- @types/react-dom
- @vitejs/plugin-react
- @vitest/coverage-v8
- browser-cache-mock
- del-cli
- eslint
- fix-tsup-cjs
- http-server
- husky
- jest-extended
- jsdom
- prettier
- react
- react-dom
- repo-tools
- size-limit
- start-server-and-test
- ts-node
- tsup
- typescript
- vitest
- vitest-fetch-mock
Peer Dependencies (1)
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/react-inlinesvg.
- Markdown[](https://www.jsdocs.io/package/react-inlinesvg)
- HTML<a href="https://www.jsdocs.io/package/react-inlinesvg"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 2510 ms. - Missing or incorrect documentation? Open an issue for this package.
