@teambit/compositions 1.0.107 → 1.0.109

package/artifacts/preview/teambit_compositions_compositions-preview.js

@@ -0,0 +1 @@
+!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports["teambit.compositions/compositions-preview"]=o():e["teambit.compositions/compositions-preview"]=o()}(self,(()=>(()=>{"use strict";var e={15810:(e,o,t)=>{var n={id:"teambit.compositions/compositions@1.0.109",homepage:"https://bit.cloud/teambit/compositions/compositions",exported:!0};function i(){const e=s(t(87363));return i=function(){return e},e}function s(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(o,"__esModule",{value:!0}),o.Logo=void 0,i.__bit_component=n,s.__bit_component=n;const a=()=>i().default.createElement("div",{style:{height:"100%",display:"flex",justifyContent:"center"}},i().default.createElement("img",{style:{width:70},src:"https://static.bit.dev/extensions-icons/compositions.svg"}));a.__bit_component=n,o.Logo=a},96833:(e,o,t)=>{var n={id:"teambit.compositions/aspect-docs/compositions@0.0.165",homepage:"https://bit.cloud/teambit/compositions/aspect-docs/compositions",exported:!0};Object.defineProperty(o,"__esModule",{value:!0}),o.default=f,a(t(87363));var i=t(40040),s=["components"];function a(e){return e&&e.__esModule?e:{default:e}}function r(){return r=Object.assign?Object.assign.bind():function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},r.apply(this,arguments)}function p(e,o){if(null==e)return{};var t,n,i=m(e,o);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(n=0;n<s.length;n++)t=s[n],o.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function m(e,o){if(null==e)return{};var t,n,i={},s=Object.keys(e);for(n=0;n<s.length;n++)t=s[n],o.indexOf(t)>=0||(i[t]=e[t]);return i}a.__bit_component=n,r.__bit_component=n,p.__bit_component=n,m.__bit_component=n;var c=function(e){return function(o){return console.warn("Component "+e+" was not imported, exported, or provided by MDXProvider as global scope"),(0,i.mdx)("div",o)}};c.__bit_component=n;var l=c("CompositionCard"),d=c("Button"),u={},h="wrapper";function f(e){var o=e.components,t=p(e,s);return(0,i.mdx)(h,r({},u,t,{components:o,mdxType:"MDXLayout"}),(0,i.mdx)("p",null,"The Compositions aspect renders component 'compositions' in isolation and displays them in the Workspace UI and Scope UI.\n'Compositions' are, essentially, small apps that exhibit and test a component in different contexts and variations."),(0,i.mdx)("p",null,'The Compositions aspect is an essential tool to authoring independent components as it renders component instances in "controlled environments", isolated and un-affected by code that was not purposefully included.\nThis sterile environment provides an accurate understanding of their look and behavior, for manual and automated testings.'),(0,i.mdx)("p",null,"Moreover, a component's composition is a way to demonstrate the component for other developers looking to use it, and non-developers, such as designers and product managers, looking to inspect it."),(0,i.mdx)("h4",null,"Features"),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"Create component examples with zero configuration:")," Write your compositions the same way you write your components.\nPlace your examples in the component's ",(0,i.mdx)("inlineCode",{parentName:"p"},"*.compositions.*")," file to have them rendered in the Workspace UI with no additional configurations."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"See your components render in all relevant contexts:")," - Render components in the visual context of related and dependant components to learn how changes impact other components during development."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"Hot-reloading in workspace UI:")," - See various instances of a component render live to reflect most recent changes. Get immediate feedbacks to changes in your component's code."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"Compositions as visual documentation:")," - Compositions play an essential part in a component documentation. They demonstrate potential behaviors and use cases for that component. Compositions are another step in promoting components' discoverability, both in your local workspace and in remote scopes."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"Compositions as test samples for your CI")," - Use your compositions as samples for automated integration and unit tests, to track and view the impact of changes on all affected components in your different scopes."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"Developer-Designers collaboration")," - Make visual compositions accessible to designers (and everyone else) to include them in the development and release process of web applications, in a visual way."),(0,i.mdx)("h2",null,"Quickstart & configurations"),(0,i.mdx)("p",null,"Compositions require no configuration. Any ",(0,i.mdx)("inlineCode",{parentName:"p"},"*.compositions.*")," or ",(0,i.mdx)("inlineCode",{parentName:"p"},"*.composition.*")," file will be loaded and displayed in the workspace UI.\nAny tagged version of a component will have its composition included in its build artifacts, to be used as part of the component's preview."),(0,i.mdx)("p",null,"To add your own file pattern for compositions (to be automatically loaded and displayed by the Compositions aspect):"),(0,i.mdx)("pre",null,(0,i.mdx)("code",{parentName:"pre",className:"language-json"},'// In the workspace configuration file\n{\n  "teambit.compositions/compositions": {\n    "compositionFilePattern": ["**.my-pattern.tsx", "**.my-pattern-2.jsx"]\n  }\n}\n')),(0,i.mdx)("h2",null,"Creating compositions"),(0,i.mdx)("blockquote",null,(0,i.mdx)("p",{parentName:"blockquote"},"This document uses React code as snippets.")),(0,i.mdx)("p",null,"Writing a composition does not require any configuration. Import the component to the component's ",(0,i.mdx)("inlineCode",{parentName:"p"},"*.compositions.tsx")," file, use it to build a composition and export the new component (a.k.a, the composition) with a named export."),(0,i.mdx)("p",null,"The name of the export will be converted from PascalCase/camelCase and used for the composition name (e.g, ",(0,i.mdx)("inlineCode",{parentName:"p"},'"CompositionName" --\x3e "Composition name"'),")."),(0,i.mdx)("p",null,(0,i.mdx)("strong",{parentName:"p"},"For example"),", we'll create two compositions, 'Primary button' and 'Secondary button', each of which demonstrates a different variant or usage of that component.\nBoth compositions will be in themed (i.e, displayed in a specific context)."),(0,i.mdx)("p",null,"First, we'll create a new composition file in the component's directory:"),(0,i.mdx)("pre",null,(0,i.mdx)("code",{parentName:"pre",className:"language-bash"},"touch path/to/component/directory/<component-name>.compositions.tsx\n")),(0,i.mdx)("p",null,"Then, we'll import the component and use it to create the compositions:"),(0,i.mdx)("pre",null,(0,i.mdx)("code",{parentName:"pre",className:"language-jsx{}[button.compositions.jsx]"},"import React from 'react';\nimport { IrisTheme } from '@my-organization/design-system/iris-theme';\nimport { Button } from './button';\n\nexport const PrimaryButton = () => {\n  return (\n    <IrisTheme>\n      <Button importance=\"cta\" style={{ width: 120 }}>\n        Primary\n      </Button>\n    </IrisTheme>\n  );\n};\n\nexport const SecondaryButton = () => {\n  return (\n    <IrisTheme>\n      <Button importance=\"ghost\" style={{ width: 120 }}>\n        Secondary\n      </Button>\n    </IrisTheme>\n  );\n};\n")),(0,i.mdx)("div",{style:{width:450,display:"flex",justifyContent:"space-between"}},(0,i.mdx)(l,{Composition:function(){return(0,i.mdx)(d,{importance:"cta",style:{width:120},mdxType:"Button"},"Primary")},name:"Primary",mdxType:"CompositionCard"}),(0,i.mdx)(l,{Composition:function(){return(0,i.mdx)(d,{importance:"ghost",style:{width:120},mdxType:"Button"},"Secondary")},name:"Secondary",mdxType:"CompositionCard"})),(0,i.mdx)("h2",null,"Loading compositions"),(0,i.mdx)("p",null,"The Environment in use will automatically detect the composition file for each component and use it to load its compositions to the workspace UI."),(0,i.mdx)("h2",null,"Viewing component compositions"),(0,i.mdx)("p",null,"To explore compositions in your Workspace UI, start the local development server for your workspace (",(0,i.mdx)("inlineCode",{parentName:"p"},"bit start"),"),\nbrowse to a specific component and select the ",(0,i.mdx)("strong",{parentName:"p"},"compositions")," tab.\nThere, you will see the full list of compositions available for that component, along with additional component meta-data."),(0,i.mdx)("h2",null,"Using compositions for automated testings"),(0,i.mdx)("p",null,"Component compositions can be used in automated testing as well as manual examinations. To do that, simply import the compositions in your test file to run the appropriate tests."),(0,i.mdx)("p",null,"For example, the below snapshot test checks the 'Button' component when the 'variant' prop is set to 'primary'.\nIn addition to simple unit tests, compositions play an important role in integration test as they provide feedback as to how a change to the component may affect potential usages."),(0,i.mdx)("pre",null,(0,i.mdx)("code",{parentName:"pre",className:"language-jsx"},"import React from 'react';\nimport testRenderer from 'react-test-renderer';\nimport { PrimaryButton } from './button.compositions.tsx';\n\ndescribe('Button', () => {\n  it('renders correctly as \"primary\"', () => {\n    const component = testRenderer.create(<PrimaryButton>test primary variant</PrimaryButton>);\n    const tree = component.toJSON();\n    expect(tree).toMatchSnapshot();\n  });\n});\n")),(0,i.mdx)("h2",null,"Setting providers for all your compositions"),(0,i.mdx)("p",null,"Extend the React environment to customize its list of providers with your own composition providers.\nThe extended environment will then wrap every composition with these providers to make sure your themes or mock data are accessible to all of them,\nwithout you having to repeat that task ever again."),(0,i.mdx)("h2",null,"Compositions and storybook"),(0,i.mdx)("p",null,"Storybook displays individual components in different states and variations.\nIt is designed to help in authoring and displaying standalone components, each of which is usually part of a design system.\nIn contrast, 'Compositions' is mainly about examining how an independent component looks and behaves when used with other components.\nThese component integrations serve as a way to examine compositions that are likely to be part of real applications, using manual and automated testing."),(0,i.mdx)("p",null,"If you're looking for a Storybook-like solution, you can find that either in the Storybook extension (currently in development) or by using 'Compositions' for that use-case as well."))}f.__bit_component=n,f.isMDXComponent=!0},31862:(e,o,t)=>{Object.defineProperty(o,"T",{enumerable:!0,get:function(){return n.default}});var n=i(t(96833));function i(e){return e&&e.__esModule?e:{default:e}}i.__bit_component={id:"teambit.compositions/aspect-docs/compositions@0.0.165",homepage:"https://bit.cloud/teambit/compositions/aspect-docs/compositions",exported:!0}},40040:e=>{e.exports=MdxJsReact},87363:e=>{e.exports=React}},o={};function t(n){var i=o[n];if(void 0!==i)return i.exports;var s=o[n]={exports:{}};return e[n](s,s.exports,t),s.exports}t.d=(e,o)=>{for(var n in o)t.o(o,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:o[n]})},t.o=(e,o)=>Object.prototype.hasOwnProperty.call(e,o),t.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{t.r(n),t.d(n,{compositions:()=>d,compositions_metadata:()=>h,overview:()=>u});var e={};t.r(e),t.d(e,{default:()=>l});var o=t(15810),i=(t(87363),t(40040));const s=TeambitMdxUiMdxScopeContext;var a=t(31862),r=["components"];function p(){return p=Object.assign?Object.assign.bind():function(e){for(var o=1;o<arguments.length;o++){var t=arguments[o];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},p.apply(this,arguments)}var m={},c="wrapper";function l(e){var o=e.components,t=function(e,o){if(null==e)return{};var t,n,i=function(e,o){if(null==e)return{};var t,n,i={},s=Object.keys(e);for(n=0;n<s.length;n++)t=s[n],o.indexOf(t)>=0||(i[t]=e[t]);return i}(e,o);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(n=0;n<s.length;n++)t=s[n],o.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(e,r);return(0,i.mdx)(c,p({},m,t,{components:o,mdxType:"MDXLayout"}),(0,i.mdx)(s.MDXScopeProvider,{components:{Compositions:a.T},mdxType:"MDXScopeProvider"},(0,i.mdx)(a.T,{mdxType:"Compositions"})))}l.isMDXComponent=!0;const d=[o],u=[e],h={compositions:[{displayName:"Logo",identifier:"Logo"}]}})(),n})()));

package/dist/composition.d.ts

