@sebgroup/green-core 3.23.0 → 3.24.1

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 (121) hide show
  1. package/assets/icons/regular/satellite.svg +6 -0
  2. package/assets/icons/solid/satellite.svg +5 -0
  3. package/components/button/button.component.js +6 -1
  4. package/components/calendar/calendar.component.js +2 -1
  5. package/components/context-menu/context-menu.component.js +3 -0
  6. package/components/datepicker/datepicker.component.js +57 -13
  7. package/components/icon/icons/index.d.ts +1 -0
  8. package/components/icon/icons/index.js +1 -0
  9. package/components/icon/icons/pure.d.ts +1 -0
  10. package/components/icon/icons/pure.js +1 -0
  11. package/components/icon/icons/satellite.component.d.ts +18 -0
  12. package/components/icon/icons/satellite.component.js +25 -0
  13. package/components/icon/icons/satellite.d.ts +2 -0
  14. package/components/icon/icons/satellite.js +6 -0
  15. package/components/link/link.styles.js +23 -3
  16. package/components/popover/popover.component.js +3 -2
  17. package/components/table/table.stories.data.js +186 -182
  18. package/custom-elements.json +27017 -26394
  19. package/gds-element.js +1 -1
  20. package/generated/mcp/alert/index.json +0 -1
  21. package/generated/mcp/avatar/index.json +0 -1
  22. package/generated/mcp/badge/index.json +0 -1
  23. package/generated/mcp/blur/index.json +0 -1
  24. package/generated/mcp/breadcrumbs/index.json +0 -1
  25. package/generated/mcp/button/index.json +0 -1
  26. package/generated/mcp/calendar/index.json +0 -1
  27. package/generated/mcp/card/index.json +0 -1
  28. package/generated/mcp/card-pattern-01/index.json +0 -1
  29. package/generated/mcp/checkbox/index.json +0 -1
  30. package/generated/mcp/coachmark/index.json +0 -1
  31. package/generated/mcp/components.json +1 -44
  32. package/generated/mcp/context-menu/index.json +0 -1
  33. package/generated/mcp/datepicker/index.json +0 -1
  34. package/generated/mcp/details/index.json +0 -1
  35. package/generated/mcp/dialog/index.json +0 -1
  36. package/generated/mcp/div/index.json +0 -1
  37. package/generated/mcp/divider/index.json +0 -1
  38. package/generated/mcp/dropdown/index.json +0 -1
  39. package/generated/mcp/fab/index.json +0 -1
  40. package/generated/mcp/filter-chips/index.json +0 -1
  41. package/generated/mcp/flex/index.json +0 -1
  42. package/generated/mcp/form-summary/index.json +0 -1
  43. package/generated/mcp/grid/index.json +0 -1
  44. package/generated/mcp/icon-satellite/angular.md +15 -0
  45. package/generated/mcp/icon-satellite/api.md +31 -0
  46. package/generated/mcp/icon-satellite/index.json +8 -0
  47. package/generated/mcp/icon-satellite/react.md +15 -0
  48. package/generated/mcp/icons.json +13 -1
  49. package/generated/mcp/index.json +1 -1
  50. package/generated/mcp/input/index.json +0 -1
  51. package/generated/mcp/link/index.json +0 -1
  52. package/generated/mcp/list/index.json +0 -1
  53. package/generated/mcp/list-item-pattern-01/index.json +0 -1
  54. package/generated/mcp/menu-button/index.json +0 -1
  55. package/generated/mcp/pagination/index.json +0 -1
  56. package/generated/mcp/popover/index.json +0 -1
  57. package/generated/mcp/radio/index.json +0 -1
  58. package/generated/mcp/rich-text/index.json +0 -1
  59. package/generated/mcp/segmented-control/index.json +0 -1
  60. package/generated/mcp/select/index.json +0 -1
  61. package/generated/mcp/signal/index.json +0 -1
  62. package/generated/mcp/spinner/index.json +0 -1
  63. package/generated/mcp/switch/index.json +0 -1
  64. package/generated/mcp/table/index.json +0 -1
  65. package/generated/mcp/tabs/index.json +0 -1
  66. package/generated/mcp/text/index.json +0 -1
  67. package/generated/mcp/textarea/index.json +0 -1
  68. package/generated/mcp/theme/index.json +0 -1
  69. package/generated/mcp/tokens.json +1 -1
  70. package/generated/mcp/video/index.json +0 -1
  71. package/generated/react/icons/icon-satellite/index.d.ts +691 -0
  72. package/generated/react/icons/icon-satellite/index.js +14 -0
  73. package/generated/react/index.d.ts +2 -1
  74. package/generated/react/index.js +2 -1
  75. package/package.json +2 -1
  76. package/utils/helpers/custom-element-scoping.js +1 -1
  77. package/utils/helpers/has-changed.d.ts +8 -0
  78. package/utils/helpers/has-changed.js +10 -0
  79. package/generated/mcp/alert/guidelines.md +0 -105
  80. package/generated/mcp/avatar/guidelines.md +0 -40
  81. package/generated/mcp/badge/guidelines.md +0 -56
  82. package/generated/mcp/blur/guidelines.md +0 -3
  83. package/generated/mcp/breadcrumbs/guidelines.md +0 -35
  84. package/generated/mcp/button/guidelines.md +0 -83
  85. package/generated/mcp/calendar/guidelines.md +0 -3
  86. package/generated/mcp/card/guidelines.md +0 -78
  87. package/generated/mcp/card-pattern-01/guidelines.md +0 -52
  88. package/generated/mcp/checkbox/guidelines.md +0 -91
  89. package/generated/mcp/coachmark/guidelines.md +0 -8
  90. package/generated/mcp/context-menu/guidelines.md +0 -33
  91. package/generated/mcp/datepicker/guidelines.md +0 -44
  92. package/generated/mcp/details/guidelines.md +0 -24
  93. package/generated/mcp/dialog/guidelines.md +0 -35
  94. package/generated/mcp/div/guidelines.md +0 -3
  95. package/generated/mcp/divider/guidelines.md +0 -24
  96. package/generated/mcp/dropdown/guidelines.md +0 -96
  97. package/generated/mcp/fab/guidelines.md +0 -27
  98. package/generated/mcp/filter-chips/guidelines.md +0 -47
  99. package/generated/mcp/flex/guidelines.md +0 -1
  100. package/generated/mcp/form-summary/guidelines.md +0 -39
  101. package/generated/mcp/grid/guidelines.md +0 -3
  102. package/generated/mcp/input/guidelines.md +0 -127
  103. package/generated/mcp/link/guidelines.md +0 -43
  104. package/generated/mcp/list/guidelines.md +0 -16
  105. package/generated/mcp/list-item-pattern-01/guidelines.md +0 -49
  106. package/generated/mcp/menu-button/guidelines.md +0 -39
  107. package/generated/mcp/pagination/guidelines.md +0 -24
  108. package/generated/mcp/popover/guidelines.md +0 -3
  109. package/generated/mcp/radio/guidelines.md +0 -74
  110. package/generated/mcp/rich-text/guidelines.md +0 -3
  111. package/generated/mcp/segmented-control/guidelines.md +0 -31
  112. package/generated/mcp/select/guidelines.md +0 -29
  113. package/generated/mcp/signal/guidelines.md +0 -14
  114. package/generated/mcp/spinner/guidelines.md +0 -6
  115. package/generated/mcp/switch/guidelines.md +0 -41
  116. package/generated/mcp/table/guidelines.md +0 -169
  117. package/generated/mcp/tabs/guidelines.md +0 -64
  118. package/generated/mcp/text/guidelines.md +0 -3
  119. package/generated/mcp/textarea/guidelines.md +0 -73
  120. package/generated/mcp/theme/guidelines.md +0 -3
  121. package/generated/mcp/video/guidelines.md +0 -3
