gwchq-textjam 0.2.31 → 0.2.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +513 -517
- package/dist/style.css +2 -4
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -103460,6 +103460,7 @@ var jsx_runtime = __webpack_require__(74848);
|
|
|
103460
103460
|
|
|
103461
103461
|
|
|
103462
103462
|
var NO_CHANGES_TO_SAVE_MESSAGE = "No new changes to save!";
|
|
103463
|
+
var DEFAULT_TOOLTIP = "Save project";
|
|
103463
103464
|
var SaveButton = props => {
|
|
103464
103465
|
var dispatch = (0,external_react_redux_.useDispatch)();
|
|
103465
103466
|
var {
|
|
@@ -103489,8 +103490,8 @@ var SaveButton = props => {
|
|
|
103489
103490
|
className: styles_module.wrapper
|
|
103490
103491
|
}, hoverProps), {}, {
|
|
103491
103492
|
children: [/*#__PURE__*/(0,jsx_runtime.jsx)((Tooltip_default()), {
|
|
103492
|
-
message: NO_CHANGES_TO_SAVE_MESSAGE,
|
|
103493
|
-
visible:
|
|
103493
|
+
message: DEFAULT_TOOLTIP + (hasChangesToSave ? "" : "\n" + NO_CHANGES_TO_SAVE_MESSAGE),
|
|
103494
|
+
visible: hovered,
|
|
103494
103495
|
position: "bottom"
|
|
103495
103496
|
}), /*#__PURE__*/(0,jsx_runtime.jsx)(Button["default"], (0,objectSpread2/* default */.A)({
|
|
103496
103497
|
buttonText: buttonText,
|
|
@@ -142941,7 +142942,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
142941
142942
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
142942
142943
|
/* harmony export */ });
|
|
142943
142944
|
// extracted by mini-css-extract-plugin
|
|
142944
|
-
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({"grey-rpi-grey-15":"#d5d7dc","grey-rpi-grey-40":"#9497a4","grey-rpi-grey-5":"#f1f2f3","grey-rpi-grey-70":"#4a4d59","grey-rpf-white":"#fff","tree":"styles-module__tree--KziAJ","fileTreeActions":"styles-module__fileTreeActions--k+Wsd","fileTreeActionsLabel":"styles-module__fileTreeActionsLabel--dPZp4","importButton":"styles-module__importButton--rcLUm","importArrowIcon":"styles-module__importArrowIcon--3eOLN","label":"styles-module__label--WY51f","iconButton":"styles-module__iconButton--6UIVe","iconButtonFilled":"styles-module__iconButtonFilled--w2vJC","dragline":"styles-module__dragline--RXmTT","emptyStateContainer":"styles-module__emptyStateContainer--AnTAm","emptyStateIcon":"styles-module__emptyStateIcon--sDlxK","emptyStateMessage":"styles-module__emptyStateMessage--OkPax"});
|
|
142945
|
+
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({"grey-rpi-grey-15":"#d5d7dc","grey-rpi-grey-40":"#9497a4","grey-rpi-grey-5":"#f1f2f3","grey-rpi-grey-70":"#4a4d59","grey-rpf-white":"#fff","tree":"styles-module__tree--KziAJ","fileTreeActions":"styles-module__fileTreeActions--k+Wsd","tooltipWrapper":"styles-module__tooltipWrapper--wltXE","fileTreeActionsLabel":"styles-module__fileTreeActionsLabel--dPZp4","importButton":"styles-module__importButton--rcLUm","importArrowIcon":"styles-module__importArrowIcon--3eOLN","label":"styles-module__label--WY51f","iconButton":"styles-module__iconButton--6UIVe","iconButtonFilled":"styles-module__iconButtonFilled--w2vJC","dragline":"styles-module__dragline--RXmTT","emptyStateContainer":"styles-module__emptyStateContainer--AnTAm","emptyStateIcon":"styles-module__emptyStateIcon--sDlxK","emptyStateMessage":"styles-module__emptyStateMessage--OkPax"});
|
|
142945
142946
|
|
|
142946
142947
|
/***/ }),
|
|
142947
142948
|
|
|
@@ -346790,10 +346791,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
346790
346791
|
|
|
346791
346792
|
// EXPORTS
|
|
346792
346793
|
__webpack_require__.d(__webpack_exports__, {
|
|
346793
|
-
Tab: () => (/* reexport */
|
|
346794
|
-
TabList: () => (/* reexport */
|
|
346795
|
-
TabPanel: () => (/* reexport */
|
|
346796
|
-
Tabs: () => (/* reexport */
|
|
346794
|
+
Tab: () => (/* reexport */ components_Tab),
|
|
346795
|
+
TabList: () => (/* reexport */ components_TabList),
|
|
346796
|
+
TabPanel: () => (/* reexport */ components_TabPanel),
|
|
346797
|
+
Tabs: () => (/* reexport */ components_Tabs),
|
|
346797
346798
|
resetIdCounter: () => (/* reexport */ uuid_reset)
|
|
346798
346799
|
});
|
|
346799
346800
|
|
|
@@ -346942,13 +346943,6 @@ function count_getTabsCount(children) {
|
|
|
346942
346943
|
});
|
|
346943
346944
|
return tabCount;
|
|
346944
346945
|
}
|
|
346945
|
-
function count_getPanelsCount(children) {
|
|
346946
|
-
var panelCount = 0;
|
|
346947
|
-
childrenDeepMap_deepForEach(children, function (child) {
|
|
346948
|
-
if (elementTypes_isTabPanel(child)) panelCount++;
|
|
346949
|
-
});
|
|
346950
|
-
return panelCount;
|
|
346951
|
-
}
|
|
346952
346946
|
;// ./node_modules/react-tabs/esm/components/UncontrolledTabs.js
|
|
346953
346947
|
var _excluded = ["children", "className", "disabledTabClassName", "domRef", "focus", "forceRenderTabPanel", "onSelect", "selectedIndex", "selectedTabClassName", "selectedTabPanelClassName", "environment", "disableUpDownKeys"];
|
|
346954
346948
|
|
|
@@ -346956,10 +346950,6 @@ function UncontrolledTabs_extends() { UncontrolledTabs_extends = Object.assign |
|
|
|
346956
346950
|
|
|
346957
346951
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
346958
346952
|
|
|
346959
|
-
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
|
|
346960
|
-
|
|
346961
|
-
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
346962
|
-
|
|
346963
346953
|
|
|
346964
346954
|
|
|
346965
346955
|
|
|
@@ -346995,219 +346985,135 @@ function determineCanUseActiveElement(environment) {
|
|
|
346995
346985
|
// Refer to the following resources:
|
|
346996
346986
|
// http://stackoverflow.com/a/10982960/369687
|
|
346997
346987
|
// https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12733599
|
|
346988
|
+
// istanbul ignore next
|
|
346998
346989
|
canUseActiveElement = false;
|
|
346999
346990
|
}
|
|
347000
346991
|
}
|
|
347001
346992
|
|
|
347002
|
-
var
|
|
347003
|
-
|
|
347004
|
-
|
|
347005
|
-
|
|
347006
|
-
|
|
347007
|
-
|
|
347008
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
347009
|
-
args[_key] = arguments[_key];
|
|
347010
|
-
}
|
|
347011
|
-
|
|
347012
|
-
_this = _Component.call.apply(_Component, [this].concat(args)) || this;
|
|
347013
|
-
_this.tabNodes = [];
|
|
347014
|
-
|
|
347015
|
-
_this.handleKeyDown = function (e) {
|
|
347016
|
-
var _this$props = _this.props,
|
|
347017
|
-
direction = _this$props.direction,
|
|
347018
|
-
disableUpDownKeys = _this$props.disableUpDownKeys;
|
|
347019
|
-
|
|
347020
|
-
if (_this.isTabFromContainer(e.target)) {
|
|
347021
|
-
var index = _this.props.selectedIndex;
|
|
347022
|
-
var preventDefault = false;
|
|
347023
|
-
var useSelectedIndex = false;
|
|
347024
|
-
|
|
347025
|
-
if (e.keyCode === 32 || e.keyCode === 13) {
|
|
347026
|
-
preventDefault = true;
|
|
347027
|
-
useSelectedIndex = false;
|
|
347028
|
-
|
|
347029
|
-
_this.handleClick(e);
|
|
347030
|
-
}
|
|
347031
|
-
|
|
347032
|
-
if (e.keyCode === 37 || !disableUpDownKeys && e.keyCode === 38) {
|
|
347033
|
-
// Select next tab to the left, validate if up arrow is not disabled
|
|
347034
|
-
if (direction === 'rtl') {
|
|
347035
|
-
index = _this.getNextTab(index);
|
|
347036
|
-
} else {
|
|
347037
|
-
index = _this.getPrevTab(index);
|
|
347038
|
-
}
|
|
347039
|
-
|
|
347040
|
-
preventDefault = true;
|
|
347041
|
-
useSelectedIndex = true;
|
|
347042
|
-
} else if (e.keyCode === 39 || !disableUpDownKeys && e.keyCode === 40) {
|
|
347043
|
-
// Select next tab to the right, validate if down arrow is not disabled
|
|
347044
|
-
if (direction === 'rtl') {
|
|
347045
|
-
index = _this.getPrevTab(index);
|
|
347046
|
-
} else {
|
|
347047
|
-
index = _this.getNextTab(index);
|
|
347048
|
-
}
|
|
347049
|
-
|
|
347050
|
-
preventDefault = true;
|
|
347051
|
-
useSelectedIndex = true;
|
|
347052
|
-
} else if (e.keyCode === 35) {
|
|
347053
|
-
// Select last tab (End key)
|
|
347054
|
-
index = _this.getLastTab();
|
|
347055
|
-
preventDefault = true;
|
|
347056
|
-
useSelectedIndex = true;
|
|
347057
|
-
} else if (e.keyCode === 36) {
|
|
347058
|
-
// Select first tab (Home key)
|
|
347059
|
-
index = _this.getFirstTab();
|
|
347060
|
-
preventDefault = true;
|
|
347061
|
-
useSelectedIndex = true;
|
|
347062
|
-
} // This prevents scrollbars from moving around
|
|
347063
|
-
|
|
347064
|
-
|
|
347065
|
-
if (preventDefault) {
|
|
347066
|
-
e.preventDefault();
|
|
347067
|
-
} // Only use the selected index in the state if we're not using the tabbed index
|
|
347068
|
-
|
|
347069
|
-
|
|
347070
|
-
if (useSelectedIndex) {
|
|
347071
|
-
_this.setSelected(index, e);
|
|
347072
|
-
}
|
|
347073
|
-
}
|
|
347074
|
-
};
|
|
347075
|
-
|
|
347076
|
-
_this.handleClick = function (e) {
|
|
347077
|
-
var node = e.target;
|
|
347078
|
-
|
|
347079
|
-
do {
|
|
347080
|
-
if (_this.isTabFromContainer(node)) {
|
|
347081
|
-
if (isTabDisabled(node)) {
|
|
347082
|
-
return;
|
|
347083
|
-
}
|
|
347084
|
-
|
|
347085
|
-
var index = [].slice.call(node.parentNode.children).filter(isTabNode).indexOf(node);
|
|
347086
|
-
|
|
347087
|
-
_this.setSelected(index, e);
|
|
347088
|
-
|
|
347089
|
-
return;
|
|
347090
|
-
}
|
|
347091
|
-
} while ((node = node.parentNode) != null);
|
|
347092
|
-
};
|
|
346993
|
+
var defaultProps = {
|
|
346994
|
+
className: 'react-tabs',
|
|
346995
|
+
focus: false
|
|
346996
|
+
};
|
|
346997
|
+
var propTypes = false ? 0 : {};
|
|
347093
346998
|
|
|
347094
|
-
|
|
347095
|
-
|
|
346999
|
+
var UncontrolledTabs = function UncontrolledTabs(props) {
|
|
347000
|
+
var tabNodes = (0,external_react_.useRef)([]);
|
|
347001
|
+
var tabIds = (0,external_react_.useRef)([]);
|
|
347002
|
+
var panelIds = (0,external_react_.useRef)([]);
|
|
347096
347003
|
|
|
347097
|
-
var
|
|
347004
|
+
var _ref = (0,external_react_.useRef)();
|
|
347098
347005
|
|
|
347099
|
-
|
|
347006
|
+
function setSelected(index, event) {
|
|
347100
347007
|
// Check index boundary
|
|
347101
|
-
if (index < 0 || index >=
|
|
347102
|
-
var
|
|
347103
|
-
|
|
347104
|
-
selectedIndex = _this$props2.selectedIndex; // Call change event handler
|
|
347008
|
+
if (index < 0 || index >= getTabsCount()) return;
|
|
347009
|
+
var onSelect = props.onSelect,
|
|
347010
|
+
selectedIndex = props.selectedIndex; // Call change event handler
|
|
347105
347011
|
|
|
347106
347012
|
onSelect(index, selectedIndex, event);
|
|
347107
|
-
}
|
|
347013
|
+
}
|
|
347108
347014
|
|
|
347109
|
-
|
|
347110
|
-
var count =
|
|
347015
|
+
function getNextTab(index) {
|
|
347016
|
+
var count = getTabsCount(); // Look for non-disabled tab from index to the last tab on the right
|
|
347111
347017
|
|
|
347112
347018
|
for (var i = index + 1; i < count; i++) {
|
|
347113
|
-
if (!isTabDisabled(
|
|
347019
|
+
if (!isTabDisabled(getTab(i))) {
|
|
347114
347020
|
return i;
|
|
347115
347021
|
}
|
|
347116
347022
|
} // If no tab found, continue searching from first on left to index
|
|
347117
347023
|
|
|
347118
347024
|
|
|
347119
347025
|
for (var _i = 0; _i < index; _i++) {
|
|
347120
|
-
if (!isTabDisabled(
|
|
347026
|
+
if (!isTabDisabled(getTab(_i))) {
|
|
347121
347027
|
return _i;
|
|
347122
347028
|
}
|
|
347123
|
-
} //
|
|
347029
|
+
} // All tabs are disabled, return index
|
|
347030
|
+
|
|
347031
|
+
/* istanbul ignore next */
|
|
347124
347032
|
|
|
347125
347033
|
|
|
347126
347034
|
return index;
|
|
347127
|
-
}
|
|
347035
|
+
}
|
|
347128
347036
|
|
|
347129
|
-
|
|
347037
|
+
function getPrevTab(index) {
|
|
347130
347038
|
var i = index; // Look for non-disabled tab from index to first tab on the left
|
|
347131
347039
|
|
|
347132
347040
|
while (i--) {
|
|
347133
|
-
if (!isTabDisabled(
|
|
347041
|
+
if (!isTabDisabled(getTab(i))) {
|
|
347134
347042
|
return i;
|
|
347135
347043
|
}
|
|
347136
347044
|
} // If no tab found, continue searching from last tab on right to index
|
|
347137
347045
|
|
|
347138
347046
|
|
|
347139
|
-
i =
|
|
347047
|
+
i = getTabsCount();
|
|
347140
347048
|
|
|
347141
347049
|
while (i-- > index) {
|
|
347142
|
-
if (!isTabDisabled(
|
|
347050
|
+
if (!isTabDisabled(getTab(i))) {
|
|
347143
347051
|
return i;
|
|
347144
347052
|
}
|
|
347145
|
-
} //
|
|
347053
|
+
} // All tabs are disabled, return index
|
|
347054
|
+
|
|
347055
|
+
/* istanbul ignore next */
|
|
347146
347056
|
|
|
347147
347057
|
|
|
347148
347058
|
return index;
|
|
347149
|
-
}
|
|
347059
|
+
}
|
|
347150
347060
|
|
|
347151
|
-
|
|
347152
|
-
var count =
|
|
347061
|
+
function getFirstTab() {
|
|
347062
|
+
var count = getTabsCount(); // Look for non disabled tab from the first tab
|
|
347153
347063
|
|
|
347154
347064
|
for (var i = 0; i < count; i++) {
|
|
347155
|
-
if (!isTabDisabled(
|
|
347065
|
+
if (!isTabDisabled(getTab(i))) {
|
|
347156
347066
|
return i;
|
|
347157
347067
|
}
|
|
347158
347068
|
}
|
|
347069
|
+
/* istanbul ignore next */
|
|
347070
|
+
|
|
347159
347071
|
|
|
347160
347072
|
return null;
|
|
347161
|
-
}
|
|
347073
|
+
}
|
|
347162
347074
|
|
|
347163
|
-
|
|
347164
|
-
var i =
|
|
347075
|
+
function getLastTab() {
|
|
347076
|
+
var i = getTabsCount(); // Look for non disabled tab from the last tab
|
|
347165
347077
|
|
|
347166
347078
|
while (i--) {
|
|
347167
|
-
if (!isTabDisabled(
|
|
347079
|
+
if (!isTabDisabled(getTab(i))) {
|
|
347168
347080
|
return i;
|
|
347169
347081
|
}
|
|
347170
347082
|
}
|
|
347083
|
+
/* istanbul ignore next */
|
|
347084
|
+
|
|
347171
347085
|
|
|
347172
347086
|
return null;
|
|
347173
|
-
}
|
|
347087
|
+
}
|
|
347174
347088
|
|
|
347175
|
-
|
|
347176
|
-
var children =
|
|
347089
|
+
function getTabsCount() {
|
|
347090
|
+
var children = props.children;
|
|
347177
347091
|
return count_getTabsCount(children);
|
|
347178
|
-
}
|
|
347179
|
-
|
|
347180
|
-
_proto.getPanelsCount = function getPanelsCount() {
|
|
347181
|
-
var children = this.props.children;
|
|
347182
|
-
return count_getPanelsCount(children);
|
|
347183
|
-
};
|
|
347184
|
-
|
|
347185
|
-
_proto.getTab = function getTab(index) {
|
|
347186
|
-
return this.tabNodes["tabs-" + index];
|
|
347187
|
-
};
|
|
347092
|
+
}
|
|
347188
347093
|
|
|
347189
|
-
|
|
347190
|
-
|
|
347094
|
+
function getTab(index) {
|
|
347095
|
+
return tabNodes.current["tabs-" + index];
|
|
347096
|
+
}
|
|
347191
347097
|
|
|
347098
|
+
function getChildren() {
|
|
347192
347099
|
var index = 0;
|
|
347193
|
-
var
|
|
347194
|
-
|
|
347195
|
-
|
|
347196
|
-
|
|
347197
|
-
|
|
347198
|
-
|
|
347199
|
-
|
|
347200
|
-
|
|
347201
|
-
|
|
347202
|
-
|
|
347203
|
-
|
|
347204
|
-
var diff = this.tabIds.length - this.getTabsCount(); // Add ids if new tabs have been added
|
|
347100
|
+
var children = props.children,
|
|
347101
|
+
disabledTabClassName = props.disabledTabClassName,
|
|
347102
|
+
focus = props.focus,
|
|
347103
|
+
forceRenderTabPanel = props.forceRenderTabPanel,
|
|
347104
|
+
selectedIndex = props.selectedIndex,
|
|
347105
|
+
selectedTabClassName = props.selectedTabClassName,
|
|
347106
|
+
selectedTabPanelClassName = props.selectedTabPanelClassName,
|
|
347107
|
+
environment = props.environment;
|
|
347108
|
+
tabIds.current = tabIds.current || [];
|
|
347109
|
+
panelIds.current = panelIds.current || [];
|
|
347110
|
+
var diff = tabIds.current.length - getTabsCount(); // Add ids if new tabs have been added
|
|
347205
347111
|
// Don't bother removing ids, just keep them in case they are added again
|
|
347206
347112
|
// This is more efficient, and keeps the uuid counter under control
|
|
347207
347113
|
|
|
347208
347114
|
while (diff++ < 0) {
|
|
347209
|
-
|
|
347210
|
-
|
|
347115
|
+
tabIds.current.push(uuid());
|
|
347116
|
+
panelIds.current.push(uuid());
|
|
347211
347117
|
} // Map children to dynamically setup refs
|
|
347212
347118
|
|
|
347213
347119
|
|
|
@@ -347224,10 +347130,11 @@ var UncontrolledTabs = /*#__PURE__*/function (_Component) {
|
|
|
347224
347130
|
determineCanUseActiveElement(environment);
|
|
347225
347131
|
}
|
|
347226
347132
|
|
|
347227
|
-
|
|
347133
|
+
var env = environment || (typeof window !== 'undefined' ? window : undefined);
|
|
347134
|
+
|
|
347135
|
+
if (canUseActiveElement && env) {
|
|
347228
347136
|
wasTabFocused = external_react_["default"].Children.toArray(child.props.children).filter(elementTypes_isTab).some(function (tab, i) {
|
|
347229
|
-
|
|
347230
|
-
return env && env.document.activeElement === _this2.getTab(i);
|
|
347137
|
+
return env.document.activeElement === getTab(i);
|
|
347231
347138
|
});
|
|
347232
347139
|
}
|
|
347233
347140
|
|
|
@@ -347237,10 +347144,10 @@ var UncontrolledTabs = /*#__PURE__*/function (_Component) {
|
|
|
347237
347144
|
var selected = selectedIndex === listIndex;
|
|
347238
347145
|
var props = {
|
|
347239
347146
|
tabRef: function tabRef(node) {
|
|
347240
|
-
|
|
347147
|
+
tabNodes.current[key] = node;
|
|
347241
347148
|
},
|
|
347242
|
-
id:
|
|
347243
|
-
panelId:
|
|
347149
|
+
id: tabIds.current[listIndex],
|
|
347150
|
+
panelId: panelIds.current[listIndex],
|
|
347244
347151
|
selected: selected,
|
|
347245
347152
|
focus: selected && (focus || wasTabFocused)
|
|
347246
347153
|
};
|
|
@@ -347251,27 +347158,116 @@ var UncontrolledTabs = /*#__PURE__*/function (_Component) {
|
|
|
347251
347158
|
})
|
|
347252
347159
|
});
|
|
347253
347160
|
} else if (elementTypes_isTabPanel(child)) {
|
|
347254
|
-
var
|
|
347255
|
-
id:
|
|
347256
|
-
tabId:
|
|
347161
|
+
var _props = {
|
|
347162
|
+
id: panelIds.current[index],
|
|
347163
|
+
tabId: tabIds.current[index],
|
|
347257
347164
|
selected: selectedIndex === index
|
|
347258
347165
|
};
|
|
347259
|
-
if (forceRenderTabPanel)
|
|
347260
|
-
if (selectedTabPanelClassName)
|
|
347166
|
+
if (forceRenderTabPanel) _props.forceRender = forceRenderTabPanel;
|
|
347167
|
+
if (selectedTabPanelClassName) _props.selectedClassName = selectedTabPanelClassName;
|
|
347261
347168
|
index++;
|
|
347262
|
-
result = /*#__PURE__*/(0,external_react_.cloneElement)(child,
|
|
347169
|
+
result = /*#__PURE__*/(0,external_react_.cloneElement)(child, _props);
|
|
347263
347170
|
}
|
|
347264
347171
|
|
|
347265
347172
|
return result;
|
|
347266
347173
|
});
|
|
347267
|
-
}
|
|
347174
|
+
}
|
|
347175
|
+
|
|
347176
|
+
function handleKeyDown(e) {
|
|
347177
|
+
var direction = props.direction,
|
|
347178
|
+
disableUpDownKeys = props.disableUpDownKeys;
|
|
347179
|
+
|
|
347180
|
+
if (isTabFromContainer(e.target)) {
|
|
347181
|
+
var index = props.selectedIndex;
|
|
347182
|
+
var preventDefault = false;
|
|
347183
|
+
var useSelectedIndex = false;
|
|
347184
|
+
|
|
347185
|
+
if (e.code === 'Space' || e.keyCode === 32
|
|
347186
|
+
/* space */
|
|
347187
|
+
|| e.code === 'Enter' || e.keyCode === 13
|
|
347188
|
+
/* enter */
|
|
347189
|
+
) {
|
|
347190
|
+
preventDefault = true;
|
|
347191
|
+
useSelectedIndex = false;
|
|
347192
|
+
handleClick(e);
|
|
347193
|
+
} // keyCode is deprecated and only used here for IE
|
|
347194
|
+
|
|
347195
|
+
|
|
347196
|
+
if (e.code === 'ArrowLeft' || e.keyCode === 37
|
|
347197
|
+
/* arrow left */
|
|
347198
|
+
|| !disableUpDownKeys && (e.keyCode === 38 || e.code === 'ArrowUp')
|
|
347199
|
+
/* arrow up */
|
|
347200
|
+
) {
|
|
347201
|
+
// Select next tab to the left, validate if up arrow is not disabled
|
|
347202
|
+
if (direction === 'rtl') {
|
|
347203
|
+
index = getNextTab(index);
|
|
347204
|
+
} else {
|
|
347205
|
+
index = getPrevTab(index);
|
|
347206
|
+
}
|
|
347207
|
+
|
|
347208
|
+
preventDefault = true;
|
|
347209
|
+
useSelectedIndex = true;
|
|
347210
|
+
} else if (e.code === 'ArrowRight' || e.keyCode === 39
|
|
347211
|
+
/* arrow right */
|
|
347212
|
+
|| !disableUpDownKeys && (e.keyCode === 40 || e.code === 'ArrowDown')
|
|
347213
|
+
/* arrow down */
|
|
347214
|
+
) {
|
|
347215
|
+
// Select next tab to the right, validate if down arrow is not disabled
|
|
347216
|
+
if (direction === 'rtl') {
|
|
347217
|
+
index = getPrevTab(index);
|
|
347218
|
+
} else {
|
|
347219
|
+
index = getNextTab(index);
|
|
347220
|
+
}
|
|
347221
|
+
|
|
347222
|
+
preventDefault = true;
|
|
347223
|
+
useSelectedIndex = true;
|
|
347224
|
+
} else if (e.keyCode === 35 || e.code === 'End') {
|
|
347225
|
+
// Select last tab (End key)
|
|
347226
|
+
index = getLastTab();
|
|
347227
|
+
preventDefault = true;
|
|
347228
|
+
useSelectedIndex = true;
|
|
347229
|
+
} else if (e.keyCode === 36 || e.code === 'Home') {
|
|
347230
|
+
// Select first tab (Home key)
|
|
347231
|
+
index = getFirstTab();
|
|
347232
|
+
preventDefault = true;
|
|
347233
|
+
useSelectedIndex = true;
|
|
347234
|
+
} // This prevents scrollbars from moving around
|
|
347235
|
+
|
|
347236
|
+
|
|
347237
|
+
if (preventDefault) {
|
|
347238
|
+
e.preventDefault();
|
|
347239
|
+
} // Only use the selected index in the state if we're not using the tabbed index
|
|
347240
|
+
|
|
347241
|
+
|
|
347242
|
+
if (useSelectedIndex) {
|
|
347243
|
+
setSelected(index, e);
|
|
347244
|
+
}
|
|
347245
|
+
}
|
|
347246
|
+
}
|
|
347268
347247
|
|
|
347248
|
+
function handleClick(e) {
|
|
347249
|
+
var node = e.target;
|
|
347250
|
+
|
|
347251
|
+
do {
|
|
347252
|
+
if (isTabFromContainer(node)) {
|
|
347253
|
+
if (isTabDisabled(node)) {
|
|
347254
|
+
return;
|
|
347255
|
+
}
|
|
347256
|
+
|
|
347257
|
+
var index = [].slice.call(node.parentNode.children).filter(isTabNode).indexOf(node);
|
|
347258
|
+
setSelected(index, e);
|
|
347259
|
+
return;
|
|
347260
|
+
}
|
|
347261
|
+
} while ((node = node.parentNode) != null);
|
|
347262
|
+
}
|
|
347269
347263
|
/**
|
|
347270
347264
|
* Determine if a node from event.target is a Tab element for the current Tabs container.
|
|
347271
347265
|
* If the clicked element is not a Tab, it returns false.
|
|
347272
347266
|
* If it finds another Tabs container between the Tab and `this`, it returns false.
|
|
347273
347267
|
*/
|
|
347274
|
-
|
|
347268
|
+
|
|
347269
|
+
|
|
347270
|
+
function isTabFromContainer(node) {
|
|
347275
347271
|
// return immediately if the clicked element is not a Tab.
|
|
347276
347272
|
if (!isTabNode(node)) {
|
|
347277
347273
|
return false;
|
|
@@ -347281,62 +347277,45 @@ var UncontrolledTabs = /*#__PURE__*/function (_Component) {
|
|
|
347281
347277
|
var nodeAncestor = node.parentElement;
|
|
347282
347278
|
|
|
347283
347279
|
do {
|
|
347284
|
-
if (nodeAncestor ===
|
|
347280
|
+
if (nodeAncestor === _ref.current) return true;
|
|
347285
347281
|
if (nodeAncestor.getAttribute('data-rttabs')) break;
|
|
347286
347282
|
nodeAncestor = nodeAncestor.parentElement;
|
|
347287
347283
|
} while (nodeAncestor);
|
|
347288
347284
|
|
|
347289
347285
|
return false;
|
|
347290
|
-
}
|
|
347291
|
-
|
|
347292
|
-
_proto.render = function render() {
|
|
347293
|
-
var _this3 = this;
|
|
347294
|
-
|
|
347295
|
-
// Delete all known props, so they don't get added to DOM
|
|
347296
|
-
var _this$props4 = this.props,
|
|
347297
|
-
children = _this$props4.children,
|
|
347298
|
-
className = _this$props4.className,
|
|
347299
|
-
disabledTabClassName = _this$props4.disabledTabClassName,
|
|
347300
|
-
domRef = _this$props4.domRef,
|
|
347301
|
-
focus = _this$props4.focus,
|
|
347302
|
-
forceRenderTabPanel = _this$props4.forceRenderTabPanel,
|
|
347303
|
-
onSelect = _this$props4.onSelect,
|
|
347304
|
-
selectedIndex = _this$props4.selectedIndex,
|
|
347305
|
-
selectedTabClassName = _this$props4.selectedTabClassName,
|
|
347306
|
-
selectedTabPanelClassName = _this$props4.selectedTabPanelClassName,
|
|
347307
|
-
environment = _this$props4.environment,
|
|
347308
|
-
disableUpDownKeys = _this$props4.disableUpDownKeys,
|
|
347309
|
-
attributes = _objectWithoutPropertiesLoose(_this$props4, _excluded);
|
|
347310
|
-
|
|
347311
|
-
return /*#__PURE__*/external_react_["default"].createElement("div", UncontrolledTabs_extends({}, attributes, {
|
|
347312
|
-
className: (0,clsx_m/* default */.A)(className),
|
|
347313
|
-
onClick: this.handleClick,
|
|
347314
|
-
onKeyDown: this.handleKeyDown,
|
|
347315
|
-
ref: function ref(node) {
|
|
347316
|
-
_this3.node = node;
|
|
347317
|
-
if (domRef) domRef(node);
|
|
347318
|
-
},
|
|
347319
|
-
"data-rttabs": true
|
|
347320
|
-
}), this.getChildren());
|
|
347321
|
-
};
|
|
347322
|
-
|
|
347323
|
-
return UncontrolledTabs;
|
|
347324
|
-
}(external_react_.Component);
|
|
347286
|
+
}
|
|
347325
347287
|
|
|
347326
|
-
|
|
347327
|
-
|
|
347328
|
-
|
|
347288
|
+
var children = props.children,
|
|
347289
|
+
className = props.className,
|
|
347290
|
+
disabledTabClassName = props.disabledTabClassName,
|
|
347291
|
+
domRef = props.domRef,
|
|
347292
|
+
focus = props.focus,
|
|
347293
|
+
forceRenderTabPanel = props.forceRenderTabPanel,
|
|
347294
|
+
onSelect = props.onSelect,
|
|
347295
|
+
selectedIndex = props.selectedIndex,
|
|
347296
|
+
selectedTabClassName = props.selectedTabClassName,
|
|
347297
|
+
selectedTabPanelClassName = props.selectedTabPanelClassName,
|
|
347298
|
+
environment = props.environment,
|
|
347299
|
+
disableUpDownKeys = props.disableUpDownKeys,
|
|
347300
|
+
attributes = _objectWithoutPropertiesLoose(props, _excluded);
|
|
347301
|
+
|
|
347302
|
+
return /*#__PURE__*/external_react_["default"].createElement("div", UncontrolledTabs_extends({}, attributes, {
|
|
347303
|
+
className: (0,clsx_m/* default */.A)(className),
|
|
347304
|
+
onClick: handleClick,
|
|
347305
|
+
onKeyDown: handleKeyDown,
|
|
347306
|
+
ref: function ref(node) {
|
|
347307
|
+
_ref.current = node;
|
|
347308
|
+
if (domRef) domRef(node);
|
|
347309
|
+
},
|
|
347310
|
+
"data-rttabs": true
|
|
347311
|
+
}), getChildren());
|
|
347329
347312
|
};
|
|
347330
347313
|
|
|
347314
|
+
UncontrolledTabs.defaultProps = defaultProps;
|
|
347331
347315
|
UncontrolledTabs.propTypes = false ? 0 : {};
|
|
347316
|
+
/* harmony default export */ const components_UncontrolledTabs = (UncontrolledTabs);
|
|
347332
347317
|
;// ./node_modules/react-tabs/esm/components/Tabs.js
|
|
347333
|
-
var
|
|
347334
|
-
|
|
347335
|
-
function Tabs_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
347336
|
-
|
|
347337
|
-
function Tabs_inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; Tabs_setPrototypeOf(subClass, superClass); }
|
|
347338
|
-
|
|
347339
|
-
function Tabs_setPrototypeOf(o, p) { Tabs_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return Tabs_setPrototypeOf(o, p); }
|
|
347318
|
+
function Tabs_extends() { Tabs_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Tabs_extends.apply(this, arguments); }
|
|
347340
347319
|
|
|
347341
347320
|
|
|
347342
347321
|
|
|
@@ -347345,115 +347324,106 @@ function Tabs_setPrototypeOf(o, p) { Tabs_setPrototypeOf = Object.setPrototypeOf
|
|
|
347345
347324
|
|
|
347346
347325
|
var MODE_CONTROLLED = 0;
|
|
347347
347326
|
var MODE_UNCONTROLLED = 1;
|
|
347327
|
+
var Tabs_propTypes = false ? 0 : {};
|
|
347328
|
+
var Tabs_defaultProps = {
|
|
347329
|
+
defaultFocus: false,
|
|
347330
|
+
focusTabOnClick: true,
|
|
347331
|
+
forceRenderTabPanel: false,
|
|
347332
|
+
selectedIndex: null,
|
|
347333
|
+
defaultIndex: null,
|
|
347334
|
+
environment: null,
|
|
347335
|
+
disableUpDownKeys: false
|
|
347336
|
+
};
|
|
347348
347337
|
|
|
347349
|
-
var
|
|
347350
|
-
|
|
347338
|
+
var getModeFromProps = function getModeFromProps(props) {
|
|
347339
|
+
return props.selectedIndex === null ? MODE_UNCONTROLLED : MODE_CONTROLLED;
|
|
347340
|
+
};
|
|
347351
347341
|
|
|
347352
|
-
|
|
347353
|
-
|
|
347342
|
+
var checkForIllegalModeChange = function checkForIllegalModeChange(props, mode) {
|
|
347343
|
+
if (false) {}
|
|
347344
|
+
};
|
|
347345
|
+
/**
|
|
347346
|
+
* State:
|
|
347347
|
+
* mode: Initialized only once from props and never changes
|
|
347348
|
+
* selectedIndex: null if controlled mode, otherwise initialized with prop defaultIndex, changed on selection of tabs, has effect to ensure it never gets out of bound
|
|
347349
|
+
* focus: Because we never remove focus from the Tabs this state is only used to indicate that we should focus the current tab.
|
|
347350
|
+
* It is initialized from the prop defaultFocus, and after the first render it is reset back to false. Later it can become true again when using keys to navigate the tabs.
|
|
347351
|
+
*/
|
|
347354
347352
|
|
|
347355
|
-
_this = _Component.call(this, props) || this;
|
|
347356
347353
|
|
|
347357
|
-
|
|
347358
|
-
|
|
347359
|
-
|
|
347354
|
+
var Tabs = function Tabs(props) {
|
|
347355
|
+
var children = props.children,
|
|
347356
|
+
defaultFocus = props.defaultFocus,
|
|
347357
|
+
defaultIndex = props.defaultIndex,
|
|
347358
|
+
focusTabOnClick = props.focusTabOnClick,
|
|
347359
|
+
onSelect = props.onSelect;
|
|
347360
347360
|
|
|
347361
|
-
|
|
347362
|
-
|
|
347363
|
-
|
|
347364
|
-
}
|
|
347361
|
+
var _useState = (0,external_react_.useState)(defaultFocus),
|
|
347362
|
+
focus = _useState[0],
|
|
347363
|
+
setFocus = _useState[1];
|
|
347365
347364
|
|
|
347366
|
-
|
|
347367
|
-
|
|
347368
|
-
focus: event.type === 'keydown'
|
|
347369
|
-
};
|
|
347365
|
+
var _useState2 = (0,external_react_.useState)(getModeFromProps(props)),
|
|
347366
|
+
mode = _useState2[0];
|
|
347370
347367
|
|
|
347371
|
-
|
|
347372
|
-
|
|
347373
|
-
|
|
347374
|
-
}
|
|
347368
|
+
var _useState3 = (0,external_react_.useState)(mode === MODE_UNCONTROLLED ? defaultIndex || 0 : null),
|
|
347369
|
+
selectedIndex = _useState3[0],
|
|
347370
|
+
setSelectedIndex = _useState3[1];
|
|
347375
347371
|
|
|
347376
|
-
|
|
347377
|
-
|
|
347372
|
+
(0,external_react_.useEffect)(function () {
|
|
347373
|
+
// Reset focus after initial render, see comment above
|
|
347374
|
+
setFocus(false);
|
|
347375
|
+
}, []);
|
|
347378
347376
|
|
|
347379
|
-
|
|
347380
|
-
|
|
347377
|
+
if (mode === MODE_UNCONTROLLED) {
|
|
347378
|
+
// Ensure that we handle removed tabs and don't let selectedIndex get out of bounds
|
|
347379
|
+
var tabsCount = count_getTabsCount(children);
|
|
347380
|
+
(0,external_react_.useEffect)(function () {
|
|
347381
|
+
if (selectedIndex != null) {
|
|
347382
|
+
var maxTabIndex = Math.max(0, tabsCount - 1);
|
|
347383
|
+
setSelectedIndex(Math.min(selectedIndex, maxTabIndex));
|
|
347384
|
+
}
|
|
347385
|
+
}, [tabsCount]);
|
|
347381
347386
|
}
|
|
347382
347387
|
|
|
347383
|
-
|
|
347384
|
-
return Tabs.copyPropsToState(props, state);
|
|
347385
|
-
};
|
|
347386
|
-
|
|
347387
|
-
Tabs.getModeFromProps = function getModeFromProps(props) {
|
|
347388
|
-
return props.selectedIndex === null ? MODE_UNCONTROLLED : MODE_CONTROLLED;
|
|
347389
|
-
};
|
|
347388
|
+
checkForIllegalModeChange(props, mode);
|
|
347390
347389
|
|
|
347391
|
-
|
|
347392
|
-
|
|
347393
|
-
|
|
347394
|
-
|
|
347395
|
-
|
|
347396
|
-
}
|
|
347397
|
-
|
|
347398
|
-
if (false) {}
|
|
347390
|
+
var handleSelected = function handleSelected(index, last, event) {
|
|
347391
|
+
// Call change event handler
|
|
347392
|
+
if (typeof onSelect === 'function') {
|
|
347393
|
+
// Check if the change event handler cancels the tab change
|
|
347394
|
+
if (onSelect(index, last, event) === false) return;
|
|
347395
|
+
} // Always set focus on tabs unless it is disabled
|
|
347399
347396
|
|
|
347400
|
-
var newState = {
|
|
347401
|
-
focus: focus,
|
|
347402
|
-
mode: Tabs.getModeFromProps(props)
|
|
347403
|
-
};
|
|
347404
|
-
|
|
347405
|
-
if (newState.mode === MODE_UNCONTROLLED) {
|
|
347406
|
-
var maxTabIndex = Math.max(0, count_getTabsCount(props.children) - 1);
|
|
347407
|
-
var selectedIndex = null;
|
|
347408
|
-
|
|
347409
|
-
if (state.selectedIndex != null) {
|
|
347410
|
-
selectedIndex = Math.min(state.selectedIndex, maxTabIndex);
|
|
347411
|
-
} else {
|
|
347412
|
-
selectedIndex = props.defaultIndex || 0;
|
|
347413
|
-
}
|
|
347414
347397
|
|
|
347415
|
-
|
|
347398
|
+
if (focusTabOnClick) {
|
|
347399
|
+
setFocus(true);
|
|
347416
347400
|
}
|
|
347417
347401
|
|
|
347418
|
-
|
|
347402
|
+
if (mode === MODE_UNCONTROLLED) {
|
|
347403
|
+
// Update selected index
|
|
347404
|
+
setSelectedIndex(index);
|
|
347405
|
+
}
|
|
347419
347406
|
};
|
|
347420
347407
|
|
|
347421
|
-
var
|
|
347422
|
-
|
|
347423
|
-
_proto.render = function render() {
|
|
347424
|
-
var _this$props = this.props,
|
|
347425
|
-
children = _this$props.children,
|
|
347426
|
-
defaultIndex = _this$props.defaultIndex,
|
|
347427
|
-
defaultFocus = _this$props.defaultFocus,
|
|
347428
|
-
props = Tabs_objectWithoutPropertiesLoose(_this$props, Tabs_excluded);
|
|
347429
|
-
|
|
347430
|
-
var _this$state = this.state,
|
|
347431
|
-
focus = _this$state.focus,
|
|
347432
|
-
selectedIndex = _this$state.selectedIndex;
|
|
347433
|
-
props.focus = focus;
|
|
347434
|
-
props.onSelect = this.handleSelected;
|
|
347408
|
+
var subProps = Tabs_extends({}, props);
|
|
347435
347409
|
|
|
347436
|
-
|
|
347437
|
-
|
|
347438
|
-
}
|
|
347439
|
-
|
|
347440
|
-
return /*#__PURE__*/external_react_["default"].createElement(UncontrolledTabs, props, children);
|
|
347441
|
-
};
|
|
347410
|
+
subProps.focus = focus;
|
|
347411
|
+
subProps.onSelect = handleSelected;
|
|
347442
347412
|
|
|
347443
|
-
|
|
347444
|
-
|
|
347413
|
+
if (selectedIndex != null) {
|
|
347414
|
+
subProps.selectedIndex = selectedIndex;
|
|
347415
|
+
}
|
|
347445
347416
|
|
|
347446
|
-
|
|
347447
|
-
|
|
347448
|
-
|
|
347449
|
-
|
|
347450
|
-
defaultIndex: null,
|
|
347451
|
-
environment: null,
|
|
347452
|
-
disableUpDownKeys: false
|
|
347417
|
+
delete subProps.defaultFocus;
|
|
347418
|
+
delete subProps.defaultIndex;
|
|
347419
|
+
delete subProps.focusTabOnClick;
|
|
347420
|
+
return /*#__PURE__*/external_react_["default"].createElement(components_UncontrolledTabs, subProps, children);
|
|
347453
347421
|
};
|
|
347454
347422
|
|
|
347455
347423
|
Tabs.propTypes = false ? 0 : {};
|
|
347424
|
+
Tabs.defaultProps = Tabs_defaultProps;
|
|
347456
347425
|
Tabs.tabsRole = 'Tabs';
|
|
347426
|
+
/* harmony default export */ const components_Tabs = (Tabs);
|
|
347457
347427
|
;// ./node_modules/react-tabs/esm/components/TabList.js
|
|
347458
347428
|
var TabList_excluded = ["children", "className"];
|
|
347459
347429
|
|
|
@@ -347461,44 +347431,29 @@ function TabList_extends() { TabList_extends = Object.assign || function (target
|
|
|
347461
347431
|
|
|
347462
347432
|
function TabList_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
347463
347433
|
|
|
347464
|
-
function TabList_inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; TabList_setPrototypeOf(subClass, superClass); }
|
|
347465
|
-
|
|
347466
|
-
function TabList_setPrototypeOf(o, p) { TabList_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return TabList_setPrototypeOf(o, p); }
|
|
347467
|
-
|
|
347468
|
-
|
|
347469
|
-
|
|
347470
347434
|
|
|
347471
347435
|
|
|
347472
|
-
var TabList = /*#__PURE__*/function (_Component) {
|
|
347473
|
-
TabList_inheritsLoose(TabList, _Component);
|
|
347474
347436
|
|
|
347475
|
-
|
|
347476
|
-
|
|
347477
|
-
|
|
347478
|
-
|
|
347479
|
-
var _proto = TabList.prototype;
|
|
347480
|
-
|
|
347481
|
-
_proto.render = function render() {
|
|
347482
|
-
var _this$props = this.props,
|
|
347483
|
-
children = _this$props.children,
|
|
347484
|
-
className = _this$props.className,
|
|
347485
|
-
attributes = TabList_objectWithoutPropertiesLoose(_this$props, TabList_excluded);
|
|
347486
|
-
|
|
347487
|
-
return /*#__PURE__*/external_react_["default"].createElement("ul", TabList_extends({}, attributes, {
|
|
347488
|
-
className: (0,clsx_m/* default */.A)(className),
|
|
347489
|
-
role: "tablist"
|
|
347490
|
-
}), children);
|
|
347491
|
-
};
|
|
347437
|
+
var TabList_defaultProps = {
|
|
347438
|
+
className: 'react-tabs__tab-list'
|
|
347439
|
+
};
|
|
347440
|
+
var TabList_propTypes = false ? 0 : {};
|
|
347492
347441
|
|
|
347493
|
-
|
|
347494
|
-
|
|
347442
|
+
var TabList = function TabList(props) {
|
|
347443
|
+
var children = props.children,
|
|
347444
|
+
className = props.className,
|
|
347445
|
+
attributes = TabList_objectWithoutPropertiesLoose(props, TabList_excluded);
|
|
347495
347446
|
|
|
347496
|
-
|
|
347497
|
-
|
|
347447
|
+
return /*#__PURE__*/external_react_["default"].createElement("ul", TabList_extends({}, attributes, {
|
|
347448
|
+
className: (0,clsx_m/* default */.A)(className),
|
|
347449
|
+
role: "tablist"
|
|
347450
|
+
}), children);
|
|
347498
347451
|
};
|
|
347499
347452
|
|
|
347500
|
-
TabList.propTypes = false ? 0 : {};
|
|
347501
347453
|
TabList.tabsRole = 'TabList';
|
|
347454
|
+
TabList.propTypes = false ? 0 : {};
|
|
347455
|
+
TabList.defaultProps = TabList_defaultProps;
|
|
347456
|
+
/* harmony default export */ const components_TabList = (TabList);
|
|
347502
347457
|
;// ./node_modules/react-tabs/esm/components/Tab.js
|
|
347503
347458
|
var Tab_excluded = ["children", "className", "disabled", "disabledClassName", "focus", "id", "panelId", "selected", "selectedClassName", "tabIndex", "tabRef"];
|
|
347504
347459
|
|
|
@@ -347506,80 +347461,11 @@ function Tab_extends() { Tab_extends = Object.assign || function (target) { for
|
|
|
347506
347461
|
|
|
347507
347462
|
function Tab_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
347508
347463
|
|
|
347509
|
-
function Tab_inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; Tab_setPrototypeOf(subClass, superClass); }
|
|
347510
|
-
|
|
347511
|
-
function Tab_setPrototypeOf(o, p) { Tab_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return Tab_setPrototypeOf(o, p); }
|
|
347512
|
-
|
|
347513
347464
|
|
|
347514
347465
|
|
|
347515
347466
|
|
|
347516
347467
|
var DEFAULT_CLASS = 'react-tabs__tab';
|
|
347517
|
-
|
|
347518
|
-
var Tab = /*#__PURE__*/function (_Component) {
|
|
347519
|
-
Tab_inheritsLoose(Tab, _Component);
|
|
347520
|
-
|
|
347521
|
-
function Tab() {
|
|
347522
|
-
return _Component.apply(this, arguments) || this;
|
|
347523
|
-
}
|
|
347524
|
-
|
|
347525
|
-
var _proto = Tab.prototype;
|
|
347526
|
-
|
|
347527
|
-
_proto.componentDidMount = function componentDidMount() {
|
|
347528
|
-
this.checkFocus();
|
|
347529
|
-
};
|
|
347530
|
-
|
|
347531
|
-
_proto.componentDidUpdate = function componentDidUpdate() {
|
|
347532
|
-
this.checkFocus();
|
|
347533
|
-
};
|
|
347534
|
-
|
|
347535
|
-
_proto.checkFocus = function checkFocus() {
|
|
347536
|
-
var _this$props = this.props,
|
|
347537
|
-
selected = _this$props.selected,
|
|
347538
|
-
focus = _this$props.focus;
|
|
347539
|
-
|
|
347540
|
-
if (selected && focus) {
|
|
347541
|
-
this.node.focus();
|
|
347542
|
-
}
|
|
347543
|
-
};
|
|
347544
|
-
|
|
347545
|
-
_proto.render = function render() {
|
|
347546
|
-
var _cx,
|
|
347547
|
-
_this = this;
|
|
347548
|
-
|
|
347549
|
-
var _this$props2 = this.props,
|
|
347550
|
-
children = _this$props2.children,
|
|
347551
|
-
className = _this$props2.className,
|
|
347552
|
-
disabled = _this$props2.disabled,
|
|
347553
|
-
disabledClassName = _this$props2.disabledClassName,
|
|
347554
|
-
focus = _this$props2.focus,
|
|
347555
|
-
id = _this$props2.id,
|
|
347556
|
-
panelId = _this$props2.panelId,
|
|
347557
|
-
selected = _this$props2.selected,
|
|
347558
|
-
selectedClassName = _this$props2.selectedClassName,
|
|
347559
|
-
tabIndex = _this$props2.tabIndex,
|
|
347560
|
-
tabRef = _this$props2.tabRef,
|
|
347561
|
-
attributes = Tab_objectWithoutPropertiesLoose(_this$props2, Tab_excluded);
|
|
347562
|
-
|
|
347563
|
-
return /*#__PURE__*/external_react_["default"].createElement("li", Tab_extends({}, attributes, {
|
|
347564
|
-
className: (0,clsx_m/* default */.A)(className, (_cx = {}, _cx[selectedClassName] = selected, _cx[disabledClassName] = disabled, _cx)),
|
|
347565
|
-
ref: function ref(node) {
|
|
347566
|
-
_this.node = node;
|
|
347567
|
-
if (tabRef) tabRef(node);
|
|
347568
|
-
},
|
|
347569
|
-
role: "tab",
|
|
347570
|
-
id: id,
|
|
347571
|
-
"aria-selected": selected ? 'true' : 'false',
|
|
347572
|
-
"aria-disabled": disabled ? 'true' : 'false',
|
|
347573
|
-
"aria-controls": panelId,
|
|
347574
|
-
tabIndex: tabIndex || (selected ? '0' : null),
|
|
347575
|
-
"data-rttab": true
|
|
347576
|
-
}), children);
|
|
347577
|
-
};
|
|
347578
|
-
|
|
347579
|
-
return Tab;
|
|
347580
|
-
}(external_react_.Component);
|
|
347581
|
-
|
|
347582
|
-
Tab.defaultProps = {
|
|
347468
|
+
var DEFAULT_PROPS = {
|
|
347583
347469
|
className: DEFAULT_CLASS,
|
|
347584
347470
|
disabledClassName: DEFAULT_CLASS + "--disabled",
|
|
347585
347471
|
focus: false,
|
|
@@ -347588,9 +347474,51 @@ Tab.defaultProps = {
|
|
|
347588
347474
|
selected: false,
|
|
347589
347475
|
selectedClassName: DEFAULT_CLASS + "--selected"
|
|
347590
347476
|
};
|
|
347477
|
+
var Tab_propTypes = false ? 0 : {};
|
|
347478
|
+
|
|
347479
|
+
var Tab = function Tab(props) {
|
|
347480
|
+
var _cx;
|
|
347481
|
+
|
|
347482
|
+
var nodeRef = (0,external_react_.useRef)();
|
|
347483
|
+
|
|
347484
|
+
var children = props.children,
|
|
347485
|
+
className = props.className,
|
|
347486
|
+
disabled = props.disabled,
|
|
347487
|
+
disabledClassName = props.disabledClassName,
|
|
347488
|
+
focus = props.focus,
|
|
347489
|
+
id = props.id,
|
|
347490
|
+
panelId = props.panelId,
|
|
347491
|
+
selected = props.selected,
|
|
347492
|
+
selectedClassName = props.selectedClassName,
|
|
347493
|
+
tabIndex = props.tabIndex,
|
|
347494
|
+
tabRef = props.tabRef,
|
|
347495
|
+
attributes = Tab_objectWithoutPropertiesLoose(props, Tab_excluded);
|
|
347496
|
+
|
|
347497
|
+
(0,external_react_.useEffect)(function () {
|
|
347498
|
+
if (selected && focus) {
|
|
347499
|
+
nodeRef.current.focus();
|
|
347500
|
+
}
|
|
347501
|
+
}, [selected, focus]);
|
|
347502
|
+
return /*#__PURE__*/external_react_["default"].createElement("li", Tab_extends({}, attributes, {
|
|
347503
|
+
className: (0,clsx_m/* default */.A)(className, (_cx = {}, _cx[selectedClassName] = selected, _cx[disabledClassName] = disabled, _cx)),
|
|
347504
|
+
ref: function ref(node) {
|
|
347505
|
+
nodeRef.current = node;
|
|
347506
|
+
if (tabRef) tabRef(node);
|
|
347507
|
+
},
|
|
347508
|
+
role: "tab",
|
|
347509
|
+
id: id,
|
|
347510
|
+
"aria-selected": selected ? 'true' : 'false',
|
|
347511
|
+
"aria-disabled": disabled ? 'true' : 'false',
|
|
347512
|
+
"aria-controls": panelId,
|
|
347513
|
+
tabIndex: tabIndex || (selected ? '0' : null),
|
|
347514
|
+
"data-rttab": true
|
|
347515
|
+
}), children);
|
|
347516
|
+
};
|
|
347591
347517
|
|
|
347592
347518
|
Tab.propTypes = false ? 0 : {};
|
|
347593
347519
|
Tab.tabsRole = 'Tab';
|
|
347520
|
+
Tab.defaultProps = DEFAULT_PROPS;
|
|
347521
|
+
/* harmony default export */ const components_Tab = (Tab);
|
|
347594
347522
|
;// ./node_modules/react-tabs/esm/components/TabPanel.js
|
|
347595
347523
|
var TabPanel_excluded = ["children", "className", "forceRender", "id", "selected", "selectedClassName", "tabId"];
|
|
347596
347524
|
|
|
@@ -347598,56 +347526,41 @@ function TabPanel_extends() { TabPanel_extends = Object.assign || function (targ
|
|
|
347598
347526
|
|
|
347599
347527
|
function TabPanel_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
347600
347528
|
|
|
347601
|
-
function TabPanel_inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; TabPanel_setPrototypeOf(subClass, superClass); }
|
|
347602
|
-
|
|
347603
|
-
function TabPanel_setPrototypeOf(o, p) { TabPanel_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return TabPanel_setPrototypeOf(o, p); }
|
|
347604
|
-
|
|
347605
347529
|
|
|
347606
347530
|
|
|
347607
347531
|
|
|
347608
347532
|
var TabPanel_DEFAULT_CLASS = 'react-tabs__tab-panel';
|
|
347609
|
-
|
|
347610
|
-
var TabPanel = /*#__PURE__*/function (_Component) {
|
|
347611
|
-
TabPanel_inheritsLoose(TabPanel, _Component);
|
|
347612
|
-
|
|
347613
|
-
function TabPanel() {
|
|
347614
|
-
return _Component.apply(this, arguments) || this;
|
|
347615
|
-
}
|
|
347616
|
-
|
|
347617
|
-
var _proto = TabPanel.prototype;
|
|
347618
|
-
|
|
347619
|
-
_proto.render = function render() {
|
|
347620
|
-
var _cx;
|
|
347621
|
-
|
|
347622
|
-
var _this$props = this.props,
|
|
347623
|
-
children = _this$props.children,
|
|
347624
|
-
className = _this$props.className,
|
|
347625
|
-
forceRender = _this$props.forceRender,
|
|
347626
|
-
id = _this$props.id,
|
|
347627
|
-
selected = _this$props.selected,
|
|
347628
|
-
selectedClassName = _this$props.selectedClassName,
|
|
347629
|
-
tabId = _this$props.tabId,
|
|
347630
|
-
attributes = TabPanel_objectWithoutPropertiesLoose(_this$props, TabPanel_excluded);
|
|
347631
|
-
|
|
347632
|
-
return /*#__PURE__*/external_react_["default"].createElement("div", TabPanel_extends({}, attributes, {
|
|
347633
|
-
className: (0,clsx_m/* default */.A)(className, (_cx = {}, _cx[selectedClassName] = selected, _cx)),
|
|
347634
|
-
role: "tabpanel",
|
|
347635
|
-
id: id,
|
|
347636
|
-
"aria-labelledby": tabId
|
|
347637
|
-
}), forceRender || selected ? children : null);
|
|
347638
|
-
};
|
|
347639
|
-
|
|
347640
|
-
return TabPanel;
|
|
347641
|
-
}(external_react_.Component);
|
|
347642
|
-
|
|
347643
|
-
TabPanel.defaultProps = {
|
|
347533
|
+
var TabPanel_defaultProps = {
|
|
347644
347534
|
className: TabPanel_DEFAULT_CLASS,
|
|
347645
347535
|
forceRender: false,
|
|
347646
347536
|
selectedClassName: TabPanel_DEFAULT_CLASS + "--selected"
|
|
347647
347537
|
};
|
|
347538
|
+
var TabPanel_propTypes = false ? 0 : {};
|
|
347539
|
+
|
|
347540
|
+
var TabPanel = function TabPanel(props) {
|
|
347541
|
+
var _cx;
|
|
347542
|
+
|
|
347543
|
+
var children = props.children,
|
|
347544
|
+
className = props.className,
|
|
347545
|
+
forceRender = props.forceRender,
|
|
347546
|
+
id = props.id,
|
|
347547
|
+
selected = props.selected,
|
|
347548
|
+
selectedClassName = props.selectedClassName,
|
|
347549
|
+
tabId = props.tabId,
|
|
347550
|
+
attributes = TabPanel_objectWithoutPropertiesLoose(props, TabPanel_excluded);
|
|
347551
|
+
|
|
347552
|
+
return /*#__PURE__*/external_react_["default"].createElement("div", TabPanel_extends({}, attributes, {
|
|
347553
|
+
className: (0,clsx_m/* default */.A)(className, (_cx = {}, _cx[selectedClassName] = selected, _cx)),
|
|
347554
|
+
role: "tabpanel",
|
|
347555
|
+
id: id,
|
|
347556
|
+
"aria-labelledby": tabId
|
|
347557
|
+
}), forceRender || selected ? children : null);
|
|
347558
|
+
};
|
|
347648
347559
|
|
|
347649
|
-
TabPanel.propTypes = false ? 0 : {};
|
|
347650
347560
|
TabPanel.tabsRole = 'TabPanel';
|
|
347561
|
+
TabPanel.propTypes = false ? 0 : {};
|
|
347562
|
+
TabPanel.defaultProps = TabPanel_defaultProps;
|
|
347563
|
+
/* harmony default export */ const components_TabPanel = (TabPanel);
|
|
347651
347564
|
;// ./node_modules/react-tabs/esm/index.js
|
|
347652
347565
|
|
|
347653
347566
|
|
|
@@ -368892,7 +368805,7 @@ const HistoryButton = ({ className }) => {
|
|
|
368892
368805
|
const handleClick = () => {
|
|
368893
368806
|
setIsContextOpen((prev) => !prev);
|
|
368894
368807
|
};
|
|
368895
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.btnContainer, ...hoverProps, children: [(0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Nothing here yet! Once you save your work, versions will appear here so you can restore them.", visible: hovered && !commits?.length, position: "bottom" }), (0, jsx_runtime_1.jsx)(Button_1.default, { buttonRef: ref, className: (0, classnames_1.default)(styles_module_scss_1.default.historyButton, className, {
|
|
368808
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.btnContainer, ...hoverProps, children: [(0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Nothing here yet! Once you save your work, versions will appear here so you can restore them.", visible: hovered && !commits?.length, position: "bottom" }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Load previous versions", visible: hovered && !!commits?.length, position: "bottom" }), (0, jsx_runtime_1.jsx)(Button_1.default, { buttonRef: ref, className: (0, classnames_1.default)(styles_module_scss_1.default.historyButton, className, {
|
|
368896
368809
|
[styles_module_scss_1.default.historyActive]: isContextOpen,
|
|
368897
368810
|
}), variant: "tertiary", onClickHandler: handleClick, ButtonIcon: () => (0, SvgIcon_1.SvgIcon)({ SvgElement: history_svg_1.default, size: 24 }), disabled: !commits?.length })] }), (0, jsx_runtime_1.jsx)(CommitHistoryMenu_1.CommitHistoryMenu, { isOpen: isContextOpen, onClose: () => setIsContextOpen(false), commits: commits, btnRef: ref, activeCommitId: project.commitId ?? undefined })] }));
|
|
368898
368811
|
};
|
|
@@ -368939,13 +368852,16 @@ const stores_1 = __webpack_require__(32132);
|
|
|
368939
368852
|
const SvgIcon_1 = __webpack_require__(82917);
|
|
368940
368853
|
const Button_1 = __importDefault(__webpack_require__(79428));
|
|
368941
368854
|
const createProjectArchive_1 = __webpack_require__(46514);
|
|
368855
|
+
const Tooltip_1 = __importDefault(__webpack_require__(26982));
|
|
368856
|
+
const useHover_1 = __webpack_require__(78556);
|
|
368942
368857
|
const DownloadButton = (props) => {
|
|
368943
368858
|
const project = (0, stores_1.useAppSelector)((state) => state.editor.project);
|
|
368859
|
+
const { hovered, hoverProps } = (0, useHover_1.useHover)();
|
|
368944
368860
|
const onClickDownload = async () => {
|
|
368945
368861
|
const { zipBlob: content } = await (0, createProjectArchive_1.createProjectArchive)(project);
|
|
368946
368862
|
file_saver_1.default.saveAs(content, `${(0, js_convert_case_1.toSnakeCase)(project.name || "untitled_project")}.zip`);
|
|
368947
368863
|
};
|
|
368948
|
-
return ((0, jsx_runtime_1.jsx)(Button_1.default, { variant: "tertiary", ButtonIcon: () => (0, jsx_runtime_1.jsx)(SvgIcon_1.SvgIcon, { SvgElement: download_svg_1.default, size: 24 }), onClickHandler: onClickDownload, ...props }));
|
|
368864
|
+
return ((0, jsx_runtime_1.jsxs)("div", { ...hoverProps, children: [(0, jsx_runtime_1.jsx)(Button_1.default, { variant: "tertiary", ButtonIcon: () => (0, jsx_runtime_1.jsx)(SvgIcon_1.SvgIcon, { SvgElement: download_svg_1.default, size: 24 }), onClickHandler: onClickDownload, ...props }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Download project", visible: hovered, position: "bottom" })] }));
|
|
368949
368865
|
};
|
|
368950
368866
|
exports["default"] = DownloadButton;
|
|
368951
368867
|
|
|
@@ -369284,6 +369200,7 @@ const node_html_parser_1 = __webpack_require__(36192);
|
|
|
369284
369200
|
const classnames_1 = __importDefault(__webpack_require__(46942));
|
|
369285
369201
|
const react_router_dom_1 = __webpack_require__(92648);
|
|
369286
369202
|
const EditorSlice_1 = __webpack_require__(68512);
|
|
369203
|
+
const externalLinkHelper_1 = __webpack_require__(31615);
|
|
369287
369204
|
const open_in_new_tab_svg_1 = __importDefault(__webpack_require__(86936));
|
|
369288
369205
|
const stores_1 = __webpack_require__(32132);
|
|
369289
369206
|
const ProjectTypes_1 = __webpack_require__(27130);
|
|
@@ -369324,6 +369241,7 @@ function HtmlRunner() {
|
|
|
369324
369241
|
const [searchParams, setSearchParams] = (0, react_router_dom_1.useSearchParams)();
|
|
369325
369242
|
// Using BroadcastChannel to communicate between the main app and the preview tab
|
|
369326
369243
|
const broadcastChannel = (0, react_1.useRef)(null);
|
|
369244
|
+
const [iframeKey, setIframeKey] = (0, react_1.useState)(0);
|
|
369327
369245
|
(0, react_1.useEffect)(() => {
|
|
369328
369246
|
broadcastChannel.current = new BroadcastChannel(BROADCAST_CHANNEL);
|
|
369329
369247
|
return () => {
|
|
@@ -369369,22 +369287,29 @@ function HtmlRunner() {
|
|
|
369369
369287
|
};
|
|
369370
369288
|
}
|
|
369371
369289
|
}, [isPreviewMode]);
|
|
369372
|
-
|
|
369373
|
-
|
|
369374
|
-
|
|
369375
|
-
|
|
369376
|
-
|
|
369377
|
-
|
|
369378
|
-
|
|
369379
|
-
|
|
369380
|
-
|
|
369381
|
-
|
|
369382
|
-
|
|
369383
|
-
|
|
369384
|
-
|
|
369290
|
+
const showModal = () => {
|
|
369291
|
+
dispatch((0, EditorSlice_1.showErrorModal)());
|
|
369292
|
+
eventListener();
|
|
369293
|
+
};
|
|
369294
|
+
const { externalLink, setExternalLink, handleAllowedExternalLink, handleRegularExternalLink, handleExternalLinkError, } = (0, externalLinkHelper_1.useExternalLinkState)(showModal);
|
|
369295
|
+
const eventListener = () => {
|
|
369296
|
+
window.addEventListener("message", (event) => {
|
|
369297
|
+
if (typeof event.data?.msg === "string") {
|
|
369298
|
+
if (event.data?.msg === "ERROR: External link") {
|
|
369299
|
+
handleExternalLinkError();
|
|
369300
|
+
}
|
|
369301
|
+
else if (event.data?.msg === "Allowed external link") {
|
|
369302
|
+
handleAllowedExternalLink(event.data.payload.linkTo);
|
|
369303
|
+
}
|
|
369304
|
+
else {
|
|
369305
|
+
handleRegularExternalLink(event.data.payload.linkTo);
|
|
369306
|
+
}
|
|
369307
|
+
}
|
|
369308
|
+
});
|
|
369309
|
+
};
|
|
369385
369310
|
const iframeReload = () => {
|
|
369386
369311
|
const iframe = output.current?.contentDocument;
|
|
369387
|
-
const filePath = (0, helpers_1.getFilenameFromIFrame)(iframe);
|
|
369312
|
+
const filePath = (0, helpers_1.getFilenameFromIFrame)(iframe) ?? externalLink;
|
|
369388
369313
|
if (runningFilePath !== filePath) {
|
|
369389
369314
|
setRunningFilePath(filePath);
|
|
369390
369315
|
}
|
|
@@ -369394,11 +369319,9 @@ function HtmlRunner() {
|
|
|
369394
369319
|
linkElement.addEventListener("click", (e) => {
|
|
369395
369320
|
const href = linkElement.getAttribute("href");
|
|
369396
369321
|
const target = linkElement.getAttribute("target");
|
|
369397
|
-
|
|
369398
|
-
return;
|
|
369399
|
-
// block in-iframe navigation for internal html links with target="_blank"
|
|
369322
|
+
// block in-iframe navigation for links with target="_blank" and .html href
|
|
369400
369323
|
// and open them in a preview tab
|
|
369401
|
-
if (href?.includes(".html")) {
|
|
369324
|
+
if (target === "_blank" && href?.includes(".html")) {
|
|
369402
369325
|
e.preventDefault();
|
|
369403
369326
|
e.stopImmediatePropagation();
|
|
369404
369327
|
openPreview(`/${href}`);
|
|
@@ -369406,13 +369329,17 @@ function HtmlRunner() {
|
|
|
369406
369329
|
}, true);
|
|
369407
369330
|
});
|
|
369408
369331
|
}
|
|
369332
|
+
setExternalLink(null);
|
|
369409
369333
|
};
|
|
369410
369334
|
(0, react_1.useEffect)(() => {
|
|
369335
|
+
eventListener();
|
|
369411
369336
|
dispatch((0, EditorSlice_1.loadingRunner)(EditorTypes_1.RunnerType.HTML));
|
|
369412
369337
|
dispatch((0, EditorSlice_1.setLoadedRunner)(EditorTypes_1.RunnerType.HTML));
|
|
369413
369338
|
}, []);
|
|
369414
369339
|
(0, react_1.useEffect)(() => {
|
|
369415
369340
|
if (codeRunTriggered) {
|
|
369341
|
+
// Set unique key to force iframe remount
|
|
369342
|
+
setIframeKey((prev) => prev + 1);
|
|
369416
369343
|
runCode();
|
|
369417
369344
|
if (!isPreviewMode) {
|
|
369418
369345
|
broadcastChannel.current?.postMessage({
|
|
@@ -369432,31 +369359,42 @@ function HtmlRunner() {
|
|
|
369432
369359
|
const fileToRun = page ?? defaultPreviewFilePath;
|
|
369433
369360
|
setRunningFilePath(fileToRun);
|
|
369434
369361
|
dispatch((0, EditorSlice_1.setError)(null));
|
|
369435
|
-
|
|
369436
|
-
|
|
369437
|
-
|
|
369438
|
-
|
|
369439
|
-
|
|
369440
|
-
|
|
369441
|
-
|
|
369442
|
-
|
|
369443
|
-
|
|
369444
|
-
|
|
369445
|
-
|
|
369446
|
-
|
|
369447
|
-
|
|
369448
|
-
|
|
369449
|
-
|
|
369450
|
-
|
|
369451
|
-
|
|
369452
|
-
|
|
369453
|
-
|
|
369454
|
-
|
|
369455
|
-
|
|
369456
|
-
|
|
369457
|
-
output.current
|
|
369362
|
+
if (!externalLink) {
|
|
369363
|
+
const entryPoint = (0, helpers_1.getEntryPoint)(projectComponents, fileToRun);
|
|
369364
|
+
if (!entryPoint) {
|
|
369365
|
+
dispatch((0, EditorSlice_1.setError)(fileToRun === helpers_1.DEFAULT_ENTRY_FILE_PATH && !isPreviewMode
|
|
369366
|
+
? {
|
|
369367
|
+
type: Errors_1.ErrorType.ENTRY_FILE_NOT_FOUND,
|
|
369368
|
+
details: {
|
|
369369
|
+
fileName: helpers_1.DEFAULT_ENTRY_FILE_NAME,
|
|
369370
|
+
},
|
|
369371
|
+
}
|
|
369372
|
+
: {
|
|
369373
|
+
type: Errors_1.ErrorType.PAGE_NOT_FOUND,
|
|
369374
|
+
}));
|
|
369375
|
+
dispatch((0, EditorSlice_1.codeRunHandled)());
|
|
369376
|
+
return;
|
|
369377
|
+
}
|
|
369378
|
+
const indexPage = (0, node_html_parser_1.parse)(entryPoint.content);
|
|
369379
|
+
const body = indexPage.querySelector("body") || indexPage;
|
|
369380
|
+
const htmlRoot = indexPage.querySelector("html") ?? indexPage;
|
|
369381
|
+
body.insertAdjacentHTML("afterbegin", scripts_1.disableLocalStorageScript);
|
|
369382
|
+
htmlRoot.insertAdjacentHTML("afterbegin", scripts_1.consoleOverrideScript);
|
|
369383
|
+
const { content } = await (0, fileParsers_1.resolveAndRewriteHtmlImports)(indexPage.toString(), projectComponents, entryPoint.path, page ?? entryPoint.path);
|
|
369384
|
+
if (output.current?.contentWindow?.document) {
|
|
369385
|
+
const doc = output.current.contentWindow.document;
|
|
369386
|
+
doc.open();
|
|
369387
|
+
doc.write(content);
|
|
369388
|
+
doc.close();
|
|
369389
|
+
}
|
|
369390
|
+
if (codeRunTriggered) {
|
|
369391
|
+
dispatch((0, EditorSlice_1.codeRunHandled)());
|
|
369392
|
+
}
|
|
369458
369393
|
}
|
|
369459
|
-
|
|
369394
|
+
else {
|
|
369395
|
+
if (output.current) {
|
|
369396
|
+
output.current.src = externalLink;
|
|
369397
|
+
}
|
|
369460
369398
|
dispatch((0, EditorSlice_1.codeRunHandled)());
|
|
369461
369399
|
}
|
|
369462
369400
|
};
|
|
@@ -369496,7 +369434,7 @@ function HtmlRunner() {
|
|
|
369496
369434
|
const iframeClasses = (0, classnames_1.default)(styles_module_scss_1.default.iframe, {
|
|
369497
369435
|
[styles_module_scss_1.default.codeHasBeenRun]: codeHasBeenRun,
|
|
369498
369436
|
});
|
|
369499
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.htmlrunnerContainer, children: [(0, jsx_runtime_1.jsx)(OutputTabPanel_1.OutputTabPanel, { title: "Preview", icon: preview_svg_1.default, readOnly: readOnly, extraTabContent: codeHasBeenRun && openInNewTabLink, tabPanelClassName: styles_module_scss_1.default.previewHtml, children: error ? ((0, jsx_runtime_1.jsx)("div", { className: iframeClasses, children: (0, jsx_runtime_1.jsx)(NotFoundPage_1.NotFoundPage, {}) })) : ((0, jsx_runtime_1.jsx)("iframe", { className: iframeClasses, sandbox: "allow-scripts allow-same-origin allow-modals allow-popups
|
|
369437
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.htmlrunnerContainer, children: [(0, jsx_runtime_1.jsx)(OutputTabPanel_1.OutputTabPanel, { title: "Preview", icon: preview_svg_1.default, readOnly: readOnly, extraTabContent: codeHasBeenRun && openInNewTabLink, tabPanelClassName: styles_module_scss_1.default.previewHtml, children: error ? ((0, jsx_runtime_1.jsx)("div", { className: iframeClasses, children: (0, jsx_runtime_1.jsx)(NotFoundPage_1.NotFoundPage, {}) })) : ((0, jsx_runtime_1.jsx)("iframe", { className: iframeClasses, sandbox: "allow-scripts allow-same-origin allow-modals allow-popups", referrerPolicy: "strict-origin-when-cross-origin", allow: "\n accelerometer 'none';\n camera 'none';\n encrypted-media;\n fullscreen;\n picture-in-picture;\n geolocation 'none';\n gyroscope 'none';\n magnetometer 'none';\n microphone 'none';\n midi 'none';\n payment 'none';\n usb 'none';\n ", id: "output-frame", title: "HTML Output Preview", ref: output, onLoad: iframeReload, src: "about:blank" }, iframeKey)) }), !isPreviewMode && ((0, jsx_runtime_1.jsx)(ResizableWithHandle_1.default, { "data-testid": "proj-console-container", handleDirection: "top", defaultHeight: "50%", className: styles_module_scss_1.default.resizeContainer, handleClassName: styles_module_scss_1.default.resizeHandleContainer, children: (0, jsx_runtime_1.jsx)(OutputTabPanel_1.OutputTabPanel, { title: "Console", icon: console_svg_1.default, readOnly: readOnly, children: (0, jsx_runtime_1.jsx)(HtmlConsole_1.default, { consoleLogs: consoleLogs }) }) }))] }));
|
|
369500
369438
|
}
|
|
369501
369439
|
exports["default"] = HtmlRunner;
|
|
369502
369440
|
|
|
@@ -369575,7 +369513,6 @@ const node_html_parser_1 = __webpack_require__(36192);
|
|
|
369575
369513
|
const ProjectTypes_1 = __webpack_require__(27130);
|
|
369576
369514
|
const binaryStore_1 = __webpack_require__(5060);
|
|
369577
369515
|
const projectHelpers_1 = __webpack_require__(2610);
|
|
369578
|
-
const helpers_1 = __webpack_require__(1108);
|
|
369579
369516
|
/** Normalizes CSS paths
|
|
369580
369517
|
* Treats paths without leading / or ./ or ../ as relative to current file
|
|
369581
369518
|
* E.g. 'image.png' will be treated as './image.png'
|
|
@@ -369629,7 +369566,9 @@ const getMimeType = (filePath, fallback = "application/octet-stream") => {
|
|
|
369629
369566
|
};
|
|
369630
369567
|
/** Check if a URL is external, blob, or data */
|
|
369631
369568
|
const isExternalOrDataUrl = (url) => {
|
|
369632
|
-
return (url.startsWith("blob:") ||
|
|
369569
|
+
return (url.startsWith("blob:") ||
|
|
369570
|
+
/^(https?:)?\/\//.test(url) ||
|
|
369571
|
+
url.startsWith("data:"));
|
|
369633
369572
|
};
|
|
369634
369573
|
async function replaceAsync(input, regex, replacer) {
|
|
369635
369574
|
let result = "";
|
|
@@ -369806,12 +369745,7 @@ async function rewriteSources(indexPage, components, baseFilePath, propName, blo
|
|
|
369806
369745
|
const nodes = indexPage.querySelectorAll(`[${propName}]`);
|
|
369807
369746
|
for (const node of nodes) {
|
|
369808
369747
|
const raw = node.getAttribute(propName);
|
|
369809
|
-
if (!raw)
|
|
369810
|
-
continue;
|
|
369811
|
-
// For external links with target="_blank", add noopener and noreferrer for security
|
|
369812
|
-
if ((0, helpers_1.isExternalUrl)(raw) && node.getAttribute("target") === "_blank")
|
|
369813
|
-
node.setAttribute("rel", "noopener noreferrer");
|
|
369814
|
-
if (isExternalOrDataUrl(raw))
|
|
369748
|
+
if (!raw || isExternalOrDataUrl(raw))
|
|
369815
369749
|
continue;
|
|
369816
369750
|
if ((0, projectHelpers_1.parseFileName)(raw).extension === ProjectTypes_1.ProjectFileExtension.HTML &&
|
|
369817
369751
|
propName === "href") {
|
|
@@ -369864,7 +369798,7 @@ async function resolveAndRewriteHtmlImports(html, projectComponents, baseFilePat
|
|
|
369864
369798
|
|
|
369865
369799
|
|
|
369866
369800
|
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
369867
|
-
exports.
|
|
369801
|
+
exports.getFilenameFromIFrame = exports.getEntryPoint = exports.DEFAULT_ENTRY_FILE_PATH = exports.DEFAULT_ENTRY_FILE_NAME = void 0;
|
|
369868
369802
|
const ProjectTypes_1 = __webpack_require__(27130);
|
|
369869
369803
|
exports.DEFAULT_ENTRY_FILE_NAME = "index.html";
|
|
369870
369804
|
exports.DEFAULT_ENTRY_FILE_PATH = `/${exports.DEFAULT_ENTRY_FILE_NAME}`;
|
|
@@ -369875,10 +369809,6 @@ const getEntryPoint = (components, filePath) => {
|
|
|
369875
369809
|
exports.getEntryPoint = getEntryPoint;
|
|
369876
369810
|
const getFilenameFromIFrame = (iframe) => iframe?.querySelector("meta[filename]")?.getAttribute("filename") ?? null;
|
|
369877
369811
|
exports.getFilenameFromIFrame = getFilenameFromIFrame;
|
|
369878
|
-
const isExternalUrl = (url) => {
|
|
369879
|
-
return /^(https?:)?\/\//.test(url);
|
|
369880
|
-
};
|
|
369881
|
-
exports.isExternalUrl = isExternalUrl;
|
|
369882
369812
|
|
|
369883
369813
|
|
|
369884
369814
|
/***/ }),
|
|
@@ -371692,12 +371622,15 @@ const SvgIcon_1 = __webpack_require__(82917);
|
|
|
371692
371622
|
const arrow_right_svg_1 = __importDefault(__webpack_require__(17297));
|
|
371693
371623
|
const styles_module_scss_1 = __importDefault(__webpack_require__(51191));
|
|
371694
371624
|
const ContextMenu_1 = __importDefault(__webpack_require__(39179));
|
|
371625
|
+
const Tooltip_1 = __importDefault(__webpack_require__(26982));
|
|
371626
|
+
const useHover_1 = __webpack_require__(78556);
|
|
371695
371627
|
const Dropdown = (props) => {
|
|
371696
371628
|
const { ButtonIcon, buttonClassname, menuOptions, menuPosition, ariaLabel } = props;
|
|
371697
371629
|
const { direction = "bottom", align = "center" } = menuPosition || {};
|
|
371698
371630
|
const [isOpen, setOpen] = (0, react_1.useState)(false);
|
|
371699
371631
|
const buttonRef = (0, react_1.useRef)(null);
|
|
371700
|
-
|
|
371632
|
+
const { hovered, hoverProps } = (0, useHover_1.useHover)();
|
|
371633
|
+
return ((0, jsx_runtime_1.jsxs)("div", { ...hoverProps, children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", "aria-label": ariaLabel, className: (0, classnames_1.default)(buttonClassname, isOpen && styles_module_scss_1.default.buttonActive), onClick: () => setOpen((prev) => !prev), ref: buttonRef, children: [ButtonIcon && ((0, jsx_runtime_1.jsx)(SvgIcon_1.SvgIcon, { SvgElement: ButtonIcon, size: 16, "aria-hidden": "true", focusable: "false" })), (0, jsx_runtime_1.jsx)(SvgIcon_1.SvgIcon, { className: (0, classnames_1.default)(styles_module_scss_1.default.arrowIcon, isOpen && styles_module_scss_1.default.arrowIconOpen), style: { rotate: `${isOpen ? "-" : ""}90deg` }, SvgElement: arrow_right_svg_1.default, size: 8, "aria-hidden": "true", focusable: "false" })] }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Upload files", visible: hovered && !isOpen, position: "fixed" }), (0, jsx_runtime_1.jsx)(ContextMenu_1.default, { anchorRef: buttonRef, menuOptions: menuOptions, opened: isOpen, onClose: () => setOpen(false), align: align, direction: direction, gap: 4 })] }));
|
|
371701
371634
|
};
|
|
371702
371635
|
exports["default"] = Dropdown;
|
|
371703
371636
|
|
|
@@ -371772,10 +371705,15 @@ const FileTreeContext_1 = __webpack_require__(5323);
|
|
|
371772
371705
|
const ProjectTypes_1 = __webpack_require__(27130);
|
|
371773
371706
|
const Text_1 = __webpack_require__(82803);
|
|
371774
371707
|
const stores_1 = __webpack_require__(32132);
|
|
371708
|
+
const Tooltip_1 = __importDefault(__webpack_require__(26982));
|
|
371709
|
+
const useHover_1 = __webpack_require__(78556);
|
|
371775
371710
|
const FileTreeActions = ({ hasExpandedNodes, }) => {
|
|
371776
371711
|
const { expandAll, collapseAll, createComponent, importFiles, importFolder } = (0, react_1.useContext)(FileTreeContext_1.TreeContext);
|
|
371777
371712
|
const isReadOnly = (0, stores_1.useAppSelector)((state) => state.editor.readOnly);
|
|
371778
|
-
|
|
371713
|
+
const { hovered: toggleHovered, hoverProps: toggleHoverProps } = (0, useHover_1.useHover)();
|
|
371714
|
+
const { hovered: addFolderHovered, hoverProps: addFolderHoverProps } = (0, useHover_1.useHover)();
|
|
371715
|
+
const { hovered: addFileHovered, hoverProps: addFileHoverProps } = (0, useHover_1.useHover)();
|
|
371716
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.fileTreeActions, children: [hasExpandedNodes ? ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.tooltipWrapper, ...toggleHoverProps, children: [(0, jsx_runtime_1.jsx)("button", { type: "button", "aria-label": "Collapse all folders", onClick: collapseAll, className: styles_module_scss_1.default.iconButton, children: (0, jsx_runtime_1.jsx)(minus_circle_svg_1.default, { "aria-hidden": "true", focusable: "false" }) }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Collapse all folders", visible: toggleHovered, position: "fixed" })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.tooltipWrapper, ...toggleHoverProps, children: [(0, jsx_runtime_1.jsx)("button", { type: "button", "aria-label": "Expand all folders", onClick: expandAll, className: styles_module_scss_1.default.iconButton, children: (0, jsx_runtime_1.jsx)(plus_circle_svg_1.default, { "aria-hidden": "true", focusable: "false" }) }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Expand all folders", visible: toggleHovered, position: "fixed" })] })), (0, jsx_runtime_1.jsx)(Text_1.Text, { size: 12, weight: "medium", className: styles_module_scss_1.default.fileTreeActionsLabel, children: "Project files" }), !isReadOnly && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.tooltipWrapper, ...addFolderHoverProps, children: [(0, jsx_runtime_1.jsx)("button", { type: "button", "aria-label": "Add folder", onClick: () => createComponent(ProjectTypes_1.ProjectComponentType.DIR), className: (0, classnames_1.default)([styles_module_scss_1.default.iconButtonFilled, styles_module_scss_1.default.iconButton]), children: (0, jsx_runtime_1.jsx)(add_folder_svg_1.default, { "aria-hidden": "true", focusable: "false" }) }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Add folder", visible: addFolderHovered, position: "fixed" })] }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.tooltipWrapper, ...addFileHoverProps, children: [(0, jsx_runtime_1.jsx)("button", { type: "button", "aria-label": "Add file", onClick: () => createComponent(ProjectTypes_1.ProjectComponentType.FILE), className: (0, classnames_1.default)([styles_module_scss_1.default.iconButtonFilled, styles_module_scss_1.default.iconButton]), children: (0, jsx_runtime_1.jsx)(add_file_svg_1.default, { "aria-hidden": "true", focusable: "false" }) }), (0, jsx_runtime_1.jsx)(Tooltip_1.default, { message: "Add file", visible: addFileHovered, position: "fixed" })] }), (0, jsx_runtime_1.jsx)(ImportButton_1.ImportButton, { importFiles: importFiles, importFolder: importFolder })] }))] }));
|
|
371779
371717
|
};
|
|
371780
371718
|
exports.FileTreeActions = FileTreeActions;
|
|
371781
371719
|
|
|
@@ -372700,20 +372638,27 @@ const classnames_1 = __importDefault(__webpack_require__(46942));
|
|
|
372700
372638
|
const styles_module_scss_1 = __importDefault(__webpack_require__(21852));
|
|
372701
372639
|
const UserMenu_1 = __importDefault(__webpack_require__(2957));
|
|
372702
372640
|
const backgroundColors = [
|
|
372703
|
-
|
|
372704
|
-
|
|
372705
|
-
|
|
372706
|
-
|
|
372707
|
-
|
|
372641
|
+
"D7F9F4",
|
|
372642
|
+
"43D6B9",
|
|
372643
|
+
"0D9C90",
|
|
372644
|
+
"E5F8FF",
|
|
372645
|
+
"FEEFEE",
|
|
372646
|
+
"F37C6F",
|
|
372647
|
+
"FFF3E8",
|
|
372648
|
+
"F9B88C",
|
|
372649
|
+
"FA7815",
|
|
372650
|
+
"FCE688",
|
|
372708
372651
|
];
|
|
372709
372652
|
const SidebarBarOption = (props) => {
|
|
372710
|
-
const { Icon, isActive, name, title, toggleOption, buttonText, isUser, action } = props;
|
|
372653
|
+
const { Icon, isActive, name, title, toggleOption, buttonText, isUser, action, } = props;
|
|
372711
372654
|
const userId = (0, stores_1.useAppSelector)((state) => state.user.userId);
|
|
372712
372655
|
const isFacilitator = (0, stores_1.useAppSelector)((state) => state.user.isFacilitator);
|
|
372713
372656
|
const avatarSrc = (0, stores_1.useAppSelector)((state) => state.user.avatarSrc);
|
|
372714
372657
|
const avatarStyle = isUser
|
|
372715
372658
|
? isFacilitator
|
|
372716
|
-
? {
|
|
372659
|
+
? {
|
|
372660
|
+
background: "linear-gradient(90deg,#d7f9f4,#fff9e2,#fff3e8,#e5f8ff,#d7f9f4)",
|
|
372661
|
+
}
|
|
372717
372662
|
: { backgroundColor: `#${backgroundColors[(userId ?? 0) % 10]}` }
|
|
372718
372663
|
: null;
|
|
372719
372664
|
const [isMenuOpen, setIsMenuOpen] = (0, react_1.useState)(false);
|
|
@@ -376659,6 +376604,57 @@ const downloadProjectFile = async (file, fileName) => {
|
|
|
376659
376604
|
exports.downloadProjectFile = downloadProjectFile;
|
|
376660
376605
|
|
|
376661
376606
|
|
|
376607
|
+
/***/ }),
|
|
376608
|
+
|
|
376609
|
+
/***/ 31615:
|
|
376610
|
+
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
376611
|
+
|
|
376612
|
+
|
|
376613
|
+
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
376614
|
+
exports.matchingRegexes = exports.allowedInternalLinks = exports.allowedExternalLinks = exports.useExternalLinkState = void 0;
|
|
376615
|
+
const react_1 = __webpack_require__(51649);
|
|
376616
|
+
const react_redux_1 = __webpack_require__(14062);
|
|
376617
|
+
const EditorSlice_1 = __webpack_require__(68512);
|
|
376618
|
+
const Errors_1 = __webpack_require__(20339);
|
|
376619
|
+
const domain = "https://rpf.io/";
|
|
376620
|
+
const host = window?.location?.origin || "http://localhost:3011";
|
|
376621
|
+
const rpfDomain = new RegExp(`^${domain}`);
|
|
376622
|
+
const hostDomain = new RegExp(`^${host}`);
|
|
376623
|
+
const allowedInternalLinks = [new RegExp(`^#[a-zA-Z0-9]+`)];
|
|
376624
|
+
exports.allowedInternalLinks = allowedInternalLinks;
|
|
376625
|
+
const allowedExternalLinks = [rpfDomain, hostDomain];
|
|
376626
|
+
exports.allowedExternalLinks = allowedExternalLinks;
|
|
376627
|
+
const useExternalLinkState = (showModal) => {
|
|
376628
|
+
const dispatch = (0, react_redux_1.useDispatch)();
|
|
376629
|
+
const [externalLink, setExternalLink] = (0, react_1.useState)(null);
|
|
376630
|
+
const handleAllowedExternalLink = (linkTo) => {
|
|
376631
|
+
setExternalLink(linkTo);
|
|
376632
|
+
dispatch((0, EditorSlice_1.triggerCodeRun)());
|
|
376633
|
+
};
|
|
376634
|
+
const handleRegularExternalLink = (linkTo) => {
|
|
376635
|
+
setExternalLink(null);
|
|
376636
|
+
dispatch((0, EditorSlice_1.setPage)(linkTo));
|
|
376637
|
+
dispatch((0, EditorSlice_1.triggerCodeRun)());
|
|
376638
|
+
};
|
|
376639
|
+
const handleExternalLinkError = () => {
|
|
376640
|
+
dispatch((0, EditorSlice_1.setError)({ type: Errors_1.ErrorType.EXTERNAL_LINK }));
|
|
376641
|
+
showModal();
|
|
376642
|
+
};
|
|
376643
|
+
return {
|
|
376644
|
+
externalLink,
|
|
376645
|
+
setExternalLink,
|
|
376646
|
+
handleAllowedExternalLink,
|
|
376647
|
+
handleRegularExternalLink,
|
|
376648
|
+
handleExternalLinkError,
|
|
376649
|
+
};
|
|
376650
|
+
};
|
|
376651
|
+
exports.useExternalLinkState = useExternalLinkState;
|
|
376652
|
+
const matchingRegexes = (regexArray, testString) => {
|
|
376653
|
+
return regexArray.some((reg) => reg.test(testString));
|
|
376654
|
+
};
|
|
376655
|
+
exports.matchingRegexes = matchingRegexes;
|
|
376656
|
+
|
|
376657
|
+
|
|
376662
376658
|
/***/ }),
|
|
376663
376659
|
|
|
376664
376660
|
/***/ 65404:
|