@wordpress/block-library 7.5.0 → 7.6.0

package/build/cover/use-cover-is-dark.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-library/src/cover/use-cover-is-dark.js"],"names":["retrieveFastAverageColor","fastAverageColor","FastAverageColor","useCoverIsDark","url","dimRatio","overlayColor","elementRef","isDark","setIsDark","current","getColorAsync","color"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,wBAAT,GAAoC;AACnC,MAAK,CAAEA,wBAAwB,CAACC,gBAAhC,EAAmD;AAClDD,IAAAA,wBAAwB,CAACC,gBAAzB,GAA4C,IAAIC,yBAAJ,EAA5C;AACA;;AACD,SAAOF,wBAAwB,CAACC,gBAAhC;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACe,SAASE,cAAT,CACdC,GADc,EAKb;AAAA,MAHDC,QAGC,uEAHU,EAGV;AAAA,MAFDC,YAEC;AAAA,MADDC,UACC;AACD,QAAM,CAAEC,MAAF,EAAUC,SAAV,IAAwB,uBAAU,KAAV,CAA9B;AACA,0BAAW,MAAM;AAChB;AACA;AACA,QAAKL,GAAG,IAAIC,QAAQ,IAAI,EAAnB,IAAyBE,UAAU,CAACG,OAAzC,EAAmD;AAClDV,MAAAA,wBAAwB,GAAGW,aAA3B,CACCJ,UAAU,CAACG,OADZ,EAEGE,KAAF,IAAa;AACZH,QAAAA,SAAS,CAAEG,KAAK,CAACJ,MAAR,CAAT;AACA,OAJF;AAMA;AACD,GAXD,EAWG,CAAEJ,GAAF,EAAOA,GAAG,IAAIC,QAAQ,IAAI,EAAnB,IAAyBE,UAAU,CAACG,OAA3C,EAAoDD,SAApD,CAXH;AAYA,0BAAW,MAAM;AAChB;AACA;AACA,QAAKJ,QAAQ,GAAG,EAAX,IAAiB,CAAED,GAAxB,EAA8B;AAC7B,UAAK,CAAEE,YAAP,EAAsB;AACrB;AACAG,QAAAA,SAAS,CAAE,IAAF,CAAT;AACA;AACA;;AACDA,MAAAA,SAAS,CAAE,oBAAQH,YAAR,EAAuBE,MAAvB,EAAF,CAAT;AACA;AACD,GAXD,EAWG,CAAEF,YAAF,EAAgBD,QAAQ,GAAG,EAAX,IAAiB,CAAED,GAAnC,EAAwCK,SAAxC,CAXH;AAYA,0BAAW,MAAM;AAChB,QAAK,CAAEL,GAAF,IAAS,CAAEE,YAAhB,EAA+B;AAC9B;AACAG,MAAAA,SAAS,CAAE,KAAF,CAAT;AACA;AACD,GALD,EAKG,CAAE,CAAEL,GAAF,IAAS,CAAEE,YAAb,EAA2BG,SAA3B,CALH;AAMA,SAAOD,MAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport FastAverageColor from 'fast-average-color';\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\n\nfunction retrieveFastAverageColor() {\n\tif ( ! retrieveFastAverageColor.fastAverageColor ) {\n\t\tretrieveFastAverageColor.fastAverageColor = new FastAverageColor();\n\t}\n\treturn retrieveFastAverageColor.fastAverageColor;\n}\n\n/**\n * useCoverIsDark is a hook that returns a boolean variable specifying if the cover\n * background is dark or not.\n *\n * @param {?string} url          Url of the media background.\n * @param {?number} dimRatio     Transparency of the overlay color. If an image and\n *                               color are set, dimRatio is used to decide what is used\n *                               for background darkness checking purposes.\n * @param {?string} overlayColor String containing the overlay color value if one exists.\n * @param {?Object} elementRef   If a media background is set, elementRef should contain a reference to a\n *                               dom element that renders that media.\n *\n * @return {boolean} True if the cover background is considered \"dark\" and false otherwise.\n */\nexport default function useCoverIsDark(\n\turl,\n\tdimRatio = 50,\n\toverlayColor,\n\telementRef\n) {\n\tconst [ isDark, setIsDark ] = useState( false );\n\tuseEffect( () => {\n\t\t// If opacity is lower than 50 the dominant color is the image or video color,\n\t\t// so use that color for the dark mode computation.\n\t\tif ( url && dimRatio <= 50 && elementRef.current ) {\n\t\t\tretrieveFastAverageColor().getColorAsync(\n\t\t\t\telementRef.current,\n\t\t\t\t( color ) => {\n\t\t\t\t\tsetIsDark( color.isDark );\n\t\t\t\t}\n\t\t\t);\n\t\t}\n\t}, [ url, url && dimRatio <= 50 && elementRef.current, setIsDark ] );\n\tuseEffect( () => {\n\t\t// If opacity is greater than 50 the dominant color is the overlay color,\n\t\t// so use that color for the dark mode computation.\n\t\tif ( dimRatio > 50 || ! url ) {\n\t\t\tif ( ! overlayColor ) {\n\t\t\t\t// If no overlay color exists the overlay color is black (isDark )\n\t\t\t\tsetIsDark( true );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetIsDark( colord( overlayColor ).isDark() );\n\t\t}\n\t}, [ overlayColor, dimRatio > 50 || ! url, setIsDark ] );\n\tuseEffect( () => {\n\t\tif ( ! url && ! overlayColor ) {\n\t\t\t// Reset isDark.\n\t\t\tsetIsDark( false );\n\t\t}\n\t}, [ ! url && ! overlayColor, setIsDark ] );\n\treturn isDark;\n}\n"]}