@@ -1,8 +1,8 @@
1
1
  import "../../chunks/chunk.CAV4X6PU.js";
2
2
  import { html } from "lit";
3
3
  import { Slot } from "./table.types.js";
4
- const USERS_URL = "https://api.seb.io/components/table/table.users.json";
5
- const FEEDBACK_URL = "https://api.seb.io/components/table/table.feedback.json";
4
+ const USERS_URL = "https://seb.io/api/components/table/table.users.json";
5
+ const FEEDBACK_URL = "https://seb.io/api/components/table/table.feedback.json";
6
6
  let usersCache = null;
7
7
  let usersPromise = null;
8
8
  let feedbackCache = null;
@@ -904,72 +904,6 @@ const ExpandableFinance = {
904
904
  </gds-context-menu>
905
905
 
906
906
  ${row.expansionMode === "full" && row.id === 204 ? html`
907
- <gds-card
908
- slot="expand:${row.id}:full"
909
- variant="neutral-02-outlined"
910
- >
911
- <gds-flex flex-direction="column" gap="m" padding="m">
912
- <gds-flex
913
- justify-content="space-between"
914
- align-items="center"
915
- flex-wrap="wrap"
916
- gap="s"
917
- >
918
- <gds-flex flex-direction="column" gap="2xs">
919
- <gds-text font="heading-xs">
920
- Vendor Settlement Monitoring
921
- </gds-text>
922
- <gds-text font="detail-s-book">
923
- Available balance on ${String(row.account)} is below
924
- internal threshold for ${String(row.segment)}.
925
- </gds-text>
926
- </gds-flex>
927
- <gds-badge variant="negative" size="small"
928
- >Action needed</gds-badge
929
- >
930
- </gds-flex>
931
-
932
- <gds-grid columns="1; s{1}; m{2}; l{3}" gap="s">
933
- <gds-card variant="neutral-02-outlined" padding="s">
934
- <gds-flex flex-direction="column" gap="2xs">
935
- <gds-text font="detail-s-book">Booked Amount</gds-text>
936
- <gds-formatted-number
937
- .value=${Number(row.amount)}
938
- ></gds-formatted-number>
939
- </gds-flex>
940
- </gds-card>
941
-
942
- <gds-card variant="neutral-02-outlined" padding="s">
943
- <gds-flex flex-direction="column" gap="2xs">
944
- <gds-text font="detail-s-book">Available</gds-text>
945
- <gds-formatted-number
946
- .value=${Number(row.available)}
947
- ></gds-formatted-number>
948
- </gds-flex>
949
- </gds-card>
950
-
951
- <gds-card variant="neutral-02-outlined" padding="s">
952
- <gds-flex flex-direction="column" gap="2xs">
953
- <gds-text font="detail-s-book">Owner</gds-text>
954
- <gds-text font="detail-s-bold"
955
- >${String(row.owner)}</gds-text
956
- >
957
- </gds-flex>
958
- </gds-card>
959
- </gds-grid>
960
-
961
- <gds-flex gap="s" flex-wrap="wrap">
962
- <gds-button size="small">Top up account</gds-button>
963
- <gds-button rank="secondary" size="small">
964
- Set alert rule
965
- </gds-button>
966
- <gds-button rank="tertiary" size="small">
967
- View settlement queue
968
- </gds-button>
969
- </gds-flex>
970
- </gds-flex>
971
- </gds-card>
972
- ` : row.expansionMode === "full" && row.id === 202 ? html`
973
907
  <gds-card
974
908
  slot="expand:${row.id}:full"
975
909
  variant="neutral-02-outlined"
@@ -983,24 +917,24 @@ const ExpandableFinance = {
983
917
  >
984
918
  <gds-flex flex-direction="column" gap="2xs">
985
919
  <gds-text font="heading-xs">
986
- Liquidity Reserve Overview
920
+ Vendor Settlement Monitoring
987
921
  </gds-text>
988
922
  <gds-text font="detail-s-book">
989
- ${String(row.account)} acts as the primary treasury
990
- reserve used for short-term liquidity balancing.
923
+ Available balance on ${String(row.account)} is below
924
+ internal threshold for ${String(row.segment)}.
991
925
  </gds-text>
992
926
  </gds-flex>
993
- <gds-badge variant="information" size="small">
994
- Treasury account
995
- </gds-badge>
927
+ <gds-badge variant="negative" size="small"
928
+ >Action needed</gds-badge
929
+ >
996
930
  </gds-flex>
997
931
 
998
- <gds-grid columns="s{1}; m{2}; l{4}" gap="s">
932
+ <gds-grid columns="1; s{1}; m{2}; l{3}" gap="s">
999
933
  <gds-card variant="neutral-02-outlined" padding="s">
1000
934
  <gds-flex flex-direction="column" gap="2xs">
1001
- <gds-text font="detail-s-book">
1002
- Booked Amount
1003
- </gds-text>
935
+ <gds-text font="detail-s-book"
936
+ >Booked Amount</gds-text
937
+ >
1004
938
  <gds-formatted-number
1005
939
  .value=${Number(row.amount)}
1006
940
  ></gds-formatted-number>
@@ -1019,49 +953,117 @@ const ExpandableFinance = {
1019
953
  <gds-card variant="neutral-02-outlined" padding="s">
1020
954
  <gds-flex flex-direction="column" gap="2xs">
1021
955
  <gds-text font="detail-s-book">Owner</gds-text>
1022
- <gds-text font="detail-s-bold">
1023
- ${String(row.owner)}
1024
- </gds-text>
1025
- </gds-flex>
1026
- </gds-card>
1027
-
1028
- <gds-card variant="neutral-02-outlined" padding="s">
1029
- <gds-flex flex-direction="column" gap="2xs">
1030
- <gds-text font="detail-s-book">Updated</gds-text>
1031
- <gds-text font="detail-s-bold">
1032
- ${String(row.lastUpdated)}
1033
- </gds-text>
956
+ <gds-text font="detail-s-bold"
957
+ >${String(row.owner)}</gds-text
958
+ >
1034
959
  </gds-flex>
1035
960
  </gds-card>
1036
961
  </gds-grid>
1037
962
 
1038
963
  <gds-flex gap="s" flex-wrap="wrap">
1039
- <gds-button size="small">View cash forecast</gds-button>
964
+ <gds-button size="small">Top up account</gds-button>
1040
965
  <gds-button rank="secondary" size="small">
1041
- Transfer funds
966
+ Set alert rule
1042
967
  </gds-button>
1043
968
  <gds-button rank="tertiary" size="small">
1044
- Download reserve report
969
+ View settlement queue
1045
970
  </gds-button>
1046
971
  </gds-flex>
1047
972
  </gds-flex>
1048
973
  </gds-card>
1049
- ` : row.expansionMode === "full" && row.id === 209 ? html`
1050
- <gds-flex
974
+ ` : row.expansionMode === "full" && row.id === 202 ? html`
975
+ <gds-card
1051
976
  slot="expand:${row.id}:full"
1052
- gap="s"
1053
- align-items="center"
1054
- padding="m"
977
+ variant="neutral-02-outlined"
1055
978
  >
1056
- <gds-badge size="small" variant="warning"
1057
- >Monitoring</gds-badge
979
+ <gds-flex flex-direction="column" gap="m" padding="m">
980
+ <gds-flex
981
+ justify-content="space-between"
982
+ align-items="center"
983
+ flex-wrap="wrap"
984
+ gap="s"
985
+ >
986
+ <gds-flex flex-direction="column" gap="2xs">
987
+ <gds-text font="heading-xs">
988
+ Liquidity Reserve Overview
989
+ </gds-text>
990
+ <gds-text font="detail-s-book">
991
+ ${String(row.account)} acts as the primary treasury
992
+ reserve used for short-term liquidity balancing.
993
+ </gds-text>
994
+ </gds-flex>
995
+ <gds-badge variant="information" size="small">
996
+ Treasury account
997
+ </gds-badge>
998
+ </gds-flex>
999
+
1000
+ <gds-grid columns="s{1}; m{2}; l{4}" gap="s">
1001
+ <gds-card variant="neutral-02-outlined" padding="s">
1002
+ <gds-flex flex-direction="column" gap="2xs">
1003
+ <gds-text font="detail-s-book">
1004
+ Booked Amount
1005
+ </gds-text>
1006
+ <gds-formatted-number
1007
+ .value=${Number(row.amount)}
1008
+ ></gds-formatted-number>
1009
+ </gds-flex>
1010
+ </gds-card>
1011
+
1012
+ <gds-card variant="neutral-02-outlined" padding="s">
1013
+ <gds-flex flex-direction="column" gap="2xs">
1014
+ <gds-text font="detail-s-book">Available</gds-text>
1015
+ <gds-formatted-number
1016
+ .value=${Number(row.available)}
1017
+ ></gds-formatted-number>
1018
+ </gds-flex>
1019
+ </gds-card>
1020
+
1021
+ <gds-card variant="neutral-02-outlined" padding="s">
1022
+ <gds-flex flex-direction="column" gap="2xs">
1023
+ <gds-text font="detail-s-book">Owner</gds-text>
1024
+ <gds-text font="detail-s-bold">
1025
+ ${String(row.owner)}
1026
+ </gds-text>
1027
+ </gds-flex>
1028
+ </gds-card>
1029
+
1030
+ <gds-card variant="neutral-02-outlined" padding="s">
1031
+ <gds-flex flex-direction="column" gap="2xs">
1032
+ <gds-text font="detail-s-book">Updated</gds-text>
1033
+ <gds-text font="detail-s-bold">
1034
+ ${String(row.lastUpdated)}
1035
+ </gds-text>
1036
+ </gds-flex>
1037
+ </gds-card>
1038
+ </gds-grid>
1039
+
1040
+ <gds-flex gap="s" flex-wrap="wrap">
1041
+ <gds-button size="small">View cash forecast</gds-button>
1042
+ <gds-button rank="secondary" size="small">
1043
+ Transfer funds
1044
+ </gds-button>
1045
+ <gds-button rank="tertiary" size="small">
1046
+ Download reserve report
1047
+ </gds-button>
1048
+ </gds-flex>
1049
+ </gds-flex>
1050
+ </gds-card>
1051
+ ` : row.expansionMode === "full" && row.id === 209 ? html`
1052
+ <gds-flex
1053
+ slot="expand:${row.id}:full"
1054
+ gap="s"
1055
+ align-items="center"
1056
+ padding="m"
1058
1057
  >
1059
- <gds-text font="detail-s-book">
1060
- Available balance on ${String(row.account)} is below
1061
- internal threshold for ${String(row.segment)}.
1062
- </gds-text>
1063
- </gds-flex>
1064
- ` : null}
1058
+ <gds-badge size="small" variant="warning"
1059
+ >Monitoring</gds-badge
1060
+ >
1061
+ <gds-text font="detail-s-book">
1062
+ Available balance on ${String(row.account)} is below
1063
+ internal threshold for ${String(row.segment)}.
1064
+ </gds-text>
1065
+ </gds-flex>
1066
+ ` : null}
1065
1067
  `
1066
1068
  )}
