@momentum-design/components 0.85.0 → 0.85.2

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.
@@ -520,67 +520,6 @@
520
520
  }
521
521
  ]
522
522
  },
523
- {
524
- "kind": "javascript-module",
525
- "path": "components/appheader/appheader.component.js",
526
- "declarations": [
527
- {
528
- "kind": "class",
529
- "description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
530
- "name": "Appheader",
531
- "cssParts": [
532
- {
533
- "description": "The main container for styling the header.",
534
- "name": "container"
535
- },
536
- {
537
- "description": "The leading section of the header.",
538
- "name": "leading-section"
539
- },
540
- {
541
- "description": "The center section of the header.",
542
- "name": "center-section"
543
- },
544
- {
545
- "description": "The trailing section of the header.",
546
- "name": "trailing-section"
547
- }
548
- ],
549
- "slots": [
550
- {
551
- "description": "Slot for the leading section (e.g., brand logo, brand name).",
552
- "name": "leading"
553
- },
554
- {
555
- "description": "Slot for the center section (e.g., search bar, icons).",
556
- "name": "center"
557
- },
558
- {
559
- "description": "Slot for the trailing section (e.g., profile avatar, icons).",
560
- "name": "trailing"
561
- }
562
- ],
563
- "members": [],
564
- "superclass": {
565
- "name": "Component",
566
- "module": "/src/models"
567
- },
568
- "tagName": "mdc-appheader",
569
- "jsDoc": "/**\n * The `mdc-appheader` component provides a structured and accessible app header layout.\n * It consists of three primary sections: leading, center, and trailing.\n *\n * - The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n * - The **center section** can contain a **search bar**, **icons** or action controls.\n * - The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.\n *\n * @tagname mdc-appheader\n *\n * @slot leading - Slot for the leading section (e.g., brand logo, brand name).\n * @slot center - Slot for the center section (e.g., search bar, icons).\n * @slot trailing - Slot for the trailing section (e.g., profile avatar, icons).\n *\n * @csspart container - The main container for styling the header.\n * @csspart leading-section - The leading section of the header.\n * @csspart center-section - The center section of the header.\n * @csspart trailing-section - The trailing section of the header.\n */",
570
- "customElement": true
571
- }
572
- ],
573
- "exports": [
574
- {
575
- "kind": "js",
576
- "name": "default",
577
- "declaration": {
578
- "name": "Appheader",
579
- "module": "components/appheader/appheader.component.js"
580
- }
581
- }
582
- ]
583
- },
584
523
  {
585
524
  "kind": "javascript-module",
586
525
  "path": "components/animation/animation.component.js",
@@ -793,6 +732,67 @@
793
732
  }
794
733
  ]
795
734
  },
735
+ {
736
+ "kind": "javascript-module",
737
+ "path": "components/appheader/appheader.component.js",
738
+ "declarations": [
739
+ {
740
+ "kind": "class",
741
+ "description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
742
+ "name": "Appheader",
743
+ "cssParts": [
744
+ {
745
+ "description": "The main container for styling the header.",
746
+ "name": "container"
747
+ },
748
+ {
749
+ "description": "The leading section of the header.",
750
+ "name": "leading-section"
751
+ },
752
+ {
753
+ "description": "The center section of the header.",
754
+ "name": "center-section"
755
+ },
756
+ {
757
+ "description": "The trailing section of the header.",
758
+ "name": "trailing-section"
759
+ }
760
+ ],
761
+ "slots": [
762
+ {
763
+ "description": "Slot for the leading section (e.g., brand logo, brand name).",
764
+ "name": "leading"
765
+ },
766
+ {
767
+ "description": "Slot for the center section (e.g., search bar, icons).",
768
+ "name": "center"
769
+ },
770
+ {
771
+ "description": "Slot for the trailing section (e.g., profile avatar, icons).",
772
+ "name": "trailing"
773
+ }
774
+ ],
775
+ "members": [],
776
+ "superclass": {
777
+ "name": "Component",
778
+ "module": "/src/models"
779
+ },
780
+ "tagName": "mdc-appheader",
781
+ "jsDoc": "/**\n * The `mdc-appheader` component provides a structured and accessible app header layout.\n * It consists of three primary sections: leading, center, and trailing.\n *\n * - The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n * - The **center section** can contain a **search bar**, **icons** or action controls.\n * - The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.\n *\n * @tagname mdc-appheader\n *\n * @slot leading - Slot for the leading section (e.g., brand logo, brand name).\n * @slot center - Slot for the center section (e.g., search bar, icons).\n * @slot trailing - Slot for the trailing section (e.g., profile avatar, icons).\n *\n * @csspart container - The main container for styling the header.\n * @csspart leading-section - The leading section of the header.\n * @csspart center-section - The center section of the header.\n * @csspart trailing-section - The trailing section of the header.\n */",
782
+ "customElement": true
783
+ }
784
+ ],
785
+ "exports": [
786
+ {
787
+ "kind": "js",
788
+ "name": "default",
789
+ "declaration": {
790
+ "name": "Appheader",
791
+ "module": "components/appheader/appheader.component.js"
792
+ }
793
+ }
794
+ ]
795
+ },
796
796
  {
797
797
  "kind": "javascript-module",
798
798
  "path": "components/avatar/avatar.component.js",
@@ -2203,6 +2203,138 @@
2203
2203
  }
2204
2204
  ]
2205
2205
  },
2206
+ {
2207
+ "kind": "javascript-module",
2208
+ "path": "components/buttongroup/buttongroup.component.js",
2209
+ "declarations": [
2210
+ {
2211
+ "kind": "class",
2212
+ "description": "buttongroup component, is a styled wrapper for multiple buttons.\nIt can support icon buttons, combination of icon and pill buttons, and text buttons.\nThey are available in horizontal and vertical orientation.",
2213
+ "name": "ButtonGroup",
2214
+ "cssProperties": [
2215
+ {
2216
+ "description": "The border radius of the buttongroup",
2217
+ "name": "--mdc-buttongroup-border-radius"
2218
+ },
2219
+ {
2220
+ "description": "The border color of the buttongroup",
2221
+ "name": "--mdc-buttongroup-border-color"
2222
+ },
2223
+ {
2224
+ "description": "The color of the divider between buttons within the buttongroup",
2225
+ "name": "--mdc-buttongroup-divider-color"
2226
+ }
2227
+ ],
2228
+ "slots": [
2229
+ {
2230
+ "description": "This is a default/unnamed slot, which contains the buttons",
2231
+ "name": "default"
2232
+ }
2233
+ ],
2234
+ "members": [
2235
+ {
2236
+ "kind": "field",
2237
+ "name": "orientation",
2238
+ "type": {
2239
+ "text": "ButtonGroupOrientation"
2240
+ },
2241
+ "description": "Orientation of the buttongroup.",
2242
+ "default": "'horizontal'",
2243
+ "attribute": "orientation",
2244
+ "reflects": true
2245
+ },
2246
+ {
2247
+ "kind": "field",
2248
+ "name": "variant",
2249
+ "type": {
2250
+ "text": "ButtonGroupVariant"
2251
+ },
2252
+ "description": "Variant of the buttons within the buttongroup.",
2253
+ "default": "'primary'",
2254
+ "attribute": "variant",
2255
+ "reflects": true
2256
+ },
2257
+ {
2258
+ "kind": "field",
2259
+ "name": "size",
2260
+ "type": {
2261
+ "text": "ButtonGroupSize"
2262
+ },
2263
+ "description": "Size of the buttons within the buttongroup.",
2264
+ "default": "'28'",
2265
+ "attribute": "size",
2266
+ "reflects": true
2267
+ },
2268
+ {
2269
+ "kind": "field",
2270
+ "name": "compact",
2271
+ "type": {
2272
+ "text": "boolean"
2273
+ },
2274
+ "default": "false",
2275
+ "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
2276
+ "attribute": "compact",
2277
+ "reflects": true
2278
+ }
2279
+ ],
2280
+ "attributes": [
2281
+ {
2282
+ "name": "orientation",
2283
+ "type": {
2284
+ "text": "ButtonGroupOrientation"
2285
+ },
2286
+ "description": "Orientation of the buttongroup.",
2287
+ "default": "'horizontal'",
2288
+ "fieldName": "orientation"
2289
+ },
2290
+ {
2291
+ "name": "variant",
2292
+ "type": {
2293
+ "text": "ButtonGroupVariant"
2294
+ },
2295
+ "description": "Variant of the buttons within the buttongroup.",
2296
+ "default": "'primary'",
2297
+ "fieldName": "variant"
2298
+ },
2299
+ {
2300
+ "name": "size",
2301
+ "type": {
2302
+ "text": "ButtonGroupSize"
2303
+ },
2304
+ "description": "Size of the buttons within the buttongroup.",
2305
+ "default": "'28'",
2306
+ "fieldName": "size"
2307
+ },
2308
+ {
2309
+ "name": "compact",
2310
+ "type": {
2311
+ "text": "boolean"
2312
+ },
2313
+ "default": "false",
2314
+ "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
2315
+ "fieldName": "compact"
2316
+ }
2317
+ ],
2318
+ "superclass": {
2319
+ "name": "Component",
2320
+ "module": "/src/models"
2321
+ },
2322
+ "tagName": "mdc-buttongroup",
2323
+ "jsDoc": "/**\n * buttongroup component, is a styled wrapper for multiple buttons.\n * It can support icon buttons, combination of icon and pill buttons, and text buttons.\n * They are available in horizontal and vertical orientation.\n *\n * @tagname mdc-buttongroup\n *\n * @slot default - This is a default/unnamed slot, which contains the buttons\n *\n * @cssproperty --mdc-buttongroup-border-radius - The border radius of the buttongroup\n * @cssproperty --mdc-buttongroup-border-color - The border color of the buttongroup\n * @cssproperty --mdc-buttongroup-divider-color - The color of the divider between buttons within the buttongroup\n */",
2324
+ "customElement": true
2325
+ }
2326
+ ],
2327
+ "exports": [
2328
+ {
2329
+ "kind": "js",
2330
+ "name": "default",
2331
+ "declaration": {
2332
+ "name": "ButtonGroup",
2333
+ "module": "components/buttongroup/buttongroup.component.js"
2334
+ }
2335
+ }
2336
+ ]
2337
+ },
2206
2338
  {
2207
2339
  "kind": "javascript-module",
2208
2340
  "path": "components/button/button.component.js",
@@ -2898,138 +3030,6 @@
2898
3030
  }
2899
3031
  ]
2900
3032
  },
2901
- {
2902
- "kind": "javascript-module",
2903
- "path": "components/buttongroup/buttongroup.component.js",
2904
- "declarations": [
2905
- {
2906
- "kind": "class",
2907
- "description": "buttongroup component, is a styled wrapper for multiple buttons.\nIt can support icon buttons, combination of icon and pill buttons, and text buttons.\nThey are available in horizontal and vertical orientation.",
2908
- "name": "ButtonGroup",
2909
- "cssProperties": [
2910
- {
2911
- "description": "The border radius of the buttongroup",
2912
- "name": "--mdc-buttongroup-border-radius"
2913
- },
2914
- {
2915
- "description": "The border color of the buttongroup",
2916
- "name": "--mdc-buttongroup-border-color"
2917
- },
2918
- {
2919
- "description": "The color of the divider between buttons within the buttongroup",
2920
- "name": "--mdc-buttongroup-divider-color"
2921
- }
2922
- ],
2923
- "slots": [
2924
- {
2925
- "description": "This is a default/unnamed slot, which contains the buttons",
2926
- "name": "default"
2927
- }
2928
- ],
2929
- "members": [
2930
- {
2931
- "kind": "field",
2932
- "name": "orientation",
2933
- "type": {
2934
- "text": "ButtonGroupOrientation"
2935
- },
2936
- "description": "Orientation of the buttongroup.",
2937
- "default": "'horizontal'",
2938
- "attribute": "orientation",
2939
- "reflects": true
2940
- },
2941
- {
2942
- "kind": "field",
2943
- "name": "variant",
2944
- "type": {
2945
- "text": "ButtonGroupVariant"
2946
- },
2947
- "description": "Variant of the buttons within the buttongroup.",
2948
- "default": "'primary'",
2949
- "attribute": "variant",
2950
- "reflects": true
2951
- },
2952
- {
2953
- "kind": "field",
2954
- "name": "size",
2955
- "type": {
2956
- "text": "ButtonGroupSize"
2957
- },
2958
- "description": "Size of the buttons within the buttongroup.",
2959
- "default": "'28'",
2960
- "attribute": "size",
2961
- "reflects": true
2962
- },
2963
- {
2964
- "kind": "field",
2965
- "name": "compact",
2966
- "type": {
2967
- "text": "boolean"
2968
- },
2969
- "default": "false",
2970
- "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
2971
- "attribute": "compact",
2972
- "reflects": true
2973
- }
2974
- ],
2975
- "attributes": [
2976
- {
2977
- "name": "orientation",
2978
- "type": {
2979
- "text": "ButtonGroupOrientation"
2980
- },
2981
- "description": "Orientation of the buttongroup.",
2982
- "default": "'horizontal'",
2983
- "fieldName": "orientation"
2984
- },
2985
- {
2986
- "name": "variant",
2987
- "type": {
2988
- "text": "ButtonGroupVariant"
2989
- },
2990
- "description": "Variant of the buttons within the buttongroup.",
2991
- "default": "'primary'",
2992
- "fieldName": "variant"
2993
- },
2994
- {
2995
- "name": "size",
2996
- "type": {
2997
- "text": "ButtonGroupSize"
2998
- },
2999
- "description": "Size of the buttons within the buttongroup.",
3000
- "default": "'28'",
3001
- "fieldName": "size"
3002
- },
3003
- {
3004
- "name": "compact",
3005
- "type": {
3006
- "text": "boolean"
3007
- },
3008
- "default": "false",
3009
- "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
3010
- "fieldName": "compact"
3011
- }
3012
- ],
3013
- "superclass": {
3014
- "name": "Component",
3015
- "module": "/src/models"
3016
- },
3017
- "tagName": "mdc-buttongroup",
3018
- "jsDoc": "/**\n * buttongroup component, is a styled wrapper for multiple buttons.\n * It can support icon buttons, combination of icon and pill buttons, and text buttons.\n * They are available in horizontal and vertical orientation.\n *\n * @tagname mdc-buttongroup\n *\n * @slot default - This is a default/unnamed slot, which contains the buttons\n *\n * @cssproperty --mdc-buttongroup-border-radius - The border radius of the buttongroup\n * @cssproperty --mdc-buttongroup-border-color - The border color of the buttongroup\n * @cssproperty --mdc-buttongroup-divider-color - The color of the divider between buttons within the buttongroup\n */",
3019
- "customElement": true
3020
- }
3021
- ],
3022
- "exports": [
3023
- {
3024
- "kind": "js",
3025
- "name": "default",
3026
- "declaration": {
3027
- "name": "ButtonGroup",
3028
- "module": "components/buttongroup/buttongroup.component.js"
3029
- }
3030
- }
3031
- ]
3032
- },
3033
3033
  {
3034
3034
  "kind": "javascript-module",
3035
3035
  "path": "components/buttonlink/buttonlink.component.js",
@@ -32528,24 +32528,28 @@
32528
32528
  },
32529
32529
  {
32530
32530
  "kind": "javascript-module",
32531
- "path": "components/toggletip/toggletip.component.js",
32531
+ "path": "components/tooltip/tooltip.component.js",
32532
32532
  "declarations": [
32533
32533
  {
32534
32534
  "kind": "class",
32535
- "description": "A toggletip is triggered by clicking a trigger element.\n\nIt can contain interactive content and can be closed by\nclicking outside the toggletip or pressing the escape key.\n\nIt can have optional close button to close the toggletip.\n\nToggletip component uses `mdc-screenreaderannouncer` internally to\nannounce the toggletip text content with screen readers when the toggletip is shown.\n\n`screenreader-announcer-identity` attribute can be used to provide ID of an element\nin DOM to which announcement elements are added. If not set, a visually hidden\ndiv element is created in DOM to which announcement elements are added.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
32536
- "name": "ToggleTip",
32535
+ "description": "A tooltip is triggered by mouse hover or by keyboard focus\nand will disappear upon mouse exit or focus change.\n\nNote: Tooltips cannot contain content that can be focused or interacted with.",
32536
+ "name": "Tooltip",
32537
32537
  "cssProperties": [
32538
32538
  {
32539
- "description": "The maximum width of the toggletip.",
32540
- "name": "--mdc-toggletip-max-width"
32539
+ "description": "The maximum width of the tooltip.",
32540
+ "name": "--mdc-tooltip-max-width"
32541
32541
  },
32542
32542
  {
32543
- "description": "The text color of the toggletip.",
32544
- "name": "--mdc-toggletip-text-color"
32543
+ "description": "The padding of the tooltip.",
32544
+ "name": "--mdc-tooltip-padding"
32545
32545
  },
32546
32546
  {
32547
- "description": "The text color of the toggletip when the color is contrast.",
32548
- "name": "--mdc-toggletip-text-color-contrast"
32547
+ "description": "The text color of the tooltip.",
32548
+ "name": "--mdc-tooltip-text-color"
32549
+ },
32550
+ {
32551
+ "description": "The text color of the tooltip when the color is contrast.",
32552
+ "name": "--mdc-tooltip-text-color-contrast"
32549
32553
  },
32550
32554
  {
32551
32555
  "description": "radius of the arrow border",
@@ -32628,53 +32632,29 @@
32628
32632
  }
32629
32633
  }
32630
32634
  ],
32631
- "slots": [
32632
- {
32633
- "description": "Default slot for the toggletip content",
32634
- "name": "",
32635
- "inheritedFrom": {
32636
- "name": "Popover",
32637
- "module": "src/components/popover/popover.component.ts"
32638
- }
32639
- }
32640
- ],
32641
32635
  "members": [
32642
32636
  {
32643
32637
  "kind": "field",
32644
- "name": "defaultSlotNodes",
32645
- "type": {
32646
- "text": "Array<Node>"
32647
- },
32648
- "privacy": "private"
32649
- },
32650
- {
32651
- "kind": "field",
32652
- "name": "screenreaderAnnouncerIdentity",
32638
+ "name": "tooltipType",
32653
32639
  "type": {
32654
- "text": "string | undefined"
32640
+ "text": "TooltipType"
32655
32641
  },
32656
- "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
32657
- "attribute": "screenreader-announcer-identity",
32642
+ "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
32643
+ "default": "'description'",
32644
+ "attribute": "tooltip-type",
32658
32645
  "reflects": true
32659
32646
  },
32660
32647
  {
32661
32648
  "kind": "field",
32662
- "name": "placement",
32649
+ "name": "defaultSlotNodes",
32663
32650
  "type": {
32664
- "text": "PopoverPlacement"
32651
+ "text": "Array<Node>"
32665
32652
  },
32666
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
32667
- "default": "bottom",
32668
- "attribute": "placement",
32669
- "reflects": true,
32670
- "inheritedFrom": {
32671
- "name": "Popover",
32672
- "module": "components/popover/popover.component.js"
32673
- }
32653
+ "privacy": "private"
32674
32654
  },
32675
32655
  {
32676
32656
  "kind": "method",
32677
- "name": "getToggleTipText",
32657
+ "name": "getTooltipText",
32678
32658
  "privacy": "private",
32679
32659
  "return": {
32680
32660
  "type": {
@@ -32682,6 +32662,37 @@
32682
32662
  }
32683
32663
  }
32684
32664
  },
32665
+ {
32666
+ "kind": "method",
32667
+ "name": "setTooltipType",
32668
+ "privacy": "private",
32669
+ "return": {
32670
+ "type": {
32671
+ "text": "void"
32672
+ }
32673
+ },
32674
+ "parameters": [
32675
+ {
32676
+ "name": "type",
32677
+ "type": {
32678
+ "text": "TooltipType"
32679
+ },
32680
+ "description": "The type to set."
32681
+ }
32682
+ ],
32683
+ "description": "Sets the type attribute for the tooltip component.\nIf the provided type is not included in the TOOLTIP_TYPES,\nit defaults to the value specified in DEFAULTS.TOOLTIP_TYPE."
32684
+ },
32685
+ {
32686
+ "kind": "method",
32687
+ "name": "onIdUpdated",
32688
+ "privacy": "private",
32689
+ "return": {
32690
+ "type": {
32691
+ "text": "void"
32692
+ }
32693
+ },
32694
+ "description": "Updates the tooltip id if it is empty."
32695
+ },
32685
32696
  {
32686
32697
  "kind": "method",
32687
32698
  "name": "onPlacementUpdated",
@@ -32691,7 +32702,27 @@
32691
32702
  "text": "void"
32692
32703
  }
32693
32704
  },
32694
- "description": "Updates the placement attribute if it is not a valid placement.\nDefault placement for toggle tip is top."
32705
+ "description": "Updates the placement attribute if it is not a valid placement.\nOverriding the default from Popover"
32706
+ },
32707
+ {
32708
+ "kind": "method",
32709
+ "name": "onTooltipTypeUpdated",
32710
+ "privacy": "private",
32711
+ "return": {
32712
+ "type": {
32713
+ "text": "void"
32714
+ }
32715
+ },
32716
+ "parameters": [
32717
+ {
32718
+ "name": "changedProperties",
32719
+ "type": {
32720
+ "text": "PropertyValues"
32721
+ },
32722
+ "description": "The changed properties."
32723
+ }
32724
+ ],
32725
+ "description": "Updates the tooltip type attribute and sets the appropriate aria props on the trigger component."
32695
32726
  },
32696
32727
  {
32697
32728
  "kind": "field",
@@ -33284,6 +33315,21 @@
33284
33315
  "module": "components/popover/popover.component.js"
33285
33316
  }
33286
33317
  },
33318
+ {
33319
+ "kind": "field",
33320
+ "name": "placement",
33321
+ "type": {
33322
+ "text": "PopoverPlacement"
33323
+ },
33324
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
33325
+ "default": "bottom",
33326
+ "attribute": "placement",
33327
+ "reflects": true,
33328
+ "inheritedFrom": {
33329
+ "name": "Popover",
33330
+ "module": "components/popover/popover.component.js"
33331
+ }
33332
+ },
33287
33333
  {
33288
33334
  "kind": "field",
33289
33335
  "name": "color",
@@ -33851,7 +33897,7 @@
33851
33897
  ],
33852
33898
  "events": [
33853
33899
  {
33854
- "description": "(React: onShown) This event is dispatched when the toggletip is shown",
33900
+ "description": "(React: onShown) This event is dispatched when the tooltip is shown",
33855
33901
  "name": "shown",
33856
33902
  "reactName": "onShown",
33857
33903
  "inheritedFrom": {
@@ -33860,7 +33906,7 @@
33860
33906
  }
33861
33907
  },
33862
33908
  {
33863
- "description": "(React: onHidden) This event is dispatched when the toggletip is hidden",
33909
+ "description": "(React: onHidden) This event is dispatched when the tooltip is hidden",
33864
33910
  "name": "hidden",
33865
33911
  "reactName": "onHidden",
33866
33912
  "inheritedFrom": {
@@ -33869,7 +33915,7 @@
33869
33915
  }
33870
33916
  },
33871
33917
  {
33872
- "description": "(React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)",
33918
+ "description": "(React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)",
33873
33919
  "name": "created",
33874
33920
  "reactName": "onCreated",
33875
33921
  "inheritedFrom": {
@@ -33878,7 +33924,7 @@
33878
33924
  }
33879
33925
  },
33880
33926
  {
33881
- "description": "(React: onDestroyed) This event is dispatched when the toggletip is destroyed (removed from the DOM)",
33927
+ "description": "(React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)",
33882
33928
  "name": "destroyed",
33883
33929
  "reactName": "onDestroyed",
33884
33930
  "inheritedFrom": {
@@ -33889,25 +33935,13 @@
33889
33935
  ],
33890
33936
  "attributes": [
33891
33937
  {
33892
- "name": "screenreader-announcer-identity",
33893
- "type": {
33894
- "text": "string | undefined"
33895
- },
33896
- "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
33897
- "fieldName": "screenreaderAnnouncerIdentity"
33898
- },
33899
- {
33900
- "name": "placement",
33938
+ "name": "tooltip-type",
33901
33939
  "type": {
33902
- "text": "PopoverPlacement"
33940
+ "text": "TooltipType"
33903
33941
  },
33904
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
33905
- "default": "bottom",
33906
- "fieldName": "placement",
33907
- "inheritedFrom": {
33908
- "name": "Popover",
33909
- "module": "src/components/popover/popover.component.ts"
33910
- }
33942
+ "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
33943
+ "default": "'description'",
33944
+ "fieldName": "tooltipType"
33911
33945
  },
33912
33946
  {
33913
33947
  "name": "should-focus-trap-wrap",
@@ -33961,6 +33995,19 @@
33961
33995
  "module": "src/components/popover/popover.component.ts"
33962
33996
  }
33963
33997
  },
33998
+ {
33999
+ "name": "placement",
34000
+ "type": {
34001
+ "text": "PopoverPlacement"
34002
+ },
34003
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
34004
+ "default": "bottom",
34005
+ "fieldName": "placement",
34006
+ "inheritedFrom": {
34007
+ "name": "Popover",
34008
+ "module": "src/components/popover/popover.component.ts"
34009
+ }
34010
+ },
33964
34011
  {
33965
34012
  "name": "color",
33966
34013
  "type": {
@@ -34291,9 +34338,19 @@
34291
34338
  "name": "Popover",
34292
34339
  "module": "/src/components/popover/popover.component"
34293
34340
  },
34294
- "tagName": "mdc-toggletip",
34295
- "jsDoc": "/**\n * A toggletip is triggered by clicking a trigger element.\n *\n * It can contain interactive content and can be closed by\n * clicking outside the toggletip or pressing the escape key.\n *\n * It can have optional close button to close the toggletip.\n *\n * Toggletip component uses `mdc-screenreaderannouncer` internally to\n * announce the toggletip text content with screen readers when the toggletip is shown.\n *\n * `screenreader-announcer-identity` attribute can be used to provide ID of an element\n * in DOM to which announcement elements are added. If not set, a visually hidden\n * div element is created in DOM to which announcement elements are added.\n *\n * Please refer to the `mdc-screenreaderannouncer` component for more details.\n *\n * @dependency mdc-screenreaderannouncer\n * @dependency mdc-button\n *\n * @tagname mdc-toggletip\n *\n * @event shown - (React: onShown) This event is dispatched when the toggletip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the toggletip is hidden\n * @event created - (React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the toggletip\n * is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-toggletip-max-width - The maximum width of the toggletip.\n * @cssproperty --mdc-toggletip-text-color - The text color of the toggletip.\n * @cssproperty --mdc-toggletip-text-color-contrast - The text color of the toggletip\n * when the color is contrast.\n *\n * @slot - Default slot for the toggletip content\n */",
34296
- "customElement": true
34341
+ "tagName": "mdc-tooltip",
34342
+ "jsDoc": "/**\n * A tooltip is triggered by mouse hover or by keyboard focus\n * and will disappear upon mouse exit or focus change.\n *\n * Note: Tooltips cannot contain content that can be focused or interacted with.\n *\n * @tagname mdc-tooltip\n *\n * @event shown - (React: onShown) This event is dispatched when the tooltip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the tooltip is hidden\n * @event created - (React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-tooltip-max-width - The maximum width of the tooltip.\n * @cssproperty --mdc-tooltip-padding - The padding of the tooltip.\n * @cssproperty --mdc-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --mdc-tooltip-text-color-contrast - The text color of the tooltip when the color is contrast.\n *\n */",
34343
+ "customElement": true,
34344
+ "slots": [
34345
+ {
34346
+ "description": "Default slot for the popover content",
34347
+ "name": "",
34348
+ "inheritedFrom": {
34349
+ "name": "Popover",
34350
+ "module": "src/components/popover/popover.component.ts"
34351
+ }
34352
+ }
34353
+ ]
34297
34354
  }
34298
34355
  ],
34299
34356
  "exports": [
@@ -34301,36 +34358,166 @@
34301
34358
  "kind": "js",
34302
34359
  "name": "default",
34303
34360
  "declaration": {
34304
- "name": "ToggleTip",
34305
- "module": "components/toggletip/toggletip.component.js"
34361
+ "name": "Tooltip",
34362
+ "module": "components/tooltip/tooltip.component.js"
34306
34363
  }
34307
34364
  }
34308
34365
  ]
34309
34366
  },
34310
34367
  {
34311
34368
  "kind": "javascript-module",
34312
- "path": "components/tooltip/tooltip.component.js",
34369
+ "path": "components/virtualizedlist/virtualizedlist.component.js",
34313
34370
  "declarations": [
34314
34371
  {
34315
34372
  "kind": "class",
34316
- "description": "A tooltip is triggered by mouse hover or by keyboard focus\nand will disappear upon mouse exit or focus change.\n\nNote: Tooltips cannot contain content that can be focused or interacted with.",
34317
- "name": "Tooltip",
34318
- "cssProperties": [
34373
+ "description": "`mdc-virtualizedlist` component for creating custom virtualized lists.\nIMPORTANT: This component does not create it's own list/list items.\nUse the setlistdata callback prop to update client state in order to\nPass list/listitems as a child of this component, which this will virtuailze\nThis implementation handles dynamic lists as well as fixed sized lists.\nPlease refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.",
34374
+ "name": "VirtualizedList",
34375
+ "slots": [
34319
34376
  {
34320
- "description": "The maximum width of the tooltip.",
34321
- "name": "--mdc-tooltip-max-width"
34377
+ "description": "Client side List with nested list items.",
34378
+ "name": ""
34379
+ }
34380
+ ],
34381
+ "members": [
34382
+ {
34383
+ "kind": "field",
34384
+ "name": "onscroll",
34385
+ "type": {
34386
+ "text": "((this: GlobalEventHandlers, ev: Event) => void) | null"
34387
+ },
34388
+ "description": "Callback that gets called when user scrolls inside of list. This gives access to the scroll container element\nas well via the event. Particularly useful for\nhandling logic related when the user scrolls to the top or bottom of a list.",
34389
+ "default": "null",
34390
+ "attribute": "onscroll"
34322
34391
  },
34323
34392
  {
34324
- "description": "The padding of the tooltip.",
34325
- "name": "--mdc-tooltip-padding"
34393
+ "kind": "field",
34394
+ "name": "virtualizerProps",
34395
+ "type": {
34396
+ "text": "VirtualizerProps"
34397
+ },
34398
+ "description": "Object that sets and updates the virtualizer with any relevant props.\nThere are two required object props in order to get virtualization to work properly.\ncount - The length of your list that you are virtualizing.\nAs your list grows/shrinks, this component must be updated with the appropriate value\n(Same with any other updated prop).\nestimateSize - A function that returns the estimated size of your items.\nIf your list is fixed, this will just be the size of your items.\nIf your list is dynamic, try to return approximate the size of each item.\n\nA full list of possible props can be in\n[Tanstack Virtualizer API Docs](https://tanstack.com/virtual/latest/docs/api/virtualizer)",
34399
+ "attribute": "virtualizerprops"
34326
34400
  },
34327
34401
  {
34328
- "description": "The text color of the tooltip.",
34329
- "name": "--mdc-tooltip-text-color"
34402
+ "kind": "field",
34403
+ "name": "setlistdata",
34404
+ "type": {
34405
+ "text": "(({ virtualItems, measureElement, listStyle }: SetListDataProps) => void) | null"
34406
+ },
34407
+ "description": "Callback that gets envoked when updates to the virtualizer interally occur.\nThis must be implemented in such a way that this function will trigger update to parent.\n\nvirtualItems - Array that will be what the client displays on screen. Use this to render\na List of your choosing with these items nested inside as your ListItems.\nmeasureElement - Ref to pass to each ListItem rendered client side.\nEach ListItem should also be be passed key and a data-index (which can be found on the virtualItem).\nlistStyle - This should be passed as the style attribute to your List.",
34408
+ "default": "null",
34409
+ "attribute": "setlistdata"
34330
34410
  },
34331
34411
  {
34332
- "description": "The text color of the tooltip when the color is contrast.",
34333
- "name": "--mdc-tooltip-text-color-contrast"
34412
+ "kind": "field",
34413
+ "name": "scrollElementRef",
34414
+ "type": {
34415
+ "text": "Ref<HTMLDivElement>"
34416
+ },
34417
+ "privacy": "public"
34418
+ },
34419
+ {
34420
+ "kind": "field",
34421
+ "name": "virtualizer",
34422
+ "type": {
34423
+ "text": "Virtualizer<Element, Element> | null"
34424
+ },
34425
+ "privacy": "public",
34426
+ "default": "null"
34427
+ },
34428
+ {
34429
+ "kind": "field",
34430
+ "name": "virtualItems",
34431
+ "type": {
34432
+ "text": "Array<VirtualItem>"
34433
+ },
34434
+ "privacy": "public",
34435
+ "default": "[]"
34436
+ },
34437
+ {
34438
+ "kind": "field",
34439
+ "name": "virtualizerController",
34440
+ "type": {
34441
+ "text": "null"
34442
+ },
34443
+ "default": "null"
34444
+ }
34445
+ ],
34446
+ "events": [
34447
+ {
34448
+ "description": "(React: onScroll) Event that gets called when user scrolls inside of list.",
34449
+ "name": "onscroll",
34450
+ "reactName": "onScroll"
34451
+ }
34452
+ ],
34453
+ "attributes": [
34454
+ {
34455
+ "name": "onscroll",
34456
+ "type": {
34457
+ "text": "((this: GlobalEventHandlers, ev: Event) => void) | null"
34458
+ },
34459
+ "description": "Callback that gets called when user scrolls inside of list. This gives access to the scroll container element\nas well via the event. Particularly useful for\nhandling logic related when the user scrolls to the top or bottom of a list.",
34460
+ "default": "null",
34461
+ "fieldName": "onscroll"
34462
+ },
34463
+ {
34464
+ "name": "virtualizerprops",
34465
+ "type": {
34466
+ "text": "VirtualizerProps"
34467
+ },
34468
+ "description": "Object that sets and updates the virtualizer with any relevant props.\nThere are two required object props in order to get virtualization to work properly.\ncount - The length of your list that you are virtualizing.\nAs your list grows/shrinks, this component must be updated with the appropriate value\n(Same with any other updated prop).\nestimateSize - A function that returns the estimated size of your items.\nIf your list is fixed, this will just be the size of your items.\nIf your list is dynamic, try to return approximate the size of each item.\n\nA full list of possible props can be in\n[Tanstack Virtualizer API Docs](https://tanstack.com/virtual/latest/docs/api/virtualizer)",
34469
+ "fieldName": "virtualizerProps"
34470
+ },
34471
+ {
34472
+ "name": "setlistdata",
34473
+ "type": {
34474
+ "text": "(({ virtualItems, measureElement, listStyle }: SetListDataProps) => void) | null"
34475
+ },
34476
+ "description": "Callback that gets envoked when updates to the virtualizer interally occur.\nThis must be implemented in such a way that this function will trigger update to parent.\n\nvirtualItems - Array that will be what the client displays on screen. Use this to render\na List of your choosing with these items nested inside as your ListItems.\nmeasureElement - Ref to pass to each ListItem rendered client side.\nEach ListItem should also be be passed key and a data-index (which can be found on the virtualItem).\nlistStyle - This should be passed as the style attribute to your List.",
34477
+ "default": "null",
34478
+ "fieldName": "setlistdata"
34479
+ }
34480
+ ],
34481
+ "superclass": {
34482
+ "name": "Component",
34483
+ "module": "/src/models"
34484
+ },
34485
+ "tagName": "mdc-virtualizedlist",
34486
+ "jsDoc": "/**\n * `mdc-virtualizedlist` component for creating custom virtualized lists.\n * IMPORTANT: This component does not create it's own list/list items.\n * Use the setlistdata callback prop to update client state in order to\n * Pass list/listitems as a child of this component, which this will virtuailze\n * This implementation handles dynamic lists as well as fixed sized lists.\n * Please refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.\n *\n * @tagname mdc-virtualizedlist\n *\n * @event onscroll - (React: onScroll) Event that gets called when user scrolls inside of list.\n *\n * @slot - Client side List with nested list items.\n */",
34487
+ "customElement": true
34488
+ }
34489
+ ],
34490
+ "exports": [
34491
+ {
34492
+ "kind": "js",
34493
+ "name": "default",
34494
+ "declaration": {
34495
+ "name": "VirtualizedList",
34496
+ "module": "components/virtualizedlist/virtualizedlist.component.js"
34497
+ }
34498
+ }
34499
+ ]
34500
+ },
34501
+ {
34502
+ "kind": "javascript-module",
34503
+ "path": "components/toggletip/toggletip.component.js",
34504
+ "declarations": [
34505
+ {
34506
+ "kind": "class",
34507
+ "description": "A toggletip is triggered by clicking a trigger element.\n\nIt can contain interactive content and can be closed by\nclicking outside the toggletip or pressing the escape key.\n\nIt can have optional close button to close the toggletip.\n\nToggletip component uses `mdc-screenreaderannouncer` internally to\nannounce the toggletip text content with screen readers when the toggletip is shown.\n\n`screenreader-announcer-identity` attribute can be used to provide ID of an element\nin DOM to which announcement elements are added. If not set, a visually hidden\ndiv element is created in DOM to which announcement elements are added.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
34508
+ "name": "ToggleTip",
34509
+ "cssProperties": [
34510
+ {
34511
+ "description": "The maximum width of the toggletip.",
34512
+ "name": "--mdc-toggletip-max-width"
34513
+ },
34514
+ {
34515
+ "description": "The text color of the toggletip.",
34516
+ "name": "--mdc-toggletip-text-color"
34517
+ },
34518
+ {
34519
+ "description": "The text color of the toggletip when the color is contrast.",
34520
+ "name": "--mdc-toggletip-text-color-contrast"
34334
34521
  },
34335
34522
  {
34336
34523
  "description": "radius of the arrow border",
@@ -34413,18 +34600,17 @@
34413
34600
  }
34414
34601
  }
34415
34602
  ],
34416
- "members": [
34603
+ "slots": [
34417
34604
  {
34418
- "kind": "field",
34419
- "name": "tooltipType",
34420
- "type": {
34421
- "text": "TooltipType"
34422
- },
34423
- "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
34424
- "default": "'description'",
34425
- "attribute": "tooltip-type",
34426
- "reflects": true
34427
- },
34605
+ "description": "Default slot for the toggletip content",
34606
+ "name": "",
34607
+ "inheritedFrom": {
34608
+ "name": "Popover",
34609
+ "module": "src/components/popover/popover.component.ts"
34610
+ }
34611
+ }
34612
+ ],
34613
+ "members": [
34428
34614
  {
34429
34615
  "kind": "field",
34430
34616
  "name": "defaultSlotNodes",
@@ -34434,76 +34620,50 @@
34434
34620
  "privacy": "private"
34435
34621
  },
34436
34622
  {
34437
- "kind": "method",
34438
- "name": "getTooltipText",
34439
- "privacy": "private",
34440
- "return": {
34441
- "type": {
34442
- "text": ""
34443
- }
34444
- }
34445
- },
34446
- {
34447
- "kind": "method",
34448
- "name": "setTooltipType",
34449
- "privacy": "private",
34450
- "return": {
34451
- "type": {
34452
- "text": "void"
34453
- }
34623
+ "kind": "field",
34624
+ "name": "screenreaderAnnouncerIdentity",
34625
+ "type": {
34626
+ "text": "string | undefined"
34454
34627
  },
34455
- "parameters": [
34456
- {
34457
- "name": "type",
34458
- "type": {
34459
- "text": "TooltipType"
34460
- },
34461
- "description": "The type to set."
34462
- }
34463
- ],
34464
- "description": "Sets the type attribute for the tooltip component.\nIf the provided type is not included in the TOOLTIP_TYPES,\nit defaults to the value specified in DEFAULTS.TOOLTIP_TYPE."
34628
+ "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
34629
+ "attribute": "screenreader-announcer-identity",
34630
+ "reflects": true
34465
34631
  },
34466
34632
  {
34467
- "kind": "method",
34468
- "name": "onIdUpdated",
34469
- "privacy": "private",
34470
- "return": {
34471
- "type": {
34472
- "text": "void"
34473
- }
34633
+ "kind": "field",
34634
+ "name": "placement",
34635
+ "type": {
34636
+ "text": "PopoverPlacement"
34474
34637
  },
34475
- "description": "Updates the tooltip id if it is empty."
34638
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
34639
+ "default": "bottom",
34640
+ "attribute": "placement",
34641
+ "reflects": true,
34642
+ "inheritedFrom": {
34643
+ "name": "Popover",
34644
+ "module": "components/popover/popover.component.js"
34645
+ }
34476
34646
  },
34477
34647
  {
34478
34648
  "kind": "method",
34479
- "name": "onPlacementUpdated",
34649
+ "name": "getToggleTipText",
34480
34650
  "privacy": "private",
34481
34651
  "return": {
34482
34652
  "type": {
34483
- "text": "void"
34653
+ "text": ""
34484
34654
  }
34485
- },
34486
- "description": "Updates the placement attribute if it is not a valid placement.\nOverriding the default from Popover"
34655
+ }
34487
34656
  },
34488
34657
  {
34489
34658
  "kind": "method",
34490
- "name": "onTooltipTypeUpdated",
34659
+ "name": "onPlacementUpdated",
34491
34660
  "privacy": "private",
34492
34661
  "return": {
34493
34662
  "type": {
34494
34663
  "text": "void"
34495
34664
  }
34496
34665
  },
34497
- "parameters": [
34498
- {
34499
- "name": "changedProperties",
34500
- "type": {
34501
- "text": "PropertyValues"
34502
- },
34503
- "description": "The changed properties."
34504
- }
34505
- ],
34506
- "description": "Updates the tooltip type attribute and sets the appropriate aria props on the trigger component."
34666
+ "description": "Updates the placement attribute if it is not a valid placement.\nDefault placement for toggle tip is top."
34507
34667
  },
34508
34668
  {
34509
34669
  "kind": "field",
@@ -35096,21 +35256,6 @@
35096
35256
  "module": "components/popover/popover.component.js"
35097
35257
  }
35098
35258
  },
35099
- {
35100
- "kind": "field",
35101
- "name": "placement",
35102
- "type": {
35103
- "text": "PopoverPlacement"
35104
- },
35105
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
35106
- "default": "bottom",
35107
- "attribute": "placement",
35108
- "reflects": true,
35109
- "inheritedFrom": {
35110
- "name": "Popover",
35111
- "module": "components/popover/popover.component.js"
35112
- }
35113
- },
35114
35259
  {
35115
35260
  "kind": "field",
35116
35261
  "name": "color",
@@ -35678,7 +35823,7 @@
35678
35823
  ],
35679
35824
  "events": [
35680
35825
  {
35681
- "description": "(React: onShown) This event is dispatched when the tooltip is shown",
35826
+ "description": "(React: onShown) This event is dispatched when the toggletip is shown",
35682
35827
  "name": "shown",
35683
35828
  "reactName": "onShown",
35684
35829
  "inheritedFrom": {
@@ -35687,7 +35832,7 @@
35687
35832
  }
35688
35833
  },
35689
35834
  {
35690
- "description": "(React: onHidden) This event is dispatched when the tooltip is hidden",
35835
+ "description": "(React: onHidden) This event is dispatched when the toggletip is hidden",
35691
35836
  "name": "hidden",
35692
35837
  "reactName": "onHidden",
35693
35838
  "inheritedFrom": {
@@ -35696,7 +35841,7 @@
35696
35841
  }
35697
35842
  },
35698
35843
  {
35699
- "description": "(React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)",
35844
+ "description": "(React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)",
35700
35845
  "name": "created",
35701
35846
  "reactName": "onCreated",
35702
35847
  "inheritedFrom": {
@@ -35705,7 +35850,7 @@
35705
35850
  }
35706
35851
  },
35707
35852
  {
35708
- "description": "(React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)",
35853
+ "description": "(React: onDestroyed) This event is dispatched when the toggletip is destroyed (removed from the DOM)",
35709
35854
  "name": "destroyed",
35710
35855
  "reactName": "onDestroyed",
35711
35856
  "inheritedFrom": {
@@ -35716,13 +35861,25 @@
35716
35861
  ],
35717
35862
  "attributes": [
35718
35863
  {
35719
- "name": "tooltip-type",
35864
+ "name": "screenreader-announcer-identity",
35720
35865
  "type": {
35721
- "text": "TooltipType"
35866
+ "text": "string | undefined"
35722
35867
  },
35723
- "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
35724
- "default": "'description'",
35725
- "fieldName": "tooltipType"
35868
+ "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
35869
+ "fieldName": "screenreaderAnnouncerIdentity"
35870
+ },
35871
+ {
35872
+ "name": "placement",
35873
+ "type": {
35874
+ "text": "PopoverPlacement"
35875
+ },
35876
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
35877
+ "default": "bottom",
35878
+ "fieldName": "placement",
35879
+ "inheritedFrom": {
35880
+ "name": "Popover",
35881
+ "module": "src/components/popover/popover.component.ts"
35882
+ }
35726
35883
  },
35727
35884
  {
35728
35885
  "name": "should-focus-trap-wrap",
@@ -35776,19 +35933,6 @@
35776
35933
  "module": "src/components/popover/popover.component.ts"
35777
35934
  }
35778
35935
  },
35779
- {
35780
- "name": "placement",
35781
- "type": {
35782
- "text": "PopoverPlacement"
35783
- },
35784
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
35785
- "default": "bottom",
35786
- "fieldName": "placement",
35787
- "inheritedFrom": {
35788
- "name": "Popover",
35789
- "module": "src/components/popover/popover.component.ts"
35790
- }
35791
- },
35792
35936
  {
35793
35937
  "name": "color",
35794
35938
  "type": {
@@ -36119,152 +36263,8 @@
36119
36263
  "name": "Popover",
36120
36264
  "module": "/src/components/popover/popover.component"
36121
36265
  },
36122
- "tagName": "mdc-tooltip",
36123
- "jsDoc": "/**\n * A tooltip is triggered by mouse hover or by keyboard focus\n * and will disappear upon mouse exit or focus change.\n *\n * Note: Tooltips cannot contain content that can be focused or interacted with.\n *\n * @tagname mdc-tooltip\n *\n * @event shown - (React: onShown) This event is dispatched when the tooltip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the tooltip is hidden\n * @event created - (React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-tooltip-max-width - The maximum width of the tooltip.\n * @cssproperty --mdc-tooltip-padding - The padding of the tooltip.\n * @cssproperty --mdc-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --mdc-tooltip-text-color-contrast - The text color of the tooltip when the color is contrast.\n *\n */",
36124
- "customElement": true,
36125
- "slots": [
36126
- {
36127
- "description": "Default slot for the popover content",
36128
- "name": "",
36129
- "inheritedFrom": {
36130
- "name": "Popover",
36131
- "module": "src/components/popover/popover.component.ts"
36132
- }
36133
- }
36134
- ]
36135
- }
36136
- ],
36137
- "exports": [
36138
- {
36139
- "kind": "js",
36140
- "name": "default",
36141
- "declaration": {
36142
- "name": "Tooltip",
36143
- "module": "components/tooltip/tooltip.component.js"
36144
- }
36145
- }
36146
- ]
36147
- },
36148
- {
36149
- "kind": "javascript-module",
36150
- "path": "components/virtualizedlist/virtualizedlist.component.js",
36151
- "declarations": [
36152
- {
36153
- "kind": "class",
36154
- "description": "`mdc-virtualizedlist` component for creating custom virtualized lists.\nIMPORTANT: This component does not create it's own list/list items.\nUse the setlistdata callback prop to update client state in order to\nPass list/listitems as a child of this component, which this will virtuailze\nThis implementation handles dynamic lists as well as fixed sized lists.\nPlease refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.",
36155
- "name": "VirtualizedList",
36156
- "slots": [
36157
- {
36158
- "description": "Client side List with nested list items.",
36159
- "name": ""
36160
- }
36161
- ],
36162
- "members": [
36163
- {
36164
- "kind": "field",
36165
- "name": "onscroll",
36166
- "type": {
36167
- "text": "((this: GlobalEventHandlers, ev: Event) => void) | null"
36168
- },
36169
- "description": "Callback that gets called when user scrolls inside of list. This gives access to the scroll container element\nas well via the event. Particularly useful for\nhandling logic related when the user scrolls to the top or bottom of a list.",
36170
- "default": "null",
36171
- "attribute": "onscroll"
36172
- },
36173
- {
36174
- "kind": "field",
36175
- "name": "virtualizerProps",
36176
- "type": {
36177
- "text": "VirtualizerProps"
36178
- },
36179
- "description": "Object that sets and updates the virtualizer with any relevant props.\nThere are two required object props in order to get virtualization to work properly.\ncount - The length of your list that you are virtualizing.\nAs your list grows/shrinks, this component must be updated with the appropriate value\n(Same with any other updated prop).\nestimateSize - A function that returns the estimated size of your items.\nIf your list is fixed, this will just be the size of your items.\nIf your list is dynamic, try to return approximate the size of each item.\n\nA full list of possible props can be in\n[Tanstack Virtualizer API Docs](https://tanstack.com/virtual/latest/docs/api/virtualizer)",
36180
- "attribute": "virtualizerprops"
36181
- },
36182
- {
36183
- "kind": "field",
36184
- "name": "setlistdata",
36185
- "type": {
36186
- "text": "(({ virtualItems, measureElement, listStyle }: SetListDataProps) => void) | null"
36187
- },
36188
- "description": "Callback that gets envoked when updates to the virtualizer interally occur.\nThis must be implemented in such a way that this function will trigger update to parent.\n\nvirtualItems - Array that will be what the client displays on screen. Use this to render\na List of your choosing with these items nested inside as your ListItems.\nmeasureElement - Ref to pass to each ListItem rendered client side.\nEach ListItem should also be be passed key and a data-index (which can be found on the virtualItem).\nlistStyle - This should be passed as the style attribute to your List.",
36189
- "default": "null",
36190
- "attribute": "setlistdata"
36191
- },
36192
- {
36193
- "kind": "field",
36194
- "name": "scrollElementRef",
36195
- "type": {
36196
- "text": "Ref<HTMLDivElement>"
36197
- },
36198
- "privacy": "public"
36199
- },
36200
- {
36201
- "kind": "field",
36202
- "name": "virtualizer",
36203
- "type": {
36204
- "text": "Virtualizer<Element, Element> | null"
36205
- },
36206
- "privacy": "public",
36207
- "default": "null"
36208
- },
36209
- {
36210
- "kind": "field",
36211
- "name": "virtualItems",
36212
- "type": {
36213
- "text": "Array<VirtualItem>"
36214
- },
36215
- "privacy": "public",
36216
- "default": "[]"
36217
- },
36218
- {
36219
- "kind": "field",
36220
- "name": "virtualizerController",
36221
- "type": {
36222
- "text": "null"
36223
- },
36224
- "default": "null"
36225
- }
36226
- ],
36227
- "events": [
36228
- {
36229
- "description": "(React: onScroll) Event that gets called when user scrolls inside of list.",
36230
- "name": "onscroll",
36231
- "reactName": "onScroll"
36232
- }
36233
- ],
36234
- "attributes": [
36235
- {
36236
- "name": "onscroll",
36237
- "type": {
36238
- "text": "((this: GlobalEventHandlers, ev: Event) => void) | null"
36239
- },
36240
- "description": "Callback that gets called when user scrolls inside of list. This gives access to the scroll container element\nas well via the event. Particularly useful for\nhandling logic related when the user scrolls to the top or bottom of a list.",
36241
- "default": "null",
36242
- "fieldName": "onscroll"
36243
- },
36244
- {
36245
- "name": "virtualizerprops",
36246
- "type": {
36247
- "text": "VirtualizerProps"
36248
- },
36249
- "description": "Object that sets and updates the virtualizer with any relevant props.\nThere are two required object props in order to get virtualization to work properly.\ncount - The length of your list that you are virtualizing.\nAs your list grows/shrinks, this component must be updated with the appropriate value\n(Same with any other updated prop).\nestimateSize - A function that returns the estimated size of your items.\nIf your list is fixed, this will just be the size of your items.\nIf your list is dynamic, try to return approximate the size of each item.\n\nA full list of possible props can be in\n[Tanstack Virtualizer API Docs](https://tanstack.com/virtual/latest/docs/api/virtualizer)",
36250
- "fieldName": "virtualizerProps"
36251
- },
36252
- {
36253
- "name": "setlistdata",
36254
- "type": {
36255
- "text": "(({ virtualItems, measureElement, listStyle }: SetListDataProps) => void) | null"
36256
- },
36257
- "description": "Callback that gets envoked when updates to the virtualizer interally occur.\nThis must be implemented in such a way that this function will trigger update to parent.\n\nvirtualItems - Array that will be what the client displays on screen. Use this to render\na List of your choosing with these items nested inside as your ListItems.\nmeasureElement - Ref to pass to each ListItem rendered client side.\nEach ListItem should also be be passed key and a data-index (which can be found on the virtualItem).\nlistStyle - This should be passed as the style attribute to your List.",
36258
- "default": "null",
36259
- "fieldName": "setlistdata"
36260
- }
36261
- ],
36262
- "superclass": {
36263
- "name": "Component",
36264
- "module": "/src/models"
36265
- },
36266
- "tagName": "mdc-virtualizedlist",
36267
- "jsDoc": "/**\n * `mdc-virtualizedlist` component for creating custom virtualized lists.\n * IMPORTANT: This component does not create it's own list/list items.\n * Use the setlistdata callback prop to update client state in order to\n * Pass list/listitems as a child of this component, which this will virtuailze\n * This implementation handles dynamic lists as well as fixed sized lists.\n * Please refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.\n *\n * @tagname mdc-virtualizedlist\n *\n * @event onscroll - (React: onScroll) Event that gets called when user scrolls inside of list.\n *\n * @slot - Client side List with nested list items.\n */",
36266
+ "tagName": "mdc-toggletip",
36267
+ "jsDoc": "/**\n * A toggletip is triggered by clicking a trigger element.\n *\n * It can contain interactive content and can be closed by\n * clicking outside the toggletip or pressing the escape key.\n *\n * It can have optional close button to close the toggletip.\n *\n * Toggletip component uses `mdc-screenreaderannouncer` internally to\n * announce the toggletip text content with screen readers when the toggletip is shown.\n *\n * `screenreader-announcer-identity` attribute can be used to provide ID of an element\n * in DOM to which announcement elements are added. If not set, a visually hidden\n * div element is created in DOM to which announcement elements are added.\n *\n * Please refer to the `mdc-screenreaderannouncer` component for more details.\n *\n * @dependency mdc-screenreaderannouncer\n * @dependency mdc-button\n *\n * @tagname mdc-toggletip\n *\n * @event shown - (React: onShown) This event is dispatched when the toggletip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the toggletip is hidden\n * @event created - (React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the toggletip\n * is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-toggletip-max-width - The maximum width of the toggletip.\n * @cssproperty --mdc-toggletip-text-color - The text color of the toggletip.\n * @cssproperty --mdc-toggletip-text-color-contrast - The text color of the toggletip\n * when the color is contrast.\n *\n * @slot - Default slot for the toggletip content\n */",
36268
36268
  "customElement": true
36269
36269
  }
36270
36270
  ],
@@ -36273,8 +36273,8 @@
36273
36273
  "kind": "js",
36274
36274
  "name": "default",
36275
36275
  "declaration": {
36276
- "name": "VirtualizedList",
36277
- "module": "components/virtualizedlist/virtualizedlist.component.js"
36276
+ "name": "ToggleTip",
36277
+ "module": "components/toggletip/toggletip.component.js"
36278
36278
  }
36279
36279
  }
36280
36280
  ]