diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/dropdown-api/dropdown-api.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/dropdown-api/dropdown-api.component.html
index 834341e50..7212094fe 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/dropdown-api/dropdown-api.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/dropdown-api/dropdown-api.component.html
@@ -28,7 +28,7 @@
- | value: any |
+ value: string |
|
Value of the option. |
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
index 88d3b229e..798b3da5c 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
@@ -18,14 +18,6 @@
before the label.
-
- | iconSrc: string |
- |
-
- Deprecated. URL of the icon that will be placed next to the
- dropdown label.
- |
-
| iconPosition: 'before' | 'after' |
'before' |
@@ -57,15 +49,18 @@
- | size: any (string | object) |
+ size: string |
'fitContent' |
- Size of the component ('large' | 'fillParent' | 'fitContent'). |
+
+ Size of the component ('small' | 'medium' | 'large' | 'fillParent' |
+ 'fitContent').
+ |
| onSelectOption: EventEmitter |
|
- This event will be triggered when the selection changes. The value of the
+ This event will emit in case the selection changes. The value of the
selected value will be passed as a parameter.
|
@@ -74,4 +69,14 @@
0 |
Value of the tabindex. |
+
+ | disabled: boolean |
+ false |
+ If true, the component will be disabled. |
+
+
+ | expandOnHover: boolean |
+ false |
+ If true, the options are showed when the dropdown is hover. |
+
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown-option/dxc-dropdown-option.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown-option/dxc-dropdown-option.component.ts
index 672650274..d89aa04d4 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown-option/dxc-dropdown-option.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown-option/dxc-dropdown-option.component.ts
@@ -14,8 +14,14 @@ import { DropdownService } from "../services/dropdown.service";
templateUrl: "./dxc-dropdown-option.component.html",
})
export class DxcDropdownOptionComponent implements OnChanges {
- @Input() public value;
- @Input() public label: string;
+ /**
+ * Value of the option.
+ */
+ @Input() value: string;
+ /**
+ * Label displayed in the option.
+ */
+ @Input() label: string;
@ViewChild(MatMenuItem) menuItem: MatMenuItem;
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.html b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.html
index 7a909c19e..cb072ac6e 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.html
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.html
@@ -23,7 +23,6 @@
-
=
+ new EventEmitter();
+
+ /**
+ * Value of the tabindex.
+ */
@Input()
get tabIndexValue(): number {
return this._tabIndexValue;
@@ -59,7 +106,23 @@ export class DxcDropdownComponent implements OnChanges {
set tabIndexValue(value: number) {
this._tabIndexValue = coerceNumberProperty(value);
}
- private _tabIndexValue;
+ private _tabIndexValue = 0;
+
+ /**
+ * If true, the options are showed when the dropdown is hover.
+ */
+ @Input()
+ get expandOnHover(): boolean {
+ return this._expandOnHover;
+ }
+ set expandOnHover(value: boolean) {
+ this._expandOnHover = coerceBooleanProperty(value);
+ }
+ private _expandOnHover = false;
+
+ /**
+ * If true, the component will be disabled.
+ */
@Input()
get disabled(): boolean {
return this._disabled;
@@ -67,10 +130,9 @@ export class DxcDropdownComponent implements OnChanges {
set disabled(value: boolean) {
this._disabled = coerceBooleanProperty(value);
}
- private _disabled;
+ private _disabled = false;
- @Input() public label: string = "";
- @Output() public onSelectOption: EventEmitter = new EventEmitter();
+ @HostBinding("class") className;
@ViewChild("dropdownButton", { static: true }) dropdownButton;
@ViewChild(MatMenuTrigger, { static: false }) menuTrigger: MatMenuTrigger;
@@ -88,17 +150,17 @@ export class DxcDropdownComponent implements OnChanges {
triggerStyles: string;
defaultInputs = new BehaviorSubject({
- disableRipple: false,
- name: null,
- iconPosition: "before",
optionsIconPosition: "before",
- mode: "basic",
- caretHidden: false,
+ iconSrc: null,
+ iconPosition: "before",
label: null,
+ name: null,
+ caretHidden: false,
margin: null,
size: "fitContent",
- expandOnHover: false,
tabIndexValue: 0,
+ disabled: false,
+ expandOnHover: false,
});
public arrowClass: string = "down";