package/build/post-terms/variations.js

@@ -1,37 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _i18n = require("@wordpress/i18n");
-
-var _icons = require("@wordpress/icons");
-
-/**
- * WordPress dependencies
- */
-const variations = [{
-  name: 'category',
-  title: (0, _i18n.__)('Post Categories'),
-  description: (0, _i18n.__)("Display a post's categories."),
-  icon: _icons.postCategories,
-  isDefault: true,
-  attributes: {
-    term: 'category'
-  },
-  isActive: blockAttributes => blockAttributes.term === 'category'
-}, {
-  name: 'post_tag',
-  title: (0, _i18n.__)('Post Tags'),
-  description: (0, _i18n.__)("Display a post's tags."),
-  icon: _icons.postTerms,
-  attributes: {
-    term: 'post_tag'
-  },
-  isActive: blockAttributes => blockAttributes.term === 'post_tag'
-}];
-var _default = variations;
-exports.default = _default;
-//# sourceMappingURL=variations.js.map

package/build/post-terms/variations.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-library/src/post-terms/variations.js"],"names":["variations","name","title","description","icon","postCategories","isDefault","attributes","term","isActive","blockAttributes","postTerms"],"mappings":";;;;;;;AAGA;;AACA;;AAJA;AACA;AACA;AAIA,MAAMA,UAAU,GAAG,CAClB;AACCC,EAAAA,IAAI,EAAE,UADP;AAECC,EAAAA,KAAK,EAAE,cAAI,iBAAJ,CAFR;AAGCC,EAAAA,WAAW,EAAE,cAAI,8BAAJ,CAHd;AAICC,EAAAA,IAAI,EAAEC,qBAJP;AAKCC,EAAAA,SAAS,EAAE,IALZ;AAMCC,EAAAA,UAAU,EAAE;AAAEC,IAAAA,IAAI,EAAE;AAAR,GANb;AAOCC,EAAAA,QAAQ,EAAIC,eAAF,IAAuBA,eAAe,CAACF,IAAhB,KAAyB;AAP3D,CADkB,EAWlB;AACCP,EAAAA,IAAI,EAAE,UADP;AAECC,EAAAA,KAAK,EAAE,cAAI,WAAJ,CAFR;AAGCC,EAAAA,WAAW,EAAE,cAAI,wBAAJ,CAHd;AAICC,EAAAA,IAAI,EAAEO,gBAJP;AAKCJ,EAAAA,UAAU,EAAE;AAAEC,IAAAA,IAAI,EAAE;AAAR,GALb;AAMCC,EAAAA,QAAQ,EAAIC,eAAF,IAAuBA,eAAe,CAACF,IAAhB,KAAyB;AAN3D,CAXkB,CAAnB;eAqBeR,U","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { postCategories, postTerms } from '@wordpress/icons';\n\nconst variations = [\n\t{\n\t\tname: 'category',\n\t\ttitle: __( 'Post Categories' ),\n\t\tdescription: __( \"Display a post's categories.\" ),\n\t\ticon: postCategories,\n\t\tisDefault: true,\n\t\tattributes: { term: 'category' },\n\t\tisActive: ( blockAttributes ) => blockAttributes.term === 'category',\n\t},\n\n\t{\n\t\tname: 'post_tag',\n\t\ttitle: __( 'Post Tags' ),\n\t\tdescription: __( \"Display a post's tags.\" ),\n\t\ticon: postTerms,\n\t\tattributes: { term: 'post_tag' },\n\t\tisActive: ( blockAttributes ) => blockAttributes.term === 'post_tag',\n\t},\n];\n\nexport default variations;\n"]}

package/build-module/cover/edit.js

@@ -1,575 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import { createElement } from "@wordpress/element";
-
-/**
- * External dependencies
- */
-import classnames from 'classnames';
-import { extend } from 'colord';
-import namesPlugin from 'colord/plugins/names';
-/**
- * WordPress dependencies
- */
-
-import { useEntityProp, store as coreStore } from '@wordpress/core-data';
-import { Fragment, useEffect, useRef, useState, useMemo } from '@wordpress/element';
-import { BaseControl, Button, ExternalLink, FocalPointPicker, PanelBody, PanelRow, RangeControl, ResizableBox, Spinner, TextareaControl, ToggleControl, ToolbarButton, __experimentalUseCustomUnits as useCustomUnits, __experimentalToolsPanelItem as ToolsPanelItem, __experimentalUnitControl as UnitControl, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue } from '@wordpress/components';
-import { compose, useInstanceId } from '@wordpress/compose';
-import { BlockControls, BlockIcon, InspectorControls, MediaPlaceholder, MediaReplaceFlow, withColors, ColorPalette, useBlockProps, useSetting, useInnerBlocksProps, __experimentalUseGradient, __experimentalPanelColorGradientSettings as PanelColorGradientSettings, __experimentalBlockAlignmentMatrixControl as BlockAlignmentMatrixControl, __experimentalBlockFullHeightAligmentControl as FullHeightAlignmentControl, store as blockEditorStore } from '@wordpress/block-editor';
-import { __ } from '@wordpress/i18n';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { postFeaturedImage, cover as icon } from '@wordpress/icons';
-import { isBlobURL } from '@wordpress/blob';
-import { store as noticesStore } from '@wordpress/notices';
-/**
- * Internal dependencies
- */
-
-import { ALLOWED_MEDIA_TYPES, attributesFromMedia, IMAGE_BACKGROUND_TYPE, VIDEO_BACKGROUND_TYPE, COVER_MIN_HEIGHT, backgroundImageStyles, dimRatioToClass, isContentPositionCenter, getPositionClassName } from './shared';
-import useCoverIsDark from './use-cover-is-dark';
-extend([namesPlugin]);
-
-function getInnerBlocksTemplate(attributes) {
-  return [['core/paragraph', {
-    align: 'center',
-    placeholder: __('Write title…'),
-    ...attributes
-  }]];
-}
-
-function CoverHeightInput(_ref) {
-  let {
-    onChange,
-    onUnitChange,
-    unit = 'px',
-    value = ''
-  } = _ref;
-  const instanceId = useInstanceId(UnitControl);
-  const inputId = `block-cover-height-input-${instanceId}`;
-  const isPx = unit === 'px';
-  const units = useCustomUnits({
-    availableUnits: useSetting('spacing.units') || ['px', 'em', 'rem', 'vw', 'vh'],
-    defaultValues: {
-      px: 430,
-      '%': 20,
-      em: 20,
-      rem: 20,
-      vw: 20,
-      vh: 50
-    }
-  });
-
-  const handleOnChange = unprocessedValue => {
-    const inputValue = unprocessedValue !== '' ? parseFloat(unprocessedValue) : undefined;
-
-    if (isNaN(inputValue) && inputValue !== undefined) {
-      return;
-    }
-
-    onChange(inputValue);
-  };
-
-  const computedValue = useMemo(() => {
-    const [parsedQuantity] = parseQuantityAndUnitFromRawValue(value);
-    return [parsedQuantity, unit].join('');
-  }, [unit, value]);
-  const min = isPx ? COVER_MIN_HEIGHT : 0;
-  return createElement(BaseControl, {
-    label: __('Minimum height of cover'),
-    id: inputId
-  }, createElement(UnitControl, {
-    id: inputId,
-    isResetValueOnUnitChange: true,
-    min: min,
-    onChange: handleOnChange,
-    onUnitChange: onUnitChange,
-    style: {
-      maxWidth: 80
-    },
-    units: units,
-    value: computedValue
-  }));
-}
-
-const RESIZABLE_BOX_ENABLE_OPTION = {
-  top: false,
-  right: false,
-  bottom: true,
-  left: false,
-  topRight: false,
-  bottomRight: false,
-  bottomLeft: false,
-  topLeft: false
-};
-
-function ResizableCover(_ref2) {
-  let {
-    className,
-    onResizeStart,
-    onResize,
-    onResizeStop,
-    ...props
-  } = _ref2;
-  const [isResizing, setIsResizing] = useState(false);
-  return createElement(ResizableBox, _extends({
-    className: classnames(className, {
-      'is-resizing': isResizing
-    }),
-    enable: RESIZABLE_BOX_ENABLE_OPTION,
-    onResizeStart: (_event, _direction, elt) => {
-      onResizeStart(elt.clientHeight);
-      onResize(elt.clientHeight);
-    },
-    onResize: (_event, _direction, elt) => {
-      onResize(elt.clientHeight);
-
-      if (!isResizing) {
-        setIsResizing(true);
-      }
-    },
-    onResizeStop: (_event, _direction, elt) => {
-      onResizeStop(elt.clientHeight);
-      setIsResizing(false);
-    }
-  }, props));
-}
-
-function mediaPosition(_ref3) {
-  let {
-    x,
-    y
-  } = _ref3;
-  return `${Math.round(x * 100)}% ${Math.round(y * 100)}%`;
-}
-/**
- * Is the URL a temporary blob URL? A blob URL is one that is used temporarily while
- * the media (image or video) is being uploaded and will not have an id allocated yet.
- *
- * @param {number} id  The id of the media.
- * @param {string} url The url of the media.
- *
- * @return {boolean} Is the URL a Blob URL.
- */
-
-
-const isTemporaryMedia = (id, url) => !id && isBlobURL(url);
-
-function CoverPlaceholder(_ref4) {
-  let {
-    disableMediaButtons = false,
-    children,
-    onSelectMedia,
-    onError,
-    style
-  } = _ref4;
-  return createElement(MediaPlaceholder, {
-    icon: createElement(BlockIcon, {
-      icon: icon
-    }),
-    labels: {
-      title: __('Cover'),
-      instructions: __('Drag and drop onto this block, upload, or select existing media from your library.')
-    },
-    onSelect: onSelectMedia,
-    accept: "image/*,video/*",
-    allowedTypes: ALLOWED_MEDIA_TYPES,
-    disableMediaButtons: disableMediaButtons,
-    onError: onError,
-    style: style
-  }, children);
-}
-
-function CoverEdit(_ref5) {
-  var _useSetting;
-
-  let {
-    attributes,
-    clientId,
-    isSelected,
-    overlayColor,
-    setAttributes,
-    setOverlayColor,
-    toggleSelection,
-    context: {
-      postId,
-      postType
-    }
-  } = _ref5;
-  const {
-    contentPosition,
-    id,
-    useFeaturedImage,
-    dimRatio,
-    focalPoint,
-    hasParallax,
-    isDark,
-    isRepeated,
-    minHeight,
-    minHeightUnit,
-    alt,
-    allowedBlocks,
-    templateLock
-  } = attributes;
-  const [featuredImage] = useEntityProp('postType', postType, 'featured_media', postId);
-  const media = useSelect(select => featuredImage && select(coreStore).getMedia(featuredImage, {
-    context: 'view'
-  }), [featuredImage]);
-  const mediaUrl = media === null || media === void 0 ? void 0 : media.source_url; // instead of destructuring the attributes
-  // we define the url and background type
-  // depending on the value of the useFeaturedImage flag
-  // to preview in edit the dynamic featured image
-
-  const url = useFeaturedImage ? mediaUrl : attributes.url;
-  const backgroundType = useFeaturedImage ? IMAGE_BACKGROUND_TYPE : attributes.backgroundType;
-  const {
-    __unstableMarkNextChangeAsNotPersistent
-  } = useDispatch(blockEditorStore);
-  const {
-    createErrorNotice
-  } = useDispatch(noticesStore);
-
-  const {
-    gradientClass,
-    gradientValue,
-    setGradient
-  } = __experimentalUseGradient();
-
-  const onSelectMedia = attributesFromMedia(setAttributes, dimRatio);
-  const isUploadingMedia = isTemporaryMedia(id, url);
-  const [prevMinHeightValue, setPrevMinHeightValue] = useState(minHeight);
-  const [prevMinHeightUnit, setPrevMinHeightUnit] = useState(minHeightUnit);
-  const isMinFullHeight = minHeightUnit === 'vh' && minHeight === 100;
-
-  const toggleMinFullHeight = () => {
-    if (isMinFullHeight) {
-      // If there aren't previous values, take the default ones.
-      if (prevMinHeightUnit === 'vh' && prevMinHeightValue === 100) {
-        return setAttributes({
-          minHeight: undefined,
-          minHeightUnit: undefined
-        });
-      } // Set the previous values of height.
-
-
-      return setAttributes({
-        minHeight: prevMinHeightValue,
-        minHeightUnit: prevMinHeightUnit
-      });
-    }
-
-    setPrevMinHeightValue(minHeight);
-    setPrevMinHeightUnit(minHeightUnit); // Set full height.
-
-    return setAttributes({
-      minHeight: 100,
-      minHeightUnit: 'vh'
-    });
-  };
-
-  const toggleParallax = () => {
-    setAttributes({
-      hasParallax: !hasParallax,
-      ...(!hasParallax ? {
-        focalPoint: undefined
-      } : {})
-    });
-  };
-
-  const toggleIsRepeated = () => {
-    setAttributes({
-      isRepeated: !isRepeated
-    });
-  };
-
-  const toggleUseFeaturedImage = () => {
-    setAttributes({
-      useFeaturedImage: !useFeaturedImage,
-      dimRatio: dimRatio === 100 ? 50 : dimRatio
-    });
-  };
-
-  const onUploadError = message => {
-    createErrorNotice(Array.isArray(message) ? message[2] : message, {
-      type: 'snackbar'
-    });
-  };
-
-  const isDarkElement = useRef();
-  const isCoverDark = useCoverIsDark(url, dimRatio, overlayColor.color, isDarkElement);
-  useEffect(() => {
-    // This side-effect should not create an undo level.
-    __unstableMarkNextChangeAsNotPersistent();
-
-    setAttributes({
-      isDark: isCoverDark
-    });
-  }, [isCoverDark]);
-  const isImageBackground = IMAGE_BACKGROUND_TYPE === backgroundType;
-  const isVideoBackground = VIDEO_BACKGROUND_TYPE === backgroundType;
-  const minHeightWithUnit = minHeight && minHeightUnit ? `${minHeight}${minHeightUnit}` : minHeight;
-  const isImgElement = !(hasParallax || isRepeated);
-  const style = { ...(isImageBackground && !isImgElement ? backgroundImageStyles(url) : undefined),
-    minHeight: minHeightWithUnit || undefined
-  };
-  const bgStyle = {
-    backgroundColor: overlayColor.color
-  };
-  const mediaStyle = {
-    objectPosition: focalPoint && isImgElement ? mediaPosition(focalPoint) : undefined
-  };
-  const hasBackground = !!(url || overlayColor.color || gradientValue);
-  const showFocalPointPicker = isVideoBackground || isImageBackground && (!hasParallax || isRepeated);
-
-  const imperativeFocalPointPreview = value => {
-    const [styleOfRef, property] = isDarkElement.current ? [isDarkElement.current.style, 'objectPosition'] : [ref.current.style, 'backgroundPosition'];
-    styleOfRef[property] = mediaPosition(value);
-  };
-
-  const hasInnerBlocks = useSelect(select => select(blockEditorStore).getBlock(clientId).innerBlocks.length > 0, [clientId]);
-  const controls = createElement(Fragment, null, createElement(BlockControls, {
-    group: "block"
-  }, createElement(BlockAlignmentMatrixControl, {
-    label: __('Change content position'),
-    value: contentPosition,
-    onChange: nextPosition => setAttributes({
-      contentPosition: nextPosition
-    }),
-    isDisabled: !hasInnerBlocks
-  }), createElement(FullHeightAlignmentControl, {
-    isActive: isMinFullHeight,
-    onToggle: toggleMinFullHeight,
-    isDisabled: !hasInnerBlocks
-  })), createElement(BlockControls, {
-    group: "other"
-  }, createElement(ToolbarButton, {
-    icon: postFeaturedImage,
-    label: __('Use featured image'),
-    isPressed: useFeaturedImage,
-    onClick: toggleUseFeaturedImage
-  }), !useFeaturedImage && createElement(MediaReplaceFlow, {
-    mediaId: id,
-    mediaURL: url,
-    allowedTypes: ALLOWED_MEDIA_TYPES,
-    accept: "image/*,video/*",
-    onSelect: onSelectMedia,
-    name: !url ? __('Add Media') : __('Replace')
-  })), createElement(InspectorControls, null, !!url && createElement(PanelBody, {
-    title: __('Media settings')
-  }, isImageBackground && createElement(Fragment, null, createElement(ToggleControl, {
-    label: __('Fixed background'),
-    checked: hasParallax,
-    onChange: toggleParallax
-  }), createElement(ToggleControl, {
-    label: __('Repeated background'),
-    checked: isRepeated,
-    onChange: toggleIsRepeated
-  })), showFocalPointPicker && createElement(FocalPointPicker, {
-    label: __('Focal point picker'),
-    url: url,
-    value: focalPoint,
-    onDragStart: imperativeFocalPointPreview,
-    onDrag: imperativeFocalPointPreview,
-    onChange: newFocalPoint => setAttributes({
-      focalPoint: newFocalPoint
-    })
-  }), !useFeaturedImage && url && isImageBackground && isImgElement && createElement(TextareaControl, {
-    label: __('Alt text (alternative text)'),
-    value: alt,
-    onChange: newAlt => setAttributes({
-      alt: newAlt
-    }),
-    help: createElement(Fragment, null, createElement(ExternalLink, {
-      href: "https://www.w3.org/WAI/tutorials/images/decision-tree"
-    }, __('Describe the purpose of the image')), __('Leave empty if the image is purely decorative.'))
-  }), createElement(PanelRow, null, createElement(Button, {
-    variant: "secondary",
-    isSmall: true,
-    className: "block-library-cover__reset-button",
-    onClick: () => setAttributes({
-      url: undefined,
-      id: undefined,
-      backgroundType: undefined,
-      focalPoint: undefined,
-      hasParallax: undefined,
-      isRepeated: undefined,
-      useFeaturedImage: false
-    })
-  }, __('Clear Media')))), createElement(PanelColorGradientSettings, {
-    __experimentalHasMultipleOrigins: true,
-    __experimentalIsRenderedInSidebar: true,
-    title: __('Overlay'),
-    initialOpen: true,
-    settings: [{
-      colorValue: overlayColor.color,
-      gradientValue,
-      onColorChange: setOverlayColor,
-      onGradientChange: setGradient,
-      label: __('Color')
-    }]
-  }, createElement(RangeControl, {
-    label: __('Opacity'),
-    value: dimRatio,
-    onChange: newDimRation => setAttributes({
-      dimRatio: newDimRation
-    }),
-    min: 0,
-    max: 100,
-    step: 10,
-    required: true
-  }))), createElement(InspectorControls, {
-    __experimentalGroup: "dimensions"
-  }, createElement(ToolsPanelItem, {
-    hasValue: () => !!minHeight,
-    label: __('Minimum height'),
-    onDeselect: () => setAttributes({
-      minHeight: undefined,
-      minHeightUnit: undefined
-    }),
-    resetAllFilter: () => ({
-      minHeight: undefined,
-      minHeightUnit: undefined
-    }),
-    isShownByDefault: true,
-    panelId: clientId
-  }, createElement(CoverHeightInput, {
-    value: minHeight,
-    unit: minHeightUnit,
-    onChange: newMinHeight => setAttributes({
-      minHeight: newMinHeight
-    }),
-    onUnitChange: nextUnit => setAttributes({
-      minHeightUnit: nextUnit
-    })
-  }))));
-  const ref = useRef();
-  const blockProps = useBlockProps({
-    ref
-  }); // Check for fontSize support before we pass a fontSize attribute to the innerBlocks.
-
-  const hasFontSizes = !!((_useSetting = useSetting('typography.fontSizes')) !== null && _useSetting !== void 0 && _useSetting.length);
-  const innerBlocksTemplate = getInnerBlocksTemplate({
-    fontSize: hasFontSizes ? 'large' : undefined
-  });
-  const innerBlocksProps = useInnerBlocksProps({
-    className: 'wp-block-cover__inner-container'
-  }, {
-    template: innerBlocksTemplate,
-    templateInsertUpdatesSelection: true,
-    allowedBlocks,
-    templateLock
-  });
-
-  if (!hasInnerBlocks && !hasBackground) {
-    return createElement(Fragment, null, controls, createElement("div", _extends({}, blockProps, {
-      className: classnames('is-placeholder', blockProps.className)
-    }), createElement(CoverPlaceholder, {
-      onSelectMedia: onSelectMedia,
-      onError: onUploadError,
-      style: {
-        minHeight: minHeightWithUnit || undefined
-      }
-    }, createElement("div", {
-      className: "wp-block-cover__placeholder-background-options"
-    }, createElement(ColorPalette, {
-      disableCustomColors: true,
-      value: overlayColor.color,
-      onChange: setOverlayColor,
-      clearable: false
-    }))), createElement(ResizableCover, {
-      className: "block-library-cover__resize-container",
-      onResizeStart: () => {
-        setAttributes({
-          minHeightUnit: 'px'
-        });
-        toggleSelection(false);
-      },
-      onResize: value => {
-        setAttributes({
-          minHeight: value
-        });
-      },
-      onResizeStop: newMinHeight => {
-        toggleSelection(true);
-        setAttributes({
-          minHeight: newMinHeight
-        });
-      },
-      showHandle: isSelected
-    })));
-  }
-
-  const classes = classnames({
-    'is-dark-theme': isDark,
-    'is-light': !isDark,
-    'is-transient': isUploadingMedia,
-    'has-parallax': hasParallax,
-    'is-repeated': isRepeated,
-    'has-custom-content-position': !isContentPositionCenter(contentPosition)
-  }, getPositionClassName(contentPosition));
-  return createElement(Fragment, null, controls, createElement("div", _extends({}, blockProps, {
-    className: classnames(classes, blockProps.className),
-    style: { ...style,
-      ...blockProps.style
-    },
-    "data-url": url
-  }), createElement(ResizableCover, {
-    className: "block-library-cover__resize-container",
-    onResizeStart: () => {
-      setAttributes({
-        minHeightUnit: 'px'
-      });
-      toggleSelection(false);
-    },
-    onResize: value => {
-      setAttributes({
-        minHeight: value
-      });
-    },
-    onResizeStop: newMinHeight => {
-      toggleSelection(true);
-      setAttributes({
-        minHeight: newMinHeight
-      });
-    },
-    showHandle: isSelected
-  }), createElement("span", {
-    "aria-hidden": "true",
-    className: classnames('wp-block-cover__background', dimRatioToClass(dimRatio), {
-      [overlayColor.class]: overlayColor.class,
-      'has-background-dim': dimRatio !== undefined,
-      // For backwards compatibility. Former versions of the Cover Block applied
-      // `.wp-block-cover__gradient-background` in the presence of
-      // media, a gradient and a dim.
-      'wp-block-cover__gradient-background': url && gradientValue && dimRatio !== 0,
-      'has-background-gradient': gradientValue,
-      [gradientClass]: gradientClass
-    }),
-    style: {
-      backgroundImage: gradientValue,
-      ...bgStyle
-    }
-  }), url && isImageBackground && isImgElement && createElement("img", {
-    ref: isDarkElement,
-    className: "wp-block-cover__image-background",
-    alt: alt,
-    src: url,
-    style: mediaStyle
-  }), url && isVideoBackground && createElement("video", {
-    ref: isDarkElement,
-    className: "wp-block-cover__video-background",
-    autoPlay: true,
-    muted: true,
-    loop: true,
-    src: url,
-    style: mediaStyle
-  }), isUploadingMedia && createElement(Spinner, null), createElement(CoverPlaceholder, {
-    disableMediaButtons: true,
-    onSelectMedia: onSelectMedia,
-    onError: onUploadError
-  }), createElement("div", innerBlocksProps)));
-}
-
-export default compose([withColors({
-  overlayColor: 'background-color'
-})])(CoverEdit);
-//# sourceMappingURL=edit.js.map