pds-dev-kit-web-test 0.3.5 → 0.3.7

package/release-note.md

@@ -1,6 +1,6 @@
 # pds-dev-kit-web-test Release Notes
-## [v0.3.5]
-## 기준 pds-dev-kit-web 버전 @2.2.23
-### Layout
-    * WTX_1 추가
-    * WTY_1 추가
+## [v0.3.7]
+## 기준 pds-dev-kit-web 버전 @2.2.26
+### sub
+    * DynamicLayout
+        * 선택된 CB에 투명도 0.95추가

package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTY.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-import type { UiColors } from '../../../../../../common';
-export type WTYProps = {
-    content1?: JSX.Element;
-    content2?: JSX.Element;
-    layoutType?: 'WTY_1';
-    containerColor?: string;
-    areaColor?: string;
-    isLoadingContainer1?: boolean;
-    isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: UiColors;
-    overrideContainer2ColorKey?: UiColors;
-};
-export type StyleProps = {
-    $contentsArea2Width?: number;
-};
-declare const WTY: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: WTYProps) => JSX.Element;
-export default WTY;

package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTY.js

@@ -1,109 +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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var styled_components_1 = __importStar(require("styled-components"));
-var components_1 = require("../../../../../../common/components");
-var WTY = function (_a) {
-    var _b, _c;
-    var content1 = _a.content1, content2 = _a.content2, _d = _a.layoutType, layoutType = _d === void 0 ? 'WTY_1' : _d, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
-    var contentsArea2Ref = (0, react_1.useRef)(null);
-    var _e = (0, react_1.useState)((_c = (_b = contentsArea2Ref.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) !== null && _c !== void 0 ? _c : 720), contentsArea2Width = _e[0], setContentsArea2Width = _e[1];
-    var handleResize = function () {
-        if (contentsArea2Ref === null || contentsArea2Ref.current === null) {
-            return;
-        }
-        setContentsArea2Width(contentsArea2Ref.current.offsetWidth);
-    };
-    /**
-      @when : 브라우저 화면 사이즈가 변경될 때
-      @expected : contentsArea2의 너비를 contentsArea2Width에 저장합니다.
-      @clear : 이벤트 등록을 해제합니다.
-    */
-    (0, react_1.useEffect)(function () {
-        window.addEventListener('resize', handleResize);
-        return function () {
-            window.removeEventListener('resize', handleResize);
-        };
-    }, []);
-    return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey, "$contentsArea2Width": contentsArea2Width }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey, "$contentsArea2Width": contentsArea2Width }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType, areaColor: areaColor, ref: contentsArea2Ref }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WTY", layoutType: layoutType }, { children: content2 })) }))) }))] }));
-};
-var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
-    var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
-    return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
-});
-var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
-    var theme = _a.theme, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
-    return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
-});
-var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  height: 100%;\n"], ["\n  display: flex;\n  height: 100%;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: flex-start;\n  background-color: ", ";\n  display: flex;\n  height: 100%;\n\n  /* justify-content: flex-end; */\n  /* margin: 0; */\n  /* overflow-x: hidden; */\n  /* overflow-y: auto; */\n  width: 480px;\n  ", ";\n\n  ", "\n"], ["\n  align-items: flex-start;\n  background-color: ", ";\n  display: flex;\n  height: 100%;\n\n  /* justify-content: flex-end; */\n  /* margin: 0; */\n  /* overflow-x: hidden; */\n  /* overflow-y: auto; */\n  width: 480px;\n  ", ";\n\n  ", "\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.ui_contentscontainer01_background;
-}, function (_a) {
-    var containerColor = _a.containerColor;
-    return "background-color: ".concat(containerColor);
-}, overrideStyleContainer1);
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  flex: 1;\n  /* width: ", "; */\n  height: 100%;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  flex: 1;\n  /* width: ", "; */\n  height: 100%;\n  ", ";\n\n  ", "\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.ui_contentscontainer02_background;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.ui_container_divider;
-}, function (_a) {
-    var $contentsArea2Width = _a.$contentsArea2Width;
-    return "calc(50% + (".concat($contentsArea2Width, "px - 480px) / 2)");
-}, function (_a) {
-    var containerColor = _a.containerColor;
-    return "background-color: ".concat(containerColor);
-}, overrideStyleContainer2);
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  box-sizing: border-box;\n  height: 100%;\n  /* padding-bottom: 88px; */\n  max-width: 480px;\n  padding-left: 24px;\n  padding-right: 24px;\n  width: 480px;\n\n  ", ";\n"], ["\n  box-sizing: border-box;\n  height: 100%;\n  /* padding-bottom: 88px; */\n  max-width: 480px;\n  padding-left: 24px;\n  padding-right: 24px;\n  width: 480px;\n\n  ", ";\n"])), function (_a) {
-    var areaColor = _a.areaColor;
-    return "background-color: ".concat(areaColor);
-});
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  /* max-width: 680px;/ */\n  min-width: 480px;\n  /* width: 60%; */\n  ", ";\n"], ["\n  height: 100%;\n  /* max-width: 680px;/ */\n  min-width: 480px;\n  /* width: 60%; */\n  ", ";\n"])), function (_a) {
-    var areaColor = _a.areaColor;
-    return "background-color: ".concat(areaColor);
-});
-var S_Content1 = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
-var S_Content2 = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
-exports.default = WTY;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;