} A props object with the namespaced HTML attribute.
*/
function getConnectedNamespace() {
return {
[CONNECTED_NAMESPACE]: true
};
}
// EXTERNAL MODULE: ./node_modules/memize/index.js
var memize = __webpack_require__(9756);
var memize_default = /*#__PURE__*/__webpack_require__.n(memize);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/context/get-styled-class-name-from-key.js
/**
* External dependencies
*/
/**
* Generates the connected component CSS className based on the namespace.
*
* @param namespace The name of the connected component.
* @return The generated CSS className.
*/
function getStyledClassName(namespace) {
const kebab = (0,external_lodash_namespaceObject.kebabCase)(namespace);
return `components-${kebab}`;
}
const getStyledClassNameFromKey = memize_default()(getStyledClassName);
;// CONCATENATED MODULE: ./node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js
/*
Based off glamor's StyleSheet, thanks Sunil ❤️
high performance StyleSheet for css-in-js systems
- uses multiple style tags behind the scenes for millions of rules
- uses `insertRule` for appending in production for *much* faster performance
// usage
import { StyleSheet } from '@emotion/sheet'
let styleSheet = new StyleSheet({ key: '', container: document.head })
styleSheet.insert('#box { border: 1px solid red; }')
- appends a css rule into the stylesheet
styleSheet.flush()
- empties the stylesheet of all its contents
*/
// $FlowFixMe
function sheetForTag(tag) {
if (tag.sheet) {
// $FlowFixMe
return tag.sheet;
} // this weirdness brought to you by firefox
/* istanbul ignore next */
for (var i = 0; i < document.styleSheets.length; i++) {
if (document.styleSheets[i].ownerNode === tag) {
// $FlowFixMe
return document.styleSheets[i];
}
}
}
function createStyleElement(options) {
var tag = document.createElement('style');
tag.setAttribute('data-emotion', options.key);
if (options.nonce !== undefined) {
tag.setAttribute('nonce', options.nonce);
}
tag.appendChild(document.createTextNode(''));
tag.setAttribute('data-s', '');
return tag;
}
var StyleSheet = /*#__PURE__*/function () {
// Using Node instead of HTMLElement since container may be a ShadowRoot
function StyleSheet(options) {
var _this = this;
this._insertTag = function (tag) {
var before;
if (_this.tags.length === 0) {
if (_this.insertionPoint) {
before = _this.insertionPoint.nextSibling;
} else if (_this.prepend) {
before = _this.container.firstChild;
} else {
before = _this.before;
}
} else {
before = _this.tags[_this.tags.length - 1].nextSibling;
}
_this.container.insertBefore(tag, before);
_this.tags.push(tag);
};
this.isSpeedy = options.speedy === undefined ? "production" === 'production' : options.speedy;
this.tags = [];
this.ctr = 0;
this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets
this.key = options.key;
this.container = options.container;
this.prepend = options.prepend;
this.insertionPoint = options.insertionPoint;
this.before = null;
}
var _proto = StyleSheet.prototype;
_proto.hydrate = function hydrate(nodes) {
nodes.forEach(this._insertTag);
};
_proto.insert = function insert(rule) {
// the max length is how many rules we have per style tag, it's 65000 in speedy mode
// it's 1 in dev because we insert source maps that map a single rule to a location
// and you can only have one source map per style tag
if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
this._insertTag(createStyleElement(this));
}
var tag = this.tags[this.tags.length - 1];
if (false) { var isImportRule; }
if (this.isSpeedy) {
var sheet = sheetForTag(tag);
try {
// this is the ultrafast version, works across browsers
// the big drawback is that the css won't be editable in devtools
sheet.insertRule(rule, sheet.cssRules.length);
} catch (e) {
if (false) {}
}
} else {
tag.appendChild(document.createTextNode(rule));
}
this.ctr++;
};
_proto.flush = function flush() {
// $FlowFixMe
this.tags.forEach(function (tag) {
return tag.parentNode && tag.parentNode.removeChild(tag);
});
this.tags = [];
this.ctr = 0;
if (false) {}
};
return StyleSheet;
}();
;// CONCATENATED MODULE: ./node_modules/stylis/src/Utility.js
/**
* @param {number}
* @return {number}
*/
var abs = Math.abs
/**
* @param {number}
* @return {string}
*/
var Utility_from = String.fromCharCode
/**
* @param {object}
* @return {object}
*/
var Utility_assign = Object.assign
/**
* @param {string} value
* @param {number} length
* @return {number}
*/
function hash (value, length) {
return Utility_charat(value, 0) ^ 45 ? (((((((length << 2) ^ Utility_charat(value, 0)) << 2) ^ Utility_charat(value, 1)) << 2) ^ Utility_charat(value, 2)) << 2) ^ Utility_charat(value, 3) : 0
}
/**
* @param {string} value
* @return {string}
*/
function trim (value) {
return value.trim()
}
/**
* @param {string} value
* @param {RegExp} pattern
* @return {string?}
*/
function Utility_match (value, pattern) {
return (value = pattern.exec(value)) ? value[0] : value
}
/**
* @param {string} value
* @param {(string|RegExp)} pattern
* @param {string} replacement
* @return {string}
*/
function Utility_replace (value, pattern, replacement) {
return value.replace(pattern, replacement)
}
/**
* @param {string} value
* @param {string} search
* @return {number}
*/
function indexof (value, search) {
return value.indexOf(search)
}
/**
* @param {string} value
* @param {number} index
* @return {number}
*/
function Utility_charat (value, index) {
return value.charCodeAt(index) | 0
}
/**
* @param {string} value
* @param {number} begin
* @param {number} end
* @return {string}
*/
function Utility_substr (value, begin, end) {
return value.slice(begin, end)
}
/**
* @param {string} value
* @return {number}
*/
function Utility_strlen (value) {
return value.length
}
/**
* @param {any[]} value
* @return {number}
*/
function Utility_sizeof (value) {
return value.length
}
/**
* @param {any} value
* @param {any[]} array
* @return {any}
*/
function Utility_append (value, array) {
return array.push(value), value
}
/**
* @param {string[]} array
* @param {function} callback
* @return {string}
*/
function Utility_combine (array, callback) {
return array.map(callback).join('')
}
;// CONCATENATED MODULE: ./node_modules/stylis/src/Tokenizer.js
var line = 1
var column = 1
var Tokenizer_length = 0
var position = 0
var character = 0
var characters = ''
/**
* @param {string} value
* @param {object | null} root
* @param {object | null} parent
* @param {string} type
* @param {string[] | string} props
* @param {object[] | string} children
* @param {number} length
*/
function node (value, root, parent, type, props, children, length) {
return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}
}
/**
* @param {object} root
* @param {object} props
* @return {object}
*/
function Tokenizer_copy (root, props) {
return Utility_assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)
}
/**
* @return {number}
*/
function Tokenizer_char () {
return character
}
/**
* @return {number}
*/
function prev () {
character = position > 0 ? Utility_charat(characters, --position) : 0
if (column--, character === 10)
column = 1, line--
return character
}
/**
* @return {number}
*/
function next () {
character = position < Tokenizer_length ? Utility_charat(characters, position++) : 0
if (column++, character === 10)
column = 1, line++
return character
}
/**
* @return {number}
*/
function peek () {
return Utility_charat(characters, position)
}
/**
* @return {number}
*/
function caret () {
return position
}
/**
* @param {number} begin
* @param {number} end
* @return {string}
*/
function slice (begin, end) {
return Utility_substr(characters, begin, end)
}
/**
* @param {number} type
* @return {number}
*/
function token (type) {
switch (type) {
// \0 \t \n \r \s whitespace token
case 0: case 9: case 10: case 13: case 32:
return 5
// ! + , / > @ ~ isolate token
case 33: case 43: case 44: case 47: case 62: case 64: case 126:
// ; { } breakpoint token
case 59: case 123: case 125:
return 4
// : accompanied token
case 58:
return 3
// " ' ( [ opening delimit token
case 34: case 39: case 40: case 91:
return 2
// ) ] closing delimit token
case 41: case 93:
return 1
}
return 0
}
/**
* @param {string} value
* @return {any[]}
*/
function alloc (value) {
return line = column = 1, Tokenizer_length = Utility_strlen(characters = value), position = 0, []
}
/**
* @param {any} value
* @return {any}
*/
function dealloc (value) {
return characters = '', value
}
/**
* @param {number} type
* @return {string}
*/
function delimit (type) {
return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
}
/**
* @param {string} value
* @return {string[]}
*/
function Tokenizer_tokenize (value) {
return dealloc(tokenizer(alloc(value)))
}
/**
* @param {number} type
* @return {string}
*/
function whitespace (type) {
while (character = peek())
if (character < 33)
next()
else
break
return token(type) > 2 || token(character) > 3 ? '' : ' '
}
/**
* @param {string[]} children
* @return {string[]}
*/
function tokenizer (children) {
while (next())
switch (token(character)) {
case 0: append(identifier(position - 1), children)
break
case 2: append(delimit(character), children)
break
default: append(from(character), children)
}
return children
}
/**
* @param {number} index
* @param {number} count
* @return {string}
*/
function escaping (index, count) {
while (--count && next())
// not 0-9 A-F a-f
if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
break
return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
}
/**
* @param {number} type
* @return {number}
*/
function delimiter (type) {
while (next())
switch (character) {
// ] ) " '
case type:
return position
// " '
case 34: case 39:
if (type !== 34 && type !== 39)
delimiter(character)
break
// (
case 40:
if (type === 41)
delimiter(type)
break
// \
case 92:
next()
break
}
return position
}
/**
* @param {number} type
* @param {number} index
* @return {number}
*/
function commenter (type, index) {
while (next())
// //
if (type + character === 47 + 10)
break
// /*
else if (type + character === 42 + 42 && peek() === 47)
break
return '/*' + slice(index, position - 1) + '*' + Utility_from(type === 47 ? type : next())
}
/**
* @param {number} index
* @return {string}
*/
function identifier (index) {
while (!token(peek()))
next()
return slice(index, position)
}
;// CONCATENATED MODULE: ./node_modules/stylis/src/Enum.js
var Enum_MS = '-ms-'
var Enum_MOZ = '-moz-'
var Enum_WEBKIT = '-webkit-'
var COMMENT = 'comm'
var Enum_RULESET = 'rule'
var Enum_DECLARATION = 'decl'
var PAGE = '@page'
var MEDIA = '@media'
var IMPORT = '@import'
var CHARSET = '@charset'
var VIEWPORT = '@viewport'
var SUPPORTS = '@supports'
var DOCUMENT = '@document'
var NAMESPACE = '@namespace'
var Enum_KEYFRAMES = '@keyframes'
var FONT_FACE = '@font-face'
var COUNTER_STYLE = '@counter-style'
var FONT_FEATURE_VALUES = '@font-feature-values'
var LAYER = '@layer'
;// CONCATENATED MODULE: ./node_modules/stylis/src/Serializer.js
/**
* @param {object[]} children
* @param {function} callback
* @return {string}
*/
function Serializer_serialize (children, callback) {
var output = ''
var length = Utility_sizeof(children)
for (var i = 0; i < length; i++)
output += callback(children[i], i, children, callback) || ''
return output
}
/**
* @param {object} element
* @param {number} index
* @param {object[]} children
* @param {function} callback
* @return {string}
*/
function stringify (element, index, children, callback) {
switch (element.type) {
case LAYER: if (element.children.length) break
case IMPORT: case Enum_DECLARATION: return element.return = element.return || element.value
case COMMENT: return ''
case Enum_KEYFRAMES: return element.return = element.value + '{' + Serializer_serialize(element.children, callback) + '}'
case Enum_RULESET: element.value = element.props.join(',')
}
return Utility_strlen(children = Serializer_serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
}
;// CONCATENATED MODULE: ./node_modules/stylis/src/Middleware.js
/**
* @param {function[]} collection
* @return {function}
*/
function middleware (collection) {
var length = Utility_sizeof(collection)
return function (element, index, children, callback) {
var output = ''
for (var i = 0; i < length; i++)
output += collection[i](element, index, children, callback) || ''
return output
}
}
/**
* @param {function} callback
* @return {function}
*/
function rulesheet (callback) {
return function (element) {
if (!element.root)
if (element = element.return)
callback(element)
}
}
/**
* @param {object} element
* @param {number} index
* @param {object[]} children
* @param {function} callback
*/
function prefixer (element, index, children, callback) {
if (element.length > -1)
if (!element.return)
switch (element.type) {
case DECLARATION: element.return = prefix(element.value, element.length, children)
return
case KEYFRAMES:
return serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)
case RULESET:
if (element.length)
return combine(element.props, function (value) {
switch (match(value, /(::plac\w+|:read-\w+)/)) {
// :read-(only|write)
case ':read-only': case ':read-write':
return serialize([copy(element, {props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]})], callback)
// :placeholder
case '::placeholder':
return serialize([
copy(element, {props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]}),
copy(element, {props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]}),
copy(element, {props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]})
], callback)
}
return ''
})
}
}
/**
* @param {object} element
* @param {number} index
* @param {object[]} children
*/
function namespace (element) {
switch (element.type) {
case RULESET:
element.props = element.props.map(function (value) {
return combine(tokenize(value), function (value, index, children) {
switch (charat(value, 0)) {
// \f
case 12:
return substr(value, 1, strlen(value))
// \0 ( + > ~
case 0: case 40: case 43: case 62: case 126:
return value
// :
case 58:
if (children[++index] === 'global')
children[index] = '', children[++index] = '\f' + substr(children[index], index = 1, -1)
// \s
case 32:
return index === 1 ? '' : value
default:
switch (index) {
case 0: element = value
return sizeof(children) > 1 ? '' : value
case index = sizeof(children) - 1: case 2:
return index === 2 ? value + element + element : value + element
default:
return value
}
}
})
})
}
}
;// CONCATENATED MODULE: ./node_modules/stylis/src/Parser.js
/**
* @param {string} value
* @return {object[]}
*/
function compile (value) {
return dealloc(Parser_parse('', null, null, null, [''], value = alloc(value), 0, [0], value))
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {string[]} rule
* @param {string[]} rules
* @param {string[]} rulesets
* @param {number[]} pseudo
* @param {number[]} points
* @param {string[]} declarations
* @return {object}
*/
function Parser_parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
var index = 0
var offset = 0
var length = pseudo
var atrule = 0
var property = 0
var previous = 0
var variable = 1
var scanning = 1
var ampersand = 1
var character = 0
var type = ''
var props = rules
var children = rulesets
var reference = rule
var characters = type
while (scanning)
switch (previous = character, character = next()) {
// (
case 40:
if (previous != 108 && Utility_charat(characters, length - 1) == 58) {
if (indexof(characters += Utility_replace(delimit(character), '&', '&\f'), '&\f') != -1)
ampersand = -1
break
}
// " ' [
case 34: case 39: case 91:
characters += delimit(character)
break
// \t \n \r \s
case 9: case 10: case 13: case 32:
characters += whitespace(previous)
break
// \
case 92:
characters += escaping(caret() - 1, 7)
continue
// /
case 47:
switch (peek()) {
case 42: case 47:
Utility_append(comment(commenter(next(), caret()), root, parent), declarations)
break
default:
characters += '/'
}
break
// {
case 123 * variable:
points[index++] = Utility_strlen(characters) * ampersand
// } ; \0
case 125 * variable: case 59: case 0:
switch (character) {
// \0 }
case 0: case 125: scanning = 0
// ;
case 59 + offset: if (ampersand == -1) characters = Utility_replace(characters, /\f/g, '')
if (property > 0 && (Utility_strlen(characters) - length))
Utility_append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(Utility_replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations)
break
// @ ;
case 59: characters += ';'
// { rule/at-rule
default:
Utility_append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)
if (character === 123)
if (offset === 0)
Parser_parse(characters, root, reference, reference, props, rulesets, length, points, children)
else
switch (atrule === 99 && Utility_charat(characters, 3) === 110 ? 100 : atrule) {
// d l m s
case 100: case 108: case 109: case 115:
Parser_parse(value, reference, reference, rule && Utility_append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children)
break
default:
Parser_parse(characters, reference, reference, reference, [''], children, 0, points, children)
}
}
index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo
break
// :
case 58:
length = 1 + Utility_strlen(characters), property = previous
default:
if (variable < 1)
if (character == 123)
--variable
else if (character == 125 && variable++ == 0 && prev() == 125)
continue
switch (characters += Utility_from(character), character * variable) {
// &
case 38:
ampersand = offset > 0 ? 1 : (characters += '\f', -1)
break
// ,
case 44:
points[index++] = (Utility_strlen(characters) - 1) * ampersand, ampersand = 1
break
// @
case 64:
// -
if (peek() === 45)
characters += delimit(next())
atrule = peek(), offset = length = Utility_strlen(type = characters += identifier(caret())), character++
break
// -
case 45:
if (previous === 45 && Utility_strlen(characters) == 2)
variable = 0
}
}
return rulesets
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {number} index
* @param {number} offset
* @param {string[]} rules
* @param {number[]} points
* @param {string} type
* @param {string[]} props
* @param {string[]} children
* @param {number} length
* @return {object}
*/
function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {
var post = offset - 1
var rule = offset === 0 ? rules : ['']
var size = Utility_sizeof(rule)
for (var i = 0, j = 0, k = 0; i < index; ++i)
for (var x = 0, y = Utility_substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)
if (z = trim(j > 0 ? rule[x] + ' ' + y : Utility_replace(y, /&\f/g, rule[x])))
props[k++] = z
return node(value, root, parent, offset === 0 ? Enum_RULESET : type, props, children, length)
}
/**
* @param {number} value
* @param {object} root
* @param {object?} parent
* @return {object}
*/
function comment (value, root, parent) {
return node(value, root, parent, COMMENT, Utility_from(Tokenizer_char()), Utility_substr(value, 2, -2), 0)
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {number} length
* @return {object}
*/
function declaration (value, root, parent, length) {
return node(value, root, parent, Enum_DECLARATION, Utility_substr(value, 0, length), Utility_substr(value, length + 1, -1), length)
}
;// CONCATENATED MODULE: ./node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {
var previous = 0;
var character = 0;
while (true) {
previous = character;
character = peek(); // &\f
if (previous === 38 && character === 12) {
points[index] = 1;
}
if (token(character)) {
break;
}
next();
}
return slice(begin, position);
};
var toRules = function toRules(parsed, points) {
// pretend we've started with a comma
var index = -1;
var character = 44;
do {
switch (token(character)) {
case 0:
// &\f
if (character === 38 && peek() === 12) {
// this is not 100% correct, we don't account for literal sequences here - like for example quoted strings
// stylis inserts \f after & to know when & where it should replace this sequence with the context selector
// and when it should just concatenate the outer and inner selectors
// it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here
points[index] = 1;
}
parsed[index] += identifierWithPointTracking(position - 1, points, index);
break;
case 2:
parsed[index] += delimit(character);
break;
case 4:
// comma
if (character === 44) {
// colon
parsed[++index] = peek() === 58 ? '&\f' : '';
points[index] = parsed[index].length;
break;
}
// fallthrough
default:
parsed[index] += Utility_from(character);
}
} while (character = next());
return parsed;
};
var getRules = function getRules(value, points) {
return dealloc(toRules(alloc(value), points));
}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11
var fixedElements = /* #__PURE__ */new WeakMap();
var compat = function compat(element) {
if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo
// negative .length indicates that this rule has been already prefixed
element.length < 1) {
return;
}
var value = element.value,
parent = element.parent;
var isImplicitRule = element.column === parent.column && element.line === parent.line;
while (parent.type !== 'rule') {
parent = parent.parent;
if (!parent) return;
} // short-circuit for the simplest case
if (element.props.length === 1 && value.charCodeAt(0) !== 58
/* colon */
&& !fixedElements.get(parent)) {
return;
} // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)
// then the props has already been manipulated beforehand as they that array is shared between it and its "rule parent"
if (isImplicitRule) {
return;
}
fixedElements.set(element, true);
var points = [];
var rules = getRules(value, points);
var parentRules = parent.props;
for (var i = 0, k = 0; i < rules.length; i++) {
for (var j = 0; j < parentRules.length; j++, k++) {
element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i];
}
}
};
var removeLabel = function removeLabel(element) {
if (element.type === 'decl') {
var value = element.value;
if ( // charcode for l
value.charCodeAt(0) === 108 && // charcode for b
value.charCodeAt(2) === 98) {
// this ignores label
element["return"] = '';
element.value = '';
}
}
};
var ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';
var isIgnoringComment = function isIgnoringComment(element) {
return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;
};
var createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {
return function (element, index, children) {
if (element.type !== 'rule' || cache.compat) return;
var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);
if (unsafePseudoClasses) {
var isNested = !!element.parent; // in nested rules comments become children of the "auto-inserted" rule and that's always the `element.parent`
//
// considering this input:
// .a {
// .b /* comm */ {}
// color: hotpink;
// }
// we get output corresponding to this:
// .a {
// & {
// /* comm */
// color: hotpink;
// }
// .b {}
// }
var commentContainer = isNested ? element.parent.children : // global rule at the root level
children;
for (var i = commentContainer.length - 1; i >= 0; i--) {
var node = commentContainer[i];
if (node.line < element.line) {
break;
} // it is quite weird but comments are *usually* put at `column: element.column - 1`
// so we seek *from the end* for the node that is earlier than the rule's `element` and check that
// this will also match inputs like this:
// .a {
// /* comm */
// .b {}
// }
//
// but that is fine
//
// it would be the easiest to change the placement of the comment to be the first child of the rule:
// .a {
// .b { /* comm */ }
// }
// with such inputs we wouldn't have to search for the comment at all
// TODO: consider changing this comment placement in the next major version
if (node.column < element.column) {
if (isIgnoringComment(node)) {
return;
}
break;
}
}
unsafePseudoClasses.forEach(function (unsafePseudoClass) {
console.error("The pseudo class \"" + unsafePseudoClass + "\" is potentially unsafe when doing server-side rendering. Try changing it to \"" + unsafePseudoClass.split('-child')[0] + "-of-type\".");
});
}
};
};
var isImportRule = function isImportRule(element) {
return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;
};
var isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {
for (var i = index - 1; i >= 0; i--) {
if (!isImportRule(children[i])) {
return true;
}
}
return false;
}; // use this to remove incorrect elements from further processing
// so they don't get handed to the `sheet` (or anything else)
// as that could potentially lead to additional logs which in turn could be overhelming to the user
var nullifyElement = function nullifyElement(element) {
element.type = '';
element.value = '';
element["return"] = '';
element.children = '';
element.props = '';
};
var incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {
if (!isImportRule(element)) {
return;
}
if (element.parent) {
console.error("`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.");
nullifyElement(element);
} else if (isPrependedWithRegularRules(index, children)) {
console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.");
nullifyElement(element);
}
};
/* eslint-disable no-fallthrough */
function emotion_cache_browser_esm_prefix(value, length) {
switch (hash(value, length)) {
// color-adjust
case 5103:
return Enum_WEBKIT + 'print-' + value + value;
// animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
case 5737:
case 4201:
case 3177:
case 3433:
case 1641:
case 4457:
case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
case 5572:
case 6356:
case 5844:
case 3191:
case 6645:
case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
case 6391:
case 5879:
case 5623:
case 6135:
case 4599:
case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
case 4215:
case 6389:
case 5109:
case 5365:
case 5621:
case 3829:
return Enum_WEBKIT + value + value;
// appearance, user-select, transform, hyphens, text-size-adjust
case 5349:
case 4246:
case 4810:
case 6968:
case 2756:
return Enum_WEBKIT + value + Enum_MOZ + value + Enum_MS + value + value;
// flex, flex-direction
case 6828:
case 4268:
return Enum_WEBKIT + value + Enum_MS + value + value;
// order
case 6165:
return Enum_WEBKIT + value + Enum_MS + 'flex-' + value + value;
// align-items
case 5187:
return Enum_WEBKIT + value + Utility_replace(value, /(\w+).+(:[^]+)/, Enum_WEBKIT + 'box-$1$2' + Enum_MS + 'flex-$1$2') + value;
// align-self
case 5443:
return Enum_WEBKIT + value + Enum_MS + 'flex-item-' + Utility_replace(value, /flex-|-self/, '') + value;
// align-content
case 4675:
return Enum_WEBKIT + value + Enum_MS + 'flex-line-pack' + Utility_replace(value, /align-content|flex-|-self/, '') + value;
// flex-shrink
case 5548:
return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'shrink', 'negative') + value;
// flex-basis
case 5292:
return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'basis', 'preferred-size') + value;
// flex-grow
case 6060:
return Enum_WEBKIT + 'box-' + Utility_replace(value, '-grow', '') + Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'grow', 'positive') + value;
// transition
case 4554:
return Enum_WEBKIT + Utility_replace(value, /([^-])(transform)/g, '$1' + Enum_WEBKIT + '$2') + value;
// cursor
case 6187:
return Utility_replace(Utility_replace(Utility_replace(value, /(zoom-|grab)/, Enum_WEBKIT + '$1'), /(image-set)/, Enum_WEBKIT + '$1'), value, '') + value;
// background, background-image
case 5495:
case 3959:
return Utility_replace(value, /(image-set\([^]*)/, Enum_WEBKIT + '$1' + '$`$1');
// justify-content
case 4968:
return Utility_replace(Utility_replace(value, /(.+:)(flex-)?(.*)/, Enum_WEBKIT + 'box-pack:$3' + Enum_MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + Enum_WEBKIT + value + value;
// (margin|padding)-inline-(start|end)
case 4095:
case 3583:
case 4068:
case 2532:
return Utility_replace(value, /(.+)-inline(.+)/, Enum_WEBKIT + '$1$2') + value;
// (min|max)?(width|height|inline-size|block-size)
case 8116:
case 7059:
case 5753:
case 5535:
case 5445:
case 5701:
case 4933:
case 4677:
case 5533:
case 5789:
case 5021:
case 4765:
// stretch, max-content, min-content, fill-available
if (Utility_strlen(value) - 1 - length > 6) switch (Utility_charat(value, length + 1)) {
// (m)ax-content, (m)in-content
case 109:
// -
if (Utility_charat(value, length + 4) !== 45) break;
// (f)ill-available, (f)it-content
case 102:
return Utility_replace(value, /(.+:)(.+)-([^]+)/, '$1' + Enum_WEBKIT + '$2-$3' + '$1' + Enum_MOZ + (Utility_charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
// (s)tretch
case 115:
return ~indexof(value, 'stretch') ? emotion_cache_browser_esm_prefix(Utility_replace(value, 'stretch', 'fill-available'), length) + value : value;
}
break;
// position: sticky
case 4949:
// (s)ticky?
if (Utility_charat(value, length + 1) !== 115) break;
// display: (flex|inline-flex)
case 6444:
switch (Utility_charat(value, Utility_strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
// stic(k)y
case 107:
return Utility_replace(value, ':', ':' + Enum_WEBKIT) + value;
// (inline-)?fl(e)x
case 101:
return Utility_replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + Enum_WEBKIT + (Utility_charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + Enum_WEBKIT + '$2$3' + '$1' + Enum_MS + '$2box$3') + value;
}
break;
// writing-mode
case 5936:
switch (Utility_charat(value, length + 11)) {
// vertical-l(r)
case 114:
return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
// vertical-r(l)
case 108:
return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
// horizontal(-)tb
case 45:
return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
}
return Enum_WEBKIT + value + Enum_MS + value + value;
}
return value;
}
var emotion_cache_browser_esm_prefixer = function prefixer(element, index, children, callback) {
if (element.length > -1) if (!element["return"]) switch (element.type) {
case Enum_DECLARATION:
element["return"] = emotion_cache_browser_esm_prefix(element.value, element.length);
break;
case Enum_KEYFRAMES:
return Serializer_serialize([Tokenizer_copy(element, {
value: Utility_replace(element.value, '@', '@' + Enum_WEBKIT)
})], callback);
case Enum_RULESET:
if (element.length) return Utility_combine(element.props, function (value) {
switch (Utility_match(value, /(::plac\w+|:read-\w+)/)) {
// :read-(only|write)
case ':read-only':
case ':read-write':
return Serializer_serialize([Tokenizer_copy(element, {
props: [Utility_replace(value, /:(read-\w+)/, ':' + Enum_MOZ + '$1')]
})], callback);
// :placeholder
case '::placeholder':
return Serializer_serialize([Tokenizer_copy(element, {
props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_WEBKIT + 'input-$1')]
}), Tokenizer_copy(element, {
props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_MOZ + '$1')]
}), Tokenizer_copy(element, {
props: [Utility_replace(value, /:(plac\w+)/, Enum_MS + 'input-$1')]
})], callback);
}
return '';
});
}
};
var defaultStylisPlugins = [emotion_cache_browser_esm_prefixer];
var createCache = function createCache(options) {
var key = options.key;
if (false) {}
if (key === 'css') {
var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])"); // get SSRed styles out of the way of React's hydration
// document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)
// note this very very intentionally targets all style elements regardless of the key to ensure
// that creating a cache works inside of render of a React component
Array.prototype.forEach.call(ssrStyles, function (node) {
// we want to only move elements which have a space in the data-emotion attribute value
// because that indicates that it is an Emotion 11 server-side rendered style elements
// while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector
// Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)
// so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles
// will not result in the Emotion 10 styles being destroyed
var dataEmotionAttribute = node.getAttribute('data-emotion');
if (dataEmotionAttribute.indexOf(' ') === -1) {
return;
}
document.head.appendChild(node);
node.setAttribute('data-s', '');
});
}
var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;
if (false) {}
var inserted = {};
var container;
var nodesToHydrate = [];
{
container = options.container || document.head;
Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which
// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
for (var i = 1; i < attrib.length; i++) {
inserted[attrib[i]] = true;
}
nodesToHydrate.push(node);
});
}
var _insert;
var omnipresentPlugins = [compat, removeLabel];
if (false) {}
{
var currentSheet;
var finalizingPlugins = [stringify, false ? 0 : rulesheet(function (rule) {
currentSheet.insert(rule);
})];
var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));
var stylis = function stylis(styles) {
return Serializer_serialize(compile(styles), serializer);
};
_insert = function insert(selector, serialized, sheet, shouldCache) {
currentSheet = sheet;
if (false) {}
stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
if (shouldCache) {
cache.inserted[serialized.name] = true;
}
};
}
var cache = {
key: key,
sheet: new StyleSheet({
key: key,
container: container,
nonce: options.nonce,
speedy: options.speedy,
prepend: options.prepend,
insertionPoint: options.insertionPoint
}),
nonce: options.nonce,
inserted: inserted,
registered: {},
insert: _insert
};
cache.sheet.hydrate(nodesToHydrate);
return cache;
};
;// CONCATENATED MODULE: ./node_modules/@emotion/hash/dist/emotion-hash.esm.js
/* eslint-disable */
// Inspired by https://github.com/garycourt/murmurhash-js
// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
function murmur2(str) {
// 'm' and 'r' are mixing constants generated offline.
// They're not really 'magic', they just happen to work well.
// const m = 0x5bd1e995;
// const r = 24;
// Initialize the hash
var h = 0; // Mix 4 bytes at a time into the hash
var k,
i = 0,
len = str.length;
for (; len >= 4; ++i, len -= 4) {
k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
k =
/* Math.imul(k, m): */
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
k ^=
/* k >>> r: */
k >>> 24;
h =
/* Math.imul(k, m): */
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
} // Handle the last few bytes of the input array
switch (len) {
case 3:
h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
case 2:
h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
case 1:
h ^= str.charCodeAt(i) & 0xff;
h =
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
} // Do a few final mixes of the hash to ensure the last few
// bytes are well-incorporated.
h ^= h >>> 13;
h =
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
return ((h ^ h >>> 15) >>> 0).toString(36);
}
;// CONCATENATED MODULE: ./node_modules/@emotion/unitless/dist/emotion-unitless.esm.js
var unitlessKeys = {
animationIterationCount: 1,
aspectRatio: 1,
borderImageOutset: 1,
borderImageSlice: 1,
borderImageWidth: 1,
boxFlex: 1,
boxFlexGroup: 1,
boxOrdinalGroup: 1,
columnCount: 1,
columns: 1,
flex: 1,
flexGrow: 1,
flexPositive: 1,
flexShrink: 1,
flexNegative: 1,
flexOrder: 1,
gridRow: 1,
gridRowEnd: 1,
gridRowSpan: 1,
gridRowStart: 1,
gridColumn: 1,
gridColumnEnd: 1,
gridColumnSpan: 1,
gridColumnStart: 1,
msGridRow: 1,
msGridRowSpan: 1,
msGridColumn: 1,
msGridColumnSpan: 1,
fontWeight: 1,
lineHeight: 1,
opacity: 1,
order: 1,
orphans: 1,
tabSize: 1,
widows: 1,
zIndex: 1,
zoom: 1,
WebkitLineClamp: 1,
// SVG-related properties
fillOpacity: 1,
floodOpacity: 1,
stopOpacity: 1,
strokeDasharray: 1,
strokeDashoffset: 1,
strokeMiterlimit: 1,
strokeOpacity: 1,
strokeWidth: 1
};
;// CONCATENATED MODULE: ./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
function memoize(fn) {
var cache = Object.create(null);
return function (arg) {
if (cache[arg] === undefined) cache[arg] = fn(arg);
return cache[arg];
};
}
;// CONCATENATED MODULE: ./node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js
var ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
var UNDEFINED_AS_OBJECT_KEY_ERROR = "You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).";
var hyphenateRegex = /[A-Z]|^ms/g;
var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
var isCustomProperty = function isCustomProperty(property) {
return property.charCodeAt(1) === 45;
};
var isProcessableValue = function isProcessableValue(value) {
return value != null && typeof value !== 'boolean';
};
var processStyleName = /* #__PURE__ */memoize(function (styleName) {
return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();
});
var processStyleValue = function processStyleValue(key, value) {
switch (key) {
case 'animation':
case 'animationName':
{
if (typeof value === 'string') {
return value.replace(animationRegex, function (match, p1, p2) {
cursor = {
name: p1,
styles: p2,
next: cursor
};
return p1;
});
}
}
}
if (unitlessKeys[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {
return value + 'px';
}
return value;
};
if (false) { var hyphenatedCache, hyphenPattern, msPattern, oldProcessStyleValue, contentValues, contentValuePattern; }
var noComponentSelectorMessage = (/* unused pure expression or super */ null && ('Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.'));
function handleInterpolation(mergedProps, registered, interpolation) {
if (interpolation == null) {
return '';
}
if (interpolation.__emotion_styles !== undefined) {
if (false) {}
return interpolation;
}
switch (typeof interpolation) {
case 'boolean':
{
return '';
}
case 'object':
{
if (interpolation.anim === 1) {
cursor = {
name: interpolation.name,
styles: interpolation.styles,
next: cursor
};
return interpolation.name;
}
if (interpolation.styles !== undefined) {
var next = interpolation.next;
if (next !== undefined) {
// not the most efficient thing ever but this is a pretty rare case
// and there will be very few iterations of this generally
while (next !== undefined) {
cursor = {
name: next.name,
styles: next.styles,
next: cursor
};
next = next.next;
}
}
var styles = interpolation.styles + ";";
if (false) {}
return styles;
}
return createStringFromObject(mergedProps, registered, interpolation);
}
case 'function':
{
if (mergedProps !== undefined) {
var previousCursor = cursor;
var result = interpolation(mergedProps);
cursor = previousCursor;
return handleInterpolation(mergedProps, registered, result);
} else if (false) {}
break;
}
case 'string':
if (false) { var replaced, matched; }
break;
} // finalize string values (regular strings and functions interpolated into css calls)
if (registered == null) {
return interpolation;
}
var cached = registered[interpolation];
return cached !== undefined ? cached : interpolation;
}
function createStringFromObject(mergedProps, registered, obj) {
var string = '';
if (Array.isArray(obj)) {
for (var i = 0; i < obj.length; i++) {
string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
}
} else {
for (var _key in obj) {
var value = obj[_key];
if (typeof value !== 'object') {
if (registered != null && registered[value] !== undefined) {
string += _key + "{" + registered[value] + "}";
} else if (isProcessableValue(value)) {
string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
}
} else {
if (_key === 'NO_COMPONENT_SELECTOR' && "production" !== 'production') {}
if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
for (var _i = 0; _i < value.length; _i++) {
if (isProcessableValue(value[_i])) {
string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
}
}
} else {
var interpolated = handleInterpolation(mergedProps, registered, value);
switch (_key) {
case 'animation':
case 'animationName':
{
string += processStyleName(_key) + ":" + interpolated + ";";
break;
}
default:
{
if (false) {}
string += _key + "{" + interpolated + "}";
}
}
}
}
}
}
return string;
}
var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
var sourceMapPattern;
if (false) {} // this is the cursor for keyframes
// keyframes are stored on the SerializedStyles object as a linked list
var cursor;
var emotion_serialize_browser_esm_serializeStyles = function serializeStyles(args, registered, mergedProps) {
if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
return args[0];
}
var stringMode = true;
var styles = '';
cursor = undefined;
var strings = args[0];
if (strings == null || strings.raw === undefined) {
stringMode = false;
styles += handleInterpolation(mergedProps, registered, strings);
} else {
if (false) {}
styles += strings[0];
} // we start at 1 since we've already handled the first arg
for (var i = 1; i < args.length; i++) {
styles += handleInterpolation(mergedProps, registered, args[i]);
if (stringMode) {
if (false) {}
styles += strings[i];
}
}
var sourceMap;
if (false) {} // using a global regex with .exec is stateful so lastIndex has to be reset each time
labelPattern.lastIndex = 0;
var identifierName = '';
var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5
while ((match = labelPattern.exec(styles)) !== null) {
identifierName += '-' + // $FlowFixMe we know it's not null
match[1];
}
var name = murmur2(styles) + identifierName;
if (false) {}
return {
name: name,
styles: styles,
next: cursor
};
};
;// CONCATENATED MODULE: ./node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js
var syncFallback = function syncFallback(create) {
return create();
};
var useInsertionEffect = external_React_['useInsertion' + 'Effect'] ? external_React_['useInsertion' + 'Effect'] : false;
var emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;
var emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectWithLayoutFallback = useInsertionEffect || external_React_.useLayoutEffect;
;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-element-c39617d8.browser.esm.js
var emotion_element_c39617d8_browser_esm_isBrowser = "object" !== 'undefined';
var emotion_element_c39617d8_browser_esm_hasOwnProperty = {}.hasOwnProperty;
var EmotionCacheContext = /* #__PURE__ */external_React_.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
// because this module is primarily intended for the browser and node
// but it's also required in react native and similar environments sometimes
// and we could have a special build just for that
// but this is much easier and the native packages
// might use a different theme context in the future anyway
typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({
key: 'css'
}) : null);
if (false) {}
var CacheProvider = EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return (0,external_React_.useContext)(EmotionCacheContext);
};
var emotion_element_c39617d8_browser_esm_withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/(0,external_React_.forwardRef)(function (props, ref) {
// the cache will never be null in the browser
var cache = (0,external_React_.useContext)(EmotionCacheContext);
return func(props, cache, ref);
});
};
if (!emotion_element_c39617d8_browser_esm_isBrowser) {
emotion_element_c39617d8_browser_esm_withEmotionCache = function withEmotionCache(func) {
return function (props) {
var cache = (0,external_React_.useContext)(EmotionCacheContext);
if (cache === null) {
// yes, we're potentially creating this on every render
// it doesn't actually matter though since it's only on the server
// so there will only every be a single render
// that could change in the future because of suspense and etc. but for now,
// this works and i don't want to optimise for a future thing that we aren't sure about
cache = createCache({
key: 'css'
});
return /*#__PURE__*/external_React_.createElement(EmotionCacheContext.Provider, {
value: cache
}, func(props, cache));
} else {
return func(props, cache);
}
};
};
}
var emotion_element_c39617d8_browser_esm_ThemeContext = /* #__PURE__ */external_React_.createContext({});
if (false) {}
var useTheme = function useTheme() {
return React.useContext(emotion_element_c39617d8_browser_esm_ThemeContext);
};
var getTheme = function getTheme(outerTheme, theme) {
if (typeof theme === 'function') {
var mergedTheme = theme(outerTheme);
if (false) {}
return mergedTheme;
}
if (false) {}
return _extends({}, outerTheme, theme);
};
var createCacheWithTheme = /* #__PURE__ */(/* unused pure expression or super */ null && (weakMemoize(function (outerTheme) {
return weakMemoize(function (theme) {
return getTheme(outerTheme, theme);
});
})));
var ThemeProvider = function ThemeProvider(props) {
var theme = React.useContext(emotion_element_c39617d8_browser_esm_ThemeContext);
if (props.theme !== theme) {
theme = createCacheWithTheme(theme)(props.theme);
}
return /*#__PURE__*/React.createElement(emotion_element_c39617d8_browser_esm_ThemeContext.Provider, {
value: theme
}, props.children);
};
function withTheme(Component) {
var componentName = Component.displayName || Component.name || 'Component';
var render = function render(props, ref) {
var theme = React.useContext(emotion_element_c39617d8_browser_esm_ThemeContext);
return /*#__PURE__*/React.createElement(Component, _extends({
theme: theme,
ref: ref
}, props));
}; // $FlowFixMe
var WithTheme = /*#__PURE__*/React.forwardRef(render);
WithTheme.displayName = "WithTheme(" + componentName + ")";
return hoistNonReactStatics(WithTheme, Component);
}
var getLastPart = function getLastPart(functionName) {
// The match may be something like 'Object.createEmotionProps' or
// 'Loader.prototype.render'
var parts = functionName.split('.');
return parts[parts.length - 1];
};
var getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {
// V8
var match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line);
if (match) return getLastPart(match[1]); // Safari / Firefox
match = /^([A-Za-z0-9$.]+)@/.exec(line);
if (match) return getLastPart(match[1]);
return undefined;
};
var internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS
// identifiers, thus we only need to replace what is a valid character for JS,
// but not for CSS.
var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
return identifier.replace(/\$/g, '-');
};
var getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {
if (!stackTrace) return undefined;
var lines = stackTrace.split('\n');
for (var i = 0; i < lines.length; i++) {
var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just "Error"
if (!functionName) continue; // If we reach one of these, we have gone too far and should quit
if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an
// uppercase letter
if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);
}
return undefined;
};
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
var emotion_element_c39617d8_browser_esm_createEmotionProps = function createEmotionProps(type, props) {
if (false) {}
var newProps = {};
for (var key in props) {
if (emotion_element_c39617d8_browser_esm_hasOwnProperty.call(props, key)) {
newProps[key] = props[key];
}
}
newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when
// the label hasn't already been computed
if (false) { var label; }
return newProps;
};
var Insertion = function Insertion(_ref) {
var cache = _ref.cache,
serialized = _ref.serialized,
isStringTag = _ref.isStringTag;
registerStyles(cache, serialized, isStringTag);
useInsertionEffectAlwaysWithSyncFallback(function () {
return insertStyles(cache, serialized, isStringTag);
});
return null;
};
var emotion_element_c39617d8_browser_esm_Emotion = /* #__PURE__ */(/* unused pure expression or super */ null && (emotion_element_c39617d8_browser_esm_withEmotionCache(function (props, cache, ref) {
var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
// not passing the registered cache to serializeStyles because it would
// make certain babel optimisations not possible
if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
cssProp = cache.registered[cssProp];
}
var WrappedComponent = props[typePropName];
var registeredStyles = [cssProp];
var className = '';
if (typeof props.className === 'string') {
className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serializeStyles(registeredStyles, undefined, React.useContext(emotion_element_c39617d8_browser_esm_ThemeContext));
if (false) { var labelFromStack; }
className += cache.key + "-" + serialized.name;
var newProps = {};
for (var key in props) {
if (emotion_element_c39617d8_browser_esm_hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && ( true || 0)) {
newProps[key] = props[key];
}
}
newProps.ref = ref;
newProps.className = className;
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {
cache: cache,
serialized: serialized,
isStringTag: typeof WrappedComponent === 'string'
}), /*#__PURE__*/React.createElement(WrappedComponent, newProps));
})));
if (false) {}
var Emotion$1 = (/* unused pure expression or super */ null && (emotion_element_c39617d8_browser_esm_Emotion));
;// CONCATENATED MODULE: ./node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js
var emotion_utils_browser_esm_isBrowser = "object" !== 'undefined';
function emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, classNames) {
var rawClassName = '';
classNames.split(' ').forEach(function (className) {
if (registered[className] !== undefined) {
registeredStyles.push(registered[className] + ";");
} else {
rawClassName += className + " ";
}
});
return rawClassName;
}
var emotion_utils_browser_esm_registerStyles = function registerStyles(cache, serialized, isStringTag) {
var className = cache.key + "-" + serialized.name;
if ( // we only need to add the styles to the registered cache if the
// class name could be used further down
// the tree but if it's a string tag, we know it won't
// so we don't have to add it to registered cache.
// this improves memory usage since we can avoid storing the whole style string
(isStringTag === false || // we need to always store it if we're in compat mode and
// in node since emotion-server relies on whether a style is in
// the registered cache to know whether a style is global or not
// also, note that this check will be dead code eliminated in the browser
emotion_utils_browser_esm_isBrowser === false ) && cache.registered[className] === undefined) {
cache.registered[className] = serialized.styles;
}
};
var emotion_utils_browser_esm_insertStyles = function insertStyles(cache, serialized, isStringTag) {
emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag);
var className = cache.key + "-" + serialized.name;
if (cache.inserted[serialized.name] === undefined) {
var current = serialized;
do {
cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
current = current.next;
} while (current !== undefined);
}
};
;// CONCATENATED MODULE: ./node_modules/@emotion/css/create-instance/dist/emotion-css-create-instance.esm.js
function insertWithoutScoping(cache, serialized) {
if (cache.inserted[serialized.name] === undefined) {
return cache.insert('', serialized, cache.sheet, true);
}
}
function merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var createEmotion = function createEmotion(options) {
var cache = createCache(options); // $FlowFixMe
cache.sheet.speedy = function (value) {
if (false) {}
this.isSpeedy = value;
};
cache.compat = true;
var css = function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered, undefined);
emotion_utils_browser_esm_insertStyles(cache, serialized, false);
return cache.key + "-" + serialized.name;
};
var keyframes = function keyframes() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered);
var animation = "animation-" + serialized.name;
insertWithoutScoping(cache, {
name: serialized.name,
styles: "@keyframes " + animation + "{" + serialized.styles + "}"
});
return animation;
};
var injectGlobal = function injectGlobal() {
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
args[_key3] = arguments[_key3];
}
var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered);
insertWithoutScoping(cache, serialized);
};
var cx = function cx() {
for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
args[_key4] = arguments[_key4];
}
return merge(cache.registered, css, emotion_css_create_instance_esm_classnames(args));
};
return {
css: css,
cx: cx,
injectGlobal: injectGlobal,
keyframes: keyframes,
hydrate: function hydrate(ids) {
ids.forEach(function (key) {
cache.inserted[key] = true;
});
},
flush: function flush() {
cache.registered = {};
cache.inserted = {};
cache.sheet.flush();
},
// $FlowFixMe
sheet: cache.sheet,
cache: cache,
getRegisteredStyles: emotion_utils_browser_esm_getRegisteredStyles.bind(null, cache.registered),
merge: merge.bind(null, cache.registered, css)
};
};
var emotion_css_create_instance_esm_classnames = function classnames(args) {
var cls = '';
for (var i = 0; i < args.length; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
;// CONCATENATED MODULE: ./node_modules/@emotion/css/dist/emotion-css.esm.js
var _createEmotion = createEmotion({
key: 'css'
}),
flush = _createEmotion.flush,
hydrate = _createEmotion.hydrate,
emotion_css_esm_cx = _createEmotion.cx,
emotion_css_esm_merge = _createEmotion.merge,
emotion_css_esm_getRegisteredStyles = _createEmotion.getRegisteredStyles,
injectGlobal = _createEmotion.injectGlobal,
emotion_css_esm_keyframes = _createEmotion.keyframes,
css = _createEmotion.css,
sheet = _createEmotion.sheet,
cache = _createEmotion.cache;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-cx.js
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
/**
* WordPress dependencies
*/
const isSerializedStyles = o => typeof o !== 'undefined' && o !== null && ['name', 'styles'].every(p => typeof o[p] !== 'undefined');
/**
* Retrieve a `cx` function that knows how to handle `SerializedStyles`
* returned by the `@emotion/react` `css` function in addition to what
* `cx` normally knows how to handle. It also hooks into the Emotion
* Cache, allowing `css` calls to work inside iframes.
*
* @example
* import { css } from '@emotion/react';
*
* const styles = css`
* color: red
* `;
*
* function RedText( { className, ...props } ) {
* const cx = useCx();
*
* const classes = cx(styles, className);
*
* return ;
* }
*/
const useCx = () => {
const cache = __unsafe_useEmotionCache();
const cx = (0,external_wp_element_namespaceObject.useCallback)(function () {
if (cache === null) {
throw new Error('The `useCx` hook should be only used within a valid Emotion Cache Context');
}
for (var _len = arguments.length, classNames = new Array(_len), _key = 0; _key < _len; _key++) {
classNames[_key] = arguments[_key];
}
return emotion_css_esm_cx(...classNames.map(arg => {
if (isSerializedStyles(arg)) {
emotion_utils_browser_esm_insertStyles(cache, arg, false);
return `${cache.key}-${arg.name}`;
}
return arg;
}));
}, [cache]);
return cx;
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/context/use-context-system.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* @template TProps
* @typedef {TProps & { className: string }} ConnectedProps
*/
/**
* Custom hook that derives registered props from the Context system.
* These derived props are then consolidated with incoming component props.
*
* @template {{ className?: string }} P
* @param {P} props Incoming props from the component.
* @param {string} namespace The namespace to register and to derive context props from.
* @return {ConnectedProps} The connected props.
*/
function useContextSystem(props, namespace) {
const contextSystemProps = useComponentsContext();
if (typeof namespace === 'undefined') {
typeof process !== "undefined" && process.env && "production" !== "production" ? 0 : void 0;
}
const contextProps = (contextSystemProps === null || contextSystemProps === void 0 ? void 0 : contextSystemProps[namespace]) || {};
/* eslint-disable jsdoc/no-undefined-types */
/** @type {ConnectedProps
} */
// @ts-ignore We fill in the missing properties below
const finalComponentProps = { ...getConnectedNamespace(),
...getNamespace(namespace)
};
/* eslint-enable jsdoc/no-undefined-types */
const {
_overrides: overrideProps,
...otherContextProps
} = contextProps;
const initialMergedProps = Object.entries(otherContextProps).length ? Object.assign({}, otherContextProps, props) : props;
const cx = useCx();
const classes = cx(getStyledClassNameFromKey(namespace), props.className); // Provides the ability to customize the render of the component.
const rendered = typeof initialMergedProps.renderChildren === 'function' ? initialMergedProps.renderChildren(initialMergedProps) : initialMergedProps.children;
for (const key in initialMergedProps) {
// @ts-ignore filling in missing props
finalComponentProps[key] = initialMergedProps[key];
}
for (const key in overrideProps) {
// @ts-ignore filling in missing props
finalComponentProps[key] = overrideProps[key];
} // Setting an `undefined` explicitly can cause unintended overwrites
// when a `cloneElement()` is involved.
if (rendered !== undefined) {
// @ts-ignore
finalComponentProps.children = rendered;
}
finalComponentProps.className = classes;
return finalComponentProps;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/context/context-connect.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Forwards ref (React.ForwardRef) and "Connects" (or registers) a component
* within the Context system under a specified namespace.
*
* @param Component The component to register into the Context system.
* @param namespace The namespace to register the component under.
* @return The connected WordPressComponent
*/
function contextConnect(Component, namespace) {
return _contextConnect(Component, namespace, {
forwardsRef: true
});
}
/**
* "Connects" (or registers) a component within the Context system under a specified namespace.
* Does not forward a ref.
*
* @param Component The component to register into the Context system.
* @param namespace The namespace to register the component under.
* @return The connected WordPressComponent
*/
function contextConnectWithoutRef(Component, namespace) {
return _contextConnect(Component, namespace);
} // This is an (experimental) evolution of the initial connect() HOC.
// The hope is that we can improve render performance by removing functional
// component wrappers.
function _contextConnect(Component, namespace, options) {
const WrappedComponent = options !== null && options !== void 0 && options.forwardsRef ? (0,external_wp_element_namespaceObject.forwardRef)(Component) : Component;
if (typeof namespace === 'undefined') {
typeof process !== "undefined" && process.env && "production" !== "production" ? 0 : void 0;
} // @ts-expect-error internal property
let mergedNamespace = WrappedComponent[CONNECT_STATIC_NAMESPACE] || [namespace];
/**
* Consolidate (merge) namespaces before attaching it to the WrappedComponent.
*/
if (Array.isArray(namespace)) {
mergedNamespace = [...mergedNamespace, ...namespace];
}
if (typeof namespace === 'string') {
mergedNamespace = [...mergedNamespace, namespace];
} // @ts-expect-error We can't rely on inferred types here because of the
// `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/9620bae6fef4fde7cc2b7833f416e240207cda29/packages/components/src/ui/context/wordpress-component.ts#L32-L33
return Object.assign(WrappedComponent, {
[CONNECT_STATIC_NAMESPACE]: [...new Set(mergedNamespace)],
displayName: namespace,
selector: `.${getStyledClassNameFromKey(namespace)}`
});
}
/**
* Attempts to retrieve the connected namespace from a component.
*
* @param Component The component to retrieve a namespace from.
* @return The connected namespaces.
*/
function getConnectNamespace(Component) {
if (!Component) return [];
let namespaces = []; // @ts-ignore internal property
if (Component[CONNECT_STATIC_NAMESPACE]) {
// @ts-ignore internal property
namespaces = Component[CONNECT_STATIC_NAMESPACE];
} // @ts-ignore
if (Component.type && Component.type[CONNECT_STATIC_NAMESPACE]) {
// @ts-ignore
namespaces = Component.type[CONNECT_STATIC_NAMESPACE];
}
return namespaces;
}
/**
* Checks to see if a component is connected within the Context system.
*
* @param Component The component to retrieve a namespace from.
* @param match The namespace to check.
*/
function hasConnectNamespace(Component, match) {
if (!Component) return false;
if (typeof match === 'string') {
return getConnectNamespace(Component).includes(match);
}
if (Array.isArray(match)) {
return match.some(result => getConnectNamespace(Component).includes(result));
}
return false;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/styles.js
/**
* External dependencies
*/
const visuallyHidden = {
border: 0,
clip: 'rect(1px, 1px, 1px, 1px)',
WebkitClipPath: 'inset( 50% )',
clipPath: 'inset( 50% )',
height: '1px',
margin: '-1px',
overflow: 'hidden',
padding: 0,
position: 'absolute',
width: '1px',
wordWrap: 'normal'
};
;// CONCATENATED MODULE: ./node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23
var isPropValid = /* #__PURE__ */memoize(function (prop) {
return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
/* o */
&& prop.charCodeAt(1) === 110
/* n */
&& prop.charCodeAt(2) < 91;
}
/* Z+1 */
);
;// CONCATENATED MODULE: ./node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js
var testOmitPropsOnStringTag = isPropValid;
var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
return key !== 'theme';
};
var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
return typeof tag === 'string' && // 96 is one less than the char code
// for "a" so this is checking that
// it's a lowercase character
tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
};
var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
var shouldForwardProp;
if (options) {
var optionsShouldForwardProp = options.shouldForwardProp;
shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
} : optionsShouldForwardProp;
}
if (typeof shouldForwardProp !== 'function' && isReal) {
shouldForwardProp = tag.__emotion_forwardProp;
}
return shouldForwardProp;
};
var emotion_styled_base_browser_esm_ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
var emotion_styled_base_browser_esm_Insertion = function Insertion(_ref) {
var cache = _ref.cache,
serialized = _ref.serialized,
isStringTag = _ref.isStringTag;
emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag);
emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback(function () {
return emotion_utils_browser_esm_insertStyles(cache, serialized, isStringTag);
});
return null;
};
var createStyled = function createStyled(tag, options) {
if (false) {}
var isReal = tag.__emotion_real === tag;
var baseTag = isReal && tag.__emotion_base || tag;
var identifierName;
var targetClassName;
if (options !== undefined) {
identifierName = options.label;
targetClassName = options.target;
}
var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
var shouldUseAs = !defaultShouldForwardProp('as');
return function () {
var args = arguments;
var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
if (identifierName !== undefined) {
styles.push("label:" + identifierName + ";");
}
if (args[0] == null || args[0].raw === undefined) {
styles.push.apply(styles, args);
} else {
if (false) {}
styles.push(args[0][0]);
var len = args.length;
var i = 1;
for (; i < len; i++) {
if (false) {}
styles.push(args[i], args[0][i]);
}
} // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class
var Styled = emotion_element_c39617d8_browser_esm_withEmotionCache(function (props, cache, ref) {
var FinalTag = shouldUseAs && props.as || baseTag;
var className = '';
var classInterpolations = [];
var mergedProps = props;
if (props.theme == null) {
mergedProps = {};
for (var key in props) {
mergedProps[key] = props[key];
}
mergedProps.theme = external_React_.useContext(emotion_element_c39617d8_browser_esm_ThemeContext);
}
if (typeof props.className === 'string') {
className = emotion_utils_browser_esm_getRegisteredStyles(cache.registered, classInterpolations, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = emotion_serialize_browser_esm_serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
className += cache.key + "-" + serialized.name;
if (targetClassName !== undefined) {
className += " " + targetClassName;
}
var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
var newProps = {};
for (var _key in props) {
if (shouldUseAs && _key === 'as') continue;
if ( // $FlowFixMe
finalShouldForwardProp(_key)) {
newProps[_key] = props[_key];
}
}
newProps.className = className;
newProps.ref = ref;
return /*#__PURE__*/external_React_.createElement(external_React_.Fragment, null, /*#__PURE__*/external_React_.createElement(emotion_styled_base_browser_esm_Insertion, {
cache: cache,
serialized: serialized,
isStringTag: typeof FinalTag === 'string'
}), /*#__PURE__*/external_React_.createElement(FinalTag, newProps));
});
Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
Styled.defaultProps = tag.defaultProps;
Styled.__emotion_real = Styled;
Styled.__emotion_base = baseTag;
Styled.__emotion_styles = styles;
Styled.__emotion_forwardProp = shouldForwardProp;
Object.defineProperty(Styled, 'toString', {
value: function value() {
if (targetClassName === undefined && "production" !== 'production') {} // $FlowFixMe: coerce undefined to string
return "." + targetClassName;
}
});
Styled.withComponent = function (nextTag, nextOptions) {
return createStyled(nextTag, extends_extends({}, options, nextOptions, {
shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
})).apply(void 0, styles);
};
return Styled;
};
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/view/component.js
/**
* External dependencies
*/
/**
* `View` is a core component that renders everything in the library.
* It is the principle component in the entire library.
*
* @example
* ```jsx
* import { View } from `@wordpress/components`;
*
* function Example() {
* return (
*
* Code is Poetry
*
* );
* }
* ```
*/
// @ts-expect-error
const View = createStyled("div", true ? {
target: "e19lxcc00"
} : 0)( true ? "" : 0);
View.selector = '.components-view';
View.displayName = 'View';
/* harmony default export */ var component = (View);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/component.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedVisuallyHidden(props, forwardedRef) {
const {
style: styleProp,
...contextProps
} = useContextSystem(props, 'VisuallyHidden');
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({
ref: forwardedRef
}, contextProps, {
style: { ...visuallyHidden,
...(styleProp || {})
}
}));
}
/**
* `VisuallyHidden` is a component used to render text intended to be visually
* hidden, but will show for alternate devices, for example a screen reader.
*
* ```jsx
* import { VisuallyHidden } from `@wordpress/components`;
*
* function Example() {
* return (
*
*
*
* );
* }
* ```
*/
const VisuallyHidden = contextConnect(UnconnectedVisuallyHidden, 'VisuallyHidden');
/* harmony default export */ var visually_hidden_component = (VisuallyHidden);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const disabledEventsOnDisabledButton = ['onMouseDown', 'onClick'];
function useDeprecatedProps(_ref) {
let {
isDefault,
isPrimary,
isSecondary,
isTertiary,
isLink,
variant,
...otherProps
} = _ref;
let computedVariant = variant;
if (isPrimary) {
var _computedVariant;
(_computedVariant = computedVariant) !== null && _computedVariant !== void 0 ? _computedVariant : computedVariant = 'primary';
}
if (isTertiary) {
var _computedVariant2;
(_computedVariant2 = computedVariant) !== null && _computedVariant2 !== void 0 ? _computedVariant2 : computedVariant = 'tertiary';
}
if (isSecondary) {
var _computedVariant3;
(_computedVariant3 = computedVariant) !== null && _computedVariant3 !== void 0 ? _computedVariant3 : computedVariant = 'secondary';
}
if (isDefault) {
var _computedVariant4;
external_wp_deprecated_default()('Button isDefault prop', {
since: '5.4',
alternative: 'variant="secondary"',
version: '6.2'
});
(_computedVariant4 = computedVariant) !== null && _computedVariant4 !== void 0 ? _computedVariant4 : computedVariant = 'secondary';
}
if (isLink) {
var _computedVariant5;
(_computedVariant5 = computedVariant) !== null && _computedVariant5 !== void 0 ? _computedVariant5 : computedVariant = 'link';
}
return { ...otherProps,
variant: computedVariant
};
}
function UnforwardedButton(props, ref) {
var _children$, _children$$props;
const {
isSmall,
isPressed,
isBusy,
isDestructive,
className,
disabled,
icon,
iconPosition = 'left',
iconSize,
showTooltip,
tooltipPosition,
shortcut,
label,
children,
text,
variant,
__experimentalIsFocusable: isFocusable,
describedBy,
...buttonOrAnchorProps
} = useDeprecatedProps(props);
const {
href,
target,
...additionalProps
} = 'href' in buttonOrAnchorProps ? buttonOrAnchorProps : {
href: undefined,
target: undefined,
...buttonOrAnchorProps
};
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Button, 'components-button__description');
const hasChildren = 'string' === typeof children && !!children || Array.isArray(children) && (children === null || children === void 0 ? void 0 : children[0]) && children[0] !== null && // Tooltip should not considered as a child
(children === null || children === void 0 ? void 0 : (_children$ = children[0]) === null || _children$ === void 0 ? void 0 : (_children$$props = _children$.props) === null || _children$$props === void 0 ? void 0 : _children$$props.className) !== 'components-tooltip';
const classes = classnames_default()('components-button', className, {
'is-secondary': variant === 'secondary',
'is-primary': variant === 'primary',
'is-small': isSmall,
'is-tertiary': variant === 'tertiary',
'is-pressed': isPressed,
'is-busy': isBusy,
'is-link': variant === 'link',
'is-destructive': isDestructive,
'has-text': !!icon && hasChildren,
'has-icon': !!icon
});
const trulyDisabled = disabled && !isFocusable;
const Tag = href !== undefined && !trulyDisabled ? 'a' : 'button';
const buttonProps = Tag === 'button' ? {
type: 'button',
disabled: trulyDisabled,
'aria-pressed': isPressed
} : {};
const anchorProps = Tag === 'a' ? {
href,
target
} : {};
if (disabled && isFocusable) {
// In this case, the button will be disabled, but still focusable and
// perceivable by screen reader users.
buttonProps['aria-disabled'] = true;
anchorProps['aria-disabled'] = true;
for (const disabledEvent of disabledEventsOnDisabledButton) {
additionalProps[disabledEvent] = event => {
if (event) {
event.stopPropagation();
event.preventDefault();
}
};
}
} // Should show the tooltip if...
const shouldShowTooltip = !trulyDisabled && ( // An explicit tooltip is passed or...
showTooltip && label || // There's a shortcut or...
shortcut || // There's a label and...
!!label && // The children are empty and...
!(children !== null && children !== void 0 && children.length) && // The tooltip is not explicitly disabled.
false !== showTooltip);
const descriptionId = describedBy ? instanceId : undefined;
const describedById = additionalProps['aria-describedby'] || descriptionId;
const commonProps = {
className: classes,
'aria-label': additionalProps['aria-label'] || label,
'aria-describedby': describedById,
ref
};
const elementChildren = (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, icon && iconPosition === 'left' && (0,external_wp_element_namespaceObject.createElement)(build_module_icon, {
icon: icon,
size: iconSize
}), text && (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, text), icon && iconPosition === 'right' && (0,external_wp_element_namespaceObject.createElement)(build_module_icon, {
icon: icon,
size: iconSize
}), children);
const element = Tag === 'a' ? (0,external_wp_element_namespaceObject.createElement)("a", extends_extends({}, anchorProps, additionalProps, commonProps), elementChildren) : (0,external_wp_element_namespaceObject.createElement)("button", extends_extends({}, buttonProps, additionalProps, commonProps), elementChildren);
if (!shouldShowTooltip) {
return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, element, describedBy && (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, null, (0,external_wp_element_namespaceObject.createElement)("span", {
id: descriptionId
}, describedBy)));
}
return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(tooltip, {
text: children !== null && children !== void 0 && children.length && describedBy ? describedBy : label,
shortcut: shortcut,
position: tooltipPosition
}, element), describedBy && (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, null, (0,external_wp_element_namespaceObject.createElement)("span", {
id: descriptionId
}, describedBy)));
}
/**
* Lets users take actions and make choices with a single click or tap.
*
* ```jsx
* import { Button } from '@wordpress/components';
* const Mybutton = () => (
*
* );
* ```
*/
const Button = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedButton);
/* harmony default export */ var build_module_button = (Button);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scroll-lock/index.js
/**
* WordPress dependencies
*/
/*
* Setting `overflow: hidden` on html and body elements resets body scroll in iOS.
* Save scroll top so we can restore it after locking scroll.
*
* NOTE: It would be cleaner and possibly safer to find a localized solution such
* as preventing default on certain touchmove events.
*/
let previousScrollTop = 0;
function setLocked(locked) {
const scrollingElement = document.scrollingElement || document.body;
if (locked) {
previousScrollTop = scrollingElement.scrollTop;
}
const methodName = locked ? 'add' : 'remove';
scrollingElement.classList[methodName]('lockscroll'); // Adding the class to the document element seems to be necessary in iOS.
document.documentElement.classList[methodName]('lockscroll');
if (!locked) {
scrollingElement.scrollTop = previousScrollTop;
}
}
let lockCounter = 0;
/**
* ScrollLock is a content-free React component for declaratively preventing
* scroll bleed from modal UI to the page body. This component applies a
* `lockscroll` class to the `document.documentElement` and
* `document.scrollingElement` elements to stop the body from scrolling. When it
* is present, the lock is applied.
*
* ```jsx
* import { ScrollLock, Button } from '@wordpress/components';
* import { useState } from '@wordpress/element';
*
* const MyScrollLock = () => {
* const [ isScrollLocked, setIsScrollLocked ] = useState( false );
*
* const toggleLock = () => {
* setIsScrollLocked( ( locked ) => ! locked ) );
* };
*
* return (
*
*
* { isScrollLocked &&
}
*
* Scroll locked:
* { isScrollLocked ? 'Yes' : 'No' }
*
*
* );
* };
* ```
*/
function ScrollLock() {
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (lockCounter === 0) {
setLocked(true);
}
++lockCounter;
return () => {
if (lockCounter === 1) {
setLocked(false);
}
--lockCounter;
};
}, []);
return null;
}
/* harmony default export */ var scroll_lock = (ScrollLock);
;// CONCATENATED MODULE: ./node_modules/proxy-compare/dist/index.modern.js
const index_modern_e=Symbol(),index_modern_t=Symbol(),index_modern_r=Symbol();let index_modern_n=(e,t)=>new Proxy(e,t);const index_modern_o=Object.getPrototypeOf,index_modern_s=new WeakMap,index_modern_c=e=>e&&(index_modern_s.has(e)?index_modern_s.get(e):index_modern_o(e)===Object.prototype||index_modern_o(e)===Array.prototype),index_modern_l=e=>"object"==typeof e&&null!==e,index_modern_a=new WeakMap,index_modern_f=e=>e[index_modern_r]||e,index_modern_i=(s,l,p)=>{if(!index_modern_c(s))return s;const y=index_modern_f(s),u=(e=>Object.isFrozen(e)||Object.values(Object.getOwnPropertyDescriptors(e)).some(e=>!e.writable))(y);let g=p&&p.get(y);return g&&g[1].f===u||(g=((n,o)=>{const s={f:o};let c=!1;const l=(t,r)=>{if(!c){let o=s.a.get(n);o||(o=new Set,s.a.set(n,o)),r&&o.has(index_modern_e)||o.add(t)}},a={get:(e,t)=>t===index_modern_r?n:(l(t),index_modern_i(e[t],s.a,s.c)),has:(e,r)=>r===index_modern_t?(c=!0,s.a.delete(n),!0):(l(r),r in e),getOwnPropertyDescriptor:(e,t)=>(l(t,!0),Object.getOwnPropertyDescriptor(e,t)),ownKeys:t=>(l(index_modern_e),Reflect.ownKeys(t))};return o&&(a.set=a.deleteProperty=()=>!1),[a,s]})(y,u),g[1].p=index_modern_n(u?(e=>{let t=index_modern_a.get(e);if(!t){if(Array.isArray(e))t=Array.from(e);else{const r=Object.getOwnPropertyDescriptors(e);Object.values(r).forEach(e=>{e.configurable=!0}),t=Object.create(index_modern_o(e),r)}index_modern_a.set(e,t)}return t})(y):y,g[0]),p&&p.set(y,g)),g[1].a=l,g[1].c=p,g[1].p},index_modern_p=(e,t)=>{const r=Reflect.ownKeys(e),n=Reflect.ownKeys(t);return r.length!==n.length||r.some((e,t)=>e!==n[t])},index_modern_y=(t,r,n,o)=>{if(Object.is(t,r))return!1;if(!index_modern_l(t)||!index_modern_l(r))return!0;const s=n.get(index_modern_f(t));if(!s)return!0;if(o){const e=o.get(t);if(e&&e.n===r)return e.g;o.set(t,{n:r,g:!1})}let c=null;for(const l of s){const s=l===index_modern_e?index_modern_p(t,r):index_modern_y(t[l],r[l],n,o);if(!0!==s&&!1!==s||(c=s),c)break}return null===c&&(c=!0),o&&o.set(t,{n:r,g:c}),c},index_modern_u=e=>!!index_modern_c(e)&&index_modern_t in e,index_modern_g=e=>index_modern_c(e)&&e[index_modern_r]||null,index_modern_b=(e,t=!0)=>{index_modern_s.set(e,t)},index_modern_O=(e,t)=>{const r=[],n=new WeakSet,o=(e,s)=>{if(n.has(e))return;index_modern_l(e)&&n.add(e);const c=index_modern_l(e)&&t.get(index_modern_f(e));c?c.forEach(t=>{o(e[t],s?[...s,t]:[t])}):s&&r.push(s)};return o(e),r},index_modern_w=e=>{index_modern_n=e};
// EXTERNAL MODULE: ./node_modules/use-sync-external-store/shim/index.js
var shim = __webpack_require__(635);
;// CONCATENATED MODULE: ./node_modules/valtio/esm/vanilla.js
const vanilla_isObject = (x) => typeof x === "object" && x !== null;
const refSet = /* @__PURE__ */ new WeakSet();
const VERSION = true ? Symbol("VERSION") : 0;
const LISTENERS = true ? Symbol("LISTENERS") : 0;
const SNAPSHOT = true ? Symbol("SNAPSHOT") : 0;
const buildProxyFunction = (objectIs = Object.is, newProxy = (target, handler) => new Proxy(target, handler), canProxy = (x) => vanilla_isObject(x) && !refSet.has(x) && (Array.isArray(x) || !(Symbol.iterator in x)) && !(x instanceof WeakMap) && !(x instanceof WeakSet) && !(x instanceof Error) && !(x instanceof Number) && !(x instanceof Date) && !(x instanceof String) && !(x instanceof RegExp) && !(x instanceof ArrayBuffer), PROMISE_RESULT = true ? Symbol("PROMISE_RESULT") : 0, PROMISE_ERROR = true ? Symbol("PROMISE_ERROR") : 0, snapshotCache = /* @__PURE__ */ new WeakMap(), createSnapshot = (version, target, receiver) => {
const cache = snapshotCache.get(receiver);
if ((cache == null ? void 0 : cache[0]) === version) {
return cache[1];
}
const snapshot2 = Array.isArray(target) ? [] : Object.create(Object.getPrototypeOf(target));
index_modern_b(snapshot2, true);
snapshotCache.set(receiver, [version, snapshot2]);
Reflect.ownKeys(target).forEach((key) => {
const value = Reflect.get(target, key, receiver);
if (refSet.has(value)) {
index_modern_b(value, false);
snapshot2[key] = value;
} else if (value instanceof Promise) {
if (PROMISE_RESULT in value) {
snapshot2[key] = value[PROMISE_RESULT];
} else {
const errorOrPromise = value[PROMISE_ERROR] || value;
Object.defineProperty(snapshot2, key, {
get() {
if (PROMISE_RESULT in value) {
return value[PROMISE_RESULT];
}
throw errorOrPromise;
}
});
}
} else if (value == null ? void 0 : value[LISTENERS]) {
snapshot2[key] = value[SNAPSHOT];
} else {
snapshot2[key] = value;
}
});
return Object.freeze(snapshot2);
}, proxyCache = /* @__PURE__ */ new WeakMap(), versionHolder = [1], proxyFunction2 = (initialObject) => {
if (!vanilla_isObject(initialObject)) {
throw new Error("object required");
}
const found = proxyCache.get(initialObject);
if (found) {
return found;
}
let version = versionHolder[0];
const listeners = /* @__PURE__ */ new Set();
const notifyUpdate = (op, nextVersion = ++versionHolder[0]) => {
if (version !== nextVersion) {
version = nextVersion;
listeners.forEach((listener) => listener(op, nextVersion));
}
};
const propListeners = /* @__PURE__ */ new Map();
const getPropListener = (prop) => {
let propListener = propListeners.get(prop);
if (!propListener) {
propListener = (op, nextVersion) => {
const newOp = [...op];
newOp[1] = [prop, ...newOp[1]];
notifyUpdate(newOp, nextVersion);
};
propListeners.set(prop, propListener);
}
return propListener;
};
const popPropListener = (prop) => {
const propListener = propListeners.get(prop);
propListeners.delete(prop);
return propListener;
};
const baseObject = Array.isArray(initialObject) ? [] : Object.create(Object.getPrototypeOf(initialObject));
const handler = {
get(target, prop, receiver) {
if (prop === VERSION) {
return version;
}
if (prop === LISTENERS) {
return listeners;
}
if (prop === SNAPSHOT) {
return createSnapshot(version, target, receiver);
}
return Reflect.get(target, prop, receiver);
},
deleteProperty(target, prop) {
const prevValue = Reflect.get(target, prop);
const childListeners = prevValue == null ? void 0 : prevValue[LISTENERS];
if (childListeners) {
childListeners.delete(popPropListener(prop));
}
const deleted = Reflect.deleteProperty(target, prop);
if (deleted) {
notifyUpdate(["delete", [prop], prevValue]);
}
return deleted;
},
set(target, prop, value, receiver) {
var _a;
const hasPrevValue = Reflect.has(target, prop);
const prevValue = Reflect.get(target, prop, receiver);
if (hasPrevValue && objectIs(prevValue, value)) {
return true;
}
const childListeners = prevValue == null ? void 0 : prevValue[LISTENERS];
if (childListeners) {
childListeners.delete(popPropListener(prop));
}
if (vanilla_isObject(value)) {
value = index_modern_g(value) || value;
}
let nextValue;
if ((_a = Object.getOwnPropertyDescriptor(target, prop)) == null ? void 0 : _a.set) {
nextValue = value;
} else if (value instanceof Promise) {
nextValue = value.then((v) => {
nextValue[PROMISE_RESULT] = v;
notifyUpdate(["resolve", [prop], v]);
return v;
}).catch((e) => {
nextValue[PROMISE_ERROR] = e;
notifyUpdate(["reject", [prop], e]);
});
} else if (value == null ? void 0 : value[LISTENERS]) {
nextValue = value;
nextValue[LISTENERS].add(getPropListener(prop));
} else if (canProxy(value)) {
nextValue = vanilla_proxy(value);
nextValue[LISTENERS].add(getPropListener(prop));
} else {
nextValue = value;
}
Reflect.set(target, prop, nextValue, receiver);
notifyUpdate(["set", [prop], value, prevValue]);
return true;
}
};
const proxyObject = newProxy(baseObject, handler);
proxyCache.set(initialObject, proxyObject);
Reflect.ownKeys(initialObject).forEach((key) => {
const desc = Object.getOwnPropertyDescriptor(
initialObject,
key
);
if (desc.get || desc.set) {
Object.defineProperty(baseObject, key, desc);
} else {
proxyObject[key] = initialObject[key];
}
});
return proxyObject;
}) => [
proxyFunction2,
refSet,
VERSION,
LISTENERS,
SNAPSHOT,
objectIs,
newProxy,
canProxy,
PROMISE_RESULT,
PROMISE_ERROR,
snapshotCache,
createSnapshot,
proxyCache,
versionHolder
];
const [proxyFunction] = buildProxyFunction();
function vanilla_proxy(initialObject = {}) {
return proxyFunction(initialObject);
}
function vanilla_getVersion(proxyObject) {
return vanilla_isObject(proxyObject) ? proxyObject[VERSION] : void 0;
}
function vanilla_subscribe(proxyObject, callback, notifyInSync) {
if ( true && !(proxyObject == null ? void 0 : proxyObject[LISTENERS])) {
console.warn("Please use proxy object");
}
let promise;
const ops = [];
const listener = (op) => {
ops.push(op);
if (notifyInSync) {
callback(ops.splice(0));
return;
}
if (!promise) {
promise = Promise.resolve().then(() => {
promise = void 0;
callback(ops.splice(0));
});
}
};
proxyObject[LISTENERS].add(listener);
return () => {
proxyObject[LISTENERS].delete(listener);
};
}
function vanilla_snapshot(proxyObject) {
if ( true && !(proxyObject == null ? void 0 : proxyObject[SNAPSHOT])) {
console.warn("Please use proxy object");
}
return proxyObject[SNAPSHOT];
}
function vanilla_ref(obj) {
refSet.add(obj);
return obj;
}
const unstable_buildProxyFunction = (/* unused pure expression or super */ null && (buildProxyFunction));
;// CONCATENATED MODULE: ./node_modules/valtio/esm/index.js
const { useSyncExternalStore } = shim;
const useAffectedDebugValue = (state, affected) => {
const pathList = (0,external_React_.useRef)();
(0,external_React_.useEffect)(() => {
pathList.current = index_modern_O(state, affected);
});
(0,external_React_.useDebugValue)(pathList.current);
};
function useSnapshot(proxyObject, options) {
const notifyInSync = options == null ? void 0 : options.sync;
const lastSnapshot = (0,external_React_.useRef)();
const lastAffected = (0,external_React_.useRef)();
let inRender = true;
const currSnapshot = useSyncExternalStore(
(0,external_React_.useCallback)(
(callback) => {
const unsub = vanilla_subscribe(proxyObject, callback, notifyInSync);
callback();
return unsub;
},
[proxyObject, notifyInSync]
),
() => {
const nextSnapshot = vanilla_snapshot(proxyObject);
try {
if (!inRender && lastSnapshot.current && lastAffected.current && !index_modern_y(
lastSnapshot.current,
nextSnapshot,
lastAffected.current,
/* @__PURE__ */ new WeakMap()
)) {
return lastSnapshot.current;
}
} catch (e) {
}
return nextSnapshot;
},
() => vanilla_snapshot(proxyObject)
);
inRender = false;
const currAffected = /* @__PURE__ */ new WeakMap();
(0,external_React_.useEffect)(() => {
lastSnapshot.current = currSnapshot;
lastAffected.current = currAffected;
});
if (true) {
useAffectedDebugValue(currSnapshot, currAffected);
}
const proxyCache = (0,external_React_.useMemo)(() => /* @__PURE__ */ new WeakMap(), []);
return index_modern_i(currSnapshot, currAffected, proxyCache);
}
;// CONCATENATED MODULE: ./node_modules/valtio/esm/utils.js
function subscribeKey(proxyObject, key, callback, notifyInSync) {
return subscribe(
proxyObject,
(ops) => {
if (ops.some((op) => op[1][0] === key)) {
callback(proxyObject[key]);
}
},
notifyInSync
);
}
let currentCleanups;
function watch(callback, options) {
let alive = true;
const cleanups = /* @__PURE__ */ new Set();
const subscriptions = /* @__PURE__ */ new Map();
const cleanup = () => {
if (alive) {
alive = false;
cleanups.forEach((clean) => clean());
cleanups.clear();
subscriptions.forEach((unsubscribe) => unsubscribe());
subscriptions.clear();
}
};
const revalidate = () => {
if (!alive) {
return;
}
cleanups.forEach((clean) => clean());
cleanups.clear();
const proxiesToSubscribe = /* @__PURE__ */ new Set();
const parent = currentCleanups;
currentCleanups = cleanups;
try {
const cleanupReturn = callback((proxyObject) => {
proxiesToSubscribe.add(proxyObject);
return proxyObject;
});
if (cleanupReturn) {
cleanups.add(cleanupReturn);
}
} finally {
currentCleanups = parent;
}
subscriptions.forEach((unsubscribe, proxyObject) => {
if (proxiesToSubscribe.has(proxyObject)) {
proxiesToSubscribe.delete(proxyObject);
} else {
subscriptions.delete(proxyObject);
unsubscribe();
}
});
proxiesToSubscribe.forEach((proxyObject) => {
const unsubscribe = subscribe(proxyObject, revalidate, options == null ? void 0 : options.sync);
subscriptions.set(proxyObject, unsubscribe);
});
};
if (currentCleanups) {
currentCleanups.add(cleanup);
}
revalidate();
return cleanup;
}
const DEVTOOLS = Symbol();
function devtools(proxyObject, options) {
if (typeof options === "string") {
console.warn(
"string name option is deprecated, use { name }. https://github.com/pmndrs/valtio/pull/400"
);
options = { name: options };
}
const { enabled, name = "" } = options || {};
let extension;
try {
extension = (enabled != null ? enabled : (/* unsupported import.meta.env */ undefined && 0) !== "production") && window.__REDUX_DEVTOOLS_EXTENSION__;
} catch {
}
if (!extension) {
if ( true && enabled) {
console.warn("[Warning] Please install/enable Redux devtools extension");
}
return;
}
let isTimeTraveling = false;
const devtools2 = extension.connect({ name });
const unsub1 = subscribe(proxyObject, (ops) => {
const action = ops.filter(([_, path]) => path[0] !== DEVTOOLS).map(([op, path]) => `${op}:${path.map(String).join(".")}`).join(", ");
if (!action) {
return;
}
if (isTimeTraveling) {
isTimeTraveling = false;
} else {
const snapWithoutDevtools = Object.assign({}, snapshot(proxyObject));
delete snapWithoutDevtools[DEVTOOLS];
devtools2.send(
{
type: action,
updatedAt: new Date().toLocaleString()
},
snapWithoutDevtools
);
}
});
const unsub2 = devtools2.subscribe((message) => {
var _a, _b, _c, _d, _e, _f;
if (message.type === "ACTION" && message.payload) {
try {
Object.assign(proxyObject, JSON.parse(message.payload));
} catch (e) {
console.error(
"please dispatch a serializable value that JSON.parse() and proxy() support\n",
e
);
}
}
if (message.type === "DISPATCH" && message.state) {
if (((_a = message.payload) == null ? void 0 : _a.type) === "JUMP_TO_ACTION" || ((_b = message.payload) == null ? void 0 : _b.type) === "JUMP_TO_STATE") {
isTimeTraveling = true;
const state = JSON.parse(message.state);
Object.assign(proxyObject, state);
}
proxyObject[DEVTOOLS] = message;
} else if (message.type === "DISPATCH" && ((_c = message.payload) == null ? void 0 : _c.type) === "COMMIT") {
devtools2.init(snapshot(proxyObject));
} else if (message.type === "DISPATCH" && ((_d = message.payload) == null ? void 0 : _d.type) === "IMPORT_STATE") {
const actions = (_e = message.payload.nextLiftedState) == null ? void 0 : _e.actionsById;
const computedStates = ((_f = message.payload.nextLiftedState) == null ? void 0 : _f.computedStates) || [];
isTimeTraveling = true;
computedStates.forEach(({ state }, index) => {
const action = actions[index] || "No action found";
Object.assign(proxyObject, state);
if (index === 0) {
devtools2.init(snapshot(proxyObject));
} else {
devtools2.send(action, snapshot(proxyObject));
}
});
}
});
devtools2.init(snapshot(proxyObject));
return () => {
unsub1();
unsub2 == null ? void 0 : unsub2();
};
}
const sourceObjectMap = /* @__PURE__ */ new WeakMap();
const derivedObjectMap = /* @__PURE__ */ new WeakMap();
const markPending = (sourceObject, callback) => {
const sourceObjectEntry = sourceObjectMap.get(sourceObject);
if (sourceObjectEntry) {
sourceObjectEntry[0].forEach((subscription) => {
const { d: derivedObject } = subscription;
if (sourceObject !== derivedObject) {
markPending(derivedObject);
}
});
++sourceObjectEntry[2];
if (callback) {
sourceObjectEntry[3].add(callback);
}
}
};
const checkPending = (sourceObject, callback) => {
const sourceObjectEntry = sourceObjectMap.get(sourceObject);
if (sourceObjectEntry == null ? void 0 : sourceObjectEntry[2]) {
sourceObjectEntry[3].add(callback);
return true;
}
return false;
};
const unmarkPending = (sourceObject) => {
const sourceObjectEntry = sourceObjectMap.get(sourceObject);
if (sourceObjectEntry) {
--sourceObjectEntry[2];
if (!sourceObjectEntry[2]) {
sourceObjectEntry[3].forEach((callback) => callback());
sourceObjectEntry[3].clear();
}
sourceObjectEntry[0].forEach((subscription) => {
const { d: derivedObject } = subscription;
if (sourceObject !== derivedObject) {
unmarkPending(derivedObject);
}
});
}
};
const addSubscription = (subscription) => {
const { s: sourceObject, d: derivedObject } = subscription;
let derivedObjectEntry = derivedObjectMap.get(derivedObject);
if (!derivedObjectEntry) {
derivedObjectEntry = [/* @__PURE__ */ new Set()];
derivedObjectMap.set(subscription.d, derivedObjectEntry);
}
derivedObjectEntry[0].add(subscription);
let sourceObjectEntry = sourceObjectMap.get(sourceObject);
if (!sourceObjectEntry) {
const subscriptions = /* @__PURE__ */ new Set();
const unsubscribe = vanilla_subscribe(
sourceObject,
(ops) => {
subscriptions.forEach((subscription2) => {
const {
d: derivedObject2,
c: callback,
n: notifyInSync,
i: ignoreKeys
} = subscription2;
if (sourceObject === derivedObject2 && ops.every(
(op) => op[1].length === 1 && ignoreKeys.includes(op[1][0])
)) {
return;
}
if (subscription2.p) {
return;
}
markPending(sourceObject, callback);
if (notifyInSync) {
unmarkPending(sourceObject);
} else {
subscription2.p = Promise.resolve().then(() => {
delete subscription2.p;
unmarkPending(sourceObject);
});
}
});
},
true
);
sourceObjectEntry = [subscriptions, unsubscribe, 0, /* @__PURE__ */ new Set()];
sourceObjectMap.set(sourceObject, sourceObjectEntry);
}
sourceObjectEntry[0].add(subscription);
};
const removeSubscription = (subscription) => {
const { s: sourceObject, d: derivedObject } = subscription;
const derivedObjectEntry = derivedObjectMap.get(derivedObject);
derivedObjectEntry == null ? void 0 : derivedObjectEntry[0].delete(subscription);
if ((derivedObjectEntry == null ? void 0 : derivedObjectEntry[0].size) === 0) {
derivedObjectMap.delete(derivedObject);
}
const sourceObjectEntry = sourceObjectMap.get(sourceObject);
if (sourceObjectEntry) {
const [subscriptions, unsubscribe] = sourceObjectEntry;
subscriptions.delete(subscription);
if (!subscriptions.size) {
unsubscribe();
sourceObjectMap.delete(sourceObject);
}
}
};
const listSubscriptions = (derivedObject) => {
const derivedObjectEntry = derivedObjectMap.get(derivedObject);
if (derivedObjectEntry) {
return Array.from(derivedObjectEntry[0]);
}
return [];
};
const unstable_deriveSubscriptions = {
add: addSubscription,
remove: removeSubscription,
list: listSubscriptions
};
function derive(derivedFns, options) {
const proxyObject = (options == null ? void 0 : options.proxy) || proxy({});
const notifyInSync = !!(options == null ? void 0 : options.sync);
const derivedKeys = Object.keys(derivedFns);
derivedKeys.forEach((key) => {
if (Object.getOwnPropertyDescriptor(proxyObject, key)) {
throw new Error("object property already defined");
}
const fn = derivedFns[key];
let lastDependencies = null;
const evaluate = () => {
if (lastDependencies) {
if (Array.from(lastDependencies).map(([p]) => checkPending(p, evaluate)).some((isPending) => isPending)) {
return;
}
if (Array.from(lastDependencies).every(
([p, entry]) => getVersion(p) === entry.v
)) {
return;
}
}
const dependencies = /* @__PURE__ */ new Map();
const get = (p) => {
dependencies.set(p, { v: getVersion(p) });
return p;
};
const value = fn(get);
const subscribeToDependencies = () => {
dependencies.forEach((entry, p) => {
var _a;
const lastSubscription = (_a = lastDependencies == null ? void 0 : lastDependencies.get(p)) == null ? void 0 : _a.s;
if (lastSubscription) {
entry.s = lastSubscription;
} else {
const subscription = {
s: p,
d: proxyObject,
k: key,
c: evaluate,
n: notifyInSync,
i: derivedKeys
};
addSubscription(subscription);
entry.s = subscription;
}
});
lastDependencies == null ? void 0 : lastDependencies.forEach((entry, p) => {
if (!dependencies.has(p) && entry.s) {
removeSubscription(entry.s);
}
});
lastDependencies = dependencies;
};
if (value instanceof Promise) {
value.finally(subscribeToDependencies);
} else {
subscribeToDependencies();
}
proxyObject[key] = value;
};
evaluate();
});
return proxyObject;
}
function underive(proxyObject, options) {
const keysToDelete = (options == null ? void 0 : options.delete) ? /* @__PURE__ */ new Set() : null;
listSubscriptions(proxyObject).forEach((subscription) => {
const { k: key } = subscription;
if (!(options == null ? void 0 : options.keys) || options.keys.includes(key)) {
removeSubscription(subscription);
if (keysToDelete) {
keysToDelete.add(key);
}
}
});
if (keysToDelete) {
keysToDelete.forEach((key) => {
delete proxyObject[key];
});
}
}
function addComputed_DEPRECATED(proxyObject, computedFns_FAKE, targetObject = proxyObject) {
console.warn(
"addComputed is deprecated. Please consider using `derive` or `proxyWithComputed` instead. Falling back to emulation with derive. https://github.com/pmndrs/valtio/pull/201"
);
const derivedFns = {};
Object.keys(computedFns_FAKE).forEach((key) => {
derivedFns[key] = (get) => computedFns_FAKE[key](get(proxyObject));
});
return derive(derivedFns, { proxy: targetObject });
}
function proxyWithComputed(initialObject, computedFns) {
Object.keys(computedFns).forEach((key) => {
if (Object.getOwnPropertyDescriptor(initialObject, key)) {
throw new Error("object property already defined");
}
const computedFn = computedFns[key];
const { get, set } = typeof computedFn === "function" ? { get: computedFn } : computedFn;
const desc = {};
desc.get = () => get(snapshot(proxyObject));
if (set) {
desc.set = (newValue) => set(proxyObject, newValue);
}
Object.defineProperty(initialObject, key, desc);
});
const proxyObject = proxy(initialObject);
return proxyObject;
}
const utils_isObject = (x) => typeof x === "object" && x !== null;
const deepClone = (obj) => {
if (!utils_isObject(obj)) {
return obj;
}
const baseObject = Array.isArray(obj) ? [] : Object.create(Object.getPrototypeOf(obj));
Reflect.ownKeys(obj).forEach((key) => {
baseObject[key] = deepClone(obj[key]);
});
return baseObject;
};
function proxyWithHistory(initialValue, skipSubscribe = false) {
const proxyObject = proxy({
value: initialValue,
history: ref({
wip: void 0,
snapshots: [],
index: -1
}),
canUndo: () => proxyObject.history.index > 0,
undo: () => {
if (proxyObject.canUndo()) {
proxyObject.value = proxyObject.history.wip = deepClone(
proxyObject.history.snapshots[--proxyObject.history.index]
);
}
},
canRedo: () => proxyObject.history.index < proxyObject.history.snapshots.length - 1,
redo: () => {
if (proxyObject.canRedo()) {
proxyObject.value = proxyObject.history.wip = deepClone(
proxyObject.history.snapshots[++proxyObject.history.index]
);
}
},
saveHistory: () => {
proxyObject.history.snapshots.splice(proxyObject.history.index + 1);
proxyObject.history.snapshots.push(snapshot(proxyObject).value);
++proxyObject.history.index;
},
subscribe: () => subscribe(proxyObject, (ops) => {
if (ops.every(
(op) => op[1][0] === "value" && (op[0] !== "set" || op[2] !== proxyObject.history.wip)
)) {
proxyObject.saveHistory();
}
})
});
proxyObject.saveHistory();
if (!skipSubscribe) {
proxyObject.subscribe();
}
return proxyObject;
}
function proxySet(initialValues) {
const set = proxy({
data: Array.from(new Set(initialValues)),
has(value) {
return this.data.indexOf(value) !== -1;
},
add(value) {
let hasProxy = false;
if (typeof value === "object" && value !== null) {
hasProxy = this.data.indexOf(proxy(value)) !== -1;
}
if (this.data.indexOf(value) === -1 && !hasProxy) {
this.data.push(value);
}
return this;
},
delete(value) {
const index = this.data.indexOf(value);
if (index === -1) {
return false;
}
this.data.splice(index, 1);
return true;
},
clear() {
this.data.splice(0);
},
get size() {
return this.data.length;
},
forEach(cb) {
this.data.forEach((value) => {
cb(value, value, this);
});
},
get [Symbol.toStringTag]() {
return "Set";
},
toJSON() {
return {};
},
[Symbol.iterator]() {
return this.data[Symbol.iterator]();
},
values() {
return this.data.values();
},
keys() {
return this.data.values();
},
entries() {
return new Set(this.data).entries();
}
});
Object.defineProperties(set, {
data: {
enumerable: false
},
size: {
enumerable: false
},
toJSON: {
enumerable: false
}
});
Object.seal(set);
return set;
}
function proxyMap(entries) {
const map = vanilla_proxy({
data: Array.from(entries || []),
has(key) {
return this.data.some((p) => p[0] === key);
},
set(key, value) {
const record = this.data.find((p) => p[0] === key);
if (record) {
record[1] = value;
} else {
this.data.push([key, value]);
}
return this;
},
get(key) {
var _a;
return (_a = this.data.find((p) => p[0] === key)) == null ? void 0 : _a[1];
},
delete(key) {
const index = this.data.findIndex((p) => p[0] === key);
if (index === -1) {
return false;
}
this.data.splice(index, 1);
return true;
},
clear() {
this.data.splice(0);
},
get size() {
return this.data.length;
},
toJSON() {
return {};
},
forEach(cb) {
this.data.forEach((p) => {
cb(p[1], p[0], this);
});
},
keys() {
return this.data.map((p) => p[0]).values();
},
values() {
return this.data.map((p) => p[1]).values();
},
entries() {
return new Map(this.data).entries();
},
get [Symbol.toStringTag]() {
return "Map";
},
[Symbol.iterator]() {
return this.entries();
}
});
Object.defineProperties(map, {
data: {
enumerable: false
},
size: {
enumerable: false
},
toJSON: {
enumerable: false
}
});
Object.seal(map);
return map;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-context.js
// @ts-nocheck
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
const SlotFillContext = (0,external_wp_element_namespaceObject.createContext)({
slots: proxyMap(),
fills: proxyMap(),
registerSlot: () => {
typeof process !== "undefined" && process.env && "production" !== "production" ? 0 : void 0;
},
updateSlot: () => {},
unregisterSlot: () => {},
registerFill: () => {},
unregisterFill: () => {}
});
/* harmony default export */ var slot_fill_context = (SlotFillContext);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot.js
// @ts-nocheck
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useSlot(name) {
const {
updateSlot: registryUpdateSlot,
unregisterSlot: registryUnregisterSlot,
registerFill: registryRegisterFill,
unregisterFill: registryUnregisterFill,
...registry
} = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
const slots = useSnapshot(registry.slots, {
sync: true
}); // The important bit here is that this call ensures
// the hook only causes a re-render if the slot
// with the given name change, not any other slot.
const slot = slots.get(name);
const updateSlot = (0,external_wp_element_namespaceObject.useCallback)(fillProps => {
registryUpdateSlot(name, fillProps);
}, [name, registryUpdateSlot]);
const unregisterSlot = (0,external_wp_element_namespaceObject.useCallback)(slotRef => {
registryUnregisterSlot(name, slotRef);
}, [name, registryUnregisterSlot]);
const registerFill = (0,external_wp_element_namespaceObject.useCallback)(fillRef => {
registryRegisterFill(name, fillRef);
}, [name, registryRegisterFill]);
const unregisterFill = (0,external_wp_element_namespaceObject.useCallback)(fillRef => {
registryUnregisterFill(name, fillRef);
}, [name, registryUnregisterFill]);
return { ...slot,
updateSlot,
unregisterSlot,
registerFill,
unregisterFill
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/context.js
// @ts-nocheck
/**
* WordPress dependencies
*/
const context_SlotFillContext = (0,external_wp_element_namespaceObject.createContext)({
registerSlot: () => {},
unregisterSlot: () => {},
registerFill: () => {},
unregisterFill: () => {},
getSlot: () => {},
getFills: () => {},
subscribe: () => {}
});
/* harmony default export */ var context = (context_SlotFillContext);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/use-slot.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* React hook returning the active slot given a name.
*
* @param {string} name Slot name.
* @return {Object} Slot object.
*/
const use_slot_useSlot = name => {
const {
getSlot,
subscribe
} = (0,external_wp_element_namespaceObject.useContext)(context);
return (0,external_wp_element_namespaceObject.useSyncExternalStore)(subscribe, () => getSlot(name), () => getSlot(name));
};
/* harmony default export */ var use_slot = (use_slot_useSlot);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/fill.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function FillComponent(_ref) {
let {
name,
children,
registerFill,
unregisterFill
} = _ref;
const slot = use_slot(name);
const ref = (0,external_wp_element_namespaceObject.useRef)({
name,
children
});
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
const refValue = ref.current;
registerFill(name, refValue);
return () => unregisterFill(name, refValue); // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
// We'll leave them as-is until a more detailed investigation/refactor can be performed.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
ref.current.children = children;
if (slot) {
slot.forceUpdate();
} // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
// We'll leave them as-is until a more detailed investigation/refactor can be performed.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [children]);
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
if (name === ref.current.name) {
// Ignore initial effect.
return;
}
unregisterFill(ref.current.name, ref.current);
ref.current.name = name;
registerFill(name, ref.current); // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
// We'll leave them as-is until a more detailed investigation/refactor can be performed.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [name]);
if (!slot || !slot.node) {
return null;
} // If a function is passed as a child, provide it with the fillProps.
if (typeof children === 'function') {
children = children(slot.props.fillProps);
}
return (0,external_wp_element_namespaceObject.createPortal)(children, slot.node);
}
const Fill = props => (0,external_wp_element_namespaceObject.createElement)(context.Consumer, null, _ref2 => {
let {
registerFill,
unregisterFill
} = _ref2;
return (0,external_wp_element_namespaceObject.createElement)(FillComponent, extends_extends({}, props, {
registerFill: registerFill,
unregisterFill: unregisterFill
}));
});
/* harmony default export */ var fill = (Fill);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/slot.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Whether the argument is a function.
*
* @param {*} maybeFunc The argument to check.
* @return {boolean} True if the argument is a function, false otherwise.
*/
function isFunction(maybeFunc) {
return typeof maybeFunc === 'function';
}
class SlotComponent extends external_wp_element_namespaceObject.Component {
constructor() {
super(...arguments);
this.isUnmounted = false;
this.bindNode = this.bindNode.bind(this);
}
componentDidMount() {
const {
registerSlot
} = this.props;
this.isUnmounted = false;
registerSlot(this.props.name, this);
}
componentWillUnmount() {
const {
unregisterSlot
} = this.props;
this.isUnmounted = true;
unregisterSlot(this.props.name, this);
}
componentDidUpdate(prevProps) {
const {
name,
unregisterSlot,
registerSlot
} = this.props;
if (prevProps.name !== name) {
unregisterSlot(prevProps.name);
registerSlot(name, this);
}
}
bindNode(node) {
this.node = node;
}
forceUpdate() {
if (this.isUnmounted) {
return;
}
super.forceUpdate();
}
render() {
var _getFills;
const {
children,
name,
fillProps = {},
getFills
} = this.props;
const fills = ((_getFills = getFills(name, this)) !== null && _getFills !== void 0 ? _getFills : []).map(fill => {
const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children;
return external_wp_element_namespaceObject.Children.map(fillChildren, (child, childIndex) => {
if (!child || typeof child === 'string') {
return child;
}
const childKey = child.key || childIndex;
return (0,external_wp_element_namespaceObject.cloneElement)(child, {
key: childKey
});
});
}).filter( // In some cases fills are rendered only when some conditions apply.
// This ensures that we only use non-empty fills when rendering, i.e.,
// it allows us to render wrappers only when the fills are actually present.
element => !(0,external_wp_element_namespaceObject.isEmptyElement)(element));
return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, isFunction(children) ? children(fills) : fills);
}
}
const Slot = props => (0,external_wp_element_namespaceObject.createElement)(context.Consumer, null, _ref => {
let {
registerSlot,
unregisterSlot,
getFills
} = _ref;
return (0,external_wp_element_namespaceObject.createElement)(SlotComponent, extends_extends({}, props, {
registerSlot: registerSlot,
unregisterSlot: unregisterSlot,
getFills: getFills
}));
});
/* harmony default export */ var slot = (Slot);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/rng.js
// Unique ID creation requires a high quality random # generator. In the browser we therefore
// require the crypto API and do not support built-in fallback to lower quality random number
// generators (like Math.random()).
var getRandomValues;
var rnds8 = new Uint8Array(16);
function rng() {
// lazy load so that environments that need to polyfill have a chance to do so
if (!getRandomValues) {
// getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
// find the complete implementation of crypto (msCrypto) on IE11.
getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
if (!getRandomValues) {
throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
}
}
return getRandomValues(rnds8);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/regex.js
/* harmony default export */ var regex = (/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/validate.js
function validate(uuid) {
return typeof uuid === 'string' && regex.test(uuid);
}
/* harmony default export */ var esm_browser_validate = (validate);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/stringify.js
/**
* Convert array of 16 byte values to UUID string format of the form:
* XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
*/
var byteToHex = [];
for (var stringify_i = 0; stringify_i < 256; ++stringify_i) {
byteToHex.push((stringify_i + 0x100).toString(16).substr(1));
}
function stringify_stringify(arr) {
var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
// Note: Be careful editing this code! It's been tuned for performance
// and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID. If this throws, it's likely due to one
// of the following:
// - One or more input array values don't map to a hex octet (leading to
// "undefined" in the uuid)
// - Invalid input values for the RFC `version` or `variant` fields
if (!esm_browser_validate(uuid)) {
throw TypeError('Stringified UUID is invalid');
}
return uuid;
}
/* harmony default export */ var esm_browser_stringify = (stringify_stringify);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/v4.js
function v4(options, buf, offset) {
options = options || {};
var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
rnds[6] = rnds[6] & 0x0f | 0x40;
rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
if (buf) {
offset = offset || 0;
for (var i = 0; i < 16; ++i) {
buf[offset + i] = rnds[i];
}
return buf;
}
return esm_browser_stringify(rnds);
}
/* harmony default export */ var esm_browser_v4 = (v4);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/style-provider/index.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const uuidCache = new Set();
const memoizedCreateCacheWithContainer = memize_default()(container => {
// Emotion only accepts alphabetical and hyphenated keys so we just
// strip the numbers from the UUID. It _should_ be fine.
let key = esm_browser_v4().replace(/[0-9]/g, '');
while (uuidCache.has(key)) {
key = esm_browser_v4().replace(/[0-9]/g, '');
}
uuidCache.add(key);
return createCache({
container,
key
});
});
function StyleProvider(props) {
const {
children,
document
} = props;
if (!document) {
return null;
}
const cache = memoizedCreateCacheWithContainer(document.head);
return (0,external_wp_element_namespaceObject.createElement)(CacheProvider, {
value: cache
}, children);
}
/* harmony default export */ var style_provider = (StyleProvider);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/fill.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useForceUpdate() {
const [, setState] = (0,external_wp_element_namespaceObject.useState)({});
const mounted = (0,external_wp_element_namespaceObject.useRef)(true);
(0,external_wp_element_namespaceObject.useEffect)(() => {
mounted.current = true;
return () => {
mounted.current = false;
};
}, []);
return () => {
if (mounted.current) {
setState({});
}
};
}
function fill_Fill(_ref) {
let {
name,
children
} = _ref;
const {
registerFill,
unregisterFill,
...slot
} = useSlot(name);
const ref = (0,external_wp_element_namespaceObject.useRef)({
rerender: useForceUpdate()
});
(0,external_wp_element_namespaceObject.useEffect)(() => {
// We register fills so we can keep track of their existence.
// Some Slot implementations need to know if there're already fills
// registered so they can choose to render themselves or not.
registerFill(ref);
return () => {
unregisterFill(ref);
};
}, [registerFill, unregisterFill]);
if (!slot.ref || !slot.ref.current) {
return null;
}
if (typeof children === 'function') {
children = children(slot.fillProps);
} // When using a `Fill`, the `children` will be rendered in the document of the
// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`
// to make sure we're referencing the right document/iframe (instead of the
// context of the `Fill`'s parent).
const wrappedChildren = (0,external_wp_element_namespaceObject.createElement)(style_provider, {
document: slot.ref.current.ownerDocument
}, children);
return (0,external_wp_element_namespaceObject.createPortal)(wrappedChildren, slot.ref.current);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function slot_Slot(_ref, forwardedRef) {
let {
name,
fillProps = {},
as: Component = 'div',
...props
} = _ref;
const {
registerSlot,
unregisterSlot,
...registry
} = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
const ref = (0,external_wp_element_namespaceObject.useRef)();
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
registerSlot(name, ref, fillProps);
return () => {
unregisterSlot(name, ref);
}; // Ignore reason: We don't want to unregister and register the slot whenever
// `fillProps` change, which would cause the fill to be re-mounted. Instead,
// we can just update the slot (see hook below).
// For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [registerSlot, unregisterSlot, name]); // fillProps may be an update that interacts with the layout, so we
// useLayoutEffect.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
registry.updateSlot(name, fillProps);
});
return (0,external_wp_element_namespaceObject.createElement)(Component, extends_extends({
ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([forwardedRef, ref])
}, props));
}
/* harmony default export */ var bubbles_virtually_slot = ((0,external_wp_element_namespaceObject.forwardRef)(slot_Slot));
;// CONCATENATED MODULE: external ["wp","isShallowEqual"]
var external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"];
var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js
// @ts-nocheck
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useSlotRegistry() {
const slots = (0,external_wp_element_namespaceObject.useRef)(proxyMap());
const fills = (0,external_wp_element_namespaceObject.useRef)(proxyMap());
const registerSlot = (0,external_wp_element_namespaceObject.useCallback)((name, ref, fillProps) => {
const slot = slots.current.get(name) || {};
slots.current.set(name, vanilla_ref({ ...slot,
ref: ref || slot.ref,
fillProps: fillProps || slot.fillProps || {}
}));
}, []);
const unregisterSlot = (0,external_wp_element_namespaceObject.useCallback)((name, ref) => {
var _slots$current$get;
// Make sure we're not unregistering a slot registered by another element
// See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412
if (((_slots$current$get = slots.current.get(name)) === null || _slots$current$get === void 0 ? void 0 : _slots$current$get.ref) === ref) {
slots.current.delete(name);
}
}, []);
const updateSlot = (0,external_wp_element_namespaceObject.useCallback)((name, fillProps) => {
const slot = slots.current.get(name);
if (!slot) {
return;
}
if (!external_wp_isShallowEqual_default()(slot.fillProps, fillProps)) {
slot.fillProps = fillProps;
const slotFills = fills.current.get(name);
if (slotFills) {
// Force update fills.
slotFills.map(fill => fill.current.rerender());
}
}
}, []);
const registerFill = (0,external_wp_element_namespaceObject.useCallback)((name, ref) => {
fills.current.set(name, vanilla_ref([...(fills.current.get(name) || []), ref]));
}, []);
const unregisterFill = (0,external_wp_element_namespaceObject.useCallback)((name, ref) => {
if (fills.current.get(name)) {
fills.current.set(name, vanilla_ref(fills.current.get(name).filter(fillRef => fillRef !== ref)));
}
}, []); // Memoizing the return value so it can be directly passed to Provider value
const registry = (0,external_wp_element_namespaceObject.useMemo)(() => ({
slots: slots.current,
fills: fills.current,
registerSlot,
updateSlot,
unregisterSlot,
registerFill,
unregisterFill
}), [registerSlot, updateSlot, unregisterSlot, registerFill, unregisterFill]);
return registry;
}
function SlotFillProvider(_ref) {
let {
children
} = _ref;
const registry = useSlotRegistry();
return (0,external_wp_element_namespaceObject.createElement)(slot_fill_context.Provider, {
value: registry
}, children);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/provider.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
class provider_SlotFillProvider extends external_wp_element_namespaceObject.Component {
constructor() {
super(...arguments);
this.registerSlot = this.registerSlot.bind(this);
this.registerFill = this.registerFill.bind(this);
this.unregisterSlot = this.unregisterSlot.bind(this);
this.unregisterFill = this.unregisterFill.bind(this);
this.getSlot = this.getSlot.bind(this);
this.getFills = this.getFills.bind(this);
this.hasFills = this.hasFills.bind(this);
this.subscribe = this.subscribe.bind(this);
this.slots = {};
this.fills = {};
this.listeners = [];
this.contextValue = {
registerSlot: this.registerSlot,
unregisterSlot: this.unregisterSlot,
registerFill: this.registerFill,
unregisterFill: this.unregisterFill,
getSlot: this.getSlot,
getFills: this.getFills,
hasFills: this.hasFills,
subscribe: this.subscribe
};
}
registerSlot(name, slot) {
const previousSlot = this.slots[name];
this.slots[name] = slot;
this.triggerListeners(); // Sometimes the fills are registered after the initial render of slot
// But before the registerSlot call, we need to rerender the slot.
this.forceUpdateSlot(name); // If a new instance of a slot is being mounted while another with the
// same name exists, force its update _after_ the new slot has been
// assigned into the instance, such that its own rendering of children
// will be empty (the new Slot will subsume all fills for this name).
if (previousSlot) {
previousSlot.forceUpdate();
}
}
registerFill(name, instance) {
this.fills[name] = [...(this.fills[name] || []), instance];
this.forceUpdateSlot(name);
}
unregisterSlot(name, instance) {
// If a previous instance of a Slot by this name unmounts, do nothing,
// as the slot and its fills should only be removed for the current
// known instance.
if (this.slots[name] !== instance) {
return;
}
delete this.slots[name];
this.triggerListeners();
}
unregisterFill(name, instance) {
var _this$fills$name$filt, _this$fills$name;
this.fills[name] = (_this$fills$name$filt = (_this$fills$name = this.fills[name]) === null || _this$fills$name === void 0 ? void 0 : _this$fills$name.filter(fill => fill !== instance)) !== null && _this$fills$name$filt !== void 0 ? _this$fills$name$filt : [];
this.forceUpdateSlot(name);
}
getSlot(name) {
return this.slots[name];
}
getFills(name, slotInstance) {
// Fills should only be returned for the current instance of the slot
// in which they occupy.
if (this.slots[name] !== slotInstance) {
return [];
}
return this.fills[name];
}
hasFills(name) {
return this.fills[name] && !!this.fills[name].length;
}
forceUpdateSlot(name) {
const slot = this.getSlot(name);
if (slot) {
slot.forceUpdate();
}
}
triggerListeners() {
this.listeners.forEach(listener => listener());
}
subscribe(listener) {
this.listeners.push(listener);
return () => {
this.listeners = this.listeners.filter(l => l !== listener);
};
}
render() {
return (0,external_wp_element_namespaceObject.createElement)(context.Provider, {
value: this.contextValue
}, this.props.children);
}
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/index.js
// @ts-nocheck
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function slot_fill_Fill(props) {
// We're adding both Fills here so they can register themselves before
// their respective slot has been registered. Only the Fill that has a slot
// will render. The other one will return null.
return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, (0,external_wp_element_namespaceObject.createElement)(fill, props), (0,external_wp_element_namespaceObject.createElement)(fill_Fill, props));
}
const slot_fill_Slot = (0,external_wp_element_namespaceObject.forwardRef)((_ref, ref) => {
let {
bubblesVirtually,
...props
} = _ref;
if (bubblesVirtually) {
return (0,external_wp_element_namespaceObject.createElement)(bubbles_virtually_slot, extends_extends({}, props, {
ref: ref
}));
}
return (0,external_wp_element_namespaceObject.createElement)(slot, props);
});
function Provider(_ref2) {
let {
children,
...props
} = _ref2;
return (0,external_wp_element_namespaceObject.createElement)(provider_SlotFillProvider, props, (0,external_wp_element_namespaceObject.createElement)(SlotFillProvider, null, children));
}
function createSlotFill(name) {
const FillComponent = props => (0,external_wp_element_namespaceObject.createElement)(slot_fill_Fill, extends_extends({
name: name
}, props));
FillComponent.displayName = name + 'Fill';
const SlotComponent = props => (0,external_wp_element_namespaceObject.createElement)(slot_fill_Slot, extends_extends({
name: name
}, props));
SlotComponent.displayName = name + 'Slot';
SlotComponent.__unstableName = name;
return {
Fill: FillComponent,
Slot: SlotComponent
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/utils.js
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
/**
* Internal dependencies
*/
const POSITION_TO_PLACEMENT = {
bottom: 'bottom',
top: 'top',
'middle left': 'left',
'middle right': 'right',
'bottom left': 'bottom-end',
'bottom center': 'bottom',
'bottom right': 'bottom-start',
'top left': 'top-end',
'top center': 'top',
'top right': 'top-start',
'middle left left': 'left',
'middle left right': 'left',
'middle left bottom': 'left-end',
'middle left top': 'left-start',
'middle right left': 'right',
'middle right right': 'right',
'middle right bottom': 'right-end',
'middle right top': 'right-start',
'bottom left left': 'bottom-end',
'bottom left right': 'bottom-end',
'bottom left bottom': 'bottom-end',
'bottom left top': 'bottom-end',
'bottom center left': 'bottom',
'bottom center right': 'bottom',
'bottom center bottom': 'bottom',
'bottom center top': 'bottom',
'bottom right left': 'bottom-start',
'bottom right right': 'bottom-start',
'bottom right bottom': 'bottom-start',
'bottom right top': 'bottom-start',
'top left left': 'top-end',
'top left right': 'top-end',
'top left bottom': 'top-end',
'top left top': 'top-end',
'top center left': 'top',
'top center right': 'top',
'top center bottom': 'top',
'top center top': 'top',
'top right left': 'top-start',
'top right right': 'top-start',
'top right bottom': 'top-start',
'top right top': 'top-start',
// `middle`/`middle center [corner?]` positions are associated to a fallback
// `bottom` placement because there aren't any corresponding placement values.
middle: 'bottom',
'middle center': 'bottom',
'middle center bottom': 'bottom',
'middle center left': 'bottom',
'middle center right': 'bottom',
'middle center top': 'bottom'
};
/**
* Converts the `Popover`'s legacy "position" prop to the new "placement" prop
* (used by `floating-ui`).
*
* @param position The legacy position
* @return The corresponding placement
*/
const positionToPlacement = position => {
var _POSITION_TO_PLACEMEN;
return (_POSITION_TO_PLACEMEN = POSITION_TO_PLACEMENT[position]) !== null && _POSITION_TO_PLACEMEN !== void 0 ? _POSITION_TO_PLACEMEN : 'bottom';
};
/**
* @typedef AnimationOrigin
* @type {Object}
* @property {number} originX A number between 0 and 1 (in CSS logical properties jargon, 0 is "start", 0.5 is "center", and 1 is "end")
* @property {number} originY A number between 0 and 1 (0 is top, 0.5 is center, and 1 is bottom)
*/
const PLACEMENT_TO_ANIMATION_ORIGIN = {
top: {
originX: 0.5,
originY: 1
},
// open from bottom, center
'top-start': {
originX: 0,
originY: 1
},
// open from bottom, left
'top-end': {
originX: 1,
originY: 1
},
// open from bottom, right
right: {
originX: 0,
originY: 0.5
},
// open from middle, left
'right-start': {
originX: 0,
originY: 0
},
// open from top, left
'right-end': {
originX: 0,
originY: 1
},
// open from bottom, left
bottom: {
originX: 0.5,
originY: 0
},
// open from top, center
'bottom-start': {
originX: 0,
originY: 0
},
// open from top, left
'bottom-end': {
originX: 1,
originY: 0
},
// open from top, right
left: {
originX: 1,
originY: 0.5
},
// open from middle, right
'left-start': {
originX: 1,
originY: 0
},
// open from top, right
'left-end': {
originX: 1,
originY: 1
} // open from bottom, right
};
/**
* Given the floating-ui `placement`, compute the framer-motion props for the
* popover's entry animation.
*
* @param placement A placement string from floating ui
* @return The object containing the motion props
*/
const placementToMotionAnimationProps = placement => {
const translateProp = placement.startsWith('top') || placement.startsWith('bottom') ? 'translateY' : 'translateX';
const translateDirection = placement.startsWith('top') || placement.startsWith('left') ? 1 : -1;
return {
style: PLACEMENT_TO_ANIMATION_ORIGIN[placement],
initial: {
opacity: 0,
scale: 0,
[translateProp]: `${2 * translateDirection}em`
},
animate: {
opacity: 1,
scale: 1,
[translateProp]: 0
},
transition: {
duration: 0.1,
ease: [0, 0, 0.2, 1]
}
};
};
/**
* Returns the offset of a document's frame element.
*
* @param document The iframe's owner document.
*
* @return The offset of the document's frame element, or undefined if the
* document has no frame element.
*/
const getFrameOffset = document => {
var _document$defaultView;
const frameElement = document === null || document === void 0 ? void 0 : (_document$defaultView = document.defaultView) === null || _document$defaultView === void 0 ? void 0 : _document$defaultView.frameElement;
if (!frameElement) {
return;
}
const iframeRect = frameElement.getBoundingClientRect();
return {
x: iframeRect.left,
y: iframeRect.top
};
};
const getReferenceOwnerDocument = _ref => {
var _resultingReferenceOw;
let {
anchor,
anchorRef,
anchorRect,
getAnchorRect,
fallbackReferenceElement,
fallbackDocument
} = _ref;
// In floating-ui's terms:
// - "reference" refers to the popover's anchor element.
// - "floating" refers the floating popover's element.
// A floating element can also be positioned relative to a virtual element,
// instead of a real one. A virtual element is represented by an object
// with the `getBoundingClientRect()` function (like real elements).
// See https://floating-ui.com/docs/virtual-elements for more info.
let resultingReferenceOwnerDoc;
if (anchor) {
resultingReferenceOwnerDoc = anchor.ownerDocument;
} else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.top) {
resultingReferenceOwnerDoc = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.top.ownerDocument;
} else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.startContainer) {
resultingReferenceOwnerDoc = anchorRef.startContainer.ownerDocument;
} else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.current) {
resultingReferenceOwnerDoc = anchorRef.current.ownerDocument;
} else if (anchorRef) {
// This one should be deprecated.
resultingReferenceOwnerDoc = anchorRef.ownerDocument;
} else if (anchorRect && anchorRect !== null && anchorRect !== void 0 && anchorRect.ownerDocument) {
resultingReferenceOwnerDoc = anchorRect.ownerDocument;
} else if (getAnchorRect) {
var _getAnchorRect;
resultingReferenceOwnerDoc = (_getAnchorRect = getAnchorRect(fallbackReferenceElement)) === null || _getAnchorRect === void 0 ? void 0 : _getAnchorRect.ownerDocument;
}
return (_resultingReferenceOw = resultingReferenceOwnerDoc) !== null && _resultingReferenceOw !== void 0 ? _resultingReferenceOw : fallbackDocument;
};
const getReferenceElement = _ref2 => {
var _referenceElement;
let {
anchor,
anchorRef,
anchorRect,
getAnchorRect,
fallbackReferenceElement
} = _ref2;
let referenceElement = null;
if (anchor) {
referenceElement = anchor;
} else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.top) {
// Create a virtual element for the ref. The expectation is that
// if anchorRef.top is defined, then anchorRef.bottom is defined too.
// Seems to be used by the block toolbar, when multiple blocks are selected
// (top and bottom blocks are used to calculate the resulting rect).
referenceElement = {
getBoundingClientRect() {
const topRect = anchorRef.top.getBoundingClientRect();
const bottomRect = anchorRef.bottom.getBoundingClientRect();
return new window.DOMRect(topRect.x, topRect.y, topRect.width, bottomRect.bottom - topRect.top);
}
};
} else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.current) {
// Standard React ref.
referenceElement = anchorRef.current;
} else if (anchorRef) {
// If `anchorRef` holds directly the element's value (no `current` key)
// This is a weird scenario and should be deprecated.
referenceElement = anchorRef;
} else if (anchorRect) {
// Create a virtual element for the ref.
referenceElement = {
getBoundingClientRect() {
return anchorRect;
}
};
} else if (getAnchorRect) {
// Create a virtual element for the ref.
referenceElement = {
getBoundingClientRect() {
var _rect$x, _rect$y, _rect$width, _rect$height;
const rect = getAnchorRect(fallbackReferenceElement);
return new window.DOMRect((_rect$x = rect.x) !== null && _rect$x !== void 0 ? _rect$x : rect.left, (_rect$y = rect.y) !== null && _rect$y !== void 0 ? _rect$y : rect.top, (_rect$width = rect.width) !== null && _rect$width !== void 0 ? _rect$width : rect.right - rect.left, (_rect$height = rect.height) !== null && _rect$height !== void 0 ? _rect$height : rect.bottom - rect.top);
}
};
} else if (fallbackReferenceElement) {
// If no explicit ref is passed via props, fall back to
// anchoring to the popover's parent node.
referenceElement = fallbackReferenceElement.parentElement;
} // Convert any `undefined` value to `null`.
return (_referenceElement = referenceElement) !== null && _referenceElement !== void 0 ? _referenceElement : null;
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/limit-shift.js
/**
* External dependencies
*/
/**
* Parts of this source were derived and modified from `floating-ui`,
* released under the MIT license.
*
* https://github.com/floating-ui/floating-ui
*
* Copyright (c) 2021 Floating UI contributors
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
/**
* Custom limiter function for the `shift` middleware.
* This function is mostly identical default `limitShift` from ``@floating-ui`;
* the only difference is that, when computing the min/max shift limits, it
* also takes into account the iframe offset that is added by the
* custom "frameOffset" middleware.
*
* All unexported types and functions are also from the `@floating-ui` library,
* and have been copied to this file for convenience.
*/
function getSide(placement) {
return placement.split('-')[0];
}
function getMainAxisFromPlacement(placement) {
return ['top', 'bottom'].includes(getSide(placement)) ? 'x' : 'y';
}
function getCrossAxis(axis) {
return axis === 'x' ? 'y' : 'x';
}
const limitShift = function () {
let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return {
options,
fn(middlewareArguments) {
var _middlewareData$frame;
const {
x,
y,
placement,
rects,
middlewareData
} = middlewareArguments;
const {
offset = 0,
mainAxis: checkMainAxis = true,
crossAxis: checkCrossAxis = true
} = options;
const coords = {
x,
y
};
const mainAxis = getMainAxisFromPlacement(placement);
const crossAxis = getCrossAxis(mainAxis);
let mainAxisCoord = coords[mainAxis];
let crossAxisCoord = coords[crossAxis];
const rawOffset = typeof offset === 'function' ? offset(middlewareArguments) : offset;
const computedOffset = typeof rawOffset === 'number' ? {
mainAxis: rawOffset,
crossAxis: 0
} : {
mainAxis: 0,
crossAxis: 0,
...rawOffset
}; // At the moment of writing, this is the only difference
// with the `limitShift` function from `@floating-ui`.
// This offset needs to be added to all min/max limits
// in order to make the shift-limiting work as expected.
const additionalFrameOffset = {
x: 0,
y: 0,
...((_middlewareData$frame = middlewareData.frameOffset) === null || _middlewareData$frame === void 0 ? void 0 : _middlewareData$frame.amount)
};
if (checkMainAxis) {
const len = mainAxis === 'y' ? 'height' : 'width';
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis + additionalFrameOffset[mainAxis];
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis + additionalFrameOffset[mainAxis];
if (mainAxisCoord < limitMin) {
mainAxisCoord = limitMin;
} else if (mainAxisCoord > limitMax) {
mainAxisCoord = limitMax;
}
}
if (checkCrossAxis) {
var _middlewareData$offse, _middlewareData$offse2, _middlewareData$offse3, _middlewareData$offse4;
const len = mainAxis === 'y' ? 'width' : 'height';
const isOriginSide = ['top', 'left'].includes(getSide(placement));
const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? (_middlewareData$offse = (_middlewareData$offse2 = middlewareData.offset) === null || _middlewareData$offse2 === void 0 ? void 0 : _middlewareData$offse2[crossAxis]) !== null && _middlewareData$offse !== void 0 ? _middlewareData$offse : 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis) + additionalFrameOffset[crossAxis];
const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : (_middlewareData$offse3 = (_middlewareData$offse4 = middlewareData.offset) === null || _middlewareData$offse4 === void 0 ? void 0 : _middlewareData$offse4[crossAxis]) !== null && _middlewareData$offse3 !== void 0 ? _middlewareData$offse3 : 0) - (isOriginSide ? computedOffset.crossAxis : 0) + additionalFrameOffset[crossAxis];
if (crossAxisCoord < limitMin) {
crossAxisCoord = limitMin;
} else if (crossAxisCoord > limitMax) {
crossAxisCoord = limitMax;
}
}
return {
[mainAxis]: mainAxisCoord,
[crossAxis]: crossAxisCoord
};
}
};
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/index.js
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Name of slot in which popover should fill.
*
* @type {string}
*/
const SLOT_NAME = 'Popover'; // An SVG displaying a triangle facing down, filled with a solid
// color and bordered in such a way to create an arrow-like effect.
// Keeping the SVG's viewbox squared simplify the arrow positioning
// calculations.
const ArrowTriangle = () => (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: `0 0 100 100`,
className: "components-popover__triangle",
role: "presentation"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
className: "components-popover__triangle-bg",
d: "M 0 0 L 50 50 L 100 0"
}), (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
className: "components-popover__triangle-border",
d: "M 0 0 L 50 50 L 100 0",
vectorEffect: "non-scaling-stroke"
}));
const AnimatedWrapper = (0,external_wp_element_namespaceObject.forwardRef)((_ref, forwardedRef) => {
let {
style: receivedInlineStyles,
placement,
shouldAnimate = false,
...props
} = _ref;
// When animating, animate only once (i.e. when the popover is opened), and
// do not animate on subsequent prop changes (as it conflicts with
// floating-ui's positioning updates).
const [hasAnimatedOnce, setHasAnimatedOnce] = (0,external_wp_element_namespaceObject.useState)(false);
const shouldReduceMotion = useReducedMotion();
const {
style: motionInlineStyles,
...otherMotionProps
} = (0,external_wp_element_namespaceObject.useMemo)(() => placementToMotionAnimationProps(placement), [placement]);
const onAnimationComplete = (0,external_wp_element_namespaceObject.useCallback)(() => setHasAnimatedOnce(true), []);
const computedAnimationProps = shouldAnimate && !shouldReduceMotion ? {
style: { ...motionInlineStyles,
...receivedInlineStyles
},
...otherMotionProps,
onAnimationComplete,
animate: hasAnimatedOnce ? false : otherMotionProps.animate
} : {
animate: false,
style: receivedInlineStyles
};
return (0,external_wp_element_namespaceObject.createElement)(motion.div, extends_extends({}, computedAnimationProps, props, {
ref: forwardedRef
}));
});
const slotNameContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
const UnforwardedPopover = (props, forwardedRef) => {
var _frameOffsetRef$curre, _frameOffsetRef$curre2, _frameOffsetRef$curre3, _frameOffsetRef$curre4;
const {
animate = true,
headerTitle,
onClose,
children,
className,
noArrow = true,
position,
placement: placementProp = 'bottom-start',
offset: offsetProp = 0,
focusOnMount = 'firstElement',
anchor,
expandOnMobile,
onFocusOutside,
__unstableSlotName = SLOT_NAME,
flip = true,
resize = true,
shift = false,
variant,
// Deprecated props
__unstableForcePosition,
anchorRef,
anchorRect,
getAnchorRect,
isAlternate,
// Rest
...contentProps
} = props;
let computedFlipProp = flip;
let computedResizeProp = resize;
if (__unstableForcePosition !== undefined) {
external_wp_deprecated_default()('`__unstableForcePosition` prop in wp.components.Popover', {
since: '6.1',
version: '6.3',
alternative: '`flip={ false }` and `resize={ false }`'
}); // Back-compat, set the `flip` and `resize` props
// to `false` to replicate `__unstableForcePosition`.
computedFlipProp = !__unstableForcePosition;
computedResizeProp = !__unstableForcePosition;
}
if (anchorRef !== undefined) {
external_wp_deprecated_default()('`anchorRef` prop in wp.components.Popover', {
since: '6.1',
alternative: '`anchor` prop'
});
}
if (anchorRect !== undefined) {
external_wp_deprecated_default()('`anchorRect` prop in wp.components.Popover', {
since: '6.1',
alternative: '`anchor` prop'
});
}
if (getAnchorRect !== undefined) {
external_wp_deprecated_default()('`getAnchorRect` prop in wp.components.Popover', {
since: '6.1',
alternative: '`anchor` prop'
});
}
const computedVariant = isAlternate ? 'toolbar' : variant;
if (isAlternate !== undefined) {
external_wp_deprecated_default()('`isAlternate` prop in wp.components.Popover', {
since: '6.2',
alternative: "`variant` prop with the `'toolbar'` value"
});
}
const arrowRef = (0,external_wp_element_namespaceObject.useRef)(null);
const [fallbackReferenceElement, setFallbackReferenceElement] = (0,external_wp_element_namespaceObject.useState)(null);
const [referenceOwnerDocument, setReferenceOwnerDocument] = (0,external_wp_element_namespaceObject.useState)();
const anchorRefFallback = (0,external_wp_element_namespaceObject.useCallback)(node => {
setFallbackReferenceElement(node);
}, []);
const isMobileViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<');
const isExpanded = expandOnMobile && isMobileViewport;
const hasArrow = !isExpanded && !noArrow;
const normalizedPlacementFromProps = position ? positionToPlacement(position) : placementProp;
/**
* Offsets the position of the popover when the anchor is inside an iframe.
*
* Store the offset in a ref, due to constraints with floating-ui:
* https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.
*/
const frameOffsetRef = (0,external_wp_element_namespaceObject.useRef)(getFrameOffset(referenceOwnerDocument));
const middleware = [// Custom middleware which adjusts the popover's position by taking into
// account the offset of the anchor's iframe (if any) compared to the page.
{
name: 'frameOffset',
fn(_ref2) {
let {
x,
y
} = _ref2;
if (!frameOffsetRef.current) {
return {
x,
y
};
}
return {
x: x + frameOffsetRef.current.x,
y: y + frameOffsetRef.current.y,
data: {
// This will be used in the customLimitShift() function.
amount: frameOffsetRef.current
}
};
}
}, T(offsetProp), computedFlipProp ? b() : undefined, computedResizeProp ? k({
apply(sizeProps) {
var _refs$floating$curren;
const {
firstElementChild
} = (_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 ? _refs$floating$curren : {}; // Only HTMLElement instances have the `style` property.
if (!(firstElementChild instanceof HTMLElement)) return; // Reduce the height of the popover to the available space.
Object.assign(firstElementChild.style, {
maxHeight: `${sizeProps.availableHeight}px`,
overflow: 'auto'
});
}
}) : undefined, shift ? L({
crossAxis: true,
limiter: limitShift(),
padding: 1 // Necessary to avoid flickering at the edge of the viewport.
}) : undefined, arrow({
element: arrowRef
})].filter(m => m !== undefined);
const slotName = (0,external_wp_element_namespaceObject.useContext)(slotNameContext) || __unstableSlotName;
const slot = useSlot(slotName);
let onDialogClose;
if (onClose || onFocusOutside) {
onDialogClose = (type, event) => {
// Ideally the popover should have just a single onClose prop and
// not three props that potentially do the same thing.
if (type === 'focus-outside' && onFocusOutside) {
onFocusOutside(event);
} else if (onClose) {
onClose();
}
};
}
const [dialogRef, dialogProps] = (0,external_wp_compose_namespaceObject.__experimentalUseDialog)({
focusOnMount,
__unstableOnClose: onDialogClose,
// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)
onClose: onDialogClose
});
const {
// Positioning coordinates
x,
y,
// Callback refs (not regular refs). This allows the position to be updated.
// when either elements change.
reference: referenceCallbackRef,
floating,
// Object with "regular" refs to both "reference" and "floating"
refs,
// Type of CSS position property to use (absolute or fixed)
strategy,
update,
placement: computedPlacement,
middlewareData: {
arrow: arrowData
}
} = useFloating({
placement: normalizedPlacementFromProps,
middleware,
whileElementsMounted: (referenceParam, floatingParam, updateParam) => N(referenceParam, floatingParam, updateParam, {
animationFrame: true
})
});
const arrowCallbackRef = (0,external_wp_element_namespaceObject.useCallback)(node => {
arrowRef.current = node;
update();
}, [update]); // When any of the possible anchor "sources" change,
// recompute the reference element (real or virtual) and its owner document.
const anchorRefTop = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.top;
const anchorRefBottom = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.bottom;
const anchorRefStartContainer = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.startContainer;
const anchorRefCurrent = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current;
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
const resultingReferenceOwnerDoc = getReferenceOwnerDocument({
anchor,
anchorRef,
anchorRect,
getAnchorRect,
fallbackReferenceElement,
fallbackDocument: document
});
const resultingReferenceElement = getReferenceElement({
anchor,
anchorRef,
anchorRect,
getAnchorRect,
fallbackReferenceElement
});
referenceCallbackRef(resultingReferenceElement);
setReferenceOwnerDocument(resultingReferenceOwnerDoc);
}, [anchor, anchorRef, anchorRefTop, anchorRefBottom, anchorRefStartContainer, anchorRefCurrent, anchorRect, getAnchorRect, fallbackReferenceElement, referenceCallbackRef]); // If the reference element is in a different ownerDocument (e.g. iFrame),
// we need to manually update the floating's position as the reference's owner
// document scrolls. Also update the frame offset if the view resizes.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
var _refs$floating$curren2, _referenceOwnerDocume;
if ( // Reference and root documents are the same.
referenceOwnerDocument === document || // Reference and floating are in the same document.
referenceOwnerDocument === ((_refs$floating$curren2 = refs.floating.current) === null || _refs$floating$curren2 === void 0 ? void 0 : _refs$floating$curren2.ownerDocument) || // The reference's document has no view (i.e. window)
// or frame element (ie. it's not an iframe).
!(referenceOwnerDocument !== null && referenceOwnerDocument !== void 0 && (_referenceOwnerDocume = referenceOwnerDocument.defaultView) !== null && _referenceOwnerDocume !== void 0 && _referenceOwnerDocume.frameElement)) {
frameOffsetRef.current = undefined;
return;
}
const {
defaultView
} = referenceOwnerDocument;
const updateFrameOffset = () => {
frameOffsetRef.current = getFrameOffset(referenceOwnerDocument);
update();
};
defaultView.addEventListener('resize', updateFrameOffset);
updateFrameOffset();
return () => {
defaultView.removeEventListener('resize', updateFrameOffset);
};
}, [referenceOwnerDocument, update, refs.floating]);
const mergedFloatingRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([floating, dialogRef, forwardedRef]); // Disable reason: We care to capture the _bubbled_ events from inputs
// within popover as inferring close intent.
let content = // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
(0,external_wp_element_namespaceObject.createElement)(AnimatedWrapper, extends_extends({
shouldAnimate: animate && !isExpanded,
placement: computedPlacement,
className: classnames_default()('components-popover', className, {
'is-expanded': isExpanded,
'is-positioned': x !== null && y !== null,
// Use the 'alternate' classname for 'toolbar' variant for back compat.
[`is-${computedVariant === 'toolbar' ? 'alternate' : computedVariant}`]: computedVariant
})
}, contentProps, {
ref: mergedFloatingRef
}, dialogProps, {
tabIndex: -1,
style: isExpanded ? undefined : {
position: strategy,
top: 0,
left: 0,
// `x` and `y` are framer-motion specific props and are shorthands
// for `translateX` and `translateY`. Currently it is not possible
// to use `translateX` and `translateY` because those values would
// be overridden by the return value of the
// `placementToMotionAnimationProps` function in `AnimatedWrapper`
x: Math.round(x !== null && x !== void 0 ? x : 0) || undefined,
y: Math.round(y !== null && y !== void 0 ? y : 0) || undefined
}
}), isExpanded && (0,external_wp_element_namespaceObject.createElement)(scroll_lock, null), isExpanded && (0,external_wp_element_namespaceObject.createElement)("div", {
className: "components-popover__header"
}, (0,external_wp_element_namespaceObject.createElement)("span", {
className: "components-popover__header-title"
}, headerTitle), (0,external_wp_element_namespaceObject.createElement)(build_module_button, {
className: "components-popover__close",
icon: library_close,
onClick: onClose
})), (0,external_wp_element_namespaceObject.createElement)("div", {
className: "components-popover__content"
}, children), hasArrow && (0,external_wp_element_namespaceObject.createElement)("div", {
ref: arrowCallbackRef,
className: ['components-popover__arrow', `is-${computedPlacement.split('-')[0]}`].join(' '),
style: {
left: typeof (arrowData === null || arrowData === void 0 ? void 0 : arrowData.x) !== 'undefined' && Number.isFinite(arrowData.x) ? `${arrowData.x + ((_frameOffsetRef$curre = (_frameOffsetRef$curre2 = frameOffsetRef.current) === null || _frameOffsetRef$curre2 === void 0 ? void 0 : _frameOffsetRef$curre2.x) !== null && _frameOffsetRef$curre !== void 0 ? _frameOffsetRef$curre : 0)}px` : '',
top: typeof (arrowData === null || arrowData === void 0 ? void 0 : arrowData.y) !== 'undefined' && Number.isFinite(arrowData.y) ? `${arrowData.y + ((_frameOffsetRef$curre3 = (_frameOffsetRef$curre4 = frameOffsetRef.current) === null || _frameOffsetRef$curre4 === void 0 ? void 0 : _frameOffsetRef$curre4.y) !== null && _frameOffsetRef$curre3 !== void 0 ? _frameOffsetRef$curre3 : 0)}px` : ''
}
}, (0,external_wp_element_namespaceObject.createElement)(ArrowTriangle, null)));
if (slot.ref) {
content = (0,external_wp_element_namespaceObject.createElement)(slot_fill_Fill, {
name: slotName
}, content);
}
if (anchorRef || anchorRect || anchor) {
return content;
}
return (0,external_wp_element_namespaceObject.createElement)("span", {
ref: anchorRefFallback
}, content);
};
/**
* `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.
*
* ```jsx
* import { Button, Popover } from '@wordpress/components';
* import { useState } from '@wordpress/element';
*
* const MyPopover = () => {
* const [ isVisible, setIsVisible ] = useState( false );
* const toggleVisible = () => {
* setIsVisible( ( state ) => ! state );
* };
*
* return (
*
* );
* };
* ```
*
*/
const Popover = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPopover);
function PopoverSlot(_ref3, ref) {
let {
name = SLOT_NAME
} = _ref3;
return (0,external_wp_element_namespaceObject.createElement)(slot_fill_Slot // @ts-expect-error Need to type `SlotFill`
, {
bubblesVirtually: true,
name: name,
className: "popover-slot",
ref: ref
});
} // @ts-expect-error For Legacy Reasons
Popover.Slot = (0,external_wp_element_namespaceObject.forwardRef)(PopoverSlot); // @ts-expect-error For Legacy Reasons
Popover.__unstableSlotNameProvider = slotNameContext.Provider;
/* harmony default export */ var popover = (Popover);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/shortcut/index.js
/**
* Internal dependencies
*/
function Shortcut(props) {
const {
shortcut,
className
} = props;
if (!shortcut) {
return null;
}
let displayText;
let ariaLabel;
if (typeof shortcut === 'string') {
displayText = shortcut;
}
if (shortcut !== null && typeof shortcut === 'object') {
displayText = shortcut.display;
ariaLabel = shortcut.ariaLabel;
}
return (0,external_wp_element_namespaceObject.createElement)("span", {
className: className,
"aria-label": ariaLabel
}, displayText);
}
/* harmony default export */ var build_module_shortcut = (Shortcut);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tooltip/index.js
// @ts-nocheck
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Time over children to wait before showing tooltip
*
* @type {number}
*/
const TOOLTIP_DELAY = 700;
const eventCatcher = (0,external_wp_element_namespaceObject.createElement)("div", {
className: "event-catcher"
});
const getDisabledElement = _ref => {
let {
eventHandlers,
child,
childrenWithPopover,
mergedRefs
} = _ref;
return (0,external_wp_element_namespaceObject.cloneElement)((0,external_wp_element_namespaceObject.createElement)("span", {
className: "disabled-element-wrapper"
}, (0,external_wp_element_namespaceObject.cloneElement)(eventCatcher, eventHandlers), (0,external_wp_element_namespaceObject.cloneElement)(child, {
children: childrenWithPopover,
ref: mergedRefs
})), { ...eventHandlers
});
};
const getRegularElement = _ref2 => {
let {
child,
eventHandlers,
childrenWithPopover,
mergedRefs
} = _ref2;
return (0,external_wp_element_namespaceObject.cloneElement)(child, { ...eventHandlers,
children: childrenWithPopover,
ref: mergedRefs
});
};
const addPopoverToGrandchildren = _ref3 => {
let {
anchor,
grandchildren,
isOver,
offset,
position,
shortcut,
text,
className,
...props
} = _ref3;
return (0,external_wp_element_namespaceObject.concatChildren)(grandchildren, isOver && (0,external_wp_element_namespaceObject.createElement)(popover, extends_extends({
focusOnMount: false,
position: position,
className: classnames_default()('components-tooltip', className),
"aria-hidden": "true",
animate: false,
offset: offset,
anchor: anchor,
shift: true
}, props), text, (0,external_wp_element_namespaceObject.createElement)(build_module_shortcut, {
className: "components-tooltip__shortcut",
shortcut: shortcut
})));
};
const emitToChild = (children, eventName, event) => {
if (external_wp_element_namespaceObject.Children.count(children) !== 1) {
return;
}
const child = external_wp_element_namespaceObject.Children.only(children); // If the underlying element is disabled, do not emit the event.
if (child.props.disabled) {
return;
}
if (typeof child.props[eventName] === 'function') {
child.props[eventName](event);
}
};
function Tooltip(props) {
var _Children$toArray$;
const {
children,
position = 'bottom middle',
text,
shortcut,
delay = TOOLTIP_DELAY,
...popoverProps
} = props;
/**
* Whether a mouse is currently pressed, used in determining whether
* to handle a focus event as displaying the tooltip immediately.
*
* @type {boolean}
*/
const [isMouseDown, setIsMouseDown] = (0,external_wp_element_namespaceObject.useState)(false);
const [isOver, setIsOver] = (0,external_wp_element_namespaceObject.useState)(false);
const delayedSetIsOver = (0,external_wp_compose_namespaceObject.useDebounce)(setIsOver, delay); // Using internal state (instead of a ref) for the popover anchor to make sure
// that the component re-renders when the anchor updates.
const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null); // Create a reference to the Tooltip's child, to be passed to the Popover
// so that the Tooltip can be correctly positioned. Also, merge with the
// existing ref for the first child, so that its ref is preserved.
const existingChildRef = (_Children$toArray$ = external_wp_element_namespaceObject.Children.toArray(children)[0]) === null || _Children$toArray$ === void 0 ? void 0 : _Children$toArray$.ref;
const mergedChildRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([setPopoverAnchor, existingChildRef]);
const createMouseDown = event => {
// In firefox, the mouse down event is also fired when the select
// list is chosen.
// Cancel further processing because re-rendering of child components
// causes onChange to be triggered with the old value.
// See https://github.com/WordPress/gutenberg/pull/42483
if (event.target.tagName === 'OPTION') {
return;
} // Preserve original child callback behavior.
emitToChild(children, 'onMouseDown', event); // On mouse down, the next `mouseup` should revert the value of the
// instance property and remove its own event handler. The bind is
// made on the document since the `mouseup` might not occur within
// the bounds of the element.
document.addEventListener('mouseup', cancelIsMouseDown);
setIsMouseDown(true);
};
const createMouseUp = event => {
// In firefox, the mouse up event is also fired when the select
// list is chosen.
// Cancel further processing because re-rendering of child components
// causes onChange to be triggered with the old value.
// See https://github.com/WordPress/gutenberg/pull/42483
if (event.target.tagName === 'OPTION') {
return;
}
emitToChild(children, 'onMouseUp', event);
document.removeEventListener('mouseup', cancelIsMouseDown);
setIsMouseDown(false);
};
const createMouseEvent = type => {
if (type === 'mouseUp') return createMouseUp;
if (type === 'mouseDown') return createMouseDown;
};
/**
* Prebound `isInMouseDown` handler, created as a constant reference to
* assure ability to remove in component unmount.
*
* @type {Function}
*/
const cancelIsMouseDown = createMouseEvent('mouseUp');
const createToggleIsOver = (eventName, isDelayed) => {
return event => {
// Preserve original child callback behavior.
emitToChild(children, eventName, event); // Mouse events behave unreliably in React for disabled elements,
// firing on mouseenter but not mouseleave. Further, the default
// behavior for disabled elements in some browsers is to ignore
// mouse events. Don't bother trying to handle them.
//
// See: https://github.com/facebook/react/issues/4251
if (event.currentTarget.disabled) {
return;
} // A focus event will occur as a result of a mouse click, but it
// should be disambiguated between interacting with the button and
// using an explicit focus shift as a cue to display the tooltip.
if ('focus' === event.type && isMouseDown) {
return;
} // Needed in case unsetting is over while delayed set pending, i.e.
// quickly blur/mouseleave before delayedSetIsOver is called.
delayedSetIsOver.cancel();
const _isOver = ['focus', 'mouseenter'].includes(event.type);
if (_isOver === isOver) {
return;
}
if (isDelayed) {
delayedSetIsOver(_isOver);
} else {
setIsOver(_isOver);
}
};
};
const clearOnUnmount = () => {
delayedSetIsOver.cancel();
document.removeEventListener('mouseup', cancelIsMouseDown);
}; // Ignore reason: updating the deps array here could cause unexpected changes in behavior.
// Deferring until a more detailed investigation/refactor can be performed.
// eslint-disable-next-line react-hooks/exhaustive-deps
(0,external_wp_element_namespaceObject.useEffect)(() => clearOnUnmount, []);
if (external_wp_element_namespaceObject.Children.count(children) !== 1) {
if (false) {}
return children;
}
const eventHandlers = {
onMouseEnter: createToggleIsOver('onMouseEnter', true),
onMouseLeave: createToggleIsOver('onMouseLeave'),
onClick: createToggleIsOver('onClick'),
onFocus: createToggleIsOver('onFocus'),
onBlur: createToggleIsOver('onBlur'),
onMouseDown: createMouseEvent('mouseDown')
};
const child = external_wp_element_namespaceObject.Children.only(children);
const {
children: grandchildren,
disabled
} = child.props;
const getElementWithPopover = disabled ? getDisabledElement : getRegularElement;
const popoverData = {
anchor: popoverAnchor,
isOver,
offset: 4,
position,
shortcut,
text
};
const childrenWithPopover = addPopoverToGrandchildren({
grandchildren,
...popoverData,
...popoverProps
});
return getElementWithPopover({
child,
eventHandlers,
childrenWithPopover,
mergedRefs: mergedChildRefs
});
}
/* harmony default export */ var tooltip = (Tooltip);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/utils.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const GRID = [['top left', 'top center', 'top right'], ['center left', 'center center', 'center right'], ['bottom left', 'bottom center', 'bottom right']]; // Stored as map as i18n __() only accepts strings (not variables)
const ALIGNMENT_LABEL = {
'top left': (0,external_wp_i18n_namespaceObject.__)('Top Left'),
'top center': (0,external_wp_i18n_namespaceObject.__)('Top Center'),
'top right': (0,external_wp_i18n_namespaceObject.__)('Top Right'),
'center left': (0,external_wp_i18n_namespaceObject.__)('Center Left'),
'center center': (0,external_wp_i18n_namespaceObject.__)('Center'),
center: (0,external_wp_i18n_namespaceObject.__)('Center'),
'center right': (0,external_wp_i18n_namespaceObject.__)('Center Right'),
'bottom left': (0,external_wp_i18n_namespaceObject.__)('Bottom Left'),
'bottom center': (0,external_wp_i18n_namespaceObject.__)('Bottom Center'),
'bottom right': (0,external_wp_i18n_namespaceObject.__)('Bottom Right')
}; // Transforms GRID into a flat Array of values.
const ALIGNMENTS = GRID.flat();
/**
* Parses and transforms an incoming value to better match the alignment values
*
* @param value An alignment value to parse.
*
* @return The parsed value.
*/
function transformValue(value) {
const nextValue = value === 'center' ? 'center center' : value;
return nextValue.replace('-', ' ');
}
/**
* Creates an item ID based on a prefix ID and an alignment value.
*
* @param prefixId An ID to prefix.
* @param value An alignment value.
*
* @return The item id.
*/
function getItemId(prefixId, value) {
const valueId = transformValue(value).replace(' ', '-');
return `${prefixId}-${valueId}`;
}
/**
* Retrieves the alignment index from a value.
*
* @param alignment Value to check.
*
* @return The index of a matching alignment.
*/
function getAlignmentIndex() {
let alignment = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'center';
const item = transformValue(alignment);
const index = ALIGNMENTS.indexOf(item);
return index > -1 ? index : undefined;
}
// EXTERNAL MODULE: ./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js
var hoist_non_react_statics_cjs = __webpack_require__(1281);
;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-react.browser.esm.js
var pkg = {
name: "@emotion/react",
version: "11.11.0",
main: "dist/emotion-react.cjs.js",
module: "dist/emotion-react.esm.js",
browser: {
"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
},
exports: {
".": {
module: {
worker: "./dist/emotion-react.worker.esm.js",
browser: "./dist/emotion-react.browser.esm.js",
"default": "./dist/emotion-react.esm.js"
},
"import": "./dist/emotion-react.cjs.mjs",
"default": "./dist/emotion-react.cjs.js"
},
"./jsx-runtime": {
module: {
worker: "./jsx-runtime/dist/emotion-react-jsx-runtime.worker.esm.js",
browser: "./jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js",
"default": "./jsx-runtime/dist/emotion-react-jsx-runtime.esm.js"
},
"import": "./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.mjs",
"default": "./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.js"
},
"./_isolated-hnrs": {
module: {
worker: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.worker.esm.js",
browser: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js",
"default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.esm.js"
},
"import": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.mjs",
"default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.js"
},
"./jsx-dev-runtime": {
module: {
worker: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.worker.esm.js",
browser: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js",
"default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.esm.js"
},
"import": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.mjs",
"default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.js"
},
"./package.json": "./package.json",
"./types/css-prop": "./types/css-prop.d.ts",
"./macro": {
types: {
"import": "./macro.d.mts",
"default": "./macro.d.ts"
},
"default": "./macro.js"
}
},
types: "types/index.d.ts",
files: [
"src",
"dist",
"jsx-runtime",
"jsx-dev-runtime",
"_isolated-hnrs",
"types/*.d.ts",
"macro.*"
],
sideEffects: false,
author: "Emotion Contributors",
license: "MIT",
scripts: {
"test:typescript": "dtslint types"
},
dependencies: {
"@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.11.0",
"@emotion/cache": "^11.11.0",
"@emotion/serialize": "^1.1.2",
"@emotion/use-insertion-effect-with-fallbacks": "^1.0.1",
"@emotion/utils": "^1.2.1",
"@emotion/weak-memoize": "^0.3.1",
"hoist-non-react-statics": "^3.3.1"
},
peerDependencies: {
react: ">=16.8.0"
},
peerDependenciesMeta: {
"@types/react": {
optional: true
}
},
devDependencies: {
"@definitelytyped/dtslint": "0.0.112",
"@emotion/css": "11.11.0",
"@emotion/css-prettifier": "1.1.3",
"@emotion/server": "11.11.0",
"@emotion/styled": "11.11.0",
"html-tag-names": "^1.1.2",
react: "16.14.0",
"svg-tag-names": "^1.1.1",
typescript: "^4.5.5"
},
repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
publishConfig: {
access: "public"
},
"umd:main": "dist/emotion-react.umd.min.js",
preconstruct: {
entrypoints: [
"./index.js",
"./jsx-runtime.js",
"./jsx-dev-runtime.js",
"./_isolated-hnrs.js"
],
umdName: "emotionReact",
exports: {
envConditions: [
"browser",
"worker"
],
extra: {
"./types/css-prop": "./types/css-prop.d.ts",
"./macro": {
types: {
"import": "./macro.d.mts",
"default": "./macro.d.ts"
},
"default": "./macro.js"
}
}
}
}
};
var jsx = function jsx(type, props) {
var args = arguments;
if (props == null || !hasOwnProperty.call(props, 'css')) {
// $FlowFixMe
return React.createElement.apply(undefined, args);
}
var argsLength = args.length;
var createElementArgArray = new Array(argsLength);
createElementArgArray[0] = Emotion;
createElementArgArray[1] = createEmotionProps(type, props);
for (var i = 2; i < argsLength; i++) {
createElementArgArray[i] = args[i];
} // $FlowFixMe
return React.createElement.apply(null, createElementArgArray);
};
var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */(/* unused pure expression or super */ null && (withEmotionCache(function (props, cache) {
if (false) {}
var styles = props.styles;
var serialized = serializeStyles([styles], undefined, React.useContext(ThemeContext));
if (!isBrowser$1) {
var _ref;
var serializedNames = serialized.name;
var serializedStyles = serialized.styles;
var next = serialized.next;
while (next !== undefined) {
serializedNames += ' ' + next.name;
serializedStyles += next.styles;
next = next.next;
}
var shouldCache = cache.compat === true;
var rules = cache.insert("", {
name: serializedNames,
styles: serializedStyles
}, cache.sheet, shouldCache);
if (shouldCache) {
return null;
}
return /*#__PURE__*/React.createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + "-global " + serializedNames, _ref.dangerouslySetInnerHTML = {
__html: rules
}, _ref.nonce = cache.sheet.nonce, _ref));
} // yes, i know these hooks are used conditionally
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = React.useRef();
useInsertionEffectWithLayoutFallback(function () {
var key = cache.key + "-global"; // use case of https://github.com/emotion-js/emotion/issues/2675
var sheet = new cache.sheet.constructor({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other s
node.setAttribute('data-emotion', key);
sheet.hydrate([node]);
}
sheetRef.current = [sheet, rehydrating];
return function () {
sheet.flush();
};
}, [cache]);
useInsertionEffectWithLayoutFallback(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
})));
if (false) {}
function emotion_react_browser_esm_css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return emotion_serialize_browser_esm_serializeStyles(args);
}
var emotion_react_browser_esm_keyframes = function keyframes() {
var insertable = emotion_react_browser_esm_css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
var emotion_react_browser_esm_classnames = function classnames(args) {
var len = args.length;
var i = 0;
var cls = '';
for (; i < len; i++) {
var arg = args[i];
if (arg == null) continue;
var toAdd = void 0;
switch (typeof arg) {
case 'boolean':
break;
case 'object':
{
if (Array.isArray(arg)) {
toAdd = classnames(arg);
} else {
if (false) {}
toAdd = '';
for (var k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += ' ');
toAdd += k;
}
}
}
break;
}
default:
{
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += ' ');
cls += toAdd;
}
}
return cls;
};
function emotion_react_browser_esm_merge(registered, css, className) {
var registeredStyles = [];
var rawClassName = getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
var emotion_react_browser_esm_Insertion = function Insertion(_ref) {
var cache = _ref.cache,
serializedArr = _ref.serializedArr;
useInsertionEffectAlwaysWithSyncFallback(function () {
for (var i = 0; i < serializedArr.length; i++) {
insertStyles(cache, serializedArr[i], false);
}
});
return null;
};
var ClassNames = /* #__PURE__ */(/* unused pure expression or super */ null && (withEmotionCache(function (props, cache) {
var hasRendered = false;
var serializedArr = [];
var css = function css() {
if (hasRendered && "production" !== 'production') {}
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var serialized = serializeStyles(args, cache.registered);
serializedArr.push(serialized); // registration has to happen here as the result of this might get consumed by `cx`
registerStyles(cache, serialized, false);
return cache.key + "-" + serialized.name;
};
var cx = function cx() {
if (hasRendered && "production" !== 'production') {}
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return emotion_react_browser_esm_merge(cache.registered, css, emotion_react_browser_esm_classnames(args));
};
var content = {
css: css,
cx: cx,
theme: React.useContext(ThemeContext)
};
var ele = props.children(content);
hasRendered = true;
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(emotion_react_browser_esm_Insertion, {
cache: cache,
serializedArr: serializedArr
}), ele);
})));
if (false) {}
if (false) { var globalKey, globalContext, isTestEnv, emotion_react_browser_esm_isBrowser; }
;// CONCATENATED MODULE: ./node_modules/colord/index.mjs
var colord_r={grad:.9,turn:360,rad:360/(2*Math.PI)},colord_t=function(r){return"string"==typeof r?r.length>0:"number"==typeof r},colord_n=function(r,t,n){return void 0===t&&(t=0),void 0===n&&(n=Math.pow(10,t)),Math.round(n*r)/n+0},colord_e=function(r,t,n){return void 0===t&&(t=0),void 0===n&&(n=1),r>n?n:r>t?r:t},colord_u=function(r){return(r=isFinite(r)?r%360:0)>0?r:r+360},colord_a=function(r){return{r:colord_e(r.r,0,255),g:colord_e(r.g,0,255),b:colord_e(r.b,0,255),a:colord_e(r.a)}},colord_o=function(r){return{r:colord_n(r.r),g:colord_n(r.g),b:colord_n(r.b),a:colord_n(r.a,3)}},colord_i=/^#([0-9a-f]{3,8})$/i,colord_s=function(r){var t=r.toString(16);return t.length<2?"0"+t:t},colord_h=function(r){var t=r.r,n=r.g,e=r.b,u=r.a,a=Math.max(t,n,e),o=a-Math.min(t,n,e),i=o?a===t?(n-e)/o:a===n?2+(e-t)/o:4+(t-n)/o:0;return{h:60*(i<0?i+6:i),s:a?o/a*100:0,v:a/255*100,a:u}},colord_b=function(r){var t=r.h,n=r.s,e=r.v,u=r.a;t=t/360*6,n/=100,e/=100;var a=Math.floor(t),o=e*(1-n),i=e*(1-(t-a)*n),s=e*(1-(1-t+a)*n),h=a%6;return{r:255*[e,i,o,o,s,e][h],g:255*[s,e,e,i,o,o][h],b:255*[o,o,s,e,e,i][h],a:u}},colord_g=function(r){return{h:colord_u(r.h),s:colord_e(r.s,0,100),l:colord_e(r.l,0,100),a:colord_e(r.a)}},colord_d=function(r){return{h:colord_n(r.h),s:colord_n(r.s),l:colord_n(r.l),a:colord_n(r.a,3)}},colord_f=function(r){return colord_b((n=(t=r).s,{h:t.h,s:(n*=((e=t.l)<50?e:100-e)/100)>0?2*n/(e+n)*100:0,v:e+n,a:t.a}));var t,n,e},colord_c=function(r){return{h:(t=colord_h(r)).h,s:(u=(200-(n=t.s))*(e=t.v)/100)>0&&u<200?n*e/100/(u<=100?u:200-u)*100:0,l:u/2,a:t.a};var t,n,e,u},colord_l=/^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,colord_p=/^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,colord_v=/^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,colord_m=/^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i,colord_y={string:[[function(r){var t=colord_i.exec(r);return t?(r=t[1]).length<=4?{r:parseInt(r[0]+r[0],16),g:parseInt(r[1]+r[1],16),b:parseInt(r[2]+r[2],16),a:4===r.length?colord_n(parseInt(r[3]+r[3],16)/255,2):1}:6===r.length||8===r.length?{r:parseInt(r.substr(0,2),16),g:parseInt(r.substr(2,2),16),b:parseInt(r.substr(4,2),16),a:8===r.length?colord_n(parseInt(r.substr(6,2),16)/255,2):1}:null:null},"hex"],[function(r){var t=colord_v.exec(r)||colord_m.exec(r);return t?t[2]!==t[4]||t[4]!==t[6]?null:colord_a({r:Number(t[1])/(t[2]?100/255:1),g:Number(t[3])/(t[4]?100/255:1),b:Number(t[5])/(t[6]?100/255:1),a:void 0===t[7]?1:Number(t[7])/(t[8]?100:1)}):null},"rgb"],[function(t){var n=colord_l.exec(t)||colord_p.exec(t);if(!n)return null;var e,u,a=colord_g({h:(e=n[1],u=n[2],void 0===u&&(u="deg"),Number(e)*(colord_r[u]||1)),s:Number(n[3]),l:Number(n[4]),a:void 0===n[5]?1:Number(n[5])/(n[6]?100:1)});return colord_f(a)},"hsl"]],object:[[function(r){var n=r.r,e=r.g,u=r.b,o=r.a,i=void 0===o?1:o;return colord_t(n)&&colord_t(e)&&colord_t(u)?colord_a({r:Number(n),g:Number(e),b:Number(u),a:Number(i)}):null},"rgb"],[function(r){var n=r.h,e=r.s,u=r.l,a=r.a,o=void 0===a?1:a;if(!colord_t(n)||!colord_t(e)||!colord_t(u))return null;var i=colord_g({h:Number(n),s:Number(e),l:Number(u),a:Number(o)});return colord_f(i)},"hsl"],[function(r){var n=r.h,a=r.s,o=r.v,i=r.a,s=void 0===i?1:i;if(!colord_t(n)||!colord_t(a)||!colord_t(o))return null;var h=function(r){return{h:colord_u(r.h),s:colord_e(r.s,0,100),v:colord_e(r.v,0,100),a:colord_e(r.a)}}({h:Number(n),s:Number(a),v:Number(o),a:Number(s)});return colord_b(h)},"hsv"]]},colord_N=function(r,t){for(var n=0;n=.5},r.prototype.toHex=function(){return r=colord_o(this.rgba),t=r.r,e=r.g,u=r.b,i=(a=r.a)<1?colord_s(colord_n(255*a)):"","#"+colord_s(t)+colord_s(e)+colord_s(u)+i;var r,t,e,u,a,i},r.prototype.toRgb=function(){return colord_o(this.rgba)},r.prototype.toRgbString=function(){return r=colord_o(this.rgba),t=r.r,n=r.g,e=r.b,(u=r.a)<1?"rgba("+t+", "+n+", "+e+", "+u+")":"rgb("+t+", "+n+", "+e+")";var r,t,n,e,u},r.prototype.toHsl=function(){return colord_d(colord_c(this.rgba))},r.prototype.toHslString=function(){return r=colord_d(colord_c(this.rgba)),t=r.h,n=r.s,e=r.l,(u=r.a)<1?"hsla("+t+", "+n+"%, "+e+"%, "+u+")":"hsl("+t+", "+n+"%, "+e+"%)";var r,t,n,e,u},r.prototype.toHsv=function(){return r=colord_h(this.rgba),{h:colord_n(r.h),s:colord_n(r.s),v:colord_n(r.v),a:colord_n(r.a,3)};var r},r.prototype.invert=function(){return colord_w({r:255-(r=this.rgba).r,g:255-r.g,b:255-r.b,a:r.a});var r},r.prototype.saturate=function(r){return void 0===r&&(r=.1),colord_w(M(this.rgba,r))},r.prototype.desaturate=function(r){return void 0===r&&(r=.1),colord_w(M(this.rgba,-r))},r.prototype.grayscale=function(){return colord_w(M(this.rgba,-1))},r.prototype.lighten=function(r){return void 0===r&&(r=.1),colord_w($(this.rgba,r))},r.prototype.darken=function(r){return void 0===r&&(r=.1),colord_w($(this.rgba,-r))},r.prototype.rotate=function(r){return void 0===r&&(r=15),this.hue(this.hue()+r)},r.prototype.alpha=function(r){return"number"==typeof r?colord_w({r:(t=this.rgba).r,g:t.g,b:t.b,a:r}):colord_n(this.rgba.a,3);var t},r.prototype.hue=function(r){var t=colord_c(this.rgba);return"number"==typeof r?colord_w({h:r,s:t.s,l:t.l,a:t.a}):colord_n(t.h)},r.prototype.isEqual=function(r){return this.toHex()===colord_w(r).toHex()},r}(),colord_w=function(r){return r instanceof j?r:new j(r)},S=[],colord_k=function(r){r.forEach(function(r){S.indexOf(r)<0&&(r(j,colord_y),S.push(r))})},colord_E=function(){return new j({r:255*Math.random(),g:255*Math.random(),b:255*Math.random()})};
;// CONCATENATED MODULE: ./node_modules/colord/plugins/names.mjs
/* harmony default export */ function names(e,f){var a={white:"#ffffff",bisque:"#ffe4c4",blue:"#0000ff",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",antiquewhite:"#faebd7",aqua:"#00ffff",azure:"#f0ffff",whitesmoke:"#f5f5f5",papayawhip:"#ffefd5",plum:"#dda0dd",blanchedalmond:"#ffebcd",black:"#000000",gold:"#ffd700",goldenrod:"#daa520",gainsboro:"#dcdcdc",cornsilk:"#fff8dc",cornflowerblue:"#6495ed",burlywood:"#deb887",aquamarine:"#7fffd4",beige:"#f5f5dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkkhaki:"#bdb76b",darkgray:"#a9a9a9",darkgreen:"#006400",darkgrey:"#a9a9a9",peachpuff:"#ffdab9",darkmagenta:"#8b008b",darkred:"#8b0000",darkorchid:"#9932cc",darkorange:"#ff8c00",darkslateblue:"#483d8b",gray:"#808080",darkslategray:"#2f4f4f",darkslategrey:"#2f4f4f",deeppink:"#ff1493",deepskyblue:"#00bfff",wheat:"#f5deb3",firebrick:"#b22222",floralwhite:"#fffaf0",ghostwhite:"#f8f8ff",darkviolet:"#9400d3",magenta:"#ff00ff",green:"#008000",dodgerblue:"#1e90ff",grey:"#808080",honeydew:"#f0fff0",hotpink:"#ff69b4",blueviolet:"#8a2be2",forestgreen:"#228b22",lawngreen:"#7cfc00",indianred:"#cd5c5c",indigo:"#4b0082",fuchsia:"#ff00ff",brown:"#a52a2a",maroon:"#800000",mediumblue:"#0000cd",lightcoral:"#f08080",darkturquoise:"#00ced1",lightcyan:"#e0ffff",ivory:"#fffff0",lightyellow:"#ffffe0",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",linen:"#faf0e6",mediumaquamarine:"#66cdaa",lemonchiffon:"#fffacd",lime:"#00ff00",khaki:"#f0e68c",mediumseagreen:"#3cb371",limegreen:"#32cd32",mediumspringgreen:"#00fa9a",lightskyblue:"#87cefa",lightblue:"#add8e6",midnightblue:"#191970",lightpink:"#ffb6c1",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",mintcream:"#f5fffa",lightslategray:"#778899",lightslategrey:"#778899",navajowhite:"#ffdead",navy:"#000080",mediumvioletred:"#c71585",powderblue:"#b0e0e6",palegoldenrod:"#eee8aa",oldlace:"#fdf5e6",paleturquoise:"#afeeee",mediumturquoise:"#48d1cc",mediumorchid:"#ba55d3",rebeccapurple:"#663399",lightsteelblue:"#b0c4de",mediumslateblue:"#7b68ee",thistle:"#d8bfd8",tan:"#d2b48c",orchid:"#da70d6",mediumpurple:"#9370db",purple:"#800080",pink:"#ffc0cb",skyblue:"#87ceeb",springgreen:"#00ff7f",palegreen:"#98fb98",red:"#ff0000",yellow:"#ffff00",slateblue:"#6a5acd",lavenderblush:"#fff0f5",peru:"#cd853f",palevioletred:"#db7093",violet:"#ee82ee",teal:"#008080",slategray:"#708090",slategrey:"#708090",aliceblue:"#f0f8ff",darkseagreen:"#8fbc8f",darkolivegreen:"#556b2f",greenyellow:"#adff2f",seagreen:"#2e8b57",seashell:"#fff5ee",tomato:"#ff6347",silver:"#c0c0c0",sienna:"#a0522d",lavender:"#e6e6fa",lightgreen:"#90ee90",orange:"#ffa500",orangered:"#ff4500",steelblue:"#4682b4",royalblue:"#4169e1",turquoise:"#40e0d0",yellowgreen:"#9acd32",salmon:"#fa8072",saddlebrown:"#8b4513",sandybrown:"#f4a460",rosybrown:"#bc8f8f",darksalmon:"#e9967a",lightgoldenrodyellow:"#fafad2",snow:"#fffafa",lightgrey:"#d3d3d3",lightgray:"#d3d3d3",dimgray:"#696969",dimgrey:"#696969",olivedrab:"#6b8e23",olive:"#808000"},r={};for(var d in a)r[a[d]]=d;var l={};e.prototype.toName=function(f){if(!(this.rgba.a||this.rgba.r||this.rgba.g||this.rgba.b))return"transparent";var d,i,n=r[this.toHex()];if(n)return n;if(null==f?void 0:f.closest){var o=this.toRgb(),t=1/0,b="black";if(!l.length)for(var c in a)l[c]=new e(a[c]).toRgb();for(var g in a){var u=(d=o,i=l[g],Math.pow(d.r-i.r,2)+Math.pow(d.g-i.g,2)+Math.pow(d.b-i.b,2));u 0 && arguments[0] !== undefined ? arguments[0] : '';
let alpha = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
return colord_w(hexValue).alpha(alpha).toRgbString();
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/colors-values.js
/**
* Internal dependencies
*/
const white = '#fff'; // Matches the grays in @wordpress/base-styles
const GRAY = {
900: '#1e1e1e',
800: '#2f2f2f',
/** Meets 4.6:1 text contrast against white. */
700: '#757575',
/** Meets 3:1 UI or large text contrast against white. */
600: '#949494',
400: '#ccc',
/** Used for most borders. */
300: '#ddd',
/** Used sparingly for light borders. */
200: '#e0e0e0',
/** Used for light gray backgrounds. */
100: '#f0f0f0'
}; // Matches @wordpress/base-styles
const ALERT = {
yellow: '#f0b849',
red: '#d94f4f',
green: '#4ab866'
}; // Matches @wordpress/base-styles
const ADMIN = {
theme: 'var(--wp-components-color-accent, var(--wp-admin-theme-color, #007cba))',
themeDark10: 'var(--wp-components-color-accent-darker-10, var(--wp-admin-theme-color-darker-10, #006ba1))'
};
const UI = {
theme: ADMIN.theme,
themeDark10: ADMIN.themeDark10,
background: white,
backgroundDisabled: GRAY[100],
border: GRAY[600],
borderHover: GRAY[700],
borderFocus: ADMIN.themeDark10,
borderDisabled: GRAY[400],
textDisabled: GRAY[600],
textDark: white,
// Matches @wordpress/base-styles
darkGrayPlaceholder: colors_rgba(GRAY[900], 0.62),
lightGrayPlaceholder: colors_rgba(white, 0.65)
};
const COLORS = Object.freeze({
/**
* The main gray color object.
*/
gray: GRAY,
white,
alert: ALERT,
ui: UI
});
/* harmony default export */ var colors_values = ((/* unused pure expression or super */ null && (COLORS)));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/reduce-motion.js
/**
* Allows users to opt-out of animations via OS-level preferences.
*
* @param {'transition' | 'animation' | string} [prop='transition'] CSS Property name
* @return {string} Generated CSS code for the reduced style
*/
function reduceMotion() {
let prop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'transition';
let style;
switch (prop) {
case 'transition':
style = 'transition-duration: 0ms;';
break;
case 'animation':
style = 'animation-duration: 1ms;';
break;
default:
style = `
animation-duration: 1ms;
transition-duration: 0ms;
`;
}
return `
@media ( prefers-reduced-motion: reduce ) {
${style};
}
`;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js
function _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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var _ref = true ? {
name: "93uojk",
styles: "border-radius:2px;box-sizing:border-box;direction:ltr;display:grid;grid-template-columns:repeat( 3, 1fr );outline:none"
} : 0;
const rootBase = () => {
return _ref;
};
const rootSize = _ref2 => {
let {
size = 92
} = _ref2;
return /*#__PURE__*/emotion_react_browser_esm_css("grid-template-rows:repeat( 3, calc( ", size, "px / 3 ) );width:", size, "px;" + ( true ? "" : 0), true ? "" : 0);
};
const Root = createStyled("div", true ? {
target: "ecapk1j3"
} : 0)(rootBase, ";border:1px solid transparent;cursor:pointer;grid-template-columns:auto;", rootSize, ";" + ( true ? "" : 0));
const Row = createStyled("div", true ? {
target: "ecapk1j2"
} : 0)( true ? {
name: "1x5gbbj",
styles: "box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )"
} : 0);
const pointActive = _ref3 => {
let {
isActive
} = _ref3;
const boxShadow = isActive ? `0 0 0 2px ${COLORS.gray[900]}` : null;
const pointColor = isActive ? COLORS.gray[900] : COLORS.gray[400];
const pointColorHover = isActive ? COLORS.gray[900] : COLORS.ui.theme;
return /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", boxShadow, ";color:", pointColor, ";*:hover>&{color:", pointColorHover, ";}" + ( true ? "" : 0), true ? "" : 0);
};
const pointBase = props => {
return /*#__PURE__*/emotion_react_browser_esm_css("background:currentColor;box-sizing:border-box;display:grid;margin:auto;transition:all 120ms linear;", reduceMotion('transition'), " ", pointActive(props), ";" + ( true ? "" : 0), true ? "" : 0);
};
const Point = createStyled("span", true ? {
target: "ecapk1j1"
} : 0)("height:6px;width:6px;", pointBase, ";" + ( true ? "" : 0));
const Cell = createStyled("span", true ? {
target: "ecapk1j0"
} : 0)( true ? {
name: "rjf3ub",
styles: "appearance:none;border:none;box-sizing:border-box;margin:0;display:flex;position:relative;outline:none;align-items:center;justify-content:center;padding:0"
} : 0);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/cell.js
/**
* Internal dependencies
*/
/**
* Internal dependencies
*/
function cell_Cell(_ref) {
let {
isActive = false,
value,
...props
} = _ref;
const tooltipText = ALIGNMENT_LABEL[value];
return (0,external_wp_element_namespaceObject.createElement)(tooltip, {
text: tooltipText
}, (0,external_wp_element_namespaceObject.createElement)(CompositeItem, extends_extends({
as: Cell,
role: "gridcell"
}, props), (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, null, value), (0,external_wp_element_namespaceObject.createElement)(Point, {
isActive: isActive,
role: "presentation"
})));
}
;// CONCATENATED MODULE: ./node_modules/reakit-utils/es/useSealedState.js
/**
* React custom hook that returns the very first value passed to `initialState`,
* even if it changes between re-renders.
*/
function useSealedState(initialState) {
var _React$useState = (0,external_React_.useState)(initialState),
sealed = _React$useState[0];
return sealed;
}
;// CONCATENATED MODULE: ./node_modules/reakit/es/reverse-30eaa122.js
function groupItems(items) {
var groups = [[]];
var _loop = function _loop() {
var item = _step.value;
var group = groups.find(function (g) {
return !g[0] || g[0].groupId === item.groupId;
});
if (group) {
group.push(item);
} else {
groups.push([item]);
}
};
for (var _iterator = _createForOfIteratorHelperLoose(items), _step; !(_step = _iterator()).done;) {
_loop();
}
return groups;
}
function flatten(grid) {
var flattened = [];
for (var _iterator = _createForOfIteratorHelperLoose(grid), _step; !(_step = _iterator()).done;) {
var row = _step.value;
flattened.push.apply(flattened, row);
}
return flattened;
}
function reverse(array) {
return array.slice().reverse();
}
;// CONCATENATED MODULE: ./node_modules/reakit/es/findEnabledItemById-8ddca752.js
function findEnabledItemById(items, id) {
if (!id) return undefined;
return items === null || items === void 0 ? void 0 : items.find(function (item) {
return item.id === id && !item.disabled;
});
}
;// CONCATENATED MODULE: ./node_modules/reakit-utils/es/applyState.js
function isUpdater(argument) {
return typeof argument === "function";
}
/**
* Receives a `setState` argument and calls it with `currentValue` if it's a
* function. Otherwise return the argument as the new value.
*
* @example
* import { applyState } from "reakit-utils";
*
* applyState((value) => value + 1, 1); // 2
* applyState(2, 1); // 2
*/
function applyState(argument, currentValue) {
if (isUpdater(argument)) {
return argument(currentValue);
}
return argument;
}
;// CONCATENATED MODULE: ./node_modules/reakit/es/Id/IdState.js
function unstable_useIdState(initialState) {
if (initialState === void 0) {
initialState = {};
}
var _useSealedState = useSealedState(initialState),
initialBaseId = _useSealedState.baseId;
var generateId = (0,external_React_.useContext)(unstable_IdContext);
var idCountRef = (0,external_React_.useRef)(0);
var _React$useState = (0,external_React_.useState)(function () {
return initialBaseId || generateId();
}),
baseId = _React$useState[0],
setBaseId = _React$useState[1];
return {
baseId: baseId,
setBaseId: setBaseId,
unstable_idCountRef: idCountRef
};
}
;// CONCATENATED MODULE: ./node_modules/reakit/es/Composite/CompositeState.js
function isElementPreceding(element1, element2) {
return Boolean(element2.compareDocumentPosition(element1) & Node.DOCUMENT_POSITION_PRECEDING);
}
function findDOMIndex(items, item) {
return items.findIndex(function (currentItem) {
if (!currentItem.ref.current || !item.ref.current) {
return false;
}
return isElementPreceding(item.ref.current, currentItem.ref.current);
});
}
function getMaxLength(rows) {
var maxLength = 0;
for (var _iterator = _createForOfIteratorHelperLoose(rows), _step; !(_step = _iterator()).done;) {
var length = _step.value.length;
if (length > maxLength) {
maxLength = length;
}
}
return maxLength;
}
/**
* Turns [row1, row1, row2, row2] into [row1, row2, row1, row2]
*/
function verticalizeItems(items) {
var groups = groupItems(items);
var maxLength = getMaxLength(groups);
var verticalized = [];
for (var i = 0; i < maxLength; i += 1) {
for (var _iterator = _createForOfIteratorHelperLoose(groups), _step; !(_step = _iterator()).done;) {
var group = _step.value;
if (group[i]) {
verticalized.push(_objectSpread2(_objectSpread2({}, group[i]), {}, {
// If there's no groupId, it means that it's not a grid composite,
// but a single row instead. So, instead of verticalizing it, that
// is, assigning a different groupId based on the column index, we
// keep it undefined so they will be part of the same group.
// It's useful when using up/down on one-dimensional composites.
groupId: group[i].groupId ? "" + i : undefined
}));
}
}
}
return verticalized;
}
function createEmptyItem(groupId) {
return {
id: "__EMPTY_ITEM__",
disabled: true,
ref: {
current: null
},
groupId: groupId
};
}
/**
* Turns [[row1, row1], [row2]] into [[row1, row1], [row2, row2]]
*/
function fillGroups(groups, currentId, shift) {
var maxLength = getMaxLength(groups);
for (var _iterator = _createForOfIteratorHelperLoose(groups), _step; !(_step = _iterator()).done;) {
var group = _step.value;
for (var i = 0; i < maxLength; i += 1) {
var item = group[i];
if (!item || shift && item.disabled) {
var isFrist = i === 0;
var previousItem = isFrist && shift ? findFirstEnabledItem(group) : group[i - 1];
group[i] = previousItem && currentId !== (previousItem === null || previousItem === void 0 ? void 0 : previousItem.id) && shift ? previousItem : createEmptyItem(previousItem === null || previousItem === void 0 ? void 0 : previousItem.groupId);
}
}
}
return groups;
}
var nullItem = {
id: null,
ref: {
current: null
}
};
function placeItemsAfter(items, id, shouldInsertNullItem) {
var index = items.findIndex(function (item) {
return item.id === id;
});
return [].concat(items.slice(index + 1), shouldInsertNullItem ? [nullItem] : [], items.slice(0, index));
}
function getItemsInGroup(items, groupId) {
return items.filter(function (item) {
return item.groupId === groupId;
});
}
var map = {
horizontal: "vertical",
vertical: "horizontal"
};
function getOppositeOrientation(orientation) {
return orientation && map[orientation];
}
function addItemAtIndex(array, item, index) {
if (!(index in array)) {
return [].concat(array, [item]);
}
return [].concat(array.slice(0, index), [item], array.slice(index));
}
function sortBasedOnDOMPosition(items) {
var pairs = items.map(function (item, index) {
return [index, item];
});
var isOrderDifferent = false;
pairs.sort(function (_ref, _ref2) {
var indexA = _ref[0],
a = _ref[1];
var indexB = _ref2[0],
b = _ref2[1];
var elementA = a.ref.current;
var elementB = b.ref.current;
if (!elementA || !elementB) return 0; // a before b
if (isElementPreceding(elementA, elementB)) {
if (indexA > indexB) {
isOrderDifferent = true;
}
return -1;
} // a after b
if (indexA < indexB) {
isOrderDifferent = true;
}
return 1;
});
if (isOrderDifferent) {
return pairs.map(function (_ref3) {
var _ = _ref3[0],
item = _ref3[1];
return item;
});
}
return items;
}
function setItemsBasedOnDOMPosition(items, setItems) {
var sortedItems = sortBasedOnDOMPosition(items);
if (items !== sortedItems) {
setItems(sortedItems);
}
}
function getCommonParent(items) {
var _firstItem$ref$curren;
var firstItem = items[0],
nextItems = items.slice(1);
var parentElement = firstItem === null || firstItem === void 0 ? void 0 : (_firstItem$ref$curren = firstItem.ref.current) === null || _firstItem$ref$curren === void 0 ? void 0 : _firstItem$ref$curren.parentElement;
var _loop = function _loop() {
var parent = parentElement;
if (nextItems.every(function (item) {
return parent.contains(item.ref.current);
})) {
return {
v: parentElement
};
}
parentElement = parentElement.parentElement;
};
while (parentElement) {
var _ret = _loop();
if (typeof _ret === "object") return _ret.v;
}
return getDocument(parentElement).body;
} // istanbul ignore next: JSDOM doesn't support IntersectionObverser
// See https://github.com/jsdom/jsdom/issues/2032
function CompositeState_useIntersectionObserver(items, setItems) {
var previousItems = (0,external_React_.useRef)([]);
(0,external_React_.useEffect)(function () {
var callback = function callback() {
var hasPreviousItems = !!previousItems.current.length; // We don't want to sort items if items have been just registered.
if (hasPreviousItems) {
setItemsBasedOnDOMPosition(items, setItems);
}
previousItems.current = items;
};
var root = getCommonParent(items);
var observer = new IntersectionObserver(callback, {
root: root
});
for (var _iterator = _createForOfIteratorHelperLoose(items), _step; !(_step = _iterator()).done;) {
var item = _step.value;
if (item.ref.current) {
observer.observe(item.ref.current);
}
}
return function () {
observer.disconnect();
};
}, [items]);
}
function useTimeoutObserver(items, setItems) {
(0,external_React_.useEffect)(function () {
var callback = function callback() {
return setItemsBasedOnDOMPosition(items, setItems);
};
var timeout = setTimeout(callback, 250);
return function () {
return clearTimeout(timeout);
};
});
}
function useSortBasedOnDOMPosition(items, setItems) {
if (typeof IntersectionObserver === "function") {
CompositeState_useIntersectionObserver(items, setItems);
} else {
useTimeoutObserver(items, setItems);
}
}
function reducer(state, action) {
var virtual = state.unstable_virtual,
rtl = state.rtl,
orientation = state.orientation,
items = state.items,
groups = state.groups,
currentId = state.currentId,
loop = state.loop,
wrap = state.wrap,
pastIds = state.pastIds,
shift = state.shift,
moves = state.unstable_moves,
includesBaseElement = state.unstable_includesBaseElement,
initialVirtual = state.initialVirtual,
initialRTL = state.initialRTL,
initialOrientation = state.initialOrientation,
initialCurrentId = state.initialCurrentId,
initialLoop = state.initialLoop,
initialWrap = state.initialWrap,
initialShift = state.initialShift,
hasSetCurrentId = state.hasSetCurrentId;
switch (action.type) {
case "registerGroup":
{
var _group = action.group; // If there are no groups yet, just add it as the first one
if (groups.length === 0) {
return _objectSpread2(_objectSpread2({}, state), {}, {
groups: [_group]
});
} // Finds the group index based on DOM position
var index = findDOMIndex(groups, _group);
return _objectSpread2(_objectSpread2({}, state), {}, {
groups: addItemAtIndex(groups, _group, index)
});
}
case "unregisterGroup":
{
var _id = action.id;
var nextGroups = groups.filter(function (group) {
return group.id !== _id;
}); // The group isn't registered, so do nothing
if (nextGroups.length === groups.length) {
return state;
}
return _objectSpread2(_objectSpread2({}, state), {}, {
groups: nextGroups
});
}
case "registerItem":
{
var _item = action.item; // Finds the item group based on the DOM hierarchy
var _group2 = groups.find(function (r) {
var _r$ref$current;
return (_r$ref$current = r.ref.current) === null || _r$ref$current === void 0 ? void 0 : _r$ref$current.contains(_item.ref.current);
}); // Group will be null if it's a one-dimensional composite
var nextItem = _objectSpread2({
groupId: _group2 === null || _group2 === void 0 ? void 0 : _group2.id
}, _item);
var _index = findDOMIndex(items, nextItem);
var nextState = _objectSpread2(_objectSpread2({}, state), {}, {
items: addItemAtIndex(items, nextItem, _index)
});
if (!hasSetCurrentId && !moves && initialCurrentId === undefined) {
var _findFirstEnabledItem;
// Sets currentId to the first enabled item. This runs whenever an item
// is registered because the first enabled item may be registered
// asynchronously.
return _objectSpread2(_objectSpread2({}, nextState), {}, {
currentId: (_findFirstEnabledItem = findFirstEnabledItem(nextState.items)) === null || _findFirstEnabledItem === void 0 ? void 0 : _findFirstEnabledItem.id
});
}
return nextState;
}
case "unregisterItem":
{
var _id2 = action.id;
var nextItems = items.filter(function (item) {
return item.id !== _id2;
}); // The item isn't registered, so do nothing
if (nextItems.length === items.length) {
return state;
} // Filters out the item that is being removed from the pastIds list
var nextPastIds = pastIds.filter(function (pastId) {
return pastId !== _id2;
});
var _nextState = _objectSpread2(_objectSpread2({}, state), {}, {
pastIds: nextPastIds,
items: nextItems
}); // If the current item is the item that is being removed, focus pastId
if (currentId && currentId === _id2) {
var nextId = includesBaseElement ? null : getCurrentId(_objectSpread2(_objectSpread2({}, _nextState), {}, {
currentId: nextPastIds[0]
}));
return _objectSpread2(_objectSpread2({}, _nextState), {}, {
currentId: nextId
});
}
return _nextState;
}
case "move":
{
var _id3 = action.id; // move() does nothing
if (_id3 === undefined) {
return state;
} // Removes the current item and the item that is receiving focus from the
// pastIds list
var filteredPastIds = pastIds.filter(function (pastId) {
return pastId !== currentId && pastId !== _id3;
}); // If there's a currentId, add it to the pastIds list so it can be focused
// if the new item gets removed or disabled
var _nextPastIds = currentId ? [currentId].concat(filteredPastIds) : filteredPastIds;
var _nextState2 = _objectSpread2(_objectSpread2({}, state), {}, {
pastIds: _nextPastIds
}); // move(null) will focus the composite element itself, not an item
if (_id3 === null) {
return _objectSpread2(_objectSpread2({}, _nextState2), {}, {
unstable_moves: moves + 1,
currentId: getCurrentId(_nextState2, _id3)
});
}
var _item2 = findEnabledItemById(items, _id3);
return _objectSpread2(_objectSpread2({}, _nextState2), {}, {
unstable_moves: _item2 ? moves + 1 : moves,
currentId: getCurrentId(_nextState2, _item2 === null || _item2 === void 0 ? void 0 : _item2.id)
});
}
case "next":
{
// If there's no item focused, we just move the first one
if (currentId == null) {
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "first"
}));
} // RTL doesn't make sense on vertical navigation
var isHorizontal = orientation !== "vertical";
var isRTL = rtl && isHorizontal;
var allItems = isRTL ? reverse(items) : items;
var currentItem = allItems.find(function (item) {
return item.id === currentId;
}); // If there's no item focused, we just move the first one
if (!currentItem) {
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "first"
}));
}
var isGrid = !!currentItem.groupId;
var currentIndex = allItems.indexOf(currentItem);
var _nextItems = allItems.slice(currentIndex + 1);
var nextItemsInGroup = getItemsInGroup(_nextItems, currentItem.groupId); // Home, End
if (action.allTheWay) {
// We reverse so we can get the last enabled item in the group. If it's
// RTL, nextItems and nextItemsInGroup are already reversed and don't
// have the items before the current one anymore. So we have to get
// items in group again with allItems.
var _nextItem2 = findFirstEnabledItem(isRTL ? getItemsInGroup(allItems, currentItem.groupId) : reverse(nextItemsInGroup));
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: _nextItem2 === null || _nextItem2 === void 0 ? void 0 : _nextItem2.id
}));
}
var oppositeOrientation = getOppositeOrientation( // If it's a grid and orientation is not set, it's a next/previous
// call, which is inherently horizontal. up/down will call next with
// orientation set to vertical by default (see below on up/down cases).
isGrid ? orientation || "horizontal" : orientation);
var canLoop = loop && loop !== oppositeOrientation;
var canWrap = isGrid && wrap && wrap !== oppositeOrientation;
var hasNullItem = // `previous` and `up` will set action.hasNullItem, but when calling
// next directly, hasNullItem will only be true if it's not a grid and
// loop is set to true, which means that pressing right or down keys on
// grids will never focus the composite element. On one-dimensional
// composites that don't loop, pressing right or down keys also doesn't
// focus the composite element.
action.hasNullItem || !isGrid && canLoop && includesBaseElement;
if (canLoop) {
var loopItems = canWrap && !hasNullItem ? allItems : getItemsInGroup(allItems, currentItem.groupId); // Turns [0, 1, current, 3, 4] into [3, 4, 0, 1]
var sortedItems = placeItemsAfter(loopItems, currentId, hasNullItem);
var _nextItem3 = findFirstEnabledItem(sortedItems, currentId);
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: _nextItem3 === null || _nextItem3 === void 0 ? void 0 : _nextItem3.id
}));
}
if (canWrap) {
var _nextItem4 = findFirstEnabledItem( // We can use nextItems, which contains all the next items, including
// items from other groups, to wrap between groups. However, if there
// is a null item (the composite element), we'll only use the next
// items in the group. So moving next from the last item will focus
// the composite element (null). On grid composites, horizontal
// navigation never focuses the composite element, only vertical.
hasNullItem ? nextItemsInGroup : _nextItems, currentId);
var _nextId = hasNullItem ? (_nextItem4 === null || _nextItem4 === void 0 ? void 0 : _nextItem4.id) || null : _nextItem4 === null || _nextItem4 === void 0 ? void 0 : _nextItem4.id;
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: _nextId
}));
}
var _nextItem = findFirstEnabledItem(nextItemsInGroup, currentId);
if (!_nextItem && hasNullItem) {
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: null
}));
}
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: _nextItem === null || _nextItem === void 0 ? void 0 : _nextItem.id
}));
}
case "previous":
{
// If currentId is initially set to null, the composite element will be
// focusable while navigating with arrow keys. But, if it's a grid, we
// don't want to focus the composite element with horizontal navigation.
var _isGrid = !!groups.length;
var _hasNullItem = !_isGrid && includesBaseElement;
var _nextState3 = reducer(_objectSpread2(_objectSpread2({}, state), {}, {
items: reverse(items)
}), _objectSpread2(_objectSpread2({}, action), {}, {
type: "next",
hasNullItem: _hasNullItem
}));
return _objectSpread2(_objectSpread2({}, _nextState3), {}, {
items: items
});
}
case "down":
{
var shouldShift = shift && !action.allTheWay; // First, we make sure groups have the same number of items by filling it
// with disabled fake items. Then, we reorganize the items list so
// [1-1, 1-2, 2-1, 2-2] becomes [1-1, 2-1, 1-2, 2-2].
var verticalItems = verticalizeItems(flatten(fillGroups(groupItems(items), currentId, shouldShift)));
var _canLoop = loop && loop !== "horizontal"; // Pressing down arrow key will only focus the composite element if loop
// is true or vertical.
var _hasNullItem2 = _canLoop && includesBaseElement;
var _nextState4 = reducer(_objectSpread2(_objectSpread2({}, state), {}, {
orientation: "vertical",
items: verticalItems
}), _objectSpread2(_objectSpread2({}, action), {}, {
type: "next",
hasNullItem: _hasNullItem2
}));
return _objectSpread2(_objectSpread2({}, _nextState4), {}, {
orientation: orientation,
items: items
});
}
case "up":
{
var _shouldShift = shift && !action.allTheWay;
var _verticalItems = verticalizeItems(reverse(flatten(fillGroups(groupItems(items), currentId, _shouldShift)))); // If currentId is initially set to null, we'll always focus the
// composite element when the up arrow key is pressed in the first row.
var _hasNullItem3 = includesBaseElement;
var _nextState5 = reducer(_objectSpread2(_objectSpread2({}, state), {}, {
orientation: "vertical",
items: _verticalItems
}), _objectSpread2(_objectSpread2({}, action), {}, {
type: "next",
hasNullItem: _hasNullItem3
}));
return _objectSpread2(_objectSpread2({}, _nextState5), {}, {
orientation: orientation,
items: items
});
}
case "first":
{
var firstItem = findFirstEnabledItem(items);
return reducer(state, _objectSpread2(_objectSpread2({}, action), {}, {
type: "move",
id: firstItem === null || firstItem === void 0 ? void 0 : firstItem.id
}));
}
case "last":
{
var _nextState6 = reducer(_objectSpread2(_objectSpread2({}, state), {}, {
items: reverse(items)
}), _objectSpread2(_objectSpread2({}, action), {}, {
type: "first"
}));
return _objectSpread2(_objectSpread2({}, _nextState6), {}, {
items: items
});
}
case "sort":
{
return _objectSpread2(_objectSpread2({}, state), {}, {
items: sortBasedOnDOMPosition(items),
groups: sortBasedOnDOMPosition(groups)
});
}
case "setVirtual":
return _objectSpread2(_objectSpread2({}, state), {}, {
unstable_virtual: applyState(action.virtual, virtual)
});
case "setRTL":
return _objectSpread2(_objectSpread2({}, state), {}, {
rtl: applyState(action.rtl, rtl)
});
case "setOrientation":
return _objectSpread2(_objectSpread2({}, state), {}, {
orientation: applyState(action.orientation, orientation)
});
case "setCurrentId":
{
var nextCurrentId = getCurrentId(_objectSpread2(_objectSpread2({}, state), {}, {
currentId: applyState(action.currentId, currentId)
}));
return _objectSpread2(_objectSpread2({}, state), {}, {
currentId: nextCurrentId,
hasSetCurrentId: true
});
}
case "setLoop":
return _objectSpread2(_objectSpread2({}, state), {}, {
loop: applyState(action.loop, loop)
});
case "setWrap":
return _objectSpread2(_objectSpread2({}, state), {}, {
wrap: applyState(action.wrap, wrap)
});
case "setShift":
return _objectSpread2(_objectSpread2({}, state), {}, {
shift: applyState(action.shift, shift)
});
case "setIncludesBaseElement":
{
return _objectSpread2(_objectSpread2({}, state), {}, {
unstable_includesBaseElement: applyState(action.includesBaseElement, includesBaseElement)
});
}
case "reset":
return _objectSpread2(_objectSpread2({}, state), {}, {
unstable_virtual: initialVirtual,
rtl: initialRTL,
orientation: initialOrientation,
currentId: getCurrentId(_objectSpread2(_objectSpread2({}, state), {}, {
currentId: initialCurrentId
})),
loop: initialLoop,
wrap: initialWrap,
shift: initialShift,
unstable_moves: 0,
pastIds: []
});
case "setItems":
{
return _objectSpread2(_objectSpread2({}, state), {}, {
items: action.items
});
}
default:
throw new Error();
}
}
function useAction(fn) {
return (0,external_React_.useCallback)(fn, []);
}
function useIsUnmountedRef() {
var isUnmountedRef = (0,external_React_.useRef)(false);
useIsomorphicEffect(function () {
return function () {
isUnmountedRef.current = true;
};
}, []);
return isUnmountedRef;
}
function useCompositeState(initialState) {
if (initialState === void 0) {
initialState = {};
}
var _useSealedState = useSealedState(initialState),
_useSealedState$unsta = _useSealedState.unstable_virtual,
virtual = _useSealedState$unsta === void 0 ? false : _useSealedState$unsta,
_useSealedState$rtl = _useSealedState.rtl,
rtl = _useSealedState$rtl === void 0 ? false : _useSealedState$rtl,
orientation = _useSealedState.orientation,
currentId = _useSealedState.currentId,
_useSealedState$loop = _useSealedState.loop,
loop = _useSealedState$loop === void 0 ? false : _useSealedState$loop,
_useSealedState$wrap = _useSealedState.wrap,
wrap = _useSealedState$wrap === void 0 ? false : _useSealedState$wrap,
_useSealedState$shift = _useSealedState.shift,
shift = _useSealedState$shift === void 0 ? false : _useSealedState$shift,
unstable_includesBaseElement = _useSealedState.unstable_includesBaseElement,
sealed = _objectWithoutPropertiesLoose(_useSealedState, ["unstable_virtual", "rtl", "orientation", "currentId", "loop", "wrap", "shift", "unstable_includesBaseElement"]);
var idState = unstable_useIdState(sealed);
var _React$useReducer = (0,external_React_.useReducer)(reducer, {
unstable_virtual: virtual,
rtl: rtl,
orientation: orientation,
items: [],
groups: [],
currentId: currentId,
loop: loop,
wrap: wrap,
shift: shift,
unstable_moves: 0,
pastIds: [],
unstable_includesBaseElement: unstable_includesBaseElement != null ? unstable_includesBaseElement : currentId === null,
initialVirtual: virtual,
initialRTL: rtl,
initialOrientation: orientation,
initialCurrentId: currentId,
initialLoop: loop,
initialWrap: wrap,
initialShift: shift
}),
_React$useReducer$ = _React$useReducer[0],
pastIds = _React$useReducer$.pastIds,
initialVirtual = _React$useReducer$.initialVirtual,
initialRTL = _React$useReducer$.initialRTL,
initialOrientation = _React$useReducer$.initialOrientation,
initialCurrentId = _React$useReducer$.initialCurrentId,
initialLoop = _React$useReducer$.initialLoop,
initialWrap = _React$useReducer$.initialWrap,
initialShift = _React$useReducer$.initialShift,
hasSetCurrentId = _React$useReducer$.hasSetCurrentId,
state = _objectWithoutPropertiesLoose(_React$useReducer$, ["pastIds", "initialVirtual", "initialRTL", "initialOrientation", "initialCurrentId", "initialLoop", "initialWrap", "initialShift", "hasSetCurrentId"]),
dispatch = _React$useReducer[1];
var _React$useState = (0,external_React_.useState)(false),
hasActiveWidget = _React$useState[0],
setHasActiveWidget = _React$useState[1]; // register/unregister may be called when this component is unmounted. We
// store the unmounted state here so we don't update the state if it's true.
// This only happens in a very specific situation.
// See https://github.com/reakit/reakit/issues/650
var isUnmountedRef = useIsUnmountedRef();
var setItems = (0,external_React_.useCallback)(function (items) {
return dispatch({
type: "setItems",
items: items
});
}, []);
useSortBasedOnDOMPosition(state.items, setItems);
return _objectSpread2(_objectSpread2(_objectSpread2({}, idState), state), {}, {
unstable_hasActiveWidget: hasActiveWidget,
unstable_setHasActiveWidget: setHasActiveWidget,
registerItem: useAction(function (item) {
if (isUnmountedRef.current) return;
dispatch({
type: "registerItem",
item: item
});
}),
unregisterItem: useAction(function (id) {
if (isUnmountedRef.current) return;
dispatch({
type: "unregisterItem",
id: id
});
}),
registerGroup: useAction(function (group) {
if (isUnmountedRef.current) return;
dispatch({
type: "registerGroup",
group: group
});
}),
unregisterGroup: useAction(function (id) {
if (isUnmountedRef.current) return;
dispatch({
type: "unregisterGroup",
id: id
});
}),
move: useAction(function (id) {
return dispatch({
type: "move",
id: id
});
}),
next: useAction(function (allTheWay) {
return dispatch({
type: "next",
allTheWay: allTheWay
});
}),
previous: useAction(function (allTheWay) {
return dispatch({
type: "previous",
allTheWay: allTheWay
});
}),
up: useAction(function (allTheWay) {
return dispatch({
type: "up",
allTheWay: allTheWay
});
}),
down: useAction(function (allTheWay) {
return dispatch({
type: "down",
allTheWay: allTheWay
});
}),
first: useAction(function () {
return dispatch({
type: "first"
});
}),
last: useAction(function () {
return dispatch({
type: "last"
});
}),
sort: useAction(function () {
return dispatch({
type: "sort"
});
}),
unstable_setVirtual: useAction(function (value) {
return dispatch({
type: "setVirtual",
virtual: value
});
}),
setRTL: useAction(function (value) {
return dispatch({
type: "setRTL",
rtl: value
});
}),
setOrientation: useAction(function (value) {
return dispatch({
type: "setOrientation",
orientation: value
});
}),
setCurrentId: useAction(function (value) {
return dispatch({
type: "setCurrentId",
currentId: value
});
}),
setLoop: useAction(function (value) {
return dispatch({
type: "setLoop",
loop: value
});
}),
setWrap: useAction(function (value) {
return dispatch({
type: "setWrap",
wrap: value
});
}),
setShift: useAction(function (value) {
return dispatch({
type: "setShift",
shift: value
});
}),
unstable_setIncludesBaseElement: useAction(function (value) {
return dispatch({
type: "setIncludesBaseElement",
includesBaseElement: value
});
}),
reset: useAction(function () {
return dispatch({
type: "reset"
});
})
});
}
;// CONCATENATED MODULE: ./node_modules/reakit-utils/es/fireBlurEvent.js
function createFocusEvent(element, type, eventInit) {
if (eventInit === void 0) {
eventInit = {};
}
if (typeof FocusEvent === "function") {
return new FocusEvent(type, eventInit);
}
return createEvent(element, type, eventInit);
}
/**
* Creates and dispatches a blur event in a way that also works on IE 11.
*
* @example
* import { fireBlurEvent } from "reakit-utils";
*
* fireBlurEvent(document.getElementById("id"));
*/
function fireBlurEvent(element, eventInit) {
var event = createFocusEvent(element, "blur", eventInit);
var defaultAllowed = element.dispatchEvent(event);
var bubbleInit = _rollupPluginBabelHelpers_1f0bf8c2_objectSpread2(_rollupPluginBabelHelpers_1f0bf8c2_objectSpread2({}, eventInit), {}, {
bubbles: true
});
element.dispatchEvent(createFocusEvent(element, "focusout", bubbleInit));
return defaultAllowed;
}
;// CONCATENATED MODULE: ./node_modules/reakit-utils/es/fireKeyboardEvent.js
function createKeyboardEvent(element, type, eventInit) {
if (eventInit === void 0) {
eventInit = {};
}
if (typeof KeyboardEvent === "function") {
return new KeyboardEvent(type, eventInit);
} // IE 11 doesn't support Event constructors
var event = getDocument(element).createEvent("KeyboardEvent");
event.initKeyboardEvent(type, eventInit.bubbles, eventInit.cancelable, getWindow(element), eventInit.key, eventInit.location, eventInit.ctrlKey, eventInit.altKey, eventInit.shiftKey, eventInit.metaKey);
return event;
}
/**
* Creates and dispatches `KeyboardEvent` in a way that also works on IE 11.
*
* @example
* import { fireKeyboardEvent } from "reakit-utils";
*
* fireKeyboardEvent(document.getElementById("id"), "keydown", {
* key: "ArrowDown",
* shiftKey: true,
* });
*/
function fireKeyboardEvent(element, type, eventInit) {
return element.dispatchEvent(createKeyboardEvent(element, type, eventInit));
}
;// CONCATENATED MODULE: ./node_modules/reakit-utils/es/getNextActiveElementOnBlur.js
var isIE11 = canUseDOM && "msCrypto" in window;
/**
* Cross-browser method that returns the next active element (the element that
* is receiving focus) after a blur event is dispatched. It receives the blur
* event object as the argument.
*
* @example
* import { getNextActiveElementOnBlur } from "reakit-utils";
*
* const element = document.getElementById("id");
* element.addEventListener("blur", (event) => {
* const nextActiveElement = getNextActiveElementOnBlur(event);
* });
*/
function getNextActiveElementOnBlur(event) {
// IE 11 doesn't support event.relatedTarget on blur.
// document.activeElement points the the next active element.
// On modern browsers, document.activeElement points to the current target.
if (isIE11) {
var activeElement = getActiveElement_getActiveElement(event.currentTarget);
return activeElement;
}
return event.relatedTarget;
}
;// CONCATENATED MODULE: ./node_modules/reakit/es/Composite/Composite.js
var Composite_isIE11 = canUseDOM && "msCrypto" in window;
function canProxyKeyboardEvent(event) {
if (!isSelfTarget(event)) return false;
if (event.metaKey) return false;
if (event.key === "Tab") return false;
return true;
}
function useKeyboardEventProxy(virtual, currentItem, htmlEventHandler) {
var eventHandlerRef = useLiveRef(htmlEventHandler);
return (0,external_React_.useCallback)(function (event) {
var _eventHandlerRef$curr;
(_eventHandlerRef$curr = eventHandlerRef.current) === null || _eventHandlerRef$curr === void 0 ? void 0 : _eventHandlerRef$curr.call(eventHandlerRef, event);
if (event.defaultPrevented) return;
if (virtual && canProxyKeyboardEvent(event)) {
var currentElement = currentItem === null || currentItem === void 0 ? void 0 : currentItem.ref.current;
if (currentElement) {
if (!fireKeyboardEvent(currentElement, event.type, event)) {
event.preventDefault();
} // The event will be triggered on the composite item and then
// propagated up to this composite element again, so we can pretend
// that it wasn't called on this component in the first place.
if (event.currentTarget.contains(currentElement)) {
event.stopPropagation();
}
}
}
}, [virtual, currentItem]);
} // istanbul ignore next
function useActiveElementRef(elementRef) {
var activeElementRef = (0,external_React_.useRef)(null);
(0,external_React_.useEffect)(function () {
var document = getDocument(elementRef.current);
var onFocus = function onFocus(event) {
var target = event.target;
activeElementRef.current = target;
};
document.addEventListener("focus", onFocus, true);
return function () {
document.removeEventListener("focus", onFocus, true);
};
}, []);
return activeElementRef;
}
function findFirstEnabledItemInTheLastRow(items) {
return findFirstEnabledItem(flatten(reverse(groupItems(items))));
}
function isItem(items, element) {
return items === null || items === void 0 ? void 0 : items.some(function (item) {
return !!element && item.ref.current === element;
});
}
function useScheduleUserFocus(currentItem) {
var currentItemRef = useLiveRef(currentItem);
var _React$useReducer = (0,external_React_.useReducer)(function (n) {
return n + 1;
}, 0),
scheduled = _React$useReducer[0],
schedule = _React$useReducer[1];
(0,external_React_.useEffect)(function () {
var _currentItemRef$curre;
var currentElement = (_currentItemRef$curre = currentItemRef.current) === null || _currentItemRef$curre === void 0 ? void 0 : _currentItemRef$curre.ref.current;
if (scheduled && currentElement) {
userFocus(currentElement);
}
}, [scheduled]);
return schedule;
}
var useComposite = createHook({
name: "Composite",
compose: [useTabbable],
keys: COMPOSITE_KEYS,
useOptions: function useOptions(options) {
return _objectSpread2(_objectSpread2({}, options), {}, {
currentId: getCurrentId(options)
});
},
useProps: function useProps(options, _ref) {
var htmlRef = _ref.ref,
htmlOnFocusCapture = _ref.onFocusCapture,
htmlOnFocus = _ref.onFocus,
htmlOnBlurCapture = _ref.onBlurCapture,
htmlOnKeyDown = _ref.onKeyDown,
htmlOnKeyDownCapture = _ref.onKeyDownCapture,
htmlOnKeyUpCapture = _ref.onKeyUpCapture,
htmlProps = _objectWithoutPropertiesLoose(_ref, ["ref", "onFocusCapture", "onFocus", "onBlurCapture", "onKeyDown", "onKeyDownCapture", "onKeyUpCapture"]);
var ref = (0,external_React_.useRef)(null);
var currentItem = findEnabledItemById(options.items, options.currentId);
var previousElementRef = (0,external_React_.useRef)(null);
var onFocusCaptureRef = useLiveRef(htmlOnFocusCapture);
var onFocusRef = useLiveRef(htmlOnFocus);
var onBlurCaptureRef = useLiveRef(htmlOnBlurCapture);
var onKeyDownRef = useLiveRef(htmlOnKeyDown);
var scheduleUserFocus = useScheduleUserFocus(currentItem); // IE 11 doesn't support event.relatedTarget, so we use the active element
// ref instead.
var activeElementRef = Composite_isIE11 ? useActiveElementRef(ref) : undefined;
(0,external_React_.useEffect)(function () {
var element = ref.current;
if (options.unstable_moves && !currentItem) {
false ? 0 : void 0; // If composite.move(null) has been called, the composite container
// will receive focus.
element === null || element === void 0 ? void 0 : element.focus();
}
}, [options.unstable_moves, currentItem]);
var onKeyDownCapture = useKeyboardEventProxy(options.unstable_virtual, currentItem, htmlOnKeyDownCapture);
var onKeyUpCapture = useKeyboardEventProxy(options.unstable_virtual, currentItem, htmlOnKeyUpCapture);
var onFocusCapture = (0,external_React_.useCallback)(function (event) {
var _onFocusCaptureRef$cu;
(_onFocusCaptureRef$cu = onFocusCaptureRef.current) === null || _onFocusCaptureRef$cu === void 0 ? void 0 : _onFocusCaptureRef$cu.call(onFocusCaptureRef, event);
if (event.defaultPrevented) return;
if (!options.unstable_virtual) return; // IE11 doesn't support event.relatedTarget, so we use the active
// element ref instead.
var previousActiveElement = (activeElementRef === null || activeElementRef === void 0 ? void 0 : activeElementRef.current) || event.relatedTarget;
var previousActiveElementWasItem = isItem(options.items, previousActiveElement);
if (isSelfTarget(event) && previousActiveElementWasItem) {
// Composite has been focused as a result of an item receiving focus.
// The composite item will move focus back to the composite
// container. In this case, we don't want to propagate this
// additional event nor call the onFocus handler passed to
// .
event.stopPropagation(); // We keep track of the previous active item element so we can
// manually fire a blur event on it later when the focus is moved to
// another item on the onBlurCapture event below.
previousElementRef.current = previousActiveElement;
}
}, [options.unstable_virtual, options.items]);
var onFocus = (0,external_React_.useCallback)(function (event) {
var _onFocusRef$current;
(_onFocusRef$current = onFocusRef.current) === null || _onFocusRef$current === void 0 ? void 0 : _onFocusRef$current.call(onFocusRef, event);
if (event.defaultPrevented) return;
if (options.unstable_virtual) {
if (isSelfTarget(event)) {
// This means that the composite element has been focused while the
// composite item has not. For example, by clicking on the
// composite element without touching any item, or by tabbing into
// the composite element. In this case, we want to trigger focus on
// the item, just like it would happen with roving tabindex.
// When it receives focus, the composite item will put focus back
// on the composite element, in which case hasItemWithFocus will be
// true.
scheduleUserFocus();
}
} else if (isSelfTarget(event)) {
var _options$setCurrentId;
// When the roving tabindex composite gets intentionally focused (for
// example, by clicking directly on it, and not on an item), we make
// sure to set the current id to null (which means the composite
// itself is focused).
(_options$setCurrentId = options.setCurrentId) === null || _options$setCurrentId === void 0 ? void 0 : _options$setCurrentId.call(options, null);
}
}, [options.unstable_virtual, options.setCurrentId]);
var onBlurCapture = (0,external_React_.useCallback)(function (event) {
var _onBlurCaptureRef$cur;
(_onBlurCaptureRef$cur = onBlurCaptureRef.current) === null || _onBlurCaptureRef$cur === void 0 ? void 0 : _onBlurCaptureRef$cur.call(onBlurCaptureRef, event);
if (event.defaultPrevented) return;
if (!options.unstable_virtual) return; // When virtual is set to true, we move focus from the composite
// container (this component) to the composite item that is being
// selected. Then we move focus back to the composite container. This
// is so we can provide the same API as the roving tabindex method,
// which means people can attach onFocus/onBlur handlers on the
// CompositeItem component regardless of whether it's virtual or not.
// This sequence of blurring and focusing items and composite may be
// confusing, so we ignore intermediate focus and blurs by stopping its
// propagation and not calling the passed onBlur handler (htmlOnBlur).
var currentElement = (currentItem === null || currentItem === void 0 ? void 0 : currentItem.ref.current) || null;
var nextActiveElement = getNextActiveElementOnBlur(event);
var nextActiveElementIsItem = isItem(options.items, nextActiveElement);
if (isSelfTarget(event) && nextActiveElementIsItem) {
// This is an intermediate blur event: blurring the composite
// container to focus an item (nextActiveElement).
if (nextActiveElement === currentElement) {
// The next active element will be the same as the current item in
// the state in two scenarios:
// - Moving focus with keyboard: the state is updated before the
// blur event is triggered, so here the current item is already
// pointing to the next active element.
// - Clicking on the current active item with a pointer: this
// will trigger blur on the composite element and then the next
// active element will be the same as the current item. Clicking on
// an item other than the current one doesn't end up here as the
// currentItem state will be updated only after it.
if (previousElementRef.current && previousElementRef.current !== nextActiveElement) {
// If there's a previous active item and it's not a click action,
// then we fire a blur event on it so it will work just like if
// it had DOM focus before (like when using roving tabindex).
fireBlurEvent(previousElementRef.current, event);
}
} else if (currentElement) {
// This will be true when the next active element is not the
// current element, but there's a current item. This will only
// happen when clicking with a pointer on a different item, when
// there's already an item selected, in which case currentElement
// is the item that is getting blurred, and nextActiveElement is
// the item that is being clicked.
fireBlurEvent(currentElement, event);
} // We want to ignore intermediate blur events, so we stop its
// propagation and return early so onFocus will not be called.
event.stopPropagation();
} else {
var targetIsItem = isItem(options.items, event.target);
if (!targetIsItem && currentElement) {
// If target is not a composite item, it may be the composite
// element itself (isSelfTarget) or a tabbable element inside the
// composite widget. This may be triggered by clicking outside the
// composite widget or by tabbing out of it. In either cases we
// want to fire a blur event on the current item.
fireBlurEvent(currentElement, event);
}
}
}, [options.unstable_virtual, options.items, currentItem]);
var onKeyDown = (0,external_React_.useCallback)(function (event) {
var _onKeyDownRef$current, _options$groups;
(_onKeyDownRef$current = onKeyDownRef.current) === null || _onKeyDownRef$current === void 0 ? void 0 : _onKeyDownRef$current.call(onKeyDownRef, event);
if (event.defaultPrevented) return;
if (options.currentId !== null) return;
if (!isSelfTarget(event)) return;
var isVertical = options.orientation !== "horizontal";
var isHorizontal = options.orientation !== "vertical";
var isGrid = !!((_options$groups = options.groups) !== null && _options$groups !== void 0 && _options$groups.length);
var up = function up() {
if (isGrid) {
var item = findFirstEnabledItemInTheLastRow(options.items);
if (item !== null && item !== void 0 && item.id) {
var _options$move;
(_options$move = options.move) === null || _options$move === void 0 ? void 0 : _options$move.call(options, item.id);
}
} else {
var _options$last;
(_options$last = options.last) === null || _options$last === void 0 ? void 0 : _options$last.call(options);
}
};
var keyMap = {
ArrowUp: (isGrid || isVertical) && up,
ArrowRight: (isGrid || isHorizontal) && options.first,
ArrowDown: (isGrid || isVertical) && options.first,
ArrowLeft: (isGrid || isHorizontal) && options.last,
Home: options.first,
End: options.last,
PageUp: options.first,
PageDown: options.last
};
var action = keyMap[event.key];
if (action) {
event.preventDefault();
action();
}
}, [options.currentId, options.orientation, options.groups, options.items, options.move, options.last, options.first]);
return _objectSpread2({
ref: useForkRef(ref, htmlRef),
id: options.baseId,
onFocus: onFocus,
onFocusCapture: onFocusCapture,
onBlurCapture: onBlurCapture,
onKeyDownCapture: onKeyDownCapture,
onKeyDown: onKeyDown,
onKeyUpCapture: onKeyUpCapture,
"aria-activedescendant": options.unstable_virtual ? (currentItem === null || currentItem === void 0 ? void 0 : currentItem.id) || undefined : undefined
}, htmlProps);
},
useComposeProps: function useComposeProps(options, htmlProps) {
htmlProps = useRole(options, htmlProps, true);
var tabbableHTMLProps = useTabbable(options, htmlProps, true);
if (options.unstable_virtual || options.currentId === null) {
// Composite will only be tabbable by default if the focus is managed
// using aria-activedescendant, which requires DOM focus on the container
// element (the composite)
return _objectSpread2({
tabIndex: 0
}, tabbableHTMLProps);
}
return _objectSpread2(_objectSpread2({}, htmlProps), {}, {
ref: tabbableHTMLProps.ref
});
}
});
var Composite = createComponent({
as: "div",
useHook: useComposite,
useCreateElement: function useCreateElement$1(type, props, children) {
false ? 0 : void 0;
return useCreateElement(type, props, children);
}
});
;// CONCATENATED MODULE: ./node_modules/reakit/es/Group/Group.js
// Automatically generated
var GROUP_KEYS = [];
var useGroup = createHook({
name: "Group",
compose: useRole,
keys: GROUP_KEYS,
useProps: function useProps(_, htmlProps) {
return _objectSpread2({
role: "group"
}, htmlProps);
}
});
var Group = createComponent({
as: "div",
useHook: useGroup
});
;// CONCATENATED MODULE: ./node_modules/reakit/es/Composite/CompositeGroup.js
var useCompositeGroup = createHook({
name: "CompositeGroup",
compose: [useGroup, unstable_useId],
keys: COMPOSITE_GROUP_KEYS,
propsAreEqual: function propsAreEqual(prev, next) {
if (!next.id || prev.id !== next.id) {
return useGroup.unstable_propsAreEqual(prev, next);
}
var prevCurrentId = prev.currentId,
prevMoves = prev.unstable_moves,
prevProps = _objectWithoutPropertiesLoose(prev, ["currentId", "unstable_moves"]);
var nextCurrentId = next.currentId,
nextMoves = next.unstable_moves,
nextProps = _objectWithoutPropertiesLoose(next, ["currentId", "unstable_moves"]);
if (prev.items && next.items) {
var prevCurrentItem = findEnabledItemById(prev.items, prevCurrentId);
var nextCurrentItem = findEnabledItemById(next.items, nextCurrentId);
var prevGroupId = prevCurrentItem === null || prevCurrentItem === void 0 ? void 0 : prevCurrentItem.groupId;
var nextGroupId = nextCurrentItem === null || nextCurrentItem === void 0 ? void 0 : nextCurrentItem.groupId;
if (next.id === nextGroupId || next.id === prevGroupId) {
return false;
}
}
return useGroup.unstable_propsAreEqual(prevProps, nextProps);
},
useProps: function useProps(options, _ref) {
var htmlRef = _ref.ref,
htmlProps = _objectWithoutPropertiesLoose(_ref, ["ref"]);
var ref = (0,external_React_.useRef)(null);
var id = options.id; // We need this to be called before CompositeItems' register
useIsomorphicEffect(function () {
var _options$registerGrou;
if (!id) return undefined;
(_options$registerGrou = options.registerGroup) === null || _options$registerGrou === void 0 ? void 0 : _options$registerGrou.call(options, {
id: id,
ref: ref
});
return function () {
var _options$unregisterGr;
(_options$unregisterGr = options.unregisterGroup) === null || _options$unregisterGr === void 0 ? void 0 : _options$unregisterGr.call(options, id);
};
}, [id, options.registerGroup, options.unregisterGroup]);
return _objectSpread2({
ref: useForkRef(ref, htmlRef)
}, htmlProps);
}
});
var CompositeGroup = createComponent({
as: "div",
useHook: useCompositeGroup
});
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js
function alignment_matrix_control_icon_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const alignment_matrix_control_icon_styles_rootSize = () => {
const padding = 1.5;
const size = 24;
return /*#__PURE__*/emotion_react_browser_esm_css({
gridTemplateRows: `repeat( 3, calc( ${size - padding * 2}px / 3))`,
padding,
maxHeight: size,
maxWidth: size
}, true ? "" : 0, true ? "" : 0);
};
const rootPointerEvents = _ref => {
let {
disablePointerEvents
} = _ref;
return /*#__PURE__*/emotion_react_browser_esm_css({
pointerEvents: disablePointerEvents ? 'none' : undefined
}, true ? "" : 0, true ? "" : 0);
};
const Wrapper = createStyled("div", true ? {
target: "erowt52"
} : 0)( true ? {
name: "ogl07i",
styles: "box-sizing:border-box;padding:2px"
} : 0);
const alignment_matrix_control_icon_styles_Root = createStyled("div", true ? {
target: "erowt51"
} : 0)("transform-origin:top left;height:100%;width:100%;", rootBase, ";", alignment_matrix_control_icon_styles_rootSize, ";", rootPointerEvents, ";" + ( true ? "" : 0));
const alignment_matrix_control_icon_styles_pointActive = _ref2 => {
let {
isActive
} = _ref2;
const boxShadow = isActive ? `0 0 0 1px currentColor` : null;
return /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", boxShadow, ";color:currentColor;*:hover>&{color:currentColor;}" + ( true ? "" : 0), true ? "" : 0);
};
const alignment_matrix_control_icon_styles_Point = createStyled("span", true ? {
target: "erowt50"
} : 0)("height:2px;width:2px;", pointBase, ";", alignment_matrix_control_icon_styles_pointActive, ";" + ( true ? "" : 0));
const alignment_matrix_control_icon_styles_Cell = Cell;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/icon.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const BASE_SIZE = 24;
function AlignmentMatrixControlIcon(_ref) {
let {
className,
disablePointerEvents = true,
size = BASE_SIZE,
style = {},
value = 'center',
...props
} = _ref;
const alignIndex = getAlignmentIndex(value);
const scale = (size / BASE_SIZE).toFixed(2);
const classes = classnames_default()('component-alignment-matrix-control-icon', className);
const styles = { ...style,
transform: `scale(${scale})`
};
return (0,external_wp_element_namespaceObject.createElement)(alignment_matrix_control_icon_styles_Root, extends_extends({}, props, {
className: classes,
disablePointerEvents: disablePointerEvents,
role: "presentation",
style: styles
}), ALIGNMENTS.map((align, index) => {
const isActive = alignIndex === index;
return (0,external_wp_element_namespaceObject.createElement)(alignment_matrix_control_icon_styles_Cell, {
key: align
}, (0,external_wp_element_namespaceObject.createElement)(alignment_matrix_control_icon_styles_Point, {
isActive: isActive
}));
}));
}
/* harmony default export */ var icon = (AlignmentMatrixControlIcon);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const alignment_matrix_control_noop = () => {};
function useBaseId(id) {
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(AlignmentMatrixControl, 'alignment-matrix-control');
return id || instanceId;
}
/**
*
* AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.
*
* ```jsx
* import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';
* import { useState } from '@wordpress/element';
*
* const Example = () => {
* const [ alignment, setAlignment ] = useState( 'center center' );
*
* return (
*
* );
* };
* ```
*/
function AlignmentMatrixControl(_ref) {
let {
className,
id,
label = (0,external_wp_i18n_namespaceObject.__)('Alignment Matrix Control'),
defaultValue = 'center center',
value,
onChange = alignment_matrix_control_noop,
width = 92,
...props
} = _ref;
const [immutableDefaultValue] = (0,external_wp_element_namespaceObject.useState)(value !== null && value !== void 0 ? value : defaultValue);
const baseId = useBaseId(id);
const initialCurrentId = getItemId(baseId, immutableDefaultValue);
const composite = useCompositeState({
baseId,
currentId: initialCurrentId,
rtl: (0,external_wp_i18n_namespaceObject.isRTL)()
});
const handleOnChange = nextValue => {
onChange(nextValue);
};
const {
setCurrentId
} = composite;
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (typeof value !== 'undefined') {
setCurrentId(getItemId(baseId, value));
}
}, [value, setCurrentId, baseId]);
const classes = classnames_default()('component-alignment-matrix-control', className);
return (0,external_wp_element_namespaceObject.createElement)(Composite, extends_extends({}, props, composite, {
"aria-label": label,
as: Root,
className: classes,
role: "grid",
size: width
}), GRID.map((cells, index) => (0,external_wp_element_namespaceObject.createElement)(CompositeGroup, extends_extends({}, composite, {
as: Row,
role: "row",
key: index
}), cells.map(cell => {
const cellId = getItemId(baseId, cell);
const isActive = composite.currentId === cellId;
return (0,external_wp_element_namespaceObject.createElement)(cell_Cell, extends_extends({}, composite, {
id: cellId,
isActive: isActive,
key: cell,
value: cell,
onFocus: () => handleOnChange(cell),
tabIndex: isActive ? 0 : -1
}));
}))));
}
AlignmentMatrixControl.Icon = icon;
/* harmony default export */ var alignment_matrix_control = (AlignmentMatrixControl);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/animate/index.js
/**
* External dependencies
*/
/**
* @typedef {'top' | 'top left' | 'top right' | 'middle' | 'middle left' | 'middle right' | 'bottom' | 'bottom left' | 'bottom right'} AppearOrigin
* @typedef {'left' | 'right'} SlideInOrigin
* @typedef {{ type: 'appear'; origin?: AppearOrigin }} AppearOptions
* @typedef {{ type: 'slide-in'; origin?: SlideInOrigin }} SlideInOptions
* @typedef {{ type: 'loading' }} LoadingOptions
* @typedef {AppearOptions | SlideInOptions | LoadingOptions} GetAnimateOptions
*/
/* eslint-disable jsdoc/valid-types */
/**
* @param {GetAnimateOptions['type']} type The animation type
* @return {'top' | 'left'} Default origin
*/
function getDefaultOrigin(type) {
return type === 'appear' ? 'top' : 'left';
}
/* eslint-enable jsdoc/valid-types */
/**
* @param {GetAnimateOptions} options
*
* @return {string | void} ClassName that applies the animations
*/
function getAnimateClassName(options) {
if (options.type === 'loading') {
return classnames_default()('components-animate__loading');
}
const {
type,
origin = getDefaultOrigin(type)
} = options;
if (type === 'appear') {
const [yAxis, xAxis = 'center'] = origin.split(' ');
return classnames_default()('components-animate__appear', {
['is-from-' + xAxis]: xAxis !== 'center',
['is-from-' + yAxis]: yAxis !== 'middle'
});
}
if (type === 'slide-in') {
return classnames_default()('components-animate__slide-in', 'is-from-' + origin);
}
} // @ts-ignore Reason: Planned for deprecation
function Animate(_ref) {
let {
type,
options = {},
children
} = _ref;
return children({
className: getAnimateClassName({
type,
...options
})
});
}
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs
function useIsMounted() {
const isMounted = (0,external_React_.useRef)(false);
useIsomorphicLayoutEffect(() => {
isMounted.current = true;
return () => {
isMounted.current = false;
};
}, []);
return isMounted;
}
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-force-update.mjs
function use_force_update_useForceUpdate() {
const isMounted = useIsMounted();
const [forcedRenderCount, setForcedRenderCount] = (0,external_React_.useState)(0);
const forceRender = (0,external_React_.useCallback)(() => {
isMounted.current && setForcedRenderCount(forcedRenderCount + 1);
}, [forcedRenderCount]);
/**
* Defer this to the end of the next animation frame in case there are multiple
* synchronous calls.
*/
const deferredForceRender = (0,external_React_.useCallback)(() => sync.postRender(forceRender), [forceRender]);
return [deferredForceRender, forcedRenderCount];
}
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs
/**
* Measurement functionality has to be within a separate component
* to leverage snapshot lifecycle.
*/
class PopChildMeasure extends external_React_.Component {
getSnapshotBeforeUpdate(prevProps) {
const element = this.props.childRef.current;
if (element && prevProps.isPresent && !this.props.isPresent) {
const size = this.props.sizeRef.current;
size.height = element.offsetHeight || 0;
size.width = element.offsetWidth || 0;
size.top = element.offsetTop;
size.left = element.offsetLeft;
}
return null;
}
/**
* Required with getSnapshotBeforeUpdate to stop React complaining.
*/
componentDidUpdate() { }
render() {
return this.props.children;
}
}
function PopChild({ children, isPresent }) {
const id = (0,external_React_.useId)();
const ref = (0,external_React_.useRef)(null);
const size = (0,external_React_.useRef)({
width: 0,
height: 0,
top: 0,
left: 0,
});
/**
* We create and inject a style block so we can apply this explicit
* sizing in a non-destructive manner by just deleting the style block.
*
* We can't apply size via render as the measurement happens
* in getSnapshotBeforeUpdate (post-render), likewise if we apply the
* styles directly on the DOM node, we might be overwriting
* styles set via the style prop.
*/
(0,external_React_.useInsertionEffect)(() => {
const { width, height, top, left } = size.current;
if (isPresent || !ref.current || !width || !height)
return;
ref.current.dataset.motionPopId = id;
const style = document.createElement("style");
document.head.appendChild(style);
if (style.sheet) {
style.sheet.insertRule(`
[data-motion-pop-id="${id}"] {
position: absolute !important;
width: ${width}px !important;
height: ${height}px !important;
top: ${top}px !important;
left: ${left}px !important;
}
`);
}
return () => {
document.head.removeChild(style);
};
}, [isPresent]);
return (external_React_.createElement(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size }, external_React_.cloneElement(children, { ref })));
}
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs
const PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, }) => {
const presenceChildren = useConstant(newChildrenMap);
const id = (0,external_React_.useId)();
const context = (0,external_React_.useMemo)(() => ({
id,
initial,
isPresent,
custom,
onExitComplete: (childId) => {
presenceChildren.set(childId, true);
for (const isComplete of presenceChildren.values()) {
if (!isComplete)
return; // can stop searching when any is incomplete
}
onExitComplete && onExitComplete();
},
register: (childId) => {
presenceChildren.set(childId, false);
return () => presenceChildren.delete(childId);
},
}),
/**
* If the presence of a child affects the layout of the components around it,
* we want to make a new context value to ensure they get re-rendered
* so they can detect that layout change.
*/
presenceAffectsLayout ? undefined : [isPresent]);
(0,external_React_.useMemo)(() => {
presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
}, [isPresent]);
/**
* If there's no `motion` components to fire exit animations, we want to remove this
* component immediately.
*/
external_React_.useEffect(() => {
!isPresent &&
!presenceChildren.size &&
onExitComplete &&
onExitComplete();
}, [isPresent]);
if (mode === "popLayout") {
children = external_React_.createElement(PopChild, { isPresent: isPresent }, children);
}
return (external_React_.createElement(PresenceContext_PresenceContext.Provider, { value: context }, children));
};
function newChildrenMap() {
return new Map();
}
;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs
const getChildKey = (child) => child.key || "";
function updateChildLookup(children, allChildren) {
children.forEach((child) => {
const key = getChildKey(child);
allChildren.set(key, child);
});
}
function onlyElements(children) {
const filtered = [];
// We use forEach here instead of map as map mutates the component key by preprending `.$`
external_React_.Children.forEach(children, (child) => {
if ((0,external_React_.isValidElement)(child))
filtered.push(child);
});
return filtered;
}
/**
* `AnimatePresence` enables the animation of components that have been removed from the tree.
*
* When adding/removing more than a single child, every child **must** be given a unique `key` prop.
*
* Any `motion` components that have an `exit` property defined will animate out when removed from
* the tree.
*
* ```jsx
* import { motion, AnimatePresence } from 'framer-motion'
*
* export const Items = ({ items }) => (
*
* {items.map(item => (
*
* ))}
*
* )
* ```
*
* You can sequence exit animations throughout a tree using variants.
*
* If a child contains multiple `motion` components with `exit` props, it will only unmount the child
* once all `motion` components have finished animating out. Likewise, any components using
* `usePresence` all need to call `safeToRemove`.
*
* @public
*/
const AnimatePresence = ({ children, custom, initial = true, onExitComplete, exitBeforeEnter, presenceAffectsLayout = true, mode = "sync", }) => {
// Support deprecated exitBeforeEnter prop
if (exitBeforeEnter) {
mode = "wait";
warnOnce(false, "Replace exitBeforeEnter with mode='wait'");
}
// We want to force a re-render once all exiting animations have finished. We
// either use a local forceRender function, or one from a parent context if it exists.
let [forceRender] = use_force_update_useForceUpdate();
const forceRenderLayoutGroup = (0,external_React_.useContext)(LayoutGroupContext).forceRender;
if (forceRenderLayoutGroup)
forceRender = forceRenderLayoutGroup;
const isMounted = useIsMounted();
// Filter out any children that aren't ReactElements. We can only track ReactElements with a props.key
const filteredChildren = onlyElements(children);
let childrenToRender = filteredChildren;
const exiting = new Set();
// Keep a living record of the children we're actually rendering so we
// can diff to figure out which are entering and exiting
const presentChildren = (0,external_React_.useRef)(childrenToRender);
// A lookup table to quickly reference components by key
const allChildren = (0,external_React_.useRef)(new Map()).current;
// If this is the initial component render, just deal with logic surrounding whether
// we play onMount animations or not.
const isInitialRender = (0,external_React_.useRef)(true);
useIsomorphicLayoutEffect(() => {
isInitialRender.current = false;
updateChildLookup(filteredChildren, allChildren);
presentChildren.current = childrenToRender;
});
useUnmountEffect(() => {
isInitialRender.current = true;
allChildren.clear();
exiting.clear();
});
if (isInitialRender.current) {
return (external_React_.createElement(external_React_.Fragment, null, childrenToRender.map((child) => (external_React_.createElement(PresenceChild, { key: getChildKey(child), isPresent: true, initial: initial ? undefined : false, presenceAffectsLayout: presenceAffectsLayout, mode: mode }, child)))));
}
// If this is a subsequent render, deal with entering and exiting children
childrenToRender = [...childrenToRender];
// Diff the keys of the currently-present and target children to update our
// exiting list.
const presentKeys = presentChildren.current.map(getChildKey);
const targetKeys = filteredChildren.map(getChildKey);
// Diff the present children with our target children and mark those that are exiting
const numPresent = presentKeys.length;
for (let i = 0; i < numPresent; i++) {
const key = presentKeys[i];
if (targetKeys.indexOf(key) === -1) {
exiting.add(key);
}
}
// If we currently have exiting children, and we're deferring rendering incoming children
// until after all current children have exiting, empty the childrenToRender array
if (mode === "wait" && exiting.size) {
childrenToRender = [];
}
// Loop through all currently exiting components and clone them to overwrite `animate`
// with any `exit` prop they might have defined.
exiting.forEach((key) => {
// If this component is actually entering again, early return
if (targetKeys.indexOf(key) !== -1)
return;
const child = allChildren.get(key);
if (!child)
return;
const insertionIndex = presentKeys.indexOf(key);
const onExit = () => {
allChildren.delete(key);
exiting.delete(key);
// Remove this child from the present children
const removeIndex = presentChildren.current.findIndex((presentChild) => presentChild.key === key);
presentChildren.current.splice(removeIndex, 1);
// Defer re-rendering until all exiting children have indeed left
if (!exiting.size) {
presentChildren.current = filteredChildren;
if (isMounted.current === false)
return;
forceRender();
onExitComplete && onExitComplete();
}
};
childrenToRender.splice(insertionIndex, 0, external_React_.createElement(PresenceChild, { key: getChildKey(child), isPresent: false, onExitComplete: onExit, custom: custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode }, child));
});
// Add `MotionContext` even to children that don't need it to ensure we're rendering
// the same tree between renders
childrenToRender = childrenToRender.map((child) => {
const key = child.key;
return exiting.has(key) ? (child) : (external_React_.createElement(PresenceChild, { key: getChildKey(child), isPresent: true, presenceAffectsLayout: presenceAffectsLayout, mode: mode }, child));
});
if (env !== "production" &&
mode === "wait" &&
childrenToRender.length > 1) {
console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);
}
return (external_React_.createElement(external_React_.Fragment, null, exiting.size
? childrenToRender
: childrenToRender.map((child) => (0,external_React_.cloneElement)(child))));
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/context.js
/**
* WordPress dependencies
*/
const FlexContext = (0,external_wp_element_namespaceObject.createContext)({
flexItemDisplay: undefined
});
const useFlexContext = () => (0,external_wp_element_namespaceObject.useContext)(FlexContext);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/styles.js
function 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)."; }
/**
* External dependencies
*/
const Flex = true ? {
name: "zjik7",
styles: "display:flex"
} : 0;
const Item = true ? {
name: "qgaee5",
styles: "display:block;max-height:100%;max-width:100%;min-height:0;min-width:0"
} : 0;
const block = true ? {
name: "82a6rk",
styles: "flex:1"
} : 0;
/**
* Workaround to optimize DOM rendering.
* We'll enhance alignment with naive parent flex assumptions.
*
* Trade-off:
* Far less DOM less. However, UI rendering is not as reliable.
*/
/**
* Improves stability of width/height rendering.
* https://github.com/ItsJonQ/g2/pull/149
*/
const ItemsColumn = true ? {
name: "13nosa1",
styles: ">*{min-height:0;}"
} : 0;
const ItemsRow = true ? {
name: "1pwxzk4",
styles: ">*{min-width:0;}"
} : 0;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/hook.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function useFlexItem(props) {
const {
className,
display: displayProp,
isBlock = false,
...otherProps
} = useContextSystem(props, 'FlexItem');
const sx = {};
const contextDisplay = useFlexContext().flexItemDisplay;
sx.Base = /*#__PURE__*/emotion_react_browser_esm_css({
display: displayProp || contextDisplay
}, true ? "" : 0, true ? "" : 0);
const cx = useCx();
const classes = cx(Item, sx.Base, isBlock && block, className);
return { ...otherProps,
className: classes
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/hook.js
/**
* Internal dependencies
*/
function useFlexBlock(props) {
const otherProps = useContextSystem(props, 'FlexBlock');
const flexItemProps = useFlexItem({
isBlock: true,
...otherProps
});
return flexItemProps;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/component.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedFlexBlock(props, forwardedRef) {
const flexBlockProps = useFlexBlock(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, flexBlockProps, {
ref: forwardedRef
}));
}
/**
* `FlexBlock` is a primitive layout component that adaptively resizes content
* within layout containers like `Flex`.
*
* ```jsx
* import { Flex, FlexBlock } from '@wordpress/components';
*
* function Example() {
* return (
*
* ...
*
* );
* }
* ```
*/
const FlexBlock = contextConnect(UnconnectedFlexBlock, 'FlexBlock');
/* harmony default export */ var flex_block_component = (FlexBlock);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/component.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedFlexItem(props, forwardedRef) {
const flexItemProps = useFlexItem(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, flexItemProps, {
ref: forwardedRef
}));
}
/**
* `FlexItem` is a primitive layout component that aligns content within layout
* containers like `Flex`.
*
* ```jsx
* import { Flex, FlexItem } from '@wordpress/components';
*
* function Example() {
* return (
*
* ...
*
* );
* }
* ```
*/
const FlexItem = contextConnect(UnconnectedFlexItem, 'FlexItem');
/* harmony default export */ var flex_item_component = (FlexItem);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/plus.js
/**
* WordPress dependencies
*/
const plus = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z"
}));
/* harmony default export */ var library_plus = (plus);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/reset.js
/**
* WordPress dependencies
*/
const reset_reset = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M7 11.5h10V13H7z"
}));
/* harmony default export */ var library_reset = (reset_reset);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/utils/use-responsive-value.js
/**
* WordPress dependencies
*/
const breakpoints = ['40em', '52em', '64em'];
const useBreakpointIndex = function () {
let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
const {
defaultIndex = 0
} = options;
if (typeof defaultIndex !== 'number') {
throw new TypeError(`Default breakpoint index should be a number. Got: ${defaultIndex}, ${typeof defaultIndex}`);
} else if (defaultIndex < 0 || defaultIndex > breakpoints.length - 1) {
throw new RangeError(`Default breakpoint index out of range. Theme has ${breakpoints.length} breakpoints, got index ${defaultIndex}`);
}
const [value, setValue] = (0,external_wp_element_namespaceObject.useState)(defaultIndex);
(0,external_wp_element_namespaceObject.useEffect)(() => {
const getIndex = () => breakpoints.filter(bp => {
return typeof window !== 'undefined' ? window.matchMedia(`screen and (min-width: ${bp})`).matches : false;
}).length;
const onResize = () => {
const newValue = getIndex();
if (value !== newValue) {
setValue(newValue);
}
};
onResize();
if (typeof window !== 'undefined') {
window.addEventListener('resize', onResize);
}
return () => {
if (typeof window !== 'undefined') {
window.removeEventListener('resize', onResize);
}
};
}, [value]);
return value;
};
function useResponsiveValue(values) {
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
const index = useBreakpointIndex(options); // Allow calling the function with a "normal" value without having to check on the outside.
if (!Array.isArray(values) && typeof values !== 'function') return values;
const array = values || [];
/* eslint-disable jsdoc/no-undefined-types */
return (
/** @type {T[]} */
array[
/* eslint-enable jsdoc/no-undefined-types */
index >= array.length ? array.length - 1 : index]
);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/utils/space.js
/**
* The argument value for the `space()` utility function.
*
* When this is a number or a numeric string, it will be interpreted as a
* multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px.
*
* Otherwise, it will be interpreted as a literal CSS length value. For example,
* `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px.
*/
const GRID_BASE = '4px';
/**
* A function that handles numbers, numeric strings, and unit values.
*
* When given a number or a numeric string, it will return the grid-based
* value as a factor of GRID_BASE, defined above.
*
* When given a unit value or one of the named CSS values like `auto`,
* it will simply return the value back.
*
* @param value A number, numeric string, or a unit value.
*/
function space(value) {
var _window$CSS, _window$CSS$supports;
if (typeof value === 'undefined') {
return undefined;
} // Handle empty strings, if it's the number 0 this still works.
if (!value) {
return '0';
}
const asInt = typeof value === 'number' ? value : Number(value); // Test if the input has a unit, was NaN, or was one of the named CSS values (like `auto`), in which case just use that value.
if (typeof window !== 'undefined' && (_window$CSS = window.CSS) !== null && _window$CSS !== void 0 && (_window$CSS$supports = _window$CSS.supports) !== null && _window$CSS$supports !== void 0 && _window$CSS$supports.call(_window$CSS, 'margin', value.toString()) || Number.isNaN(asInt)) {
return value.toString();
}
return `calc(${GRID_BASE} * ${value})`;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/hook.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function hook_useDeprecatedProps(props) {
const {
isReversed,
...otherProps
} = props;
if (typeof isReversed !== 'undefined') {
external_wp_deprecated_default()('Flex isReversed', {
alternative: 'Flex direction="row-reverse" or "column-reverse"',
since: '5.9'
});
return { ...otherProps,
direction: isReversed ? 'row-reverse' : 'row'
};
}
return otherProps;
}
function useFlex(props) {
const {
align = 'center',
className,
direction: directionProp = 'row',
expanded = true,
gap = 2,
justify = 'space-between',
wrap = false,
...otherProps
} = useContextSystem(hook_useDeprecatedProps(props), 'Flex');
const directionAsArray = Array.isArray(directionProp) ? directionProp : [directionProp];
const direction = useResponsiveValue(directionAsArray);
const isColumn = typeof direction === 'string' && !!direction.includes('column');
const cx = useCx();
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
const base = /*#__PURE__*/emotion_react_browser_esm_css({
alignItems: isColumn ? 'normal' : align,
flexDirection: direction,
flexWrap: wrap ? 'wrap' : undefined,
gap: space(gap),
justifyContent: justify,
height: isColumn && expanded ? '100%' : undefined,
width: !isColumn && expanded ? '100%' : undefined
}, true ? "" : 0, true ? "" : 0);
return cx(Flex, base, isColumn ? ItemsColumn : ItemsRow, className);
}, [align, className, cx, direction, expanded, gap, isColumn, justify, wrap]);
return { ...otherProps,
className: classes,
isColumn
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/component.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedFlex(props, forwardedRef) {
const {
children,
isColumn,
...otherProps
} = useFlex(props);
return (0,external_wp_element_namespaceObject.createElement)(FlexContext.Provider, {
value: {
flexItemDisplay: isColumn ? 'block' : undefined
}
}, (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, otherProps, {
ref: forwardedRef
}), children));
}
/**
* `Flex` is a primitive layout component that adaptively aligns child content
* horizontally or vertically. `Flex` powers components like `HStack` and
* `VStack`.
*
* `Flex` is used with any of its two sub-components, `FlexItem` and
* `FlexBlock`.
*
* ```jsx
* import { Flex, FlexBlock, FlexItem } from '@wordpress/components';
*
* function Example() {
* return (
*
*
* Code
*
*
* Poetry
*
*
* );
* }
* ```
*/
const component_Flex = contextConnect(UnconnectedFlex, 'Flex');
/* harmony default export */ var flex_component = (component_Flex);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/styles.js
function truncate_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)."; }
/**
* External dependencies
*/
const Truncate = true ? {
name: "hdknak",
styles: "display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"
} : 0;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/values.js
/* eslint-disable jsdoc/valid-types */
/**
* Determines if a value is null or undefined.
*
* @template T
*
* @param {T} value The value to check.
* @return {value is Exclude} Whether value is not null or undefined.
*/
function isValueDefined(value) {
return value !== undefined && value !== null;
}
/* eslint-enable jsdoc/valid-types */
/* eslint-disable jsdoc/valid-types */
/**
* Determines if a value is empty, null, or undefined.
*
* @param {string | number | null | undefined} value The value to check.
* @return {value is ("" | null | undefined)} Whether value is empty.
*/
function isValueEmpty(value) {
const isEmptyString = value === '';
return !isValueDefined(value) || isEmptyString;
}
/* eslint-enable jsdoc/valid-types */
/**
* Get the first defined/non-null value from an array.
*
* @template T
*
* @param {Array} values Values to derive from.
* @param {T} fallbackValue Fallback value if there are no defined values.
* @return {T} A defined value or the fallback value.
*/
function getDefinedValue() {
var _values$find;
let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
let fallbackValue = arguments.length > 1 ? arguments[1] : undefined;
return (_values$find = values.find(isValueDefined)) !== null && _values$find !== void 0 ? _values$find : fallbackValue;
}
/**
* @param {string} [locale]
* @return {[RegExp, RegExp]} The delimiter and decimal regexp
*/
const getDelimiterAndDecimalRegex = locale => {
const formatted = Intl.NumberFormat(locale).format(1000.1);
const delimiter = formatted[1];
const decimal = formatted[formatted.length - 2];
return [new RegExp(`\\${delimiter}`, 'g'), new RegExp(`\\${decimal}`, 'g')];
}; // https://en.wikipedia.org/wiki/Decimal_separator#Current_standards
const INTERNATIONAL_THOUSANDS_DELIMITER = / /g;
const ARABIC_NUMERAL_LOCALES = (/* unused pure expression or super */ null && (['ar', 'fa', 'ur', 'ckb', 'ps']));
const EASTERN_ARABIC_NUMBERS = /([۰-۹]|[٠-٩])/g;
/**
* Checks to see if a value is a numeric value (`number` or `string`).
*
* Intentionally ignores whether the thousands delimiters are only
* in the thousands marks.
*
* @param {any} value
* @param {string} [locale]
* @return {boolean} Whether value is numeric.
*/
function isValueNumeric(value) {
let locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window.navigator.language;
if (ARABIC_NUMERAL_LOCALES.some(l => locale.startsWith(l))) {
locale = 'en-GB';
if (EASTERN_ARABIC_NUMBERS.test(value)) {
value = value.replace(/[٠-٩]/g, (
/** @type {string} */
d) => '٠١٢٣٤٥٦٧٨٩'.indexOf(d)).replace(/[۰-۹]/g, (
/** @type {string} */
d) => '۰۱۲۳۴۵۶۷۸۹'.indexOf(d)).replace(/٬/g, ',').replace(/٫/g, '.');
}
}
const [delimiterRegexp, decimalRegexp] = getDelimiterAndDecimalRegex(locale);
const valueToCheck = typeof value === 'string' ? value.replace(delimiterRegexp, '').replace(decimalRegexp, '.').replace(INTERNATIONAL_THOUSANDS_DELIMITER, '') : value;
return !isNaN(parseFloat(valueToCheck)) && isFinite(valueToCheck);
}
/**
* Converts a string to a number.
*
* @param {string} value
* @return {number} String as a number.
*/
const stringToNumber = value => {
return parseFloat(value);
};
/**
* Converts a number to a string.
*
* @param {number} value
* @return {string} Number as a string.
*/
const numberToString = value => {
return `${value}`;
};
/**
* Regardless of the input being a string or a number, returns a number.
*
* Returns `undefined` in case the string is `undefined` or not a valid numeric value.
*
* @param {string | number} value
* @return {number} The parsed number.
*/
const ensureNumber = value => {
return typeof value === 'string' ? stringToNumber(value) : value;
};
/**
* Regardless of the input being a string or a number, returns a number.
*
* Returns `undefined` in case the string is `undefined` or not a valid numeric value.
*
* @param {string | number} value
* @return {string} The converted string, or `undefined` in case the input is `undefined` or `NaN`.
*/
const ensureString = value => {
return typeof value === 'string' ? value : numberToString(value);
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/utils.js
/**
* Internal dependencies
*/
const TRUNCATE_ELLIPSIS = '…';
const TRUNCATE_TYPE = {
auto: 'auto',
head: 'head',
middle: 'middle',
tail: 'tail',
none: 'none'
};
const TRUNCATE_DEFAULT_PROPS = {
ellipsis: TRUNCATE_ELLIPSIS,
ellipsizeMode: TRUNCATE_TYPE.auto,
limit: 0,
numberOfLines: 0
}; // Source
// https://github.com/kahwee/truncate-middle
function truncateMiddle(word, headLength, tailLength, ellipsis) {
if (typeof word !== 'string') {
return '';
}
const wordLength = word.length; // Setting default values
// eslint-disable-next-line no-bitwise
const frontLength = ~~headLength; // Will cast to integer
// eslint-disable-next-line no-bitwise
const backLength = ~~tailLength;
/* istanbul ignore next */
const truncateStr = isValueDefined(ellipsis) ? ellipsis : TRUNCATE_ELLIPSIS;
if (frontLength === 0 && backLength === 0 || frontLength >= wordLength || backLength >= wordLength || frontLength + backLength >= wordLength) {
return word;
} else if (backLength === 0) {
return word.slice(0, frontLength) + truncateStr;
}
return word.slice(0, frontLength) + truncateStr + word.slice(wordLength - backLength);
}
function truncateContent() {
let words = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
let props = arguments.length > 1 ? arguments[1] : undefined;
const mergedProps = { ...TRUNCATE_DEFAULT_PROPS,
...props
};
const {
ellipsis,
ellipsizeMode,
limit
} = mergedProps;
if (ellipsizeMode === TRUNCATE_TYPE.none) {
return words;
}
let truncateHead;
let truncateTail;
switch (ellipsizeMode) {
case TRUNCATE_TYPE.head:
truncateHead = 0;
truncateTail = limit;
break;
case TRUNCATE_TYPE.middle:
truncateHead = Math.floor(limit / 2);
truncateTail = Math.floor(limit / 2);
break;
default:
truncateHead = limit;
truncateTail = 0;
}
const truncatedContent = ellipsizeMode !== TRUNCATE_TYPE.auto ? truncateMiddle(words, truncateHead, truncateTail, ellipsis) : words;
return truncatedContent;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/hook.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useTruncate(props) {
const {
className,
children,
ellipsis = TRUNCATE_ELLIPSIS,
ellipsizeMode = TRUNCATE_TYPE.auto,
limit = 0,
numberOfLines = 0,
...otherProps
} = useContextSystem(props, 'Truncate');
const cx = useCx();
const truncatedContent = truncateContent(typeof children === 'string' ? children : '', {
ellipsis,
ellipsizeMode,
limit,
numberOfLines
});
const shouldTruncate = ellipsizeMode === TRUNCATE_TYPE.auto;
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
const truncateLines = /*#__PURE__*/emotion_react_browser_esm_css("-webkit-box-orient:vertical;-webkit-line-clamp:", numberOfLines, ";display:-webkit-box;overflow:hidden;" + ( true ? "" : 0), true ? "" : 0);
return cx(shouldTruncate && !numberOfLines && Truncate, shouldTruncate && !!numberOfLines && truncateLines, className);
}, [className, cx, numberOfLines, shouldTruncate]);
return { ...otherProps,
className: classes,
children: truncatedContent
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/utils/colors.js
/**
* External dependencies
*/
/** @type {HTMLDivElement} */
let colorComputationNode;
colord_k([names]);
/**
* @return {HTMLDivElement | undefined} The HTML element for color computation.
*/
function getColorComputationNode() {
if (typeof document === 'undefined') return;
if (!colorComputationNode) {
// Create a temporary element for style computation.
const el = document.createElement('div');
el.setAttribute('data-g2-color-computation-node', ''); // Inject for window computed style.
document.body.appendChild(el);
colorComputationNode = el;
}
return colorComputationNode;
}
/**
* @param {string | unknown} value
*
* @return {boolean} Whether the value is a valid color.
*/
function isColor(value) {
if (typeof value !== 'string') return false;
const test = colord_w(value);
return test.isValid();
}
/**
* Retrieves the computed background color. This is useful for getting the
* value of a CSS variable color.
*
* @param {string | unknown} backgroundColor The background color to compute.
*
* @return {string} The computed background color.
*/
function _getComputedBackgroundColor(backgroundColor) {
var _window;
if (typeof backgroundColor !== 'string') return '';
if (isColor(backgroundColor)) return backgroundColor;
if (!backgroundColor.includes('var(')) return '';
if (typeof document === 'undefined') return ''; // Attempts to gracefully handle CSS variables color values.
const el = getColorComputationNode();
if (!el) return '';
el.style.background = backgroundColor; // Grab the style.
const computedColor = (_window = window) === null || _window === void 0 ? void 0 : _window.getComputedStyle(el).background; // Reset.
el.style.background = '';
return computedColor || '';
}
const getComputedBackgroundColor = memize_default()(_getComputedBackgroundColor);
/**
* Get the text shade optimized for readability, based on a background color.
*
* @param {string | unknown} backgroundColor The background color.
*
* @return {string} The optimized text color (black or white).
*/
function getOptimalTextColor(backgroundColor) {
const background = getComputedBackgroundColor(backgroundColor);
return colord_w(background).isLight() ? '#000000' : '#ffffff';
}
/**
* Get the text shade optimized for readability, based on a background color.
*
* @param {string | unknown} backgroundColor The background color.
*
* @return {string} The optimized text shade (dark or light).
*/
function getOptimalTextShade(backgroundColor) {
const result = getOptimalTextColor(backgroundColor);
return result === '#000000' ? 'dark' : 'light';
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/config-values.js
/**
* Internal dependencies
*/
const CONTROL_HEIGHT = '36px';
const CONTROL_PADDING_X = '12px';
const CONTROL_PROPS = {
controlSurfaceColor: COLORS.white,
controlTextActiveColor: COLORS.ui.theme,
controlPaddingX: CONTROL_PADDING_X,
controlPaddingXLarge: `calc(${CONTROL_PADDING_X} * 1.3334)`,
controlPaddingXSmall: `calc(${CONTROL_PADDING_X} / 1.3334)`,
controlBackgroundColor: COLORS.white,
controlBorderRadius: '2px',
controlBoxShadow: 'transparent',
controlBoxShadowFocus: `0 0 0 0.5px ${COLORS.ui.theme}`,
controlDestructiveBorderColor: COLORS.alert.red,
controlHeight: CONTROL_HEIGHT,
controlHeightXSmall: `calc( ${CONTROL_HEIGHT} * 0.6 )`,
controlHeightSmall: `calc( ${CONTROL_HEIGHT} * 0.8 )`,
controlHeightLarge: `calc( ${CONTROL_HEIGHT} * 1.2 )`,
controlHeightXLarge: `calc( ${CONTROL_HEIGHT} * 1.4 )`
};
const TOGGLE_GROUP_CONTROL_PROPS = {
toggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,
toggleGroupControlBorderColor: COLORS.ui.border,
toggleGroupControlBackdropBackgroundColor: CONTROL_PROPS.controlSurfaceColor,
toggleGroupControlBackdropBorderColor: COLORS.ui.border,
toggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor
}; // Using Object.assign to avoid creating circular references when emitting
// TypeScript type declarations.
/* harmony default export */ var config_values = (Object.assign({}, CONTROL_PROPS, TOGGLE_GROUP_CONTROL_PROPS, {
colorDivider: 'rgba(0, 0, 0, 0.1)',
colorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',
colorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',
colorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',
elevationIntensity: 1,
radiusBlockUi: '2px',
borderWidth: '1px',
borderWidthFocus: '1.5px',
borderWidthTab: '4px',
spinnerSize: 16,
fontSize: '13px',
fontSizeH1: 'calc(2.44 * 13px)',
fontSizeH2: 'calc(1.95 * 13px)',
fontSizeH3: 'calc(1.56 * 13px)',
fontSizeH4: 'calc(1.25 * 13px)',
fontSizeH5: '13px',
fontSizeH6: 'calc(0.8 * 13px)',
fontSizeInputMobile: '16px',
fontSizeMobile: '15px',
fontSizeSmall: 'calc(0.92 * 13px)',
fontSizeXSmall: 'calc(0.75 * 13px)',
fontLineHeightBase: '1.2',
fontWeight: 'normal',
fontWeightHeading: '600',
gridBase: '4px',
cardBorderRadius: '2px',
cardPaddingXSmall: `${space(2)}`,
cardPaddingSmall: `${space(4)}`,
cardPaddingMedium: `${space(4)} ${space(6)}`,
cardPaddingLarge: `${space(6)} ${space(8)}`,
surfaceBackgroundColor: COLORS.white,
surfaceBackgroundSubtleColor: '#F3F3F3',
surfaceBackgroundTintColor: '#F5F5F5',
surfaceBorderColor: 'rgba(0, 0, 0, 0.1)',
surfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',
surfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',
surfaceBackgroundTertiaryColor: COLORS.white,
surfaceColor: COLORS.white,
transitionDuration: '200ms',
transitionDurationFast: '160ms',
transitionDurationFaster: '120ms',
transitionDurationFastest: '100ms',
transitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',
transitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)'
}));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/styles.js
function text_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const Text = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[900], ";line-height:", config_values.fontLineHeightBase, ";margin:0;" + ( true ? "" : 0), true ? "" : 0);
const styles_block = true ? {
name: "4zleql",
styles: "display:block"
} : 0;
const positive = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.alert.green, ";" + ( true ? "" : 0), true ? "" : 0);
const destructive = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.alert.red, ";" + ( true ? "" : 0), true ? "" : 0);
const muted = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[700], ";" + ( true ? "" : 0), true ? "" : 0);
const highlighterText = /*#__PURE__*/emotion_react_browser_esm_css("mark{background:", COLORS.alert.yellow, ";border-radius:2px;box-shadow:0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;}" + ( true ? "" : 0), true ? "" : 0);
const upperCase = true ? {
name: "50zrmy",
styles: "text-transform:uppercase"
} : 0;
// EXTERNAL MODULE: ./node_modules/highlight-words-core/dist/index.js
var dist = __webpack_require__(3138);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/utils.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Source:
* https://github.com/bvaughn/react-highlight-words/blob/HEAD/src/Highlighter.js
*/
/* eslint-disable jsdoc/valid-types */
/**
* @typedef Options
* @property {string} [activeClassName=''] Classname for active highlighted areas.
* @property {number} [activeIndex=-1] The index of the active highlighted area.
* @property {import('react').AllHTMLAttributes['style']} [activeStyle] Styles to apply to the active highlighted area.
* @property {boolean} [autoEscape] Whether to automatically escape text.
* @property {boolean} [caseSensitive=false] Whether to highlight in a case-sensitive manner.
* @property {string} children Children to highlight.
* @property {import('highlight-words-core').FindAllArgs['findChunks']} [findChunks] Custom `findChunks` function to pass to `highlight-words-core`.
* @property {string | Record} [highlightClassName=''] Classname to apply to highlighted text or a Record of classnames to apply to given text (which should be the key).
* @property {import('react').AllHTMLAttributes['style']} [highlightStyle={}] Styles to apply to highlighted text.
* @property {keyof JSX.IntrinsicElements} [highlightTag='mark'] Tag to use for the highlighted text.
* @property {import('highlight-words-core').FindAllArgs['sanitize']} [sanitize] Custom `santize` function to pass to `highlight-words-core`.
* @property {string[]} [searchWords=[]] Words to search for and highlight.
* @property {string} [unhighlightClassName=''] Classname to apply to unhighlighted text.
* @property {import('react').AllHTMLAttributes['style']} [unhighlightStyle] Style to apply to unhighlighted text.
*/
/**
* Maps props to lowercase names.
*
* @template {Record} T
* @param {T} object Props to map.
* @return {{[K in keyof T as Lowercase]: T[K]}} The mapped props.
*/
/* eslint-enable jsdoc/valid-types */
const lowercaseProps = object => {
/** @type {any} */
const mapped = {};
for (const key in object) {
mapped[key.toLowerCase()] = object[key];
}
return mapped;
};
const memoizedLowercaseProps = memize_default()(lowercaseProps);
/**
*
* @param {Options} options
*/
function createHighlighterText(_ref) {
let {
activeClassName = '',
activeIndex = -1,
activeStyle,
autoEscape,
caseSensitive = false,
children,
findChunks,
highlightClassName = '',
highlightStyle = {},
highlightTag = 'mark',
sanitize,
searchWords = [],
unhighlightClassName = '',
unhighlightStyle
} = _ref;
if (!children) return null;
if (typeof children !== 'string') return children;
const textToHighlight = children;
const chunks = (0,dist.findAll)({
autoEscape,
caseSensitive,
findChunks,
sanitize,
searchWords,
textToHighlight
});
const HighlightTag = highlightTag;
let highlightIndex = -1;
let highlightClassNames = '';
let highlightStyles;
const textContent = chunks.map((chunk, index) => {
const text = textToHighlight.substr(chunk.start, chunk.end - chunk.start);
if (chunk.highlight) {
highlightIndex++;
let highlightClass;
if (typeof highlightClassName === 'object') {
if (!caseSensitive) {
highlightClassName = memoizedLowercaseProps(highlightClassName);
highlightClass = highlightClassName[text.toLowerCase()];
} else {
highlightClass = highlightClassName[text];
}
} else {
highlightClass = highlightClassName;
}
const isActive = highlightIndex === +activeIndex;
highlightClassNames = `${highlightClass} ${isActive ? activeClassName : ''}`;
highlightStyles = isActive === true && activeStyle !== null ? Object.assign({}, highlightStyle, activeStyle) : highlightStyle;
/** @type {Record} */
const props = {
children: text,
className: highlightClassNames,
key: index,
style: highlightStyles
}; // Don't attach arbitrary props to DOM elements; this triggers React DEV warnings (https://fb.me/react-unknown-prop)
// Only pass through the highlightIndex attribute for custom components.
if (typeof HighlightTag !== 'string') {
props.highlightIndex = highlightIndex;
}
return (0,external_wp_element_namespaceObject.createElement)(HighlightTag, props);
}
return (0,external_wp_element_namespaceObject.createElement)('span', {
children: text,
className: unhighlightClassName,
key: index,
style: unhighlightStyle
});
});
return textContent;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/utils/font-size.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const BASE_FONT_SIZE = 13;
const PRESET_FONT_SIZES = {
body: BASE_FONT_SIZE,
caption: 10,
footnote: 11,
largeTitle: 28,
subheadline: 12,
title: 20
};
const HEADING_FONT_SIZES = [1, 2, 3, 4, 5, 6].flatMap(n => [n, n.toString()]);
function getFontSize() {
let size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : BASE_FONT_SIZE;
if (size in PRESET_FONT_SIZES) {
return getFontSize(PRESET_FONT_SIZES[size]);
}
if (typeof size !== 'number') {
const parsed = parseFloat(size);
if (Number.isNaN(parsed)) return size;
size = parsed;
}
const ratio = `(${size} / ${BASE_FONT_SIZE})`;
return `calc(${ratio} * ${config_values.fontSize})`;
}
function getHeadingFontSize() {
let size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 3;
if (!HEADING_FONT_SIZES.includes(size)) {
return getFontSize(size);
}
const headingSize = `fontSizeH${size}`;
return config_values[headingSize];
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/get-line-height.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function getLineHeight(adjustLineHeightForInnerControls, lineHeight) {
if (lineHeight) return lineHeight;
if (!adjustLineHeightForInnerControls) return;
let value = `calc(${config_values.controlHeight} + ${space(2)})`;
switch (adjustLineHeightForInnerControls) {
case 'large':
value = `calc(${config_values.controlHeightLarge} + ${space(2)})`;
break;
case 'small':
value = `calc(${config_values.controlHeightSmall} + ${space(2)})`;
break;
case 'xSmall':
value = `calc(${config_values.controlHeightXSmall} + ${space(2)})`;
break;
default:
break;
}
return value;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/hook.js
function hook_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)."; }
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* @param {import('../ui/context').WordPressComponentProps} props
*/
var hook_ref = true ? {
name: "50zrmy",
styles: "text-transform:uppercase"
} : 0;
function useText(props) {
const {
adjustLineHeightForInnerControls,
align,
children,
className,
color,
ellipsizeMode,
isDestructive = false,
display,
highlightEscape = false,
highlightCaseSensitive = false,
highlightWords,
highlightSanitize,
isBlock = false,
letterSpacing,
lineHeight: lineHeightProp,
optimizeReadabilityFor,
size,
truncate = false,
upperCase = false,
variant,
weight = config_values.fontWeight,
...otherProps
} = useContextSystem(props, 'Text');
/** @type {import('react').ReactNode} */
let content = children;
const isHighlighter = Array.isArray(highlightWords);
const isCaption = size === 'caption';
if (isHighlighter) {
if (typeof children !== 'string') {
throw new TypeError('`children` of `Text` must only be `string` types when `highlightWords` is defined');
}
content = createHighlighterText({
autoEscape: highlightEscape,
// Disable reason: We need to disable this otherwise it erases the cast
// eslint-disable-next-line object-shorthand
children:
/** @type {string} */
children,
caseSensitive: highlightCaseSensitive,
searchWords: highlightWords,
sanitize: highlightSanitize
});
}
const cx = useCx();
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
const sx = {};
const lineHeight = getLineHeight(adjustLineHeightForInnerControls, lineHeightProp);
sx.Base = /*#__PURE__*/emotion_react_browser_esm_css({
color,
display,
fontSize: getFontSize(size),
/* eslint-disable jsdoc/valid-types */
fontWeight:
/** @type {import('react').CSSProperties['fontWeight']} */
weight,
/* eslint-enable jsdoc/valid-types */
lineHeight,
letterSpacing,
textAlign: align
}, true ? "" : 0, true ? "" : 0);
sx.upperCase = hook_ref;
sx.optimalTextColor = null;
if (optimizeReadabilityFor) {
const isOptimalTextColorDark = getOptimalTextShade(optimizeReadabilityFor) === 'dark';
sx.optimalTextColor = isOptimalTextColorDark ? /*#__PURE__*/emotion_react_browser_esm_css({
color: COLORS.gray[900]
}, true ? "" : 0, true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css({
color: COLORS.white
}, true ? "" : 0, true ? "" : 0);
}
return cx(Text, sx.Base, sx.optimalTextColor, isDestructive && destructive, !!isHighlighter && highlighterText, isBlock && styles_block, isCaption && muted, variant && text_styles_namespaceObject[variant], upperCase && sx.upperCase, className);
}, [adjustLineHeightForInnerControls, align, className, color, cx, display, isBlock, isCaption, isDestructive, isHighlighter, letterSpacing, lineHeightProp, optimizeReadabilityFor, size, upperCase, variant, weight]);
/** @type {undefined | 'auto' | 'none'} */
let finalEllipsizeMode;
if (truncate === true) {
finalEllipsizeMode = 'auto';
}
if (truncate === false) {
finalEllipsizeMode = 'none';
}
const finalComponentProps = { ...otherProps,
className: classes,
children,
ellipsizeMode: ellipsizeMode || finalEllipsizeMode
};
const truncateProps = useTruncate(finalComponentProps);
/**
* Enhance child `` components to inherit font size.
*/
if (!truncate && Array.isArray(children)) {
content = external_wp_element_namespaceObject.Children.map(children, child => {
if (typeof child !== 'object' || child === null || !('props' in child)) {
return child;
}
const isLink = hasConnectNamespace(child, ['Link']);
if (isLink) {
return (0,external_wp_element_namespaceObject.cloneElement)(child, {
size: child.props.size || 'inherit'
});
}
return child;
});
}
return { ...truncateProps,
children: truncate ? truncateProps.children : content
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/component.js
/**
* Internal dependencies
*/
/**
* @param {import('../ui/context').WordPressComponentProps} props
* @param {import('react').ForwardedRef} forwardedRef
*/
function component_Text(props, forwardedRef) {
const textProps = useText(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({
as: "span"
}, textProps, {
ref: forwardedRef
}));
}
/**
* `Text` is a core component that renders text in the library, using the
* library's typography system.
*
* `Text` can be used to render any text-content, like an HTML `p` or `span`.
*
* @example
*
* ```jsx
* import { __experimentalText as Text } from `@wordpress/components`;
*
* function Example() {
* return Code is Poetry;
* }
* ```
*/
const ConnectedText = contextConnect(component_Text, 'Text');
/* harmony default export */ var text_component = (ConnectedText);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/base-label.js
function base_label_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)."; }
/**
* External dependencies
*/
// This is a very low-level mixin which you shouldn't have to use directly.
// Try to use BaseControl's StyledLabel or BaseControl.VisualLabel if you can.
const baseLabelTypography = true ? {
name: "9amh4a",
styles: "font-size:11px;font-weight:500;line-height:1.4;text-transform:uppercase"
} : 0;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/rtl.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
const LOWER_LEFT_REGEXP = new RegExp(/-left/g);
const LOWER_RIGHT_REGEXP = new RegExp(/-right/g);
const UPPER_LEFT_REGEXP = new RegExp(/Left/g);
const UPPER_RIGHT_REGEXP = new RegExp(/Right/g);
/**
* Flips a CSS property from left <-> right.
*
* @param {string} key The CSS property name.
*
* @return {string} The flipped CSS property name, if applicable.
*/
function getConvertedKey(key) {
if (key === 'left') {
return 'right';
}
if (key === 'right') {
return 'left';
}
if (LOWER_LEFT_REGEXP.test(key)) {
return key.replace(LOWER_LEFT_REGEXP, '-right');
}
if (LOWER_RIGHT_REGEXP.test(key)) {
return key.replace(LOWER_RIGHT_REGEXP, '-left');
}
if (UPPER_LEFT_REGEXP.test(key)) {
return key.replace(UPPER_LEFT_REGEXP, 'Right');
}
if (UPPER_RIGHT_REGEXP.test(key)) {
return key.replace(UPPER_RIGHT_REGEXP, 'Left');
}
return key;
}
/**
* An incredibly basic ltr -> rtl converter for style properties
*
* @param {import('react').CSSProperties} ltrStyles
*
* @return {import('react').CSSProperties} Converted ltr -> rtl styles
*/
const convertLTRToRTL = function () {
let ltrStyles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return Object.fromEntries(Object.entries(ltrStyles).map(_ref => {
let [key, value] = _ref;
return [getConvertedKey(key), value];
}));
};
/**
* A higher-order function that create an incredibly basic ltr -> rtl style converter for CSS objects.
*
* @param {import('react').CSSProperties} ltrStyles Ltr styles. Converts and renders from ltr -> rtl styles, if applicable.
* @param {import('react').CSSProperties} [rtlStyles] Rtl styles. Renders if provided.
*
* @return {() => import('@emotion/react').SerializedStyles} A function to output CSS styles for Emotion's renderer
*/
function rtl() {
let ltrStyles = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
let rtlStyles = arguments.length > 1 ? arguments[1] : undefined;
return () => {
if (rtlStyles) {
// @ts-ignore: `css` types are wrong, it can accept an object: https://emotion.sh/docs/object-styles#with-css
return (0,external_wp_i18n_namespaceObject.isRTL)() ? /*#__PURE__*/emotion_react_browser_esm_css(rtlStyles, true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css(ltrStyles, true ? "" : 0);
} // @ts-ignore: `css` types are wrong, it can accept an object: https://emotion.sh/docs/object-styles#with-css
return (0,external_wp_i18n_namespaceObject.isRTL)() ? /*#__PURE__*/emotion_react_browser_esm_css(convertLTRToRTL(ltrStyles), true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css(ltrStyles, true ? "" : 0);
};
}
/**
* Call this in the `useMemo` dependency array to ensure that subsequent renders will
* cause rtl styles to update based on the `isRTL` return value even if all other dependencies
* remain the same.
*
* @example
* const styles = useMemo( () => {
* return css`
* ${ rtl( { marginRight: '10px' } ) }
* `;
* }, [ rtl.watch() ] );
*/
rtl.watch = () => (0,external_wp_i18n_namespaceObject.isRTL)();
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/styles/input-control-styles.js
function input_control_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)."; }
/**
* External dependencies
*/
var _ref2 = true ? {
name: "1739oy8",
styles: "z-index:1"
} : 0;
const rootFocusedStyles = _ref3 => {
let {
isFocused
} = _ref3;
if (!isFocused) return '';
return _ref2;
};
const input_control_styles_Root = /*#__PURE__*/createStyled(flex_component, true ? {
target: "em5sgkm7"
} : 0)("box-sizing:border-box;position:relative;border-radius:2px;padding-top:0;", rootFocusedStyles, ";" + ( true ? "" : 0));
const containerDisabledStyles = _ref4 => {
let {
disabled
} = _ref4;
const backgroundColor = disabled ? COLORS.ui.backgroundDisabled : COLORS.ui.background;
return /*#__PURE__*/emotion_react_browser_esm_css({
backgroundColor
}, true ? "" : 0, true ? "" : 0);
};
var input_control_styles_ref = true ? {
name: "1d3w5wq",
styles: "width:100%"
} : 0;
const containerWidthStyles = _ref5 => {
let {
__unstableInputWidth,
labelPosition
} = _ref5;
if (!__unstableInputWidth) return input_control_styles_ref;
if (labelPosition === 'side') return '';
if (labelPosition === 'edge') {
return /*#__PURE__*/emotion_react_browser_esm_css({
flex: `0 0 ${__unstableInputWidth}`
}, true ? "" : 0, true ? "" : 0);
}
return /*#__PURE__*/emotion_react_browser_esm_css({
width: __unstableInputWidth
}, true ? "" : 0, true ? "" : 0);
};
const Container = createStyled("div", true ? {
target: "em5sgkm6"
} : 0)("align-items:center;box-sizing:border-box;border-radius:inherit;display:flex;flex:1;position:relative;", containerDisabledStyles, " ", containerWidthStyles, ";" + ( true ? "" : 0));
const disabledStyles = _ref6 => {
let {
disabled
} = _ref6;
if (!disabled) return '';
return /*#__PURE__*/emotion_react_browser_esm_css({
color: COLORS.ui.textDisabled
}, true ? "" : 0, true ? "" : 0);
};
const fontSizeStyles = _ref7 => {
let {
inputSize: size
} = _ref7;
const sizes = {
default: '13px',
small: '11px',
'__unstable-large': '13px'
};
const fontSize = sizes[size] || sizes.default;
const fontSizeMobile = '16px';
if (!fontSize) return '';
return /*#__PURE__*/emotion_react_browser_esm_css("font-size:", fontSizeMobile, ";@media ( min-width: 600px ){font-size:", fontSize, ";}" + ( true ? "" : 0), true ? "" : 0);
};
const getSizeConfig = _ref8 => {
let {
inputSize: size,
__next36pxDefaultSize
} = _ref8;
// Paddings may be overridden by the custom paddings props.
const sizes = {
default: {
height: 36,
lineHeight: 1,
minHeight: 36,
paddingLeft: space(4),
paddingRight: space(4)
},
small: {
height: 24,
lineHeight: 1,
minHeight: 24,
paddingLeft: space(2),
paddingRight: space(2)
},
'__unstable-large': {
height: 40,
lineHeight: 1,
minHeight: 40,
paddingLeft: space(4),
paddingRight: space(4)
}
};
if (!__next36pxDefaultSize) {
sizes.default = {
height: 30,
lineHeight: 1,
minHeight: 30,
paddingLeft: space(2),
paddingRight: space(2)
};
}
return sizes[size] || sizes.default;
};
const sizeStyles = props => {
return /*#__PURE__*/emotion_react_browser_esm_css(getSizeConfig(props), true ? "" : 0, true ? "" : 0);
};
const customPaddings = _ref9 => {
let {
paddingInlineStart,
paddingInlineEnd
} = _ref9;
return /*#__PURE__*/emotion_react_browser_esm_css({
paddingInlineStart,
paddingInlineEnd
}, true ? "" : 0, true ? "" : 0);
};
const dragStyles = _ref10 => {
let {
isDragging,
dragCursor
} = _ref10;
let defaultArrowStyles;
let activeDragCursorStyles;
if (isDragging) {
defaultArrowStyles = /*#__PURE__*/emotion_react_browser_esm_css("cursor:", dragCursor, ";user-select:none;&::-webkit-outer-spin-button,&::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important;}" + ( true ? "" : 0), true ? "" : 0);
}
if (isDragging && dragCursor) {
activeDragCursorStyles = /*#__PURE__*/emotion_react_browser_esm_css("&:active{cursor:", dragCursor, ";}" + ( true ? "" : 0), true ? "" : 0);
}
return /*#__PURE__*/emotion_react_browser_esm_css(defaultArrowStyles, " ", activeDragCursorStyles, ";" + ( true ? "" : 0), true ? "" : 0);
}; // TODO: Resolve need to use &&& to increase specificity
// https://github.com/WordPress/gutenberg/issues/18483
const Input = createStyled("input", true ? {
target: "em5sgkm5"
} : 0)("&&&{background-color:transparent;box-sizing:border-box;border:none;box-shadow:none!important;color:", COLORS.gray[900], ";display:block;font-family:inherit;margin:0;outline:none;width:100%;", dragStyles, " ", disabledStyles, " ", fontSizeStyles, " ", sizeStyles, " ", customPaddings, " &::-webkit-input-placeholder{line-height:normal;}}" + ( true ? "" : 0));
const BaseLabel = /*#__PURE__*/createStyled(text_component, true ? {
target: "em5sgkm4"
} : 0)("&&&{", baseLabelTypography, ";box-sizing:border-box;display:block;padding-top:0;padding-bottom:0;max-width:100%;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}" + ( true ? "" : 0));
const Label = props => (0,external_wp_element_namespaceObject.createElement)(BaseLabel, extends_extends({}, props, {
as: "label"
}));
const LabelWrapper = /*#__PURE__*/createStyled(flex_item_component, true ? {
target: "em5sgkm3"
} : 0)( true ? {
name: "1b6uupn",
styles: "max-width:calc( 100% - 10px )"
} : 0);
const backdropFocusedStyles = _ref11 => {
let {
disabled,
isFocused
} = _ref11;
let borderColor = isFocused ? COLORS.ui.borderFocus : COLORS.ui.border;
let boxShadow;
if (isFocused) {
boxShadow = `0 0 0 1px ${COLORS.ui.borderFocus} inset`;
}
if (disabled) {
borderColor = COLORS.ui.borderDisabled;
}
return /*#__PURE__*/emotion_react_browser_esm_css({
boxShadow,
borderColor,
borderStyle: 'solid',
borderWidth: 1
}, true ? "" : 0, true ? "" : 0);
};
const BackdropUI = createStyled("div", true ? {
target: "em5sgkm2"
} : 0)("&&&{box-sizing:border-box;border-radius:inherit;bottom:0;left:0;margin:0;padding:0;pointer-events:none;position:absolute;right:0;top:0;", backdropFocusedStyles, " ", rtl({
paddingLeft: 2
}), ";}" + ( true ? "" : 0));
const Prefix = createStyled("span", true ? {
target: "em5sgkm1"
} : 0)( true ? {
name: "pvvbxf",
styles: "box-sizing:border-box;display:block"
} : 0);
const Suffix = createStyled("span", true ? {
target: "em5sgkm0"
} : 0)( true ? {
name: "jgf79h",
styles: "align-items:center;align-self:stretch;box-sizing:border-box;display:flex"
} : 0);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/backdrop.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function Backdrop(_ref) {
let {
disabled = false,
isFocused = false
} = _ref;
return (0,external_wp_element_namespaceObject.createElement)(BackdropUI, {
"aria-hidden": "true",
className: "components-input-control__backdrop",
disabled: disabled,
isFocused: isFocused
});
}
const MemoizedBackdrop = (0,external_wp_element_namespaceObject.memo)(Backdrop);
/* harmony default export */ var backdrop = (MemoizedBackdrop);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/label.js
/**
* Internal dependencies
*/
function label_Label(_ref) {
let {
children,
hideLabelFromVision,
htmlFor,
...props
} = _ref;
if (!children) return null;
if (hideLabelFromVision) {
return (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, {
as: "label",
htmlFor: htmlFor
}, children);
}
return (0,external_wp_element_namespaceObject.createElement)(LabelWrapper, null, (0,external_wp_element_namespaceObject.createElement)(Label, extends_extends({
htmlFor: htmlFor
}, props), children));
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-base.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useUniqueId(idProp) {
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(InputBase);
const id = `input-base-control-${instanceId}`;
return idProp || id;
} // Adapter to map props for the new ui/flex component.
function getUIFlexProps(labelPosition) {
const props = {};
switch (labelPosition) {
case 'top':
props.direction = 'column';
props.expanded = false;
props.gap = 0;
break;
case 'bottom':
props.direction = 'column-reverse';
props.expanded = false;
props.gap = 0;
break;
case 'edge':
props.justify = 'space-between';
break;
}
return props;
}
function InputBase(_ref, ref) {
let {
__next36pxDefaultSize,
__unstableInputWidth,
children,
className,
disabled = false,
hideLabelFromVision = false,
labelPosition,
id: idProp,
isFocused = false,
label,
prefix,
size = 'default',
suffix,
...props
} = _ref;
const id = useUniqueId(idProp);
const hideLabel = hideLabelFromVision || !label;
const {
paddingLeft,
paddingRight
} = getSizeConfig({
inputSize: size,
__next36pxDefaultSize
});
const prefixSuffixContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => {
return {
InputControlPrefixWrapper: {
paddingLeft
},
InputControlSuffixWrapper: {
paddingRight
}
};
}, [paddingLeft, paddingRight]);
return (// @ts-expect-error The `direction` prop from Flex (FlexDirection) conflicts with legacy SVGAttributes `direction` (string) that come from React intrinsic prop definitions.
(0,external_wp_element_namespaceObject.createElement)(input_control_styles_Root, extends_extends({}, props, getUIFlexProps(labelPosition), {
className: className,
gap: 2,
isFocused: isFocused,
labelPosition: labelPosition,
ref: ref
}), (0,external_wp_element_namespaceObject.createElement)(label_Label, {
className: "components-input-control__label",
hideLabelFromVision: hideLabelFromVision,
labelPosition: labelPosition,
htmlFor: id
}, label), (0,external_wp_element_namespaceObject.createElement)(Container, {
__unstableInputWidth: __unstableInputWidth,
className: "components-input-control__container",
disabled: disabled,
hideLabel: hideLabel,
labelPosition: labelPosition
}, (0,external_wp_element_namespaceObject.createElement)(ContextSystemProvider, {
value: prefixSuffixContextValue
}, prefix && (0,external_wp_element_namespaceObject.createElement)(Prefix, {
className: "components-input-control__prefix"
}, prefix), children, suffix && (0,external_wp_element_namespaceObject.createElement)(Suffix, {
className: "components-input-control__suffix"
}, suffix)), (0,external_wp_element_namespaceObject.createElement)(backdrop, {
disabled: disabled,
isFocused: isFocused
})))
);
}
/* harmony default export */ var input_base = ((0,external_wp_element_namespaceObject.forwardRef)(InputBase));
;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/maths-0ab39ae9.esm.js
function maths_0ab39ae9_esm_clamp(v, min, max) {
return Math.max(min, Math.min(v, max));
}
const V = {
toVector(v, fallback) {
if (v === undefined) v = fallback;
return Array.isArray(v) ? v : [v, v];
},
add(v1, v2) {
return [v1[0] + v2[0], v1[1] + v2[1]];
},
sub(v1, v2) {
return [v1[0] - v2[0], v1[1] - v2[1]];
},
addTo(v1, v2) {
v1[0] += v2[0];
v1[1] += v2[1];
},
subTo(v1, v2) {
v1[0] -= v2[0];
v1[1] -= v2[1];
}
};
function rubberband(distance, dimension, constant) {
if (dimension === 0 || Math.abs(dimension) === Infinity) return Math.pow(distance, constant * 5);
return distance * dimension * constant / (dimension + constant * distance);
}
function rubberbandIfOutOfBounds(position, min, max, constant = 0.15) {
if (constant === 0) return maths_0ab39ae9_esm_clamp(position, min, max);
if (position < min) return -rubberband(min - position, max - min, constant) + min;
if (position > max) return +rubberband(position - max, max - min, constant) + max;
return position;
}
function computeRubberband(bounds, [Vx, Vy], [Rx, Ry]) {
const [[X0, X1], [Y0, Y1]] = bounds;
return [rubberbandIfOutOfBounds(Vx, X0, X1, Rx), rubberbandIfOutOfBounds(Vy, Y0, Y1, Ry)];
}
;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/actions-94b581a0.esm.js
function _toPrimitive(input, hint) {
if (typeof input !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (typeof res !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return typeof key === "symbol" ? key : String(key);
}
function actions_94b581a0_esm_defineProperty(obj, key, value) {
key = _toPropertyKey(key);
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function actions_94b581a0_esm_ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
enumerableOnly && (symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
})), keys.push.apply(keys, symbols);
}
return keys;
}
function actions_94b581a0_esm_objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = null != arguments[i] ? arguments[i] : {};
i % 2 ? actions_94b581a0_esm_ownKeys(Object(source), !0).forEach(function (key) {
actions_94b581a0_esm_defineProperty(target, key, source[key]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : actions_94b581a0_esm_ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
const EVENT_TYPE_MAP = {
pointer: {
start: 'down',
change: 'move',
end: 'up'
},
mouse: {
start: 'down',
change: 'move',
end: 'up'
},
touch: {
start: 'start',
change: 'move',
end: 'end'
},
gesture: {
start: 'start',
change: 'change',
end: 'end'
}
};
function capitalize(string) {
if (!string) return '';
return string[0].toUpperCase() + string.slice(1);
}
const actionsWithoutCaptureSupported = ['enter', 'leave'];
function hasCapture(capture = false, actionKey) {
return capture && !actionsWithoutCaptureSupported.includes(actionKey);
}
function toHandlerProp(device, action = '', capture = false) {
const deviceProps = EVENT_TYPE_MAP[device];
const actionKey = deviceProps ? deviceProps[action] || action : action;
return 'on' + capitalize(device) + capitalize(actionKey) + (hasCapture(capture, actionKey) ? 'Capture' : '');
}
const pointerCaptureEvents = ['gotpointercapture', 'lostpointercapture'];
function parseProp(prop) {
let eventKey = prop.substring(2).toLowerCase();
const passive = !!~eventKey.indexOf('passive');
if (passive) eventKey = eventKey.replace('passive', '');
const captureKey = pointerCaptureEvents.includes(eventKey) ? 'capturecapture' : 'capture';
const capture = !!~eventKey.indexOf(captureKey);
if (capture) eventKey = eventKey.replace('capture', '');
return {
device: eventKey,
capture,
passive
};
}
function toDomEventType(device, action = '') {
const deviceProps = EVENT_TYPE_MAP[device];
const actionKey = deviceProps ? deviceProps[action] || action : action;
return device + actionKey;
}
function isTouch(event) {
return 'touches' in event;
}
function getPointerType(event) {
if (isTouch(event)) return 'touch';
if ('pointerType' in event) return event.pointerType;
return 'mouse';
}
function getCurrentTargetTouchList(event) {
return Array.from(event.touches).filter(e => {
var _event$currentTarget, _event$currentTarget$;
return e.target === event.currentTarget || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : (_event$currentTarget$ = _event$currentTarget.contains) === null || _event$currentTarget$ === void 0 ? void 0 : _event$currentTarget$.call(_event$currentTarget, e.target));
});
}
function getTouchList(event) {
return event.type === 'touchend' || event.type === 'touchcancel' ? event.changedTouches : event.targetTouches;
}
function getValueEvent(event) {
return isTouch(event) ? getTouchList(event)[0] : event;
}
function distanceAngle(P1, P2) {
try {
const dx = P2.clientX - P1.clientX;
const dy = P2.clientY - P1.clientY;
const cx = (P2.clientX + P1.clientX) / 2;
const cy = (P2.clientY + P1.clientY) / 2;
const distance = Math.hypot(dx, dy);
const angle = -(Math.atan2(dx, dy) * 180) / Math.PI;
const origin = [cx, cy];
return {
angle,
distance,
origin
};
} catch (_unused) {}
return null;
}
function touchIds(event) {
return getCurrentTargetTouchList(event).map(touch => touch.identifier);
}
function touchDistanceAngle(event, ids) {
const [P1, P2] = Array.from(event.touches).filter(touch => ids.includes(touch.identifier));
return distanceAngle(P1, P2);
}
function pointerId(event) {
const valueEvent = getValueEvent(event);
return isTouch(event) ? valueEvent.identifier : valueEvent.pointerId;
}
function pointerValues(event) {
const valueEvent = getValueEvent(event);
return [valueEvent.clientX, valueEvent.clientY];
}
const LINE_HEIGHT = 40;
const PAGE_HEIGHT = 800;
function wheelValues(event) {
let {
deltaX,
deltaY,
deltaMode
} = event;
if (deltaMode === 1) {
deltaX *= LINE_HEIGHT;
deltaY *= LINE_HEIGHT;
} else if (deltaMode === 2) {
deltaX *= PAGE_HEIGHT;
deltaY *= PAGE_HEIGHT;
}
return [deltaX, deltaY];
}
function scrollValues(event) {
var _ref, _ref2;
const {
scrollX,
scrollY,
scrollLeft,
scrollTop
} = event.currentTarget;
return [(_ref = scrollX !== null && scrollX !== void 0 ? scrollX : scrollLeft) !== null && _ref !== void 0 ? _ref : 0, (_ref2 = scrollY !== null && scrollY !== void 0 ? scrollY : scrollTop) !== null && _ref2 !== void 0 ? _ref2 : 0];
}
function getEventDetails(event) {
const payload = {};
if ('buttons' in event) payload.buttons = event.buttons;
if ('shiftKey' in event) {
const {
shiftKey,
altKey,
metaKey,
ctrlKey
} = event;
Object.assign(payload, {
shiftKey,
altKey,
metaKey,
ctrlKey
});
}
return payload;
}
function call(v, ...args) {
if (typeof v === 'function') {
return v(...args);
} else {
return v;
}
}
function actions_94b581a0_esm_noop() {}
function chain(...fns) {
if (fns.length === 0) return actions_94b581a0_esm_noop;
if (fns.length === 1) return fns[0];
return function () {
let result;
for (const fn of fns) {
result = fn.apply(this, arguments) || result;
}
return result;
};
}
function assignDefault(value, fallback) {
return Object.assign({}, fallback, value || {});
}
const BEFORE_LAST_KINEMATICS_DELAY = 32;
class Engine {
constructor(ctrl, args, key) {
this.ctrl = ctrl;
this.args = args;
this.key = key;
if (!this.state) {
this.state = {};
this.computeValues([0, 0]);
this.computeInitial();
if (this.init) this.init();
this.reset();
}
}
get state() {
return this.ctrl.state[this.key];
}
set state(state) {
this.ctrl.state[this.key] = state;
}
get shared() {
return this.ctrl.state.shared;
}
get eventStore() {
return this.ctrl.gestureEventStores[this.key];
}
get timeoutStore() {
return this.ctrl.gestureTimeoutStores[this.key];
}
get config() {
return this.ctrl.config[this.key];
}
get sharedConfig() {
return this.ctrl.config.shared;
}
get handler() {
return this.ctrl.handlers[this.key];
}
reset() {
const {
state,
shared,
ingKey,
args
} = this;
shared[ingKey] = state._active = state.active = state._blocked = state._force = false;
state._step = [false, false];
state.intentional = false;
state._movement = [0, 0];
state._distance = [0, 0];
state._direction = [0, 0];
state._delta = [0, 0];
state._bounds = [[-Infinity, Infinity], [-Infinity, Infinity]];
state.args = args;
state.axis = undefined;
state.memo = undefined;
state.elapsedTime = state.timeDelta = 0;
state.direction = [0, 0];
state.distance = [0, 0];
state.overflow = [0, 0];
state._movementBound = [false, false];
state.velocity = [0, 0];
state.movement = [0, 0];
state.delta = [0, 0];
state.timeStamp = 0;
}
start(event) {
const state = this.state;
const config = this.config;
if (!state._active) {
this.reset();
this.computeInitial();
state._active = true;
state.target = event.target;
state.currentTarget = event.currentTarget;
state.lastOffset = config.from ? call(config.from, state) : state.offset;
state.offset = state.lastOffset;
state.startTime = state.timeStamp = event.timeStamp;
}
}
computeValues(values) {
const state = this.state;
state._values = values;
state.values = this.config.transform(values);
}
computeInitial() {
const state = this.state;
state._initial = state._values;
state.initial = state.values;
}
compute(event) {
const {
state,
config,
shared
} = this;
state.args = this.args;
let dt = 0;
if (event) {
state.event = event;
if (config.preventDefault && event.cancelable) state.event.preventDefault();
state.type = event.type;
shared.touches = this.ctrl.pointerIds.size || this.ctrl.touchIds.size;
shared.locked = !!document.pointerLockElement;
Object.assign(shared, getEventDetails(event));
shared.down = shared.pressed = shared.buttons % 2 === 1 || shared.touches > 0;
dt = event.timeStamp - state.timeStamp;
state.timeStamp = event.timeStamp;
state.elapsedTime = state.timeStamp - state.startTime;
}
if (state._active) {
const _absoluteDelta = state._delta.map(Math.abs);
V.addTo(state._distance, _absoluteDelta);
}
if (this.axisIntent) this.axisIntent(event);
const [_m0, _m1] = state._movement;
const [t0, t1] = config.threshold;
const {
_step,
values
} = state;
if (config.hasCustomTransform) {
if (_step[0] === false) _step[0] = Math.abs(_m0) >= t0 && values[0];
if (_step[1] === false) _step[1] = Math.abs(_m1) >= t1 && values[1];
} else {
if (_step[0] === false) _step[0] = Math.abs(_m0) >= t0 && Math.sign(_m0) * t0;
if (_step[1] === false) _step[1] = Math.abs(_m1) >= t1 && Math.sign(_m1) * t1;
}
state.intentional = _step[0] !== false || _step[1] !== false;
if (!state.intentional) return;
const movement = [0, 0];
if (config.hasCustomTransform) {
const [v0, v1] = values;
movement[0] = _step[0] !== false ? v0 - _step[0] : 0;
movement[1] = _step[1] !== false ? v1 - _step[1] : 0;
} else {
movement[0] = _step[0] !== false ? _m0 - _step[0] : 0;
movement[1] = _step[1] !== false ? _m1 - _step[1] : 0;
}
if (this.restrictToAxis && !state._blocked) this.restrictToAxis(movement);
const previousOffset = state.offset;
const gestureIsActive = state._active && !state._blocked || state.active;
if (gestureIsActive) {
state.first = state._active && !state.active;
state.last = !state._active && state.active;
state.active = shared[this.ingKey] = state._active;
if (event) {
if (state.first) {
if ('bounds' in config) state._bounds = call(config.bounds, state);
if (this.setup) this.setup();
}
state.movement = movement;
this.computeOffset();
}
}
const [ox, oy] = state.offset;
const [[x0, x1], [y0, y1]] = state._bounds;
state.overflow = [ox < x0 ? -1 : ox > x1 ? 1 : 0, oy < y0 ? -1 : oy > y1 ? 1 : 0];
state._movementBound[0] = state.overflow[0] ? state._movementBound[0] === false ? state._movement[0] : state._movementBound[0] : false;
state._movementBound[1] = state.overflow[1] ? state._movementBound[1] === false ? state._movement[1] : state._movementBound[1] : false;
const rubberband = state._active ? config.rubberband || [0, 0] : [0, 0];
state.offset = computeRubberband(state._bounds, state.offset, rubberband);
state.delta = V.sub(state.offset, previousOffset);
this.computeMovement();
if (gestureIsActive && (!state.last || dt > BEFORE_LAST_KINEMATICS_DELAY)) {
state.delta = V.sub(state.offset, previousOffset);
const absoluteDelta = state.delta.map(Math.abs);
V.addTo(state.distance, absoluteDelta);
state.direction = state.delta.map(Math.sign);
state._direction = state._delta.map(Math.sign);
if (!state.first && dt > 0) {
state.velocity = [absoluteDelta[0] / dt, absoluteDelta[1] / dt];
state.timeDelta = dt;
}
}
}
emit() {
const state = this.state;
const shared = this.shared;
const config = this.config;
if (!state._active) this.clean();
if ((state._blocked || !state.intentional) && !state._force && !config.triggerAllEvents) return;
const memo = this.handler(actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, shared), state), {}, {
[this.aliasKey]: state.values
}));
if (memo !== undefined) state.memo = memo;
}
clean() {
this.eventStore.clean();
this.timeoutStore.clean();
}
}
function selectAxis([dx, dy], threshold) {
const absDx = Math.abs(dx);
const absDy = Math.abs(dy);
if (absDx > absDy && absDx > threshold) {
return 'x';
}
if (absDy > absDx && absDy > threshold) {
return 'y';
}
return undefined;
}
class CoordinatesEngine extends Engine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "aliasKey", 'xy');
}
reset() {
super.reset();
this.state.axis = undefined;
}
init() {
this.state.offset = [0, 0];
this.state.lastOffset = [0, 0];
}
computeOffset() {
this.state.offset = V.add(this.state.lastOffset, this.state.movement);
}
computeMovement() {
this.state.movement = V.sub(this.state.offset, this.state.lastOffset);
}
axisIntent(event) {
const state = this.state;
const config = this.config;
if (!state.axis && event) {
const threshold = typeof config.axisThreshold === 'object' ? config.axisThreshold[getPointerType(event)] : config.axisThreshold;
state.axis = selectAxis(state._movement, threshold);
}
state._blocked = (config.lockDirection || !!config.axis) && !state.axis || !!config.axis && config.axis !== state.axis;
}
restrictToAxis(v) {
if (this.config.axis || this.config.lockDirection) {
switch (this.state.axis) {
case 'x':
v[1] = 0;
break;
case 'y':
v[0] = 0;
break;
}
}
}
}
const identity = v => v;
const DEFAULT_RUBBERBAND = 0.15;
const commonConfigResolver = {
enabled(value = true) {
return value;
},
eventOptions(value, _k, config) {
return actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, config.shared.eventOptions), value);
},
preventDefault(value = false) {
return value;
},
triggerAllEvents(value = false) {
return value;
},
rubberband(value = 0) {
switch (value) {
case true:
return [DEFAULT_RUBBERBAND, DEFAULT_RUBBERBAND];
case false:
return [0, 0];
default:
return V.toVector(value);
}
},
from(value) {
if (typeof value === 'function') return value;
if (value != null) return V.toVector(value);
},
transform(value, _k, config) {
const transform = value || config.shared.transform;
this.hasCustomTransform = !!transform;
if (false) {}
return transform || identity;
},
threshold(value) {
return V.toVector(value, 0);
}
};
if (false) {}
const DEFAULT_AXIS_THRESHOLD = 0;
const coordinatesConfigResolver = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, commonConfigResolver), {}, {
axis(_v, _k, {
axis
}) {
this.lockDirection = axis === 'lock';
if (!this.lockDirection) return axis;
},
axisThreshold(value = DEFAULT_AXIS_THRESHOLD) {
return value;
},
bounds(value = {}) {
if (typeof value === 'function') {
return state => coordinatesConfigResolver.bounds(value(state));
}
if ('current' in value) {
return () => value.current;
}
if (typeof HTMLElement === 'function' && value instanceof HTMLElement) {
return value;
}
const {
left = -Infinity,
right = Infinity,
top = -Infinity,
bottom = Infinity
} = value;
return [[left, right], [top, bottom]];
}
});
const KEYS_DELTA_MAP = {
ArrowRight: (displacement, factor = 1) => [displacement * factor, 0],
ArrowLeft: (displacement, factor = 1) => [-1 * displacement * factor, 0],
ArrowUp: (displacement, factor = 1) => [0, -1 * displacement * factor],
ArrowDown: (displacement, factor = 1) => [0, displacement * factor]
};
class DragEngine extends CoordinatesEngine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'dragging');
}
reset() {
super.reset();
const state = this.state;
state._pointerId = undefined;
state._pointerActive = false;
state._keyboardActive = false;
state._preventScroll = false;
state._delayed = false;
state.swipe = [0, 0];
state.tap = false;
state.canceled = false;
state.cancel = this.cancel.bind(this);
}
setup() {
const state = this.state;
if (state._bounds instanceof HTMLElement) {
const boundRect = state._bounds.getBoundingClientRect();
const targetRect = state.currentTarget.getBoundingClientRect();
const _bounds = {
left: boundRect.left - targetRect.left + state.offset[0],
right: boundRect.right - targetRect.right + state.offset[0],
top: boundRect.top - targetRect.top + state.offset[1],
bottom: boundRect.bottom - targetRect.bottom + state.offset[1]
};
state._bounds = coordinatesConfigResolver.bounds(_bounds);
}
}
cancel() {
const state = this.state;
if (state.canceled) return;
state.canceled = true;
state._active = false;
setTimeout(() => {
this.compute();
this.emit();
}, 0);
}
setActive() {
this.state._active = this.state._pointerActive || this.state._keyboardActive;
}
clean() {
this.pointerClean();
this.state._pointerActive = false;
this.state._keyboardActive = false;
super.clean();
}
pointerDown(event) {
const config = this.config;
const state = this.state;
if (event.buttons != null && (Array.isArray(config.pointerButtons) ? !config.pointerButtons.includes(event.buttons) : config.pointerButtons !== -1 && config.pointerButtons !== event.buttons)) return;
const ctrlIds = this.ctrl.setEventIds(event);
if (config.pointerCapture) {
event.target.setPointerCapture(event.pointerId);
}
if (ctrlIds && ctrlIds.size > 1 && state._pointerActive) return;
this.start(event);
this.setupPointer(event);
state._pointerId = pointerId(event);
state._pointerActive = true;
this.computeValues(pointerValues(event));
this.computeInitial();
if (config.preventScrollAxis && getPointerType(event) !== 'mouse') {
state._active = false;
this.setupScrollPrevention(event);
} else if (config.delay > 0) {
this.setupDelayTrigger(event);
if (config.triggerAllEvents) {
this.compute(event);
this.emit();
}
} else {
this.startPointerDrag(event);
}
}
startPointerDrag(event) {
const state = this.state;
state._active = true;
state._preventScroll = true;
state._delayed = false;
this.compute(event);
this.emit();
}
pointerMove(event) {
const state = this.state;
const config = this.config;
if (!state._pointerActive) return;
if (state.type === event.type && event.timeStamp === state.timeStamp) return;
const id = pointerId(event);
if (state._pointerId !== undefined && id !== state._pointerId) return;
const _values = pointerValues(event);
if (document.pointerLockElement === event.target) {
state._delta = [event.movementX, event.movementY];
} else {
state._delta = V.sub(_values, state._values);
this.computeValues(_values);
}
V.addTo(state._movement, state._delta);
this.compute(event);
if (state._delayed && state.intentional) {
this.timeoutStore.remove('dragDelay');
state.active = false;
this.startPointerDrag(event);
return;
}
if (config.preventScrollAxis && !state._preventScroll) {
if (state.axis) {
if (state.axis === config.preventScrollAxis || config.preventScrollAxis === 'xy') {
state._active = false;
this.clean();
return;
} else {
this.timeoutStore.remove('startPointerDrag');
this.startPointerDrag(event);
return;
}
} else {
return;
}
}
this.emit();
}
pointerUp(event) {
this.ctrl.setEventIds(event);
try {
if (this.config.pointerCapture && event.target.hasPointerCapture(event.pointerId)) {
;
event.target.releasePointerCapture(event.pointerId);
}
} catch (_unused) {
if (false) {}
}
const state = this.state;
const config = this.config;
if (!state._active || !state._pointerActive) return;
const id = pointerId(event);
if (state._pointerId !== undefined && id !== state._pointerId) return;
this.state._pointerActive = false;
this.setActive();
this.compute(event);
const [dx, dy] = state._distance;
state.tap = dx <= config.tapsThreshold && dy <= config.tapsThreshold;
if (state.tap && config.filterTaps) {
state._force = true;
} else {
const [_dx, _dy] = state._delta;
const [_mx, _my] = state._movement;
const [svx, svy] = config.swipe.velocity;
const [sx, sy] = config.swipe.distance;
const sdt = config.swipe.duration;
if (state.elapsedTime < sdt) {
const _vx = Math.abs(_dx / state.timeDelta);
const _vy = Math.abs(_dy / state.timeDelta);
if (_vx > svx && Math.abs(_mx) > sx) state.swipe[0] = Math.sign(_dx);
if (_vy > svy && Math.abs(_my) > sy) state.swipe[1] = Math.sign(_dy);
}
}
this.emit();
}
pointerClick(event) {
if (!this.state.tap && event.detail > 0) {
event.preventDefault();
event.stopPropagation();
}
}
setupPointer(event) {
const config = this.config;
const device = config.device;
if (false) {}
if (config.pointerLock) {
event.currentTarget.requestPointerLock();
}
if (!config.pointerCapture) {
this.eventStore.add(this.sharedConfig.window, device, 'change', this.pointerMove.bind(this));
this.eventStore.add(this.sharedConfig.window, device, 'end', this.pointerUp.bind(this));
this.eventStore.add(this.sharedConfig.window, device, 'cancel', this.pointerUp.bind(this));
}
}
pointerClean() {
if (this.config.pointerLock && document.pointerLockElement === this.state.currentTarget) {
document.exitPointerLock();
}
}
preventScroll(event) {
if (this.state._preventScroll && event.cancelable) {
event.preventDefault();
}
}
setupScrollPrevention(event) {
this.state._preventScroll = false;
persistEvent(event);
const remove = this.eventStore.add(this.sharedConfig.window, 'touch', 'change', this.preventScroll.bind(this), {
passive: false
});
this.eventStore.add(this.sharedConfig.window, 'touch', 'end', remove);
this.eventStore.add(this.sharedConfig.window, 'touch', 'cancel', remove);
this.timeoutStore.add('startPointerDrag', this.startPointerDrag.bind(this), this.config.preventScrollDelay, event);
}
setupDelayTrigger(event) {
this.state._delayed = true;
this.timeoutStore.add('dragDelay', () => {
this.state._step = [0, 0];
this.startPointerDrag(event);
}, this.config.delay);
}
keyDown(event) {
const deltaFn = KEYS_DELTA_MAP[event.key];
if (deltaFn) {
const state = this.state;
const factor = event.shiftKey ? 10 : event.altKey ? 0.1 : 1;
this.start(event);
state._delta = deltaFn(this.config.keyboardDisplacement, factor);
state._keyboardActive = true;
V.addTo(state._movement, state._delta);
this.compute(event);
this.emit();
}
}
keyUp(event) {
if (!(event.key in KEYS_DELTA_MAP)) return;
this.state._keyboardActive = false;
this.setActive();
this.compute(event);
this.emit();
}
bind(bindFunction) {
const device = this.config.device;
bindFunction(device, 'start', this.pointerDown.bind(this));
if (this.config.pointerCapture) {
bindFunction(device, 'change', this.pointerMove.bind(this));
bindFunction(device, 'end', this.pointerUp.bind(this));
bindFunction(device, 'cancel', this.pointerUp.bind(this));
bindFunction('lostPointerCapture', '', this.pointerUp.bind(this));
}
if (this.config.keys) {
bindFunction('key', 'down', this.keyDown.bind(this));
bindFunction('key', 'up', this.keyUp.bind(this));
}
if (this.config.filterTaps) {
bindFunction('click', '', this.pointerClick.bind(this), {
capture: true,
passive: false
});
}
}
}
function persistEvent(event) {
'persist' in event && typeof event.persist === 'function' && event.persist();
}
const actions_94b581a0_esm_isBrowser = typeof window !== 'undefined' && window.document && window.document.createElement;
function actions_94b581a0_esm_supportsTouchEvents() {
return actions_94b581a0_esm_isBrowser && 'ontouchstart' in window;
}
function isTouchScreen() {
return actions_94b581a0_esm_supportsTouchEvents() || actions_94b581a0_esm_isBrowser && window.navigator.maxTouchPoints > 1;
}
function actions_94b581a0_esm_supportsPointerEvents() {
return actions_94b581a0_esm_isBrowser && 'onpointerdown' in window;
}
function supportsPointerLock() {
return actions_94b581a0_esm_isBrowser && 'exitPointerLock' in window.document;
}
function supportsGestureEvents() {
try {
return 'constructor' in GestureEvent;
} catch (e) {
return false;
}
}
const SUPPORT = {
isBrowser: actions_94b581a0_esm_isBrowser,
gesture: supportsGestureEvents(),
touch: isTouchScreen(),
touchscreen: isTouchScreen(),
pointer: actions_94b581a0_esm_supportsPointerEvents(),
pointerLock: supportsPointerLock()
};
const DEFAULT_PREVENT_SCROLL_DELAY = 250;
const DEFAULT_DRAG_DELAY = 180;
const DEFAULT_SWIPE_VELOCITY = 0.5;
const DEFAULT_SWIPE_DISTANCE = 50;
const DEFAULT_SWIPE_DURATION = 250;
const DEFAULT_KEYBOARD_DISPLACEMENT = 10;
const DEFAULT_DRAG_AXIS_THRESHOLD = {
mouse: 0,
touch: 0,
pen: 8
};
const dragConfigResolver = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, coordinatesConfigResolver), {}, {
device(_v, _k, {
pointer: {
touch = false,
lock = false,
mouse = false
} = {}
}) {
this.pointerLock = lock && SUPPORT.pointerLock;
if (SUPPORT.touch && touch) return 'touch';
if (this.pointerLock) return 'mouse';
if (SUPPORT.pointer && !mouse) return 'pointer';
if (SUPPORT.touch) return 'touch';
return 'mouse';
},
preventScrollAxis(value, _k, {
preventScroll
}) {
this.preventScrollDelay = typeof preventScroll === 'number' ? preventScroll : preventScroll || preventScroll === undefined && value ? DEFAULT_PREVENT_SCROLL_DELAY : undefined;
if (!SUPPORT.touchscreen || preventScroll === false) return undefined;
return value ? value : preventScroll !== undefined ? 'y' : undefined;
},
pointerCapture(_v, _k, {
pointer: {
capture = true,
buttons = 1,
keys = true
} = {}
}) {
this.pointerButtons = buttons;
this.keys = keys;
return !this.pointerLock && this.device === 'pointer' && capture;
},
threshold(value, _k, {
filterTaps = false,
tapsThreshold = 3,
axis = undefined
}) {
const threshold = V.toVector(value, filterTaps ? tapsThreshold : axis ? 1 : 0);
this.filterTaps = filterTaps;
this.tapsThreshold = tapsThreshold;
return threshold;
},
swipe({
velocity = DEFAULT_SWIPE_VELOCITY,
distance = DEFAULT_SWIPE_DISTANCE,
duration = DEFAULT_SWIPE_DURATION
} = {}) {
return {
velocity: this.transform(V.toVector(velocity)),
distance: this.transform(V.toVector(distance)),
duration
};
},
delay(value = 0) {
switch (value) {
case true:
return DEFAULT_DRAG_DELAY;
case false:
return 0;
default:
return value;
}
},
axisThreshold(value) {
if (!value) return DEFAULT_DRAG_AXIS_THRESHOLD;
return actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, DEFAULT_DRAG_AXIS_THRESHOLD), value);
},
keyboardDisplacement(value = DEFAULT_KEYBOARD_DISPLACEMENT) {
return value;
}
});
if (false) {}
function clampStateInternalMovementToBounds(state) {
const [ox, oy] = state.overflow;
const [dx, dy] = state._delta;
const [dirx, diry] = state._direction;
if (ox < 0 && dx > 0 && dirx < 0 || ox > 0 && dx < 0 && dirx > 0) {
state._movement[0] = state._movementBound[0];
}
if (oy < 0 && dy > 0 && diry < 0 || oy > 0 && dy < 0 && diry > 0) {
state._movement[1] = state._movementBound[1];
}
}
const SCALE_ANGLE_RATIO_INTENT_DEG = 30;
const PINCH_WHEEL_RATIO = 100;
class PinchEngine extends Engine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'pinching');
actions_94b581a0_esm_defineProperty(this, "aliasKey", 'da');
}
init() {
this.state.offset = [1, 0];
this.state.lastOffset = [1, 0];
this.state._pointerEvents = new Map();
}
reset() {
super.reset();
const state = this.state;
state._touchIds = [];
state.canceled = false;
state.cancel = this.cancel.bind(this);
state.turns = 0;
}
computeOffset() {
const {
type,
movement,
lastOffset
} = this.state;
if (type === 'wheel') {
this.state.offset = V.add(movement, lastOffset);
} else {
this.state.offset = [(1 + movement[0]) * lastOffset[0], movement[1] + lastOffset[1]];
}
}
computeMovement() {
const {
offset,
lastOffset
} = this.state;
this.state.movement = [offset[0] / lastOffset[0], offset[1] - lastOffset[1]];
}
axisIntent() {
const state = this.state;
const [_m0, _m1] = state._movement;
if (!state.axis) {
const axisMovementDifference = Math.abs(_m0) * SCALE_ANGLE_RATIO_INTENT_DEG - Math.abs(_m1);
if (axisMovementDifference < 0) state.axis = 'angle';else if (axisMovementDifference > 0) state.axis = 'scale';
}
}
restrictToAxis(v) {
if (this.config.lockDirection) {
if (this.state.axis === 'scale') v[1] = 0;else if (this.state.axis === 'angle') v[0] = 0;
}
}
cancel() {
const state = this.state;
if (state.canceled) return;
setTimeout(() => {
state.canceled = true;
state._active = false;
this.compute();
this.emit();
}, 0);
}
touchStart(event) {
this.ctrl.setEventIds(event);
const state = this.state;
const ctrlTouchIds = this.ctrl.touchIds;
if (state._active) {
if (state._touchIds.every(id => ctrlTouchIds.has(id))) return;
}
if (ctrlTouchIds.size < 2) return;
this.start(event);
state._touchIds = Array.from(ctrlTouchIds).slice(0, 2);
const payload = touchDistanceAngle(event, state._touchIds);
if (!payload) return;
this.pinchStart(event, payload);
}
pointerStart(event) {
if (event.buttons != null && event.buttons % 2 !== 1) return;
this.ctrl.setEventIds(event);
event.target.setPointerCapture(event.pointerId);
const state = this.state;
const _pointerEvents = state._pointerEvents;
const ctrlPointerIds = this.ctrl.pointerIds;
if (state._active) {
if (Array.from(_pointerEvents.keys()).every(id => ctrlPointerIds.has(id))) return;
}
if (_pointerEvents.size < 2) {
_pointerEvents.set(event.pointerId, event);
}
if (state._pointerEvents.size < 2) return;
this.start(event);
const payload = distanceAngle(...Array.from(_pointerEvents.values()));
if (!payload) return;
this.pinchStart(event, payload);
}
pinchStart(event, payload) {
const state = this.state;
state.origin = payload.origin;
this.computeValues([payload.distance, payload.angle]);
this.computeInitial();
this.compute(event);
this.emit();
}
touchMove(event) {
if (!this.state._active) return;
const payload = touchDistanceAngle(event, this.state._touchIds);
if (!payload) return;
this.pinchMove(event, payload);
}
pointerMove(event) {
const _pointerEvents = this.state._pointerEvents;
if (_pointerEvents.has(event.pointerId)) {
_pointerEvents.set(event.pointerId, event);
}
if (!this.state._active) return;
const payload = distanceAngle(...Array.from(_pointerEvents.values()));
if (!payload) return;
this.pinchMove(event, payload);
}
pinchMove(event, payload) {
const state = this.state;
const prev_a = state._values[1];
const delta_a = payload.angle - prev_a;
let delta_turns = 0;
if (Math.abs(delta_a) > 270) delta_turns += Math.sign(delta_a);
this.computeValues([payload.distance, payload.angle - 360 * delta_turns]);
state.origin = payload.origin;
state.turns = delta_turns;
state._movement = [state._values[0] / state._initial[0] - 1, state._values[1] - state._initial[1]];
this.compute(event);
this.emit();
}
touchEnd(event) {
this.ctrl.setEventIds(event);
if (!this.state._active) return;
if (this.state._touchIds.some(id => !this.ctrl.touchIds.has(id))) {
this.state._active = false;
this.compute(event);
this.emit();
}
}
pointerEnd(event) {
const state = this.state;
this.ctrl.setEventIds(event);
try {
event.target.releasePointerCapture(event.pointerId);
} catch (_unused) {}
if (state._pointerEvents.has(event.pointerId)) {
state._pointerEvents.delete(event.pointerId);
}
if (!state._active) return;
if (state._pointerEvents.size < 2) {
state._active = false;
this.compute(event);
this.emit();
}
}
gestureStart(event) {
if (event.cancelable) event.preventDefault();
const state = this.state;
if (state._active) return;
this.start(event);
this.computeValues([event.scale, event.rotation]);
state.origin = [event.clientX, event.clientY];
this.compute(event);
this.emit();
}
gestureMove(event) {
if (event.cancelable) event.preventDefault();
if (!this.state._active) return;
const state = this.state;
this.computeValues([event.scale, event.rotation]);
state.origin = [event.clientX, event.clientY];
const _previousMovement = state._movement;
state._movement = [event.scale - 1, event.rotation];
state._delta = V.sub(state._movement, _previousMovement);
this.compute(event);
this.emit();
}
gestureEnd(event) {
if (!this.state._active) return;
this.state._active = false;
this.compute(event);
this.emit();
}
wheel(event) {
const modifierKey = this.config.modifierKey;
if (modifierKey && !event[modifierKey]) return;
if (!this.state._active) this.wheelStart(event);else this.wheelChange(event);
this.timeoutStore.add('wheelEnd', this.wheelEnd.bind(this));
}
wheelStart(event) {
this.start(event);
this.wheelChange(event);
}
wheelChange(event) {
const isR3f = ('uv' in event);
if (!isR3f) {
if (event.cancelable) {
event.preventDefault();
}
if (false) {}
}
const state = this.state;
state._delta = [-wheelValues(event)[1] / PINCH_WHEEL_RATIO * state.offset[0], 0];
V.addTo(state._movement, state._delta);
clampStateInternalMovementToBounds(state);
this.state.origin = [event.clientX, event.clientY];
this.compute(event);
this.emit();
}
wheelEnd() {
if (!this.state._active) return;
this.state._active = false;
this.compute();
this.emit();
}
bind(bindFunction) {
const device = this.config.device;
if (!!device) {
bindFunction(device, 'start', this[device + 'Start'].bind(this));
bindFunction(device, 'change', this[device + 'Move'].bind(this));
bindFunction(device, 'end', this[device + 'End'].bind(this));
bindFunction(device, 'cancel', this[device + 'End'].bind(this));
}
if (this.config.pinchOnWheel) {
bindFunction('wheel', '', this.wheel.bind(this), {
passive: false
});
}
}
}
const pinchConfigResolver = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, commonConfigResolver), {}, {
device(_v, _k, {
shared,
pointer: {
touch = false
} = {}
}) {
const sharedConfig = shared;
if (sharedConfig.target && !SUPPORT.touch && SUPPORT.gesture) return 'gesture';
if (SUPPORT.touch && touch) return 'touch';
if (SUPPORT.touchscreen) {
if (SUPPORT.pointer) return 'pointer';
if (SUPPORT.touch) return 'touch';
}
},
bounds(_v, _k, {
scaleBounds = {},
angleBounds = {}
}) {
const _scaleBounds = state => {
const D = assignDefault(call(scaleBounds, state), {
min: -Infinity,
max: Infinity
});
return [D.min, D.max];
};
const _angleBounds = state => {
const A = assignDefault(call(angleBounds, state), {
min: -Infinity,
max: Infinity
});
return [A.min, A.max];
};
if (typeof scaleBounds !== 'function' && typeof angleBounds !== 'function') return [_scaleBounds(), _angleBounds()];
return state => [_scaleBounds(state), _angleBounds(state)];
},
threshold(value, _k, config) {
this.lockDirection = config.axis === 'lock';
const threshold = V.toVector(value, this.lockDirection ? [0.1, 3] : 0);
return threshold;
},
modifierKey(value) {
if (value === undefined) return 'ctrlKey';
return value;
},
pinchOnWheel(value = true) {
return value;
}
});
class MoveEngine extends CoordinatesEngine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'moving');
}
move(event) {
if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
if (!this.state._active) this.moveStart(event);else this.moveChange(event);
this.timeoutStore.add('moveEnd', this.moveEnd.bind(this));
}
moveStart(event) {
this.start(event);
this.computeValues(pointerValues(event));
this.compute(event);
this.computeInitial();
this.emit();
}
moveChange(event) {
if (!this.state._active) return;
const values = pointerValues(event);
const state = this.state;
state._delta = V.sub(values, state._values);
V.addTo(state._movement, state._delta);
this.computeValues(values);
this.compute(event);
this.emit();
}
moveEnd(event) {
if (!this.state._active) return;
this.state._active = false;
this.compute(event);
this.emit();
}
bind(bindFunction) {
bindFunction('pointer', 'change', this.move.bind(this));
bindFunction('pointer', 'leave', this.moveEnd.bind(this));
}
}
const moveConfigResolver = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, coordinatesConfigResolver), {}, {
mouseOnly: (value = true) => value
});
class ScrollEngine extends CoordinatesEngine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'scrolling');
}
scroll(event) {
if (!this.state._active) this.start(event);
this.scrollChange(event);
this.timeoutStore.add('scrollEnd', this.scrollEnd.bind(this));
}
scrollChange(event) {
if (event.cancelable) event.preventDefault();
const state = this.state;
const values = scrollValues(event);
state._delta = V.sub(values, state._values);
V.addTo(state._movement, state._delta);
this.computeValues(values);
this.compute(event);
this.emit();
}
scrollEnd() {
if (!this.state._active) return;
this.state._active = false;
this.compute();
this.emit();
}
bind(bindFunction) {
bindFunction('scroll', '', this.scroll.bind(this));
}
}
const scrollConfigResolver = coordinatesConfigResolver;
class WheelEngine extends CoordinatesEngine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'wheeling');
}
wheel(event) {
if (!this.state._active) this.start(event);
this.wheelChange(event);
this.timeoutStore.add('wheelEnd', this.wheelEnd.bind(this));
}
wheelChange(event) {
const state = this.state;
state._delta = wheelValues(event);
V.addTo(state._movement, state._delta);
clampStateInternalMovementToBounds(state);
this.compute(event);
this.emit();
}
wheelEnd() {
if (!this.state._active) return;
this.state._active = false;
this.compute();
this.emit();
}
bind(bindFunction) {
bindFunction('wheel', '', this.wheel.bind(this));
}
}
const wheelConfigResolver = coordinatesConfigResolver;
class HoverEngine extends CoordinatesEngine {
constructor(...args) {
super(...args);
actions_94b581a0_esm_defineProperty(this, "ingKey", 'hovering');
}
enter(event) {
if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
this.start(event);
this.computeValues(pointerValues(event));
this.compute(event);
this.emit();
}
leave(event) {
if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
const state = this.state;
if (!state._active) return;
state._active = false;
const values = pointerValues(event);
state._movement = state._delta = V.sub(values, state._values);
this.computeValues(values);
this.compute(event);
state.delta = state.movement;
this.emit();
}
bind(bindFunction) {
bindFunction('pointer', 'enter', this.enter.bind(this));
bindFunction('pointer', 'leave', this.leave.bind(this));
}
}
const hoverConfigResolver = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, coordinatesConfigResolver), {}, {
mouseOnly: (value = true) => value
});
const actions_94b581a0_esm_EngineMap = new Map();
const ConfigResolverMap = new Map();
function actions_94b581a0_esm_registerAction(action) {
actions_94b581a0_esm_EngineMap.set(action.key, action.engine);
ConfigResolverMap.set(action.key, action.resolver);
}
const actions_94b581a0_esm_dragAction = {
key: 'drag',
engine: DragEngine,
resolver: dragConfigResolver
};
const actions_94b581a0_esm_hoverAction = {
key: 'hover',
engine: HoverEngine,
resolver: hoverConfigResolver
};
const actions_94b581a0_esm_moveAction = {
key: 'move',
engine: MoveEngine,
resolver: moveConfigResolver
};
const actions_94b581a0_esm_pinchAction = {
key: 'pinch',
engine: PinchEngine,
resolver: pinchConfigResolver
};
const actions_94b581a0_esm_scrollAction = {
key: 'scroll',
engine: ScrollEngine,
resolver: scrollConfigResolver
};
const actions_94b581a0_esm_wheelAction = {
key: 'wheel',
engine: WheelEngine,
resolver: wheelConfigResolver
};
;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/use-gesture-core.esm.js
function use_gesture_core_esm_objectWithoutPropertiesLoose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
function _objectWithoutProperties(source, excluded) {
if (source == null) return {};
var target = use_gesture_core_esm_objectWithoutPropertiesLoose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceSymbolKeys.length; i++) {
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
const sharedConfigResolver = {
target(value) {
if (value) {
return () => 'current' in value ? value.current : value;
}
return undefined;
},
enabled(value = true) {
return value;
},
window(value = SUPPORT.isBrowser ? window : undefined) {
return value;
},
eventOptions({
passive = true,
capture = false
} = {}) {
return {
passive,
capture
};
},
transform(value) {
return value;
}
};
const _excluded = ["target", "eventOptions", "window", "enabled", "transform"];
function resolveWith(config = {}, resolvers) {
const result = {};
for (const [key, resolver] of Object.entries(resolvers)) {
switch (typeof resolver) {
case 'function':
if (false) {} else {
result[key] = resolver.call(result, config[key], key, config);
}
break;
case 'object':
result[key] = resolveWith(config[key], resolver);
break;
case 'boolean':
if (resolver) result[key] = config[key];
break;
}
}
return result;
}
function use_gesture_core_esm_parse(newConfig, gestureKey, _config = {}) {
const _ref = newConfig,
{
target,
eventOptions,
window,
enabled,
transform
} = _ref,
rest = _objectWithoutProperties(_ref, _excluded);
_config.shared = resolveWith({
target,
eventOptions,
window,
enabled,
transform
}, sharedConfigResolver);
if (gestureKey) {
const resolver = ConfigResolverMap.get(gestureKey);
_config[gestureKey] = resolveWith(actions_94b581a0_esm_objectSpread2({
shared: _config.shared
}, rest), resolver);
} else {
for (const key in rest) {
const resolver = ConfigResolverMap.get(key);
if (resolver) {
_config[key] = resolveWith(actions_94b581a0_esm_objectSpread2({
shared: _config.shared
}, rest[key]), resolver);
} else if (false) {}
}
}
return _config;
}
class EventStore {
constructor(ctrl, gestureKey) {
actions_94b581a0_esm_defineProperty(this, "_listeners", new Set());
this._ctrl = ctrl;
this._gestureKey = gestureKey;
}
add(element, device, action, handler, options) {
const listeners = this._listeners;
const type = toDomEventType(device, action);
const _options = this._gestureKey ? this._ctrl.config[this._gestureKey].eventOptions : {};
const eventOptions = actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, _options), options);
element.addEventListener(type, handler, eventOptions);
const remove = () => {
element.removeEventListener(type, handler, eventOptions);
listeners.delete(remove);
};
listeners.add(remove);
return remove;
}
clean() {
this._listeners.forEach(remove => remove());
this._listeners.clear();
}
}
class TimeoutStore {
constructor() {
actions_94b581a0_esm_defineProperty(this, "_timeouts", new Map());
}
add(key, callback, ms = 140, ...args) {
this.remove(key);
this._timeouts.set(key, window.setTimeout(callback, ms, ...args));
}
remove(key) {
const timeout = this._timeouts.get(key);
if (timeout) window.clearTimeout(timeout);
}
clean() {
this._timeouts.forEach(timeout => void window.clearTimeout(timeout));
this._timeouts.clear();
}
}
class Controller {
constructor(handlers) {
actions_94b581a0_esm_defineProperty(this, "gestures", new Set());
actions_94b581a0_esm_defineProperty(this, "_targetEventStore", new EventStore(this));
actions_94b581a0_esm_defineProperty(this, "gestureEventStores", {});
actions_94b581a0_esm_defineProperty(this, "gestureTimeoutStores", {});
actions_94b581a0_esm_defineProperty(this, "handlers", {});
actions_94b581a0_esm_defineProperty(this, "config", {});
actions_94b581a0_esm_defineProperty(this, "pointerIds", new Set());
actions_94b581a0_esm_defineProperty(this, "touchIds", new Set());
actions_94b581a0_esm_defineProperty(this, "state", {
shared: {
shiftKey: false,
metaKey: false,
ctrlKey: false,
altKey: false
}
});
resolveGestures(this, handlers);
}
setEventIds(event) {
if (isTouch(event)) {
this.touchIds = new Set(touchIds(event));
return this.touchIds;
} else if ('pointerId' in event) {
if (event.type === 'pointerup' || event.type === 'pointercancel') this.pointerIds.delete(event.pointerId);else if (event.type === 'pointerdown') this.pointerIds.add(event.pointerId);
return this.pointerIds;
}
}
applyHandlers(handlers, nativeHandlers) {
this.handlers = handlers;
this.nativeHandlers = nativeHandlers;
}
applyConfig(config, gestureKey) {
this.config = use_gesture_core_esm_parse(config, gestureKey, this.config);
}
clean() {
this._targetEventStore.clean();
for (const key of this.gestures) {
this.gestureEventStores[key].clean();
this.gestureTimeoutStores[key].clean();
}
}
effect() {
if (this.config.shared.target) this.bind();
return () => this._targetEventStore.clean();
}
bind(...args) {
const sharedConfig = this.config.shared;
const props = {};
let target;
if (sharedConfig.target) {
target = sharedConfig.target();
if (!target) return;
}
if (sharedConfig.enabled) {
for (const gestureKey of this.gestures) {
const gestureConfig = this.config[gestureKey];
const bindFunction = bindToProps(props, gestureConfig.eventOptions, !!target);
if (gestureConfig.enabled) {
const Engine = actions_94b581a0_esm_EngineMap.get(gestureKey);
new Engine(this, args, gestureKey).bind(bindFunction);
}
}
const nativeBindFunction = bindToProps(props, sharedConfig.eventOptions, !!target);
for (const eventKey in this.nativeHandlers) {
nativeBindFunction(eventKey, '', event => this.nativeHandlers[eventKey](actions_94b581a0_esm_objectSpread2(actions_94b581a0_esm_objectSpread2({}, this.state.shared), {}, {
event,
args
})), undefined, true);
}
}
for (const handlerProp in props) {
props[handlerProp] = chain(...props[handlerProp]);
}
if (!target) return props;
for (const handlerProp in props) {
const {
device,
capture,
passive
} = parseProp(handlerProp);
this._targetEventStore.add(target, device, '', props[handlerProp], {
capture,
passive
});
}
}
}
function setupGesture(ctrl, gestureKey) {
ctrl.gestures.add(gestureKey);
ctrl.gestureEventStores[gestureKey] = new EventStore(ctrl, gestureKey);
ctrl.gestureTimeoutStores[gestureKey] = new TimeoutStore();
}
function resolveGestures(ctrl, internalHandlers) {
if (internalHandlers.drag) setupGesture(ctrl, 'drag');
if (internalHandlers.wheel) setupGesture(ctrl, 'wheel');
if (internalHandlers.scroll) setupGesture(ctrl, 'scroll');
if (internalHandlers.move) setupGesture(ctrl, 'move');
if (internalHandlers.pinch) setupGesture(ctrl, 'pinch');
if (internalHandlers.hover) setupGesture(ctrl, 'hover');
}
const bindToProps = (props, eventOptions, withPassiveOption) => (device, action, handler, options = {}, isNative = false) => {
var _options$capture, _options$passive;
const capture = (_options$capture = options.capture) !== null && _options$capture !== void 0 ? _options$capture : eventOptions.capture;
const passive = (_options$passive = options.passive) !== null && _options$passive !== void 0 ? _options$passive : eventOptions.passive;
let handlerProp = isNative ? device : toHandlerProp(device, action, capture);
if (withPassiveOption && passive) handlerProp += 'Passive';
props[handlerProp] = props[handlerProp] || [];
props[handlerProp].push(handler);
};
const RE_NOT_NATIVE = /^on(Drag|Wheel|Scroll|Move|Pinch|Hover)/;
function sortHandlers(_handlers) {
const native = {};
const handlers = {};
const actions = new Set();
for (let key in _handlers) {
if (RE_NOT_NATIVE.test(key)) {
actions.add(RegExp.lastMatch);
handlers[key] = _handlers[key];
} else {
native[key] = _handlers[key];
}
}
return [handlers, native, actions];
}
function registerGesture(actions, handlers, handlerKey, key, internalHandlers, config) {
if (!actions.has(handlerKey)) return;
if (!EngineMap.has(key)) {
if (false) {}
return;
}
const startKey = handlerKey + 'Start';
const endKey = handlerKey + 'End';
const fn = state => {
let memo = undefined;
if (state.first && startKey in handlers) handlers[startKey](state);
if (handlerKey in handlers) memo = handlers[handlerKey](state);
if (state.last && endKey in handlers) handlers[endKey](state);
return memo;
};
internalHandlers[key] = fn;
config[key] = config[key] || {};
}
function use_gesture_core_esm_parseMergedHandlers(mergedHandlers, mergedConfig) {
const [handlers, nativeHandlers, actions] = sortHandlers(mergedHandlers);
const internalHandlers = {};
registerGesture(actions, handlers, 'onDrag', 'drag', internalHandlers, mergedConfig);
registerGesture(actions, handlers, 'onWheel', 'wheel', internalHandlers, mergedConfig);
registerGesture(actions, handlers, 'onScroll', 'scroll', internalHandlers, mergedConfig);
registerGesture(actions, handlers, 'onPinch', 'pinch', internalHandlers, mergedConfig);
registerGesture(actions, handlers, 'onMove', 'move', internalHandlers, mergedConfig);
registerGesture(actions, handlers, 'onHover', 'hover', internalHandlers, mergedConfig);
return {
handlers: internalHandlers,
config: mergedConfig,
nativeHandlers
};
}
;// CONCATENATED MODULE: ./node_modules/@use-gesture/react/dist/use-gesture-react.esm.js
function useRecognizers(handlers, config = {}, gestureKey, nativeHandlers) {
const ctrl = external_React_default().useMemo(() => new Controller(handlers), []);
ctrl.applyHandlers(handlers, nativeHandlers);
ctrl.applyConfig(config, gestureKey);
external_React_default().useEffect(ctrl.effect.bind(ctrl));
external_React_default().useEffect(() => {
return ctrl.clean.bind(ctrl);
}, []);
if (config.target === undefined) {
return ctrl.bind.bind(ctrl);
}
return undefined;
}
function use_gesture_react_esm_useDrag(handler, config) {
actions_94b581a0_esm_registerAction(actions_94b581a0_esm_dragAction);
return useRecognizers({
drag: handler
}, config || {}, 'drag');
}
function usePinch(handler, config) {
registerAction(pinchAction);
return useRecognizers({
pinch: handler
}, config || {}, 'pinch');
}
function useWheel(handler, config) {
registerAction(wheelAction);
return useRecognizers({
wheel: handler
}, config || {}, 'wheel');
}
function useScroll(handler, config) {
registerAction(scrollAction);
return useRecognizers({
scroll: handler
}, config || {}, 'scroll');
}
function useMove(handler, config) {
registerAction(moveAction);
return useRecognizers({
move: handler
}, config || {}, 'move');
}
function useHover(handler, config) {
actions_94b581a0_esm_registerAction(actions_94b581a0_esm_hoverAction);
return useRecognizers({
hover: handler
}, config || {}, 'hover');
}
function createUseGesture(actions) {
actions.forEach(registerAction);
return function useGesture(_handlers, _config) {
const {
handlers,
nativeHandlers,
config
} = parseMergedHandlers(_handlers, _config || {});
return useRecognizers(handlers, config, undefined, nativeHandlers);
};
}
function useGesture(handlers, config) {
const hook = createUseGesture([dragAction, pinchAction, scrollAction, wheelAction, moveAction, hoverAction]);
return hook(handlers, config || {});
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/utils.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Gets a CSS cursor value based on a drag direction.
*
* @param dragDirection The drag direction.
* @return The CSS cursor value.
*/
function getDragCursor(dragDirection) {
let dragCursor = 'ns-resize';
switch (dragDirection) {
case 'n':
case 's':
dragCursor = 'ns-resize';
break;
case 'e':
case 'w':
dragCursor = 'ew-resize';
break;
}
return dragCursor;
}
/**
* Custom hook that renders a drag cursor when dragging.
*
* @param {boolean} isDragging The dragging state.
* @param {string} dragDirection The drag direction.
*
* @return {string} The CSS cursor value.
*/
function useDragCursor(isDragging, dragDirection) {
const dragCursor = getDragCursor(dragDirection);
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (isDragging) {
document.documentElement.style.cursor = dragCursor;
} else {
// @ts-expect-error
document.documentElement.style.cursor = null;
}
}, [isDragging, dragCursor]);
return dragCursor;
}
function useDraft(props) {
const refPreviousValue = (0,external_wp_element_namespaceObject.useRef)(props.value);
const [draft, setDraft] = (0,external_wp_element_namespaceObject.useState)({});
const value = draft.value !== undefined ? draft.value : props.value; // Determines when to discard the draft value to restore controlled status.
// To do so, it tracks the previous value and marks the draft value as stale
// after each render.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
const {
current: previousValue
} = refPreviousValue;
refPreviousValue.current = props.value;
if (draft.value !== undefined && !draft.isStale) setDraft({ ...draft,
isStale: true
});else if (draft.isStale && props.value !== previousValue) setDraft({});
}, [props.value, draft]);
const onChange = (nextValue, extra) => {
// Mutates the draft value to avoid an extra effect run.
setDraft(current => Object.assign(current, {
value: nextValue,
isStale: false
}));
props.onChange(nextValue, extra);
};
const onBlur = event => {
var _props$onBlur;
setDraft({});
(_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, event);
};
return {
value,
onBlur,
onChange
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/state.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const initialStateReducer = state => state;
const initialInputControlState = {
error: null,
initialValue: '',
isDirty: false,
isDragEnabled: false,
isDragging: false,
isPressEnterToChange: false,
value: ''
};
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/actions.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const CHANGE = 'CHANGE';
const COMMIT = 'COMMIT';
const CONTROL = 'CONTROL';
const DRAG_END = 'DRAG_END';
const DRAG_START = 'DRAG_START';
const DRAG = 'DRAG';
const INVALIDATE = 'INVALIDATE';
const PRESS_DOWN = 'PRESS_DOWN';
const PRESS_ENTER = 'PRESS_ENTER';
const PRESS_UP = 'PRESS_UP';
const RESET = 'RESET';
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/reducer.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Prepares initialState for the reducer.
*
* @param initialState The initial state.
* @return Prepared initialState for the reducer
*/
function mergeInitialState() {
let initialState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialInputControlState;
const {
value
} = initialState;
return { ...initialInputControlState,
...initialState,
initialValue: value
};
}
/**
* Creates the base reducer which may be coupled to a specializing reducer.
* As its final step, for all actions other than CONTROL, the base reducer
* passes the state and action on through the specializing reducer. The
* exception for CONTROL actions is because they represent controlled updates
* from props and no case has yet presented for their specialization.
*
* @param composedStateReducers A reducer to specialize state changes.
* @return The reducer.
*/
function inputControlStateReducer(composedStateReducers) {
return (state, action) => {
const nextState = { ...state
};
switch (action.type) {
/*
* Controlled updates
*/
case CONTROL:
nextState.value = action.payload.value;
nextState.isDirty = false;
nextState._event = undefined; // Returns immediately to avoid invoking additional reducers.
return nextState;
/**
* Keyboard events
*/
case PRESS_UP:
nextState.isDirty = false;
break;
case PRESS_DOWN:
nextState.isDirty = false;
break;
/**
* Drag events
*/
case DRAG_START:
nextState.isDragging = true;
break;
case DRAG_END:
nextState.isDragging = false;
break;
/**
* Input events
*/
case CHANGE:
nextState.error = null;
nextState.value = action.payload.value;
if (state.isPressEnterToChange) {
nextState.isDirty = true;
}
break;
case COMMIT:
nextState.value = action.payload.value;
nextState.isDirty = false;
break;
case RESET:
nextState.error = null;
nextState.isDirty = false;
nextState.value = action.payload.value || state.initialValue;
break;
/**
* Validation
*/
case INVALIDATE:
nextState.error = action.payload.error;
break;
}
nextState._event = action.payload.event;
/**
* Send the nextState + action to the composedReducers via
* this "bridge" mechanism. This allows external stateReducers
* to hook into actions, and modify state if needed.
*/
return composedStateReducers(nextState, action);
};
}
/**
* A custom hook that connects and external stateReducer with an internal
* reducer. This hook manages the internal state of InputControl.
* However, by connecting an external stateReducer function, other
* components can react to actions as well as modify state before it is
* applied.
*
* This technique uses the "stateReducer" design pattern:
* https://kentcdodds.com/blog/the-state-reducer-pattern/
*
* @param stateReducer An external state reducer.
* @param initialState The initial state for the reducer.
* @param onChangeHandler A handler for the onChange event.
* @return State, dispatch, and a collection of actions.
*/
function useInputControlStateReducer() {
let stateReducer = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialStateReducer;
let initialState = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : initialInputControlState;
let onChangeHandler = arguments.length > 2 ? arguments[2] : undefined;
const [state, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(inputControlStateReducer(stateReducer), mergeInitialState(initialState));
const createChangeEvent = type => (nextValue, event) => {
dispatch({
type,
payload: {
value: nextValue,
event
}
});
};
const createKeyEvent = type => event => {
dispatch({
type,
payload: {
event
}
});
};
const createDragEvent = type => payload => {
dispatch({
type,
payload
});
};
/**
* Actions for the reducer
*/
const change = createChangeEvent(CHANGE);
const invalidate = (error, event) => dispatch({
type: INVALIDATE,
payload: {
error,
event
}
});
const reset = createChangeEvent(RESET);
const commit = createChangeEvent(COMMIT);
const dragStart = createDragEvent(DRAG_START);
const drag = createDragEvent(DRAG);
const dragEnd = createDragEvent(DRAG_END);
const pressUp = createKeyEvent(PRESS_UP);
const pressDown = createKeyEvent(PRESS_DOWN);
const pressEnter = createKeyEvent(PRESS_ENTER);
const currentState = (0,external_wp_element_namespaceObject.useRef)(state);
const refProps = (0,external_wp_element_namespaceObject.useRef)({
value: initialState.value,
onChangeHandler
}); // Freshens refs to props and state so that subsequent effects have access
// to their latest values without their changes causing effect runs.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
currentState.current = state;
refProps.current = {
value: initialState.value,
onChangeHandler
};
}); // Propagates the latest state through onChange.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
if (currentState.current._event !== undefined && state.value !== refProps.current.value && !state.isDirty) {
var _state$value;
refProps.current.onChangeHandler((_state$value = state.value) !== null && _state$value !== void 0 ? _state$value : '', {
event: currentState.current._event
});
}
}, [state.value, state.isDirty]); // Updates the state from props.
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
if (initialState.value !== currentState.current.value && !currentState.current.isDirty) {
var _initialState$value;
dispatch({
type: CONTROL,
payload: {
value: (_initialState$value = initialState.value) !== null && _initialState$value !== void 0 ? _initialState$value : ''
}
});
}
}, [initialState.value]);
return {
change,
commit,
dispatch,
drag,
dragEnd,
dragStart,
invalidate,
pressDown,
pressEnter,
pressUp,
reset,
state
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-field.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const input_field_noop = () => {};
function InputField(_ref, ref) {
let {
disabled = false,
dragDirection = 'n',
dragThreshold = 10,
id,
isDragEnabled = false,
isFocused,
isPressEnterToChange = false,
onBlur = input_field_noop,
onChange = input_field_noop,
onDrag = input_field_noop,
onDragEnd = input_field_noop,
onDragStart = input_field_noop,
onFocus = input_field_noop,
onKeyDown = input_field_noop,
onValidate = input_field_noop,
size = 'default',
setIsFocused,
stateReducer = state => state,
value: valueProp,
type,
...props
} = _ref;
const {
// State.
state,
// Actions.
change,
commit,
drag,
dragEnd,
dragStart,
invalidate,
pressDown,
pressEnter,
pressUp,
reset
} = useInputControlStateReducer(stateReducer, {
isDragEnabled,
value: valueProp,
isPressEnterToChange
}, onChange);
const {
value,
isDragging,
isDirty
} = state;
const wasDirtyOnBlur = (0,external_wp_element_namespaceObject.useRef)(false);
const dragCursor = useDragCursor(isDragging, dragDirection);
const handleOnBlur = event => {
onBlur(event);
setIsFocused === null || setIsFocused === void 0 ? void 0 : setIsFocused(false);
/**
* If isPressEnterToChange is set, this commits the value to
* the onChange callback.
*/
if (isDirty || !event.target.validity.valid) {
wasDirtyOnBlur.current = true;
handleOnCommit(event);
}
};
const handleOnFocus = event => {
onFocus(event);
setIsFocused === null || setIsFocused === void 0 ? void 0 : setIsFocused(true);
};
const handleOnChange = event => {
const nextValue = event.target.value;
change(nextValue, event);
};
const handleOnCommit = event => {
const nextValue = event.currentTarget.value;
try {
onValidate(nextValue);
commit(nextValue, event);
} catch (err) {
invalidate(err, event);
}
};
const handleOnKeyDown = event => {
const {
key
} = event;
onKeyDown(event);
switch (key) {
case 'ArrowUp':
pressUp(event);
break;
case 'ArrowDown':
pressDown(event);
break;
case 'Enter':
pressEnter(event);
if (isPressEnterToChange) {
event.preventDefault();
handleOnCommit(event);
}
break;
case 'Escape':
if (isPressEnterToChange && isDirty) {
event.preventDefault();
reset(valueProp, event);
}
break;
}
};
const dragGestureProps = use_gesture_react_esm_useDrag(dragProps => {
const {
distance,
dragging,
event,
target
} = dragProps; // The `target` prop always references the `input` element while, by
// default, the `dragProps.event.target` property would reference the real
// event target (i.e. any DOM element that the pointer is hovering while
// dragging). Ensuring that the `target` is always the `input` element
// allows consumers of `InputControl` (or any higher-level control) to
// check the input's validity by accessing `event.target.validity.valid`.
dragProps.event = { ...dragProps.event,
target
};
if (!distance) return;
event.stopPropagation();
/**
* Quick return if no longer dragging.
* This prevents unnecessary value calculations.
*/
if (!dragging) {
onDragEnd(dragProps);
dragEnd(dragProps);
return;
}
onDrag(dragProps);
drag(dragProps);
if (!isDragging) {
onDragStart(dragProps);
dragStart(dragProps);
}
}, {
axis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',
threshold: dragThreshold,
enabled: isDragEnabled,
pointer: {
capture: false
}
});
const dragProps = isDragEnabled ? dragGestureProps() : {};
/*
* Works around the odd UA (e.g. Firefox) that does not focus inputs of
* type=number when their spinner arrows are pressed.
*/
let handleOnMouseDown;
if (type === 'number') {
handleOnMouseDown = event => {
var _props$onMouseDown;
(_props$onMouseDown = props.onMouseDown) === null || _props$onMouseDown === void 0 ? void 0 : _props$onMouseDown.call(props, event);
if (event.currentTarget !== event.currentTarget.ownerDocument.activeElement) {
event.currentTarget.focus();
}
};
}
return (0,external_wp_element_namespaceObject.createElement)(Input, extends_extends({}, props, dragProps, {
className: "components-input-control__input",
disabled: disabled,
dragCursor: dragCursor,
isDragging: isDragging,
id: id,
onBlur: handleOnBlur,
onChange: handleOnChange,
onFocus: handleOnFocus,
onKeyDown: handleOnKeyDown,
onMouseDown: handleOnMouseDown,
ref: ref,
inputSize: size // Fallback to `''` to avoid "uncontrolled to controlled" warning.
// See https://github.com/WordPress/gutenberg/pull/47250 for details.
,
value: value !== null && value !== void 0 ? value : '',
type: type
}));
}
const ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(InputField);
/* harmony default export */ var input_field = (ForwardedComponent);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font-values.js
/* harmony default export */ var font_values = ({
'default.fontFamily': "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif",
'default.fontSize': '13px',
'helpText.fontSize': '12px',
mobileTextMinFontSize: '16px'
});
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
/**
*
* @param {keyof FONT} value Path of value from `FONT`
* @return {string} Font rule value
*/
function font(value) {
return (0,external_lodash_namespaceObject.get)(font_values, value, '');
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/box-sizing.js
function box_sizing_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)."; }
/**
* External dependencies
*/
const boxSizingReset = true ? {
name: "kv6lnz",
styles: "box-sizing:border-box;*,*::before,*::after{box-sizing:inherit;}"
} : 0;
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/styles/base-control-styles.js
function base_control_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const base_control_styles_Wrapper = createStyled("div", true ? {
target: "ej5x27r4"
} : 0)("font-family:", font('default.fontFamily'), ";font-size:", font('default.fontSize'), ";", boxSizingReset, ";" + ( true ? "" : 0));
const deprecatedMarginField = _ref2 => {
let {
__nextHasNoMarginBottom = false
} = _ref2;
return !__nextHasNoMarginBottom && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(2), ";" + ( true ? "" : 0), true ? "" : 0);
};
const StyledField = createStyled("div", true ? {
target: "ej5x27r3"
} : 0)(deprecatedMarginField, " .components-panel__row &{margin-bottom:inherit;}" + ( true ? "" : 0));
const labelStyles = /*#__PURE__*/emotion_react_browser_esm_css(baseLabelTypography, ";display:inline-block;margin-bottom:", space(2), ";padding:0;" + ( true ? "" : 0), true ? "" : 0);
const StyledLabel = createStyled("label", true ? {
target: "ej5x27r2"
} : 0)(labelStyles, ";" + ( true ? "" : 0));
var base_control_styles_ref = true ? {
name: "11yad0w",
styles: "margin-bottom:revert"
} : 0;
const deprecatedMarginHelp = _ref3 => {
let {
__nextHasNoMarginBottom = false
} = _ref3;
return !__nextHasNoMarginBottom && base_control_styles_ref;
};
const StyledHelp = createStyled("p", true ? {
target: "ej5x27r1"
} : 0)("margin-top:", space(2), ";margin-bottom:0;font-size:", font('helpText.fontSize'), ";font-style:normal;color:", COLORS.gray[700], ";", deprecatedMarginHelp, ";" + ( true ? "" : 0));
const StyledVisualLabel = createStyled("span", true ? {
target: "ej5x27r0"
} : 0)(labelStyles, ";" + ( true ? "" : 0));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/index.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
/**
* `BaseControl` is a component used to generate labels and help text for components handling user inputs.
*
* ```jsx
* import { BaseControl, useBaseControlProps } from '@wordpress/components';
*
* // Render a `BaseControl` for a textarea input
* const MyCustomTextareaControl = ({ children, ...baseProps }) => (
* // `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`
* // and the inner control itself. Namely, it takes care of generating a unique `id`,
* // properly associating it with the `label` and `help` elements.
* const { baseControlProps, controlProps } = useBaseControlProps( baseProps );
*
* return (
*
*
* );
* );
* ```
*/
const BaseControl = _ref => {
let {
__nextHasNoMarginBottom = false,
id,
label,
hideLabelFromVision = false,
help,
className,
children
} = _ref;
return (0,external_wp_element_namespaceObject.createElement)(base_control_styles_Wrapper, {
className: classnames_default()('components-base-control', className)
}, (0,external_wp_element_namespaceObject.createElement)(StyledField, {
className: "components-base-control__field" // TODO: Official deprecation for this should start after all internal usages have been migrated
,
__nextHasNoMarginBottom: __nextHasNoMarginBottom
}, label && id && (hideLabelFromVision ? (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, {
as: "label",
htmlFor: id
}, label) : (0,external_wp_element_namespaceObject.createElement)(StyledLabel, {
className: "components-base-control__label",
htmlFor: id
}, label)), label && !id && (hideLabelFromVision ? (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, {
as: "label"
}, label) : (0,external_wp_element_namespaceObject.createElement)(BaseControl.VisualLabel, null, label)), children), !!help && (0,external_wp_element_namespaceObject.createElement)(StyledHelp, {
id: id ? id + '__help' : undefined,
className: "components-base-control__help",
__nextHasNoMarginBottom: __nextHasNoMarginBottom
}, help));
};
/**
* `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.
*
* It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,
* e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would
* otherwise use if the `label` prop was passed.
*
* @example
* import { BaseControl } from '@wordpress/components';
*
* const MyBaseControl = () => (
*
* Author
*
*
* );
*/
const VisualLabel = _ref2 => {
let {
className,
children,
...props
} = _ref2;
return (0,external_wp_element_namespaceObject.createElement)(StyledVisualLabel, extends_extends({}, props, {
className: classnames_default()('components-base-control__label', className)
}), children);
};
BaseControl.VisualLabel = VisualLabel;
/* harmony default export */ var base_control = (BaseControl);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const input_control_noop = () => {};
function input_control_useUniqueId(idProp) {
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(InputControl);
const id = `inspector-input-control-${instanceId}`;
return idProp || id;
}
function UnforwardedInputControl(_ref, ref) {
let {
__next36pxDefaultSize,
__unstableStateReducer: stateReducer = state => state,
__unstableInputWidth,
className,
disabled = false,
help,
hideLabelFromVision = false,
id: idProp,
isPressEnterToChange = false,
label,
labelPosition = 'top',
onChange = input_control_noop,
onValidate = input_control_noop,
onKeyDown = input_control_noop,
prefix,
size = 'default',
style,
suffix,
value,
...props
} = _ref;
const [isFocused, setIsFocused] = (0,external_wp_element_namespaceObject.useState)(false);
const id = input_control_useUniqueId(idProp);
const classes = classnames_default()('components-input-control', className);
const draftHookProps = useDraft({
value,
onBlur: props.onBlur,
onChange
}); // ARIA descriptions can only contain plain text, so fall back to aria-details if not.
const helpPropName = typeof help === 'string' ? 'aria-describedby' : 'aria-details';
const helpProp = !!help ? {
[helpPropName]: `${id}__help`
} : {};
return (0,external_wp_element_namespaceObject.createElement)(base_control, {
className: classes,
help: help,
id: id,
__nextHasNoMarginBottom: true
}, (0,external_wp_element_namespaceObject.createElement)(input_base, {
__next36pxDefaultSize: __next36pxDefaultSize,
__unstableInputWidth: __unstableInputWidth,
disabled: disabled,
gap: 3,
hideLabelFromVision: hideLabelFromVision,
id: id,
isFocused: isFocused,
justify: "left",
label: label,
labelPosition: labelPosition,
prefix: prefix,
size: size,
style: style,
suffix: suffix
}, (0,external_wp_element_namespaceObject.createElement)(input_field, extends_extends({}, props, helpProp, {
__next36pxDefaultSize: __next36pxDefaultSize,
className: "components-input-control__input",
disabled: disabled,
id: id,
isFocused: isFocused,
isPressEnterToChange: isPressEnterToChange,
onKeyDown: onKeyDown,
onValidate: onValidate,
paddingInlineStart: prefix ? space(2) : undefined,
paddingInlineEnd: suffix ? space(2) : undefined,
ref: ref,
setIsFocused: setIsFocused,
size: size,
stateReducer: stateReducer
}, draftHookProps))));
}
/**
* InputControl components let users enter and edit text. This is an experimental component
* intended to (in time) merge with or replace `TextControl`.
*
* ```jsx
* import { __experimentalInputControl as InputControl } from '@wordpress/components';
* import { useState } from '@wordpress/compose';
*
* const Example = () => {
* const [ value, setValue ] = useState( '' );
*
* return (
* setValue( nextValue ?? '' ) }
* />
* );
* };
* ```
*/
const InputControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedInputControl);
/* harmony default export */ var input_control = (InputControl);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/styles/number-control-styles.js
function number_control_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
var number_control_styles_ref = true ? {
name: "euqsgg",
styles: "input[type='number']::-webkit-outer-spin-button,input[type='number']::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important;}input[type='number']{-moz-appearance:textfield;}"
} : 0;
const htmlArrowStyles = _ref2 => {
let {
hideHTMLArrows
} = _ref2;
if (!hideHTMLArrows) {
return ``;
}
return number_control_styles_ref;
};
const number_control_styles_Input = /*#__PURE__*/createStyled(input_control, true ? {
target: "ep09it41"
} : 0)(htmlArrowStyles, ";" + ( true ? "" : 0));
const spinButtonSizeStyles = _ref3 => {
let {
size
} = _ref3;
if (size !== 'small') {
return ``;
}
return /*#__PURE__*/emotion_react_browser_esm_css("width:", space(5), ";min-width:", space(5), ";height:", space(5), ";" + ( true ? "" : 0), true ? "" : 0);
};
const SpinButton = /*#__PURE__*/createStyled(build_module_button, true ? {
target: "ep09it40"
} : 0)("&&&&&{color:", COLORS.ui.theme, ";", spinButtonSizeStyles, ";}" + ( true ? "" : 0));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/math.js
/**
* Parses and retrieves a number value.
*
* @param {unknown} value The incoming value.
*
* @return {number} The parsed number value.
*/
function getNumber(value) {
const number = Number(value);
return isNaN(number) ? 0 : number;
}
/**
* Safely adds 2 values.
*
* @param {Array} args Values to add together.
*
* @return {number} The sum of values.
*/
function add() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return args.reduce(
/** @type {(sum:number, arg: number|string) => number} */
(sum, arg) => sum + getNumber(arg), 0);
}
/**
* Safely subtracts 2 values.
*
* @param {Array} args Values to subtract together.
*
* @return {number} The difference of the values.
*/
function subtract() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return args.reduce(
/** @type {(diff:number, arg: number|string, index:number) => number} */
(diff, arg, index) => {
const value = getNumber(arg);
return index === 0 ? value : diff - value;
}, 0);
}
/**
* Determines the decimal position of a number value.
*
* @param {number} value The number to evaluate.
*
* @return {number} The number of decimal places.
*/
function getPrecision(value) {
const split = (value + '').split('.');
return split[1] !== undefined ? split[1].length : 0;
}
/**
* Clamps a value based on a min/max range.
*
* @param {number} value The value.
* @param {number} min The minimum range.
* @param {number} max The maximum range.
*
* @return {number} The clamped value.
*/
function math_clamp(value, min, max) {
const baseValue = getNumber(value);
return Math.max(min, Math.min(baseValue, max));
}
/**
* Clamps a value based on a min/max range with rounding
*
* @param {number | string} value The value.
* @param {number} min The minimum range.
* @param {number} max The maximum range.
* @param {number} step A multiplier for the value.
*
* @return {number} The rounded and clamped value.
*/
function roundClamp() {
let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
let min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Infinity;
let max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Infinity;
let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
const baseValue = getNumber(value);
const stepValue = getNumber(step);
const precision = getPrecision(step);
const rounded = Math.round(baseValue / stepValue) * stepValue;
const clampedValue = math_clamp(rounded, min, max);
return precision ? getNumber(clampedValue.toFixed(precision)) : clampedValue;
}
/**
* Clamps a value based on a min/max range with rounding.
* Returns a string.
*
* @param {Parameters} args Arguments for roundClamp().
* @return {string} The rounded and clamped value.
*/
function roundClampString() {
return roundClamp(...arguments).toString();
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/utils.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const H_ALIGNMENTS = {
bottom: {
align: 'flex-end',
justify: 'center'
},
bottomLeft: {
align: 'flex-start',
justify: 'flex-end'
},
bottomRight: {
align: 'flex-end',
justify: 'flex-end'
},
center: {
align: 'center',
justify: 'center'
},
edge: {
align: 'center',
justify: 'space-between'
},
left: {
align: 'center',
justify: 'flex-start'
},
right: {
align: 'center',
justify: 'flex-end'
},
stretch: {
align: 'stretch'
},
top: {
align: 'flex-start',
justify: 'center'
},
topLeft: {
align: 'flex-start',
justify: 'flex-start'
},
topRight: {
align: 'flex-start',
justify: 'flex-end'
}
};
const V_ALIGNMENTS = {
bottom: {
justify: 'flex-end',
align: 'center'
},
bottomLeft: {
justify: 'flex-start',
align: 'flex-end'
},
bottomRight: {
justify: 'flex-end',
align: 'flex-end'
},
center: {
justify: 'center',
align: 'center'
},
edge: {
justify: 'space-between',
align: 'center'
},
left: {
justify: 'center',
align: 'flex-start'
},
right: {
justify: 'center',
align: 'flex-end'
},
stretch: {
justify: 'stretch'
},
top: {
justify: 'flex-start',
align: 'center'
},
topLeft: {
justify: 'flex-start',
align: 'flex-start'
},
topRight: {
justify: 'flex-start',
align: 'flex-end'
}
};
function getAlignmentProps(alignment) {
let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'row';
if (!isValueDefined(alignment)) {
return {};
}
const isVertical = direction === 'column';
const props = isVertical ? V_ALIGNMENTS : H_ALIGNMENTS;
const alignmentProps = alignment in props ? props[alignment] : {
align: alignment
};
return alignmentProps;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/ui/utils/get-valid-children.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Gets a collection of available children elements from a React component's children prop.
*
* @param children
*
* @return An array of available children.
*/
function getValidChildren(children) {
if (typeof children === 'string') return [children];
return external_wp_element_namespaceObject.Children.toArray(children).filter(child => (0,external_wp_element_namespaceObject.isValidElement)(child));
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/hook.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function useHStack(props) {
const {
alignment = 'edge',
children,
direction,
spacing = 2,
...otherProps
} = useContextSystem(props, 'HStack');
const align = getAlignmentProps(alignment, direction);
const validChildren = getValidChildren(children);
const clonedChildren = validChildren.map((child, index) => {
const _isSpacer = hasConnectNamespace(child, ['Spacer']);
if (_isSpacer) {
const childElement = child;
const _key = childElement.key || `hstack-${index}`;
return (0,external_wp_element_namespaceObject.createElement)(flex_item_component, extends_extends({
isBlock: true,
key: _key
}, childElement.props));
}
return child;
});
const propsForFlex = {
children: clonedChildren,
direction,
justify: 'center',
...align,
...otherProps,
gap: spacing
};
const flexProps = useFlex(propsForFlex);
return flexProps;
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/component.js
/**
* Internal dependencies
*/
function UnconnectedHStack(props, forwardedRef) {
const hStackProps = useHStack(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, hStackProps, {
ref: forwardedRef
}));
}
/**
* `HStack` (Horizontal Stack) arranges child elements in a horizontal line.
*
* `HStack` can render anything inside.
*
* ```jsx
* import {
* __experimentalHStack as HStack,
* __experimentalText as Text,
* } from `@wordpress/components`;
*
* function Example() {
* return (
*
* Code
* is
* Poetry
*
* );
* }
* ```
*/
const HStack = contextConnect(UnconnectedHStack, 'HStack');
/* harmony default export */ var h_stack_component = (HStack);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/hook.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const isDefined = o => typeof o !== 'undefined' && o !== null;
function useSpacer(props) {
const {
className,
margin,
marginBottom = 2,
marginLeft,
marginRight,
marginTop,
marginX,
marginY,
padding,
paddingBottom,
paddingLeft,
paddingRight,
paddingTop,
paddingX,
paddingY,
...otherProps
} = useContextSystem(props, 'Spacer');
const cx = useCx();
const classes = cx(isDefined(margin) && /*#__PURE__*/emotion_react_browser_esm_css("margin:", space(margin), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(marginY) && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(marginY), ";margin-top:", space(marginY), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(marginX) && /*#__PURE__*/emotion_react_browser_esm_css("margin-left:", space(marginX), ";margin-right:", space(marginX), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(marginTop) && /*#__PURE__*/emotion_react_browser_esm_css("margin-top:", space(marginTop), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(marginBottom) && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(marginBottom), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(marginLeft) && rtl({
marginLeft: space(marginLeft)
})(), isDefined(marginRight) && rtl({
marginRight: space(marginRight)
})(), isDefined(padding) && /*#__PURE__*/emotion_react_browser_esm_css("padding:", space(padding), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(paddingY) && /*#__PURE__*/emotion_react_browser_esm_css("padding-bottom:", space(paddingY), ";padding-top:", space(paddingY), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(paddingX) && /*#__PURE__*/emotion_react_browser_esm_css("padding-left:", space(paddingX), ";padding-right:", space(paddingX), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(paddingTop) && /*#__PURE__*/emotion_react_browser_esm_css("padding-top:", space(paddingTop), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(paddingBottom) && /*#__PURE__*/emotion_react_browser_esm_css("padding-bottom:", space(paddingBottom), ";" + ( true ? "" : 0), true ? "" : 0), isDefined(paddingLeft) && rtl({
paddingLeft: space(paddingLeft)
})(), isDefined(paddingRight) && rtl({
paddingRight: space(paddingRight)
})(), className);
return { ...otherProps,
className: classes
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/component.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedSpacer(props, forwardedRef) {
const spacerProps = useSpacer(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, spacerProps, {
ref: forwardedRef
}));
}
/**
* `Spacer` is a primitive layout component that providers inner (`padding`) or outer (`margin`) space in-between components. It can also be used to adaptively provide space within an `HStack` or `VStack`.
*
* `Spacer` comes with a bunch of shorthand props to adjust `margin` and `padding`. The values of these props
* can either be a number (which will act as a multiplier to the library's grid system base of 4px),
* or a literal CSS value string.
*
* ```jsx
* import { Spacer } from `@wordpress/components`
*
* function Example() {
* return (
*
*
* WordPress.org
*
*
* Code is Poetry
*
*
* );
* }
* ```
*/
const Spacer = contextConnect(UnconnectedSpacer, 'Spacer');
/* harmony default export */ var spacer_component = (Spacer);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const number_control_noop = () => {};
function UnforwardedNumberControl(_ref, forwardedRef) {
let {
__unstableStateReducer: stateReducerProp,
className,
dragDirection = 'n',
hideHTMLArrows = false,
spinControls = 'native',
isDragEnabled = true,
isShiftStepEnabled = true,
label,
max = Infinity,
min = -Infinity,
required = false,
shiftStep = 10,
step = 1,
type: typeProp = 'number',
value: valueProp,
size = 'default',
suffix,
onChange = number_control_noop,
...props
} = _ref;
if (hideHTMLArrows) {
external_wp_deprecated_default()('wp.components.NumberControl hideHTMLArrows prop ', {
alternative: 'spinControls="none"',
since: '6.2',
version: '6.3'
});
spinControls = 'none';
}
const inputRef = (0,external_wp_element_namespaceObject.useRef)();
const mergedRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([inputRef, forwardedRef]);
const isStepAny = step === 'any';
const baseStep = isStepAny ? 1 : ensureNumber(step);
const baseValue = roundClamp(0, min, max, baseStep);
const constrainValue = (value, stepOverride) => {
// When step is "any" clamp the value, otherwise round and clamp it.
return isStepAny ? Math.min(max, Math.max(min, ensureNumber(value))) : roundClamp(value, min, max, stepOverride !== null && stepOverride !== void 0 ? stepOverride : baseStep);
};
const autoComplete = typeProp === 'number' ? 'off' : undefined;
const classes = classnames_default()('components-number-control', className);
const spinValue = (value, direction, event) => {
event === null || event === void 0 ? void 0 : event.preventDefault();
const shift = (event === null || event === void 0 ? void 0 : event.shiftKey) && isShiftStepEnabled;
const delta = shift ? ensureNumber(shiftStep) * baseStep : baseStep;
let nextValue = isValueEmpty(value) ? baseValue : value;
if (direction === 'up') {
nextValue = add(nextValue, delta);
} else if (direction === 'down') {
nextValue = subtract(nextValue, delta);
}
return constrainValue(nextValue, shift ? delta : undefined);
};
/**
* "Middleware" function that intercepts updates from InputControl.
* This allows us to tap into actions to transform the (next) state for
* InputControl.
*
* @return The updated state to apply to InputControl
*/
const numberControlStateReducer = (state, action) => {
const nextState = { ...state
};
const {
type,
payload
} = action;
const event = payload.event;
const currentValue = nextState.value;
/**
* Handles custom UP and DOWN Keyboard events
*/
if (type === PRESS_UP || type === PRESS_DOWN) {
// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
nextState.value = spinValue(currentValue, type === PRESS_UP ? 'up' : 'down', event);
}
/**
* Handles drag to update events
*/
if (type === DRAG && isDragEnabled) {
// @ts-expect-error TODO: See if reducer actions can be typed better
const [x, y] = payload.delta; // @ts-expect-error TODO: See if reducer actions can be typed better
const enableShift = payload.shiftKey && isShiftStepEnabled;
const modifier = enableShift ? ensureNumber(shiftStep) * baseStep : baseStep;
let directionModifier;
let delta;
switch (dragDirection) {
case 'n':
delta = y;
directionModifier = -1;
break;
case 'e':
delta = x;
directionModifier = (0,external_wp_i18n_namespaceObject.isRTL)() ? -1 : 1;
break;
case 's':
delta = y;
directionModifier = 1;
break;
case 'w':
delta = x;
directionModifier = (0,external_wp_i18n_namespaceObject.isRTL)() ? 1 : -1;
break;
}
if (delta !== 0) {
delta = Math.ceil(Math.abs(delta)) * Math.sign(delta);
const distance = delta * modifier * directionModifier; // @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
nextState.value = constrainValue( // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
add(currentValue, distance), enableShift ? modifier : undefined);
}
}
/**
* Handles commit (ENTER key press or blur)
*/
if (type === PRESS_ENTER || type === COMMIT) {
const applyEmptyValue = required === false && currentValue === ''; // @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
nextState.value = applyEmptyValue ? currentValue : // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
constrainValue(currentValue);
}
return nextState;
};
const buildSpinButtonClickHandler = direction => event => onChange(String(spinValue(valueProp, direction, event)), {
// Set event.target to the so that consumers can use
// e.g. event.target.validity.
event: { ...event,
target: inputRef.current
}
});
return (0,external_wp_element_namespaceObject.createElement)(number_control_styles_Input, extends_extends({
autoComplete: autoComplete,
inputMode: "numeric"
}, props, {
className: classes,
dragDirection: dragDirection,
hideHTMLArrows: spinControls !== 'native',
isDragEnabled: isDragEnabled,
label: label,
max: max,
min: min,
ref: mergedRef,
required: required,
step: step,
type: typeProp // @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
,
value: valueProp,
__unstableStateReducer: (state, action) => {
var _stateReducerProp;
const baseState = numberControlStateReducer(state, action);
return (_stateReducerProp = stateReducerProp === null || stateReducerProp === void 0 ? void 0 : stateReducerProp(baseState, action)) !== null && _stateReducerProp !== void 0 ? _stateReducerProp : baseState;
},
size: size,
suffix: spinControls === 'custom' ? (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, suffix, (0,external_wp_element_namespaceObject.createElement)(spacer_component, {
marginBottom: 0,
marginRight: 2
}, (0,external_wp_element_namespaceObject.createElement)(h_stack_component, {
spacing: 1
}, (0,external_wp_element_namespaceObject.createElement)(SpinButton, {
icon: library_plus,
isSmall: true,
"aria-hidden": "true",
"aria-label": (0,external_wp_i18n_namespaceObject.__)('Increment'),
tabIndex: -1,
onClick: buildSpinButtonClickHandler('up'),
size: size
}), (0,external_wp_element_namespaceObject.createElement)(SpinButton, {
icon: library_reset,
isSmall: true,
"aria-hidden": "true",
"aria-label": (0,external_wp_i18n_namespaceObject.__)('Decrement'),
tabIndex: -1,
onClick: buildSpinButtonClickHandler('down'),
size: size
})))) : suffix,
onChange: onChange
}));
}
const NumberControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNumberControl);
/* harmony default export */ var number_control = (NumberControl);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/styles/angle-picker-control-styles.js
function angle_picker_control_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const CIRCLE_SIZE = 32;
const INNER_CIRCLE_SIZE = 3;
const deprecatedBottomMargin = _ref => {
let {
__nextHasNoMarginBottom
} = _ref;
return !__nextHasNoMarginBottom ? /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(2), ";" + ( true ? "" : 0), true ? "" : 0) : '';
};
const angle_picker_control_styles_Root = /*#__PURE__*/createStyled(flex_component, true ? {
target: "e65ony43"
} : 0)(deprecatedBottomMargin, ";" + ( true ? "" : 0));
const CircleRoot = createStyled("div", true ? {
target: "e65ony42"
} : 0)("border-radius:50%;border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";box-sizing:border-box;cursor:grab;height:", CIRCLE_SIZE, "px;overflow:hidden;width:", CIRCLE_SIZE, "px;" + ( true ? "" : 0));
const CircleIndicatorWrapper = createStyled("div", true ? {
target: "e65ony41"
} : 0)( true ? {
name: "1r307gh",
styles: "box-sizing:border-box;position:relative;width:100%;height:100%;:focus-visible{outline:none;}"
} : 0);
const CircleIndicator = createStyled("div", true ? {
target: "e65ony40"
} : 0)("background:", COLORS.ui.theme, ";border-radius:50%;border:", INNER_CIRCLE_SIZE, "px solid ", COLORS.ui.theme, ";bottom:0;box-sizing:border-box;display:block;height:0px;left:0;margin:auto;position:absolute;right:0;top:-", CIRCLE_SIZE / 2, "px;width:0px;" + ( true ? "" : 0));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/angle-circle.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function AngleCircle(_ref) {
let {
value,
onChange,
...props
} = _ref;
const angleCircleRef = (0,external_wp_element_namespaceObject.useRef)();
const angleCircleCenter = (0,external_wp_element_namespaceObject.useRef)();
const previousCursorValue = (0,external_wp_element_namespaceObject.useRef)();
const setAngleCircleCenter = () => {
const rect = angleCircleRef.current.getBoundingClientRect();
angleCircleCenter.current = {
x: rect.x + rect.width / 2,
y: rect.y + rect.height / 2
};
};
const changeAngleToPosition = event => {
const {
x: centerX,
y: centerY
} = angleCircleCenter.current; // Prevent (drag) mouse events from selecting and accidentally
// triggering actions from other elements.
event.preventDefault(); // Input control needs to lose focus and by preventDefault above, it doesn't.
event.target.focus();
onChange(getAngle(centerX, centerY, event.clientX, event.clientY));
};
const {
startDrag,
isDragging
} = (0,external_wp_compose_namespaceObject.__experimentalUseDragging)({
onDragStart: event => {
setAngleCircleCenter();
changeAngleToPosition(event);
},
onDragMove: changeAngleToPosition,
onDragEnd: changeAngleToPosition
});
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (isDragging) {
if (previousCursorValue.current === undefined) {
previousCursorValue.current = document.body.style.cursor;
}
document.body.style.cursor = 'grabbing';
} else {
document.body.style.cursor = previousCursorValue.current || null;
previousCursorValue.current = undefined;
}
}, [isDragging]);
return (
/* eslint-disable jsx-a11y/no-static-element-interactions */
(0,external_wp_element_namespaceObject.createElement)(CircleRoot, extends_extends({
ref: angleCircleRef,
onMouseDown: startDrag,
className: "components-angle-picker-control__angle-circle",
style: isDragging ? {
cursor: 'grabbing'
} : undefined
}, props), (0,external_wp_element_namespaceObject.createElement)(CircleIndicatorWrapper, {
style: value ? {
transform: `rotate(${value}deg)`
} : undefined,
className: "components-angle-picker-control__angle-circle-indicator-wrapper",
tabIndex: -1
}, (0,external_wp_element_namespaceObject.createElement)(CircleIndicator, {
className: "components-angle-picker-control__angle-circle-indicator"
})))
/* eslint-enable jsx-a11y/no-static-element-interactions */
);
}
function getAngle(centerX, centerY, pointX, pointY) {
const y = pointY - centerY;
const x = pointX - centerX;
const angleInRadians = Math.atan2(y, x);
const angleInDeg = Math.round(angleInRadians * (180 / Math.PI)) + 90;
if (angleInDeg < 0) {
return 360 + angleInDeg;
}
return angleInDeg;
}
/* harmony default export */ var angle_circle = (AngleCircle);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function AnglePickerControl(_ref) {
let {
/** Start opting into the new margin-free styles that will become the default in a future version. */
__nextHasNoMarginBottom = false,
className,
label = (0,external_wp_i18n_namespaceObject.__)('Angle'),
onChange,
value
} = _ref;
if (!__nextHasNoMarginBottom) {
external_wp_deprecated_default()('Bottom margin styles for wp.components.AnglePickerControl', {
since: '6.1',
version: '6.4',
hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.'
});
}
const handleOnNumberChange = unprocessedValue => {
const inputValue = unprocessedValue !== '' ? parseInt(unprocessedValue, 10) : 0;
onChange(inputValue);
};
const classes = classnames_default()('components-angle-picker-control', className);
return (0,external_wp_element_namespaceObject.createElement)(angle_picker_control_styles_Root, {
__nextHasNoMarginBottom: __nextHasNoMarginBottom,
className: classes,
gap: 4
}, (0,external_wp_element_namespaceObject.createElement)(flex_block_component, null, (0,external_wp_element_namespaceObject.createElement)(number_control, {
label: label,
className: "components-angle-picker-control__input-field",
max: 360,
min: 0,
onChange: handleOnNumberChange,
size: "__unstable-large",
step: "1",
value: value,
spinControls: "none",
suffix: (0,external_wp_element_namespaceObject.createElement)(spacer_component, {
as: text_component,
marginBottom: 0,
marginRight: space(3),
style: {
color: COLORS.ui.theme
}
}, "\xB0")
})), (0,external_wp_element_namespaceObject.createElement)(flex_item_component, {
style: {
marginBottom: space(1),
marginTop: 'auto'
}
}, (0,external_wp_element_namespaceObject.createElement)(angle_circle, {
"aria-hidden": "true",
value: value,
onChange: onChange
})));
}
// EXTERNAL MODULE: ./node_modules/remove-accents/index.js
var remove_accents = __webpack_require__(4793);
var remove_accents_default = /*#__PURE__*/__webpack_require__.n(remove_accents);
;// CONCATENATED MODULE: external ["wp","richText"]
var external_wp_richText_namespaceObject = window["wp"]["richText"];
;// CONCATENATED MODULE: external ["wp","a11y"]
var external_wp_a11y_namespaceObject = window["wp"]["a11y"];
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/strings.js
/**
* External dependencies
*/
const ALL_UNICODE_DASH_CHARACTERS = new RegExp(`[${[// - (hyphen-minus)
'\u002d', // ~ (tilde)
'\u007e', // (soft hyphen)
'\u00ad', // ֊ (armenian hyphen)
'\u058a', // ־ (hebrew punctuation maqaf)
'\u05be', // ᐀ (canadian syllabics hyphen)
'\u1400', // ᠆ (mongolian todo soft hyphen)
'\u1806', // ‐ (hyphen)
'\u2010', // non-breaking hyphen)
'\u2011', // ‒ (figure dash)
'\u2012', // – (en dash)
'\u2013', // — (em dash)
'\u2014', // ― (horizontal bar)
'\u2015', // ⁓ (swung dash)
'\u2053', // superscript minus)
'\u207b', // subscript minus)
'\u208b', // − (minus sign)
'\u2212', // ⸗ (double oblique hyphen)
'\u2e17', // ⸺ (two-em dash)
'\u2e3a', // ⸻ (three-em dash)
'\u2e3b', // 〜 (wave dash)
'\u301c', // 〰 (wavy dash)
'\u3030', // ゠ (katakana-hiragana double hyphen)
'\u30a0', // ︱ (presentation form for vertical em dash)
'\ufe31', // ︲ (presentation form for vertical en dash)
'\ufe32', // ﹘ (small em dash)
'\ufe58', // ﹣ (small hyphen-minus)
'\ufe63', // - (fullwidth hyphen-minus)
'\uff0d'].join('')}]`, 'g');
const normalizeTextString = value => {
return remove_accents_default()(value).toLocaleLowerCase().replace(ALL_UNICODE_DASH_CHARACTERS, '-');
};
/**
* Escapes the RegExp special characters.
*
* @param {string} string Input string.
*
* @return {string} Regex-escaped string.
*/
function escapeRegExp(string) {
return string.replace(/[\\^$.*+?()[\]{}|]/g, '\\$&');
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/get-default-use-items.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function filterOptions(search) {
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
let maxResults = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 10;
const filtered = [];
for (let i = 0; i < options.length; i++) {
const option = options[i]; // Merge label into keywords.
let {
keywords = []
} = option;
if ('string' === typeof option.label) {
keywords = [...keywords, option.label];
}
const isMatch = keywords.some(keyword => search.test(remove_accents_default()(keyword)));
if (!isMatch) {
continue;
}
filtered.push(option); // Abort early if max reached.
if (filtered.length === maxResults) {
break;
}
}
return filtered;
}
function getDefaultUseItems(autocompleter) {
return filterValue => {
const [items, setItems] = (0,external_wp_element_namespaceObject.useState)([]);
/*
* We support both synchronous and asynchronous retrieval of completer options
* but internally treat all as async so we maintain a single, consistent code path.
*
* Because networks can be slow, and the internet is wonderfully unpredictable,
* we don't want two promises updating the state at once. This ensures that only
* the most recent promise will act on `optionsData`. This doesn't use the state
* because `setState` is batched, and so there's no guarantee that setting
* `activePromise` in the state would result in it actually being in `this.state`
* before the promise resolves and we check to see if this is the active promise or not.
*/
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
const {
options,
isDebounced
} = autocompleter;
const loadOptions = (0,external_wp_compose_namespaceObject.debounce)(() => {
const promise = Promise.resolve(typeof options === 'function' ? options(filterValue) : options).then(optionsData => {
if (promise.canceled) {
return;
}
const keyedOptions = optionsData.map((optionData, optionIndex) => ({
key: `${autocompleter.name}-${optionIndex}`,
value: optionData,
label: autocompleter.getOptionLabel(optionData),
keywords: autocompleter.getOptionKeywords ? autocompleter.getOptionKeywords(optionData) : [],
isDisabled: autocompleter.isOptionDisabled ? autocompleter.isOptionDisabled(optionData) : false
})); // Create a regular expression to filter the options.
const search = new RegExp('(?:\\b|\\s|^)' + escapeRegExp(filterValue), 'i');
setItems(filterOptions(search, keyedOptions));
});
return promise;
}, isDebounced ? 250 : 0);
const promise = loadOptions();
return () => {
loadOptions.cancel();
if (promise) {
promise.canceled = true;
}
};
}, [filterValue]);
return [items];
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/autocompleter-ui.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function getAutoCompleterUI(autocompleter) {
const useItems = autocompleter.useItems ? autocompleter.useItems : getDefaultUseItems(autocompleter);
function AutocompleterUI(_ref) {
let {
filterValue,
instanceId,
listBoxId,
className,
selectedIndex,
onChangeOptions,
onSelect,
onReset,
reset,
value,
contentRef
} = _ref;
const [items] = useItems(filterValue);
const popoverAnchor = (0,external_wp_richText_namespaceObject.useAnchor)({
editableContentElement: contentRef.current,
value
});
const popoverRef = (0,external_wp_element_namespaceObject.useRef)();
useOnClickOutside(popoverRef, reset);
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
onChangeOptions(items); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
// See https://github.com/WordPress/gutenberg/pull/41820
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [items]);
if (!items.length > 0) {
return null;
}
return (0,external_wp_element_namespaceObject.createElement)(popover, {
focusOnMount: false,
onClose: onReset,
placement: "top-start",
className: "components-autocomplete__popover",
anchor: popoverAnchor,
ref: popoverRef
}, (0,external_wp_element_namespaceObject.createElement)("div", {
id: listBoxId,
role: "listbox",
className: "components-autocomplete__results"
}, items.map((option, index) => (0,external_wp_element_namespaceObject.createElement)(build_module_button, {
key: option.key,
id: `components-autocomplete-item-${instanceId}-${option.key}`,
role: "option",
"aria-selected": index === selectedIndex,
disabled: option.isDisabled,
className: classnames_default()('components-autocomplete__result', className, {
'is-selected': index === selectedIndex
}),
onClick: () => onSelect(option)
}, option.label))));
}
return AutocompleterUI;
}
function useOnClickOutside(ref, handler) {
(0,external_wp_element_namespaceObject.useEffect)(() => {
const listener = event => {
// Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element
if (!ref.current || ref.current.contains(event.target)) {
return;
}
handler(event);
};
document.addEventListener('mousedown', listener);
document.addEventListener('touchstart', listener);
return () => {
document.removeEventListener('mousedown', listener);
document.removeEventListener('touchstart', listener);
}; // Disable reason: `ref` is a ref object and should not be included in a
// hook's dependency list.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [handler]);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* A raw completer option.
*
* @typedef {*} CompleterOption
*/
/**
* @callback FnGetOptions
*
* @return {(CompleterOption[]|Promise.)} The completer options or a promise for them.
*/
/**
* @callback FnGetOptionKeywords
* @param {CompleterOption} option a completer option.
*
* @return {string[]} list of key words to search.
*/
/**
* @callback FnIsOptionDisabled
* @param {CompleterOption} option a completer option.
*
* @return {string[]} whether or not the given option is disabled.
*/
/**
* @callback FnGetOptionLabel
* @param {CompleterOption} option a completer option.
*
* @return {(string|Array.<(string|WPElement)>)} list of react components to render.
*/
/**
* @callback FnAllowContext
* @param {string} before the string before the auto complete trigger and query.
* @param {string} after the string after the autocomplete trigger and query.
*
* @return {boolean} true if the completer can handle.
*/
/**
* @typedef {Object} OptionCompletion
* @property {'insert-at-caret'|'replace'} action the intended placement of the completion.
* @property {OptionCompletionValue} value the completion value.
*/
/**
* A completion value.
*
* @typedef {(string|WPElement|Object)} OptionCompletionValue
*/
/**
* @callback FnGetOptionCompletion
* @param {CompleterOption} value the value of the completer option.
* @param {string} query the text value of the autocomplete query.
*
* @return {(OptionCompletion|OptionCompletionValue)} the completion for the given option. If an
* OptionCompletionValue is returned, the
* completion action defaults to `insert-at-caret`.
*/
/**
* @typedef {Object} WPCompleter
* @property {string} name a way to identify a completer, useful for selective overriding.
* @property {?string} className A class to apply to the popup menu.
* @property {string} triggerPrefix the prefix that will display the menu.
* @property {(CompleterOption[]|FnGetOptions)} options the completer options or a function to get them.
* @property {?FnGetOptionKeywords} getOptionKeywords get the keywords for a given option.
* @property {?FnIsOptionDisabled} isOptionDisabled get whether or not the given option is disabled.
* @property {FnGetOptionLabel} getOptionLabel get the label for a given option.
* @property {?FnAllowContext} allowContext filter the context under which the autocomplete activates.
* @property {FnGetOptionCompletion} getOptionCompletion get the completion associated with a given option.
*/
function useAutocomplete(_ref) {
let {
record,
onChange,
onReplace,
completers,
contentRef
} = _ref;
const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500);
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(useAutocomplete);
const [selectedIndex, setSelectedIndex] = (0,external_wp_element_namespaceObject.useState)(0);
const [filteredOptions, setFilteredOptions] = (0,external_wp_element_namespaceObject.useState)([]);
const [filterValue, setFilterValue] = (0,external_wp_element_namespaceObject.useState)('');
const [autocompleter, setAutocompleter] = (0,external_wp_element_namespaceObject.useState)(null);
const [AutocompleterUI, setAutocompleterUI] = (0,external_wp_element_namespaceObject.useState)(null);
const backspacing = (0,external_wp_element_namespaceObject.useRef)(false);
function insertCompletion(replacement) {
const end = record.start;
const start = end - autocompleter.triggerPrefix.length - filterValue.length;
const toInsert = (0,external_wp_richText_namespaceObject.create)({
html: (0,external_wp_element_namespaceObject.renderToString)(replacement)
});
onChange((0,external_wp_richText_namespaceObject.insert)(record, toInsert, start, end));
}
function select(option) {
const {
getOptionCompletion
} = autocompleter || {};
if (option.isDisabled) {
return;
}
if (getOptionCompletion) {
const completion = getOptionCompletion(option.value, filterValue);
const {
action,
value
} = undefined === completion.action || undefined === completion.value ? {
action: 'insert-at-caret',
value: completion
} : completion;
if ('replace' === action) {
onReplace([value]); // When replacing, the component will unmount, so don't reset
// state (below) on an unmounted component.
return;
} else if ('insert-at-caret' === action) {
insertCompletion(value);
}
} // Reset autocomplete state after insertion rather than before
// so insertion events don't cause the completion menu to redisplay.
reset();
}
function reset() {
setSelectedIndex(0);
setFilteredOptions([]);
setFilterValue('');
setAutocompleter(null);
setAutocompleterUI(null);
}
function announce(options) {
if (!debouncedSpeak) {
return;
}
if (!!options.length) {
debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)(
/* translators: %d: number of results. */
(0,external_wp_i18n_namespaceObject._n)('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', options.length), options.length), 'assertive');
} else {
debouncedSpeak((0,external_wp_i18n_namespaceObject.__)('No results.'), 'assertive');
}
}
/**
* Load options for an autocompleter.
*
* @param {Array} options
*/
function onChangeOptions(options) {
setSelectedIndex(options.length === filteredOptions.length ? selectedIndex : 0);
setFilteredOptions(options);
announce(options);
}
function handleKeyDown(event) {
backspacing.current = event.key === 'Backspace';
if (!autocompleter) {
return;
}
if (filteredOptions.length === 0) {
return;
}
if (event.defaultPrevented || // Ignore keydowns from IMEs
event.isComposing || // Workaround for Mac Safari where the final Enter/Backspace of an IME composition
// is `isComposing=false`, even though it's technically still part of the composition.
// These can only be detected by keyCode.
event.keyCode === 229) {
return;
}
switch (event.key) {
case 'ArrowUp':
setSelectedIndex((selectedIndex === 0 ? filteredOptions.length : selectedIndex) - 1);
break;
case 'ArrowDown':
setSelectedIndex((selectedIndex + 1) % filteredOptions.length);
break;
case 'Escape':
setAutocompleter(null);
setAutocompleterUI(null);
event.preventDefault();
break;
case 'Enter':
select(filteredOptions[selectedIndex]);
break;
case 'ArrowLeft':
case 'ArrowRight':
reset();
return;
default:
return;
} // Any handled key should prevent original behavior. This relies on
// the early return in the default case.
event.preventDefault();
} // textContent is a primitive (string), memoizing is not strictly necessary
// but this is a preemptive performance improvement, since the autocompleter
// is a potential bottleneck for the editor type metric.
const textContent = (0,external_wp_element_namespaceObject.useMemo)(() => {
if ((0,external_wp_richText_namespaceObject.isCollapsed)(record)) {
return (0,external_wp_richText_namespaceObject.getTextContent)((0,external_wp_richText_namespaceObject.slice)(record, 0));
}
}, [record]);
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (!textContent) {
reset();
return;
}
const text = remove_accents_default()(textContent);
const textAfterSelection = (0,external_wp_richText_namespaceObject.getTextContent)((0,external_wp_richText_namespaceObject.slice)(record, undefined, (0,external_wp_richText_namespaceObject.getTextContent)(record).length));
const completer = completers === null || completers === void 0 ? void 0 : completers.find(_ref2 => {
let {
triggerPrefix,
allowContext
} = _ref2;
const index = text.lastIndexOf(triggerPrefix);
if (index === -1) {
return false;
}
const textWithoutTrigger = text.slice(index + triggerPrefix.length);
const tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.
// This is a final barrier to prevent the effect from completing with
// an extremely long string, which causes the editor to slow-down
// significantly. This could happen, for example, if `matchingWhileBackspacing`
// is true and one of the "words" end up being too long. If that's the case,
// it will be caught by this guard.
if (tooDistantFromTrigger) return false;
const mismatch = filteredOptions.length === 0;
const wordsFromTrigger = textWithoutTrigger.split(/\s/); // We need to allow the effect to run when not backspacing and if there
// was a mismatch. i.e when typing a trigger + the match string or when
// clicking in an existing trigger word on the page. We do that if we
// detect that we have one word from trigger in the current textual context.
//
// Ex.: "Some text @a" <-- "@a" will be detected as the trigger word and
// allow the effect to run. It will run until there's a mismatch.
const hasOneTriggerWord = wordsFromTrigger.length === 1; // This is used to allow the effect to run when backspacing and if
// "touching" a word that "belongs" to a trigger. We consider a "trigger
// word" any word up to the limit of 3 from the trigger character.
// Anything beyond that is ignored if there's a mismatch. This allows
// us to "escape" a mismatch when backspacing, but still imposing some
// sane limits.
//
// Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but
// if the user presses backspace here, it will show the completion popup again.
const matchingWhileBackspacing = backspacing.current && textWithoutTrigger.split(/\s/).length <= 3;
if (mismatch && !(matchingWhileBackspacing || hasOneTriggerWord)) {
return false;
}
if (allowContext && !allowContext(text.slice(0, index), textAfterSelection)) {
return false;
}
if (/^\s/.test(textWithoutTrigger) || /\s\s+$/.test(textWithoutTrigger)) {
return false;
}
return /[\u0000-\uFFFF]*$/.test(textWithoutTrigger);
});
if (!completer) {
reset();
return;
}
const safeTrigger = escapeRegExp(completer.triggerPrefix);
const match = text.slice(text.lastIndexOf(completer.triggerPrefix)).match(new RegExp(`${safeTrigger}([\u0000-\uFFFF]*)$`));
const query = match && match[1];
setAutocompleter(completer);
setAutocompleterUI(() => completer !== autocompleter ? getAutoCompleterUI(completer) : AutocompleterUI);
setFilterValue(query); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
// See https://github.com/WordPress/gutenberg/pull/41820
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [textContent]);
const {
key: selectedKey = ''
} = filteredOptions[selectedIndex] || {};
const {
className
} = autocompleter || {};
const isExpanded = !!autocompleter && filteredOptions.length > 0;
const listBoxId = isExpanded ? `components-autocomplete-listbox-${instanceId}` : null;
const activeId = isExpanded ? `components-autocomplete-item-${instanceId}-${selectedKey}` : null;
const hasSelection = record.start !== undefined;
return {
listBoxId,
activeId,
onKeyDown: handleKeyDown,
popover: hasSelection && AutocompleterUI && (0,external_wp_element_namespaceObject.createElement)(AutocompleterUI, {
className: className,
filterValue: filterValue,
instanceId: instanceId,
listBoxId: listBoxId,
selectedIndex: selectedIndex,
onChangeOptions: onChangeOptions,
onSelect: select,
value: record,
contentRef: contentRef,
reset: reset
})
};
}
function useAutocompleteProps(options) {
const [isVisible, setIsVisible] = (0,external_wp_element_namespaceObject.useState)(false);
const ref = (0,external_wp_element_namespaceObject.useRef)();
const recordAfterInput = (0,external_wp_element_namespaceObject.useRef)();
const onKeyDownRef = (0,external_wp_element_namespaceObject.useRef)();
const {
popover,
listBoxId,
activeId,
onKeyDown
} = useAutocomplete({ ...options,
contentRef: ref
});
onKeyDownRef.current = onKeyDown;
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (isVisible) {
if (!recordAfterInput.current) {
recordAfterInput.current = options.record;
} else if (recordAfterInput.current.start !== options.record.start || recordAfterInput.current.end !== options.record.end) {
setIsVisible(false);
recordAfterInput.current = null;
}
} // eslint-disable-next-line react-hooks/exhaustive-deps
}, [options.record]);
const mergedRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, (0,external_wp_compose_namespaceObject.useRefEffect)(element => {
function _onKeyDown(event) {
onKeyDownRef.current(event);
}
function _onInput() {
// Only show auto complete UI if the user is inputting text.
setIsVisible(true);
recordAfterInput.current = null;
}
element.addEventListener('keydown', _onKeyDown);
element.addEventListener('input', _onInput);
return () => {
element.removeEventListener('keydown', _onKeyDown);
element.removeEventListener('input', _onInput);
};
}, [])]);
if (!isVisible) {
return {
ref: mergedRefs
};
}
return {
ref: mergedRefs,
children: popover,
'aria-autocomplete': listBoxId ? 'list' : undefined,
'aria-owns': listBoxId,
'aria-activedescendant': activeId
};
}
function Autocomplete(_ref3) {
let {
children,
isSelected,
...options
} = _ref3;
const {
popover,
...props
} = useAutocomplete(options);
return (0,external_wp_element_namespaceObject.createElement)(external_wp_element_namespaceObject.Fragment, null, children(props), isSelected && popover);
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/hooks.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Generate props for the `BaseControl` and the inner control itself.
*
* Namely, it takes care of generating a unique `id`, properly associating it with the `label` and `help` elements.
*
* @param props
*/
function useBaseControlProps(props) {
const {
help,
id: preferredId,
...restProps
} = props;
const uniqueId = (0,external_wp_compose_namespaceObject.useInstanceId)(base_control, 'wp-components-base-control', preferredId); // ARIA descriptions can only contain plain text, so fall back to aria-details if not.
const helpPropName = typeof help === 'string' ? 'aria-describedby' : 'aria-details';
return {
baseControlProps: {
id: uniqueId,
help,
...restProps
},
controlProps: {
id: uniqueId,
...(!!help ? {
[helpPropName]: `${uniqueId}__help`
} : {})
}
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link.js
/**
* WordPress dependencies
*/
const link_link = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M15.6 7.2H14v1.5h1.6c2 0 3.7 1.7 3.7 3.7s-1.7 3.7-3.7 3.7H14v1.5h1.6c2.8 0 5.2-2.3 5.2-5.2 0-2.9-2.3-5.2-5.2-5.2zM4.7 12.4c0-2 1.7-3.7 3.7-3.7H10V7.2H8.4c-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2H10v-1.5H8.4c-2 0-3.7-1.7-3.7-3.7zm4.6.9h5.3v-1.5H9.3v1.5z"
}));
/* harmony default export */ var library_link = (link_link);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link-off.js
/**
* WordPress dependencies
*/
const linkOff = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M15.6 7.3h-.7l1.6-3.5-.9-.4-3.9 8.5H9v1.5h2l-1.3 2.8H8.4c-2 0-3.7-1.7-3.7-3.7s1.7-3.7 3.7-3.7H10V7.3H8.4c-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2H9l-1.4 3.2.9.4 5.7-12.5h1.4c2 0 3.7 1.7 3.7 3.7s-1.7 3.7-3.7 3.7H14v1.5h1.6c2.9 0 5.2-2.3 5.2-5.2 0-2.9-2.4-5.2-5.2-5.2z"
}));
/* harmony default export */ var link_off = (linkOff);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/styles.js
function border_box_control_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const borderBoxControl = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0);
const linkedBorderControl = () => /*#__PURE__*/emotion_react_browser_esm_css("flex:1;", rtl({
marginRight: '24px'
})(), ";" + ( true ? "" : 0), true ? "" : 0);
const wrapper = true ? {
name: "bjn8wh",
styles: "position:relative"
} : 0;
const borderBoxControlLinkedButton = size => {
return /*#__PURE__*/emotion_react_browser_esm_css("position:absolute;top:", size === '__unstable-large' ? '8px' : '3px', ";", rtl({
right: 0
})(), " line-height:0;" + ( true ? "" : 0), true ? "" : 0);
};
const borderBoxStyleWithFallback = border => {
const {
color = COLORS.gray[200],
style = 'solid',
width = config_values.borderWidth
} = border || {};
const clampedWidth = width !== config_values.borderWidth ? `clamp(1px, ${width}, 10px)` : width;
const hasVisibleBorder = !!width && width !== '0' || !!color;
const borderStyle = hasVisibleBorder ? style || 'solid' : style;
return `${color} ${borderStyle} ${clampedWidth}`;
};
const borderBoxControlVisualizer = (borders, size) => {
return /*#__PURE__*/emotion_react_browser_esm_css("position:absolute;top:", size === '__unstable-large' ? '20px' : '15px', ";right:", size === '__unstable-large' ? '39px' : '29px', ";bottom:", size === '__unstable-large' ? '20px' : '15px', ";left:", size === '__unstable-large' ? '39px' : '29px', ";border-top:", borderBoxStyleWithFallback(borders === null || borders === void 0 ? void 0 : borders.top), ";border-bottom:", borderBoxStyleWithFallback(borders === null || borders === void 0 ? void 0 : borders.bottom), ";", rtl({
borderLeft: borderBoxStyleWithFallback(borders === null || borders === void 0 ? void 0 : borders.left)
})(), " ", rtl({
borderRight: borderBoxStyleWithFallback(borders === null || borders === void 0 ? void 0 : borders.right)
})(), ";" + ( true ? "" : 0), true ? "" : 0);
};
const borderBoxControlSplitControls = size => /*#__PURE__*/emotion_react_browser_esm_css("position:relative;flex:1;width:", size === '__unstable-large' ? undefined : '80%', ";" + ( true ? "" : 0), true ? "" : 0);
const centeredBorderControl = true ? {
name: "1nwbfnf",
styles: "grid-column:span 2;margin:0 auto"
} : 0;
const rightBorderControl = () => /*#__PURE__*/emotion_react_browser_esm_css(rtl({
marginLeft: 'auto'
})(), ";" + ( true ? "" : 0), true ? "" : 0);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/hook.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useBorderBoxControlLinkedButton(props) {
const {
className,
size = 'default',
...otherProps
} = useContextSystem(props, 'BorderBoxControlLinkedButton'); // Generate class names.
const cx = useCx();
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
return cx(borderBoxControlLinkedButton(size), className);
}, [className, cx, size]);
return { ...otherProps,
className: classes
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/component.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const BorderBoxControlLinkedButton = (props, forwardedRef) => {
const {
className,
isLinked,
...buttonProps
} = useBorderBoxControlLinkedButton(props);
const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides');
return (0,external_wp_element_namespaceObject.createElement)(tooltip, {
text: label
}, (0,external_wp_element_namespaceObject.createElement)(component, {
className: className
}, (0,external_wp_element_namespaceObject.createElement)(build_module_button, extends_extends({}, buttonProps, {
isSmall: true,
icon: isLinked ? library_link : link_off,
iconSize: 24,
"aria-label": label,
ref: forwardedRef
}))));
};
const ConnectedBorderBoxControlLinkedButton = contextConnect(BorderBoxControlLinkedButton, 'BorderBoxControlLinkedButton');
/* harmony default export */ var border_box_control_linked_button_component = (ConnectedBorderBoxControlLinkedButton);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/hook.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useBorderBoxControlVisualizer(props) {
const {
className,
value,
size = 'default',
...otherProps
} = useContextSystem(props, 'BorderBoxControlVisualizer'); // Generate class names.
const cx = useCx();
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
return cx(borderBoxControlVisualizer(value, size), className);
}, [cx, className, value, size]);
return { ...otherProps,
className: classes,
value
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/component.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const BorderBoxControlVisualizer = (props, forwardedRef) => {
const {
value,
...otherProps
} = useBorderBoxControlVisualizer(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, otherProps, {
ref: forwardedRef
}));
};
const ConnectedBorderBoxControlVisualizer = contextConnect(BorderBoxControlVisualizer, 'BorderBoxControlVisualizer');
/* harmony default export */ var border_box_control_visualizer_component = (ConnectedBorderBoxControlVisualizer);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close-small.js
/**
* WordPress dependencies
*/
const closeSmall = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"
}));
/* harmony default export */ var close_small = (closeSmall);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-solid.js
/**
* WordPress dependencies
*/
const lineSolid = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M5 11.25h14v1.5H5z"
}));
/* harmony default export */ var line_solid = (lineSolid);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dashed.js
/**
* WordPress dependencies
*/
const lineDashed = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
fillRule: "evenodd",
d: "M5 11.25h3v1.5H5v-1.5zm5.5 0h3v1.5h-3v-1.5zm8.5 0h-3v1.5h3v-1.5z",
clipRule: "evenodd"
}));
/* harmony default export */ var line_dashed = (lineDashed);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dotted.js
/**
* WordPress dependencies
*/
const lineDotted = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
fillRule: "evenodd",
d: "M5.25 11.25h1.5v1.5h-1.5v-1.5zm3 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5zm1.5 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5z",
clipRule: "evenodd"
}));
/* harmony default export */ var line_dotted = (lineDotted);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/styles/unit-control-styles.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
// Using `selectSize` instead of `size` to avoid a type conflict with the
// `size` HTML attribute of the `select` element.
// TODO: Resolve need to use &&& to increase specificity
// https://github.com/WordPress/gutenberg/issues/18483
const ValueInput = /*#__PURE__*/createStyled(number_control, true ? {
target: "e1bagdl32"
} : 0)("&&&{input{display:block;width:100%;}", BackdropUI, "{transition:box-shadow 0.1s linear;}}" + ( true ? "" : 0));
const baseUnitLabelStyles = _ref => {
let {
selectSize
} = _ref;
const sizes = {
default: /*#__PURE__*/emotion_react_browser_esm_css("box-sizing:border-box;padding:2px 1px;width:20px;color:", COLORS.gray[800], ";font-size:8px;line-height:1;letter-spacing:-0.5px;text-transform:uppercase;text-align-last:center;" + ( true ? "" : 0), true ? "" : 0),
large: /*#__PURE__*/emotion_react_browser_esm_css("box-sizing:border-box;min-width:24px;max-width:48px;height:24px;margin-inline-end:", space(2), ";padding:", space(1), ";color:", COLORS.ui.theme, ";font-size:13px;line-height:1;text-align-last:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" + ( true ? "" : 0), true ? "" : 0)
};
return selectSize === '__unstable-large' ? sizes.large : sizes.default;
};
const UnitLabel = createStyled("div", true ? {
target: "e1bagdl31"
} : 0)("&&&{pointer-events:none;", baseUnitLabelStyles, ";color:", COLORS.gray[900], ";}" + ( true ? "" : 0));
const unitSelectSizes = _ref2 => {
let {
selectSize = 'default'
} = _ref2;
const sizes = {
default: /*#__PURE__*/emotion_react_browser_esm_css("height:100%;border:1px solid transparent;transition:box-shadow 0.1s linear,border 0.1s linear;", rtl({
borderTopLeftRadius: 0,
borderBottomLeftRadius: 0
})(), " &:not(:disabled):hover{background-color:", COLORS.gray[100], ";}&:focus{border:1px solid ", COLORS.ui.borderFocus, ";box-shadow:inset 0 0 0 ", config_values.borderWidth + ' ' + COLORS.ui.borderFocus, ";outline-offset:0;outline:2px solid transparent;z-index:1;}" + ( true ? "" : 0), true ? "" : 0),
large: /*#__PURE__*/emotion_react_browser_esm_css("display:flex;justify-content:center;align-items:center;&:hover{color:", COLORS.ui.borderFocus, ";box-shadow:inset 0 0 0 ", config_values.borderWidth + ' ' + COLORS.ui.borderFocus, ";outline:", config_values.borderWidth, " solid transparent;}&:focus{box-shadow:0 0 0 ", config_values.borderWidthFocus + ' ' + COLORS.ui.borderFocus, ";outline:", config_values.borderWidthFocus, " solid transparent;}" + ( true ? "" : 0), true ? "" : 0)
};
return selectSize === '__unstable-large' ? sizes.large : sizes.default;
};
const UnitSelect = createStyled("select", true ? {
target: "e1bagdl30"
} : 0)("&&&{appearance:none;background:transparent;border-radius:2px;border:none;display:block;outline:none;margin:0;min-height:auto;font-family:inherit;", baseUnitLabelStyles, ";", unitSelectSizes, ";&:not( :disabled ){cursor:pointer;}}" + ( true ? "" : 0));
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/styles.js
function border_control_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)."; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const styles_labelStyles = true ? {
name: "f3vz0n",
styles: "font-weight:500"
} : 0;
const focusBoxShadow = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:inset 0 0 0 ", config_values.borderWidth, " ", COLORS.ui.borderFocus, ";" + ( true ? "" : 0), true ? "" : 0);
const borderControl = /*#__PURE__*/emotion_react_browser_esm_css("border:0;padding:0;margin:0;", boxSizingReset, ";" + ( true ? "" : 0), true ? "" : 0);
const innerWrapper = () => /*#__PURE__*/emotion_react_browser_esm_css(ValueInput, "{flex:1 1 40%;}&& ", UnitSelect, "{min-height:0;}" + ( true ? "" : 0), true ? "" : 0);
/*
* This style is only applied to the UnitControl wrapper when the border width
* field should be a set width. Omitting this allows the UnitControl &
* RangeControl to share the available width in a 40/60 split respectively.
*/
const styles_wrapperWidth = /*#__PURE__*/emotion_react_browser_esm_css(ValueInput, "{flex:0 0 auto;}" + ( true ? "" : 0), true ? "" : 0);
const wrapperHeight = size => {
return /*#__PURE__*/emotion_react_browser_esm_css("height:", size === '__unstable-large' ? '40px' : '30px', ";" + ( true ? "" : 0), true ? "" : 0);
};
const borderControlDropdown = size => /*#__PURE__*/emotion_react_browser_esm_css("background:#fff;&&>button{height:", size === '__unstable-large' ? '40px' : '30px', ";width:", size === '__unstable-large' ? '40px' : '30px', ";padding:0;display:flex;align-items:center;justify-content:center;", rtl({
borderRadius: `2px 0 0 2px`
}, {
borderRadius: `0 2px 2px 0`
})(), " border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";&:focus,&:hover:not( :disabled ){", focusBoxShadow, " border-color:", COLORS.ui.borderFocus, ";z-index:1;position:relative;}}" + ( true ? "" : 0), true ? "" : 0);
const colorIndicatorBorder = border => {
const {
color,
style
} = border || {};
const fallbackColor = !!style && style !== 'none' ? COLORS.gray[300] : undefined;
return /*#__PURE__*/emotion_react_browser_esm_css("border-style:", style === 'none' ? 'solid' : style, ";border-color:", color || fallbackColor, ";" + ( true ? "" : 0), true ? "" : 0);
};
const colorIndicatorWrapper = (border, size) => {
const {
style
} = border || {};
return /*#__PURE__*/emotion_react_browser_esm_css("border-radius:9999px;border:2px solid transparent;", style ? colorIndicatorBorder(border) : undefined, " width:", size === '__unstable-large' ? '24px' : '22px', ";height:", size === '__unstable-large' ? '24px' : '22px', ";padding:", size === '__unstable-large' ? '2px' : '1px', ";&>span{height:", space(4), ";width:", space(4), ";background:linear-gradient(\n\t\t\t\t-45deg,\n\t\t\t\ttransparent 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 52%,\n\t\t\t\ttransparent 52%\n\t\t\t);}" + ( true ? "" : 0), true ? "" : 0);
}; // Must equal $color-palette-circle-size from:
// @wordpress/components/src/circular-option-picker/style.scss
const swatchSize = 28;
const swatchGap = 12;
const borderControlPopoverControls = /*#__PURE__*/emotion_react_browser_esm_css("width:", swatchSize * 6 + swatchGap * 5, "px;>div:first-of-type>", StyledLabel, "{margin-bottom:0;", styles_labelStyles, ";}&& ", StyledLabel, "+button:not( .has-text ){min-width:24px;padding:0;}" + ( true ? "" : 0), true ? "" : 0);
const borderControlPopoverContent = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0);
const borderColorIndicator = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0);
const resetButton = /*#__PURE__*/emotion_react_browser_esm_css("justify-content:center;width:100%;&&{border-top:", config_values.borderWidth, " solid ", COLORS.gray[200], ";border-top-left-radius:0;border-top-right-radius:0;height:46px;}" + ( true ? "" : 0), true ? "" : 0);
const borderControlStylePicker = /*#__PURE__*/emotion_react_browser_esm_css(StyledLabel, "{", styles_labelStyles, ";}" + ( true ? "" : 0), true ? "" : 0);
const borderStyleButton = true ? {
name: "1486260",
styles: "&&&&&{min-width:30px;width:30px;height:30px;padding:3px;}"
} : 0;
const borderSlider = () => /*#__PURE__*/emotion_react_browser_esm_css("flex:1 1 60%;", rtl({
marginRight: space(3)
})(), ";" + ( true ? "" : 0), true ? "" : 0);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-style-picker/hook.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useBorderControlStylePicker(props) {
const {
className,
...otherProps
} = useContextSystem(props, 'BorderControlStylePicker'); // Generate class names.
const cx = useCx();
const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
return cx(borderControlStylePicker, className);
}, [className, cx]);
const buttonClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
return cx(borderStyleButton);
}, [cx]);
return { ...otherProps,
className: classes,
buttonClassName
};
}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-style-picker/component.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const BORDER_STYLES = [{
label: (0,external_wp_i18n_namespaceObject.__)('Solid'),
icon: line_solid,
value: 'solid'
}, {
label: (0,external_wp_i18n_namespaceObject.__)('Dashed'),
icon: line_dashed,
value: 'dashed'
}, {
label: (0,external_wp_i18n_namespaceObject.__)('Dotted'),
icon: line_dotted,
value: 'dotted'
}];
const component_Label = props => {
const {
label,
hideLabelFromVision
} = props;
if (!label) {
return null;
}
return hideLabelFromVision ? (0,external_wp_element_namespaceObject.createElement)(visually_hidden_component, {
as: "label"
}, label) : (0,external_wp_element_namespaceObject.createElement)(StyledLabel, null, label);
};
const BorderControlStylePicker = (props, forwardedRef) => {
const {
buttonClassName,
hideLabelFromVision,
label,
onChange,
value,
...otherProps
} = useBorderControlStylePicker(props);
return (0,external_wp_element_namespaceObject.createElement)(component, extends_extends({}, otherProps, {
ref: forwardedRef
}), (0,external_wp_element_namespaceObject.createElement)(component_Label, {
label: label,
hideLabelFromVision: hideLabelFromVision
}), (0,external_wp_element_namespaceObject.createElement)(flex_component, {
justify: "flex-start",
gap: 1
}, BORDER_STYLES.map(borderStyle => (0,external_wp_element_namespaceObject.createElement)(build_module_button, {
key: borderStyle.value,
className: buttonClassName,
icon: borderStyle.icon,
isSmall: true,
isPressed: borderStyle.value === value,
onClick: () => onChange(borderStyle.value === value ? undefined : borderStyle.value),
"aria-label": borderStyle.label,
label: borderStyle.label,
showTooltip: true
}))));
};
const ConnectedBorderControlStylePicker = contextConnect(BorderControlStylePicker, 'BorderControlStylePicker');
/* harmony default export */ var border_control_style_picker_component = (ConnectedBorderControlStylePicker);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-indicator/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function UnforwardedColorIndicator(props, forwardedRef) {
const {
className,
colorValue,
...additionalProps
} = props;
return (0,external_wp_element_namespaceObject.createElement)("span", extends_extends({
className: classnames_default()('component-color-indicator', className),
style: {
background: colorValue
},
ref: forwardedRef
}, additionalProps));
}
/**
* ColorIndicator is a React component that renders a specific color in a
* circle. It's often used to summarize a collection of used colors in a child
* component.
*
* ```jsx
* import { ColorIndicator } from '@wordpress/components';
*
* const MyColorIndicator = () => ;
* ```
*/
const ColorIndicator = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedColorIndicator);
/* harmony default export */ var color_indicator = (ColorIndicator);
;// CONCATENATED MODULE: ./node_modules/colord/plugins/a11y.mjs
var a11y_o=function(o){var t=o/255;return t<.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)},a11y_t=function(t){return.2126*a11y_o(t.r)+.7152*a11y_o(t.g)+.0722*a11y_o(t.b)};/* harmony default export */ function a11y(o){o.prototype.luminance=function(){return o=a11y_t(this.rgba),void 0===(r=2)&&(r=0),void 0===n&&(n=Math.pow(10,r)),Math.round(n*o)/n+0;var o,r,n},o.prototype.contrast=function(r){void 0===r&&(r="#FFF");var n,a,i,e,v,u,d,c=r instanceof o?r:new o(r);return e=this.rgba,v=c.toRgb(),u=a11y_t(e),d=a11y_t(v),n=u>d?(u+.05)/(d+.05):(d+.05)/(u+.05),void 0===(a=2)&&(a=0),void 0===i&&(i=Math.pow(10,a)),Math.floor(i*n)/i+0},o.prototype.isReadable=function(o,t){return void 0===o&&(o="#FFF"),void 0===t&&(t={}),this.contrast(o)>=(e=void 0===(i=(r=t).size)?"normal":i,"AAA"===(a=void 0===(n=r.level)?"AA":n)&&"normal"===e?7:"AA"===a&&"large"===e?3:4.5);var r,n,a,i,e}}
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useObservableState(initialState, onStateChange) {
const [state, setState] = (0,external_wp_element_namespaceObject.useState)(initialState);
return [state, value => {
setState(value);
if (onStateChange) {
onStateChange(value);
}
}];
}
function UnforwardedDropdown(_ref, forwardedRef) {
let {
renderContent,
renderToggle,
className,
contentClassName,
expandOnMobile,
headerTitle,
focusOnMount,
popoverProps,
onClose,
onToggle,
style,
// Deprecated props
position
} = _ref;
if (position !== undefined) {
external_wp_deprecated_default()('`position` prop in wp.components.Dropdown', {
since: '6.2',
alternative: '`popoverProps.placement` prop',
hint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.'
});
} // Use internal state instead of a ref to make sure that the component
// re-renders when the popover's anchor updates.
const [fallbackPopoverAnchor, setFallbackPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null);
const containerRef = (0,external_wp_element_namespaceObject.useRef)();
const [isOpen, setIsOpen] = useObservableState(false, onToggle);
(0,external_wp_element_namespaceObject.useEffect)(() => () => {
if (onToggle && isOpen) {
onToggle(false);
}
}, [onToggle, isOpen]);
function toggle() {
setIsOpen(!isOpen);
}
/**
* Closes the popover when focus leaves it unless the toggle was pressed or
* focus has moved to a separate dialog. The former is to let the toggle
* handle closing the popover and the latter is to preserve presence in
* case a dialog has opened, allowing focus to return when it's dismissed.
*/
function closeIfFocusOutside() {
var _ownerDocument$active;
if (!containerRef.current) {
return;
}
const {
ownerDocument
} = containerRef.current;
const dialog = ownerDocument === null || ownerDocument === void 0 ? void 0 : (_ownerDocument$active = ownerDocument.activeElement) === null || _ownerDocument$active === void 0 ? void 0 : _ownerDocument$active.closest('[role="dialog"]');
if (!containerRef.current.contains(ownerDocument.activeElement) && (!dialog || dialog.contains(containerRef.current))) {
close();
}
}
function close() {
if (onClose) {
onClose();
}
setIsOpen(false);
}
const args = {
isOpen,
onToggle: toggle,
onClose: close
};
const popoverPropsHaveAnchor = !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchor) || // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and
// be removed from `Popover` from WordPress 6.3
!!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchorRef) || !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.getAnchorRect) || !!(popoverProps !== null && popoverProps !== void 0 && popoverProps.anchorRect);
return (0,external_wp_element_namespaceObject.createElement)("div", {
className: classnames_default()('components-dropdown', className),
ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([containerRef, forwardedRef, setFallbackPopoverAnchor]) // Some UAs focus the closest focusable parent when the toggle is
// clicked. Making this div focusable ensures such UAs will focus
// it and `closeIfFocusOutside` can tell if the toggle was clicked.
,
tabIndex: -1,
style: style
}, renderToggle(args), isOpen && (0,external_wp_element_namespaceObject.createElement)(popover, extends_extends({
position: position,
onClose: close,
onFocusOutside: closeIfFocusOutside,
expandOnMobile: expandOnMobile,
headerTitle: headerTitle,
focusOnMount: focusOnMount // This value is used to ensure that the dropdowns
// align with the editor header by default.
,
offset: 13,
anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined
}, popoverProps, {
className: classnames_default()('components-dropdown__content', popoverProps === null || popoverProps === void 0 ? void 0 : popoverProps.className, contentClassName)
}), renderContent(args)));
}
/**
* Renders a button that opens a floating content modal when clicked.
*
* ```jsx
* import { Button, Dropdown } from '@wordpress/components';
*
* const MyDropdown = () => (
* (
*
* ) }
* renderContent={ () => This is the content of the dropdown.
}
* />
* );
* ```
*/
const Dropdown = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedDropdown);
/* harmony default export */ var dropdown = (Dropdown);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-suffix-wrapper.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
function UnconnectedInputControlSuffixWrapper(props, forwardedRef) {
const derivedProps = useContextSystem(props, 'InputControlSuffixWrapper');
return (0,external_wp_element_namespaceObject.createElement)(spacer_component, extends_extends({
marginBottom: 0
}, derivedProps, {
ref: forwardedRef
}));
}
/**
* A convenience wrapper for the `suffix` when you want to apply
* standard padding in accordance with the size variant.
*
* ```jsx
* import {
* __experimentalInputControl as InputControl,
* __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
* } from '@wordpress/components';
*
* %}
* />
* ```
*/
const InputControlSuffixWrapper = contextConnect(UnconnectedInputControlSuffixWrapper, 'InputControlSuffixWrapper');
/* harmony default export */ var input_suffix_wrapper = (InputControlSuffixWrapper);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/styles/select-control-styles.js
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const select_control_styles_disabledStyles = _ref => {
let {
disabled
} = _ref;
if (!disabled) return '';
return /*#__PURE__*/emotion_react_browser_esm_css({
color: COLORS.ui.textDisabled
}, true ? "" : 0, true ? "" : 0);
};
const select_control_styles_fontSizeStyles = _ref2 => {
let {
selectSize = 'default'
} = _ref2;
const sizes = {
default: '13px',
small: '11px',
'__unstable-large': '13px'
};
const fontSize = sizes[selectSize];
const fontSizeMobile = '16px';
if (!fontSize) return '';
return /*#__PURE__*/emotion_react_browser_esm_css("font-size:", fontSizeMobile, ";@media ( min-width: 600px ){font-size:", fontSize, ";}" + ( true ? "" : 0), true ? "" : 0);
};
const select_control_styles_sizeStyles = _ref3 => {
let {
__next36pxDefaultSize,
multiple,
selectSize = 'default'
} = _ref3;
if (multiple) {
// When `multiple`, just use the native browser styles
// without setting explicit height.
return;
}
const sizes = {
default: {
height: 36,
minHeight: 36,
paddingTop: 0,
paddingBottom: 0
},
small: {
height: 24,
minHeight: 24,
paddingTop: 0,
paddingBottom: 0
},
'__unstable-large': {
height: 40,
minHeight: 40,
paddingTop: 0,
paddingBottom: 0
}
};
if (!__next36pxDefaultSize) {
sizes.default = {
height: 30,
minHeight: 30,
paddingTop: 0,
paddingBottom: 0
};
}
const style = sizes[selectSize] || sizes.default;
return /*#__PURE__*/emotion_react_browser_esm_css(style, true ? "" : 0, true ? "" : 0);
};
const chevronIconSize = 18;
const sizePaddings = _ref4 => {
let {
__next36pxDefaultSize,
multiple,
selectSize = 'default'
} = _ref4;
const padding = {
default: 16,
small: 8,
'__unstable-large': 16
};
if (!__next36pxDefaultSize) {
padding.default = 8;
}
const selectedPadding = padding[selectSize] || padding.default;
return rtl({
paddingLeft: selectedPadding,
paddingRight: selectedPadding + chevronIconSize,
...(multiple ? {
paddingTop: selectedPadding,
paddingBottom: selectedPadding
} : {})
});
};
const overflowStyles = _ref5 => {
let {
multiple
} = _ref5;
return {
overflow: multiple ? 'auto' : 'hidden'
};
}; // TODO: Resolve need to use &&& to increase specificity
// https://github.com/WordPress/gutenberg/issues/18483
const Select = createStyled("select", true ? {
target: "e1mv6sxx2"
} : 0)("&&&{appearance:none;background:transparent;box-sizing:border-box;border:none;box-shadow:none!important;color:", COLORS.gray[900], ";display:block;font-family:inherit;margin:0;width:100%;max-width:none;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;", select_control_styles_disabledStyles, ";", select_control_styles_fontSizeStyles, ";", select_control_styles_sizeStyles, ";", sizePaddings, ";", overflowStyles, ";}" + ( true ? "" : 0));
const DownArrowWrapper = createStyled("div", true ? {
target: "e1mv6sxx1"
} : 0)("margin-inline-end:", space(-1), ";line-height:0;" + ( true ? "" : 0));
const InputControlSuffixWrapperWithClickThrough = /*#__PURE__*/createStyled(input_suffix_wrapper, true ? {
target: "e1mv6sxx0"
} : 0)("position:absolute;pointer-events:none;", rtl({
right: 0
}), ";" + ( true ? "" : 0));
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/icon/index.js
/**
* WordPress dependencies
*/
/** @typedef {{icon: JSX.Element, size?: number} & import('@wordpress/primitives').SVGProps} IconProps */
/**
* Return an SVG icon.
*
* @param {IconProps} props icon is the SVG component to render
* size is a number specifiying the icon size in pixels
* Other props will be passed to wrapped SVG component
*
* @return {JSX.Element} Icon component
*/
function icon_Icon(_ref) {
let {
icon,
size = 24,
...props
} = _ref;
return (0,external_wp_element_namespaceObject.cloneElement)(icon, {
width: size,
height: size,
...props
});
}
/* harmony default export */ var icons_build_module_icon = (icon_Icon);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-down.js
/**
* WordPress dependencies
*/
const chevronDown = (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.SVG, {
viewBox: "0 0 24 24",
xmlns: "http://www.w3.org/2000/svg"
}, (0,external_wp_element_namespaceObject.createElement)(external_wp_primitives_namespaceObject.Path, {
d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z"
}));
/* harmony default export */ var chevron_down = (chevronDown);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/chevron-down.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const SelectControlChevronDown = () => {
return (0,external_wp_element_namespaceObject.createElement)(InputControlSuffixWrapperWithClickThrough, null, (0,external_wp_element_namespaceObject.createElement)(DownArrowWrapper, null, (0,external_wp_element_namespaceObject.createElement)(icons_build_module_icon, {
icon: chevron_down,
size: chevronIconSize
})));
};
/* harmony default export */ var select_control_chevron_down = (SelectControlChevronDown);
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const select_control_noop = () => {};
function select_control_useUniqueId(idProp) {
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(SelectControl);
const id = `inspector-select-control-${instanceId}`;
return idProp || id;
}
function UnforwardedSelectControl(_ref, ref) {
let {
className,
disabled = false,
help,
hideLabelFromVision,
id: idProp,
label,
multiple = false,
onBlur = select_control_noop,
onChange = select_control_noop,
onFocus = select_control_noop,
options = [],
size = 'default',
value: valueProp,
labelPosition = 'top',
children,
prefix,
suffix,
__next36pxDefaultSize = false,
__nextHasNoMarginBottom = false,
...props
} = _ref;
const [isFocused, setIsFocused] = (0,external_wp_element_namespaceObject.useState)(false);
const id = select_control_useUniqueId(idProp);
const helpId = help ? `${id}__help` : undefined; // Disable reason: A select with an onchange throws a warning.
if (!(options !== null && options !== void 0 && options.length) && !children) return null;
const handleOnBlur = event => {
onBlur(event);
setIsFocused(false);
};
const handleOnFocus = event => {
onFocus(event);
setIsFocused(true);
};
const handleOnChange = event => {
if (multiple) {
const selectedOptions = Array.from(event.target.options).filter(_ref2 => {
let {
selected
} = _ref2;
return selected;
});
const newValues = selectedOptions.map(_ref3 => {
let {
value
} = _ref3;
return value;
});
onChange(newValues);
return;
}
onChange(event.target.value, {
event
});
};
const classes = classnames_default()('components-select-control', className);
/* eslint-disable jsx-a11y/no-onchange */
return (0,external_wp_element_namespaceObject.createElement)(base_control, {
help: help,
id: id,
__nextHasNoMarginBottom: __nextHasNoMarginBottom
}, (0,external_wp_element_namespaceObject.createElement)(input_base, {
className: classes,
disabled: disabled,
hideLabelFromVision: hideLabelFromVision,
id: id,
isFocused: isFocused,
label: label,
size: size,
suffix: suffix || !multiple && (0,external_wp_element_namespaceObject.createElement)(select_control_chevron_down, null),
prefix: prefix,
labelPosition: labelPosition,
__next36pxDefaultSize: __next36pxDefaultSize
}, (0,external_wp_element_namespaceObject.createElement)(Select, extends_extends({}, props, {
__next36pxDefaultSize: __next36pxDefaultSize,
"aria-describedby": helpId,
className: "components-select-control__input",
disabled: disabled,
id: id,
multiple: multiple,
onBlur: handleOnBlur,
onChange: handleOnChange,
onFocus: handleOnFocus,
ref: ref,
selectSize: size,
value: valueProp
}), children || options.map((option, index) => {
const key = option.id || `${option.label}-${option.value}-${index}`;
return (0,external_wp_element_namespaceObject.createElement)("option", {
key: key,
value: option.value,
disabled: option.disabled
}, option.label);
}))));
/* eslint-enable jsx-a11y/no-onchange */
}
/**
* `SelectControl` allows users to select from a single or multiple option menu.
* It functions as a wrapper around the browser's native `