pds-dev-kit-web-test 2.6.2 → 2.6.4
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.d.ts +5 -5
- package/dist/index.js +5 -7
- package/dist/src/common/assets/icons/fill/Gift.d.ts +4 -0
- package/dist/src/common/assets/icons/fill/Gift.js +30 -0
- package/dist/src/common/assets/icons/fill/index.d.ts +1 -0
- package/dist/src/common/assets/icons/fill/index.js +3 -1
- package/dist/src/common/assets/icons/line/Gift.d.ts +4 -0
- package/dist/src/common/assets/icons/line/Gift.js +30 -0
- package/dist/src/common/assets/icons/line/index.d.ts +1 -0
- package/dist/src/common/assets/icons/line/index.js +3 -1
- package/dist/src/common/types/index.d.ts +1 -1
- package/dist/src/common/types/index.js +1 -1
- package/dist/src/common/types/{LocalizedContent.d.ts → multilingual.d.ts} +5 -6
- package/dist/src/desktop/components/BasicFormGroup/BasicFormGroup.d.ts +5 -4
- package/dist/src/desktop/components/BasicFormGroup/BasicFormGroup.js +53 -3
- package/dist/src/desktop/components/BodyTextGroup/BodyTextGroup.d.ts +5 -3
- package/dist/src/desktop/components/BodyTextGroup/BodyTextGroup.js +51 -3
- package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.d.ts +3 -1
- package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js +21 -10
- package/dist/src/desktop/components/RichTextEditor/RichTextEditor.js +1 -1
- package/dist/src/desktop/components/TextField/TextField.d.ts +3 -1
- package/dist/src/desktop/components/TextField/TextField.js +22 -11
- package/dist/src/desktop/components/index.d.ts +1 -2
- package/dist/src/desktop/components/index.js +1 -3
- package/dist/src/desktop/index.d.ts +2 -2
- package/dist/src/desktop/index.js +1 -3
- package/dist/src/desktop/panels/MultilingualModal/MultilingualModal.d.ts +13 -0
- package/dist/src/desktop/panels/MultilingualModal/MultilingualModal.js +206 -0
- package/dist/src/desktop/panels/MultilingualModal/index.d.ts +1 -0
- package/dist/src/desktop/panels/{LocalizedContentModal → MultilingualModal}/index.js +2 -2
- package/dist/src/desktop/panels/index.d.ts +2 -2
- package/dist/src/desktop/panels/index.js +3 -3
- package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js +5 -3
- package/package.json +1 -1
- package/release-note.md +3 -3
- package/dist/src/common/styles/editorContentStyle.d.ts +0 -1
- package/dist/src/common/styles/editorContentStyle.js +0 -76
- package/dist/src/desktop/components/LocalizedButton/LocalizedButton.d.ts +0 -8
- package/dist/src/desktop/components/LocalizedButton/LocalizedButton.js +0 -44
- package/dist/src/desktop/components/LocalizedButton/index.d.ts +0 -1
- package/dist/src/desktop/components/LocalizedButton/index.js +0 -8
- package/dist/src/desktop/panels/LocalizedContentModal/LocalizedContentModal.d.ts +0 -24
- package/dist/src/desktop/panels/LocalizedContentModal/LocalizedContentModal.js +0 -81
- package/dist/src/desktop/panels/LocalizedContentModal/index.d.ts +0 -1
- /package/dist/src/common/types/{LocalizedContent.js → multilingual.js} +0 -0
@@ -2,6 +2,7 @@
|
|
2
2
|
import { Path } from 'react-hook-form';
|
3
3
|
import type { IFormValues, PDSTextType, UiColors, PDSIconType } from '../../../common';
|
4
4
|
import type { TextFieldBaseProps } from '../../common/components/TextFieldBase/TextFieldBase';
|
5
|
+
import type { ScrollVisibleType } from '../../../common/styles/scroll/scrollbarStyle';
|
5
6
|
export type TextFieldProps = {
|
6
7
|
name: Path<IFormValues>;
|
7
8
|
prefixText?: PDSTextType;
|
@@ -20,8 +21,9 @@ export type TextFieldProps = {
|
|
20
21
|
fontWeight?: 'bold' | 'regular';
|
21
22
|
hintTextFontWeight?: 'normal' | 'bold';
|
22
23
|
deleteBtnMode?: 'none' | 'use';
|
24
|
+
scrollVisibleType?: ScrollVisibleType;
|
23
25
|
onClickIBtn1?: () => void;
|
24
26
|
onClickIBtn2?: () => void;
|
25
27
|
} & Partial<TextFieldBaseProps>;
|
26
|
-
declare function TextField({ name, hintText, defaultText, textAlign, prefixText, suffixText, validation, validationPoint, preventBlankMode, enterSubmitMode, size, responsiveMode, textLineType, multiRows, autoMinRows, autoMaxRows, inputType, inputMode, state, iBtn1IconName, iBtn1IconFillType, iBtn2IconName, iBtn2IconFillType, overrideIBtn1IconColorKey, overrideIBtn2IconColorKey, colorTheme, max, maxLength, min, customWidth, autoComplete, numberStepperMode, numberStep, fontWeight, hintTextFontWeight, deleteBtnMode, onBlur, onChange, onClickIBtn1, onClickIBtn2, onFocus, onKeyUp, onKeyDown, onTarget }: TextFieldProps): JSX.Element;
|
28
|
+
declare function TextField({ name, hintText, defaultText, textAlign, prefixText, suffixText, validation, validationPoint, preventBlankMode, enterSubmitMode, size, responsiveMode, textLineType, multiRows, autoMinRows, autoMaxRows, inputType, inputMode, state, iBtn1IconName, iBtn1IconFillType, iBtn2IconName, iBtn2IconFillType, overrideIBtn1IconColorKey, overrideIBtn2IconColorKey, colorTheme, max, maxLength, min, customWidth, autoComplete, numberStepperMode, numberStep, fontWeight, hintTextFontWeight, deleteBtnMode, scrollVisibleType, onBlur, onChange, onClickIBtn1, onClickIBtn2, onFocus, onKeyUp, onKeyDown, onTarget }: TextFieldProps): JSX.Element;
|
27
29
|
export default TextField;
|
@@ -51,7 +51,7 @@ var IconButton_1 = require("../IconButton");
|
|
51
51
|
var TextLabel_1 = require("../TextLabel");
|
52
52
|
function TextField(_a) {
|
53
53
|
var _b;
|
54
|
-
var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, prefixText = _a.prefixText, suffixText = _a.suffixText, validation = _a.validation, _d = _a.validationPoint, validationPoint = _d === void 0 ? 'onBlur' : _d, _e = _a.preventBlankMode, preventBlankMode = _e === void 0 ? 'none' : _e, _f = _a.enterSubmitMode, enterSubmitMode = _f === void 0 ? 'none' : _f, _g = _a.size, size = _g === void 0 ? 'large' : _g, _h = _a.responsiveMode, responsiveMode = _h === void 0 ? 'none' : _h, _j = _a.textLineType, textLineType = _j === void 0 ? 'single' : _j, _k = _a.multiRows, multiRows = _k === void 0 ? 8 : _k, _l = _a.autoMinRows, autoMinRows = _l === void 0 ? 8 : _l, autoMaxRows = _a.autoMaxRows, _m = _a.inputType, inputType = _m === void 0 ? 'text' : _m, inputMode = _a.inputMode, _o = _a.state, state = _o === void 0 ? 'normal' : _o, iBtn1IconName = _a.iBtn1IconName, _p = _a.iBtn1IconFillType, iBtn1IconFillType = _p === void 0 ? 'line' : _p, iBtn2IconName = _a.iBtn2IconName, _q = _a.iBtn2IconFillType, iBtn2IconFillType = _q === void 0 ? 'line' : _q, overrideIBtn1IconColorKey = _a.overrideIBtn1IconColorKey, overrideIBtn2IconColorKey = _a.overrideIBtn2IconColorKey, _r = _a.colorTheme, colorTheme = _r === void 0 ? 'none' : _r, max = _a.max, maxLength = _a.maxLength, min = _a.min, customWidth = _a.customWidth, _s = _a.autoComplete, autoComplete = _s === void 0 ? 'on' : _s, _t = _a.numberStepperMode, numberStepperMode = _t === void 0 ? 'none' : _t, numberStep = _a.numberStep, _u = _a.fontWeight, fontWeight = _u === void 0 ? 'regular' : _u, _v = _a.hintTextFontWeight, hintTextFontWeight = _v === void 0 ? 'normal' : _v, _w = _a.deleteBtnMode, deleteBtnMode = _w === void 0 ? 'use' : _w, onBlur = _a.onBlur, onChange = _a.onChange, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onFocus = _a.onFocus, onKeyUp = _a.onKeyUp, onKeyDown = _a.onKeyDown, onTarget = _a.onTarget;
|
54
|
+
var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, prefixText = _a.prefixText, suffixText = _a.suffixText, validation = _a.validation, _d = _a.validationPoint, validationPoint = _d === void 0 ? 'onBlur' : _d, _e = _a.preventBlankMode, preventBlankMode = _e === void 0 ? 'none' : _e, _f = _a.enterSubmitMode, enterSubmitMode = _f === void 0 ? 'none' : _f, _g = _a.size, size = _g === void 0 ? 'large' : _g, _h = _a.responsiveMode, responsiveMode = _h === void 0 ? 'none' : _h, _j = _a.textLineType, textLineType = _j === void 0 ? 'single' : _j, _k = _a.multiRows, multiRows = _k === void 0 ? 8 : _k, _l = _a.autoMinRows, autoMinRows = _l === void 0 ? 8 : _l, autoMaxRows = _a.autoMaxRows, _m = _a.inputType, inputType = _m === void 0 ? 'text' : _m, inputMode = _a.inputMode, _o = _a.state, state = _o === void 0 ? 'normal' : _o, iBtn1IconName = _a.iBtn1IconName, _p = _a.iBtn1IconFillType, iBtn1IconFillType = _p === void 0 ? 'line' : _p, iBtn2IconName = _a.iBtn2IconName, _q = _a.iBtn2IconFillType, iBtn2IconFillType = _q === void 0 ? 'line' : _q, overrideIBtn1IconColorKey = _a.overrideIBtn1IconColorKey, overrideIBtn2IconColorKey = _a.overrideIBtn2IconColorKey, _r = _a.colorTheme, colorTheme = _r === void 0 ? 'none' : _r, max = _a.max, maxLength = _a.maxLength, min = _a.min, customWidth = _a.customWidth, _s = _a.autoComplete, autoComplete = _s === void 0 ? 'on' : _s, _t = _a.numberStepperMode, numberStepperMode = _t === void 0 ? 'none' : _t, numberStep = _a.numberStep, _u = _a.fontWeight, fontWeight = _u === void 0 ? 'regular' : _u, _v = _a.hintTextFontWeight, hintTextFontWeight = _v === void 0 ? 'normal' : _v, _w = _a.deleteBtnMode, deleteBtnMode = _w === void 0 ? 'use' : _w, _x = _a.scrollVisibleType, scrollVisibleType = _x === void 0 ? 'visible' : _x, onBlur = _a.onBlur, onChange = _a.onChange, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onFocus = _a.onFocus, onKeyUp = _a.onKeyUp, onKeyDown = _a.onKeyDown, onTarget = _a.onTarget;
|
55
55
|
var basicThemeIconColors = {
|
56
56
|
normal: 'ui_cpnt_button_icon_default',
|
57
57
|
read_only: 'ui_cpnt_button_icon_default',
|
@@ -67,9 +67,9 @@ function TextField(_a) {
|
|
67
67
|
read_only: 'ui_cpnt_textfield_icon_colortheme_transparent_readonly',
|
68
68
|
disabled: 'ui_cpnt_textfield_icon_colortheme_transparent_disabled'
|
69
69
|
};
|
70
|
-
var
|
71
|
-
var
|
72
|
-
var
|
70
|
+
var _y = (0, react_1.useState)(false), isFocused = _y[0], setIsFocused = _y[1];
|
71
|
+
var _z = (0, react_hook_form_1.useFormContext)(), register = _z.register, trigger = _z.trigger, errors = _z.formState.errors;
|
72
|
+
var _0 = register(name, validation), validateOnChange = _0.onChange, validateOnBlur = _0.onBlur;
|
73
73
|
var isError = (0, types_1.getErrorByName)(errors, name);
|
74
74
|
var handleClickIBtn1 = function () {
|
75
75
|
if (onClickIBtn1) {
|
@@ -180,7 +180,7 @@ function TextField(_a) {
|
|
180
180
|
}[colorTheme]), iconFillType: iBtn1IconFillType === 'fill' ? 'fill' : 'line', state: state === 'disabled' ? 'disabled' : 'normal', onClick: handleClickIBtn1 }))] })] }));
|
181
181
|
}
|
182
182
|
};
|
183
|
-
return ((0, jsx_runtime_1.jsxs)(S_TextFieldBox, __assign({ "x-pds-name": "TextField", "x-pds-element-type": "component", "x-pds-device-type": "desktop", size: size, responsiveMode: responsiveMode, customWidth: customWidth }, { children: [(0, jsx_runtime_1.jsx)(S_TextFieldWrapper, __assign({ size: size, responsiveMode: responsiveMode, textLineType: textLineType, isFocused: isFocused, isError: Boolean(isError), state: state, colorTheme: colorTheme, customWidth: customWidth }, { children: S_TextField() })), ((_b = (0, types_1.getErrorByName)(errors, name)) === null || _b === void 0 ? void 0 : _b.message) && state === 'normal' && ((0, jsx_runtime_1.jsx)(S_Error, __assign({ colorTheme: colorTheme }, { children: (0, types_1.getErrorByName)(errors, name).message })))] })));
|
183
|
+
return ((0, jsx_runtime_1.jsxs)(S_TextFieldBox, __assign({ "x-pds-name": "TextField", "x-pds-element-type": "component", "x-pds-device-type": "desktop", size: size, responsiveMode: responsiveMode, customWidth: customWidth }, { children: [(0, jsx_runtime_1.jsx)(S_TextFieldWrapper, __assign({ size: size, responsiveMode: responsiveMode, textLineType: textLineType, isFocused: isFocused, isError: Boolean(isError), state: state, colorTheme: colorTheme, customWidth: customWidth, scrollVisibleType: scrollVisibleType }, { children: S_TextField() })), ((_b = (0, types_1.getErrorByName)(errors, name)) === null || _b === void 0 ? void 0 : _b.message) && state === 'normal' && ((0, jsx_runtime_1.jsx)(S_Error, __assign({ colorTheme: colorTheme }, { children: (0, types_1.getErrorByName)(errors, name).message })))] })));
|
184
184
|
}
|
185
185
|
var S_TextFieldBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", ";\n ", ";\n ", "\n"], ["\n ", ";\n ", ";\n ", "\n"])), function (_a) {
|
186
186
|
var size = _a.size;
|
@@ -342,7 +342,7 @@ var backgroundActiveColor = (0, styled_components_1.css)(templateObject_17 || (t
|
|
342
342
|
}
|
343
343
|
});
|
344
344
|
var normalActionColor = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"], ["\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"])), backgroundHoverColor, backgroundActiveColor);
|
345
|
-
var S_TextFieldWrapper = styled_components_1.default.div(
|
345
|
+
var S_TextFieldWrapper = styled_components_1.default.div(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n align-items: center;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n ", ";\n ", ";\n\n ", "\n\n ", "\n\n ", ";\n ", "\n\n ", "\n ", "\n"], ["\n align-items: center;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n ", ";\n ", ";\n\n ", "\n\n ", "\n\n ", ";\n ", "\n\n ", "\n ", "\n"])), function (_a) {
|
346
346
|
var state = _a.state;
|
347
347
|
return (state === 'disabled' ? 'not-allowed' : 'text');
|
348
348
|
}, function (_a) {
|
@@ -382,11 +382,22 @@ var S_TextFieldWrapper = styled_components_1.default.div(templateObject_19 || (t
|
|
382
382
|
}, function (_a) {
|
383
383
|
var customWidth = _a.customWidth;
|
384
384
|
return customWidth && "width: ".concat(customWidth, ";");
|
385
|
+
}, function (_a) {
|
386
|
+
var textLineType = _a.textLineType, scrollVisibleType = _a.scrollVisibleType;
|
387
|
+
return textLineType === 'multi' &&
|
388
|
+
scrollVisibleType === 'visible' && (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n textarea::-webkit-scrollbar-thumb {\n background-color: ", ";\n background-clip: padding-box;\n border-radius: 5px;\n border: 2px solid transparent;\n }\n textarea::-webkit-scrollbar {\n display: block;\n width: 10px;\n }\n textarea {\n scrollbar-width: auto;\n }\n "], ["\n textarea::-webkit-scrollbar-thumb {\n background-color: ", ";\n background-clip: padding-box;\n border-radius: 5px;\n border: 2px solid transparent;\n }\n textarea::-webkit-scrollbar {\n display: block;\n width: 10px;\n }\n textarea {\n scrollbar-width: auto;\n }\n "])), function (_a) {
|
389
|
+
var theme = _a.theme;
|
390
|
+
return theme.ui_container_scroll;
|
391
|
+
});
|
392
|
+
}, function (_a) {
|
393
|
+
var textLineType = _a.textLineType, scrollVisibleType = _a.scrollVisibleType;
|
394
|
+
return textLineType === 'multi' &&
|
395
|
+
scrollVisibleType === 'hidden' && (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n textarea::-webkit-scrollbar {\n background: transparent;\n display: block;\n width: 0px;\n }\n textarea {\n scrollbar-width: auto;\n }\n "], ["\n textarea::-webkit-scrollbar {\n background: transparent;\n display: block;\n width: 0px;\n }\n textarea {\n scrollbar-width: auto;\n }\n "])));
|
385
396
|
});
|
386
|
-
var S_RightBox = styled_components_1.default.div(
|
387
|
-
var S_RightBox_Auto = styled_components_1.default.div(
|
388
|
-
var S_RightBox_Multi = styled_components_1.default.div(
|
389
|
-
var S_Error = styled_components_1.default.div(
|
397
|
+
var S_RightBox = styled_components_1.default.div(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n"], ["\n align-items: center;\n display: flex;\n"])));
|
398
|
+
var S_RightBox_Auto = styled_components_1.default.div(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n align-items: center;\n align-self: end;\n display: flex;\n"], ["\n align-items: center;\n align-self: end;\n display: flex;\n"])));
|
399
|
+
var S_RightBox_Multi = styled_components_1.default.div(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n align-items: center;\n align-self: end;\n display: flex;\n"], ["\n align-items: center;\n align-self: end;\n display: flex;\n"])));
|
400
|
+
var S_Error = styled_components_1.default.div(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin-top: ", ";\n text-align: left;\n white-space: pre-wrap;\n"], ["\n color: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n margin-top: ", ";\n text-align: left;\n white-space: pre-wrap;\n"])), function (_a) {
|
390
401
|
var theme = _a.theme, colorTheme = _a.colorTheme;
|
391
402
|
switch (colorTheme) {
|
392
403
|
case 'none': {
|
@@ -411,4 +422,4 @@ var S_Error = styled_components_1.default.div(templateObject_23 || (templateObje
|
|
411
422
|
return theme.spacing.spacingA;
|
412
423
|
});
|
413
424
|
exports.default = TextField;
|
414
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23;
|
425
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25;
|
@@ -30,7 +30,6 @@ import { Hero } from './Hero';
|
|
30
30
|
import { HorizontalFormGroup } from './HorizontalFormGroup';
|
31
31
|
import { IconButton } from './IconButton';
|
32
32
|
import { ImageSlide } from './ImageSlide';
|
33
|
-
import { LocalizedButton } from './LocalizedButton';
|
34
33
|
import { LottieReactionButton } from './LottieReactionButton';
|
35
34
|
import { MainButton } from './MainButton';
|
36
35
|
import { PageTitleTextGroup } from './PageTitleTextGroup';
|
@@ -53,4 +52,4 @@ import { UploadTextButton } from './UploadTextButton';
|
|
53
52
|
import { UserDesktopNavBar } from './UserDesktopNavBar';
|
54
53
|
import { UserDesktopSideTab } from './UserDesktopSideTab';
|
55
54
|
import { UserDesktopTabBar } from './UserDesktopTabBar';
|
56
|
-
export { AdminList, AdminListHeader, AdminListItem, BasicButtonGroup, BasicChatListItem, BasicFormGroup, BasicList, BasicListItem, BlogTextField, BodyTextGroup, BoxItem, Card, CardList, ChatBubbleListItem, ChatList, Checkbox, Chip, ContextMenu, ContextMenuItem, DesktopAlertDialog, DesktopHeaderBar, DesktopTabBar, Dropdown, DynamicDesktopNavBar, DynamicDesktopNavBarTemplates, EditApplyTextField, FilterBar, FloatingActionButton, Hero, HorizontalFormGroup, IconButton, ImageSlide, LottieReactionButton, MainButton, PageTitleTextGroup, PriceTextField, Radio, ReactionButton, RichTextEditor, SegmentedButtonGroup, Select, Slider, Snackbar, StatusBlock, TextButton, TextField, TextLabel, PriceTextLabel, UploadIconButton, UploadMainButton, UploadTextButton, UserDesktopNavBar, UserDesktopTabBar, UserDesktopSideTab, Calendar
|
55
|
+
export { AdminList, AdminListHeader, AdminListItem, BasicButtonGroup, BasicChatListItem, BasicFormGroup, BasicList, BasicListItem, BlogTextField, BodyTextGroup, BoxItem, Card, CardList, ChatBubbleListItem, ChatList, Checkbox, Chip, ContextMenu, ContextMenuItem, DesktopAlertDialog, DesktopHeaderBar, DesktopTabBar, Dropdown, DynamicDesktopNavBar, DynamicDesktopNavBarTemplates, EditApplyTextField, FilterBar, FloatingActionButton, Hero, HorizontalFormGroup, IconButton, ImageSlide, LottieReactionButton, MainButton, PageTitleTextGroup, PriceTextField, Radio, ReactionButton, RichTextEditor, SegmentedButtonGroup, Select, Slider, Snackbar, StatusBlock, TextButton, TextField, TextLabel, PriceTextLabel, UploadIconButton, UploadMainButton, UploadTextButton, UserDesktopNavBar, UserDesktopTabBar, UserDesktopSideTab, Calendar };
|
@@ -1,7 +1,7 @@
|
|
1
1
|
"use strict";
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
exports.UploadMainButton = exports.UploadIconButton = exports.PriceTextLabel = exports.TextLabel = exports.TextField = exports.TextButton = exports.StatusBlock = exports.Snackbar = exports.Slider = exports.Select = exports.SegmentedButtonGroup = exports.RichTextEditor = exports.ReactionButton = exports.Radio = exports.PriceTextField = exports.PageTitleTextGroup = exports.MainButton = exports.LottieReactionButton = exports.ImageSlide = exports.IconButton = exports.HorizontalFormGroup = exports.Hero = exports.FloatingActionButton = exports.FilterBar = exports.EditApplyTextField = exports.DynamicDesktopNavBarTemplates = exports.DynamicDesktopNavBar = exports.Dropdown = exports.DesktopTabBar = exports.DesktopHeaderBar = exports.DesktopAlertDialog = exports.ContextMenuItem = exports.ContextMenu = exports.Chip = exports.Checkbox = exports.ChatList = exports.ChatBubbleListItem = exports.CardList = exports.Card = exports.BoxItem = exports.BodyTextGroup = exports.BlogTextField = exports.BasicListItem = exports.BasicList = exports.BasicFormGroup = exports.BasicChatListItem = exports.BasicButtonGroup = exports.AdminListItem = exports.AdminListHeader = exports.AdminList = void 0;
|
4
|
-
exports.
|
4
|
+
exports.Calendar = exports.UserDesktopSideTab = exports.UserDesktopTabBar = exports.UserDesktopNavBar = exports.UploadTextButton = void 0;
|
5
5
|
var AdminList_1 = require("./AdminList");
|
6
6
|
Object.defineProperty(exports, "AdminList", { enumerable: true, get: function () { return AdminList_1.AdminList; } });
|
7
7
|
var AdminListHeader_1 = require("./AdminListHeader");
|
@@ -67,8 +67,6 @@ var IconButton_1 = require("./IconButton");
|
|
67
67
|
Object.defineProperty(exports, "IconButton", { enumerable: true, get: function () { return IconButton_1.IconButton; } });
|
68
68
|
var ImageSlide_1 = require("./ImageSlide");
|
69
69
|
Object.defineProperty(exports, "ImageSlide", { enumerable: true, get: function () { return ImageSlide_1.ImageSlide; } });
|
70
|
-
var LocalizedButton_1 = require("./LocalizedButton");
|
71
|
-
Object.defineProperty(exports, "LocalizedButton", { enumerable: true, get: function () { return LocalizedButton_1.LocalizedButton; } });
|
72
70
|
var LottieReactionButton_1 = require("./LottieReactionButton");
|
73
71
|
Object.defineProperty(exports, "LottieReactionButton", { enumerable: true, get: function () { return LottieReactionButton_1.LottieReactionButton; } });
|
74
72
|
var MainButton_1 = require("./MainButton");
|
@@ -8,5 +8,5 @@ export { ContainersBox as WSContainersBox } from './layout/LayoutWS/ContainersBo
|
|
8
8
|
export { LayoutWT } from './layout/LayoutWT';
|
9
9
|
export { GlobalMenuContainer as WTGlobalMenuContainer } from './layout/LayoutWT/Containers';
|
10
10
|
export { ContainersBox as WTContainersBox } from './layout/LayoutWT/ContainersBox';
|
11
|
-
export { AdminList as D_AdminList, AdminListHeader as D_AdminListHeader, AdminListItem as D_AdminListItem, BasicButtonGroup as D_BasicButtonGroup, BasicChatListItem as D_BasicChatListItem, BasicFormGroup as D_BasicFormGroup, BasicList as D_BasicList, BasicListItem as D_BasicListItem, BlogTextField as D_BlogTextField, BodyTextGroup as D_BodyTextGroup, BoxItem as D_BoxItem, Card as D_Card, CardList as D_CardList, ChatBubbleListItem as D_ChatBubbleListItem, ChatList as D_ChatList, Checkbox as D_Checkbox, Chip as D_Chip, ContextMenu as D_ContextMenu, ContextMenuItem as D_ContextMenuItem, DesktopAlertDialog as D_DesktopAlertDialog, DesktopHeaderBar as D_DesktopHeaderBar, DesktopTabBar as D_DesktopTabBar, Dropdown as D_Dropdown, DynamicDesktopNavBar as D_DynamicDesktopNavBar, DynamicDesktopNavBarTemplates as D_DynamicDesktopNavBarTemplates, EditApplyTextField as D_EditApplyTextField, FilterBar as D_FilterBar, FloatingActionButton as D_FloatingActionButton, Hero as D_Hero, HorizontalFormGroup as D_HorizontalFormGroup, IconButton as D_IconButton, ImageSlide as D_ImageSlide, LottieReactionButton as D_LottieReactionButton, MainButton as D_MainButton, PageTitleTextGroup as D_PageTitleTextGroup, Radio as D_Radio, ReactionButton as D_ReactionButton, RichTextEditor as D_RichTextEditor, SegmentedButtonGroup as D_SegmentedButtonGroup, Select as D_Select, Slider as D_Slider, Snackbar as D_Snackbar, StatusBlock as D_StatusBlock, TextButton as D_TextButton, PriceTextField as D_PriceTextField, TextField as D_TextField, TextLabel as D_TextLabel, PriceTextLabel as D_PriceTextLabel, UploadIconButton as D_UploadIconButton, UploadMainButton as D_UploadMainButton, UploadTextButton as D_UploadTextButton, UserDesktopNavBar as D_UserDesktopNavBar, UserDesktopTabBar as D_UserDesktopTabBar, UserDesktopSideTab as D_UserDesktopSideTab, Calendar as D_Calendar
|
12
|
-
export { AnnotationSheet as D_AnnotationSheet, ContentSheet as D_ContentSheet, DesktopBasicModal as D_DesktopBasicModal, DesktopBasicModalWithTab as D_DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType, DesktopHeadlessModal as D_DesktopHeadlessModal, DesktopTutorialModal as D_DesktopTutorialModal, DesktopTutorialModalInfoType, SectionSheet as D_SectionSheet
|
11
|
+
export { AdminList as D_AdminList, AdminListHeader as D_AdminListHeader, AdminListItem as D_AdminListItem, BasicButtonGroup as D_BasicButtonGroup, BasicChatListItem as D_BasicChatListItem, BasicFormGroup as D_BasicFormGroup, BasicList as D_BasicList, BasicListItem as D_BasicListItem, BlogTextField as D_BlogTextField, BodyTextGroup as D_BodyTextGroup, BoxItem as D_BoxItem, Card as D_Card, CardList as D_CardList, ChatBubbleListItem as D_ChatBubbleListItem, ChatList as D_ChatList, Checkbox as D_Checkbox, Chip as D_Chip, ContextMenu as D_ContextMenu, ContextMenuItem as D_ContextMenuItem, DesktopAlertDialog as D_DesktopAlertDialog, DesktopHeaderBar as D_DesktopHeaderBar, DesktopTabBar as D_DesktopTabBar, Dropdown as D_Dropdown, DynamicDesktopNavBar as D_DynamicDesktopNavBar, DynamicDesktopNavBarTemplates as D_DynamicDesktopNavBarTemplates, EditApplyTextField as D_EditApplyTextField, FilterBar as D_FilterBar, FloatingActionButton as D_FloatingActionButton, Hero as D_Hero, HorizontalFormGroup as D_HorizontalFormGroup, IconButton as D_IconButton, ImageSlide as D_ImageSlide, LottieReactionButton as D_LottieReactionButton, MainButton as D_MainButton, PageTitleTextGroup as D_PageTitleTextGroup, Radio as D_Radio, ReactionButton as D_ReactionButton, RichTextEditor as D_RichTextEditor, SegmentedButtonGroup as D_SegmentedButtonGroup, Select as D_Select, Slider as D_Slider, Snackbar as D_Snackbar, StatusBlock as D_StatusBlock, TextButton as D_TextButton, PriceTextField as D_PriceTextField, TextField as D_TextField, TextLabel as D_TextLabel, PriceTextLabel as D_PriceTextLabel, UploadIconButton as D_UploadIconButton, UploadMainButton as D_UploadMainButton, UploadTextButton as D_UploadTextButton, UserDesktopNavBar as D_UserDesktopNavBar, UserDesktopTabBar as D_UserDesktopTabBar, UserDesktopSideTab as D_UserDesktopSideTab, Calendar as D_Calendar } from './components';
|
12
|
+
export { AnnotationSheet as D_AnnotationSheet, ContentSheet as D_ContentSheet, DesktopBasicModal as D_DesktopBasicModal, DesktopBasicModalWithTab as D_DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType, DesktopHeadlessModal as D_DesktopHeadlessModal, DesktopTutorialModal as D_DesktopTutorialModal, DesktopTutorialModalInfoType, SectionSheet as D_SectionSheet } from './panels';
|
@@ -1,7 +1,7 @@
|
|
1
1
|
"use strict";
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
exports.D_Select = exports.D_SegmentedButtonGroup = exports.D_RichTextEditor = exports.D_ReactionButton = exports.D_Radio = exports.D_PageTitleTextGroup = exports.D_MainButton = exports.D_LottieReactionButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_HorizontalFormGroup = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DynamicDesktopNavBarTemplates = exports.D_DynamicDesktopNavBar = exports.D_Dropdown = exports.D_DesktopTabBar = exports.D_DesktopHeaderBar = exports.D_DesktopAlertDialog = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_ChatList = exports.D_ChatBubbleListItem = exports.D_CardList = exports.D_Card = exports.D_BoxItem = exports.D_BodyTextGroup = exports.D_BlogTextField = exports.D_BasicListItem = exports.D_BasicList = exports.D_BasicFormGroup = exports.D_BasicChatListItem = exports.D_BasicButtonGroup = exports.D_AdminListItem = exports.D_AdminListHeader = exports.D_AdminList = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WHContainersBox = exports.LayoutWH = exports.WFContainersBox = exports.LayoutWF = void 0;
|
4
|
-
exports.
|
4
|
+
exports.D_SectionSheet = exports.D_DesktopTutorialModal = exports.D_DesktopHeadlessModal = exports.D_DesktopBasicModalWithTab = exports.D_DesktopBasicModal = exports.D_ContentSheet = exports.D_AnnotationSheet = exports.D_Calendar = exports.D_UserDesktopSideTab = exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_PriceTextLabel = exports.D_TextLabel = exports.D_TextField = exports.D_PriceTextField = exports.D_TextButton = exports.D_StatusBlock = exports.D_Snackbar = exports.D_Slider = void 0;
|
5
5
|
// layoutWF
|
6
6
|
var LayoutWF_1 = require("./layout/LayoutWF");
|
7
7
|
Object.defineProperty(exports, "LayoutWF", { enumerable: true, get: function () { return LayoutWF_1.LayoutWF; } });
|
@@ -83,7 +83,6 @@ Object.defineProperty(exports, "D_UserDesktopNavBar", { enumerable: true, get: f
|
|
83
83
|
Object.defineProperty(exports, "D_UserDesktopTabBar", { enumerable: true, get: function () { return components_1.UserDesktopTabBar; } });
|
84
84
|
Object.defineProperty(exports, "D_UserDesktopSideTab", { enumerable: true, get: function () { return components_1.UserDesktopSideTab; } });
|
85
85
|
Object.defineProperty(exports, "D_Calendar", { enumerable: true, get: function () { return components_1.Calendar; } });
|
86
|
-
Object.defineProperty(exports, "LocalizedButton", { enumerable: true, get: function () { return components_1.LocalizedButton; } });
|
87
86
|
// panels
|
88
87
|
var panels_1 = require("./panels");
|
89
88
|
Object.defineProperty(exports, "D_AnnotationSheet", { enumerable: true, get: function () { return panels_1.AnnotationSheet; } });
|
@@ -93,4 +92,3 @@ Object.defineProperty(exports, "D_DesktopBasicModalWithTab", { enumerable: true,
|
|
93
92
|
Object.defineProperty(exports, "D_DesktopHeadlessModal", { enumerable: true, get: function () { return panels_1.DesktopHeadlessModal; } });
|
94
93
|
Object.defineProperty(exports, "D_DesktopTutorialModal", { enumerable: true, get: function () { return panels_1.DesktopTutorialModal; } });
|
95
94
|
Object.defineProperty(exports, "D_SectionSheet", { enumerable: true, get: function () { return panels_1.SectionSheet; } });
|
96
|
-
Object.defineProperty(exports, "D_LocalizedContentModal", { enumerable: true, get: function () { return panels_1.LocalizedContentModal; } });
|
@@ -0,0 +1,13 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { ScrollVisibleType } from '../../../common/styles/scroll/scrollbarStyle';
|
3
|
+
import type { MultilingualConfig } from '../../../common/types';
|
4
|
+
type MultilingualModalModalProps = {
|
5
|
+
isOpen: boolean;
|
6
|
+
onClose: () => void;
|
7
|
+
config?: MultilingualConfig;
|
8
|
+
size?: 'large' | 'medium' | 'small' | 'rlarge';
|
9
|
+
onHiddenInputUpdate?: (newValue: string) => void;
|
10
|
+
scrollVisibleType?: ScrollVisibleType;
|
11
|
+
};
|
12
|
+
declare function MultilingualModal({ isOpen, onClose, config, size, onHiddenInputUpdate, scrollVisibleType }: MultilingualModalModalProps): import("react").ReactPortal | null;
|
13
|
+
export default MultilingualModal;
|
@@ -0,0 +1,206 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
4
|
+
return cooked;
|
5
|
+
};
|
6
|
+
var __assign = (this && this.__assign) || function () {
|
7
|
+
__assign = Object.assign || function(t) {
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
9
|
+
s = arguments[i];
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
11
|
+
t[p] = s[p];
|
12
|
+
}
|
13
|
+
return t;
|
14
|
+
};
|
15
|
+
return __assign.apply(this, arguments);
|
16
|
+
};
|
17
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
18
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
19
|
+
};
|
20
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
21
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
22
|
+
var react_1 = require("react");
|
23
|
+
var react_dom_1 = __importDefault(require("react-dom"));
|
24
|
+
var react_hook_form_1 = require("react-hook-form");
|
25
|
+
var react_i18next_1 = require("react-i18next");
|
26
|
+
var animationStyle_1 = require("../../../common/styles/movement/animationStyle");
|
27
|
+
var scrollbarStyle_1 = require("../../../common/styles/scroll/scrollbarStyle");
|
28
|
+
var components_1 = require("../../components");
|
29
|
+
var components_2 = require("../../../hybrid/components");
|
30
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
31
|
+
var LANGUAGE_I18N_KEYS = {
|
32
|
+
en: 'str_multilingual_en',
|
33
|
+
ko: 'str_multilingual_ko',
|
34
|
+
ja: 'str_multilingual_ja',
|
35
|
+
zh: 'str_multilingual_zh_cn',
|
36
|
+
'zh-Hant': 'str_multilingual_zh_tw',
|
37
|
+
fr: 'str_multilingual_fr',
|
38
|
+
es: 'str_multilingual_es'
|
39
|
+
};
|
40
|
+
function MultilingualModal(_a) {
|
41
|
+
var _b, _c;
|
42
|
+
var isOpen = _a.isOpen, onClose = _a.onClose, config = _a.config, _d = _a.size, size = _d === void 0 ? 'medium' : _d, onHiddenInputUpdate = _a.onHiddenInputUpdate, _e = _a.scrollVisibleType, scrollVisibleType = _e === void 0 ? 'visible' : _e;
|
43
|
+
var t = (0, react_i18next_1.useTranslation)().t;
|
44
|
+
var allLangInReadonly = (_b = config === null || config === void 0 ? void 0 : config.visibleLanguages) === null || _b === void 0 ? void 0 : _b.every(function (item) { var _a; return (_a = config === null || config === void 0 ? void 0 : config.readonlyLanguages) === null || _a === void 0 ? void 0 : _a.includes(item); });
|
45
|
+
// FormProvider에서 사용할 기본값 계산
|
46
|
+
var getDefaultValues = function () {
|
47
|
+
if (!config)
|
48
|
+
return {};
|
49
|
+
// 먼저 hiddenInput에 저장된 값이 있는지 확인
|
50
|
+
if (config.hiddenInputId) {
|
51
|
+
var hiddenInputId = "hiddenInput_".concat(config.hiddenInputId);
|
52
|
+
var hiddenInput = document.getElementById(hiddenInputId);
|
53
|
+
if (hiddenInput && hiddenInput.value) {
|
54
|
+
var existingValues = JSON.parse(hiddenInput.value);
|
55
|
+
// 빈 객체가 아닌 경우에만 사용
|
56
|
+
if (Object.keys(existingValues).length > 0) {
|
57
|
+
return existingValues;
|
58
|
+
}
|
59
|
+
}
|
60
|
+
}
|
61
|
+
// hiddenInput에 값이 없으면 config.initialValues 사용
|
62
|
+
return config.initialValues || {};
|
63
|
+
};
|
64
|
+
var methods = (0, react_hook_form_1.useForm)({
|
65
|
+
defaultValues: getDefaultValues()
|
66
|
+
});
|
67
|
+
var container = (0, react_1.useState)(function () {
|
68
|
+
var modalRoot = document.createElement('div');
|
69
|
+
modalRoot.setAttribute('id', 'MultilingualModal');
|
70
|
+
return modalRoot;
|
71
|
+
})[0];
|
72
|
+
(0, react_1.useLayoutEffect)(function () {
|
73
|
+
if (!isOpen)
|
74
|
+
return;
|
75
|
+
var root = document.getElementById('root');
|
76
|
+
if (!root)
|
77
|
+
return;
|
78
|
+
root.appendChild(container);
|
79
|
+
return function () {
|
80
|
+
if (root.contains(container)) {
|
81
|
+
root.removeChild(container);
|
82
|
+
}
|
83
|
+
};
|
84
|
+
}, [isOpen, container]);
|
85
|
+
(0, react_1.useLayoutEffect)(function () {
|
86
|
+
if (isOpen && config) {
|
87
|
+
var newDefaultValues = getDefaultValues();
|
88
|
+
methods.reset(newDefaultValues);
|
89
|
+
}
|
90
|
+
}, [isOpen, config]);
|
91
|
+
var handleConfirm = function () {
|
92
|
+
var formValues = methods.getValues();
|
93
|
+
// hidden input에 다국어 값들을 JSON 형태로 저장
|
94
|
+
var newValue = JSON.stringify(formValues);
|
95
|
+
if (config === null || config === void 0 ? void 0 : config.hiddenInputId) {
|
96
|
+
var hiddenInputId = "hiddenInput_".concat(config.hiddenInputId);
|
97
|
+
var hiddenInput = document.getElementById(hiddenInputId);
|
98
|
+
if (hiddenInput) {
|
99
|
+
// BasicFormGroup의 state 업데이트
|
100
|
+
if (onHiddenInputUpdate) {
|
101
|
+
onHiddenInputUpdate(newValue);
|
102
|
+
}
|
103
|
+
// input change 이벤트 발생시켜서 form validation 등이 동작하도록 함
|
104
|
+
var event_1 = new Event('change', { bubbles: true });
|
105
|
+
hiddenInput.dispatchEvent(event_1);
|
106
|
+
}
|
107
|
+
}
|
108
|
+
if (config === null || config === void 0 ? void 0 : config.onApply) {
|
109
|
+
config.onApply(formValues);
|
110
|
+
}
|
111
|
+
onClose();
|
112
|
+
};
|
113
|
+
var handleCancel = function () {
|
114
|
+
onClose();
|
115
|
+
};
|
116
|
+
if (!isOpen)
|
117
|
+
return null;
|
118
|
+
return react_dom_1.default.createPortal((0, jsx_runtime_1.jsxs)(react_hook_form_1.FormProvider, __assign({}, methods, { children: [(0, jsx_runtime_1.jsx)(S_ModalOverlay, { onClick: handleCancel }), (0, jsx_runtime_1.jsxs)(S_ModalWrapper, __assign({ "x-pds-name": "MultiLanguageModal", "x-pds-element-type": "panel", "x-pds-device-type": "desktop", size: size }, { children: [(0, jsx_runtime_1.jsx)(S_Header, { children: (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: t('str_multilingual_settings'), colorTheme: "sysTextPrimary", styleTheme: "headingBold" }) }), (0, jsx_runtime_1.jsxs)(S_Body, __assign({ scrollVisibleType: scrollVisibleType }, { children: [(config === null || config === void 0 ? void 0 : config.originalText) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.BodyTextGroup, { titleText: t('str_original_text'), contentText: config.originalText }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_f" }), (0, jsx_runtime_1.jsx)(components_2.Divider, {}), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_f" })] })), (_c = config === null || config === void 0 ? void 0 : config.visibleLanguages) === null || _c === void 0 ? void 0 : _c.map(function (languageCode, index) {
|
119
|
+
var _a, _b;
|
120
|
+
var isReadonly = (_a = config.readonlyLanguages) === null || _a === void 0 ? void 0 : _a.includes(languageCode);
|
121
|
+
return ((0, jsx_runtime_1.jsxs)(S_LanguageField, { children: [(0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "".concat(t(LANGUAGE_I18N_KEYS[languageCode])), styleTheme: "subTitleBold", colorTheme: "sysTextPrimary" }), (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.TextField, { responsiveMode: "use", multiRows: config.textFieldLineType === 'multi' ? 5 : undefined, autoMaxRows: config.textFieldLineType === 'auto' ? 5 : undefined, autoMinRows: config.textFieldLineType === 'auto' ? 1 : undefined, name: languageCode, hintText: t('str_9071'), placeholder: "Input Text", textLineType: config.textFieldLineType, state: isReadonly ? 'disabled' : 'normal' }), index < (((_b = config.visibleLanguages) === null || _b === void 0 ? void 0 : _b.length) || 0) - 1 && (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_f" })] }, "".concat(languageCode, "_field")));
|
122
|
+
})] })), (0, jsx_runtime_1.jsxs)(S_Footer, { children: [(0, jsx_runtime_1.jsx)(S_Left, {}), (0, jsx_runtime_1.jsxs)(S_Right, { children: [!allLangInReadonly && ((0, jsx_runtime_1.jsx)(S_Btn2Wrapper, { children: (0, jsx_runtime_1.jsx)(components_1.MainButton, { styleTheme: "secondary", text: t('str_cancel'), size: "medium", onClick: handleCancel }) })), (0, jsx_runtime_1.jsx)(components_1.MainButton, { text: allLangInReadonly ? t('str_confirm') : t('str_apply'), size: "medium", onClick: handleConfirm })] })] })] }))] })), container);
|
123
|
+
}
|
124
|
+
var S_ModalOverlay = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100vh;\n left: 0;\n position: fixed;\n top: 0;\n width: 100vw;\n\n ", "\n"], ["\n background-color: ", ";\n height: 100vh;\n left: 0;\n position: fixed;\n top: 0;\n width: 100vw;\n\n ", "\n"])), function (_a) {
|
125
|
+
var theme = _a.theme;
|
126
|
+
return theme.ui_cpnt_modal_dimmed;
|
127
|
+
}, animationStyle_1.modalOverlayOnAni);
|
128
|
+
var S_ModalWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n left: 50%;\n position: fixed;\n top: 50%;\n transform: translate(-50%, -50%);\n width: ", ";\n\n ", "\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n left: 50%;\n position: fixed;\n top: 50%;\n transform: translate(-50%, -50%);\n width: ", ";\n\n ", "\n"])), function (_a) {
|
129
|
+
var theme = _a.theme;
|
130
|
+
return theme.ui_cpnt_modal_base;
|
131
|
+
}, function (_a) {
|
132
|
+
var theme = _a.theme;
|
133
|
+
return theme.ui_cpnt_modal_border;
|
134
|
+
}, function (_a) {
|
135
|
+
var theme = _a.theme;
|
136
|
+
return theme.boxShadow.elevation4;
|
137
|
+
}, function (_a) {
|
138
|
+
var size = _a.size;
|
139
|
+
var sizes = {
|
140
|
+
large: '960px',
|
141
|
+
medium: '688px',
|
142
|
+
small: '400px',
|
143
|
+
rlarge: '80vw'
|
144
|
+
};
|
145
|
+
return size && sizes[size];
|
146
|
+
}, animationStyle_1.modalOnAni);
|
147
|
+
var S_Header = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
|
148
|
+
var theme = _a.theme;
|
149
|
+
return theme.spacing.spacingC;
|
150
|
+
}, function (_a) {
|
151
|
+
var theme = _a.theme;
|
152
|
+
return theme.spacing.spacingE;
|
153
|
+
}, function (_a) {
|
154
|
+
var theme = _a.theme;
|
155
|
+
return theme.spacing.spacingE;
|
156
|
+
}, function (_a) {
|
157
|
+
var theme = _a.theme;
|
158
|
+
return theme.spacing.spacingE;
|
159
|
+
});
|
160
|
+
var S_Body = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n flex: 1;\n max-height: 60vh;\n overflow: auto;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"], ["\n flex: 1;\n max-height: 60vh;\n overflow: auto;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"])), function (_a) {
|
161
|
+
var theme = _a.theme;
|
162
|
+
return theme.spacing.spacingF;
|
163
|
+
}, function (_a) {
|
164
|
+
var theme = _a.theme;
|
165
|
+
return theme.spacing.spacingE;
|
166
|
+
}, function (_a) {
|
167
|
+
var theme = _a.theme;
|
168
|
+
return theme.spacing.spacingE;
|
169
|
+
}, function (_a) {
|
170
|
+
var theme = _a.theme;
|
171
|
+
return theme.spacing.spacingD;
|
172
|
+
}, function (_a) {
|
173
|
+
var scrollVisibleType = _a.scrollVisibleType;
|
174
|
+
return ({
|
175
|
+
visible: scrollbarStyle_1.scrollbarStyle,
|
176
|
+
hidden: scrollbarStyle_1.scrollInvisible
|
177
|
+
}[scrollVisibleType]);
|
178
|
+
});
|
179
|
+
var S_Footer = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n border-top: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
|
180
|
+
var theme = _a.theme;
|
181
|
+
return theme.ui_cpnt_modal_border;
|
182
|
+
}, function (_a) {
|
183
|
+
var theme = _a.theme;
|
184
|
+
return theme.spacing.spacingD;
|
185
|
+
}, function (_a) {
|
186
|
+
var theme = _a.theme;
|
187
|
+
return theme.spacing.spacingE;
|
188
|
+
}, function (_a) {
|
189
|
+
var theme = _a.theme;
|
190
|
+
return theme.spacing.spacingE;
|
191
|
+
}, function (_a) {
|
192
|
+
var theme = _a.theme;
|
193
|
+
return theme.spacing.spacingD;
|
194
|
+
});
|
195
|
+
var S_Left = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n margin-right: ", ";\n"], ["\n margin-right: ", ";\n"])), function (_a) {
|
196
|
+
var theme = _a.theme;
|
197
|
+
return theme.spacing.spacingB;
|
198
|
+
});
|
199
|
+
var S_Btn2Wrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n margin-right: ", ";\n"], ["\n margin-right: ", ";\n"])), function (_a) {
|
200
|
+
var theme = _a.theme;
|
201
|
+
return theme.spacing.spacingB;
|
202
|
+
});
|
203
|
+
var S_Right = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
204
|
+
var S_LanguageField = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
205
|
+
exports.default = MultilingualModal;
|
206
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
@@ -0,0 +1 @@
|
|
1
|
+
export { default } from './MultilingualModal';
|
@@ -4,5 +4,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
4
|
};
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
6
6
|
exports.default = void 0;
|
7
|
-
var
|
8
|
-
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(
|
7
|
+
var MultilingualModal_1 = require("./MultilingualModal");
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(MultilingualModal_1).default; } });
|
@@ -4,8 +4,8 @@ import { DesktopBasicModal } from './DesktopBasicModal';
|
|
4
4
|
import { DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType } from './DesktopBasicModalWithTab';
|
5
5
|
import { DesktopHeadlessModal } from './DesktopHeadlessModal';
|
6
6
|
import { DesktopTutorialModal, DesktopTutorialModalInfoType } from './DesktopTutorialModal';
|
7
|
-
import
|
7
|
+
import MultilingualModal from './MultilingualModal';
|
8
8
|
import { SectionSheet } from './SectionSheet';
|
9
|
-
export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopBasicModalWithTab, DesktopHeadlessModal, DesktopTutorialModal,
|
9
|
+
export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopBasicModalWithTab, DesktopHeadlessModal, DesktopTutorialModal, MultilingualModal, SectionSheet };
|
10
10
|
export { DesktopBasicModalWithTabInfoType };
|
11
11
|
export { DesktopTutorialModalInfoType };
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
4
|
};
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
exports.SectionSheet = exports.
|
6
|
+
exports.SectionSheet = exports.MultilingualModal = exports.DesktopTutorialModal = exports.DesktopHeadlessModal = exports.DesktopBasicModalWithTab = exports.DesktopBasicModal = exports.ContentSheet = exports.AnnotationSheet = void 0;
|
7
7
|
var AnnotationSheet_1 = require("./AnnotationSheet");
|
8
8
|
Object.defineProperty(exports, "AnnotationSheet", { enumerable: true, get: function () { return AnnotationSheet_1.AnnotationSheet; } });
|
9
9
|
var ContentSheet_1 = require("./ContentSheet");
|
@@ -16,7 +16,7 @@ var DesktopHeadlessModal_1 = require("./DesktopHeadlessModal");
|
|
16
16
|
Object.defineProperty(exports, "DesktopHeadlessModal", { enumerable: true, get: function () { return DesktopHeadlessModal_1.DesktopHeadlessModal; } });
|
17
17
|
var DesktopTutorialModal_1 = require("./DesktopTutorialModal");
|
18
18
|
Object.defineProperty(exports, "DesktopTutorialModal", { enumerable: true, get: function () { return DesktopTutorialModal_1.DesktopTutorialModal; } });
|
19
|
-
var
|
20
|
-
exports.
|
19
|
+
var MultilingualModal_1 = __importDefault(require("./MultilingualModal"));
|
20
|
+
exports.MultilingualModal = MultilingualModal_1.default;
|
21
21
|
var SectionSheet_1 = require("./SectionSheet");
|
22
22
|
Object.defineProperty(exports, "SectionSheet", { enumerable: true, get: function () { return SectionSheet_1.SectionSheet; } });
|
@@ -267,7 +267,9 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
|
|
267
267
|
return Array.from(set);
|
268
268
|
});
|
269
269
|
setSelectedBlockId(null);
|
270
|
-
var
|
270
|
+
var newBulkIdsSet = new Set(__spreadArray(__spreadArray([], bulkBlockIds, true), bulks_1, true));
|
271
|
+
var newBulkIdsArray = Array.from(newBulkIdsSet);
|
272
|
+
var newBulkCBIds = newBulkIdsArray
|
271
273
|
.map(function (id) { return (0, group_1.formatBlockIdToCbId)(id); })
|
272
274
|
.filter(function (each) { return each !== null; });
|
273
275
|
var childrenCBIds = [];
|
@@ -278,7 +280,7 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
|
|
278
280
|
else {
|
279
281
|
childrenCBIds = newBulkCBIds;
|
280
282
|
}
|
281
|
-
var groupDisabled = getWorkDirDirectChildrenLength() ===
|
283
|
+
var groupDisabled = getWorkDirDirectChildrenLength() === newBulkIdsArray.length;
|
282
284
|
sectionActionHandler &&
|
283
285
|
sectionActionHandler({
|
284
286
|
type: '@CUSTOMSECTION/BLOCK_CLICKED',
|
@@ -286,7 +288,7 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
|
|
286
288
|
block: {
|
287
289
|
type: 'BULK',
|
288
290
|
blockId: 'BULK',
|
289
|
-
childrenBlockIds:
|
291
|
+
childrenBlockIds: newBulkIdsArray,
|
290
292
|
workDir: (_a = (0, group_1.getBlockWorkDirPath)(newblock, editingGroupBlock)) !== null && _a !== void 0 ? _a : 'NOT-FOUND',
|
291
293
|
childrenCBIds: childrenCBIds,
|
292
294
|
groupDisabled: groupDisabled && editingGroupBlock !== 'ROOT'
|
package/package.json
CHANGED
package/release-note.md
CHANGED
@@ -1 +0,0 @@
|
|
1
|
-
export declare const editorContentStyle: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("styled-components").DefaultTheme>>;
|
@@ -1,76 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
4
|
-
return cooked;
|
5
|
-
};
|
6
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
7
|
-
exports.editorContentStyle = void 0;
|
8
|
-
var styled_components_1 = require("styled-components");
|
9
|
-
exports.editorContentStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n text-align: left;\n white-space: pre-wrap;\n width: 100%;\n word-break: break-word;\n\n & pre {\n white-space: pre-wrap;\n }\n\n div,\n p {\n overflow: hidden;\n }\n\n h1 {\n font-size: ", ";\n line-height: ", ";\n }\n\n h2 {\n font-size: ", ";\n line-height: ", ";\n }\n\n h3 {\n font-size: ", ";\n line-height: ", ";\n }\n\n p,\n li,\n ol {\n font-size: ", ";\n line-height: ", ";\n }\n\n p {\n margin-top: 25px;\n margin-bottom: 25px;\n }\n\n ul {\n margin-top: 25px;\n margin-bottom: 25px;\n }\n\n a {\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n }\n\n img {\n max-width: 100%;\n height: auto;\n margin-top: 30px;\n margin-bottom: 30px;\n }\n\n figure {\n margin: 0;\n max-width: 100%;\n\n img {\n max-width: 100%;\n height: auto;\n }\n }\n\n iframe,\n video {\n max-width: 100%;\n border: none;\n max-height: 404px;\n }\n\n blockquote {\n border-left: 4px solid ", ";\n margin: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n p {\n font-size: ", ";\n font-style: oblique;\n line-height: ", ";\n margin: 0;\n }\n }\n\n span {\n font-weight: inherit;\n }\n"], ["\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n text-align: left;\n white-space: pre-wrap;\n width: 100%;\n word-break: break-word;\n\n & pre {\n white-space: pre-wrap;\n }\n\n div,\n p {\n overflow: hidden;\n }\n\n h1 {\n font-size: ", ";\n line-height: ", ";\n }\n\n h2 {\n font-size: ", ";\n line-height: ", ";\n }\n\n h3 {\n font-size: ", ";\n line-height: ", ";\n }\n\n p,\n li,\n ol {\n font-size: ", ";\n line-height: ", ";\n }\n\n p {\n margin-top: 25px;\n margin-bottom: 25px;\n }\n\n ul {\n margin-top: 25px;\n margin-bottom: 25px;\n }\n\n a {\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n }\n\n img {\n max-width: 100%;\n height: auto;\n margin-top: 30px;\n margin-bottom: 30px;\n }\n\n figure {\n margin: 0;\n max-width: 100%;\n\n img {\n max-width: 100%;\n height: auto;\n }\n }\n\n iframe,\n video {\n max-width: 100%;\n border: none;\n max-height: 404px;\n }\n\n blockquote {\n border-left: 4px solid ", ";\n margin: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n p {\n font-size: ", ";\n font-style: oblique;\n line-height: ", ";\n margin: 0;\n }\n }\n\n span {\n font-weight: inherit;\n }\n"])), function (_a) {
|
10
|
-
var theme = _a.theme;
|
11
|
-
return theme.ui_temp_grey_01;
|
12
|
-
}, function (_a) {
|
13
|
-
var theme = _a.theme;
|
14
|
-
return theme.desktopEditorFontSize.p;
|
15
|
-
}, function (_a) {
|
16
|
-
var theme = _a.theme;
|
17
|
-
return theme.desktopEditorLineHeight.p;
|
18
|
-
}, function (_a) {
|
19
|
-
var theme = _a.theme;
|
20
|
-
return theme.desktopEditorFontSize.h1;
|
21
|
-
}, function (_a) {
|
22
|
-
var theme = _a.theme;
|
23
|
-
return theme.desktopEditorLineHeight.h1;
|
24
|
-
}, function (_a) {
|
25
|
-
var theme = _a.theme;
|
26
|
-
return theme.desktopEditorFontSize.h2;
|
27
|
-
}, function (_a) {
|
28
|
-
var theme = _a.theme;
|
29
|
-
return theme.desktopEditorLineHeight.h2;
|
30
|
-
}, function (_a) {
|
31
|
-
var theme = _a.theme;
|
32
|
-
return theme.desktopEditorFontSize.h3;
|
33
|
-
}, function (_a) {
|
34
|
-
var theme = _a.theme;
|
35
|
-
return theme.desktopEditorLineHeight.h3;
|
36
|
-
}, function (_a) {
|
37
|
-
var theme = _a.theme;
|
38
|
-
return theme.desktopEditorFontSize.p;
|
39
|
-
}, function (_a) {
|
40
|
-
var theme = _a.theme;
|
41
|
-
return theme.desktopEditorLineHeight.p;
|
42
|
-
}, function (_a) {
|
43
|
-
var theme = _a.theme;
|
44
|
-
return theme.ui_papp_post_notice_link;
|
45
|
-
}, function (_a) {
|
46
|
-
var theme = _a.theme;
|
47
|
-
return theme.desktopEditorFontSize.p;
|
48
|
-
}, function (_a) {
|
49
|
-
var theme = _a.theme;
|
50
|
-
return theme.desktopEditorLineHeight.p;
|
51
|
-
}, function (_a) {
|
52
|
-
var theme = _a.theme;
|
53
|
-
return theme.ui_temp_grey_03;
|
54
|
-
}, function (_a) {
|
55
|
-
var theme = _a.theme;
|
56
|
-
return theme.spacing.spacingD;
|
57
|
-
}, function (_a) {
|
58
|
-
var theme = _a.theme;
|
59
|
-
return theme.spacing.spacingA;
|
60
|
-
}, function (_a) {
|
61
|
-
var theme = _a.theme;
|
62
|
-
return theme.spacing.spacingC;
|
63
|
-
}, function (_a) {
|
64
|
-
var theme = _a.theme;
|
65
|
-
return theme.spacing.spacingA;
|
66
|
-
}, function (_a) {
|
67
|
-
var theme = _a.theme;
|
68
|
-
return theme.spacing.spacingA;
|
69
|
-
}, function (_a) {
|
70
|
-
var theme = _a.theme;
|
71
|
-
return theme.desktopEditorFontSize.p;
|
72
|
-
}, function (_a) {
|
73
|
-
var theme = _a.theme;
|
74
|
-
return theme.desktopEditorLineHeight.p;
|
75
|
-
});
|
76
|
-
var templateObject_1;
|
@@ -1,8 +0,0 @@
|
|
1
|
-
/// <reference types="react" />
|
2
|
-
import type { LocalizedContentConfig } from '../../../common/types';
|
3
|
-
export type LocalizedButtonProps = {
|
4
|
-
localizedContentModalConfig: LocalizedContentConfig;
|
5
|
-
state?: 'normal' | 'disabled' | undefined;
|
6
|
-
};
|
7
|
-
declare function LocalizedButton({ localizedContentModalConfig, state }: LocalizedButtonProps): JSX.Element;
|
8
|
-
export default LocalizedButton;
|