* @property {string} id The id of the element to which labels and help text are being generated.
* That element should be passed as a child.
* @property {import('react').ReactNode} help If this property is added, a help text will be
* generated using help property as the content.
* @property {import('react').ReactNode} label If this property is added, a label will be generated
* using label property as the content.
* @property {boolean} [hideLabelFromVision] If true, the label will only be visible to screen readers.
* @property {string} [className] The class that will be added with "components-base-control" to the
* classes of the wrapper div. If no className is passed only
* components-base-control is used.
* @property {import('react').ReactNode} [children] The content to be displayed within
* @return {JSX.Element} Element
function BaseControl(_ref) {
hideLabelFromVision = _ref.hideLabelFromVision,
className = _ref.className,
children = _ref.children;
return Object(external_wp_element_["createElement"])(base_control_styles_Wrapper, {
className: classnames_default()('components-base-control', className)
}, Object(external_wp_element_["createElement"])(StyledField, {
className: "components-base-control__field"
}, label && id && (hideLabelFromVision ? Object(external_wp_element_["createElement"])(visually_hidden["a" /* default */], {
}, label) : Object(external_wp_element_["createElement"])(StyledLabel, {
className: "components-base-control__label",
}, label)), label && !id && (hideLabelFromVision ? Object(external_wp_element_["createElement"])(visually_hidden["a" /* default */], {
}, label) : Object(external_wp_element_["createElement"])(BaseControl.VisualLabel, null, label)), children), !!help && Object(external_wp_element_["createElement"])(StyledHelp, {
className: "components-base-control__help"
* @typedef VisualLabelProps
* @property {string} [className] Class name
* @property {import('react').ReactNode} [children] Children
* @param {VisualLabelProps} Props
* @return {JSX.Element} Element
BaseControl.VisualLabel = function (_ref2) {
var className = _ref2.className,
children = _ref2.children;
className = classnames_default()('components-base-control__label', className);
return Object(external_wp_element_["createElement"])("span", {
/* harmony default export */ var base_control = (BaseControl);
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/styles/flex-styles.js
function flex_styles_EMOTION_STRINGIFIED_CSS_ERROR_() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
var flex_styles_alignStyle = function alignStyle(_ref2) {
var value = aligns[align] || align;
return /*#__PURE__*/Object(core_browser_esm["b" /* css */])({
}, true ? "" : undefined);
var flex_styles_justifyStyle = function justifyStyle(_ref3) {
var justify = _ref3.justify,
isReversed = _ref3.isReversed;
var value = justifies[justify] || justify;
if (isReversed && justifies[justify]) {
value = justify === 'left' ? justifies.right : justifies.left;
return /*#__PURE__*/Object(core_browser_esm["b" /* css */])({
}, true ? "" : undefined);
var flex_styles_gapStyle = function gapStyle(_ref4) {
isReversed = _ref4.isReversed;
var value = typeof gap === 'number' ? base * gap : base;
var dir = isReversed ? 'left' : 'right';
var margin = "margin-".concat(dir);
return /*#__PURE__*/Object(core_browser_esm["b" /* css */])("> *{", margin, ":", value, "px;&:last-child{", margin, ":0;}}" + ( true ? "" : undefined));
var flex_styles_ref = true ? {
styles: "flex-direction:row-reverse;"
var reversedStyles = function reversedStyles(_ref5) {
var isReversed = _ref5.isReversed;
if (!isReversed) return '';
var Flex = styled_base_browser_esm("div", {
})("box-sizing:border-box;display:flex;width:100%;", flex_styles_alignStyle, " ", flex_styles_justifyStyle, " ", flex_styles_gapStyle, " ", reversedStyles, true ? "" : undefined);
var Item = styled_base_browser_esm("div", {
styles: "box-sizing:border-box;min-width:0;max-width:100%;"
var Block = /*#__PURE__*/styled_base_browser_esm(Item, {
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/block.js
function FlexBlock(_ref, ref) {
var className = _ref.className,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["className"]);
var classes = classnames_default()('components-flex__block', className);
return Object(external_wp_element_["createElement"])(Block, Object(esm_extends["a" /* default */])({}, props, {
/* harmony default export */ var block = (Object(external_wp_element_["forwardRef"])(FlexBlock));
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/item.js
function FlexItem(_ref, ref) {
var className = _ref.className,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["className"]);
var classes = classnames_default()('components-flex__item', className);
return Object(external_wp_element_["createElement"])(Item, Object(esm_extends["a" /* default */])({}, props, {
/* harmony default export */ var flex_item = (Object(external_wp_element_["forwardRef"])(FlexItem));
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/index.js
function FlexComponent(_ref, ref) {
var _ref$align = _ref.align,
align = _ref$align === void 0 ? 'center' : _ref$align,
className = _ref.className,
gap = _ref$gap === void 0 ? 2 : _ref$gap,
_ref$justify = _ref.justify,
justify = _ref$justify === void 0 ? 'space-between' : _ref$justify,
_ref$isReversed = _ref.isReversed,
isReversed = _ref$isReversed === void 0 ? false : _ref$isReversed,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["align", "className", "gap", "justify", "isReversed"]);
var classes = classnames_default()('components-flex', className);
return Object(external_wp_element_["createElement"])(Flex, Object(esm_extends["a" /* default */])({}, props, {
var flex_Flex = Object(external_wp_element_["forwardRef"])(FlexComponent);
/* harmony default export */ var flex = (flex_Flex);
// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js
function _taggedTemplateLiteral(strings, raw) {
return Object.freeze(Object.defineProperties(strings, {
value: Object.freeze(raw)
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/styles/font-family.js
var fontFamily = "font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto,\nOxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif;";
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/styles/emotion-css.js
/* harmony default export */ var emotion_css = (core_browser_esm["b" /* css */]);
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/styles/text-mixins.js
function _templateObject9() {
var data = _taggedTemplateLiteral(["\n\t", "\n\t", "\n"]);
_templateObject9 = function _templateObject9() {
function _templateObject8() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject8 = function _templateObject8() {
function _templateObject7() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject7 = function _templateObject7() {
function _templateObject6() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t"]);
_templateObject6 = function _templateObject6() {
function _templateObject5() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject5 = function _templateObject5() {
function _templateObject4() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject4 = function _templateObject4() {
function _templateObject3() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject3 = function _templateObject3() {
function _templateObject2() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject2 = function _templateObject2() {
function _templateObject() {
var data = _taggedTemplateLiteral(["\n\t\t\t\t", "\n\t\t\t\t", "\n\t\t\t"]);
_templateObject = function _templateObject() {
var fontWeightNormal = "font-weight: 400;";
var fontWeightMedium = "font-weight: 500;";
var fontWeightSemibold = "font-weight: 600;";
var text_mixins_title = "\n ".concat(fontWeightNormal, "\n");
var titleLarge = "\n\tfont-size: 32px;\n\tline-height: 40px;\n";
var titleMedium = "\n\tfont-size: 24px;\n\tline-height: 32px;\n";
var titleSmall = "\n\tfont-size: 20px;\n\tline-height: 28px;\n";
var subtitle = "\n\t".concat(fontWeightSemibold, "\n\tfont-size: 14px;\n\tline-height: 20px;\n");
var subtitleLarge = "\n\tfont-size: 16px;\n\tline-height: 24px;\n";
var subtitleSmall = "\n\tfont-size: 14px;\n\tline-height: 20px;\n";
var text_mixins_body = "\n\t".concat(fontWeightNormal, "\n");
var bodyLarge = "\n\tfont-size: 16px;\n\tline-height: 24px;\n";
var bodySmall = "\n\tfont-size: 14px;\n\tline-height: 20px;\n";
var text_mixins_button = "\n ".concat(fontWeightSemibold, "\n font-size: 14px;\n line-height: 20px;\n");
var caption = "\n\t".concat(fontWeightNormal, "\n\tfont-size: 12px;\n\tline-height: 16px;\n");
var text_mixins_label = "\n\t".concat(fontWeightSemibold, "\n\tfont-size: 12px;\n\tline-height: 16px;\n");
var sectionHeading = "\n\t".concat(fontWeightMedium, "\n\tfont-size: 11px;\n\tline-height: 1.4;\n\ttext-transform: uppercase;\n\tcolor: ").concat(G2.gray[700], "\n");
* @typedef {'title.large'|'title.medium'|'title.small'|'subtitle'|'subtitle.small'|'body'|'body.large'|'body.small'|'button'|'caption'|'label'|'sectionheading'} TextVariant
* @param {TextVariant} variantName
var text_mixins_variant = function variant() {
var variantName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'body';
return emotion_css(_templateObject(), text_mixins_title, titleLarge);
return emotion_css(_templateObject2(), text_mixins_title, titleMedium);
return emotion_css(_templateObject3(), text_mixins_title, titleSmall);
return emotion_css(_templateObject4(), subtitle, subtitleLarge);
return emotion_css(_templateObject5(), subtitle, subtitleSmall);
return emotion_css(_templateObject6(), text_mixins_body);
return emotion_css(_templateObject7(), text_mixins_body, bodyLarge);
return emotion_css(_templateObject8(), text_mixins_body, bodySmall);
return text_mixins_button;
return text_mixins_label;
* @typedef {Object} TextProps
* @property {TextVariant} variant one of TextVariant to be used
* @param {TextProps} props
var text_mixins_text = function text(props) {
return emotion_css(_templateObject9(), fontFamily, text_mixins_variant(props.variant));
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/context/with-next.js
* @template {{}} TCurrentProps
* @template {{}} TNextProps
* @param {import('react').ComponentType<TCurrentProps>} CurrentComponent
* @param {import('react').ComponentType<TNextProps>} NextComponent
* @param {string} namespace
* @param {(props: TCurrentProps) => TNextProps} adapter
var CurrentComponent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
var NextComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {
var namespace = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'Component';
var adapter = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function (p) {
if (false) { var WrappedComponent; }
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/next.js