@momentum-design/components 0.15.5 → 0.15.6
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 +72 -54
- package/dist/browser/index.js.map +4 -4
- package/dist/components/avatar/avatar.component.d.ts +2 -65
- package/dist/components/avatar/avatar.component.js +5 -50
- package/dist/components/avatar/avatar.constants.d.ts +11 -2
- package/dist/components/avatar/avatar.constants.js +11 -3
- package/dist/components/avatar/avatar.styles.js +14 -14
- package/dist/components/avatar/avatar.types.d.ts +1 -2
- package/dist/components/avatar/avatar.utils.d.ts +3 -1
- package/dist/components/avatar/avatar.utils.js +29 -16
- package/dist/components/avatarbutton/avatarbutton.component.d.ts +25 -0
- package/dist/components/avatarbutton/avatarbutton.component.js +70 -0
- package/dist/components/avatarbutton/avatarbutton.constants.d.ts +2 -0
- package/dist/components/avatarbutton/avatarbutton.constants.js +3 -0
- package/dist/components/avatarbutton/avatarbutton.styles.d.ts +2 -0
- package/dist/components/avatarbutton/avatarbutton.styles.js +11 -0
- package/dist/components/avatarbutton/index.d.ts +8 -0
- package/dist/components/avatarbutton/index.js +5 -0
- package/dist/custom-elements.json +1074 -199
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/react/avatarbutton/index.d.ts +13 -0
- package/dist/react/avatarbutton/index.js +22 -0
- package/dist/react/index.d.ts +2 -1
- package/dist/react/index.js +2 -1
- package/dist/utils/mixins/AvatarComponentMixin.d.ts +15 -0
- package/dist/utils/mixins/AvatarComponentMixin.js +66 -0
- package/dist/utils/mixins/DisabledMixin.d.ts +1 -2
- package/dist/utils/mixins/TabIndexMixin.d.ts +1 -2
- package/dist/utils/mixins/index.types.d.ts +1 -0
- package/dist/utils/mixins/index.types.js +1 -0
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
@@ -10,6 +10,7 @@ import Bullet from './components/bullet';
|
|
10
10
|
import Marker from './components/marker';
|
11
11
|
import Divider from './components/divider';
|
12
12
|
import Buttonsimple from './components/buttonsimple';
|
13
|
+
import Avatarbutton from './components/avatarbutton';
|
13
14
|
import type { TextType } from './components/text/text.types';
|
14
|
-
export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, Buttonsimple, };
|
15
|
+
export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, Buttonsimple, Avatarbutton, };
|
15
16
|
export type { TextType, };
|
package/dist/index.js
CHANGED
@@ -10,4 +10,5 @@ import Bullet from './components/bullet';
|
|
10
10
|
import Marker from './components/marker';
|
11
11
|
import Divider from './components/divider';
|
12
12
|
import Buttonsimple from './components/buttonsimple';
|
13
|
-
|
13
|
+
import Avatarbutton from './components/avatarbutton';
|
14
|
+
export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, Buttonsimple, Avatarbutton, };
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import Component from '../../components/avatarbutton';
|
2
|
+
/**
|
3
|
+
* The `mdc-avatarbutton` component is an interactable version of the `mdc-avatar` component.
|
4
|
+
*
|
5
|
+
* This component is made by extending `buttonsimple` class.
|
6
|
+
* The button component acts as a wrapper for the avatar component.
|
7
|
+
*
|
8
|
+
* @dependency mdc-avatar
|
9
|
+
*
|
10
|
+
* @tagname mdc-avatarbutton
|
11
|
+
*/
|
12
|
+
declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
|
13
|
+
export default reactWrapper;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { createComponent } from '@lit/react';
|
3
|
+
import Component from '../../components/avatarbutton';
|
4
|
+
import { TAG_NAME } from '../../components/avatarbutton/avatarbutton.constants';
|
5
|
+
/**
|
6
|
+
* The `mdc-avatarbutton` component is an interactable version of the `mdc-avatar` component.
|
7
|
+
*
|
8
|
+
* This component is made by extending `buttonsimple` class.
|
9
|
+
* The button component acts as a wrapper for the avatar component.
|
10
|
+
*
|
11
|
+
* @dependency mdc-avatar
|
12
|
+
*
|
13
|
+
* @tagname mdc-avatarbutton
|
14
|
+
*/
|
15
|
+
const reactWrapper = createComponent({
|
16
|
+
tagName: TAG_NAME,
|
17
|
+
elementClass: Component,
|
18
|
+
react: React,
|
19
|
+
events: {},
|
20
|
+
displayName: 'AvatarButton',
|
21
|
+
});
|
22
|
+
export default reactWrapper;
|
package/dist/react/index.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
|
-
export { default as Badge } from './badge';
|
2
1
|
export { default as Avatar } from './avatar';
|
2
|
+
export { default as AvatarButton } from './avatarbutton';
|
3
|
+
export { default as Badge } from './badge';
|
3
4
|
export { default as Bullet } from './bullet';
|
4
5
|
export { default as Button } from './button';
|
5
6
|
export { default as Buttonsimple } from './buttonsimple';
|
package/dist/react/index.js
CHANGED
@@ -1,5 +1,6 @@
|
|
1
|
-
export { default as Badge } from './badge';
|
2
1
|
export { default as Avatar } from './avatar';
|
2
|
+
export { default as AvatarButton } from './avatarbutton';
|
3
|
+
export { default as Badge } from './badge';
|
3
4
|
export { default as Bullet } from './bullet';
|
4
5
|
export { default as Button } from './button';
|
5
6
|
export { default as Buttonsimple } from './buttonsimple';
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import type { AvatarSize } from '../../components/avatar/avatar.types';
|
2
|
+
import type { IconNames } from '../../components/icon/icon.types';
|
3
|
+
import type { PresenceType } from '../../components/presence/presence.types';
|
4
|
+
import type { Component } from '../../models';
|
5
|
+
import type { Constructor } from './index.types';
|
6
|
+
export interface AvatarComponentMixinInterface {
|
7
|
+
src?: string;
|
8
|
+
initials?: string;
|
9
|
+
presence?: PresenceType;
|
10
|
+
size: AvatarSize;
|
11
|
+
iconName?: IconNames;
|
12
|
+
counter?: number;
|
13
|
+
isTyping: boolean;
|
14
|
+
}
|
15
|
+
export declare const AvatarComponentMixin: <T extends Constructor<Component>>(superClass: T) => Constructor<AvatarComponentMixinInterface> & T;
|
@@ -0,0 +1,66 @@
|
|
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
|
+
var __metadata = (this && this.__metadata) || function (k, v) {
|
8
|
+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
9
|
+
};
|
10
|
+
import { property } from 'lit/decorators.js';
|
11
|
+
import { DEFAULTS as AVATAR_DEFAULTS } from '../../components/avatar/avatar.constants';
|
12
|
+
export const AvatarComponentMixin = (superClass) => {
|
13
|
+
class InnerMixinClass extends superClass {
|
14
|
+
constructor() {
|
15
|
+
super(...arguments);
|
16
|
+
/**
|
17
|
+
* Acceptable values include (size in px unit):
|
18
|
+
* - 24
|
19
|
+
* - 32
|
20
|
+
* - 48
|
21
|
+
* - 64
|
22
|
+
* - 72
|
23
|
+
* - 88
|
24
|
+
* - 124
|
25
|
+
*
|
26
|
+
* @default 32
|
27
|
+
*/
|
28
|
+
this.size = AVATAR_DEFAULTS.SIZE;
|
29
|
+
/**
|
30
|
+
* Represents the typing indicator when the user is typing.
|
31
|
+
* @default false
|
32
|
+
*/
|
33
|
+
this.isTyping = false;
|
34
|
+
}
|
35
|
+
}
|
36
|
+
__decorate([
|
37
|
+
property({ type: String }),
|
38
|
+
__metadata("design:type", String)
|
39
|
+
], InnerMixinClass.prototype, "src", void 0);
|
40
|
+
__decorate([
|
41
|
+
property({ type: String }),
|
42
|
+
__metadata("design:type", String)
|
43
|
+
], InnerMixinClass.prototype, "initials", void 0);
|
44
|
+
__decorate([
|
45
|
+
property({ type: String }),
|
46
|
+
__metadata("design:type", String)
|
47
|
+
], InnerMixinClass.prototype, "presence", void 0);
|
48
|
+
__decorate([
|
49
|
+
property({ type: Number, reflect: true, attribute: 'size' }),
|
50
|
+
__metadata("design:type", Number)
|
51
|
+
], InnerMixinClass.prototype, "size", void 0);
|
52
|
+
__decorate([
|
53
|
+
property({ type: String, attribute: 'icon-name' }),
|
54
|
+
__metadata("design:type", String)
|
55
|
+
], InnerMixinClass.prototype, "iconName", void 0);
|
56
|
+
__decorate([
|
57
|
+
property({ type: Number }),
|
58
|
+
__metadata("design:type", Number)
|
59
|
+
], InnerMixinClass.prototype, "counter", void 0);
|
60
|
+
__decorate([
|
61
|
+
property({ type: Boolean, attribute: 'is-typing' }),
|
62
|
+
__metadata("design:type", Object)
|
63
|
+
], InnerMixinClass.prototype, "isTyping", void 0);
|
64
|
+
// Cast return type to your mixin's interface intersected with the superClass type
|
65
|
+
return InnerMixinClass;
|
66
|
+
};
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import { LitElement } from 'lit';
|
2
|
-
type Constructor
|
2
|
+
import type { Constructor } from './index.types';
|
3
3
|
export interface DisabledMixinInterface {
|
4
4
|
disabled: boolean;
|
5
5
|
}
|
6
6
|
export declare const DisabledMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<DisabledMixinInterface> & T;
|
7
|
-
export {};
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import { LitElement } from 'lit';
|
2
|
-
type Constructor
|
2
|
+
import type { Constructor } from './index.types';
|
3
3
|
export interface TabIndexMixinInterface {
|
4
4
|
tabIndex: number;
|
5
5
|
}
|
6
6
|
export declare const TabIndexMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<TabIndexMixinInterface> & T;
|
7
|
-
export {};
|
@@ -0,0 +1 @@
|
|
1
|
+
export type Constructor<T = {}> = new (...args: any[]) => T;
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
package/package.json
CHANGED