@momentum-design/components 0.84.4 → 0.84.5

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.
@@ -142,8 +142,13 @@ declare class Dialog extends Dialog_base {
142
142
  */
143
143
  disableAriaHasPopup: boolean;
144
144
  /**
145
- * For now FocusTrap is always true as the dialog is a modal component only.
146
- * This means it will always trap focus within the dialog when it is open.
145
+ * Determines whether the focus trap is enabled.
146
+ * If true, focus will be restricted to the content within this component.
147
+ *
148
+ * NOTE: this should only be disabled in rare cases! By default a Modal Dialog
149
+ * should trap focus always.
150
+ *
151
+ * @default true
147
152
  */
148
153
  focusTrap: boolean;
149
154
  /**
@@ -147,10 +147,15 @@ class Dialog extends PreventScrollMixin(FocusTrapMixin(CardAndDialogFooterMixin(
147
147
  */
148
148
  this.disableAriaHasPopup = DEFAULTS.DISABLE_ARIA_HAS_POPUP;
149
149
  /**
150
- * For now FocusTrap is always true as the dialog is a modal component only.
151
- * This means it will always trap focus within the dialog when it is open.
150
+ * Determines whether the focus trap is enabled.
151
+ * If true, focus will be restricted to the content within this component.
152
+ *
153
+ * NOTE: this should only be disabled in rare cases! By default a Modal Dialog
154
+ * should trap focus always.
155
+ *
156
+ * @default true
152
157
  */
153
- this.focusTrap = true;
158
+ this.focusTrap = DEFAULTS.FOCUS_TRAP;
154
159
  /**
155
160
  * For now preventScroll is always true as the dialog is a modal component only.
156
161
  * This means scroll will be prevented when the dialog is open.
@@ -328,7 +333,9 @@ class Dialog extends PreventScrollMixin(FocusTrapMixin(CardAndDialogFooterMixin(
328
333
  this.createBackdrop();
329
334
  this.activatePreventScroll();
330
335
  await this.updateComplete;
331
- (_a = this.activateFocusTrap) === null || _a === void 0 ? void 0 : _a.call(this);
336
+ if (this.focusTrap) {
337
+ (_a = this.activateFocusTrap) === null || _a === void 0 ? void 0 : _a.call(this);
338
+ }
332
339
  (_b = this.setInitialFocus) === null || _b === void 0 ? void 0 : _b.call(this);
333
340
  // Set aria-expanded attribute on the trigger element to true if it exists
334
341
  (_c = this.triggerElement) === null || _c === void 0 ? void 0 : _c.setAttribute('aria-expanded', 'true');
@@ -470,4 +477,8 @@ __decorate([
470
477
  property({ type: Boolean, reflect: true, attribute: 'disable-aria-haspopup' }),
471
478
  __metadata("design:type", Boolean)
472
479
  ], Dialog.prototype, "disableAriaHasPopup", void 0);
480
+ __decorate([
481
+ property({ type: Boolean, reflect: true, attribute: 'focus-trap' }),
482
+ __metadata("design:type", Boolean)
483
+ ], Dialog.prototype, "focusTrap", void 0);
473
484
  export default Dialog;
@@ -13,6 +13,7 @@ declare const DEFAULTS: {
13
13
  readonly CANCEL_ICON: "cancel-bold";
14
14
  readonly VARIANT: "default";
15
15
  readonly DISABLE_ARIA_HAS_POPUP: false;
16
+ readonly FOCUS_TRAP: true;
16
17
  };
17
18
  declare const DIALOG_SIZE: readonly ["small", "medium", "large"];
18
19
  declare const DIALOG_ROLE: readonly ["dialog", "alertdialog"];
@@ -14,6 +14,7 @@ const DEFAULTS = {
14
14
  CANCEL_ICON: 'cancel-bold',
15
15
  VARIANT: DIALOG_VARIANT.DEFAULT,
16
16
  DISABLE_ARIA_HAS_POPUP: false,
17
+ FOCUS_TRAP: true,
17
18
  };
18
19
  const DIALOG_SIZE = ['small', 'medium', 'large'];
19
20
  const DIALOG_ROLE = ['dialog', 'alertdialog'];
@@ -9671,8 +9671,10 @@
9671
9671
  "text": "boolean"
9672
9672
  },
9673
9673
  "privacy": "protected",
9674
- "description": "For now FocusTrap is always true as the dialog is a modal component only.\nThis means it will always trap focus within the dialog when it is open.",
9674
+ "description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.\n\nNOTE: this should only be disabled in rare cases! By default a Modal Dialog\nshould trap focus always.",
9675
9675
  "default": "true",
9676
+ "attribute": "focus-trap",
9677
+ "reflects": true,
9676
9678
  "inheritedFrom": {
9677
9679
  "name": "FocusTrapMixin",
9678
9680
  "module": "utils/mixins/FocusTrapMixin.js"
@@ -10426,6 +10428,15 @@
10426
10428
  "default": "false",
10427
10429
  "fieldName": "disableAriaHasPopup"
10428
10430
  },
10431
+ {
10432
+ "name": "focus-trap",
10433
+ "type": {
10434
+ "text": "boolean"
10435
+ },
10436
+ "description": "Determines whether the focus trap is enabled.\nIf true, focus will be restricted to the content within this component.\n\nNOTE: this should only be disabled in rare cases! By default a Modal Dialog\nshould trap focus always.",
10437
+ "default": "true",
10438
+ "fieldName": "focusTrap"
10439
+ },
10429
10440
  {
10430
10441
  "name": "should-focus-trap-wrap",
10431
10442
  "type": {
@@ -10474,6 +10485,252 @@
10474
10485
  }
10475
10486
  ]
10476
10487
  },
10488
+ {
10489
+ "kind": "javascript-module",
10490
+ "path": "components/divider/divider.component.js",
10491
+ "declarations": [
10492
+ {
10493
+ "kind": "class",
10494
+ "description": "`mdc-divider` is a component that provides a line to separate and organize content.\nIt can also include a button or text positioned centrally, allowing users to interact with the layout.\n\n**Divider Orientation:**\n- **Horizontal**: A thin, horizontal line.\n- **Vertical**: A thin, vertical line.\n\n**Divider Variants:**\n- **solid**: Solid line.\n- **gradient**: Gradient Line.\n\n**Divider Types:**\n- The type of divider is inferred based on the kind of slot present.\n - **Primary**: A simple horizontal or vertical divider.\n - **Text**: A horizontal divider with a text label in the center.\n - **Grabber Button**: A horizontal or vertical divider with a styled button in the center.\n\n**Accessibility:**\n- When the slot is replaced by an `mdc-button`:\n - `aria-label` should be passed to the `mdc-button`.\n - `aria-expanded` should be passed to the `mdc-button`.\n\n**Notes:**\n- If the slot is replaced by an invalid tag name or contains multiple elements,\n the divider defaults to the **Primary** type.\n- To override the styles of the divider, use the provided CSS custom properties.",
10495
+ "name": "Divider",
10496
+ "cssProperties": [
10497
+ {
10498
+ "description": "background color of the divider",
10499
+ "name": "--mdc-divider-background-color"
10500
+ },
10501
+ {
10502
+ "description": "width of the divider",
10503
+ "name": "--mdc-divider-width"
10504
+ },
10505
+ {
10506
+ "description": "gradient of the horizontal divider",
10507
+ "name": "--mdc-divider-horizontal-gradient"
10508
+ },
10509
+ {
10510
+ "description": "gradient of the vertical divider",
10511
+ "name": "--mdc-divider-vertical-gradient"
10512
+ },
10513
+ {
10514
+ "description": "font size of label in the text divider",
10515
+ "name": "--mdc-divider-text-size"
10516
+ },
10517
+ {
10518
+ "description": "font color of label in the text divider",
10519
+ "name": "--mdc-divider-text-color"
10520
+ },
10521
+ {
10522
+ "description": "left and right margin of label in the text divider",
10523
+ "name": "--mdc-divider-text-margin"
10524
+ },
10525
+ {
10526
+ "description": "line height of label in the text divider",
10527
+ "name": "--mdc-divider-text-line-height"
10528
+ },
10529
+ {
10530
+ "description": "background color of the grabber button in rest state",
10531
+ "name": "--mdc-divider-grabber-button-background-color-normal"
10532
+ },
10533
+ {
10534
+ "description": "background color of the grabber button in hover state",
10535
+ "name": "--mdc-divider-grabber-button-background-color-hover"
10536
+ },
10537
+ {
10538
+ "description": "background color of the grabber button in pressed state",
10539
+ "name": "--mdc-divider-grabber-button-background-color-pressed"
10540
+ },
10541
+ {
10542
+ "description": "border color of the grabber button",
10543
+ "name": "--mdc-divider-grabber-button-border-color"
10544
+ },
10545
+ {
10546
+ "description": "border radius of the grabber button",
10547
+ "name": "--mdc-divider-grabber-button-border-radius"
10548
+ }
10549
+ ],
10550
+ "members": [
10551
+ {
10552
+ "kind": "field",
10553
+ "name": "orientation",
10554
+ "type": {
10555
+ "text": "DividerOrientation"
10556
+ },
10557
+ "description": "Two orientations of divider\n- **horizontal**: A thin, horizontal line with 0.0625rem width.\n- **vertical**: A thin, vertical line with 0.0625rem width.\n\nNote: We do not support \"Vertical Text Divider\" as of now.",
10558
+ "default": "horizontal",
10559
+ "attribute": "orientation",
10560
+ "reflects": true
10561
+ },
10562
+ {
10563
+ "kind": "field",
10564
+ "name": "variant",
10565
+ "type": {
10566
+ "text": "DividerVariant"
10567
+ },
10568
+ "description": "Two variants of divider\n- **solid**: Solid line.\n- **gradient**: Gradient Line that fades on either sides of the divider.",
10569
+ "default": "solid",
10570
+ "attribute": "variant",
10571
+ "reflects": true
10572
+ },
10573
+ {
10574
+ "kind": "field",
10575
+ "name": "arrowDirection",
10576
+ "type": {
10577
+ "text": "Directions"
10578
+ },
10579
+ "description": "Direction of the arrow icon, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
10580
+ "default": "'negative'",
10581
+ "attribute": "arrow-direction",
10582
+ "reflects": true
10583
+ },
10584
+ {
10585
+ "kind": "field",
10586
+ "name": "buttonPosition",
10587
+ "type": {
10588
+ "text": "Directions"
10589
+ },
10590
+ "description": "Position of the button, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
10591
+ "default": "'negative'",
10592
+ "attribute": "button-position",
10593
+ "reflects": true
10594
+ },
10595
+ {
10596
+ "kind": "method",
10597
+ "name": "setVariant",
10598
+ "privacy": "private",
10599
+ "parameters": [
10600
+ {
10601
+ "name": "variant",
10602
+ "type": {
10603
+ "text": "DividerVariant"
10604
+ },
10605
+ "description": "The variant to set."
10606
+ }
10607
+ ],
10608
+ "description": "Sets the variant attribute for the divider component.\nIf the provided variant is not included in the DIVIDER_VARIANT,\nit defaults to the value specified in DEFAULTS.VARIANT."
10609
+ },
10610
+ {
10611
+ "kind": "method",
10612
+ "name": "setOrientation",
10613
+ "privacy": "private",
10614
+ "parameters": [
10615
+ {
10616
+ "name": "orientation",
10617
+ "type": {
10618
+ "text": "DividerOrientation"
10619
+ },
10620
+ "description": "The orientation to set."
10621
+ }
10622
+ ],
10623
+ "description": "Sets the orientation attribute for the divider component.\nIf the provided orientation is not included in the DIVIDER_ORIENTATION,\nit defaults to the value specified in DEFAULTS.ORIENTATION."
10624
+ },
10625
+ {
10626
+ "kind": "method",
10627
+ "name": "ensureValidDirections",
10628
+ "privacy": "private",
10629
+ "description": "Sets the buttonPosition and arrowDirection attribute for the divider component.\nIf the provided buttonPosition and arrowDirection are not included in the DIRECTIONS,\nit defaults to the value specified in DIRECTIONS based on the ORIENTATION.",
10630
+ "parameters": [
10631
+ {
10632
+ "description": "The buttonPosition to set.",
10633
+ "name": "buttonPosition"
10634
+ },
10635
+ {
10636
+ "description": "The arrowDirection to set.",
10637
+ "name": "arrowDirection"
10638
+ }
10639
+ ]
10640
+ },
10641
+ {
10642
+ "kind": "method",
10643
+ "name": "setGrabberButton",
10644
+ "privacy": "private",
10645
+ "return": {
10646
+ "type": {
10647
+ "text": "void"
10648
+ }
10649
+ },
10650
+ "description": "Configures the grabber button within the divider.\n\n- Sets the `prefix-icon` attribute for the grabber button based\non the `arrow-direction` and `orientation` properties.\n\nThis method updates the DOM element dynamically if a grabber button is present."
10651
+ },
10652
+ {
10653
+ "kind": "method",
10654
+ "name": "getArrowIcon",
10655
+ "privacy": "private",
10656
+ "return": {
10657
+ "type": {
10658
+ "text": ""
10659
+ }
10660
+ },
10661
+ "description": "Determines the arrow icon based on the consumer-defined `arrowDirection`."
10662
+ },
10663
+ {
10664
+ "kind": "method",
10665
+ "name": "inferDividerType",
10666
+ "privacy": "private",
10667
+ "description": "Infers the type of divider based on the kind of slot present.",
10668
+ "parameters": [
10669
+ {
10670
+ "description": "default slot of divider",
10671
+ "name": "slot"
10672
+ }
10673
+ ]
10674
+ }
10675
+ ],
10676
+ "attributes": [
10677
+ {
10678
+ "name": "orientation",
10679
+ "type": {
10680
+ "text": "DividerOrientation"
10681
+ },
10682
+ "description": "Two orientations of divider\n- **horizontal**: A thin, horizontal line with 0.0625rem width.\n- **vertical**: A thin, vertical line with 0.0625rem width.\n\nNote: We do not support \"Vertical Text Divider\" as of now.",
10683
+ "default": "horizontal",
10684
+ "fieldName": "orientation"
10685
+ },
10686
+ {
10687
+ "name": "variant",
10688
+ "type": {
10689
+ "text": "DividerVariant"
10690
+ },
10691
+ "description": "Two variants of divider\n- **solid**: Solid line.\n- **gradient**: Gradient Line that fades on either sides of the divider.",
10692
+ "default": "solid",
10693
+ "fieldName": "variant"
10694
+ },
10695
+ {
10696
+ "name": "arrow-direction",
10697
+ "type": {
10698
+ "text": "Directions"
10699
+ },
10700
+ "description": "Direction of the arrow icon, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
10701
+ "default": "'negative'",
10702
+ "fieldName": "arrowDirection"
10703
+ },
10704
+ {
10705
+ "name": "button-position",
10706
+ "type": {
10707
+ "text": "Directions"
10708
+ },
10709
+ "description": "Position of the button, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
10710
+ "default": "'negative'",
10711
+ "fieldName": "buttonPosition"
10712
+ }
10713
+ ],
10714
+ "superclass": {
10715
+ "name": "Component",
10716
+ "module": "/src/models"
10717
+ },
10718
+ "tagName": "mdc-divider",
10719
+ "jsDoc": "/**\n * `mdc-divider` is a component that provides a line to separate and organize content.\n * It can also include a button or text positioned centrally, allowing users to interact with the layout.\n *\n * **Divider Orientation:**\n * - **Horizontal**: A thin, horizontal line.\n * - **Vertical**: A thin, vertical line.\n *\n * **Divider Variants:**\n * - **solid**: Solid line.\n * - **gradient**: Gradient Line.\n *\n * **Divider Types:**\n * - The type of divider is inferred based on the kind of slot present.\n * - **Primary**: A simple horizontal or vertical divider.\n * - **Text**: A horizontal divider with a text label in the center.\n * - **Grabber Button**: A horizontal or vertical divider with a styled button in the center.\n *\n * **Accessibility:**\n * - When the slot is replaced by an `mdc-button`:\n * - `aria-label` should be passed to the `mdc-button`.\n * - `aria-expanded` should be passed to the `mdc-button`.\n *\n * **Notes:**\n * - If the slot is replaced by an invalid tag name or contains multiple elements,\n * the divider defaults to the **Primary** type.\n * - To override the styles of the divider, use the provided CSS custom properties.\n *\n * @tagname mdc-divider\n *\n * @cssproperty --mdc-divider-background-color - background color of the divider\n * @cssproperty --mdc-divider-width - width of the divider\n * @cssproperty --mdc-divider-horizontal-gradient - gradient of the horizontal divider\n * @cssproperty --mdc-divider-vertical-gradient - gradient of the vertical divider\n * @cssproperty --mdc-divider-text-size - font size of label in the text divider\n * @cssproperty --mdc-divider-text-color - font color of label in the text divider\n * @cssproperty --mdc-divider-text-margin - left and right margin of label in the text divider\n * @cssproperty --mdc-divider-text-line-height - line height of label in the text divider\n * @cssproperty --mdc-divider-grabber-button-background-color-normal - background color of the grabber button\n * in rest state\n * @cssproperty --mdc-divider-grabber-button-background-color-hover - background color of the grabber button\n * in hover state\n * @cssproperty --mdc-divider-grabber-button-background-color-pressed - background color of the grabber button\n * in pressed state\n * @cssproperty --mdc-divider-grabber-button-border-color - border color of the grabber button\n * @cssproperty --mdc-divider-grabber-button-border-radius - border radius of the grabber button\n */",
10720
+ "customElement": true
10721
+ }
10722
+ ],
10723
+ "exports": [
10724
+ {
10725
+ "kind": "js",
10726
+ "name": "default",
10727
+ "declaration": {
10728
+ "name": "Divider",
10729
+ "module": "components/divider/divider.component.js"
10730
+ }
10731
+ }
10732
+ ]
10733
+ },
10477
10734
  {
10478
10735
  "kind": "javascript-module",
10479
10736
  "path": "components/filterchip/filterchip.component.js",
@@ -11097,252 +11354,6 @@
11097
11354
  }
