Allows users to configure scripts
Per
Dit script moet niet direct worden geïnstalleerd - het is een bibliotheek voor andere scripts om op te nemen met de meta-richtlijn // @require https://update.greasyfork.org/scripts/446506/1405966/%24Config.js
var $Config;
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./ts/consts.ts":
/*!**********************!*\
!*** ./ts/consts.ts ***!
\**********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ SOCKET_ID: () => (/* binding */ SOCKET_ID)
/* harmony export */ });
const SOCKET_ID = 'tree-frame';
/***/ }),
/***/ "./ts/library/index.ts":
/*!*****************************!*\
!*** ./ts/library/index.ts ***!
\*****************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ edit: () => (/* binding */ edit),
/* harmony export */ init: () => (/* binding */ init),
/* harmony export */ reset: () => (/* reexport safe */ _modal_body__WEBPACK_IMPORTED_MODULE_4__.reset)
/* harmony export */ });
/* harmony import */ var _validation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./validation */ "./ts/library/validation/index.ts");
/* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../modal */ "./ts/modal/index.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../consts */ "./ts/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../modal/css */ "./ts/modal/css.ts");
/* harmony import */ var _modal_body__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../modal/body */ "./ts/modal/body/index.ts");
/* harmony import */ var _modal_header_actions_close__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @/modal/header/actions/close */ "./ts/modal/header/actions/close/index.ts");
var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
function init(config, socket, idPostfix) {
var _a;
return __awaiter(this, void 0, void 0, function* () {
socket.id = `${_consts__WEBPACK_IMPORTED_MODULE_2__.SOCKET_ID}-${idPostfix}`;
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.setRootId)(socket.id);
try {
yield (0,_validation__WEBPACK_IMPORTED_MODULE_0__["default"])(config);
(0,_modal__WEBPACK_IMPORTED_MODULE_1__["default"])(config, socket);
// Config is valid
return {
requireReset: false,
tree: (_a = config.userTree) !== null && _a !== void 0 ? _a : config.defaultTree,
};
}
catch (error) {
if (typeof config !== 'object' || !(0,_validation__WEBPACK_IMPORTED_MODULE_0__.hasOwnProperty)(config, 'userTree')) {
throw error;
}
delete config.userTree;
yield (0,_validation__WEBPACK_IMPORTED_MODULE_0__["default"])(config);
(0,_modal__WEBPACK_IMPORTED_MODULE_1__["default"])(config, socket);
// Config is valid with userTree removed
return {
requireReset: true,
tree: config.defaultTree,
error,
};
}
});
}
function edit() {
(0,_modal__WEBPACK_IMPORTED_MODULE_1__.getSocket)().focus();
return new Promise((resolve) => {
(0,_modal_header_actions_close__WEBPACK_IMPORTED_MODULE_5__.setCallback)(resolve);
});
}
/***/ }),
/***/ "./ts/library/validation/errors.ts":
/*!*****************************************!*\
!*** ./ts/library/validation/errors.ts ***!
\*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ DeactivatedError: () => (/* binding */ DeactivatedError),
/* harmony export */ EmptyArrayError: () => (/* binding */ EmptyArrayError),
/* harmony export */ EmptyStringError: () => (/* binding */ EmptyStringError),
/* harmony export */ HangingPredicateError: () => (/* binding */ HangingPredicateError),
/* harmony export */ JoinedError: () => (/* binding */ JoinedError),
/* harmony export */ MismatchedOptionsError: () => (/* binding */ MismatchedOptionsError),
/* harmony export */ NoNodeColourError: () => (/* binding */ NoNodeColourError),
/* harmony export */ NoOptionsError: () => (/* binding */ NoOptionsError),
/* harmony export */ NonIntegerError: () => (/* binding */ NonIntegerError),
/* harmony export */ PoolBranchError: () => (/* binding */ PoolBranchError),
/* harmony export */ PoolSizeError: () => (/* binding */ PoolSizeError),
/* harmony export */ PredicateError: () => (/* binding */ PredicateError),
/* harmony export */ PropertyError: () => (/* binding */ PropertyError),
/* harmony export */ SeedMatchError: () => (/* binding */ SeedMatchError),
/* harmony export */ TypeError: () => (/* binding */ TypeError),
/* harmony export */ UnexpectedStateError: () => (/* binding */ UnexpectedStateError),
/* harmony export */ ValueError: () => (/* binding */ ValueError)
/* harmony export */ });
// Helpers
function getOptionString(array) {
if (array.length === 0) {
throw new Error('No valid options.');
}
if (array.length === 1) {
return `'${array[0]}'`;
}
return `'${array.slice(0, -1).join('\', \'')}' or '${array[array.length - 1]}'`;
}
function getPath(breadcrumbs) {
return `/${breadcrumbs.join('/')}`;
}
// Errors
class JoinedError extends Error {
constructor(...errors) {
super(errors.map(({ message }) => message).join(JoinedError.separator));
}
}
JoinedError.separator = '\n\n';
class UnexpectedStateError extends Error {
constructor() {
super('Unexpected state reached.');
}
}
class TypeError extends Error {
constructor(breadcrumbs, found, expected) {
super(`Found a value of type '${found}' at ${getPath(breadcrumbs)}. Expected ${getOptionString(expected)}.`);
}
}
class PropertyError extends Error {
constructor(breadcrumbs, property, shouldExist) {
super(`${shouldExist ? 'Missing' : 'Unexpected'} property '${property}' found at ${getPath(breadcrumbs)}.`);
}
}
class ValueError extends Error {
constructor(breadcrumbs, found, expected) {
super(`Found a value of '${found}' at ${getPath(breadcrumbs)}. Expected ${getOptionString(expected)}.`);
}
}
class NonIntegerError extends Error {
constructor(breadcrumbs) {
super(`Found illegal non-integer at ${getPath(breadcrumbs)}.`);
}
}
class EmptyStringError extends Error {
constructor(breadcrumbs) {
super(`Found illegal empty string at ${getPath(breadcrumbs)}.`);
}
}
class EmptyArrayError extends Error {
constructor(breadcrumbs) {
super(`Found illegal empty array at ${getPath(breadcrumbs)}.`);
}
}
class PredicateError extends Error {
constructor(breadcrumbs) {
super(`Predicate failed at ${getPath(breadcrumbs)}. Predicates must succeed.`);
}
}
class SeedMatchError extends Error {
constructor() {
super('All children must be structurally similar to their parent\'s seed.');
}
}
class PoolBranchError extends Error {
constructor(ancestorBreadcrumbs, descendantBreadcrumbs, poolId) {
super('No node may share a poolId value with its ancestor.' + JoinedError.separator
+ `Found poolId value ${poolId} at ${getPath(ancestorBreadcrumbs)} and ${getPath(descendantBreadcrumbs)}.`);
}
}
class PoolSizeError extends Error {
constructor(poolId, found, expected) {
super('Corresponding pools in the default & candidate trees must be the same size unless a pool parent or ancestor has a seed value.' + JoinedError.separator
+ `Found a size of ${found} at pool ${poolId}. Expected a size of ${expected}.`);
}
}
class NoOptionsError extends Error {
constructor() {
super('Array type validators may not be empty.');
}
}
class MismatchedOptionsError extends Error {
constructor() {
super('Values in array type validators must all be the same type.');
}
}
class HangingPredicateError extends Error {
constructor() {
super('If a predicate is declared, a value must also be present.');
}
}
class DeactivatedError extends Error {
constructor() {
super('Nodes can\'t be deactivated unless their parent has a seed.');
}
}
class NoNodeColourError extends Error {
constructor() {
super('If the node color property is included, at least one value must be defined.');
}
}
/***/ }),
/***/ "./ts/library/validation/index.ts":
/*!****************************************!*\
!*** ./ts/library/validation/index.ts ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* export default binding */ __WEBPACK_DEFAULT_EXPORT__),
/* harmony export */ hasOwnProperty: () => (/* binding */ hasOwnProperty),
/* harmony export */ validateUnexpectedKeys: () => (/* binding */ validateUnexpectedKeys)
/* harmony export */ });
/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./types */ "./ts/library/validation/types.ts");
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./errors */ "./ts/library/validation/errors.ts");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./styles */ "./ts/library/validation/styles.ts");
/* harmony import */ var _trees_pools__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./trees/pools */ "./ts/library/validation/trees/pools.ts");
/* harmony import */ var _trees_guards__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./trees/guards */ "./ts/library/validation/trees/guards.ts");
/* harmony import */ var _trees_match__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./trees/match */ "./ts/library/validation/trees/match.ts");
/* harmony import */ var _trees_predicates__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./trees/predicates */ "./ts/library/validation/trees/predicates.ts");
// Helpers
// Credit to https://fettblog.eu/typescript-hasownproperty/
function hasOwnProperty(object, property) {
return Object.hasOwnProperty.call(object, property);
}
function validateUnexpectedKeys(breadcrumbs, object, expected) {
for (const key of Object.keys(object)) {
if (!expected.includes(key))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, key, false);
}
}
// Guard
function isConfig(candidate) {
if (typeof candidate !== 'object')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([], typeof candidate, ['object']);
validateUnexpectedKeys([], candidate, _types__WEBPACK_IMPORTED_MODULE_0__.CONFIG_KEYS);
// title
if (!hasOwnProperty(candidate, 'title'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError([], 'title', true);
if (typeof candidate.title !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError(['title'], typeof candidate.title, ['string']);
// defaultStyle
if (hasOwnProperty(candidate, 'defaultStyle')) {
if (!(0,_styles__WEBPACK_IMPORTED_MODULE_2__.isStyles)(['defaultStyle'], candidate.defaultStyle))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
if (hasOwnProperty(candidate.defaultStyle, 'name'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(['defaultStyle'], 'name', false);
if (hasOwnProperty(candidate.defaultStyle, 'isActive'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(['defaultStyle'], 'isActive', false);
}
// userStyles
if (!hasOwnProperty(candidate, 'userStyles'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError([], 'userStyles', true);
if (!Array.isArray(candidate.userStyles))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError(['userStyles'], typeof candidate.userStyles, ['array']);
for (const [i, style] of candidate.userStyles.entries()) {
if (!(0,_styles__WEBPACK_IMPORTED_MODULE_2__.isStyles)(['userStyles', i.toString()], style))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
if (!hasOwnProperty(style, 'name'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(['userStyles', i.toString()], 'name', true);
if (typeof style.name !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError(['userStyles', i.toString(), 'name'], typeof style.name, ['string']);
if (!hasOwnProperty(style, 'isActive'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(['userStyles', i.toString()], 'isActive', true);
if (typeof style.isActive !== 'boolean')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError(['userStyles', i.toString(), 'isActive'], typeof style.isActive, ['boolean']);
}
// defaultTree
if (!hasOwnProperty(candidate, 'defaultTree') || !(0,_trees_guards__WEBPACK_IMPORTED_MODULE_4__.isRoot)(['defaultTree'], candidate.defaultTree))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError([], 'defaultTree', true);
// userTree
if (hasOwnProperty(candidate, 'userTree') && !(0,_trees_guards__WEBPACK_IMPORTED_MODULE_4__.isRoot)(['userTree'], candidate.userTree, true))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
return true;
}
// Validator
function validateConfig({ title, defaultTree, userTree }) {
// title
if (title.length === 0)
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.EmptyStringError(['title']);
// trees
(0,_trees_match__WEBPACK_IMPORTED_MODULE_5__.validateSeeds)(['defaultTree'], defaultTree);
(0,_trees_pools__WEBPACK_IMPORTED_MODULE_3__.validatePools)(['defaultTree'], defaultTree);
if (userTree) {
(0,_trees_match__WEBPACK_IMPORTED_MODULE_5__.validateParentMatch)(['defaultTree'], defaultTree, ['userTree'], userTree);
// Has to be done after mutations since new pools may be created
(0,_trees_match__WEBPACK_IMPORTED_MODULE_5__.validatePoolSizeMatch)(defaultTree, userTree);
}
return Promise.all((0,_trees_predicates__WEBPACK_IMPORTED_MODULE_6__.validateParent)(['defaultTree'], defaultTree));
}
// API
/* harmony default export */ function __WEBPACK_DEFAULT_EXPORT__(candidate) {
if (!isConfig(candidate))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
return validateConfig(candidate);
}
/***/ }),
/***/ "./ts/library/validation/styles.ts":
/*!*****************************************!*\
!*** ./ts/library/validation/styles.ts ***!
\*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ isStyles: () => (/* binding */ isStyles)
/* harmony export */ });
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./errors */ "./ts/library/validation/errors.ts");
/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./types */ "./ts/library/validation/types.ts");
function isStyles(breadcrumbs, candidate) {
if (typeof candidate !== 'object')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError(breadcrumbs, typeof candidate, ['object']);
if (Array.isArray(candidate))
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError(breadcrumbs, 'array', ['object']);
for (const [key, value] of Object.entries(candidate)) {
switch (key) {
// Colours
case 'modalOutline':
case 'headBase':
case 'headButtonExit':
case 'headButtonLabel':
case 'headButtonStyle':
case 'nodeButtonRemove':
case 'nodeButtonCreate':
case 'nodeButtonMove':
case 'nodeButtonDisable':
case 'validBackground':
case 'invalidBackground':
case 'tooltipOutline':
if (typeof value !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key], typeof value, ['string']);
break;
// Numbers
case 'fontSize':
if (typeof value !== 'number')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key], typeof value, ['number']);
break;
// Contrast methods
case 'headContrast':
case 'nodeContrast':
if (typeof value !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key], typeof value, ['string']);
if (!_types__WEBPACK_IMPORTED_MODULE_1__.CONTRAST_METHODS.includes(value))
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...breadcrumbs, key], value, _types__WEBPACK_IMPORTED_MODULE_1__.CONTRAST_METHODS);
break;
// Booleans
case 'isActive':
case 'borderLeaf':
case 'borderNode':
if (typeof value !== 'boolean')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key], typeof value, ['boolean']);
break;
case 'nodeBase':
if (!Array.isArray(value))
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key], typeof value, ['array']);
if (value.length === 0)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.NoNodeColourError(), new _errors__WEBPACK_IMPORTED_MODULE_0__.EmptyArrayError([...breadcrumbs, key]));
for (const [i, subValue] of value.entries()) {
if (typeof subValue !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, key, i.toString()], typeof subValue, ['string']);
}
break;
}
}
return true;
}
/***/ }),
/***/ "./ts/library/validation/trees/guards.ts":
/*!***********************************************!*\
!*** ./ts/library/validation/trees/guards.ts ***!
\***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ isParent: () => (/* binding */ isParent),
/* harmony export */ isRoot: () => (/* binding */ isRoot)
/* harmony export */ });
/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../types */ "./ts/library/validation/types.ts");
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../errors */ "./ts/library/validation/errors.ts");
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../index */ "./ts/library/validation/index.ts");
// Type predicates
function isParent(breadcrumbs, candidate, isUserTree = false) {
if (!(0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'children'))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, 'children', true);
if (!Array.isArray(candidate.children))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'children'], typeof candidate.children, ['array']);
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'seed')) {
if (isUserTree)
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, 'descendantPredicate', false);
if (!isChild([...breadcrumbs, 'seed'], candidate.seed))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
}
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'childPredicate')) {
if (isUserTree)
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, 'childPredicate', false);
if (typeof candidate.childPredicate !== 'function')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'childPredicate'], typeof candidate.childPredicate, ['function']);
}
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'descendantPredicate')) {
if (isUserTree)
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, 'descendantPredicate', false);
if (typeof candidate.descendantPredicate !== 'function')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'descendantPredicate'], typeof candidate.descendantPredicate, ['function']);
}
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'poolId') && typeof candidate.poolId !== 'number')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'poolId'], typeof candidate.poolId, ['number']);
for (const [i, child] of candidate.children.entries()) {
if (!isChild([...breadcrumbs, 'children', i.toString()], child, isUserTree))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
}
return true;
}
function isChild(breadcrumbs, candidate, isUserTree = false) {
if (typeof candidate !== 'object')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs], typeof candidate, ['object']);
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'label') && typeof candidate.label !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'label'], typeof candidate.label, ['string']);
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'value') && !_types__WEBPACK_IMPORTED_MODULE_0__.VALUE_TYPES.includes(typeof candidate.value))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'value'], typeof candidate.value, _types__WEBPACK_IMPORTED_MODULE_0__.VALUE_TYPES);
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'predicate')) {
if (isUserTree)
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.PropertyError(breadcrumbs, 'predicate', false);
if (typeof candidate.predicate !== 'function') {
if (!Array.isArray(candidate.predicate))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'predicate'], typeof candidate.predicate, _types__WEBPACK_IMPORTED_MODULE_0__.PREDICATE_TYPES);
for (const [i, option] of candidate.predicate.entries()) {
if (!_types__WEBPACK_IMPORTED_MODULE_0__.VALUE_TYPES.includes(typeof option))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'predicate', i.toString()], typeof option, _types__WEBPACK_IMPORTED_MODULE_0__.VALUE_TYPES);
}
}
}
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'input')) {
if (typeof candidate.input !== 'string')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'input'], typeof candidate.input, ['string']);
if (!_types__WEBPACK_IMPORTED_MODULE_0__.INPUT_FORMATS.includes(candidate.input))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.ValueError([...breadcrumbs, 'input'], candidate.input, _types__WEBPACK_IMPORTED_MODULE_0__.INPUT_FORMATS);
}
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'isActive') && typeof candidate.isActive !== 'boolean')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError([...breadcrumbs, 'isActive'], typeof candidate.isActive, ['boolean']);
if ((0,_index__WEBPACK_IMPORTED_MODULE_2__.hasOwnProperty)(candidate, 'children')) {
if (!isParent(breadcrumbs, candidate, isUserTree))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
(0,_index__WEBPACK_IMPORTED_MODULE_2__.validateUnexpectedKeys)(breadcrumbs, candidate, _types__WEBPACK_IMPORTED_MODULE_0__.MIDDLE_KEYS);
}
else {
(0,_index__WEBPACK_IMPORTED_MODULE_2__.validateUnexpectedKeys)(breadcrumbs, candidate, _types__WEBPACK_IMPORTED_MODULE_0__.LEAF_KEYS);
}
return true;
}
function isRoot(breadcrumbs, candidate, isUserTree = false) {
if (typeof candidate !== 'object')
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.TypeError(breadcrumbs, typeof candidate, ['object']);
if (!isParent(breadcrumbs, candidate, isUserTree))
throw new _errors__WEBPACK_IMPORTED_MODULE_1__.UnexpectedStateError();
(0,_index__WEBPACK_IMPORTED_MODULE_2__.validateUnexpectedKeys)(breadcrumbs, candidate, _types__WEBPACK_IMPORTED_MODULE_0__.ROOT_KEYS);
return true;
}
/***/ }),
/***/ "./ts/library/validation/trees/match.ts":
/*!**********************************************!*\
!*** ./ts/library/validation/trees/match.ts ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ validateParentMatch: () => (/* binding */ validateParentMatch),
/* harmony export */ validatePoolSizeMatch: () => (/* binding */ validatePoolSizeMatch),
/* harmony export */ validateSeeds: () => (/* binding */ validateSeeds)
/* harmony export */ });
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../errors */ "./ts/library/validation/errors.ts");
function mutateMatch(model, candidate, validate, property) {
try {
validate([], model, [], candidate);
}
catch (error) {
if (property in model) {
candidate[property] = model[property];
}
else {
delete candidate[property];
}
}
}
function validatePredicateMatch(isFrozen, modelBreadcrumbs, model, candidateBreadcrumbs, candidate) {
if ('predicate' in model !== 'predicate' in candidate)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PropertyError(candidateBreadcrumbs, 'predicate', 'predicate' in model);
if (typeof model.predicate !== typeof candidate.predicate)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...candidateBreadcrumbs, 'predicate'], typeof candidate.predicate, [typeof model.predicate]);
if (typeof model.predicate === 'object') {
const { length } = candidate.predicate;
if (!isFrozen && !model.predicate.includes(candidate.value)) {
candidate.value = model.predicate[candidate.predicate.indexOf(candidate.value)];
}
if (model.predicate.length !== length)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...candidateBreadcrumbs, 'predicate', 'length'], length, [model.predicate.length]);
for (const [i, option] of model.predicate.entries()) {
if (candidate.predicate[i] !== option)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...candidateBreadcrumbs, 'predicate', i.toString()], candidate.predicate[i], [option]);
}
}
}
function validateValueMatch(property, modelBreadcrumbs, model, candidateBreadcrumbs, candidate) {
if (property in model !== property in candidate)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PropertyError(candidateBreadcrumbs, property, property in model);
if (model[property] !== candidate[property])
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...candidateBreadcrumbs, property], candidate[property], [model[property]]);
}
// Tree validators
function validateParentMatch(modelBreadcrumbs, model, candidateBreadcrumbs, candidate, isFrozen = false) {
if (isFrozen) {
validateValueMatch('poolId', modelBreadcrumbs, model, candidateBreadcrumbs, candidate);
validateValueMatch('childPredicate', modelBreadcrumbs, model, candidateBreadcrumbs, candidate);
validateValueMatch('descendantPredicate', modelBreadcrumbs, model, candidateBreadcrumbs, candidate);
}
else {
mutateMatch(model, candidate, validateValueMatch.bind(null, 'poolId'), 'poolId');
if ('childPredicate' in model)
candidate.childPredicate = model.childPredicate;
if ('descendantPredicate' in model)
candidate.descendantPredicate = model.descendantPredicate;
if ('seed' in model)
candidate.seed = model.seed;
}
if ('seed' in model) {
if (isFrozen) {
validateChildMatch([...modelBreadcrumbs, 'seed'], model.seed, [...candidateBreadcrumbs, 'seed'], candidate.seed, true);
}
for (const [i, child] of candidate.children.entries()) {
validateChildMatch([...modelBreadcrumbs, 'seed'], model.seed, [...candidateBreadcrumbs, 'children', i.toString()], child, isFrozen);
}
}
else if (!('poolId' in model)) {
if (isFrozen && model.children.length !== candidate.children.length)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...candidateBreadcrumbs, 'children', 'length'], candidate.children.length, [model.children.length]);
if (model.children.length < candidate.children.length) {
candidate.children = candidate.children.slice(0, model.children.length);
}
for (const [i, child] of candidate.children.entries()) {
validateChildMatch([...modelBreadcrumbs, 'children', i.toString()], model.children[i], [...candidateBreadcrumbs, 'children', i.toString()], child, isFrozen);
}
if (model.children.length > candidate.children.length) {
candidate.children.push(...model.children.slice(candidate.children.length));
}
}
}
function validateChildMatch(modelBreadcrumbs, model, candidateBreadcrumbs, candidate, isFrozen = true) {
if ('value' in model !== 'value' in candidate) {
if (isFrozen || 'value' in candidate)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PropertyError(candidateBreadcrumbs, 'value', false);
candidate.value = model.value;
}
else {
if (typeof model.value !== typeof candidate.value)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...candidateBreadcrumbs, 'value'], typeof candidate.value, [typeof model.value]);
}
if (isFrozen) {
validateValueMatch('label', modelBreadcrumbs, model, candidateBreadcrumbs, candidate);
validatePredicateMatch(true, modelBreadcrumbs, model, candidateBreadcrumbs, candidate);
}
else {
if (typeof model.value !== typeof candidate.value)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...candidateBreadcrumbs, 'value'], typeof candidate.value, [typeof model.value]);
mutateMatch(model, candidate, validateValueMatch.bind(null, 'label'), 'label');
if ('predicate' in model)
candidate.predicate = model.predicate;
}
if ('children' in model !== 'children' in candidate)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PropertyError(candidateBreadcrumbs, 'children', 'children' in model);
if ('children' in model) {
validateParentMatch(modelBreadcrumbs, model, candidateBreadcrumbs, candidate, isFrozen);
}
}
function validateSeeds(breadcrumbs, node) {
if ('children' in node) {
if ('seed' in node) {
try {
for (const [i, child] of node.children.entries()) {
validateChildMatch([...breadcrumbs, 'seed'], node.seed, [...breadcrumbs, 'children', i.toString()], child);
}
}
catch (error) {
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.SeedMatchError(), error);
}
validateSeeds([...breadcrumbs, 'seed'], node.seed);
}
else {
for (const [i, child] of node.children.entries()) {
if ('isActive' in child && !child.isActive) {
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.DeactivatedError(), new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError([...breadcrumbs, 'children', i.toString(), 'isActive'], false, [true]));
}
}
}
for (const [i, child] of node.children.entries()) {
validateSeeds([...breadcrumbs, 'children', i.toString()], child);
}
}
}
function getPoolSizes(node, uncapped = false) {
const poolSizes = [];
uncapped = uncapped || 'seed' in node;
if ('poolId' in node) {
poolSizes[node.poolId] = uncapped ? -1 : node.children.length;
}
if ('children' in node) {
for (const child of node.children) {
const subPoolSizes = getPoolSizes(child, uncapped);
for (const id in subPoolSizes) {
if (subPoolSizes[id] < 0) {
poolSizes[id] = -1;
}
else if (id in poolSizes) {
poolSizes[id] += subPoolSizes[id];
}
else {
poolSizes[id] = subPoolSizes[id];
}
}
}
}
return poolSizes;
}
function validatePoolSizeMatch(model, candidate) {
const modelSizes = getPoolSizes(model);
const candidateSizes = getPoolSizes(candidate);
for (const id in modelSizes) {
if (modelSizes[id] !== candidateSizes[id])
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PoolSizeError(Number.parseInt(id), candidateSizes[id], modelSizes[id]);
}
}
/***/ }),
/***/ "./ts/library/validation/trees/pools.ts":
/*!**********************************************!*\
!*** ./ts/library/validation/trees/pools.ts ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ validatePools: () => (/* binding */ validatePools)
/* harmony export */ });
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../errors */ "./ts/library/validation/errors.ts");
function validatePools(breadcrumbs, node, ancestorPools = []) {
if ('poolId' in node) {
if (node.poolId in ancestorPools)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.PoolBranchError(ancestorPools[node.poolId], breadcrumbs, node.poolId);
// Slice maintains empty entries, so the 'in' operator still works
ancestorPools = ancestorPools.slice();
ancestorPools[node.poolId] = breadcrumbs;
}
if ('children' in node) {
// Recurse
for (const [i, child] of node.children.entries()) {
validatePools([...breadcrumbs, 'children', i.toString()], child, ancestorPools);
}
}
}
/***/ }),
/***/ "./ts/library/validation/trees/predicates.ts":
/*!***************************************************!*\
!*** ./ts/library/validation/trees/predicates.ts ***!
\***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ validateParent: () => (/* binding */ validateParent)
/* harmony export */ });
/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../errors */ "./ts/library/validation/errors.ts");
/* harmony import */ var _predicate__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @/predicate */ "./ts/predicate.ts");
var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
function getBoundPredicatePromise(response, { message }) {
return __awaiter(this, void 0, void 0, function* () {
try {
yield (0,_predicate__WEBPACK_IMPORTED_MODULE_1__.getPredicatePromise)(response);
}
catch (cause) {
throw new Error(message /* , {cause} */);
}
});
}
function validateValue(valueBreadcrumbs, value, predicateBreadcrumbs, predicate) {
return __awaiter(this, void 0, void 0, function* () {
if (typeof predicate === 'function') {
yield getBoundPredicatePromise(predicate(value), new _errors__WEBPACK_IMPORTED_MODULE_0__.PredicateError(predicateBreadcrumbs));
return;
}
if (!predicate.includes(value))
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.PredicateError(predicateBreadcrumbs), new _errors__WEBPACK_IMPORTED_MODULE_0__.ValueError(valueBreadcrumbs, value, predicate));
});
}
function validateChild(breadcrumbs, child) {
return __awaiter(this, void 0, void 0, function* () {
if (!('predicate' in child)) {
return;
}
if (!('value' in child)) {
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.HangingPredicateError(), new _errors__WEBPACK_IMPORTED_MODULE_0__.PropertyError(breadcrumbs, 'value', true));
}
if (Array.isArray(child.predicate)) {
if (child.predicate.length === 0)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.NoOptionsError(), new _errors__WEBPACK_IMPORTED_MODULE_0__.EmptyArrayError([...breadcrumbs, 'predicate']));
const type = typeof child.predicate[0];
for (let i = 1; i < child.predicate.length; ++i) {
if (typeof child.predicate[i] !== type)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.JoinedError(new _errors__WEBPACK_IMPORTED_MODULE_0__.MismatchedOptionsError(), new _errors__WEBPACK_IMPORTED_MODULE_0__.TypeError([...breadcrumbs, 'predicate', i.toString()], typeof child.predicate[i], [type]));
}
}
yield validateValue([...breadcrumbs, 'value'], child.value, [...breadcrumbs, 'predicate'], child.predicate);
});
}
function validateParent(breadcrumbs, parent) {
const promises = [];
if ('seed' in parent) {
const { seed } = parent;
promises.push(validateChild([...breadcrumbs, 'seed'], seed));
if ('children' in seed) {
promises.push(...validateParent([...breadcrumbs, 'seed'], seed));
}
}
const { children } = parent;
if ('poolId' in parent && Math.floor(parent.poolId) !== parent.poolId)
throw new _errors__WEBPACK_IMPORTED_MODULE_0__.NonIntegerError([...breadcrumbs, 'poolId']);
if ('childPredicate' in parent) {
promises.push(getBoundPredicatePromise(parent.childPredicate(children), new _errors__WEBPACK_IMPORTED_MODULE_0__.PredicateError([...breadcrumbs, 'childPredicate'])));
}
if ('descendantPredicate' in parent) {
promises.push(getBoundPredicatePromise(parent.descendantPredicate(children), new _errors__WEBPACK_IMPORTED_MODULE_0__.PredicateError([...breadcrumbs, 'descendantPredicate'])));
}
for (const [i, child] of children.entries()) {
const childBreadcrumbs = [...breadcrumbs, 'children', i.toString()];
promises.push(validateChild(childBreadcrumbs, child));
if ('children' in child) {
promises.push(...validateParent(childBreadcrumbs, child));
}
}
return promises;
}
/***/ }),
/***/ "./ts/library/validation/types.ts":
/*!****************************************!*\
!*** ./ts/library/validation/types.ts ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ CONFIG_KEYS: () => (/* binding */ CONFIG_KEYS),
/* harmony export */ CONTRAST_METHODS: () => (/* binding */ CONTRAST_METHODS),
/* harmony export */ INPUT_FORMATS: () => (/* binding */ INPUT_FORMATS),
/* harmony export */ LEAF_KEYS: () => (/* binding */ LEAF_KEYS),
/* harmony export */ MIDDLE_KEYS: () => (/* binding */ MIDDLE_KEYS),
/* harmony export */ PREDICATE_TYPES: () => (/* binding */ PREDICATE_TYPES),
/* harmony export */ ROOT_KEYS: () => (/* binding */ ROOT_KEYS),
/* harmony export */ VALUE_TYPES: () => (/* binding */ VALUE_TYPES)
/* harmony export */ });
// Value types
const VALUE_TYPES = ['boolean', 'number', 'string'];
const PREDICATE_TYPES = ['array', 'function'];
const INPUT_FORMATS = ['color', 'date', 'datetime-local', 'email', 'month', 'password', 'search', 'tel', 'text', 'time', 'url', 'week'];
const CONTRAST_METHODS = ['Black / White', 'Invert'];
// Node types
const LEAF_KEYS = ['label', 'value', 'predicate', 'input', 'isActive'];
const ROOT_KEYS = ['children', 'seed', 'childPredicate', 'descendantPredicate', 'poolId'];
const MIDDLE_KEYS = [...LEAF_KEYS, ...ROOT_KEYS];
// Config type
const CONFIG_KEYS = ['title', 'defaultTree', 'userTree', 'defaultStyle', 'userStyles'];
/***/ }),
/***/ "./ts/modal/body/consts.ts":
/*!*********************************!*\
!*** ./ts/modal/body/consts.ts ***!
\*********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ MODAL_BODY_ID: () => (/* binding */ MODAL_BODY_ID)
/* harmony export */ });
const MODAL_BODY_ID = 'modal-body';
/***/ }),
/***/ "./ts/modal/body/css.ts":
/*!******************************!*\
!*** ./ts/modal/body/css.ts ***!
\******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_BODY_ID}`, [
['overflow', 'hidden'],
['position', 'relative'],
]);
}
/***/ }),
/***/ "./ts/modal/body/index.ts":
/*!********************************!*\
!*** ./ts/modal/body/index.ts ***!
\********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ reset: () => (/* binding */ reset)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/consts.ts");
/* harmony import */ var _trees__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./trees */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/body/css.ts");
/* harmony import */ var _trees_style__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./trees/style */ "./ts/modal/body/trees/style/index.ts");
/* harmony import */ var _trees_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./trees/data */ "./ts/modal/body/trees/data/index.ts");
/* harmony import */ var _trees_style_update__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./trees/style/update */ "./ts/modal/body/trees/style/update/index.ts");
/* harmony import */ var _nodes_actions_highlight__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @nodes/actions/highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _nodes_actions_active__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @nodes/actions/active */ "./ts/modal/body/trees/nodes/actions/active.ts");
let resetTree;
function generate({ userTree, defaultTree, userStyles, defaultStyle }) {
resetTree = defaultTree;
(0,_trees_style_update__WEBPACK_IMPORTED_MODULE_5__["default"])((0,_trees_style__WEBPACK_IMPORTED_MODULE_3__.getActiveStyle)(userStyles, defaultStyle));
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
const element = document.createElement('div');
element.id = _consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_BODY_ID;
element.append((0,_trees__WEBPACK_IMPORTED_MODULE_1__["default"])(userTree !== null && userTree !== void 0 ? userTree : defaultTree, userStyles, defaultStyle), (0,_nodes_actions_highlight__WEBPACK_IMPORTED_MODULE_6__.generateEave)());
(0,_nodes_actions_highlight__WEBPACK_IMPORTED_MODULE_6__.onMount)();
(0,_nodes_actions_active__WEBPACK_IMPORTED_MODULE_7__.onMount)();
return element;
}
function reset() {
(0,_trees_data__WEBPACK_IMPORTED_MODULE_4__.setTree)(resetTree);
}
/***/ }),
/***/ "./ts/modal/body/trees/consts.ts":
/*!***************************************!*\
!*** ./ts/modal/body/trees/consts.ts ***!
\***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ TREE_CONTAINER_ID: () => (/* binding */ TREE_CONTAINER_ID)
/* harmony export */ });
const TREE_CONTAINER_ID = 'tree-container';
/***/ }),
/***/ "./ts/modal/body/trees/css.ts":
/*!************************************!*\
!*** ./ts/modal/body/trees/css.ts ***!
\************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../css */ "./ts/modal/css.ts");
/* harmony import */ var _nodes_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @nodes/css */ "./ts/modal/body/trees/nodes/css.ts");
/* harmony import */ var _nodes_actions_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @nodes/actions/css */ "./ts/modal/body/trees/nodes/actions/css.ts");
function generate() {
(0,_nodes_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_nodes_actions_css__WEBPACK_IMPORTED_MODULE_3__["default"])();
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.TREE_CONTAINER_ID}`, [
['height', '60vh'],
['overflow-y', 'auto'],
['overscroll-behavior', 'contain'],
['display', 'flex'],
['background-color', `var(--nodeBase0)`],
]);
}
/***/ }),
/***/ "./ts/modal/body/trees/data/consts.ts":
/*!********************************************!*\
!*** ./ts/modal/body/trees/data/consts.ts ***!
\********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ROOT_ID: () => (/* binding */ ROOT_ID)
/* harmony export */ });
const ROOT_ID = 'root-data';
/***/ }),
/***/ "./ts/modal/body/trees/data/index.ts":
/*!*******************************************!*\
!*** ./ts/modal/body/trees/data/index.ts ***!
\*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ getRoot: () => (/* binding */ getRoot),
/* harmony export */ setTree: () => (/* binding */ setTree)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/data/consts.ts");
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../index */ "./ts/modal/body/trees/index.ts");
function getRoot() {
return _index__WEBPACK_IMPORTED_MODULE_1__.ROOTS[_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_ID];
}
function setTree(data) {
const root = getRoot();
// Spread is necessary to avoid a shrinking iterable
for (const child of [...root.children]) {
child.disconnect();
}
root.addChildren(data.children);
}
function generate(data) {
return (0,_index__WEBPACK_IMPORTED_MODULE_1__.generateTree)(data, _consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_ID);
}
/***/ }),
/***/ "./ts/modal/body/trees/index.ts":
/*!**************************************!*\
!*** ./ts/modal/body/trees/index.ts ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ROOTS: () => (/* binding */ ROOTS),
/* harmony export */ TREE_CONTAINER: () => (/* binding */ TREE_CONTAINER),
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ generateTree: () => (/* binding */ generateTree),
/* harmony export */ setActive: () => (/* binding */ setActive)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/consts.ts");
/* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./style */ "./ts/modal/body/trees/style/index.ts");
/* harmony import */ var _data__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./data */ "./ts/modal/body/trees/data/index.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./css */ "./ts/modal/body/trees/css.ts");
/* harmony import */ var _nodes_root__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./nodes/root */ "./ts/modal/body/trees/nodes/root.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../consts */ "./ts/modal/consts.ts");
const ROOTS = {};
const TREE_CONTAINER = document.createElement('div');
function setActive(button, actionId, doActivate = true) {
if (doActivate) {
button.classList.add(_consts__WEBPACK_IMPORTED_MODULE_5__.BUTTON_ACTIVE_CLASS);
TREE_CONTAINER.classList.add(actionId);
}
else {
button.classList.remove(_consts__WEBPACK_IMPORTED_MODULE_5__.BUTTON_ACTIVE_CLASS);
TREE_CONTAINER.classList.remove(actionId);
}
}
function generateTree(data, id) {
if (ROOTS[id]) {
throw new Error(`Attempted to instantiate second tree with id '${id}'.`);
}
const root = new _nodes_root__WEBPACK_IMPORTED_MODULE_4__["default"](data);
root.element.elementContainer.id = id;
ROOTS[id] = root;
return root.element.elementContainer;
}
function generate(data, userStyles, defaultStyle) {
(0,_css__WEBPACK_IMPORTED_MODULE_3__["default"])();
TREE_CONTAINER.id = _consts__WEBPACK_IMPORTED_MODULE_0__.TREE_CONTAINER_ID;
TREE_CONTAINER.append((0,_style__WEBPACK_IMPORTED_MODULE_1__["default"])(userStyles, defaultStyle), (0,_data__WEBPACK_IMPORTED_MODULE_2__["default"])(data));
return TREE_CONTAINER;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/active.ts":
/*!*****************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/active.ts ***!
\*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ onMount: () => (/* binding */ onMount),
/* harmony export */ register: () => (/* binding */ register),
/* harmony export */ reset: () => (/* binding */ reset)
/* harmony export */ });
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _highlight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _focus__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _buttons_position__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./buttons/position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal */ "./ts/modal/index.ts");
function register() {
_edit__WEBPACK_IMPORTED_MODULE_0__.reset();
}
function reset() {
for (const action of [_edit__WEBPACK_IMPORTED_MODULE_0__, _buttons_position__WEBPACK_IMPORTED_MODULE_3__, _focus__WEBPACK_IMPORTED_MODULE_2__, _highlight__WEBPACK_IMPORTED_MODULE_1__]) {
if (action.isActive()) {
action.reset();
return true;
}
}
return false;
}
function onMount() {
(0,_modal__WEBPACK_IMPORTED_MODULE_4__.getSocket)().addEventListener('keydown', (event) => {
if (event.key === 'Escape' && reset()) {
event.stopPropagation();
}
});
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/button.ts":
/*!*************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/button.ts ***!
\*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addActionButton: () => (/* binding */ addActionButton),
/* harmony export */ getNewButton: () => (/* binding */ getNewButton)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _active__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../active */ "./ts/modal/body/trees/nodes/actions/active.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
/* harmony import */ var _modal_header_actions_alternate__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/header/actions/alternate */ "./ts/modal/header/actions/alternate/index.ts");
// Creates an instantiation & adds it to the DOM
function addActionButton(template, onClick, node) {
const button = template.cloneNode(true);
button.addEventListener('click', (event) => {
event.stopPropagation();
_active__WEBPACK_IMPORTED_MODULE_1__.register();
onClick(node, button, (0,_modal_header_actions_alternate__WEBPACK_IMPORTED_MODULE_3__.isActive)());
});
button.addEventListener('keydown', (event) => {
// Prevent button presses via the Enter key from triggering actions
if (event.key === 'Enter') {
event.stopPropagation();
}
});
button.addEventListener('mouseleave', () => {
button.blur();
});
node.element.addButton(button);
return button;
}
// Creates a template
const getNewButton = (function () {
const buttonTemplate = document.createElement('button');
buttonTemplate.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS);
// Prevent tabbing to buttons until node is focused
buttonTemplate.setAttribute('tabIndex', '-1');
const svgTemplate = (() => {
const circle = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'circle');
circle.setAttribute('r', '50');
circle.setAttribute('stroke-width', '10');
const svg = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'svg');
svg.setAttribute('viewBox', '-70 -70 140 140');
svg.append(circle);
return svg;
})();
return function (group, actionId, description) {
const button = buttonTemplate.cloneNode(true);
const svg = svgTemplate.cloneNode(true);
button.classList.add(actionId);
button.title = description;
svg.append(group);
button.append(svg);
return button;
};
})();
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts":
/*!*************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/consts.ts ***!
\*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ALT_CLASS: () => (/* binding */ ALT_CLASS),
/* harmony export */ BUTTON_CLASS: () => (/* binding */ BUTTON_CLASS),
/* harmony export */ PROSPECTIVE_CLASS: () => (/* binding */ PROSPECTIVE_CLASS)
/* harmony export */ });
const BUTTON_CLASS = 'node-button';
const ALT_CLASS = 'node-icon-alt';
const PROSPECTIVE_CLASS = 'node-prospective';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/create/button.ts":
/*!********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/create/button.ts ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/create/consts.ts");
/* harmony import */ var _position_button_alt__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../position/button/alt */ "./ts/modal/body/trees/nodes/actions/buttons/position/button/alt.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const lineHorizontal = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
lineHorizontal.setAttribute('stroke-linecap', 'round');
lineHorizontal.setAttribute('stroke-width', '12');
lineHorizontal.setAttribute('x1', '-25');
lineHorizontal.setAttribute('x2', '25');
const lineVertical = lineHorizontal.cloneNode(true);
lineVertical.setAttribute('transform', 'rotate(90)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(lineHorizontal, lineVertical);
const BUTTON = (0,_position_button_alt__WEBPACK_IMPORTED_MODULE_1__.getPositionedButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Create', { scale: '1 1.15' });
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/create/consts.ts":
/*!********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/create/consts.ts ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID)
/* harmony export */ });
const ACTION_ID = 'node-create';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/create/css.ts":
/*!*****************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/create/css.ts ***!
\*****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/create/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/body/trees/nodes/actions/buttons/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--nodeButtonCreate');
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/create/index.ts":
/*!*******************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/create/index.ts ***!
\*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/create/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button */ "./ts/modal/body/trees/nodes/actions/buttons/create/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _position__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../tooltip */ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts");
/* harmony import */ var _nodes_middle__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @nodes/middle */ "./ts/modal/body/trees/nodes/middle.ts");
/* harmony import */ var _nodes_child__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @nodes/child */ "./ts/modal/body/trees/nodes/child.ts");
let activeNode;
function reset() {
if (!activeNode) {
return;
}
_position__WEBPACK_IMPORTED_MODULE_4__.reset();
activeNode = undefined;
}
function getChild(node) {
const { seed } = node;
const child = 'children' in seed ? new _nodes_middle__WEBPACK_IMPORTED_MODULE_7__["default"](seed, node, 0) : new _nodes_child__WEBPACK_IMPORTED_MODULE_8__["default"](seed, node, 0);
child.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
return child;
}
function doAction(source, parent, index, button, doScroll = true) {
const child = getChild(source);
child.move(parent, index);
Promise.all((0,_edit__WEBPACK_IMPORTED_MODULE_5__.getSubPredicateResponses)(parent))
.then(() => {
child.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
child.isActive = true;
reset();
if (doScroll) {
// Show the new node
child.element.scrollIntoView();
}
})
.catch((reason) => {
child.disconnect();
if (reason) {
(0,_tooltip__WEBPACK_IMPORTED_MODULE_6__.show)(reason, button);
}
});
}
function onClick(node, button, isAlt) {
const previousNode = activeNode;
reset();
if (!isAlt) {
doAction(node, node, 0, button, false);
}
else if (!previousNode || node !== previousNode) {
activeNode = node;
_position__WEBPACK_IMPORTED_MODULE_4__.mount(node, node.seed, node, node.children, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, button, doAction, false);
}
}
function mount(node) {
(0,_button__WEBPACK_IMPORTED_MODULE_3__.addActionButton)(_button__WEBPACK_IMPORTED_MODULE_1__["default"], onClick, node);
}
function shouldMount(node) {
return 'seed' in node;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/css.ts":
/*!**********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/css.ts ***!
\**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addColourRule: () => (/* binding */ addColourRule),
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _create_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./create/css */ "./ts/modal/body/trees/nodes/actions/buttons/create/css.ts");
/* harmony import */ var _move_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./move/css */ "./ts/modal/body/trees/nodes/actions/buttons/move/css.ts");
/* harmony import */ var _disable_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./disable/css */ "./ts/modal/body/trees/nodes/actions/buttons/disable/css.ts");
/* harmony import */ var _duplicate_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./duplicate/css */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/css.ts");
/* harmony import */ var _position_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./position/css */ "./ts/modal/body/trees/nodes/actions/buttons/position/css.ts");
/* harmony import */ var _focus_consts__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../focus/consts */ "./ts/modal/body/trees/nodes/actions/focus/consts.ts");
/* harmony import */ var _highlight_consts__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../highlight/consts */ "./ts/modal/body/trees/nodes/actions/highlight/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @/modal/body/trees/style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_header_actions_alternate_consts__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @/modal/header/actions/alternate/consts */ "./ts/modal/header/actions/alternate/consts.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function addColourRule(actionId, strokeVar) {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)([
`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_focus_consts__WEBPACK_IMPORTED_MODULE_6__.FOCUS_SOURCE_CLASS}):not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER} `
+ `.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}.${actionId} > svg`,
], ['fill', `var(${strokeVar})`]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)([
`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_focus_consts__WEBPACK_IMPORTED_MODULE_6__.FOCUS_SOURCE_CLASS}):not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER} `
+ `.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}.${actionId}:not(.${_modal_consts__WEBPACK_IMPORTED_MODULE_11__.BUTTON_ACTIVE_CLASS}) > svg > g`,
], ['stroke', `none`]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER} > `
+ `.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}.${actionId}.${_modal_consts__WEBPACK_IMPORTED_MODULE_11__.BUTTON_ACTIVE_CLASS} > svg > g`, ['stroke', `var(${strokeVar})`]);
}
function generate() {
(0,_create_css__WEBPACK_IMPORTED_MODULE_1__["default"])();
(0,_move_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_disable_css__WEBPACK_IMPORTED_MODULE_3__["default"])();
(0,_duplicate_css__WEBPACK_IMPORTED_MODULE_4__["default"])();
(0,_position_css__WEBPACK_IMPORTED_MODULE_5__["default"])();
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}`, [
['height', '100%'],
['position', 'relative'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS} > svg`, [
['height', '100%'],
['transform', 'scale(1.05)'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER}`, ['white-space', 'nowrap']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(${_focus_consts__WEBPACK_IMPORTED_MODULE_6__.FOCUS_SOURCE_CLASS}):not(${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > ${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER} circle`, ['stroke', 'transparent']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(
// Not focused, not hovered
`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_focus_consts__WEBPACK_IMPORTED_MODULE_6__.FOCUS_SOURCE_CLASS}):not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER} svg`, [['fill', 'none']]);
// Hide prospective nodes
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.PROSPECTIVE_CLASS}`, ['display', 'none']);
// Hide alt icon components
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ALT_CLASS}:not(.${_modal_header_actions_alternate_consts__WEBPACK_IMPORTED_MODULE_10__.ACTION_ID} *)`, ['display', 'none']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_12__.addRule)(`.${_modal_header_actions_alternate_consts__WEBPACK_IMPORTED_MODULE_10__.ACTION_ID} button.${_consts__WEBPACK_IMPORTED_MODULE_0__.ALT_CLASS} + *`, ['display', 'none']);
(0,_modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_9__.addDepthChangeListener)((depth, addRule) => {
const depthSelector = `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.DEPTH_CLASS_PREFIX}${depth} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_8__.ELEMENT_CLASSES.BUTTON_CONTAINER}`;
addRule(`${depthSelector} svg`, ['stroke', `var(--nodeBase${depth})`]);
addRule([
// Not active, focused
`${depthSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:focus > svg`,
`${depthSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:hover > svg`,
`.${_highlight_consts__WEBPACK_IMPORTED_MODULE_7__.HIGHLIGHT_CLASS}${depthSelector} .${_modal_consts__WEBPACK_IMPORTED_MODULE_11__.BUTTON_ACTIVE_CLASS} > svg`,
], [
['stroke', `var(--nodeContrast${depth})`],
['fill', `var(--nodeBase${depth})`],
]);
});
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/disable/button.ts":
/*!*********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/disable/button.ts ***!
\*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BUTTON_ALT: () => (/* binding */ BUTTON_ALT),
/* harmony export */ BUTTON_DEFAULT: () => (/* binding */ BUTTON_DEFAULT)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const gDefault = (() => {
const circle = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_3__.SVG_NAMESPACE, 'circle');
circle.setAttribute('r', '30');
circle.setAttribute('stroke-width', '10');
const line = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_3__.SVG_NAMESPACE, 'line');
line.setAttribute('stroke-linecap', 'round');
line.setAttribute('stroke-width', '10');
line.setAttribute('x1', '-30');
line.setAttribute('x2', '30');
line.setAttribute('transform', 'rotate(45)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_3__.SVG_NAMESPACE, 'g');
g.append(circle, line);
return g;
})();
const BUTTON_DEFAULT = (0,_button__WEBPACK_IMPORTED_MODULE_2__.getNewButton)(gDefault, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID_DEFAULT, 'Toggle Enabled');
const gAlt = (() => {
const line0 = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_3__.SVG_NAMESPACE, 'line');
line0.setAttribute('stroke-linecap', 'round');
line0.setAttribute('stroke-width', '12');
line0.setAttribute('x1', '-20');
line0.setAttribute('x2', '20');
line0.setAttribute('y1', '-20');
line0.setAttribute('y2', '20');
const line1 = line0.cloneNode(true);
line1.setAttribute('transform', 'rotate(90)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_3__.SVG_NAMESPACE, 'g');
g.append(line0, line1);
return g;
})();
const BUTTON_ALT = (0,_button__WEBPACK_IMPORTED_MODULE_2__.getNewButton)(gAlt, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID_ALT, 'Delete');
BUTTON_ALT.classList.add(_consts__WEBPACK_IMPORTED_MODULE_1__.ALT_CLASS);
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts":
/*!*********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts ***!
\*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID_ALT: () => (/* binding */ ACTION_ID_ALT),
/* harmony export */ ACTION_ID_DEFAULT: () => (/* binding */ ACTION_ID_DEFAULT),
/* harmony export */ DISABLED_CLASS: () => (/* binding */ DISABLED_CLASS)
/* harmony export */ });
const ACTION_ID_DEFAULT = 'node-active';
const ACTION_ID_ALT = 'node-delete';
const DISABLED_CLASS = 'node-disable';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/disable/css.ts":
/*!******************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/disable/css.ts ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/body/trees/nodes/actions/buttons/css.ts");
/* harmony import */ var _highlight_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../highlight/consts */ "./ts/modal/body/trees/nodes/actions/highlight/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID_DEFAULT, '--nodeButtonDisable');
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID_ALT, '--nodeButtonDelete');
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)([
// Self selectors
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS}:not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_2__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.VALUE_CONTAINER} > *`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS}:not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_2__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.LABEL_CONTAINER} > *`,
// Descendant selectors
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS} :not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_2__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.VALUE_CONTAINER} > *`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS} :not(.${_highlight_consts__WEBPACK_IMPORTED_MODULE_2__.HIGHLIGHT_CLASS}) > `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.HEAD_CONTAINER} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_3__.ELEMENT_CLASSES.LABEL_CONTAINER} > *`,
], ['opacity', '0.5']);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/disable/index.ts":
/*!********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/disable/index.ts ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button */ "./ts/modal/body/trees/nodes/actions/buttons/disable/button.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../tooltip */ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
function updateButton(button, isActive) {
button.classList[isActive ? 'remove' : 'add'](_modal_consts__WEBPACK_IMPORTED_MODULE_5__.BUTTON_ACTIVE_CLASS);
}
function toggle(node) {
node.element[`${node.isActive ? 'add' : 'remove'}Class`](_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS);
node.isActive = !node.isActive;
}
function onClick(node, button, isAlt) {
toggle(node);
Promise.all((0,_edit__WEBPACK_IMPORTED_MODULE_3__.getSubPredicateResponses)(node.parent))
.then(() => {
if (isAlt) {
// TODO set up a way to confirm (tooltip + yes/no buttons? require extra button click?)
node.disconnect();
}
else {
updateButton(button, node.isActive);
}
})
.catch((reason) => {
toggle(node);
if (typeof reason === 'string') {
_tooltip__WEBPACK_IMPORTED_MODULE_4__.show(reason, button);
}
});
}
function mount(node) {
(0,_button__WEBPACK_IMPORTED_MODULE_2__.addActionButton)(_button__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ALT, onClick, node);
const defaultButton = (0,_button__WEBPACK_IMPORTED_MODULE_2__.addActionButton)(_button__WEBPACK_IMPORTED_MODULE_1__.BUTTON_DEFAULT, onClick, node);
if (!node.isActive) {
node.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.DISABLED_CLASS);
updateButton(defaultButton, false);
}
}
function shouldMount(node) {
return 'seed' in node.parent;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/button.ts":
/*!***********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/duplicate/button.ts ***!
\***********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/consts.ts");
/* harmony import */ var _position_button_alt__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../position/button/alt */ "./ts/modal/body/trees/nodes/actions/buttons/position/button/alt.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const RADIUS = 15;
const HEIGHT = 25;
const WIDTH = 10;
const outline0 = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
outline0.setAttribute('stroke-linecap', 'round');
outline0.setAttribute('stroke-width', '8');
outline0.setAttribute('fill', 'none');
outline0.setAttribute('d', `M ${WIDTH / 2 + RADIUS} ${-HEIGHT / 2}`
+ `q 0,-${RADIUS} -${RADIUS},-${RADIUS}`
+ `h -${WIDTH}`
+ `q -${RADIUS},0 -${RADIUS},${RADIUS}`
+ `v ${HEIGHT}`
+ `q 0,${RADIUS} ${RADIUS},${RADIUS}`);
outline0.setAttribute('transform', `translate(-${RADIUS / 2}, -${RADIUS / 2})`);
const outline1 = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
outline1.setAttribute('stroke-linecap', 'round');
outline1.setAttribute('stroke-width', '8');
outline1.setAttribute('fill', 'none');
outline1.setAttribute('d', `M ${WIDTH / 2 + RADIUS} ${-HEIGHT / 2}`
+ `q 0,-${RADIUS} -${RADIUS},-${RADIUS}`
+ `h -${WIDTH}`
+ `q -${RADIUS},0 -${RADIUS},${RADIUS}`
+ `v ${HEIGHT}`
+ `q 0,${RADIUS} ${RADIUS},${RADIUS}`
+ `h ${WIDTH}`
+ `q ${RADIUS},0 ${RADIUS},-${RADIUS}`
+ `v -${HEIGHT}`);
outline1.setAttribute('transform', `translate(${RADIUS / 2}, ${RADIUS / 2})`);
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.setAttribute('transform', `rotate(10)`);
g.append(outline0, outline1);
const BUTTON = (0,_position_button_alt__WEBPACK_IMPORTED_MODULE_1__.getPositionedButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Duplicate', { scale: 0.6, translate: '10 16', rotate: 10 });
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/consts.ts":
/*!***********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/duplicate/consts.ts ***!
\***********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID)
/* harmony export */ });
const ACTION_ID = 'node-copy';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/css.ts":
/*!********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/duplicate/css.ts ***!
\********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/body/trees/nodes/actions/buttons/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--nodeButtonDuplicate');
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/index.ts":
/*!**********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/duplicate/index.ts ***!
\**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _position__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../tooltip */ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts");
let activeNode;
function reset() {
if (!activeNode) {
return;
}
_position__WEBPACK_IMPORTED_MODULE_4__.reset();
activeNode = undefined;
}
function validate(copy, button, doScroll = true) {
Promise.all((0,_edit__WEBPACK_IMPORTED_MODULE_5__.getSubPredicateResponses)(copy.parent))
.then(() => {
copy.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
reset();
if (doScroll) {
// Show the new node
copy.element.scrollIntoView();
}
})
.catch((reason) => {
copy.disconnect();
if (reason) {
(0,_tooltip__WEBPACK_IMPORTED_MODULE_6__.show)(reason, button);
}
});
}
function getCopy(node) {
const copy = node.duplicate();
copy.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
return copy;
}
function doAction(node, parent, index, button) {
const copy = getCopy(node);
copy.move(parent, index);
validate(copy, button);
}
function onClick(node, button, isAlt) {
const previousNode = activeNode;
reset();
if (!isAlt) {
validate(getCopy(node), button, false);
}
else if (!previousNode || node !== previousNode) {
activeNode = node;
_position__WEBPACK_IMPORTED_MODULE_4__.mount(node, node, node.parent, node.getSiblings(), _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, button, doAction);
}
}
function mount(node) {
(0,_button__WEBPACK_IMPORTED_MODULE_3__.addActionButton)(_button__WEBPACK_IMPORTED_MODULE_1__["default"], onClick, node);
}
function shouldMount(node) {
return 'seed' in node.parent;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/move/button.ts":
/*!******************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/move/button.ts ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/move/consts.ts");
/* harmony import */ var _position_button_alt__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../position/button/alt */ "./ts/modal/body/trees/nodes/actions/buttons/position/button/alt.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const arrowTrunk = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowTrunk.setAttribute('stroke-linecap', 'round');
arrowTrunk.setAttribute('stroke-width', '10');
arrowTrunk.setAttribute('y1', '-30');
arrowTrunk.setAttribute('y2', '30');
const arrowBottomLeft = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowBottomLeft.setAttribute('stroke-linecap', 'round');
arrowBottomLeft.setAttribute('stroke-width', '10');
arrowBottomLeft.setAttribute('x2', '-12');
arrowBottomLeft.setAttribute('y1', '27');
arrowBottomLeft.setAttribute('y2', '15');
const arrowBottomRight = arrowBottomLeft.cloneNode(true);
arrowBottomRight.setAttribute('x2', '12');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(arrowTrunk, arrowBottomLeft, arrowBottomRight);
const BUTTON = (0,_position_button_alt__WEBPACK_IMPORTED_MODULE_1__.getPositionedButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Move');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/move/consts.ts":
/*!******************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/move/consts.ts ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID)
/* harmony export */ });
const ACTION_ID = 'node-move';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/move/css.ts":
/*!***************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/move/css.ts ***!
\***************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/move/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/body/trees/nodes/actions/buttons/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--nodeButtonMove');
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/move/index.ts":
/*!*****************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/move/index.ts ***!
\*****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount),
/* harmony export */ unmount: () => (/* binding */ unmount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/move/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button */ "./ts/modal/body/trees/nodes/actions/buttons/move/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _position__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../tooltip */ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts");
let activeNode;
function reset() {
if (!activeNode) {
return;
}
_position__WEBPACK_IMPORTED_MODULE_4__.reset();
activeNode = undefined;
}
function doAction(node, newParent, index, button, doScroll = true) {
const oldParent = node.parent;
const copy = node.duplicate();
copy.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
copy.move(newParent, index);
node.isActive = false;
Promise.all([
...(0,_edit__WEBPACK_IMPORTED_MODULE_5__.getSubPredicateResponses)(oldParent),
...(oldParent === newParent ? [] : (0,_edit__WEBPACK_IMPORTED_MODULE_5__.getSubPredicateResponses)(newParent)),
])
.then(() => {
copy.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_2__.PROSPECTIVE_CLASS);
node.disconnect();
reset();
if (doScroll) {
// Show where the node's been moved to
copy.element.scrollIntoView();
}
})
.catch((reason) => {
node.isActive = copy.isActive;
copy.disconnect();
if (reason) {
_tooltip__WEBPACK_IMPORTED_MODULE_6__.show(reason, button);
}
});
}
function onClick(node, button, isAlt) {
const previousNode = activeNode;
reset();
if (!isAlt) {
const newIndex = node.getIndex() + 2;
if (newIndex < node.parent.children.length + 1) {
doAction(node, node.parent, newIndex, button, false);
}
else {
_tooltip__WEBPACK_IMPORTED_MODULE_6__.show('Node can not be moved down.', button);
}
}
else if (!previousNode || node !== previousNode) {
// If the only valid target is the current parent
if (_position__WEBPACK_IMPORTED_MODULE_4__.hasDestinations(node)) {
activeNode = node;
_position__WEBPACK_IMPORTED_MODULE_4__.mount(node, node, node.parent, node.getSiblings(), _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, button, doAction, false);
}
else {
_tooltip__WEBPACK_IMPORTED_MODULE_6__.show('No other valid locations found.', button);
}
}
}
function unmount(node) {
if (activeNode && node === activeNode) {
reset();
}
}
function mount(node) {
(0,_button__WEBPACK_IMPORTED_MODULE_3__.addActionButton)(_button__WEBPACK_IMPORTED_MODULE_1__["default"], onClick, node);
}
function shouldMount(node) {
return Boolean(node.parent.seed) || ('poolId' in node.parent);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/position/button/alt.ts":
/*!**************************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/position/button/alt.ts ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ getPositionedButton: () => (/* binding */ getPositionedButton)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const G_ALT = (() => {
const arrowTrunk = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowTrunk.setAttribute('stroke-linecap', 'round');
arrowTrunk.setAttribute('stroke-width', '10');
arrowTrunk.setAttribute('y1', '-30');
arrowTrunk.setAttribute('y2', '30');
const arrowBottomLeft = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowBottomLeft.setAttribute('stroke-linecap', 'round');
arrowBottomLeft.setAttribute('stroke-width', '10');
arrowBottomLeft.setAttribute('x2', '-12');
arrowBottomLeft.setAttribute('y1', '27');
arrowBottomLeft.setAttribute('y2', '15');
const arrowBottomRight = arrowBottomLeft.cloneNode(true);
arrowBottomRight.setAttribute('x2', '12');
const arrowTopRight = arrowBottomLeft.cloneNode(true);
arrowTopRight.setAttribute('transform', 'rotate(180)');
const arrowTopLeft = arrowBottomRight.cloneNode(true);
arrowTopLeft.setAttribute('transform', 'rotate(180)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ALT_CLASS);
g.append(arrowTrunk, arrowBottomLeft, arrowBottomRight, arrowTopRight, arrowTopLeft);
return g;
})();
function getPositionedButton(gDefault, actionId, description, transform = {}) {
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
const gAlt = G_ALT.cloneNode(true);
gAlt.setAttribute('transform', Object.entries(transform).map(([key, value]) => `${key}(${value})`).join(' '));
g.append(gAlt, gDefault);
return (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, actionId, description);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/position/button/index.ts":
/*!****************************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/position/button/index.ts ***!
\****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BUTTON_PARENT: () => (/* binding */ BUTTON_PARENT),
/* harmony export */ BUTTON_SIBLING: () => (/* binding */ BUTTON_SIBLING)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/buttons/position/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const arrowTrunk = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowTrunk.setAttribute('stroke-linecap', 'round');
arrowTrunk.setAttribute('stroke-width', '10');
arrowTrunk.setAttribute('y1', '-30');
arrowTrunk.setAttribute('y2', '30');
const arrowBottomLeft = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
arrowBottomLeft.setAttribute('stroke-linecap', 'round');
arrowBottomLeft.setAttribute('stroke-width', '10');
arrowBottomLeft.setAttribute('x2', '-12');
arrowBottomLeft.setAttribute('y1', '27');
arrowBottomLeft.setAttribute('y2', '15');
const arrowBottomRight = arrowBottomLeft.cloneNode(true);
arrowBottomRight.setAttribute('x2', '12');
const gMain = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
gMain.append(arrowTrunk, arrowBottomLeft, arrowBottomRight);
const gSibling = gMain.cloneNode(true);
const BUTTON_SIBLING = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(gSibling, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Select After');
const gParent = gMain.cloneNode(true);
gParent.setAttribute('transform', 'rotate(-45)');
const BUTTON_PARENT = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(gParent, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Select Into');
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/position/consts.ts":
/*!**********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/position/consts.ts ***!
\**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID)
/* harmony export */ });
const ACTION_ID = 'node-position';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/position/css.ts":
/*!*******************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/position/css.ts ***!
\*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/position/consts.ts");
/* harmony import */ var _focus_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../focus/consts */ "./ts/modal/body/trees/nodes/actions/focus/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ROOT_CLASS}.${_focus_consts__WEBPACK_IMPORTED_MODULE_1__.FOCUS_CLASS} `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_focus_consts__WEBPACK_IMPORTED_MODULE_1__.FOCUS_CLASS})`, ['display', 'none']);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts":
/*!*********************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/buttons/position/index.ts ***!
\*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ getButton: () => (/* binding */ getButton),
/* harmony export */ hasDestinations: () => (/* binding */ hasDestinations),
/* harmony export */ isActive: () => (/* binding */ isActive),
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ reset: () => (/* binding */ reset)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/buttons/position/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button */ "./ts/modal/body/trees/nodes/actions/buttons/position/button/index.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../button */ "./ts/modal/body/trees/nodes/actions/buttons/button.ts");
/* harmony import */ var _focus__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _highlight__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const destinations = [];
let origin;
function isActive() {
return Boolean(origin);
}
function setActive(doActivate = true) {
(0,_modal_body_trees__WEBPACK_IMPORTED_MODULE_5__.setActive)(origin.button, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, doActivate);
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.reset)();
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.focus)(doActivate, origin.source, false);
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.focusBranch)(doActivate, origin.source, doActivate);
if (doActivate) {
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.setTabIndexes)(false, origin.source);
origin.button.setAttribute('tabIndex', '1');
}
else {
origin.button.setAttribute('tabIndex', '-1');
}
origin.source.element.headContainer.focus();
}
function reset() {
if (!origin) {
return;
}
for (const { node, isParent, button } of destinations) {
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.focusBranch)(false, node, isParent);
button.remove();
}
destinations.length = 0;
(0,_highlight__WEBPACK_IMPORTED_MODULE_4__.removeSustained)(origin.source);
setActive(false);
origin = undefined;
}
function getButton(node, actionId, onClick, isParent) {
const button = (0,_button__WEBPACK_IMPORTED_MODULE_2__.addActionButton)(isParent ? _button__WEBPACK_IMPORTED_MODULE_1__.BUTTON_PARENT : _button__WEBPACK_IMPORTED_MODULE_1__.BUTTON_SIBLING, onClick, node);
button.classList.add(actionId);
button.classList.add(_modal_consts__WEBPACK_IMPORTED_MODULE_6__.BUTTON_ACTIVE_CLASS);
button.setAttribute('tabIndex', '1');
return button;
}
function getBoundCallback(callback, parent, index) {
return (_, button) => callback(parent, index, button);
}
function addButtons(parent, actionId, callback, includeSelf) {
const isCurrentParent = parent === origin.parent;
if (isCurrentParent || (origin.isPooled && parent.poolId === origin.parent.poolId)) {
destinations.push({
node: parent,
isParent: true,
button: getButton(parent, actionId, getBoundCallback(callback, parent, 0), true),
});
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.focusBranch)(true, parent);
for (const target of (!includeSelf && isCurrentParent) ? origin.siblings : parent.children) {
(0,_focus__WEBPACK_IMPORTED_MODULE_3__.focusBranch)(true, target, false);
destinations.push({
node: target,
isParent: false,
button: getButton(target, actionId, getBoundCallback(callback, target.parent, target.getIndex() + 1), false),
});
}
}
// Nodes can't be their own descendants
if (!isCurrentParent) {
for (const child of parent.children) {
if ('children' in child) {
addButtons(child, actionId, callback, includeSelf);
}
}
}
}
function hasDestinations(node) {
if (node.parent.children.length > 1) {
return true;
}
if (!('poolId' in node.parent)) {
return false;
}
const hasMatchingPool = (parent, poolId) => {
if (parent !== node.parent) {
if (parent.poolId === poolId) {
return true;
}
for (const child of parent.children) {
if ('children' in child && hasMatchingPool(child, poolId)) {
return true;
}
}
}
return false;
};
return hasMatchingPool(node.getRoot(), node.parent.poolId);
}
function mount(source, child, parent, siblings, actionId, button, callback, includeSelf = true) {
reset();
origin = {
source,
child,
siblings,
parent,
isPooled: 'poolId' in parent,
button,
actionId,
};
addButtons(parent.getRoot(), actionId, callback.bind(null, source), includeSelf);
(0,_highlight__WEBPACK_IMPORTED_MODULE_4__.addSustained)(source);
setActive();
return destinations.length;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/css.ts":
/*!**************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/css.ts ***!
\**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _edit_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./edit/css */ "./ts/modal/body/trees/nodes/actions/edit/css.ts");
/* harmony import */ var _edit_option_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./edit/option/css */ "./ts/modal/body/trees/nodes/actions/edit/option/css.ts");
/* harmony import */ var _highlight_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./highlight/css */ "./ts/modal/body/trees/nodes/actions/highlight/css.ts");
/* harmony import */ var _focus_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./focus/css */ "./ts/modal/body/trees/nodes/actions/focus/css.ts");
/* harmony import */ var _tooltip_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./tooltip/css */ "./ts/modal/body/trees/nodes/actions/tooltip/css.ts");
/* harmony import */ var _buttons_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./buttons/css */ "./ts/modal/body/trees/nodes/actions/buttons/css.ts");
function generate() {
(0,_edit_css__WEBPACK_IMPORTED_MODULE_0__["default"])();
(0,_edit_option_css__WEBPACK_IMPORTED_MODULE_1__["default"])();
(0,_highlight_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_focus_css__WEBPACK_IMPORTED_MODULE_3__["default"])();
(0,_tooltip_css__WEBPACK_IMPORTED_MODULE_4__["default"])();
(0,_buttons_css__WEBPACK_IMPORTED_MODULE_5__["default"])();
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/consts.ts":
/*!**********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/consts.ts ***!
\**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTIVE_CLASS: () => (/* binding */ ACTIVE_CLASS),
/* harmony export */ EDITABLE_CLASS: () => (/* binding */ EDITABLE_CLASS),
/* harmony export */ INVALID_BACKGROUND_CLASS: () => (/* binding */ INVALID_BACKGROUND_CLASS),
/* harmony export */ INVALID_CLASS: () => (/* binding */ INVALID_CLASS),
/* harmony export */ VALID_BACKGROUND_CLASS: () => (/* binding */ VALID_BACKGROUND_CLASS),
/* harmony export */ VALID_CLASS: () => (/* binding */ VALID_CLASS)
/* harmony export */ });
const EDITABLE_CLASS = 'editable';
const VALID_CLASS = 'valid';
const INVALID_CLASS = 'invalid';
const INVALID_BACKGROUND_CLASS = 'background-invalid';
const VALID_BACKGROUND_CLASS = 'background-valid';
const ACTIVE_CLASS = 'edit-active';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/css.ts":
/*!*******************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/css.ts ***!
\*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/edit/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
// Use pointer when the node has a value and isn't being edited
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.EDITABLE_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.HEAD_CONTAINER}`,
`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE}:not(:focus)`,
], ['cursor', 'pointer']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE}`, [
['flex-grow', '1'],
['padding', '0 0.6em'],
['outline', 'none'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE}[type="checkbox"]`, [
['height', '1em'],
['width', '2.2em'],
['cursor', 'pointer'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE}[type="color"]`, ['height', '1.3em']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([`.${_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_BACKGROUND_CLASS}`, `.${_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_BACKGROUND_CLASS}`], ['right', '0']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_BACKGROUND_CLASS}`, ['background-color', 'var(--validBackground)']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_BACKGROUND_CLASS}`, ['background-color', 'var(--invalidBackground)']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.BACKGROUND_CONTAINER} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_BACKGROUND_CLASS}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.BACKGROUND_CONTAINER} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_BACKGROUND_CLASS}`,
], ['width', '100%']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.HEAD_CONTAINER} .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE_CONTAINER}`, ['color', 'var(--validFont) !important']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.HEAD_CONTAINER} .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE_CONTAINER}`, ['color', 'var(--invalidFont) !important']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTIVE_CLASS} *)`, ['pointer-events', 'none']);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/index.ts":
/*!*********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/index.ts ***!
\*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ doAction: () => (/* binding */ doAction),
/* harmony export */ getSubPredicateResponses: () => (/* binding */ getSubPredicateResponses),
/* harmony export */ isActive: () => (/* binding */ isActive),
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount),
/* harmony export */ unmount: () => (/* binding */ unmount),
/* harmony export */ update: () => (/* binding */ update)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/edit/consts.ts");
/* harmony import */ var _option__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./option */ "./ts/modal/body/trees/nodes/actions/edit/option/index.ts");
/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../tooltip */ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts");
/* harmony import */ var _highlight__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _predicate__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/predicate */ "./ts/predicate.ts");
let activeNode;
function isActive() {
return Boolean(activeNode);
}
function reset() {
if (!activeNode) {
return;
}
const { element } = activeNode;
element.render(activeNode.value);
element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS);
element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_CLASS);
element.valueElement.blur();
element.valueContainer.classList.remove(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTIVE_CLASS);
_tooltip__WEBPACK_IMPORTED_MODULE_2__.reset();
_option__WEBPACK_IMPORTED_MODULE_1__.reset();
(0,_highlight__WEBPACK_IMPORTED_MODULE_3__.removeSustained)(activeNode);
activeNode = undefined;
}
function getValue(node) {
switch (typeof node.value) {
case 'boolean':
return Boolean(node.element.valueElement.checked);
case 'number':
return Number(node.element.valueElement.value);
default:
return node.element.valueElement.value;
}
}
function getSubPredicateResponse(predicate, children) {
return (0,_predicate__WEBPACK_IMPORTED_MODULE_4__.getPredicatePromise)(predicate(children.map((child) => child.getJSON())));
}
function getDescendantPredicateResponses(node) {
const responses = [];
if ('descendantPredicate' in node) {
responses.push(getSubPredicateResponse(node.descendantPredicate, node.children));
}
if ('parent' in node) {
responses.push(...getDescendantPredicateResponses(node.parent));
}
return responses;
}
function getChildPredicateResponse(node) {
if ('childPredicate' in node) {
return getSubPredicateResponse(node.childPredicate, node.children);
}
return Promise.resolve(null);
}
function getSubPredicateResponses(parent) {
return [getChildPredicateResponse(parent), ...getDescendantPredicateResponses(parent)];
}
function getOwnPredicateResponse(node) {
if (!('predicate' in node)) {
return Promise.resolve();
}
const { predicate } = node;
const value = getValue(node);
if (typeof predicate === 'function') {
return (0,_predicate__WEBPACK_IMPORTED_MODULE_4__.getPredicatePromise)(predicate(value));
}
return Promise[predicate.indexOf(value) > -1 ? 'resolve' : 'reject']();
}
function getAllPredicateResponses(node = activeNode) {
return [getOwnPredicateResponse(node), ...getSubPredicateResponses(node.parent)];
}
function update(node) {
const previousValue = node.value;
node.value = getValue(node);
if (node.hasOptions) {
_option__WEBPACK_IMPORTED_MODULE_1__.update(node.value);
}
Promise.all(getAllPredicateResponses())
.then(() => {
node.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_CLASS);
activeNode.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS);
_tooltip__WEBPACK_IMPORTED_MODULE_2__.hide();
})
.catch((reason) => {
node.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS);
activeNode.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_CLASS);
activeNode.value = previousValue;
if (reason) {
_tooltip__WEBPACK_IMPORTED_MODULE_2__.show(reason);
}
});
}
function unmount(node) {
if (node === activeNode) {
reset();
}
}
function doAction(node) {
const previousNode = activeNode;
reset();
if (previousNode !== node) {
activeNode = node;
activeNode.element.valueContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTIVE_CLASS);
activeNode.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_CLASS);
_tooltip__WEBPACK_IMPORTED_MODULE_2__.setNode(node);
if (node.hasOptions) {
_option__WEBPACK_IMPORTED_MODULE_1__.setNode(node);
}
if (node.input === 'color') {
node.element.valueElement.click();
}
else {
node.element.valueElement.select();
}
(0,_highlight__WEBPACK_IMPORTED_MODULE_3__.addSustained)(node);
}
}
function mount(node) {
const { backgroundContainer, valueElement, headContainer } = node.element;
node.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.EDITABLE_CLASS);
backgroundContainer.append(...(() => {
const valid = document.createElement('div');
const invalid = document.createElement('div');
valid.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.VALID_BACKGROUND_CLASS);
invalid.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.INVALID_BACKGROUND_CLASS);
return [valid, invalid];
})());
// Start
valueElement.addEventListener('focus', (event) => {
event.stopPropagation();
if (event.relatedTarget && activeNode !== node) {
doAction(node);
}
});
valueElement.addEventListener('blur', (event) => {
event.stopPropagation();
reset();
});
headContainer.addEventListener('click', (event) => {
event.stopPropagation();
if (activeNode !== node) {
doAction(node);
}
});
// Process new value
if (typeof node.value === 'boolean') {
valueElement.addEventListener('click', (event) => {
event.stopPropagation();
update(node);
});
}
else {
valueElement.addEventListener('input', (event) => {
event.stopPropagation();
update(node);
});
// Stop
if (node.input === 'color') {
valueElement.addEventListener('change', (event) => {
event.stopPropagation();
reset();
(0,_highlight__WEBPACK_IMPORTED_MODULE_3__.focusHovered)();
});
}
}
if (node.hasOptions) {
_option__WEBPACK_IMPORTED_MODULE_1__.generate(node);
}
valueElement.addEventListener('keydown', (event) => {
switch (event.key) {
case 'Enter':
case 'Escape':
event.stopPropagation();
headContainer.focus();
reset();
}
});
}
function shouldMount(node) {
return 'value' in node;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/option/consts.ts":
/*!*****************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/option/consts.ts ***!
\*****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ OPTION_ACTIVE_CLASS: () => (/* binding */ OPTION_ACTIVE_CLASS),
/* harmony export */ OPTION_BACKGROUND_CLASS: () => (/* binding */ OPTION_BACKGROUND_CLASS),
/* harmony export */ OPTION_CLASS: () => (/* binding */ OPTION_CLASS),
/* harmony export */ OPTION_CONTAINER_CLASS: () => (/* binding */ OPTION_CONTAINER_CLASS),
/* harmony export */ OPTION_PARENT_CLASS: () => (/* binding */ OPTION_PARENT_CLASS),
/* harmony export */ OPTION_SHOW_CLASS: () => (/* binding */ OPTION_SHOW_CLASS),
/* harmony export */ OPTION_WRAPPER_CLASS: () => (/* binding */ OPTION_WRAPPER_CLASS)
/* harmony export */ });
const OPTION_CLASS = 'option';
const OPTION_CONTAINER_CLASS = 'option-container';
const OPTION_PARENT_CLASS = 'option-parent';
const OPTION_WRAPPER_CLASS = 'option-wrapper';
const OPTION_BACKGROUND_CLASS = 'option-background';
const OPTION_SHOW_CLASS = 'option-show';
const OPTION_ACTIVE_CLASS = 'option-active';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/option/css.ts":
/*!**************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/option/css.ts ***!
\**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/edit/option/consts.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/nodes/actions/edit/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/body/trees/style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_WRAPPER_CLASS}`, [
['z-index', '1'],
['position', 'absolute'],
['bottom', '0'],
['display', 'flex'],
['width', '100%'],
['pointer-events', 'initial'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_PARENT_CLASS}`, [
['position', 'absolute'],
['display', 'flex'],
['flex-direction', 'column'],
['width', '100%'],
['margin-left', '-1px'],
['max-height', 'calc(4.2em + 5px)'],
['overflow-y', 'auto'],
['border-bottom-left-radius', '12px'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_PARENT_CLASS}:not(.${_consts__WEBPACK_IMPORTED_MODULE_1__.ACTIVE_CLASS} *) `, [['display', 'none']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CONTAINER_CLASS}`, [['position', 'relative']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CONTAINER_CLASS} > *`, [['height', '1.4em']]);
(0,_modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_3__.addDepthChangeListener)((depth, addRule) => {
const headSelector = `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.DEPTH_CLASS_PREFIX}${depth} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.HEAD_CONTAINER}`;
addRule(`${headSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_PARENT_CLASS}`, [['border', `1px solid var(--nodeBase${depth})`]]);
addRule(`${headSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CONTAINER_CLASS}`, [
['background-color', `var(--nodeContrast${depth})`],
['color', `var(--nodeBase${depth})`],
['border', `1px solid var(--nodeBase${depth})`],
]);
addRule(`${headSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_BACKGROUND_CLASS}`, [['background-color', `var(--nodeBase${depth})`]]);
addRule(`${headSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_ACTIVE_CLASS} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CLASS}`, [['color', `var(--nodeContrast${depth})`]]);
addRule(`${headSelector} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_ACTIVE_CLASS} .${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_BACKGROUND_CLASS}`, [['width', '100%']]);
});
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CLASS}`, [
['position', 'relative'],
['transition-property', 'all'],
['transition-duration', '500ms'],
['padding', '0 0.6rem'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_BACKGROUND_CLASS}`, [
['position', 'absolute'],
['width', '0'],
['transition', 'width 500ms ease 0s'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CONTAINER_CLASS}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_SHOW_CLASS})`, [['display', 'none']]);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/edit/option/index.ts":
/*!****************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/edit/option/index.ts ***!
\****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ generate: () => (/* binding */ generate),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ setNode: () => (/* binding */ setNode),
/* harmony export */ update: () => (/* binding */ update)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/edit/option/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
const activeOptions = [];
let activeIndex = -1;
function getTotalOffsetTop(from) {
let offsetTop = 2;
let node;
for (node = from; !node.classList.contains(_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ROOT_CLASS); node = node.offsetParent) {
offsetTop += node.offsetTop;
}
return offsetTop;
}
// source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions#escaping
function escapeRegExp(string) {
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
}
function update(value) {
const regExp = new RegExp(escapeRegExp(value), 'i');
for (const { parentElement, innerText } of activeOptions) {
parentElement.classList[regExp.test(innerText) ? 'add' : 'remove'](_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_SHOW_CLASS);
}
const wrapper = activeOptions[0].parentElement.parentElement;
const totalOffsetTop = getTotalOffsetTop(wrapper);
if (_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop + _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.clientHeight < totalOffsetTop + wrapper.clientHeight) {
_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop = totalOffsetTop + wrapper.clientHeight - _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.clientHeight;
}
}
function setValue(node, value, doKill = false) {
node.element.valueElement.value = value;
node.value = value;
if (doKill) {
// Simulate an 'enter' button press
node.element.valueElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab' }));
}
}
function setActive(option, isActive = true) {
option.classList[isActive ? 'add' : 'remove'](_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_ACTIVE_CLASS);
}
function reset() {
for (const { parentElement } of activeOptions) {
parentElement.classList.remove(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_SHOW_CLASS);
}
if (activeIndex >= 0) {
setActive(activeOptions[activeIndex].parentElement, false);
activeIndex = -1;
}
activeOptions.length = 0;
}
function setNode(node) {
activeOptions.push(...node.element.valueContainer.querySelectorAll(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CLASS}`));
update(node.value);
}
function generate(node) {
const wrapper = document.createElement('div');
const parent = document.createElement('div');
for (const value of node.predicate) {
const container = document.createElement('div');
const background = document.createElement('div');
const option = document.createElement('div');
option.innerText = value;
container.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CONTAINER_CLASS);
option.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_CLASS);
background.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_BACKGROUND_CLASS);
container.append(background, option);
parent.appendChild(container);
container.addEventListener('click', (event) => {
event.stopPropagation();
// Necessary to prevent re-focusing the input element
event.preventDefault();
setValue(node, value, true);
});
container.addEventListener('mouseenter', (event) => {
event.stopPropagation();
setActive(container);
});
container.addEventListener('mouseleave', (event) => {
event.stopPropagation();
setActive(container, false);
});
}
node.element.valueElement.addEventListener('keydown', ({ key }) => {
const priorIndex = activeIndex;
let hasChanged = false;
switch (key) {
case 'Tab':
case 'Enter':
if (activeIndex >= 0) {
setValue(node, activeOptions[activeIndex].innerText);
}
return;
case 'ArrowDown':
for (let i = activeIndex + 1; i < activeOptions.length; ++i) {
const { parentElement } = activeOptions[i];
if (parentElement.classList.contains(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_SHOW_CLASS)) {
activeIndex = i;
hasChanged = true;
const optionBottom = parentElement.offsetTop + parentElement.clientHeight;
if (parentElement.parentElement.scrollTop < optionBottom) {
parentElement.parentElement.scrollTop = optionBottom - parentElement.parentElement.clientHeight;
}
const totalOffsetTop = getTotalOffsetTop(parentElement);
if (_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop + _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.clientHeight < totalOffsetTop + parentElement.clientHeight - parentElement.parentElement.scrollTop) {
_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop = totalOffsetTop + parentElement.clientHeight - _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.clientHeight - parentElement.parentElement.scrollTop;
}
break;
}
}
break;
case 'ArrowUp':
for (let i = activeIndex - 1; i >= 0; --i) {
const { parentElement } = activeOptions[i];
if (parentElement.classList.contains(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_SHOW_CLASS)) {
activeIndex = i;
hasChanged = true;
// Scroll option list if necessary
if (parentElement.parentElement.scrollTop > parentElement.offsetTop) {
parentElement.parentElement.scrollTop = parentElement.offsetTop;
}
const totalOffsetTop = getTotalOffsetTop(parentElement);
// Scroll modal body if necessary
if (_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop > totalOffsetTop - parentElement.parentElement.scrollTop) {
_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop = totalOffsetTop - parentElement.parentElement.scrollTop;
}
break;
}
}
if (hasChanged) {
break;
}
// eslint-disable-next-line no-fallthrough
default:
if (activeIndex >= 0) {
setActive(activeOptions[activeIndex].parentElement, false);
}
activeIndex = -1;
return;
}
if (!hasChanged) {
return;
}
if (priorIndex >= 0) {
setActive(activeOptions[priorIndex].parentElement, false);
}
const { parentElement } = activeOptions[activeIndex];
setActive(parentElement);
});
wrapper.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_WRAPPER_CLASS);
parent.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.OPTION_PARENT_CLASS);
wrapper.appendChild(parent);
node.element.valueContainer.appendChild(wrapper);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/focus/consts.ts":
/*!***********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/focus/consts.ts ***!
\***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ FOCUS_CLASS: () => (/* binding */ FOCUS_CLASS),
/* harmony export */ FOCUS_SOURCE_CLASS: () => (/* binding */ FOCUS_SOURCE_CLASS)
/* harmony export */ });
const FOCUS_CLASS = 'node-focus';
const FOCUS_SOURCE_CLASS = 'node-focus-source';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/focus/css.ts":
/*!********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/focus/css.ts ***!
\********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/focus/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.ELEMENT_CONTAINER}`, ['cursor', 'zoom-in']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.ELEMENT_CONTAINER}.${_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_SOURCE_CLASS}`, ['cursor', 'zoom-out']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ROOT_CLASS}.${_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_CLASS} `
+ `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_CLASS})`
+ `:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_SOURCE_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.CHILD_CONTAINER} > *)`, ['display', 'none']);
// Makes it easy to focus down the tree
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_SOURCE_CLASS} .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.MIDDLE_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.HEAD_CONTAINER}`, [['margin-left', '1.8em']]);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/focus/index.ts":
/*!**********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/focus/index.ts ***!
\**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ doAction: () => (/* binding */ doAction),
/* harmony export */ focus: () => (/* binding */ focus),
/* harmony export */ focusBranch: () => (/* binding */ focusBranch),
/* harmony export */ isActive: () => (/* binding */ isActive),
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ setTabIndexes: () => (/* binding */ setTabIndexes),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount),
/* harmony export */ unmount: () => (/* binding */ unmount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/focus/consts.ts");
/* harmony import */ var _buttons_position__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../buttons/position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _highlight__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _active__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../active */ "./ts/modal/body/trees/nodes/actions/active.ts");
let candidateNode;
let activeNode;
function isActive() {
return Boolean(activeNode);
}
function setTabIndexes(doAdd = true, node = activeNode) {
const { 'buttonContainer': { 'children': buttons }, valueElement } = node.element;
for (let i = buttons.length - 1; i >= 0; --i) {
// Must be set to -1 to prevent tabbing (removeAttribute sets it to 0)
buttons[i].setAttribute('tabIndex', doAdd ? '1' : '-1');
}
if (valueElement) {
valueElement.setAttribute('tabIndex', doAdd ? '1' : '-1');
}
}
function focus(doFocus = true, node = activeNode, doForce = true) {
// Avoid unfocusing the active node if not forced
if (doForce || node !== activeNode) {
node.element[`${doFocus ? 'add' : 'remove'}Class`](_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_SOURCE_CLASS);
}
}
function focusBranch(doFocus = true, node = activeNode, focusAncestors = true) {
node.element[`${doFocus ? 'add' : 'remove'}Class`](_consts__WEBPACK_IMPORTED_MODULE_0__.FOCUS_CLASS);
if (focusAncestors && 'parent' in node) {
focusBranch(doFocus, node.parent);
}
}
function reset() {
if (!activeNode) {
return;
}
focus(false);
focusBranch(false);
(0,_highlight__WEBPACK_IMPORTED_MODULE_2__.removeSustained)(activeNode);
setTabIndexes(false);
activeNode.element.scrollIntoView();
activeNode = undefined;
}
function doAction(node, doForce = false) {
const toggleOn = node !== activeNode;
// Avoid changing the view when it's already been focused
if ((0,_buttons_position__WEBPACK_IMPORTED_MODULE_1__.isActive)() || (doForce && !toggleOn)) {
return;
}
reset();
_active__WEBPACK_IMPORTED_MODULE_3__.register();
if (toggleOn) {
activeNode = node;
node.element.headContainer.focus();
focus();
focusBranch();
(0,_highlight__WEBPACK_IMPORTED_MODULE_2__.addSustained)(node);
setTabIndexes();
}
}
function unmount(node) {
if (node === activeNode) {
reset();
}
}
function mount(node) {
const { elementContainer, headContainer } = node.element;
// Handle mouse down
elementContainer.addEventListener('mousedown', (event) => {
event.stopPropagation();
if (elementContainer.isSameNode(event.target)) {
candidateNode = node;
}
});
headContainer.addEventListener('mousedown', (event) => {
event.stopPropagation();
if (headContainer.isSameNode(event.target)) {
candidateNode = node;
}
});
// Handle mouse up
elementContainer.addEventListener('mouseup', (event) => {
event.stopPropagation();
if (node === candidateNode && elementContainer.isSameNode(event.target)) {
doAction(node);
}
candidateNode = undefined;
});
headContainer.addEventListener('mouseup', (event) => {
event.stopPropagation();
if (node === candidateNode && headContainer.isSameNode(event.target)) {
doAction(node);
}
candidateNode = undefined;
});
// Handle keyboard input
elementContainer.addEventListener('keydown', (event) => {
if (event.key === 'Enter') {
event.stopPropagation();
doAction(node);
}
});
}
function shouldMount() {
return true;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/highlight/consts.ts":
/*!***************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/highlight/consts.ts ***!
\***************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ EAVE_ID: () => (/* binding */ EAVE_ID),
/* harmony export */ HIGHLIGHT_BACKGROUND_CLASS: () => (/* binding */ HIGHLIGHT_BACKGROUND_CLASS),
/* harmony export */ HIGHLIGHT_CLASS: () => (/* binding */ HIGHLIGHT_CLASS)
/* harmony export */ });
const HIGHLIGHT_CLASS = 'highlight';
const HIGHLIGHT_BACKGROUND_CLASS = 'background-highlight';
const EAVE_ID = 'tree-eave';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/highlight/css.ts":
/*!************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/highlight/css.ts ***!
\************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/highlight/consts.ts");
/* harmony import */ var _buttons_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../buttons/consts */ "./ts/modal/body/trees/nodes/actions/buttons/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/body/trees/style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.BACKGROUND_CONTAINER} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_BACKGROUND_CLASS}`, ['width', '100%']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.LABEL_CONTAINER}`, [
['padding-right', '0.4em'],
// Extend the background further into the value
['padding-left', '15%'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`.${_buttons_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_CLASS}:last-child`, [
['border-top-right-radius', '50%'],
['border-bottom-right-radius', '50%'],
]);
(0,_modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_3__.addDepthChangeListener)((depth, addRule) => {
const rootSelector = `.${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.DEPTH_CLASS_PREFIX}${depth}`;
const headSelector = `${rootSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.HEAD_CONTAINER}`;
addRule(`${rootSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.BACKGROUND_CONTAINER} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_BACKGROUND_CLASS}`, ['background-color', `var(--nodeContrast${depth})`]);
addRule(`${headSelector} .${_buttons_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_CLASS}`, ['background-color', `var(--nodeContrast${depth})`]);
addRule([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS}${headSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.VALUE_CONTAINER}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS}${headSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.LABEL_CONTAINER}`,
], ['color', `var(--nodeBase${depth})`]);
addRule(`${headSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.LABEL_CONTAINER}`, [
['background-image', `linear-gradient(to left, var(--nodeBase${depth}) 60%, transparent)`],
['background-size', 'auto'],
]);
addRule(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS}${headSelector} > .${_nodes_consts__WEBPACK_IMPORTED_MODULE_2__.ELEMENT_CLASSES.LABEL_CONTAINER}`, ['background-image', `linear-gradient(to left, var(--nodeContrast${depth}) 60%, transparent)`]);
});
// Bug fixer
(0,_modal_css__WEBPACK_IMPORTED_MODULE_4__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.EAVE_ID}`, [
['position', 'absolute'],
['bottom', '0'],
['width', '100%'],
['height', '1px'],
]);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/highlight/index.ts":
/*!**************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/highlight/index.ts ***!
\**************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addSustained: () => (/* binding */ addSustained),
/* harmony export */ focusHovered: () => (/* binding */ focusHovered),
/* harmony export */ generateEave: () => (/* binding */ generateEave),
/* harmony export */ isActive: () => (/* binding */ isActive),
/* harmony export */ mount: () => (/* binding */ mount),
/* harmony export */ onMount: () => (/* binding */ onMount),
/* harmony export */ removeSustained: () => (/* binding */ removeSustained),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ shouldMount: () => (/* binding */ shouldMount)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/highlight/consts.ts");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _focus__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _buttons_position__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../buttons/position */ "./ts/modal/body/trees/nodes/actions/buttons/position/index.ts");
/* harmony import */ var _modal__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal */ "./ts/modal/index.ts");
let sustainedNodes = [];
let activeNode;
function focusHovered() {
if (activeNode) {
activeNode.element.headContainer.focus();
}
}
function isActive() {
return Boolean(activeNode);
}
function removeSustained(node) {
sustainedNodes.splice(sustainedNodes.indexOf(node), 1);
// Avoid unhighlighting if it's still sustained by another action
if (node !== activeNode && !sustainedNodes.includes(node)) {
node.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS);
}
}
function addSustained(node) {
node.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS);
sustainedNodes.push(node);
}
function setActive(node, doFocus = false) {
if (activeNode && !sustainedNodes.includes(activeNode)) {
activeNode.element.removeClass(_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS);
}
activeNode = node;
if (node) {
node.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_CLASS);
if (doFocus) {
node.element.headContainer.focus();
}
}
}
function mount(node) {
const { backgroundContainer, headContainer, elementContainer } = node.element;
backgroundContainer.appendChild((() => {
const background = document.createElement('div');
background.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.HIGHLIGHT_BACKGROUND_CLASS);
return background;
})());
headContainer.setAttribute('tabIndex', '1');
headContainer.addEventListener('focusin', (event) => {
event.stopPropagation();
setActive(node);
});
headContainer.addEventListener('mouseenter', (event) => {
event.stopPropagation();
setActive(node, !((0,_edit__WEBPACK_IMPORTED_MODULE_1__.isActive)() || (0,_focus__WEBPACK_IMPORTED_MODULE_2__.isActive)() || (0,_buttons_position__WEBPACK_IMPORTED_MODULE_3__.isActive)()));
});
elementContainer.addEventListener('mouseenter', (event) => {
event.stopPropagation();
setActive(node);
});
elementContainer.addEventListener('mouseleave', (event) => {
event.stopPropagation();
if ('parent' in node) {
setActive(node.parent);
}
else {
setActive();
}
});
}
function shouldMount() {
return true;
}
// Prevents zipping to the end of the tree when mousing over the bottom pixel
function generateEave() {
const element = document.createElement('div');
element.id = _consts__WEBPACK_IMPORTED_MODULE_0__.EAVE_ID;
element.setAttribute('tabIndex', '3');
// Prevent tabbing away from the modal
element.addEventListener('keydown', (event) => {
if (event.key === 'Tab' && !event.shiftKey && element.isSameNode(event.target)) {
event.preventDefault();
}
});
return element;
}
// Blur focused node & reset focus index
function reset() {
setActive();
(0,_modal__WEBPACK_IMPORTED_MODULE_4__.getSocket)().focus();
}
function onMount() {
const socket = (0,_modal__WEBPACK_IMPORTED_MODULE_4__.getSocket)();
socket.setAttribute('tabIndex', '1');
// Prevent tabbing away from the modal
socket.addEventListener('keydown', (event) => {
if (event.key === 'Tab' && event.shiftKey && socket.isSameNode(event.target)) {
event.preventDefault();
}
});
socket.addEventListener('focusin', () => {
setActive();
});
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/tooltip/consts.ts":
/*!*************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/tooltip/consts.ts ***!
\*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ TOOLTIP_ANIMATION: () => (/* binding */ TOOLTIP_ANIMATION),
/* harmony export */ TOOLTIP_BOTTOM_CLASS: () => (/* binding */ TOOLTIP_BOTTOM_CLASS),
/* harmony export */ TOOLTIP_CLASS: () => (/* binding */ TOOLTIP_CLASS),
/* harmony export */ TOOLTIP_CONTAINER_CLASS: () => (/* binding */ TOOLTIP_CONTAINER_CLASS),
/* harmony export */ TOOLTIP_TOP_CLASS: () => (/* binding */ TOOLTIP_TOP_CLASS)
/* harmony export */ });
const TOOLTIP_CLASS = 'tooltip';
const TOOLTIP_CONTAINER_CLASS = 'tooltip-container';
const TOOLTIP_TOP_CLASS = 'tooltip-above';
const TOOLTIP_BOTTOM_CLASS = 'tooltip-below';
const TOOLTIP_ANIMATION = [
[
// keyframes
{ opacity: 1 },
{ opacity: 1 },
{ opacity: 0 },
], { duration: 2000 },
];
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/tooltip/css.ts":
/*!**********************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/tooltip/css.ts ***!
\**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/tooltip/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/body/trees/style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.VALUE_CONTAINER}`, [['position', 'relative']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CONTAINER_CLASS}`, [
['position', 'absolute'],
['text-align', 'center'],
['z-index', '1'],
['width', '100%'],
['pointer-events', 'none'],
['white-space', 'normal'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CONTAINER_CLASS}.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_TOP_CLASS}`, ['bottom', '102%']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CONTAINER_CLASS}.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_BOTTOM_CLASS}`, ['top', '102%']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}`, [
['margin', '0 auto'],
['font-size', '0.9em'],
['padding', '3px 8px'],
['border-radius', '1em'],
['width', '10em'],
['outline', 'solid 3px var(--borderTooltip)'],
]);
(0,_modal_body_trees_style_update_depth__WEBPACK_IMPORTED_MODULE_2__.addDepthChangeListener)((depth, addRule) => {
addRule(`.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.DEPTH_CLASS_PREFIX}${depth} > :not(.${_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.CHILD_CONTAINER}) .${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}`, [
['background-color', `var(--nodeBase${depth})`],
['color', `var(--nodeContrast${depth})`],
]);
});
// Don't show when there's no hint to give
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)([`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}:empty`], ['display', 'none']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}::after`, [
['content', '""'],
['position', 'absolute'],
['left', '50%'],
['margin-left', '-0.5em'],
['border-width', '0.5em'],
['border-style', 'solid'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_TOP_CLASS} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}::after`, [
['top', '100%'],
['border-color', 'var(--borderTooltip) transparent transparent transparent'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_BOTTOM_CLASS} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}::after`, [
['bottom', '100%'],
['border-color', 'transparent transparent var(--borderTooltip) transparent'],
]);
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/actions/tooltip/index.ts":
/*!************************************************************!*\
!*** ./ts/modal/body/trees/nodes/actions/tooltip/index.ts ***!
\************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ hide: () => (/* binding */ hide),
/* harmony export */ reset: () => (/* binding */ reset),
/* harmony export */ setNode: () => (/* binding */ setNode),
/* harmony export */ show: () => (/* binding */ show)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/actions/tooltip/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
let activeParent;
function isAboveCenter(element, yPosition = 0) {
if (!element.isSameNode(_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER)) {
if (element.classList.contains(_nodes_consts__WEBPACK_IMPORTED_MODULE_1__.ELEMENT_CLASSES.ELEMENT_CONTAINER)) {
yPosition += element.offsetTop;
}
return isAboveCenter(element.parentElement, yPosition);
}
const scrollPosition = _modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.scrollTop + (_modal_body_trees__WEBPACK_IMPORTED_MODULE_2__.TREE_CONTAINER.clientHeight / 2);
return scrollPosition > yPosition;
}
function generate(parent) {
const container = document.createElement('div');
const element = document.createElement('div');
container.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CONTAINER_CLASS);
element.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS);
container.appendChild(element);
parent.insertBefore(container, parent.firstChild);
return [container, element];
}
function getAnimated(parent) {
if (!parent) {
const element = activeParent.querySelector(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}`);
return [element.parentElement, element];
}
const oldElement = parent.querySelector(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}`);
if (oldElement) {
const [animation] = oldElement.getAnimations();
animation.currentTime = 0;
return [oldElement.parentElement, oldElement];
}
const [container, element] = generate(parent);
element.animate(..._consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_ANIMATION).onfinish = () => {
container.remove();
};
return [container, element];
}
function show(message, parent) {
const [container, element] = getAnimated(parent);
if (isAboveCenter(container)) {
container.classList.remove(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_TOP_CLASS);
container.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_BOTTOM_CLASS);
}
else {
container.classList.remove(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_BOTTOM_CLASS);
container.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_TOP_CLASS);
}
element.innerText = message;
}
function hide() {
const element = activeParent.querySelector(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CLASS}`);
if (element) {
element.innerText = '';
}
}
function reset() {
activeParent.querySelector(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.TOOLTIP_CONTAINER_CLASS}`).remove();
activeParent = undefined;
}
function setNode(node) {
const { parentElement } = node.element.valueElement;
generate(parentElement);
activeParent = parentElement;
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/child.ts":
/*!********************************************!*\
!*** ./ts/modal/body/trees/nodes/child.ts ***!
\********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Child)
/* harmony export */ });
/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./element */ "./ts/modal/body/trees/nodes/element.ts");
/* harmony import */ var _actions_highlight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./actions/highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _actions_edit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./actions/edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _actions_focus__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./actions/focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _actions_buttons_disable__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./actions/buttons/disable */ "./ts/modal/body/trees/nodes/actions/buttons/disable/index.ts");
/* harmony import */ var _actions_buttons_move__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./actions/buttons/move */ "./ts/modal/body/trees/nodes/actions/buttons/move/index.ts");
/* harmony import */ var _actions_buttons_duplicate__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./actions/buttons/duplicate */ "./ts/modal/body/trees/nodes/actions/buttons/duplicate/index.ts");
/* harmony import */ var _style_update_depth__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
const actions = [
// No button
_actions_highlight__WEBPACK_IMPORTED_MODULE_1__,
_actions_focus__WEBPACK_IMPORTED_MODULE_3__,
_actions_edit__WEBPACK_IMPORTED_MODULE_2__,
// Button
_actions_buttons_disable__WEBPACK_IMPORTED_MODULE_4__,
_actions_buttons_move__WEBPACK_IMPORTED_MODULE_5__,
_actions_buttons_duplicate__WEBPACK_IMPORTED_MODULE_6__,
];
class Child {
constructor(data, parent, index) {
this.depth = parent.depth + 1;
this.element = new _element__WEBPACK_IMPORTED_MODULE_0__["default"](data);
this.element.addDepthClass(this.depth % (0,_style_update_depth__WEBPACK_IMPORTED_MODULE_7__.getDepthClassCount)());
for (const [key, value] of Object.entries(Object.assign({ isActive: true }, data))) {
this[key] = value;
}
this.hasOptions = Array.isArray(data.predicate);
this.attach(parent, index);
for (const { shouldMount, mount } of actions) {
if (shouldMount(this)) {
mount(this);
}
}
}
getRoot() {
return this.parent.getRoot();
}
getIndex() {
return this.parent.children.indexOf(this);
}
getSiblings() {
const index = this.getIndex();
const siblings = this.parent.children;
return [...siblings.slice(0, index), ...siblings.slice(index + 1)];
}
updateDepthClass(classCount) {
this.element.addDepthClass(this.depth % classCount);
}
detach() {
this.parent.children.splice(this.getIndex(), 1);
this.element.remove();
this.parent = undefined;
}
attach(parent, index = parent.children.length) {
parent.children.splice(index, 0, this);
parent.element.addChild(this.element, index);
this.parent = parent;
}
move(parent, to) {
this.detach();
this.attach(parent, typeof to === 'number' ? to : to.getIndex() + 1);
}
duplicate() {
return new Child(this.getJSON(), this.parent, this.getIndex() + 1);
}
unmount() {
for (const action of actions) {
if ('unmount' in action) {
action.unmount(this);
}
}
}
disconnect() {
this.unmount();
this.detach();
}
getJSON() {
const data = { isActive: this.isActive };
for (const property of ['label', 'value', 'input']) {
if (property in this) {
data[property] = this[property];
}
}
return data;
}
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/consts.ts":
/*!*********************************************!*\
!*** ./ts/modal/body/trees/nodes/consts.ts ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ DEPTH_CLASS_PREFIX: () => (/* binding */ DEPTH_CLASS_PREFIX),
/* harmony export */ ELEMENT_CLASSES: () => (/* binding */ ELEMENT_CLASSES),
/* harmony export */ MIDDLE_CLASS: () => (/* binding */ MIDDLE_CLASS),
/* harmony export */ ROOT_CLASS: () => (/* binding */ ROOT_CLASS)
/* harmony export */ });
const ROOT_CLASS = 'root';
const MIDDLE_CLASS = 'middle';
const ELEMENT_CLASSES = {
ELEMENT_CONTAINER: 'node',
BACKGROUND_CONTAINER: 'node-background-container',
CHILD_CONTAINER: 'node-child-container',
BUTTON_CONTAINER: 'node-button-container',
HEAD_CONTAINER: 'node-head-container',
VALUE_CONTAINER: 'node-value-container',
VALUE: 'node-value',
LABEL_CONTAINER: 'node-label-container',
LABEL: 'node-label',
};
const DEPTH_CLASS_PREFIX = 'node-depth-';
/***/ }),
/***/ "./ts/modal/body/trees/nodes/css.ts":
/*!******************************************!*\
!*** ./ts/modal/body/trees/nodes/css.ts ***!
\******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _style_update_depth__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../style/update/depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_CLASS}`, [
['flex-grow', '1'],
// Apparently it maxes out at the viewport's height without a content-related height value
['height', 'fit-content'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.ELEMENT_CONTAINER}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_CLASS}):first-child`, ['margin-top', '0.7px']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_CLASS}) > .${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.CHILD_CONTAINER}`, ['margin-left', '1.8em']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.ELEMENT_CONTAINER}`, ['position', 'relative']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.ELEMENT_CONTAINER} > :not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.CHILD_CONTAINER})`, ['height', '1.6em']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.ELEMENT_CONTAINER}`, [['user-select', 'none']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.HEAD_CONTAINER}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.VALUE_CONTAINER}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.LABEL_CONTAINER}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER}`,
], [
['flex-grow', '1'],
['display', 'flex'],
['align-items', 'center'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER}`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.LABEL_CONTAINER}`,
], [['position', 'absolute']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.LABEL_CONTAINER}`, [
['right', '0'],
['top', '0'],
['pointer-events', 'none'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.VALUE_CONTAINER}`, [['user-select', 'none']]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER}`, [
['width', '100%'],
['height', '100%'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER} > *`, [
['height', '100%'],
['width', '0'],
['transition', 'width 500ms'],
['position', 'absolute'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.HEAD_CONTAINER}`, [
// Puts it above the backgrounds
['position', 'relative'],
['user-select', 'none'],
]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.HEAD_CONTAINER} > *`, [['height', '100%']]);
(0,_style_update_depth__WEBPACK_IMPORTED_MODULE_1__.addDepthChangeListener)((depth, addRule) => {
addRule(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DEPTH_CLASS_PREFIX}${depth}`, [
['color', `var(--nodeContrast${depth})`],
['background', `var(--nodeBase${depth})`],
]);
addRule(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DEPTH_CLASS_PREFIX}${depth}`, ['outline', `1px solid var(--nodeContrast${depth})`]);
addRule(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.DEPTH_CLASS_PREFIX}${depth} > .${_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER}`, ['outline', `1px solid var(--nodeContrast${depth})`]);
});
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/element.ts":
/*!**********************************************!*\
!*** ./ts/modal/body/trees/nodes/element.ts ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Element)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/consts.ts");
class Element {
constructor(data) {
this.elementContainer = document.createElement('div');
this.backgroundContainer = document.createElement('div');
this.headContainer = document.createElement('span');
this.buttonContainer = document.createElement('span');
this.childContainer = document.createElement('div');
this.elementContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.ELEMENT_CONTAINER);
this.backgroundContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BACKGROUND_CONTAINER);
this.childContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.CHILD_CONTAINER);
this.headContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.HEAD_CONTAINER);
this.buttonContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.BUTTON_CONTAINER);
this.elementContainer.appendChild(this.backgroundContainer);
this.headContainer.appendChild(this.buttonContainer);
if ('value' in data) {
this.valueContainer = document.createElement('label');
this.valueElement = document.createElement('input');
this.valueContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.VALUE_CONTAINER);
this.valueElement.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.VALUE);
this.valueElement.setAttribute('tabIndex', '-1');
if (typeof data.value === 'boolean') {
this.valueElement.type = 'checkbox';
// Positions tooltips below checkboxes
const valueWrapper = document.createElement('span');
valueWrapper.appendChild(this.valueElement);
this.valueContainer.appendChild(valueWrapper);
}
else {
if (typeof data.value === 'number') {
this.valueElement.type = 'number';
// Disables a tooltip implying that decimal values are invalid
this.valueElement.step = 'any';
}
else if ('input' in data) {
this.valueElement.type = data.input;
}
this.valueContainer.appendChild(this.valueElement);
}
this.render(data.value);
this.headContainer.appendChild(this.valueContainer);
}
this.elementContainer.appendChild(this.headContainer);
if ('label' in data) {
this.labelContainer = document.createElement('div');
this.labelElement = document.createElement('span');
this.labelContainer.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.LABEL_CONTAINER);
this.labelElement.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.ELEMENT_CLASSES.LABEL);
this.labelElement.innerText = data.label;
this.labelContainer.appendChild(this.labelElement);
this.headContainer.appendChild(this.labelContainer);
}
this.elementContainer.appendChild(this.childContainer);
}
render(value) {
if (typeof value === 'boolean') {
this.valueElement.checked = value;
}
else {
this.valueElement.value = value.toString();
}
}
addClass(...names) {
for (const name of names) {
this.elementContainer.classList.add(name);
}
}
removeClass(...names) {
for (const name of names) {
this.elementContainer.classList.remove(name);
}
}
addDepthClass(depth) {
if (this.depthClass) {
this.removeClass(this.depthClass);
}
const depthClass = `${_consts__WEBPACK_IMPORTED_MODULE_0__.DEPTH_CLASS_PREFIX}${depth}`;
this.addClass(depthClass);
this.depthClass = depthClass;
}
addChild(child, index) {
var _a;
this.childContainer.insertBefore(child.elementContainer, (_a = this.childContainer.children[index]) !== null && _a !== void 0 ? _a : null);
}
addButton(button) {
this.buttonContainer.appendChild(button);
}
remove() {
this.elementContainer.remove();
}
scrollIntoView() {
this.backgroundContainer.scrollIntoView({ block: 'center' });
}
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/middle.ts":
/*!*********************************************!*\
!*** ./ts/modal/body/trees/nodes/middle.ts ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Middle)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _child__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./child */ "./ts/modal/body/trees/nodes/child.ts");
/* harmony import */ var _actions_buttons_create__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./actions/buttons/create */ "./ts/modal/body/trees/nodes/actions/buttons/create/index.ts");
var __rest = (undefined && undefined.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
const actions = [_actions_buttons_create__WEBPACK_IMPORTED_MODULE_2__];
class Middle extends _child__WEBPACK_IMPORTED_MODULE_1__["default"] {
constructor(_a, parent, index) {
var { children } = _a, data = __rest(_a, ["children"]);
super(data, parent, index);
this.children = [];
for (const [key, value] of Object.entries(data)) {
this[key] = value;
}
for (const child of children) {
if ('children' in child) {
new Middle(child, this);
}
else {
new _child__WEBPACK_IMPORTED_MODULE_1__["default"](child, this);
}
}
this.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_0__.MIDDLE_CLASS);
for (const { shouldMount, mount } of actions) {
if (shouldMount(this)) {
mount(this);
}
}
}
duplicate() {
return new Middle(this.getJSON(), this.parent, this.getIndex() + 1);
}
unmount() {
super.unmount();
for (const action of actions) {
if ('unmount' in action) {
action.unmount(this);
}
}
}
disconnect() {
this.unmount();
for (const child of this.children) {
child.disconnect();
}
this.detach();
}
updateDepthClass(classCount) {
super.updateDepthClass(classCount);
for (const child of this.children) {
child.updateDepthClass(classCount);
}
}
getJSON() {
return Object.assign({ children: this.children.map((child) => child.getJSON()) }, super.getJSON());
}
}
/***/ }),
/***/ "./ts/modal/body/trees/nodes/root.ts":
/*!*******************************************!*\
!*** ./ts/modal/body/trees/nodes/root.ts ***!
\*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Root)
/* harmony export */ });
/* harmony import */ var _middle__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./middle */ "./ts/modal/body/trees/nodes/middle.ts");
/* harmony import */ var _child__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./child */ "./ts/modal/body/trees/nodes/child.ts");
/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./element */ "./ts/modal/body/trees/nodes/element.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/nodes/consts.ts");
/* harmony import */ var _actions_highlight__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./actions/highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _actions_focus__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./actions/focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _actions_buttons_create__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./actions/buttons/create */ "./ts/modal/body/trees/nodes/actions/buttons/create/index.ts");
var __rest = (undefined && undefined.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
const actions = [_actions_highlight__WEBPACK_IMPORTED_MODULE_4__, _actions_focus__WEBPACK_IMPORTED_MODULE_5__, _actions_buttons_create__WEBPACK_IMPORTED_MODULE_6__];
class Root {
constructor(_a) {
var { children } = _a, data = __rest(_a, ["children"]);
this.children = [];
this.depth = 0;
this.element = new _element__WEBPACK_IMPORTED_MODULE_2__["default"]({});
this.element.addClass(_consts__WEBPACK_IMPORTED_MODULE_3__.ROOT_CLASS);
this.element.addDepthClass(0);
for (const [key, value] of Object.entries(data)) {
this[key] = value;
}
this.addChildren(children);
for (const { shouldMount, mount } of actions) {
if (shouldMount(this)) {
mount(this);
}
}
}
addChildren(children) {
for (const child of children) {
if ('children' in child) {
new _middle__WEBPACK_IMPORTED_MODULE_0__["default"](child, this);
}
else {
new _child__WEBPACK_IMPORTED_MODULE_1__["default"](child, this);
}
}
}
getRoot() {
return this;
}
updateDepthClass(classCount) {
for (const child of this.children) {
child.updateDepthClass(classCount);
}
}
getJSON() {
return { children: this.children.map((child) => child.getJSON()) };
}
}
/***/ }),
/***/ "./ts/modal/body/trees/style/consts.ts":
/*!*********************************************!*\
!*** ./ts/modal/body/trees/style/consts.ts ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ DEFAULT_STYLE: () => (/* binding */ DEFAULT_STYLE),
/* harmony export */ ROOT_ID: () => (/* binding */ ROOT_ID)
/* harmony export */ });
const ROOT_ID = 'root-style';
const DEFAULT_STYLE = {
fontSize: 18,
borderTooltip: '#570000',
borderModal: '#ffffff',
headBase: '#000000',
headContrast: 'Black / White',
headButtonExit: '#f10000',
headButtonLabel: '#ffd189',
headButtonStyle: '#ff75da',
headButtonHide: '#00bfff',
headButtonAlt: '#ffea00',
nodeBase: ['#000000'],
nodeContrast: 'Black / White',
nodeButtonCreate: '#40ff40',
nodeButtonDuplicate: '#40ffff',
nodeButtonMove: '#ac60ff',
nodeButtonDisable: '#ffd000',
nodeButtonDelete: '#ff1111',
validBackground: '#d9ffc0',
invalidBackground: '#ffb4be',
};
/***/ }),
/***/ "./ts/modal/body/trees/style/css.ts":
/*!******************************************!*\
!*** ./ts/modal/body/trees/style/css.ts ***!
\******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/style/consts.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../consts */ "./ts/modal/body/trees/consts.ts");
/* harmony import */ var _data_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../data/consts */ "./ts/modal/body/trees/data/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
/* harmony import */ var _modal_header_actions_style_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/header/actions/style/consts */ "./ts/modal/header/actions/style/consts.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_1__.TREE_CONTAINER_ID}.${_modal_header_actions_style_consts__WEBPACK_IMPORTED_MODULE_4__.ACTION_ID} > #${_data_consts__WEBPACK_IMPORTED_MODULE_2__.ROOT_ID}`, ['display', 'none']);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_3__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_1__.TREE_CONTAINER_ID}:not(.${_modal_header_actions_style_consts__WEBPACK_IMPORTED_MODULE_4__.ACTION_ID}) > #${_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_ID}`, ['display', 'none']);
}
/***/ }),
/***/ "./ts/modal/body/trees/style/index.ts":
/*!********************************************!*\
!*** ./ts/modal/body/trees/style/index.ts ***!
\********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ getActiveStyle: () => (/* binding */ getActiveStyle),
/* harmony export */ getRoot: () => (/* binding */ getRoot),
/* harmony export */ getUserStyles: () => (/* binding */ getUserStyles),
/* harmony export */ toJSON: () => (/* binding */ toJSON),
/* harmony export */ toRawStyle: () => (/* binding */ toRawStyle)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/body/trees/style/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css */ "./ts/modal/body/trees/style/css.ts");
/* harmony import */ var _update__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./update */ "./ts/modal/body/trees/style/update/index.ts");
/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! .. */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @types */ "./ts/library/validation/types.ts");
function getRoot() {
return ___WEBPACK_IMPORTED_MODULE_3__.ROOTS[_consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_ID];
}
// Fill any missing entries
function getFilledStyle(style = {}) {
return Object.assign(Object.assign({}, _consts__WEBPACK_IMPORTED_MODULE_0__.DEFAULT_STYLE), style);
}
function getActiveStyle(userStyles, devStyle) {
const activeUserStyle = userStyles.find(({ isActive }) => isActive);
return activeUserStyle !== null && activeUserStyle !== void 0 ? activeUserStyle : getFilledStyle(devStyle);
}
function toJSON(style) {
const filledStyle = Object.assign(Object.assign({}, _consts__WEBPACK_IMPORTED_MODULE_0__.DEFAULT_STYLE), style);
const toDepthColour = (value) => ({ value, input: 'color' });
return {
label: 'Name',
value: filledStyle.name,
children: [
{
label: 'Style Is Active?',
value: filledStyle.isActive,
},
{
label: 'Modal',
children: [
{
label: 'Font Size (px)',
value: filledStyle.fontSize,
predicate: (value) => value > 0 ? true : 'Font size must be greater than zero',
},
{
label: 'Border Color',
value: filledStyle.borderModal,
input: 'color',
},
],
},
{
label: 'Header',
children: [
{
label: 'General',
children: [
{
label: 'Base Color',
value: filledStyle.headBase,
input: 'color',
},
{
label: 'Contrast Method',
value: filledStyle.headContrast,
predicate: [..._types__WEBPACK_IMPORTED_MODULE_4__.CONTRAST_METHODS],
},
],
},
{
label: 'Buttons',
children: [
{
label: 'Exit Color',
value: filledStyle.headButtonExit,
input: 'color',
},
{
label: 'Label Color',
value: filledStyle.headButtonLabel,
input: 'color',
},
{
label: 'Style Color',
value: filledStyle.headButtonStyle,
input: 'color',
},
{
label: 'Hide Color',
value: filledStyle.headButtonHide,
input: 'color',
},
{
label: 'Alt Buttons Color',
value: filledStyle.headButtonAlt,
input: 'color',
},
],
},
],
},
{
label: 'Body',
children: [
{
label: 'General',
children: [
{
label: 'Depth Base Colors',
seed: toDepthColour(_consts__WEBPACK_IMPORTED_MODULE_0__.DEFAULT_STYLE.nodeBase[0]),
children: filledStyle.nodeBase.map(toDepthColour),
childPredicate: (children) => children.length > 0 ? true : 'At least one color must be provided.',
},
{
label: 'Contrast Method',
value: filledStyle.nodeContrast,
predicate: [..._types__WEBPACK_IMPORTED_MODULE_4__.CONTRAST_METHODS],
},
],
},
{
label: 'Buttons',
children: [
{
label: 'Create Color',
value: filledStyle.nodeButtonCreate,
input: 'color',
},
{
label: 'Duplicate Color',
value: filledStyle.nodeButtonDuplicate,
input: 'color',
},
{
label: 'Move Color',
value: filledStyle.nodeButtonMove,
input: 'color',
},
{
label: 'Disable Color',
value: filledStyle.nodeButtonDisable,
input: 'color',
},
{
label: 'Delete Color',
value: filledStyle.nodeButtonDelete,
input: 'color',
},
],
},
{
label: 'Miscellaneous',
children: [
{
label: 'Valid Color',
value: filledStyle.validBackground,
input: 'color',
},
{
label: 'Invalid Color',
value: filledStyle.invalidBackground,
input: 'color',
},
{
label: 'Tooltip Color',
value: filledStyle.borderTooltip,
input: 'color',
},
],
},
],
},
],
};
}
function toRawStyle(json) {
const [, modal, header, body] = json.children.map(({ children }) => children);
const [headerGeneral, headerButtons] = header.map(({ children }) => children);
const [bodyGeneral, bodyButtons, bodyMisc] = body.map(({ children }) => children);
return {
fontSize: modal[0].value,
borderModal: modal[1].value,
headBase: headerGeneral[0].value,
headContrast: headerGeneral[1].value,
headButtonExit: headerButtons[0].value,
headButtonLabel: headerButtons[1].value,
headButtonStyle: headerButtons[2].value,
headButtonHide: headerButtons[3].value,
headButtonAlt: headerButtons[4].value,
nodeBase: bodyGeneral[0].children
.filter(({ isActive }) => isActive)
.map((child) => child.value),
nodeContrast: bodyGeneral[1].value,
nodeButtonCreate: bodyButtons[0].value,
nodeButtonDuplicate: bodyButtons[1].value,
nodeButtonMove: bodyButtons[2].value,
nodeButtonDisable: bodyButtons[3].value,
nodeButtonDelete: bodyButtons[4].value,
validBackground: bodyMisc[0].value,
invalidBackground: bodyMisc[1].value,
borderTooltip: bodyMisc[2].value,
};
}
// For returning updated styles to the userscript
function getUserStyles() {
const { 'children': styleNodes } = getRoot().getJSON();
const styles = [];
for (const json of styleNodes) {
styles.push(Object.assign({ name: json.value, isActive: json.children[0].value }, toRawStyle(json)));
}
return styles;
}
function generate(userStyles, devStyle) {
(0,_css__WEBPACK_IMPORTED_MODULE_1__["default"])();
const defaultStyle = getFilledStyle(devStyle);
return (0,___WEBPACK_IMPORTED_MODULE_3__.generateTree)({
children: userStyles.map(toJSON),
seed: toJSON(Object.assign({ name: 'New Style', isActive: false }, defaultStyle)),
descendantPredicate: (styleNodes) => {
const activeStyles = styleNodes.filter(({ isActive, 'children': [{ value }], }) => isActive && value);
switch (activeStyles.length) {
case 0:
(0,_update__WEBPACK_IMPORTED_MODULE_2__["default"])(defaultStyle);
return true;
case 1:
(0,_update__WEBPACK_IMPORTED_MODULE_2__["default"])(toRawStyle(activeStyles[0]));
return true;
default:
return 'Only one color scheme may be active at a time.';
}
},
}, _consts__WEBPACK_IMPORTED_MODULE_0__.ROOT_ID);
}
/***/ }),
/***/ "./ts/modal/body/trees/style/update/depth.ts":
/*!***************************************************!*\
!*** ./ts/modal/body/trees/style/update/depth.ts ***!
\***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addDepthChangeListener: () => (/* binding */ addDepthChangeListener),
/* harmony export */ getDepthClassCount: () => (/* binding */ getDepthClassCount),
/* harmony export */ updateDepth: () => (/* binding */ updateDepth)
/* harmony export */ });
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../index */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
const STYLESHEET = (0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.generateStylesheet)();
const callbacks = [];
let currentClassCount;
function getDepthClassCount() {
return currentClassCount;
}
function addDepthRule(selectors, styles) {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.addRule)(selectors, styles, STYLESHEET);
}
function addDepthChangeListener(callback) {
callbacks.push((depth) => callback(depth, addDepthRule));
for (let i = 0; i < currentClassCount; ++i) {
callback(i, addDepthRule);
}
}
function updateDepth(depth) {
for (let i = STYLESHEET.cssRules.length - 1; i >= 0; --i) {
STYLESHEET.deleteRule(i);
}
for (const root of Object.values(_index__WEBPACK_IMPORTED_MODULE_0__.ROOTS)) {
root.updateDepthClass(depth);
}
for (let i = 0; i < depth; ++i) {
for (const callback of callbacks) {
callback(i, addDepthRule);
}
}
currentClassCount = depth;
}
/***/ }),
/***/ "./ts/modal/body/trees/style/update/index.ts":
/*!***************************************************!*\
!*** ./ts/modal/body/trees/style/update/index.ts ***!
\***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ updateStylesheet)
/* harmony export */ });
/* harmony import */ var _depth__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./depth */ "./ts/modal/body/trees/style/update/depth.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
var __rest = (undefined && undefined.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
const STYLESHEET = (0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.generateStylesheet)();
function getContrast(hex, method) {
const r = parseInt(hex.slice(1, 3), 16);
const g = parseInt(hex.slice(3, 5), 16);
const b = parseInt(hex.slice(5, 7), 16);
switch (method) {
case 'Black / White': {
// https://stackoverflow.com/a/3943023/112731
const luminosity = r * 0.299 + g * 0.587 + b * 0.114;
return luminosity > 145 ? 'black' : 'white';
}
}
const toHexPart = (rgb) => {
const x = (255 - rgb).toString(16);
return x.length === 2 ? x : `0${x}`;
};
return `#${toHexPart(r)}${toHexPart((g))}${toHexPart(b)}`;
}
function updateStylesheet(_a) {
var { fontSize, headContrast, nodeBase, nodeContrast } = _a, colours = __rest(_a, ["fontSize", "headContrast", "nodeBase", "nodeContrast"]);
for (let i = STYLESHEET.cssRules.length - 1; i >= 0; --i) {
STYLESHEET.deleteRule(i);
}
(0,_depth__WEBPACK_IMPORTED_MODULE_0__.updateDepth)(nodeBase.length);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.addRule)('', ['font-size', `${fontSize}px`], STYLESHEET);
const colourStyles = Object.entries(colours).map(([property, value]) => [`--${property}`, value]);
for (const [depth, baseColour] of nodeBase.entries()) {
const contrastColour = getContrast(baseColour, nodeContrast);
colourStyles.push([`--nodeBase${depth}`, baseColour]);
colourStyles.push([`--nodeContrast${depth}`, contrastColour]);
}
colourStyles.push(['--headContrast', getContrast(colours.headBase, headContrast)]);
colourStyles.push(['--validFont', getContrast(colours.validBackground, nodeContrast)]);
colourStyles.push(['--invalidFont', getContrast(colours.invalidBackground, nodeContrast)]);
(0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.addVariables)(colourStyles, STYLESHEET);
}
/***/ }),
/***/ "./ts/modal/consts.ts":
/*!****************************!*\
!*** ./ts/modal/consts.ts ***!
\****************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BUTTON_ACTIVE_CLASS: () => (/* binding */ BUTTON_ACTIVE_CLASS),
/* harmony export */ MODAL_BACKGROUND_ID: () => (/* binding */ MODAL_BACKGROUND_ID),
/* harmony export */ MODAL_ID: () => (/* binding */ MODAL_ID),
/* harmony export */ SVG_NAMESPACE: () => (/* binding */ SVG_NAMESPACE)
/* harmony export */ });
const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
// Indicates 'on' state for actions that can be turned on and off
const BUTTON_ACTIVE_CLASS = 'active';
const MODAL_BACKGROUND_ID = 'modal-background';
const MODAL_ID = 'modal-content';
/***/ }),
/***/ "./ts/modal/css.ts":
/*!*************************!*\
!*** ./ts/modal/css.ts ***!
\*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addRule: () => (/* binding */ addRule),
/* harmony export */ addVariables: () => (/* binding */ addVariables),
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ generateStylesheet: () => (/* binding */ generateStylesheet),
/* harmony export */ getRuleString: () => (/* binding */ getRuleString),
/* harmony export */ getTargetWindow: () => (/* binding */ getTargetWindow),
/* harmony export */ setRootId: () => (/* binding */ setRootId)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/consts.ts");
let targetWindow = window;
while (targetWindow.frameElement) {
targetWindow = window.parent;
}
function getTargetWindow() {
return targetWindow;
}
let rootSelector = 'body';
function setRootId(id) {
rootSelector = `#${id}`;
}
function generateStylesheet() {
const wrapper = document.createElement('style');
getTargetWindow().document.head.appendChild(wrapper);
return wrapper.sheet;
}
const STYLESHEET = generateStylesheet();
function isStyle(candidate) {
return candidate.length > 0 && typeof candidate[0] === 'string';
}
function getStyleString([property, value]) {
return `${property}:${value};`;
}
function getRuleString(selectors, rules) {
const styleString = isStyle(rules) ? getStyleString(rules) : rules.map(getStyleString).join('');
const selectorString = typeof selectors === 'string' ? selectors : selectors.join(`,${rootSelector} `);
return `${rootSelector} ${selectorString}{${styleString}}`;
}
function addRule(selectors, styles, stylesheet = STYLESHEET) {
stylesheet.insertRule(getRuleString(selectors, styles));
}
function addVariables(rules, stylesheet = STYLESHEET) {
const styleString = rules.map(getStyleString).join('');
stylesheet.insertRule(`:root{${styleString}}`);
}
function generate() {
addRule(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_BACKGROUND_ID}`, [
['position', 'fixed'],
['left', '0'],
['top', '0'],
['width', '100%'],
['height', '100%'],
['background-color', '#0003'],
]);
addRule(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_ID}`, [
['position', 'relative'],
['margin', '12vh auto'],
['padding', '0'],
['width', '80%'],
['font-family', 'Tahoma, Geneva, sans-serif'],
['outline', 'var(--borderModal) solid 2px'],
['box-shadow', '1px 1px 10px 4px #00000015, 0 0 30px 10px #00000065'],
]);
addRule('button', [
['display', 'inline-flex'],
['cursor', 'pointer'],
['background', 'none'],
['font-size', 'inherit'],
['padding', '0'],
['margin', '0'],
['border', 'none'],
['outline-offset', '-2px'],
]);
addRule('button *', [['pointer-events', 'none']]);
addRule('svg', [['fill', 'none']]);
addRule('input', [
['font', 'inherit'],
['background', 'inherit'],
['color', 'inherit'],
['border', 'none'],
]);
addRule(':focus-visible:not(button):not(input)', [['outline', 'none']]);
addRule('label', [['cursor', 'inherit']]);
}
/***/ }),
/***/ "./ts/modal/header/actions/alternate/button.ts":
/*!*****************************************************!*\
!*** ./ts/modal/header/actions/alternate/button.ts ***!
\*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/alternate/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const ALPHA = Math.PI / 5;
const RADIUS = 46;
const points = [];
// https://stackoverflow.com/questions/14580033/algorithm-for-drawing-a-5-point-star
for (let i = 0; i < 12; ++i) {
const r = RADIUS * (i % 2 + 1) / 2;
const omega = ALPHA * i;
points.push([r * Math.sin(omega), r * Math.cos(omega)]);
}
const outline = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
outline.setAttribute('stroke-linecap', 'round');
outline.setAttribute('stroke-width', '7');
outline.setAttribute('d', points.map(([x, y], i) => `${i === 0 ? 'M' : 'L'} ${x},${y}`).join());
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(outline);
const BUTTON = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Toggle Special Buttons');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/header/actions/alternate/consts.ts":
/*!*****************************************************!*\
!*** ./ts/modal/header/actions/alternate/consts.ts ***!
\*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID)
/* harmony export */ });
const ACTION_ID = 'modal-alt';
/***/ }),
/***/ "./ts/modal/header/actions/alternate/css.ts":
/*!**************************************************!*\
!*** ./ts/modal/header/actions/alternate/css.ts ***!
\**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/alternate/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/header/actions/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--headButtonAlt');
}
/***/ }),
/***/ "./ts/modal/header/actions/alternate/index.ts":
/*!****************************************************!*\
!*** ./ts/modal/header/actions/alternate/index.ts ***!
\****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ isActive: () => (/* binding */ isActive)
/* harmony export */ });
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./ts/modal/header/actions/alternate/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/alternate/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/alternate/css.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
let _isActive = false;
let keyHeld = false;
function isActive() {
return _isActive;
}
function doAction(doActivate = !_isActive) {
(0,_modal_body_trees__WEBPACK_IMPORTED_MODULE_4__.setActive)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], _consts__WEBPACK_IMPORTED_MODULE_1__.ACTION_ID, doActivate);
_isActive = doActivate;
}
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_button__WEBPACK_IMPORTED_MODULE_3__.bindAction)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], doAction);
_button__WEBPACK_IMPORTED_MODULE_0__["default"].title += ' (Ctrl)';
const targetWindow = (0,_modal_css__WEBPACK_IMPORTED_MODULE_5__.getTargetWindow)();
targetWindow.addEventListener('keydown', (event) => {
if (event.key === 'Control') {
keyHeld = true;
doAction(true);
}
});
targetWindow.addEventListener('keyup', (event) => {
if (event.key === 'Control') {
keyHeld = false;
doAction(false);
}
});
targetWindow.addEventListener('blur', () => {
if (keyHeld) {
keyHeld = false;
doAction(false);
}
});
return _button__WEBPACK_IMPORTED_MODULE_0__["default"];
}
/***/ }),
/***/ "./ts/modal/header/actions/button.ts":
/*!*******************************************!*\
!*** ./ts/modal/header/actions/button.ts ***!
\*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ bindAction: () => (/* binding */ bindAction),
/* harmony export */ getNewButton: () => (/* binding */ getNewButton)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/consts.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../consts */ "./ts/modal/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
// Adds the template to the DOM
function bindAction(button, doAction, hotkey) {
const bound = (event) => {
event.stopPropagation();
button.blur();
doAction();
};
button.addEventListener('click', bound);
if (hotkey) {
button.title += ` (Alt+${hotkey})`;
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.getTargetWindow)().addEventListener('keydown', (event) => {
if (event.altKey && event.key.toUpperCase() === hotkey) {
bound(event);
}
});
}
return bound;
}
// Creates a template
const getNewButton = (function () {
const buttonTemplate = document.createElement('button');
const svgTemplate = document.createElementNS(_consts__WEBPACK_IMPORTED_MODULE_1__.SVG_NAMESPACE, 'svg');
buttonTemplate.classList.add(_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS);
// Prevent tabbing to buttons until node is focused
buttonTemplate.setAttribute('tabIndex', '2');
svgTemplate.setAttribute('viewBox', `-70 -70 140 140`);
return function (group, actionId, description) {
const button = buttonTemplate.cloneNode(true);
const svg = svgTemplate.cloneNode(true);
button.id = actionId;
button.title = description;
svg.append(group);
button.append(svg);
return button;
};
})();
/***/ }),
/***/ "./ts/modal/header/actions/close/button.ts":
/*!*************************************************!*\
!*** ./ts/modal/header/actions/close/button.ts ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/close/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const line0 = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
line0.setAttribute('stroke-linecap', 'round');
line0.setAttribute('stroke-width', '12');
line0.setAttribute('x1', '-30');
line0.setAttribute('x2', '30');
line0.setAttribute('y1', '-30');
line0.setAttribute('y2', '30');
const line1 = line0.cloneNode(true);
line1.setAttribute('transform', 'rotate(90 0 0)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(line0, line1);
const BUTTON = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Save & Exit');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/header/actions/close/consts.ts":
/*!*************************************************!*\
!*** ./ts/modal/header/actions/close/consts.ts ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID),
/* harmony export */ HOTKEY: () => (/* binding */ HOTKEY)
/* harmony export */ });
const ACTION_ID = 'modal-close';
const HOTKEY = 'X';
/***/ }),
/***/ "./ts/modal/header/actions/close/css.ts":
/*!**********************************************!*\
!*** ./ts/modal/header/actions/close/css.ts ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/close/consts.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.addRule)([
`#${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID}:focus > svg`,
`#${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID}:hover > svg`,
], ['background-color', 'var(--headButtonExit)']);
}
/***/ }),
/***/ "./ts/modal/header/actions/close/index.ts":
/*!************************************************!*\
!*** ./ts/modal/header/actions/close/index.ts ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ setCallback: () => (/* binding */ setCallback)
/* harmony export */ });
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./ts/modal/header/actions/close/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/close/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/close/css.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_body_trees_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/body/trees/data */ "./ts/modal/body/trees/data/index.ts");
/* harmony import */ var _modal_body_trees_style__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @/modal/body/trees/style */ "./ts/modal/body/trees/style/index.ts");
/* harmony import */ var _nodes_actions_focus__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @nodes/actions/focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _nodes_actions_edit__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @nodes/actions/edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _nodes_actions_buttons_move__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @nodes/actions/buttons/move */ "./ts/modal/body/trees/nodes/actions/buttons/move/index.ts");
/* harmony import */ var _nodes_actions_highlight__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @nodes/actions/highlight */ "./ts/modal/body/trees/nodes/actions/highlight/index.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
let callback;
function setCallback(_callback) {
callback = _callback;
}
// TODO Maybe add a white, 0.5 opacity foreground over everything with a loading symbol.
// Do the same when waiting for a config.
// Prevent interaction during loading by adding a stopPropagation click listener to the foreground.
function doAction() {
(0,_nodes_actions_focus__WEBPACK_IMPORTED_MODULE_6__.reset)();
(0,_nodes_actions_edit__WEBPACK_IMPORTED_MODULE_7__.reset)();
(0,_nodes_actions_buttons_move__WEBPACK_IMPORTED_MODULE_8__.reset)();
(0,_nodes_actions_highlight__WEBPACK_IMPORTED_MODULE_9__.reset)();
_modal_body_trees__WEBPACK_IMPORTED_MODULE_10__.TREE_CONTAINER.scroll(0, 0);
callback === null || callback === void 0 ? void 0 : callback({
tree: (0,_modal_body_trees_data__WEBPACK_IMPORTED_MODULE_4__.getRoot)().getJSON(),
styles: (0,_modal_body_trees_style__WEBPACK_IMPORTED_MODULE_5__.getUserStyles)(),
});
callback = undefined;
}
function generate(background) {
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_button__WEBPACK_IMPORTED_MODULE_3__.bindAction)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], doAction, _consts__WEBPACK_IMPORTED_MODULE_1__.HOTKEY);
background.addEventListener('click', (event) => {
if (background.isSameNode(event.target)) {
doAction();
}
});
return _button__WEBPACK_IMPORTED_MODULE_0__["default"];
}
/***/ }),
/***/ "./ts/modal/header/actions/consts.ts":
/*!*******************************************!*\
!*** ./ts/modal/header/actions/consts.ts ***!
\*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ BUTTON_CLASS: () => (/* binding */ BUTTON_CLASS),
/* harmony export */ BUTTON_CONTAINER_ID: () => (/* binding */ BUTTON_CONTAINER_ID)
/* harmony export */ });
const BUTTON_CLASS = 'modal-button';
const BUTTON_CONTAINER_ID = 'modal-button-container';
/***/ }),
/***/ "./ts/modal/header/actions/css.ts":
/*!****************************************!*\
!*** ./ts/modal/header/actions/css.ts ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ addColourRule: () => (/* binding */ addColourRule),
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/consts.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../consts */ "./ts/modal/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../css */ "./ts/modal/css.ts");
function addColourRule(actionId, colour) {
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`#${actionId}.${_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ACTIVE_CLASS} > svg`, [
['stroke', `var(--headBase)`],
['fill', `var(${colour})`],
]);
}
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CONTAINER_ID}`, [
['display', 'inline-flex'],
['flex-direction', 'row'],
]);
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:focus > svg`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:hover > svg`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}.${_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ACTIVE_CLASS} > svg`,
], ['background-color', `var(--headContrast)`]);
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}`, ['border-left', '2px solid var(--headContrast)']);
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:not(:first-child):focus`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:not(:first-child):hover`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:not(:first-child).${_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ACTIVE_CLASS}`,
], ['border-color', 'var(--headBase)']);
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)([
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:focus:not(.${_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ACTIVE_CLASS}) > svg`,
`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS}:hover:not(.${_consts__WEBPACK_IMPORTED_MODULE_1__.BUTTON_ACTIVE_CLASS}) > svg`,
], ['stroke', `var(--headBase)`]);
(0,_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`.${_consts__WEBPACK_IMPORTED_MODULE_0__.BUTTON_CLASS} > svg`, [
['width', '1.81em'],
['stroke', 'var(--headContrast)'],
['fill', `var(--headContrast)`],
// Fixes pixel gap between button border & svg
['margin-left', '-0.5px'],
]);
}
/***/ }),
/***/ "./ts/modal/header/actions/hide/button.ts":
/*!************************************************!*\
!*** ./ts/modal/header/actions/hide/button.ts ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/hide/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const edgeTop = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
edgeTop.setAttribute('stroke-linecap', 'round');
edgeTop.setAttribute('stroke-width', '6');
edgeTop.setAttribute('d', 'M -55, 0'
+ 'Q 0,80 55,0');
edgeTop.setAttribute('fill', 'none');
const edgeBottom = edgeTop.cloneNode(true);
edgeBottom.setAttribute('transform', 'scale(1,-1)');
const circle = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'circle');
circle.setAttribute('cx', '0');
circle.setAttribute('cy', '0');
circle.setAttribute('r', '26');
circle.setAttribute('stroke-width', '7');
const line = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'line');
line.setAttribute('stroke-linecap', 'round');
line.setAttribute('stroke-width', '7');
line.setAttribute('x1', '-26');
line.setAttribute('x2', '26');
line.setAttribute('y1', '0');
line.setAttribute('y2', '0');
line.setAttribute('transform', 'rotate(45 0 0)');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(edgeTop, edgeBottom, circle, line);
const BUTTON = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Toggle Disabled Node Visibility');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/header/actions/hide/consts.ts":
/*!************************************************!*\
!*** ./ts/modal/header/actions/hide/consts.ts ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID),
/* harmony export */ HOTKEY: () => (/* binding */ HOTKEY)
/* harmony export */ });
const ACTION_ID = 'modal-hide';
const HOTKEY = 'H';
/***/ }),
/***/ "./ts/modal/header/actions/hide/css.ts":
/*!*********************************************!*\
!*** ./ts/modal/header/actions/hide/css.ts ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/hide/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/header/actions/css.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
/* harmony import */ var _modal_body_trees_consts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/body/trees/consts */ "./ts/modal/body/trees/consts.ts");
/* harmony import */ var _nodes_actions_buttons_disable_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @nodes/actions/buttons/disable/consts */ "./ts/modal/body/trees/nodes/actions/buttons/disable/consts.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`#${_modal_body_trees_consts__WEBPACK_IMPORTED_MODULE_3__.TREE_CONTAINER_ID}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID}) .${_nodes_actions_buttons_disable_consts__WEBPACK_IMPORTED_MODULE_4__.DISABLED_CLASS}`, ['display', 'none']);
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--headButtonHide');
}
/***/ }),
/***/ "./ts/modal/header/actions/hide/index.ts":
/*!***********************************************!*\
!*** ./ts/modal/header/actions/hide/index.ts ***!
\***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./ts/modal/header/actions/hide/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/hide/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/hide/css.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
let isActive = false;
function doAction() {
isActive = !isActive;
(0,_modal_body_trees__WEBPACK_IMPORTED_MODULE_4__.setActive)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], _consts__WEBPACK_IMPORTED_MODULE_1__.ACTION_ID, isActive);
}
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_button__WEBPACK_IMPORTED_MODULE_3__.bindAction)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], doAction, _consts__WEBPACK_IMPORTED_MODULE_1__.HOTKEY);
_button__WEBPACK_IMPORTED_MODULE_0__["default"].click();
return _button__WEBPACK_IMPORTED_MODULE_0__["default"];
}
/***/ }),
/***/ "./ts/modal/header/actions/index.ts":
/*!******************************************!*\
!*** ./ts/modal/header/actions/index.ts ***!
\******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _close__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./close */ "./ts/modal/header/actions/close/index.ts");
/* harmony import */ var _labels__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./labels */ "./ts/modal/header/actions/labels/index.ts");
/* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style */ "./ts/modal/header/actions/style/index.ts");
/* harmony import */ var _hide__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./hide */ "./ts/modal/header/actions/hide/index.ts");
/* harmony import */ var _alternate__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./alternate */ "./ts/modal/header/actions/alternate/index.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/css.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/consts.ts");
function generate(background) {
(0,_css__WEBPACK_IMPORTED_MODULE_5__["default"])();
const element = document.createElement('span');
element.id = _consts__WEBPACK_IMPORTED_MODULE_6__.BUTTON_CONTAINER_ID;
element.append((0,_alternate__WEBPACK_IMPORTED_MODULE_4__["default"])(), (0,_hide__WEBPACK_IMPORTED_MODULE_3__["default"])(), (0,_labels__WEBPACK_IMPORTED_MODULE_1__["default"])(), (0,_style__WEBPACK_IMPORTED_MODULE_2__["default"])(), (0,_close__WEBPACK_IMPORTED_MODULE_0__["default"])(background));
return element;
}
/***/ }),
/***/ "./ts/modal/header/actions/labels/button.ts":
/*!**************************************************!*\
!*** ./ts/modal/header/actions/labels/button.ts ***!
\**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/labels/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const outline = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
outline.setAttribute('stroke-linecap', 'round');
outline.setAttribute('stroke-width', '7');
outline.setAttribute('d', 'M 20,-30'
+ 'L -40,-30'
+ 'L -40,30'
+ 'L 20,30'
+ 'L 50,0'
+ 'L 20,-30');
const circle = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'circle');
circle.setAttribute('stroke-width', '5');
circle.setAttribute('r', '5');
circle.setAttribute('cx', '20');
circle.setAttribute('cy', '0');
const loop = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
loop.setAttribute('fill', 'none');
loop.setAttribute('stroke-linecap', 'round');
loop.setAttribute('stroke-width', '6');
loop.setAttribute('d', 'M 20,0'
+ 'C -70,50 -30,50 15,30');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.setAttribute('transform', 'rotate(-60 0 0)');
g.append(outline, circle, loop);
const BUTTON = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Toggle Labels');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/header/actions/labels/consts.ts":
/*!**************************************************!*\
!*** ./ts/modal/header/actions/labels/consts.ts ***!
\**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID),
/* harmony export */ HOTKEY: () => (/* binding */ HOTKEY)
/* harmony export */ });
const ACTION_ID = 'modal-labels';
const HOTKEY = 'N';
/***/ }),
/***/ "./ts/modal/header/actions/labels/css.ts":
/*!***********************************************!*\
!*** ./ts/modal/header/actions/labels/css.ts ***!
\***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/labels/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/header/actions/css.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/css */ "./ts/modal/css.ts");
/* harmony import */ var _modal_body_trees_consts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/modal/body/trees/consts */ "./ts/modal/body/trees/consts.ts");
/* harmony import */ var _nodes_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @nodes/consts */ "./ts/modal/body/trees/nodes/consts.ts");
function generate() {
(0,_modal_css__WEBPACK_IMPORTED_MODULE_2__.addRule)(`#${_modal_body_trees_consts__WEBPACK_IMPORTED_MODULE_3__.TREE_CONTAINER_ID}:not(.${_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID}) .${_nodes_consts__WEBPACK_IMPORTED_MODULE_4__.ELEMENT_CLASSES.LABEL_CONTAINER}`, ['display', 'none']);
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--headButtonLabel');
}
/***/ }),
/***/ "./ts/modal/header/actions/labels/index.ts":
/*!*************************************************!*\
!*** ./ts/modal/header/actions/labels/index.ts ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./ts/modal/header/actions/labels/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/labels/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/labels/css.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
let isActive = false;
function doAction() {
isActive = !isActive;
(0,_modal_body_trees__WEBPACK_IMPORTED_MODULE_4__.setActive)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], _consts__WEBPACK_IMPORTED_MODULE_1__.ACTION_ID, isActive);
}
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_button__WEBPACK_IMPORTED_MODULE_3__.bindAction)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], doAction, _consts__WEBPACK_IMPORTED_MODULE_1__.HOTKEY);
_button__WEBPACK_IMPORTED_MODULE_0__["default"].click();
return _button__WEBPACK_IMPORTED_MODULE_0__["default"];
}
/***/ }),
/***/ "./ts/modal/header/actions/style/button.ts":
/*!*************************************************!*\
!*** ./ts/modal/header/actions/style/button.ts ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/style/consts.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/modal/consts */ "./ts/modal/consts.ts");
const handle = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'rect');
handle.setAttribute('stroke-linecap', 'round');
handle.setAttribute('stroke-width', '6');
handle.setAttribute('x', '-5');
handle.setAttribute('y', '15');
handle.setAttribute('width', '15');
handle.setAttribute('height', '40');
handle.setAttribute('rx', '5');
const frame = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
frame.setAttribute('fill', 'none');
frame.setAttribute('stroke-linecap', 'round');
frame.setAttribute('stroke-width', '3');
frame.setAttribute('d', 'M 2.5,15'
+ 'L 2.5,0'
+ 'L -36,-15'
+ 'L -36,-35'
+ 'L -30,-35');
const curveLeft = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'path');
curveLeft.setAttribute('fill', 'none');
curveLeft.setAttribute('stroke-linecap', 'round');
curveLeft.setAttribute('stroke-width', '6');
curveLeft.setAttribute('d', 'M -25 -30'
+ 'Q -30,-35 -25,-40');
const curveRight = curveLeft.cloneNode(true);
curveRight.setAttribute('transform', 'scale(-1,1) translate(-10,0)');
const roller = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'rect');
roller.setAttribute('stroke-linecap', 'round');
roller.setAttribute('stroke-width', '6');
roller.setAttribute('x', '-22.5');
roller.setAttribute('y', '-47.5');
roller.setAttribute('width', '55');
roller.setAttribute('height', '25');
roller.setAttribute('rx', '1');
const g = document.createElementNS(_modal_consts__WEBPACK_IMPORTED_MODULE_2__.SVG_NAMESPACE, 'g');
g.append(handle, frame, curveLeft, curveRight, roller);
const BUTTON = (0,_button__WEBPACK_IMPORTED_MODULE_1__.getNewButton)(g, _consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, 'Toggle Style Editor');
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BUTTON);
/***/ }),
/***/ "./ts/modal/header/actions/style/consts.ts":
/*!*************************************************!*\
!*** ./ts/modal/header/actions/style/consts.ts ***!
\*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ACTION_ID: () => (/* binding */ ACTION_ID),
/* harmony export */ HOTKEY: () => (/* binding */ HOTKEY)
/* harmony export */ });
const ACTION_ID = 'modal-style';
const HOTKEY = 'C';
/***/ }),
/***/ "./ts/modal/header/actions/style/css.ts":
/*!**********************************************!*\
!*** ./ts/modal/header/actions/style/css.ts ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/style/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/header/actions/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addColourRule)(_consts__WEBPACK_IMPORTED_MODULE_0__.ACTION_ID, '--headButtonStyle');
}
/***/ }),
/***/ "./ts/modal/header/actions/style/index.ts":
/*!************************************************!*\
!*** ./ts/modal/header/actions/style/index.ts ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./ts/modal/header/actions/style/button.ts");
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/actions/style/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css */ "./ts/modal/header/actions/style/css.ts");
/* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../button */ "./ts/modal/header/actions/button.ts");
/* harmony import */ var _modal_body_trees__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @/modal/body/trees */ "./ts/modal/body/trees/index.ts");
/* harmony import */ var _nodes_actions_focus__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @nodes/actions/focus */ "./ts/modal/body/trees/nodes/actions/focus/index.ts");
/* harmony import */ var _nodes_actions_edit__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @nodes/actions/edit */ "./ts/modal/body/trees/nodes/actions/edit/index.ts");
/* harmony import */ var _nodes_actions_buttons_move__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @nodes/actions/buttons/move */ "./ts/modal/body/trees/nodes/actions/buttons/move/index.ts");
let isActive = false;
function doAction() {
isActive = !isActive;
(0,_modal_body_trees__WEBPACK_IMPORTED_MODULE_4__.setActive)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], _consts__WEBPACK_IMPORTED_MODULE_1__.ACTION_ID, isActive);
(0,_nodes_actions_focus__WEBPACK_IMPORTED_MODULE_5__.reset)();
(0,_nodes_actions_edit__WEBPACK_IMPORTED_MODULE_6__.reset)();
(0,_nodes_actions_buttons_move__WEBPACK_IMPORTED_MODULE_7__.reset)();
// Reset tab index
document.body.focus();
}
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_2__["default"])();
(0,_button__WEBPACK_IMPORTED_MODULE_3__.bindAction)(_button__WEBPACK_IMPORTED_MODULE_0__["default"], doAction, _consts__WEBPACK_IMPORTED_MODULE_1__.HOTKEY);
return _button__WEBPACK_IMPORTED_MODULE_0__["default"];
}
/***/ }),
/***/ "./ts/modal/header/consts.ts":
/*!***********************************!*\
!*** ./ts/modal/header/consts.ts ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ HEADER_ID: () => (/* binding */ HEADER_ID)
/* harmony export */ });
const HEADER_ID = 'modal-header';
/***/ }),
/***/ "./ts/modal/header/css.ts":
/*!********************************!*\
!*** ./ts/modal/header/css.ts ***!
\********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../css */ "./ts/modal/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.HEADER_ID}`, [
['display', 'flex'],
['align-items', 'center'],
['background', 'var(--headBase)'],
['color', 'var(--headContrast)'],
['border-bottom', '2px solid var(--borderModal)'],
['font-size', '1.6em'],
['text-align', 'center'],
]);
}
/***/ }),
/***/ "./ts/modal/header/index.ts":
/*!**********************************!*\
!*** ./ts/modal/header/index.ts ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/consts.ts");
/* harmony import */ var _title__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./title */ "./ts/modal/header/title/index.ts");
/* harmony import */ var _actions__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./actions */ "./ts/modal/header/actions/index.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./css */ "./ts/modal/header/css.ts");
function generate({ title }, background) {
(0,_css__WEBPACK_IMPORTED_MODULE_3__["default"])();
const element = document.createElement('div');
element.id = _consts__WEBPACK_IMPORTED_MODULE_0__.HEADER_ID;
element.append((0,_title__WEBPACK_IMPORTED_MODULE_1__["default"])(title), (0,_actions__WEBPACK_IMPORTED_MODULE_2__["default"])(background));
return element;
}
/***/ }),
/***/ "./ts/modal/header/title/consts.ts":
/*!*****************************************!*\
!*** ./ts/modal/header/title/consts.ts ***!
\*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ TITLE_CONTAINER_ID: () => (/* binding */ TITLE_CONTAINER_ID),
/* harmony export */ TITLE_ID: () => (/* binding */ TITLE_ID)
/* harmony export */ });
const TITLE_CONTAINER_ID = 'title-container';
const TITLE_ID = 'title';
/***/ }),
/***/ "./ts/modal/header/title/css.ts":
/*!**************************************!*\
!*** ./ts/modal/header/title/css.ts ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/title/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../css */ "./ts/modal/css.ts");
function generate() {
(0,_css__WEBPACK_IMPORTED_MODULE_1__.addRule)(`#${_consts__WEBPACK_IMPORTED_MODULE_0__.TITLE_CONTAINER_ID}`, [
['flex-grow', '1'],
['white-space', 'nowrap'],
['overflow', 'hidden'],
['text-overflow', 'ellipsis'],
['padding', '0 20px'],
]);
}
/***/ }),
/***/ "./ts/modal/header/title/index.ts":
/*!****************************************!*\
!*** ./ts/modal/header/title/index.ts ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/header/title/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css */ "./ts/modal/header/title/css.ts");
function generate(title) {
(0,_css__WEBPACK_IMPORTED_MODULE_1__["default"])();
const titleContainer = document.createElement('span');
const titleElement = document.createElement('span');
titleContainer.id = _consts__WEBPACK_IMPORTED_MODULE_0__.TITLE_CONTAINER_ID;
titleElement.id = _consts__WEBPACK_IMPORTED_MODULE_0__.TITLE_ID;
titleElement.innerText = title;
// In case the text is too long to fit
titleElement.title = title;
titleContainer.append(titleElement);
return titleContainer;
}
/***/ }),
/***/ "./ts/modal/index.ts":
/*!***************************!*\
!*** ./ts/modal/index.ts ***!
\***************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ generate),
/* harmony export */ getSocket: () => (/* binding */ getSocket)
/* harmony export */ });
/* harmony import */ var _consts__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./consts */ "./ts/modal/consts.ts");
/* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css */ "./ts/modal/css.ts");
/* harmony import */ var _header__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./header */ "./ts/modal/header/index.ts");
/* harmony import */ var _body__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./body */ "./ts/modal/body/index.ts");
let socket;
function getSocket() {
return socket;
}
function generate(config, _socket) {
socket = _socket;
(0,_css__WEBPACK_IMPORTED_MODULE_1__["default"])();
const background = document.createElement('div');
const foreground = document.createElement('div');
background.id = _consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_BACKGROUND_ID;
foreground.id = _consts__WEBPACK_IMPORTED_MODULE_0__.MODAL_ID;
background.append(foreground);
socket.append(background);
foreground.append((0,_header__WEBPACK_IMPORTED_MODULE_2__["default"])(config, background));
foreground.append((0,_body__WEBPACK_IMPORTED_MODULE_3__["default"])(config));
}
/***/ }),
/***/ "./ts/predicate.ts":
/*!*************************!*\
!*** ./ts/predicate.ts ***!
\*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ getPredicatePromise: () => (/* binding */ getPredicatePromise)
/* harmony export */ });
var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
function getPredicateResponse(response) {
return __awaiter(this, void 0, void 0, function* () {
try {
return yield response;
}
catch ({ message }) {
throw message;
}
});
}
function getPredicatePromise(_response) {
return __awaiter(this, void 0, void 0, function* () {
const response = yield getPredicateResponse(_response);
if (typeof response === 'string') {
throw response;
}
else if (response) {
return;
}
throw null;
});
}
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it declares '$Config' on top-level, which conflicts with the current library output.
(() => {
/*!*******************************!*\
!*** ./ts/library/$Config.js ***!
\*******************************/
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ $Config)
/* harmony export */ });
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index */ "./ts/library/index.ts");
/* harmony import */ var _modal_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../modal/css */ "./ts/modal/css.ts");
/* harmony import */ var _modal_body__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../modal/body */ "./ts/modal/body/index.ts");
const VERSION = 0;
const KEY_VERSION = 'TREE_FRAME_VERSION';
const KEY_STYLES = 'TREE_FRAME_USER_STYLES';
const STYLE_OUTER = {
position: 'fixed',
height: '100vh',
width: '100vw',
};
const getStrippedForest = (children) => {
const stripped = [];
for (const child of children) {
if (child.isActive === false) {
continue;
}
const data = {};
if ('value' in child) {
data.value = child.value;
}
if ('label' in child) {
data.label = child.label;
}
if ('children' in child) {
data.children = getStrippedForest(child.children);
}
stripped.push(data);
}
return stripped;
};
const getError = (reason, error) => {
const message = `[${TITLE}]${reason.includes('\n') ? '\n\n' : ' '}${reason}`;
if (error) {
error.message = message;
return error;
}
return new Error(message);
};
/**
* A node's value.
* @typedef {boolean | number | string} NodeValue
*/
/**
* A child node.
* @typedef {object} ChildNode
* @property {string} [label] The node's purpose.
* @property {boolean | number | string} [value] The node's data.
* @property {Array<NodeValue> | function(NodeValue): boolean | string} [predicate] A data validator.
* @property {"color" | "date" | "datetime-local" | "email" | "month" | "password" | "search" | "tel" | "text" | "time" | "url" | "week"} [input] The desired input type.
*/
/**
* A parent node.
* @typedef {object} ParentNode
* @property {Array<ChildNode | (ChildNode & ParentNode)>} children The node's children.
* @property {ChildNode | (ChildNode & ParentNode)} [seed] - A node that may be added to children.
* @property {function(Array<ChildNode>): boolean | string} [childPredicate] A child validator.
* @property {function(Array<ChildNode>): boolean | string} [descendantPredicate] A descendant validator.
* @property {number} [poolId] Children may be moved between nodes with poolId values that match their parent's.
*/
/**
* A style to pass to the config-editor.
* @typedef {object} InnerStyle
* @property {number} [fontSize] The base font size.
* @property {string} [borderTooltip] The colour of tooltip borders.
* @property {string} [borderModal] The colour of the modal's border.
* @property {string} [headBase] The base colour of the modal's header.
* @property {'Black / White' | 'Invert'} [headContrast] The method of generating a contrast colour for the modal's header.
* @property {string} [headButtonExit] The colour of the modal header's exit button.
* @property {string} [headButtonLabel] The colour of the modal header's exit button.
* @property {string} [headButtonStyle] The colour of the modal header's style button.
* @property {string} [headButtonHide] The colour of the modal header's node-hider button.
* @property {string} [headButtonAlt] The colour of the modal header's alt button.
* @property {Array<string>} [nodeBase] Base colours for nodes, depending on their depth.
* @property {'Black / White' | 'Invert'} [nodeContrast] The method of generating a contrast colour for nodes.
* @property {string} [nodeButtonCreate] The colour of nodes' add-child buttons.
* @property {string} [nodeButtonDuplicate] The colour of nodes' duplicate buttons.
* @property {string} [nodeButtonMove] The colour of nodes' move buttons.
* @property {string} [nodeButtonDisable] The colour of nodes' toggle-active buttons.
* @property {string} [nodeButtonDelete] The colour of nodes' delete buttons.
* @property {string} [validBackground] The colour used to show that a node's value is valid.
* @property {string} [invalidBackground] The colour used to show that a node's value is invalid.
*/
class $Config {
/**
* @param {string} KEY_TREE The identifier used to store and retrieve the user's config.
* @param {ParentNode} TREE_DEFAULT The tree to use as a starting point for the user's config.
* @param {function(Array<ChildNode | (ChildNode & ParentNode)>): *} _getConfig Takes a root node's children and returns the data structure expected by your script.
* @param {string} TITLE The heading to use in the config-editor.
* @param {InnerStyle} [STYLE_INNER] A custom style to use as the default
* @param {object} [_STYLE_OUTER] CSS to assign to the element. e.g. {zIndex: 9999}.
*/
constructor(KEY_TREE, TREE_DEFAULT, _getConfig, TITLE, STYLE_INNER = {}, _STYLE_OUTER = {}) {
// PRIVATE FUNCTIONS
const getConfig = ({children}) => _getConfig(getStrippedForest(children));
// CORE PERMISSION CHECKS
if (typeof GM.getValue !== 'function') {
throw getError('Missing GM.getValue permission.');
}
if (typeof GM.setValue !== 'function') {
throw getError('Missing GM.setValue permission.');
}
if (typeof KEY_TREE !== 'string' || !(/^[a-z_][a-z0-9_]*$/i.test(KEY_TREE))) {
throw getError(`'${KEY_TREE}' is not a valid storage key.`);
}
// PRIVATE STATE
let isOpen = false;
const styleOuter = {
...STYLE_OUTER,
..._STYLE_OUTER,
};
// PUBLIC FUNCTIONS
const setConfig = (tree) => {
const config = getConfig(tree);
this.get = () => config;
};
this.ready = async () => {
// Setup root element
const target = (() => {
const target = document.createElement('div');
for (const [property, value] of Object.entries(styleOuter)) {
target.style[property] = value;
}
target.style.display = 'none';
(0,_modal_css__WEBPACK_IMPORTED_MODULE_1__.getTargetWindow)().document.body.appendChild(target);
return target;
})();
// Retrieve data
const [userTree, userStyles, version] = await Promise.all([
GM.getValue(KEY_TREE),
GM.getValue(KEY_STYLES, []),
GM.getValue(KEY_VERSION, -1),
]);
// Patch to current version
(() => {
if (version !== -1 || !userTree) {
return;
}
const patch = (node) => {
delete node.predicate;
delete node.childPredicate;
delete node.descendantPredicate;
delete node.seed;
if ('children' in node) {
for (const child of node.children) {
patch(child);
}
}
};
patch(userTree);
})();
// Listen for post-init communication
const open = (doOpen = true) => new Promise((resolve) => {
isOpen = doOpen;
target.style.display = doOpen ? (styleOuter.display ?? 'initial') : 'none';
// Delay script execution until visual update
setTimeout(resolve, 0);
});
const disconnect = () => new Promise((resolve) => {
isOpen = false;
target.remove();
// Delay script execution until visual update
setTimeout(resolve, 0);
});
/**
* @name $Config#reset
* @description Deletes the user's data.
* @returns {Promise<void>} Resolves upon completing the deletion.
*/
this.reset = async () => {
if (isOpen) {
throw getError('Cannot reset while the UI is open.');
}
if (typeof GM.deleteValue !== 'function') {
throw getError('Missing GM.deleteValue permission.');
}
try {
setConfig(TREE_DEFAULT);
} catch (error) {
throw getError('Unable to parse default config.', error);
}
await GM.deleteValue(KEY_TREE);
// It may have previously been a rejected promise
this.ready = Promise.resolve();
(0,_modal_body__WEBPACK_IMPORTED_MODULE_2__.reset)();
};
/**
* @name $Config#edit
* @description Allows the user to edit the active config.
* @returns {Promise<void>} Resolves when the user closes the config editor.
*/
this.edit = async () => {
if (isOpen) {
throw getError('A config editor is already open.');
}
open();
const {tree, styles} = await (0,_index__WEBPACK_IMPORTED_MODULE_0__.edit)();
GM.setValue(KEY_TREE, tree);
GM.setValue(KEY_STYLES, styles);
GM.setValue(KEY_VERSION, VERSION);
setConfig(tree);
await open(false);
};
// Pass data
try {
const response = await (0,_index__WEBPACK_IMPORTED_MODULE_0__.init)({
userStyles,
defaultTree: TREE_DEFAULT,
title: TITLE,
defaultStyle: STYLE_INNER,
...(userTree ? {userTree} : {}),
}, target, KEY_TREE);
if (response.requireReset) {
throw getError(
'Your config is invalid.'
+ '\nThis could be due to a script update or your data being corrupted.'
+ `\n\nReason:\n${response.error.message.replaceAll(/\n+/g, '\n')}`,
response.error,
);
}
setConfig(response.tree);
} catch (error) {
delete this.reset;
await disconnect();
throw getError(
'Your config is invalid.'
+ '\nThis could be due to a script update or your data being corrupted.'
+ `\n\nReason:\n${error.message.replaceAll(/\n+/g, '\n')}`,
error,
);
}
};
}
}
})();
$Config = __webpack_exports__["default"];
/******/ })()
;