@pie-element/placement-ordering 14.1.1-next.1 → 14.1.1-next.11

package/lib/index.js

@@ -0,0 +1,122 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isValidSession = exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _client = require("react-dom/client");
+var _lodashEs = require("lodash-es");
+var _debug = _interopRequireDefault(require("debug"));
+var _mathRendering = require("@pie-lib/math-rendering");
+var _piePlayerEvents = require("@pie-framework/pie-player-events");
+var _main = _interopRequireDefault(require("./main"));
+const log = (0, _debug.default)('pie-elements:placement-ordering');
+const isValidSession = ({
+  model,
+  session
+}) => {
+  const {
+    config
+  } = model;
+  const compactSessionValues = session && (0, _lodashEs.compact)(session.value) || [];
+  const completeSession = compactSessionValues.length === model.choices.length;
+
+  // if it includes targets, it doesn't have to contain all the choices selected (eg: only 2 targets were filled)
+  // but if it does not include targets, it's a must to have all choices selected
+  return config.includeTargets || completeSession;
+};
+exports.isValidSession = isValidSession;
+class Ordering extends HTMLElement {
+  constructor() {
+    super();
+    (0, _defineProperty2.default)(this, "_scheduleMathRender", () => {
+      if (this._mathRenderPending) return;
+      this._mathRenderPending = true;
+      requestAnimationFrame(() => {
+        if (this._mathObserver) {
+          this._mathObserver.disconnect();
+        }
+        (0, _mathRendering.renderMath)(this);
+        this._mathRenderPending = false;
+        setTimeout(() => {
+          if (this._mathObserver) {
+            this._mathObserver.observe(this, {
+              childList: true,
+              subtree: true
+            });
+          }
+        }, 50);
+      });
+    });
+    (0, _defineProperty2.default)(this, "isComplete", value => value && (0, _lodashEs.compact)(value).length === this._model.completeLength);
+    (0, _defineProperty2.default)(this, "sessionChange", session => {
+      this._session.value = session.value;
+      this.render();
+      this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), this._session && this.isComplete(this._session.value)));
+    });
+    this._root = null;
+    this._mathObserver = null;
+    this._mathRenderPending = false;
+  }
+  _initMathObserver() {
+    if (this._mathObserver) return;
+    this._mathObserver = new MutationObserver(this._scheduleMathRender);
+    this._mathObserver.observe(this, {
+      childList: true,
+      subtree: true
+    });
+  }
+  _disconnectMathObserver() {
+    if (this._mathObserver) {
+      this._mathObserver.disconnect();
+      this._mathObserver = null;
+    }
+  }
+  set model(newModel) {
+    this._model = newModel;
+    this.render();
+    this.dispatchEvent(new CustomEvent('model-set', {
+      bubbles: true,
+      detail: {
+        complete: false
+      }
+    }));
+  }
+  set session(newSession) {
+    this._session = newSession;
+    this.render();
+  }
+  get session() {
+    return this._session;
+  }
+  render() {
+    if (this._model && this._session) {
+      log('[render] session: ', this._session.value);
+      log('[render] model: ', this._model);
+      this._initMathObserver();
+      const element = /*#__PURE__*/_react.default.createElement(_main.default, {
+        model: this._model,
+        session: this._session,
+        onSessionChange: this.sessionChange
+      });
+      if (!this._root) {
+        this._root = (0, _client.createRoot)(this);
+      }
+      this._root.render(element);
+    }
+  }
+  connectedCallback() {
+    this._initMathObserver();
+  }
+  disconnectedCallback() {
+    this._disconnectMathObserver();
+    if (this._root) {
+      this._root.unmount();
+    }
+  }
+}
+exports.default = Ordering;
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_lodashEs","_debug","_mathRendering","_piePlayerEvents","_main","log","debug","isValidSession","model","session","config","compactSessionValues","compact","value","completeSession","length","choices","includeTargets","exports","Ordering","HTMLElement","constructor","_defineProperty2","default","_mathRenderPending","requestAnimationFrame","_mathObserver","disconnect","renderMath","setTimeout","observe","childList","subtree","_model","completeLength","_session","render","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","isComplete","_root","_initMathObserver","MutationObserver","_scheduleMathRender","_disconnectMathObserver","newModel","CustomEvent","bubbles","detail","complete","newSession","element","React","createElement","Main","onSessionChange","sessionChange","createRoot","connectedCallback","disconnectedCallback","unmount"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { compact } from 'lodash-es';\nimport debug from 'debug';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport Main from './main';\n\nconst log = debug('pie-elements:placement-ordering');\n\nexport const isValidSession = ({ model, session }) => {\n  const { config } = model;\n\n  const compactSessionValues = (session && compact(session.value)) || [];\n  const completeSession = compactSessionValues.length === model.choices.length;\n\n  // if it includes targets, it doesn't have to contain all the choices selected (eg: only 2 targets were filled)\n  // but if it does not include targets, it's a must to have all choices selected\n  return config.includeTargets || completeSession;\n};\n\nexport default class Ordering extends HTMLElement {\n  constructor() {\n    super();\n    this._root = null;\n    this._mathObserver = null;\n    this._mathRenderPending = false;\n  }\n\n  _scheduleMathRender = () => {\n    if (this._mathRenderPending) return;\n    this._mathRenderPending = true;\n\n    requestAnimationFrame(() => {\n      if (this._mathObserver) {\n        this._mathObserver.disconnect();\n      }\n      renderMath(this);\n      this._mathRenderPending = false;\n      setTimeout(() => {\n        if (this._mathObserver) {\n          this._mathObserver.observe(this, { childList: true, subtree: true });\n        }\n      }, 50);\n    });\n  };\n\n  _initMathObserver() {\n    if (this._mathObserver) return;\n    this._mathObserver = new MutationObserver(this._scheduleMathRender);\n    this._mathObserver.observe(this, { childList: true, subtree: true });\n  }\n\n  _disconnectMathObserver() {\n    if (this._mathObserver) {\n      this._mathObserver.disconnect();\n      this._mathObserver = null;\n    }\n  }\n\n  isComplete = (value) => value && compact(value).length === this._model.completeLength;\n\n  sessionChange = (session) => {\n    this._session.value = session.value;\n    this.render();\n    this.dispatchEvent(\n      new SessionChangedEvent(this.tagName.toLowerCase(), this._session && this.isComplete(this._session.value)),\n    );\n  };\n\n  set model(newModel) {\n    this._model = newModel;\n\n    this.render();\n    this.dispatchEvent(\n      new CustomEvent('model-set', {\n        bubbles: true,\n        detail: {\n          complete: false,\n        },\n      }),\n    );\n  }\n\n  set session(newSession) {\n    this._session = newSession;\n    this.render();\n  }\n\n  get session() {\n    return this._session;\n  }\n\n  render() {\n    if (this._model && this._session) {\n      log('[render] session: ', this._session.value);\n      log('[render] model: ', this._model);\n\n      this._initMathObserver();\n\n      const element = React.createElement(Main, {\n        model: this._model,\n        session: this._session,\n        onSessionChange: this.sessionChange,\n      });\n\n      if (!this._root) {\n        this._root = createRoot(this);\n      }\n      this._root.render(element);\n    }\n  }\n\n  connectedCallback() {\n    this._initMathObserver();\n  }\n\n  disconnectedCallback() {\n    this._disconnectMathObserver();\n    if (this._root) {\n      this._root.unmount();\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/main.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _placementOrdering = _interopRequireDefault(require("./placement-ordering"));
+class Main extends _react.default.Component {
+  render() {
+    const {
+      model,
+      session,
+      onSessionChange
+    } = this.props;
+    return /*#__PURE__*/_react.default.createElement(_placementOrdering.default, {
+      model: model,
+      session: session,
+      onSessionChange: onSessionChange
+    });
+  }
+}
+(0, _defineProperty2.default)(Main, "propTypes", {
+  model: _propTypes.default.object.isRequired,
+  session: _propTypes.default.oneOfType([_propTypes.default.array.isRequired, _propTypes.default.object.isRequired]),
+  onSessionChange: _propTypes.default.func.isRequired
+});
+var _default = exports.default = Main;
+//# sourceMappingURL=main.js.map

