@momentum-design/components 0.7.7 → 0.7.8

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.
@@ -37,6 +37,7 @@ declare class Badge extends Component {
37
37
  /**
38
38
  * Type of the variant can be `primary` or `secondary`.
39
39
  * It defines the background and foreground color of the icon.
40
+ * @default primary
40
41
  */
41
42
  variant: string;
42
43
  /**
@@ -46,16 +47,19 @@ declare class Badge extends Component {
46
47
  /**
47
48
  * The maximum number can be set up to 999, anything above that will be rendered as _999+_.
48
49
  * The max counter can be `9`, `99` or `999`.
50
+ * @default 99
49
51
  */
50
52
  maxCounter: number;
51
53
  /**
52
54
  * Overlay is to add a thin outline to the badge.
53
55
  * This will help distinguish between the badge and the button,
54
56
  * where the badge will be layered on top of a button.
57
+ * @default false
55
58
  */
56
59
  overlay: boolean;
57
60
  /**
58
61
  * Aria-label attribute to be set for accessibility
62
+ * @default null
59
63
  */
60
64
  ariaLabel: string | null;
61
65
  /**
@@ -43,21 +43,25 @@ class Badge extends Component {
43
43
  /**
44
44
  * Type of the variant can be `primary` or `secondary`.
45
45
  * It defines the background and foreground color of the icon.
46
+ * @default primary
46
47
  */
47
48
  this.variant = DEFAULTS.VARIANT;
48
49
  /**
49
50
  * The maximum number can be set up to 999, anything above that will be rendered as _999+_.
50
51
  * The max counter can be `9`, `99` or `999`.
52
+ * @default 99
51
53
  */
52
54
  this.maxCounter = DEFAULTS.MAX_COUNTER;
53
55
  /**
54
56
  * Overlay is to add a thin outline to the badge.
55
57
  * This will help distinguish between the badge and the button,
56
58
  * where the badge will be layered on top of a button.
59
+ * @default false
57
60
  */
58
61
  this.overlay = false;
59
62
  /**
60
63
  * Aria-label attribute to be set for accessibility
64
+ * @default null
61
65
  */
62
66
  this.ariaLabel = null;
63
67
  }
@@ -25,16 +25,19 @@ declare class IconProvider extends Provider<IconProviderContext> {
25
25
  */
26
26
  url?: string;
27
27
  /**
28
- * File extension of icons, default: 'svg'
28
+ * File extension of icons
29
+ * @default svg
29
30
  */
30
31
  fileExtension?: string;
31
32
  /**
32
- * Length unit used for sizing of icons, default: 'em'
33
+ * Length unit used for sizing of icons
34
+ * @default em
33
35
  */
34
36
  lengthUnit: string;
35
37
  /**
36
38
  * The default size of the icon.
37
39
  * If not set, it falls back to the size defined by the length unit.
40
+ * @default 1
38
41
  */
39
42
  size?: number;
40
43
  private updateValuesInContext;
@@ -31,18 +31,21 @@ class IconProvider extends Provider {
31
31
  initialValue: new IconProviderContext(),
32
32
  });
33
33
  /**
34
- * File extension of icons, default: 'svg'
34
+ * File extension of icons
35
+ * @default svg
35
36
  */
36
37
  this.fileExtension = DEFAULTS.FILE_EXTENSION;
37
38
  /**
38
- * Length unit used for sizing of icons, default: 'em'
39
+ * Length unit used for sizing of icons
40
+ * @default em
39
41
  */
40
42
  this.lengthUnit = DEFAULTS.LENGTH_UNIT;
41
43
  /**
42
44
  * The default size of the icon.
43
45
  * If not set, it falls back to the size defined by the length unit.
46
+ * @default 1
44
47
  */
45
- this.size = DEFAULTS.LENGTH_UNIT_SIZE[DEFAULTS.LENGTH_UNIT];
48
+ this.size = DEFAULTS.SIZE;
46
49
  }
