ngcomponents 1.2.0 copy "ngcomponents: ^1.2.0" to clipboard
ngcomponents: ^1.2.0 copied to clipboard

Material Design components for AngularDart.

Use this package as a library

Depend on it

Run this command:

With Dart:

 $ dart pub add ngcomponents

This will add a line like this to your package's pubspec.yaml (and run an implicit dart pub get):

dependencies:
  ngcomponents: ^1.2.0

Alternatively, your editor might support dart pub get. Check the docs for your editor to learn more.

Import it

Now in your Dart code, you can use:

import 'package:ngcomponents/angular_components.dart';
import 'package:ngcomponents/annotations/rtl_annotation.dart';
import 'package:ngcomponents/app_layout/material_drawer_base.dart';
import 'package:ngcomponents/app_layout/material_persistent_drawer.dart';
import 'package:ngcomponents/app_layout/material_stackable_drawer.dart';
import 'package:ngcomponents/app_layout/material_temporary_drawer.dart';
import 'package:ngcomponents/auto_dismiss/auto_dismiss.dart';
import 'package:ngcomponents/button_decorator/button_decorator.dart';
import 'package:ngcomponents/content/deferred_content.dart';
import 'package:ngcomponents/content/deferred_content_aware.dart';
import 'package:ngcomponents/dynamic_component/dynamic_component.dart';
import 'package:ngcomponents/focus/focus.dart';
import 'package:ngcomponents/focus/focus_activable_item.dart';
import 'package:ngcomponents/focus/focus_interface.dart';
import 'package:ngcomponents/focus/focus_item.dart';
import 'package:ngcomponents/focus/focus_list.dart';
import 'package:ngcomponents/focus/focus_trap.dart';
import 'package:ngcomponents/focus/keyboard_only_focus_indicator.dart';
import 'package:ngcomponents/forms/error_renderer.dart';
import 'package:ngcomponents/framework_stabilizers/framework_stabilizers.dart';
import 'package:ngcomponents/framework_stabilizers/testability.dart';
import 'package:ngcomponents/highlighted_text/highlighted_text.dart';
import 'package:ngcomponents/highlighted_text/highlighted_value.dart';
import 'package:ngcomponents/interfaces/has_disabled.dart';
import 'package:ngcomponents/laminate/components/modal/modal.dart';
import 'package:ngcomponents/laminate/enums/alignment.dart';
import 'package:ngcomponents/laminate/enums/position.dart';
import 'package:ngcomponents/laminate/enums/visibility.dart';
import 'package:ngcomponents/laminate/overlay/constants.dart';
import 'package:ngcomponents/laminate/overlay/module.dart';
import 'package:ngcomponents/laminate/overlay/overlay.dart';
import 'package:ngcomponents/laminate/overlay/zindexer.dart';
import 'package:ngcomponents/laminate/popup/module.dart';
import 'package:ngcomponents/laminate/popup/popup.dart';
import 'package:ngcomponents/laminate/portal/portal.dart';
import 'package:ngcomponents/laminate/ruler/dom_ruler.dart';
import 'package:ngcomponents/laminate/ruler/module.dart';
import 'package:ngcomponents/material_button/material_button.dart';
import 'package:ngcomponents/material_button/material_button_base.dart';
import 'package:ngcomponents/material_button/material_fab.dart';
import 'package:ngcomponents/material_checkbox/material_checkbox.dart';
import 'package:ngcomponents/material_chips/material_chip.dart';
import 'package:ngcomponents/material_chips/material_chips.dart';
import 'package:ngcomponents/material_datepicker/calendar.dart';
import 'package:ngcomponents/material_datepicker/comparison.dart';
import 'package:ngcomponents/material_datepicker/comparison_option.dart';
import 'package:ngcomponents/material_datepicker/config.dart';
import 'package:ngcomponents/material_datepicker/date_input.dart';
import 'package:ngcomponents/material_datepicker/date_range_editor.dart';
import 'package:ngcomponents/material_datepicker/date_range_editor_host.dart';
import 'package:ngcomponents/material_datepicker/date_range_input.dart';
import 'package:ngcomponents/material_datepicker/material_calendar_picker.dart';
import 'package:ngcomponents/material_datepicker/material_date_grid_base.dart';
import 'package:ngcomponents/material_datepicker/material_date_range_picker.dart';
import 'package:ngcomponents/material_datepicker/material_date_time_picker.dart';
import 'package:ngcomponents/material_datepicker/material_datepicker.dart';
import 'package:ngcomponents/material_datepicker/material_month_picker.dart';
import 'package:ngcomponents/material_datepicker/material_time_picker.dart';
import 'package:ngcomponents/material_datepicker/model.dart';
import 'package:ngcomponents/material_datepicker/module.dart';
import 'package:ngcomponents/material_datepicker/next_prev_buttons.dart';
import 'package:ngcomponents/material_datepicker/preset.dart';
import 'package:ngcomponents/material_datepicker/proto/date.pb.dart';
import 'package:ngcomponents/material_datepicker/proto/date.pbenum.dart';
import 'package:ngcomponents/material_datepicker/proto/date.pbjson.dart';
import 'package:ngcomponents/material_datepicker/proto/date.pbserver.dart';
import 'package:ngcomponents/material_datepicker/proto/date_range.pb.dart';
import 'package:ngcomponents/material_datepicker/proto/date_range.pbenum.dart';
import 'package:ngcomponents/material_datepicker/proto/date_range.pbjson.dart';
import 'package:ngcomponents/material_datepicker/proto/date_range.pbserver.dart';
import 'package:ngcomponents/material_datepicker/range.dart';
import 'package:ngcomponents/material_dialog/material_dialog.dart';
import 'package:ngcomponents/material_expansionpanel/material_expansionpanel.dart';
import 'package:ngcomponents/material_expansionpanel/material_expansionpanel_auto_dismiss.dart';
import 'package:ngcomponents/material_expansionpanel/material_expansionpanel_set.dart';
import 'package:ngcomponents/material_icon/material_icon.dart';
import 'package:ngcomponents/material_icon/material_icon_toggle.dart';
import 'package:ngcomponents/material_input/base_material_input.dart';
import 'package:ngcomponents/material_input/deferred_validator.dart';
import 'package:ngcomponents/material_input/input_wrapper.dart';
import 'package:ngcomponents/material_input/material_auto_suggest_input.dart';
import 'package:ngcomponents/material_input/material_input.dart';
import 'package:ngcomponents/material_input/material_input_auto_select.dart';
import 'package:ngcomponents/material_input/material_input_default_value_accessor.dart';
import 'package:ngcomponents/material_input/material_input_error_keys.dart';
import 'package:ngcomponents/material_input/material_input_multiline.dart';
import 'package:ngcomponents/material_input/material_number_accessor.dart';
import 'package:ngcomponents/material_input/material_number_validators.dart';
import 'package:ngcomponents/material_input/material_percent_directive.dart';
import 'package:ngcomponents/material_list/material_list.dart';
import 'package:ngcomponents/material_list/material_list_item.dart';
import 'package:ngcomponents/material_list/material_list_size.dart';
import 'package:ngcomponents/material_menu/affix/base_affix.dart';
import 'package:ngcomponents/material_menu/affix/caption_affix.dart';
import 'package:ngcomponents/material_menu/affix/caption_affix_model.dart';
import 'package:ngcomponents/material_menu/affix/icon_affix.dart';
import 'package:ngcomponents/material_menu/affix/icon_affix_model.dart';
import 'package:ngcomponents/material_menu/common/menu_root.dart';
import 'package:ngcomponents/material_menu/dropdown_menu.dart';
import 'package:ngcomponents/material_menu/material_fab_menu.dart';
import 'package:ngcomponents/material_menu/material_menu.dart';
import 'package:ngcomponents/material_menu/menu_item_affix_list.dart';
import 'package:ngcomponents/material_menu/menu_item_groups.dart';
import 'package:ngcomponents/material_menu/menu_popup.dart';
import 'package:ngcomponents/material_menu/menu_popup_wrapper.dart';
import 'package:ngcomponents/material_menu/menu_root.dart';
import 'package:ngcomponents/material_popup/material_popup.dart';
import 'package:ngcomponents/material_progress/material_progress.dart';
import 'package:ngcomponents/material_radio/material_radio.dart';
import 'package:ngcomponents/material_radio/material_radio_group.dart';
import 'package:ngcomponents/material_ripple/material_ripple.dart';
import 'package:ngcomponents/material_select/activation_handler.dart';
import 'package:ngcomponents/material_select/display_name.dart';
import 'package:ngcomponents/material_select/dropdown_button.dart';
import 'package:ngcomponents/material_select/handles_aria.dart';
import 'package:ngcomponents/material_select/material_dropdown_select.dart';
import 'package:ngcomponents/material_select/material_dropdown_select_accessor.dart';
import 'package:ngcomponents/material_select/material_select.dart';
import 'package:ngcomponents/material_select/material_select_base.dart';
import 'package:ngcomponents/material_select/material_select_dropdown_item.dart';
import 'package:ngcomponents/material_select/material_select_item.dart';
import 'package:ngcomponents/material_select/material_select_searchbox.dart';
import 'package:ngcomponents/material_select/shift_click_selection.dart';
import 'package:ngcomponents/material_slider/material_slider.dart';
import 'package:ngcomponents/material_spinner/material_spinner.dart';
import 'package:ngcomponents/material_stepper/common.dart';
import 'package:ngcomponents/material_stepper/material_step.dart';
import 'package:ngcomponents/material_stepper/material_stepper.dart';
import 'package:ngcomponents/material_tab/fixed_material_tab_strip.dart';
import 'package:ngcomponents/material_tab/material_tab.dart';
import 'package:ngcomponents/material_tab/material_tab_panel.dart';
import 'package:ngcomponents/material_tab/tab_button.dart';
import 'package:ngcomponents/material_tab/tab_change_event.dart';
import 'package:ngcomponents/material_tab/tab_mixin.dart';
import 'package:ngcomponents/material_toggle/material_toggle.dart';
import 'package:ngcomponents/material_tooltip/material_tooltip.dart';
import 'package:ngcomponents/material_tooltip/module.dart';
import 'package:ngcomponents/material_tree/material_tree.dart';
import 'package:ngcomponents/material_yes_no_buttons/material_yes_no_buttons.dart';
import 'package:ngcomponents/mixins/button_wrapper.dart';
import 'package:ngcomponents/mixins/focusable_mixin.dart';
import 'package:ngcomponents/mixins/has_tab_index.dart';
import 'package:ngcomponents/mixins/highlight_assistant_mixin.dart';
import 'package:ngcomponents/mixins/material_dropdown_base.dart';
import 'package:ngcomponents/mixins/selection_input_adapter.dart';
import 'package:ngcomponents/mixins/track_layout_changes.dart';
import 'package:ngcomponents/model/a11y/active_item.dart';
import 'package:ngcomponents/model/a11y/active_item_directive.dart';
import 'package:ngcomponents/model/a11y/focus_indicator_controller.dart';
import 'package:ngcomponents/model/a11y/keyboard_handler_mixin.dart';
import 'package:ngcomponents/model/action/async_action.dart';
import 'package:ngcomponents/model/action/delayed_action.dart';
import 'package:ngcomponents/model/collection/combined_list.dart';
import 'package:ngcomponents/model/collection/labeled_list.dart';
import 'package:ngcomponents/model/collection/list_differ.dart';
import 'package:ngcomponents/model/collection/list_tracker.dart';
import 'package:ngcomponents/model/date/date.dart';
import 'package:ngcomponents/model/date/date_formatter.dart';
import 'package:ngcomponents/model/date/time_zone_aware_clock.dart';
import 'package:ngcomponents/model/formatters/formatter.dart';
import 'package:ngcomponents/model/math/box.dart';
import 'package:ngcomponents/model/menu/delegating_menu_item.dart';
import 'package:ngcomponents/model/menu/menu.dart';
import 'package:ngcomponents/model/menu/menu_item_affix.dart';
import 'package:ngcomponents/model/menu/selectable_menu.dart';
import 'package:ngcomponents/model/observable/observable.dart';
import 'package:ngcomponents/model/selection/locked_limit_selection_options.dart';
import 'package:ngcomponents/model/selection/select.dart';
import 'package:ngcomponents/model/selection/selection_container.dart';
import 'package:ngcomponents/model/selection/selection_model.dart';
import 'package:ngcomponents/model/selection/selection_options.dart';
import 'package:ngcomponents/model/selection/string_selection_options.dart';
import 'package:ngcomponents/model/selection/tree_propagation_selection_model.dart';
import 'package:ngcomponents/model/selection/tree_selection_mixin.dart';
import 'package:ngcomponents/model/selection/tree_selection_options.dart';
import 'package:ngcomponents/model/ui/accepts_width.dart';
import 'package:ngcomponents/model/ui/async_display_name.dart';
import 'package:ngcomponents/model/ui/display_name.dart';
import 'package:ngcomponents/model/ui/has_factory.dart';
import 'package:ngcomponents/model/ui/has_renderer.dart';
import 'package:ngcomponents/model/ui/highlight_assistant.dart';
import 'package:ngcomponents/model/ui/highlight_provider.dart';
import 'package:ngcomponents/model/ui/highlighted_text_model.dart';
import 'package:ngcomponents/model/ui/icon.dart';
import 'package:ngcomponents/model/ui/item_sorter.dart';
import 'package:ngcomponents/model/ui/template_support.dart';
import 'package:ngcomponents/model/ui/toggle.dart';
import 'package:ngcomponents/reorder_list/reorder_events.dart';
import 'package:ngcomponents/reorder_list/reorder_list.dart';
import 'package:ngcomponents/scorecard/scoreboard.dart';
import 'package:ngcomponents/scorecard/scorecard.dart';
import 'package:ngcomponents/scorecard/scorecard_bar.dart';
import 'package:ngcomponents/simple_html/simple_html.dart';
import 'package:ngcomponents/stop_propagation/stop_propagation.dart';
import 'package:ngcomponents/theme/dark_theme.dart';
import 'package:ngcomponents/theme/module.dart';
import 'package:ngcomponents/utils/angular/css/css.dart';
import 'package:ngcomponents/utils/angular/id/id.dart';
import 'package:ngcomponents/utils/angular/imperative_view/imperative_view.dart';
import 'package:ngcomponents/utils/angular/properties/properties.dart';
import 'package:ngcomponents/utils/angular/reference/reference.dart';
import 'package:ngcomponents/utils/angular/scroll_host/angular_2.dart';
import 'package:ngcomponents/utils/angular/scroll_host/interface.dart';
import 'package:ngcomponents/utils/async/async.dart';
import 'package:ngcomponents/utils/browser/dom_iterator/dom_iterator.dart';
import 'package:ngcomponents/utils/browser/dom_service/angular_2.dart';
import 'package:ngcomponents/utils/browser/dom_service/dom_service.dart';
import 'package:ngcomponents/utils/browser/dom_service/dom_service_webdriver_testability.dart';
import 'package:ngcomponents/utils/browser/events/events.dart';
import 'package:ngcomponents/utils/browser/feature_detector/feature_detector.dart';
import 'package:ngcomponents/utils/browser/window/module.dart';
import 'package:ngcomponents/utils/browser/window/new_window_opener.dart';
import 'package:ngcomponents/utils/color/color.dart';
import 'package:ngcomponents/utils/color/material.dart';
import 'package:ngcomponents/utils/color/material_chart_colors.dart';
import 'package:ngcomponents/utils/comparators/comparators.dart';
import 'package:ngcomponents/utils/disposer/disposable_callback.dart';
import 'package:ngcomponents/utils/disposer/disposer.dart';
import 'package:ngcomponents/utils/id_generator/id_generator.dart';
import 'package:ngcomponents/utils/keyboard/global_escape_directive.dart';
import 'package:ngcomponents/utils/keyboard/keyboard.dart';
import 'package:ngcomponents/utils/numbers/denomination.dart';
import 'package:ngcomponents/utils/rate_limit_utils/rate_limit_utils.dart';
import 'package:ngcomponents/utils/showhide/showhide.dart';
import 'package:ngcomponents/utils/strings/string_utils.dart';