@contentful/f36-asset NPM

title: 'Asset' slug: /components/asset/ github: 'https://github.com/contentful/forma-36/tree/main/packages/components/asset' storybook: 'https://f36-storybook.contentful.com/?path=/story/components-asset--basic'

typescript: ./src/Asset.tsx

Represent an asset visually without showing the actual asset.

Useful in a file selector, a drag-n-drop component or in lists.

Import

import { Asset } from '@contentful/f36-components';
// or
import { Asset } from '@contentful/f36-asset';

Examples

Basic usage

An image asset

By default an asset with the type image will render the src attribute directly, like a HTML <img /> element.

An archived image asset

If asset status is set to archived, an image icon is displayed instead of the actual image.

Props (API reference)

@contentful/f36-core @contentful/f36-icon @contentful/f36-icons @contentful/f36-tokens @contentful/f36-typography emotion

@infinitebrahmanuniverse/nolb-_cont @everything-registry/sub-chunk-196 @zalastax/nolb-_cont @contentful/f36-card @contentful/f36-components

11 months ago

11 months ago

10 months ago

11 months ago

10 months ago

12 months ago

11 months ago

9 months ago

9 months ago

6 months ago

6 months ago

5 months ago

6 months ago

5 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

6 months ago

7 months ago

8 months ago

8 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4.0.1-next-v4-10675.2471

4 years ago

4.0.1-next-v4-10848.2476

4 years ago

4.0.1-next-v4-10715.2474

4 years ago

4.0.1-next-v4-10839.2475

4 years ago

4.0.1-next-v4-10916.2480

4 years ago

4.0.1-beta.2482

4 years ago

4.0.1-beta.2483

4 years ago

4.0.1-next-v4-10931.2481

4 years ago

4.0.1-beta.2489

4 years ago

4.0.1-beta1.2482

4 years ago

4.0.1-next-v4-10680.2472

4 years ago

4.0.1-next-v4-10623.2468

4 years ago

4.0.1-next-v4-10647.2470

4 years ago

4.0.1-next-v4-10633.2469

4 years ago

4.0.1-next-v4-10536.2462

4 years ago

4.0.1-next-v4-10542.2463

4 years ago

4.0.1-next-v4-10612.2466

4 years ago

4.0.1-next-v4-10595.2465

4 years ago

4.0.1-next-v4-10472.2461

4 years ago

4.0.1-next-v4-10564.2464

4 years ago

4.0.1-next-v4-10423.2460

4 years ago

4.0.1-next-v4-10118.2446

4 years ago

4.0.1-next-v4-10266.2451

4 years ago

4.0.1-next-v4-10292.2452

4 years ago

4.0.1-next-v4-10345.2455

4 years ago

4.0.1-next-v4-9745.2431

4 years ago

4.0.1-next-v4-9473.2426

4 years ago

4.0.1-next-v4-9468.2425

4 years ago

4.0.1-next-v4-9789.2434

4 years ago

4.0.1-next-v4-9961.2441

4 years ago

4.0.1-next-v4-10041.2444

4 years ago

4.0.1-next-v4-10373.2458

4 years ago

4.0.1-next-v4-10308.2453

4 years ago

4.0.1-next-v4-9971.2442

4 years ago

4.0.1-next-v4-9697.2430

4 years ago

4.0.1-next-v4-10223.2450

4 years ago

4.0.1-next-v4-10152.2447

4 years ago

4.0.1-next-v4-10330.2454

4 years ago

4.0.1-next-v4-10204.2448

4 years ago

4.0.1-next-v4-9780.2433

4 years ago

4.0.1-next-v4-9898.2438

4 years ago

4.0.1-next-v4-10363.2457

4 years ago

4.0.1-next-v4-10350.2456

4 years ago

4.0.1-next-v4-9766.2432

4 years ago

4.0.1-next-v4-9921.2439

4 years ago

4.0.1-next-v4-9502.2427

4 years ago

4.0.1-next-v4-10378.2459

4 years ago

4.0.1-next-v4-9547.2428

4 years ago

4.0.1-next-v4-9952.2440

4 years ago

