@thecb/components 7.10.1 → 7.10.3

package/dist/index.cjs.js

@@ -14740,6 +14740,26 @@ var FailedIcon = function FailedIcon() {
   }))));
 };
 
+var PencilIcon = function PencilIcon(_ref) {
+  var _ref$ariaLabel = _ref.ariaLabel,
+      ariaLabel = _ref$ariaLabel === void 0 ? "Edit" : _ref$ariaLabel,
+      themeValues = _ref.themeValues;
+  return /*#__PURE__*/React__default.createElement("svg", {
+    "aria-label": ariaLabel,
+    width: "24px",
+    height: "24px",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React__default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M19.74 6.84a.885.885 0 0 1 0 1.253l-1.626 1.626-3.333-3.333 1.626-1.626a.885.885 0 0 1 1.253 0l2.08 2.08ZM4 20.5v-3.333l9.83-9.83 3.333 3.333-9.83 9.83H4Z",
+    fill: themeValues.subIconColor
+  }));
+};
+
+var PencilIcon$1 = themeComponent(PencilIcon, "Icons", fallbackValues$2, "info");
+
 var PendingIcon = function PendingIcon() {
   return /*#__PURE__*/React__default.createElement("svg", {
     width: "32px",
@@ -39937,13 +39957,16 @@ var EditableList = function EditableList(_ref) {
       autoPayMethods = _ref.autoPayMethods,
       _ref$as = _ref.as,
       as = _ref$as === void 0 ? "p" : _ref$as,
+      _ref$listPadding = _ref.listPadding,
+      listPadding = _ref$listPadding === void 0 ? "0rem 0rem 1.5rem 0rem" : _ref$listPadding,
       qaPrefix = _ref.qaPrefix,
       ariaLabel = _ref.ariaLabel;
   var addText = "Add a".concat(itemName[0].match(/[aieouAIEOU]/) ? "n" : "", " ").concat(itemName);
   return /*#__PURE__*/React__default.createElement(Box, {
-    padding: "0rem 0rem 1.5rem 0rem",
+    padding: listPadding,
     as: "section",
-    "aria-labelledby": "li"
+    "aria-labelledby": typeof title === "string" ? "editable-list-".concat(createIdFromString(title)) : "",
+    "aria-label": !title && typeof itemName === "string" ? "editable-list-".concat(createIdFromString(itemName)) : ""
   }, /*#__PURE__*/React__default.createElement(Stack, {
     childGap: "0rem"
   }, title !== "" && /*#__PURE__*/React__default.createElement(Box, {
@@ -39952,7 +39975,8 @@ var EditableList = function EditableList(_ref) {
     as: as,
     weight: titleWeight,
     color: CHARADE_GREY,
-    extraStyles: "letter-spacing: 0.29px; font-size: 1.125rem;"
+    extraStyles: "letter-spacing: 0.29px; font-size: 1.125rem;",
+    id: typeof title === "string" ? "editable-list-".concat(createIdFromString(title)) : ""
   }, title)), /*#__PURE__*/React__default.createElement(Box, {
     padding: "0",
     borderRadius: "4px",
@@ -49297,6 +49321,7 @@ exports.PaymentMethodAddIcon = PaymentMethodAddIcon$1;
 exports.PaymentMethodIcon = PaymentMethodIcon$1;
 exports.PaymentSearchIcon = PaymentSearchIcon;
 exports.PaymentsIconSmall = PaymentsIconSmall$1;
+exports.PencilIcon = PencilIcon$1;
 exports.PendingIcon = PendingIcon;
 exports.PeriscopeDashboardIframe = PeriscopeDashboardIframe;
 exports.PeriscopeFailedIcon = PeriscopeFailedIcon;