pds-dev-kit-web-test 2.7.2 → 2.7.4

package/dist/src/mobile/components/RichTextEditor/RichTextEditor.d.ts

@@ -1,37 +0,0 @@
-/// <reference types="react" />
-export interface ImageUploadResult {
-    location?: string;
-    error?: unknown;
-}
-export type ImageUploadHandler = (file: File) => Promise<ImageUploadResult>;
-/**
- * NOTE
- * toolbar에 사용하고싶은 옵션들을 배열 내부에 차례대로 작성해줍니다.
- * toolbar 옵션은 아래 링크를 참고해주세요.
- * https://www.tiny.cloud/docs/configure/editor-appearance/#toolbar
- * ex) 'undo | redo' => ['undo', 'redo']
- */
-export type RichTextEditorProps = {
-    toolbar: string[];
-    defaultText?: string;
-    hintText?: string;
-    required?: boolean;
-    maxLength?: number;
-    minLength?: number;
-    maxFileSize?: number;
-    lengthValidationText?: string;
-    requiredValidationText?: string;
-    fileSizeValidationText?: string;
-    height?: string | number;
-    tinymceScriptSrc?: string;
-    onChange?: (value: string, isValid?: boolean) => void;
-    onBlur?: (value: string, count: number) => void;
-    onImageUpload?: ImageUploadHandler;
-    isLoadingUsed?: boolean;
-    /**
-     * @deprecated onChange 이벤트를 사용해주세요.
-     */
-    onCountCharacter?: (count: number) => void;
-};
-declare function RichTextEditor({ toolbar, defaultText, hintText, maxLength, minLength, maxFileSize, required, lengthValidationText, requiredValidationText, fileSizeValidationText, height, tinymceScriptSrc, onChange, onBlur, onCountCharacter, onImageUpload, isLoadingUsed }: RichTextEditorProps): JSX.Element;
-export default RichTextEditor;

package/dist/src/mobile/components/RichTextEditor/RichTextEditor.js