1067
1069
  `,
@@ -1486,89 +1488,91 @@ const Performance = {
1486
1488
  </gds-context-menu>
1487
1489
 
1488
1490
  ${typeof row.fullContent === "function" ? row.id === 8 ? html`
1489
- <gds-table
1490
- plain
1491
- slot="expand:${row.id}:full"
1492
- .columns=${Users.Columns}
1493
- .data=${Users.Data}
1494
- @gds-table-data-loaded=${(e) => e.stopPropagation()}
1495
- ></gds-table>
1496
- ` : html`
1497
- <gds-card
1498
- slot="expand:${row.id}:full"
1499
- variant="neutral-02-outlined"
1500
- >
1501
- <gds-flex flex-direction="column" gap="m" padding="m">
1502
- <gds-flex
1503
- justify-content="space-between"
1504
- align-items="center"
1505
- flex-wrap="wrap"
1506
- gap="s"
1507
- >
1508
- <gds-flex flex-direction="column" gap="2xs">
1509
- <gds-text font="heading-xs">
1510
- ${String(row.name)} - Extended Details
1511
- </gds-text>
1512
- <gds-text font="detail-s-book">
1513
- ${String(row.department)} · ${String(row.region)} ·
1514
- ${String(row.priority)} priority
1515
- </gds-text>
1516
- </gds-flex>
1517
- <gds-badge
1518
- variant="${String(row.status) === "Active" ? "positive" : String(row.status) === "Inactive" ? "negative" : String(row.status) === "Pending" ? "warning" : "information"}"
1519
- size="small"
1491
+ <gds-table
1492
+ plain
1493
+ slot="expand:${row.id}:full"
1494
+ .columns=${Users.Columns}
1495
+ .data=${Users.Data}
1496
+ @gds-table-data-loaded=${(e) => e.stopPropagation()}
1497
+ ></gds-table>
1498
+ ` : html`
1499
+ <gds-card
1500
+ slot="expand:${row.id}:full"
1501
+ variant="neutral-02-outlined"
1502
+ >
1503
+ <gds-flex flex-direction="column" gap="m" padding="m">
1504
+ <gds-flex
1505
+ justify-content="space-between"
1506
+ align-items="center"
1507
+ flex-wrap="wrap"
1508
+ gap="s"
1520
1509
  >
