@teambit/workspace 1.0.982 → 1.0.984

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 (44) hide show
  1. package/dist/{preview-1778613913688.js → preview-1778681054666.js} +2 -2
  2. package/dist/ui/workspace/workspace-overview/card-overlays.d.ts +4 -0
  3. package/dist/ui/workspace/workspace-overview/card-overlays.js +133 -0
  4. package/dist/ui/workspace/workspace-overview/card-overlays.js.map +1 -0
  5. package/dist/ui/workspace/workspace-overview/card-overlays.module.scss +72 -0
  6. package/dist/ui/workspace/workspace-overview/filter-utils.d.ts +4 -1
  7. package/dist/ui/workspace/workspace-overview/filter-utils.js +17 -1
  8. package/dist/ui/workspace/workspace-overview/filter-utils.js.map +1 -1
  9. package/dist/ui/workspace/workspace-overview/hope-component-card.d.ts +14 -0
  10. package/dist/ui/workspace/workspace-overview/hope-component-card.js +186 -0
  11. package/dist/ui/workspace/workspace-overview/hope-component-card.js.map +1 -0
  12. package/dist/ui/workspace/workspace-overview/hope-component-card.module.scss +162 -0
  13. package/dist/ui/workspace/workspace-overview/namespace-header.d.ts +8 -0
  14. package/dist/ui/workspace/workspace-overview/namespace-header.js +107 -0
  15. package/dist/ui/workspace/workspace-overview/namespace-header.js.map +1 -0
  16. package/dist/ui/workspace/workspace-overview/namespace-header.module.scss +88 -0
  17. package/dist/ui/workspace/workspace-overview/use-workspace-aggregation.js +11 -5
  18. package/dist/ui/workspace/workspace-overview/use-workspace-aggregation.js.map +1 -1
  19. package/dist/ui/workspace/workspace-overview/workspace-filter-panel.js +8 -6
  20. package/dist/ui/workspace/workspace-overview/workspace-filter-panel.js.map +1 -1
  21. package/dist/ui/workspace/workspace-overview/workspace-overview.d.ts +0 -6
  22. package/dist/ui/workspace/workspace-overview/workspace-overview.js +38 -105
  23. package/dist/ui/workspace/workspace-overview/workspace-overview.js.map +1 -1
  24. package/dist/ui/workspace/workspace-overview/workspace-overview.module.scss +38 -158
  25. package/dist/ui/workspace/workspace-overview/workspace-overview.types.d.ts +6 -0
  26. package/dist/ui/workspace/workspace-overview/workspace-overview.types.js.map +1 -1
  27. package/dist/ui/workspace/workspace.js +22 -5
  28. package/dist/ui/workspace/workspace.js.map +1 -1
  29. package/dist/ui/workspace/workspace.module.scss +38 -30
  30. package/package.json +43 -44
  31. package/ui/workspace/workspace-overview/card-overlays.module.scss +72 -0
  32. package/ui/workspace/workspace-overview/card-overlays.tsx +66 -0
  33. package/ui/workspace/workspace-overview/filter-utils.ts +18 -1
  34. package/ui/workspace/workspace-overview/hope-component-card.module.scss +162 -0
  35. package/ui/workspace/workspace-overview/hope-component-card.tsx +152 -0
  36. package/ui/workspace/workspace-overview/namespace-header.module.scss +88 -0
  37. package/ui/workspace/workspace-overview/namespace-header.tsx +72 -0
  38. package/ui/workspace/workspace-overview/use-workspace-aggregation.ts +11 -5
  39. package/ui/workspace/workspace-overview/workspace-filter-panel.tsx +10 -9
  40. package/ui/workspace/workspace-overview/workspace-overview.module.scss +38 -158
  41. package/ui/workspace/workspace-overview/workspace-overview.tsx +40 -88
  42. package/ui/workspace/workspace-overview/workspace-overview.types.ts +7 -1
  43. package/ui/workspace/workspace.module.scss +38 -30
  44. package/ui/workspace/workspace.tsx +24 -7
@@ -1,5 +1,5 @@
1
- import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.982/dist/workspace.composition.js';
2
- import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.982/dist/workspace.docs.mdx';
1
+ import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.984/dist/workspace.composition.js';
2
+ import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.workspace_workspace@1.0.984/dist/workspace.docs.mdx';
3
3
 
4
4
  export const compositions = [compositions_0];
5
5
  export const overview = [overview_0];