@@ -1,281 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable prefer-promise-reject-errors */
-var tinymce_react_1 = require("@tinymce/tinymce-react");
-var react_1 = require("react");
-var react_i18next_1 = require("react-i18next");
-var uuid_1 = require("uuid");
-var components_1 = require("../../../common/components");
-var styled_components_1 = __importDefault(require("styled-components"));
-var MobileAlertDialog_1 = require("../MobileAlertDialog");
-var DEFAULT_ELEMENT_COUNT = 7;
-function RichTextEditor(_a) {
-    var _this = this;
-    var _b, _c, _d;
-    var toolbar = _a.toolbar, defaultText = _a.defaultText, hintText = _a.hintText, maxLength = _a.maxLength, minLength = _a.minLength, maxFileSize = _a.maxFileSize, required = _a.required, lengthValidationText = _a.lengthValidationText, requiredValidationText = _a.requiredValidationText, fileSizeValidationText = _a.fileSizeValidationText, _e = _a.height, height = _e === void 0 ? 600 : _e, _f = _a.tinymceScriptSrc, tinymceScriptSrc = _f === void 0 ? '/tinymce/tinymce.min.js' : _f, onChange = _a.onChange, onBlur = _a.onBlur, onCountCharacter = _a.onCountCharacter, onImageUpload = _a.onImageUpload, _g = _a.isLoadingUsed, isLoadingUsed = _g === void 0 ? true : _g;
-    var t = (0, react_i18next_1.useTranslation)('translation').t;
-    var _h = (0, react_1.useState)(0), count = _h[0], setCount = _h[1];
-    var _j = (0, react_1.useState)(true), isEditorLoading = _j[0], setIsEditorLoading = _j[1];
-    var _k = (0, react_1.useState)(false), isEditorDirty = _k[0], setIsEditorDirty = _k[1];
-    var _l = (0, react_1.useState)(false), isFileValidationAlertDialogOpen = _l[0], setIsFilValidationAlertDialogOpen = _l[1];
-    var editorRef = (0, react_1.useRef)(null);
-    var editorContent = (_b = editorRef.current) === null || _b === void 0 ? void 0 : _b.getContent();
-    var elementsCount = Array.from((_d = (_c = editorRef.current) === null || _c === void 0 ? void 0 : _c.contentDocument.all) !== null && _d !== void 0 ? _d : []).filter(function (element) { return !['BR', 'P'].includes(element.tagName); }).length - DEFAULT_ELEMENT_COUNT;
-    var useDarkMode = window.PdsUtils.tone === 'DARK';
-    (0, react_1.useEffect)(function () {
-        if (defaultText && defaultText.length === 0) {
-            setCount(defaultText.length);
-        }
-    }, [defaultText]);
-    var handleInit = function (evt, editor) {
-        if (isLoadingUsed) {
-            setIsEditorLoading(false);
-        }
-        editorRef.current = editor;
-        if (defaultText && defaultText.length !== 0) {
-            handleEditorValueChange(defaultText, editor);
-        }
-        var isSourceCodeToolActive = toolbar.some(function (group) {
-            var tools = group.split(' ');
-            return tools.includes('code');
-        });
-        if (isSourceCodeToolActive) {
-            var container = editor.getContainer();
-            var sourceCodeButton = container.querySelector('[aria-label="Source code"]');
-            if (sourceCodeButton instanceof HTMLElement) {
-                sourceCodeButton.style.width = 'fit-content';
-                sourceCodeButton.style.display = 'flex';
-                sourceCodeButton.style.alignItems = 'center';
-                var textElement = document.createElement('span');
-                textElement.innerHTML = 'HTML';
-                textElement.style.fontWeight = 'bold';
-                sourceCodeButton.append(textElement);
-            }
-        }
-    };
-    var handleEditorValueChange = function (value, editor) {
-        // NOTE: 기본 요소를 제외한 추가된 HTML 요소의 개수
-        var addedElementsCount = Array.from(editor.contentDocument.all).filter(function (element) { return !['BR', 'P'].includes(element.tagName); }).length - DEFAULT_ELEMENT_COUNT;
-        var wordCount = editor.plugins.wordcount;
-        var charCount = 0;
-        if (wordCount) {
-            charCount = wordCount.body.getCharacterCount();
-            onCountCharacter === null || onCountCharacter === void 0 ? void 0 : onCountCharacter(charCount);
-            setCount(charCount);
-        }
-        var isValid = function () {
-            // NOTE: 추가된 HTML 요소가 존재해도, maxLength를 초과할 경우.
-            if (maxLength && charCount > maxLength) {
-                return false;
-            }
-            // NOTE: 기본 요소를 제외한 추가된 HTML 요소가 존재하는 경우 유효성 검사를 통과합니다.
-            if (addedElementsCount > 0) {
-                return true;
-            }
-            if (required && charCount === 0) {
-                return false;
-            }
-            if (minLength && charCount < minLength) {
-                return false;
-            }
-            return true;
-        };
-        setIsEditorDirty(value ? true : false);
-        onChange === null || onChange === void 0 ? void 0 : onChange(value, isValid());
-    };
-    var handleEditorBlur = function () {
-        var _a, _b;
-        var editorContent = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.getContent();
-        var wordCount = (_b = editorRef.current) === null || _b === void 0 ? void 0 : _b.plugins.wordcount;
-        if (editorContent && onBlur) {
-            onBlur(editorContent, (wordCount === null || wordCount === void 0 ? void 0 : wordCount.body.getCharacterCount()) || 0);
-        }
-    };
-    var handleFileChangeByFilePicker = function (cb) {
-        var input = document.createElement('input');
-        input.setAttribute('type', 'file');
-        input.setAttribute('accept', 'image/*');
-        input.addEventListener('change', function () { return __awaiter(_this, void 0, void 0, function () {
-            var file, result, error_1;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        file = input === null || input === void 0 ? void 0 : input.files[0];
-                        if (!file)
-                            return [2 /*return*/];
-                        if (maxFileSize && file.size > maxFileSize * 1024 * 1024) {
-                            setIsFilValidationAlertDialogOpen(true);
-                            return [2 /*return*/];
-                        }
-                        if (!onImageUpload) return [3 /*break*/, 4];
-                        _a.label = 1;
-                    case 1:
-                        _a.trys.push([1, 3, , 4]);
-                        return [4 /*yield*/, onImageUpload(file)];
-                    case 2:
-                        result = _a.sent();
-                        if (result.location) {
-                            cb(result.location, { title: file.name, alt: 'image' });
-                        }
-                        return [3 /*break*/, 4];
-                    case 3:
-                        error_1 = _a.sent();
-                        return [2 /*return*/, Promise.reject(new Error('Request failed'))];
-                    case 4: return [2 /*return*/];
-                }
-            });
-        }); });
-        input.click();
-    };
-    var handleUploadImageByDragAndDrop = function (blobInfo) { return __awaiter(_this, void 0, void 0, function () {
-        var convertedFile, result, error_2;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    if (maxFileSize && blobInfo.blob().size > maxFileSize * 1024 * 1024) {
-                        setIsFilValidationAlertDialogOpen(true);
-                        return [2 /*return*/, Promise.reject({ remove: true })];
-                    }
-                    if (blobInfo.blobUri().startsWith('blob')) {
-                        convertedFile = new File([blobInfo.blob()], (0, uuid_1.v4)());
-                    }
-                    if (!(convertedFile && onImageUpload)) return [3 /*break*/, 5];
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, 3, , 4]);
-                    return [4 /*yield*/, onImageUpload(convertedFile)];
-                case 2:
-                    result = _a.sent();
-                    if (result.location) {
-                        return [2 /*return*/, Promise.resolve(result.location)];
-                    }
-                    return [2 /*return*/, Promise.reject({ remove: true })];
-                case 3:
-                    error_2 = _a.sent();
-                    return [2 /*return*/, Promise.reject({ remove: true })];
-                case 4: return [3 /*break*/, 6];
-                case 5: return [2 /*return*/, Promise.reject({ remove: true })];
-                case 6: return [2 /*return*/];
-            }
-        });
-    }); };
-    var validationText = (0, react_1.useMemo)(function () {
-        if (required &&
-            !isEditorDirty &&
-            (!editorContent || editorContent.length === 0) &&
-            elementsCount <= 0) {
-            return (0, jsx_runtime_1.jsx)(S_Error, { children: requiredValidationText });
-        }
-        if (elementsCount <= 0 && minLength && count > 0 && count < minLength) {
-            return (0, jsx_runtime_1.jsx)(S_Error, { children: lengthValidationText });
-        }
-        if (maxLength && count > 0 && count > maxLength) {
-            return (0, jsx_runtime_1.jsx)(S_Error, { children: lengthValidationText });
-        }
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
-    }, [required, isEditorDirty, editorContent, elementsCount, count, minLength, maxLength]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(S_Editor, { children: [isEditorLoading && isLoadingUsed && ((0, jsx_runtime_1.jsx)(S_LoadingWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.CircularProgress, {}) })), (0, jsx_runtime_1.jsx)(tinymce_react_1.Editor, { tinymceScriptSrc: tinymceScriptSrc, onInit: handleInit, onEditorChange: handleEditorValueChange, initialValue: defaultText, init: {
-                            images_max_width: '100%',
-                            menubar: false,
-                            promotion: false,
-                            branding: true,
-                            elementpath: false,
-                            plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media template codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap emoticons',
-                            editimage_cors_hosts: ['picsum.photos'],
-                            toolbar: toolbar.join(' | '),
-                            toolbar_sticky: false,
-                            toolbar_sticky_offset: 108,
-                            autosave_ask_before_unload: true,
-                            placeholder: hintText,
-                            autosave_interval: '30s',
-                            autosave_prefix: '{path}{query}-{id}-',
-                            autosave_restore_when_empty: false,
-                            autosave_retention: '2m',
-                            image_advtab: false,
-                            image_title: true,
-                            file_picker_types: 'image',
-                            importcss_append: true,
-                            file_picker_callback: handleFileChangeByFilePicker,
-                            images_upload_handler: handleUploadImageByDragAndDrop,
-                            mobile: {
-                                toolbar: toolbar.join(' | '),
-                                toolbar_mode: 'wrap'
-                            },
-                            selector: undefined,
-                            height: height,
-                            image_caption: true,
-                            noneditable_class: 'mceNonEditable',
-                            toolbar_mode: 'wrap',
-                            skin: useDarkMode ? 'oxide-dark' : 'oxide',
-                            content_css: useDarkMode ? 'dark' : 'default',
-                            indent: false,
-                            content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px } img { height: auto; max-width: 100%; } p, div { overflow: hidden; } pre { white-space: pre-wrap; }',
-                            setup: function (editor) {
-                                editor.on('blur', handleEditorBlur);
-                            }
-                        } }), validationText] }), isFileValidationAlertDialogOpen && ((0, jsx_runtime_1.jsx)(MobileAlertDialog_1.MobileAlertDialog, { contentText: fileSizeValidationText, tBtn1Text: t('str_confirm'), onClickTBtn1: function () { return setIsFilValidationAlertDialogOpen(false); } }))] }));
-}
-var S_Editor = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  min-height: 500px;\n  position: relative;\n\n  .tox-statusbar__wordcount {\n    visibility: hidden;\n  }\n"], ["\n  min-height: 500px;\n  position: relative;\n\n  .tox-statusbar__wordcount {\n    visibility: hidden;\n  }\n"])));
-var S_LoadingWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  left: 50%;\n  position: absolute;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 1000;\n"], ["\n  left: 50%;\n  position: absolute;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 1000;\n"])));
-var S_Error = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  margin-top: ", ";\n  text-align: left;\n"], ["\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  margin-top: ", ";\n  text-align: left;\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.ui_cpnt_textfield_text_error;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.desktopFontSize.caption2;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.fontWeight.normal;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.desktopLineHeight.caption2;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing.spacingA;
-});
-exports.default = RichTextEditor;
-var templateObject_1, templateObject_2, templateObject_3;