package/lib/main.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.js","names":["_react","_interopRequireDefault","require","_propTypes","_placementOrdering","Main","React","Component","render","model","session","onSessionChange","props","default","createElement","_defineProperty2","PropTypes","object","isRequired","oneOfType","array","func","_default","exports"],"sources":["../src/main.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport PlacementOrdering from './placement-ordering';\n\nclass Main extends React.Component {\n  static propTypes = {\n    model: PropTypes.object.isRequired,\n    session: PropTypes.oneOfType([PropTypes.array.isRequired, PropTypes.object.isRequired]),\n    onSessionChange: PropTypes.func.isRequired,\n  };\n\n  render() {\n    const { model, session, onSessionChange } = this.props;\n\n    return (\n      <PlacementOrdering model={model} session={session} onSessionChange={onSessionChange} />\n    );\n  }\n}\n\nexport default Main;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,kBAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,MAAMG,IAAI,SAASC,cAAK,CAACC,SAAS,CAAC;EAOjCC,MAAMA,CAAA,EAAG;IACP,MAAM;MAAEC,KAAK;MAAEC,OAAO;MAAEC;IAAgB,CAAC,GAAG,IAAI,CAACC,KAAK;IAEtD,oBACEZ,MAAA,CAAAa,OAAA,CAAAC,aAAA,CAACV,kBAAA,CAAAS,OAAiB;MAACJ,KAAK,EAAEA,KAAM;MAACC,OAAO,EAAEA,OAAQ;MAACC,eAAe,EAAEA;IAAgB,CAAE,CAAC;EAE3F;AACF;AAAC,IAAAI,gBAAA,CAAAF,OAAA,EAdKR,IAAI,eACW;EACjBI,KAAK,EAAEO,kBAAS,CAACC,MAAM,CAACC,UAAU;EAClCR,OAAO,EAAEM,kBAAS,CAACG,SAAS,CAAC,CAACH,kBAAS,CAACI,KAAK,CAACF,UAAU,EAAEF,kBAAS,CAACC,MAAM,CAACC,UAAU,CAAC,CAAC;EACvFP,eAAe,EAAEK,kBAAS,CAACK,IAAI,CAACH;AAClC,CAAC;AAAA,IAAAI,QAAA,GAAAC,OAAA,CAAAV,OAAA,GAWYR,IAAI","ignoreList":[]}