@@ -0,0 +1,4 @@
1
+ export declare function ChangedPill(): import("react/jsx-runtime").JSX.Element;
2
+ export declare function BuildSpinner(): import("react/jsx-runtime").JSX.Element;
3
+ export declare function BuildingPreview(): import("react/jsx-runtime").JSX.Element;
4
+ export declare function QueuedPreview(): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,133 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.BuildSpinner = BuildSpinner;
7
+ exports.BuildingPreview = BuildingPreview;
8
+ exports.ChangedPill = ChangedPill;
9
+ exports.QueuedPreview = QueuedPreview;
10
+ function _react() {
11
+ const data = _interopRequireDefault(require("react"));
12
+ _react = function () {
13
+ return data;
14
+ };
15
+ return data;
16
+ }
17
+ function _cardOverlaysModule() {
18
+ const data = _interopRequireDefault(require("./card-overlays.module.scss"));
19
+ _cardOverlaysModule = function () {
20
+ return data;
21
+ };
22
+ return data;
23
+ }
24
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
25
+ const accent = 'var(--bit-accent-color, #6c5ce7)';
26
+ const accentAlpha = pct => `color-mix(in srgb, var(--bit-accent-color, #6c5ce7) ${pct}%, transparent)`;
27
+ function ChangedPill() {
28
+ return /*#__PURE__*/_react().default.createElement("span", {
29
+ className: _cardOverlaysModule().default.changedPill
30
+ }, /*#__PURE__*/_react().default.createElement("span", {
31
+ className: _cardOverlaysModule().default.changedDot
32
+ }), "changed");
33
+ }
34
+ function BuildSpinner() {
35
+ return /*#__PURE__*/_react().default.createElement("div", {
36
+ className: _cardOverlaysModule().default.spinnerBadge
37
+ }, /*#__PURE__*/_react().default.createElement("svg", {
38
+ width: "14",
39
+ height: "14",
40
+ viewBox: "0 0 14 14"
41
+ }, /*#__PURE__*/_react().default.createElement("circle", {
42
+ cx: "7",
43
+ cy: "7",
44
+ r: "5",
45
+ stroke: accentAlpha(20),
46
+ strokeWidth: "1.5",
47
+ fill: "none"
48
+ }), /*#__PURE__*/_react().default.createElement("circle", {
49
+ cx: "7",
50
+ cy: "7",
51
+ r: "5",
52
+ stroke: accent,
53
+ strokeWidth: "1.5",
54
+ fill: "none",
55
+ strokeDasharray: "8 24",
56
+ strokeLinecap: "round",
57
+ className: _cardOverlaysModule().default.spinnerArc
58
+ })));
59
+ }
60
+ function BuildingPreview() {
61
+ return /*#__PURE__*/_react().default.createElement("div", {
62
+ className: _cardOverlaysModule().default.buildingPreview
63
+ }, /*#__PURE__*/_react().default.createElement("svg", {
64
+ width: "100%",
65
+ height: "100%",
66
+ preserveAspectRatio: "none",
67
+ className: _cardOverlaysModule().default.dotsPattern
68
+ }, /*#__PURE__*/_react().default.createElement("defs", null, /*#__PURE__*/_react().default.createElement("pattern", {
69
+ id: "dots-accent",
70
+ width: "14",
71
+ height: "14",
72
+ patternUnits: "userSpaceOnUse"
73
+ }, /*#__PURE__*/_react().default.createElement("circle", {
74
+ cx: "7",
75
+ cy: "7",
76
+ r: "1",
77
+ fill: accentAlpha(20)
78
+ }))), /*#__PURE__*/_react().default.createElement("rect", {
79
+ width: "100%",
80
+ height: "100%",
81
+ fill: "url(#dots-accent)"
82
+ })), /*#__PURE__*/_react().default.createElement("div", {
83
+ className: _cardOverlaysModule().default.buildingPlaceholder,
84
+ style: {
85
+ border: `1.5px dashed ${accentAlpha(40)}`
86
+ }
87
+ }, /*#__PURE__*/_react().default.createElement("div", {
88
+ style: {
89
+ height: 6,
90
+ width: '55%',
91
+ background: accentAlpha(27),
92
+ borderRadius: 3
93
+ }
94
+ }), /*#__PURE__*/_react().default.createElement("div", {
95
+ style: {
96
+ height: 4,
97
+ width: '85%',
98
+ background: accentAlpha(13),
99
+ borderRadius: 2
100
+ }
101
+ }), /*#__PURE__*/_react().default.createElement("div", {
102
+ style: {
103
+ height: 4,
104
+ width: '70%',
105
+ background: accentAlpha(13),
106
+ borderRadius: 2
107
+ }
108
+ })));
109
+ }
110
+ function QueuedPreview() {
111
+ return /*#__PURE__*/_react().default.createElement("div", {
112
+ className: _cardOverlaysModule().default.queuedPreview
113
+ }, /*#__PURE__*/_react().default.createElement("svg", {
114
+ width: "46",
115
+ height: "46",
116
+ viewBox: "0 0 46 46"
117
+ }, /*#__PURE__*/_react().default.createElement("circle", {
118
+ cx: "23",
119
+ cy: "23",
120
+ r: "20",
121
+ fill: "none",
122
+ stroke: accentAlpha(20),
123
+ strokeWidth: "1.2",
124
+ strokeDasharray: "3 4"
125
+ }), /*#__PURE__*/_react().default.createElement("circle", {
126
+ cx: "23",
127
+ cy: "23",
128
+ r: "3",
129
+ fill: accentAlpha(53)
130
+ })));
131
+ }
132
+
133
+ //# sourceMappingURL=card-overlays.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","data","_interopRequireDefault","require","_cardOverlaysModule","e","__esModule","default","accent","accentAlpha","pct","ChangedPill","createElement","className","styles","changedPill","changedDot","BuildSpinner","spinnerBadge","width","height","viewBox","cx","cy","r","stroke","strokeWidth","fill","strokeDasharray","strokeLinecap","spinnerArc","BuildingPreview","buildingPreview","preserveAspectRatio","dotsPattern","id","patternUnits","buildingPlaceholder","style","border","background","borderRadius","QueuedPreview","queuedPreview"],"sources":["card-overlays.tsx"],"sourcesContent":["import React from 'react';\nimport styles from './card-overlays.module.scss';\n\nconst accent = 'var(--bit-accent-color, #6c5ce7)';\nconst accentAlpha = (pct: number) => `color-mix(in srgb, var(--bit-accent-color, #6c5ce7) ${pct}%, transparent)`;\n\nexport function ChangedPill() {\n return (\n <span className={styles.changedPill}>\n <span className={styles.changedDot} />\n changed\n </span>\n );\n}\n\nexport function BuildSpinner() {\n return (\n <div className={styles.spinnerBadge}>\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" stroke={accentAlpha(20)} strokeWidth=\"1.5\" fill=\"none\" />\n <circle\n cx=\"7\"\n cy=\"7\"\n r=\"5\"\n stroke={accent}\n strokeWidth=\"1.5\"\n fill=\"none\"\n strokeDasharray=\"8 24\"\n strokeLinecap=\"round\"\n className={styles.spinnerArc}\n />\n </svg>\n </div>\n );\n}\n\nexport function BuildingPreview() {\n return (\n <div className={styles.buildingPreview}>\n <svg width=\"100%\" height=\"100%\" preserveAspectRatio=\"none\" className={styles.dotsPattern}>\n <defs>\n <pattern id=\"dots-accent\" width=\"14\" height=\"14\" patternUnits=\"userSpaceOnUse\">\n <circle cx=\"7\" cy=\"7\" r=\"1\" fill={accentAlpha(20)} />\n </pattern>\n </defs>\n <rect width=\"100%\" height=\"100%\" fill=\"url(#dots-accent)\" />\n </svg>\n <div className={styles.buildingPlaceholder} style={{ border: `1.5px dashed ${accentAlpha(40)}` }}>\n <div style={{ height: 6, width: '55%', background: accentAlpha(27), borderRadius: 3 }} />\n <div style={{ height: 4, width: '85%', background: accentAlpha(13), borderRadius: 2 }} />\n <div style={{ height: 4, width: '70%', background: accentAlpha(13), borderRadius: 2 }} />\n </div>\n </div>\n );\n}\n\nexport function QueuedPreview() {\n return (\n <div className={styles.queuedPreview}>\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\">\n <circle cx=\"23\" cy=\"23\" r=\"20\" fill=\"none\" stroke={accentAlpha(20)} strokeWidth=\"1.2\" strokeDasharray=\"3 4\" />\n <circle cx=\"23\" cy=\"23\" r=\"3\" fill={accentAlpha(53)} />\n </svg>\n </div>\n );\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,72 @@
1
+ .changedPill {
2
+ display: inline-flex;
3
+ align-items: center;
4
+ gap: 5px;
5
+ font-size: 10px;
6
+ padding: 3px 8px;
7
+ border-radius: 999px;
8
+ background: var(--warning-surface-color);
9
+ color: var(--warning-color);
10
+ font-weight: 600;
11
+ letter-spacing: 0.02em;
12
+ }
13
+
14
+ .changedDot {
15
+ width: 5px;
16
+ height: 5px;
17
+ border-radius: 50%;
18
+ background: var(--warning-color);
19
+ }
20
+
21
+ .spinnerBadge {
22
+ width: 22px;
23
+ height: 22px;
24
+ border-radius: 50%;
25
+ background: var(--surface-color);
26
+ display: inline-flex;
27
+ align-items: center;
28
+ justify-content: center;
29
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
30
+ }
31
+
32
+ .spinnerArc {
33
+ transform-origin: center;
34
+ animation: spinSlow 0.9s linear infinite;
35
+ }
36
+
37
+ .buildingPreview {
38
+ position: relative;
39
+ height: 100%;
40
+ }
41
+
42
+ .dotsPattern {
43
+ position: absolute;
44
+ inset: 0;
45
+ }
46
+
47
+ .buildingPlaceholder {
48
+ position: absolute;
49
+ inset: 20% 14%;
50
+ border-radius: 10px;
51
+ background: rgba(255, 255, 255, 0.55);
52
+ backdrop-filter: blur(2px);
53
+ display: flex;
54
+ flex-direction: column;
55
+ justify-content: center;
56
+ padding: 0 16px;
57
+ gap: 7px;
58
+ }
59
+
60
+ .queuedPreview {
61
+ position: absolute;
62
+ inset: 0;
63
+ display: flex;
64
+ align-items: center;
65
+ justify-content: center;
66
+ }
67
+
68
+ @keyframes spinSlow {
69
+ to {
70
+ transform: rotate(360deg);
71
+ }
72
+ }
@@ -1,7 +1,10 @@
1
- import type { WorkspaceItem } from './workspace-overview.types';
1
+ import type { WorkspaceItem, ComponentStatus } from './workspace-overview.types';
2
2
  export interface ActiveFilters {
3
3
  namespaces: string[];
4
4
  scopes: string[];
5
+ statuses: Set<ComponentStatus>;
5
6
  }
