igniteui-webcomponents 7.3.0-beta.0 → 7.3.0-beta.1
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 +20 -0
- package/animations/player.d.ts +7 -2
- package/animations/player.js +1 -2
- package/animations/player.js.map +1 -1
- package/components/accordion/accordion.js +4 -16
- package/components/accordion/accordion.js.map +1 -1
- package/components/avatar/avatar.d.ts +0 -1
- package/components/avatar/avatar.js +5 -9
- package/components/avatar/avatar.js.map +1 -1
- package/components/badge/badge.d.ts +1 -3
- package/components/badge/badge.js +4 -8
- package/components/badge/badge.js.map +1 -1
- package/components/banner/banner.d.ts +6 -5
- package/components/banner/banner.js +19 -17
- package/components/banner/banner.js.map +1 -1
- package/components/button/button-base.d.ts +1 -1
- package/components/button/button-base.js.map +1 -1
- package/components/button-group/button-group.d.ts +0 -1
- package/components/button-group/button-group.js +12 -17
- package/components/button-group/button-group.js.map +1 -1
- package/components/calendar/base.d.ts +3 -13
- package/components/calendar/base.js +10 -31
- package/components/calendar/base.js.map +1 -1
- package/components/calendar/calendar.d.ts +2 -2
- package/components/calendar/months-view/months-view.d.ts +1 -1
- package/components/calendar/months-view/months-view.js.map +1 -1
- package/components/carousel/carousel-indicator.d.ts +1 -1
- package/components/carousel/carousel-indicator.js +13 -13
- package/components/carousel/carousel-indicator.js.map +1 -1
- package/components/carousel/carousel-slide.d.ts +0 -2
- package/components/carousel/carousel-slide.js +7 -9
- package/components/carousel/carousel-slide.js.map +1 -1
- package/components/carousel/carousel.d.ts +52 -35
- package/components/carousel/carousel.js +136 -122
- package/components/carousel/carousel.js.map +1 -1
- package/components/carousel/themes/carousel.base.css.js +1 -1
- package/components/carousel/themes/carousel.base.css.js.map +1 -1
- package/components/chat/chat-input.d.ts +1 -1
- package/components/chat/chat-input.js +21 -21
- package/components/chat/chat-input.js.map +1 -1
- package/components/chat/chat.d.ts +0 -2
- package/components/chat/chat.js +6 -12
- package/components/chat/chat.js.map +1 -1
- package/components/checkbox/checkbox-base.d.ts +1 -1
- package/components/checkbox/checkbox.d.ts +3 -5
- package/components/checkbox/checkbox.js +33 -44
- package/components/checkbox/checkbox.js.map +1 -1
- package/components/checkbox/switch.d.ts +1 -1
- package/components/checkbox/switch.js +23 -34
- package/components/checkbox/switch.js.map +1 -1
- package/components/chip/chip.d.ts +1 -14
- package/components/chip/chip.js +12 -33
- package/components/chip/chip.js.map +1 -1
- package/components/combo/combo-item.d.ts +1 -3
- package/components/combo/combo-item.js +5 -12
- package/components/combo/combo-item.js.map +1 -1
- package/components/combo/combo.d.ts +7 -20
- package/components/combo/combo.js +59 -81
- package/components/combo/combo.js.map +1 -1
- package/components/date-picker/date-picker.base.d.ts +12 -9
- package/components/date-picker/date-picker.base.js +24 -31
- package/components/date-picker/date-picker.base.js.map +1 -1
- package/components/date-picker/date-picker.d.ts +1 -1
- package/components/date-picker/date-picker.js +3 -5
- package/components/date-picker/date-picker.js.map +1 -1
- package/components/date-range-picker/date-range-input.d.ts +2 -4
- package/components/date-range-picker/date-range-input.js +6 -37
- package/components/date-range-picker/date-range-input.js.map +1 -1
- package/components/date-range-picker/date-range-picker.d.ts +2 -5
- package/components/date-range-picker/date-range-picker.js +15 -28
- package/components/date-range-picker/date-range-picker.js.map +1 -1
- package/components/date-range-picker/predefined-ranges-area.d.ts +2 -2
- package/components/date-range-picker/predefined-ranges-area.js +4 -6
- package/components/date-range-picker/predefined-ranges-area.js.map +1 -1
- package/components/date-range-picker/validators.d.ts +1 -1
- package/components/date-range-picker/validators.js +5 -18
- package/components/date-range-picker/validators.js.map +1 -1
- package/components/date-time-input/date-part.d.ts +2 -1
- package/components/date-time-input/date-part.js +38 -75
- package/components/date-time-input/date-part.js.map +1 -1
- package/components/date-time-input/date-time-input.base.d.ts +31 -12
- package/components/date-time-input/date-time-input.base.js +43 -11
- package/components/date-time-input/date-time-input.base.js.map +1 -1
- package/components/date-time-input/date-time-input.d.ts +1 -3
- package/components/date-time-input/date-time-input.js +7 -40
- package/components/date-time-input/date-time-input.js.map +1 -1
- package/components/date-time-input/datetime-mask-parser.d.ts +8 -0
- package/components/date-time-input/datetime-mask-parser.js +8 -8
- package/components/date-time-input/datetime-mask-parser.js.map +1 -1
- package/components/date-time-input/validators.js +3 -14
- package/components/date-time-input/validators.js.map +1 -1
- package/components/dialog/dialog.d.ts +6 -7
- package/components/dialog/dialog.js +21 -26
- package/components/dialog/dialog.js.map +1 -1
- package/components/divider/divider.d.ts +1 -4
- package/components/divider/divider.js +8 -17
- package/components/divider/divider.js.map +1 -1
- package/components/dropdown/dropdown-group.js +1 -6
- package/components/dropdown/dropdown-group.js.map +1 -1
- package/components/expansion-panel/expansion-panel.d.ts +15 -5
- package/components/expansion-panel/expansion-panel.js +23 -34
- package/components/expansion-panel/expansion-panel.js.map +1 -1
- package/components/file-input/file-input.d.ts +2 -14
- package/components/file-input/file-input.js +5 -23
- package/components/file-input/file-input.js.map +1 -1
- package/components/highlight/highlight.d.ts +6 -8
- package/components/highlight/highlight.js +12 -20
- package/components/highlight/highlight.js.map +1 -1
- package/components/icon/icon.d.ts +1 -1
- package/components/icon/registry/types.d.ts +1 -1
- package/components/icon/registry/types.js.map +1 -1
- package/components/input/input.d.ts +9 -19
- package/components/input/input.js +30 -60
- package/components/input/input.js.map +1 -1
- package/components/mask-input/mask-input.d.ts +1 -1
- package/components/mask-input/mask-input.js +2 -4
- package/components/mask-input/mask-input.js.map +1 -1
- package/components/nav-drawer/nav-drawer.d.ts +7 -7
- package/components/nav-drawer/nav-drawer.js +12 -23
- package/components/nav-drawer/nav-drawer.js.map +1 -1
- package/components/progress/base.d.ts +4 -7
- package/components/progress/base.js +21 -45
- package/components/progress/base.js.map +1 -1
- package/components/qr-code/qr-code.d.ts +1 -1
- package/components/qr-code/qr-code.js +3 -2
- package/components/qr-code/qr-code.js.map +1 -1
- package/components/qr-code/types.d.ts +1 -1
- package/components/qr-code/types.js.map +1 -1
- package/components/radio/controller.d.ts +2 -30
- package/components/radio/controller.js +8 -94
- package/components/radio/controller.js.map +1 -1
- package/components/radio/radio.d.ts +5 -5
- package/components/radio/radio.js +48 -58
- package/components/radio/radio.js.map +1 -1
- package/components/radio-group/radio-group.d.ts +1 -2
- package/components/radio-group/radio-group.js +2 -9
- package/components/radio-group/radio-group.js.map +1 -1
- package/components/rating/rating.d.ts +24 -12
- package/components/rating/rating.js +79 -73
- package/components/rating/rating.js.map +1 -1
- package/components/resize-container/default-ghost.js +4 -3
- package/components/resize-container/default-ghost.js.map +1 -1
- package/components/resize-container/resize-container.d.ts +1 -1
- package/components/resize-container/resize-container.js +5 -3
- package/components/resize-container/resize-container.js.map +1 -1
- package/components/resize-container/resize-controller.js +4 -3
- package/components/resize-container/resize-controller.js.map +1 -1
- package/components/select/select-group.d.ts +2 -1
- package/components/select/select-group.js +7 -11
- package/components/select/select-group.js.map +1 -1
- package/components/select/select.d.ts +3 -4
- package/components/select/select.js +23 -28
- package/components/select/select.js.map +1 -1
- package/components/slider/range-slider.d.ts +3 -2
- package/components/slider/range-slider.js +22 -70
- package/components/slider/range-slider.js.map +1 -1
- package/components/slider/slider-base.d.ts +9 -6
- package/components/slider/slider-base.js +27 -28
- package/components/slider/slider-base.js.map +1 -1
- package/components/slider/slider.js +9 -5
- package/components/slider/slider.js.map +1 -1
- package/components/splitter/splitter.d.ts +1 -1
- package/components/splitter/splitter.js.map +1 -1
- package/components/stepper/step.d.ts +3 -0
- package/components/stepper/step.js +9 -5
- package/components/stepper/step.js.map +1 -1
- package/components/stepper/stepper.d.ts +0 -11
- package/components/stepper/stepper.js +21 -86
- package/components/stepper/stepper.js.map +1 -1
- package/components/tabs/tab.d.ts +1 -1
- package/components/tabs/tab.js +6 -5
- package/components/tabs/tab.js.map +1 -1
- package/components/tabs/tabs.d.ts +1 -5
- package/components/tabs/tabs.js +12 -34
- package/components/tabs/tabs.js.map +1 -1
- package/components/textarea/textarea.d.ts +6 -7
- package/components/textarea/textarea.js +3 -10
- package/components/textarea/textarea.js.map +1 -1
- package/components/theme-provider/theme-provider.d.ts +2 -4
- package/components/theme-provider/theme-provider.js +11 -21
- package/components/theme-provider/theme-provider.js.map +1 -1
- package/components/tile-manager/tile-manager.d.ts +10 -21
- package/components/tile-manager/tile-manager.js +43 -74
- package/components/tile-manager/tile-manager.js.map +1 -1
- package/components/tile-manager/tile.d.ts +10 -18
- package/components/tile-manager/tile.js +50 -67
- package/components/tile-manager/tile.js.map +1 -1
- package/components/tooltip/tooltip.d.ts +4 -7
- package/components/tooltip/tooltip.js +20 -28
- package/components/tooltip/tooltip.js.map +1 -1
- package/components/tree/tree.d.ts +1 -14
- package/components/tree/tree.js +5 -23
- package/components/tree/tree.js.map +1 -1
- package/components/tree/tree.navigation.d.ts +1 -1
- package/components/tree/tree.navigation.js.map +1 -1
- package/components/validation-container/validation-container.d.ts +1 -2
- package/components/validation-container/validation-container.js.map +1 -1
- package/components/virtualization/engine.d.ts +40 -38
- package/components/virtualization/engine.js.map +1 -1
- package/components/virtualization/types.d.ts +6 -5
- package/components/virtualization/types.js.map +1 -1
- package/components/virtualization/virtualization.d.ts +94 -80
- package/components/virtualization/virtualization.js +10 -2
- package/components/virtualization/virtualization.js.map +1 -1
- package/custom-elements.json +9940 -7738
- package/igniteui-webcomponents.css-data.json +1 -1
- package/igniteui-webcomponents.html-data.json +1 -1
- package/internals/controllers/aria-projection.d.ts +6 -6
- package/internals/controllers/aria-projection.js.map +1 -1
- package/internals/controllers/context-provider.d.ts +48 -0
- package/internals/controllers/context-provider.js +29 -0
- package/internals/controllers/context-provider.js.map +1 -0
- package/internals/controllers/drag.js +6 -6
- package/internals/controllers/drag.js.map +1 -1
- package/internals/controllers/gestures.js +3 -0
- package/internals/controllers/gestures.js.map +1 -1
- package/internals/controllers/group.d.ts +64 -0
- package/internals/controllers/group.js +104 -0
- package/internals/controllers/group.js.map +1 -0
- package/internals/controllers/internals.d.ts +16 -3
- package/internals/controllers/internals.js +10 -3
- package/internals/controllers/internals.js.map +1 -1
- package/internals/controllers/key-bindings.d.ts +6 -0
- package/internals/controllers/key-bindings.js +3 -0
- package/internals/controllers/key-bindings.js.map +1 -1
- package/internals/controllers/roving-focus.d.ts +72 -0
- package/internals/controllers/roving-focus.js +61 -0
- package/internals/controllers/roving-focus.js.map +1 -0
- package/internals/controllers/slot.d.ts +8 -0
- package/internals/controllers/slot.js +4 -0
- package/internals/controllers/slot.js.map +1 -1
- package/internals/controllers/toggle.d.ts +96 -0
- package/internals/controllers/toggle.js +65 -0
- package/internals/controllers/toggle.js.map +1 -0
- package/internals/date/converters.js +2 -5
- package/internals/date/converters.js.map +1 -1
- package/internals/date/model.d.ts +4 -0
- package/internals/date/model.js +6 -0
- package/internals/date/model.js.map +1 -1
- package/internals/decorators/coerced-property.d.ts +47 -0
- package/internals/decorators/coerced-property.js +36 -0
- package/internals/decorators/coerced-property.js.map +1 -0
- package/internals/i18n/i18n-controller.d.ts +22 -3
- package/internals/i18n/i18n-controller.js +28 -6
- package/internals/i18n/i18n-controller.js.map +1 -1
- package/internals/mixins/alert.d.ts +1 -1
- package/internals/mixins/alert.js +5 -3
- package/internals/mixins/alert.js.map +1 -1
- package/internals/mixins/combo-box.d.ts +3 -12
- package/internals/mixins/combo-box.js +6 -32
- package/internals/mixins/combo-box.js.map +1 -1
- package/internals/mixins/forms/associated.js +18 -0
- package/internals/mixins/forms/associated.js.map +1 -1
- package/internals/mixins/forms/types.d.ts +20 -1
- package/internals/mixins/forms/types.js.map +1 -1
- package/internals/mixins/i18n.d.ts +31 -0
- package/internals/mixins/i18n.js +36 -0
- package/internals/mixins/i18n.js.map +1 -0
- package/internals/mixins/mask-behavior.d.ts +6 -5
- package/internals/mixins/mask-behavior.js +1 -2
- package/internals/mixins/mask-behavior.js.map +1 -1
- package/internals/mixins/option.js +4 -2
- package/internals/mixins/option.js.map +1 -1
- package/internals/templates/masked-input.d.ts +1 -1
- package/internals/templates/masked-input.js.map +1 -1
- package/internals/templates/slotted-icon.d.ts +32 -0
- package/internals/templates/slotted-icon.js +19 -0
- package/internals/templates/slotted-icon.js.map +1 -0
- package/internals/templates/toggle-shell.d.ts +46 -0
- package/internals/templates/toggle-shell.js +38 -0
- package/internals/templates/toggle-shell.js.map +1 -0
- package/internals/timing.d.ts +32 -0
- package/internals/timing.js +20 -0
- package/internals/timing.js.map +1 -0
- package/internals/utils/arrays.d.ts +2 -2
- package/internals/utils/arrays.js.map +1 -1
- package/internals/utils/dom.d.ts +22 -0
- package/internals/utils/dom.js +15 -1
- package/internals/utils/dom.js.map +1 -1
- package/internals/utils/math.d.ts +1 -1
- package/internals/utils/math.js.map +1 -1
- package/internals/utils/types.d.ts +1 -1
- package/internals/utils/types.js.map +1 -1
- package/internals/validators.d.ts +23 -0
- package/internals/validators.js +21 -0
- package/internals/validators.js.map +1 -1
- package/package.json +1 -1
- package/theming/theming-controller.d.ts +3 -3
- package/theming/theming-controller.js.map +1 -1
- package/web-types.json +2 -2
- package/internals/decorators/watch.d.ts +0 -5
- package/internals/decorators/watch.js +0 -19
- package/internals/decorators/watch.js.map +0 -1
|
@@ -2,7 +2,7 @@ import { LitElement, type PropertyValues } from 'lit';
|
|
|
2
2
|
import type { AbsolutePosition, NotificationPositioning } from '../../components/types.js';
|
|
3
3
|
export declare abstract class IgcBaseAlertLikeComponent extends LitElement {
|
|
4
4
|
protected readonly _player: import("#animations/player.js").AnimationController;
|
|
5
|
-
|
|
5
|
+
private readonly _autoHideTimer;
|
|
6
6
|
/**
|
|
7
7
|
* Whether the component is in shown state.
|
|
8
8
|
*
|
|
@@ -10,11 +10,13 @@ import { addAnimationController } from '#animations/player.js';
|
|
|
10
10
|
import { fadeIn, fadeOut } from '#animations/presets/fade/index.js';
|
|
11
11
|
import { addCommandController } from '../controllers/command.js';
|
|
12
12
|
import { addInternalsController } from '../controllers/internals.js';
|
|
13
|
+
import { createTimer } from '../timing.js';
|
|
13
14
|
import { getVisibleAncestor, isPopoverOpen } from '../utils/dom.js';
|
|
14
15
|
export class IgcBaseAlertLikeComponent extends LitElement {
|
|
15
16
|
constructor() {
|
|
16
17
|
super();
|
|
17
18
|
this._player = addAnimationController(this);
|
|
19
|
+
this._autoHideTimer = createTimer(() => this.hide());
|
|
18
20
|
this.open = false;
|
|
19
21
|
this.displayTime = 4000;
|
|
20
22
|
this.keepOpen = false;
|
|
@@ -78,16 +80,16 @@ export class IgcBaseAlertLikeComponent extends LitElement {
|
|
|
78
80
|
this._setAutoHideTimer();
|
|
79
81
|
return state;
|
|
80
82
|
}
|
|
81
|
-
|
|
83
|
+
this._autoHideTimer.stop();
|
|
82
84
|
const state = await this._player.playExclusive(fadeOut());
|
|
83
85
|
this.hidePopover();
|
|
84
86
|
this.open = false;
|
|
85
87
|
return state;
|
|
86
88
|
}
|
|
87
89
|
_setAutoHideTimer() {
|
|
88
|
-
|
|
90
|
+
this._autoHideTimer.stop();
|
|
89
91
|
if (this.open && this.displayTime > 0 && !this.keepOpen) {
|
|
90
|
-
this.
|
|
92
|
+
this._autoHideTimer.start(this.displayTime);
|
|
91
93
|
}
|
|
92
94
|
}
|
|
93
95
|
async show() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/internals/mixins/alert.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAuB,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,mCAAmC,CAAC;AAKpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGpE,MAAM,OAAgB,yBAA0B,SAAQ,UAAU;IAyDhE;QACE,KAAK,EAAE,CAAC;QAzDS,YAAO,GAAG,sBAAsB,CAAC,IAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/internals/mixins/alert.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addAnimationController } from '#animations/player.js';\nimport { fadeIn, fadeOut } from '#animations/presets/fade/index.js';\nimport type {\n AbsolutePosition,\n NotificationPositioning,\n} from '../../components/types.js';\nimport { addCommandController } from '../controllers/command.js';\nimport { addInternalsController } from '../controllers/internals.js';\nimport { createTimer } from '../timing.js';\nimport { getVisibleAncestor, isPopoverOpen } from '../utils/dom.js';\n\n/* omitModule */\nexport abstract class IgcBaseAlertLikeComponent extends LitElement {\n protected readonly _player = addAnimationController(this);\n\n private readonly _autoHideTimer = createTimer(() => this.hide());\n\n /**\n * Whether the component is in shown state.\n *\n * @attr open\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * Determines the duration in milliseconds in which the component will be visible.\n *\n * @attr display-time\n * @default 4000\n */\n @property({ type: Number, attribute: 'display-time' })\n public displayTime = 4000;\n\n /**\n * Determines whether the component should close after the `displayTime` is over.\n *\n * @attr keep-open\n * @default false\n */\n @property({ type: Boolean, reflect: true, attribute: 'keep-open' })\n public keepOpen = false;\n\n /**\n * Sets the position of the component in the viewport.\n *\n * `bottom` - positions the component at the bottom. This is the default.\n * `middle` - positions the component at the center.\n * `top` - positions the component at the top.\n *\n * @attr position\n * @default 'bottom'\n */\n @property({ reflect: true })\n public position: AbsolutePosition = 'bottom';\n\n /**\n * Sets the positioning strategy of the component.\n *\n * `viewport` - positions the component relative to the viewport, ignoring any ancestor elements. This is the default behavior.\n * `container` - positions the component relative to the nearest visible ancestor. In this mode, the component will be constrained within the bounding box of the ancestor and will be positioned according to the `position` attribute.\n *\n * @attr positioning\n * @default 'viewport'\n */\n @property({ reflect: true })\n public positioning: NotificationPositioning = 'viewport';\n\n constructor() {\n super();\n\n addCommandController(this)\n .set('--show', this.show)\n .set('--hide', this.hide)\n .set('--toggle', this.toggle);\n\n addInternalsController(this, {\n initialARIA: {\n role: 'status',\n ariaLive: 'polite',\n },\n });\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.popover = 'manual';\n }\n\n protected override update(props: PropertyValues<this>): void {\n if (props.has('open')) {\n if (this.open && !isPopoverOpen(this)) {\n this._showPopover();\n } else if (!this.open && isPopoverOpen(this)) {\n this.hidePopover();\n }\n }\n\n if (this.open && (props.has('positioning') || props.has('position'))) {\n this.hidePopover();\n this._showPopover();\n }\n\n if (\n props.has('open') ||\n props.has('displayTime') ||\n props.has('keepOpen')\n ) {\n this._setAutoHideTimer();\n }\n\n super.update(props);\n }\n\n private _showPopover(): boolean {\n if (this.positioning !== 'container') {\n this.showPopover();\n return true;\n }\n\n const visibleAncestor = getVisibleAncestor(this);\n if (!visibleAncestor) {\n return false;\n }\n\n this.showPopover({ source: visibleAncestor });\n return true;\n }\n\n private async _setOpenState(open: boolean): Promise<boolean> {\n if (open) {\n this.open = true;\n\n if (!this._showPopover()) {\n this.open = false;\n return false;\n }\n\n const state = await this._player.playExclusive(fadeIn());\n this._setAutoHideTimer();\n return state;\n }\n\n this._autoHideTimer.stop();\n const state = await this._player.playExclusive(fadeOut());\n this.hidePopover();\n this.open = false;\n return state;\n }\n\n private _setAutoHideTimer(): void {\n this._autoHideTimer.stop();\n if (this.open && this.displayTime > 0 && !this.keepOpen) {\n this._autoHideTimer.start(this.displayTime);\n }\n }\n\n /**\n * Opens the component.\n *\n * Returns a promise that resolves to `true` if the component was successfully opened, or `false`\n * if it was already open or could not be shown (e.g., in `container` positioning mode with no visible ancestors).\n */\n public async show(): Promise<boolean> {\n return this.open ? false : this._setOpenState(true);\n }\n\n /**\n * Closes the component.\n *\n * Returns a promise that resolves to `true` if the component was successfully closed, or `false`\n * if it was already closed.\n */\n public async hide(): Promise<boolean> {\n return this.open ? this._setOpenState(false) : false;\n }\n\n /**\n * Toggles the open state of the component.\n *\n * Returns a promise that resolves to `true` if the operation completed successfully, or `false`\n * if it was already in the desired state.\n */\n public async toggle(): Promise<boolean> {\n return this.open ? this.hide() : this.show();\n }\n}\n"]}
|
|
@@ -1,25 +1,17 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
import type { RootClickController } from '../controllers/root-click.js';
|
|
3
|
+
import { type ToggleEventMap } from '../controllers/toggle.js';
|
|
3
4
|
import type { UnpackCustomEvent } from './event-emitter.js';
|
|
4
|
-
interface IgcBaseComboBoxEventMap {
|
|
5
|
-
igcOpening: CustomEvent<void>;
|
|
6
|
-
igcOpened: CustomEvent<void>;
|
|
7
|
-
igcClosing: CustomEvent<void>;
|
|
8
|
-
igcClosed: CustomEvent<void>;
|
|
9
|
-
}
|
|
10
5
|
export declare abstract class IgcBaseComboBoxComponent extends LitElement {
|
|
11
|
-
emitEvent: <K extends keyof
|
|
6
|
+
emitEvent: <K extends keyof ToggleEventMap, D extends UnpackCustomEvent<ToggleEventMap[K]>>(event: K, eventInitDict?: CustomEventInit<D>) => boolean;
|
|
12
7
|
protected abstract _rootClickController: RootClickController;
|
|
8
|
+
private readonly _toggleController;
|
|
13
9
|
/**
|
|
14
10
|
* Sets the open state of the component.
|
|
15
11
|
* @attr open
|
|
16
12
|
* @default false
|
|
17
13
|
*/
|
|
18
14
|
open: boolean;
|
|
19
|
-
protected _emitClosing(): boolean;
|
|
20
|
-
protected _emitClosed(): boolean;
|
|
21
|
-
protected _emitOpening(): boolean;
|
|
22
|
-
protected _emitOpened(): boolean;
|
|
23
15
|
protected _handleAnchorClick(): void;
|
|
24
16
|
protected _hide(emitEvent?: boolean): Promise<boolean>;
|
|
25
17
|
protected _show(emitEvent?: boolean): Promise<boolean>;
|
|
@@ -65,4 +57,3 @@ export declare function getPreviousActiveItem<T extends HTMLElement & {
|
|
|
65
57
|
export declare function setInitialSelectionState<T extends HTMLElement & {
|
|
66
58
|
selected: boolean;
|
|
67
59
|
}>(items: T[]): T | null;
|
|
68
|
-
export {};
|
|
@@ -6,49 +6,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
6
6
|
};
|
|
7
7
|
import { LitElement } from 'lit';
|
|
8
8
|
import { property } from 'lit/decorators.js';
|
|
9
|
+
import { addToggleController, } from '../controllers/toggle.js';
|
|
9
10
|
import { lastOf } from '../utils/arrays.js';
|
|
10
11
|
import { iterNodes } from '../utils/dom.js';
|
|
11
12
|
export class IgcBaseComboBoxComponent extends LitElement {
|
|
12
13
|
constructor() {
|
|
13
14
|
super(...arguments);
|
|
15
|
+
this._toggleController = addToggleController(this);
|
|
14
16
|
this.open = false;
|
|
15
17
|
}
|
|
16
|
-
_emitClosing() {
|
|
17
|
-
return this.emitEvent('igcClosing', { cancelable: true });
|
|
18
|
-
}
|
|
19
|
-
_emitClosed() {
|
|
20
|
-
return this.emitEvent('igcClosed');
|
|
21
|
-
}
|
|
22
|
-
_emitOpening() {
|
|
23
|
-
return this.emitEvent('igcOpening', { cancelable: true });
|
|
24
|
-
}
|
|
25
|
-
_emitOpened() {
|
|
26
|
-
return this.emitEvent('igcOpened');
|
|
27
|
-
}
|
|
28
18
|
_handleAnchorClick() {
|
|
29
19
|
this.open ? this._hide(true) : this._show(true);
|
|
30
20
|
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return false;
|
|
34
|
-
}
|
|
35
|
-
this.open = false;
|
|
36
|
-
if (emitEvent) {
|
|
37
|
-
await this.updateComplete;
|
|
38
|
-
this._emitClosed();
|
|
39
|
-
}
|
|
40
|
-
return true;
|
|
21
|
+
_hide(emitEvent = false) {
|
|
22
|
+
return this._toggleController.hide(emitEvent);
|
|
41
23
|
}
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
return false;
|
|
45
|
-
}
|
|
46
|
-
this.open = true;
|
|
47
|
-
if (emitEvent) {
|
|
48
|
-
await this.updateComplete;
|
|
49
|
-
this._emitOpened();
|
|
50
|
-
}
|
|
51
|
-
return true;
|
|
24
|
+
_show(emitEvent = false) {
|
|
25
|
+
return this._toggleController.show(emitEvent);
|
|
52
26
|
}
|
|
53
27
|
async show() {
|
|
54
28
|
return this._show();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../src/internals/mixins/combo-box.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../src/internals/mixins/combo-box.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport type { RootClickController } from '../controllers/root-click.js';\nimport {\n addToggleController,\n type ToggleEventMap,\n} from '../controllers/toggle.js';\nimport { lastOf } from '../utils/arrays.js';\nimport { iterNodes } from '../utils/dom.js';\nimport type { UnpackCustomEvent } from './event-emitter.js';\n\n/* blazorIndirectRender */\n/* omitModule */\nexport abstract class IgcBaseComboBoxComponent extends LitElement {\n /* blazorSuppress */\n declare public emitEvent: <\n K extends keyof ToggleEventMap,\n D extends UnpackCustomEvent<ToggleEventMap[K]>,\n >(\n event: K,\n eventInitDict?: CustomEventInit<D>\n ) => boolean;\n\n protected abstract _rootClickController: RootClickController;\n private readonly _toggleController = addToggleController(this);\n\n /**\n * Sets the open state of the component.\n * @attr open\n * @default false\n */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n protected _handleAnchorClick(): void {\n this.open ? this._hide(true) : this._show(true);\n }\n\n protected _hide(emitEvent = false): Promise<boolean> {\n return this._toggleController.hide(emitEvent);\n }\n\n protected _show(emitEvent = false): Promise<boolean> {\n return this._toggleController.show(emitEvent);\n }\n\n /** Shows the component. */\n public async show(): Promise<boolean> {\n return this._show();\n }\n\n /** Hides the component. */\n public async hide(): Promise<boolean> {\n return this._hide();\n }\n\n /** Toggles the open state of the component. */\n public async toggle(): Promise<boolean> {\n return this.open ? this.hide() : this.show();\n }\n}\n\n/* blazorIndirectRender */\n/* omitModule */\nexport abstract class IgcComboBoxBaseLikeComponent extends IgcBaseComboBoxComponent {\n /**\n * Whether the component dropdown should be kept open on selection.\n * @attr keep-open-on-select\n * @default false\n */\n @property({ type: Boolean, reflect: true, attribute: 'keep-open-on-select' })\n public keepOpenOnSelect = false;\n\n /**\n * Whether the component dropdown should be kept open on clicking outside of it.\n * @attr keep-open-on-outside-click\n * @default false\n */\n @property({\n type: Boolean,\n reflect: true,\n attribute: 'keep-open-on-outside-click',\n })\n public keepOpenOnOutsideClick = false;\n}\n\nexport function getItems<T extends HTMLElement>(\n root: Node,\n tagName: string\n): Generator<T> {\n return iterNodes<T>(root, {\n show: 'SHOW_ELEMENT',\n filter: (item) => item.matches(tagName),\n });\n}\n\nexport function getActiveItems<T extends HTMLElement & { disabled: boolean }>(\n root: Node,\n tagName: string\n): Generator<T> {\n return iterNodes<T>(root, {\n show: 'SHOW_ELEMENT',\n filter: (item) => item.matches(tagName) && !item.disabled,\n });\n}\n\n/**\n * Both navigation helpers accept a missing or detached `from`, in which case\n * the search runs from the edge of the collection. They return `undefined` only\n * when there is nothing to navigate to at all.\n */\nfunction indexOfItem<T extends HTMLElement>(\n items: T[],\n from: T | null | undefined,\n fallback: number\n): number {\n const index = from ? items.indexOf(from) : -1;\n return index < 0 ? fallback : index;\n}\n\n/**\n * Returns the first non-disabled item after `from`, or `from` itself when it is\n * already the last one.\n */\nexport function getNextActiveItem<\n T extends HTMLElement & { disabled: boolean },\n>(items: T[], from?: T | null): T | undefined {\n const current = indexOfItem(items, from, -1);\n\n for (let i = current + 1; i < items.length; i++) {\n if (!items[i].disabled) {\n return items[i];\n }\n }\n\n return items[current];\n}\n\n/**\n * Returns the first non-disabled item before `from`, or `from` itself when it\n * is already the first one.\n */\nexport function getPreviousActiveItem<\n T extends HTMLElement & { disabled: boolean },\n>(items: T[], from?: T | null): T | undefined {\n const current = indexOfItem(items, from, items.length);\n\n for (let i = current - 1; i >= 0; i--) {\n if (!items[i].disabled) {\n return items[i];\n }\n }\n\n return items[current];\n}\n\nexport function setInitialSelectionState<\n T extends HTMLElement & { selected: boolean },\n>(items: T[]): T | null {\n const lastSelected = lastOf(items.filter((item) => item.selected));\n\n for (const item of items) {\n item.selected = item === lastSelected;\n }\n\n return lastSelected ?? null;\n}\n"]}
|
|
@@ -6,6 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
6
6
|
};
|
|
7
7
|
import { isServer } from 'lit';
|
|
8
8
|
import { property } from 'lit/decorators.js';
|
|
9
|
+
import IgcValidationContainerComponent from '../../../components/validation-container/validation-container.js';
|
|
9
10
|
import { addInternalsController } from '../../controllers/internals.js';
|
|
10
11
|
import { enterKey } from '../../controllers/key-bindings.js';
|
|
11
12
|
import { addSafeEventListener } from '../../utils/events.js';
|
|
@@ -158,6 +159,10 @@ function BaseFormAssociated(base) {
|
|
|
158
159
|
_setTouchedState() {
|
|
159
160
|
this._touched = true;
|
|
160
161
|
}
|
|
162
|
+
_emitTouchedEvent(eventName, init) {
|
|
163
|
+
this._setTouchedState();
|
|
164
|
+
return this.emitEvent(eventName, init);
|
|
165
|
+
}
|
|
161
166
|
_setDefaultValue(current) {
|
|
162
167
|
this._formValue.defaultValue = current;
|
|
163
168
|
}
|
|
@@ -171,6 +176,9 @@ function BaseFormAssociated(base) {
|
|
|
171
176
|
this._internals.setFormValue(value, state);
|
|
172
177
|
this._validate();
|
|
173
178
|
}
|
|
179
|
+
_renderValidationContainer(config) {
|
|
180
|
+
return IgcValidationContainerComponent.create(this, config);
|
|
181
|
+
}
|
|
174
182
|
formAssociatedCallback(_form) { }
|
|
175
183
|
formDisabledCallback(state) {
|
|
176
184
|
this._disabled = state;
|
|
@@ -236,6 +244,16 @@ export function FormAssociatedMixin(base) {
|
|
|
236
244
|
super._restoreDefaultValue();
|
|
237
245
|
}
|
|
238
246
|
}
|
|
247
|
+
_commitValue(value, eventName) {
|
|
248
|
+
this._setTouchedState();
|
|
249
|
+
if ('value' in this) {
|
|
250
|
+
this.value = value;
|
|
251
|
+
return this.emitEvent(eventName, {
|
|
252
|
+
detail: this.value,
|
|
253
|
+
});
|
|
254
|
+
}
|
|
255
|
+
return false;
|
|
256
|
+
}
|
|
239
257
|
attributeChangedCallback(name, prev, current) {
|
|
240
258
|
super.attributeChangedCallback(name, prev, current);
|
|
241
259
|
if (name === 'value') {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"associated.js","sourceRoot":"","sources":["../../../../src/internals/mixins/forms/associated.ts"],"names":[],"mappings":"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","sourcesContent":["import { isServer, type LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '../../controllers/internals.js';\nimport { enterKey } from '../../controllers/key-bindings.js';\nimport { addSafeEventListener } from '../../utils/events.js';\nimport { isFunction, isString } from '../../utils/types.js';\nimport type { Validator } from '../../validators.js';\nimport type { Constructor } from '../constructor.js';\nimport type { FormValue } from './form-value.js';\nimport {\n type FormAssociatedCheckboxElementInterface,\n type FormAssociatedElementInterface,\n type FormRestoreMode,\n type FormValueType,\n InternalInvalidEvent,\n InternalResetEvent,\n} from './types.js';\n\nconst INVALID_STATE = 'ig-invalid';\n\nconst eventOptions = {\n bubbles: false,\n composed: false,\n};\n\nfunction emitFormInvalidEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalInvalidEvent, eventOptions));\n}\n\nfunction emitFormResetEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalResetEvent, eventOptions));\n}\n\nfunction BaseFormAssociated<T extends Constructor<LitElement>>(base: T) {\n class BaseFormAssociatedElement extends base {\n public static readonly formAssociated = true;\n\n //#region Internal state and properties\n\n protected readonly _internals = addInternalsController(this);\n protected readonly _formValue!: FormValue<unknown>;\n\n /**\n * Suppresses invalid styling for a programmatic validation cycle\n * (`checkValidity`/`_validate`). Scoped to the synchronous validity check:\n * set immediately before it and cleared immediately after, so it never\n * leaks into a later submission or user-interaction cycle.\n */\n private _isInternalValidation = false;\n private _touched = false;\n private _isExternalInvalid = false;\n\n private get _shouldApplyStyles(): boolean {\n if (this._isExternalInvalid) {\n return true;\n }\n\n // A disabled control is barred from constraint validation, so it never\n // carries invalid styling regardless of what its validators say.\n return (\n !this._disabled &&\n this._invalid &&\n this._touched &&\n !this._isInternalValidation\n );\n }\n\n protected _disabled = false;\n protected _invalid = false;\n protected _pristine = true;\n\n protected get __validators(): Validator[] {\n return [];\n }\n\n //#endregion\n\n //#region Public properties and attributes\n\n /**\n * The name of the control, submitted with the form data.\n * @attr\n */\n @property({ reflect: true })\n public name!: string;\n\n /**\n * The disabled state of the component.\n * @attr\n * @default false\n */\n @property({ type: Boolean })\n public set disabled(value: boolean) {\n this._disabled = value;\n this.toggleAttribute('disabled', Boolean(this._disabled));\n if (this.hasUpdated) {\n this._setInvalidStyles();\n }\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /**\n * Sets the control into invalid state (visual state only).\n *\n * @remarks\n * The property is not reflected back to the attribute. Reading it returns\n * the effective visual state, so a touched control failing validation\n * reads `true` even after assigning `false`.\n * @attr\n * @default false\n */\n @property({ type: Boolean })\n public set invalid(value: boolean) {\n this._isExternalInvalid = value;\n this._setInvalidStyles();\n }\n\n public get invalid(): boolean {\n return this._shouldApplyStyles;\n }\n\n /** Returns the HTMLFormElement associated with this element. */\n public get form(): HTMLFormElement | null {\n return this._internals.form;\n }\n\n /**\n * Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n */\n public get validity(): ValidityState {\n return this._internals.validity;\n }\n\n /** A string containing the validation message of this element. */\n public get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n /**\n * A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n */\n public get willValidate(): boolean {\n return this._internals.willValidate;\n }\n //#endregion\n\n //#region Life-cycle hooks\n\n constructor(...args: any[]) {\n super(...args);\n addSafeEventListener(this, 'invalid', this._handleInvalid);\n }\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n\n if (!this.hasUpdated) {\n this._pristine = true;\n this._touched = false;\n }\n\n this._validate();\n }\n\n //#endregion\n\n //#region Enter key submission handling\n\n protected _handleEnterKeydown(event: KeyboardEvent): void {\n if (event.key !== enterKey || event.repeat) {\n return;\n }\n\n this.form?.requestSubmit();\n }\n\n //#endregion\n\n //#region Form value and validation states\n\n private _handleInvalid(event: Event): void {\n event.preventDefault();\n this._invalid = true;\n\n if (this._isInternalValidation) {\n this._isInternalValidation = false;\n } else {\n // A failed submission counts as user interaction, and a lasting one: the\n // control was asked for a value it could not provide. Keeping it touched\n // is what makes `invalid` - and with it the validation messages the host\n // projects - survive any later re-render, rather than holding only for\n // the update the submission itself scheduled.\n this._setTouchedState();\n emitFormInvalidEvent(this);\n }\n\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n private _setInvalidStyles(): void {\n this._internals.setState(INVALID_STATE, this._shouldApplyStyles);\n }\n\n /**\n * Closes a programmatic validation cycle. If the control was invalid, the\n * synchronous `invalid` event already cleared the flag; if it was valid no\n * event fired, so clear it here to stop it leaking into a later submission\n * or user-interaction cycle.\n */\n private _resolveInternalValidation(): void {\n this._isInternalValidation = false;\n }\n\n private __runValidators(): {\n validity: ValidityStateFlags;\n message: string;\n } {\n let validity: ValidityStateFlags = {};\n let message = '';\n\n for (const validator of this.__validators) {\n const isValid = validator.isValid(this);\n\n validity[validator.key] = !isValid;\n\n if (!isValid) {\n message = isFunction(validator.message)\n ? validator.message(this)\n : validator.message;\n\n if (validator.key === 'valueMissing') {\n validity = { valueMissing: true };\n break;\n }\n }\n }\n\n return { validity, message };\n }\n\n /**\n * Executes the component validators and updates the internal validity state.\n */\n protected _validate(userMessage?: string): void {\n if (isServer) return;\n const { validity, message: validatorMessage } = this.__runValidators();\n const hasCustomError = this.validity.customError;\n let message = validatorMessage;\n\n if (hasCustomError && userMessage === undefined) {\n // Internal validation cycle after the user has called setCustomValidity()\n // with some message. Keep the customError flag and the passed in message.\n validity.customError = true;\n message = this.validationMessage;\n } else if (hasCustomError && userMessage === '') {\n // setCustomValidity with an empty message.\n validity.customError = false;\n } else if (userMessage && userMessage !== '') {\n // setCustomValidity with a message.\n validity.customError = true;\n message = userMessage;\n }\n\n this._internals.setValidity(validity, message);\n this._isInternalValidation = true;\n this._invalid = !this._internals.checkValidity();\n this._resolveInternalValidation();\n this._setInvalidStyles();\n }\n\n protected _handleBlur(): void {\n this._setTouchedState();\n this._validate();\n }\n\n protected _setTouchedState(): void {\n this._touched = true;\n }\n\n protected _setDefaultValue(current: string | null): void {\n this._formValue.defaultValue = current;\n }\n\n protected _restoreDefaultValue(): void {\n const value = this._formValue.value;\n this._formValue.setValueAndFormState(this._formValue.defaultValue);\n this.requestUpdate('value', value);\n }\n\n protected _setFormValue(value: FormValueType, state?: FormValueType): void {\n this._pristine = false;\n this._internals.setFormValue(value, state);\n this._validate();\n }\n\n //#endregion\n\n //#region Form associated callback hooks\n\n protected formAssociatedCallback(_form: HTMLFormElement): void {}\n\n protected formDisabledCallback(state: boolean): void {\n this._disabled = state;\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n protected formResetCallback(): void {\n this._restoreDefaultValue();\n this._pristine = true;\n this._touched = false;\n this._invalid = false;\n this._isExternalInvalid = false;\n this._setInvalidStyles();\n emitFormResetEvent(this);\n }\n\n /* c8 ignore next 4 */\n protected formStateRestoreCallback(\n _state: FormValueType,\n _mode: FormRestoreMode\n ): void {}\n\n //#endregion\n\n //#region Public API\n\n /** Checks for validity of the control and shows the browser message if it's invalid. */\n public reportValidity(): boolean {\n const state = this._internals.reportValidity();\n this._invalid = !state;\n return state;\n }\n\n /** Checks for validity of the control and emits the invalid event if it's invalid. */\n public checkValidity(): boolean {\n this._isInternalValidation = true;\n const state = this._internals.checkValidity();\n this._invalid = !state;\n this._resolveInternalValidation();\n return state;\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public setCustomValidity(message: string): void {\n this._validate(message);\n this.requestUpdate();\n }\n\n //#endregion\n }\n return BaseFormAssociatedElement as Constructor<BaseFormAssociatedElement> &\n T;\n}\n\n/**\n * Mixes the passed in class and turns it into a form associated custom element.\n */\nexport function FormAssociatedMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedElement extends BaseFormAssociated(base) {\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultValue(value: unknown) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'value' in this) {\n this.value = this.defaultValue;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultValue(): unknown {\n return this._formValue.defaultValue;\n }\n\n /**\n * Restores the default value through the public `value` setter so any\n * clamping/normalization the component applies (slider bounds, rating max)\n * also applies on form reset, and the correct reactive property is\n * recorded for the update cycle.\n */\n protected override _restoreDefaultValue(): void {\n if ('value' in this) {\n this.value = this.defaultValue;\n } else {\n super._restoreDefaultValue();\n }\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string | null,\n current: string | null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'value') {\n this._setDefaultValue(current);\n }\n }\n }\n\n return FormAssociatedElement as unknown as Constructor<FormAssociatedElementInterface> &\n T;\n}\n\n/**\n * Mixes the passed in class and turns it into a form associated custom element.\n */\nexport function FormAssociatedCheckboxMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedCheckboxElement extends BaseFormAssociated(base) {\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultChecked(value: boolean) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'checked' in this) {\n this.checked = this.defaultChecked;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultChecked(): boolean {\n return this._formValue.defaultValue as boolean;\n }\n\n /**\n * Restores the default checked state through the public `checked` setter\n * so the correct reactive property is recorded for the update cycle.\n */\n protected override _restoreDefaultValue(): void {\n if ('checked' in this) {\n this.checked = this.defaultChecked;\n } else {\n super._restoreDefaultValue();\n }\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string | null,\n current: string | null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'checked') {\n this._setDefaultValue(isString(current) ? 'true' : null);\n }\n }\n }\n\n return FormAssociatedCheckboxElement as unknown as Constructor<FormAssociatedCheckboxElementInterface> &\n T;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"associated.js","sourceRoot":"","sources":["../../../../src/internals/mixins/forms/associated.ts"],"names":[],"mappings":"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","sourcesContent":["import { isServer, type LitElement, type TemplateResult } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport IgcValidationContainerComponent, {\n type ValidationContainerConfig,\n} from '../../../components/validation-container/validation-container.js';\nimport { addInternalsController } from '../../controllers/internals.js';\nimport { enterKey } from '../../controllers/key-bindings.js';\nimport { addSafeEventListener } from '../../utils/events.js';\nimport { isFunction, isString } from '../../utils/types.js';\nimport type { Validator } from '../../validators.js';\nimport type { Constructor } from '../constructor.js';\nimport type { FormValue } from './form-value.js';\nimport {\n type FormAssociatedCheckboxElementInterface,\n type FormAssociatedElementInterface,\n type FormRestoreMode,\n type FormValueType,\n type IgcFormControl,\n InternalInvalidEvent,\n InternalResetEvent,\n} from './types.js';\n\nconst INVALID_STATE = 'ig-invalid';\n\n/**\n * Every form-associated component composes the event-emitter mixin somewhere in\n * its heritage, but this mixin cannot see it in its type chain - emits go through\n * a structural contract instead.\n */\ntype EventEmitterLike = {\n emitEvent(name: string, init?: CustomEventInit): boolean;\n};\n\nconst eventOptions = {\n bubbles: false,\n composed: false,\n};\n\nfunction emitFormInvalidEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalInvalidEvent, eventOptions));\n}\n\nfunction emitFormResetEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalResetEvent, eventOptions));\n}\n\nfunction BaseFormAssociated<T extends Constructor<LitElement>>(base: T) {\n class BaseFormAssociatedElement extends base {\n public static readonly formAssociated = true;\n\n //#region Internal state and properties\n\n protected readonly _internals = addInternalsController(this);\n protected readonly _formValue!: FormValue<unknown>;\n\n /**\n * Suppresses invalid styling for a programmatic validation cycle\n * (`checkValidity`/`_validate`). Scoped to the synchronous validity check:\n * set immediately before it and cleared immediately after, so it never\n * leaks into a later submission or user-interaction cycle.\n */\n private _isInternalValidation = false;\n private _touched = false;\n private _isExternalInvalid = false;\n\n private get _shouldApplyStyles(): boolean {\n if (this._isExternalInvalid) {\n return true;\n }\n\n // A disabled control is barred from constraint validation, so it never\n // carries invalid styling regardless of what its validators say.\n return (\n !this._disabled &&\n this._invalid &&\n this._touched &&\n !this._isInternalValidation\n );\n }\n\n protected _disabled = false;\n protected _invalid = false;\n protected _pristine = true;\n\n protected get __validators(): Validator[] {\n return [];\n }\n\n //#endregion\n\n //#region Public properties and attributes\n\n /**\n * The name of the control, submitted with the form data.\n * @attr\n */\n @property({ reflect: true })\n public name!: string;\n\n /**\n * The disabled state of the component.\n * @attr\n * @default false\n */\n @property({ type: Boolean })\n public set disabled(value: boolean) {\n this._disabled = value;\n this.toggleAttribute('disabled', Boolean(this._disabled));\n if (this.hasUpdated) {\n this._setInvalidStyles();\n }\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /**\n * Sets the control into invalid state (visual state only).\n *\n * @remarks\n * The property is not reflected back to the attribute. Reading it returns\n * the effective visual state, so a touched control failing validation\n * reads `true` even after assigning `false`.\n * @attr\n * @default false\n */\n @property({ type: Boolean })\n public set invalid(value: boolean) {\n this._isExternalInvalid = value;\n this._setInvalidStyles();\n }\n\n public get invalid(): boolean {\n return this._shouldApplyStyles;\n }\n\n /** Returns the HTMLFormElement associated with this element. */\n public get form(): HTMLFormElement | null {\n return this._internals.form;\n }\n\n /**\n * Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n */\n public get validity(): ValidityState {\n return this._internals.validity;\n }\n\n /** A string containing the validation message of this element. */\n public get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n /**\n * A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n */\n public get willValidate(): boolean {\n return this._internals.willValidate;\n }\n //#endregion\n\n //#region Life-cycle hooks\n\n constructor(...args: any[]) {\n super(...args);\n addSafeEventListener(this, 'invalid', this._handleInvalid);\n }\n\n /** @internal */\n public override connectedCallback(): void {\n super.connectedCallback();\n\n if (!this.hasUpdated) {\n this._pristine = true;\n this._touched = false;\n }\n\n this._validate();\n }\n\n //#endregion\n\n //#region Enter key submission handling\n\n protected _handleEnterKeydown(event: KeyboardEvent): void {\n if (event.key !== enterKey || event.repeat) {\n return;\n }\n\n this.form?.requestSubmit();\n }\n\n //#endregion\n\n //#region Form value and validation states\n\n private _handleInvalid(event: Event): void {\n event.preventDefault();\n this._invalid = true;\n\n if (this._isInternalValidation) {\n this._isInternalValidation = false;\n } else {\n // A failed submission counts as user interaction, and a lasting one: the\n // control was asked for a value it could not provide. Keeping it touched\n // is what makes `invalid` - and with it the validation messages the host\n // projects - survive any later re-render, rather than holding only for\n // the update the submission itself scheduled.\n this._setTouchedState();\n emitFormInvalidEvent(this);\n }\n\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n private _setInvalidStyles(): void {\n this._internals.setState(INVALID_STATE, this._shouldApplyStyles);\n }\n\n /**\n * Closes a programmatic validation cycle. If the control was invalid, the\n * synchronous `invalid` event already cleared the flag; if it was valid no\n * event fired, so clear it here to stop it leaking into a later submission\n * or user-interaction cycle.\n */\n private _resolveInternalValidation(): void {\n this._isInternalValidation = false;\n }\n\n private __runValidators(): {\n validity: ValidityStateFlags;\n message: string;\n } {\n let validity: ValidityStateFlags = {};\n let message = '';\n\n for (const validator of this.__validators) {\n const isValid = validator.isValid(this);\n\n validity[validator.key] = !isValid;\n\n if (!isValid) {\n message = isFunction(validator.message)\n ? validator.message(this)\n : validator.message;\n\n if (validator.key === 'valueMissing') {\n validity = { valueMissing: true };\n break;\n }\n }\n }\n\n return { validity, message };\n }\n\n /**\n * Executes the component validators and updates the internal validity state.\n */\n protected _validate(userMessage?: string): void {\n if (isServer) return;\n const { validity, message: validatorMessage } = this.__runValidators();\n const hasCustomError = this.validity.customError;\n let message = validatorMessage;\n\n if (hasCustomError && userMessage === undefined) {\n // Internal validation cycle after the user has called setCustomValidity()\n // with some message. Keep the customError flag and the passed in message.\n validity.customError = true;\n message = this.validationMessage;\n } else if (hasCustomError && userMessage === '') {\n // setCustomValidity with an empty message.\n validity.customError = false;\n } else if (userMessage && userMessage !== '') {\n // setCustomValidity with a message.\n validity.customError = true;\n message = userMessage;\n }\n\n this._internals.setValidity(validity, message);\n this._isInternalValidation = true;\n this._invalid = !this._internals.checkValidity();\n this._resolveInternalValidation();\n this._setInvalidStyles();\n }\n\n protected _handleBlur(): void {\n this._setTouchedState();\n this._validate();\n }\n\n protected _setTouchedState(): void {\n this._touched = true;\n }\n\n protected _emitTouchedEvent(\n eventName: string,\n init?: CustomEventInit\n ): boolean {\n this._setTouchedState();\n return (this as unknown as EventEmitterLike).emitEvent(eventName, init);\n }\n\n protected _setDefaultValue(current: string | null): void {\n this._formValue.defaultValue = current;\n }\n\n protected _restoreDefaultValue(): void {\n const value = this._formValue.value;\n this._formValue.setValueAndFormState(this._formValue.defaultValue);\n this.requestUpdate('value', value);\n }\n\n protected _setFormValue(value: FormValueType, state?: FormValueType): void {\n this._pristine = false;\n this._internals.setFormValue(value, state);\n this._validate();\n }\n\n protected _renderValidationContainer(\n config?: ValidationContainerConfig\n ): TemplateResult {\n return IgcValidationContainerComponent.create(\n this as unknown as IgcFormControl,\n config\n );\n }\n\n //#endregion\n\n //#region Form associated callback hooks\n\n protected formAssociatedCallback(_form: HTMLFormElement): void {}\n\n protected formDisabledCallback(state: boolean): void {\n this._disabled = state;\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n protected formResetCallback(): void {\n this._restoreDefaultValue();\n this._pristine = true;\n this._touched = false;\n this._invalid = false;\n this._isExternalInvalid = false;\n this._setInvalidStyles();\n emitFormResetEvent(this);\n }\n\n /* c8 ignore next 4 */\n protected formStateRestoreCallback(\n _state: FormValueType,\n _mode: FormRestoreMode\n ): void {}\n\n //#endregion\n\n //#region Public API\n\n /** Checks for validity of the control and shows the browser message if it's invalid. */\n public reportValidity(): boolean {\n const state = this._internals.reportValidity();\n this._invalid = !state;\n return state;\n }\n\n /** Checks for validity of the control and emits the invalid event if it's invalid. */\n public checkValidity(): boolean {\n this._isInternalValidation = true;\n const state = this._internals.checkValidity();\n this._invalid = !state;\n this._resolveInternalValidation();\n return state;\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public setCustomValidity(message: string): void {\n this._validate(message);\n this.requestUpdate();\n }\n\n //#endregion\n }\n return BaseFormAssociatedElement as Constructor<BaseFormAssociatedElement> &\n T;\n}\n\n/**\n * Mixes the passed in class and turns it into a form associated custom element.\n */\nexport function FormAssociatedMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedElement extends BaseFormAssociated(base) {\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultValue(value: unknown) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'value' in this) {\n this.value = this.defaultValue;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultValue(): unknown {\n return this._formValue.defaultValue;\n }\n\n /**\n * Restores the default value through the public `value` setter so any\n * clamping/normalization the component applies (slider bounds, rating max)\n * also applies on form reset, and the correct reactive property is\n * recorded for the update cycle.\n */\n protected override _restoreDefaultValue(): void {\n if ('value' in this) {\n this.value = this.defaultValue;\n } else {\n super._restoreDefaultValue();\n }\n }\n\n /** Touched flips first, so the setter's validation cycle sees it. */\n protected _commitValue(value: unknown, eventName: string): boolean {\n this._setTouchedState();\n\n if ('value' in this) {\n this.value = value;\n return (this as unknown as EventEmitterLike).emitEvent(eventName, {\n detail: this.value,\n });\n }\n\n return false;\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string | null,\n current: string | null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'value') {\n this._setDefaultValue(current);\n }\n }\n }\n\n return FormAssociatedElement as unknown as Constructor<FormAssociatedElementInterface> &\n T;\n}\n\n/**\n * Mixes the passed in class and turns it into a form associated custom element.\n */\nexport function FormAssociatedCheckboxMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedCheckboxElement extends BaseFormAssociated(base) {\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultChecked(value: boolean) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'checked' in this) {\n this.checked = this.defaultChecked;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultChecked(): boolean {\n return this._formValue.defaultValue as boolean;\n }\n\n /**\n * Restores the default checked state through the public `checked` setter\n * so the correct reactive property is recorded for the update cycle.\n */\n protected override _restoreDefaultValue(): void {\n if ('checked' in this) {\n this.checked = this.defaultChecked;\n } else {\n super._restoreDefaultValue();\n }\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string | null,\n current: string | null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'checked') {\n this._setDefaultValue(isString(current) ? 'true' : null);\n }\n }\n }\n\n return FormAssociatedCheckboxElement as unknown as Constructor<FormAssociatedCheckboxElementInterface> &\n T;\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import type { LitElement } from 'lit';
|
|
1
|
+
import type { LitElement, TemplateResult } from 'lit';
|
|
2
|
+
import type { ValidationContainerConfig } from '../../../components/validation-container/validation-container.js';
|
|
2
3
|
import type { ElementInternalsController } from '../../controllers/internals.js';
|
|
3
4
|
import type { Validator } from '../../validators.js';
|
|
4
5
|
export type FormRestoreMode = 'autocomplete' | 'restore';
|
|
@@ -62,6 +63,18 @@ export declare class BaseFormAssociatedElement {
|
|
|
62
63
|
* regards to its value.
|
|
63
64
|
*/
|
|
64
65
|
protected _setTouchedState(): void;
|
|
66
|
+
/**
|
|
67
|
+
* Sets the **touched** state of the component and emits `eventName` - the pair every
|
|
68
|
+
* user-interaction handler must apply when it responds to input.
|
|
69
|
+
*
|
|
70
|
+
* The host must compose the event-emitter mixin somewhere in its heritage.
|
|
71
|
+
*/
|
|
72
|
+
protected _emitTouchedEvent(eventName: string, init?: CustomEventInit): boolean;
|
|
73
|
+
/**
|
|
74
|
+
* Renders a validation container bound to the component, projecting its helper-text
|
|
75
|
+
* and validation message slots.
|
|
76
|
+
*/
|
|
77
|
+
protected _renderValidationContainer(config?: ValidationContainerConfig): TemplateResult;
|
|
65
78
|
/**
|
|
66
79
|
* Sets the default value of the component.
|
|
67
80
|
* Called in `attributeChangedCallback` (i.e. when the `value` attribute of the control is set).
|
|
@@ -122,6 +135,12 @@ export declare class FormAssociatedElementInterface extends BaseFormAssociatedEl
|
|
|
122
135
|
/** The initial value of the component. */
|
|
123
136
|
set defaultValue(value: unknown);
|
|
124
137
|
get defaultValue(): unknown;
|
|
138
|
+
/**
|
|
139
|
+
* Commits a user-initiated value change: sets the **touched** state **before** assigning
|
|
140
|
+
* to the public `value` setter, so the validation cycle the setter runs applies invalid
|
|
141
|
+
* styling in the same pass, then emits `eventName` with the coerced value as `detail`.
|
|
142
|
+
*/
|
|
143
|
+
protected _commitValue(value: unknown, eventName: string): boolean;
|
|
125
144
|
}
|
|
126
145
|
export declare class FormAssociatedCheckboxElementInterface extends BaseFormAssociatedElement {
|
|
127
146
|
/** The initial checked state of the component. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/internals/mixins/forms/types.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/internals/mixins/forms/types.ts"],"names":[],"mappings":"AAkNA,MAAM,CAAC,MAAM,oBAAoB,GAAG,2BAA2B,CAAC;AAChE,MAAM,CAAC,MAAM,kBAAkB,GAAG,yBAAyB,CAAC","sourcesContent":["import type { LitElement, TemplateResult } from 'lit';\nimport type { ValidationContainerConfig } from '../../../components/validation-container/validation-container.js';\nimport type { ElementInternalsController } from '../../controllers/internals.js';\nimport type { Validator } from '../../validators.js';\n\nexport type FormRestoreMode = 'autocomplete' | 'restore';\nexport type FormValueType = string | File | FormData | null;\nexport type IgcFormControl = LitElement &\n (FormAssociatedElementInterface | FormAssociatedCheckboxElementInterface);\n\nexport declare class BaseFormAssociatedElement {\n public static readonly formAssociated: boolean;\n\n //#region Properties\n\n protected readonly _internals: ElementInternalsController;\n protected readonly _formValue: unknown;\n\n protected _pristine: boolean;\n protected _disabled: boolean;\n protected _invalid: boolean;\n\n protected get __validators(): Validator[];\n\n /**\n * The disabled state of the component.\n * @attr\n * @default false\n */\n public disabled: boolean;\n\n /**\n * Sets the control into invalid state (visual state only).\n * @attr\n * @default false\n */\n public invalid: boolean;\n\n /**\n * The name of the control, submitted with the form data.\n * @attr\n */\n public name: string;\n\n /** Returns the HTMLFormElement associated with this element. */\n public get form(): HTMLFormElement | null;\n\n /**\n * Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n */\n public get validity(): ValidityState;\n\n /** A string containing the validation message of this element. */\n public get validationMessage(): string;\n\n /**\n * A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n */\n public get willValidate(): boolean;\n\n //#endregion\n\n //#region Methods\n\n /**\n * Default implementation for handling the `Enter` key press on the component.\n * Checks if the component is inside a form and if so, submits it.\n */\n protected _handleEnterKeydown(event: KeyboardEvent): void;\n\n /**\n * Sets the **touched** state of the component and invokes {@link BaseFormAssociatedElement._validate | `_validate()`} method.\n *\n * As the naming of the method suggests, this should be invoked either on **blur** or **focusout**, depending\n * on the DOM structure and how focus state is managed by the component.\n */\n protected _handleBlur(): void;\n\n /**\n * Sets the **touched** state of the component and **DOES NOT** invoke {@link BaseFormAssociatedElement._validate | `_validate()`} method.\n *\n * This should be called whenever a user interaction triggers a response, usually an event, from the component in\n * regards to its value.\n */\n protected _setTouchedState(): void;\n\n /**\n * Sets the **touched** state of the component and emits `eventName` - the pair every\n * user-interaction handler must apply when it responds to input.\n *\n * The host must compose the event-emitter mixin somewhere in its heritage.\n */\n protected _emitTouchedEvent(\n eventName: string,\n init?: CustomEventInit\n ): boolean;\n\n /**\n * Renders a validation container bound to the component, projecting its helper-text\n * and validation message slots.\n */\n protected _renderValidationContainer(\n config?: ValidationContainerConfig\n ): TemplateResult;\n\n /**\n * Sets the default value of the component.\n * Called in `attributeChangedCallback` (i.e. when the `value` attribute of the control is set).\n */\n protected _setDefaultValue(current: string | null): void;\n\n /**\n * Called when the associated parent form is reset.\n */\n protected _restoreDefaultValue(): void;\n\n /**\n * Executes the component validators and updates the internal validity state.\n */\n protected _validate(message?: string): void;\n\n /**\n * Sets the component's submission value and state.\n */\n protected _setFormValue(value: FormValueType, state?: FormValueType): void;\n\n /**\n * Called by the browser when it associates/disassociates the component with/from a given form element.\n * Receives the form element as a parameter.\n *\n * @remarks\n * This is not implemented currently.\n */\n protected formAssociatedCallback(form: HTMLFormElement): void;\n\n /**\n * Called whenever the component or a parent `fieldset` elements are disabled.\n * Receives the current disabled state.\n */\n protected formDisabledCallback(state: boolean): void;\n\n /**\n * Called when the form is reset.\n * Resets the component value/checked state to the default one, internal state and validation.\n *\n * @remarks\n * The default implementation calls {@link BaseFormAssociatedElement._restoreDefaultValue | `_restoreDefaultValue`}.\n * If additional customization is needed, it is better to override that method instead of this callback.\n */\n protected formResetCallback(): void;\n\n /**\n * Called when the browser attempts to automatically fill out the component.\n *\n * @remarks\n * This is not implemented currently.\n */\n protected formStateRestoreCallback(\n state: FormValueType,\n mode: FormRestoreMode\n ): void;\n\n /** Checks for validity of the control and emits the invalid event if it's invalid. */\n public checkValidity(): boolean;\n\n /** Checks for validity of the control and shows the browser message if it's invalid. */\n public reportValidity(): boolean;\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public setCustomValidity(message: string): void;\n\n //#endregion\n}\n\nexport declare class FormAssociatedElementInterface extends BaseFormAssociatedElement {\n /** The initial value of the component. */\n public set defaultValue(value: unknown);\n public get defaultValue(): unknown;\n\n /**\n * Commits a user-initiated value change: sets the **touched** state **before** assigning\n * to the public `value` setter, so the validation cycle the setter runs applies invalid\n * styling in the same pass, then emits `eventName` with the coerced value as `detail`.\n */\n protected _commitValue(value: unknown, eventName: string): boolean;\n}\n\nexport declare class FormAssociatedCheckboxElementInterface extends BaseFormAssociatedElement {\n /** The initial checked state of the component. */\n public set defaultChecked(value: boolean);\n public get defaultChecked(): boolean;\n}\n\nexport declare class FormRequiredInterface {\n protected _required: boolean;\n\n /**\n * When set, makes the component a required field for validation.\n * @attr\n * @default false\n */\n public set required(value: boolean);\n public get required(): boolean;\n}\n\nexport const InternalInvalidEvent = 'igc-form-internal-invalid';\nexport const InternalResetEvent = 'igc-form-internal-reset';\n"]}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import type { LitElement } from 'lit';
|
|
2
|
+
import { type I18nController, type I18nControllerConfig } from '../i18n/i18n-controller.js';
|
|
3
|
+
import type { AbstractConstructor } from './constructor.js';
|
|
4
|
+
export declare class I18nInterface<T extends object, TGet extends T = Required<T>> {
|
|
5
|
+
protected readonly _i18nController: I18nController<T>;
|
|
6
|
+
set locale(value: string);
|
|
7
|
+
get locale(): string;
|
|
8
|
+
set resourceStrings(value: T);
|
|
9
|
+
get resourceStrings(): TGet;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Mixes in the localization surface of a component - the `locale` and
|
|
13
|
+
* `resourceStrings` reactive properties forwarding to an i18n controller
|
|
14
|
+
* created with the passed configuration.
|
|
15
|
+
*
|
|
16
|
+
* The controller is exposed as the protected `_i18nController` for hosts
|
|
17
|
+
* that need direct access.
|
|
18
|
+
*
|
|
19
|
+
* `TGet` is the type of the resolved strings. It defaults to `Required<T>`,
|
|
20
|
+
* because the controller merges the full `defaultEN` set under any overrides,
|
|
21
|
+
* so every key resolves even though the resource interfaces declare them
|
|
22
|
+
* optional. Components that still accept a deprecated component-specific
|
|
23
|
+
* resource shape override it: `T` is the union of the two shapes accepted,
|
|
24
|
+
* `TGet` their intersection.
|
|
25
|
+
*
|
|
26
|
+
* The base class must be the first argument - the manifest analyzer resolves
|
|
27
|
+
* the superclass of an `extends Mixin(...)` clause from the first argument,
|
|
28
|
+
* and a leading config object would sever the inheritance chain in the
|
|
29
|
+
* manifest (dropping every inherited public member from the docs).
|
|
30
|
+
*/
|
|
31
|
+
export declare function I18nMixin<T extends object, B extends AbstractConstructor<LitElement>, TGet extends T = Required<T>>(superClass: B, config: I18nControllerConfig<T>): AbstractConstructor<I18nInterface<T, TGet>> & B;
|
|
@@ -0,0 +1,36 @@
|
|
|
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 { property } from 'lit/decorators.js';
|
|
8
|
+
import { addI18nController, } from '../i18n/i18n-controller.js';
|
|
9
|
+
export function I18nMixin(superClass, config) {
|
|
10
|
+
class I18nElement extends superClass {
|
|
11
|
+
constructor() {
|
|
12
|
+
super(...arguments);
|
|
13
|
+
this._i18nController = addI18nController(this, config);
|
|
14
|
+
}
|
|
15
|
+
set locale(value) {
|
|
16
|
+
this._i18nController.locale = value;
|
|
17
|
+
}
|
|
18
|
+
get locale() {
|
|
19
|
+
return this._i18nController.locale;
|
|
20
|
+
}
|
|
21
|
+
set resourceStrings(value) {
|
|
22
|
+
this._i18nController.resourceStrings = value;
|
|
23
|
+
}
|
|
24
|
+
get resourceStrings() {
|
|
25
|
+
return this._i18nController.resourceStrings;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
__decorate([
|
|
29
|
+
property()
|
|
30
|
+
], I18nElement.prototype, "locale", null);
|
|
31
|
+
__decorate([
|
|
32
|
+
property({ attribute: false })
|
|
33
|
+
], I18nElement.prototype, "resourceStrings", null);
|
|
34
|
+
return I18nElement;
|
|
35
|
+
}
|
|
36
|
+
//# sourceMappingURL=i18n.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"i18n.js","sourceRoot":"","sources":["../../../src/internals/mixins/i18n.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EACL,iBAAiB,GAGlB,MAAM,4BAA4B,CAAC;AAkCpC,MAAM,UAAU,SAAS,CAIvB,UAAa,EAAE,MAA+B;IAC9C,MAAe,WAAY,SAAQ,UAAU;QAA7C;;YACqB,oBAAe,GAAG,iBAAiB,CAAI,IAAI,EAAE,MAAM,CAAC,CAAC;QA2B1E,CAAC;QAnBC,IAAW,MAAM,CAAC,KAAa;YAC7B,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,KAAK,CAAC;QACtC,CAAC;QAED,IAAW,MAAM;YACf,OAAO,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC;QACrC,CAAC;QAMD,IAAW,eAAe,CAAC,KAAQ;YACjC,IAAI,CAAC,eAAe,CAAC,eAAe,GAAG,KAAK,CAAC;QAC/C,CAAC;QAED,IAAW,eAAe;YACxB,OAAO,IAAI,CAAC,eAAe,CAAC,eAAuB,CAAC;QACtD,CAAC;KACF;IAnBC;QADC,QAAQ,EAAE;6CAGV;IAUD;QADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;sDAG9B;IAMH,OAAO,WACJ,CAAC;AACN,CAAC","sourcesContent":["import type { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport {\n addI18nController,\n type I18nController,\n type I18nControllerConfig,\n} from '../i18n/i18n-controller.js';\nimport type { AbstractConstructor } from './constructor.js';\n\nexport declare class I18nInterface<\n T extends object,\n TGet extends T = Required<T>,\n> {\n protected readonly _i18nController: I18nController<T>;\n public set locale(value: string);\n public get locale(): string;\n public set resourceStrings(value: T);\n public get resourceStrings(): TGet;\n}\n\n/**\n * Mixes in the localization surface of a component - the `locale` and\n * `resourceStrings` reactive properties forwarding to an i18n controller\n * created with the passed configuration.\n *\n * The controller is exposed as the protected `_i18nController` for hosts\n * that need direct access.\n *\n * `TGet` is the type of the resolved strings. It defaults to `Required<T>`,\n * because the controller merges the full `defaultEN` set under any overrides,\n * so every key resolves even though the resource interfaces declare them\n * optional. Components that still accept a deprecated component-specific\n * resource shape override it: `T` is the union of the two shapes accepted,\n * `TGet` their intersection.\n *\n * The base class must be the first argument - the manifest analyzer resolves\n * the superclass of an `extends Mixin(...)` clause from the first argument,\n * and a leading config object would sever the inheritance chain in the\n * manifest (dropping every inherited public member from the docs).\n */\nexport function I18nMixin<\n T extends object,\n B extends AbstractConstructor<LitElement>,\n TGet extends T = Required<T>,\n>(superClass: B, config: I18nControllerConfig<T>) {\n abstract class I18nElement extends superClass {\n protected readonly _i18nController = addI18nController<T>(this, config);\n\n /**\n * The locale used to resolve the component's resource strings.\n * Falls back to the global locale when not set.\n * @attr locale\n */\n @property()\n public set locale(value: string) {\n this._i18nController.locale = value;\n }\n\n public get locale(): string {\n return this._i18nController.locale;\n }\n\n /**\n * The resource strings for localization.\n */\n @property({ attribute: false })\n public set resourceStrings(value: T) {\n this._i18nController.resourceStrings = value;\n }\n\n public get resourceStrings(): TGet {\n return this._i18nController.resourceStrings as TGet;\n }\n }\n return I18nElement as unknown as AbstractConstructor<I18nInterface<T, TGet>> &\n B;\n}\n"]}
|
|
@@ -68,11 +68,12 @@ export declare class MaskBehaviorElementInterface {
|
|
|
68
68
|
* composition handling, range text replacement) to a LitElement-derived class.
|
|
69
69
|
*
|
|
70
70
|
* The host class is expected to provide:
|
|
71
|
-
* - `_input`
|
|
72
|
-
* - `_parser`
|
|
73
|
-
* - `_setTouchedState`
|
|
74
|
-
* - `
|
|
75
|
-
* - `
|
|
71
|
+
* - `_input` - the native `<input>` element (typically via `@query('input')`).
|
|
72
|
+
* - `_parser` - a {@link MaskParser} (or subclass) instance.
|
|
73
|
+
* - `_setTouchedState` - from `FormAssociatedMixin`.
|
|
74
|
+
* - `_emitTouchedEvent` - from `FormAssociatedMixin`.
|
|
75
|
+
* - `emitEvent` - from `EventEmitterMixin`.
|
|
76
|
+
* - `select` - from the host base.
|
|
76
77
|
*
|
|
77
78
|
* The host class must implement `_syncValueFromMask` to bridge the masked
|
|
78
79
|
* text back into its public `value`. It is called by the default
|
|
@@ -133,8 +133,7 @@ export function MaskBehaviorMixin(superClass) {
|
|
|
133
133
|
this._syncValueFromMask();
|
|
134
134
|
}
|
|
135
135
|
_emitInputEvent() {
|
|
136
|
-
this.
|
|
137
|
-
this.emitEvent('igcInput', { detail: this._maskedValue });
|
|
136
|
+
this._emitTouchedEvent('igcInput', { detail: this._maskedValue });
|
|
138
137
|
}
|
|
139
138
|
_setMaskSelection(event) {
|
|
140
139
|
this._maskSelection = this._inputSelection;
|