package/lib/ordering.js

@@ -0,0 +1,165 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildState = buildState;
+exports.push = void 0;
+exports.reducer = reducer;
+exports.swap = void 0;
+var _lodashEs = require("lodash-es");
+var _debug = _interopRequireDefault(require("debug"));
+const log = (0, _debug.default)('pie-elements:placement-ordering:ordering');
+const push = (arr, fromIndex, toIndex) => {
+  const movedItem = arr.find((item, index) => index === fromIndex);
+  const remainingItems = arr.filter((item, index) => index !== fromIndex);
+  return [...remainingItems.slice(0, toIndex), movedItem, ...remainingItems.slice(toIndex)];
+};
+exports.push = push;
+const swap = (arr, fromIndex, toIndex) => {
+  log('[swap]', arr, fromIndex, toIndex);
+  if (!arr || arr.length <= 1 || fromIndex === undefined || toIndex === undefined) {
+    throw new Error(`swap requires a non-empty array, fromIndex, toIndex: ${arr}, ${fromIndex} ${toIndex}`);
+  }
+  const update = (0, _lodashEs.cloneDeep)(arr);
+  const tmp = arr[toIndex];
+  update[toIndex] = update[fromIndex];
+  update[fromIndex] = tmp;
+  return update;
+};
+exports.swap = swap;
+function removeResponse(state, targetTile) {
+  const update = (0, _lodashEs.cloneDeep)(state.response);
+  if (update[targetTile.index] === targetTile.id) {
+    update[targetTile.index] = undefined;
+  } else {
+    throw new Error(`Tried to remove from index: ${targetTile.index}, but the id doesn't match: array: ${update}, target: ${targetTile.id}`);
+  }
+  return update;
+}
+function updateResponse(state, from, to) {
+  const {
+    response,
+    opts
+  } = state;
+  const update = (0, _lodashEs.cloneDeep)(response);
+  if (opts.includeTargets) {
+    if (from.type === 'choice' && to.type === 'target') {
+      update[to.index] = from.id;
+      return update;
+    } else if (from.type === 'target' && to.type === 'choice') {
+      update[from.index] = undefined;
+      return update;
+    } else if (from.type === 'target' && to.type === 'target') {
+      return swap(response, from.index, to.index);
+    } else {
+      log('do nothing to the response');
+      return response;
+    }
+  } else {
+    const fromIndex = state.response.findIndex(r => r !== undefined && r === from.id);
+    const toIndex = state.response.findIndex(r => r !== undefined && r === to.id);
+    log('fromIndex: ', fromIndex, 'toIndex:', toIndex);
+    return push(state.response, fromIndex, toIndex);
+  }
+}
+function buildTiles(choices, response, outcomes, opts) {
+  if (opts.includeTargets) {
+    const targets = [];
+    for (let i = 0; i < response.length; i++) {
+      const r = response[i];
+      const choice = choices.find(c => r !== undefined && r !== null && c.id === r);
+      //TODO: index needs to match too!!
+      const outcome = outcomes[i];
+      const out = Object.assign({
+        type: 'target',
+        index: i,
+        empty: choice === undefined
+      }, choice, outcome, {
+        draggable: choice !== undefined
+      });
+      targets.push(out);
+    }
+    const processedChoices = choices.map(m => {
+      if (response.indexOf(m.id) !== -1 && !opts.allowSameChoiceInTargets) {
+        return {
+          type: 'choice',
+          empty: true,
+          droppable: true,
+          draggable: false
+        };
+      } else {
+        return Object.assign({}, m, {
+          type: 'choice',
+          droppable: false,
+          draggable: true
+        });
+      }
+    });
+    return processedChoices.concat(targets);
+  } else {
+    return response.reduce((acc, id, index) => {
+      const emptyTile = Object.assign({
+        type: 'empty',
+        draggable: false,
+        droppable: true
+      }, choices.find(m => m.id === id), outcomes[index]);
+      const choiceTile = Object.assign({
+        type: 'choice',
+        draggable: true,
+        droppable: true
+      }, choices.find(m => m.id === id), outcomes[index]);
+      if (index === 0) {
+        acc.push(emptyTile);
+      }
+      acc.push(choiceTile, emptyTile);
+      return acc;
+    }, []);
+  }
+}
+function buildState(choices, response, outcomes, opts) {
+  opts = (0, _lodashEs.assign)({
+    includeTargets: true
+  }, opts);
+  outcomes = outcomes || [];
+  response = !response || (0, _lodashEs.isEmpty)(response) ? opts.includeTargets ? new Array(choices.length) : (0, _lodashEs.map)(choices, c => c.id) : response;
+  return {
+    choices,
+    response,
+    opts,
+    outcomes,
+    tiles: buildTiles(choices, response, outcomes, opts)
+  };
+}
+function reducer(action, state) {
+  switch (action.type) {
+    case 'move':
+      {
+        const {
+          from,
+          to
+        } = action;
+        const response = updateResponse(state, from, to);
+        const tiles = buildTiles(state.choices, response, state.outcomes, state.opts);
+        return Object.assign({}, state, {
+          response,
+          tiles
+        });
+      }
+    case 'remove':
+      {
+        const {
+          target
+        } = action;
+        const response = removeResponse(state, target);
+        const tiles = buildTiles(state.choices, response, state.outcomes, state.opts);
+        return Object.assign({}, state, {
+          response,
+          tiles
+        });
+      }
+  }
+  return state;
+}
+//# sourceMappingURL=ordering.js.map