7
+ export declare const ALL_STATUSES: ComponentStatus[];
6
8
  export declare function parseActiveFilters(search: URLSearchParams): ActiveFilters;
9
+ export declare function getComponentStatus(item: WorkspaceItem): ComponentStatus;
7
10
  export declare function filterItems(items: WorkspaceItem[], filters: ActiveFilters): WorkspaceItem[];
@@ -3,20 +3,36 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ exports.ALL_STATUSES = void 0;
6
7
  exports.filterItems = filterItems;
8
+ exports.getComponentStatus = getComponentStatus;
7
9
  exports.parseActiveFilters = parseActiveFilters;
10
+ const ALL_STATUSES = exports.ALL_STATUSES = ['built', 'changed', 'building', 'queued'];
8
11
  function parseActiveFilters(search) {
9
12
  return {
10
13
  namespaces: (search.get('ns') || '').split(',').filter(Boolean),
11
- scopes: (search.get('scopes') || '').split(',').filter(Boolean)
14
+ scopes: (search.get('scopes') || '').split(',').filter(Boolean),
15
+ statuses: new Set(ALL_STATUSES)
12
16
  };
13
17
  }
18
+ function getComponentStatus(item) {
19
+ const buildStatus = item.component.buildStatus;
20
+ const status = item.component.status;
21
+ if (buildStatus === 'pending') return 'queued';
22
+ if (status?.modifyInfo?.hasModifiedFiles || status?.modifyInfo?.hasModifiedDependencies) return 'changed';
23
+ if (buildStatus === 'building') return 'building';
24
+ return 'built';
25
+ }
14
26
  function filterItems(items, filters) {
15
27
  return items.filter(item => {
16
28
  const ns = item.component.id.namespace || '/';
17
29
  const sc = item.component.id.scope;
18
30
  if (filters.namespaces.length && !filters.namespaces.includes(ns)) return false;
19
31
  if (filters.scopes.length && !filters.scopes.includes(sc)) return false;
32
+ if (filters.statuses.size > 0 && filters.statuses.size < ALL_STATUSES.length) {
33
+ const componentStatus = getComponentStatus(item);
34
+ if (!filters.statuses.has(componentStatus)) return false;
35
+ }
20
36
  return true;
21
37
  });
22
38
  }
