@teambit/component 0.0.654 → 0.0.655

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.
@@ -1 +1 @@
1
- export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.654/dist/component.docs.mdx')]
1
+ export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.655/dist/component.docs.mdx')]
package/dist/index.d.ts CHANGED
@@ -17,7 +17,8 @@ export { ComponentMap } from './component-map';
17
17
  export type { ComponentMain } from './component.main.runtime';
18
18
  export type { ComponentUI } from './component.ui.runtime';
19
19
  export { Section } from './section';
20
- export { ComponentContext } from './ui/context/component-context';
20
+ export { ComponentContext, ComponentDescriptorContext } from './ui/context/component-context';
21
+ export type { ComponentProviderProps, ComponentDescriptorProviderProps } from './ui/context';
21
22
  export { ConsumePlugin } from './ui/menu';
22
23
  export { RegisteredComponentRoute, ComponentUrlParams } from './component.route';
23
24
  export { ComponentModel, ComponentModelProps } from './ui/component-model';
package/dist/index.js CHANGED
@@ -35,6 +35,12 @@ Object.defineProperty(exports, "ComponentContext", {
35
35
  return _componentContext().ComponentContext;
36
36
  }
37
37
  });
38
+ Object.defineProperty(exports, "ComponentDescriptorContext", {
39
+ enumerable: true,
40
+ get: function () {
41
+ return _componentContext().ComponentDescriptorContext;
42
+ }
43
+ });
38
44
  Object.defineProperty(exports, "ComponentFS", {
39
45
  enumerable: true,
40
46
  get: function () {
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":["ComponentAspect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAnBA;AACA;AAGA;AACA;AAeA;AACA;eAEeA,4B","sourcesContent":["import { ComponentAspect } from './component.aspect';\n\nexport { useComponentHost } from './host';\nexport { Component, InvalidComponent } from './component';\nexport { ComponentID } from '@teambit/component-id';\nexport { default as ComponentFS } from './component-fs';\nexport type { default as ComponentConfig } from './config';\nexport type { ComponentFactory } from './component-factory';\nexport type { AspectList } from './aspect-list';\nexport { AspectEntry, AspectData, ResolveComponentIdFunc } from './aspect-entry';\n// TODO: check why it's not working when using the index in snap dir like this:\n// export { Snap, Author } from './snap';\nexport { Snap, SnapProps } from './snap/snap';\nexport type { Author } from './snap/author';\n// TODO: check why it's not working when using the index in tag dir like this:\n// export { Tag } from './tag';\nexport { Tag, TagProps } from './tag/tag';\nexport { State } from './state';\nexport type { Hash } from './hash';\nexport { TagMap } from './tag-map';\nexport { ComponentMap } from './component-map';\nexport type { ComponentMain } from './component.main.runtime';\nexport type { ComponentUI } from './component.ui.runtime';\nexport { Section } from './section';\nexport { ComponentContext } from './ui/context/component-context';\nexport { ConsumePlugin } from './ui/menu';\nexport { RegisteredComponentRoute, ComponentUrlParams } from './component.route';\nexport { ComponentModel, ComponentModelProps } from './ui/component-model';\nexport type { ShowFragment, ShowRow } from './show';\nexport { default as Config } from './config';\n// export { AspectList } from './aspect-list';\n// export { AspectEntry } from './aspect-entry';\nexport { ComponentAspect };\nexport default ComponentAspect;\n"]}
1
+ {"version":3,"sources":["index.ts"],"names":["ComponentAspect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AApBA;AACA;AAGA;AACA;AAgBA;AACA;eAEeA,4B","sourcesContent":["import { ComponentAspect } from './component.aspect';\n\nexport { useComponentHost } from './host';\nexport { Component, InvalidComponent } from './component';\nexport { ComponentID } from '@teambit/component-id';\nexport { default as ComponentFS } from './component-fs';\nexport type { default as ComponentConfig } from './config';\nexport type { ComponentFactory } from './component-factory';\nexport type { AspectList } from './aspect-list';\nexport { AspectEntry, AspectData, ResolveComponentIdFunc } from './aspect-entry';\n// TODO: check why it's not working when using the index in snap dir like this:\n// export { Snap, Author } from './snap';\nexport { Snap, SnapProps } from './snap/snap';\nexport type { Author } from './snap/author';\n// TODO: check why it's not working when using the index in tag dir like this:\n// export { Tag } from './tag';\nexport { Tag, TagProps } from './tag/tag';\nexport { State } from './state';\nexport type { Hash } from './hash';\nexport { TagMap } from './tag-map';\nexport { ComponentMap } from './component-map';\nexport type { ComponentMain } from './component.main.runtime';\nexport type { ComponentUI } from './component.ui.runtime';\nexport { Section } from './section';\nexport { ComponentContext, ComponentDescriptorContext } from './ui/context/component-context';\nexport type { ComponentProviderProps, ComponentDescriptorProviderProps } from './ui/context';\nexport { ConsumePlugin } from './ui/menu';\nexport { RegisteredComponentRoute, ComponentUrlParams } from './component.route';\nexport { ComponentModel, ComponentModelProps } from './ui/component-model';\nexport type { ShowFragment, ShowRow } from './show';\nexport { default as Config } from './config';\n// export { AspectList } from './aspect-list';\n// export { AspectEntry } from './aspect-entry';\nexport { ComponentAspect };\nexport default ComponentAspect;\n"]}
@@ -84,6 +84,7 @@ function Component({
84
84
  }) {
85
85
  const {
86
86
  component,
87
+ componentDescriptor,
87
88
  error
88
89
  } = (0, _useComponent().useComponent)(host); // trigger onComponentChange when component changes
89
90
 
@@ -95,13 +96,15 @@ function Component({
95
96
  const after = (0, _react().useMemo)(() => pageItems.filter(x => x.type === 'after').map(x => x.content), [pageItems]);
96
97
  if (error) return error.renderError();
97
98
  if (!component) return /*#__PURE__*/_react().default.createElement("div", null);
98
- return /*#__PURE__*/_react().default.createElement(_context().ComponentProvider, {
99
+ return /*#__PURE__*/_react().default.createElement(_context().ComponentDescriptorProvider, {
100
+ componentDescriptor: componentDescriptor
101
+ }, /*#__PURE__*/_react().default.createElement(_context().ComponentProvider, {
99
102
  component: component
100
103
  }, before, /*#__PURE__*/_react().default.createElement("div", {
101
104
  className: _componentModule().default.container
102
105
  }, routeSlot && /*#__PURE__*/_react().default.createElement(_uiFoundationUiReactRouter().SlotSubRouter, {
103
106
  slot: routeSlot
104
- })), after);
107
+ })), after));
105
108
  }
106
109
 
107
110
  //# sourceMappingURL=component.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["component.tsx"],"names":["Component","routeSlot","containerSlot","host","onComponentChange","component","error","undefined","pageItems","values","before","filter","x","type","map","content","after","renderError","styles","container"],"mappings":";;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAgBA;AACA;AACA;AACO,SAASA,SAAT,CAAmB;AAAEC,EAAAA,SAAF;AAAaC,EAAAA,aAAb;AAA4BC,EAAAA,IAA5B;AAAkCC,EAAAA;AAAlC,CAAnB,EAA0F;AAC/F,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAAuB,kCAAaH,IAAb,CAA7B,CAD+F,CAE/F;;AACA,0BAAU,MAAMC,iBAAN,aAAMA,iBAAN,uBAAMA,iBAAiB,CAAGC,SAAH,CAAjC,EAAgD,CAACA,SAAD,CAAhD,EAH+F,CAI/F;;AACA,0BAAU,MAAM,MAAMD,iBAAN,aAAMA,iBAAN,uBAAMA,iBAAiB,CAAGG,SAAH,CAAvC,EAAsD,EAAtD;AAEA,QAAMC,SAAS,GAAG,sBAAQ,MAAM,uBAAQN,aAAR,aAAQA,aAAR,uBAAQA,aAAa,CAAEO,MAAf,EAAR,CAAd,EAAgD,CAACP,aAAD,CAAhD,CAAlB;AACA,QAAMQ,MAAM,GAAG,sBAAQ,MAAMF,SAAS,CAACG,MAAV,CAAkBC,CAAD,IAAOA,CAAC,CAACC,IAAF,KAAW,QAAnC,EAA6CC,GAA7C,CAAkDF,CAAD,IAAOA,CAAC,CAACG,OAA1D,CAAd,EAAkF,CAACP,SAAD,CAAlF,CAAf;AACA,QAAMQ,KAAK,GAAG,sBAAQ,MAAMR,SAAS,CAACG,MAAV,CAAkBC,CAAD,IAAOA,CAAC,CAACC,IAAF,KAAW,OAAnC,EAA4CC,GAA5C,CAAiDF,CAAD,IAAOA,CAAC,CAACG,OAAzD,CAAd,EAAiF,CAACP,SAAD,CAAjF,CAAd;AAEA,MAAIF,KAAJ,EAAW,OAAOA,KAAK,CAACW,WAAN,EAAP;AACX,MAAI,CAACZ,SAAL,EAAgB,oBAAO,2CAAP;AAEhB,sBACE,+BAAC,4BAAD;AAAmB,IAAA,SAAS,EAAEA;AAA9B,KACGK,MADH,eAEE;AAAK,IAAA,SAAS,EAAEQ,2BAAOC;AAAvB,KAAmClB,SAAS,iBAAI,+BAAC,0CAAD;AAAe,IAAA,IAAI,EAAEA;AAArB,IAAhD,CAFF,EAGGe,KAHH,CADF;AAOD","sourcesContent":["import React, { useEffect, ReactNode, useMemo } from 'react';\nimport flatten from 'lodash.flatten';\nimport { RouteSlot, SlotSubRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SlotRegistry } from '@teambit/harmony';\n\nimport styles from './component.module.scss';\nimport { ComponentProvider } from './context';\nimport { useComponent } from './use-component';\nimport { ComponentModel } from './component-model';\n\nexport type ComponentPageSlot = SlotRegistry<ComponentPageElement[]>;\nexport type ComponentPageElement = {\n type: 'before' | 'after';\n content: ReactNode;\n};\n\nexport type ComponentProps = {\n containerSlot?: ComponentPageSlot;\n routeSlot: RouteSlot;\n host: string;\n onComponentChange?: (activeComponent?: ComponentModel) => void;\n};\n\n/**\n * main UI component of the Component extension.\n */\nexport function Component({ routeSlot, containerSlot, host, onComponentChange }: ComponentProps) {\n const { component, error } = useComponent(host);\n // trigger onComponentChange when component changes\n useEffect(() => onComponentChange?.(component), [component]);\n // cleanup when unmounting component\n useEffect(() => () => onComponentChange?.(undefined), []);\n\n const pageItems = useMemo(() => flatten(containerSlot?.values()), [containerSlot]);\n const before = useMemo(() => pageItems.filter((x) => x.type === 'before').map((x) => x.content), [pageItems]);\n const after = useMemo(() => pageItems.filter((x) => x.type === 'after').map((x) => x.content), [pageItems]);\n\n if (error) return error.renderError();\n if (!component) return <div></div>;\n\n return (\n <ComponentProvider component={component}>\n {before}\n <div className={styles.container}>{routeSlot && <SlotSubRouter slot={routeSlot} />}</div>\n {after}\n </ComponentProvider>\n );\n}\n"]}
1
+ {"version":3,"sources":["component.tsx"],"names":["Component","routeSlot","containerSlot","host","onComponentChange","component","componentDescriptor","error","undefined","pageItems","values","before","filter","x","type","map","content","after","renderError","styles","container"],"mappings":";;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAgBA;AACA;AACA;AACO,SAASA,SAAT,CAAmB;AAAEC,EAAAA,SAAF;AAAaC,EAAAA,aAAb;AAA4BC,EAAAA,IAA5B;AAAkCC,EAAAA;AAAlC,CAAnB,EAA0F;AAC/F,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,mBAAb;AAAkCC,IAAAA;AAAlC,MAA4C,kCAAaJ,IAAb,CAAlD,CAD+F,CAE/F;;AACA,0BAAU,MAAMC,iBAAN,aAAMA,iBAAN,uBAAMA,iBAAiB,CAAGC,SAAH,CAAjC,EAAgD,CAACA,SAAD,CAAhD,EAH+F,CAI/F;;AACA,0BAAU,MAAM,MAAMD,iBAAN,aAAMA,iBAAN,uBAAMA,iBAAiB,CAAGI,SAAH,CAAvC,EAAsD,EAAtD;AAEA,QAAMC,SAAS,GAAG,sBAAQ,MAAM,uBAAQP,aAAR,aAAQA,aAAR,uBAAQA,aAAa,CAAEQ,MAAf,EAAR,CAAd,EAAgD,CAACR,aAAD,CAAhD,CAAlB;AACA,QAAMS,MAAM,GAAG,sBAAQ,MAAMF,SAAS,CAACG,MAAV,CAAkBC,CAAD,IAAOA,CAAC,CAACC,IAAF,KAAW,QAAnC,EAA6CC,GAA7C,CAAkDF,CAAD,IAAOA,CAAC,CAACG,OAA1D,CAAd,EAAkF,CAACP,SAAD,CAAlF,CAAf;AACA,QAAMQ,KAAK,GAAG,sBAAQ,MAAMR,SAAS,CAACG,MAAV,CAAkBC,CAAD,IAAOA,CAAC,CAACC,IAAF,KAAW,OAAnC,EAA4CC,GAA5C,CAAiDF,CAAD,IAAOA,CAAC,CAACG,OAAzD,CAAd,EAAiF,CAACP,SAAD,CAAjF,CAAd;AAEA,MAAIF,KAAJ,EAAW,OAAOA,KAAK,CAACW,WAAN,EAAP;AACX,MAAI,CAACb,SAAL,EAAgB,oBAAO,2CAAP;AAEhB,sBACE,+BAAC,sCAAD;AAA6B,IAAA,mBAAmB,EAAEC;AAAlD,kBACE,+BAAC,4BAAD;AAAmB,IAAA,SAAS,EAAED;AAA9B,KACGM,MADH,eAEE;AAAK,IAAA,SAAS,EAAEQ,2BAAOC;AAAvB,KAAmCnB,SAAS,iBAAI,+BAAC,0CAAD;AAAe,IAAA,IAAI,EAAEA;AAArB,IAAhD,CAFF,EAGGgB,KAHH,CADF,CADF;AASD","sourcesContent":["import React, { useEffect, ReactNode, useMemo } from 'react';\nimport flatten from 'lodash.flatten';\nimport { RouteSlot, SlotSubRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SlotRegistry } from '@teambit/harmony';\n\nimport styles from './component.module.scss';\nimport { ComponentProvider, ComponentDescriptorProvider } from './context';\nimport { useComponent } from './use-component';\nimport { ComponentModel } from './component-model';\n\nexport type ComponentPageSlot = SlotRegistry<ComponentPageElement[]>;\nexport type ComponentPageElement = {\n type: 'before' | 'after';\n content: ReactNode;\n};\n\nexport type ComponentProps = {\n containerSlot?: ComponentPageSlot;\n routeSlot: RouteSlot;\n host: string;\n onComponentChange?: (activeComponent?: ComponentModel) => void;\n};\n\n/**\n * main UI component of the Component extension.\n */\nexport function Component({ routeSlot, containerSlot, host, onComponentChange }: ComponentProps) {\n const { component, componentDescriptor, error } = useComponent(host);\n // trigger onComponentChange when component changes\n useEffect(() => onComponentChange?.(component), [component]);\n // cleanup when unmounting component\n useEffect(() => () => onComponentChange?.(undefined), []);\n\n const pageItems = useMemo(() => flatten(containerSlot?.values()), [containerSlot]);\n const before = useMemo(() => pageItems.filter((x) => x.type === 'before').map((x) => x.content), [pageItems]);\n const after = useMemo(() => pageItems.filter((x) => x.type === 'after').map((x) => x.content), [pageItems]);\n\n if (error) return error.renderError();\n if (!component) return <div></div>;\n\n return (\n <ComponentDescriptorProvider componentDescriptor={componentDescriptor}>\n <ComponentProvider component={component}>\n {before}\n <div className={styles.container}>{routeSlot && <SlotSubRouter slot={routeSlot} />}</div>\n {after}\n </ComponentProvider>\n </ComponentDescriptorProvider>\n );\n}\n"]}
@@ -1,3 +1,5 @@
1
1
  /// <reference types="react" />
2
+ import type { ComponentDescriptor } from '@teambit/component-descriptor';
2
3
  import { ComponentModel } from '../component-model';
3
4
  export declare const ComponentContext: React.Context<ComponentModel>;
5
+ export declare const ComponentDescriptorContext: React.Context<ComponentDescriptor | undefined>;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.ComponentContext = void 0;
6
+ exports.ComponentDescriptorContext = exports.ComponentContext = void 0;
7
7
 
8
8
  function _react() {
9
9
  const data = require("react");
@@ -27,5 +27,7 @@ function _componentModel() {
27
27
 
28
28
  const ComponentContext = /*#__PURE__*/(0, _react().createContext)(_componentModel().ComponentModel.empty());
29
29
  exports.ComponentContext = ComponentContext;
30
+ const ComponentDescriptorContext = /*#__PURE__*/(0, _react().createContext)(undefined);
31
+ exports.ComponentDescriptorContext = ComponentDescriptorContext;
30
32
 
31
33
  //# sourceMappingURL=component-context.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["component-context.ts"],"names":["ComponentContext","ComponentModel","empty"],"mappings":";;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEO,MAAMA,gBAA+C,gBAAG,4BAA8BC,iCAAeC,KAAf,EAA9B,CAAxD","sourcesContent":["import { createContext } from 'react';\n\nimport { ComponentModel } from '../component-model';\n\nexport const ComponentContext: React.Context<ComponentModel> = createContext<ComponentModel>(ComponentModel.empty());\n"]}
1
+ {"version":3,"sources":["component-context.ts"],"names":["ComponentContext","ComponentModel","empty","ComponentDescriptorContext","undefined"],"mappings":";;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEO,MAAMA,gBAA+C,gBAAG,4BAA8BC,iCAAeC,KAAf,EAA9B,CAAxD;;AACA,MAAMC,0BAA0E,gBAAG,4BAExFC,SAFwF,CAAnF","sourcesContent":["import { createContext } from 'react';\nimport type { ComponentDescriptor } from '@teambit/component-descriptor';\n\nimport { ComponentModel } from '../component-model';\n\nexport const ComponentContext: React.Context<ComponentModel> = createContext<ComponentModel>(ComponentModel.empty());\nexport const ComponentDescriptorContext: React.Context<ComponentDescriptor | undefined> = createContext<\n ComponentDescriptor | undefined\n>(undefined);\n"]}
@@ -1,4 +1,5 @@
1
1
  import { ReactNode } from 'react';
2
+ import type { ComponentDescriptor } from '@teambit/component-descriptor';
2
3
  import { ComponentModel } from '../component-model';
3
4
  export declare type ComponentProviderProps = {
4
5
  /**
@@ -11,3 +12,14 @@ export declare type ComponentProviderProps = {
11
12
  children: ReactNode;
12
13
  };
13
14
  export declare function ComponentProvider({ component, children }: ComponentProviderProps): JSX.Element;
15
+ export declare type ComponentDescriptorProviderProps = {
16
+ /**
17
+ * component model.
18
+ */
19
+ componentDescriptor?: ComponentDescriptor;
20
+ /**
21
+ * component children.
22
+ */
23
+ children: ReactNode;
24
+ };
25
+ export declare function ComponentDescriptorProvider({ componentDescriptor, children }: ComponentDescriptorProviderProps): JSX.Element;
@@ -5,6 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
+ exports.ComponentDescriptorProvider = ComponentDescriptorProvider;
8
9
  exports.ComponentProvider = ComponentProvider;
9
10
 
10
11
  function _react() {
@@ -36,4 +37,13 @@ function ComponentProvider({
36
37
  }, children);
37
38
  }
38
39
 
40
+ function ComponentDescriptorProvider({
41
+ componentDescriptor,
42
+ children
43
+ }) {
44
+ return /*#__PURE__*/_react().default.createElement(_componentContext().ComponentDescriptorContext.Provider, {
45
+ value: componentDescriptor
46
+ }, children);
47
+ }
48
+
39
49
  //# sourceMappingURL=component-provider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["component-provider.tsx"],"names":["ComponentProvider","component","children"],"mappings":";;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAcO,SAASA,iBAAT,CAA2B;AAAEC,EAAAA,SAAF;AAAaC,EAAAA;AAAb,CAA3B,EAA4E;AACjF,sBAAO,+BAAC,oCAAD,CAAkB,QAAlB;AAA2B,IAAA,KAAK,EAAED;AAAlC,KAA8CC,QAA9C,CAAP;AACD","sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { ComponentModel } from '../component-model';\nimport { ComponentContext } from './component-context';\n\nexport type ComponentProviderProps = {\n /**\n * component model.\n */\n component: ComponentModel;\n\n /**\n * component children.\n */\n children: ReactNode;\n};\n\nexport function ComponentProvider({ component, children }: ComponentProviderProps) {\n return <ComponentContext.Provider value={component}>{children}</ComponentContext.Provider>;\n}\n"]}
1
+ {"version":3,"sources":["component-provider.tsx"],"names":["ComponentProvider","component","children","ComponentDescriptorProvider","componentDescriptor"],"mappings":";;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAcO,SAASA,iBAAT,CAA2B;AAAEC,EAAAA,SAAF;AAAaC,EAAAA;AAAb,CAA3B,EAA4E;AACjF,sBAAO,+BAAC,oCAAD,CAAkB,QAAlB;AAA2B,IAAA,KAAK,EAAED;AAAlC,KAA8CC,QAA9C,CAAP;AACD;;AAcM,SAASC,2BAAT,CAAqC;AAAEC,EAAAA,mBAAF;AAAuBF,EAAAA;AAAvB,CAArC,EAA0G;AAC/G,sBACE,+BAAC,8CAAD,CAA4B,QAA5B;AAAqC,IAAA,KAAK,EAAEE;AAA5C,KAAkEF,QAAlE,CADF;AAGD","sourcesContent":["import React, { ReactNode } from 'react';\nimport type { ComponentDescriptor } from '@teambit/component-descriptor';\nimport { ComponentModel } from '../component-model';\nimport { ComponentContext, ComponentDescriptorContext } from './component-context';\n\nexport type ComponentProviderProps = {\n /**\n * component model.\n */\n component: ComponentModel;\n\n /**\n * component children.\n */\n children: ReactNode;\n};\n\nexport function ComponentProvider({ component, children }: ComponentProviderProps) {\n return <ComponentContext.Provider value={component}>{children}</ComponentContext.Provider>;\n}\n\nexport type ComponentDescriptorProviderProps = {\n /**\n * component model.\n */\n componentDescriptor?: ComponentDescriptor;\n\n /**\n * component children.\n */\n children: ReactNode;\n};\n\nexport function ComponentDescriptorProvider({ componentDescriptor, children }: ComponentDescriptorProviderProps) {\n return (\n <ComponentDescriptorContext.Provider value={componentDescriptor}>{children}</ComponentDescriptorContext.Provider>\n );\n}\n"]}
@@ -1,2 +1,3 @@
1
- export { ComponentContext } from './component-context';
2
- export { ComponentProvider } from './component-provider';
1
+ export { ComponentContext, ComponentDescriptorContext } from './component-context';
2
+ export { ComponentProvider, ComponentDescriptorProvider } from './component-provider';
3
+ export type { ComponentProviderProps, ComponentDescriptorProviderProps } from './component-provider';
@@ -9,6 +9,18 @@ Object.defineProperty(exports, "ComponentContext", {
9
9
  return _componentContext().ComponentContext;
10
10
  }
11
11
  });
12
+ Object.defineProperty(exports, "ComponentDescriptorContext", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _componentContext().ComponentDescriptorContext;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "ComponentDescriptorProvider", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _componentProvider().ComponentDescriptorProvider;
22
+ }
23
+ });
12
24
  Object.defineProperty(exports, "ComponentProvider", {
13
25
  enumerable: true,
14
26
  get: function () {
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA","sourcesContent":["export { ComponentContext } from './component-context';\nexport { ComponentProvider } from './component-provider';\n"]}
1
+ {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA","sourcesContent":["export { ComponentContext, ComponentDescriptorContext } from './component-context';\nexport { ComponentProvider, ComponentDescriptorProvider } from './component-provider';\nexport type { ComponentProviderProps, ComponentDescriptorProviderProps } from './component-provider';\n"]}
@@ -103,7 +103,7 @@ const componentFields = (0, _client().gql)`
103
103
  id {
104
104
  ...componentIdFields
105
105
  }
106
- aspects(include: ["teambit.preview/preview"]) {
106
+ aspects(include: ["teambit.preview/preview", "teambit.pipelines/builder"]) {
107
107
  id
108
108
  data
109
109
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["use-component-query.ts"],"names":["componentIdFields","componentFields","GET_COMPONENT","SUB_SUBSCRIPTION_ADDED","SUB_COMPONENT_CHANGED","SUB_COMPONENT_REMOVED","useComponentQuery","componentId","host","idRef","current","data","error","loading","subscribeToMore","variables","id","extensionId","unsubAddition","document","updateQuery","prev","subscriptionData","prevComponent","getHost","get","addedComponent","componentAdded","component","name","unsubChanges","updatedComponent","componentChanged","isUpdated","ComponentID","isEqualObj","unsubRemoval","removedIds","componentRemoved","componentIds","length","isRemoved","some","removedId","rawComponent","aspectList","entries","aspects","map","aspect","aspectId","aspectData","fromObject","componentDescriptor","ComponentDescriptor","toString","undefined","ComponentModel","from","ComponentError","message"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAEA,MAAMA,iBAAiB,GAAG,kBAAI;AAC9B;AACA;AACA;AACA;AACA;AACA,CANA;AAQA,MAAMC,eAAe,GAAG,kBAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAID,iBAAkB;AACtB,CArCA;AAuCA,MAAME,aAAa,GAAG,kBAAI;AAC1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAID,eAAgB;AACpB,CAVA;AAYA,MAAME,sBAAsB,GAAG,kBAAI;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIF,eAAgB;AACpB,CATA;AAWA,MAAMG,qBAAqB,GAAG,kBAAI;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIH,eAAgB;AACpB,CATA;AAWA,MAAMI,qBAAqB,GAAG,kBAAI;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIL,iBAAkB;AACtB,CATA;AAWA;;AACO,SAASM,iBAAT,CAA2BC,WAA3B,EAAgDC,IAAhD,EAA8D;AAAA;;AACnE,QAAMC,KAAK,GAAG,qBAAOF,WAAP,CAAd;AACAE,EAAAA,KAAK,CAACC,OAAN,GAAgBH,WAAhB;AACA,QAAM;AAAEI,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAeC,IAAAA,OAAf;AAAwBC,IAAAA;AAAxB,MAA4C,yCAAaZ,aAAb,EAA4B;AAC5Ea,IAAAA,SAAS,EAAE;AAAEC,MAAAA,EAAE,EAAET,WAAN;AAAmBU,MAAAA,WAAW,EAAET;AAAhC;AADiE,GAA5B,CAAlD;AAIA,0BAAU,MAAM;AACd;AACA,QAAIA,IAAI,KAAK,6BAAb,EAA4C;AAC1C,aAAO,MAAM,CAAE,CAAf;AACD;;AAED,UAAMU,aAAa,GAAGJ,eAAe,CAAC;AACpCK,MAAAA,QAAQ,EAAEhB,sBAD0B;AAEpCiB,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,cAAMC,aAAa,GAAGF,IAAH,aAAGA,IAAH,wCAAGA,IAAI,CAAEG,OAAT,kDAAG,cAAeC,GAArC;AACA,cAAMC,cAAc,GAAGJ,gBAAH,aAAGA,gBAAH,gDAAGA,gBAAgB,CAAEX,IAArB,oFAAG,sBAAwBgB,cAA3B,2DAAG,uBAAwCC,SAA/D;AAEA,YAAI,CAACF,cAAD,IAAmBH,aAAvB,EAAsC,OAAOF,IAAP;;AAEtC,YAAIZ,KAAK,CAACC,OAAN,KAAkBgB,cAAc,CAACV,EAAf,CAAkBa,IAAxC,EAA8C;AAC5C,iDACKR,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAEC;AAFA;AAFT;AAOD;;AAED,eAAOL,IAAP;AACD;AAnBmC,KAAD,CAArC;AAsBA,UAAMS,YAAY,GAAGhB,eAAe,CAAC;AACnCK,MAAAA,QAAQ,EAAEf,qBADyB;AAEnCgB,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,YAAI,CAACA,gBAAgB,CAACX,IAAtB,EAA4B,OAAOU,IAAP;AAE5B,cAAME,aAAa,GAAGF,IAAH,aAAGA,IAAH,yCAAGA,IAAI,CAAEG,OAAT,mDAAG,eAAeC,GAArC;AACA,cAAMM,gBAAgB,GAAGT,gBAAH,aAAGA,gBAAH,iDAAGA,gBAAgB,CAAEX,IAArB,qFAAG,uBAAwBqB,gBAA3B,2DAAG,uBAA0CJ,SAAnE;;AAEA,cAAMK,SAAS,GAAGF,gBAAgB,IAAIG,2BAAYC,UAAZ,CAAuBZ,aAAvB,aAAuBA,aAAvB,uBAAuBA,aAAa,CAAEP,EAAtC,EAA0Ce,gBAA1C,aAA0CA,gBAA1C,uBAA0CA,gBAAgB,CAAEf,EAA5D,CAAtC;;AAEA,YAAIiB,SAAJ,EAAe;AACb,iDACKZ,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAEM;AAFA;AAFT;AAOD;;AAED,eAAOV,IAAP;AACD;AArBkC,KAAD,CAApC;AAwBA,UAAMe,YAAY,GAAGtB,eAAe,CAAC;AACnCK,MAAAA,QAAQ,EAAEd,qBADyB;AAEnCe,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,YAAI,CAACA,gBAAgB,CAACX,IAAtB,EAA4B,OAAOU,IAAP;AAE5B,cAAME,aAAa,GAAGF,IAAH,aAAGA,IAAH,yCAAGA,IAAI,CAAEG,OAAT,mDAAG,eAAeC,GAArC;AACA,cAAMY,UAAwC,GAAGf,gBAAH,aAAGA,gBAAH,iDAAGA,gBAAgB,CAAEX,IAArB,qFAAG,uBAAwB2B,gBAA3B,2DAAG,uBAA0CC,YAA3F;AACA,YAAI,CAAChB,aAAD,IAAkB,EAACc,UAAD,aAACA,UAAD,eAACA,UAAU,CAAEG,MAAb,CAAtB,EAA2C,OAAOnB,IAAP;AAE3C,cAAMoB,SAAS,GAAGJ,UAAU,CAACK,IAAX,CAAiBC,SAAD,IAAeT,2BAAYC,UAAZ,CAAuBQ,SAAvB,EAAkCpB,aAAa,CAACP,EAAhD,CAA/B,CAAlB;;AAEA,YAAIyB,SAAJ,EAAe;AACb,iDACKpB,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAE;AAFA;AAFT;AAOD;;AAED,eAAOJ,IAAP;AACD;AAtBkC,KAAD,CAApC;AAyBA,WAAO,MAAM;AACXS,MAAAA,YAAY;AACZZ,MAAAA,aAAa;AACbkB,MAAAA,YAAY;AACb,KAJD;AAKD,GAlFD,EAkFG,EAlFH;AAoFA,QAAMQ,YAAY,GAAGjC,IAAH,aAAGA,IAAH,wCAAGA,IAAI,CAAEa,OAAT,kDAAG,cAAeC,GAApC;AACA,SAAO,sBAAQ,MAAM;AAAA;;AACnB,UAAMoB,UAAU,GAAG;AACjBC,MAAAA,OAAO,EAAEF,YAAF,aAAEA,YAAF,gDAAEA,YAAY,CAAEG,OAAhB,0DAAE,sBAAuBC,GAAvB,CAA4BC,MAAD,KAAa;AAAEC,QAAAA,QAAQ,EAAED,MAAM,CAACjC,EAAnB;AAAuBmC,QAAAA,UAAU,EAAEF,MAAM,CAACtC;AAA1C,OAAb,CAA3B;AADQ,KAAnB;;AAGA,UAAMK,EAAE,GAAG4B,YAAY,IAAIV,2BAAYkB,UAAZ,CAAuBR,YAAY,CAAC5B,EAApC,CAA3B;;AACA,WAAO;AACLqC,MAAAA,mBAAmB,EAAErC,EAAE,GAAGsC,2CAAoBF,UAApB,CAA+B;AAAEpC,QAAAA,EAAE,EAAEA,EAAE,CAACuC,QAAH,EAAN;AAAqBV,QAAAA;AAArB,OAA/B,CAAH,GAAuEW,SADzF;AAEL5B,MAAAA,SAAS,EAAEgB,YAAY,GAAGa,iCAAeC,IAAf,iCAAyBd,YAAzB;AAAuCpC,QAAAA;AAAvC,SAAH,GAAoDgD,SAFtE;AAGL;AACA5C,MAAAA,KAAK,EAAEA,KAAK,GACR,KAAI+C,gCAAJ,EAAmB,GAAnB,EAAwB/C,KAAK,CAACgD,OAA9B,CADQ,GAER,CAAChB,YAAD,IAAiB,CAAC/B,OAAlB,GACA,KAAI8C,gCAAJ,EAAmB,GAAnB,CADA,GAEAH;AARC,KAAP;AAUD,GAfM,EAeJ,CAACZ,YAAD,EAAepC,IAAf,EAAqBI,KAArB,CAfI,CAAP;AAgBD","sourcesContent":["import { useMemo, useEffect, useRef } from 'react';\nimport { gql } from '@apollo/client';\nimport { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';\nimport { ComponentID, ComponentIdObj } from '@teambit/component-id';\nimport { ComponentDescriptor } from '@teambit/component-descriptor';\n\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\n\nconst componentIdFields = gql`\n fragment componentIdFields on ComponentID {\n name\n version\n scope\n }\n`;\n\nconst componentFields = gql`\n fragment componentFields on Component {\n id {\n ...componentIdFields\n }\n aspects(include: [\"teambit.preview/preview\"]) {\n id\n data\n }\n packageName\n elementsUrl\n description\n labels\n displayName\n latest\n server {\n env\n url\n }\n buildStatus\n compositions {\n identifier\n displayName\n }\n tags {\n version\n }\n env {\n id\n icon\n }\n\n preview {\n includesEnvTemplate\n }\n }\n ${componentIdFields}\n`;\n\nconst GET_COMPONENT = gql`\n query Component($id: String!, $extensionId: String!) {\n getHost(id: $extensionId) {\n id # used for GQL caching\n get(id: $id) {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_SUBSCRIPTION_ADDED = gql`\n subscription OnComponentAdded {\n componentAdded {\n component {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_COMPONENT_CHANGED = gql`\n subscription OnComponentChanged {\n componentChanged {\n component {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_COMPONENT_REMOVED = gql`\n subscription OnComponentRemoved {\n componentRemoved {\n componentIds {\n ...componentIdFields\n }\n }\n }\n ${componentIdFields}\n`;\n\n/** provides data to component ui page, making sure both variables and return value are safely typed and memoized */\nexport function useComponentQuery(componentId: string, host: string) {\n const idRef = useRef(componentId);\n idRef.current = componentId;\n const { data, error, loading, subscribeToMore } = useDataQuery(GET_COMPONENT, {\n variables: { id: componentId, extensionId: host },\n });\n\n useEffect(() => {\n // @TODO @Kutner fix subscription for scope\n if (host !== 'teambit.workspace/workspace') {\n return () => {};\n }\n\n const unsubAddition = subscribeToMore({\n document: SUB_SUBSCRIPTION_ADDED,\n updateQuery: (prev, { subscriptionData }) => {\n const prevComponent = prev?.getHost?.get;\n const addedComponent = subscriptionData?.data?.componentAdded?.component;\n\n if (!addedComponent || prevComponent) return prev;\n\n if (idRef.current === addedComponent.id.name) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: addedComponent,\n },\n };\n }\n\n return prev;\n },\n });\n\n const unsubChanges = subscribeToMore({\n document: SUB_COMPONENT_CHANGED,\n updateQuery: (prev, { subscriptionData }) => {\n if (!subscriptionData.data) return prev;\n\n const prevComponent = prev?.getHost?.get;\n const updatedComponent = subscriptionData?.data?.componentChanged?.component;\n\n const isUpdated = updatedComponent && ComponentID.isEqualObj(prevComponent?.id, updatedComponent?.id);\n\n if (isUpdated) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: updatedComponent,\n },\n };\n }\n\n return prev;\n },\n });\n\n const unsubRemoval = subscribeToMore({\n document: SUB_COMPONENT_REMOVED,\n updateQuery: (prev, { subscriptionData }) => {\n if (!subscriptionData.data) return prev;\n\n const prevComponent = prev?.getHost?.get;\n const removedIds: ComponentIdObj[] | undefined = subscriptionData?.data?.componentRemoved?.componentIds;\n if (!prevComponent || !removedIds?.length) return prev;\n\n const isRemoved = removedIds.some((removedId) => ComponentID.isEqualObj(removedId, prevComponent.id));\n\n if (isRemoved) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: null,\n },\n };\n }\n\n return prev;\n },\n });\n\n return () => {\n unsubChanges();\n unsubAddition();\n unsubRemoval();\n };\n }, []);\n\n const rawComponent = data?.getHost?.get;\n return useMemo(() => {\n const aspectList = {\n entries: rawComponent?.aspects?.map((aspect) => ({ aspectId: aspect.id, aspectData: aspect.data })),\n };\n const id = rawComponent && ComponentID.fromObject(rawComponent.id);\n return {\n componentDescriptor: id ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,\n component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,\n // eslint-disable-next-line\n error: error\n ? new ComponentError(500, error.message)\n : !rawComponent && !loading\n ? new ComponentError(404)\n : undefined,\n };\n }, [rawComponent, host, error]);\n}\n"]}
1
+ {"version":3,"sources":["use-component-query.ts"],"names":["componentIdFields","componentFields","GET_COMPONENT","SUB_SUBSCRIPTION_ADDED","SUB_COMPONENT_CHANGED","SUB_COMPONENT_REMOVED","useComponentQuery","componentId","host","idRef","current","data","error","loading","subscribeToMore","variables","id","extensionId","unsubAddition","document","updateQuery","prev","subscriptionData","prevComponent","getHost","get","addedComponent","componentAdded","component","name","unsubChanges","updatedComponent","componentChanged","isUpdated","ComponentID","isEqualObj","unsubRemoval","removedIds","componentRemoved","componentIds","length","isRemoved","some","removedId","rawComponent","aspectList","entries","aspects","map","aspect","aspectId","aspectData","fromObject","componentDescriptor","ComponentDescriptor","toString","undefined","ComponentModel","from","ComponentError","message"],"mappings":"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","sourcesContent":["import { useMemo, useEffect, useRef } from 'react';\nimport { gql } from '@apollo/client';\nimport { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';\nimport { ComponentID, ComponentIdObj } from '@teambit/component-id';\nimport { ComponentDescriptor } from '@teambit/component-descriptor';\n\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\n\nconst componentIdFields = gql`\n fragment componentIdFields on ComponentID {\n name\n version\n scope\n }\n`;\n\nconst componentFields = gql`\n fragment componentFields on Component {\n id {\n ...componentIdFields\n }\n aspects(include: [\"teambit.preview/preview\", \"teambit.pipelines/builder\"]) {\n id\n data\n }\n packageName\n elementsUrl\n description\n labels\n displayName\n latest\n server {\n env\n url\n }\n buildStatus\n compositions {\n identifier\n displayName\n }\n tags {\n version\n }\n env {\n id\n icon\n }\n\n preview {\n includesEnvTemplate\n }\n }\n ${componentIdFields}\n`;\n\nconst GET_COMPONENT = gql`\n query Component($id: String!, $extensionId: String!) {\n getHost(id: $extensionId) {\n id # used for GQL caching\n get(id: $id) {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_SUBSCRIPTION_ADDED = gql`\n subscription OnComponentAdded {\n componentAdded {\n component {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_COMPONENT_CHANGED = gql`\n subscription OnComponentChanged {\n componentChanged {\n component {\n ...componentFields\n }\n }\n }\n ${componentFields}\n`;\n\nconst SUB_COMPONENT_REMOVED = gql`\n subscription OnComponentRemoved {\n componentRemoved {\n componentIds {\n ...componentIdFields\n }\n }\n }\n ${componentIdFields}\n`;\n\n/** provides data to component ui page, making sure both variables and return value are safely typed and memoized */\nexport function useComponentQuery(componentId: string, host: string) {\n const idRef = useRef(componentId);\n idRef.current = componentId;\n const { data, error, loading, subscribeToMore } = useDataQuery(GET_COMPONENT, {\n variables: { id: componentId, extensionId: host },\n });\n\n useEffect(() => {\n // @TODO @Kutner fix subscription for scope\n if (host !== 'teambit.workspace/workspace') {\n return () => {};\n }\n\n const unsubAddition = subscribeToMore({\n document: SUB_SUBSCRIPTION_ADDED,\n updateQuery: (prev, { subscriptionData }) => {\n const prevComponent = prev?.getHost?.get;\n const addedComponent = subscriptionData?.data?.componentAdded?.component;\n\n if (!addedComponent || prevComponent) return prev;\n\n if (idRef.current === addedComponent.id.name) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: addedComponent,\n },\n };\n }\n\n return prev;\n },\n });\n\n const unsubChanges = subscribeToMore({\n document: SUB_COMPONENT_CHANGED,\n updateQuery: (prev, { subscriptionData }) => {\n if (!subscriptionData.data) return prev;\n\n const prevComponent = prev?.getHost?.get;\n const updatedComponent = subscriptionData?.data?.componentChanged?.component;\n\n const isUpdated = updatedComponent && ComponentID.isEqualObj(prevComponent?.id, updatedComponent?.id);\n\n if (isUpdated) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: updatedComponent,\n },\n };\n }\n\n return prev;\n },\n });\n\n const unsubRemoval = subscribeToMore({\n document: SUB_COMPONENT_REMOVED,\n updateQuery: (prev, { subscriptionData }) => {\n if (!subscriptionData.data) return prev;\n\n const prevComponent = prev?.getHost?.get;\n const removedIds: ComponentIdObj[] | undefined = subscriptionData?.data?.componentRemoved?.componentIds;\n if (!prevComponent || !removedIds?.length) return prev;\n\n const isRemoved = removedIds.some((removedId) => ComponentID.isEqualObj(removedId, prevComponent.id));\n\n if (isRemoved) {\n return {\n ...prev,\n getHost: {\n ...prev.getHost,\n get: null,\n },\n };\n }\n\n return prev;\n },\n });\n\n return () => {\n unsubChanges();\n unsubAddition();\n unsubRemoval();\n };\n }, []);\n\n const rawComponent = data?.getHost?.get;\n return useMemo(() => {\n const aspectList = {\n entries: rawComponent?.aspects?.map((aspect) => ({ aspectId: aspect.id, aspectData: aspect.data })),\n };\n const id = rawComponent && ComponentID.fromObject(rawComponent.id);\n return {\n componentDescriptor: id ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,\n component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,\n // eslint-disable-next-line\n error: error\n ? new ComponentError(500, error.message)\n : !rawComponent && !loading\n ? new ComponentError(404)\n : undefined,\n };\n }, [rawComponent, host, error]);\n}\n"]}
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@teambit/component",
3
- "version": "0.0.654",
3
+ "version": "0.0.655",
4
4
  "homepage": "https://bit.dev/teambit/component/component",
5
5
  "main": "dist/index.js",
6
6
  "componentId": {
7
7
  "scope": "teambit.component",
8
8
  "name": "component",
9
- "version": "0.0.654"
9
+ "version": "0.0.655"
10
10
  },
11
11
  "dependencies": {
12
12
  "@teambit/any-fs": "0.0.5",
@@ -29,22 +29,22 @@
29
29
  "@teambit/base-ui.routing.routing-provider": "1.0.0",
30
30
  "@teambit/component-id": "0.0.401",
31
31
  "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.488",
32
- "@teambit/aspect-loader": "0.0.654",
32
+ "@teambit/aspect-loader": "0.0.655",
33
33
  "@teambit/legacy-bit-id": "0.0.398",
34
34
  "@teambit/toolbox.string.capitalize": "0.0.483",
35
35
  "@teambit/cli": "0.0.446",
36
36
  "@teambit/config": "0.0.459",
37
37
  "@teambit/express": "0.0.540",
38
- "@teambit/graphql": "0.0.654",
38
+ "@teambit/graphql": "0.0.655",
39
39
  "@teambit/bit-error": "0.0.394",
40
- "@teambit/command-bar": "0.0.654",
41
- "@teambit/preview": "0.0.654",
42
- "@teambit/pubsub": "0.0.654",
40
+ "@teambit/command-bar": "0.0.655",
41
+ "@teambit/preview": "0.0.655",
42
+ "@teambit/pubsub": "0.0.655",
43
43
  "@teambit/ui-foundation.ui.is-browser": "0.0.486",
44
44
  "@teambit/ui-foundation.ui.main-dropdown": "0.0.486",
45
45
  "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.488",
46
46
  "@teambit/ui-foundation.ui.use-box.menu": "0.0.111",
47
- "@teambit/ui": "0.0.654",
47
+ "@teambit/ui": "0.0.655",
48
48
  "@teambit/component-issues": "0.0.46",
49
49
  "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.487",
50
50
  "@teambit/cli-table": "0.0.33",
@@ -54,9 +54,9 @@
54
54
  "@teambit/harmony.ui.aspect-box": "0.0.486",
55
55
  "@teambit/design.ui.pages.not-found": "0.0.353",
56
56
  "@teambit/design.ui.pages.server-error": "0.0.353",
57
- "@teambit/compositions": "0.0.654",
58
- "@teambit/deprecation": "0.0.654",
59
- "@teambit/envs": "0.0.654",
57
+ "@teambit/compositions": "0.0.655",
58
+ "@teambit/deprecation": "0.0.655",
59
+ "@teambit/envs": "0.0.655",
60
60
  "@teambit/component.ui.version-dropdown": "0.0.492",
61
61
  "@teambit/lanes.ui.lanes": "0.0.1",
62
62
  "@teambit/ui-foundation.ui.use-box.dropdown": "0.0.111",
package/ui/component.tsx CHANGED
@@ -4,7 +4,7 @@ import { RouteSlot, SlotSubRouter } from '@teambit/ui-foundation.ui.react-router
4
4
  import { SlotRegistry } from '@teambit/harmony';
5
5
 
6
6
  import styles from './component.module.scss';
7
- import { ComponentProvider } from './context';
7
+ import { ComponentProvider, ComponentDescriptorProvider } from './context';
8
8
  import { useComponent } from './use-component';
9
9
  import { ComponentModel } from './component-model';
10
10
 
@@ -25,7 +25,7 @@ export type ComponentProps = {
25
25
  * main UI component of the Component extension.
26
26
  */
27
27
  export function Component({ routeSlot, containerSlot, host, onComponentChange }: ComponentProps) {
28
- const { component, error } = useComponent(host);
28
+ const { component, componentDescriptor, error } = useComponent(host);
29
29
  // trigger onComponentChange when component changes
30
30
  useEffect(() => onComponentChange?.(component), [component]);
31
31
  // cleanup when unmounting component
@@ -39,10 +39,12 @@ export function Component({ routeSlot, containerSlot, host, onComponentChange }:
39
39
  if (!component) return <div></div>;
40
40
 
41
41
  return (
42
- <ComponentProvider component={component}>
43
- {before}
44
- <div className={styles.container}>{routeSlot && <SlotSubRouter slot={routeSlot} />}</div>
45
- {after}
46
- </ComponentProvider>
42
+ <ComponentDescriptorProvider componentDescriptor={componentDescriptor}>
43
+ <ComponentProvider component={component}>
44
+ {before}
45
+ <div className={styles.container}>{routeSlot && <SlotSubRouter slot={routeSlot} />}</div>
46
+ {after}
47
+ </ComponentProvider>
48
+ </ComponentDescriptorProvider>
47
49
  );
48
50
  }
@@ -1,5 +1,9 @@
1
1
  import { createContext } from 'react';
2
+ import type { ComponentDescriptor } from '@teambit/component-descriptor';
2
3
 
3
4
  import { ComponentModel } from '../component-model';
4
5
 
5
6
  export const ComponentContext: React.Context<ComponentModel> = createContext<ComponentModel>(ComponentModel.empty());
7
+ export const ComponentDescriptorContext: React.Context<ComponentDescriptor | undefined> = createContext<
8
+ ComponentDescriptor | undefined
9
+ >(undefined);
@@ -1,7 +1,7 @@
1
1
  import React, { ReactNode } from 'react';
2
-
2
+ import type { ComponentDescriptor } from '@teambit/component-descriptor';
3
3
  import { ComponentModel } from '../component-model';
4
- import { ComponentContext } from './component-context';
4
+ import { ComponentContext, ComponentDescriptorContext } from './component-context';
5
5
 
6
6
  export type ComponentProviderProps = {
7
7
  /**
@@ -18,3 +18,21 @@ export type ComponentProviderProps = {
18
18
  export function ComponentProvider({ component, children }: ComponentProviderProps) {
19
19
  return <ComponentContext.Provider value={component}>{children}</ComponentContext.Provider>;
20
20
  }
21
+
22
+ export type ComponentDescriptorProviderProps = {
23
+ /**
24
+ * component model.
25
+ */
26
+ componentDescriptor?: ComponentDescriptor;
27
+
28
+ /**
29
+ * component children.
30
+ */
31
+ children: ReactNode;
32
+ };
33
+
34
+ export function ComponentDescriptorProvider({ componentDescriptor, children }: ComponentDescriptorProviderProps) {
35
+ return (
36
+ <ComponentDescriptorContext.Provider value={componentDescriptor}>{children}</ComponentDescriptorContext.Provider>
37
+ );
38
+ }
@@ -1,2 +1,3 @@
1
- export { ComponentContext } from './component-context';
2
- export { ComponentProvider } from './component-provider';
1
+ export { ComponentContext, ComponentDescriptorContext } from './component-context';
2
+ export { ComponentProvider, ComponentDescriptorProvider } from './component-provider';
3
+ export type { ComponentProviderProps, ComponentDescriptorProviderProps } from './component-provider';
@@ -20,7 +20,7 @@ const componentFields = gql`
20
20
  id {
21
21
  ...componentIdFields
22
22
  }
23
- aspects(include: ["teambit.preview/preview"]) {
23
+ aspects(include: ["teambit.preview/preview", "teambit.pipelines/builder"]) {
24
24
  id
25
25
  data
26
26
  }