pds-dev-kit-web-test 2.5.505 → 2.5.506
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.
|
@@ -10,6 +10,7 @@ type BasicFormGroupProps = {
|
|
|
10
10
|
multilingualBtnMode?: 'use' | 'none';
|
|
11
11
|
multilingualBtnState?: 'normal' | 'disabled';
|
|
12
12
|
multilingualConfig?: MultilingualConfig;
|
|
13
|
+
ref?: React.RefObject<HTMLInputElement>;
|
|
13
14
|
};
|
|
14
|
-
declare
|
|
15
|
-
export default
|
|
15
|
+
declare const _default: import("react").ForwardRefExoticComponent<Pick<BasicFormGroupProps, "descText" | "titleText" | "titleStyleTheme" | "captionText" | "inputForm" | "titleRequirementMode" | "multilingualBtnMode" | "multilingualBtnState" | "multilingualConfig"> & import("react").RefAttributes<unknown>>;
|
|
16
|
+
export default _default;
|
|
@@ -25,7 +25,7 @@ var MultilingualModal_1 = __importDefault(require("../../panels/MultilingualModa
|
|
|
25
25
|
var components_2 = require("../../../hybrid/components");
|
|
26
26
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
27
27
|
function BasicFormGroup(_a) {
|
|
28
|
-
var _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'subTitleBold' : _b, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, inputForm = _a.inputForm, _c = _a.titleRequirementMode, titleRequirementMode = _c === void 0 ? 'none' : _c, _d = _a.multilingualBtnMode, multilingualBtnMode = _d === void 0 ? 'none' : _d, _e = _a.multilingualBtnState, multilingualBtnState = _e === void 0 ? 'normal' : _e, multilingualConfig = _a.multilingualConfig;
|
|
28
|
+
var _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'subTitleBold' : _b, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, inputForm = _a.inputForm, _c = _a.titleRequirementMode, titleRequirementMode = _c === void 0 ? 'none' : _c, _d = _a.multilingualBtnMode, multilingualBtnMode = _d === void 0 ? 'none' : _d, _e = _a.multilingualBtnState, multilingualBtnState = _e === void 0 ? 'normal' : _e, multilingualConfig = _a.multilingualConfig, ref = _a.ref;
|
|
29
29
|
var _f = (0, react_1.useState)(false), isMultiLanguageModalOpen = _f[0], setIsMultiLanguageModalOpen = _f[1];
|
|
30
30
|
var _g = (0, react_1.useState)(false), hasMultilingualValues = _g[0], setHasMultilingualValues = _g[1];
|
|
31
31
|
var _h = (0, react_1.useState)(function () {
|
|
@@ -69,7 +69,7 @@ function BasicFormGroup(_a) {
|
|
|
69
69
|
};
|
|
70
70
|
return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicFormGroup", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [titleText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(S_TitleTextWrapper, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: { display: 'flex', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: "sysTextPrimary" }), titleRequirementMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconWrapper, { children: (0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_requirement", size: 16, fillType: "line", colorKey: "ui_cpnt_icon_sys_error_01" }) }))] })), multilingualBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(S_MultilingualButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.IconButton, { iconFillType: "line", iconName: "ic_translate", baseSize: "small", shapeType: "round", baseColorKey: "ui_cpnt_button_icon_default", iconColorKey: hasMultilingualValues
|
|
71
71
|
? 'ui_cpnt_button_icon_primary'
|
|
72
|
-
: 'ui_cpnt_button_icon_disabled', state: multilingualBtnState, onClick: multilingualBtnState === 'normal' ? handleLanguageButtonClick : undefined }) }))] }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b" })] })), multilingualBtnMode === 'use' && multilingualConfig && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { type: "hidden", id: "hiddenInput_".concat(multilingualConfig.hiddenInputId), name: multilingualConfig.hiddenInputId, value: hiddenInputValue }), (0, jsx_runtime_1.jsx)(MultilingualModal_1.default, { isOpen: isMultiLanguageModalOpen, onClose: handleLanguageModalClose, config: multilingualConfig, onHiddenInputUpdate: handleHiddenInputUpdate })] })), descText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: descText, styleTheme: "caption1Regular", colorTheme: "sysTextSecondary" }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_d" })] })), inputForm, captionText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextPrimary" })] }))] })));
|
|
72
|
+
: 'ui_cpnt_button_icon_disabled', state: multilingualBtnState, onClick: multilingualBtnState === 'normal' ? handleLanguageButtonClick : undefined }) }))] }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b" })] })), multilingualBtnMode === 'use' && multilingualConfig && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: ref, type: "hidden", id: "hiddenInput_".concat(multilingualConfig.hiddenInputId), name: multilingualConfig.hiddenInputId, value: hiddenInputValue }), (0, jsx_runtime_1.jsx)(MultilingualModal_1.default, { isOpen: isMultiLanguageModalOpen, onClose: handleLanguageModalClose, config: multilingualConfig, onHiddenInputUpdate: handleHiddenInputUpdate })] })), descText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: descText, styleTheme: "caption1Regular", colorTheme: "sysTextSecondary" }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_d" })] })), inputForm, captionText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextPrimary" })] }))] })));
|
|
73
73
|
}
|
|
74
74
|
var S_TitleTextWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: space-between;\n"], ["\n align-items: center;\n display: flex;\n justify-content: space-between;\n"])));
|
|
75
75
|
var S_IconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 100%;\n height: 16px;\n justify-content: center;\n padding: 0 ", ";\n width: 16px;\n"], ["\n align-items: center;\n display: flex;\n height: 100%;\n height: 16px;\n justify-content: center;\n padding: 0 ", ";\n width: 16px;\n"])), function (_a) {
|
|
@@ -80,5 +80,5 @@ var S_MultilingualButtonWrapper = styled_components_1.default.div(templateObject
|
|
|
80
80
|
var theme = _a.theme;
|
|
81
81
|
return theme.spacing.spacingB;
|
|
82
82
|
});
|
|
83
|
-
exports.default = BasicFormGroup;
|
|
83
|
+
exports.default = (0, react_1.forwardRef)(BasicFormGroup);
|
|
84
84
|
var templateObject_1, templateObject_2, templateObject_3;
|