Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@ui5/webcomponents

Package Overview
Dependencies
Maintainers
0
Versions
504
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@ui5/webcomponents

UI5 Web Components: webcomponents.main

  • 2.6.0-rc.2
  • next
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
38K
decreased by-17.06%
Maintainers
0
Weekly downloads
 
Created
Source

UI5 iconUI5 Web Components - Main

npm Package Version

Provides general purpose UI building blocks such as buttons, labels, inputs and popups.

Provided components

Web ComponentTag nameModule import
Avatarui5-avatarimport "@ui5/webcomponents/dist/Avatar.js";
Avatar Groupui5-avatar-groupimport "@ui5/webcomponents/dist/AvatarGroup.js";
Tagui5-tagimport "@ui5/webcomponents/dist/Tag.js";
Barui5-barimport "@ui5/webcomponents/dist/Bar.js";
Breadcrumbsui5-breadcrumbsimport "@ui5/webcomponents/dist/Breadcrumbs.js";
Breadcrumbs Itemui5-breadcrumbs-itemcomes with ui5-breadcrumbs
Tagui5-tagimport "@ui5/webcomponents/dist/Tag.js";
Busy Indicatorui5-busy-indicatorimport "@ui5/webcomponents/dist/BusyIndicator.js";
Buttonui5-buttonimport "@ui5/webcomponents/dist/Button.js";
Calendarui5-calendarimport "@ui5/webcomponents/dist/Calendar.js";
Calendar Dateui5-calendar-datecomes with ui5-calendar
Cardui5-cardimport "@ui5/webcomponents/dist/Card.js";
CardHeaderui5-card-headerimport "@ui5/webcomponents/dist/CardHeader.js";
Carouselui5-carouselimport "@ui5/webcomponents/dist/Carousel.js";
Checkboxui5-checkboximport "@ui5/webcomponents/dist/CheckBox.js";
Color Paletteui5-color-paletteimport "@ui5/webcomponents/dist/ColorPalette.js";
Color Palette Itemui5-color-palette-itemcomes with ui5-color-palette
Color Palette Popoverui5-color-palette-popovercomes with ui5-color-palette-popover
Color Pickerui5-color-pickerimport "@ui5/webcomponents/dist/ComboPicker.js";
ComboBoxui5-comboboximport "@ui5/webcomponents/dist/ComboBox.js";
ComboBox Itemui5-cb-itemcomes with ui5-combobox
ComboBox Group Itemui5-cb-group-itemcomes with ui5-combobox
Date Pickerui5-date-pickerimport "@ui5/webcomponents/dist/DatePicker.js";
Date Range Pickerui5-daterange-pickerimport "@ui5/webcomponents/dist/DateRangePicker.js";
Date Time Pickerui5-datetime-pickerimport "@ui5/webcomponents/dist/DateTimePicker.js";
Dialogui5-dialogimport "@ui5/webcomponents/dist/Dialog.js";
File Uploaderui5-file-uploaderimport "@ui5/webcomponents/dist/FileUploader.js";
Iconui5-iconimport "@ui5/webcomponents/dist/Icon.js";
Inputui5-inputimport "@ui5/webcomponents/dist/Input.js";
Labelui5-labelimport "@ui5/webcomponents/dist/Label.js";
Linkui5-linkimport "@ui5/webcomponents/dist/Link.js";
Listui5-listimport "@ui5/webcomponents/dist/List.js";
List - Standard Itemui5-liimport "@ui5/webcomponents/dist/ListItemStandard.js";
List - Custom Itemui5-li-customimport "@ui5/webcomponents/dist/ListItemCustom.js";
List - Group Itemui5-li-groupimport "@ui5/webcomponents/dist/ListItemGroup.js";
Menuui5-menu import "@ui5/webcomponents/dist/Menu.js";
Message Stripui5-message-stripimport "@ui5/webcomponents/dist/MessageStrip.js";
Multi ComboBoxui5-multi-comboboximport "@ui5/webcomponents/dist/MultiComboBox.js";
Multi ComboBox Itemui5-mcb-itemcomes with ui5-multi-combobox
Multi ComboBox Item Groupui5-mcb-item-groupcomes with ui5-multi-combobox
Multi Inputui5-multi-inputimport "@ui5/webcomponents/dist/MultiInput.js";
Panelui5-panelimport "@ui5/webcomponents/dist/Panel.js";
Popoverui5-popoverimport "@ui5/webcomponents/dist/Popover.js";
ProgressIndicatorui5-progress-indicatorimport "@ui5/webcomponents/dist/ProgressIndicator.js";
Radio Buttonui5-radio-buttonimport "@ui5/webcomponents/dist/RadioButton.js";
Range Sliderui5-range-sliderimport "@ui5/webcomponents/dist/RangeSlider.js";
Rating Indicatorui5-rating-indicatorimport "@ui5/webcomponents/dist/RatingIndicator.js";
Responsive Popoverui5-responsive-popoverimport "@ui5/webcomponents/dist/ResponsivePopover.js";
Segmented Buttonui5-segmented-buttonimport "@ui5/webcomponents/dist/SegmentedButton.js";
Segmented Button Itemui5-segmented-button-itemcomes with ui5-segmented-button
Selectui5-selectimport "@ui5/webcomponents/dist/Select.js";
Select Optionui5-optioncomes with ui5-select
Sliderui5-sliderimport "@ui5/webcomponents/dist/Slider.js";
Split Buttonui5-split-buttonimport "@ui5/webcomponents/dist/SplitButton.js";
Step Inputui5-step-inputimport "@ui5/webcomponents/dist/StepInput.js";
Suggestion Itemui5-suggestion-itemcomes with InputSuggestions.js feature - see below
Switchui5-switchimport "@ui5/webcomponents/dist/Switch.js";
Tab Containerui5-tabcontainerimport "@ui5/webcomponents/dist/TabContainer.js";
Tabui5-tabimport "@ui5/webcomponents/dist/Tab.js";
Tab Separatorui5-tab-separatorimport "@ui5/webcomponents/dist/TabSeparator.js";
Textareaui5-textareaimport "@ui5/webcomponents/dist/TextArea.js";
TimePickerui5-time-pickerimport "@ui5/webcomponents/dist/TimePicker.js";
Titleui5-titleimport "@ui5/webcomponents/dist/Title.js";
Toastui5-toastimport "@ui5/webcomponents/dist/Toast.js";
Toggle Buttonui5-toggle-buttonimport "@ui5/webcomponents/dist/ToggleButton.js";
Tokenui5-tokencomes with ui5-multi-input
Treeui5-treeimport "@ui5/webcomponents/dist/Tree.js";
Tree Itemui5-tree-itemcomes with ui5-tree

