payload 0.20.1 → 0.20.2-beta.0

package/dist/admin/components/elements/Pill/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/Popup/PopupButton/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-import './index.scss';
-declare const PopupButton: React.FC<Props>;
-export default PopupButton;

package/dist/admin/components/elements/Popup/PopupButton/index.js

@@ -1,22 +0,0 @@
-import React from 'react';
-import './index.scss';
-const baseClass = 'popup-button';
-const PopupButton = (props) => {
-    const { buttonType, button, setActive, active, } = props;
-    const classes = [
-        baseClass,
-        `${baseClass}--${buttonType}`,
-    ].filter(Boolean).join(' ');
-    const handleClick = () => {
-        setActive(!active);
-    };
-    if (buttonType === 'none') {
-        return null;
-    }
-    if (buttonType === 'custom') {
-        return (React.createElement("div", { role: "button", tabIndex: 0, onKeyDown: (e) => { if (e.key === 'Enter')
-                handleClick(); }, onClick: handleClick, className: classes }, button));
-    }
-    return (React.createElement("button", { type: "button", onClick: () => setActive(!active), className: classes }, button));
-};
-export default PopupButton;

package/dist/admin/components/elements/Popup/PopupButton/index.scss

@@ -1,5 +0,0 @@
-@import '../../../../scss/styles.scss';
-
-.popup-button {
-  display: inline-flex;
-}

package/dist/admin/components/elements/Popup/PopupButton/types.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-export declare type Props = {
-    buttonType: 'custom' | 'default' | 'none';
-    button: React.ReactNode;
-    setActive: (active: boolean) => void;
-    active: boolean;
-};

package/dist/admin/components/elements/Popup/PopupButton/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/Popup/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-import './index.scss';
-declare const Popup: React.FC<Props>;
-export default Popup;

package/dist/admin/components/elements/Popup/index.js

