survey-react-ui 3.0.1 → 3.0.3
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/fesm/survey-react-ui.mjs +203 -207
- package/fesm/survey-react-ui.mjs.map +1 -1
- package/package.json +2 -2
- package/survey-react-ui.js +203 -205
- package/survey-react-ui.js.map +1 -1
- package/survey-react-ui.min.js +2 -2
- package/typings/entries/react-ui-model.d.ts +4 -1
- package/typings/src/attach-key2click.d.ts +3 -0
- package/typings/src/components/action-bar/action-bar.d.ts +1 -2
- package/typings/src/reactSurvey.d.ts +1 -2
package/fesm/survey-react-ui.mjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* surveyjs - Survey JavaScript library v3.0.
|
|
2
|
+
* surveyjs - Survey JavaScript library v3.0.3
|
|
3
3
|
* Copyright (c) 2015-2026 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
4
4
|
* License: MIT (http://www.opensource.org/licenses/mit-license.php)
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
|
-
import { SurveyModel, Helpers,
|
|
7
|
+
import { SurveyModel, Helpers, doKey2ClickBlur, doKey2ClickDown, doKey2ClickUp, createSvg, LocalizableString, RendererFactory, SvgRegistry, createPopupViewModel, CssClassBuilder, PopupModalManager, settings, ScrollViewModel, addIconsToThemeSet, ResizeManager, Question, QuestionTextModel, SurveyProgressModel, PopupSurveyModel, ButtonGroupItemModel, ActionDropdownViewModel, checkLibraryVersion } from 'survey-core';
|
|
8
8
|
export { SurveyModel as Model, SurveyModel, SurveyWindowModel, settings, surveyLocalization, surveyStrings } from 'survey-core';
|
|
9
9
|
import * as React from 'react';
|
|
10
10
|
import * as ReactDOM from 'react-dom';
|
|
@@ -377,6 +377,36 @@ class SurveyQuestionUncontrolledElement extends SurveyQuestionElementBase {
|
|
|
377
377
|
}
|
|
378
378
|
}
|
|
379
379
|
|
|
380
|
+
function attachKey2click(element, viewModel, options = { processEsc: true, disableTabStop: false }) {
|
|
381
|
+
let props = {};
|
|
382
|
+
if ((!!viewModel && viewModel.disableTabStop) || (!!options && options.disableTabStop)) {
|
|
383
|
+
props = { tabIndex: -1 };
|
|
384
|
+
}
|
|
385
|
+
else {
|
|
386
|
+
options = { ...options };
|
|
387
|
+
props = {
|
|
388
|
+
tabIndex: 0,
|
|
389
|
+
onKeyUp: (evt) => {
|
|
390
|
+
evt.preventDefault();
|
|
391
|
+
evt.stopPropagation();
|
|
392
|
+
doKey2ClickUp(evt, options);
|
|
393
|
+
},
|
|
394
|
+
onKeyDown: (evt) => doKey2ClickDown(evt, options),
|
|
395
|
+
onBlur: (evt) => doKey2ClickBlur(evt),
|
|
396
|
+
};
|
|
397
|
+
}
|
|
398
|
+
props["onPointerUp"] = (evt) => {
|
|
399
|
+
if (evt.pointerType === "pen") {
|
|
400
|
+
evt.preventDefault();
|
|
401
|
+
evt.stopPropagation();
|
|
402
|
+
const element = evt.target;
|
|
403
|
+
if (element === null || element === void 0 ? void 0 : element.click)
|
|
404
|
+
element.click();
|
|
405
|
+
}
|
|
406
|
+
};
|
|
407
|
+
return React.cloneElement(element, props);
|
|
408
|
+
}
|
|
409
|
+
|
|
380
410
|
class SvgIcon extends React.Component {
|
|
381
411
|
constructor(props) {
|
|
382
412
|
super(props);
|
|
@@ -575,174 +605,6 @@ ReactElementFactory.Instance.registerElement("sv-action-bar-item", (props) => {
|
|
|
575
605
|
return React.createElement(SurveyActionBarItem, props);
|
|
576
606
|
});
|
|
577
607
|
|
|
578
|
-
class Popup extends SurveyElementBase {
|
|
579
|
-
constructor(props) {
|
|
580
|
-
super(props);
|
|
581
|
-
this.containerRef = React.createRef();
|
|
582
|
-
this.createModel();
|
|
583
|
-
}
|
|
584
|
-
get model() {
|
|
585
|
-
return this.props.model;
|
|
586
|
-
}
|
|
587
|
-
getStateElement() {
|
|
588
|
-
return this.model;
|
|
589
|
-
}
|
|
590
|
-
createModel() {
|
|
591
|
-
this.popup = createPopupViewModel(this.props.model);
|
|
592
|
-
}
|
|
593
|
-
setTargetElement() {
|
|
594
|
-
const container = this.containerRef.current;
|
|
595
|
-
this.popup.setComponentElement(container);
|
|
596
|
-
}
|
|
597
|
-
componentDidMount() {
|
|
598
|
-
super.componentDidMount();
|
|
599
|
-
this.setTargetElement();
|
|
600
|
-
}
|
|
601
|
-
componentDidUpdate(prevProps, prevState) {
|
|
602
|
-
super.componentDidUpdate(prevProps, prevState);
|
|
603
|
-
this.setTargetElement();
|
|
604
|
-
}
|
|
605
|
-
componentWillUnmount() {
|
|
606
|
-
super.componentWillUnmount();
|
|
607
|
-
this.popup.resetComponentElement();
|
|
608
|
-
}
|
|
609
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
610
|
-
var _a;
|
|
611
|
-
if (!super.shouldComponentUpdate(nextProps, nextState))
|
|
612
|
-
return false;
|
|
613
|
-
const isNeedUpdate = nextProps.model !== this.popup.model;
|
|
614
|
-
if (isNeedUpdate) {
|
|
615
|
-
(_a = this.popup) === null || _a === void 0 ? void 0 : _a.dispose();
|
|
616
|
-
this.createModel();
|
|
617
|
-
}
|
|
618
|
-
return isNeedUpdate;
|
|
619
|
-
}
|
|
620
|
-
render() {
|
|
621
|
-
this.popup.model = this.model;
|
|
622
|
-
let popupContainer;
|
|
623
|
-
if (this.model.isModal) {
|
|
624
|
-
popupContainer = React.createElement(PopupContainer, { model: this.popup });
|
|
625
|
-
}
|
|
626
|
-
else {
|
|
627
|
-
popupContainer = React.createElement(PopupDropdownContainer, { model: this.popup });
|
|
628
|
-
}
|
|
629
|
-
return React.createElement("div", { ref: this.containerRef }, popupContainer);
|
|
630
|
-
}
|
|
631
|
-
}
|
|
632
|
-
ReactElementFactory.Instance.registerElement("sv-popup", (props) => {
|
|
633
|
-
return React.createElement(Popup, props);
|
|
634
|
-
});
|
|
635
|
-
class PopupContainer extends SurveyElementBase {
|
|
636
|
-
constructor(props) {
|
|
637
|
-
super(props);
|
|
638
|
-
this.handleKeydown = (event) => {
|
|
639
|
-
this.model.onKeyDown(event);
|
|
640
|
-
};
|
|
641
|
-
this.clickInside = (ev) => {
|
|
642
|
-
ev.stopPropagation();
|
|
643
|
-
};
|
|
644
|
-
}
|
|
645
|
-
get model() {
|
|
646
|
-
return this.props.model;
|
|
647
|
-
}
|
|
648
|
-
getStateElement() {
|
|
649
|
-
return this.model;
|
|
650
|
-
}
|
|
651
|
-
componentDidUpdate(prevProps, prevState) {
|
|
652
|
-
super.componentDidUpdate(prevProps, prevState);
|
|
653
|
-
if (!this.model.isPositionSet && this.model.isVisible) {
|
|
654
|
-
this.model.updateOnShowing();
|
|
655
|
-
}
|
|
656
|
-
}
|
|
657
|
-
renderContainer(popupBaseViewModel) {
|
|
658
|
-
const headerPopup = popupBaseViewModel.showHeader ? this.renderHeaderPopup(popupBaseViewModel) : null;
|
|
659
|
-
const headerContent = !!popupBaseViewModel.title ? this.renderHeaderContent() : null;
|
|
660
|
-
const content = this.renderContent();
|
|
661
|
-
const footerContent = popupBaseViewModel.showFooter ? this.renderFooter(this.model) : null;
|
|
662
|
-
return (React.createElement("div", { className: "sv-popup__container", style: {
|
|
663
|
-
left: popupBaseViewModel.left,
|
|
664
|
-
top: popupBaseViewModel.top,
|
|
665
|
-
height: popupBaseViewModel.height,
|
|
666
|
-
width: popupBaseViewModel.width,
|
|
667
|
-
minWidth: popupBaseViewModel.minWidth,
|
|
668
|
-
}, onClick: (ev) => {
|
|
669
|
-
this.clickInside(ev);
|
|
670
|
-
} },
|
|
671
|
-
headerPopup,
|
|
672
|
-
React.createElement("div", { className: "sv-popup__body-content" },
|
|
673
|
-
headerContent,
|
|
674
|
-
React.createElement("div", { className: "sv-popup__scrolling-content" }, content),
|
|
675
|
-
footerContent)));
|
|
676
|
-
}
|
|
677
|
-
renderHeaderContent() {
|
|
678
|
-
return React.createElement("div", { className: "sv-popup__body-header" }, this.model.title);
|
|
679
|
-
}
|
|
680
|
-
renderContent() {
|
|
681
|
-
const contentComponent = ReactElementFactory.Instance.createElement(this.model.contentComponentName, this.model.contentComponentData);
|
|
682
|
-
return React.createElement("div", { className: "sv-popup__content" }, contentComponent);
|
|
683
|
-
}
|
|
684
|
-
renderHeaderPopup(popupModel) {
|
|
685
|
-
return popupModel.showCloseButton ? React.createElement("button", { tabIndex: -1, className: "sv-popup__close-button sd-action sd-action--icon", onClick: () => this.model.clickClose() },
|
|
686
|
-
React.createElement(SvgIcon, { className: "sv-popup__close-button-icon", iconName: "icon-close-24x24", size: "auto" })) : null;
|
|
687
|
-
}
|
|
688
|
-
renderFooter(popuModel) {
|
|
689
|
-
return (React.createElement("div", { className: "sv-popup__body-footer" },
|
|
690
|
-
React.createElement(SurveyActionBar, { model: popuModel.footerToolbar })));
|
|
691
|
-
}
|
|
692
|
-
render() {
|
|
693
|
-
const container = this.renderContainer(this.model);
|
|
694
|
-
const className = new CssClassBuilder()
|
|
695
|
-
.append("sv-popup")
|
|
696
|
-
.append(this.model.styleClass)
|
|
697
|
-
.toString();
|
|
698
|
-
const style = { display: this.model.isVisible ? "" : "none", };
|
|
699
|
-
return (React.createElement("div", { tabIndex: -1, className: className, style: style, onClick: (e) => {
|
|
700
|
-
this.model.clickOutside(e);
|
|
701
|
-
}, onBlur: (e) => {
|
|
702
|
-
this.model.blur(e);
|
|
703
|
-
}, onKeyDown: this.handleKeydown }, container));
|
|
704
|
-
}
|
|
705
|
-
componentDidMount() {
|
|
706
|
-
super.componentDidMount();
|
|
707
|
-
if (this.model.isVisible) {
|
|
708
|
-
this.model.updateOnShowing();
|
|
709
|
-
}
|
|
710
|
-
}
|
|
711
|
-
}
|
|
712
|
-
class PopupDropdownContainer extends PopupContainer {
|
|
713
|
-
renderHeaderPopup(popupModel) {
|
|
714
|
-
const popupDropdownModel = popupModel;
|
|
715
|
-
if (!popupDropdownModel || !popupDropdownModel.showHeader)
|
|
716
|
-
return null;
|
|
717
|
-
return (React.createElement("span", { style: {
|
|
718
|
-
left: popupDropdownModel.pointerTarget.left,
|
|
719
|
-
top: popupDropdownModel.pointerTarget.top,
|
|
720
|
-
}, className: "sv-popup__pointer" }));
|
|
721
|
-
}
|
|
722
|
-
}
|
|
723
|
-
|
|
724
|
-
class SurveyActionBarItemDropdown extends SurveyActionBarItem {
|
|
725
|
-
constructor(props) {
|
|
726
|
-
super(props);
|
|
727
|
-
}
|
|
728
|
-
renderInnerButton() {
|
|
729
|
-
const button = super.renderInnerButton();
|
|
730
|
-
return (React.createElement(React.Fragment, null,
|
|
731
|
-
button,
|
|
732
|
-
React.createElement(Popup, { model: this.item.popupModel })));
|
|
733
|
-
}
|
|
734
|
-
componentDidMount() {
|
|
735
|
-
this.viewModel = new ActionDropdownViewModel(this.item);
|
|
736
|
-
}
|
|
737
|
-
componentWillUnmount() {
|
|
738
|
-
super.componentWillUnmount();
|
|
739
|
-
this.viewModel.dispose();
|
|
740
|
-
}
|
|
741
|
-
}
|
|
742
|
-
ReactElementFactory.Instance.registerElement("sv-action-bar-item-dropdown", (props) => {
|
|
743
|
-
return React.createElement(SurveyActionBarItemDropdown, props);
|
|
744
|
-
});
|
|
745
|
-
|
|
746
608
|
class SurveyActionBar extends SurveyElementBase {
|
|
747
609
|
constructor(props) {
|
|
748
610
|
super(props);
|
|
@@ -1059,6 +921,152 @@ class SvgBundleComponent extends React.Component {
|
|
|
1059
921
|
}
|
|
1060
922
|
}
|
|
1061
923
|
|
|
924
|
+
class Popup extends SurveyElementBase {
|
|
925
|
+
constructor(props) {
|
|
926
|
+
super(props);
|
|
927
|
+
this.containerRef = React.createRef();
|
|
928
|
+
this.createModel();
|
|
929
|
+
}
|
|
930
|
+
get model() {
|
|
931
|
+
return this.props.model;
|
|
932
|
+
}
|
|
933
|
+
getStateElement() {
|
|
934
|
+
return this.model;
|
|
935
|
+
}
|
|
936
|
+
createModel() {
|
|
937
|
+
this.popup = createPopupViewModel(this.props.model);
|
|
938
|
+
}
|
|
939
|
+
setTargetElement() {
|
|
940
|
+
const container = this.containerRef.current;
|
|
941
|
+
this.popup.setComponentElement(container);
|
|
942
|
+
}
|
|
943
|
+
componentDidMount() {
|
|
944
|
+
super.componentDidMount();
|
|
945
|
+
this.setTargetElement();
|
|
946
|
+
}
|
|
947
|
+
componentDidUpdate(prevProps, prevState) {
|
|
948
|
+
super.componentDidUpdate(prevProps, prevState);
|
|
949
|
+
this.setTargetElement();
|
|
950
|
+
}
|
|
951
|
+
componentWillUnmount() {
|
|
952
|
+
super.componentWillUnmount();
|
|
953
|
+
this.popup.resetComponentElement();
|
|
954
|
+
}
|
|
955
|
+
shouldComponentUpdate(nextProps, nextState) {
|
|
956
|
+
var _a;
|
|
957
|
+
if (!super.shouldComponentUpdate(nextProps, nextState))
|
|
958
|
+
return false;
|
|
959
|
+
const isNeedUpdate = nextProps.model !== this.popup.model;
|
|
960
|
+
if (isNeedUpdate) {
|
|
961
|
+
(_a = this.popup) === null || _a === void 0 ? void 0 : _a.dispose();
|
|
962
|
+
this.createModel();
|
|
963
|
+
}
|
|
964
|
+
return isNeedUpdate;
|
|
965
|
+
}
|
|
966
|
+
render() {
|
|
967
|
+
this.popup.model = this.model;
|
|
968
|
+
let popupContainer;
|
|
969
|
+
if (this.model.isModal) {
|
|
970
|
+
popupContainer = React.createElement(PopupContainer, { model: this.popup });
|
|
971
|
+
}
|
|
972
|
+
else {
|
|
973
|
+
popupContainer = React.createElement(PopupDropdownContainer, { model: this.popup });
|
|
974
|
+
}
|
|
975
|
+
return React.createElement("div", { ref: this.containerRef }, popupContainer);
|
|
976
|
+
}
|
|
977
|
+
}
|
|
978
|
+
ReactElementFactory.Instance.registerElement("sv-popup", (props) => {
|
|
979
|
+
return React.createElement(Popup, props);
|
|
980
|
+
});
|
|
981
|
+
class PopupContainer extends SurveyElementBase {
|
|
982
|
+
constructor(props) {
|
|
983
|
+
super(props);
|
|
984
|
+
this.handleKeydown = (event) => {
|
|
985
|
+
this.model.onKeyDown(event);
|
|
986
|
+
};
|
|
987
|
+
this.clickInside = (ev) => {
|
|
988
|
+
ev.stopPropagation();
|
|
989
|
+
};
|
|
990
|
+
}
|
|
991
|
+
get model() {
|
|
992
|
+
return this.props.model;
|
|
993
|
+
}
|
|
994
|
+
getStateElement() {
|
|
995
|
+
return this.model;
|
|
996
|
+
}
|
|
997
|
+
componentDidUpdate(prevProps, prevState) {
|
|
998
|
+
super.componentDidUpdate(prevProps, prevState);
|
|
999
|
+
if (!this.model.isPositionSet && this.model.isVisible) {
|
|
1000
|
+
this.model.updateOnShowing();
|
|
1001
|
+
}
|
|
1002
|
+
}
|
|
1003
|
+
renderContainer(popupBaseViewModel) {
|
|
1004
|
+
const headerPopup = popupBaseViewModel.showHeader ? this.renderHeaderPopup(popupBaseViewModel) : null;
|
|
1005
|
+
const headerContent = !!popupBaseViewModel.title ? this.renderHeaderContent() : null;
|
|
1006
|
+
const content = this.renderContent();
|
|
1007
|
+
const footerContent = popupBaseViewModel.showFooter ? this.renderFooter(this.model) : null;
|
|
1008
|
+
return (React.createElement("div", { className: "sv-popup__container", style: {
|
|
1009
|
+
left: popupBaseViewModel.left,
|
|
1010
|
+
top: popupBaseViewModel.top,
|
|
1011
|
+
height: popupBaseViewModel.height,
|
|
1012
|
+
width: popupBaseViewModel.width,
|
|
1013
|
+
minWidth: popupBaseViewModel.minWidth,
|
|
1014
|
+
}, onClick: (ev) => {
|
|
1015
|
+
this.clickInside(ev);
|
|
1016
|
+
} },
|
|
1017
|
+
headerPopup,
|
|
1018
|
+
React.createElement("div", { className: "sv-popup__body-content" },
|
|
1019
|
+
headerContent,
|
|
1020
|
+
React.createElement("div", { className: "sv-popup__scrolling-content" }, content),
|
|
1021
|
+
footerContent)));
|
|
1022
|
+
}
|
|
1023
|
+
renderHeaderContent() {
|
|
1024
|
+
return React.createElement("div", { className: "sv-popup__body-header" }, this.model.title);
|
|
1025
|
+
}
|
|
1026
|
+
renderContent() {
|
|
1027
|
+
const contentComponent = ReactElementFactory.Instance.createElement(this.model.contentComponentName, this.model.contentComponentData);
|
|
1028
|
+
return React.createElement("div", { className: "sv-popup__content" }, contentComponent);
|
|
1029
|
+
}
|
|
1030
|
+
renderHeaderPopup(popupModel) {
|
|
1031
|
+
return popupModel.showCloseButton ? React.createElement("button", { tabIndex: -1, className: "sv-popup__close-button sd-action sd-action--icon", onClick: () => this.model.clickClose() },
|
|
1032
|
+
React.createElement(SvgIcon, { className: "sv-popup__close-button-icon", iconName: "icon-close-24x24", size: "auto" })) : null;
|
|
1033
|
+
}
|
|
1034
|
+
renderFooter(popuModel) {
|
|
1035
|
+
return (React.createElement("div", { className: "sv-popup__body-footer" },
|
|
1036
|
+
React.createElement(SurveyActionBar, { model: popuModel.footerToolbar })));
|
|
1037
|
+
}
|
|
1038
|
+
render() {
|
|
1039
|
+
const container = this.renderContainer(this.model);
|
|
1040
|
+
const className = new CssClassBuilder()
|
|
1041
|
+
.append("sv-popup")
|
|
1042
|
+
.append(this.model.styleClass)
|
|
1043
|
+
.toString();
|
|
1044
|
+
const style = { display: this.model.isVisible ? "" : "none", };
|
|
1045
|
+
return (React.createElement("div", { tabIndex: -1, className: className, style: style, onClick: (e) => {
|
|
1046
|
+
this.model.clickOutside(e);
|
|
1047
|
+
}, onBlur: (e) => {
|
|
1048
|
+
this.model.blur(e);
|
|
1049
|
+
}, onKeyDown: this.handleKeydown }, container));
|
|
1050
|
+
}
|
|
1051
|
+
componentDidMount() {
|
|
1052
|
+
super.componentDidMount();
|
|
1053
|
+
if (this.model.isVisible) {
|
|
1054
|
+
this.model.updateOnShowing();
|
|
1055
|
+
}
|
|
1056
|
+
}
|
|
1057
|
+
}
|
|
1058
|
+
class PopupDropdownContainer extends PopupContainer {
|
|
1059
|
+
renderHeaderPopup(popupModel) {
|
|
1060
|
+
const popupDropdownModel = popupModel;
|
|
1061
|
+
if (!popupDropdownModel || !popupDropdownModel.showHeader)
|
|
1062
|
+
return null;
|
|
1063
|
+
return (React.createElement("span", { style: {
|
|
1064
|
+
left: popupDropdownModel.pointerTarget.left,
|
|
1065
|
+
top: popupDropdownModel.pointerTarget.top,
|
|
1066
|
+
}, className: "sv-popup__pointer" }));
|
|
1067
|
+
}
|
|
1068
|
+
}
|
|
1069
|
+
|
|
1062
1070
|
class PopupModal extends SurveyElementBase {
|
|
1063
1071
|
createPopupModalManager() {
|
|
1064
1072
|
const modalManager = new PopupModalManager();
|
|
@@ -1129,7 +1137,7 @@ var progressbutton = "<svg viewBox=\"0 0 10 10\"><polygon points=\"2,2 0,4 5,9 1
|
|
|
1129
1137
|
|
|
1130
1138
|
var removefile = "<svg viewBox=\"0 0 16 16\"><path d=\"M8,2C4.7,2,2,4.7,2,8s2.7,6,6,6s6-2.7,6-6S11.3,2,8,2z M11,10l-1,1L8,9l-2,2l-1-1l2-2L5,6l1-1l2,2l2-2l1,1L9,8 L11,10z\"/></svg>";
|
|
1131
1139
|
|
|
1132
|
-
var timercircle = "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" viewBox=\"0 0 160 160\"><circle cx=\"80\" cy=\"80\" r=\"70\"
|
|
1140
|
+
var timercircle = "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" viewBox=\"0 0 160 160\"><circle cx=\"80\" cy=\"80\" r=\"70\" class=\"sd-timer__stroke-background\" stroke-dasharray=\"none\" stroke-dashoffset=\"none\"/><circle cx=\"80\" cy=\"80\" r=\"70\"/></svg>";
|
|
1133
1141
|
|
|
1134
1142
|
var add_24x24 = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.75 12C15.75 12.41 15.41 12.75 15 12.75H12.75V15C12.75 15.41 12.41 15.75 12 15.75C11.59 15.75 11.25 15.41 11.25 15V12.75H9C8.59 12.75 8.25 12.41 8.25 12C8.25 11.59 8.59 11.25 9 11.25H11.25V9C11.25 8.59 11.59 8.25 12 8.25C12.41 8.25 12.75 8.59 12.75 9V11.25H15C15.41 11.25 15.75 11.59 15.75 12ZM21.75 12C21.75 17.38 17.38 21.75 12 21.75C6.62 21.75 2.25 17.38 2.25 12C2.25 6.62 6.62 2.25 12 2.25C17.38 2.25 21.75 6.62 21.75 12ZM20.25 12C20.25 7.45 16.55 3.75 12 3.75C7.45 3.75 3.75 7.45 3.75 12C3.75 16.55 7.45 20.25 12 20.25C16.55 20.25 20.25 16.55 20.25 12Z\"/></svg>";
|
|
1135
1143
|
|
|
@@ -1434,11 +1442,6 @@ class Survey extends SurveyElementBase {
|
|
|
1434
1442
|
const rootCss = this.survey.getRootCss();
|
|
1435
1443
|
const cssClasses = this.rootNodeClassName ? this.rootNodeClassName + " " + rootCss : rootCss;
|
|
1436
1444
|
return (React.createElement("div", { id: this.rootNodeId, ref: this.rootRef, className: cssClasses, style: this.survey.themeVariables, lang: this.survey.locale || "en", dir: this.survey.localeDir },
|
|
1437
|
-
this.survey.generateStylesheet ?
|
|
1438
|
-
React.createElement(React.Fragment, null,
|
|
1439
|
-
React.createElement("style", null, this.survey.themeStyle),
|
|
1440
|
-
React.createElement("style", null, this.survey.resetVariablesStyle))
|
|
1441
|
-
: null,
|
|
1442
1445
|
React.createElement(Scroll, { disabled: this.survey.rootScrollDisabled },
|
|
1443
1446
|
this.survey.needRenderIcons ? React.createElement(SvgBundleComponent, null) : null,
|
|
1444
1447
|
React.createElement(PopupModal, null),
|
|
@@ -1603,35 +1606,6 @@ class Survey extends SurveyElementBase {
|
|
|
1603
1606
|
ReactElementFactory.Instance.registerElement("survey", (props) => {
|
|
1604
1607
|
return React.createElement(Survey, props);
|
|
1605
1608
|
});
|
|
1606
|
-
function attachKey2click(element, viewModel, options = { processEsc: true, disableTabStop: false }) {
|
|
1607
|
-
let props = {};
|
|
1608
|
-
if ((!!viewModel && viewModel.disableTabStop) || (!!options && options.disableTabStop)) {
|
|
1609
|
-
props = { tabIndex: -1 };
|
|
1610
|
-
}
|
|
1611
|
-
else {
|
|
1612
|
-
options = { ...options };
|
|
1613
|
-
props = {
|
|
1614
|
-
tabIndex: 0,
|
|
1615
|
-
onKeyUp: (evt) => {
|
|
1616
|
-
evt.preventDefault();
|
|
1617
|
-
evt.stopPropagation();
|
|
1618
|
-
doKey2ClickUp(evt, options);
|
|
1619
|
-
},
|
|
1620
|
-
onKeyDown: (evt) => doKey2ClickDown(evt, options),
|
|
1621
|
-
onBlur: (evt) => doKey2ClickBlur(evt),
|
|
1622
|
-
};
|
|
1623
|
-
}
|
|
1624
|
-
props["onPointerUp"] = (evt) => {
|
|
1625
|
-
if (evt.pointerType === "pen") {
|
|
1626
|
-
evt.preventDefault();
|
|
1627
|
-
evt.stopPropagation();
|
|
1628
|
-
const element = evt.target;
|
|
1629
|
-
if (element === null || element === void 0 ? void 0 : element.click)
|
|
1630
|
-
element.click();
|
|
1631
|
-
}
|
|
1632
|
-
};
|
|
1633
|
-
return React.cloneElement(element, props);
|
|
1634
|
-
}
|
|
1635
1609
|
|
|
1636
1610
|
class SurveyNavigationBase extends SurveyElementBase {
|
|
1637
1611
|
constructor(props) {
|
|
@@ -5891,6 +5865,28 @@ ReactElementFactory.Instance.registerElement("sv-list-item-group", (props) => {
|
|
|
5891
5865
|
return React.createElement(ListItemGroup, props);
|
|
5892
5866
|
});
|
|
5893
5867
|
|
|
5868
|
+
class SurveyActionBarItemDropdown extends SurveyActionBarItem {
|
|
5869
|
+
constructor(props) {
|
|
5870
|
+
super(props);
|
|
5871
|
+
}
|
|
5872
|
+
renderInnerButton() {
|
|
5873
|
+
const button = super.renderInnerButton();
|
|
5874
|
+
return (React.createElement(React.Fragment, null,
|
|
5875
|
+
button,
|
|
5876
|
+
React.createElement(Popup, { model: this.item.popupModel })));
|
|
5877
|
+
}
|
|
5878
|
+
componentDidMount() {
|
|
5879
|
+
this.viewModel = new ActionDropdownViewModel(this.item);
|
|
5880
|
+
}
|
|
5881
|
+
componentWillUnmount() {
|
|
5882
|
+
super.componentWillUnmount();
|
|
5883
|
+
this.viewModel.dispose();
|
|
5884
|
+
}
|
|
5885
|
+
}
|
|
5886
|
+
ReactElementFactory.Instance.registerElement("sv-action-bar-item-dropdown", (props) => {
|
|
5887
|
+
return React.createElement(SurveyActionBarItemDropdown, props);
|
|
5888
|
+
});
|
|
5889
|
+
|
|
5894
5890
|
class LogoImage extends React.Component {
|
|
5895
5891
|
constructor(props) {
|
|
5896
5892
|
super(props);
|
|
@@ -6137,7 +6133,7 @@ ReactElementFactory.Instance.registerElement(LocalizableString.editableRenderer,
|
|
|
6137
6133
|
return React.createElement(SurveyLocStringEditor, props);
|
|
6138
6134
|
});
|
|
6139
6135
|
|
|
6140
|
-
checkLibraryVersion(`${"3.0.
|
|
6136
|
+
checkLibraryVersion(`${"3.0.3"}`, "survey-react-ui");
|
|
6141
6137
|
|
|
6142
|
-
export { CharacterCounterComponent, ComponentsContainer, Header, HeaderCell, HeaderMobile, List, ListItemContent, ListItemGroup, LoadingIndicatorComponent, LogoImage, MatrixRow, NotifierComponent, Popup, PopupModal, PopupSurvey, QuestionErrorComponent, RatingDropdownItem, RatingItem, RatingItemSmiley, RatingItemStar, ReactElementFactory, ReactQuestionFactory, ReactSurveyElement, ReactSurveyElementsWrapper, Scroll, Skeleton, SliderLabelItem, Survey, SurveyActionBar, SurveyElementBase, SurveyElementErrors, SurveyFileChooseButton, SurveyFileItem, SurveyFilePreview, SurveyFlowPanel, SurveyHeader, SurveyLocStringEditor, SurveyLocStringViewer, SurveyNavigationBase, SurveyPage, SurveyPanel, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestion, SurveyQuestionAndErrorsCell, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionBooleanSwitch, SurveyQuestionButtonGroup, SurveyQuestionButtonGroupDropdown, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionComment, SurveyQuestionCommentItem, SurveyQuestionComposite, SurveyQuestionCustom, SurveyQuestionDropdown, SurveyQuestionDropdownBase, SurveyQuestionDropdownSelect, SurveyQuestionElementBase, SurveyQuestionEmpty, SurveyQuestionExpression, SurveyQuestionFile, SurveyQuestionHtml, SurveyQuestionImage, SurveyQuestionImageMap, SurveyQuestionImagePicker, SurveyQuestionMatrix, SurveyQuestionMatrixCell, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionMatrixRow, SurveyQuestionMultipleText, SurveyQuestionOptionItem, SurveyQuestionPanelDynamic, SurveyQuestionPanelDynamicProgressText, SurveyQuestionRadioItem, SurveyQuestionRadiogroup, SurveyQuestionRanking, SurveyQuestionRankingItem, SurveyQuestionRankingItemContent, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionSignaturePad, SurveyQuestionSlider, SurveyQuestionTagbox, SurveyQuestionTagboxItem, SurveyQuestionText, SurveyRow, SurveyTimerPanel, SurveyWindow, SvgBundleComponent, SvgIcon, TagboxFilterString, TitleActions, TitleElement, attachKey2click };
|
|
6138
|
+
export { CharacterCounterComponent, ComponentsContainer, Header, HeaderCell, HeaderMobile, List, ListItemContent, ListItemGroup, LoadingIndicatorComponent, LogoImage, MatrixRow, NotifierComponent, Popup, PopupModal, PopupSurvey, QuestionErrorComponent, RatingDropdownItem, RatingItem, RatingItemSmiley, RatingItemStar, ReactElementFactory, ReactQuestionFactory, ReactSurveyElement, ReactSurveyElementsWrapper, Scroll, Skeleton, SliderLabelItem, Survey, SurveyActionBar, SurveyActionBarItemDropdown, SurveyActionBarSeparator, SurveyElementBase, SurveyElementErrors, SurveyFileChooseButton, SurveyFileItem, SurveyFilePreview, SurveyFlowPanel, SurveyHeader, SurveyLocStringEditor, SurveyLocStringViewer, SurveyNavigationBase, SurveyPage, SurveyPanel, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestion, SurveyQuestionAndErrorsCell, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionBooleanSwitch, SurveyQuestionButtonGroup, SurveyQuestionButtonGroupDropdown, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionComment, SurveyQuestionCommentItem, SurveyQuestionComposite, SurveyQuestionCustom, SurveyQuestionDropdown, SurveyQuestionDropdownBase, SurveyQuestionDropdownSelect, SurveyQuestionElementBase, SurveyQuestionEmpty, SurveyQuestionExpression, SurveyQuestionFile, SurveyQuestionHtml, SurveyQuestionImage, SurveyQuestionImageMap, SurveyQuestionImagePicker, SurveyQuestionMatrix, SurveyQuestionMatrixCell, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionMatrixRow, SurveyQuestionMultipleText, SurveyQuestionOptionItem, SurveyQuestionPanelDynamic, SurveyQuestionPanelDynamicProgressText, SurveyQuestionRadioItem, SurveyQuestionRadiogroup, SurveyQuestionRanking, SurveyQuestionRankingItem, SurveyQuestionRankingItemContent, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionSignaturePad, SurveyQuestionSlider, SurveyQuestionTagbox, SurveyQuestionTagboxItem, SurveyQuestionText, SurveyRow, SurveyTimerPanel, SurveyWindow, SvgBundleComponent, SvgIcon, TagboxFilterString, TitleActions, TitleElement, attachKey2click };
|
|
6143
6139
|
//# sourceMappingURL=survey-react-ui.mjs.map
|