package/dist/src/mobile/components/RichTextEditor/index.d.ts

@@ -1,2 +0,0 @@
-export { default as RichTextEditor } from './RichTextEditor';
-export type { RichTextEditorProps, ImageUploadHandler, ImageUploadResult } from './RichTextEditor';

package/dist/src/mobile/components/RichTextEditor/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RichTextEditor = void 0;
-var RichTextEditor_1 = require("./RichTextEditor");
-Object.defineProperty(exports, "RichTextEditor", { enumerable: true, get: function () { return __importDefault(RichTextEditor_1).default; } });

package/dist/src/mobile/components/Snackbar/Snackbar.d.ts

@@ -1,17 +0,0 @@
-import React from 'react';
-export type SnackbarPosition = 'top-left' | 'top-center' | 'top-right' | 'right-top' | 'right-center' | 'right-bottom' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'left-top' | 'left-center' | 'left-bottom' | 'center';
-export interface BaseSnackbarProps {
-    text: string;
-    actionBtnText?: string;
-    position?: SnackbarPosition;
-    closeBtnMode?: 'none' | 'use';
-    duration?: number;
-    anchorRef?: React.RefObject<HTMLElement>;
-    onActionBtnClick?: () => void;
-}
-export interface SnackbarProps extends BaseSnackbarProps {
-    id?: string | number;
-    onClose?: () => void;
-}
-declare const Snackbar: React.FC<SnackbarProps>;
-export default Snackbar;