11098
11355
  ]
11099
11356
  },
11100
- {
11101
- "kind": "javascript-module",
11102
- "path": "components/divider/divider.component.js",
11103
- "declarations": [
11104
- {
11105
- "kind": "class",
11106
- "description": "`mdc-divider` is a component that provides a line to separate and organize content.\nIt can also include a button or text positioned centrally, allowing users to interact with the layout.\n\n**Divider Orientation:**\n- **Horizontal**: A thin, horizontal line.\n- **Vertical**: A thin, vertical line.\n\n**Divider Variants:**\n- **solid**: Solid line.\n- **gradient**: Gradient Line.\n\n**Divider Types:**\n- The type of divider is inferred based on the kind of slot present.\n - **Primary**: A simple horizontal or vertical divider.\n - **Text**: A horizontal divider with a text label in the center.\n - **Grabber Button**: A horizontal or vertical divider with a styled button in the center.\n\n**Accessibility:**\n- When the slot is replaced by an `mdc-button`:\n - `aria-label` should be passed to the `mdc-button`.\n - `aria-expanded` should be passed to the `mdc-button`.\n\n**Notes:**\n- If the slot is replaced by an invalid tag name or contains multiple elements,\n the divider defaults to the **Primary** type.\n- To override the styles of the divider, use the provided CSS custom properties.",
11107
- "name": "Divider",
11108
- "cssProperties": [
11109
- {
11110
- "description": "background color of the divider",
11111
- "name": "--mdc-divider-background-color"
11112
- },
11113
- {
11114
- "description": "width of the divider",
11115
- "name": "--mdc-divider-width"
11116
- },
11117
- {
11118
- "description": "gradient of the horizontal divider",
11119
- "name": "--mdc-divider-horizontal-gradient"
11120
- },
11121
- {
11122
- "description": "gradient of the vertical divider",
11123
- "name": "--mdc-divider-vertical-gradient"
11124
- },
11125
- {
11126
- "description": "font size of label in the text divider",
11127
- "name": "--mdc-divider-text-size"
11128
- },
11129
- {
11130
- "description": "font color of label in the text divider",
11131
- "name": "--mdc-divider-text-color"
11132
- },
11133
- {
11134
- "description": "left and right margin of label in the text divider",
11135
- "name": "--mdc-divider-text-margin"
11136
- },
11137
- {
11138
- "description": "line height of label in the text divider",
11139
- "name": "--mdc-divider-text-line-height"
11140
- },
11141
- {
11142
- "description": "background color of the grabber button in rest state",
11143
- "name": "--mdc-divider-grabber-button-background-color-normal"
11144
- },
11145
- {
11146
- "description": "background color of the grabber button in hover state",
11147
- "name": "--mdc-divider-grabber-button-background-color-hover"
11148
- },
11149
- {
11150
- "description": "background color of the grabber button in pressed state",
11151
- "name": "--mdc-divider-grabber-button-background-color-pressed"
11152
- },
11153
- {
11154
- "description": "border color of the grabber button",
11155
- "name": "--mdc-divider-grabber-button-border-color"
11156
- },
11157
- {
11158
- "description": "border radius of the grabber button",
11159
- "name": "--mdc-divider-grabber-button-border-radius"
11160
- }
11161
- ],
11162
- "members": [
11163
- {
11164
- "kind": "field",
11165
- "name": "orientation",
11166
- "type": {
11167
- "text": "DividerOrientation"
11168
- },
11169
- "description": "Two orientations of divider\n- **horizontal**: A thin, horizontal line with 0.0625rem width.\n- **vertical**: A thin, vertical line with 0.0625rem width.\n\nNote: We do not support \"Vertical Text Divider\" as of now.",
11170
- "default": "horizontal",
11171
- "attribute": "orientation",
11172
- "reflects": true
11173
- },
11174
- {
11175
- "kind": "field",
11176
- "name": "variant",
11177
- "type": {
11178
- "text": "DividerVariant"
11179
- },
11180
- "description": "Two variants of divider\n- **solid**: Solid line.\n- **gradient**: Gradient Line that fades on either sides of the divider.",
11181
- "default": "solid",
11182
- "attribute": "variant",
11183
- "reflects": true
11184
- },
11185
- {
11186
- "kind": "field",
11187
- "name": "arrowDirection",
11188
- "type": {
11189
- "text": "Directions"
11190
- },
11191
- "description": "Direction of the arrow icon, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
11192
- "default": "'negative'",
11193
- "attribute": "arrow-direction",
11194
- "reflects": true
11195
- },
11196
- {
11197
- "kind": "field",
11198
- "name": "buttonPosition",
11199
- "type": {
11200
- "text": "Directions"
11201
- },
11202
- "description": "Position of the button, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
11203
- "default": "'negative'",
11204
- "attribute": "button-position",
11205
- "reflects": true
11206
- },
11207
- {
11208
- "kind": "method",
11209
- "name": "setVariant",
11210
- "privacy": "private",
11211
- "parameters": [
11212
- {
11213
- "name": "variant",
11214
- "type": {
11215
- "text": "DividerVariant"
11216
- },
11217
- "description": "The variant to set."
11218
- }
11219
- ],
11220
- "description": "Sets the variant attribute for the divider component.\nIf the provided variant is not included in the DIVIDER_VARIANT,\nit defaults to the value specified in DEFAULTS.VARIANT."
11221
- },
11222
- {
11223
- "kind": "method",
11224
- "name": "setOrientation",
11225
- "privacy": "private",
11226
- "parameters": [
11227
- {
11228
- "name": "orientation",
11229
- "type": {
11230
- "text": "DividerOrientation"
11231
- },
11232
- "description": "The orientation to set."
11233
- }
11234
- ],
11235
- "description": "Sets the orientation attribute for the divider component.\nIf the provided orientation is not included in the DIVIDER_ORIENTATION,\nit defaults to the value specified in DEFAULTS.ORIENTATION."
11236
- },
11237
- {
11238
- "kind": "method",
11239
- "name": "ensureValidDirections",
11240
- "privacy": "private",
11241
- "description": "Sets the buttonPosition and arrowDirection attribute for the divider component.\nIf the provided buttonPosition and arrowDirection are not included in the DIRECTIONS,\nit defaults to the value specified in DIRECTIONS based on the ORIENTATION.",
11242
- "parameters": [
11243
- {
11244
- "description": "The buttonPosition to set.",
11245
- "name": "buttonPosition"
11246
- },
11247
- {
11248
- "description": "The arrowDirection to set.",
11249
- "name": "arrowDirection"
11250
- }
11251
- ]
11252
- },
11253
- {
11254
- "kind": "method",
11255
- "name": "setGrabberButton",
11256
- "privacy": "private",
11257
- "return": {
11258
- "type": {
11259
- "text": "void"
11260
- }
11261
- },
11262
- "description": "Configures the grabber button within the divider.\n\n- Sets the `prefix-icon` attribute for the grabber button based\non the `arrow-direction` and `orientation` properties.\n\nThis method updates the DOM element dynamically if a grabber button is present."
11263
- },
11264
- {
11265
- "kind": "method",
11266
- "name": "getArrowIcon",
11267
- "privacy": "private",
11268
- "return": {
11269
- "type": {
11270
- "text": ""
11271
- }
11272
- },
11273
- "description": "Determines the arrow icon based on the consumer-defined `arrowDirection`."
11274
- },
11275
- {
11276
- "kind": "method",
11277
- "name": "inferDividerType",
11278
- "privacy": "private",
11279
- "description": "Infers the type of divider based on the kind of slot present.",
11280
- "parameters": [
11281
- {
11282
- "description": "default slot of divider",
11283
- "name": "slot"
11284
- }
11285
- ]
11286
- }
11287
- ],
11288
- "attributes": [
11289
- {
11290
- "name": "orientation",
11291
- "type": {
11292
- "text": "DividerOrientation"
11293
- },
11294
- "description": "Two orientations of divider\n- **horizontal**: A thin, horizontal line with 0.0625rem width.\n- **vertical**: A thin, vertical line with 0.0625rem width.\n\nNote: We do not support \"Vertical Text Divider\" as of now.",
11295
- "default": "horizontal",
11296
- "fieldName": "orientation"
11297
- },
11298
- {
11299
- "name": "variant",
11300
- "type": {
11301
- "text": "DividerVariant"
11302
- },
11303
- "description": "Two variants of divider\n- **solid**: Solid line.\n- **gradient**: Gradient Line that fades on either sides of the divider.",
11304
- "default": "solid",
11305
- "fieldName": "variant"
11306
- },
11307
- {
11308
- "name": "arrow-direction",
11309
- "type": {
11310
- "text": "Directions"
11311
- },
11312
- "description": "Direction of the arrow icon, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
11313
- "default": "'negative'",
11314
- "fieldName": "arrowDirection"
11315
- },
11316
- {
11317
- "name": "button-position",
11318
- "type": {
11319
- "text": "Directions"
11320
- },
11321
- "description": "Position of the button, if applicable.\n- **positive**\n- **negative**\n\nNote: Positive and Negative directions are defined based on Cartesian plane.",
11322
- "default": "'negative'",
11323
- "fieldName": "buttonPosition"
11324
- }
11325
- ],
11326
- "superclass": {
11327
- "name": "Component",
11328
- "module": "/src/models"
11329
- },
11330
- "tagName": "mdc-divider",
11331
- "jsDoc": "/**\n * `mdc-divider` is a component that provides a line to separate and organize content.\n * It can also include a button or text positioned centrally, allowing users to interact with the layout.\n *\n * **Divider Orientation:**\n * - **Horizontal**: A thin, horizontal line.\n * - **Vertical**: A thin, vertical line.\n *\n * **Divider Variants:**\n * - **solid**: Solid line.\n * - **gradient**: Gradient Line.\n *\n * **Divider Types:**\n * - The type of divider is inferred based on the kind of slot present.\n * - **Primary**: A simple horizontal or vertical divider.\n * - **Text**: A horizontal divider with a text label in the center.\n * - **Grabber Button**: A horizontal or vertical divider with a styled button in the center.\n *\n * **Accessibility:**\n * - When the slot is replaced by an `mdc-button`:\n * - `aria-label` should be passed to the `mdc-button`.\n * - `aria-expanded` should be passed to the `mdc-button`.\n *\n * **Notes:**\n * - If the slot is replaced by an invalid tag name or contains multiple elements,\n * the divider defaults to the **Primary** type.\n * - To override the styles of the divider, use the provided CSS custom properties.\n *\n * @tagname mdc-divider\n *\n * @cssproperty --mdc-divider-background-color - background color of the divider\n * @cssproperty --mdc-divider-width - width of the divider\n * @cssproperty --mdc-divider-horizontal-gradient - gradient of the horizontal divider\n * @cssproperty --mdc-divider-vertical-gradient - gradient of the vertical divider\n * @cssproperty --mdc-divider-text-size - font size of label in the text divider\n * @cssproperty --mdc-divider-text-color - font color of label in the text divider\n * @cssproperty --mdc-divider-text-margin - left and right margin of label in the text divider\n * @cssproperty --mdc-divider-text-line-height - line height of label in the text divider\n * @cssproperty --mdc-divider-grabber-button-background-color-normal - background color of the grabber button\n * in rest state\n * @cssproperty --mdc-divider-grabber-button-background-color-hover - background color of the grabber button\n * in hover state\n * @cssproperty --mdc-divider-grabber-button-background-color-pressed - background color of the grabber button\n * in pressed state\n * @cssproperty --mdc-divider-grabber-button-border-color - border color of the grabber button\n * @cssproperty --mdc-divider-grabber-button-border-radius - border radius of the grabber button\n */",
11332
- "customElement": true
11333
- }
11334
- ],
11335
- "exports": [
11336
- {
11337
- "kind": "js",
11338
- "name": "default",
11339
- "declaration": {
11340
- "name": "Divider",
11341
- "module": "components/divider/divider.component.js"
11342
- }
11343
- }
11344
- ]
11345
- },
11346
11357
  {
11347
11358
  "kind": "javascript-module",
11348
11359
  "path": "components/formfieldgroup/formfieldgroup.component.js",
@@ -18,8 +18,8 @@ export { default as Checkbox } from './checkbox';
18
18
  export { default as Chip } from './chip';
19
19
  export { default as Coachmark } from './coachmark';
20
20
  export { default as Dialog } from './dialog';
21
- export { default as FilterChip } from './filterchip';
22
21
  export { default as Divider } from './divider';
22
+ export { default as FilterChip } from './filterchip';
23
23
  export { default as FormfieldGroup } from './formfieldgroup';
24
24
  export { default as FormfieldWrapper } from './formfieldwrapper';
25
25
  export { default as Icon } from './icon';
@@ -18,8 +18,8 @@ export { default as Checkbox } from './checkbox';
18
18
  export { default as Chip } from './chip';
19
19
  export { default as Coachmark } from './coachmark';
20
20
  export { default as Dialog } from './dialog';
21
- export { default as FilterChip } from './filterchip';
22
21
  export { default as Divider } from './divider';
22
+ export { default as FilterChip } from './filterchip';
23
23
  export { default as FormfieldGroup } from './formfieldgroup';
24
24
  export { default as FormfieldWrapper } from './formfieldwrapper';
25
25
  export { default as Icon } from './icon';
@@ -59,6 +59,9 @@ class FocusTrapStack {
59
59
  * @param trap - The focus trap to deactivate.
60
60
  */
61
61
  static deactivate(trap) {
62
+ if (!this.stack.has(trap)) {
63
+ return;
64
+ }
62
65
  this.stack.delete(trap);
63
66
  this.removeKeydownListener();
64
67
  // activate the previous trap in the stack if any
package/package.json CHANGED
@@ -41,5 +41,5 @@
41
41
  "lottie-web": "^5.12.2",
42
42
  "uuid": "^11.0.5"
43
43
  },
44
- "version": "0.84.4"
44
+ "version": "0.84.5"
45
45
  }