47
50
  /**
48
51
  * Context object of the IconProvider, to be consumed by child components
@@ -1,9 +1,10 @@
1
1
  declare const TAG_NAME: "mdc-iconprovider";
2
2
  declare const ALLOWED_FILE_EXTENSIONS: string[];
3
3
  declare const ALLOWED_LENGTH_UNITS: string[];
4
+ declare const LENGTH_UNIT_SIZE: Record<string, number>;
4
5
  declare const DEFAULTS: {
5
6
  FILE_EXTENSION: string;
6
7
  LENGTH_UNIT: string;
7
- LENGTH_UNIT_SIZE: Record<string, number>;
8
+ SIZE: number;
8
9
  };
9
- export { TAG_NAME, DEFAULTS, ALLOWED_FILE_EXTENSIONS, ALLOWED_LENGTH_UNITS };
10
+ export { TAG_NAME, DEFAULTS, ALLOWED_FILE_EXTENSIONS, ALLOWED_LENGTH_UNITS, LENGTH_UNIT_SIZE };
@@ -2,13 +2,14 @@ import utils from '../../utils/tag-name';
2
2
  const TAG_NAME = utils.constructTagName('iconprovider');
3
3
  const ALLOWED_FILE_EXTENSIONS = ['svg'];
4
4
  const ALLOWED_LENGTH_UNITS = ['em', 'rem', 'px'];
5
+ const LENGTH_UNIT_SIZE = {
6
+ px: 16,
7
+ em: 1,
8
+ rem: 1,
9
+ };
5
10
  const DEFAULTS = {
6
11
  FILE_EXTENSION: 'svg',
7
12
  LENGTH_UNIT: 'em',
8
- LENGTH_UNIT_SIZE: {
9
- px: 16,
10
- em: 1,
11
- rem: 1,
12
- },
13
+ SIZE: LENGTH_UNIT_SIZE.em,
13
14
  };
14
- export { TAG_NAME, DEFAULTS, ALLOWED_FILE_EXTENSIONS, ALLOWED_LENGTH_UNITS };
15
+ export { TAG_NAME, DEFAULTS, ALLOWED_FILE_EXTENSIONS, ALLOWED_LENGTH_UNITS, LENGTH_UNIT_SIZE };
@@ -28,7 +28,7 @@ declare class Presence extends Component {
28
28
  * - `presenting`
29
29
  * - `quiet`
30
30
  * - `scheduled`
31
- *
31
+ * @default active
32
32
  */
33
33
  type: string;
34
34
  /**
@@ -40,7 +40,7 @@ declare class Presence extends Component {
40
40
  * - LARGE
41
41
  * - X_LARGE
42
42
  * - XX_LARGE
43
- *
43
+ * @default small
44
44
  */
45
45
  size: string;
46
46
  /**
@@ -42,7 +42,7 @@ class Presence extends Component {
42
42
  * - `presenting`
43
43
  * - `quiet`
44
44
  * - `scheduled`
45
- *
45
+ * @default active
46
46
  */
47
47
  this.type = DEFAULTS.TYPE;
48
48
  /**
@@ -54,7 +54,7 @@ class Presence extends Component {
54
54
  * - LARGE
55
55
  * - X_LARGE
56
56
  * - XX_LARGE
57
- *
57
+ * @default small
58
58
  */
59
59
  this.size = DEFAULTS.SIZE;
60
60
  }
@@ -53,6 +53,7 @@ declare class Text extends Component {
53
53
  * - 'heading-xlarge-bold'
54
54
  * - 'headline-small-light'
55
55
  * - 'headline-small-regular'
56
+ * @default body-large-regular
56
57
  */
57
58
  type: string;
58
59
  /**
@@ -67,6 +67,7 @@ class Text extends Component {
67
67
  * - 'heading-xlarge-bold'
68
68
  * - 'headline-small-light'
69
69
  * - 'headline-small-regular'
70
+ * @default body-large-regular
70
71
  */
71
72
  this.type = DEFAULTS.TYPE;
72
73
  /**