@momentum-design/components 0.120.24 → 0.120.25
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/dist/browser/index.js +3 -3
- package/dist/browser/index.js.map +3 -3
- package/dist/components/combobox/combobox.component.js +2 -2
- package/dist/components/list/list.component.js +1 -1
- package/dist/custom-elements.json +846 -1114
- package/dist/react/index.d.ts +3 -3
- package/dist/react/index.js +3 -3
- package/dist/utils/controllers/ElementStore.d.ts +1 -1
- package/dist/utils/controllers/ElementStore.js +1 -1
- package/dist/utils/mixins/lifecycle/CaptureDestroyEventForChildElement.js +6 -5
- package/package.json +1 -1
- package/dist/utils/mixins/ItemCollectionMixin.d.ts +0 -68
- package/dist/utils/mixins/ItemCollectionMixin.js +0 -89
package/dist/react/index.d.ts
CHANGED
@@ -68,14 +68,14 @@ export { default as Skeleton } from './skeleton';
|
|
68
68
|
export { default as Slider } from './slider';
|
69
69
|
export { default as Spinner } from './spinner';
|
70
70
|
export { default as StaticCheckbox } from './staticcheckbox';
|
71
|
-
export { default as StaticRadio } from './staticradio';
|
72
71
|
export { default as StaticChip } from './staticchip';
|
72
|
+
export { default as StaticRadio } from './staticradio';
|
73
73
|
export { default as StaticToggle } from './statictoggle';
|
74
74
|
export { default as Stepper } from './stepper';
|
75
|
-
export { default as StepperConnector } from './stepperconnector';
|
76
|
-
export { default as StepperItem } from './stepperitem';
|
77
75
|
export { default as Tab } from './tab';
|
78
76
|
export { default as TabList } from './tablist';
|
77
|
+
export { default as StepperItem } from './stepperitem';
|
78
|
+
export { default as StepperConnector } from './stepperconnector';
|
79
79
|
export { default as Text } from './text';
|
80
80
|
export { default as Textarea } from './textarea';
|
81
81
|
export { default as ThemeProvider } from './themeprovider';
|
package/dist/react/index.js
CHANGED
@@ -68,14 +68,14 @@ export { default as Skeleton } from './skeleton';
|
|
68
68
|
export { default as Slider } from './slider';
|
69
69
|
export { default as Spinner } from './spinner';
|
70
70
|
export { default as StaticCheckbox } from './staticcheckbox';
|
71
|
-
export { default as StaticRadio } from './staticradio';
|
72
71
|
export { default as StaticChip } from './staticchip';
|
72
|
+
export { default as StaticRadio } from './staticradio';
|
73
73
|
export { default as StaticToggle } from './statictoggle';
|
74
74
|
export { default as Stepper } from './stepper';
|
75
|
-
export { default as StepperConnector } from './stepperconnector';
|
76
|
-
export { default as StepperItem } from './stepperitem';
|
77
75
|
export { default as Tab } from './tab';
|
78
76
|
export { default as TabList } from './tablist';
|
77
|
+
export { default as StepperItem } from './stepperitem';
|
78
|
+
export { default as StepperConnector } from './stepperconnector';
|
79
79
|
export { default as Text } from './text';
|
80
80
|
export { default as Textarea } from './textarea';
|
81
81
|
export { default as ThemeProvider } from './themeprovider';
|
@@ -116,7 +116,7 @@ export declare class ElementStore<TItem extends HTMLElement> implements Reactive
|
|
116
116
|
*
|
117
117
|
* @param event - The event triggered when an item is destroyed.
|
118
118
|
*/
|
119
|
-
protected itemDestroyHandler: (event:
|
119
|
+
protected itemDestroyHandler: (event: CustomEvent) => void;
|
120
120
|
/**
|
121
121
|
* Adds an item to the cache.
|
122
122
|
* If the item is valid and not already in the cache, it will be added at the end of the cache.
|
@@ -92,7 +92,7 @@ export class ElementStore {
|
|
92
92
|
* @param event - The event triggered when an item is destroyed.
|
93
93
|
*/
|
94
94
|
this.itemDestroyHandler = (event) => {
|
95
|
-
this.delete(event.
|
95
|
+
this.delete(event.detail.originalTarget);
|
96
96
|
};
|
97
97
|
this.host = host;
|
98
98
|
host.addController(this);
|
@@ -49,12 +49,13 @@ export const CaptureDestroyEventForChildElement = (superClass) => {
|
|
49
49
|
if (event.target && event.type === LIFE_CYCLE_EVENTS.DESTROYED) {
|
50
50
|
event.target.removeEventListener(LIFE_CYCLE_EVENTS.DESTROYED, this.handleItemRemovedEvent);
|
51
51
|
// Re-dispatch the destroy event to allow parent components to handle it.
|
52
|
-
// We need to create a new event instance, otherwise we will get an error:
|
52
|
+
// We need to create a new custom event instance, otherwise we will get an error:
|
53
53
|
// Uncaught InvalidStateError: Failed to execute 'dispatchEvent' on 'EventTarget': The event is already being dispatched.
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
54
|
+
this.dispatchEvent(new CustomEvent(event.type, {
|
55
|
+
bubbles: event.bubbles,
|
56
|
+
composed: event.composed,
|
57
|
+
detail: { originalTarget: event.target },
|
58
|
+
}));
|
58
59
|
}
|
59
60
|
};
|
60
61
|
this.addEventListener(LIFE_CYCLE_EVENTS.CREATED, this.handleItemCreation);
|
package/package.json
CHANGED
@@ -1,68 +0,0 @@
|
|
1
|
-
import type { LitElement } from 'lit';
|
2
|
-
import type { Constructor } from './index.types';
|
3
|
-
export declare class ItemCollectionMixinInterface<TItem> {
|
4
|
-
/**
|
5
|
-
* List of items (cached)
|
6
|
-
*/
|
7
|
-
get items(): TItem[];
|
8
|
-
/**
|
9
|
-
* Checks if the item is valid.
|
10
|
-
* Invalid items will not be collected or processed.
|
11
|
-
* This method can be overridden by subclasses to define custom validation logic.
|
12
|
-
*
|
13
|
-
* @param item - The item to validate.
|
14
|
-
* @returns - True if the item is valid, false otherwise.
|
15
|
-
*/
|
16
|
-
protected isValidItem(item: Element): boolean;
|
17
|
-
/**
|
18
|
-
* Adds an item to the cache at the specified index.
|
19
|
-
* When the index
|
20
|
-
* is `undefined`, the item is added automatically keeping the DOM order.
|
21
|
-
* is `-1`, the item is added to the end of the cache.
|
22
|
-
* is `>= 0`, the item is added at that index.
|
23
|
-
* otherwise, do nothing.
|
24
|
-
*
|
25
|
-
* @param item - The item to add to the cache.
|
26
|
-
* @param index - The index at which to add the item. If -1, adds to the end.
|
27
|
-
*/
|
28
|
-
protected addItemToCacheAt(item: Element, index?: number): void;
|
29
|
-
/**
|
30
|
-
* Removes an item from the cache.
|
31
|
-
*
|
32
|
-
* @param item - The item to remove from the cache.
|
33
|
-
*/
|
34
|
-
protected removeItemFromCache(item: Element): void;
|
35
|
-
/**
|
36
|
-
* Sets the item cache to the provided items.
|
37
|
-
* If no items are provided, it clears the cache.
|
38
|
-
*
|
39
|
-
* @param items - The items to set in the cache.
|
40
|
-
*/
|
41
|
-
protected setItemCache(items?: TItem[]): void;
|
42
|
-
}
|
43
|
-
/**
|
44
|
-
* This mixin collects and cache items based on the `created` and `destroyed` lifecycle events.
|
45
|
-
* Also provides methods to manage the item cache.
|
46
|
-
*
|
47
|
-
* @example
|
48
|
-
* ```ts
|
49
|
-
* // Add and remove item based on the disabled state
|
50
|
-
* class ListBox extends ItemCollectionMixin<Option, typeof Component>(Component) {
|
51
|
-
* constructor() {
|
52
|
-
* super();
|
53
|
-
* this.addEventListener('modified', this.handleModifiedEvent);
|
54
|
-
* }
|
55
|
-
*
|
56
|
-
* handleModifiedEvent(event: LifeCycleModifiedEvent) {
|
57
|
-
* if (event.details.change === 'enabled') {
|
58
|
-
* this.addItemToCacheAt(event.target);
|
59
|
-
* } else if (event.details.change === 'disabled') {
|
60
|
-
* this.removeItemFromCache(event.target)
|
61
|
-
* }
|
62
|
-
* }
|
63
|
-
* }
|
64
|
-
* ```
|
65
|
-
*
|
66
|
-
* @param superClass - The class to extend with the mixin.
|
67
|
-
*/
|
68
|
-
export declare const ItemCollectionMixin: <TItem extends HTMLElement, T extends Constructor<LitElement>>(superClass: T) => Constructor<ItemCollectionMixinInterface<TItem>> & T;
|
@@ -1,89 +0,0 @@
|
|
1
|
-
import { isBefore } from '../dom';
|
2
|
-
import { LIFE_CYCLE_EVENTS } from './lifecycle/lifecycle.contants';
|
3
|
-
/**
|
4
|
-
* This mixin collects and cache items based on the `created` and `destroyed` lifecycle events.
|
5
|
-
* Also provides methods to manage the item cache.
|
6
|
-
*
|
7
|
-
* @example
|
8
|
-
* ```ts
|
9
|
-
* // Add and remove item based on the disabled state
|
10
|
-
* class ListBox extends ItemCollectionMixin<Option, typeof Component>(Component) {
|
11
|
-
* constructor() {
|
12
|
-
* super();
|
13
|
-
* this.addEventListener('modified', this.handleModifiedEvent);
|
14
|
-
* }
|
15
|
-
*
|
16
|
-
* handleModifiedEvent(event: LifeCycleModifiedEvent) {
|
17
|
-
* if (event.details.change === 'enabled') {
|
18
|
-
* this.addItemToCacheAt(event.target);
|
19
|
-
* } else if (event.details.change === 'disabled') {
|
20
|
-
* this.removeItemFromCache(event.target)
|
21
|
-
* }
|
22
|
-
* }
|
23
|
-
* }
|
24
|
-
* ```
|
25
|
-
*
|
26
|
-
* @param superClass - The class to extend with the mixin.
|
27
|
-
*/
|
28
|
-
export const ItemCollectionMixin = (superClass) => {
|
29
|
-
class InnerMixinClass extends superClass {
|
30
|
-
/** @see ItemCollectionMixinInterface.items */
|
31
|
-
get items() {
|
32
|
-
return this.itemCache;
|
33
|
-
}
|
34
|
-
constructor(...rest) {
|
35
|
-
super(...rest);
|
36
|
-
this.itemCache = [];
|
37
|
-
this.addEventListener(LIFE_CYCLE_EVENTS.CREATED, this.itemCreationHandler);
|
38
|
-
this.addEventListener(LIFE_CYCLE_EVENTS.DESTROYED, this.itemDestroyHandler);
|
39
|
-
}
|
40
|
-
/**
|
41
|
-
* Handles the item creation event.
|
42
|
-
*
|
43
|
-
* @param event - The event triggered when an item is created.
|
44
|
-
*/
|
45
|
-
itemCreationHandler(event) {
|
46
|
-
const newItem = event.target;
|
47
|
-
this.addItemToCacheAt(newItem);
|
48
|
-
}
|
49
|
-
/**
|
50
|
-
* Handles the item destroy event.
|
51
|
-
*
|
52
|
-
* @param event - The event triggered when an item is destroyed.
|
53
|
-
*/
|
54
|
-
itemDestroyHandler(event) {
|
55
|
-
const removedItem = event.target;
|
56
|
-
this.removeItemFromCache(removedItem);
|
57
|
-
}
|
58
|
-
/** @see ItemCollectionMixinInterface.isValidItem */
|
59
|
-
isValidItem(item) {
|
60
|
-
return !!item;
|
61
|
-
}
|
62
|
-
/** @see ItemCollectionMixinInterface.addItemToCacheAt */
|
63
|
-
addItemToCacheAt(newItem, index) {
|
64
|
-
if (this.isValidItem(newItem) && !this.itemCache.includes(newItem)) {
|
65
|
-
const idx = index === undefined ? this.itemCache.findIndex(e => isBefore(newItem, e)) : index;
|
66
|
-
if (idx === -1) {
|
67
|
-
this.itemCache.push(newItem);
|
68
|
-
}
|
69
|
-
else if (idx >= 0) {
|
70
|
-
this.itemCache.splice(idx, 0, newItem);
|
71
|
-
}
|
72
|
-
}
|
73
|
-
}
|
74
|
-
/** @see ItemCollectionMixinInterface.removeItemFromCache */
|
75
|
-
removeItemFromCache(item) {
|
76
|
-
const idx = this.itemCache.indexOf(item);
|
77
|
-
if (idx !== -1) {
|
78
|
-
this.itemCache.splice(idx, 1);
|
79
|
-
}
|
80
|
-
}
|
81
|
-
/** @see ItemCollectionMixinInterface.setItemCache */
|
82
|
-
setItemCache(items) {
|
83
|
-
this.itemCache.length = 0;
|
84
|
-
this.itemCache.push(...(items || []));
|
85
|
-
}
|
86
|
-
}
|
87
|
-
// Cast return type to your mixin's interface intersected with the superClass type
|
88
|
-
return InnerMixinClass;
|
89
|
-
};
|