---
title: Component
framework: applenewsformat
role: symbol
role_heading: Object
path: applenewsformat/component
---

# Component

Properties shared by all component types.

## Declaration

```data
object Component
```

## Properties

role: The role of a component (for example, title, body, or pullquote) conveys the semantic value of the content or its function within the article. The value of the role property is simply the role name; it doesn’t include the actual content that the role describes. For example, a role with the value pullquote describes a text component whose value is the actual pull quote text. A role can have design significance: Apple News Format derives styling and layout from it.  VoiceOver also uses the role to make Apple News content more accessible. For a list of valid component types, see Components. anchor: An object that defines vertical alignment with another component. animation: An object that defines an animation  the component applies. Use the none value for conditional design elements. Adding it here has no effect. behavior: An object that defines behavior for a component, like Parallax or Springy. Use the none value for conditional design elements. Adding it here has no effect. conditional: An instance or array of component properties that you can apply conditionally, and the conditions that cause Apple News Format to apply them. hidden: A Boolean value that determines whether the component is hidden. identifier: A unique identifier for this component. If you use identifier, it must be unique across the entire document. Apple News Format requires an identifier if you want to anchor other components to this component. layout: An inline ComponentLayout object that contains layout information, or a string reference to a ComponentLayout you define at the top level of the document. If you don’t define layout, Apple News Format bases the size and position on various factors, such as the device type, the length of the content, and the role of this component. style: An inline ComponentStyle object that defines the appearance of this component, or a string reference to a ComponentStyle that you define at the top level of the document. Use the none value for conditional design elements. Adding it here has no effect.

## Discussion

Discussion In Apple News Format, every component has a property named role that conveys the component’s semantic value and its function in the article. For example, a role property that has a value of body indicates a body component, which means that its content is part of the article’s body text. A component whose role property has a value of photo represents one of the images in the article. important: Don’t use this object type directly. Instead, use objects (such as author, title, figure, and so on) that extend the Component object. You can use this object in ArticleDocument and Container.

## Relationships

### Inherited By

- [ARKit](applenewsformat/arkit.md)
- [ArticleThumbnail](applenewsformat/articlethumbnail.md)
- [Audio](applenewsformat/audio.md)
- [BannerAdvertisement](applenewsformat/banneradvertisement.md)
- [Container](applenewsformat/container.md)
- [DataTable](applenewsformat/datatable.md)
- [Divider](applenewsformat/divider.md)
- [EmbedWebVideo](applenewsformat/embedwebvideo.md)
- [FacebookPost](applenewsformat/facebookpost.md)
- [Figure](applenewsformat/figure.md)
- [FlexibleSpacer](applenewsformat/flexiblespacer.md)
- [Gallery](applenewsformat/gallery.md)
- [HTMLTable](applenewsformat/htmltable.md)
- [Image](applenewsformat/image.md)
- [Instagram](applenewsformat/instagram.md)
- [LinkButton](applenewsformat/linkbutton.md)
- [Logo](applenewsformat/logo.md)
- [Map](applenewsformat/map.md)
- [MediumRectangleAdvertisement](applenewsformat/mediumrectangleadvertisement.md)
- [Mosaic](applenewsformat/mosaic.md)
- [Music](applenewsformat/music.md)
- [Photo](applenewsformat/photo.md)
- [Place](applenewsformat/place.md)
- [Podcast](applenewsformat/podcast.md)
- [Portrait](applenewsformat/portrait.md)
- [ReplicaAdvertisement](applenewsformat/replicaadvertisement.md)
- [Text](applenewsformat/text.md)
- [TikTok](applenewsformat/tiktok.md)
- [Tweet](applenewsformat/tweet.md)
- [Video](applenewsformat/video.md)

## See Also

### First Steps

- [Adding Components](applenews/adding-components.md)