-
- Action Sheets display a set of options with the ability to confirm or cancel an action.
+
+ Accordions provide collapsible sections in your content.
+
+ Action Sheets display a set of options with the ability to confirm or cancel an action.
+
+
Alerts are a great way to offer the user the ability to choose a specific action or list of actions.
@@ -36,6 +40,10 @@ Ionic apps are made of high-level building blocks called Components, which allow
Badges are a small component that typically communicate a numerical value to the user.
+
+ Breadcrumbs are navigation items that are used to indicate where a user is on an app.
+
+
Buttons let your users take action. They're an essential way to interact with and navigate through an app.
@@ -57,7 +65,7 @@ Ionic apps are made of high-level building blocks called Components, which allow
Content is the quintessential way to interact with and navigate through an app.
-
+
Date & time pickers are used to present an interface that makes it easy for users to select dates and times.
@@ -65,14 +73,14 @@ Ionic apps are made of high-level building blocks called Components, which allow
Floating action buttons are circular buttons that perform a primary action on a screen.
-
- Beautifully designed icons for use in web, iOS, and Android apps.
-
-
The grid is a powerful mobile-first system for building custom layouts.
+
+ Beautifully designed icons for use in web, iOS, and Android apps.
+
+
Infinite scroll allows you to load new data as the user scrolls through your app.
@@ -81,7 +89,7 @@ Ionic apps are made of high-level building blocks called Components, which allow
Inputs provides a way for users to enter data in your app.
-
+
Items are an all-purpose UI container that can be used as part of a list.
@@ -89,8 +97,11 @@ Ionic apps are made of high-level building blocks called Components, which allow
Lists can display rows of information, such as a contact list, playlist, or menu.
-
- Navigation is how users move between different pages in your app.
+
+
+ Media refers to a collection of Ionic's media-related components like ion-avatar, ion-img, ion-icon, and
+ ion-thumbnail.
+
@@ -101,6 +112,14 @@ Ionic apps are made of high-level building blocks called Components, which allow
Modals slide in and off screen to display a temporary UI and are often used for login or sign-up pages.
+
+ Navigation is how users move between different pages in your app.
+
+
+
+ Input OTP component simplifies entering one-time passwords with a customizable, multi-box interface.
+
+
Popover provides an easy way to present information or options without changing contexts.
@@ -113,14 +132,10 @@ Ionic apps are made of high-level building blocks called Components, which allow
Radio inputs allow you to present a set of exclusive options.
-
+
Refresher provides pull-to-refresh functionality on a content component.
-
- Searchbar is used to search or filter items, usually from a toolbar.
-
-
Reorder lets users drag and drop to reorder a list of items.
@@ -129,6 +144,10 @@ Ionic apps are made of high-level building blocks called Components, which allow
Routing allows navigation based on the current path.
+
+ Searchbar is used to search or filter items, usually from a toolbar.
+
+
Segments provide a set of exclusive buttons that can be used as a filter or view switcher.
@@ -149,7 +168,11 @@ Ionic apps are made of high-level building blocks called Components, which allow
Toggles are an input for binary options, often used for options and switches.
-
- Toolbars are used to house information and actions relating to your app.
+
+ Toolbars are used to house information and actions relating to your app.
+
+
+
+ Text is used to style or change the color of text within an application.
diff --git a/static/icons/component-action-sheet-icon.png b/static/icons/component-action-sheet-icon.png
new file mode 100644
index 00000000000..50dee9de006
Binary files /dev/null and b/static/icons/component-action-sheet-icon.png differ
diff --git a/static/icons/component-breadcrumbs-icon.png b/static/icons/component-breadcrumbs-icon.png
new file mode 100644
index 00000000000..2e7a4165fcf
Binary files /dev/null and b/static/icons/component-breadcrumbs-icon.png differ
diff --git a/static/icons/component-icons-icon.png b/static/icons/component-icons-icon.png
new file mode 100644
index 00000000000..1e444bc4e3e
Binary files /dev/null and b/static/icons/component-icons-icon.png differ
diff --git a/static/icons/component-input-otp-icon.png b/static/icons/component-input-otp-icon.png
new file mode 100644
index 00000000000..416847abf39
Binary files /dev/null and b/static/icons/component-input-otp-icon.png differ
diff --git a/static/icons/component-media-icon.png b/static/icons/component-media-icon.png
index 3c21044bfad..7534e9f6944 100644
Binary files a/static/icons/component-media-icon.png and b/static/icons/component-media-icon.png differ
diff --git a/static/icons/component-navigation-icon.png b/static/icons/component-navigation-icon.png
new file mode 100644
index 00000000000..e0c808a709c
Binary files /dev/null and b/static/icons/component-navigation-icon.png differ
diff --git a/static/icons/component-searchbar-icon.png b/static/icons/component-searchbar-icon.png
new file mode 100644
index 00000000000..4341738560d
Binary files /dev/null and b/static/icons/component-searchbar-icon.png differ
diff --git a/static/icons/component-typography-icon.png b/static/icons/component-typography-icon.png
index d2632af52fc..c375549eda8 100644
Binary files a/static/icons/component-typography-icon.png and b/static/icons/component-typography-icon.png differ
diff --git a/static/icons/feature-component-accordion-icon.png b/static/icons/feature-component-accordion-icon.png
new file mode 100644
index 00000000000..847a1095418
Binary files /dev/null and b/static/icons/feature-component-accordion-icon.png differ
diff --git a/static/icons/feature-component-datetime-icon.png b/static/icons/feature-component-datetime-icon.png
new file mode 100644
index 00000000000..b6838937042
Binary files /dev/null and b/static/icons/feature-component-datetime-icon.png differ
diff --git a/static/icons/feature-component-item-icon.png b/static/icons/feature-component-item-icon.png
new file mode 100644
index 00000000000..c3353db553b
Binary files /dev/null and b/static/icons/feature-component-item-icon.png differ
diff --git a/static/icons/feature-component-refresher-icon.png b/static/icons/feature-component-refresher-icon.png
new file mode 100644
index 00000000000..528354fbad0
Binary files /dev/null and b/static/icons/feature-component-refresher-icon.png differ