Provided assets

import "@ui5/webcomponents/dist/Assets.js";

AssetsModuleNotes
i18n, themes@ui5/webcomponents/dist/Assets.jsTheming parameters and translations for the components

Automatically imports also:
@ui5/webcomponents-localization/dist/Assets.js
and
@ui5/webcomponents-theming/dist/Assets.js

Provided features

import "@ui5/webcomponents/dist/features/<FEATURE-NAME>.js
AffectsFeature ImportDescription
ui5-color-palette@ui5/webcomponents/dist/features/ColorPaletteMoreColors.jsSupport for "more colors dialog" for the color palette component
ui5-input@ui5/webcomponents/dist/features/InputSuggestions.jsSupport for input suggestions while typing

Color Palette "More Colors" Feature

import "@ui5/webcomponents/dist/features/ColorPaletteMoreColors.js";

The ui5-color-palette component has a showMoreColors property, that, when set to true, enables a "More colors" dialog. Since this is not always needed, in order to use this dialog, you must import the above feature.

Input Suggestions Feature

import "@ui5/webcomponents/dist/features/InputSuggestions.js";

The <ui5-input> element acts as an <input> with the Fiori design and added functionality, such as value state.

The so-called "input suggestions" is an advanced feature that allows the user to choose from a list of predefined options while typing. Since input suggestions may not always be needed, they do not come as part of the <ui5-input> itself.

To enable the functionality, import the above module into your app. This will also automatically import ui5-suggestion-item for your convenience.

Resources

Support

We welcome all comments, suggestions, questions, and bug reports. Please follow our Support Guidelines on how to report an issue, or chat with us in the #webcomponents channel of the OpenUI5 Community Slack.

Contribute

Please check our Contribution Guidelines.

License

Copyright (c) 2019 SAP SE or an SAP affiliate company. All rights reserved. This file is licensed under the Apache Software License, Version 2.0 except as noted otherwise in the LICENSE file.

Keywords

FAQs

Package last updated on 19 Dec 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc