@bethinkpl/design-system 24.1.0 → 24.2.0

package/dist/design-system.umd.js

@@ -34267,7 +34267,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `@keyframes a-spinAround-162c1806{0%{tr
 
 /***/ }),
 
-/***/ 65120:
+/***/ 93417:
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
@@ -34284,7 +34284,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.ds-basicRichListItem[data-v-56540a80]{max-width:100%}.ds-basicRichListItem__content[data-v-56540a80]{display:flex;flex-direction:column;gap:4px;justify-content:center;min-width:0;padding:12px 0}.ds-basicRichListItem__eyebrow[data-v-56540a80]{--token:info-s-default-bold;letter-spacing:var(--typography-letter-spacing-m);text-transform:var(--typography-text-transform-none);color:var(--color-neutral-text-weak);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-basicRichListItem__eyebrow[data-v-56540a80],.ds-basicRichListItem__eyebrow.-ds-uppercase[data-v-56540a80]{font-weight:var(--typography-font-weight-bold);font-style:var(--typography-font-style-normal);line-height:var(--typography-line-height-4xs);font-size:var(--typography-font-size-2xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none)}.ds-basicRichListItem__eyebrow.-ds-uppercase[data-v-56540a80]{--token:info-s-extensive-bold-uppercase;letter-spacing:var(--typography-letter-spacing-xl);text-transform:var(--typography-text-transform-uppercase)}.ds-basicRichListItem__eyebrow[data-v-56540a80]:hover{color:var(--color-neutral-text-weak-hovered)}.ds-basicRichListItem__text[data-v-56540a80]{--token:text-m-compact-bold;font-weight:var(--typography-font-weight-bold);font-style:var(--typography-font-style-normal);line-height:var(--typography-line-height-xs);font-size:var(--typography-font-size-s);letter-spacing:var(--typography-letter-spacing-xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none);text-transform:var(--typography-text-transform-none);-ms-overflow-style:none;scrollbar-width:none;color:var(--color-neutral-text);min-width:0;overflow-x:scroll;white-space:nowrap}.ds-basicRichListItem__text[data-v-56540a80]::-webkit-scrollbar{display:none}@media(min-width:760px){.ds-basicRichListItem__text[data-v-56540a80]{overflow:hidden;text-overflow:ellipsis}}.ds-basicRichListItem__text[data-v-56540a80]:hover{color:var(--color-neutral-text-hovered)}.ds-basicRichListItem.-ds-small .ds-basicRichListItem__content[data-v-56540a80]{padding:6px 0}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.ds-basicRichListItem[data-v-06c6cb9a]{max-width:100%}.ds-basicRichListItem__content[data-v-06c6cb9a]{display:flex;flex-direction:column;gap:4px;justify-content:center;min-width:0;padding:12px 0}.ds-basicRichListItem.-ds-small .ds-basicRichListItem__content[data-v-06c6cb9a]{padding:8px 0}`, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -34697,6 +34697,30 @@ ___CSS_LOADER_EXPORT___.push([module.id, `@keyframes a-spinAround-6d6ed105{0%{tr
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
 
+/***/ }),
+
+/***/ 14012:
+/***/ ((module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(43481);
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2400);
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
+// Imports
+
+
+var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
+// Module
+___CSS_LOADER_EXPORT___.push([module.id, `.ds-textGroup{display:flex;flex-direction:column;width:100%}.ds-textGroup.-ds-neutral .ds-textGroup__eyebrow{color:var(--color-neutral-text-weak)}.ds-textGroup.-ds-neutral .ds-textGroup__main{color:var(--color-neutral-text-strong)}.ds-textGroup.-ds-neutral .ds-textGroup__supporting{color:var(--color-neutral-text)}.ds-textGroup.-ds-neutral.-ds-hovered .ds-textGroup__eyebrow,.ds-textGroup.-ds-neutral.-ds-interactive:hover .ds-textGroup__eyebrow{color:var(--color-neutral-text-weak-hovered)}.ds-textGroup.-ds-neutral.-ds-hovered .ds-textGroup__main,.ds-textGroup.-ds-neutral.-ds-interactive:hover .ds-textGroup__main{color:var(--color-neutral-text-strong-hovered)}.ds-textGroup.-ds-neutral.-ds-hovered .ds-textGroup__supporting,.ds-textGroup.-ds-neutral.-ds-interactive:hover .ds-textGroup__supporting{color:var(--color-neutral-text-hovered)}.ds-textGroup.-ds-neutral.-ds-disabled{pointer-events:none}.ds-textGroup.-ds-neutral.-ds-disabled .ds-textGroup__eyebrow{color:var(--color-neutral-text-weak-disabled)}.ds-textGroup.-ds-neutral.-ds-disabled .ds-textGroup__main{color:var(--color-neutral-text-strong-disabled)}.ds-textGroup.-ds-neutral.-ds-disabled .ds-textGroup__supporting{color:var(--color-neutral-text-disabled)}.ds-textGroup.-ds-neutral.-ds-selected .ds-textGroup__main{color:var(--color-primary-text)}.ds-textGroup.-ds-neutral.-ds-selected.-ds-hovered .ds-textGroup__main,.ds-textGroup.-ds-neutral.-ds-selected.-ds-interactive:hover .ds-textGroup__main{color:var(--color-primary-text-hovered)}.ds-textGroup.-ds-neutral.-ds-selected.-ds-disabled .ds-textGroup__main{color:var(--color-primary-text-disabled)}.ds-textGroup__eyebrow{--token:info-s-default-bold;letter-spacing:var(--typography-letter-spacing-m);text-transform:var(--typography-text-transform-none);margin-bottom:2px}.ds-textGroup__eyebrow,.ds-textGroup__eyebrow.-ds-uppercase{font-weight:var(--typography-font-weight-bold);font-style:var(--typography-font-style-normal);line-height:var(--typography-line-height-4xs);font-size:var(--typography-font-size-2xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none)}.ds-textGroup__eyebrow.-ds-uppercase{--token:info-s-extensive-bold-uppercase;letter-spacing:var(--typography-letter-spacing-xl);text-transform:var(--typography-text-transform-uppercase)}.ds-textGroup__main{--token:text-m-compact-bold;font-weight:var(--typography-font-weight-bold);line-height:var(--typography-line-height-xs);font-size:var(--typography-font-size-s)}.ds-textGroup__main,.ds-textGroup__supporting{font-style:var(--typography-font-style-normal);letter-spacing:var(--typography-letter-spacing-xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none);text-transform:var(--typography-text-transform-none)}.ds-textGroup__supporting{--token:text-s-compact-regular;font-weight:var(--typography-font-weight-normal);line-height:var(--typography-line-height-2xs);font-size:var(--typography-font-size-xs)}.ds-textGroup__eyebrow.-ds-ellipsis,.ds-textGroup__main.-ds-ellipsis,.ds-textGroup__supporting.-ds-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-textGroup.-ds-small .ds-textGroup__eyebrow{--token:info-xs-default-bold;letter-spacing:var(--typography-letter-spacing-m);text-transform:var(--typography-text-transform-none);margin-bottom:0}.ds-textGroup.-ds-small .ds-textGroup__eyebrow,.ds-textGroup.-ds-small .ds-textGroup__eyebrow.-ds-uppercase{font-weight:var(--typography-font-weight-bold);font-style:var(--typography-font-style-normal);line-height:var(--typography-line-height-5xs);font-size:var(--typography-font-size-3xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none)}.ds-textGroup.-ds-small .ds-textGroup__eyebrow.-ds-uppercase{--token:info-xs-extensive-bold-uppercase;letter-spacing:var(--typography-letter-spacing-xl);text-transform:var(--typography-text-transform-uppercase)}.ds-textGroup.-ds-small .ds-textGroup__main{--token:text-s-compact-bold;font-weight:var(--typography-font-weight-bold);font-style:var(--typography-font-style-normal);line-height:var(--typography-line-height-2xs);font-size:var(--typography-font-size-xs);letter-spacing:var(--typography-letter-spacing-xs);-webkit-text-decoration:var(--typography-text-decoration-none);text-decoration:var(--typography-text-decoration-none);text-transform:var(--typography-text-transform-none)}.ds-textGroup.-ds-hovered,.ds-textGroup.-ds-interactive:hover{cursor:pointer}.ds-textGroup.-ds-disabled,.ds-textGroup.-ds-loading{pointer-events:none}.ds-textGroup.-ds-loading .ds-textGroup__eyebrow,.ds-textGroup.-ds-loading .ds-textGroup__main,.ds-textGroup.-ds-loading .ds-textGroup__supporting{align-items:center;display:flex;height:1.25em;height:1lh}.ds-textGroup.-ds-loading .ds-textGroup__skeletonWrapper{height:1em;width:100%}.ds-textGroup.-ds-loading-small{width:50%}.ds-textGroup.-ds-loading-medium{width:70%}`, ""]);
+// Exports
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
+
+
 /***/ }),
 
 /***/ 18888:
@@ -36515,12 +36539,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _BasicRichListItem_vue_vue_type_template_id_56540a80_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(42392);
+/* harmony import */ var _BasicRichListItem_vue_vue_type_template_id_06c6cb9a_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(50551);
 /* harmony import */ var _BasicRichListItem_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(53989);
 /* harmony reexport (unknown) */ var __WEBPACK_REEXPORT_OBJECT__ = {};
 /* harmony reexport (unknown) */ for(const __WEBPACK_IMPORT_KEY__ in _BasicRichListItem_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== "default") __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = () => _BasicRichListItem_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__[__WEBPACK_IMPORT_KEY__]
 /* harmony reexport (unknown) */ __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-/* harmony import */ var _BasicRichListItem_vue_vue_type_style_index_0_id_56540a80_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(78199);
+/* harmony import */ var _BasicRichListItem_vue_vue_type_style_index_0_id_06c6cb9a_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(35633);
 /* harmony import */ var _node_modules_vue_cli_service_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(48118);
 
 
@@ -36529,7 +36553,7 @@ __webpack_require__.r(__webpack_exports__);
 ;
 
 
-const __exports__ = /*#__PURE__*/(0,_node_modules_vue_cli_service_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)(_BasicRichListItem_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__["default"], [['render',_BasicRichListItem_vue_vue_type_template_id_56540a80_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__/* .render */ .s],['__scopeId',"data-v-56540a80"]])
+const __exports__ = /*#__PURE__*/(0,_node_modules_vue_cli_service_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)(_BasicRichListItem_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__["default"], [['render',_BasicRichListItem_vue_vue_type_template_id_06c6cb9a_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__/* .render */ .s],['__scopeId',"data-v-06c6cb9a"]])
 
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (__exports__);
 
@@ -37126,6 +37150,34 @@ const __exports__ = /*#__PURE__*/(0,_node_modules_vue_cli_service_node_modules_v
 
 /***/ }),
 
+/***/ 5930:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _TextGroup_vue_vue_type_template_id_a9d20e16_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(15686);
+/* harmony import */ var _TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(38882);
+/* harmony reexport (unknown) */ var __WEBPACK_REEXPORT_OBJECT__ = {};
+/* harmony reexport (unknown) */ for(const __WEBPACK_IMPORT_KEY__ in _TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== "default") __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = () => _TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__[__WEBPACK_IMPORT_KEY__]
+/* harmony reexport (unknown) */ __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+/* harmony import */ var _TextGroup_vue_vue_type_style_index_0_id_a9d20e16_lang_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(99630);
+/* harmony import */ var _node_modules_vue_cli_service_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(48118);
+
+
+
+
+;
+
+
+const __exports__ = /*#__PURE__*/(0,_node_modules_vue_cli_service_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)(_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_1__["default"], [['render',_TextGroup_vue_vue_type_template_id_a9d20e16_ts_true__WEBPACK_IMPORTED_MODULE_0__/* .render */ .s]])
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (__exports__);
+
+/***/ }),
+
 /***/ 6655:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
@@ -38123,6 +38175,23 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony reexport (unknown) */ __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
  
 
+/***/ }),
+
+/***/ 38882:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* reexport default from dynamic */ _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0___default.a)
+/* harmony export */ });
+/* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7177);
+/* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony reexport (unknown) */ var __WEBPACK_REEXPORT_OBJECT__ = {};
+/* harmony reexport (unknown) */ for(const __WEBPACK_IMPORT_KEY__ in _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== "default") __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = () => _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_script_lang_ts__WEBPACK_IMPORTED_MODULE_0__[__WEBPACK_IMPORT_KEY__]
+/* harmony reexport (unknown) */ __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+ 
+
 /***/ }),
 
 /***/ 27099:
@@ -38560,14 +38629,14 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ 42392:
+/***/ 50551:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   s: () => (/* reexport safe */ _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_template_id_56540a80_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__.s)
+/* harmony export */   s: () => (/* reexport safe */ _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_template_id_06c6cb9a_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__.s)
 /* harmony export */ });
-/* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_template_id_56540a80_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(26072);
+/* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_template_id_06c6cb9a_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1882);
 
 
 /***/ }),
@@ -38738,6 +38807,18 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TabItem_vue_vue_type_template_id_6d6ed105_scoped_true_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(18938);
 
 
+/***/ }),
+
+/***/ 15686:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   s: () => (/* reexport safe */ _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_template_id_a9d20e16_ts_true__WEBPACK_IMPORTED_MODULE_0__.s)
+/* harmony export */ });
+/* harmony import */ var _node_modules_ts_loader_index_js_clonedRuleSet_40_use_0_node_modules_vue_cli_service_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_3_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_template_id_a9d20e16_ts_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(49176);
+
+
 /***/ }),
 
 /***/ 21341:
@@ -39066,12 +39147,12 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ 78199:
+/***/ 35633:
 /***/ ((__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) => {
 
 "use strict";
-/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_56540a80_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(15514);
-/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_56540a80_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_56540a80_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_06c6cb9a_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(57789);
+/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_06c6cb9a_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BasicRichListItem_vue_vue_type_style_index_0_id_06c6cb9a_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
 
 
 /***/ }),
@@ -39194,6 +39275,16 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TabItem_vue_vue_type_style_index_0_id_6d6ed105_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TabItem_vue_vue_type_style_index_0_id_6d6ed105_scoped_true_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
 
 
+/***/ }),
+
+/***/ 99630:
+/***/ ((__unused_webpack_module, __unused_webpack___webpack_exports__, __webpack_require__) => {
+
+"use strict";
+/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_style_index_0_id_a9d20e16_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(15582);
+/* harmony import */ var _node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_style_index_0_id_a9d20e16_lang_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_clonedRuleSet_22_use_0_node_modules_vue_cli_service_node_modules_css_loader_dist_cjs_js_clonedRuleSet_22_use_1_node_modules_vue_cli_service_node_modules_vue_loader_dist_stylePostLoader_js_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_2_node_modules_postcss_loader_dist_cjs_js_clonedRuleSet_22_use_3_node_modules_sass_loader_dist_cjs_js_clonedRuleSet_22_use_4_node_modules_vue_cli_service_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TextGroup_vue_vue_type_style_index_0_id_a9d20e16_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
+
+
 /***/ }),
 
 /***/ 36005:
@@ -46739,6 +46830,65 @@ exports["default"] = TabItem_vue_1.default;
 __exportStar(__webpack_require__(39446), exports);
 
 
+/***/ }),
+
+/***/ 69565:
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.TEXT_GROUP_STATES = exports.TEXT_GROUP_SIZES = exports.TEXT_GROUP_LOADING_SIZES = exports.TEXT_GROUP_COLORS = void 0;
+exports.TEXT_GROUP_COLORS = {
+    NEUTRAL: 'neutral',
+};
+exports.TEXT_GROUP_LOADING_SIZES = {
+    SMALL: 'small',
+    MEDIUM: 'medium',
+    LARGE: 'large',
+};
+exports.TEXT_GROUP_SIZES = {
+    SMALL: 'small',
+    MEDIUM: 'medium',
+};
+exports.TEXT_GROUP_STATES = {
+    DEFAULT: 'default',
+    HOVERED: 'hovered',
+    DISABLED: 'disabled',
+    LOADING: 'loading',
+};
+
+
+/***/ }),
+
+/***/ 18977:
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+const TextGroup_vue_1 = __importDefault(__webpack_require__(5930));
+exports["default"] = TextGroup_vue_1.default;
+__exportStar(__webpack_require__(69565), exports);
+
+
 /***/ }),
 
 /***/ 56631:
@@ -47612,7 +47762,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.DrawerContent = exports.DsDrawer = exports.Drawer = exports.DsSectionTitle = exports.SectionTitle = exports.DsPageHeader = exports.PageHeader = exports.DsSectionHeader = exports.SectionHeader = exports.DsSurveyQuestionOpenEnded = exports.SurveyQuestionOpenEnded = exports.DsSurveyQuestionScale = exports.SurveyQuestionScale = exports.DsSurveyToggle = exports.SurveyToggle = exports.DsBlockadeStatus = exports.BlockadeStatus = exports.DsAccessStatus = exports.AccessStatus = exports.DsTile = exports.Tile = exports.DsTabItem = exports.TabItem = exports.DsNumberInCircle = exports.NumberInCircle = exports.DsModalDialog = exports.DsModal = exports.Modal = exports.DsIconButton = exports.IconButton = exports.DsIcon = exports.Icon = exports.DsFeatureIcon = exports.FeatureIcon = exports.DsDivider = exports.Divider = exports.DsDatePicker = exports.DatePicker = exports.DsCardExpandable = exports.CardExpandable = exports.DsCard = exports.Card = exports.DsToggleButton = exports.ToggleButton = exports.DsButton = exports.Button = exports.DsBanner = exports.Banner = exports.DsBadgeScore = exports.BadgeScore = void 0;
 exports.Pagination = exports.DsIconText = exports.IconText = exports.DsProgressDonutChart = exports.ProgressDonutChart = exports.DsProgressBar = exports.ProgressBar = exports.DsDropdown = exports.Dropdown = exports.DsPopOver = exports.PopOver = exports.DsLoadingBar = exports.LoadingBar = exports.DsSelectionTile = exports.SelectionTile = exports.DsSelectListSectionTitle = exports.SelectListSectionTitle = exports.DsSelectListItemTile = exports.SelectListItemTile = exports.DsSelectListItemToggle = exports.SelectListItemToggle = exports.DsSelectListItemDivider = exports.SelectListItemDivider = exports.DsSelectListItem = exports.SelectListItem = exports.DsSelectList = exports.SelectList = exports.DsCounterToggle = exports.CounterToggle = exports.DsChip = exports.Chip = exports.DsOutlineSectionHeader = exports.OutlineSectionHeader = exports.DsOutlineDivider = exports.OutlineDivider = exports.DsOutlineItem = exports.OutlineItem = exports.DsDrawerSection = exports.DrawerSection = exports.DsDrawerTile = exports.DrawerTile = exports.DsDrawerListItemGroup = exports.DrawerListItemGroup = exports.DsDrawerListItem = exports.DrawerListItem = exports.DsDrawerHeader = exports.DrawerHeader = exports.DsDrawerDivider = exports.DrawerDivider = exports.DsDrawerContent = void 0;
-exports.initializeIconsWithDomWatcher = exports.initializeIcons = exports.initializePrimeVue = exports.DsSkeleton = exports.DsImage = exports.DsTooltip = exports.DsSwitch = exports.Switch = exports.DsGroupRichListItem = exports.GroupRichListItem = exports.DsBasicRichListItem = exports.BasicRichListItem = exports.DsRichListItem = exports.RichListItem = exports.DsThreeColumnLayout = exports.ThreeColumnLayout = exports.DsWell = exports.Well = exports.DsOverlayHeader = exports.OverlayHeader = exports.DsPagination = void 0;
+exports.initializeIconsWithDomWatcher = exports.initializeIcons = exports.initializePrimeVue = exports.DsSkeleton = exports.DsImage = exports.DsTooltip = exports.DsTextGroup = exports.DsSwitch = exports.Switch = exports.DsGroupRichListItem = exports.GroupRichListItem = exports.DsBasicRichListItem = exports.BasicRichListItem = exports.DsRichListItem = exports.RichListItem = exports.DsThreeColumnLayout = exports.ThreeColumnLayout = exports.DsWell = exports.Well = exports.DsOverlayHeader = exports.OverlayHeader = exports.DsPagination = void 0;
 var BadgeScore_1 = __webpack_require__(10540);
 Object.defineProperty(exports, "BadgeScore", ({ enumerable: true, get: function () { return __importDefault(BadgeScore_1).default; } }));
 var BadgeScore_2 = __webpack_require__(10540);
@@ -47883,6 +48033,9 @@ Object.defineProperty(exports, "Switch", ({ enumerable: true, get: function () {
 var Switch_2 = __webpack_require__(60926);
 Object.defineProperty(exports, "DsSwitch", ({ enumerable: true, get: function () { return __importDefault(Switch_2).default; } }));
 __exportStar(__webpack_require__(54077), exports);
+var TextGroup_1 = __webpack_require__(18977);
+Object.defineProperty(exports, "DsTextGroup", ({ enumerable: true, get: function () { return __importDefault(TextGroup_1).default; } }));
+__exportStar(__webpack_require__(69565), exports);
 var Tooltip_1 = __webpack_require__(79301);
 Object.defineProperty(exports, "DsTooltip", ({ enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } }));
 __exportStar(__webpack_require__(69846), exports);
@@ -51685,13 +51838,19 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 const RichListItem_1 = __importStar(__webpack_require__(98513));
+const TextGroup_vue_1 = __importDefault(__webpack_require__(5930));
 const vue_1 = __webpack_require__(77203);
 const Icon_1 = __webpack_require__(32411);
+const TextGroup_1 = __webpack_require__(18977);
 exports["default"] = {
     name: 'BasicRichListItem',
     components: {
+        DsTextGroup: TextGroup_vue_1.default,
         RichListItem: RichListItem_1.default,
     },
     props: {
@@ -51761,14 +51920,30 @@ exports["default"] = {
             type: String,
             required: true,
         },
+        textEllipsis: {
+            type: Boolean,
+            default: false,
+        },
         eyebrow: {
             type: String,
             default: null,
         },
+        eyebrowEllipsis: {
+            type: Boolean,
+            default: false,
+        },
         isEyebrowUppercase: {
             type: Boolean,
             default: false,
         },
+        supportingText: {
+            type: String,
+            default: null,
+        },
+        supportingTextEllipsis: {
+            type: Boolean,
+            default: false,
+        },
         backgroundColor: {
             type: String,
             default: RichListItem_1.RICH_LIST_ITEM_BACKGROUND_COLOR.NEUTRAL,
@@ -51805,9 +51980,28 @@ exports["default"] = {
     },
     data() {
         return {
+            hovered: false,
             RICH_LIST_ITEM_SIZE: Object.freeze(RichListItem_1.RICH_LIST_ITEM_SIZE),
         };
     },
+    computed: {
+        textGroupSize() {
+            const map = {
+                [RichListItem_1.RICH_LIST_ITEM_SIZE.SMALL]: TextGroup_1.TEXT_GROUP_SIZES.SMALL,
+                [RichListItem_1.RICH_LIST_ITEM_SIZE.MEDIUM]: TextGroup_1.TEXT_GROUP_SIZES.MEDIUM,
+            };
+            return map[this.size];
+        },
+        textGroupState() {
+            if (this.hovered && this.isInteractive) {
+                return TextGroup_1.TEXT_GROUP_STATES.HOVERED;
+            }
+            if (this.state === RichListItem_1.RICH_LIST_ITEM_STATE.LOADING) {
+                return TextGroup_1.TEXT_GROUP_STATES.LOADING;
+            }
+            return TextGroup_1.TEXT_GROUP_STATES.DEFAULT;
+        },
+    },
 };
 
 
@@ -53319,6 +53513,99 @@ exports["default"] = {
 };
 
 
+/***/ }),
+
+/***/ 7177:
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+const vue_1 = __webpack_require__(77203);
+const Skeleton_vue_1 = __importDefault(__webpack_require__(23465));
+const TextGroup_consts_1 = __webpack_require__(69565);
+exports["default"] = (0, vue_1.defineComponent)({
+    name: 'TextGroup',
+    components: {
+        DsSkeleton: Skeleton_vue_1.default,
+    },
+    props: {
+        size: {
+            type: String,
+            default: TextGroup_consts_1.TEXT_GROUP_SIZES.MEDIUM,
+        },
+        color: {
+            type: String,
+            default: TextGroup_consts_1.TEXT_GROUP_COLORS.NEUTRAL,
+        },
+        eyebrowText: {
+            type: String,
+            default: null,
+        },
+        eyebrowTextEllipsis: {
+            type: Boolean,
+            default: false,
+        },
+        isEyebrowTextUppercase: {
+            type: Boolean,
+            default: true,
+        },
+        mainText: {
+            type: String,
+            default: null,
+        },
+        mainTextEllipsis: {
+            type: Boolean,
+            default: false,
+        },
+        supportingText: {
+            type: String,
+            default: null,
+        },
+        supportingTextEllipsis: {
+            type: Boolean,
+            default: false,
+        },
+        isInteractive: {
+            type: Boolean,
+            default: true,
+        },
+        skeletonLoadingSize: {
+            type: String,
+            default: TextGroup_consts_1.TEXT_GROUP_LOADING_SIZES.LARGE,
+        },
+        isSelected: {
+            type: Boolean,
+            default: false,
+        },
+        state: {
+            type: String,
+            default: TextGroup_consts_1.TEXT_GROUP_STATES.DEFAULT,
+        },
+    },
+    data() {
+        return {
+            TEXT_GROUP_SIZES: Object.freeze(TextGroup_consts_1.TEXT_GROUP_SIZES),
+            TEXT_GROUP_STATES: Object.freeze(TextGroup_consts_1.TEXT_GROUP_STATES),
+        };
+    },
+    computed: {
+        colorClassName() {
+            return `-ds-${this.color}`;
+        },
+        isLoading() {
+            return this.state === TextGroup_consts_1.TEXT_GROUP_STATES.LOADING;
+        },
+        loadingSizeClassName() {
+            return `-ds-loading-${this.skeletonLoadingSize}`;
+        },
+    },
+});
+
+
 /***/ }),
 
 /***/ 80691:
@@ -56217,7 +56504,7 @@ exports.s = render;
 
 /***/ }),
 
-/***/ 26072:
+/***/ 1882:
 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
 "use strict";
@@ -56226,10 +56513,10 @@ var __webpack_unused_export__;
 __webpack_unused_export__ = ({ value: true });
 exports.s = void 0;
 const vue_1 = __webpack_require__(77203);
-const _withScopeId = n => ((0, vue_1.pushScopeId)("data-v-56540a80"), n = n(), (0, vue_1.popScopeId)(), n);
+const _withScopeId = n => ((0, vue_1.pushScopeId)("data-v-06c6cb9a"), n = n(), (0, vue_1.popScopeId)(), n);
 const _hoisted_1 = { class: "ds-basicRichListItem__content" };
-const _hoisted_2 = { class: "ds-basicRichListItem__text" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
+    const _component_ds_text_group = (0, vue_1.resolveComponent)("ds-text-group");
     const _component_rich_list_item = (0, vue_1.resolveComponent)("rich-list-item");
     return ((0, vue_1.openBlock)(), (0, vue_1.createBlock)(_component_rich_list_item, {
         size: $props.size,
@@ -56252,17 +56539,25 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         class: (0, vue_1.normalizeClass)(["ds-basicRichListItem", {
                 '-ds-small': $props.size === $data.RICH_LIST_ITEM_SIZE.SMALL,
             }]),
-        "onUpdate:isSelected": _cache[0] || (_cache[0] = ($event) => (_ctx.$emit('update:is-selected', $event)))
+        onMouseover: _cache[0] || (_cache[0] = ($event) => ($data.hovered = true)),
+        onMouseleave: _cache[1] || (_cache[1] = ($event) => ($data.hovered = false)),
+        "onUpdate:isSelected": _cache[2] || (_cache[2] = ($event) => (_ctx.$emit('update:is-selected', $event)))
     }, (0, vue_1.createSlots)({
         content: (0, vue_1.withCtx)(() => [
             (0, vue_1.createElementVNode)("div", _hoisted_1, [
-                ($props.eyebrow)
-                    ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
-                        key: 0,
-                        class: (0, vue_1.normalizeClass)(["ds-basicRichListItem__eyebrow", { '-ds-uppercase': $props.isEyebrowUppercase }])
-                    }, (0, vue_1.toDisplayString)($props.eyebrow), 3))
-                    : (0, vue_1.createCommentVNode)("", true),
-                (0, vue_1.createElementVNode)("div", _hoisted_2, (0, vue_1.toDisplayString)($props.text), 1)
+                (0, vue_1.createVNode)(_component_ds_text_group, {
+                    "eyebrow-text": $props.eyebrow,
+                    "eyebrow-text-ellipsis": $props.eyebrowEllipsis,
+                    "is-eyebrow-text-uppercase": $props.isEyebrowUppercase,
+                    "is-selected": $props.isSelected,
+                    "is-interactive": false,
+                    "main-text": $props.text,
+                    "main-text-ellipsis": $props.textEllipsis,
+                    "supporting-text": $props.supportingText,
+                    "supporting-text-ellipsis": $props.supportingTextEllipsis,
+                    size: $options.textGroupSize,
+                    state: $options.textGroupState
+                }, null, 8, ["eyebrow-text", "eyebrow-text-ellipsis", "is-eyebrow-text-uppercase", "is-selected", "main-text", "main-text-ellipsis", "supporting-text", "supporting-text-ellipsis", "size", "state"])
             ])
         ]),
         _: 2
@@ -57300,6 +57595,115 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
 exports.s = render;
 
 
+/***/ }),
+
+/***/ 49176:
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+
+"use strict";
+var __webpack_unused_export__;
+
+__webpack_unused_export__ = ({ value: true });
+exports.s = void 0;
+const vue_1 = __webpack_require__(77203);
+const _hoisted_1 = {
+    key: 0,
+    class: "ds-textGroup__skeletonWrapper"
+};
+const _hoisted_2 = { key: 1 };
+const _hoisted_3 = { key: 2 };
+const _hoisted_4 = {
+    key: 0,
+    class: "ds-textGroup__skeletonWrapper"
+};
+const _hoisted_5 = { key: 1 };
+const _hoisted_6 = { key: 2 };
+const _hoisted_7 = {
+    key: 0,
+    class: "ds-textGroup__skeletonWrapper"
+};
+const _hoisted_8 = { key: 1 };
+const _hoisted_9 = ["innerHTML"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+    const _component_ds_skeleton = (0, vue_1.resolveComponent)("ds-skeleton");
+    return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
+        class: (0, vue_1.normalizeClass)(["ds-textGroup", {
+                '-ds-small': _ctx.size === _ctx.TEXT_GROUP_SIZES.SMALL,
+                '-ds-hovered': _ctx.state === _ctx.TEXT_GROUP_STATES.HOVERED,
+                '-ds-loading': _ctx.isLoading,
+                '-ds-disabled': _ctx.state === _ctx.TEXT_GROUP_STATES.DISABLED,
+                '-ds-interactive': _ctx.isInteractive,
+                '-ds-selected': _ctx.isSelected,
+                [_ctx.loadingSizeClassName]: _ctx.isLoading,
+                [_ctx.colorClassName]: true,
+            }])
+    }, [
+        (_ctx.eyebrowText !== null)
+            ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
+                key: 0,
+                class: (0, vue_1.normalizeClass)(["ds-textGroup__eyebrow", {
+                        '-ds-ellipsis': _ctx.eyebrowTextEllipsis,
+                        '-ds-uppercase': _ctx.isEyebrowTextUppercase,
+                    }])
+            }, [
+                (_ctx.isLoading)
+                    ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", _hoisted_1, [
+                        (0, vue_1.createVNode)(_component_ds_skeleton, {
+                            width: "50%",
+                            height: "100%"
+                        })
+                    ]))
+                    : (_ctx.eyebrowText === '')
+                        ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", _hoisted_2, " "))
+                        : ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", _hoisted_3, (0, vue_1.toDisplayString)(_ctx.eyebrowText), 1))
+            ], 2))
+            : (0, vue_1.createCommentVNode)("", true),
+        (_ctx.mainText !== null)
+            ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
+                key: 1,
+                class: (0, vue_1.normalizeClass)(["ds-textGroup__main", {
+                        '-ds-ellipsis': _ctx.mainTextEllipsis,
+                    }])
+            }, [
+                (_ctx.isLoading)
+                    ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", _hoisted_4, [
+                        (0, vue_1.createVNode)(_component_ds_skeleton, {
+                            width: "100%",
+                            height: "100%"
+                        })
+                    ]))
+                    : (_ctx.mainText === '')
+                        ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", _hoisted_5, " "))
+                        : ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", _hoisted_6, (0, vue_1.toDisplayString)(_ctx.mainText), 1))
+            ], 2))
+            : (0, vue_1.createCommentVNode)("", true),
+        (_ctx.supportingText !== null)
+            ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
+                key: 2,
+                class: (0, vue_1.normalizeClass)(["ds-textGroup__supporting", {
+                        '-ds-ellipsis': _ctx.supportingTextEllipsis,
+                    }])
+            }, [
+                (_ctx.isLoading)
+                    ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", _hoisted_7, [
+                        (0, vue_1.createVNode)(_component_ds_skeleton, {
+                            width: "100%",
+                            height: "100%"
+                        })
+                    ]))
+                    : (_ctx.supportingText === '')
+                        ? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", _hoisted_8, " "))
+                        : ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("span", {
+                            key: 2,
+                            innerHTML: _ctx.supportingText
+                        }, null, 8, _hoisted_9))
+            ], 2))
+            : (0, vue_1.createCommentVNode)("", true)
+    ], 2));
+}
+exports.s = render;
+
+
 /***/ }),
 
 /***/ 50629:
@@ -58602,19 +59006,19 @@ var update = add("af0ae400", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ }),
 
-/***/ 15514:
+/***/ 57789:
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
 // style-loader: Adds some css to the DOM by adding a <style> tag
 
 // load the styles
-var content = __webpack_require__(65120);
+var content = __webpack_require__(93417);
 if(content.__esModule) content = content.default;
 if(typeof content === 'string') content = [[module.id, content, '']];
 if(content.locals) module.exports = content.locals;
 // add the styles to the DOM
 var add = (__webpack_require__(54402)/* ["default"] */ .Z)
-var update = add("3dc1ff6e", content, true, {"sourceMap":false,"shadowMode":false});
+var update = add("1016c332", content, true, {"sourceMap":false,"shadowMode":false});
 
 /***/ }),
 
@@ -58890,6 +59294,22 @@ var update = add("7eea9bdf", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ }),
 
+/***/ 15582:
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__(14012);
+if(content.__esModule) content = content.default;
+if(typeof content === 'string') content = [[module.id, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = (__webpack_require__(54402)/* ["default"] */ .Z)
+var update = add("3962d485", content, true, {"sourceMap":false,"shadowMode":false});
+
+/***/ }),
+
 /***/ 46654:
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {