Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@bodiless/components
Advanced tools
@bodiless/components - npm Package Compare versions
Comparing version 0.0.58 to 0.0.59
@@ -6,2 +6,3 @@ { | ||
| "List.md": "./doc/List.md", | ||
| "Chameleon.md": "./doc/Chameleon.md", | ||
| "Editable.md": "./doc/editable.md", | ||
@@ -8,0 +9,0 @@ "Iframe.md": "./doc/Iframe.md", |
@@ -6,2 +6,10 @@ # Change Log | ||
| ## [0.0.59](https://github.com/johnsonandjohnson/bodiless-js/compare/v0.0.58...v0.0.59) (2020-11-05) | ||
| **Note:** Version bump only for package @bodiless/components | ||
| ## [0.0.58](https://github.com/johnsonandjohnson/bodiless-js/compare/v0.0.57...v0.0.58) (2020-10-23) | ||
@@ -8,0 +16,0 @@ |
@@ -33,3 +33,3 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [BackendSave](backendsave.md) | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:34](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L34)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:34](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L34)* | ||
@@ -51,3 +51,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:34](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L34)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:34](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L34)* | ||
@@ -60,3 +60,3 @@ ___ | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:30](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L30)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:30](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L30)* | ||
@@ -69,3 +69,3 @@ ___ | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:28](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L28)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:28](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L28)* | ||
@@ -78,3 +78,3 @@ ## Methods | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:65](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L65)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:65](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L65)* | ||
@@ -95,3 +95,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:47](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L47)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:47](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L47)* | ||
@@ -118,3 +118,3 @@ **Type parameters:** | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:51](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L51)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:51](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L51)* | ||
@@ -121,0 +121,0 @@ **Parameters:** |
@@ -42,3 +42,3 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [BreadcrumbContext](breadcrumbcontext.md) | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:68](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L68)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:68](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L68)* | ||
@@ -60,3 +60,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:68](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L68)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:68](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L68)* | ||
@@ -69,3 +69,3 @@ ___ | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:64](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L64)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:64](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L64)* | ||
@@ -78,3 +78,3 @@ ___ | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:66](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L66)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:66](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L66)* | ||
@@ -87,3 +87,3 @@ ## Accessors | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:98](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L98)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:98](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L98)* | ||
@@ -98,3 +98,3 @@ **Returns:** *boolean* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:102](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L102)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:102](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L102)* | ||
@@ -109,3 +109,3 @@ **Returns:** *void* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:83](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L83)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:83](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L83)* | ||
@@ -126,3 +126,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:78](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L78)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:78](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L78)* | ||
@@ -143,3 +143,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:94](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L94)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:94](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L94)* | ||
@@ -146,0 +146,0 @@ **Parameters:** |
@@ -30,3 +30,3 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [BreadcrumbStore](breadcrumbstore.md) | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:47](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L47)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:47](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L47)* | ||
@@ -39,3 +39,3 @@ ## Methods | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:56](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L56)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:56](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L56)* | ||
@@ -56,3 +56,3 @@ **Parameters:** | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:49](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/asBreadcrumb.tsx#L49)* | ||
| *Defined in [packages/bodiless-components/src/asBreadcrumb.tsx:49](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/asBreadcrumb.tsx#L49)* | ||
@@ -59,0 +59,0 @@ **Parameters:** |
@@ -18,3 +18,3 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [FieldType](fieldtype.md) | ||
| *Defined in [packages/bodiless-components/src/Meta/withMetaForm.tsx:25](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/Meta/withMetaForm.tsx#L25)* | ||
| *Defined in [packages/bodiless-components/src/Meta/withMetaForm.tsx:25](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/Meta/withMetaForm.tsx#L25)* | ||
@@ -27,2 +27,2 @@ ___ | ||
| *Defined in [packages/bodiless-components/src/Meta/withMetaForm.tsx:26](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/Meta/withMetaForm.tsx#L26)* | ||
| *Defined in [packages/bodiless-components/src/Meta/withMetaForm.tsx:26](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/Meta/withMetaForm.tsx#L26)* |
@@ -21,5 +21,5 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [__global](../modules/__global.md) › [Window](__global.window.md) | ||
| *Defined in [packages/bodiless-components/src/YouTube.tsx:64](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/YouTube.tsx#L64)* | ||
| *Defined in [packages/bodiless-components/src/YouTube.tsx:64](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/YouTube.tsx#L64)* | ||
| YouTube API calls this function | ||
| when the page has finished downloading the JavaScript for the player API, |
@@ -21,2 +21,2 @@ [@bodiless/components](../README.md) › [Globals](../globals.md) › [ServerData](serverdata.md) | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:24](https://github.com/johnsonandjohnson/Bodiless-JS/blob/25f75c3/packages/bodiless-components/src/BackendSave.tsx#L24)* | ||
| *Defined in [packages/bodiless-components/src/BackendSave.tsx:24](https://github.com/johnsonandjohnson/Bodiless-JS/blob/ecebca9/packages/bodiless-components/src/BackendSave.tsx#L24)* |
| # Iframe Component | ||
| One can use this to compose and place an iframe on the page, that uses | ||
| the BodilessJS edit interface. | ||
| The Iframe Component can be used to place an iframe on a BodilessJS page. | ||
| The iframe can be configured via the context menu. By default the height | ||
| and the source URL for the iframe are editable. | ||
| Lets compose a base BodilessJS iframe component. | ||
| ### Content Editor Details | ||
| To place an Iframe Component on a BodilessJS page: | ||
| 1. Select the Iframe Component from the Component Library. | ||
|  | ||
| 2. Click on the iframe component to toggle the configuration button for | ||
| the iframe. | ||
|  | ||
| 3. Enter the URL you wish to place in the iframe and enter the height at | ||
| which you would like to display the iframe's content. | ||
| !> Please note that the originating site for the target URL must be configured | ||
| to allow iframes. If the originating site does not allow embedding from their | ||
| site the content will not display in the iframe. | ||
| ?> If you do not enter a display height the iframe will default to 150 px | ||
|  | ||
| 4. Click the check mark or hit enter. | ||
| 5. Resize or reposition the iframe using the Flow Container controls. | ||
| --- | ||
| ## Site Builder Details | ||
| You can use this to compose and place an iframe on the page, that uses | ||
| the BodilessJS edit interface. | ||
| To compose a base BodilessJS iframe component. | ||
| ``` js | ||
@@ -15,3 +52,6 @@ import React from 'react'; | ||
| Then, we can render the iframe component passing nodeKey prop, which tells where to store the data see [Data](Architecture/Data.md), and src prop, which tells the default iframe src used when the src is not defined in Data. We may pass other html element iframe props to the component. | ||
| Next, render the iframe component, passing nodeKey prop, which tells | ||
| where to store the data (see [Data](Architecture/Data.md)); and src prop, | ||
| which tells the default iframe src used when the src is not defined in Data. | ||
| You may pass other html element iframe props to the component. | ||
@@ -22,3 +62,6 @@ ``` jsx | ||
| By default, src and height fields are editable. One can compose its own BodilessJS iframe component defining custom editable fields. For example, lets make src and width editable. In order to do it, we will import src snippet from @bodiless/components, compose width snippet ourself and compose our custom `EditableWidthIframe` component. | ||
| By default, src and height fields are editable. You can compose your own | ||
| BodilessJS iframe component defining custom editable fields. For example, | ||
| you can make src and width editable. Import src snippet from @bodiless/components, | ||
| compose width snippet and compose the custom `EditableWidthIframe` component. | ||
@@ -65,3 +108,3 @@ ``` js | ||
| Then, we can render `EditableWidthIframe` | ||
| Then, we can render `EditableWidthIframe` | ||
@@ -71,1 +114,12 @@ ``` jsx | ||
| ``` | ||
| --- | ||
| ## Architectural Details | ||
| The Iframe Component renders: | ||
| ``` | ||
| <iframe src="string" height=""></iframe> | ||
| ``` | ||
@@ -55,5 +55,5 @@ # Editable Lists | ||
| Item: flow( | ||
| asSubList, | ||
| asSubList(), | ||
| withDesign({ | ||
| Item: asSubList, | ||
| Item: asSubList(), | ||
| }), | ||
@@ -122,3 +122,3 @@ ), | ||
| withSimpleSubListDesign(2)(flow( | ||
| asSubList, | ||
| asSubList(), | ||
| withTitle, | ||
@@ -144,3 +144,3 @@ withItemMargin, | ||
| const asToggledSubList = flow( | ||
| asSubList, | ||
| asSubList(), | ||
| withDeleteNodeOnUnwrap(), | ||
@@ -257,3 +257,11 @@ ); | ||
| ``` | ||
| This is useful if your list is a piece of a larger component which you are extending | ||
| via the design API. | ||
| #### Default Data | ||
| Similarly, you can specify default data for the list as a second parameter (NOT YET IMPLEMENTED). | ||
| #### Overrides | ||
| Finally, let's turn the top-level list itself into a chameleon which can switch between | ||
@@ -271,4 +279,46 @@ bulleted and numbered: | ||
| ``` | ||
| Note - we need to add `withNode` here to ensure that the list (and it's chameleon) will | ||
| receive their own node. Without it, the list would attempt to store data at the root | ||
| node, which would conflict with other elements on the page. | ||
| ## Advanced Topics | ||
| ### Optional Parameters | ||
| Link other bodiless components, `asBodilessList` accepts 3 optional positional parameters. | ||
| #### Node Keys | ||
| You can specify a node key for the list as a first parameter, so you can write: | ||
| ```ts | ||
| const List = asBodilessList('my-list'); | ||
| <List /> | ||
| ``` | ||
| instead of | ||
| ```ts | ||
| const List = asBodilessList(); | ||
| <List nodeKey="my-list" /> | ||
| ``` | ||
| This is useful if your list is a piece of a larger component which you are extending | ||
| via the design API. | ||
| #### Default Data | ||
| Similarly, you can specify default data for the list as a second parameter (NOT YET IMPLEMENTED). | ||
| #### Overrides | ||
| Finally, you can specify a custom hook providing edit button overrides as a | ||
| third parameter. You can also provide overrides as a parameter to `asSubList`. | ||
| This allows you to customize attributes of the menu buttons for specific lists. | ||
| One common use-case is to customize the group label for the buttons at different | ||
| depths: | ||
| ```ts | ||
| const asNestedMenu = flow( | ||
| asBodilessList(undefined, undefined, () => ({ groupLabel: 'Main Menu Item' })), | ||
| withSubLists(1)(asSubList(() => ({ groupLabel: 'Sub Menu Item' }))), | ||
| ... | ||
| ); | ||
| ``` |
| # YouTube Component | ||
| The YouTube Component can be used to place a YouTube video on a page via the BodilessJS edit interface. | ||
| The YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the | ||
| BodilessJS edit interface. The YouTube Component is responsive and features | ||
| a 16:9 ratio by default. | ||
| ``` js | ||
| ## Content Editor Details | ||
| To add a YouTube Component to your site: | ||
| 1. In Edit Mode, select the YouTube Component from the Component Library. | ||
|  | ||
| 2. Click on the YouTube Component to show the Configure button in the context menu. | ||
|  | ||
| 3. Enter the target YouTube URL and click the checkmark or hit enter. | ||
| ?> Please note the following accepted URL formats: | ||
| * **Share** (e.g. https://youtu.be/Rqla3gsl1Ik) | ||
| * **Watch** (e.g. https://www.youtube.com/watch?v=Rqla3gsl1Ik) | ||
| * **Embed** (e.g. https://www.youtube.com/embed/Rqla3gsl1Ik) | ||
| 4. Resize or reposition the YouTube component using the Flow Container controls. | ||
| --- | ||
| ## Site Builder Details | ||
| The YouTube Component can be used to place a YouTube video on a page via the | ||
| BodilessJS edit interface. | ||
| ?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work. | ||
| ``` js | ||
| import { YouTube } from '@bodiless/components'; | ||
@@ -11,5 +44,6 @@ | ||
| You can also use the HOC version of this which can then be applied to other components. But | ||
| the underlining component must accept the same props as an `iframe` tag. Simply pass | ||
| the node key to the asBodilessYouTube function and then use the returned HOC | ||
| You can also use the HOC version of this which can then be applied to | ||
| other components. But the underlining component must accept the same props | ||
| as an `iframe` tag. Simply pass the node key to the asBodilessYouTube function | ||
| and then use the returned HOC | ||
@@ -25,3 +59,4 @@ ``` js | ||
| You can configure YouTube player settings leveraging withYouTubePlayerSettings HOC. For example, to configure AutoPlay for the YouTube component: | ||
| You can configure YouTube player settings leveraging withYouTubePlayerSettings | ||
| HOC. For example, to configure AutoPlay for the YouTube component: | ||
@@ -39,3 +74,3 @@ ``` js | ||
| ## Props | ||
| ### Props | ||
@@ -48,1 +83,65 @@ | name | default | description | | ||
| In addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details. | ||
| ### `playerSettings` Parameters | ||
| The YouTube Component utilizes an API that allows you to change the following | ||
| properties/parameters. You can use defaultPlayerSettings to set parameters that | ||
| are commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). | ||
| | Parameters | Suggested Default | | ||
| | -------- | -------- | | ||
| | autoplay | 0 | | ||
| | cc_lang_pref | no default | | ||
| | cc_load_policy | 0 | | ||
| | controls | 1 | | ||
| | loop | 0 | | ||
| | enablejsapi | 1 | | ||
| | modestbranding | 1 | | ||
| | origin | canonical URL | | ||
| | rel | 0 | | ||
| | mute | | | ||
| | version | | | ||
| | playlist | | | ||
| e.g.: Responsive YouTube with 16:9 ratio with custom language preferences: | ||
| ``` | ||
| const withCustomLangPref = flowRight( | ||
| withYouTubePlayerSettings({ | ||
| ...defaultPlayerSettings, | ||
| cc_lang_pref: 'de', | ||
| cc_load_policy: 1, | ||
| }), | ||
| addProps({ | ||
| src: 'https://www.youtube.com/embed/9No-FiEInLA', | ||
| }), | ||
| ); | ||
| const YouTubeWithCustomLangPref = withDesign({ | ||
| Item: withCustomLangPref, | ||
| })(DefaultReponsive16By9YouTube); | ||
| ``` | ||
| ### Usage | ||
| ``` | ||
| <YouTubeWithCustomLangPref nodeKey="withLangPref" /> | ||
| ``` | ||
| --- | ||
| ## Architectural Details | ||
| The YouTube Component renders the following code: | ||
| ``` | ||
| <iframe id="player" type="text/html" | ||
| src="" | ||
| frameborder="0"> | ||
| </iframe> | ||
| ``` | ||
| ?> There are optional parameters on the src that are configurable. |
@@ -15,4 +15,3 @@ /** | ||
| import React, { ComponentType } from 'react'; | ||
| import { MenuOptionsDefinition, UseBodilessOverrides } from '@bodiless/core'; | ||
| import type { WithNodeKeyProps } from '@bodiless/core'; | ||
| import type { WithNodeKeyProps, UseBodilessOverrides } from '@bodiless/core'; | ||
| import { ChameleonData } from './types'; | ||
@@ -35,5 +34,5 @@ /** | ||
| */ | ||
| declare const asBodilessChameleon: (nodeKeys: WithNodeKeyProps, defaultData?: ChameleonData | undefined, useOverrides?: UseBodilessOverrides<any, any> | undefined, contextProps?: Partial<MenuOptionsDefinition<import("./types").ChameleonProps>> | undefined) => (...args: any[]) => any; | ||
| declare const asBodilessChameleon: (nodeKeys: WithNodeKeyProps, defaultData?: ChameleonData | undefined, useOverrides?: UseBodilessOverrides<any, any> | undefined) => (...args: any[]) => any; | ||
| export default asBodilessChameleon; | ||
| export { withDeleteNodeOnUnwrap }; | ||
| //# sourceMappingURL=asBodilessChameleon.d.ts.map |
@@ -80,4 +80,4 @@ "use strict"; | ||
| */ | ||
| var asBodilessChameleon = function (nodeKeys, defaultData, useOverrides, contextProps) { return lodash_1.flowRight(withChameleonContext_1.default(nodeKeys, defaultData), core_1.ifEditable(withChameleonButton_1.default(useOverrides, contextProps)), applyChameleon_1.default); }; | ||
| var asBodilessChameleon = function (nodeKeys, defaultData, useOverrides) { return lodash_1.flowRight(withChameleonContext_1.default(nodeKeys, defaultData), core_1.ifEditable(withChameleonButton_1.default(useOverrides)), applyChameleon_1.default); }; | ||
| exports.default = asBodilessChameleon; | ||
| //# sourceMappingURL=asBodilessChameleon.js.map |
@@ -15,4 +15,4 @@ /** | ||
| import React, { ComponentType } from 'react'; | ||
| import { MenuOptionsDefinition, EditButtonProps, UseBodilessOverrides } from '@bodiless/core'; | ||
| import { ChameleonButtonProps, ChameleonData } from './types'; | ||
| import { EditButtonProps, UseBodilessOverrides } from '@bodiless/core'; | ||
| import type { ChameleonButtonProps, ChameleonData } from './types'; | ||
| export declare const withUnwrap: <P extends object>(Component: React.ComponentType<P>) => (props: P & EditButtonProps<ChameleonData> & import("@bodiless/fclasses").DesignableComponentsProps<import("@bodiless/fclasses").DesignableComponents>) => JSX.Element; | ||
@@ -31,4 +31,4 @@ /** | ||
| */ | ||
| declare const withChameleonButton: <P extends object, D extends object>(useOverrides?: UseBodilessOverrides<P, D> | undefined, contextProps?: Partial<MenuOptionsDefinition<P>> | undefined) => (...args: any[]) => any; | ||
| declare const withChameleonButton: <P extends object, D extends object>(useOverrides?: UseBodilessOverrides<P, D> | undefined) => (...args: any[]) => any; | ||
| export default withChameleonButton; | ||
| //# sourceMappingURL=withChameleonButton.d.ts.map |
@@ -26,2 +26,13 @@ "use strict"; | ||
| }; | ||
| var __rest = (this && this.__rest) || function (s, e) { | ||
| var t = {}; | ||
| for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) | ||
| t[p] = s[p]; | ||
| if (s != null && typeof Object.getOwnPropertySymbols === "function") | ||
| for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { | ||
| if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) | ||
| t[p[i]] = s[p[i]]; | ||
| } | ||
| return t; | ||
| }; | ||
| var __importDefault = (this && this.__importDefault) || function (mod) { | ||
@@ -34,2 +45,3 @@ return (mod && mod.__esModule) ? mod : { "default": mod }; | ||
| var lodash_1 = require("lodash"); | ||
| var uuid_1 = require("uuid"); | ||
| var core_1 = require("@bodiless/core"); | ||
@@ -96,3 +108,3 @@ var withChameleonContext_1 = require("./withChameleonContext"); | ||
| */ | ||
| var withChameleonButton = function (useOverrides, contextProps) { | ||
| var withChameleonButton = function (useOverrides) { | ||
| var useMenuOptions = function (props) { | ||
@@ -105,9 +117,24 @@ var selectableComponents = withChameleonContext_1.useChameleonContext().selectableComponents; | ||
| : useToggleButtonMenuOption; | ||
| var baseDefinition = __assign({ name: 'chameleon-toggle', global: false, local: true }, extMenuOptions(formTitle)); | ||
| var name = "chameleon-" + uuid_1.v1(); | ||
| var baseDefinition = __assign({ name: name, group: name + "-group", global: false, local: true }, extMenuOptions(formTitle)); | ||
| // if useOverrides returns undefined, it means not to provide the button. | ||
| return typeof overrides !== 'undefined' ? [__assign(__assign({}, baseDefinition), overrides)] : []; | ||
| if (overrides === undefined) | ||
| return []; | ||
| var groupMerge = overrides.groupMerge, groupLabel = overrides.groupLabel, overrides$ = __rest(overrides, ["groupMerge", "groupLabel"]); | ||
| var menuOption = __assign(__assign({}, baseDefinition), overrides$); | ||
| // Create a group so we have control over name and merge behavior. | ||
| var menuGroup = { | ||
| name: menuOption.group, | ||
| label: groupLabel || menuOption.label, | ||
| local: menuOption.local, | ||
| global: menuOption.global, | ||
| Component: 'group', | ||
| groupMerge: groupMerge, | ||
| }; | ||
| // return [menuOption]; | ||
| return [menuOption, menuGroup]; | ||
| }; | ||
| return lodash_1.flowRight(core_1.withMenuOptions(__assign({ useMenuOptions: useMenuOptions, name: 'Chameleon' }, contextProps)), core_1.withContextActivator('onClick'), core_1.withLocalContextMenu); | ||
| return lodash_1.flowRight(core_1.withMenuOptions({ useMenuOptions: useMenuOptions, name: 'Chamelion' }), core_1.withContextActivator('onClick'), core_1.withLocalContextMenu); | ||
| }; | ||
| exports.default = withChameleonButton; | ||
| //# sourceMappingURL=withChameleonButton.js.map |
@@ -14,9 +14,31 @@ /** | ||
| */ | ||
| import { ComponentType as CT } from 'react'; | ||
| declare type GtmDefaultPageData = { | ||
| event: string; | ||
| page: object; | ||
| import React, { ComponentType as CT, PropsWithChildren } from 'react'; | ||
| import { HelmetProps } from 'react-helmet'; | ||
| import { WithNodeKeyProps } from '@bodiless/core'; | ||
| import { Options as BaseOptions } from '../Meta/Meta'; | ||
| declare type BaseProps = PropsWithChildren<HelmetProps>; | ||
| declare type Data = { | ||
| content: string; | ||
| }; | ||
| declare const withEvent: (dataLayerName: string, defaultPageData: GtmDefaultPageData, nodeKey: string, nodeCollection: string) => (HelmetComponent: CT) => (props: any) => JSX.Element; | ||
| export default withEvent; | ||
| export declare type DataLayer = { | ||
| dataLayerName: string; | ||
| dataLayerData?: any; | ||
| }; | ||
| declare type Props = BaseProps & Data & DataLayer; | ||
| declare type Options = BaseOptions & { | ||
| path: string; | ||
| }; | ||
| /** | ||
| * HOC that adds Default Datalayer to a Component | ||
| */ | ||
| declare const withDefaultDataLayer: Function; | ||
| /** | ||
| * An HOC that renders the dataLayer scrip. | ||
| * | ||
| * @param HelmetComponent | ||
| */ | ||
| declare const withDataLayerScript: (HelmetComponent: CT<BaseProps>) => (props: Props) => JSX.Element | React.ComponentClass<React.PropsWithChildren<HelmetProps>, any> | React.FunctionComponent<React.PropsWithChildren<HelmetProps>>; | ||
| declare const withDataLayerItem: (options: Options) => (nodeKey?: WithNodeKeyProps, defaultContent?: string) => (...args: any[]) => any; | ||
| export default withDataLayerItem; | ||
| export { withDataLayerScript, withDefaultDataLayer }; | ||
| //# sourceMappingURL=gtm.d.ts.map |
@@ -64,28 +64,63 @@ "use strict"; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.withDefaultDataLayer = exports.withDataLayerScript = void 0; | ||
| var react_1 = __importDefault(require("react")); | ||
| var common_tags_1 = require("common-tags"); | ||
| var core_1 = require("@bodiless/core"); | ||
| var _ = __importStar(require("lodash")); | ||
| var Meta_1 = require("../Meta/Meta"); | ||
| /** | ||
| * Generate the dataLayer script. | ||
| * | ||
| * @param {any} dataLayer - The dataLayer Object. | ||
| * @param {string} dataLayerName - The dataLayer name. | ||
| * | ||
| * Return {string} - Datalayer script. | ||
| */ | ||
| var generateDataLayer = function (dataLayer, dataLayerName) { | ||
| var result = "window." + dataLayerName + " = window." + dataLayerName + " || [];"; | ||
| if (dataLayer !== undefined) { | ||
| result += "window." + dataLayerName + ".push(" + JSON.stringify(dataLayer) + ");"; | ||
| Object.values(dataLayer).forEach(function (entry) { | ||
| result += "window." + dataLayerName + ".push(" + JSON.stringify(entry) + ");"; | ||
| }); | ||
| } | ||
| return common_tags_1.stripIndent(templateObject_1 || (templateObject_1 = __makeTemplateObject(["", ""], ["", ""])), result); | ||
| }; | ||
| var withDataLayerItem$ = function (options) { return function (HelmetComponent) { return function (props) { | ||
| var dataLayerName = props.dataLayerName, dataLayerData = props.dataLayerData, children = props.children, content = props.content, rest = __rest(props, ["dataLayerName", "dataLayerData", "children", "content"]); | ||
| var path = options.path; | ||
| var value = content !== undefined ? content : ''; | ||
| if (path) { | ||
| _.set(dataLayerData, path, value); | ||
| } | ||
| return (react_1.default.createElement(HelmetComponent, __assign({ dataLayerName: dataLayerName, dataLayerData: dataLayerData }, rest))); | ||
| }; }; }; | ||
| /** | ||
| * HOC that adds Default Datalayer to a Component | ||
| */ | ||
| var withDefaultDataLayer = function (dataLayer) { return function (HelmetComponent) { return function (props) { | ||
| var defaultData = props.dataLayerData, rest = __rest(props, ["dataLayerData"]); | ||
| if (defaultData !== undefined) { | ||
| _.set(dataLayer, 'dataLayerData', __assign(__assign({}, defaultData), dataLayer.dataLayerData)); | ||
| } | ||
| return react_1.default.createElement(HelmetComponent, __assign({}, dataLayer, rest)); | ||
| }; }; }; | ||
| exports.withDefaultDataLayer = withDefaultDataLayer; | ||
| var tagManagerEnabled = (process.env.GOOGLE_TAGMANAGER_ENABLED || '1') === '1'; | ||
| var withEvent = function (dataLayerName, defaultPageData, nodeKey, nodeCollection) { return function (HelmetComponent) { return function (props) { | ||
| if (process.env.NODE_ENV === 'production' && tagManagerEnabled) { | ||
| var children = props.children, rest = __rest(props, ["children"]); | ||
| var node = core_1.useNode(nodeCollection).node; | ||
| var data = node.child(nodeKey).data; | ||
| var merged = _.merge({}, defaultPageData, data); | ||
| return (react_1.default.createElement(HelmetComponent, __assign({}, rest), | ||
| children, | ||
| react_1.default.createElement("script", null, generateDataLayer(merged, dataLayerName)))); | ||
| /** | ||
| * An HOC that renders the dataLayer scrip. | ||
| * | ||
| * @param HelmetComponent | ||
| */ | ||
| var withDataLayerScript = function (HelmetComponent) { return function (props) { | ||
| if (!tagManagerEnabled) { | ||
| return HelmetComponent; | ||
| } | ||
| return react_1.default.createElement(react_1.default.Fragment, null); | ||
| }; }; }; | ||
| exports.default = withEvent; | ||
| var dataLayerData = props.dataLayerData, dataLayerName = props.dataLayerName, children = props.children, rest = __rest(props, ["dataLayerData", "dataLayerName", "children"]); | ||
| return (react_1.default.createElement(HelmetComponent, __assign({}, rest), | ||
| children, | ||
| react_1.default.createElement("script", null, generateDataLayer(dataLayerData, dataLayerName)))); | ||
| }; }; | ||
| exports.withDataLayerScript = withDataLayerScript; | ||
| var withDataLayerItem = Meta_1.withHeadElement(withDataLayerItem$); | ||
| exports.default = withDataLayerItem; | ||
| var templateObject_1; | ||
| //# sourceMappingURL=gtm.js.map |
@@ -48,4 +48,5 @@ "use strict"; | ||
| icon: 'settings', | ||
| label: 'Config', | ||
| name: 'Edit', | ||
| groupLabel: 'IFrame', | ||
| label: 'Settings', | ||
| name: 'iframe-settings', | ||
| global: false, | ||
@@ -52,0 +53,0 @@ local: true, |
@@ -15,2 +15,3 @@ /** | ||
| import React, { HTMLProps, ComponentType as CT } from 'react'; | ||
| import { AsBodiless } from '@bodiless/core'; | ||
| export declare type Data = { | ||
@@ -38,5 +39,6 @@ src: string; | ||
| }; | ||
| export declare const asBodilessImage: import("@bodiless/core/lib/asBodilessComponent").AsBodiless<React.HTMLProps<HTMLImageElement>, Data>; | ||
| export declare type AsBodilessImage = AsBodiless<HTMLProps<HTMLImageElement>, Data>; | ||
| export declare const asBodilessImage: AsBodilessImage; | ||
| declare const Image: React.ComponentType<React.HTMLProps<HTMLImageElement> & Partial<import("@bodiless/core").WithNodeProps>>; | ||
| export default Image; | ||
| //# sourceMappingURL=Image.d.ts.map |
@@ -143,3 +143,4 @@ "use strict"; | ||
| icon: 'image', | ||
| label: 'Image', | ||
| label: 'Select', | ||
| groupLabel: 'Image', | ||
| name: 'Image', | ||
@@ -146,0 +147,0 @@ renderForm: function (_a) { |
@@ -16,3 +16,5 @@ /** | ||
| import { asBodilessLink } from './Link'; | ||
| import type { AsBodilessLink } from './Link'; | ||
| import Image, { asBodilessImage, TImagePickerUI, withImagePlaceholder } from './Image'; | ||
| import type { AsBodilessImage } from './Image'; | ||
| import NodeViewer from './NodeViewer'; | ||
@@ -31,3 +33,3 @@ import withLinkToggle from './LinkToggle'; | ||
| import asBodilessHelmet from './Helmet/Helmet'; | ||
| import withEvent from './GTM/gtm'; | ||
| import withDataLayerItem, { withDefaultDataLayer, withDataLayerScript } from './GTM/gtm'; | ||
| import { withToggle, withToggleTo, withToggleButton } from './Toggle'; | ||
@@ -44,6 +46,7 @@ import withEditPlaceholder from './Placeholder'; | ||
| import withBodilessLinkToggle from './withBodilessLinkToggle'; | ||
| export { withBodilessLinkToggle, asBodilessLink, Image, asBodilessImage, withImagePlaceholder, TImagePickerUI, Editable, NodeViewer, withLinkToggle, List, asEditableList, asBasicSublist, withBasicSublist, withSublist, withDeleteSublistOnUnwrap, withListTitle, withToggle, withToggleTo, withToggleButton, withPlaceholder, asEditable, withMeta, withTitle, withMetaStatic, withMetaHtml, asBodilessHelmet, withEditPlaceholder, withEvent, withTagButton, TagButtonProps, asTaggableItem, withFilterByTags, useTagsAccessors, asBaseBodilessIframe, asBodilessIframe, withoutPointerEvents, withIframeFormHeader, withIframeFormHeightSnippet, withIframeFormSrcSnippet, useIframeBodilessOptions, asBaseBodilessYouTube, asBodilessYouTube, withYouTubePlayerSettings, withYouTubePlayerTransformer, withYouTubeFormSrcSnippet, withYouTubeFormHeader, useYouTubePlayerAPI, withYouTubePlayerAPI, ifYouTubePlayerAPILoaded, ifNotYouTubePlayerAPILoaded, YouTubePlayerAPIProvider, YouTube, PageDimensionsProvider, usePageDimensionsContext, withPageDimensionsContext, BreakpointsType, ifViewportIs, ifViewportIsNot, withMetaForm, withMetaSnippet, asBreadcrumb, useBreadcrumbContext, }; | ||
| export { withBodilessLinkToggle, asBodilessLink, Image, asBodilessImage, withImagePlaceholder, TImagePickerUI, Editable, NodeViewer, withLinkToggle, List, asEditableList, asBasicSublist, withBasicSublist, withSublist, withDeleteSublistOnUnwrap, withListTitle, withToggle, withToggleTo, withToggleButton, withPlaceholder, asEditable, withMeta, withTitle, withMetaStatic, withMetaHtml, asBodilessHelmet, withEditPlaceholder, withTagButton, TagButtonProps, asTaggableItem, withFilterByTags, useTagsAccessors, asBaseBodilessIframe, asBodilessIframe, withoutPointerEvents, withIframeFormHeader, withIframeFormHeightSnippet, withIframeFormSrcSnippet, useIframeBodilessOptions, asBaseBodilessYouTube, asBodilessYouTube, withYouTubePlayerSettings, withYouTubePlayerTransformer, withYouTubeFormSrcSnippet, withYouTubeFormHeader, useYouTubePlayerAPI, withYouTubePlayerAPI, ifYouTubePlayerAPILoaded, ifNotYouTubePlayerAPILoaded, YouTubePlayerAPIProvider, YouTube, PageDimensionsProvider, usePageDimensionsContext, withPageDimensionsContext, BreakpointsType, ifViewportIs, ifViewportIsNot, withMetaForm, withMetaSnippet, asBreadcrumb, useBreadcrumbContext, withDataLayerItem, withDefaultDataLayer, withDataLayerScript, }; | ||
| export * from './Chameleon/index'; | ||
| export * from './List'; | ||
| export type { MetaFormFieldType, YouTubePlayerSettings }; | ||
| export type { AsBodilessImage, AsBodilessLink, }; | ||
| //# sourceMappingURL=index.d.ts.map |
@@ -41,3 +41,3 @@ "use strict"; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.useBreadcrumbContext = exports.asBreadcrumb = exports.withMetaSnippet = exports.withMetaForm = exports.ifViewportIsNot = exports.ifViewportIs = exports.withPageDimensionsContext = exports.usePageDimensionsContext = exports.PageDimensionsProvider = exports.YouTube = exports.YouTubePlayerAPIProvider = exports.ifNotYouTubePlayerAPILoaded = exports.ifYouTubePlayerAPILoaded = exports.withYouTubePlayerAPI = exports.useYouTubePlayerAPI = exports.withYouTubeFormHeader = exports.withYouTubeFormSrcSnippet = exports.withYouTubePlayerTransformer = exports.withYouTubePlayerSettings = exports.asBodilessYouTube = exports.asBaseBodilessYouTube = exports.useIframeBodilessOptions = exports.withIframeFormSrcSnippet = exports.withIframeFormHeightSnippet = exports.withIframeFormHeader = exports.withoutPointerEvents = exports.asBodilessIframe = exports.asBaseBodilessIframe = exports.useTagsAccessors = exports.withFilterByTags = exports.asTaggableItem = exports.withTagButton = exports.withEvent = exports.withEditPlaceholder = exports.asBodilessHelmet = exports.withMetaHtml = exports.withMetaStatic = exports.withTitle = exports.withMeta = exports.asEditable = exports.withPlaceholder = exports.withToggleButton = exports.withToggleTo = exports.withToggle = exports.withListTitle = exports.withDeleteSublistOnUnwrap = exports.withSublist = exports.withBasicSublist = exports.asBasicSublist = exports.asEditableList = exports.List = exports.withLinkToggle = exports.NodeViewer = exports.Editable = exports.withImagePlaceholder = exports.asBodilessImage = exports.Image = exports.asBodilessLink = exports.withBodilessLinkToggle = void 0; | ||
| exports.withDataLayerScript = exports.withDefaultDataLayer = exports.withDataLayerItem = exports.useBreadcrumbContext = exports.asBreadcrumb = exports.withMetaSnippet = exports.withMetaForm = exports.ifViewportIsNot = exports.ifViewportIs = exports.withPageDimensionsContext = exports.usePageDimensionsContext = exports.PageDimensionsProvider = exports.YouTube = exports.YouTubePlayerAPIProvider = exports.ifNotYouTubePlayerAPILoaded = exports.ifYouTubePlayerAPILoaded = exports.withYouTubePlayerAPI = exports.useYouTubePlayerAPI = exports.withYouTubeFormHeader = exports.withYouTubeFormSrcSnippet = exports.withYouTubePlayerTransformer = exports.withYouTubePlayerSettings = exports.asBodilessYouTube = exports.asBaseBodilessYouTube = exports.useIframeBodilessOptions = exports.withIframeFormSrcSnippet = exports.withIframeFormHeightSnippet = exports.withIframeFormHeader = exports.withoutPointerEvents = exports.asBodilessIframe = exports.asBaseBodilessIframe = exports.useTagsAccessors = exports.withFilterByTags = exports.asTaggableItem = exports.withTagButton = exports.withEditPlaceholder = exports.asBodilessHelmet = exports.withMetaHtml = exports.withMetaStatic = exports.withTitle = exports.withMeta = exports.asEditable = exports.withPlaceholder = exports.withToggleButton = exports.withToggleTo = exports.withToggle = exports.withListTitle = exports.withDeleteSublistOnUnwrap = exports.withSublist = exports.withBasicSublist = exports.asBasicSublist = exports.asEditableList = exports.List = exports.withLinkToggle = exports.NodeViewer = exports.Editable = exports.withImagePlaceholder = exports.asBodilessImage = exports.Image = exports.asBodilessLink = exports.withBodilessLinkToggle = void 0; | ||
| var Editable_1 = __importStar(require("./Editable")); | ||
@@ -82,4 +82,6 @@ exports.Editable = Editable_1.default; | ||
| exports.asBodilessHelmet = Helmet_1.default; | ||
| var gtm_1 = __importDefault(require("./GTM/gtm")); | ||
| exports.withEvent = gtm_1.default; | ||
| var gtm_1 = __importStar(require("./GTM/gtm")); | ||
| exports.withDataLayerItem = gtm_1.default; | ||
| Object.defineProperty(exports, "withDefaultDataLayer", { enumerable: true, get: function () { return gtm_1.withDefaultDataLayer; } }); | ||
| Object.defineProperty(exports, "withDataLayerScript", { enumerable: true, get: function () { return gtm_1.withDataLayerScript; } }); | ||
| var Toggle_1 = require("./Toggle"); | ||
@@ -86,0 +88,0 @@ Object.defineProperty(exports, "withToggle", { enumerable: true, get: function () { return Toggle_1.withToggle; } }); |
@@ -16,3 +16,3 @@ /** | ||
| import type { AsBodiless } from '@bodiless/core'; | ||
| declare type Data = { | ||
| export declare type LinkData = { | ||
| href: string; | ||
@@ -23,3 +23,4 @@ }; | ||
| }; | ||
| export declare const asBodilessLink: AsBodiless<Props, Data>; | ||
| export declare type AsBodilessLink = AsBodiless<Props, LinkData>; | ||
| export declare const asBodilessLink: AsBodilessLink; | ||
| declare const Link: React.ComponentType<React.HTMLProps<HTMLAnchorElement> & { | ||
@@ -26,0 +27,0 @@ unwrap?: (() => void) | undefined; |
@@ -48,3 +48,5 @@ "use strict"; | ||
| name: 'Link', | ||
| label: 'Link', | ||
| label: 'Edit', | ||
| groupLabel: 'Link', | ||
| groupMerge: 'merge', | ||
| renderForm: function (_a) { | ||
@@ -80,7 +82,7 @@ var unwrap = _a.componentProps.unwrap, closeForm = _a.closeForm; | ||
| }; | ||
| exports.asBodilessLink = function (nodeKeys) { return lodash_1.flowRight( | ||
| exports.asBodilessLink = function (nodeKeys, defaultData, useOverrides) { return lodash_1.flowRight( | ||
| // Prevent following the link in edit mode | ||
| core_1.ifEditable(core_1.withExtendHandler('onClick', function () { return function (e) { return e.preventDefault(); }; })), core_1.asBodilessComponent(options)(nodeKeys), core_1.withoutProps(['unwrap']), withHrefTransformer); }; | ||
| core_1.ifEditable(core_1.withExtendHandler('onClick', function () { return function (e) { return e.preventDefault(); }; })), core_1.asBodilessComponent(options)(nodeKeys, defaultData, useOverrides), core_1.withoutProps(['unwrap']), withHrefTransformer); }; | ||
| var Link = exports.asBodilessLink()('a'); | ||
| exports.default = Link; | ||
| //# sourceMappingURL=Link.js.map |
@@ -17,2 +17,3 @@ /** | ||
| import { HOC } from '@bodiless/fclasses'; | ||
| import { Data, UseListOverrides } from './types'; | ||
| declare type ComponentOrTag<P> = ComponentType<P> | keyof JSX.IntrinsicElements; | ||
@@ -29,7 +30,7 @@ export declare type TitledItemProps = PropsWithChildren<{ | ||
| */ | ||
| declare const asBodilessList: (nodeKeys?: string | Partial<WithNodeProps> | undefined) => <P extends object>(Component: ComponentOrTag<P>) => React.ComponentType<P & WithNodeProps>; | ||
| declare const asBodilessList: <P extends object>(nodeKeys?: string | Partial<WithNodeProps> | undefined, defaultData?: Data | undefined, useOverrides?: UseListOverrides<P> | undefined) => (Component: ComponentOrTag<P>) => React.ComponentType<P & WithNodeProps>; | ||
| /** | ||
| * HOC which can be applied to a list item to convert it to a sublist. | ||
| */ | ||
| declare const asSubList: (...args: any[]) => any; | ||
| declare const asSubList: (useOverrides?: UseListOverrides<any> | undefined) => (...args: any[]) => any; | ||
| declare const withSimpleSubListDesign: (depth: number) => (withDesign$: HOC) => HOC; | ||
@@ -36,0 +37,0 @@ export default asBodilessList; |
@@ -79,3 +79,6 @@ "use strict"; | ||
| */ | ||
| var asBodilessList = function (nodeKeys) { return function (Component) { return lodash_1.flow(fclasses_1.replaceWith(List_1.default), withListButtons_1.default, fclasses_1.withDesign({ | ||
| var asBodilessList = function (nodeKeys, | ||
| // @TODO - Handle default data | ||
| // eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
| defaultData, useOverrides) { return function (Component) { return lodash_1.flow(fclasses_1.replaceWith(List_1.default), withListButtons_1.default(useOverrides), fclasses_1.withDesign({ | ||
| Wrapper: fclasses_1.replaceWith(fclasses_1.asComponent(Component)), | ||
@@ -91,5 +94,5 @@ Item: fclasses_1.withoutProps(['addItem', 'deleteItem', 'canDelete']), | ||
| */ | ||
| var asSubList = lodash_1.flow(asBodilessList('sublist'), fclasses_1.withDesign({ | ||
| var asSubList = function (useOverrides) { return lodash_1.flow(asBodilessList('sublist', undefined, useOverrides), fclasses_1.withDesign({ | ||
| Wrapper: asSubListWrapper, | ||
| }), asTitledItem); | ||
| }), asTitledItem); }; | ||
| exports.asSubList = asSubList; | ||
@@ -96,0 +99,0 @@ var withSimpleSubListDesign = function (depth) { return function (withDesign$) { return (depth === 0 ? lodash_1.identity |
@@ -0,3 +1,4 @@ | ||
| import type { UseBodilessOverrides } from '@bodiless/core'; | ||
| import { HOC, Design } from '@bodiless/fclasses'; | ||
| declare const asChameleonSubList: (...args: any[]) => any; | ||
| declare const asChameleonSubList: (useOverrides?: UseBodilessOverrides<any, any> | undefined) => (...args: any[]) => any; | ||
| declare const withSubListDesign: (depth: number) => (withDesign$: HOC | Design<any>, hoc?: HOC) => HOC; | ||
@@ -15,5 +16,5 @@ /** | ||
| */ | ||
| declare const withSubLists: (depth: number) => (asSubList$: HOC | Design<any>) => HOC; | ||
| declare const withSubLists: (depth: number, useOverrides?: UseBodilessOverrides<any, any> | undefined) => (asSubList$: HOC | Design<any>) => HOC; | ||
| export default asChameleonSubList; | ||
| export { withSubLists, withSubListDesign }; | ||
| //# sourceMappingURL=asChameleonSubList.d.ts.map |
@@ -18,19 +18,10 @@ "use strict"; | ||
| var fclasses_1 = require("@bodiless/fclasses"); | ||
| var core_1 = require("@bodiless/core"); | ||
| var react_1 = require("react"); | ||
| var Chameleon_1 = require("../Chameleon"); | ||
| var hasChildSubList = function (context) { | ||
| var descendants = context.activeDescendants || []; | ||
| // The first child list is the one to which this toggle applies, | ||
| // so we check to see if more than one. | ||
| return descendants.filter(function (c) { return c.type === 'sublist-toggle'; }).length > 1; | ||
| }; | ||
| var useChameleonOverrides = function () { | ||
| var context = core_1.useEditContext(); | ||
| var isOn = Chameleon_1.useChameleonContext().isOn; | ||
| return { | ||
| isHidden: react_1.useCallback(function () { return hasChildSubList(context); }, []), | ||
| icon: isOn ? 'repeat' : 'playlist_add', | ||
| name: "chameleon-sublist-" + uuid_1.v1(), | ||
| label: 'Sub', | ||
| name: "chameleon-sublist-" + uuid_1.v1(), | ||
| groupMerge: 'merge-up', | ||
| formTitle: 'Sublist', | ||
@@ -41,18 +32,22 @@ }; | ||
| var isOn = Chameleon_1.useChameleonContext().isOn; | ||
| var context = core_1.useEditContext(); | ||
| return { | ||
| isHidden: react_1.useCallback(function () { return isOn || hasChildSubList(context); }, [isOn]), | ||
| isHidden: isOn, | ||
| icon: 'playlist_add', | ||
| name: "chameleon-sublist-" + uuid_1.v1(), | ||
| label: 'Sub', | ||
| name: "chameleon-sublist-" + uuid_1.v1(), | ||
| groupMerge: 'merge-up', | ||
| // label: 'Add', | ||
| // groupLabel: 'Sublist', | ||
| formTitle: 'Sublist', | ||
| }; | ||
| }; | ||
| var useOverrides = function () { | ||
| var selectableComponents = Chameleon_1.useChameleonContext().selectableComponents; | ||
| return Object.keys(selectableComponents).length > 1 | ||
| ? useChameleonOverrides() | ||
| : useToggleOverrides(); | ||
| var getUseOverrides = function (useOverrides) { | ||
| if (useOverrides === void 0) { useOverrides = function () { return ({}); }; } | ||
| return function (props) { | ||
| var selectableComponents = Chameleon_1.useChameleonContext().selectableComponents; | ||
| return Object.keys(selectableComponents).length > 1 | ||
| ? __assign(__assign({}, useChameleonOverrides()), useOverrides(props)) : __assign(__assign({}, useToggleOverrides()), useOverrides(props)); | ||
| }; | ||
| }; | ||
| var asChameleonSubList = lodash_1.flow(Chameleon_1.applyChameleon, fclasses_1.withoutProps('onSubmit'), Chameleon_1.withChameleonComponentFormControls, Chameleon_1.withChameleonButton(useOverrides), Chameleon_1.withChameleonContext('cham-sublist')); | ||
| var asChameleonSubList = function (useOverrides) { return lodash_1.flow(Chameleon_1.applyChameleon, fclasses_1.withoutProps('onSubmit'), Chameleon_1.withChameleonComponentFormControls, Chameleon_1.withChameleonButton(getUseOverrides(useOverrides)), Chameleon_1.withChameleonContext('cham-sublist')); }; | ||
| var withSubListDesign$ = function (depth) { return function (design, hoc) { | ||
@@ -86,5 +81,5 @@ if (hoc === void 0) { hoc = lodash_1.identity; } | ||
| */ | ||
| var withSubLists = function (depth) { return function (asSubList$) { return (withSubListDesign(depth)(asSubList$, asChameleonSubList)); }; }; | ||
| var withSubLists = function (depth, useOverrides) { return function (asSubList$) { return (withSubListDesign(depth)(asSubList$, asChameleonSubList(useOverrides))); }; }; | ||
| exports.withSubLists = withSubLists; | ||
| exports.default = asChameleonSubList; | ||
| //# sourceMappingURL=asChameleonSubList.js.map |
@@ -14,5 +14,5 @@ /** | ||
| */ | ||
| import { HTMLProps, ComponentType, PropsWithChildren } from 'react'; | ||
| import { DesignableComponentsProps, DesignableProps } from '@bodiless/fclasses'; | ||
| import { WithNodeProps } from '@bodiless/core'; | ||
| import type { HTMLProps, ComponentType, PropsWithChildren } from 'react'; | ||
| import type { DesignableComponentsProps, DesignableProps } from '@bodiless/fclasses'; | ||
| import type { WithNodeProps, EditButtonOptions } from '@bodiless/core'; | ||
| export declare type ItemProps = { | ||
@@ -43,2 +43,3 @@ addItem: () => void; | ||
| export declare type WithSublistToggle = (Sublist: ComponentType<FinalProps>) => ComponentType<FinalProps>; | ||
| export declare type UseListOverrides<P = any> = (props: P) => Partial<EditButtonOptions<P, Data>>; | ||
| //# sourceMappingURL=types.d.ts.map |
@@ -15,7 +15,11 @@ /** | ||
| /// <reference types="react" /> | ||
| import { PageEditContextInterface } from '@bodiless/core'; | ||
| import { UseListOverrides } from './types'; | ||
| declare const hasChildSubList: (context: PageEditContextInterface, count?: number) => boolean; | ||
| /** | ||
| * HOC which adds list edit buttons (Add and Delete Item). | ||
| */ | ||
| declare const withListButtons: (Component: string | import("react").FunctionComponent<any> | import("react").ComponentClass<any, any>) => import("react").FunctionComponent<any>; | ||
| declare const withListButtons: (useOverrides?: UseListOverrides<any> | undefined) => (Component: string | import("react").FunctionComponent<any> | import("react").ComponentClass<any, any>) => import("react").FunctionComponent<any>; | ||
| export default withListButtons; | ||
| export { hasChildSubList }; | ||
| //# sourceMappingURL=withListButtons.d.ts.map |
@@ -16,2 +16,3 @@ "use strict"; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.hasChildSubList = void 0; | ||
| var react_1 = require("react"); | ||
@@ -22,32 +23,56 @@ var core_1 = require("@bodiless/core"); | ||
| var lodash_1 = require("lodash"); | ||
| var hasChildList = function (context) { | ||
| var hasChildSubList = function (context, count) { | ||
| if (count === void 0) { count = 1; } | ||
| var descendants = context.activeDescendants || []; | ||
| // The first child list is the one to which this toggle applies, | ||
| // so we check to see if more than one. | ||
| return descendants.filter(function (c) { return c.type === 'list-item'; }).length > 1; | ||
| return descendants.filter(function (c) { return c.type === 'list-item'; }).length > count; | ||
| }; | ||
| var useMenuOptions = function (props) { | ||
| var context = core_1.useEditContext(); | ||
| var addItem = props.addItem, deleteItem = props.deleteItem, canDelete = props.canDelete; | ||
| var menuOptions = react_1.useMemo(function () { return ([ | ||
| { | ||
| name: "add-" + uuid_1.v1(), | ||
| isHidden: function () { return hasChildList(context); }, | ||
| icon: 'add', | ||
| label: 'Add', | ||
| handler: addItem, | ||
| global: false, | ||
| local: true, | ||
| }, | ||
| { | ||
| name: "remove-" + uuid_1.v1(), | ||
| icon: 'delete', | ||
| label: 'Delete', | ||
| isHidden: function () { return !canDelete() || hasChildList(context); }, | ||
| handler: deleteItem, | ||
| global: false, | ||
| local: true, | ||
| }, | ||
| ]); }, []); | ||
| return menuOptions; | ||
| exports.hasChildSubList = hasChildSubList; | ||
| var useMenuOptions = function (useOverrides) { | ||
| if (useOverrides === void 0) { useOverrides = function () { return ({}); }; } | ||
| return function (props) { | ||
| var addItem = props.addItem, deleteItem = props.deleteItem, canDelete = props.canDelete; | ||
| // Search for parent lists to set the default group label | ||
| var context = core_1.useEditContext(); | ||
| var n = 0; | ||
| for (var c = context; c; c = c.parent) { | ||
| if (c.type === 'list-item') | ||
| n += 1; | ||
| } | ||
| var sublistLabel = n > 1 ? "Sub-List " + n + " Item" : 'Sub-List Item'; | ||
| var defaultGroupLabel = n > 0 ? sublistLabel : 'List Item'; | ||
| var _a = useOverrides(props), _b = _a.groupLabel, groupLabel = _b === void 0 ? defaultGroupLabel : _b, _c = _a.global, global = _c === void 0 ? false : _c, _d = _a.local, local = _d === void 0 ? true : _d; | ||
| var id = uuid_1.v1(); | ||
| var group = "list-item-group-" + id; | ||
| var menuOptions = react_1.useMemo(function () { return ([ | ||
| { | ||
| name: "add-" + id, | ||
| icon: 'add', | ||
| label: 'Add', | ||
| handler: addItem, | ||
| global: global, | ||
| local: local, | ||
| group: group, | ||
| }, | ||
| { | ||
| name: "remove-" + id, | ||
| icon: 'delete', | ||
| label: 'Delete', | ||
| isHidden: function () { return !canDelete(); }, | ||
| handler: deleteItem, | ||
| global: global, | ||
| local: local, | ||
| group: group, | ||
| }, | ||
| { | ||
| name: group, | ||
| label: groupLabel, | ||
| global: global, | ||
| local: local, | ||
| Component: 'group', | ||
| }, | ||
| ]); }, []); | ||
| return menuOptions; | ||
| }; | ||
| }; | ||
@@ -57,6 +82,10 @@ /** | ||
| */ | ||
| var withListButtons = core_1.ifEditable(fclasses_1.withFinalDesign({ | ||
| Item: lodash_1.flow(core_1.withContextActivator('onClick'), core_1.withLocalContextMenu, core_1.withMenuOptions({ useMenuOptions: useMenuOptions, name: 'List Item', type: 'list-item' })), | ||
| })); | ||
| var withListButtons = function (useOverrides) { return core_1.ifEditable(fclasses_1.withFinalDesign({ | ||
| Item: lodash_1.flow(core_1.withContextActivator('onClick'), core_1.withLocalContextMenu, core_1.withMenuOptions({ | ||
| useMenuOptions: useMenuOptions(useOverrides), | ||
| name: 'List Item', | ||
| type: 'list-item', | ||
| })), | ||
| })); }; | ||
| exports.default = withListButtons; | ||
| //# sourceMappingURL=withListButtons.js.map |
@@ -19,3 +19,3 @@ /** | ||
| }; | ||
| declare type Options = { | ||
| export declare type Options = { | ||
| label: string; | ||
@@ -25,2 +25,3 @@ useFormElement?: () => CT<FieldProps<any, any>>; | ||
| } & BasicOptions; | ||
| export declare const withHeadElement: (renderHoc: Function) => (options: Options) => (nodeKey?: string | Partial<import("@bodiless/core").WithNodeProps> | undefined, defaultContent?: string | undefined) => (...args: any[]) => any; | ||
| declare const withMeta: (options: Options) => (nodeKey?: string | Partial<import("@bodiless/core").WithNodeProps> | undefined, defaultContent?: string | undefined) => (...args: any[]) => any; | ||
@@ -27,0 +28,0 @@ declare const withTitle: (options: Options) => (nodeKey?: string | Partial<import("@bodiless/core").WithNodeProps> | undefined, defaultContent?: string | undefined) => (...args: any[]) => any; |
@@ -41,3 +41,3 @@ "use strict"; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.withTitle = exports.withMetaStatic = exports.withMetaHtml = exports.withMeta = void 0; | ||
| exports.withTitle = exports.withMetaStatic = exports.withMetaHtml = exports.withMeta = exports.withHeadElement = void 0; | ||
| var react_1 = __importDefault(require("react")); | ||
@@ -59,6 +59,7 @@ var core_1 = require("@bodiless/core"); | ||
| }; }; }; | ||
| var withHeadElement = function (renderHoc) { return function (options) { return function (nodeKey, defaultContent) { return core_1.withSidecarNodes(core_1.withNodeKey(nodeKey), core_1.withNode, core_1.withNodeDataHandlers({ content: defaultContent }), core_1.ifEditable(withMetaForm_1.withMetaSnippet(__assign({}, options))), core_1.withoutProps('setComponentData'), core_1.withData, renderHoc(options)); }; }; }; | ||
| var withMeta = withHeadElement(withMeta$); | ||
| // @todo withHeadElement to its own file. | ||
| exports.withHeadElement = function (renderHoc) { return function (options) { return function (nodeKey, defaultContent) { return core_1.withSidecarNodes(core_1.withNodeKey(nodeKey), core_1.withNode, core_1.withNodeDataHandlers({ content: defaultContent }), core_1.ifEditable(withMetaForm_1.withMetaSnippet(__assign({}, options))), core_1.withoutProps('setComponentData'), core_1.withData, renderHoc(options)); }; }; }; | ||
| var withMeta = exports.withHeadElement(withMeta$); | ||
| exports.withMeta = withMeta; | ||
| var withTitle = withHeadElement(withTitle$); | ||
| var withTitle = exports.withHeadElement(withTitle$); | ||
| exports.withTitle = withTitle; | ||
@@ -65,0 +66,0 @@ var withMetaStatic = function (options) { return function (nodeKey, defaultContent) { return lodash_1.flowRight(core_1.asReadOnly, |
@@ -33,4 +33,4 @@ /** | ||
| export declare const withMetaSnippet: (options: MetaSnippetOptions) => (Component: React.ComponentType<object>) => (props: object & import("@bodiless/core").EditButtonProps<any>) => JSX.Element; | ||
| declare const withMetaForm: (useMenuOptions: (props: any) => TMenuOption[], metaFormHeader?: HeaderProps | undefined) => (...args: any[]) => any; | ||
| declare const withMetaForm: (useMenuOptions: (props: any) => TMenuOption[], metaFormHeader?: HeaderProps | undefined) => (Component: string | React.FunctionComponent<any> | React.ComponentClass<any, any>) => React.FunctionComponent<any>; | ||
| export default withMetaForm; | ||
| //# sourceMappingURL=withMetaForm.d.ts.map |
@@ -32,3 +32,2 @@ "use strict"; | ||
| var react_1 = __importDefault(require("react")); | ||
| var lodash_1 = require("lodash"); | ||
| var uuid_1 = require("uuid"); | ||
@@ -85,7 +84,7 @@ var core_1 = require("@bodiless/core"); | ||
| }; | ||
| var withMetaForm = function (useMenuOptions, metaFormHeader) { return lodash_1.flowRight(core_1.withCompoundForm({ | ||
| var withMetaForm = function (useMenuOptions, metaFormHeader) { return core_1.ifEditable(core_1.withCompoundForm({ | ||
| useMenuOptions: useMenuOptions, | ||
| name: 'Meta', peer: true, id: 'meta', | ||
| name: 'Meta', peer: true, | ||
| }), withMetaFormHeader(metaFormHeader || defaultMetaFormHeader)); }; | ||
| exports.default = withMetaForm; | ||
| //# sourceMappingURL=withMetaForm.js.map |
@@ -45,2 +45,3 @@ "use strict"; | ||
| label: 'Groups', | ||
| groupLabel: 'Filter', | ||
| name: 'Tag', | ||
@@ -47,0 +48,0 @@ renderForm: function (_a) { |
@@ -88,3 +88,4 @@ "use strict"; | ||
| // on the mobx data store. | ||
| var menuOptions = react_1.useMemo(function () { return ([{ | ||
| var menuOptions = react_1.useMemo(function () { return [ | ||
| { | ||
| icon: icon || 'toggle_off', | ||
@@ -97,3 +98,13 @@ name: 'Toggle', | ||
| local: true, | ||
| }]); }, []); | ||
| group: 'toggle-group', | ||
| }, | ||
| { | ||
| name: 'toggle-group', | ||
| label: label, | ||
| isHidden: function () { return isOn(); }, | ||
| global: false, | ||
| local: true, | ||
| Component: 'group', | ||
| }, | ||
| ]; }, []); | ||
| return menuOptions; | ||
@@ -100,0 +111,0 @@ }; |
@@ -14,5 +14,5 @@ /** | ||
| */ | ||
| import type { HOC } from '@bodiless/fclasses'; | ||
| declare const withBodilessLinkToggle: (asEditableLink: HOC) => (...args: any[]) => any; | ||
| import type { AsBodilessLink } from './Link'; | ||
| declare const withBodilessLinkToggle: (asEditableLink: AsBodilessLink) => AsBodilessLink; | ||
| export default withBodilessLinkToggle; | ||
| //# sourceMappingURL=withBodilessLinkToggle.d.ts.map |
@@ -15,2 +15,13 @@ "use strict"; | ||
| */ | ||
| var __assign = (this && this.__assign) || function () { | ||
| __assign = Object.assign || function(t) { | ||
| for (var s, i = 1, n = arguments.length; i < n; i++) { | ||
| s = arguments[i]; | ||
| for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) | ||
| t[p] = s[p]; | ||
| } | ||
| return t; | ||
| }; | ||
| return __assign.apply(this, arguments); | ||
| }; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -24,7 +35,17 @@ var react_1 = require("react"); | ||
| var Span = fclasses_1.withoutProps('')('span'); | ||
| var withBodilessLinkToggle = function (asEditableLink) { return lodash_1.flowRight(fclasses_1.withDesign({ | ||
| _default: lodash_1.flowRight(core_1.ifEditable(fclasses_1.replaceWith(Span)), core_1.ifReadOnly(fclasses_1.replaceWith(SafeFragment))), | ||
| Link: lodash_1.identity, | ||
| }), Chameleon_1.withChameleonContext('link-toggle'), Chameleon_1.withChameleonComponentFormControls, core_1.withSidecarNodes(asEditableLink), Chameleon_1.applyChameleon); }; | ||
| var extendOverrides = function (useOverrides) { | ||
| if (useOverrides === void 0) { useOverrides = function () { return ({}); }; } | ||
| return function (extender) { | ||
| if (extender === void 0) { extender = function () { return ({}); }; } | ||
| return function (props) { return (__assign(__assign({}, useOverrides(props)), extender(props))); }; | ||
| }; | ||
| }; | ||
| var withBodilessLinkToggle = function (asEditableLink) { return function (nodeKey, defaultData, useOverrides) { | ||
| var useOverrides$ = extendOverrides(function () { return ({ label: Chameleon_1.useChameleonContext().isOn ? 'Edit' : 'Add' }); })(useOverrides); | ||
| return lodash_1.flowRight(fclasses_1.withDesign({ | ||
| _default: lodash_1.flowRight(core_1.ifEditable(fclasses_1.replaceWith(Span)), core_1.ifReadOnly(fclasses_1.replaceWith(SafeFragment))), | ||
| Link: lodash_1.identity, | ||
| }), Chameleon_1.withChameleonContext('link-toggle'), Chameleon_1.withChameleonComponentFormControls, core_1.withSidecarNodes(asEditableLink(nodeKey, defaultData, useOverrides$)), Chameleon_1.applyChameleon); | ||
| }; }; | ||
| exports.default = withBodilessLinkToggle; | ||
| //# sourceMappingURL=withBodilessLinkToggle.js.map |
| { | ||
| "name": "@bodiless/components", | ||
| "version": "0.0.58", | ||
| "version": "0.0.59", | ||
| "description": "Reusable compoments", | ||
@@ -30,7 +30,7 @@ "author": "Heidi Vanyo <hvanyo@its.jnj.com>", | ||
| "dependencies": { | ||
| "@bodiless/core": "^0.0.58", | ||
| "@bodiless/fclasses": "^0.0.58", | ||
| "@bodiless/ui": "^0.0.58", | ||
| "@bodiless/core": "^0.0.59", | ||
| "@bodiless/fclasses": "^0.0.59", | ||
| "@bodiless/ui": "^0.0.59", | ||
| "@types/react-helmet": "^5.0.14", | ||
| "axios": "^0.19.0", | ||
| "axios": "^0.21.0", | ||
| "common-tags": "^1.8.0", | ||
@@ -61,3 +61,3 @@ "copyfiles": "^2.1.1", | ||
| }, | ||
| "gitHead": "25f75c3da0e9ef98dcef4154010a04c6fd3b91bf" | ||
| "gitHead": "ecebca9cbc4aafb1df0236ed402d066e69b9e107" | ||
| } |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by24.95%
1098673
- Number of package files
- increased by2.16%
236
- Lines of code
- increased by3.43%
4940
- Number of low supply chain risk alerts
- decreased by-25%
3
Dependency changes
+ Added@bodiless/core@0.0.59(transitive)
+ Added@bodiless/fclasses@0.0.59(transitive)
+ Added@bodiless/ui@0.0.59(transitive)
+ Addedaxios@0.21.4(transitive)
+ Addedfollow-redirects@1.15.9(transitive)
- Removed@bodiless/core@0.0.58(transitive)
- Removed@bodiless/fclasses@0.0.58(transitive)
- Removed@bodiless/ui@0.0.58(transitive)
- Removedaxios@0.19.2(transitive)
- Removedfollow-redirects@1.5.10(transitive)
Updated@bodiless/core@^0.0.59
Updated@bodiless/fclasses@^0.0.59
Updated@bodiless/ui@^0.0.59
Updatedaxios@^0.21.0