package/dist/src/mobile/components/Snackbar/Snackbar.js

@@ -1,221 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var react_dom_1 = require("react-dom");
-var panels_1 = require("../../../desktop/panels");
-var components_1 = require("../../../hybrid/components");
-var styled_components_1 = __importDefault(require("styled-components"));
-var IconButton_1 = require("../IconButton");
-var TextButton_1 = require("../TextButton");
-var TextLabel_1 = require("../TextLabel");
-var Snackbar = function (_a) {
-    var id = _a.id, text = _a.text, _b = _a.actionBtnText, actionBtnText = _b === void 0 ? '' : _b, _c = _a.position, position = _c === void 0 ? 'bottom-center' : _c, _d = _a.closeBtnMode, closeBtnMode = _d === void 0 ? 'none' : _d, _e = _a.duration, duration = _e === void 0 ? 2000 : _e, anchorRef = _a.anchorRef, onActionBtnClick = _a.onActionBtnClick, onClose = _a.onClose;
-    var _f = (0, react_1.useState)(false), isVisible = _f[0], setIsVisible = _f[1];
-    var _g = (0, react_1.useState)({}), containerStyle = _g[0], setContainerStyle = _g[1];
-    var timerRef = (0, react_1.useRef)();
-    /*
-     * 마운트 시 애니메이션
-     */
-    (0, react_1.useEffect)(function () {
-        var showTimer = setTimeout(function () {
-            setIsVisible(true);
-        }, 10);
-        return function () { return clearTimeout(showTimer); };
-    }, [id]);
-    /*
-     * duration 타이머
-     */
-    (0, react_1.useEffect)(function () {
-        if (duration > 0) {
-            timerRef.current = setTimeout(function () {
-                handleClose();
-            }, duration);
-        }
-        return function () {
-            if (timerRef.current) {
-                clearTimeout(timerRef.current);
-            }
-        };
-    }, [id, duration]);
-    /*
-     * 스크롤, 리사이즈시 포지션 업데이트
-     */
-    (0, react_1.useEffect)(function () {
-        var updatePosition = function () {
-            if (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) {
-                var rect = anchorRef.current.getBoundingClientRect();
-                var style = getAnchorBasedStyle(position, rect);
-                setContainerStyle(style);
-            }
-            else {
-                var style = getViewportBasedStyle(position);
-                setContainerStyle(style);
-            }
-        };
-        // 초기 렌더링 시 약간의 딜레이를 주어 DOM이 완전히 준비되도록 함
-        var initialTimer = setTimeout(updatePosition, 0);
-        if (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) {
-            window.addEventListener('resize', updatePosition);
-            // ResizeObserver로 anchorRef 요소의 크기 변화 감지
-            var resizeObserver_1 = new ResizeObserver(updatePosition);
-            resizeObserver_1.observe(anchorRef.current);
-            return function () {
-                clearTimeout(initialTimer);
-                window.removeEventListener('resize', updatePosition);
-                resizeObserver_1.disconnect();
-            };
-        }
-        updatePosition();
-        return function () {
-            clearTimeout(initialTimer);
-        };
-    }, [position, anchorRef]);
-    var handleClose = function () {
-        setIsVisible(false);
-        if (onClose) {
-            setTimeout(function () {
-                onClose();
-            }, 300);
-        }
-    };
-    var getViewportBasedStyle = function (position) {
-        var base = {
-            position: 'fixed',
-            zIndex: 9999
-        };
-        var offset = 24;
-        switch (position) {
-            case 'top-left':
-                return __assign(__assign({}, base), { top: offset, left: offset });
-            case 'top-center':
-                return __assign(__assign({}, base), { top: offset, left: '50%', transform: 'translateX(-50%)' });
-            case 'top-right':
-                return __assign(__assign({}, base), { top: offset, right: offset });
-            case 'right-top':
-                return __assign(__assign({}, base), { top: offset, right: offset });
-            case 'right-center':
-                return __assign(__assign({}, base), { top: '50%', right: offset, transform: 'translateY(-50%)' });
-            case 'right-bottom':
-                return __assign(__assign({}, base), { bottom: offset, right: offset });
-            case 'bottom-right':
-                return __assign(__assign({}, base), { bottom: offset, right: offset });
-            case 'bottom-center':
-                return __assign(__assign({}, base), { bottom: offset, left: '50%', transform: 'translateX(-50%)' });
-            case 'bottom-left':
-                return __assign(__assign({}, base), { bottom: offset, left: offset });
-            case 'left-bottom':
-                return __assign(__assign({}, base), { bottom: offset, left: offset });
-            case 'left-center':
-                return __assign(__assign({}, base), { top: '50%', left: offset, transform: 'translateY(-50%)' });
-            case 'left-top':
-                return __assign(__assign({}, base), { top: offset, left: offset });
-            case 'center':
-                return __assign(__assign({}, base), { top: '50%', left: '50%', transform: 'translate(-50%, -50%)' });
-            default:
-                return __assign(__assign({}, base), { bottom: offset, left: '50%', transform: 'translateX(-50%)' });
-        }
-    };
-    var getAnchorBasedStyle = function (position, rect) {
-        var base = {
-            position: 'fixed',
-            zIndex: 9999
-        };
-        var offset = 24;
-        switch (position) {
-            case 'top-left':
-                return __assign(__assign({}, base), { bottom: window.innerHeight - rect.top + offset, left: rect.left });
-            case 'top-center':
-                return __assign(__assign({}, base), { bottom: window.innerHeight - rect.top + offset, left: rect.left + rect.width / 2, transform: 'translateX(-50%)' });
-            case 'top-right':
-                return __assign(__assign({}, base), { bottom: window.innerHeight - rect.top + offset, right: window.innerWidth - rect.right });
-            case 'right-top':
-                return __assign(__assign({}, base), { top: rect.top, left: rect.right + offset });
-            case 'right-center':
-                return __assign(__assign({}, base), { top: rect.top + rect.height / 2, left: rect.right + offset, transform: 'translateY(-50%)' });
-            case 'right-bottom':
-                return __assign(__assign({}, base), { bottom: window.innerHeight - rect.bottom, left: rect.right + offset });
-            case 'bottom-right':
-                return __assign(__assign({}, base), { top: rect.bottom + offset, right: window.innerWidth - rect.right });
-            case 'bottom-center':
-                return __assign(__assign({}, base), { top: rect.bottom + offset, left: rect.left + rect.width / 2, transform: 'translateX(-50%)' });
-            case 'bottom-left':
-                return __assign(__assign({}, base), { top: rect.bottom + offset, left: rect.left });
-            case 'left-bottom':
-                return __assign(__assign({}, base), { bottom: window.innerHeight - rect.bottom, right: window.innerWidth - rect.left + offset });
-            case 'left-center':
-                return __assign(__assign({}, base), { top: rect.top + rect.height / 2, right: window.innerWidth - rect.left + offset, transform: 'translateY(-50%)' });
-            case 'left-top':
-                return __assign(__assign({}, base), { top: rect.top, right: window.innerWidth - rect.left + offset });
-            case 'center':
-                return __assign(__assign({}, base), { top: rect.top + rect.height / 2, left: rect.left + rect.width / 2, transform: 'translate(-50%, -50%)' });
-            default:
-                return __assign(__assign({}, base), { top: rect.bottom + offset, left: rect.left + rect.width / 2, transform: 'translateX(-50%)' });
-        }
-    };
-    var getMaxWidthStyles = function () {
-        // anchor가 있는 경우
-        if (anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) {
-            var rect = anchorRef.current.getBoundingClientRect();
-            if (position.includes('top-') || position.includes('bottom-') || position === 'center') {
-                return {
-                    maxWidth: "".concat(rect.width - 48, "px"),
-                    width: 'max-content'
-                };
-            }
-        }
-        // anchor가 없으면 기본값
-        return {
-            maxWidth: '640px',
-            width: 'max-content'
-        };
-    };
-    var snackbarContent = ((0, jsx_runtime_1.jsx)(S_Container, __assign({ style: __assign(__assign({}, containerStyle), getMaxWidthStyles()) }, { children: (0, jsx_runtime_1.jsx)(S_SnackbarWrapper, __assign({ position: position, isVisible: isVisible }, { children: (0, jsx_runtime_1.jsxs)(panels_1.SectionSheet, __assign({ shapeType: "round", radius: 8, paddingTop: "none", paddingRight: "none", paddingBottom: "none", paddingLeft: "spacing_d", width: "100%", height: "auto", overrideBackgroundColorKey: "ui_cpnt_snackbar_base", overrideCSS: {
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'space-between'
-                } }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: { flex: 1 } }, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_c" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", colorOverride: "ui_cpnt_snackbar_text", wordBreak: "break_all", ellipsisMode: "use", lineLimit: 2 }), (0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_c" })] })), (0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_d", spacingType: "width" }), (0, jsx_runtime_1.jsxs)(S_Buttons, { children: [onActionBtnClick && actionBtnText && ((0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { text: actionBtnText, colorTheme: "grey3", size: "xsmall", onClick: onActionBtnClick })), closeBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_xmark", iconColorKey: "ui_cpnt_snackbar_text", iconSize: 16, baseSize: "medium", baseColorKey: "ui_cpnt_button_fill_base_transparent", onClick: handleClose })), closeBtnMode === 'none' && actionBtnText && ((0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b", spacingType: "width" }))] })] })) })) })));
-    return (0, react_dom_1.createPortal)(snackbarContent, document.body);
-};
-var S_Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  pointer-events: none;\n  width: max-content;\n  & > * {\n    pointer-events: auto;\n  }\n"], ["\n  pointer-events: none;\n  width: max-content;\n  & > * {\n    pointer-events: auto;\n  }\n"])));
-var getInitialTransform = function (position) {
-    if (position.startsWith('top-'))
-        return 'translateY(-10px)';
-    if (position.startsWith('bottom-'))
-        return 'translateY(10px)';
-    if (position.startsWith('left-'))
-        return 'translateX(-10px)';
-    if (position.startsWith('right-'))
-        return 'translateX(10px)';
-    if (position === 'center')
-        return 'scale(0.95)';
-    return 'translateY(0)';
-};
-var S_SnackbarWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  opacity: ", ";\n  transform: ", ";\n  transition: opacity 0.3s ease, transform 0.3s ease;\n  width: 100%;\n"], ["\n  display: flex;\n  justify-content: center;\n  opacity: ", ";\n  transform: ", ";\n  transition: opacity 0.3s ease, transform 0.3s ease;\n  width: 100%;\n"])), function (_a) {
-    var isVisible = _a.isVisible;
-    return (isVisible ? 1 : 0);
-}, function (_a) {
-    var isVisible = _a.isVisible, position = _a.position;
-    return isVisible ? 'translate(0, 0) scale(1)' : getInitialTransform(position);
-});
-var S_Buttons = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n"], ["\n  align-items: center;\n  display: flex;\n"])));
-exports.default = Snackbar;
-var templateObject_1, templateObject_2, templateObject_3;