4.0.1-next-v4-9335.2422

4 years ago

4.0.1-next-v4-9346.2423

4 years ago

4.0.1-next-v4-9281.2419

4 years ago

4.0.1-next-v4-9274.2418

4 years ago

4.0.1-next-v4-9248.2416

4 years ago

4.0.1-next-v4-9320.2421

4 years ago

4.0.1-next-v4-9287.2420

4 years ago

4.0.1-next-v4-9225.2415

4 years ago

4.0.1-next-v4-9200.2414

4 years ago

4.0.1-next-v4-9168.2413

4 years ago

4.0.1-next-v4-9155.2412

4 years ago

4.0.1-next-v4-9049.2406

4 years ago

4.0.1-next-v4-9126.2410

4 years ago

4.0.1-next-v4-9086.2408

4 years ago

4.0.1-next-v4-9075.2407

4 years ago

4.0.1-next-v4-9019.2404

4 years ago

4.0.1-next-v4-8971.2401

4 years ago

4.0.1-next-v4-8986.2402

4 years ago

4.0.1-next-v4-8879.2361

4 years ago

4.0.1-next-v4-8833.2358

4 years ago

4.0.1-next-v4-8904.2363

4 years ago

4.0.1-next-v4-8955.2400

4 years ago

4.0.1-next-v4-8942.2365

4 years ago

4.0.1-next-v4-8846.2359

4 years ago

4.0.1-next-v4-8947.2366

4 years ago

4.0.1-next-v4-8753.2355

4 years ago

4.0.1-next-v4-8514.2351

4 years ago

4.0.1-next-v4-8739.2354

4 years ago

4.0.1-next-v4-8733.2353

4 years ago

4.0.1-next-v4-8804.2357

4 years ago

4.0.1-next-v4-8499.2349

4 years ago

4.0.1-next-v4-8455.2348

4 years ago

4.0.1-next-v4-8377.2344

4 years ago

4.0.1-next-v4-8286.2343

4 years ago

4.0.1-next-v4-8206.2342

4 years ago

4.0.1-next-v4-8093.2338

4 years ago

4.0.1-next-v4-8101.2339

4 years ago

4.0.1-next-v4-8125.2340

4 years ago

4.0.1-next-v4-8053.2336

4 years ago

4.0.1-next-v4-8006.2334

4 years ago

4.0.1-next-v4-8039.2335

4 years ago

4.0.1-next-v4-7963.2332

4 years ago

4.0.1-next-v4-8060.2337

4 years ago

4.0.1-next-v4-7985.2333

4 years ago

4.0.1-next-v4-7936.2331

4 years ago

4.0.1-next-v4-7911.2329

4 years ago

4.0.1-next-v4-7926.2330

4 years ago

4.0.1-next-v4-7774.2326

4 years ago

4.0.1-next-v4-7712.2324

4 years ago

4.0.1-next-v4-7888.2327

4 years ago

4.0.1-next-v4-7654.2323

4 years ago

4.0.1-next-v4-7604.2322

4 years ago

4.0.1-next-v4-6754.2279

4 years ago

4.0.1-next-v4-6831.2285

4 years ago

4.0.1-next-v4-6859.2287

4 years ago

4.0.1-next-v4-6811.2284

4 years ago

4.0.1-next-v4-6763.2280

4 years ago

4.0.1-next-v4-6748.2278

4 years ago

4.0.1-next-v4-6795.2281

4 years ago

4.0.1-next-v4-6854.2286

4 years ago

4.0.1-next-v4-6652.2269

4 years ago

4.0.1-next-v4-6660.2272

4 years ago

4.0.1-next-v4-6682.2274

4 years ago

4.0.1-next-v4-6664.2273

4 years ago

4.0.1-next-v4-6714.2276

4 years ago

4.0.1-next-v4-6685.2275

4 years ago

4.0.1-next-v4-6507.2250

4 years ago

4.0.1-next-v4-6548.2251

4 years ago

4.0.1-next-v4-6471.2249

4 years ago

4.0.1-next-v4-6465.2248

4 years ago

4.0.1-next-v4-6443.2247

4 years ago