igniteui-webcomponents 2.1.1 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -13
- package/components/avatar/themes/avatar.base.css.js +1 -1
- package/components/avatar/themes/avatar.base.css.js.map +1 -1
- package/components/badge/themes/light/badge.base.css.js +1 -1
- package/components/badge/themes/light/badge.base.css.js.map +1 -1
- package/components/button/button-base.js +2 -2
- package/components/button/button-base.js.map +1 -1
- package/components/button/themes/button/light/button.base.css.js +1 -1
- package/components/button/themes/button/light/button.base.css.js.map +1 -1
- package/components/button/themes/button/light/button.bootstrap.css.js +1 -1
- package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
- package/components/button/themes/button/light/button.fluent.css.js +1 -1
- package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
- package/components/button/themes/button/light/button.indigo.css.js +1 -1
- package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
- package/components/button/themes/button/light/button.material.css.js +1 -1
- package/components/button/themes/button/light/button.material.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.base.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
- package/components/calendar/calendar.js +1 -2
- package/components/calendar/calendar.js.map +1 -1
- package/components/calendar/common/calendar-base.js +5 -1
- package/components/calendar/common/calendar-base.js.map +1 -1
- package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js +1 -1
- package/components/calendar/themes/bootstrap/days-view.bootstrap.css.js.map +1 -1
- package/components/calendar/themes/calendar.base.css.js +1 -1
- package/components/calendar/themes/calendar.base.css.js.map +1 -1
- package/components/calendar/themes/days-view.base.css.js +1 -1
- package/components/calendar/themes/days-view.base.css.js.map +1 -1
- package/components/calendar/themes/fluent/calendar.fluent.css.js +1 -1
- package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
- package/components/calendar/themes/fluent/days-view.fluent.css.js +1 -1
- package/components/calendar/themes/fluent/days-view.fluent.css.js.map +1 -1
- package/components/card/card.actions.d.ts +2 -0
- package/components/card/card.actions.js +8 -0
- package/components/card/card.actions.js.map +1 -1
- package/components/card/themes/light/card.actions.bootstrap.css.js +1 -1
- package/components/card/themes/light/card.actions.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.actions.material.css.js +1 -1
- package/components/card/themes/light/card.actions.material.css.js.map +1 -1
- package/components/card/themes/light/card.content.bootstrap.css.js +1 -1
- package/components/card/themes/light/card.content.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.content.indigo.css.js +1 -1
- package/components/card/themes/light/card.content.indigo.css.js.map +1 -1
- package/components/card/themes/light/card.content.material.css.js +1 -1
- package/components/card/themes/light/card.content.material.css.js.map +1 -1
- package/components/card/themes/light/card.header.bootstrap.css.js +1 -1
- package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.header.indigo.css.js +1 -1
- package/components/card/themes/light/card.header.indigo.css.js.map +1 -1
- package/components/card/themes/light/card.header.material.css.js +1 -1
- package/components/card/themes/light/card.header.material.css.js.map +1 -1
- package/components/card/themes/light/card.material.css.js +1 -1
- package/components/card/themes/light/card.material.css.js.map +1 -1
- package/components/card/themes/light/card.media.material.css.js +1 -1
- package/components/card/themes/light/card.media.material.css.js.map +1 -1
- package/components/checkbox/checkbox-base.d.ts +5 -1
- package/components/checkbox/checkbox-base.js +20 -2
- package/components/checkbox/checkbox-base.js.map +1 -1
- package/components/checkbox/checkbox.js +8 -2
- package/components/checkbox/checkbox.js.map +1 -1
- package/components/checkbox/switch.js +9 -2
- package/components/checkbox/switch.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.base.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.fluent.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.material.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.base.css.js +1 -1
- package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.bootstrap.css.js +1 -1
- package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.fluent.css.js +1 -1
- package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.indigo.css.js +1 -1
- package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
- package/components/chip/chip.js +1 -1
- package/components/chip/chip.js.map +1 -1
- package/components/chip/themes/chip.base.css.js +1 -1
- package/components/chip/themes/chip.base.css.js.map +1 -1
- package/components/chip/themes/chip.bootstrap.css.js +1 -1
- package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
- package/components/chip/themes/chip.fluent.css.js +1 -1
- package/components/chip/themes/chip.fluent.css.js.map +1 -1
- package/components/chip/themes/chip.indigo.css.js +1 -1
- package/components/chip/themes/chip.indigo.css.js.map +1 -1
- package/components/chip/themes/chip.material.css.js +1 -1
- package/components/chip/themes/chip.material.css.js.map +1 -1
- package/components/common/decorators/blazorTypeOverride.d.ts +7 -0
- package/components/common/decorators/blazorTypeOverride.js +4 -0
- package/components/common/decorators/blazorTypeOverride.js.map +1 -0
- package/components/common/decorators/index.d.ts +1 -0
- package/components/common/decorators/index.js +1 -0
- package/components/common/decorators/index.js.map +1 -1
- package/components/common/definitions/defineAllComponents.js +8 -0
- package/components/common/definitions/defineAllComponents.js.map +1 -1
- package/components/dropdown/dropdown-group.d.ts +25 -0
- package/components/dropdown/dropdown-group.js +42 -0
- package/components/dropdown/dropdown-group.js.map +1 -0
- package/components/dropdown/dropdown-header.d.ts +16 -0
- package/components/dropdown/dropdown-header.js +22 -0
- package/components/dropdown/dropdown-header.js.map +1 -0
- package/components/dropdown/dropdown-item.d.ts +46 -0
- package/components/dropdown/dropdown-item.js +78 -0
- package/components/dropdown/dropdown-item.js.map +1 -0
- package/components/dropdown/dropdown.d.ts +117 -0
- package/components/dropdown/dropdown.js +412 -0
- package/components/dropdown/dropdown.js.map +1 -0
- package/components/dropdown/themes/dark/dropdown.bootstrap.css.d.ts +1 -0
- package/components/dropdown/themes/dark/dropdown.bootstrap.css.js +3 -0
- package/components/dropdown/themes/dark/dropdown.bootstrap.css.js.map +1 -0
- package/components/dropdown/themes/dark/dropdown.fluent.css.d.ts +1 -0
- package/components/dropdown/themes/dark/dropdown.fluent.css.js +3 -0
- package/components/dropdown/themes/dark/dropdown.fluent.css.js.map +1 -0
- package/components/dropdown/themes/dark/dropdown.indigo.css.d.ts +1 -0
- package/components/dropdown/themes/dark/dropdown.indigo.css.js +3 -0
- package/components/dropdown/themes/dark/dropdown.indigo.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-group.base.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-group.base.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-group.base.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-group.fluent.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-group.fluent.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-group.fluent.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-header.base.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-header.base.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-header.base.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-header.bootstrap.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-header.bootstrap.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-item.base.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-item.base.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-item.base.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-item.bootstrap.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-item.bootstrap.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-item.fluent.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-item.fluent.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-item.fluent.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown-item.indigo.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown-item.indigo.css.js +3 -0
- package/components/dropdown/themes/light/dropdown-item.indigo.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown.base.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown.base.css.js +3 -0
- package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown.bootstrap.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown.bootstrap.css.js +3 -0
- package/components/dropdown/themes/light/dropdown.bootstrap.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown.fluent.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown.fluent.css.js +3 -0
- package/components/dropdown/themes/light/dropdown.fluent.css.js.map +1 -0
- package/components/dropdown/themes/light/dropdown.indigo.css.d.ts +1 -0
- package/components/dropdown/themes/light/dropdown.indigo.css.js +3 -0
- package/components/dropdown/themes/light/dropdown.indigo.css.js.map +1 -0
- package/components/icon/icon.material.css.js +1 -1
- package/components/icon/icon.material.css.js.map +1 -1
- package/components/input/input-base.js.map +1 -1
- package/components/input/themes/light/input.base.css.js +1 -1
- package/components/input/themes/light/input.base.css.js.map +1 -1
- package/components/input/themes/light/input.bootstrap.css.js +1 -1
- package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
- package/components/input/themes/light/input.fluent.css.js +1 -1
- package/components/input/themes/light/input.fluent.css.js.map +1 -1
- package/components/input/themes/light/input.indigo.css.js +1 -1
- package/components/input/themes/light/input.indigo.css.js.map +1 -1
- package/components/input/themes/light/input.material.css.js +1 -1
- package/components/input/themes/light/input.material.css.js.map +1 -1
- package/components/list/themes/light/list-header.base.css.js +1 -1
- package/components/list/themes/light/list-header.base.css.js.map +1 -1
- package/components/list/themes/light/list-item.base.css.js +1 -1
- package/components/list/themes/light/list-item.base.css.js.map +1 -1
- package/components/list/themes/light/list.base.css.js +1 -1
- package/components/list/themes/light/list.base.css.js.map +1 -1
- package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js +1 -1
- package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js.map +1 -1
- package/components/nav-drawer/styles/nav-drawer-header-item.base.css.js +1 -1
- package/components/nav-drawer/styles/nav-drawer-header-item.base.css.js.map +1 -1
- package/components/nav-drawer/styles/nav-drawer-item.base.css.js +1 -1
- package/components/nav-drawer/styles/nav-drawer-item.base.css.js.map +1 -1
- package/components/nav-drawer/styles/nav-drawer.base.css.js +1 -1
- package/components/nav-drawer/styles/nav-drawer.base.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.base.css.js +1 -1
- package/components/navbar/themes/light/navbar.base.css.js.map +1 -1
- package/components/progress/themes/circular/circular.progress.base.css.js +1 -1
- package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
- package/components/progress/themes/circular/circular.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/circular/circular.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.base.css.js +1 -1
- package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/linear/linear.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.indigo.css.js +1 -1
- package/components/progress/themes/linear/linear.progress.indigo.css.js.map +1 -1
- package/components/radio/radio.d.ts +5 -1
- package/components/radio/radio.js +25 -2
- package/components/radio/radio.js.map +1 -1
- package/components/radio/themes/light/radio.base.css.js +1 -1
- package/components/radio/themes/light/radio.base.css.js.map +1 -1
- package/components/radio/themes/light/radio.bootstrap.css.js +1 -1
- package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
- package/components/radio/themes/light/radio.fluent.css.js +1 -1
- package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
- package/components/radio/themes/light/radio.indigo.css.js +1 -1
- package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
- package/components/radio-group/radio-group.base.css.js +1 -1
- package/components/radio-group/radio-group.base.css.js.map +1 -1
- package/components/rating/rating.base.css.js +1 -1
- package/components/rating/rating.base.css.js.map +1 -1
- package/components/ripple/ripple.material.css.js +1 -1
- package/components/ripple/ripple.material.css.js.map +1 -1
- package/components/slider/slider-base.js +3 -2
- package/components/slider/slider-base.js.map +1 -1
- package/components/slider/themes/light/slider.base.css.js +1 -1
- package/components/slider/themes/light/slider.base.css.js.map +1 -1
- package/components/snackbar/themes/snackbar.base.css.js +1 -1
- package/components/snackbar/themes/snackbar.base.css.js.map +1 -1
- package/components/toggle/toggle.controller.d.ts +32 -0
- package/components/toggle/toggle.controller.js +85 -0
- package/components/toggle/toggle.controller.js.map +1 -0
- package/components/toggle/toggle.directive.d.ts +14 -0
- package/components/toggle/toggle.directive.js +76 -0
- package/components/toggle/toggle.directive.js.map +1 -0
- package/components/toggle/utilities.d.ts +50 -0
- package/components/toggle/utilities.js +2 -0
- package/components/toggle/utilities.js.map +1 -0
- package/custom-elements.json +380 -0
- package/index.d.ts +4 -0
- package/index.js +4 -0
- package/index.js.map +1 -1
- package/package.json +11 -2
- package/themes/dark/bootstrap.css +1 -1
- package/themes/dark/fluent.css +1 -1
- package/themes/dark/indigo.css +1 -1
- package/themes/light/fluent.css +1 -1
- package/vscode-html-custom-data.json +234 -18
|
@@ -0,0 +1,412 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { html, LitElement } from 'lit';
|
|
8
|
+
import { property, query, queryAssignedElements } from 'lit/decorators.js';
|
|
9
|
+
import { EventEmitterMixin } from '../common/mixins/event-emitter';
|
|
10
|
+
import { themes } from '../../theming';
|
|
11
|
+
import { styles } from './themes/light/dropdown.base.css';
|
|
12
|
+
import { styles as bootstrap } from './themes/light/dropdown.bootstrap.css';
|
|
13
|
+
import { styles as fluent } from './themes/light/dropdown.fluent.css';
|
|
14
|
+
import { styles as indigo } from './themes/light/dropdown.indigo.css';
|
|
15
|
+
import { blazorSuppress, watch } from '../common/decorators';
|
|
16
|
+
import IgcDropDownItemComponent from './dropdown-item';
|
|
17
|
+
import { IgcToggleController } from '../toggle/toggle.controller';
|
|
18
|
+
import { styleMap } from 'lit/directives/style-map.js';
|
|
19
|
+
import { SizableMixin } from '../common/mixins/sizable';
|
|
20
|
+
export var DropDownActionKey;
|
|
21
|
+
(function (DropDownActionKey) {
|
|
22
|
+
DropDownActionKey["ESCAPE"] = "escape";
|
|
23
|
+
DropDownActionKey["ENTER"] = "enter";
|
|
24
|
+
})(DropDownActionKey || (DropDownActionKey = {}));
|
|
25
|
+
let IgcDropDownComponent = class IgcDropDownComponent extends SizableMixin(EventEmitterMixin(LitElement)) {
|
|
26
|
+
constructor() {
|
|
27
|
+
super();
|
|
28
|
+
this.keepOpenOnSelect = false;
|
|
29
|
+
this.open = false;
|
|
30
|
+
this.placement = 'bottom-start';
|
|
31
|
+
this.positionStrategy = 'absolute';
|
|
32
|
+
this.scrollStrategy = 'scroll';
|
|
33
|
+
this.flip = false;
|
|
34
|
+
this.distance = 0;
|
|
35
|
+
this.keepOpenOnOutsideClick = false;
|
|
36
|
+
this.sameWidth = false;
|
|
37
|
+
this.handleKeyDown = (event) => {
|
|
38
|
+
if (this.open &&
|
|
39
|
+
event &&
|
|
40
|
+
(event.composedPath().includes(this.target) ||
|
|
41
|
+
event.composedPath().includes(this.content))) {
|
|
42
|
+
const key = event.key.toLowerCase();
|
|
43
|
+
const navKeys = [
|
|
44
|
+
'esc',
|
|
45
|
+
'escape',
|
|
46
|
+
'enter',
|
|
47
|
+
'arrowup',
|
|
48
|
+
'up',
|
|
49
|
+
'arrowdown',
|
|
50
|
+
'down',
|
|
51
|
+
];
|
|
52
|
+
if (navKeys.indexOf(key) === -1) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
event.preventDefault();
|
|
56
|
+
event.stopPropagation();
|
|
57
|
+
switch (key) {
|
|
58
|
+
case 'esc':
|
|
59
|
+
case 'escape':
|
|
60
|
+
this.handleItemActionKey(DropDownActionKey.ESCAPE);
|
|
61
|
+
break;
|
|
62
|
+
case 'enter':
|
|
63
|
+
this.handleItemActionKey(DropDownActionKey.ENTER);
|
|
64
|
+
break;
|
|
65
|
+
case 'arrowup':
|
|
66
|
+
case 'up':
|
|
67
|
+
this.onArrowUpKeyDown();
|
|
68
|
+
break;
|
|
69
|
+
case 'arrowdown':
|
|
70
|
+
case 'down':
|
|
71
|
+
this.onArrowDownKeyDown();
|
|
72
|
+
break;
|
|
73
|
+
default:
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
this.handleTargetClick = () => {
|
|
79
|
+
if (!this.open) {
|
|
80
|
+
if (!this.handleOpening())
|
|
81
|
+
return;
|
|
82
|
+
this.show();
|
|
83
|
+
this.emitEvent('igcOpened');
|
|
84
|
+
}
|
|
85
|
+
else {
|
|
86
|
+
this._hide();
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
this.toggleController = new IgcToggleController(this, this.target);
|
|
90
|
+
}
|
|
91
|
+
get allItems() {
|
|
92
|
+
const groupItems = this.groups.flatMap((group) => group.items);
|
|
93
|
+
return [...this.items, ...groupItems];
|
|
94
|
+
}
|
|
95
|
+
toggleDirectiveChange() {
|
|
96
|
+
var _a;
|
|
97
|
+
if (!this.target)
|
|
98
|
+
return;
|
|
99
|
+
this.toggleController.target = this.target;
|
|
100
|
+
if (this.open) {
|
|
101
|
+
document.addEventListener('keydown', this.handleKeyDown);
|
|
102
|
+
this.target.addEventListener('focusout', this.handleFocusout);
|
|
103
|
+
this.selectedItem = (_a = this.allItems.find((i) => i.selected)) !== null && _a !== void 0 ? _a : null;
|
|
104
|
+
}
|
|
105
|
+
else {
|
|
106
|
+
document.removeEventListener('keydown', this.handleKeyDown);
|
|
107
|
+
this.target.removeEventListener('focusout', this.handleFocusout);
|
|
108
|
+
}
|
|
109
|
+
this.target.setAttribute('aria-expanded', this.open ? 'true' : 'false');
|
|
110
|
+
}
|
|
111
|
+
updateOptions() {
|
|
112
|
+
if (!this.toggleController)
|
|
113
|
+
return;
|
|
114
|
+
this.toggleController.updateToggleDir();
|
|
115
|
+
}
|
|
116
|
+
sizeChange() {
|
|
117
|
+
this.groups.forEach((g) => (g.size = this.size));
|
|
118
|
+
}
|
|
119
|
+
firstUpdated() {
|
|
120
|
+
if (this.targetNodes.length) {
|
|
121
|
+
this.target = this.targetNodes[0];
|
|
122
|
+
this.target.setAttribute('aria-haspopup', 'listbox');
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
async getUpdateComplete() {
|
|
126
|
+
const result = await super.getUpdateComplete();
|
|
127
|
+
await this.toggleController.rendered;
|
|
128
|
+
return result;
|
|
129
|
+
}
|
|
130
|
+
handleItemActionKey(key) {
|
|
131
|
+
switch (key) {
|
|
132
|
+
case DropDownActionKey.ENTER:
|
|
133
|
+
this.selectItem(this.activeItem);
|
|
134
|
+
this.handleChange(this.activeItem);
|
|
135
|
+
break;
|
|
136
|
+
case DropDownActionKey.ESCAPE:
|
|
137
|
+
break;
|
|
138
|
+
}
|
|
139
|
+
if (!this.keepOpenOnSelect)
|
|
140
|
+
this._hide();
|
|
141
|
+
}
|
|
142
|
+
handleClick(event) {
|
|
143
|
+
const newSelectedItem = event
|
|
144
|
+
.composedPath()
|
|
145
|
+
.find((e) => e instanceof IgcDropDownItemComponent);
|
|
146
|
+
if (!newSelectedItem || newSelectedItem.disabled)
|
|
147
|
+
return;
|
|
148
|
+
this.selectItem(newSelectedItem);
|
|
149
|
+
this.handleChange(newSelectedItem);
|
|
150
|
+
if (!this.keepOpenOnSelect)
|
|
151
|
+
this._hide();
|
|
152
|
+
}
|
|
153
|
+
handleOpening() {
|
|
154
|
+
const args = { cancelable: true };
|
|
155
|
+
return this.emitEvent('igcOpening', args);
|
|
156
|
+
}
|
|
157
|
+
handleClosing() {
|
|
158
|
+
const args = { cancelable: true };
|
|
159
|
+
return this.emitEvent('igcClosing', args);
|
|
160
|
+
}
|
|
161
|
+
handleChange(item) {
|
|
162
|
+
const args = { detail: item };
|
|
163
|
+
this.emitEvent('igcChange', args);
|
|
164
|
+
}
|
|
165
|
+
handleSlotChange() {
|
|
166
|
+
if (!this.target)
|
|
167
|
+
return;
|
|
168
|
+
this.target.setAttribute('aria-expanded', this.open ? 'true' : 'false');
|
|
169
|
+
}
|
|
170
|
+
handleFocusout(event) {
|
|
171
|
+
event.preventDefault();
|
|
172
|
+
event.target.focus();
|
|
173
|
+
}
|
|
174
|
+
getItem(value) {
|
|
175
|
+
let itemIndex = -1;
|
|
176
|
+
let item;
|
|
177
|
+
this.allItems.find((i, index) => {
|
|
178
|
+
if (i.value === value) {
|
|
179
|
+
item = i;
|
|
180
|
+
itemIndex = index;
|
|
181
|
+
}
|
|
182
|
+
});
|
|
183
|
+
return { item: item, index: itemIndex };
|
|
184
|
+
}
|
|
185
|
+
activateItem(value) {
|
|
186
|
+
if (!value)
|
|
187
|
+
return;
|
|
188
|
+
if (this.activeItem && this.activeItem !== value) {
|
|
189
|
+
this.activeItem.active = false;
|
|
190
|
+
}
|
|
191
|
+
this.activeItem = value;
|
|
192
|
+
this.activeItem.active = true;
|
|
193
|
+
}
|
|
194
|
+
selectItem(item, emit = true) {
|
|
195
|
+
const oldItem = this.selectedItem;
|
|
196
|
+
if (!item) {
|
|
197
|
+
return null;
|
|
198
|
+
}
|
|
199
|
+
if (oldItem && oldItem !== item) {
|
|
200
|
+
oldItem.selected = false;
|
|
201
|
+
}
|
|
202
|
+
this.activateItem(item);
|
|
203
|
+
this.selectedItem = item;
|
|
204
|
+
this.selectedItem.selected = true;
|
|
205
|
+
if (emit)
|
|
206
|
+
this.handleChange(this.selectedItem);
|
|
207
|
+
return this.selectedItem;
|
|
208
|
+
}
|
|
209
|
+
navigate(direction, currentIndex) {
|
|
210
|
+
var _a;
|
|
211
|
+
let index = -1;
|
|
212
|
+
if (this.activeItem) {
|
|
213
|
+
index = currentIndex
|
|
214
|
+
? currentIndex
|
|
215
|
+
: (_a = [...this.allItems].indexOf(this.activeItem)) !== null && _a !== void 0 ? _a : index;
|
|
216
|
+
}
|
|
217
|
+
const newIndex = this.getNearestSiblingFocusableItemIndex(index, direction);
|
|
218
|
+
this.navigateItem(newIndex);
|
|
219
|
+
}
|
|
220
|
+
navigateItem(newIndex) {
|
|
221
|
+
if (!this.allItems) {
|
|
222
|
+
return null;
|
|
223
|
+
}
|
|
224
|
+
if (newIndex < 0 || newIndex >= this.allItems.length) {
|
|
225
|
+
return null;
|
|
226
|
+
}
|
|
227
|
+
const newItem = this.allItems[newIndex];
|
|
228
|
+
this.activateItem(newItem);
|
|
229
|
+
this.scrollToHiddenItem(newItem);
|
|
230
|
+
return newItem;
|
|
231
|
+
}
|
|
232
|
+
scrollToHiddenItem(newItem) {
|
|
233
|
+
const elementRect = newItem.getBoundingClientRect();
|
|
234
|
+
const parentRect = this.content.getBoundingClientRect();
|
|
235
|
+
if (parentRect.top > elementRect.top) {
|
|
236
|
+
this.content.scrollTop -= parentRect.top - elementRect.top;
|
|
237
|
+
}
|
|
238
|
+
if (parentRect.bottom < elementRect.bottom) {
|
|
239
|
+
this.content.scrollTop += elementRect.bottom - parentRect.bottom;
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
getNearestSiblingFocusableItemIndex(startIndex, direction) {
|
|
243
|
+
let index = startIndex;
|
|
244
|
+
const items = this.allItems;
|
|
245
|
+
if (!items) {
|
|
246
|
+
return -1;
|
|
247
|
+
}
|
|
248
|
+
while (items[index + direction] && items[index + direction].disabled) {
|
|
249
|
+
index += direction;
|
|
250
|
+
}
|
|
251
|
+
index += direction;
|
|
252
|
+
return index > -1 && index < items.length ? index : -1;
|
|
253
|
+
}
|
|
254
|
+
navigateNext() {
|
|
255
|
+
this.navigate(1);
|
|
256
|
+
}
|
|
257
|
+
navigatePrev() {
|
|
258
|
+
this.navigate(-1);
|
|
259
|
+
}
|
|
260
|
+
onArrowDownKeyDown() {
|
|
261
|
+
this.navigateNext();
|
|
262
|
+
}
|
|
263
|
+
onArrowUpKeyDown() {
|
|
264
|
+
this.navigatePrev();
|
|
265
|
+
}
|
|
266
|
+
_hide(emit = true) {
|
|
267
|
+
if (emit && !this.handleClosing())
|
|
268
|
+
return;
|
|
269
|
+
if (!this.open)
|
|
270
|
+
return;
|
|
271
|
+
this.open = false;
|
|
272
|
+
if (emit) {
|
|
273
|
+
this.emitEvent('igcClosed');
|
|
274
|
+
}
|
|
275
|
+
}
|
|
276
|
+
show(target) {
|
|
277
|
+
if (this.open && !target)
|
|
278
|
+
return;
|
|
279
|
+
if (target)
|
|
280
|
+
this.target = target;
|
|
281
|
+
this.open = true;
|
|
282
|
+
}
|
|
283
|
+
hide() {
|
|
284
|
+
this._hide(false);
|
|
285
|
+
}
|
|
286
|
+
toggle(target) {
|
|
287
|
+
if (!this.open) {
|
|
288
|
+
this.show(target);
|
|
289
|
+
}
|
|
290
|
+
else {
|
|
291
|
+
this.hide();
|
|
292
|
+
}
|
|
293
|
+
}
|
|
294
|
+
navigateTo(value) {
|
|
295
|
+
const index = typeof value === 'string' ? this.getItem(value).index : value;
|
|
296
|
+
return this.navigateItem(index);
|
|
297
|
+
}
|
|
298
|
+
select(value) {
|
|
299
|
+
const item = typeof value === 'string'
|
|
300
|
+
? this.getItem(value).item
|
|
301
|
+
: this.allItems[value];
|
|
302
|
+
return this.selectItem(item, false);
|
|
303
|
+
}
|
|
304
|
+
clearSelection() {
|
|
305
|
+
if (this.selectedItem) {
|
|
306
|
+
this.selectedItem.selected = false;
|
|
307
|
+
}
|
|
308
|
+
this.selectedItem = null;
|
|
309
|
+
}
|
|
310
|
+
render() {
|
|
311
|
+
return html `
|
|
312
|
+
<slot
|
|
313
|
+
id="igcDDLTarget"
|
|
314
|
+
name="target"
|
|
315
|
+
@click=${this.handleTargetClick}
|
|
316
|
+
@slotchange=${this.handleSlotChange}
|
|
317
|
+
>
|
|
318
|
+
</slot>
|
|
319
|
+
<div
|
|
320
|
+
id="igcDDLContent"
|
|
321
|
+
part="base"
|
|
322
|
+
style=${styleMap({ position: this.positionStrategy })}
|
|
323
|
+
@click=${this.handleClick}
|
|
324
|
+
${this.toggleController.toggleDirective}
|
|
325
|
+
>
|
|
326
|
+
<div
|
|
327
|
+
id="igcScrollContainer"
|
|
328
|
+
role="listbox"
|
|
329
|
+
part="list"
|
|
330
|
+
aria-labelledby="igcDDLTarget"
|
|
331
|
+
>
|
|
332
|
+
<slot></slot>
|
|
333
|
+
</div>
|
|
334
|
+
</div>
|
|
335
|
+
`;
|
|
336
|
+
}
|
|
337
|
+
};
|
|
338
|
+
IgcDropDownComponent.tagName = 'igc-dropdown';
|
|
339
|
+
IgcDropDownComponent.styles = styles;
|
|
340
|
+
__decorate([
|
|
341
|
+
queryAssignedElements({ slot: 'target' })
|
|
342
|
+
], IgcDropDownComponent.prototype, "targetNodes", void 0);
|
|
343
|
+
__decorate([
|
|
344
|
+
query('#igcDDLContent')
|
|
345
|
+
], IgcDropDownComponent.prototype, "content", void 0);
|
|
346
|
+
__decorate([
|
|
347
|
+
query('#igcScrollContainer')
|
|
348
|
+
], IgcDropDownComponent.prototype, "scrollContainer", void 0);
|
|
349
|
+
__decorate([
|
|
350
|
+
queryAssignedElements({ flatten: true, selector: 'igc-dropdown-item' })
|
|
351
|
+
], IgcDropDownComponent.prototype, "items", void 0);
|
|
352
|
+
__decorate([
|
|
353
|
+
queryAssignedElements({ flatten: true, selector: 'igc-dropdown-group' })
|
|
354
|
+
], IgcDropDownComponent.prototype, "groups", void 0);
|
|
355
|
+
__decorate([
|
|
356
|
+
property({ type: Boolean, attribute: 'keep-open-on-select' })
|
|
357
|
+
], IgcDropDownComponent.prototype, "keepOpenOnSelect", void 0);
|
|
358
|
+
__decorate([
|
|
359
|
+
property({ type: Boolean })
|
|
360
|
+
], IgcDropDownComponent.prototype, "open", void 0);
|
|
361
|
+
__decorate([
|
|
362
|
+
property()
|
|
363
|
+
], IgcDropDownComponent.prototype, "placement", void 0);
|
|
364
|
+
__decorate([
|
|
365
|
+
property({ attribute: 'position-strategy' })
|
|
366
|
+
], IgcDropDownComponent.prototype, "positionStrategy", void 0);
|
|
367
|
+
__decorate([
|
|
368
|
+
property({ attribute: 'scroll-strategy' })
|
|
369
|
+
], IgcDropDownComponent.prototype, "scrollStrategy", void 0);
|
|
370
|
+
__decorate([
|
|
371
|
+
property({ type: Boolean })
|
|
372
|
+
], IgcDropDownComponent.prototype, "flip", void 0);
|
|
373
|
+
__decorate([
|
|
374
|
+
property({ type: Number })
|
|
375
|
+
], IgcDropDownComponent.prototype, "distance", void 0);
|
|
376
|
+
__decorate([
|
|
377
|
+
property({ type: Boolean, attribute: 'keep-open-on-outside-click' })
|
|
378
|
+
], IgcDropDownComponent.prototype, "keepOpenOnOutsideClick", void 0);
|
|
379
|
+
__decorate([
|
|
380
|
+
property({ type: Boolean, attribute: 'same-width' })
|
|
381
|
+
], IgcDropDownComponent.prototype, "sameWidth", void 0);
|
|
382
|
+
__decorate([
|
|
383
|
+
watch('open')
|
|
384
|
+
], IgcDropDownComponent.prototype, "toggleDirectiveChange", null);
|
|
385
|
+
__decorate([
|
|
386
|
+
watch('placement'),
|
|
387
|
+
watch('flip'),
|
|
388
|
+
watch('positionStrategy'),
|
|
389
|
+
watch('closeOnOutsideClick'),
|
|
390
|
+
watch('distance'),
|
|
391
|
+
watch('sameWidth')
|
|
392
|
+
], IgcDropDownComponent.prototype, "updateOptions", null);
|
|
393
|
+
__decorate([
|
|
394
|
+
watch('size')
|
|
395
|
+
], IgcDropDownComponent.prototype, "sizeChange", null);
|
|
396
|
+
__decorate([
|
|
397
|
+
blazorSuppress()
|
|
398
|
+
], IgcDropDownComponent.prototype, "show", null);
|
|
399
|
+
__decorate([
|
|
400
|
+
blazorSuppress()
|
|
401
|
+
], IgcDropDownComponent.prototype, "toggle", null);
|
|
402
|
+
__decorate([
|
|
403
|
+
blazorSuppress()
|
|
404
|
+
], IgcDropDownComponent.prototype, "navigateTo", null);
|
|
405
|
+
__decorate([
|
|
406
|
+
blazorSuppress()
|
|
407
|
+
], IgcDropDownComponent.prototype, "select", null);
|
|
408
|
+
IgcDropDownComponent = __decorate([
|
|
409
|
+
themes({ bootstrap, fluent, indigo })
|
|
410
|
+
], IgcDropDownComponent);
|
|
411
|
+
export default IgcDropDownComponent;
|
|
412
|
+
//# sourceMappingURL=dropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, queryAssignedElements } from 'lit/decorators.js';\nimport { Constructor } from '../common/mixins/constructor';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter';\nimport { themes } from '../../theming';\nimport { styles } from './themes/light/dropdown.base.css';\nimport { styles as bootstrap } from './themes/light/dropdown.bootstrap.css';\nimport { styles as fluent } from './themes/light/dropdown.fluent.css';\nimport { styles as indigo } from './themes/light/dropdown.indigo.css';\nimport { blazorSuppress, watch } from '../common/decorators';\nimport {\n IgcPlacement,\n IgcToggleComponent,\n IgcToggleEventMap,\n} from '../toggle/utilities';\nimport IgcDropDownItemComponent from './dropdown-item';\nimport { IgcToggleController } from '../toggle/toggle.controller';\nimport IgcDropDownGroupComponent from './dropdown-group';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { SizableMixin } from '../common/mixins/sizable';\n\nexport enum DropDownActionKey {\n ESCAPE = 'escape',\n ENTER = 'enter',\n}\n\nexport interface IgcDropDownEventMap extends IgcToggleEventMap {\n igcChange: CustomEvent<IgcDropDownItemComponent>;\n}\n\n/**\n * Represents a DropDown component.\n *\n * @element igc-dropdown\n *\n * @fires igcChange - Emitted when the selected item changes.\n * @fires igcOpening - Emitted just before the dropdown is open.\n * @fires igcOpened - Emitted after the dropdown is open.\n * @fires igcClosing - Emitter just before the dropdown is closed.\n * @fires igcClosed - Emitted after closing the dropdown.\n *\n * @slot target - Renders the dropdown's target element.\n * @slot - Renders the dropdown list items.\n *\n * @csspart base - The dropdown list wrapper.\n * @csspart list - The dropdown list.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcDropDownComponent\n extends SizableMixin(\n EventEmitterMixin<IgcDropDownEventMap, Constructor<LitElement>>(LitElement)\n )\n implements IgcToggleComponent\n{\n public static readonly tagName = 'igc-dropdown';\n\n public static styles = styles;\n\n private toggleController!: IgcToggleController;\n private selectedItem!: IgcDropDownItemComponent | null;\n private activeItem!: IgcDropDownItemComponent;\n private target!: HTMLElement;\n\n private get allItems(): IgcDropDownItemComponent[] {\n const groupItems: IgcDropDownItemComponent[] = this.groups.flatMap(\n (group) => group.items\n );\n return [...this.items, ...groupItems];\n }\n\n @queryAssignedElements({ slot: 'target' })\n private targetNodes!: Array<HTMLElement>;\n\n @query('#igcDDLContent')\n protected content!: HTMLElement;\n\n @query('#igcScrollContainer')\n protected scrollContainer!: HTMLElement;\n\n @queryAssignedElements({ flatten: true, selector: 'igc-dropdown-item' })\n protected items!: Array<IgcDropDownItemComponent>;\n\n @queryAssignedElements({ flatten: true, selector: 'igc-dropdown-group' })\n protected groups!: Array<IgcDropDownGroupComponent>;\n\n /** Whether the dropdown should be kept open on selection. */\n @property({ type: Boolean, attribute: 'keep-open-on-select' })\n public keepOpenOnSelect = false;\n\n /** Sets the open state of the component. */\n @property({ type: Boolean })\n public open = false;\n\n /** The preferred placement of the component around the target element.\n * @type {\"top\" | \"top-start\" | \"top-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"right\" | \"right-start\" | \"right-end\" | \"left\" | \"left-start\" | \"left-end\"}\n */\n @property()\n public placement: IgcPlacement = 'bottom-start';\n\n /** Sets the component's positioning strategy. */\n @property({ attribute: 'position-strategy' })\n public positionStrategy: 'absolute' | 'fixed' = 'absolute';\n\n /** Determines the behavior of the component during scrolling the container. */\n @property({ attribute: 'scroll-strategy' })\n public scrollStrategy: 'scroll' | 'block' | 'close' = 'scroll';\n\n /**\n * Whether the component should be flipped to the opposite side of the target once it's about to overflow the visible area.\n * When true, once enough space is detected on its preferred side, it will flip back.\n */\n @property({ type: Boolean })\n public flip = false;\n\n /** The distance from the target element. */\n @property({ type: Number })\n public distance = 0;\n\n /** Whether the component should be kept open on clicking outside of it. */\n @property({ type: Boolean, attribute: 'keep-open-on-outside-click' })\n public keepOpenOnOutsideClick = false;\n\n /** Whether the dropdown's width should be the same as the target's one. */\n @property({ type: Boolean, attribute: 'same-width' })\n public sameWidth = false;\n\n @watch('open')\n protected toggleDirectiveChange() {\n if (!this.target) return;\n this.toggleController.target = this.target;\n\n if (this.open) {\n document.addEventListener('keydown', this.handleKeyDown);\n this.target.addEventListener('focusout', this.handleFocusout);\n this.selectedItem = this.allItems.find((i) => i.selected) ?? null;\n } else {\n document.removeEventListener('keydown', this.handleKeyDown);\n this.target.removeEventListener('focusout', this.handleFocusout);\n }\n\n this.target.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n // this.content.setAttribute(\n // 'aria-activedescendant',\n // (this.open\n // ? this.activeItem\n // ? this.activeItem.value\n // : this.items[0]?.value\n // : '') as string\n // );\n }\n\n @watch('placement')\n @watch('flip')\n @watch('positionStrategy')\n @watch('closeOnOutsideClick')\n @watch('distance')\n @watch('sameWidth')\n protected updateOptions() {\n if (!this.toggleController) return;\n\n this.toggleController.updateToggleDir();\n }\n\n @watch('size')\n protected sizeChange() {\n this.groups.forEach((g) => (g.size = this.size));\n }\n\n constructor() {\n super();\n\n this.toggleController = new IgcToggleController(this, this.target);\n }\n\n public override firstUpdated() {\n if (this.targetNodes.length) {\n this.target = this.targetNodes[0];\n // this.target.setAttribute('aria-owns', 'igcScrollContainer');\n this.target.setAttribute('aria-haspopup', 'listbox');\n }\n }\n\n protected override async getUpdateComplete() {\n const result = await super.getUpdateComplete();\n await this.toggleController.rendered;\n return result;\n }\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (\n this.open &&\n event &&\n (event.composedPath().includes(this.target) ||\n event.composedPath().includes(this.content))\n ) {\n const key = event.key.toLowerCase();\n const navKeys = [\n 'esc',\n 'escape',\n 'enter',\n 'arrowup',\n 'up',\n 'arrowdown',\n 'down',\n ];\n if (navKeys.indexOf(key) === -1) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n switch (key) {\n case 'esc':\n case 'escape':\n this.handleItemActionKey(DropDownActionKey.ESCAPE);\n break;\n case 'enter':\n this.handleItemActionKey(DropDownActionKey.ENTER);\n break;\n case 'arrowup':\n case 'up':\n this.onArrowUpKeyDown();\n break;\n case 'arrowdown':\n case 'down':\n this.onArrowDownKeyDown();\n break;\n default:\n return;\n }\n }\n };\n\n private handleItemActionKey(key: DropDownActionKey) {\n switch (key) {\n case DropDownActionKey.ENTER:\n this.selectItem(this.activeItem);\n this.handleChange(this.activeItem);\n break;\n case DropDownActionKey.ESCAPE:\n break;\n }\n\n if (!this.keepOpenOnSelect) this._hide();\n }\n\n private handleClick(event: MouseEvent) {\n const newSelectedItem = event\n .composedPath()\n .find(\n (e) => e instanceof IgcDropDownItemComponent\n ) as IgcDropDownItemComponent;\n\n if (!newSelectedItem || newSelectedItem.disabled) return;\n\n this.selectItem(newSelectedItem);\n this.handleChange(newSelectedItem);\n if (!this.keepOpenOnSelect) this._hide();\n }\n\n private handleTargetClick = () => {\n if (!this.open) {\n if (!this.handleOpening()) return;\n this.show();\n this.emitEvent('igcOpened');\n } else {\n this._hide();\n }\n };\n\n private handleOpening() {\n const args = { cancelable: true };\n return this.emitEvent('igcOpening', args);\n }\n\n private handleClosing(): boolean {\n const args = { cancelable: true };\n return this.emitEvent('igcClosing', args);\n }\n\n private handleChange(item: IgcDropDownItemComponent) {\n const args = { detail: item };\n this.emitEvent('igcChange', args);\n }\n\n private handleSlotChange() {\n if (!this.target) return;\n this.target.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n // this.target.setAttribute(\n // 'aria-activedescendant',\n // (this.activeItem\n // ? this.activeItem.value\n // : this.items[0]?.value) as string\n // );\n }\n\n private handleFocusout(event: Event) {\n event.preventDefault();\n (event.target as HTMLElement).focus();\n }\n\n private getItem(value: string) {\n let itemIndex = -1;\n let item!: IgcDropDownItemComponent;\n this.allItems.find((i, index) => {\n if (i.value === value) {\n item = i;\n itemIndex = index;\n }\n });\n return { item: item, index: itemIndex };\n }\n\n private activateItem(value: IgcDropDownItemComponent) {\n if (!value) return;\n\n if (this.activeItem && this.activeItem !== value) {\n this.activeItem.active = false;\n }\n\n this.activeItem = value;\n this.activeItem.active = true;\n }\n\n private selectItem(\n item: IgcDropDownItemComponent,\n emit = true\n ): IgcDropDownItemComponent | null {\n const oldItem = this.selectedItem;\n\n if (!item) {\n return null;\n }\n\n if (oldItem && oldItem !== item) {\n oldItem.selected = false;\n }\n\n this.activateItem(item);\n this.selectedItem = item;\n this.selectedItem.selected = true;\n if (emit) this.handleChange(this.selectedItem);\n\n return this.selectedItem;\n }\n\n private navigate(direction: -1 | 1, currentIndex?: number) {\n let index = -1;\n if (this.activeItem) {\n index = currentIndex\n ? currentIndex\n : [...this.allItems].indexOf(this.activeItem) ?? index;\n }\n\n const newIndex = this.getNearestSiblingFocusableItemIndex(index, direction);\n this.navigateItem(newIndex);\n }\n\n private navigateItem(newIndex: number): IgcDropDownItemComponent | null {\n if (!this.allItems) {\n return null;\n }\n\n if (newIndex < 0 || newIndex >= this.allItems.length) {\n return null;\n }\n\n const newItem = this.allItems[newIndex];\n\n this.activateItem(newItem);\n this.scrollToHiddenItem(newItem);\n\n return newItem;\n }\n\n private scrollToHiddenItem(newItem: IgcDropDownItemComponent) {\n const elementRect = newItem.getBoundingClientRect();\n const parentRect = this.content.getBoundingClientRect();\n if (parentRect.top > elementRect.top) {\n this.content.scrollTop -= parentRect.top - elementRect.top;\n }\n\n if (parentRect.bottom < elementRect.bottom) {\n this.content.scrollTop += elementRect.bottom - parentRect.bottom;\n }\n }\n\n private getNearestSiblingFocusableItemIndex(\n startIndex: number,\n direction: -1 | 1\n ): number {\n let index = startIndex;\n const items = this.allItems;\n if (!items) {\n return -1;\n }\n\n while (items[index + direction] && items[index + direction].disabled) {\n index += direction;\n }\n\n index += direction;\n\n return index > -1 && index < items.length ? index : -1;\n }\n\n private navigateNext() {\n this.navigate(1);\n }\n\n private navigatePrev() {\n this.navigate(-1);\n }\n\n private onArrowDownKeyDown() {\n this.navigateNext();\n }\n\n private onArrowUpKeyDown() {\n this.navigatePrev();\n }\n\n private _hide(emit = true) {\n if (emit && !this.handleClosing()) return;\n\n if (!this.open) return;\n\n this.open = false;\n\n if (emit) {\n this.emitEvent('igcClosed');\n }\n }\n\n /** Shows the dropdown. */\n @blazorSuppress()\n public show(target?: HTMLElement) {\n if (this.open && !target) return;\n\n if (target) this.target = target;\n\n this.open = true;\n }\n\n /** Hides the dropdown. */\n public hide(): void {\n this._hide(false);\n }\n\n /** Toggles the open state of the dropdown. */\n @blazorSuppress()\n public toggle(target?: HTMLElement): void {\n if (!this.open) {\n this.show(target);\n } else {\n this.hide();\n }\n }\n\n /** Navigates to the item with the specified value. If it exists, returns the found item, otherwise - null. */\n public navigateTo(value: string): IgcDropDownItemComponent | null;\n /** Navigates to the item at the specified index. If it exists, returns the found item, otherwise - null. */\n public navigateTo(index: number): IgcDropDownItemComponent | null;\n /** Navigates to the specified item. If it exists, returns the found item, otherwise - null. */\n @blazorSuppress()\n public navigateTo(value: string | number): IgcDropDownItemComponent | null {\n const index =\n typeof value === 'string' ? this.getItem(value).index : (value as number);\n\n return this.navigateItem(index);\n }\n\n /** Selects the item with the specified value. If it exists, returns the found item, otherwise - null. */\n public select(value: string): IgcDropDownItemComponent | null;\n /** Selects the item at the specified index. If it exists, returns the found item, otherwise - null. */\n public select(index: number): IgcDropDownItemComponent | null;\n /** Selects the specified item. If it exists, returns the found item, otherwise - null. */\n @blazorSuppress()\n public select(value: string | number): IgcDropDownItemComponent | null {\n const item =\n typeof value === 'string'\n ? this.getItem(value).item\n : this.allItems[value as number];\n\n return this.selectItem(item, false);\n }\n\n /** Clears the current selection of the dropdown. */\n public clearSelection() {\n if (this.selectedItem) {\n this.selectedItem.selected = false;\n }\n this.selectedItem = null;\n }\n\n protected override render() {\n return html`\n <slot\n id=\"igcDDLTarget\"\n name=\"target\"\n @click=${this.handleTargetClick}\n @slotchange=${this.handleSlotChange}\n >\n </slot>\n <div\n id=\"igcDDLContent\"\n part=\"base\"\n style=${styleMap({ position: this.positionStrategy })}\n @click=${this.handleClick}\n ${this.toggleController.toggleDirective}\n >\n <div\n id=\"igcScrollContainer\"\n role=\"listbox\"\n part=\"list\"\n aria-labelledby=\"igcDDLTarget\"\n >\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-dropdown': IgcDropDownComponent;\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/dark/dropdown.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/dark/dropdown.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/dark/dropdown.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css``;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{pointer-events:auto}:host ::slotted([slot=label]){font-family:var(--igc-overline-font-family);font-weight:var(--igc-overline-font-weight);font-size:var(--igc-overline-font-size);font-style:var(--igc-overline-font-style);letter-spacing:var(--igc-overline-letter-spacing);text-transform:var(--igc-overline-text-transform);line-height:var(--igc-overline-line-height);margin-top:var(--igc-overline-margin-top);margin-bottom:var(--igc-overline-margin-bottom);white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;white-space:nowrap;position:relative;color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));pointer-events:none}:host([size=small]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-small) calc(var(--igc-spacing-small)*3)}:host([size=small]) ::slotted([slot=label]){padding:var(--igc-spacing-small) calc(var(--igc-spacing-small)*2)}:host([size=medium]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-medium) calc(var(--igc-spacing-medium)*3)}:host([size=medium]) ::slotted([slot=label]){padding:var(--igc-spacing-medium) calc(var(--igc-spacing-medium)*2)}:host([size=large]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-large) calc(var(--igc-spacing-large)*3)}:host([size=large]) ::slotted([slot=label]){padding:var(--igc-spacing-large) calc(var(--igc-spacing-large)*2)}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-group.base.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-group.base.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-group.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,6iEAA6iE,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{pointer-events:auto}:host ::slotted([slot=label]){font-family:var(--igc-overline-font-family);font-weight:var(--igc-overline-font-weight);font-size:var(--igc-overline-font-size);font-style:var(--igc-overline-font-style);letter-spacing:var(--igc-overline-letter-spacing);text-transform:var(--igc-overline-text-transform);line-height:var(--igc-overline-line-height);margin-top:var(--igc-overline-margin-top);margin-bottom:var(--igc-overline-margin-bottom);white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;white-space:nowrap;position:relative;color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));pointer-events:none}:host([size=small]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-small) calc(var(--igc-spacing-small)*3)}:host([size=small]) ::slotted([slot=label]){padding:var(--igc-spacing-small) calc(var(--igc-spacing-small)*2)}:host([size=medium]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-medium) calc(var(--igc-spacing-medium)*3)}:host([size=medium]) ::slotted([slot=label]){padding:var(--igc-spacing-medium) calc(var(--igc-spacing-medium)*2)}:host([size=large]) ::slotted(igc-dropdown-item){padding:var(--igc-spacing-large) calc(var(--igc-spacing-large)*3)}:host([size=large]) ::slotted([slot=label]){padding:var(--igc-spacing-large) calc(var(--igc-spacing-large)*2)}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host([size=small]) ::slotted(igc-dropdown-item),:host([size=small]) ::slotted([slot=label]){padding:var(--igc-spacing-small)}:host([size=medium]) ::slotted(igc-dropdown-item),:host([size=medium]) ::slotted([slot=label]){padding:var(--igc-spacing-medium)}:host([size=large]) ::slotted(igc-dropdown-item),:host([size=large]) ::slotted([slot=label]){padding:var(--igc-spacing-large)}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-group.fluent.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-group.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-group.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,+XAA+X,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host([size=small]) ::slotted(igc-dropdown-item),:host([size=small]) ::slotted([slot=label]){padding:var(--igc-spacing-small)}:host([size=medium]) ::slotted(igc-dropdown-item),:host([size=medium]) ::slotted([slot=label]){padding:var(--igc-spacing-medium)}:host([size=large]) ::slotted(igc-dropdown-item),:host([size=large]) ::slotted([slot=label]){padding:var(--igc-spacing-large)}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{font-family:var(--igc-overline-font-family);font-weight:var(--igc-overline-font-weight);font-size:var(--igc-overline-font-size);font-style:var(--igc-overline-font-style);letter-spacing:var(--igc-overline-letter-spacing);text-transform:var(--igc-overline-text-transform);line-height:var(--igc-overline-line-height);margin-top:var(--igc-overline-margin-top);margin-bottom:var(--igc-overline-margin-bottom);white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;white-space:nowrap;position:relative;color:var(--header-color, hsla(var(--igc-secondary-500), var(--igc-secondary-a)));pointer-events:none}::slotted(*){font:inherit}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-header.base.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-header.base.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-header.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,i4CAAi4C,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{font-family:var(--igc-overline-font-family);font-weight:var(--igc-overline-font-weight);font-size:var(--igc-overline-font-size);font-style:var(--igc-overline-font-style);letter-spacing:var(--igc-overline-letter-spacing);text-transform:var(--igc-overline-text-transform);line-height:var(--igc-overline-line-height);margin-top:var(--igc-overline-margin-top);margin-bottom:var(--igc-overline-margin-bottom);white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;white-space:nowrap;position:relative;color:var(--header-color, hsla(var(--igc-secondary-500), var(--igc-secondary-a)));pointer-events:none}::slotted(*){font:inherit}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-header.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-header.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2DAA2D,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{color:hsla(var(--igc-gray-700), var(--igc-gray-a))}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{font-family:var(--igc-body-2-font-family);font-weight:var(--igc-body-2-font-weight);font-size:var(--igc-body-2-font-size);font-style:var(--igc-body-2-font-style);letter-spacing:var(--igc-body-2-letter-spacing);text-transform:var(--igc-body-2-text-transform);line-height:var(--igc-body-2-line-height);margin-top:var(--igc-body-2-margin-top);margin-bottom:var(--igc-body-2-margin-bottom);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;white-space:nowrap;position:relative;cursor:pointer;color:hsla(var(--igc-gray-800), var(--igc-gray-a))}:host(:hover),:host([active]){background:hsla(var(--igc-gray-200), var(--igc-gray-a))}:host([selected]){background:hsla(var(--igc-secondary-100), var(--igc-secondary-a));color:var(--igc-secondary-100-contrast)}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-secondary-200), var(--igc-secondary-a));color:var(--igc-secondary-200-contrast)}:host([disabled]){color:hsla(var(--igc-gray-500), var(--igc-gray-a));cursor:default;pointer-events:none}::slotted(*){font:inherit}[part=content]{white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center}[part=prefix],[part=suffix]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}[name=prefix]::slotted(*){-webkit-margin-end:calc(var(--igc-spacing-large)*2);margin-inline-end:calc(var(--igc-spacing-large)*2)}[name=suffix]::slotted(*){-webkit-margin-start:calc(var(--igc-spacing-large)*2);margin-inline-start:calc(var(--igc-spacing-large)*2)}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-item.base.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-item.base.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-item.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,kiFAAkiF,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{font-family:var(--igc-body-2-font-family);font-weight:var(--igc-body-2-font-weight);font-size:var(--igc-body-2-font-size);font-style:var(--igc-body-2-font-style);letter-spacing:var(--igc-body-2-letter-spacing);text-transform:var(--igc-body-2-text-transform);line-height:var(--igc-body-2-line-height);margin-top:var(--igc-body-2-margin-top);margin-bottom:var(--igc-body-2-margin-bottom);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;white-space:nowrap;position:relative;cursor:pointer;color:hsla(var(--igc-gray-800), var(--igc-gray-a))}:host(:hover),:host([active]){background:hsla(var(--igc-gray-200), var(--igc-gray-a))}:host([selected]){background:hsla(var(--igc-secondary-100), var(--igc-secondary-a));color:var(--igc-secondary-100-contrast)}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-secondary-200), var(--igc-secondary-a));color:var(--igc-secondary-200-contrast)}:host([disabled]){color:hsla(var(--igc-gray-500), var(--igc-gray-a));cursor:default;pointer-events:none}::slotted(*){font:inherit}[part=content]{white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;display:block;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center}[part=prefix],[part=suffix]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}[name=prefix]::slotted(*){-webkit-margin-end:calc(var(--igc-spacing-large)*2);margin-inline-end:calc(var(--igc-spacing-large)*2)}[name=suffix]::slotted(*){-webkit-margin-start:calc(var(--igc-spacing-large)*2);margin-inline-start:calc(var(--igc-spacing-large)*2)}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host{color:var(--item-color, hsla(var(--igc-gray-900), var(--igc-gray-a)))}:host(:hover),:host([active]){background:hsla(var(--igc-gray-100), var(--igc-gray-a));color:var(--hover-item-color, var(--igc-gray-100-contrast))}:host([selected]){background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-600-contrast)}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-primary-600), var(--igc-primary-a));color:var(--igc-primary-600-contrast)}:host([disabled]){color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-item.bootstrap.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-item.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-item.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ijBAAijB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{color:var(--item-color, hsla(var(--igc-gray-900), var(--igc-gray-a)))}:host(:hover),:host([active]){background:hsla(var(--igc-gray-100), var(--igc-gray-a));color:var(--hover-item-color, var(--igc-gray-100-contrast))}:host([selected]){background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-600-contrast)}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-primary-600), var(--igc-primary-a));color:var(--igc-primary-600-contrast)}:host([disabled]){color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host(:hover),:host([active]){background:hsla(var(--igc-gray-100), var(--igc-gray-a));color:var(--igc-gray-100-contrast)}:host([selected]){background:hsla(var(--igc-gray-200), var(--igc-gray-a));color:var(--selected-item-color, var(--igc-gray-200-contrast))}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-gray-200), var(--igc-gray-a));color:var(--selected-item-color, var(--igc-gray-200-contrast))}:host([disabled]){color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-item.fluent.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-item.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/themes/light/dropdown-item.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,kfAAkf,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host(:hover),:host([active]){background:hsla(var(--igc-gray-100), var(--igc-gray-a));color:var(--igc-gray-100-contrast)}:host([selected]){background:hsla(var(--igc-gray-200), var(--igc-gray-a));color:var(--selected-item-color, var(--igc-gray-200-contrast))}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-gray-200), var(--igc-gray-a));color:var(--selected-item-color, var(--igc-gray-200-contrast))}:host([disabled]){color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const styles: import("lit").CSSResult;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host{border-radius:clamp(0rem,var(--igc-radius-factor)*.125rem,.125rem);color:hsla(var(--igc-gray-700), var(--igc-gray-a))}:host(:hover),:host([active]){background:hsla(var(--igc-primary-500), 0.15)}:host([selected]){background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-500-contrast)}:host([selected]:hover),:host([selected][active]){background:hsla(var(--igc-primary-400), var(--igc-primary-a));color:var(--igc-primary-400-contrast)}:host([disabled]){color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;
|
|
3
|
+
//# sourceMappingURL=dropdown-item.indigo.css.js.map
|