@@ -1,13 +1,13 @@
-export declare type CompositionProps = {
+export type CompositionProps = {
     identifier: string;
     filepath?: string;
     displayName?: string;
 };
-export declare type CompositionBrowserMetadata = {
+export type CompositionBrowserMetadata = {
     displayName?: string;
     identifier: string;
 };
-export declare type CompositionBrowserMetadataObject = {
+export type CompositionBrowserMetadataObject = {
     compositions: CompositionBrowserMetadata[];
 };
 export declare class Composition {
@@ -18,7 +18,7 @@ export declare class Composition {
     /**
      * file path in which the composition is contained.
      */
-    readonly filepath?: string | undefined;
+    readonly filepath?: string;
     /**
      * set explicit display name
      */
@@ -31,16 +31,16 @@ export declare class Composition {
     /**
      * file path in which the composition is contained.
      */
-    filepath?: string | undefined, 
+    filepath?: string, 
     /**
      * set explicit display name
      */
-    _displayName?: string | undefined);
+    _displayName?: string);
     get displayName(): string;
     toObject(): {
         identifier: string;
-        filepath: string | undefined;
-        displayName: string | undefined;
+        filepath: string;
+        displayName: string;
     };
     toBrowserMetaDataObject(): CompositionBrowserMetadata;
     static fromArray(compositions: CompositionProps[]): Composition[];

package/dist/composition.section.d.ts

@@ -1,7 +1,7 @@
+/// <reference types="react" />
 import { Section } from '@teambit/component';
-import React from 'react';
 import type { CompositionsUI, CompositionsMenuSlot, EmptyStateSlot } from './compositions.ui.runtime';
-declare type Options = {
+type Options = {
     menuBarWidgetSlot: CompositionsMenuSlot;
 };
 export declare class CompositionsSection implements Section {
@@ -22,7 +22,7 @@ export declare class CompositionsSection implements Section {
     };
     route: {
         path: string;
-        element: React.JSX.Element;
+        element: JSX.Element;
     };
     order: number;
 }

package/dist/compositions.composition.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
-export declare const Logo: () => React.JSX.Element;
+/// <reference types="react" />
+export declare const Logo: () => JSX.Element;

package/dist/compositions.d.ts

@@ -1,22 +1,22 @@
-import React, { ReactNode } from 'react';
+import { ReactNode } from 'react';
 import { ComponentModel } from '@teambit/component';
 import { EmptyStateSlot } from './compositions.ui.runtime';
 import { Composition } from './composition';
 import type { CompositionsMenuSlot } from './compositions.ui.runtime';
 import { ComponentCompositionProps } from './ui/composition-preview';
-export declare type MenuBarWidget = {
+export type MenuBarWidget = {
     location: 'start' | 'end';
     content: ReactNode;
 };
-export declare type CompositionsProp = {
+export type CompositionsProp = {
     menuBarWidgets?: CompositionsMenuSlot;
     emptyState?: EmptyStateSlot;
 };
-export declare function Compositions({ menuBarWidgets, emptyState }: CompositionsProp): React.JSX.Element;
-export declare type CompositionContentProps = {
+export declare function Compositions({ menuBarWidgets, emptyState }: CompositionsProp): JSX.Element;
+export type CompositionContentProps = {
     component: ComponentModel;
     selected?: Composition;
     queryParams?: string | string[];
     emptyState?: EmptyStateSlot;
 } & ComponentCompositionProps;
-export declare function CompositionContent({ component, selected, queryParams, emptyState, ...componentCompositionProps }: CompositionContentProps): React.JSX.Element;
+export declare function CompositionContent({ component, selected, queryParams, emptyState, ...componentCompositionProps }: CompositionContentProps): JSX.Element;

package/dist/compositions.js

@@ -205,7 +205,6 @@ function Compositions({
   menuBarWidgets,
   emptyState
 }) {
-  var _component$preview, _component$preview2, _component$preview3;
   const component = (0, _react().useContext)(_component().ComponentContext);
   // const [searchParams, setSearchParams] = useSearchParams();
   const params = (0, _reactRouterDom().useParams)();
@@ -232,9 +231,9 @@ function Compositions({
   const [isSidebarOpen, setSidebarOpenness] = (0, _react().useState)(showSidebar);
   const sidebarOpenness = isSidebarOpen ? _baseUiSurfacesSplitPane().Layout.row : _baseUiSurfacesSplitPane().Layout.left;
   const compositionUrl = (0, _previewUi().toPreviewUrl)(component, 'compositions');
-  const isScaling = component === null || component === void 0 || (_component$preview = component.preview) === null || _component$preview === void 0 ? void 0 : _component$preview.isScaling;
-  const includesEnvTemplates = component === null || component === void 0 || (_component$preview2 = component.preview) === null || _component$preview2 === void 0 ? void 0 : _component$preview2.includesEnvTemplate;
-  const compositionIdentifierParam = isScaling && includesEnvTemplates === false ? `name=${currentComposition === null || currentComposition === void 0 ? void 0 : currentComposition.identifier}` : currentComposition === null || currentComposition === void 0 ? void 0 : currentComposition.identifier;
+  const isScaling = component?.preview?.isScaling;
+  const includesEnvTemplates = component?.preview?.includesEnvTemplate;
+  const compositionIdentifierParam = isScaling && includesEnvTemplates === false ? `name=${currentComposition?.identifier}` : currentComposition?.identifier;
   const currentCompositionFullUrl = (0, _previewUi().toPreviewUrl)(component, 'compositions', compositionIdentifierParam);
   const [compositionParams, setCompositionParams] = (0, _react().useState)({});
   const queryParams = (0, _react().useMemo)(() => _queryString().default.stringify(compositionParams), [compositionParams]);
@@ -285,7 +284,7 @@ function Compositions({
     className: _compositionsModule().default.tabContent
   }, /*#__PURE__*/_react().default.createElement(_compositionsPanel().CompositionsPanel, {
     isScaling: isScaling,
-    includesEnvTemplate: (_component$preview3 = component.preview) === null || _component$preview3 === void 0 ? void 0 : _component$preview3.includesEnvTemplate,
+    includesEnvTemplate: component.preview?.includesEnvTemplate,
     onSelectComposition: composition => {
       if (!currentComposition || !location) return;
       if (location.pathname.includes(currentComposition.identifier.toLowerCase())) {
@@ -312,7 +311,6 @@ function Compositions({
   }) : /*#__PURE__*/_react().default.createElement("div", null)))))));
 }
 function CompositionContent(_ref) {
-  var _component$environmen;
   let {
       component,
       selected,
@@ -320,8 +318,8 @@ function CompositionContent(_ref) {
       emptyState
     } = _ref,
     componentCompositionProps = _objectWithoutProperties(_ref, _excluded);
-  const env = (_component$environmen = component.environment) === null || _component$environmen === void 0 ? void 0 : _component$environmen.id;
-  const EmptyStateTemplate = emptyState === null || emptyState === void 0 ? void 0 : emptyState.get(env || ''); // || defaultTemplate;
+  const env = component.environment?.id;
+  const EmptyStateTemplate = emptyState?.get(env || ''); // || defaultTemplate;
 
   if (component.compositions.length === 0 && component.host === 'teambit.workspace/workspace' && EmptyStateTemplate) {
     return /*#__PURE__*/_react().default.createElement("div", {
@@ -336,12 +334,12 @@ function CompositionContent(_ref) {
       title: "There are no compositions for this Component. Learn how to add compositions:"
     }, /*#__PURE__*/_react().default.createElement(_mdxUi().MDXLayout, null, /*#__PURE__*/_react().default.createElement(EmptyStateTemplate, null)))));
   }
-  if ((component === null || component === void 0 ? void 0 : component.buildStatus) === 'pending' && (component === null || component === void 0 ? void 0 : component.host) === 'teambit.scope/scope') return /*#__PURE__*/_react().default.createElement(_designUiSurfaces().StatusMessageCard, {
+  if (component?.buildStatus === 'pending' && component?.host === 'teambit.scope/scope') return /*#__PURE__*/_react().default.createElement(_designUiSurfaces().StatusMessageCard, {
     className: _compositionsModule().default.buildStatusMessage,
     status: "PROCESSING",
     title: "component preview pending"
   }, "this might take some time");
-  if ((component === null || component === void 0 ? void 0 : component.buildStatus) === 'failed' && (component === null || component === void 0 ? void 0 : component.host) === 'teambit.scope/scope') return /*#__PURE__*/_react().default.createElement(_designUiSurfaces().StatusMessageCard, {
+  if (component?.buildStatus === 'failed' && component?.host === 'teambit.scope/scope') return /*#__PURE__*/_react().default.createElement(_designUiSurfaces().StatusMessageCard, {
     className: _compositionsModule().default.buildStatusMessage,
     status: "FAILURE",
     title: "failed to get component preview "

package/dist/compositions.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","data","_interopRequireWildcard","require","_reactRouterDom","_lodash","_interopRequireDefault","_queryString","_documenterTheme","_baseUiSurfacesSplitPane","_baseUiSurfacesSplitPane2","_component","_documenterUi","_panels","_docsUiQueries","_uiFoundationUiButtons","_designUi","_previewUi","_uiFoundationUiHooks","_compositionsUi","_compositionsUiHooks","_mdxUi","_designUi2","_documenterUi2","_designUi3","_baseReactNavigation","_designUiInput","_designUiSurfaces","_compositionsModule","_ui","_compositionsPanel","_excluded","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Compositions","menuBarWidgets","emptyState","_component$preview","_component$preview2","_component$preview3","component","useContext","ComponentContext","params","useParams","navigate","useNavigate","location","useLocation","currentCompositionName","currentComposition","compositions","find","composition","identifier","toLowerCase","head","selectedRef","useRef","current","properties","useDocs","id","isMobile","useIsMobile","showSidebar","isSidebarOpen","setSidebarOpenness","useState","sidebarOpenness","Layout","row","left","compositionUrl","toPreviewUrl","isScaling","preview","includesEnvTemplates","includesEnvTemplate","compositionIdentifierParam","currentCompositionFullUrl","compositionParams","setCompositionParams","queryParams","useMemo","queryString","stringify","useEffect","createElement","CompositionContextProvider","setQueryParams","SplitPane","layout","size","className","styles","compositionsPage","Pane","CompositionsMenuBar","menuBar","Link","external","href","openInNewTab","OptionButton","icon","CompositionContent","compositionPanel","selected","HoverSplitter","splitter","Collapser","placement","isOpen","onMouseDown","stopPropagation","onClick","x","tooltipContent","collapser","right","ThemeContext","TabContainer","tabsContainer","TabList","tabs","Tab","TabPanel","tabContent","CompositionsPanel","onSelectComposition","pathname","includes","path","replace","nextPath","concat","url","active","PropTable","rows","showListView","_ref","_component$environmen","componentCompositionProps","env","environment","EmptyStateTemplate","host","noCompositionsPage","H1","title","Separator","isPresentational","separator","AlertCard","level","MDXLayout","buildStatus","StatusMessageCard","buildStatusMessage","status","EmptyBox","linkText","link","ComponentComposition","compositionsIframe","viewport","forceHeight","fullContentHeight","pubsub"],"sources":["compositions.tsx"],"sourcesContent":["import React, { useContext, useEffect, useState, useMemo, useRef, ReactNode } from 'react';\nimport { useParams } from 'react-router-dom';\nimport head from 'lodash.head';\nimport queryString from 'query-string';\nimport { ThemeContext } from '@teambit/documenter.theme.theme-context';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { ComponentContext, ComponentModel } from '@teambit/component';\nimport { PropTable } from '@teambit/documenter.ui.property-table';\nimport { Tab, TabContainer, TabList, TabPanel } from '@teambit/panels';\nimport { useDocs } from '@teambit/docs.ui.queries.get-docs';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { EmptyBox } from '@teambit/design.ui.empty-box';\nimport { toPreviewUrl } from '@teambit/preview.ui.component-preview';\nimport { useIsMobile } from '@teambit/ui-foundation.ui.hooks.use-is-mobile';\nimport { CompositionsMenuBar } from '@teambit/compositions.ui.compositions-menu-bar';\nimport { CompositionContextProvider } from '@teambit/compositions.ui.hooks.use-composition';\nimport { MDXLayout } from '@teambit/mdx.ui.mdx-layout';\nimport { Separator } from '@teambit/design.ui.separator';\nimport { H1 } from '@teambit/documenter.ui.heading';\nimport { AlertCard } from '@teambit/design.ui.alert-card';\nimport { Link, useNavigate, useLocation } from '@teambit/base-react.navigation.link';\nimport { OptionButton } from '@teambit/design.ui.input.option-button';\nimport { StatusMessageCard } from '@teambit/design.ui.surfaces.status-message-card';\nimport { EmptyStateSlot } from './compositions.ui.runtime';\nimport { Composition } from './composition';\nimport styles from './compositions.module.scss';\nimport { ComponentComposition } from './ui';\nimport { CompositionsPanel } from './ui/compositions-panel/compositions-panel';\nimport type { CompositionsMenuSlot } from './compositions.ui.runtime';\nimport { ComponentCompositionProps } from './ui/composition-preview';\n\nexport type MenuBarWidget = {\n  location: 'start' | 'end';\n  content: ReactNode;\n};\nexport type CompositionsProp = { menuBarWidgets?: CompositionsMenuSlot; emptyState?: EmptyStateSlot };\n\nexport function Compositions({ menuBarWidgets, emptyState }: CompositionsProp) {\n  const component = useContext(ComponentContext);\n  // const [searchParams, setSearchParams] = useSearchParams();\n  const params = useParams();\n  const navigate = useNavigate();\n  const location = useLocation();\n  const currentCompositionName = params['*'];\n  // console.log(routes);\n  const currentComposition =\n    component.compositions.find((composition) => composition.identifier.toLowerCase() === currentCompositionName) ||\n    head(component.compositions);\n  // const [selected, selectComposition] = useState(head(component.compositions));\n  const selectedRef = useRef(currentComposition);\n  selectedRef.current = currentComposition;\n\n  const properties = useDocs(component.id);\n\n  // reset selected composition when component changes.\n  // this does trigger renderer, but perf seems to be ok\n  // useEffect(() => {\n  //   const prevId = selectedRef.current?.identifier;\n  //   const next = component.compositions.find((c) => c.identifier === prevId) || component.compositions[0];\n\n  //   navigate(next.displayName.toLowerCase().replaceAll(' ', '-'));\n  // }, [component]);\n  const isMobile = useIsMobile();\n  const showSidebar = !isMobile && component.compositions.length > 0;\n  const [isSidebarOpen, setSidebarOpenness] = useState(showSidebar);\n\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.left;\n\n  const compositionUrl = toPreviewUrl(component, 'compositions');\n  const isScaling = component?.preview?.isScaling;\n  const includesEnvTemplates = component?.preview?.includesEnvTemplate;\n  const compositionIdentifierParam =\n    isScaling && includesEnvTemplates === false\n      ? `name=${currentComposition?.identifier}`\n      : currentComposition?.identifier;\n  const currentCompositionFullUrl = toPreviewUrl(component, 'compositions', compositionIdentifierParam);\n\n  const [compositionParams, setCompositionParams] = useState<Record<string, any>>({});\n  const queryParams = useMemo(() => queryString.stringify(compositionParams), [compositionParams]);\n\n  // collapse sidebar when empty, reopen when not\n  useEffect(() => setSidebarOpenness(showSidebar), [showSidebar]);\n  return (\n    <CompositionContextProvider queryParams={compositionParams} setQueryParams={setCompositionParams}>\n      <SplitPane layout={sidebarOpenness} size=\"85%\" className={styles.compositionsPage}>\n        <Pane className={styles.left}>\n          <CompositionsMenuBar menuBarWidgets={menuBarWidgets} className={styles.menuBar}>\n            <Link external href={currentCompositionFullUrl} className={styles.openInNewTab}>\n              <OptionButton icon=\"open-tab\" />\n            </Link>\n          </CompositionsMenuBar>\n          <CompositionContent\n            className={styles.compositionPanel}\n            emptyState={emptyState}\n            component={component}\n            selected={currentComposition}\n            queryParams={queryParams}\n          />\n        </Pane>\n        <HoverSplitter className={styles.splitter}>\n          <Collapser\n            placement=\"left\"\n            isOpen={isSidebarOpen}\n            onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n            onClick={() => setSidebarOpenness((x) => !x)}\n            tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side compositions`}\n            className={styles.collapser}\n          />\n        </HoverSplitter>\n        <Pane className={styles.right}>\n          <ThemeContext>\n            <TabContainer className={styles.tabsContainer}>\n              <TabList className={styles.tabs}>\n                <Tab>compositions</Tab>\n                <Tab>properties</Tab>\n              </TabList>\n              <TabPanel className={styles.tabContent}>\n                <CompositionsPanel\n                  isScaling={isScaling}\n                  includesEnvTemplate={component.preview?.includesEnvTemplate}\n                  onSelectComposition={(composition) => {\n                    if (!currentComposition || !location) return;\n                    if (location.pathname.includes(currentComposition.identifier.toLowerCase())) {\n                      navigate(composition.identifier.toLowerCase());\n                      return;\n                    }\n\n                    const path = location.pathname.replace(\n                      currentComposition.identifier.toLowerCase(),\n                      composition.identifier.toLowerCase()\n                    );\n\n                    if (!path) return;\n                    if (!path.includes(composition.identifier.toLowerCase())) {\n                      const nextPath = location.pathname.concat(`/${composition.identifier.toLowerCase()}`);\n                      navigate(nextPath);\n                      return;\n                    }\n                    navigate(path);\n                  }}\n                  url={compositionUrl}\n                  compositions={component.compositions}\n                  active={currentComposition}\n                />\n              </TabPanel>\n              <TabPanel className={styles.tabContent}>\n                {properties && properties.length > 0 ? <PropTable rows={properties} showListView /> : <div />}\n              </TabPanel>\n            </TabContainer>\n          </ThemeContext>\n        </Pane>\n      </SplitPane>\n    </CompositionContextProvider>\n  );\n}\n\nexport type CompositionContentProps = {\n  component: ComponentModel;\n  selected?: Composition;\n  queryParams?: string | string[];\n  emptyState?: EmptyStateSlot;\n} & ComponentCompositionProps;\n\nexport function CompositionContent({\n  component,\n  selected,\n  queryParams,\n  emptyState,\n  ...componentCompositionProps\n}: CompositionContentProps) {\n  const env = component.environment?.id;\n  const EmptyStateTemplate = emptyState?.get(env || ''); // || defaultTemplate;\n\n  if (component.compositions.length === 0 && component.host === 'teambit.workspace/workspace' && EmptyStateTemplate) {\n    return (\n      <div className={styles.noCompositionsPage}>\n        <div>\n          <H1 className={styles.title}>Compositions</H1>\n          <Separator isPresentational className={styles.separator} />\n          <AlertCard\n            level=\"info\"\n            title=\"There are no\n              compositions for this Component. Learn how to add compositions:\"\n          >\n            <MDXLayout>\n              <EmptyStateTemplate />\n            </MDXLayout>\n          </AlertCard>\n        </div>\n      </div>\n    );\n  }\n\n  if (component?.buildStatus === 'pending' && component?.host === 'teambit.scope/scope')\n    return (\n      <StatusMessageCard className={styles.buildStatusMessage} status=\"PROCESSING\" title=\"component preview pending\">\n        this might take some time\n      </StatusMessageCard>\n    );\n  if (component?.buildStatus === 'failed' && component?.host === 'teambit.scope/scope')\n    return (\n      <StatusMessageCard\n        className={styles.buildStatusMessage}\n        status=\"FAILURE\"\n        title=\"failed to get component preview \"\n      ></StatusMessageCard>\n    );\n\n  // TODO: get the docs domain from the community aspect and pass it here as a prop\n  if (component.compositions.length === 0) {\n    return (\n      <EmptyBox\n        title=\"There are no compositions for this component.\"\n        linkText=\"Learn how to create compositions\"\n        link={`https://bit.dev/reference/dev-services-overview/compositions/compositions-overview`}\n      />\n    );\n  }\n\n  return (\n    <ComponentComposition\n      className={styles.compositionsIframe}\n      // TODO: Oded to add control for viewport.\n      viewport={null}\n      component={component}\n      forceHeight=\"100%\"\n      composition={selected}\n      fullContentHeight\n      pubsub={true}\n      queryParams={queryParams}\n      {...componentCompositionProps}\n    />\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["_react","data","_interopRequireWildcard","require","_reactRouterDom","_lodash","_interopRequireDefault","_queryString","_documenterTheme","_baseUiSurfacesSplitPane","_baseUiSurfacesSplitPane2","_component","_documenterUi","_panels","_docsUiQueries","_uiFoundationUiButtons","_designUi","_previewUi","_uiFoundationUiHooks","_compositionsUi","_compositionsUiHooks","_mdxUi","_designUi2","_documenterUi2","_designUi3","_baseReactNavigation","_designUiInput","_designUiSurfaces","_compositionsModule","_ui","_compositionsPanel","_excluded","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Compositions","menuBarWidgets","emptyState","component","useContext","ComponentContext","params","useParams","navigate","useNavigate","location","useLocation","currentCompositionName","currentComposition","compositions","find","composition","identifier","toLowerCase","head","selectedRef","useRef","current","properties","useDocs","id","isMobile","useIsMobile","showSidebar","isSidebarOpen","setSidebarOpenness","useState","sidebarOpenness","Layout","row","left","compositionUrl","toPreviewUrl","isScaling","preview","includesEnvTemplates","includesEnvTemplate","compositionIdentifierParam","currentCompositionFullUrl","compositionParams","setCompositionParams","queryParams","useMemo","queryString","stringify","useEffect","createElement","CompositionContextProvider","setQueryParams","SplitPane","layout","size","className","styles","compositionsPage","Pane","CompositionsMenuBar","menuBar","Link","external","href","openInNewTab","OptionButton","icon","CompositionContent","compositionPanel","selected","HoverSplitter","splitter","Collapser","placement","isOpen","onMouseDown","stopPropagation","onClick","x","tooltipContent","collapser","right","ThemeContext","TabContainer","tabsContainer","TabList","tabs","Tab","TabPanel","tabContent","CompositionsPanel","onSelectComposition","pathname","includes","path","replace","nextPath","concat","url","active","PropTable","rows","showListView","_ref","componentCompositionProps","env","environment","EmptyStateTemplate","host","noCompositionsPage","H1","title","Separator","isPresentational","separator","AlertCard","level","MDXLayout","buildStatus","StatusMessageCard","buildStatusMessage","status","EmptyBox","linkText","link","ComponentComposition","compositionsIframe","viewport","forceHeight","fullContentHeight","pubsub"],"sources":["compositions.tsx"],"sourcesContent":["import React, { useContext, useEffect, useState, useMemo, useRef, ReactNode } from 'react';\nimport { useParams } from 'react-router-dom';\nimport head from 'lodash.head';\nimport queryString from 'query-string';\nimport { ThemeContext } from '@teambit/documenter.theme.theme-context';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { ComponentContext, ComponentModel } from '@teambit/component';\nimport { PropTable } from '@teambit/documenter.ui.property-table';\nimport { Tab, TabContainer, TabList, TabPanel } from '@teambit/panels';\nimport { useDocs } from '@teambit/docs.ui.queries.get-docs';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { EmptyBox } from '@teambit/design.ui.empty-box';\nimport { toPreviewUrl } from '@teambit/preview.ui.component-preview';\nimport { useIsMobile } from '@teambit/ui-foundation.ui.hooks.use-is-mobile';\nimport { CompositionsMenuBar } from '@teambit/compositions.ui.compositions-menu-bar';\nimport { CompositionContextProvider } from '@teambit/compositions.ui.hooks.use-composition';\nimport { MDXLayout } from '@teambit/mdx.ui.mdx-layout';\nimport { Separator } from '@teambit/design.ui.separator';\nimport { H1 } from '@teambit/documenter.ui.heading';\nimport { AlertCard } from '@teambit/design.ui.alert-card';\nimport { Link, useNavigate, useLocation } from '@teambit/base-react.navigation.link';\nimport { OptionButton } from '@teambit/design.ui.input.option-button';\nimport { StatusMessageCard } from '@teambit/design.ui.surfaces.status-message-card';\nimport { EmptyStateSlot } from './compositions.ui.runtime';\nimport { Composition } from './composition';\nimport styles from './compositions.module.scss';\nimport { ComponentComposition } from './ui';\nimport { CompositionsPanel } from './ui/compositions-panel/compositions-panel';\nimport type { CompositionsMenuSlot } from './compositions.ui.runtime';\nimport { ComponentCompositionProps } from './ui/composition-preview';\n\nexport type MenuBarWidget = {\n  location: 'start' | 'end';\n  content: ReactNode;\n};\nexport type CompositionsProp = { menuBarWidgets?: CompositionsMenuSlot; emptyState?: EmptyStateSlot };\n\nexport function Compositions({ menuBarWidgets, emptyState }: CompositionsProp) {\n  const component = useContext(ComponentContext);\n  // const [searchParams, setSearchParams] = useSearchParams();\n  const params = useParams();\n  const navigate = useNavigate();\n  const location = useLocation();\n  const currentCompositionName = params['*'];\n  // console.log(routes);\n  const currentComposition =\n    component.compositions.find((composition) => composition.identifier.toLowerCase() === currentCompositionName) ||\n    head(component.compositions);\n  // const [selected, selectComposition] = useState(head(component.compositions));\n  const selectedRef = useRef(currentComposition);\n  selectedRef.current = currentComposition;\n\n  const properties = useDocs(component.id);\n\n  // reset selected composition when component changes.\n  // this does trigger renderer, but perf seems to be ok\n  // useEffect(() => {\n  //   const prevId = selectedRef.current?.identifier;\n  //   const next = component.compositions.find((c) => c.identifier === prevId) || component.compositions[0];\n\n  //   navigate(next.displayName.toLowerCase().replaceAll(' ', '-'));\n  // }, [component]);\n  const isMobile = useIsMobile();\n  const showSidebar = !isMobile && component.compositions.length > 0;\n  const [isSidebarOpen, setSidebarOpenness] = useState(showSidebar);\n\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.left;\n\n  const compositionUrl = toPreviewUrl(component, 'compositions');\n  const isScaling = component?.preview?.isScaling;\n  const includesEnvTemplates = component?.preview?.includesEnvTemplate;\n  const compositionIdentifierParam =\n    isScaling && includesEnvTemplates === false\n      ? `name=${currentComposition?.identifier}`\n      : currentComposition?.identifier;\n  const currentCompositionFullUrl = toPreviewUrl(component, 'compositions', compositionIdentifierParam);\n\n  const [compositionParams, setCompositionParams] = useState<Record<string, any>>({});\n  const queryParams = useMemo(() => queryString.stringify(compositionParams), [compositionParams]);\n\n  // collapse sidebar when empty, reopen when not\n  useEffect(() => setSidebarOpenness(showSidebar), [showSidebar]);\n  return (\n    <CompositionContextProvider queryParams={compositionParams} setQueryParams={setCompositionParams}>\n      <SplitPane layout={sidebarOpenness} size=\"85%\" className={styles.compositionsPage}>\n        <Pane className={styles.left}>\n          <CompositionsMenuBar menuBarWidgets={menuBarWidgets} className={styles.menuBar}>\n            <Link external href={currentCompositionFullUrl} className={styles.openInNewTab}>\n              <OptionButton icon=\"open-tab\" />\n            </Link>\n          </CompositionsMenuBar>\n          <CompositionContent\n            className={styles.compositionPanel}\n            emptyState={emptyState}\n            component={component}\n            selected={currentComposition}\n            queryParams={queryParams}\n          />\n        </Pane>\n        <HoverSplitter className={styles.splitter}>\n          <Collapser\n            placement=\"left\"\n            isOpen={isSidebarOpen}\n            onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n            onClick={() => setSidebarOpenness((x) => !x)}\n            tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side compositions`}\n            className={styles.collapser}\n          />\n        </HoverSplitter>\n        <Pane className={styles.right}>\n          <ThemeContext>\n            <TabContainer className={styles.tabsContainer}>\n              <TabList className={styles.tabs}>\n                <Tab>compositions</Tab>\n                <Tab>properties</Tab>\n              </TabList>\n              <TabPanel className={styles.tabContent}>\n                <CompositionsPanel\n                  isScaling={isScaling}\n                  includesEnvTemplate={component.preview?.includesEnvTemplate}\n                  onSelectComposition={(composition) => {\n                    if (!currentComposition || !location) return;\n                    if (location.pathname.includes(currentComposition.identifier.toLowerCase())) {\n                      navigate(composition.identifier.toLowerCase());\n                      return;\n                    }\n\n                    const path = location.pathname.replace(\n                      currentComposition.identifier.toLowerCase(),\n                      composition.identifier.toLowerCase()\n                    );\n\n                    if (!path) return;\n                    if (!path.includes(composition.identifier.toLowerCase())) {\n                      const nextPath = location.pathname.concat(`/${composition.identifier.toLowerCase()}`);\n                      navigate(nextPath);\n                      return;\n                    }\n                    navigate(path);\n                  }}\n                  url={compositionUrl}\n                  compositions={component.compositions}\n                  active={currentComposition}\n                />\n              </TabPanel>\n              <TabPanel className={styles.tabContent}>\n                {properties && properties.length > 0 ? <PropTable rows={properties} showListView /> : <div />}\n              </TabPanel>\n            </TabContainer>\n          </ThemeContext>\n        </Pane>\n      </SplitPane>\n    </CompositionContextProvider>\n  );\n}\n\nexport type CompositionContentProps = {\n  component: ComponentModel;\n  selected?: Composition;\n  queryParams?: string | string[];\n  emptyState?: EmptyStateSlot;\n} & ComponentCompositionProps;\n\nexport function CompositionContent({\n  component,\n  selected,\n  queryParams,\n  emptyState,\n  ...componentCompositionProps\n}: CompositionContentProps) {\n  const env = component.environment?.id;\n  const EmptyStateTemplate = emptyState?.get(env || ''); // || defaultTemplate;\n\n  if (component.compositions.length === 0 && component.host === 'teambit.workspace/workspace' && EmptyStateTemplate) {\n    return (\n      <div className={styles.noCompositionsPage}>\n        <div>\n          <H1 className={styles.title}>Compositions</H1>\n          <Separator isPresentational className={styles.separator} />\n          <AlertCard\n            level=\"info\"\n            title=\"There are no\n              compositions for this Component. Learn how to add compositions:\"\n          >\n            <MDXLayout>\n              <EmptyStateTemplate />\n            </MDXLayout>\n          </AlertCard>\n        </div>\n      </div>\n    );\n  }\n\n  if (component?.buildStatus === 'pending' && component?.host === 'teambit.scope/scope')\n    return (\n      <StatusMessageCard className={styles.buildStatusMessage} status=\"PROCESSING\" title=\"component preview pending\">\n        this might take some time\n      </StatusMessageCard>\n    );\n  if (component?.buildStatus === 'failed' && component?.host === 'teambit.scope/scope')\n    return (\n      <StatusMessageCard\n        className={styles.buildStatusMessage}\n        status=\"FAILURE\"\n        title=\"failed to get component preview \"\n      ></StatusMessageCard>\n    );\n\n  // TODO: get the docs domain from the community aspect and pass it here as a prop\n  if (component.compositions.length === 0) {\n    return (\n      <EmptyBox\n        title=\"There are no compositions for this component.\"\n        linkText=\"Learn how to create compositions\"\n        link={`https://bit.dev/reference/dev-services-overview/compositions/compositions-overview`}\n      />\n    );\n  }\n\n  return (\n    <ComponentComposition\n      className={styles.compositionsIframe}\n      // TODO: Oded to add control for viewport.\n      viewport={null}\n      component={component}\n      forceHeight=\"100%\"\n      composition={selected}\n      fullContentHeight\n      pubsub={true}\n      queryParams={queryParams}\n      {...componentCompositionProps}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/compositions.main.runtime.d.ts

@@ -9,7 +9,7 @@ import { PreviewMain } from '@teambit/preview';
 import { SchemaMain } from '@teambit/schema';
 import { Workspace } from '@teambit/workspace';
 import { Composition } from './composition';
-export declare type CompositionsConfig = {
+export type CompositionsConfig = {
     /**
      * glob pattern to detect composition files. This includes all related files, like styles and jsons.
      * @example ['/*.composition?(s).*']
@@ -89,10 +89,7 @@ export declare class CompositionsMain {
         name: string;
         pattern: string[];
     };
-    getDevPatternToRegister(): (component: Component) => {
-        name: string;
-        pattern: string[];
-    };
+    getDevPatternToRegister(): any;
     onComponentLoad(component: Component, loadOpts?: ComponentLoadOptions): Promise<AspectData | undefined>;
     private computeCompositions;
     static defaultConfig: CompositionsConfig;

package/dist/compositions.main.runtime.js

@@ -197,9 +197,8 @@ class CompositionsMain {
     return this.compositionFilePattern;
   }
   getComponentDevPatterns(component) {
-    var _this$workspace;
     const env = this.envs.calculateEnv(component, {
-      skipWarnings: !!((_this$workspace = this.workspace) !== null && _this$workspace !== void 0 && _this$workspace.inInstallContext)
+      skipWarnings: !!this.workspace?.inInstallContext
     }).env;
     const componentEnvCompositionsDevPatterns = env.getCompositionsDevPatterns ? env.getCompositionsDevPatterns(component) : [];
     const componentPatterns = componentEnvCompositionsDevPatterns.concat(this.getCompositionFilePattern());
@@ -212,7 +211,7 @@ class CompositionsMain {
     return this.getComponentDevPatterns.bind(this);
   }
   async onComponentLoad(component, loadOpts) {
-    if ((loadOpts === null || loadOpts === void 0 ? void 0 : loadOpts.loadCompositions) === false) return undefined;
+    if (loadOpts?.loadCompositions === false) return undefined;
     const compositions = this.readCompositions(component);
     return {
       compositions: compositions.map(composition => composition.toObject())
@@ -225,8 +224,7 @@ class CompositionsMain {
     const modulePath = this.workspace ? (0, _path().join)(this.workspace.componentDir(component.id), file.relative) : file.relative;
     const exports = this.schema.parseModule(modulePath, file.contents.toString());
     return exports.map(exportModel => {
-      var _exportModel$staticPr;
-      const displayName = (_exportModel$staticPr = exportModel.staticProperties) === null || _exportModel$staticPr === void 0 ? void 0 : _exportModel$staticPr.get('compositionName');
+      const displayName = exportModel.staticProperties?.get('compositionName');
       return new (_composition().Composition)(exportModel.identifier, file.relative, typeof displayName === 'string' ? displayName : undefined);
     });
   }

package/dist/compositions.main.runtime.js.map

@@ -1 +1 @@
-{"version":3,"names":["_cli","data","require","_component","_scope","_interopRequireDefault","_devFiles","_envs","_graphql","_preview","_schema","_toolboxPath","_workspace","_path","_composition","_compositions","_compositions2","_compositions3","obj","__esModule","default","_defineProperty","key","value","_toPropertyKey","Object","defineProperty","enumerable","configurable","writable","t","i","_toPrimitive","String","r","e","Symbol","toPrimitive","call","TypeError","Number","CompositionsMain","constructor","compositionFilePattern","previewFilePattern","preview","workspace","schema","devFiles","envs","getPreviewFiles","components","ComponentMap","as","component","compositionFiles","state","filesystem","byGlob","previewFiles","Set","map","file","relative","files","filter","has","isCompositionFile","filePath","includePatterns","excludePatterns","splitPatterns","matchPatterns","getCompositions","entry","get","CompositionsAspect","id","compositions","Composition","fromArray","readCompositions","maybeFiles","byComponent","computeCompositions","flat","getCompositionFilePattern","getComponentDevPatterns","_this$workspace","env","calculateEnv","skipWarnings","inInstallContext","componentEnvCompositionsDevPatterns","getCompositionsDevPatterns","componentPatterns","concat","name","pattern","getDevPatternToRegister","bind","onComponentLoad","loadOpts","loadCompositions","undefined","composition","toObject","pathArray","path","split","length","modulePath","join","componentDir","exports","parseModule","contents","toString","exportModel","_exportModel$staticPr","displayName","staticProperties","identifier","provider","graphql","scope","config","compositionPreviewFilePattern","registerDevPattern","register","compositionsSchema","registerDefinition","CompositionPreviewDefinition","registerOnComponentLoad","registerOnCompAspectReCalc","MainRuntime","PreviewAspect","GraphqlAspect","WorkspaceAspect","SchemaAspect","DevFilesAspect","EnvsAspect","ScopeAspect","addRuntime"],"sources":["compositions.main.runtime.ts"],"sourcesContent":["import { MainRuntime } from '@teambit/cli';\nimport { AspectData, Component, ComponentMap, IComponent } from '@teambit/component';\nimport ScopeAspect, { ScopeMain } from '@teambit/scope';\nimport { DevFilesAspect, DevFilesMain } from '@teambit/dev-files';\nimport EnvsAspect, { EnvsMain } from '@teambit/envs';\nimport { GraphqlAspect, GraphqlMain } from '@teambit/graphql';\nimport { ComponentLoadOptions } from '@teambit/legacy/dist/consumer/component/component-loader';\nimport { AbstractVinyl } from '@teambit/legacy/dist/consumer/component/sources';\nimport { PreviewAspect, PreviewMain } from '@teambit/preview';\nimport { SchemaAspect, SchemaMain } from '@teambit/schema';\nimport { matchPatterns, splitPatterns } from '@teambit/toolbox.path.match-patterns';\nimport { Workspace, WorkspaceAspect } from '@teambit/workspace';\nimport { join } from 'path';\nimport { Composition } from './composition';\nimport { CompositionsAspect } from './compositions.aspect';\nimport { compositionsSchema } from './compositions.graphql';\nimport { CompositionPreviewDefinition } from './compositions.preview-definition';\n\nexport type CompositionsConfig = {\n  /**\n   * glob pattern to detect composition files. This includes all related files, like styles and jsons.\n   * @example ['/*.composition?(s).*']\n   */\n  compositionFilePattern: string[];\n  /**\n   * glob pattern to select Preview files. this will only include files matched by compositionFilePattern.\n   * @example ['*.{t,j}s', '*.{t,j}sx']\n   */\n  compositionPreviewFilePattern: string[];\n};\n\n/**\n * the component documentation extension.\n */\nexport class CompositionsMain {\n  constructor(\n    /**\n     * Glob pattern to select all composition files\n     */\n    private compositionFilePattern: string[],\n\n    /**\n     * Glob pattern to select composition preview files\n     */\n    private previewFilePattern: string[],\n\n    /**\n     * envs extension.\n     */\n    private preview: PreviewMain,\n\n    /**\n     * workspace extension.\n     */\n    private workspace: Workspace,\n\n    /**\n     * schema extension.\n     */\n    private schema: SchemaMain,\n\n    private devFiles: DevFilesMain,\n\n    private envs: EnvsMain\n  ) {}\n\n  /**\n   * returns an array of doc file paths for a set of components.\n   */\n  getPreviewFiles(components: Component[]): ComponentMap<AbstractVinyl[]> {\n    return ComponentMap.as<AbstractVinyl[]>(components, (component) => {\n      // this includes non executables, like `button.compositions.module.scss` or `presets.compositions.json`\n      const compositionFiles = component.state.filesystem.byGlob(this.compositionFilePattern);\n\n      // select only relevant preview files (.tsx, etc)\n      const previewFiles = new Set(\n        component.state.filesystem.byGlob(this.previewFilePattern).map((file) => file.relative)\n      );\n      const files = compositionFiles.filter((file) => previewFiles.has(file.relative));\n\n      return files;\n    });\n  }\n\n  /**\n   * checks if a file matches the composition file pattern.\n   */\n  isCompositionFile(filePath: string): boolean {\n    const { includePatterns, excludePatterns } = splitPatterns(this.compositionFilePattern);\n    return matchPatterns(filePath, includePatterns, excludePatterns);\n  }\n\n  /**\n   * get component compositions.\n   */\n  getCompositions(component: IComponent): Composition[] {\n    const entry = component.get(CompositionsAspect.id);\n    if (!entry) return [];\n    const compositions = entry.data.compositions;\n    if (!compositions) return [];\n\n    return Composition.fromArray(compositions);\n  }\n\n  /**\n   * read composition from the component source code.\n   */\n  readCompositions(component: Component): Composition[] {\n    const maybeFiles = this.getPreviewFiles([component]).byComponent(component);\n\n    if (!maybeFiles) return [];\n    const [, files] = maybeFiles;\n    return files.map((file) => this.computeCompositions(component, file)).flat();\n  }\n\n  getCompositionFilePattern() {\n    return this.compositionFilePattern;\n  }\n\n  getComponentDevPatterns(component: Component) {\n    const env = this.envs.calculateEnv(component, { skipWarnings: !!this.workspace?.inInstallContext }).env;\n    const componentEnvCompositionsDevPatterns: string[] = env.getCompositionsDevPatterns\n      ? env.getCompositionsDevPatterns(component)\n      : [];\n    const componentPatterns = componentEnvCompositionsDevPatterns.concat(this.getCompositionFilePattern());\n    return { name: 'compositions', pattern: componentPatterns };\n  }\n\n  getDevPatternToRegister() {\n    return this.getComponentDevPatterns.bind(this);\n  }\n\n  async onComponentLoad(component: Component, loadOpts?: ComponentLoadOptions): Promise<AspectData | undefined> {\n    if (loadOpts?.loadCompositions === false) return undefined;\n    const compositions = this.readCompositions(component);\n    return {\n      compositions: compositions.map((composition) => composition.toObject()),\n    };\n  }\n\n  private computeCompositions(component: Component, file: AbstractVinyl): Composition[] {\n    // :TODO hacked for a specific file extension now until david will take care in the compiler.\n    const pathArray = file.path.split('.');\n    pathArray[pathArray.length - 1] = 'js';\n\n    const modulePath = this.workspace ? join(this.workspace.componentDir(component.id), file.relative) : file.relative;\n    const exports = this.schema.parseModule(modulePath, file.contents.toString());\n    return exports.map((exportModel) => {\n      const displayName = exportModel.staticProperties?.get('compositionName');\n\n      return new Composition(\n        exportModel.identifier,\n        file.relative,\n        typeof displayName === 'string' ? displayName : undefined\n      );\n    });\n  }\n\n  static defaultConfig: CompositionsConfig = {\n    compositionFilePattern: ['**/*.composition?(s).*'],\n    compositionPreviewFilePattern: ['**/*.{t,j}s?(x)'],\n  };\n\n  static runtime = MainRuntime;\n  static dependencies = [\n    PreviewAspect,\n    GraphqlAspect,\n    WorkspaceAspect,\n    SchemaAspect,\n    DevFilesAspect,\n    EnvsAspect,\n    ScopeAspect,\n  ];\n\n  static async provider(\n    [preview, graphql, workspace, schema, devFiles, envs, scope]: [\n      PreviewMain,\n      GraphqlMain,\n      Workspace,\n      SchemaMain,\n      DevFilesMain,\n      EnvsMain,\n      ScopeMain\n    ],\n    config: CompositionsConfig\n  ) {\n    const compositions = new CompositionsMain(\n      config.compositionFilePattern,\n      config.compositionPreviewFilePattern,\n      preview,\n      workspace,\n      schema,\n      devFiles,\n      envs\n    );\n\n    // TODO: use the docs implementation to allow component specific pattern\n    devFiles.registerDevPattern(compositions.getDevPatternToRegister());\n\n    graphql.register(compositionsSchema(compositions));\n    preview.registerDefinition(new CompositionPreviewDefinition(compositions));\n\n    if (workspace) {\n      workspace.registerOnComponentLoad(compositions.onComponentLoad.bind(compositions));\n    }\n    if (scope) {\n      scope.registerOnCompAspectReCalc(compositions.onComponentLoad.bind(compositions));\n    }\n\n    return compositions;\n  }\n}\n\nCompositionsAspect.addRuntime(CompositionsMain);\n"],"mappings":"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"}
+{"version":3,"names":["_cli","data","require","_component","_scope","_interopRequireDefault","_devFiles","_envs","_graphql","_preview","_schema","_toolboxPath","_workspace","_path","_composition","_compositions","_compositions2","_compositions3","obj","__esModule","default","_defineProperty","key","value","_toPropertyKey","Object","defineProperty","enumerable","configurable","writable","t","i","_toPrimitive","String","r","e","Symbol","toPrimitive","call","TypeError","Number","CompositionsMain","constructor","compositionFilePattern","previewFilePattern","preview","workspace","schema","devFiles","envs","getPreviewFiles","components","ComponentMap","as","component","compositionFiles","state","filesystem","byGlob","previewFiles","Set","map","file","relative","files","filter","has","isCompositionFile","filePath","includePatterns","excludePatterns","splitPatterns","matchPatterns","getCompositions","entry","get","CompositionsAspect","id","compositions","Composition","fromArray","readCompositions","maybeFiles","byComponent","computeCompositions","flat","getCompositionFilePattern","getComponentDevPatterns","env","calculateEnv","skipWarnings","inInstallContext","componentEnvCompositionsDevPatterns","getCompositionsDevPatterns","componentPatterns","concat","name","pattern","getDevPatternToRegister","bind","onComponentLoad","loadOpts","loadCompositions","undefined","composition","toObject","pathArray","path","split","length","modulePath","join","componentDir","exports","parseModule","contents","toString","exportModel","displayName","staticProperties","identifier","provider","graphql","scope","config","compositionPreviewFilePattern","registerDevPattern","register","compositionsSchema","registerDefinition","CompositionPreviewDefinition","registerOnComponentLoad","registerOnCompAspectReCalc","MainRuntime","PreviewAspect","GraphqlAspect","WorkspaceAspect","SchemaAspect","DevFilesAspect","EnvsAspect","ScopeAspect","addRuntime"],"sources":["compositions.main.runtime.ts"],"sourcesContent":["import { MainRuntime } from '@teambit/cli';\nimport { AspectData, Component, ComponentMap, IComponent } from '@teambit/component';\nimport ScopeAspect, { ScopeMain } from '@teambit/scope';\nimport { DevFilesAspect, DevFilesMain } from '@teambit/dev-files';\nimport EnvsAspect, { EnvsMain } from '@teambit/envs';\nimport { GraphqlAspect, GraphqlMain } from '@teambit/graphql';\nimport { ComponentLoadOptions } from '@teambit/legacy/dist/consumer/component/component-loader';\nimport { AbstractVinyl } from '@teambit/legacy/dist/consumer/component/sources';\nimport { PreviewAspect, PreviewMain } from '@teambit/preview';\nimport { SchemaAspect, SchemaMain } from '@teambit/schema';\nimport { matchPatterns, splitPatterns } from '@teambit/toolbox.path.match-patterns';\nimport { Workspace, WorkspaceAspect } from '@teambit/workspace';\nimport { join } from 'path';\nimport { Composition } from './composition';\nimport { CompositionsAspect } from './compositions.aspect';\nimport { compositionsSchema } from './compositions.graphql';\nimport { CompositionPreviewDefinition } from './compositions.preview-definition';\n\nexport type CompositionsConfig = {\n  /**\n   * glob pattern to detect composition files. This includes all related files, like styles and jsons.\n   * @example ['/*.composition?(s).*']\n   */\n  compositionFilePattern: string[];\n  /**\n   * glob pattern to select Preview files. this will only include files matched by compositionFilePattern.\n   * @example ['*.{t,j}s', '*.{t,j}sx']\n   */\n  compositionPreviewFilePattern: string[];\n};\n\n/**\n * the component documentation extension.\n */\nexport class CompositionsMain {\n  constructor(\n    /**\n     * Glob pattern to select all composition files\n     */\n    private compositionFilePattern: string[],\n\n    /**\n     * Glob pattern to select composition preview files\n     */\n    private previewFilePattern: string[],\n\n    /**\n     * envs extension.\n     */\n    private preview: PreviewMain,\n\n    /**\n     * workspace extension.\n     */\n    private workspace: Workspace,\n\n    /**\n     * schema extension.\n     */\n    private schema: SchemaMain,\n\n    private devFiles: DevFilesMain,\n\n    private envs: EnvsMain\n  ) {}\n\n  /**\n   * returns an array of doc file paths for a set of components.\n   */\n  getPreviewFiles(components: Component[]): ComponentMap<AbstractVinyl[]> {\n    return ComponentMap.as<AbstractVinyl[]>(components, (component) => {\n      // this includes non executables, like `button.compositions.module.scss` or `presets.compositions.json`\n      const compositionFiles = component.state.filesystem.byGlob(this.compositionFilePattern);\n\n      // select only relevant preview files (.tsx, etc)\n      const previewFiles = new Set(\n        component.state.filesystem.byGlob(this.previewFilePattern).map((file) => file.relative)\n      );\n      const files = compositionFiles.filter((file) => previewFiles.has(file.relative));\n\n      return files;\n    });\n  }\n\n  /**\n   * checks if a file matches the composition file pattern.\n   */\n  isCompositionFile(filePath: string): boolean {\n    const { includePatterns, excludePatterns } = splitPatterns(this.compositionFilePattern);\n    return matchPatterns(filePath, includePatterns, excludePatterns);\n  }\n\n  /**\n   * get component compositions.\n   */\n  getCompositions(component: IComponent): Composition[] {\n    const entry = component.get(CompositionsAspect.id);\n    if (!entry) return [];\n    const compositions = entry.data.compositions;\n    if (!compositions) return [];\n\n    return Composition.fromArray(compositions);\n  }\n\n  /**\n   * read composition from the component source code.\n   */\n  readCompositions(component: Component): Composition[] {\n    const maybeFiles = this.getPreviewFiles([component]).byComponent(component);\n\n    if (!maybeFiles) return [];\n    const [, files] = maybeFiles;\n    return files.map((file) => this.computeCompositions(component, file)).flat();\n  }\n\n  getCompositionFilePattern() {\n    return this.compositionFilePattern;\n  }\n\n  getComponentDevPatterns(component: Component) {\n    const env = this.envs.calculateEnv(component, { skipWarnings: !!this.workspace?.inInstallContext }).env;\n    const componentEnvCompositionsDevPatterns: string[] = env.getCompositionsDevPatterns\n      ? env.getCompositionsDevPatterns(component)\n      : [];\n    const componentPatterns = componentEnvCompositionsDevPatterns.concat(this.getCompositionFilePattern());\n    return { name: 'compositions', pattern: componentPatterns };\n  }\n\n  getDevPatternToRegister() {\n    return this.getComponentDevPatterns.bind(this);\n  }\n\n  async onComponentLoad(component: Component, loadOpts?: ComponentLoadOptions): Promise<AspectData | undefined> {\n    if (loadOpts?.loadCompositions === false) return undefined;\n    const compositions = this.readCompositions(component);\n    return {\n      compositions: compositions.map((composition) => composition.toObject()),\n    };\n  }\n\n  private computeCompositions(component: Component, file: AbstractVinyl): Composition[] {\n    // :TODO hacked for a specific file extension now until david will take care in the compiler.\n    const pathArray = file.path.split('.');\n    pathArray[pathArray.length - 1] = 'js';\n\n    const modulePath = this.workspace ? join(this.workspace.componentDir(component.id), file.relative) : file.relative;\n    const exports = this.schema.parseModule(modulePath, file.contents.toString());\n    return exports.map((exportModel) => {\n      const displayName = exportModel.staticProperties?.get('compositionName');\n\n      return new Composition(\n        exportModel.identifier,\n        file.relative,\n        typeof displayName === 'string' ? displayName : undefined\n      );\n    });\n  }\n\n  static defaultConfig: CompositionsConfig = {\n    compositionFilePattern: ['**/*.composition?(s).*'],\n    compositionPreviewFilePattern: ['**/*.{t,j}s?(x)'],\n  };\n\n  static runtime = MainRuntime;\n  static dependencies = [\n    PreviewAspect,\n    GraphqlAspect,\n    WorkspaceAspect,\n    SchemaAspect,\n    DevFilesAspect,\n    EnvsAspect,\n    ScopeAspect,\n  ];\n\n  static async provider(\n    [preview, graphql, workspace, schema, devFiles, envs, scope]: [\n      PreviewMain,\n      GraphqlMain,\n      Workspace,\n      SchemaMain,\n      DevFilesMain,\n      EnvsMain,\n      ScopeMain\n    ],\n    config: CompositionsConfig\n  ) {\n    const compositions = new CompositionsMain(\n      config.compositionFilePattern,\n      config.compositionPreviewFilePattern,\n      preview,\n      workspace,\n      schema,\n      devFiles,\n      envs\n    );\n\n    // TODO: use the docs implementation to allow component specific pattern\n    devFiles.registerDevPattern(compositions.getDevPatternToRegister());\n\n    graphql.register(compositionsSchema(compositions));\n    preview.registerDefinition(new CompositionPreviewDefinition(compositions));\n\n    if (workspace) {\n      workspace.registerOnComponentLoad(compositions.onComponentLoad.bind(compositions));\n    }\n    if (scope) {\n      scope.registerOnCompAspectReCalc(compositions.onComponentLoad.bind(compositions));\n    }\n\n    return compositions;\n  }\n}\n\nCompositionsAspect.addRuntime(CompositionsMain);\n"],"mappings":"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"}

package/dist/compositions.preview.runtime.js

@@ -56,7 +56,7 @@ class CompositionsPreview {
     return combined;
   }
   getMetadata(componentFullName, previewModule) {
-    const metadata = previewModule !== null && previewModule !== void 0 && previewModule.componentMapMetadata ? previewModule.componentMapMetadata[componentFullName] : undefined;
+    const metadata = previewModule?.componentMapMetadata ? previewModule.componentMapMetadata[componentFullName] : undefined;
     if (metadata) {
       return metadata;
     }
@@ -71,7 +71,7 @@ class CompositionsPreview {
     }
     if (metadata && metadata.compositions) {
       const first = (0, _lodash().default)(metadata.compositions);
-      const firstId = first === null || first === void 0 ? void 0 : first.identifier;
+      const firstId = first?.identifier;
       if (firstId && module[firstId]) {
         return module[firstId];
       }

package/dist/compositions.preview.runtime.js.map

@@ -1 +1 @@
-{"version":3,"names":["_preview","data","require","_lodash","_interopRequireDefault","_compositions","obj","__esModule","default","_defineProperty","key","value","_toPropertyKey","Object","defineProperty","enumerable","configurable","writable","t","i","_toPrimitive","String","r","e","Symbol","toPrimitive","call","TypeError","Number","CompositionsPreview","constructor","preview","render","componentId","envId","modules","otherPreviewDefs","context","componentMap","fullName","compositions","selectPreviewModel","metadata","getMetadata","active","getActiveComposition","mainModule","modulesMap","defaultExports","componentFullName","previewModule","files","combined","assign","componentMapMetadata","undefined","module","firstQueryParam","window","location","hash","split","query","getQuery","compositionId","getParam","first","head","firstId","identifier","values","provider","compPreview","registerPreview","name","bind","exports","PreviewRuntime","PreviewAspect","CompositionsAspect","addRuntime"],"sources":["compositions.preview.runtime.ts"],"sourcesContent":["import { ComponentID } from '@teambit/component-id';\nimport {\n  PreviewAspect,\n  PreviewPreview,\n  RenderingContext,\n  PreviewRuntime,\n  PreviewModule,\n  ModuleFile,\n} from '@teambit/preview';\nimport head from 'lodash.head';\nimport { CompositionBrowserMetadataObject } from './composition';\n\nimport { CompositionsAspect } from './compositions.aspect';\n\nexport class CompositionsPreview {\n  constructor(\n    /**\n     * preview extension.\n     */\n    private preview: PreviewPreview\n  ) {}\n\n  render(componentId: ComponentID, envId: string, modules: PreviewModule, otherPreviewDefs, context: RenderingContext) {\n    if (!modules.componentMap[componentId.fullName]) return;\n\n    const compositions = this.selectPreviewModel(componentId.fullName, modules);\n    const metadata = this.getMetadata(componentId.fullName, modules);\n    const active = this.getActiveComposition(compositions, metadata);\n\n    const mainModule = modules.modulesMap[envId] || modules.modulesMap.default;\n    const defaultExports = mainModule.default;\n\n    defaultExports(active, context);\n  }\n\n  /** gets relevant information for this preview to render */\n  selectPreviewModel(componentFullName: string, previewModule: PreviewModule) {\n    const files = previewModule.componentMap[componentFullName] || [];\n\n    // allow compositions to come from many files. It is assumed they will have unique named\n    const combined = Object.assign({}, ...files);\n    return combined;\n  }\n\n  getMetadata(componentFullName: string, previewModule: PreviewModule): CompositionBrowserMetadataObject | undefined {\n    const metadata = previewModule?.componentMapMetadata\n      ? previewModule.componentMapMetadata[componentFullName]\n      : undefined;\n    if (metadata) {\n      return metadata as CompositionBrowserMetadataObject;\n    }\n    return undefined;\n  }\n\n  private getActiveComposition(module: ModuleFile, metadata?: CompositionBrowserMetadataObject) {\n    const firstQueryParam = window.location.hash.split('&')[1];\n    const query = this.preview.getQuery();\n    const compositionId = this.preview.getParam(query, 'name') || firstQueryParam;\n\n    if (compositionId && module[compositionId]) {\n      return module[compositionId];\n    }\n\n    if (metadata && metadata.compositions) {\n      const first = head(metadata.compositions);\n      const firstId = first?.identifier;\n      if (firstId && module[firstId]) {\n        return module[firstId];\n      }\n    }\n\n    const first = head(Object.values(module));\n    return first;\n  }\n\n  static runtime = PreviewRuntime;\n\n  static dependencies = [PreviewAspect];\n\n  static async provider([preview]: [PreviewPreview]) {\n    const compPreview = new CompositionsPreview(preview);\n    preview.registerPreview({\n      name: 'compositions',\n      render: compPreview.render.bind(compPreview),\n      selectPreviewModel: compPreview.selectPreviewModel.bind(compPreview),\n      default: true,\n    });\n\n    return compPreview;\n  }\n}\n\nCompositionsAspect.addRuntime(CompositionsPreview);\n"],"mappings":"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"}
+{"version":3,"names":["_preview","data","require","_lodash","_interopRequireDefault","_compositions","obj","__esModule","default","_defineProperty","key","value","_toPropertyKey","Object","defineProperty","enumerable","configurable","writable","t","i","_toPrimitive","String","r","e","Symbol","toPrimitive","call","TypeError","Number","CompositionsPreview","constructor","preview","render","componentId","envId","modules","otherPreviewDefs","context","componentMap","fullName","compositions","selectPreviewModel","metadata","getMetadata","active","getActiveComposition","mainModule","modulesMap","defaultExports","componentFullName","previewModule","files","combined","assign","componentMapMetadata","undefined","module","firstQueryParam","window","location","hash","split","query","getQuery","compositionId","getParam","first","head","firstId","identifier","values","provider","compPreview","registerPreview","name","bind","exports","PreviewRuntime","PreviewAspect","CompositionsAspect","addRuntime"],"sources":["compositions.preview.runtime.ts"],"sourcesContent":["import { ComponentID } from '@teambit/component-id';\nimport {\n  PreviewAspect,\n  PreviewPreview,\n  RenderingContext,\n  PreviewRuntime,\n  PreviewModule,\n  ModuleFile,\n} from '@teambit/preview';\nimport head from 'lodash.head';\nimport { CompositionBrowserMetadataObject } from './composition';\n\nimport { CompositionsAspect } from './compositions.aspect';\n\nexport class CompositionsPreview {\n  constructor(\n    /**\n     * preview extension.\n     */\n    private preview: PreviewPreview\n  ) {}\n\n  render(componentId: ComponentID, envId: string, modules: PreviewModule, otherPreviewDefs, context: RenderingContext) {\n    if (!modules.componentMap[componentId.fullName]) return;\n\n    const compositions = this.selectPreviewModel(componentId.fullName, modules);\n    const metadata = this.getMetadata(componentId.fullName, modules);\n    const active = this.getActiveComposition(compositions, metadata);\n\n    const mainModule = modules.modulesMap[envId] || modules.modulesMap.default;\n    const defaultExports = mainModule.default;\n\n    defaultExports(active, context);\n  }\n\n  /** gets relevant information for this preview to render */\n  selectPreviewModel(componentFullName: string, previewModule: PreviewModule) {\n    const files = previewModule.componentMap[componentFullName] || [];\n\n    // allow compositions to come from many files. It is assumed they will have unique named\n    const combined = Object.assign({}, ...files);\n    return combined;\n  }\n\n  getMetadata(componentFullName: string, previewModule: PreviewModule): CompositionBrowserMetadataObject | undefined {\n    const metadata = previewModule?.componentMapMetadata\n      ? previewModule.componentMapMetadata[componentFullName]\n      : undefined;\n    if (metadata) {\n      return metadata as CompositionBrowserMetadataObject;\n    }\n    return undefined;\n  }\n\n  private getActiveComposition(module: ModuleFile, metadata?: CompositionBrowserMetadataObject) {\n    const firstQueryParam = window.location.hash.split('&')[1];\n    const query = this.preview.getQuery();\n    const compositionId = this.preview.getParam(query, 'name') || firstQueryParam;\n\n    if (compositionId && module[compositionId]) {\n      return module[compositionId];\n    }\n\n    if (metadata && metadata.compositions) {\n      const first = head(metadata.compositions);\n      const firstId = first?.identifier;\n      if (firstId && module[firstId]) {\n        return module[firstId];\n      }\n    }\n\n    const first = head(Object.values(module));\n    return first;\n  }\n\n  static runtime = PreviewRuntime;\n\n  static dependencies = [PreviewAspect];\n\n  static async provider([preview]: [PreviewPreview]) {\n    const compPreview = new CompositionsPreview(preview);\n    preview.registerPreview({\n      name: 'compositions',\n      render: compPreview.render.bind(compPreview),\n      selectPreviewModel: compPreview.selectPreviewModel.bind(compPreview),\n      default: true,\n    });\n\n    return compPreview;\n  }\n}\n\nCompositionsAspect.addRuntime(CompositionsPreview);\n"],"mappings":"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"}

package/dist/compositions.ui.runtime.d.ts

@@ -1,11 +1,11 @@
 import type { ReactNode } from 'react';
-import React, { ComponentType } from 'react';
+import { ComponentType } from 'react';
 import { SlotRegistry } from '@teambit/harmony';
 import { ComponentUI } from '@teambit/component';
 import { ComponentCompareUI } from '@teambit/component-compare';
 import { MenuBarWidget } from './compositions';
-export declare type CompositionsMenuSlot = SlotRegistry<MenuBarWidget[]>;
-export declare type EmptyStateSlot = SlotRegistry<ComponentType>;
+export type CompositionsMenuSlot = SlotRegistry<MenuBarWidget[]>;
+export type EmptyStateSlot = SlotRegistry<ComponentType>;
 export declare class CompositionsUI {
     private menuBarWidgetSlot;
     private emptyStateSlot;
@@ -15,7 +15,7 @@ export declare class CompositionsUI {
      */
     registerEmptyState(emptyStateComponent: ComponentType): this;
     registerMenuWidget(...widget: MenuBarWidget[]): void;
-    getCompositionsCompare: () => React.JSX.Element;
+    getCompositionsCompare: () => JSX.Element;
     static dependencies: import("@teambit/harmony").Aspect[];
     static runtime: import("@teambit/harmony").RuntimeDefinition;
     static slots: ((registerFn: () => string) => SlotRegistry<ReactNode>)[];

package/dist/{preview-1703590665075.js → preview-1703698405864.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.compositions_compositions@1.0.107/dist/compositions.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.compositions_compositions@1.0.107/dist/compositions.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.compositions_compositions@1.0.109/dist/compositions.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.compositions_compositions@1.0.109/dist/compositions.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/dist/ui/composition-preview.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
+/// <reference types="react" />
 import { ComponentPreviewProps } from '@teambit/preview.ui.component-preview';
 import { Composition } from '../composition';
-export declare type ComponentCompositionProps = {
+export type ComponentCompositionProps = {
     /**
      * composition to use for component rendering.
      */
     composition?: Composition;
 } & ComponentPreviewProps;
-export declare function ComponentComposition({ composition, component, queryParams, ...rest }: ComponentCompositionProps): React.JSX.Element;
+export declare function ComponentComposition({ composition, component, queryParams, ...rest }: ComponentCompositionProps): JSX.Element;

package/dist/ui/composition-preview.js

@@ -25,17 +25,16 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function ComponentComposition(_ref) {
-  var _component$preview, _component$preview2;
   let {
       composition,
       component,
       queryParams = []
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
-  const includesEnvTemplate = (_component$preview = component.preview) === null || _component$preview === void 0 ? void 0 : _component$preview.includesEnvTemplate;
-  const isScaling = (_component$preview2 = component.preview) === null || _component$preview2 === void 0 ? void 0 : _component$preview2.isScaling;
+  const includesEnvTemplate = component.preview?.includesEnvTemplate;
+  const isScaling = component.preview?.isScaling;
   const shouldAddNameParam = isScaling && includesEnvTemplate === false;
-  const compositionParams = (0, _react().useMemo)(() => (composition ? [shouldAddNameParam ? `name=${composition.identifier}` : composition.identifier] : []).concat(queryParams), [composition === null || composition === void 0 ? void 0 : composition.identifier, queryParams]);
+  const compositionParams = (0, _react().useMemo)(() => (composition ? [shouldAddNameParam ? `name=${composition.identifier}` : composition.identifier] : []).concat(queryParams), [composition?.identifier, queryParams]);
   return /*#__PURE__*/_react().default.createElement(_previewUi().ComponentPreview, _extends({}, rest, {
     component: component,
     style: {

package/dist/ui/composition-preview.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","data","_interopRequireWildcard","require","_previewUi","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","ComponentComposition","_ref","_component$preview","_component$preview2","composition","component","queryParams","rest","includesEnvTemplate","preview","isScaling","shouldAddNameParam","compositionParams","useMemo","identifier","concat","createElement","ComponentPreview","style","width","height","previewName"],"sources":["composition-preview.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { ComponentPreview, ComponentPreviewProps } from '@teambit/preview.ui.component-preview';\n\nimport { Composition } from '../composition';\n\nexport type ComponentCompositionProps = {\n  /**\n   * composition to use for component rendering.\n   */\n  composition?: Composition;\n} & ComponentPreviewProps;\n\nexport function ComponentComposition({ composition, component, queryParams = [], ...rest }: ComponentCompositionProps) {\n  const includesEnvTemplate = component.preview?.includesEnvTemplate;\n  const isScaling = component.preview?.isScaling;\n  const shouldAddNameParam = isScaling && includesEnvTemplate === false;\n\n  const compositionParams = useMemo(\n    () =>\n      (composition ? [shouldAddNameParam ? `name=${composition.identifier}` : composition.identifier] : []).concat(\n        queryParams\n      ),\n    [composition?.identifier, queryParams]\n  );\n\n  return (\n    <ComponentPreview\n      {...rest}\n      component={component}\n      style={{ width: '100%', height: '100%' }}\n      previewName=\"compositions\"\n      queryParams={compositionParams}\n    />\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["_react","data","_interopRequireWildcard","require","_previewUi","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","ComponentComposition","_ref","composition","component","queryParams","rest","includesEnvTemplate","preview","isScaling","shouldAddNameParam","compositionParams","useMemo","identifier","concat","createElement","ComponentPreview","style","width","height","previewName"],"sources":["composition-preview.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { ComponentPreview, ComponentPreviewProps } from '@teambit/preview.ui.component-preview';\n\nimport { Composition } from '../composition';\n\nexport type ComponentCompositionProps = {\n  /**\n   * composition to use for component rendering.\n   */\n  composition?: Composition;\n} & ComponentPreviewProps;\n\nexport function ComponentComposition({ composition, component, queryParams = [], ...rest }: ComponentCompositionProps) {\n  const includesEnvTemplate = component.preview?.includesEnvTemplate;\n  const isScaling = component.preview?.isScaling;\n  const shouldAddNameParam = isScaling && includesEnvTemplate === false;\n\n  const compositionParams = useMemo(\n    () =>\n      (composition ? [shouldAddNameParam ? `name=${composition.identifier}` : composition.identifier] : []).concat(\n        queryParams\n      ),\n    [composition?.identifier, queryParams]\n  );\n\n  return (\n    <ComponentPreview\n      {...rest}\n      component={component}\n      style={{ width: '100%', height: '100%' }}\n      previewName=\"compositions\"\n      queryParams={compositionParams}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/ui/compositions-panel/compositions-panel.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Composition } from '../../composition';
-export declare type CompositionsPanelProps = {
+export type CompositionsPanelProps = {
     /**
      * list of compositions
      */
@@ -23,4 +23,4 @@ export declare type CompositionsPanelProps = {
     isScaling?: boolean;
     includesEnvTemplate?: boolean;
 } & React.HTMLAttributes<HTMLUListElement>;
-export declare function CompositionsPanel({ url, compositions, isScaling, onSelectComposition: onSelect, active, includesEnvTemplate, className, ...rest }: CompositionsPanelProps): React.JSX.Element;
+export declare function CompositionsPanel({ url, compositions, isScaling, onSelectComposition: onSelect, active, includesEnvTemplate, className, ...rest }: CompositionsPanelProps): JSX.Element;

package/dist/ui/compositions-panel/compositions-panel.js

@@ -72,9 +72,9 @@ function CompositionsPanel(_ref) {
   const navigate = (0, _baseReactNavigation().useNavigate)();
   const onCompositionCodeClicked = (0, _react().useCallback)(composition => e => {
     e.preventDefault();
-    const basePath = location === null || location === void 0 ? void 0 : location.pathname.split('/~compositions')[0];
+    const basePath = location?.pathname.split('/~compositions')[0];
     navigate(`${basePath}/~code/${composition.filepath}#search=${composition.identifier}`);
-  }, [location === null || location === void 0 ? void 0 : location.pathname]);
+  }, [location?.pathname]);
   return /*#__PURE__*/_react().default.createElement("ul", _extends({}, rest, {
     className: (0, _classnames().default)(className)
   }), compositions.map(composition => {

package/dist/ui/compositions-panel/compositions-panel.js.map

@@ -1 +1 @@
-{"version":3,"names":["_evangelistElements","data","require","_classnames","_interopRequireDefault","_react","_interopRequireWildcard","_uiFoundationUi","_baseReactNavigation","_compositionsPanelModule","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","CompositionsPanel","_ref","url","compositions","isScaling","onSelectComposition","onSelect","active","includesEnvTemplate","className","rest","shouldAddNameParam","handleSelect","useCallback","selected","location","useLocation","navigate","useNavigate","onCompositionCodeClicked","composition","preventDefault","basePath","pathname","split","filepath","identifier","createElement","classNames","map","href","styles","linkWrapper","panelLink","onClick","box","name","displayName","right","MenuWidgetIcon","codeLink","icon","tooltipContent","rel","Icon","of"],"sources":["compositions-panel.tsx"],"sourcesContent":["import { Icon } from '@teambit/evangelist.elements.icon';\nimport classNames from 'classnames';\nimport React, { useCallback } from 'react';\nimport { MenuWidgetIcon } from '@teambit/ui-foundation.ui.menu-widget-icon';\nimport { useNavigate, useLocation } from '@teambit/base-react.navigation.link';\nimport { Composition } from '../../composition';\nimport styles from './compositions-panel.module.scss';\n\nexport type CompositionsPanelProps = {\n  /**\n   * list of compositions\n   */\n  compositions: Composition[];\n  /**\n   * select composition to display\n   */\n  onSelectComposition: (composition: Composition) => void;\n  /**\n   * the currently active composition\n   */\n  active?: Composition;\n  /**\n   * the url to the base composition. doesntc contain the current composition params\n   */\n  url: string;\n  /**\n   * checks if a component is using the new preview api. if false, doesnt scale to support new preview\n   */\n  isScaling?: boolean;\n\n  includesEnvTemplate?: boolean;\n} & React.HTMLAttributes<HTMLUListElement>;\n\nexport function CompositionsPanel({\n  url,\n  compositions,\n  isScaling,\n  onSelectComposition: onSelect,\n  active,\n  includesEnvTemplate,\n  className,\n  ...rest\n}: CompositionsPanelProps) {\n  const shouldAddNameParam = isScaling && includesEnvTemplate === false;\n\n  const handleSelect = useCallback(\n    (selected: Composition) => {\n      onSelect && onSelect(selected);\n    },\n    [onSelect]\n  );\n\n  const location = useLocation();\n  const navigate = useNavigate();\n\n  const onCompositionCodeClicked = useCallback(\n    (composition: Composition) => (e: React.MouseEvent<HTMLDivElement>) => {\n      e.preventDefault();\n      const basePath = location?.pathname.split('/~compositions')[0];\n      navigate(`${basePath}/~code/${composition.filepath}#search=${composition.identifier}`);\n    },\n    [location?.pathname]\n  );\n\n  return (\n    <ul {...rest} className={classNames(className)}>\n      {compositions.map((composition) => {\n        const href = shouldAddNameParam ? `${url}&name=${composition.identifier}` : `${url}&${composition.identifier}`;\n        return (\n          <li\n            key={composition.identifier}\n            className={classNames(styles.linkWrapper, composition === active && styles.active)}\n          >\n            <a className={styles.panelLink} onClick={() => handleSelect(composition)}>\n              <span className={styles.box}></span>\n              <span className={styles.name}>{composition.displayName}</span>\n            </a>\n            <div className={styles.right}>\n              <MenuWidgetIcon\n                className={styles.codeLink}\n                icon=\"Code\"\n                tooltipContent=\"Code\"\n                onClick={onCompositionCodeClicked(composition)}\n              />\n              <a className={styles.panelLink} target=\"_blank\" rel=\"noopener noreferrer\" href={href}>\n                <Icon className={styles.icon} of=\"open-tab\" />\n              </a>\n            </div>\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["_evangelistElements","data","require","_classnames","_interopRequireDefault","_react","_interopRequireWildcard","_uiFoundationUi","_baseReactNavigation","_compositionsPanelModule","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","CompositionsPanel","_ref","url","compositions","isScaling","onSelectComposition","onSelect","active","includesEnvTemplate","className","rest","shouldAddNameParam","handleSelect","useCallback","selected","location","useLocation","navigate","useNavigate","onCompositionCodeClicked","composition","preventDefault","basePath","pathname","split","filepath","identifier","createElement","classNames","map","href","styles","linkWrapper","panelLink","onClick","box","name","displayName","right","MenuWidgetIcon","codeLink","icon","tooltipContent","rel","Icon","of"],"sources":["compositions-panel.tsx"],"sourcesContent":["import { Icon } from '@teambit/evangelist.elements.icon';\nimport classNames from 'classnames';\nimport React, { useCallback } from 'react';\nimport { MenuWidgetIcon } from '@teambit/ui-foundation.ui.menu-widget-icon';\nimport { useNavigate, useLocation } from '@teambit/base-react.navigation.link';\nimport { Composition } from '../../composition';\nimport styles from './compositions-panel.module.scss';\n\nexport type CompositionsPanelProps = {\n  /**\n   * list of compositions\n   */\n  compositions: Composition[];\n  /**\n   * select composition to display\n   */\n  onSelectComposition: (composition: Composition) => void;\n  /**\n   * the currently active composition\n   */\n  active?: Composition;\n  /**\n   * the url to the base composition. doesntc contain the current composition params\n   */\n  url: string;\n  /**\n   * checks if a component is using the new preview api. if false, doesnt scale to support new preview\n   */\n  isScaling?: boolean;\n\n  includesEnvTemplate?: boolean;\n} & React.HTMLAttributes<HTMLUListElement>;\n\nexport function CompositionsPanel({\n  url,\n  compositions,\n  isScaling,\n  onSelectComposition: onSelect,\n  active,\n  includesEnvTemplate,\n  className,\n  ...rest\n}: CompositionsPanelProps) {\n  const shouldAddNameParam = isScaling && includesEnvTemplate === false;\n\n  const handleSelect = useCallback(\n    (selected: Composition) => {\n      onSelect && onSelect(selected);\n    },\n    [onSelect]\n  );\n\n  const location = useLocation();\n  const navigate = useNavigate();\n\n  const onCompositionCodeClicked = useCallback(\n    (composition: Composition) => (e: React.MouseEvent<HTMLDivElement>) => {\n      e.preventDefault();\n      const basePath = location?.pathname.split('/~compositions')[0];\n      navigate(`${basePath}/~code/${composition.filepath}#search=${composition.identifier}`);\n    },\n    [location?.pathname]\n  );\n\n  return (\n    <ul {...rest} className={classNames(className)}>\n      {compositions.map((composition) => {\n        const href = shouldAddNameParam ? `${url}&name=${composition.identifier}` : `${url}&${composition.identifier}`;\n        return (\n          <li\n            key={composition.identifier}\n            className={classNames(styles.linkWrapper, composition === active && styles.active)}\n          >\n            <a className={styles.panelLink} onClick={() => handleSelect(composition)}>\n              <span className={styles.box}></span>\n              <span className={styles.name}>{composition.displayName}</span>\n            </a>\n            <div className={styles.right}>\n              <MenuWidgetIcon\n                className={styles.codeLink}\n                icon=\"Code\"\n                tooltipContent=\"Code\"\n                onClick={onCompositionCodeClicked(composition)}\n              />\n              <a className={styles.panelLink} target=\"_blank\" rel=\"noopener noreferrer\" href={href}>\n                <Icon className={styles.icon} of=\"open-tab\" />\n              </a>\n            </div>\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n"],"mappings":"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"}

package/dist/ui/compositions-panel-node/compositions-panel-node.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-export declare type CompositionsPanelNodeProps = {
+export type CompositionsPanelNodeProps = {
     name: string;
     onClick: (event: React.MouseEvent<HTMLAnchorElement>) => void;
     isActive: boolean;
 } & React.HTMLAttributes<HTMLLIElement>;
-export declare function CompositionsPanelNode({ name, onClick, isActive, ...rest }: CompositionsPanelNodeProps): React.JSX.Element;
+export declare function CompositionsPanelNode({ name, onClick, isActive, ...rest }: CompositionsPanelNodeProps): JSX.Element;

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/compositions",
-  "version": "1.0.107",
+  "version": "1.0.109",
   "homepage": "https://bit.cloud/teambit/compositions/compositions",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.compositions",
     "name": "compositions",
-    "version": "1.0.107"
+    "version": "1.0.109"
   },
   "dependencies": {
     "graphql-tag": "2.12.1",
@@ -14,11 +14,8 @@
     "lodash.head": "4.0.1",
     "query-string": "7.0.0",
     "classnames": "2.2.6",
-    "core-js": "^3.0.0",
-    "@babel/runtime": "7.20.0",
     "@teambit/harmony": "0.4.6",
     "@teambit/ui-foundation.ui.constants.z-indexes": "0.0.504",
-    "@teambit/component-id": "1.2.0",
     "@teambit/base-react.navigation.link": "2.0.27",
     "@teambit/base-ui.surfaces.split-pane.hover-splitter": "1.0.0",
     "@teambit/base-ui.surfaces.split-pane.split-pane": "1.0.0",
@@ -39,40 +36,39 @@
     "@teambit/compositions.ui.composition-compare": "0.0.255",
     "@teambit/evangelist.elements.icon": "1.0.2",
     "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.502",
-    "@teambit/component": "1.0.107",
+    "@teambit/component": "1.0.109",
     "@teambit/compositions.model.composition-id": "0.0.500",
-    "@teambit/graphql": "1.0.107",
-    "@teambit/cli": "0.0.839",
-    "@teambit/dev-files": "1.0.107",
-    "@teambit/envs": "1.0.107",
-    "@teambit/preview": "1.0.107",
-    "@teambit/schema": "1.0.107",
-    "@teambit/scope": "1.0.107",
+    "@teambit/graphql": "1.0.109",
+    "@teambit/cli": "0.0.841",
+    "@teambit/dev-files": "1.0.109",
+    "@teambit/envs": "1.0.109",
+    "@teambit/preview": "1.0.109",
+    "@teambit/schema": "1.0.109",
+    "@teambit/scope": "1.0.109",
     "@teambit/toolbox.path.match-patterns": "0.0.13",
-    "@teambit/workspace": "1.0.107",
+    "@teambit/workspace": "1.0.109",
     "@teambit/docs.ui.queries.get-docs": "0.0.506",
-    "@teambit/panels": "0.0.840",
+    "@teambit/panels": "0.0.842",
     "@teambit/preview.ui.component-preview": "1.0.3",
-    "@teambit/component-compare": "1.0.107",
-    "@teambit/ui": "1.0.107"
+    "@teambit/component-compare": "1.0.109",
+    "@teambit/ui": "1.0.109"
   },
   "devDependencies": {
-    "@types/react": "^17.0.8",
     "@types/lodash": "4.14.165",
     "@types/lodash.head": "4.0.6",
     "@types/classnames": "2.2.11",
     "@types/mocha": "9.1.0",
-    "@types/node": "12.20.4",
-    "@types/react-dom": "^17.0.5",
-    "@types/jest": "^26.0.0",
-    "@types/testing-library__jest-dom": "5.9.5",
+    "@types/jest": "^29.2.2",
+    "@types/testing-library__jest-dom": "^5.9.5",
+    "@teambit/component-id": "1.2.0",
+    "@teambit/harmony.envs.core-aspect-env": "0.0.14",
     "@teambit/compositions.aspect-docs.compositions": "0.0.165"
   },
   "peerDependencies": {
-    "react-router-dom": "^6.0.0",
-    "@teambit/legacy": "1.0.624",
-    "react": "^16.8.0 || ^17.0.0",
-    "react-dom": "^16.8.0 || ^17.0.0"
+    "react": "^17.0.0 || ^18.0.0",
+    "react-router-dom": "^6.8.1",
+    "@types/react": "^18.2.12",
+    "@teambit/legacy": "1.0.624"
   },
   "license": "Apache-2.0",
   "optionalDependencies": {},
@@ -86,7 +82,7 @@
   },
   "private": false,
   "engines": {
-    "node": ">=12.22.0"
+    "node": ">=16.0.0"
   },
   "repository": {
     "type": "git",
@@ -95,12 +91,9 @@
   "keywords": [
     "bit",
     "bit-aspect",
+    "bit-core-aspect",
     "components",
     "collaboration",
-    "web",
-    "react",
-    "react-components",
-    "angular",
-    "angular-components"
+    "web"
   ]
 }

package/tsconfig.json

@@ -1,38 +1,33 @@
 {
   "compilerOptions": {
     "lib": [
-      "es2019",
-      "DOM",
-      "ES6",
-      "DOM.Iterable",
-      "ScriptHost"
+      "esnext",
+      "dom",
+      "dom.Iterable"
     ],
-    "target": "es2015",
-    "module": "CommonJS",
-    "jsx": "react",
-    "allowJs": true,
-    "composite": true,
+    "target": "es2020",
+    "module": "es2020",
+    "jsx": "react-jsx",
     "declaration": true,
     "sourceMap": true,
-    "skipLibCheck": true,
     "experimentalDecorators": true,
-    "outDir": "dist",
+    "skipLibCheck": true,
     "moduleResolution": "node",
     "esModuleInterop": true,
-    "rootDir": ".",
     "resolveJsonModule": true,
-    "emitDeclarationOnly": true,
-    "emitDecoratorMetadata": true,
-    "allowSyntheticDefaultImports": true,
-    "strictPropertyInitialization": false,
-    "strict": true,
-    "noImplicitAny": false,
-    "preserveConstEnums": true
+    "allowJs": true,
+    "outDir": "dist",
+    "emitDeclarationOnly": true
   },
   "exclude": [
+    "artifacts",
+    "public",
     "dist",
+    "node_modules",
+    "package.json",
     "esm.mjs",
-    "package.json"
+    "**/*.cjs",
+    "./dist"
   ],
   "include": [
     "**/*",

package/types/asset.d.ts

@@ -5,12 +5,12 @@ declare module '*.png' {
 declare module '*.svg' {
   import type { FunctionComponent, SVGProps } from 'react';
 
-  export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
+  export const ReactComponent: FunctionComponent<
+    SVGProps<SVGSVGElement> & { title?: string }
+  >;
   const src: string;
   export default src;
 }
-
-// @TODO Gilad
 declare module '*.jpg' {
   const value: any;
   export = value;
@@ -27,3 +27,15 @@ declare module '*.bmp' {
   const value: any;
   export = value;
 }
+declare module '*.otf' {
+  const value: any;
+  export = value;
+}
+declare module '*.woff' {
+  const value: any;
+  export = value;
+}
+declare module '*.woff2' {
+  const value: any;
+  export = value;
+}