@cakemail-org/ui-components-v2 2.2.17 → 2.2.19

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.
Files changed (11) hide show
  1. package/dist/cjs/components/icon/types.d.ts +1 -0
  2. package/dist/cjs/components/icons/18/Chevron.d.ts +4 -0
  3. package/dist/cjs/data/theme/MuiTableCell.d.ts +6 -1
  4. package/dist/cjs/data/theme/MuiTextField.d.ts +5 -2
  5. package/dist/cjs/index.js +23 -9
  6. package/dist/esm/components/icon/types.d.ts +1 -0
  7. package/dist/esm/components/icons/18/Chevron.d.ts +4 -0
  8. package/dist/esm/data/theme/MuiTableCell.d.ts +6 -1
  9. package/dist/esm/data/theme/MuiTextField.d.ts +5 -2
  10. package/dist/esm/index.js +23 -9
  11. package/package.json +1 -1
package/dist/cjs/components/icon/types.d.ts CHANGED
@@ -33,6 +33,7 @@ export declare enum EIconName {
33
33
  "Code18" = "Code18",
34
34
  "Collapse18" = "Collapse18",
35
35
  "Copy18" = "Copy18",
36
+ "Chevron18" = "Chevron18",
36
37
  "Delete18" = "Delete18",
37
38
  "Domainauthenticated18" = "Domainauthenticated18",
38
39
  "Domainblocked18" = "Domainblocked18",
package/dist/cjs/components/icons/18/Chevron.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { SvgIconProps } from '@mui/material/SvgIcon';
2
+ import React from "react";
3
+ declare function AccountProfile18(props: SvgIconProps): React.JSX.Element;
4
+ export default AccountProfile18;
package/dist/cjs/data/theme/MuiTableCell.d.ts CHANGED
@@ -6,7 +6,12 @@ export default function getMuiTableCell(theme: Theme): {
6
6
  boxSizing: string;
7
7
  marginBottom: string;
8
8
  border: string;
9
- maxWidth: string;
9
+ ".cellContainer .MuiTypography-root, .cellContainer p": {
10
+ maxWidth: string;
11
+ overflow: string;
12
+ textOverflow: string;
13
+ whiteSpace: string;
14
+ };
10
15
  verticalAlign: string;
11
16
  "&:nth-child(2)": {
12
17
  paddingLeft: string;
package/dist/cjs/data/theme/MuiTextField.d.ts CHANGED
@@ -847,10 +847,9 @@ export default function getMuiTextField(theme: Theme): {
847
847
  "&.MuiOutlinedInput-root": {};
848
848
  "&.MuiFilledInput-root": {};
849
849
  "&.MuiInput-root": {};
850
- input: {
850
+ "input, textarea": {
851
851
  fontWeight: number;
852
852
  borderRadius: number;
853
- padding: string;
854
853
  backgroundColor: string;
855
854
  "&:not(:placeholder-shown)": {
856
855
  color: string;
@@ -1277,6 +1276,7 @@ export default function getMuiTextField(theme: Theme): {
1277
1276
  outline?: import("csstype").Property.Outline<string | number> | undefined;
1278
1277
  overflow?: import("csstype").Property.Overflow | undefined;
1279
1278
  overscrollBehavior?: import("csstype").Property.OverscrollBehavior | undefined;
1279
+ padding?: import("csstype").Property.Padding<string | number> | undefined;
1280
1280
  paddingBlock?: import("csstype").Property.PaddingBlock<string | number> | undefined;
1281
1281
  paddingInline?: import("csstype").Property.PaddingInline<string | number> | undefined;
1282
1282
  placeContent?: import("csstype").Property.PlaceContent | undefined;
@@ -1677,6 +1677,9 @@ export default function getMuiTextField(theme: Theme): {
1677
1677
  textAnchor?: import("csstype").Property.TextAnchor | undefined;
1678
1678
  vectorEffect?: import("csstype").Property.VectorEffect | undefined;
1679
1679
  };
1680
+ input: {
1681
+ padding: string;
1682
+ };
1680
1683
  fieldset: {
1681
1684
  borderRadius: number;
1682
1685
  borderColor: string;
package/dist/cjs/index.js CHANGED
@@ -678,7 +678,7 @@ function X14(props) {
678
678
  React.createElement("rect", { id: "Rectangle 153_2", x: "2.75867", y: "12.6554", width: "2", height: "13.9959", rx: "1", transform: "rotate(-135 2.75867 12.6554)" }));
679
679
  }
680
680
 
681
- function AccountProfile18(props) {
681
+ function AccountProfile18$1(props) {
682
682
  return React.createElement(SvgIcon, __assign({}, props, { width: "18", height: "18", viewBox: "0 0 18 18" }),
683
683
  React.createElement("rect", { x: "4", y: "4", width: "3", height: "3", rx: "1.5" }),
684
684
  React.createElement("rect", { x: "4", y: "12", width: "5", height: "2", rx: "1" }),
@@ -781,6 +781,11 @@ function Copy18(props) {
781
781
  React.createElement("path", { d: "M6 15H8C8 15.5523 8.44772 16 9 16H15C15.5523 16 16 15.5523 16 15V9C16 8.44772 15.5523 8 15 8V6C16.6569 6 18 7.34315 18 9V15C18 16.6569 16.6569 18 15 18H9C7.34315 18 6 16.6568 6 15Z" }));
782
782
  }
783
783
 
784
+ function AccountProfile18(props) {
785
+ return React.createElement(SvgIcon, __assign({}, props, { width: "18", height: "10", viewBox: "0 0 18 10" }),
786
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L9 7.58579L16.2929 0.292893C16.6834 -0.0976311 17.3166 -0.0976311 17.7071 0.292893C18.0976 0.683418 18.0976 1.31658 17.7071 1.70711L9.70711 9.70711C9.31658 10.0976 8.68342 10.0976 8.29289 9.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z" }));
787
+ }
788
+
784
789
  function Dashboard18(props) {
785
790
  return React.createElement(SvgIcon, __assign({}, props, { width: "18", height: "18", viewBox: "0 0 18 18" }),
786
791
  React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.4 0H6.6C7.3732 0 8 0.626801 8 1.4V6.6C8 7.3732 7.3732 8 6.6 8H1.4C0.626801 8 0 7.3732 0 6.6V1.4C0 0.626801 0.626801 0 1.4 0ZM2 2V6H6V2H2Z" }),
@@ -1458,7 +1463,7 @@ function Icon(_a) {
1458
1463
  Activity18: Activity18,
1459
1464
  Add18: Add18,
1460
1465
  AddTags18: AddTags18,
1461
- AccountProfile18: AccountProfile18,
1466
+ AccountProfile18: AccountProfile18$1,
1462
1467
  Attribute18: Attribute18,
1463
1468
  Integrations18: Integrations18,
1464
1469
  Arrow18: Arrow18,
@@ -1468,6 +1473,7 @@ function Icon(_a) {
1468
1473
  Campaigns18: Campaigns18,
1469
1474
  Collapse18: Collapse18,
1470
1475
  Clicks18: Clicks18,
1476
+ Chevron18: AccountProfile18,
1471
1477
  Copy18: Copy18,
1472
1478
  Code18: Code18,
1473
1479
  Dashboard18: Dashboard18,
@@ -7014,8 +7020,13 @@ function getMuiTableCell(theme) {
7014
7020
  boxSizing: "border-box",
7015
7021
  marginBottom: theme.spacing(5),
7016
7022
  border: "none",
7017
- maxWidth: "unset",
7018
- verticalAlign: "top",
7023
+ ".cellContainer .MuiTypography-root, .cellContainer p": {
7024
+ maxWidth: "25rem !important",
7025
+ overflow: "hidden",
7026
+ textOverflow: "ellipsis",
7027
+ whiteSpace: "nowrap",
7028
+ },
7029
+ verticalAlign: "center",
7019
7030
  "&:nth-child(2)": {
7020
7031
  paddingLeft: theme.spacing(5) + "!important",
7021
7032
  },
@@ -7302,9 +7313,12 @@ function getMuiTextField(theme) {
7302
7313
  "&.MuiOutlinedInput-root": {},
7303
7314
  "&.MuiFilledInput-root": {},
7304
7315
  "&.MuiInput-root": {},
7305
- "input": __assign(__assign({ height: "unset" }, theme.typography.body1L), { fontWeight: 600, borderRadius: 8, padding: theme.spacing(4, 3.5), backgroundColor: theme.palette.common.white, "&:not(:placeholder-shown)": {
7316
+ "input, textarea": __assign(__assign({ height: "unset" }, theme.typography.body1L), { fontWeight: 600, borderRadius: 8, backgroundColor: theme.palette.common.white, "&:not(:placeholder-shown)": {
7306
7317
  color: theme.palette.primary.main
7307
7318
  } }),
7319
+ "input": {
7320
+ padding: theme.spacing(4, 3.5),
7321
+ },
7308
7322
  "fieldset": {
7309
7323
  borderRadius: 8,
7310
7324
  borderColor: theme.palette.wildSand.main,
@@ -16871,7 +16885,7 @@ function Radio(_a) {
16871
16885
  return React.createElement(material.Radio, __assign({}, props));
16872
16886
  }
16873
16887
 
16874
- var css_248z$3 = ".resourceEdit-component-v2 {\n width: 100%;\n padding-bottom: 1.5rem;\n}\n.resourceEdit-component-v2 .resource-heading {\n flex: 1;\n width: 100%;\n}\n.resourceEdit-component-v2 .resource-heading .resource-title {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark {\n width: 24px;\n height: 24px;\n border-radius: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: 0.5rem;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.valid {\n background-color: var(--secondary-brand-color, var(--teal, #0ABDAE));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.warning {\n background-color: var(--warning-brand-color, var(--orange, #FF9E0E));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.error {\n background-color: var(--error-brand-color, var(--rad-red, #FF4835));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.empty {\n background-color: var(--shade500, #939292);\n}";
16888
+ var css_248z$3 = ".resourceEdit-component-v2 {\n width: 100%;\n padding-bottom: 1.5rem;\n}\n.resourceEdit-component-v2 .resource-heading {\n flex: 1;\n width: 100%;\n}\n.resourceEdit-component-v2 .resource-heading.editable {\n cursor: pointer;\n}\n.resourceEdit-component-v2 .resource-heading .resource-title {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark {\n width: 24px;\n height: 24px;\n border-radius: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: 0.5rem;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.valid {\n background-color: var(--secondary-brand-color, var(--teal, #0ABDAE));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.warning {\n background-color: var(--warning-brand-color, var(--orange, #FF9E0E));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.error {\n background-color: var(--error-brand-color, var(--rad-red, #FF4835));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.empty {\n background-color: var(--shade500, #939292);\n}";
16875
16889
  styleInject(css_248z$3);
16876
16890
 
16877
16891
  function ResourceEdit(_a) {
@@ -16881,7 +16895,7 @@ function ResourceEdit(_a) {
16881
16895
  setOpen(!open);
16882
16896
  }
16883
16897
  return React.createElement(material.Stack, { className: "resourceEdit-component-v2 ".concat(className || ""), gap: 4 },
16884
- React.createElement(material.Stack, { direction: "row", className: "resource-heading", justifyContent: "space-between", gap: 4 },
16898
+ React.createElement(material.Stack, { direction: "row", className: "resource-heading ".concat(editable ? "editable" : ""), justifyContent: "space-between", gap: 4, onClick: editable ? handleToggleOpen : undefined },
16885
16899
  React.createElement(material.Stack, { gap: 1 },
16886
16900
  React.createElement(material.Typography, { className: "resource-title", variant: "titleS" },
16887
16901
  title,
@@ -16890,8 +16904,8 @@ function ResourceEdit(_a) {
16890
16904
  React.createElement(Icon, { name: status === "valid" ? "Checkmark10" : "X14", color: "white" }))),
16891
16905
  desc && React.createElement(material.Typography, { variant: "body1", color: "shade500.main" }, desc)),
16892
16906
  editable && React.createElement(material.Box, null,
16893
- React.createElement(Button, { onClick: handleToggleOpen, color: "body1", variant: 'outlined', iconOnly: true },
16894
- React.createElement(Icon, { name: "Edit18" })))),
16907
+ React.createElement(Button, { color: "body1", variant: 'text', iconOnly: true, onClick: handleToggleOpen },
16908
+ React.createElement(Icon, { name: "Chevron18" })))),
16895
16909
  !!editableContent && React.createElement(material.Box, { className: "resource-content ".concat(open ? "open" : "hidden") }, editableContent),
16896
16910
  !!support && React.createElement(material.Box, { className: "resource-support ".concat(!open ? "open" : "hidden") }, support));
16897
16911
  }
package/dist/esm/components/icon/types.d.ts CHANGED
@@ -33,6 +33,7 @@ export declare enum EIconName {
33
33
  "Code18" = "Code18",
34
34
  "Collapse18" = "Collapse18",
35
35
  "Copy18" = "Copy18",
36
+ "Chevron18" = "Chevron18",
36
37
  "Delete18" = "Delete18",
37
38
  "Domainauthenticated18" = "Domainauthenticated18",
38
39
  "Domainblocked18" = "Domainblocked18",
package/dist/esm/components/icons/18/Chevron.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { SvgIconProps } from '@mui/material/SvgIcon';
2
+ import React from "react";
3
+ declare function AccountProfile18(props: SvgIconProps): React.JSX.Element;
4
+ export default AccountProfile18;
package/dist/esm/data/theme/MuiTableCell.d.ts CHANGED
@@ -6,7 +6,12 @@ export default function getMuiTableCell(theme: Theme): {
6
6
  boxSizing: string;
7
7
  marginBottom: string;
8
8
  border: string;
9
- maxWidth: string;
9
+ ".cellContainer .MuiTypography-root, .cellContainer p": {
10
+ maxWidth: string;
11
+ overflow: string;
12
+ textOverflow: string;
13
+ whiteSpace: string;
14
+ };
10
15
  verticalAlign: string;
11
16
  "&:nth-child(2)": {
12
17
  paddingLeft: string;
package/dist/esm/data/theme/MuiTextField.d.ts CHANGED
@@ -847,10 +847,9 @@ export default function getMuiTextField(theme: Theme): {
847
847
  "&.MuiOutlinedInput-root": {};
848
848
  "&.MuiFilledInput-root": {};
849
849
  "&.MuiInput-root": {};
850
- input: {
850
+ "input, textarea": {
851
851
  fontWeight: number;
852
852
  borderRadius: number;
853
- padding: string;
854
853
  backgroundColor: string;
855
854
  "&:not(:placeholder-shown)": {
856
855
  color: string;
@@ -1277,6 +1276,7 @@ export default function getMuiTextField(theme: Theme): {
1277
1276
  outline?: import("csstype").Property.Outline<string | number> | undefined;
1278
1277
  overflow?: import("csstype").Property.Overflow | undefined;
1279
1278
  overscrollBehavior?: import("csstype").Property.OverscrollBehavior | undefined;
1279
+ padding?: import("csstype").Property.Padding<string | number> | undefined;
1280
1280
  paddingBlock?: import("csstype").Property.PaddingBlock<string | number> | undefined;
1281
1281
  paddingInline?: import("csstype").Property.PaddingInline<string | number> | undefined;
1282
1282
  placeContent?: import("csstype").Property.PlaceContent | undefined;
@@ -1677,6 +1677,9 @@ export default function getMuiTextField(theme: Theme): {
1677
1677
  textAnchor?: import("csstype").Property.TextAnchor | undefined;
1678
1678
  vectorEffect?: import("csstype").Property.VectorEffect | undefined;
1679
1679
  };
1680
+ input: {
1681
+ padding: string;
1682
+ };
1680
1683
  fieldset: {
1681
1684
  borderRadius: number;
1682
1685
  borderColor: string;
package/dist/esm/index.js CHANGED
@@ -658,7 +658,7 @@ function X14(props) {
658
658
  React__default.createElement("rect", { id: "Rectangle 153_2", x: "2.75867", y: "12.6554", width: "2", height: "13.9959", rx: "1", transform: "rotate(-135 2.75867 12.6554)" }));
659
659
  }
660
660
 
661
- function AccountProfile18(props) {
661
+ function AccountProfile18$1(props) {
662
662
  return React__default.createElement(SvgIcon, __assign({}, props, { width: "18", height: "18", viewBox: "0 0 18 18" }),
663
663
  React__default.createElement("rect", { x: "4", y: "4", width: "3", height: "3", rx: "1.5" }),
664
664
  React__default.createElement("rect", { x: "4", y: "12", width: "5", height: "2", rx: "1" }),
@@ -761,6 +761,11 @@ function Copy18(props) {
761
761
  React__default.createElement("path", { d: "M6 15H8C8 15.5523 8.44772 16 9 16H15C15.5523 16 16 15.5523 16 15V9C16 8.44772 15.5523 8 15 8V6C16.6569 6 18 7.34315 18 9V15C18 16.6569 16.6569 18 15 18H9C7.34315 18 6 16.6568 6 15Z" }));
762
762
  }
763
763
 
764
+ function AccountProfile18(props) {
765
+ return React__default.createElement(SvgIcon, __assign({}, props, { width: "18", height: "10", viewBox: "0 0 18 10" }),
766
+ React__default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L9 7.58579L16.2929 0.292893C16.6834 -0.0976311 17.3166 -0.0976311 17.7071 0.292893C18.0976 0.683418 18.0976 1.31658 17.7071 1.70711L9.70711 9.70711C9.31658 10.0976 8.68342 10.0976 8.29289 9.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z" }));
767
+ }
768
+
764
769
  function Dashboard18(props) {
765
770
  return React__default.createElement(SvgIcon, __assign({}, props, { width: "18", height: "18", viewBox: "0 0 18 18" }),
766
771
  React__default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.4 0H6.6C7.3732 0 8 0.626801 8 1.4V6.6C8 7.3732 7.3732 8 6.6 8H1.4C0.626801 8 0 7.3732 0 6.6V1.4C0 0.626801 0.626801 0 1.4 0ZM2 2V6H6V2H2Z" }),
@@ -1438,7 +1443,7 @@ function Icon(_a) {
1438
1443
  Activity18: Activity18,
1439
1444
  Add18: Add18,
1440
1445
  AddTags18: AddTags18,
1441
- AccountProfile18: AccountProfile18,
1446
+ AccountProfile18: AccountProfile18$1,
1442
1447
  Attribute18: Attribute18,
1443
1448
  Integrations18: Integrations18,
1444
1449
  Arrow18: Arrow18,
@@ -1448,6 +1453,7 @@ function Icon(_a) {
1448
1453
  Campaigns18: Campaigns18,
1449
1454
  Collapse18: Collapse18,
1450
1455
  Clicks18: Clicks18,
1456
+ Chevron18: AccountProfile18,
1451
1457
  Copy18: Copy18,
1452
1458
  Code18: Code18,
1453
1459
  Dashboard18: Dashboard18,
@@ -6994,8 +7000,13 @@ function getMuiTableCell(theme) {
6994
7000
  boxSizing: "border-box",
6995
7001
  marginBottom: theme.spacing(5),
6996
7002
  border: "none",
6997
- maxWidth: "unset",
6998
- verticalAlign: "top",
7003
+ ".cellContainer .MuiTypography-root, .cellContainer p": {
7004
+ maxWidth: "25rem !important",
7005
+ overflow: "hidden",
7006
+ textOverflow: "ellipsis",
7007
+ whiteSpace: "nowrap",
7008
+ },
7009
+ verticalAlign: "center",
6999
7010
  "&:nth-child(2)": {
7000
7011
  paddingLeft: theme.spacing(5) + "!important",
7001
7012
  },
@@ -7282,9 +7293,12 @@ function getMuiTextField(theme) {
7282
7293
  "&.MuiOutlinedInput-root": {},
7283
7294
  "&.MuiFilledInput-root": {},
7284
7295
  "&.MuiInput-root": {},
7285
- "input": __assign(__assign({ height: "unset" }, theme.typography.body1L), { fontWeight: 600, borderRadius: 8, padding: theme.spacing(4, 3.5), backgroundColor: theme.palette.common.white, "&:not(:placeholder-shown)": {
7296
+ "input, textarea": __assign(__assign({ height: "unset" }, theme.typography.body1L), { fontWeight: 600, borderRadius: 8, backgroundColor: theme.palette.common.white, "&:not(:placeholder-shown)": {
7286
7297
  color: theme.palette.primary.main
7287
7298
  } }),
7299
+ "input": {
7300
+ padding: theme.spacing(4, 3.5),
7301
+ },
7288
7302
  "fieldset": {
7289
7303
  borderRadius: 8,
7290
7304
  borderColor: theme.palette.wildSand.main,
@@ -16851,7 +16865,7 @@ function Radio(_a) {
16851
16865
  return React__default.createElement(Radio$1, __assign({}, props));
16852
16866
  }
16853
16867
 
16854
- var css_248z$3 = ".resourceEdit-component-v2 {\n width: 100%;\n padding-bottom: 1.5rem;\n}\n.resourceEdit-component-v2 .resource-heading {\n flex: 1;\n width: 100%;\n}\n.resourceEdit-component-v2 .resource-heading .resource-title {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark {\n width: 24px;\n height: 24px;\n border-radius: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: 0.5rem;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.valid {\n background-color: var(--secondary-brand-color, var(--teal, #0ABDAE));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.warning {\n background-color: var(--warning-brand-color, var(--orange, #FF9E0E));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.error {\n background-color: var(--error-brand-color, var(--rad-red, #FF4835));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.empty {\n background-color: var(--shade500, #939292);\n}";
16868
+ var css_248z$3 = ".resourceEdit-component-v2 {\n width: 100%;\n padding-bottom: 1.5rem;\n}\n.resourceEdit-component-v2 .resource-heading {\n flex: 1;\n width: 100%;\n}\n.resourceEdit-component-v2 .resource-heading.editable {\n cursor: pointer;\n}\n.resourceEdit-component-v2 .resource-heading .resource-title {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark {\n width: 24px;\n height: 24px;\n border-radius: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: 0.5rem;\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.valid {\n background-color: var(--secondary-brand-color, var(--teal, #0ABDAE));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.warning {\n background-color: var(--warning-brand-color, var(--orange, #FF9E0E));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.error {\n background-color: var(--error-brand-color, var(--rad-red, #FF4835));\n}\n.resourceEdit-component-v2 .resource-heading .statusCheckmark.empty {\n background-color: var(--shade500, #939292);\n}";
16855
16869
  styleInject(css_248z$3);
16856
16870
 
16857
16871
  function ResourceEdit(_a) {
@@ -16861,7 +16875,7 @@ function ResourceEdit(_a) {
16861
16875
  setOpen(!open);
16862
16876
  }
16863
16877
  return React__default.createElement(Stack$1, { className: "resourceEdit-component-v2 ".concat(className || ""), gap: 4 },
16864
- React__default.createElement(Stack$1, { direction: "row", className: "resource-heading", justifyContent: "space-between", gap: 4 },
16878
+ React__default.createElement(Stack$1, { direction: "row", className: "resource-heading ".concat(editable ? "editable" : ""), justifyContent: "space-between", gap: 4, onClick: editable ? handleToggleOpen : undefined },
16865
16879
  React__default.createElement(Stack$1, { gap: 1 },
16866
16880
  React__default.createElement(Typography$1, { className: "resource-title", variant: "titleS" },
16867
16881
  title,
@@ -16870,8 +16884,8 @@ function ResourceEdit(_a) {
16870
16884
  React__default.createElement(Icon, { name: status === "valid" ? "Checkmark10" : "X14", color: "white" }))),
16871
16885
  desc && React__default.createElement(Typography$1, { variant: "body1", color: "shade500.main" }, desc)),
16872
16886
  editable && React__default.createElement(Box, null,
16873
- React__default.createElement(Button, { onClick: handleToggleOpen, color: "body1", variant: 'outlined', iconOnly: true },
16874
- React__default.createElement(Icon, { name: "Edit18" })))),
16887
+ React__default.createElement(Button, { color: "body1", variant: 'text', iconOnly: true, onClick: handleToggleOpen },
16888
+ React__default.createElement(Icon, { name: "Chevron18" })))),
16875
16889
  !!editableContent && React__default.createElement(Box, { className: "resource-content ".concat(open ? "open" : "hidden") }, editableContent),
16876
16890
  !!support && React__default.createElement(Box, { className: "resource-support ".concat(!open ? "open" : "hidden") }, support));
16877
16891
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cakemail-org/ui-components-v2",
3
- "version": "2.2.17",
3
+ "version": "2.2.19",
4
4
  "description": "ui library kit made with material UI",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",