1521
- ${String(row.status)}
1522
- </gds-badge>
1523
- </gds-flex>
1524
-
1525
- <gds-grid columns="1; s{1}; m{2}; l{4}" gap="s">
1526
- <gds-card variant="neutral-02-outlined" padding="s">
1527
- <gds-flex flex-direction="column" gap="2xs">
1528
- <gds-text font="detail-s-book">Manager</gds-text>
1529
- <gds-text font="detail-s-bold">
1530
- ${String(row.manager)}
1531
- </gds-text>
1532
- </gds-flex>
1533
- </gds-card>
1534
- <gds-card variant="neutral-02-outlined" padding="s">
1535
- <gds-flex flex-direction="column" gap="2xs">
1536
- <gds-text font="detail-s-book">Team</gds-text>
1537
- <gds-text font="detail-s-bold">
1538
- ${String(row.team)}
1539
- </gds-text>
1540
- </gds-flex>
1541
- </gds-card>
1542
- <gds-card variant="neutral-02-outlined" padding="s">
1543
1510
  <gds-flex flex-direction="column" gap="2xs">
1544
- <gds-text font="detail-s-book">Cost Center</gds-text>
1545
- <gds-text font="detail-s-bold">
1546
- ${String(row.costCenter)}
1511
+ <gds-text font="heading-xs">
1512
+ ${String(row.name)} - Extended Details
1547
1513
  </gds-text>
1548
- </gds-flex>
1549
- </gds-card>
1550
- <gds-card variant="neutral-02-outlined" padding="s">
1551
- <gds-flex flex-direction="column" gap="2xs">
1552
- <gds-text font="detail-s-book">Project</gds-text>
1553
- <gds-text font="detail-s-bold">
1554
- ${String(row.project)}
1514
+ <gds-text font="detail-s-book">
1515
+ ${String(row.department)} · ${String(row.region)} ·
1516
+ ${String(row.priority)} priority
1555
1517
  </gds-text>
1556
1518
  </gds-flex>
1557
- </gds-card>
1558
- </gds-grid>
1519
+ <gds-badge
1520
+ variant="${String(row.status) === "Active" ? "positive" : String(row.status) === "Inactive" ? "negative" : String(row.status) === "Pending" ? "warning" : "information"}"
1521
+ size="small"
1522
+ >
1523
+ ${String(row.status)}
1524
+ </gds-badge>
1525
+ </gds-flex>
1559
1526
 
1560
- <gds-flex gap="s" flex-wrap="wrap">
1561
- <gds-button size="small">View profile</gds-button>
1562
- <gds-button rank="secondary" size="small"
1563
- >Edit</gds-button
1564
- >
1565
- <gds-button rank="tertiary" size="small"
1566
- >Export</gds-button
1567
- >
1527
+ <gds-grid columns="1; s{1}; m{2}; l{4}" gap="s">
1528
+ <gds-card variant="neutral-02-outlined" padding="s">
1529
+ <gds-flex flex-direction="column" gap="2xs">
1530
+ <gds-text font="detail-s-book">Manager</gds-text>
1531
+ <gds-text font="detail-s-bold">
1532
+ ${String(row.manager)}
1533
+ </gds-text>
1534
+ </gds-flex>
1535
+ </gds-card>
1536
+ <gds-card variant="neutral-02-outlined" padding="s">
1537
+ <gds-flex flex-direction="column" gap="2xs">
1538
+ <gds-text font="detail-s-book">Team</gds-text>
1539
+ <gds-text font="detail-s-bold">
1540
+ ${String(row.team)}
1541
+ </gds-text>
1542
+ </gds-flex>
1543
+ </gds-card>
1544
+ <gds-card variant="neutral-02-outlined" padding="s">
1545
+ <gds-flex flex-direction="column" gap="2xs">
1546
+ <gds-text font="detail-s-book"
1547
+ >Cost Center</gds-text
1548
+ >
1549
+ <gds-text font="detail-s-bold">
1550
+ ${String(row.costCenter)}
1551
+ </gds-text>
1552
+ </gds-flex>
1553
+ </gds-card>
1554
+ <gds-card variant="neutral-02-outlined" padding="s">
1555
+ <gds-flex flex-direction="column" gap="2xs">
1556
+ <gds-text font="detail-s-book">Project</gds-text>
1557
+ <gds-text font="detail-s-bold">
1558
+ ${String(row.project)}
1559
+ </gds-text>
1560
+ </gds-flex>
1561
+ </gds-card>
1562
+ </gds-grid>
1563
+
1564
+ <gds-flex gap="s" flex-wrap="wrap">
1565
+ <gds-button size="small">View profile</gds-button>
1566
+ <gds-button rank="secondary" size="small"
1567
+ >Edit</gds-button
1568
+ >
1569
+ <gds-button rank="tertiary" size="small"
1570
+ >Export</gds-button
1571
+ >
1572
+ </gds-flex>
1568
1573
  </gds-flex>
1569
- </gds-flex>
1570
- </gds-card>
1571
- ` : null}
1574
+ </gds-card>
1575
+ ` : null}
1572
1576
  `
1573
1577
  )}
1574
1578
  `