@@ -1 +1 @@
1
- {"version":3,"names":["parseActiveFilters","search","namespaces","get","split","filter","Boolean","scopes","filterItems","items","filters","item","ns","component","id","namespace","sc","scope","length","includes"],"sources":["filter-utils.ts"],"sourcesContent":["import type { WorkspaceItem } from './workspace-overview.types';\n\nexport interface ActiveFilters {\n namespaces: string[];\n scopes: string[];\n}\n\nexport function parseActiveFilters(search: URLSearchParams): ActiveFilters {\n return {\n namespaces: (search.get('ns') || '').split(',').filter(Boolean),\n scopes: (search.get('scopes') || '').split(',').filter(Boolean),\n };\n}\n\nexport function filterItems(items: WorkspaceItem[], filters: ActiveFilters): WorkspaceItem[] {\n return items.filter((item) => {\n const ns = item.component.id.namespace || '/';\n const sc = item.component.id.scope;\n\n if (filters.namespaces.length && !filters.namespaces.includes(ns)) return false;\n if (filters.scopes.length && !filters.scopes.includes(sc)) return false;\n\n return true;\n });\n}\n"],"mappings":";;;;;;;AAOO,SAASA,kBAAkBA,CAACC,MAAuB,EAAiB;EACzE,OAAO;IACLC,UAAU,EAAE,CAACD,MAAM,CAACE,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,MAAM,CAACC,OAAO,CAAC;IAC/DC,MAAM,EAAE,CAACN,MAAM,CAACE,GAAG,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,MAAM,CAACC,OAAO;EAChE,CAAC;AACH;AAEO,SAASE,WAAWA,CAACC,KAAsB,EAAEC,OAAsB,EAAmB;EAC3F,OAAOD,KAAK,CAACJ,MAAM,CAAEM,IAAI,IAAK;IAC5B,MAAMC,EAAE,GAAGD,IAAI,CAACE,SAAS,CAACC,EAAE,CAACC,SAAS,IAAI,GAAG;IAC7C,MAAMC,EAAE,GAAGL,IAAI,CAACE,SAAS,CAACC,EAAE,CAACG,KAAK;IAElC,IAAIP,OAAO,CAACR,UAAU,CAACgB,MAAM,IAAI,CAACR,OAAO,CAACR,UAAU,CAACiB,QAAQ,CAACP,EAAE,CAAC,EAAE,OAAO,KAAK;IAC/E,IAAIF,OAAO,CAACH,MAAM,CAACW,MAAM,IAAI,CAACR,OAAO,CAACH,MAAM,CAACY,QAAQ,CAACH,EAAE,CAAC,EAAE,OAAO,KAAK;IAEvE,OAAO,IAAI;EACb,CAAC,CAAC;AACJ","ignoreList":[]}
1
+ {"version":3,"names":["ALL_STATUSES","exports","parseActiveFilters","search","namespaces","get","split","filter","Boolean","scopes","statuses","Set","getComponentStatus","item","buildStatus","component","status","modifyInfo","hasModifiedFiles","hasModifiedDependencies","filterItems","items","filters","ns","id","namespace","sc","scope","length","includes","size","componentStatus","has"],"sources":["filter-utils.ts"],"sourcesContent":["import type { WorkspaceItem, ComponentStatus } from './workspace-overview.types';\n\nexport interface ActiveFilters {\n namespaces: string[];\n scopes: string[];\n statuses: Set<ComponentStatus>;\n}\n\nexport const ALL_STATUSES: ComponentStatus[] = ['built', 'changed', 'building', 'queued'];\n\nexport function parseActiveFilters(search: URLSearchParams): ActiveFilters {\n return {\n namespaces: (search.get('ns') || '').split(',').filter(Boolean),\n scopes: (search.get('scopes') || '').split(',').filter(Boolean),\n statuses: new Set(ALL_STATUSES),\n };\n}\n\nexport function getComponentStatus(item: WorkspaceItem): ComponentStatus {\n const buildStatus = (item.component as any).buildStatus;\n const status = (item.component as any).status;\n if (buildStatus === 'pending') return 'queued';\n if (status?.modifyInfo?.hasModifiedFiles || status?.modifyInfo?.hasModifiedDependencies) return 'changed';\n if (buildStatus === 'building') return 'building';\n return 'built';\n}\n\nexport function filterItems(items: WorkspaceItem[], filters: ActiveFilters): WorkspaceItem[] {\n return items.filter((item) => {\n const ns = item.component.id.namespace || '/';\n const sc = item.component.id.scope;\n\n if (filters.namespaces.length && !filters.namespaces.includes(ns)) return false;\n if (filters.scopes.length && !filters.scopes.includes(sc)) return false;\n if (filters.statuses.size > 0 && filters.statuses.size < ALL_STATUSES.length) {\n const componentStatus = getComponentStatus(item);\n if (!filters.statuses.has(componentStatus)) return false;\n }\n\n return true;\n });\n}\n"],"mappings":";;;;;;;;;AAQO,MAAMA,YAA+B,GAAAC,OAAA,CAAAD,YAAA,GAAG,CAAC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,CAAC;AAElF,SAASE,kBAAkBA,CAACC,MAAuB,EAAiB;EACzE,OAAO;IACLC,UAAU,EAAE,CAACD,MAAM,CAACE,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,MAAM,CAACC,OAAO,CAAC;IAC/DC,MAAM,EAAE,CAACN,MAAM,CAACE,GAAG,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,MAAM,CAACC,OAAO,CAAC;IAC/DE,QAAQ,EAAE,IAAIC,GAAG,CAACX,YAAY;EAChC,CAAC;AACH;AAEO,SAASY,kBAAkBA,CAACC,IAAmB,EAAmB;EACvE,MAAMC,WAAW,GAAID,IAAI,CAACE,SAAS,CAASD,WAAW;EACvD,MAAME,MAAM,GAAIH,IAAI,CAACE,SAAS,CAASC,MAAM;EAC7C,IAAIF,WAAW,KAAK,SAAS,EAAE,OAAO,QAAQ;EAC9C,IAAIE,MAAM,EAAEC,UAAU,EAAEC,gBAAgB,IAAIF,MAAM,EAAEC,UAAU,EAAEE,uBAAuB,EAAE,OAAO,SAAS;EACzG,IAAIL,WAAW,KAAK,UAAU,EAAE,OAAO,UAAU;EACjD,OAAO,OAAO;AAChB;AAEO,SAASM,WAAWA,CAACC,KAAsB,EAAEC,OAAsB,EAAmB;EAC3F,OAAOD,KAAK,CAACd,MAAM,CAAEM,IAAI,IAAK;IAC5B,MAAMU,EAAE,GAAGV,IAAI,CAACE,SAAS,CAACS,EAAE,CAACC,SAAS,IAAI,GAAG;IAC7C,MAAMC,EAAE,GAAGb,IAAI,CAACE,SAAS,CAACS,EAAE,CAACG,KAAK;IAElC,IAAIL,OAAO,CAAClB,UAAU,CAACwB,MAAM,IAAI,CAACN,OAAO,CAAClB,UAAU,CAACyB,QAAQ,CAACN,EAAE,CAAC,EAAE,OAAO,KAAK;IAC/E,IAAID,OAAO,CAACb,MAAM,CAACmB,MAAM,IAAI,CAACN,OAAO,CAACb,MAAM,CAACoB,QAAQ,CAACH,EAAE,CAAC,EAAE,OAAO,KAAK;IACvE,IAAIJ,OAAO,CAACZ,QAAQ,CAACoB,IAAI,GAAG,CAAC,IAAIR,OAAO,CAACZ,QAAQ,CAACoB,IAAI,GAAG9B,YAAY,CAAC4B,MAAM,EAAE;MAC5E,MAAMG,eAAe,GAAGnB,kBAAkB,CAACC,IAAI,CAAC;MAChD,IAAI,CAACS,OAAO,CAACZ,QAAQ,CAACsB,GAAG,CAACD,eAAe,CAAC,EAAE,OAAO,KAAK;IAC1D;IAEA,OAAO,IAAI;EACb,CAAC,CAAC;AACJ","ignoreList":[]}
@@ -0,0 +1,14 @@
1
+ import type { ComponentModel } from '@teambit/component';
2
+ import type { ComponentDescriptor } from '@teambit/component-descriptor';
3
+ import type { ScopeID } from '@teambit/scopes.scope-id';
4
+ export type HopeComponentCardProps = {
5
+ component: ComponentModel;
6
+ componentDescriptor: ComponentDescriptor;
7
+ scope?: {
8
+ id: ScopeID;
9
+ icon?: string;
10
+ backgroundIconColor?: string;
11
+ };
12
+ showPreview?: boolean;
13
+ };
14
+ export declare function HopeComponentCard({ component, componentDescriptor, scope, showPreview: showPreviewProp, }: HopeComponentCardProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,186 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.HopeComponentCard = HopeComponentCard;
7
+ function _react() {
8
+ const data = _interopRequireWildcard(require("react"));
9
+ _react = function () {
10
+ return data;
11
+ };
12
+ return data;
13
+ }
14
+ function _baseReactNavigation() {
15
+ const data = require("@teambit/base-react.navigation.link");
16
+ _baseReactNavigation = function () {
17
+ return data;
18
+ };
19
+ return data;
20
+ }
21
+ function _previewUi() {
22
+ const data = require("@teambit/preview.ui.preview-placeholder");
23
+ _previewUi = function () {
24
+ return data;
25
+ };
26
+ return data;
27
+ }
28
+ function _designUi() {
29
+ const data = require("@teambit/design.ui.tooltip");
30
+ _designUi = function () {
31
+ return data;
32
+ };
33
+ return data;
34
+ }
35
+ function _workspaceUi() {
36
+ const data = require("@teambit/workspace.ui.load-preview");
37
+ _workspaceUi = function () {
38
+ return data;
39
+ };
40
+ return data;
41
+ }
42
+ function _componentId() {
43
+ const data = require("@teambit/component-id");
44
+ _componentId = function () {
45
+ return data;
46
+ };
47
+ return data;
48
+ }
49
+ function _filterUtils() {
50
+ const data = require("./filter-utils");
51
+ _filterUtils = function () {
52
+ return data;
53
+ };
54
+ return data;
55
+ }
56
+ function _cardOverlays() {
57
+ const data = require("./card-overlays");
58
+ _cardOverlays = function () {
59
+ return data;
60
+ };
61
+ return data;
62
+ }
63
+ function _hopeComponentCardModule() {
64
+ const data = _interopRequireDefault(require("./hope-component-card.module.scss"));
65
+ _hopeComponentCardModule = function () {
66
+ return data;
67
+ };
68
+ return data;
69
+ }
70
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
71
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
72
+ function HopeComponentCard({
73
+ component,
74
+ componentDescriptor,
75
+ scope,
76
+ showPreview: showPreviewProp
77
+ }) {
78
+ const [shouldShowPreview, setShouldShowPreview] = (0, _react().useState)(Boolean(showPreviewProp));
79
+ const prevServerUrlRef = (0, _react().useRef)(component.server?.url);
80
+ (0, _react().useEffect)(() => {
81
+ if (prevServerUrlRef.current !== component.server?.url && shouldShowPreview) {
82
+ setShouldShowPreview(false);
83
+ setTimeout(() => setShouldShowPreview(true), 50);
84
+ }
85
+ prevServerUrlRef.current = component.server?.url;
86
+ }, [component.server?.url]);
87
+ (0, _react().useEffect)(() => {
88
+ setShouldShowPreview(Boolean(showPreviewProp));
89
+ }, [showPreviewProp]);
90
+ const item = {
91
+ component
92
+ };
93
+ const status = (0, _filterUtils().getComponentStatus)(item);
94
+ const accent = 'var(--bit-accent-color, #6c5ce7)';
95
+ const isBuilding = status === 'building';
96
+ const isQueued = status === 'queued';
97
+ const isChanged = status === 'changed';
98
+ const href = `${component.id.fullName}?scope=${component.id.scope}`;
99
+ const loadPreviewVisible = component.compositions.length > 0 && !isBuilding && !shouldShowPreview;
100
+ const showPreviewClick = e => {
101
+ e.stopPropagation();
102
+ e.preventDefault();
103
+ setShouldShowPreview(true);
104
+ };
105
+ const envAspect = componentDescriptor.get('teambit.envs/envs');
106
+ const env = envAspect?.data || envAspect;
107
+ const envComponentId = env?.id ? _componentId().ComponentID.fromString(env.id) : undefined;
108
+ const cardClass = isBuilding ? _hopeComponentCardModule().default.cardBuilding : _hopeComponentCardModule().default.card;
109
+ const buildingBorderStyle = isBuilding ? {
110
+ borderColor: accent,
111
+ boxShadow: `0 0 0 3px color-mix(in srgb, var(--bit-accent-color, #6c5ce7) 10%, transparent)`
112
+ } : undefined;
113
+ const nameLabel = component.id.namespace ? `${component.id.namespace}/${component.id.name}` : component.id.name;
114
+ const shortHash = component.id.version?.slice(0, 7);
115
+ const scopeInitial = component.id.scope?.split('.').pop()?.charAt(0).toUpperCase();
116
+ return /*#__PURE__*/_react().default.createElement("div", {
117
+ className: cardClass,
118
+ style: buildingBorderStyle
119
+ }, loadPreviewVisible && /*#__PURE__*/_react().default.createElement(_workspaceUi().LoadPreview, {
120
+ className: _hopeComponentCardModule().default.loadPreview,
121
+ onClick: showPreviewClick
122
+ }), /*#__PURE__*/_react().default.createElement(_baseReactNavigation().Link, {
123
+ href: href,
124
+ className: _hopeComponentCardModule().default.linkWrapper
125
+ }, /*#__PURE__*/_react().default.createElement("div", {
126
+ className: _hopeComponentCardModule().default.preview
127
+ }, /*#__PURE__*/_react().default.createElement("div", {
128
+ className: _hopeComponentCardModule().default.previewInner
129
+ }, /*#__PURE__*/_react().default.createElement(CardPreview, {
130
+ component: component,
131
+ componentDescriptor: componentDescriptor,
132
+ status: status,
133
+ shouldShowPreview: shouldShowPreview
134
+ })), !isQueued && env?.icon && /*#__PURE__*/_react().default.createElement("div", {
135
+ className: _hopeComponentCardModule().default.envBadge
136
+ }, /*#__PURE__*/_react().default.createElement(_designUi().Tooltip, {
137
+ delay: 300,
138
+ content: envComponentId?.name
139
+ }, /*#__PURE__*/_react().default.createElement("img", {
140
+ src: env.icon,
141
+ className: _hopeComponentCardModule().default.envIcon,
142
+ alt: ""
143
+ }))), (isChanged || isBuilding) && /*#__PURE__*/_react().default.createElement("div", {
144
+ className: _hopeComponentCardModule().default.statusCorner
145
+ }, isChanged && /*#__PURE__*/_react().default.createElement(_cardOverlays().ChangedPill, null), isBuilding && /*#__PURE__*/_react().default.createElement(_cardOverlays().BuildSpinner, null))), /*#__PURE__*/_react().default.createElement("div", {
146
+ className: _hopeComponentCardModule().default.footer
147
+ }, /*#__PURE__*/_react().default.createElement(_designUi().Tooltip, {
148
+ delay: 300,
149
+ content: component.id.scope
150
+ }, /*#__PURE__*/_react().default.createElement("div", {
151
+ className: _hopeComponentCardModule().default.scopeBadge,
152
+ style: {
153
+ background: scope?.backgroundIconColor || accent
154
+ }
155
+ }, scope?.icon ? /*#__PURE__*/_react().default.createElement("img", {
156
+ src: scope.icon,
157
+ className: _hopeComponentCardModule().default.scopeBadgeIcon,
158
+ alt: ""
159
+ }) : /*#__PURE__*/_react().default.createElement("span", {
160
+ className: _hopeComponentCardModule().default.scopeBadgeInitial
161
+ }, scopeInitial))), /*#__PURE__*/_react().default.createElement("span", {
162
+ className: _hopeComponentCardModule().default.name
163
+ }, nameLabel), !isBuilding && !isQueued && shortHash && /*#__PURE__*/_react().default.createElement("span", {
164
+ className: _hopeComponentCardModule().default.hash
165
+ }, shortHash), isBuilding && /*#__PURE__*/_react().default.createElement("span", {
166
+ className: _hopeComponentCardModule().default.buildingLabel,
167
+ style: {
168
+ color: accent
169
+ }
170
+ }, "BUILDING"))));
171
+ }
172
+ function CardPreview({
173
+ component,
174
+ componentDescriptor,
175
+ status,
176
+ shouldShowPreview
177
+ }) {
178
+ if (status === 'building') return /*#__PURE__*/_react().default.createElement(_cardOverlays().BuildingPreview, null);
179
+ return /*#__PURE__*/_react().default.createElement(_previewUi().PreviewPlaceholder, {
180
+ component: component,
181
+ componentDescriptor: componentDescriptor,
182
+ shouldShowPreview: shouldShowPreview
183
+ });
184
+ }
185
+
186
+ //# sourceMappingURL=hope-component-card.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","data","_interopRequireWildcard","require","_baseReactNavigation","_previewUi","_designUi","_workspaceUi","_componentId","_filterUtils","_cardOverlays","_hopeComponentCardModule","_interopRequireDefault","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","HopeComponentCard","component","componentDescriptor","scope","showPreview","showPreviewProp","shouldShowPreview","setShouldShowPreview","useState","Boolean","prevServerUrlRef","useRef","server","url","useEffect","current","setTimeout","item","status","getComponentStatus","accent","isBuilding","isQueued","isChanged","href","id","fullName","loadPreviewVisible","compositions","length","showPreviewClick","stopPropagation","preventDefault","envAspect","env","envComponentId","ComponentID","fromString","undefined","cardClass","styles","cardBuilding","card","buildingBorderStyle","borderColor","boxShadow","nameLabel","namespace","name","shortHash","version","slice","scopeInitial","split","pop","charAt","toUpperCase","createElement","className","style","LoadPreview","loadPreview","onClick","Link","linkWrapper","preview","previewInner","CardPreview","icon","envBadge","Tooltip","delay","content","src","envIcon","alt","statusCorner","ChangedPill","BuildSpinner","footer","scopeBadge","background","backgroundIconColor","scopeBadgeIcon","scopeBadgeInitial","hash","buildingLabel","color","BuildingPreview","PreviewPlaceholder"],"sources":["hope-component-card.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Link } from '@teambit/base-react.navigation.link';\nimport { PreviewPlaceholder } from '@teambit/preview.ui.preview-placeholder';\nimport { Tooltip } from '@teambit/design.ui.tooltip';\nimport { LoadPreview } from '@teambit/workspace.ui.load-preview';\nimport { ComponentID } from '@teambit/component-id';\nimport type { ComponentModel } from '@teambit/component';\nimport type { ComponentDescriptor } from '@teambit/component-descriptor';\nimport type { ScopeID } from '@teambit/scopes.scope-id';\nimport { getComponentStatus } from './filter-utils';\nimport { ChangedPill, BuildSpinner, BuildingPreview } from './card-overlays';\nimport styles from './hope-component-card.module.scss';\n\nexport type HopeComponentCardProps = {\n component: ComponentModel;\n componentDescriptor: ComponentDescriptor;\n scope?: { id: ScopeID; icon?: string; backgroundIconColor?: string };\n showPreview?: boolean;\n};\n\nexport function HopeComponentCard({\n component,\n componentDescriptor,\n scope,\n showPreview: showPreviewProp,\n}: HopeComponentCardProps) {\n const [shouldShowPreview, setShouldShowPreview] = useState(Boolean(showPreviewProp));\n const prevServerUrlRef = useRef(component.server?.url);\n\n useEffect(() => {\n if (prevServerUrlRef.current !== component.server?.url && shouldShowPreview) {\n setShouldShowPreview(false);\n setTimeout(() => setShouldShowPreview(true), 50);\n }\n prevServerUrlRef.current = component.server?.url;\n }, [component.server?.url]);\n\n useEffect(() => {\n setShouldShowPreview(Boolean(showPreviewProp));\n }, [showPreviewProp]);\n\n const item = { component } as any;\n const status = getComponentStatus(item);\n const accent = 'var(--bit-accent-color, #6c5ce7)';\n\n const isBuilding = status === 'building';\n const isQueued = status === 'queued';\n const isChanged = status === 'changed';\n\n const href = `${component.id.fullName}?scope=${component.id.scope}`;\n\n const loadPreviewVisible = component.compositions.length > 0 && !isBuilding && !shouldShowPreview;\n\n const showPreviewClick = (e: React.MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n setShouldShowPreview(true);\n };\n\n const envAspect = componentDescriptor.get<any>('teambit.envs/envs');\n const env = envAspect?.data || envAspect;\n const envComponentId = env?.id ? ComponentID.fromString(env.id) : undefined;\n\n const cardClass = isBuilding ? styles.cardBuilding : styles.card;\n const buildingBorderStyle = isBuilding\n ? {\n borderColor: accent,\n boxShadow: `0 0 0 3px color-mix(in srgb, var(--bit-accent-color, #6c5ce7) 10%, transparent)`,\n }\n : undefined;\n\n const nameLabel = component.id.namespace ? `${component.id.namespace}/${component.id.name}` : component.id.name;\n\n const shortHash = component.id.version?.slice(0, 7);\n\n const scopeInitial = component.id.scope?.split('.').pop()?.charAt(0).toUpperCase();\n\n return (\n <div className={cardClass} style={buildingBorderStyle}>\n {loadPreviewVisible && <LoadPreview className={styles.loadPreview} onClick={showPreviewClick} />}\n\n <Link href={href} className={styles.linkWrapper}>\n <div className={styles.preview}>\n <div className={styles.previewInner}>\n <CardPreview\n component={component}\n componentDescriptor={componentDescriptor}\n status={status}\n shouldShowPreview={shouldShowPreview}\n />\n </div>\n\n {!isQueued && env?.icon && (\n <div className={styles.envBadge}>\n <Tooltip delay={300} content={envComponentId?.name}>\n <img src={env.icon} className={styles.envIcon} alt=\"\" />\n </Tooltip>\n </div>\n )}\n\n {(isChanged || isBuilding) && (\n <div className={styles.statusCorner}>\n {isChanged && <ChangedPill />}\n {isBuilding && <BuildSpinner />}\n </div>\n )}\n </div>\n\n <div className={styles.footer}>\n <Tooltip delay={300} content={component.id.scope}>\n <div className={styles.scopeBadge} style={{ background: scope?.backgroundIconColor || accent }}>\n {scope?.icon ? (\n <img src={scope.icon} className={styles.scopeBadgeIcon} alt=\"\" />\n ) : (\n <span className={styles.scopeBadgeInitial}>{scopeInitial}</span>\n )}\n </div>\n </Tooltip>\n <span className={styles.name}>{nameLabel}</span>\n {!isBuilding && !isQueued && shortHash && <span className={styles.hash}>{shortHash}</span>}\n {isBuilding && (\n <span className={styles.buildingLabel} style={{ color: accent }}>\n BUILDING\n </span>\n )}\n </div>\n </Link>\n </div>\n );\n}\n\nfunction CardPreview({\n component,\n componentDescriptor,\n status,\n shouldShowPreview,\n}: {\n component: ComponentModel;\n componentDescriptor: ComponentDescriptor;\n status: string;\n shouldShowPreview: boolean;\n}) {\n if (status === 'building') return <BuildingPreview />;\n\n return (\n <PreviewPlaceholder\n component={component}\n componentDescriptor={componentDescriptor}\n shouldShowPreview={shouldShowPreview}\n />\n );\n}\n"],"mappings":"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","ignoreList":[]}