@@ -1,92 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { useWindowInfo } from '@faceless-ui/window-info';
-import { useScrollInfo } from '@faceless-ui/scroll-info';
-import useThrottledEffect from '../../../hooks/useThrottledEffect';
-import PopupButton from './PopupButton';
-import './index.scss';
-const baseClass = 'popup';
-const Popup = (props) => {
-    const { className, render, size = 'small', color = 'light', button, buttonType = 'default', children, showOnHover = false, horizontalAlign: horizontalAlignFromProps = 'left', verticalAlign: verticalAlignFromProps = 'top', initActive = false, onToggleOpen, padding, forceOpen, boundingRef, } = props;
-    const buttonRef = useRef(null);
-    const contentRef = useRef(null);
-    const [mounted, setMounted] = useState(false);
-    const [active, setActive] = useState(initActive);
-    const [verticalAlign, setVerticalAlign] = useState(verticalAlignFromProps);
-    const [horizontalAlign, setHorizontalAlign] = useState(horizontalAlignFromProps);
-    const { y: scrollY } = useScrollInfo();
-    const { height: windowHeight, width: windowWidth } = useWindowInfo();
-    const handleClickOutside = (e) => {
-        if (contentRef.current.contains(e.target)) {
-            return;
-        }
-        setActive(false);
-    };
-    useThrottledEffect(() => {
-        if (contentRef.current && buttonRef.current) {
-            const { left: contentLeftPos, right: contentRightPos, top: contentTopPos, bottom: contentBottomPos, } = contentRef.current.getBoundingClientRect();
-            let boundingTopPos = 0;
-            let boundingRightPos = windowWidth;
-            let boundingBottomPos = windowHeight;
-            let boundingLeftPos = 0;
-            if (boundingRef === null || boundingRef === void 0 ? void 0 : boundingRef.current) {
-                ({
-                    top: boundingTopPos,
-                    right: boundingRightPos,
-                    bottom: boundingBottomPos,
-                    left: boundingLeftPos,
-                } = boundingRef.current.getBoundingClientRect());
-            }
-            if (contentRightPos > boundingRightPos && contentLeftPos > boundingLeftPos) {
-                setHorizontalAlign('right');
-            }
-            else if (contentLeftPos < boundingLeftPos && contentRightPos < boundingRightPos) {
-                setHorizontalAlign('left');
-            }
-            if (contentTopPos < boundingTopPos && contentBottomPos < boundingBottomPos) {
-                setVerticalAlign('bottom');
-            }
-            else if (contentBottomPos > boundingBottomPos && contentTopPos < boundingTopPos) {
-                setVerticalAlign('top');
-            }
-            setMounted(true);
-        }
-    }, 500, [scrollY, windowHeight, windowWidth]);
-    useEffect(() => {
-        if (typeof onToggleOpen === 'function')
-            onToggleOpen(active);
-        if (active) {
-            document.addEventListener('mousedown', handleClickOutside);
-        }
-        else {
-            document.removeEventListener('mousedown', handleClickOutside);
-        }
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [active, onToggleOpen]);
-    useEffect(() => {
-        setActive(forceOpen);
-    }, [forceOpen]);
-    const classes = [
-        baseClass,
-        className,
-        `${baseClass}--size-${size}`,
-        `${baseClass}--color-${color}`,
-        `${baseClass}--v-align-${verticalAlign}`,
-        `${baseClass}--h-align-${horizontalAlign}`,
-        (active && mounted) && `${baseClass}--active`,
-    ].filter(Boolean).join(' ');
-    return (React.createElement("div", { className: classes },
-        React.createElement("div", { ref: buttonRef, className: `${baseClass}__wrapper` }, showOnHover
-            ? (React.createElement("div", { className: `${baseClass}__on-hover-watch`, onMouseEnter: () => setActive(true), onMouseLeave: () => setActive(false) },
-                React.createElement(PopupButton, { buttonType: buttonType, button: button, setActive: setActive, active: active })))
-            : (React.createElement(PopupButton, { buttonType: buttonType, button: button, setActive: setActive, active: active }))),
-        React.createElement("div", { className: `${baseClass}__content`, ref: contentRef },
-            React.createElement("div", { className: `${baseClass}__wrap` },
-                React.createElement("div", { className: `${baseClass}__scroll`, style: {
-                        padding,
-                    } },
-                    render && render({ close: () => setActive(false) }),
-                    children && children)))));
-};
-export default Popup;

package/dist/admin/components/elements/Popup/index.scss

@@ -1,256 +0,0 @@
-@import '../../../scss/styles.scss';
-
-.popup {
-  position: relative;
-
-  &__content {
-    position: absolute;
-    background: white;
-    opacity: 0;
-    visibility: hidden;
-    z-index: $z-modal;
-    max-width: calc(100vw - #{$baseline});
-
-    &:after {
-      content: ' ';
-      position: absolute;
-      top: calc(100% - 1px);
-      border: 12px solid transparent;
-      border-top-color: white;
-    }
-  }
-
-  &__wrap {
-    overflow: hidden;
-  }
-
-  &__scroll {
-    padding: $baseline;
-    padding-right: calc(var(--scrollbar-width) + #{$baseline});
-    overflow-y: auto;
-    width: calc(100% + var(--scrollbar-width));
-    white-space: nowrap;
-  }
-
-  &:focus,
-  &:active {
-    outline: none;
-  }
-
-  ////////////////////////////////
-  // SIZE
-  ////////////////////////////////
-
-  &--size-small {
-    .popup__content {
-      @include shadow-sm;
-    }
-
-    &.popup--h-align-left {
-      .popup__content {
-        left: - base(.5);
-
-        &:after {
-          left: base(.425);
-        }
-      }
-    }
-  }
-
-  &--size-large {
-    .popup__content {
-      @include shadow-lg;
-    }
-
-    .popup__scroll {
-      padding: base(1.5) calc(var(--scrollbar-width) + #{base(1.5)}) base(1) base(1.5);
-    }
-  }
-
-  &--size-wide {
-    .popup__content {
-      @include shadow-sm;
-
-      &:after {
-        border: 12px solid transparent;
-        border-top-color: white;
-      }
-    }
-
-    .popup__scroll {
-      padding: base(.25) base(.5);
-    }
-
-    &.popup--align-left {
-      .popup__content {
-        left: - base(.5);
-
-        &:after {
-          left: base(.425);
-        }
-      }
-    }
-  }
-
-  ////////////////////////////////
-  // HORIZONTAL ALIGNMENT
-  ////////////////////////////////
-
-  &--h-align-left {
-    .popup__content {
-      left: - base(1.75);
-
-      &:after {
-        left: base(1.75);
-      }
-    }
-  }
-
-  &--h-align-center {
-    .popup__content {
-      left: 50%;
-      transform: translateX(-50%);
-
-      &:after {
-        left: 50%;
-        transform: translateX(-50%);
-      }
-    }
-  }
-
-  &--h-align-right {
-    .popup__content {
-      right: - base(1.75);
-
-      &:after {
-        right: base(1.75);
-      }
-    }
-  }
-
-  ////////////////////////////////
-  // VERTICAL ALIGNMENT
-  ////////////////////////////////
-
-  &--v-align-top {
-    .popup__content {
-      bottom: calc(100% + #{$baseline});
-    }
-  }
-
-  &--v-align-bottom {
-    .popup__content {
-      @include shadow-lg-top;
-      top: calc(100% + #{base(.5)});
-
-      &:after {
-        top: unset;
-        bottom: calc(100% - 1px);
-        border-top-color: transparent !important;
-        border-bottom-color: white;
-      }
-    }
-
-    &.popup--color-dark {
-      .popup__content {
-        &:after {
-          border-bottom-color: $color-dark-gray;
-        }
-      }
-    }
-  }
-
-  ////////////////////////////////
-  // COLOR
-  ////////////////////////////////
-
-  &--color-dark {
-    .popup__content {
-      background: $color-dark-gray;
-      color: white;
-
-      &:after {
-        border-top-color: $color-dark-gray;
-      }
-    }
-  }
-
-  ////////////////////////////////
-  // ACTIVE
-  ////////////////////////////////
-
-  &--active {
-    .popup__content {
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-
-  @include mid-break {
-    &__scroll,
-    &--size-large .popup__scroll{
-      padding: base(.75);
-      padding-right: calc(var(--scrollbar-width) + #{base(.75)});
-    }
-
-    &--h-align-left {
-      .popup__content {
-        left: - base(.5);
-
-        &:after {
-          left: base(.5);
-        }
-      }
-    }
-
-    &--h-align-center {
-      .popup__content {
-        left: 50%;
-        transform: translateX(-50%);
-
-        &:after {
-          left: 50%;
-          transform: translateX(-50%);
-        }
-      }
-    }
-
-    &--h-align-right {
-      .popup__content {
-        right: - base(.5);
-
-        &:after {
-          right: base(.5);
-        }
-      }
-    }
-
-    &--force-h-align-left {
-      .popup__content {
-        left: - base(.5);
-        right: unset;
-        transform: unset;
-
-        &:after {
-          left: base(.5);
-          right: unset;
-          transform: unset;
-        }
-      }
-    }
-
-    &--force-h-align-right {
-      .popup__content {
-        right: - base(.5);
-        left: unset;
-        transform: unset;
-
-        &:after {
-          right: base(.5);
-          left: unset;
-          transform: unset;
-        }
-      }
-    }
-  }
-}

package/dist/admin/components/elements/Popup/types.d.ts

@@ -1,19 +0,0 @@
-import { CSSProperties } from 'react';
-export declare type Props = {
-    className?: string;
-    render?: (any: any) => React.ReactNode;
-    children?: React.ReactNode;
-    verticalAlign?: 'top' | 'bottom';
-    horizontalAlign?: 'left' | 'center' | 'right';
-    size?: 'small' | 'large' | 'wide';
-    color?: 'light' | 'dark';
-    buttonType?: 'default' | 'custom' | 'none';
-    button?: React.ReactNode;
-    forceOpen?: boolean;
-    showOnHover?: boolean;
-    initActive?: boolean;
-    onToggleOpen?: (active: boolean) => void;
-    backgroundColor?: CSSProperties['backgroundColor'];
-    padding?: CSSProperties['padding'];
-    boundingRef?: React.MutableRefObject<HTMLElement>;
-};

package/dist/admin/components/elements/Popup/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/PreviewButton/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-import './index.scss';
-declare const PreviewButton: React.FC<Props>;
-export default PreviewButton;

package/dist/admin/components/elements/PreviewButton/index.js

@@ -1,31 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { useAuth } from '../../utilities/Auth';
-import Button from '../Button';
-import { useLocale } from '../../utilities/Locale';
-import './index.scss';
-const baseClass = 'preview-btn';
-const PreviewButton = (props) => {
-    const { generatePreviewURL, data, } = props;
-    const [url, setUrl] = useState(undefined);
-    const locale = useLocale();
-    const { token } = useAuth();
-    useEffect(() => {
-        if (generatePreviewURL && typeof generatePreviewURL === 'function') {
-            const makeRequest = async () => {
-                const previewURL = await generatePreviewURL(data, { locale, token });
-                setUrl(previewURL);
-            };
-            makeRequest();
-        }
-    }, [
-        generatePreviewURL,
-        locale,
-        token,
-        data,
-    ]);
-    if (url) {
-        return (React.createElement(Button, { el: "anchor", className: baseClass, buttonStyle: "secondary", url: url, newTab: true }, "Preview"));
-    }
-    return null;
-};
-export default PreviewButton;

package/dist/admin/components/elements/PreviewButton/index.scss

@@ -1 +0,0 @@
-@import '../../../scss/styles.scss';

package/dist/admin/components/elements/PreviewButton/types.d.ts

@@ -1,6 +0,0 @@
-import { Data } from '../../forms/Form/types';
-import { GeneratePreviewURL } from '../../../../config/types';
-export declare type Props = {
-    generatePreviewURL?: GeneratePreviewURL;
-    data?: Data;
-};

package/dist/admin/components/elements/PreviewButton/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/Publish/index.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-declare const Publish: React.FC<Props>;
-export default Publish;

package/dist/admin/components/elements/Publish/index.js

@@ -1,20 +0,0 @@
-import React, { useCallback } from 'react';
-import FormSubmit from '../../forms/Submit';
-import { useDocumentInfo } from '../../utilities/DocumentInfo';
-import { useForm, useFormModified } from '../../forms/Form/context';
-const Publish = () => {
-    const { unpublishedVersions, publishedDoc } = useDocumentInfo();
-    const { submit } = useForm();
-    const modified = useFormModified();
-    const hasNewerVersions = (unpublishedVersions === null || unpublishedVersions === void 0 ? void 0 : unpublishedVersions.totalDocs) > 0;
-    const canPublish = modified || hasNewerVersions || !publishedDoc;
-    const publish = useCallback(() => {
-        submit({
-            overrides: {
-                _status: 'published',
-            },
-        });
-    }, [submit]);
-    return (React.createElement(FormSubmit, { type: "button", onClick: publish, disabled: !canPublish }, "Publish changes"));
-};
-export default Publish;

package/dist/admin/components/elements/Publish/types.d.ts

@@ -1 +0,0 @@
-export declare type Props = {};

package/dist/admin/components/elements/Publish/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/ReactSelect/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-import './index.scss';
-declare const ReactSelect: React.FC<Props>;
-export default ReactSelect;

package/dist/admin/components/elements/ReactSelect/index.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import Select from 'react-select';
-import Chevron from '../../icons/Chevron';
-import './index.scss';
-const ReactSelect = (props) => {
-    const { className, showError = false, options, onChange, value, disabled = false, placeholder, isSearchable = true, } = props;
-    const classes = [
-        className,
-        'react-select',
-        showError && 'react-select--error',
-    ].filter(Boolean).join(' ');
-    return (React.createElement(Select, { placeholder: placeholder, ...props, value: value, onChange: onChange, disabled: disabled ? 'disabled' : undefined, components: { DropdownIndicator: Chevron }, className: classes, classNamePrefix: "rs", options: options, isSearchable: isSearchable }));
-};
-export default ReactSelect;

package/dist/admin/components/elements/ReactSelect/index.scss

@@ -1,107 +0,0 @@
-@import '../../../scss/styles';
-
-div.react-select {
-  div.rs__control {
-    @include formInput;
-    height: auto;
-    padding-top: base(.25);
-    padding-bottom: base(.25);
-  }
-
-  .rs__value-container {
-    padding: base(.25) 0;
-    min-height: base(1.5);
-
-    > * {
-      margin-top: 0;
-      margin-bottom: 0;
-      padding-top: 0;
-      padding-bottom: 0;
-    }
-
-    &--is-multi {
-      margin-left: - base(.25);
-      padding-top: 0;
-      padding-bottom: 0;
-    }
-  }
-
-  .rs__indicators {
-    .arrow {
-      margin-left: base(.5);
-      transform: rotate(90deg);
-      width: base(.3);
-    }
-  }
-
-  .rs__indicator {
-    padding: 0px 4px;
-  }
-
-  .rs__indicator-separator {
-    display: none;
-  }
-
-  .rs__input {
-    input {
-      font-family: $font-body;
-      width: 100% !important;
-    }
-  }
-
-  .rs__menu {
-    z-index: 2;
-    border-radius: 0;
-    @include inputShadowActive;
-  }
-
-  .rs__group-heading {
-    color: $color-dark-gray;
-    padding-left: base(.5);
-    margin-bottom: base(.25);
-  }
-
-  .rs__option {
-    font-family: $font-body;
-    font-size: $baseline-body-size;
-    padding: base(.375) base(.75);
-    color: $color-dark-gray;
-
-    &--is-focused {
-      background-color: rgba($color-dark-gray, .1);
-    }
-
-    &--is-selected {
-      background-color: rgba($color-dark-gray, .5);
-    }
-  }
-
-  .rs__multi-value {
-    padding: 0;
-    background: transparent;
-    border: $style-stroke-width-s solid $color-dark-gray;
-    line-height: calc(#{$baseline} - #{$style-stroke-width-s * 2});
-    margin: base(.25) base(.5) base(.25) 0;
-  }
-
-  .rs__multi-value__label {
-    padding: 0 base(.125) 0 base(.25);
-    max-width: 150px;
-  }
-
-  .rs__multi-value__remove {
-    padding: 0 base(.125);
-    cursor: pointer;
-
-    &:hover {
-      color: $color-dark-gray;
-      background: rgba($color-red, .25);
-    }
-  }
-
-  &--error {
-    div.rs__control {
-      background-color: lighten($color-red, 20%);
-    }
-  }
-}

package/dist/admin/components/elements/ReactSelect/types.d.ts

@@ -1,21 +0,0 @@
-import { OptionsType, GroupedOptionsType } from 'react-select';
-export declare type Options = OptionsType<Value> | GroupedOptionsType<Value>;
-export declare type Value = {
-    label: string;
-    value: string | null;
-    options?: Options;
-};
-export declare type Props = {
-    className?: string;
-    value?: Value | Value[];
-    onChange?: (value: any) => void;
-    disabled?: boolean;
-    showError?: boolean;
-    options: Options;
-    isMulti?: boolean;
-    isDisabled?: boolean;
-    onInputChange?: (val: string) => void;
-    onMenuScrollToBottom?: () => void;
-    placeholder?: string;
-    isSearchable?: boolean;
-};

package/dist/admin/components/elements/ReactSelect/types.js

@@ -1 +0,0 @@
-export {};

package/dist/admin/components/elements/RenderTitle/index.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { Props } from './types';
-declare const RenderTitle: React.FC<Props>;
-export default RenderTitle;