package/dist/src/mobile/components/Snackbar/index.d.ts

@@ -1 +0,0 @@
-export { default as Snackbar } from './Snackbar';

package/dist/src/mobile/components/Snackbar/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Snackbar = void 0;
-var Snackbar_1 = require("./Snackbar");
-Object.defineProperty(exports, "Snackbar", { enumerable: true, get: function () { return __importDefault(Snackbar_1).default; } });

package/dist/src/mobile/components/Snackbar/provider.d.ts

@@ -1,11 +0,0 @@
-import { ReactNode } from 'react';
-import { BaseSnackbarProps } from './Snackbar';
-interface SnackbarContextType {
-    showSnackbar: (props: BaseSnackbarProps) => void;
-    hideSnackbar: (id: string) => void;
-}
-export declare const SnackbarProvider: ({ children }: {
-    children: ReactNode;
-}) => JSX.Element;
-export declare const useSnackbar: () => SnackbarContextType;
-export {};

package/dist/src/mobile/components/Snackbar/provider.js

@@ -1,43 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSnackbar = exports.SnackbarProvider = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var Snackbar_1 = __importDefault(require("./Snackbar"));
-var SnackbarContext = (0, react_1.createContext)(null);
-var SnackbarProvider = function (_a) {
-    var children = _a.children;
-    var _b = (0, react_1.useState)(null), snackbar = _b[0], setSnackbar = _b[1];
-    var value = (0, react_1.useMemo)(function () { return ({
-        showSnackbar: function (props) {
-            var id = crypto.randomUUID();
-            setSnackbar(__assign(__assign({}, props), { id: id }));
-        },
-        hideSnackbar: function () {
-            setSnackbar(null);
-        }
-    }); }, []);
-    return ((0, jsx_runtime_1.jsxs)(SnackbarContext.Provider, __assign({ value: value }, { children: [children, snackbar && ((0, jsx_runtime_1.jsx)(Snackbar_1.default, __assign({}, snackbar, { onClose: function () { return value.hideSnackbar(); } }), snackbar.id))] })));
-};
-exports.SnackbarProvider = SnackbarProvider;
-var useSnackbar = function () {
-    var context = (0, react_1.useContext)(SnackbarContext);
-    if (!context)
-        throw new Error('useSnackbar must be used within a SnackbarProvider');
-    return context;
-};
-exports.useSnackbar = useSnackbar;

package/dist/src/sub/DynamicLayout/CompositionRenderer/CompositionRenderer.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import type { IComposition } from '../../DynamicLayout/types';
-declare function CompositionRenderer({ compositions }: {
-    compositions: IComposition[];
-}): JSX.Element;
-export default CompositionRenderer;