package/lib/ordering.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ordering.js","names":["_lodashEs","require","_debug","_interopRequireDefault","log","debug","push","arr","fromIndex","toIndex","movedItem","find","item","index","remainingItems","filter","slice","exports","swap","length","undefined","Error","update","cloneDeep","tmp","removeResponse","state","targetTile","response","id","updateResponse","from","to","opts","includeTargets","type","findIndex","r","buildTiles","choices","outcomes","targets","i","choice","c","outcome","out","Object","assign","empty","draggable","processedChoices","map","m","indexOf","allowSameChoiceInTargets","droppable","concat","reduce","acc","emptyTile","choiceTile","buildState","isEmpty","Array","tiles","reducer","action","target"],"sources":["../src/ordering.js"],"sourcesContent":["import { assign, cloneDeep, isEmpty, map } from 'lodash-es';\nimport debug from 'debug';\n\nconst log = debug('pie-elements:placement-ordering:ordering');\n\nexport const push = (arr, fromIndex, toIndex) => {\n  const movedItem = arr.find((item, index) => index === fromIndex);\n  const remainingItems = arr.filter((item, index) => index !== fromIndex);\n\n  return [...remainingItems.slice(0, toIndex), movedItem, ...remainingItems.slice(toIndex)];\n};\n\nexport const swap = (arr, fromIndex, toIndex) => {\n  log('[swap]', arr, fromIndex, toIndex);\n  if (!arr || arr.length <= 1 || fromIndex === undefined || toIndex === undefined) {\n    throw new Error(`swap requires a non-empty array, fromIndex, toIndex: ${arr}, ${fromIndex} ${toIndex}`);\n  }\n  const update = cloneDeep(arr);\n  const tmp = arr[toIndex];\n  update[toIndex] = update[fromIndex];\n  update[fromIndex] = tmp;\n  return update;\n};\n\nfunction removeResponse(state, targetTile) {\n  const update = cloneDeep(state.response);\n\n  if (update[targetTile.index] === targetTile.id) {\n    update[targetTile.index] = undefined;\n  } else {\n    throw new Error(\n      `Tried to remove from index: ${targetTile.index}, but the id doesn't match: array: ${update}, target: ${targetTile.id}`,\n    );\n  }\n  return update;\n}\n\nfunction updateResponse(state, from, to) {\n  const { response, opts } = state;\n  const update = cloneDeep(response);\n  if (opts.includeTargets) {\n    if (from.type === 'choice' && to.type === 'target') {\n      update[to.index] = from.id;\n      return update;\n    } else if (from.type === 'target' && to.type === 'choice') {\n      update[from.index] = undefined;\n      return update;\n    } else if (from.type === 'target' && to.type === 'target') {\n      return swap(response, from.index, to.index);\n    } else {\n      log('do nothing to the response');\n      return response;\n    }\n  } else {\n    const fromIndex = state.response.findIndex((r) => r !== undefined && r === from.id);\n    const toIndex = state.response.findIndex((r) => r !== undefined && r === to.id);\n    log('fromIndex: ', fromIndex, 'toIndex:', toIndex);\n    return push(state.response, fromIndex, toIndex);\n  }\n}\n\nfunction buildTiles(choices, response, outcomes, opts) {\n  if (opts.includeTargets) {\n    const targets = [];\n    for (let i = 0; i < response.length; i++) {\n      const r = response[i];\n\n      const choice = choices.find((c) => r !== undefined && r !== null && c.id === r);\n      //TODO: index needs to match too!!\n      const outcome = outcomes[i];\n\n      const out = Object.assign({ type: 'target', index: i, empty: choice === undefined }, choice, outcome, {\n        draggable: choice !== undefined,\n      });\n\n      targets.push(out);\n    }\n\n    const processedChoices = choices.map((m) => {\n      if (response.indexOf(m.id) !== -1 && !opts.allowSameChoiceInTargets) {\n        return {\n          type: 'choice',\n          empty: true,\n          droppable: true,\n          draggable: false,\n        };\n      } else {\n        return Object.assign({}, m, {\n          type: 'choice',\n          droppable: false,\n          draggable: true,\n        });\n      }\n    });\n\n    return processedChoices.concat(targets);\n  } else {\n    return response.reduce((acc, id, index) => {\n      const emptyTile = Object.assign(\n        { type: 'empty', draggable: false, droppable: true },\n        choices.find((m) => m.id === id),\n        outcomes[index],\n      );\n      const choiceTile = Object.assign(\n        { type: 'choice', draggable: true, droppable: true },\n        choices.find((m) => m.id === id),\n        outcomes[index],\n      );\n\n      if (index === 0) {\n        acc.push(emptyTile);\n      }\n\n      acc.push(choiceTile, emptyTile);\n\n      return acc;\n    }, []);\n  }\n}\n\nexport function buildState(choices, response, outcomes, opts) {\n  opts = assign({ includeTargets: true }, opts);\n\n  outcomes = outcomes || [];\n  response =\n    !response || isEmpty(response)\n      ? opts.includeTargets\n        ? new Array(choices.length)\n        : map(choices, (c) => c.id)\n      : response;\n  return {\n    choices,\n    response,\n    opts,\n    outcomes,\n    tiles: buildTiles(choices, response, outcomes, opts),\n  };\n}\n\nexport function reducer(action, state) {\n  switch (action.type) {\n    case 'move': {\n      const { from, to } = action;\n      const response = updateResponse(state, from, to);\n      const tiles = buildTiles(state.choices, response, state.outcomes, state.opts);\n      return Object.assign({}, state, { response, tiles });\n    }\n    case 'remove': {\n      const { target } = action;\n      const response = removeResponse(state, target);\n      const tiles = buildTiles(state.choices, response, state.outcomes, state.opts);\n      return Object.assign({}, state, { response, tiles });\n    }\n  }\n  return state;\n}\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,MAAMG,GAAG,GAAG,IAAAC,cAAK,EAAC,0CAA0C,CAAC;AAEtD,MAAMC,IAAI,GAAGA,CAACC,GAAG,EAAEC,SAAS,EAAEC,OAAO,KAAK;EAC/C,MAAMC,SAAS,GAAGH,GAAG,CAACI,IAAI,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAKA,KAAK,KAAKL,SAAS,CAAC;EAChE,MAAMM,cAAc,GAAGP,GAAG,CAACQ,MAAM,CAAC,CAACH,IAAI,EAAEC,KAAK,KAAKA,KAAK,KAAKL,SAAS,CAAC;EAEvE,OAAO,CAAC,GAAGM,cAAc,CAACE,KAAK,CAAC,CAAC,EAAEP,OAAO,CAAC,EAAEC,SAAS,EAAE,GAAGI,cAAc,CAACE,KAAK,CAACP,OAAO,CAAC,CAAC;AAC3F,CAAC;AAACQ,OAAA,CAAAX,IAAA,GAAAA,IAAA;AAEK,MAAMY,IAAI,GAAGA,CAACX,GAAG,EAAEC,SAAS,EAAEC,OAAO,KAAK;EAC/CL,GAAG,CAAC,QAAQ,EAAEG,GAAG,EAAEC,SAAS,EAAEC,OAAO,CAAC;EACtC,IAAI,CAACF,GAAG,IAAIA,GAAG,CAACY,MAAM,IAAI,CAAC,IAAIX,SAAS,KAAKY,SAAS,IAAIX,OAAO,KAAKW,SAAS,EAAE;IAC/E,MAAM,IAAIC,KAAK,CAAC,wDAAwDd,GAAG,KAAKC,SAAS,IAAIC,OAAO,EAAE,CAAC;EACzG;EACA,MAAMa,MAAM,GAAG,IAAAC,mBAAS,EAAChB,GAAG,CAAC;EAC7B,MAAMiB,GAAG,GAAGjB,GAAG,CAACE,OAAO,CAAC;EACxBa,MAAM,CAACb,OAAO,CAAC,GAAGa,MAAM,CAACd,SAAS,CAAC;EACnCc,MAAM,CAACd,SAAS,CAAC,GAAGgB,GAAG;EACvB,OAAOF,MAAM;AACf,CAAC;AAACL,OAAA,CAAAC,IAAA,GAAAA,IAAA;AAEF,SAASO,cAAcA,CAACC,KAAK,EAAEC,UAAU,EAAE;EACzC,MAAML,MAAM,GAAG,IAAAC,mBAAS,EAACG,KAAK,CAACE,QAAQ,CAAC;EAExC,IAAIN,MAAM,CAACK,UAAU,CAACd,KAAK,CAAC,KAAKc,UAAU,CAACE,EAAE,EAAE;IAC9CP,MAAM,CAACK,UAAU,CAACd,KAAK,CAAC,GAAGO,SAAS;EACtC,CAAC,MAAM;IACL,MAAM,IAAIC,KAAK,CACb,+BAA+BM,UAAU,CAACd,KAAK,sCAAsCS,MAAM,aAAaK,UAAU,CAACE,EAAE,EACvH,CAAC;EACH;EACA,OAAOP,MAAM;AACf;AAEA,SAASQ,cAAcA,CAACJ,KAAK,EAAEK,IAAI,EAAEC,EAAE,EAAE;EACvC,MAAM;IAAEJ,QAAQ;IAAEK;EAAK,CAAC,GAAGP,KAAK;EAChC,MAAMJ,MAAM,GAAG,IAAAC,mBAAS,EAACK,QAAQ,CAAC;EAClC,IAAIK,IAAI,CAACC,cAAc,EAAE;IACvB,IAAIH,IAAI,CAACI,IAAI,KAAK,QAAQ,IAAIH,EAAE,CAACG,IAAI,KAAK,QAAQ,EAAE;MAClDb,MAAM,CAACU,EAAE,CAACnB,KAAK,CAAC,GAAGkB,IAAI,CAACF,EAAE;MAC1B,OAAOP,MAAM;IACf,CAAC,MAAM,IAAIS,IAAI,CAACI,IAAI,KAAK,QAAQ,IAAIH,EAAE,CAACG,IAAI,KAAK,QAAQ,EAAE;MACzDb,MAAM,CAACS,IAAI,CAAClB,KAAK,CAAC,GAAGO,SAAS;MAC9B,OAAOE,MAAM;IACf,CAAC,MAAM,IAAIS,IAAI,CAACI,IAAI,KAAK,QAAQ,IAAIH,EAAE,CAACG,IAAI,KAAK,QAAQ,EAAE;MACzD,OAAOjB,IAAI,CAACU,QAAQ,EAAEG,IAAI,CAAClB,KAAK,EAAEmB,EAAE,CAACnB,KAAK,CAAC;IAC7C,CAAC,MAAM;MACLT,GAAG,CAAC,4BAA4B,CAAC;MACjC,OAAOwB,QAAQ;IACjB;EACF,CAAC,MAAM;IACL,MAAMpB,SAAS,GAAGkB,KAAK,CAACE,QAAQ,CAACQ,SAAS,CAAEC,CAAC,IAAKA,CAAC,KAAKjB,SAAS,IAAIiB,CAAC,KAAKN,IAAI,CAACF,EAAE,CAAC;IACnF,MAAMpB,OAAO,GAAGiB,KAAK,CAACE,QAAQ,CAACQ,SAAS,CAAEC,CAAC,IAAKA,CAAC,KAAKjB,SAAS,IAAIiB,CAAC,KAAKL,EAAE,CAACH,EAAE,CAAC;IAC/EzB,GAAG,CAAC,aAAa,EAAEI,SAAS,EAAE,UAAU,EAAEC,OAAO,CAAC;IAClD,OAAOH,IAAI,CAACoB,KAAK,CAACE,QAAQ,EAAEpB,SAAS,EAAEC,OAAO,CAAC;EACjD;AACF;AAEA,SAAS6B,UAAUA,CAACC,OAAO,EAAEX,QAAQ,EAAEY,QAAQ,EAAEP,IAAI,EAAE;EACrD,IAAIA,IAAI,CAACC,cAAc,EAAE;IACvB,MAAMO,OAAO,GAAG,EAAE;IAClB,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGd,QAAQ,CAACT,MAAM,EAAEuB,CAAC,EAAE,EAAE;MACxC,MAAML,CAAC,GAAGT,QAAQ,CAACc,CAAC,CAAC;MAErB,MAAMC,MAAM,GAAGJ,OAAO,CAAC5B,IAAI,CAAEiC,CAAC,IAAKP,CAAC,KAAKjB,SAAS,IAAIiB,CAAC,KAAK,IAAI,IAAIO,CAAC,CAACf,EAAE,KAAKQ,CAAC,CAAC;MAC/E;MACA,MAAMQ,OAAO,GAAGL,QAAQ,CAACE,CAAC,CAAC;MAE3B,MAAMI,GAAG,GAAGC,MAAM,CAACC,MAAM,CAAC;QAAEb,IAAI,EAAE,QAAQ;QAAEtB,KAAK,EAAE6B,CAAC;QAAEO,KAAK,EAAEN,MAAM,KAAKvB;MAAU,CAAC,EAAEuB,MAAM,EAAEE,OAAO,EAAE;QACpGK,SAAS,EAAEP,MAAM,KAAKvB;MACxB,CAAC,CAAC;MAEFqB,OAAO,CAACnC,IAAI,CAACwC,GAAG,CAAC;IACnB;IAEA,MAAMK,gBAAgB,GAAGZ,OAAO,CAACa,GAAG,CAAEC,CAAC,IAAK;MAC1C,IAAIzB,QAAQ,CAAC0B,OAAO,CAACD,CAAC,CAACxB,EAAE,CAAC,KAAK,CAAC,CAAC,IAAI,CAACI,IAAI,CAACsB,wBAAwB,EAAE;QACnE,OAAO;UACLpB,IAAI,EAAE,QAAQ;UACdc,KAAK,EAAE,IAAI;UACXO,SAAS,EAAE,IAAI;UACfN,SAAS,EAAE;QACb,CAAC;MACH,CAAC,MAAM;QACL,OAAOH,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEK,CAAC,EAAE;UAC1BlB,IAAI,EAAE,QAAQ;UACdqB,SAAS,EAAE,KAAK;UAChBN,SAAS,EAAE;QACb,CAAC,CAAC;MACJ;IACF,CAAC,CAAC;IAEF,OAAOC,gBAAgB,CAACM,MAAM,CAAChB,OAAO,CAAC;EACzC,CAAC,MAAM;IACL,OAAOb,QAAQ,CAAC8B,MAAM,CAAC,CAACC,GAAG,EAAE9B,EAAE,EAAEhB,KAAK,KAAK;MACzC,MAAM+C,SAAS,GAAGb,MAAM,CAACC,MAAM,CAC7B;QAAEb,IAAI,EAAE,OAAO;QAAEe,SAAS,EAAE,KAAK;QAAEM,SAAS,EAAE;MAAK,CAAC,EACpDjB,OAAO,CAAC5B,IAAI,CAAE0C,CAAC,IAAKA,CAAC,CAACxB,EAAE,KAAKA,EAAE,CAAC,EAChCW,QAAQ,CAAC3B,KAAK,CAChB,CAAC;MACD,MAAMgD,UAAU,GAAGd,MAAM,CAACC,MAAM,CAC9B;QAAEb,IAAI,EAAE,QAAQ;QAAEe,SAAS,EAAE,IAAI;QAAEM,SAAS,EAAE;MAAK,CAAC,EACpDjB,OAAO,CAAC5B,IAAI,CAAE0C,CAAC,IAAKA,CAAC,CAACxB,EAAE,KAAKA,EAAE,CAAC,EAChCW,QAAQ,CAAC3B,KAAK,CAChB,CAAC;MAED,IAAIA,KAAK,KAAK,CAAC,EAAE;QACf8C,GAAG,CAACrD,IAAI,CAACsD,SAAS,CAAC;MACrB;MAEAD,GAAG,CAACrD,IAAI,CAACuD,UAAU,EAAED,SAAS,CAAC;MAE/B,OAAOD,GAAG;IACZ,CAAC,EAAE,EAAE,CAAC;EACR;AACF;AAEO,SAASG,UAAUA,CAACvB,OAAO,EAAEX,QAAQ,EAAEY,QAAQ,EAAEP,IAAI,EAAE;EAC5DA,IAAI,GAAG,IAAAe,gBAAM,EAAC;IAAEd,cAAc,EAAE;EAAK,CAAC,EAAED,IAAI,CAAC;EAE7CO,QAAQ,GAAGA,QAAQ,IAAI,EAAE;EACzBZ,QAAQ,GACN,CAACA,QAAQ,IAAI,IAAAmC,iBAAO,EAACnC,QAAQ,CAAC,GAC1BK,IAAI,CAACC,cAAc,GACjB,IAAI8B,KAAK,CAACzB,OAAO,CAACpB,MAAM,CAAC,GACzB,IAAAiC,aAAG,EAACb,OAAO,EAAGK,CAAC,IAAKA,CAAC,CAACf,EAAE,CAAC,GAC3BD,QAAQ;EACd,OAAO;IACLW,OAAO;IACPX,QAAQ;IACRK,IAAI;IACJO,QAAQ;IACRyB,KAAK,EAAE3B,UAAU,CAACC,OAAO,EAAEX,QAAQ,EAAEY,QAAQ,EAAEP,IAAI;EACrD,CAAC;AACH;AAEO,SAASiC,OAAOA,CAACC,MAAM,EAAEzC,KAAK,EAAE;EACrC,QAAQyC,MAAM,CAAChC,IAAI;IACjB,KAAK,MAAM;MAAE;QACX,MAAM;UAAEJ,IAAI;UAAEC;QAAG,CAAC,GAAGmC,MAAM;QAC3B,MAAMvC,QAAQ,GAAGE,cAAc,CAACJ,KAAK,EAAEK,IAAI,EAAEC,EAAE,CAAC;QAChD,MAAMiC,KAAK,GAAG3B,UAAU,CAACZ,KAAK,CAACa,OAAO,EAAEX,QAAQ,EAAEF,KAAK,CAACc,QAAQ,EAAEd,KAAK,CAACO,IAAI,CAAC;QAC7E,OAAOc,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEtB,KAAK,EAAE;UAAEE,QAAQ;UAAEqC;QAAM,CAAC,CAAC;MACtD;IACA,KAAK,QAAQ;MAAE;QACb,MAAM;UAAEG;QAAO,CAAC,GAAGD,MAAM;QACzB,MAAMvC,QAAQ,GAAGH,cAAc,CAACC,KAAK,EAAE0C,MAAM,CAAC;QAC9C,MAAMH,KAAK,GAAG3B,UAAU,CAACZ,KAAK,CAACa,OAAO,EAAEX,QAAQ,EAAEF,KAAK,CAACc,QAAQ,EAAEd,KAAK,CAACO,IAAI,CAAC;QAC7E,OAAOc,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEtB,KAAK,EAAE;UAAEE,QAAQ;UAAEqC;QAAM,CAAC,CAAC;MACtD;EACF;EACA,OAAOvC,KAAK;AACd","ignoreList":[]}