survey-js-ui 2.3.9 → 2.3.10
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-js-ui.mjs +117 -175
- package/fesm/survey-js-ui.mjs.map +1 -1
- package/package.json +2 -2
- package/survey-js-ui.js +350 -390
- package/survey-js-ui.js.map +1 -1
- package/survey-js-ui.min.js +1 -1
- package/survey-js-ui.min.js.LICENSE.txt +1 -1
- package/typings/survey-react-ui/src/reactquestion_checkbox.d.ts +8 -30
- package/typings/survey-react-ui/src/reactquestion_radiogroup.d.ts +9 -26
- package/typings/survey-react-ui/src/reactquestion_selectbase.d.ts +42 -0
package/fesm/survey-js-ui.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* surveyjs - Survey JavaScript library v2.3.
|
|
2
|
+
* surveyjs - Survey JavaScript library v2.3.10
|
|
3
3
|
* Copyright (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
4
4
|
* License: MIT (http://www.opensource.org/licenses/mit-license.php)
|
|
5
5
|
*/
|
|
@@ -1127,7 +1127,7 @@ class PopupModal extends SurveyElementBase {
|
|
|
1127
1127
|
PopupModal.modalDescriptors = [];
|
|
1128
1128
|
|
|
1129
1129
|
/*!
|
|
1130
|
-
* surveyjs - Survey JavaScript library v2.3.
|
|
1130
|
+
* surveyjs - Survey JavaScript library v2.3.10
|
|
1131
1131
|
* Copyright (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
1132
1132
|
* License: MIT (http://www.opensource.org/licenses/mit-license.php)
|
|
1133
1133
|
*/
|
|
@@ -1197,7 +1197,7 @@ var iconsV1 = {
|
|
|
1197
1197
|
};
|
|
1198
1198
|
|
|
1199
1199
|
/*!
|
|
1200
|
-
* surveyjs - Survey JavaScript library v2.3.
|
|
1200
|
+
* surveyjs - Survey JavaScript library v2.3.10
|
|
1201
1201
|
* Copyright (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
|
|
1202
1202
|
* License: MIT (http://www.opensource.org/licenses/mit-license.php)
|
|
1203
1203
|
*/
|
|
@@ -2223,7 +2223,7 @@ class SurveyQuestion extends SurveyElementBase {
|
|
|
2223
2223
|
var descriptionUnderInput = question.hasDescriptionUnderInput
|
|
2224
2224
|
? this.renderDescription()
|
|
2225
2225
|
: null;
|
|
2226
|
-
return (_$1("div", { className: question.cssContent || undefined, style: contentStyle, "aria-hidden": question.contentAriaHidden, role: "presentation" },
|
|
2226
|
+
return (_$1("div", { className: question.cssContent || undefined, style: contentStyle, "aria-hidden": question.contentAriaHidden, role: "presentation", "data-sv-drop-target-matrix": this.question.dragDropMatrixAttribute, "data-sv-drop-target-matrix-row": this.question.dragDropMatrixAttribute },
|
|
2227
2227
|
questionRender,
|
|
2228
2228
|
comment,
|
|
2229
2229
|
descriptionUnderInput));
|
|
@@ -2699,7 +2699,7 @@ ReactElementFactory.Instance.registerElement("flowpanel", props => {
|
|
|
2699
2699
|
return _$1(SurveyFlowPanel, props);
|
|
2700
2700
|
});
|
|
2701
2701
|
|
|
2702
|
-
class
|
|
2702
|
+
class SurveyQuestionSelectbase extends SurveyQuestionElementBase {
|
|
2703
2703
|
constructor(props) {
|
|
2704
2704
|
super(props);
|
|
2705
2705
|
}
|
|
@@ -2709,29 +2709,29 @@ class SurveyQuestionCheckbox extends SurveyQuestionElementBase {
|
|
|
2709
2709
|
renderElement() {
|
|
2710
2710
|
var cssClasses = this.question.cssClasses;
|
|
2711
2711
|
return (_$1("fieldset", { className: this.question.getSelectBaseRootCss(), ref: (fieldset) => (this.setControl(fieldset)), role: this.question.a11y_input_ariaRole, "aria-required": this.question.a11y_input_ariaRequired, "aria-label": this.question.a11y_input_ariaLabel, "aria-labelledby": this.question.a11y_input_ariaLabelledBy, "aria-describedby": this.question.a11y_input_ariaDescribedBy, "aria-invalid": this.question.a11y_input_ariaInvalid, "aria-errormessage": this.question.a11y_input_ariaErrormessage },
|
|
2712
|
-
|
|
2713
|
-
this.getHeader(),
|
|
2712
|
+
this.renderHeader(),
|
|
2714
2713
|
this.question.hasColumns
|
|
2715
2714
|
? this.getColumnedBody(cssClasses)
|
|
2716
2715
|
: this.getBody(cssClasses),
|
|
2717
2716
|
this.getFooter()));
|
|
2718
2717
|
}
|
|
2719
|
-
|
|
2720
|
-
if (this.question.hasHeadItems) {
|
|
2721
|
-
return this.question.headItems.map((item, ii) => this.renderItem(item, false, this.question.cssClasses));
|
|
2722
|
-
}
|
|
2723
|
-
}
|
|
2718
|
+
renderHeader() { return null; }
|
|
2724
2719
|
getFooter() {
|
|
2725
2720
|
if (this.question.hasFootItems) {
|
|
2726
|
-
|
|
2721
|
+
const items = this.question.footItems.map((item, ii) => this.renderItem(item, false, this.question.cssClasses));
|
|
2722
|
+
return _$1(k$2, null, items);
|
|
2727
2723
|
}
|
|
2724
|
+
return null;
|
|
2728
2725
|
}
|
|
2726
|
+
getStateValue() { return undefined; }
|
|
2727
|
+
isItemChecked(item, value) { return false; }
|
|
2729
2728
|
getColumnedBody(cssClasses) {
|
|
2730
2729
|
return (_$1("div", { className: cssClasses.rootMultiColumn }, this.getColumns(cssClasses)));
|
|
2731
2730
|
}
|
|
2732
2731
|
getColumns(cssClasses) {
|
|
2732
|
+
const value = this.getStateValue();
|
|
2733
2733
|
return this.question.columns.map((column, ci) => {
|
|
2734
|
-
var items = column.map((item, ii) => this.renderItem(item, ci === 0 && ii === 0, cssClasses, "" + ci + ii));
|
|
2734
|
+
var items = column.map((item, ii) => this.renderItem(item, ci === 0 && ii === 0, cssClasses, "" + ci + ii, this.isItemChecked(item, value)));
|
|
2735
2735
|
return (_$1("div", { key: "column" + ci + this.question.getItemsColumnKey(column), className: this.question.getColumnClass(), role: "presentation" }, items));
|
|
2736
2736
|
});
|
|
2737
2737
|
}
|
|
@@ -2744,20 +2744,21 @@ class SurveyQuestionCheckbox extends SurveyQuestionElementBase {
|
|
|
2744
2744
|
}
|
|
2745
2745
|
}
|
|
2746
2746
|
getItems(cssClasses, choices) {
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2747
|
+
const items = [];
|
|
2748
|
+
const value = this.getStateValue();
|
|
2749
|
+
for (let i = 0; i < choices.length; i++) {
|
|
2750
|
+
const item = choices[i];
|
|
2751
|
+
const renderedItem = this.renderItem(item, i == 0, cssClasses, "" + i, this.isItemChecked(item, value));
|
|
2751
2752
|
if (!!renderedItem) {
|
|
2752
|
-
|
|
2753
|
+
items.push(renderedItem);
|
|
2753
2754
|
}
|
|
2754
2755
|
}
|
|
2755
|
-
return
|
|
2756
|
+
return items;
|
|
2756
2757
|
}
|
|
2757
2758
|
get textStyle() {
|
|
2758
2759
|
return null;
|
|
2759
2760
|
}
|
|
2760
|
-
renderItem(item, isFirst, cssClasses, index) {
|
|
2761
|
+
renderItem(item, isFirst, cssClasses, index, isChecked) {
|
|
2761
2762
|
const renderedItem = ReactElementFactory.Instance.createElement(this.question.itemComponent, {
|
|
2762
2763
|
key: item.value,
|
|
2763
2764
|
question: this.question,
|
|
@@ -2767,6 +2768,8 @@ class SurveyQuestionCheckbox extends SurveyQuestionElementBase {
|
|
|
2767
2768
|
textStyle: this.textStyle,
|
|
2768
2769
|
index: index,
|
|
2769
2770
|
isFirst: isFirst,
|
|
2771
|
+
isChecked: isChecked,
|
|
2772
|
+
creator: this.props.creator,
|
|
2770
2773
|
});
|
|
2771
2774
|
const survey = this.question.survey;
|
|
2772
2775
|
let wrappedItem = null;
|
|
@@ -2776,11 +2779,11 @@ class SurveyQuestionCheckbox extends SurveyQuestionElementBase {
|
|
|
2776
2779
|
return wrappedItem !== null && wrappedItem !== void 0 ? wrappedItem : renderedItem;
|
|
2777
2780
|
}
|
|
2778
2781
|
}
|
|
2779
|
-
class
|
|
2782
|
+
class SurveyQuestionSelectBaseItem extends ReactSurveyElement {
|
|
2780
2783
|
constructor(props) {
|
|
2781
2784
|
super(props);
|
|
2782
2785
|
this.handleOnChange = (event) => {
|
|
2783
|
-
this.
|
|
2786
|
+
this.doOnItemChange(event);
|
|
2784
2787
|
};
|
|
2785
2788
|
this.rootRef = b$1();
|
|
2786
2789
|
}
|
|
@@ -2827,15 +2830,19 @@ class SurveyQuestionCheckboxItem extends ReactSurveyElement {
|
|
|
2827
2830
|
!!this.question.customWidget.widgetJson.isDefaultRender ||
|
|
2828
2831
|
!!this.question.customWidget.widgetJson.render);
|
|
2829
2832
|
}
|
|
2833
|
+
doOnItemChange(event) { }
|
|
2830
2834
|
canRender() {
|
|
2831
2835
|
return !!this.item && !!this.question;
|
|
2832
2836
|
}
|
|
2833
2837
|
renderElement() {
|
|
2834
|
-
const isChecked = this.question.isItemSelected(this.item);
|
|
2835
2838
|
return _$1(k$2, null,
|
|
2836
|
-
this.
|
|
2839
|
+
this.renderElementContent(),
|
|
2840
|
+
this.renderPanel(),
|
|
2837
2841
|
this.renderComment());
|
|
2838
2842
|
}
|
|
2843
|
+
renderElementContent() {
|
|
2844
|
+
return null;
|
|
2845
|
+
}
|
|
2839
2846
|
get inputStyle() {
|
|
2840
2847
|
return null; //{ marginRight: "3px" };
|
|
2841
2848
|
}
|
|
@@ -2845,7 +2852,61 @@ class SurveyQuestionCheckboxItem extends ReactSurveyElement {
|
|
|
2845
2852
|
return _$1("div", { className: this.question.getCommentAreaCss(true) },
|
|
2846
2853
|
_$1(SurveyQuestionCommentValueItem, { question: this.question, item: this.item, cssClasses: this.question.cssClasses }));
|
|
2847
2854
|
}
|
|
2848
|
-
|
|
2855
|
+
renderPanel() {
|
|
2856
|
+
if (this.item.isPanelShowing) {
|
|
2857
|
+
const panel = this.item.panel;
|
|
2858
|
+
return (_$1(SurveyPanel, { key: panel.id, element: panel, survey: this.question.survey, cssClasses: this.props.cssClasses, isDisplayMode: this.isDisplayMode, creator: this.props.creator }));
|
|
2859
|
+
}
|
|
2860
|
+
return null;
|
|
2861
|
+
}
|
|
2862
|
+
componentDidMount() {
|
|
2863
|
+
super.componentDidMount();
|
|
2864
|
+
if (!this.question.isDesignMode) {
|
|
2865
|
+
this.item.setRootElement(this.rootRef.current);
|
|
2866
|
+
}
|
|
2867
|
+
}
|
|
2868
|
+
componentWillUnmount() {
|
|
2869
|
+
super.componentWillUnmount();
|
|
2870
|
+
if (!this.question.isDesignMode) {
|
|
2871
|
+
this.item.setRootElement(undefined);
|
|
2872
|
+
}
|
|
2873
|
+
}
|
|
2874
|
+
}
|
|
2875
|
+
|
|
2876
|
+
class SurveyQuestionCheckbox extends SurveyQuestionSelectbase {
|
|
2877
|
+
constructor(props) {
|
|
2878
|
+
super(props);
|
|
2879
|
+
}
|
|
2880
|
+
get question() {
|
|
2881
|
+
return this.questionBase;
|
|
2882
|
+
}
|
|
2883
|
+
renderHeader() {
|
|
2884
|
+
return _$1(k$2, null,
|
|
2885
|
+
_$1("legend", { className: "sv-hidden" }, this.question.locTitle.renderedHtml),
|
|
2886
|
+
this.getHeader());
|
|
2887
|
+
}
|
|
2888
|
+
getHeader() {
|
|
2889
|
+
if (this.question.hasHeadItems) {
|
|
2890
|
+
return this.question.headItems.map((item, ii) => this.renderItem(item, false, this.question.cssClasses));
|
|
2891
|
+
}
|
|
2892
|
+
return null;
|
|
2893
|
+
}
|
|
2894
|
+
}
|
|
2895
|
+
class SurveyQuestionCheckboxItem extends SurveyQuestionSelectBaseItem {
|
|
2896
|
+
constructor(props) {
|
|
2897
|
+
super(props);
|
|
2898
|
+
}
|
|
2899
|
+
doOnItemChange(event) {
|
|
2900
|
+
this.question.clickItemHandler(this.item, event.target.checked);
|
|
2901
|
+
}
|
|
2902
|
+
renderElementContent() {
|
|
2903
|
+
const isChecked = this.question.isItemSelected(this.item);
|
|
2904
|
+
return this.renderCheckbox(isChecked);
|
|
2905
|
+
}
|
|
2906
|
+
get inputStyle() {
|
|
2907
|
+
return null; //{ marginRight: "3px" };
|
|
2908
|
+
}
|
|
2909
|
+
renderCheckbox(isChecked) {
|
|
2849
2910
|
const id = this.question.getItemId(this.item);
|
|
2850
2911
|
const itemClass = this.question.getItemClass(this.item);
|
|
2851
2912
|
const labelClass = this.question.getLabelClass(this.item);
|
|
@@ -2859,20 +2920,7 @@ class SurveyQuestionCheckboxItem extends ReactSurveyElement {
|
|
|
2859
2920
|
_$1("use", { xlinkHref: this.question.itemSvgIcon })) :
|
|
2860
2921
|
null) :
|
|
2861
2922
|
null,
|
|
2862
|
-
itemLabel)
|
|
2863
|
-
otherItem));
|
|
2864
|
-
}
|
|
2865
|
-
componentDidMount() {
|
|
2866
|
-
super.componentDidMount();
|
|
2867
|
-
if (!this.question.isDesignMode) {
|
|
2868
|
-
this.item.setRootElement(this.rootRef.current);
|
|
2869
|
-
}
|
|
2870
|
-
}
|
|
2871
|
-
componentWillUnmount() {
|
|
2872
|
-
super.componentWillUnmount();
|
|
2873
|
-
if (!this.question.isDesignMode) {
|
|
2874
|
-
this.item.setRootElement(undefined);
|
|
2875
|
-
}
|
|
2923
|
+
itemLabel)));
|
|
2876
2924
|
}
|
|
2877
2925
|
}
|
|
2878
2926
|
ReactElementFactory.Instance.registerElement("survey-checkbox-item", (props) => {
|
|
@@ -3908,90 +3956,32 @@ ReactQuestionFactory.Instance.registerQuestion("multipletext", (props) => {
|
|
|
3908
3956
|
return _$1(SurveyQuestionMultipleText, props);
|
|
3909
3957
|
});
|
|
3910
3958
|
|
|
3911
|
-
class SurveyQuestionRadiogroup extends
|
|
3959
|
+
class SurveyQuestionRadiogroup extends SurveyQuestionSelectbase {
|
|
3912
3960
|
constructor(props) {
|
|
3913
3961
|
super(props);
|
|
3914
3962
|
}
|
|
3915
3963
|
get question() {
|
|
3916
3964
|
return this.questionBase;
|
|
3917
3965
|
}
|
|
3918
|
-
renderElement() {
|
|
3919
|
-
var cssClasses = this.question.cssClasses;
|
|
3920
|
-
var clearButton = null;
|
|
3921
|
-
if (this.question.showClearButtonInContent) {
|
|
3922
|
-
clearButton = (_$1("div", null,
|
|
3923
|
-
_$1("input", { type: "button", className: this.question.cssClasses.clearButton, onClick: () => this.question.clearValue(true), value: this.question.clearButtonCaption })));
|
|
3924
|
-
}
|
|
3925
|
-
return (_$1("fieldset", { className: this.question.getSelectBaseRootCss(), ref: (fieldset) => (this.setControl(fieldset)), role: this.question.a11y_input_ariaRole, "aria-required": this.question.a11y_input_ariaRequired, "aria-label": this.question.a11y_input_ariaLabel, "aria-labelledby": this.question.a11y_input_ariaLabelledBy, "aria-describedby": this.question.a11y_input_ariaDescribedBy, "aria-invalid": this.question.a11y_input_ariaInvalid, "aria-errormessage": this.question.a11y_input_ariaErrormessage },
|
|
3926
|
-
this.question.hasColumns
|
|
3927
|
-
? this.getColumnedBody(cssClasses)
|
|
3928
|
-
: this.getBody(cssClasses),
|
|
3929
|
-
this.getFooter(),
|
|
3930
|
-
clearButton));
|
|
3931
|
-
}
|
|
3932
3966
|
getFooter() {
|
|
3933
|
-
|
|
3934
|
-
|
|
3935
|
-
|
|
3936
|
-
}
|
|
3937
|
-
getColumnedBody(cssClasses) {
|
|
3938
|
-
return (_$1("div", { className: cssClasses.rootMultiColumn }, this.getColumns(cssClasses)));
|
|
3939
|
-
}
|
|
3940
|
-
getColumns(cssClasses) {
|
|
3941
|
-
var value = this.getStateValue();
|
|
3942
|
-
return this.question.columns.map((column, ci) => {
|
|
3943
|
-
var items = column.map((item, ii) => this.renderItem(item, value, cssClasses, "" + ci + ii));
|
|
3944
|
-
return (_$1("div", { key: "column" + ci + this.question.getItemsColumnKey(column), className: this.question.getColumnClass(), role: "presentation" }, items));
|
|
3945
|
-
});
|
|
3946
|
-
}
|
|
3947
|
-
getBody(cssClasses) {
|
|
3948
|
-
if (this.question.blockedRow) {
|
|
3949
|
-
return _$1("div", { className: cssClasses.rootRow }, this.getItems(cssClasses, this.question.dataChoices));
|
|
3950
|
-
}
|
|
3951
|
-
else {
|
|
3952
|
-
return _$1(k$2, null, this.getItems(cssClasses, this.question.bodyItems));
|
|
3953
|
-
}
|
|
3954
|
-
}
|
|
3955
|
-
getItems(cssClasses, choices) {
|
|
3956
|
-
var items = [];
|
|
3957
|
-
var value = this.getStateValue();
|
|
3958
|
-
for (var i = 0; i < choices.length; i++) {
|
|
3959
|
-
var item = choices[i];
|
|
3960
|
-
var renderedItem = this.renderItem(item, value, cssClasses, "" + i);
|
|
3961
|
-
items.push(renderedItem);
|
|
3962
|
-
}
|
|
3963
|
-
return items;
|
|
3964
|
-
}
|
|
3965
|
-
get textStyle() {
|
|
3966
|
-
return null; //{ display: "inline", position: "static" };
|
|
3967
|
+
return _$1(k$2, null,
|
|
3968
|
+
super.getFooter(),
|
|
3969
|
+
this.renderClearButton());
|
|
3967
3970
|
}
|
|
3968
|
-
|
|
3969
|
-
|
|
3970
|
-
|
|
3971
|
-
|
|
3972
|
-
|
|
3973
|
-
isDisplayMode: this.isDisplayMode,
|
|
3974
|
-
item: item,
|
|
3975
|
-
textStyle: this.textStyle,
|
|
3976
|
-
index: index,
|
|
3977
|
-
isChecked: value === item.value,
|
|
3978
|
-
});
|
|
3979
|
-
const survey = this.question.survey;
|
|
3980
|
-
let wrappedItem = null;
|
|
3981
|
-
if (!!survey) {
|
|
3982
|
-
wrappedItem = ReactSurveyElementsWrapper.wrapItemValue(survey, renderedItem, this.question, item);
|
|
3983
|
-
}
|
|
3984
|
-
return wrappedItem !== null && wrappedItem !== void 0 ? wrappedItem : renderedItem;
|
|
3971
|
+
renderClearButton() {
|
|
3972
|
+
if (!this.question.showClearButtonInContent)
|
|
3973
|
+
return null;
|
|
3974
|
+
return (_$1("div", null,
|
|
3975
|
+
_$1("input", { type: "button", className: this.question.cssClasses.clearButton, onClick: () => this.question.clearValueFromUI(), value: this.question.clearButtonCaption })));
|
|
3985
3976
|
}
|
|
3986
3977
|
getStateValue() {
|
|
3987
3978
|
return !this.question.isEmpty() ? this.question.renderedValue : "";
|
|
3988
3979
|
}
|
|
3980
|
+
isItemChecked(item, value) { return item.value === value; }
|
|
3989
3981
|
}
|
|
3990
|
-
class SurveyQuestionRadioItem extends
|
|
3982
|
+
class SurveyQuestionRadioItem extends SurveyQuestionSelectBaseItem {
|
|
3991
3983
|
constructor(props) {
|
|
3992
3984
|
super(props);
|
|
3993
|
-
this.rootRef = b$1();
|
|
3994
|
-
this.handleOnChange = this.handleOnChange.bind(this);
|
|
3995
3985
|
this.handleOnMouseDown = this.handleOnMouseDown.bind(this);
|
|
3996
3986
|
}
|
|
3997
3987
|
getStateElement() {
|
|
@@ -4000,64 +3990,17 @@ class SurveyQuestionRadioItem extends ReactSurveyElement {
|
|
|
4000
3990
|
get question() {
|
|
4001
3991
|
return this.props.question;
|
|
4002
3992
|
}
|
|
4003
|
-
get item() {
|
|
4004
|
-
return this.props.item;
|
|
4005
|
-
}
|
|
4006
|
-
get textStyle() {
|
|
4007
|
-
return this.props.textStyle;
|
|
4008
|
-
}
|
|
4009
|
-
get index() {
|
|
4010
|
-
return this.props.index;
|
|
4011
|
-
}
|
|
4012
3993
|
get isChecked() {
|
|
4013
3994
|
return this.props.isChecked;
|
|
4014
3995
|
}
|
|
4015
|
-
|
|
4016
|
-
return this.props.hideCaption === true;
|
|
4017
|
-
}
|
|
4018
|
-
get ariaLabel() {
|
|
4019
|
-
return this.props.ariaLabel || null;
|
|
4020
|
-
}
|
|
4021
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
4022
|
-
if (!super.shouldComponentUpdate(nextProps, nextState))
|
|
4023
|
-
return false;
|
|
4024
|
-
if (!this.question)
|
|
4025
|
-
return false;
|
|
4026
|
-
return (!this.question.customWidget ||
|
|
4027
|
-
!!this.question.customWidgetData.isNeedRender ||
|
|
4028
|
-
!!this.question.customWidget.widgetJson.isDefaultRender ||
|
|
4029
|
-
!!this.question.customWidget.widgetJson.render);
|
|
4030
|
-
}
|
|
4031
|
-
handleOnChange(event) {
|
|
3996
|
+
doOnItemChange(event) {
|
|
4032
3997
|
this.question.clickItemHandler(this.item);
|
|
4033
3998
|
}
|
|
4034
3999
|
handleOnMouseDown(event) {
|
|
4035
4000
|
this.question.onMouseDown();
|
|
4036
4001
|
}
|
|
4037
|
-
|
|
4038
|
-
return
|
|
4039
|
-
}
|
|
4040
|
-
componentDidUpdate(prevProps, prevState) {
|
|
4041
|
-
super.componentDidUpdate(prevProps, prevState);
|
|
4042
|
-
if (prevProps.item !== this.props.item && !this.question.isDesignMode) {
|
|
4043
|
-
if (this.props.item) {
|
|
4044
|
-
this.props.item.setRootElement(this.rootRef.current);
|
|
4045
|
-
}
|
|
4046
|
-
if (prevProps.item) {
|
|
4047
|
-
prevProps.item.setRootElement(undefined);
|
|
4048
|
-
}
|
|
4049
|
-
}
|
|
4050
|
-
}
|
|
4051
|
-
renderElement() {
|
|
4052
|
-
return _$1(k$2, null,
|
|
4053
|
-
this.renderRadioButton(),
|
|
4054
|
-
this.renderComment());
|
|
4055
|
-
}
|
|
4056
|
-
renderComment() {
|
|
4057
|
-
if (!this.item.isCommentShowing)
|
|
4058
|
-
return null;
|
|
4059
|
-
return _$1("div", { className: this.question.getCommentAreaCss(true) },
|
|
4060
|
-
_$1(SurveyQuestionCommentValueItem, { question: this.question, item: this.item, cssClasses: this.question.cssClasses }));
|
|
4002
|
+
renderElementContent() {
|
|
4003
|
+
return this.renderRadioButton();
|
|
4061
4004
|
}
|
|
4062
4005
|
renderRadioButton() {
|
|
4063
4006
|
var itemClass = this.question.getItemClass(this.item);
|
|
@@ -4075,18 +4018,6 @@ class SurveyQuestionRadioItem extends ReactSurveyElement {
|
|
|
4075
4018
|
null,
|
|
4076
4019
|
itemLabel)));
|
|
4077
4020
|
}
|
|
4078
|
-
componentDidMount() {
|
|
4079
|
-
super.componentDidMount();
|
|
4080
|
-
if (!this.question.isDesignMode) {
|
|
4081
|
-
this.item.setRootElement(this.rootRef.current);
|
|
4082
|
-
}
|
|
4083
|
-
}
|
|
4084
|
-
componentWillUnmount() {
|
|
4085
|
-
super.componentWillUnmount();
|
|
4086
|
-
if (!this.question.isDesignMode) {
|
|
4087
|
-
this.item.setRootElement(undefined);
|
|
4088
|
-
}
|
|
4089
|
-
}
|
|
4090
4021
|
}
|
|
4091
4022
|
ReactElementFactory.Instance.registerElement("survey-radiogroup-item", (props) => {
|
|
4092
4023
|
return _$1(SurveyQuestionRadioItem, props);
|
|
@@ -4542,7 +4473,7 @@ class SurveyQuestionMatrixDropdownBase extends SurveyQuestionElementBase {
|
|
|
4542
4473
|
return this.renderTableDiv();
|
|
4543
4474
|
}
|
|
4544
4475
|
renderTableDiv() {
|
|
4545
|
-
return (_$1("div", { className: this.question.cssClasses.tableWrapper,
|
|
4476
|
+
return (_$1("div", { className: this.question.cssClasses.tableWrapper, ref: (root) => (this.setControl(root)) },
|
|
4546
4477
|
_$1(SurveyQuestionMatrixTable, { question: this.question, creator: this.creator, wrapCell: (cell, element, reason) => this.wrapCell(cell, element, reason) })));
|
|
4547
4478
|
}
|
|
4548
4479
|
}
|
|
@@ -5699,7 +5630,7 @@ class SurveyQuestionSignaturePad extends SurveyQuestionElementBase {
|
|
|
5699
5630
|
return null;
|
|
5700
5631
|
var cssClasses = this.question.cssClasses;
|
|
5701
5632
|
return _$1("div", { className: cssClasses.controls },
|
|
5702
|
-
_$1("button", { type: "button", className: cssClasses.clearButton, title: this.question.clearButtonCaption, onClick: () => this.question.
|
|
5633
|
+
_$1("button", { type: "button", className: cssClasses.clearButton, title: this.question.clearButtonCaption, onClick: () => this.question.clearValueFromUI() },
|
|
5703
5634
|
this.question.cssClasses.clearButtonIconId ? _$1(SvgIcon, { iconName: this.question.cssClasses.clearButtonIconId, size: "auto" }) : _$1("span", null, "\u2716"),
|
|
5704
5635
|
" "));
|
|
5705
5636
|
}
|
|
@@ -6146,9 +6077,20 @@ class SliderLabelItem extends SurveyElementBase {
|
|
|
6146
6077
|
renderElement() {
|
|
6147
6078
|
const { cssClasses, handleLabelPointerUp, getLabelCss, getPercent } = this.question;
|
|
6148
6079
|
const { value, locText } = this.item;
|
|
6080
|
+
let labelText = null;
|
|
6081
|
+
let labelTextSecondary = null;
|
|
6082
|
+
if (this.item.showValue) {
|
|
6083
|
+
labelText = _$1("div", { className: cssClasses.labelText }, this.item.value);
|
|
6084
|
+
labelTextSecondary = _$1("div", { className: cssClasses.labelTextSecondaryMode }, this.renderLocString(locText));
|
|
6085
|
+
}
|
|
6086
|
+
else {
|
|
6087
|
+
labelText = _$1("div", { className: cssClasses.labelText }, this.renderLocString(locText));
|
|
6088
|
+
}
|
|
6149
6089
|
return _$1("div", { key: this.item.id, className: getLabelCss(locText), style: { left: getPercent(value) + "%" }, onPointerUp: (e) => { handleLabelPointerUp(e.nativeEvent, value); } },
|
|
6150
6090
|
_$1("div", { className: cssClasses.labelTick }),
|
|
6151
|
-
_$1("div", { className: cssClasses.
|
|
6091
|
+
_$1("div", { className: cssClasses.labelTextContainer },
|
|
6092
|
+
labelText,
|
|
6093
|
+
labelTextSecondary));
|
|
6152
6094
|
}
|
|
6153
6095
|
}
|
|
6154
6096
|
ReactElementFactory.Instance.registerElement("sv-slider-label-item", (props) => {
|
|
@@ -6337,7 +6279,7 @@ SurveyModel.prototype["render"] = function (element = null) {
|
|
|
6337
6279
|
}
|
|
6338
6280
|
};
|
|
6339
6281
|
const preact = React;
|
|
6340
|
-
checkLibraryVersion(`${"2.3.
|
|
6282
|
+
checkLibraryVersion(`${"2.3.10"}`, "survey-js-ui");
|
|
6341
6283
|
|
|
6342
6284
|
export { CharacterCounterComponent, O as Children, x$2 as Component, ComponentsContainer, k$2 as Fragment, Header, HeaderCell, HeaderMobile, List, ListItemContent, ListItemGroup, LoadingIndicatorComponent, LogoImage, MatrixRow, NotifierComponent, Popup, PopupModal, PopupSurvey, N as PureComponent, QuestionErrorComponent, RatingDropdownItem, RatingItem, RatingItemSmiley, RatingItemStar, ReactElementFactory, ReactQuestionFactory, ReactSurveyElement, ReactSurveyElementsWrapper, Scroll, Skeleton, SliderLabelItem, Cn as StrictMode, Survey, SurveyActionBar, SurveyElementBase, SurveyElementErrors, SurveyFileChooseButton, SurveyFileItem, SurveyFilePreview, SurveyFlowPanel, SurveyHeader, SurveyLocStringEditor, SurveyLocStringViewer, SurveyNavigationBase, SurveyNavigationButton, SurveyPage, SurveyPanel, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestion, SurveyQuestionAndErrorsCell, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionButtonGroup, SurveyQuestionButtonGroupDropdown, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionComment, SurveyQuestionCommentItem, SurveyQuestionComposite, SurveyQuestionCustom, SurveyQuestionDropdown, SurveyQuestionDropdownBase, SurveyQuestionDropdownSelect, SurveyQuestionElementBase, SurveyQuestionEmpty, SurveyQuestionExpression, SurveyQuestionFile, SurveyQuestionHtml, SurveyQuestionImage, SurveyQuestionImagePicker, SurveyQuestionMatrix, SurveyQuestionMatrixCell, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixRow, SurveyQuestionMultipleText, SurveyQuestionOptionItem, SurveyQuestionPanelDynamic, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicProgressText, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionRadioItem, SurveyQuestionRadiogroup, SurveyQuestionRanking, SurveyQuestionRankingItem, SurveyQuestionRankingItemContent, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionSignaturePad, SurveyQuestionSlider, SurveyQuestionTagbox, SurveyQuestionTagboxItem, SurveyQuestionText, SurveyRow, SurveyTimerPanel, SurveyWindow, P as Suspense, B as SuspenseList, SvgBundleComponent, SvgIcon, TagboxFilterString, TitleActions, TitleElement, attachKey2click, _n as cloneElement, Q$1 as createContext, _$1 as createElement, dn as createFactory, $ as createPortal, b$1 as createRef, Sn as findDOMNode, En as flushSync, D as forwardRef, tn as hydrate, pn as isFragment, yn as isMemo, mn as isValidElement, z as lazy, M as memo, preact, nn as render, renderPopupSurvey, renderSurvey, R as startTransition, bn as unmountComponentAtNode, gn as unstable_batchedUpdates, q$1 as useCallback, x$1 as useContext, P$1 as useDebugValue, w as useDeferredValue, y as useEffect, g$1 as useId, F$1 as useImperativeHandle, I as useInsertionEffect, _ as useLayoutEffect, T$1 as useMemo, h as useReducer, A$1 as useRef, d as useState, C as useSyncExternalStore, k as useTransition, vn as version };
|
|
6343
6285
|
//# sourceMappingURL=survey-js-ui.mjs.map
|