pds-dev-kit-web 1.5.11 → 1.6.1

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.
Files changed (199) hide show
  1. package/README.md +2 -2
  2. package/dist/index.d.ts +2 -2
  3. package/dist/index.js +4 -3
  4. package/dist/src/common/components/CircularProgress/CircularProgress.d.ts +8 -0
  5. package/dist/src/common/components/CircularProgress/CircularProgress.js +74 -0
  6. package/dist/src/common/components/CircularProgress/index.d.ts +1 -0
  7. package/dist/src/common/components/CircularProgress/index.js +8 -0
  8. package/dist/src/common/components/ThreeBarProgress/ThreeBarProgress.d.ts +7 -0
  9. package/dist/src/common/components/ThreeBarProgress/ThreeBarProgress.js +26 -0
  10. package/dist/src/common/components/ThreeBarProgress/index.d.ts +1 -0
  11. package/dist/src/common/components/ThreeBarProgress/index.js +8 -0
  12. package/dist/src/common/components/index.d.ts +3 -1
  13. package/dist/src/common/components/index.js +5 -1
  14. package/dist/src/common/styles/ToneTest/ToneTest.js +12 -0
  15. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +6 -1
  16. package/dist/src/common/styles/colorSet/PaletteColor_light.json +6 -1
  17. package/dist/src/common/styles/colorSet/SemanticColor.json +4 -4
  18. package/dist/src/common/styles/colorSet/UIColor.json +15 -1
  19. package/dist/src/common/styles/colorSet/index.d.ts +96 -72
  20. package/dist/src/common/styles/colorSet/index.js +2 -2
  21. package/dist/src/common/styles/colorSet/ui-type.d.ts +14 -0
  22. package/dist/src/common/styles/index.d.ts +1 -0
  23. package/dist/src/common/styles/index.js +3 -1
  24. package/dist/src/common/styles/loading/index.d.ts +1 -0
  25. package/dist/src/common/styles/loading/index.js +5 -0
  26. package/dist/src/common/styles/loading/skeletonLoadingStyle.d.ts +1 -0
  27. package/dist/src/common/styles/loading/skeletonLoadingStyle.js +28 -0
  28. package/dist/src/desktop/components/DynamicDesktopNavBar/DynamicDesktopNavBar.d.ts +2 -1
  29. package/dist/src/desktop/components/DynamicDesktopNavBar/DynamicDesktopNavBar.js +24 -9
  30. package/dist/src/desktop/components/MainButton/MainButton.d.ts +3 -1
  31. package/dist/src/desktop/components/MainButton/MainButton.js +43 -11
  32. package/dist/src/desktop/components/UploadMainButton/UploadMainButton.d.ts +3 -1
  33. package/dist/src/desktop/components/UploadMainButton/UploadMainButton.js +71 -31
  34. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  35. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/ContentsContainer.js +24 -24
  36. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFA.d.ts +2 -1
  37. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFA.js +8 -6
  38. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFB.d.ts +2 -1
  39. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFB.js +4 -3
  40. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFC.d.ts +2 -1
  41. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFC.js +4 -4
  42. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFD.d.ts +2 -1
  43. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFD.js +4 -4
  44. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFE.d.ts +2 -1
  45. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFE.js +4 -3
  46. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFF.d.ts +2 -1
  47. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFF.js +4 -4
  48. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFG.d.ts +3 -1
  49. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFG.js +6 -7
  50. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFH.d.ts +2 -1
  51. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFH.js +4 -4
  52. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFI.d.ts +3 -1
  53. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFI.js +6 -7
  54. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFJ.d.ts +2 -1
  55. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFJ.js +4 -4
  56. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFK.d.ts +3 -1
  57. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFK.js +6 -7
  58. package/dist/src/desktop/layout/LayoutWF/ContainersBox/ContainersBox.d.ts +3 -1
  59. package/dist/src/desktop/layout/LayoutWF/ContainersBox/ContainersBox.js +2 -2
  60. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  61. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/ContentsContainer.js +18 -18
  62. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSA.d.ts +2 -1
  63. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSA.js +4 -4
  64. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSB.d.ts +2 -1
  65. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSB.js +4 -4
  66. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSC.d.ts +2 -1
  67. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSC.js +4 -4
  68. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSD.d.ts +2 -1
  69. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSD.js +4 -4
  70. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSE.d.ts +2 -1
  71. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSE.js +5 -5
  72. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSF.d.ts +3 -1
  73. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSF.js +6 -7
  74. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSG.d.ts +3 -1
  75. package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSG.js +6 -7
  76. package/dist/src/desktop/layout/LayoutWS/ContainersBox/ContainersBox.d.ts +3 -1
  77. package/dist/src/desktop/layout/LayoutWS/ContainersBox/ContainersBox.js +2 -2
  78. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  79. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.js +43 -43
  80. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTA.d.ts +2 -1
  81. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTA.js +4 -4
  82. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTB.d.ts +2 -1
  83. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTB.js +4 -4
  84. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTC.d.ts +2 -1
  85. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTC.js +4 -4
  86. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTD.d.ts +3 -1
  87. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTD.js +6 -7
  88. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTE.d.ts +2 -1
  89. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTE.js +4 -4
  90. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTF.d.ts +3 -1
  91. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTF.js +6 -7
  92. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTG.d.ts +2 -1
  93. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTG.js +4 -4
  94. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTH.d.ts +2 -1
  95. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTH.js +4 -4
  96. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTI.d.ts +2 -1
  97. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTI.js +4 -4
  98. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTJ.d.ts +3 -1
  99. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTJ.js +6 -7
  100. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTK.d.ts +2 -1
  101. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTK.js +4 -4
  102. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTL.d.ts +2 -1
  103. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTL.js +4 -4
  104. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTM.d.ts +2 -1
  105. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTM.js +4 -4
  106. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTN.d.ts +2 -1
  107. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTN.js +4 -4
  108. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTO.d.ts +2 -1
  109. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTO.js +4 -4
  110. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTP.d.ts +2 -1
  111. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTP.js +4 -4
  112. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTQ.d.ts +3 -1
  113. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTQ.js +6 -7
  114. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.d.ts +2 -1
  115. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.js +4 -3
  116. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTT.d.ts +2 -1
  117. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTT.js +4 -3
  118. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTU.d.ts +3 -1
  119. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTU.js +6 -7
  120. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.d.ts +3 -1
  121. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.js +2 -2
  122. package/dist/src/desktop/panels/ContentSheet/ContentSheet.d.ts +4 -1
  123. package/dist/src/desktop/panels/ContentSheet/ContentSheet.js +11 -3
  124. package/dist/src/hybrid/components/ImageView/ImageView.d.ts +2 -1
  125. package/dist/src/hybrid/components/ImageView/ImageView.js +36 -4
  126. package/dist/src/hybrid/components/LinearProgress/LinearProgress.d.ts +6 -0
  127. package/dist/src/hybrid/components/LinearProgress/LinearProgress.js +29 -0
  128. package/dist/src/hybrid/components/LinearProgress/index.d.ts +1 -0
  129. package/dist/src/hybrid/components/LinearProgress/index.js +8 -0
  130. package/dist/src/hybrid/components/index.d.ts +2 -1
  131. package/dist/src/hybrid/components/index.js +3 -1
  132. package/dist/src/hybrid/index.d.ts +2 -2
  133. package/dist/src/hybrid/index.js +2 -1
  134. package/dist/src/mobile/components/MainButton/MainButton.d.ts +3 -1
  135. package/dist/src/mobile/components/MainButton/MainButton.js +42 -11
  136. package/dist/src/mobile/components/UploadMainButton/UploadMainButton.d.ts +3 -1
  137. package/dist/src/mobile/components/UploadMainButton/UploadMainButton.js +57 -21
  138. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  139. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/ContentsContainer.js +8 -8
  140. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFA.d.ts +2 -1
  141. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFA.js +4 -4
  142. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFB.d.ts +3 -1
  143. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFB.js +6 -7
  144. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFC.d.ts +2 -1
  145. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFC.js +4 -4
  146. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFD.d.ts +2 -1
  147. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFD.js +4 -4
  148. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFE.d.ts +3 -1
  149. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFE.js +6 -7
  150. package/dist/src/mobile/layout/LayoutMF/ContainersBox/ContainersBox.d.ts +3 -1
  151. package/dist/src/mobile/layout/LayoutMF/ContainersBox/ContainersBox.js +2 -2
  152. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/ContentsContainer.d.ts +2 -1
  153. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/ContentsContainer.js +3 -3
  154. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMA.d.ts +2 -1
  155. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMA.js +4 -4
  156. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMB.d.ts +2 -1
  157. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMB.js +4 -4
  158. package/dist/src/mobile/layout/LayoutMM/ContainersBox/ContainersBox.d.ts +2 -1
  159. package/dist/src/mobile/layout/LayoutMM/ContainersBox/ContainersBox.js +2 -2
  160. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  161. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/ContentsContainer.js +9 -9
  162. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPA.d.ts +2 -1
  163. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPA.js +4 -4
  164. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPB.d.ts +2 -1
  165. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPB.js +4 -4
  166. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPC.d.ts +3 -1
  167. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPC.js +6 -7
  168. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPD.d.ts +2 -1
  169. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPD.js +4 -4
  170. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPE.d.ts +2 -1
  171. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPE.js +4 -4
  172. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPF.d.ts +3 -1
  173. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPF.js +6 -7
  174. package/dist/src/mobile/layout/LayoutMP/ContainersBox/ContainersBox.d.ts +3 -1
  175. package/dist/src/mobile/layout/LayoutMP/ContainersBox/ContainersBox.js +2 -2
  176. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/ContentsContainer.d.ts +3 -1
  177. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/ContentsContainer.js +11 -11
  178. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSA.d.ts +2 -1
  179. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSA.js +4 -4
  180. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSB.d.ts +2 -1
  181. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSB.js +4 -4
  182. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSC.d.ts +3 -1
  183. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSC.js +6 -7
  184. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSD.d.ts +2 -1
  185. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSD.js +4 -4
  186. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSE.d.ts +2 -1
  187. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSE.js +4 -4
  188. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSF.d.ts +3 -1
  189. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSF.js +6 -7
  190. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSG.d.ts +2 -1
  191. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSG.js +4 -4
  192. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSH.d.ts +2 -1
  193. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSH.js +4 -4
  194. package/dist/src/mobile/layout/LayoutMS/ContainersBox/ContainersBox.d.ts +3 -1
  195. package/dist/src/mobile/layout/LayoutMS/ContainersBox/ContainersBox.js +2 -2
  196. package/dist/src/mobile/panels/ContentSheet/ContentSheet.d.ts +4 -1
  197. package/dist/src/mobile/panels/ContentSheet/ContentSheet.js +11 -3
  198. package/package.json +1 -1
  199. package/release-note.md +3 -3
@@ -9,15 +9,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MPC = function (_a) {
13
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
14
15
  return (react_1.default.createElement(S_Box, null,
15
- react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor },
16
- react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
- react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1))),
18
- react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor },
19
- react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
20
- react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2)))));
16
+ react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
+ react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
18
+ react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
19
+ react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
21
20
  };
22
21
  var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
23
22
  var S_ContentsContainer1 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"])), function (_a) {
@@ -3,6 +3,7 @@ export declare type MPDProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MPD: ({ content1, containerColor, areaColor }: MPDProps) => JSX.Element;
8
+ declare const MPD: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MPDProps) => JSX.Element;
8
9
  export default MPD;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MPD = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"], ["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -3,6 +3,7 @@ export declare type MPEProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MPE: ({ content1, containerColor, areaColor }: MPEProps) => JSX.Element;
8
+ declare const MPE: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MPEProps) => JSX.Element;
8
9
  export default MPE;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MPE = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"], ["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -5,6 +5,8 @@ export declare type MPFProps = {
5
5
  layoutType: 'MPF_1' | 'MPF_2';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
+ isLoadingContainer1?: boolean;
9
+ isLoadingContainer2?: boolean;
8
10
  };
9
- declare const MPF: ({ content1, content2, layoutType, containerColor, areaColor }: MPFProps) => JSX.Element;
11
+ declare const MPF: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: MPFProps) => JSX.Element;
10
12
  export default MPF;
@@ -9,15 +9,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MPF = function (_a) {
13
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
14
15
  return (react_1.default.createElement(S_Box, null,
15
- react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor },
16
- react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
- react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1))),
18
- react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor },
19
- react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
20
- react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2)))));
16
+ react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
+ react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
18
+ react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
19
+ react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
21
20
  };
22
21
  var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
23
22
  var S_ContentsContainer1 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"])), function (_a) {
@@ -7,6 +7,8 @@ export declare type ContainersBoxProps = {
7
7
  children?: React.ReactNode;
8
8
  containerColor?: string;
9
9
  areaColor?: string;
10
+ isLoadingContainer1?: boolean;
11
+ isLoadingContainer2?: boolean;
10
12
  };
11
- declare const ContainersBox: ({ layoutType, tabContent, content1, content2, containerColor, areaColor }: ContainersBoxProps) => JSX.Element;
13
+ declare const ContainersBox: ({ layoutType, tabContent, content1, content2, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: ContainersBoxProps) => JSX.Element;
12
14
  export default ContainersBox;
@@ -11,7 +11,7 @@ var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
12
  var Containers_1 = require("../Containers");
13
13
  var ContainersBox = function (_a) {
14
- var layoutType = _a.layoutType, tabContent = _a.tabContent, content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var layoutType = _a.layoutType, tabContent = _a.tabContent, content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
15
15
  return (react_1.default.createElement(S_ContainersBox, null,
16
16
  {
17
17
  MPA_1: react_1.default.createElement(react_1.default.Fragment, null),
@@ -24,7 +24,7 @@ var ContainersBox = function (_a) {
24
24
  MPF_2: react_1.default.createElement(react_1.default.Fragment, null)
25
25
  }[layoutType],
26
26
  react_1.default.createElement(S_BottomWrapper, { layoutType: layoutType },
27
- react_1.default.createElement(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor }))));
27
+ react_1.default.createElement(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 }))));
28
28
  };
29
29
  var S_ContainersBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n height: 100%;\n flex-direction: column;\n"], ["\n display: flex;\n height: 100%;\n flex-direction: column;\n"])));
30
30
  var S_BottomWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex: 1;\n overflow: hidden;\n"], ["\n flex: 1;\n overflow: hidden;\n"])));
@@ -5,6 +5,8 @@ export declare type ContentsContainerProps = {
5
5
  layoutType: 'MSA_1' | 'MSB_1' | 'MSC_1' | 'MSC_2' | 'MSD_1' | 'MSE_1' | 'MSF_1' | 'MSF_2' | 'MSG_1' | 'MSH_1';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
+ isLoadingContainer1?: boolean;
9
+ isLoadingContainer2?: boolean;
8
10
  };
9
- declare const ContentsContainer: ({ content1, content2, layoutType, containerColor, areaColor }: ContentsContainerProps) => JSX.Element;
11
+ declare const ContentsContainer: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: ContentsContainerProps) => JSX.Element;
10
12
  export default ContentsContainer;
@@ -6,18 +6,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  var react_1 = __importDefault(require("react"));
7
7
  var variation_1 = require("./variation");
8
8
  var ContentsContainer = function (_a) {
9
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor;
9
+ var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
10
10
  return (react_1.default.createElement(react_1.default.Fragment, null, {
11
- MSA_1: react_1.default.createElement(variation_1.MSA, { content1: content1, containerColor: containerColor, areaColor: areaColor }),
12
- MSB_1: react_1.default.createElement(variation_1.MSB, { content1: content1, containerColor: containerColor, areaColor: areaColor }),
13
- MSC_1: (react_1.default.createElement(variation_1.MSC, { layoutType: "MSC_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor })),
14
- MSC_2: (react_1.default.createElement(variation_1.MSC, { layoutType: "MSC_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor })),
15
- MSD_1: react_1.default.createElement(variation_1.MSD, { content1: content1, containerColor: containerColor, areaColor: areaColor }),
16
- MSE_1: react_1.default.createElement(variation_1.MSE, { content1: content1, containerColor: containerColor, areaColor: areaColor }),
17
- MSF_1: (react_1.default.createElement(variation_1.MSF, { layoutType: "MSF_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor })),
18
- MSF_2: (react_1.default.createElement(variation_1.MSF, { layoutType: "MSF_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor })),
19
- MSG_1: react_1.default.createElement(variation_1.MSG, { content1: content1, containerColor: containerColor, areaColor: areaColor }),
20
- MSH_1: react_1.default.createElement(variation_1.MSH, { content1: content1, containerColor: containerColor, areaColor: areaColor })
11
+ MSA_1: (react_1.default.createElement(variation_1.MSA, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
12
+ MSB_1: (react_1.default.createElement(variation_1.MSB, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
13
+ MSC_1: (react_1.default.createElement(variation_1.MSC, { layoutType: "MSC_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 })),
14
+ MSC_2: (react_1.default.createElement(variation_1.MSC, { layoutType: "MSC_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 })),
15
+ MSD_1: (react_1.default.createElement(variation_1.MSD, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
16
+ MSE_1: (react_1.default.createElement(variation_1.MSE, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
17
+ MSF_1: (react_1.default.createElement(variation_1.MSF, { layoutType: "MSF_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 })),
18
+ MSF_2: (react_1.default.createElement(variation_1.MSF, { layoutType: "MSF_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 })),
19
+ MSG_1: (react_1.default.createElement(variation_1.MSG, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
20
+ MSH_1: (react_1.default.createElement(variation_1.MSH, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 }))
21
21
  }[layoutType]));
22
22
  };
23
23
  exports.default = ContentsContainer;
@@ -3,6 +3,7 @@ export declare type MSAProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSA: ({ content1, containerColor, areaColor }: MSAProps) => JSX.Element;
8
+ declare const MSA: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSAProps) => JSX.Element;
8
9
  export default MSA;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSA = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n height: 100%;\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n height: 100%;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -3,6 +3,7 @@ export declare type MSBProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSB: ({ content1, containerColor, areaColor }: MSBProps) => JSX.Element;
8
+ declare const MSB: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSBProps) => JSX.Element;
8
9
  export default MSB;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSB = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n height: 100%;\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n height: 100%;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -5,6 +5,8 @@ export declare type MSCProps = {
5
5
  layoutType: 'MSC_1' | 'MSC_2';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
+ isLoadingContainer1?: boolean;
9
+ isLoadingContainer2?: boolean;
8
10
  };
9
- declare const MSC: ({ content1, content2, layoutType, containerColor, areaColor }: MSCProps) => JSX.Element;
11
+ declare const MSC: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: MSCProps) => JSX.Element;
10
12
  export default MSC;
@@ -9,15 +9,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSC = function (_a) {
13
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
14
15
  return (react_1.default.createElement(S_Box, null,
15
- react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor },
16
- react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
- react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1))),
18
- react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor },
19
- react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
20
- react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2)))));
16
+ react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
+ react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
18
+ react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
19
+ react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
21
20
  };
22
21
  var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
23
22
  var S_ContentsContainer1 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"])), function (_a) {
@@ -3,6 +3,7 @@ export declare type MSDProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSD: ({ content1, containerColor, areaColor }: MSDProps) => JSX.Element;
8
+ declare const MSD: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSDProps) => JSX.Element;
8
9
  export default MSD;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSD = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n height: 100%;\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n height: 100%;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -3,6 +3,7 @@ export declare type MSEProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSE: ({ content1, containerColor, areaColor }: MSEProps) => JSX.Element;
8
+ declare const MSE: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSEProps) => JSX.Element;
8
9
  export default MSE;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSE = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n height: 100%;\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n height: 100%;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -5,6 +5,8 @@ export declare type MSFProps = {
5
5
  layoutType: 'MSF_1' | 'MSF_2';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
+ isLoadingContainer1?: boolean;
9
+ isLoadingContainer2?: boolean;
8
10
  };
9
- declare const MSF: ({ content1, content2, layoutType, containerColor, areaColor }: MSFProps) => JSX.Element;
11
+ declare const MSF: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: MSFProps) => JSX.Element;
10
12
  export default MSF;
@@ -9,15 +9,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSF = function (_a) {
13
- var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
14
15
  return (react_1.default.createElement(S_Box, null,
15
- react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor },
16
- react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
- react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1))),
18
- react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor },
19
- react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
20
- react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2)))));
16
+ react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
17
+ react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
18
+ react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
19
+ react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
21
20
  };
22
21
  var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
23
22
  var S_ContentsContainer1 = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"], ["\n background-color: ", ";\n min-width: 360px;\n ", ";\n ", ";\n"])), function (_a) {
@@ -3,6 +3,7 @@ export declare type MSGProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSG: ({ content1, containerColor, areaColor }: MSGProps) => JSX.Element;
8
+ declare const MSG: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSGProps) => JSX.Element;
8
9
  export default MSG;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSG = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n ", ";\n"], ["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n overflow-x: hidden;\n overflow-y: auto;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -3,6 +3,7 @@ export declare type MSHProps = {
3
3
  content1?: JSX.Element;
4
4
  containerColor?: string;
5
5
  areaColor?: string;
6
+ isLoadingContainer1?: boolean;
6
7
  };
7
- declare const MSH: ({ content1, containerColor, areaColor }: MSHProps) => JSX.Element;
8
+ declare const MSH: ({ content1, containerColor, areaColor, isLoadingContainer1 }: MSHProps) => JSX.Element;
8
9
  export default MSH;
@@ -9,11 +9,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
+ var components_1 = require("../../../../../../common/components");
12
13
  var MSH = function (_a) {
13
- var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
- return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor },
15
- react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
- react_1.default.createElement(S_Content1, null, content1))));
14
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
+ return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
16
+ react_1.default.createElement(S_Content1, null, content1)))));
17
17
  };
18
18
  var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"], ["\n background-color: ", ";\n height: 100%;\n min-width: 360px;\n ", ";\n"])), function (_a) {
19
19
  var theme = _a.theme;
@@ -7,6 +7,8 @@ export declare type ContainersBoxProps = {
7
7
  children?: React.ReactNode;
8
8
  containerColor?: string;
9
9
  areaColor?: string;
10
+ isLoadingContainer1?: boolean;
11
+ isLoadingContainer2?: boolean;
10
12
  };
11
- declare const ContainersBox: ({ layoutType, tabContent, content1, content2, containerColor, areaColor }: ContainersBoxProps) => JSX.Element;
13
+ declare const ContainersBox: ({ layoutType, tabContent, content1, content2, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2 }: ContainersBoxProps) => JSX.Element;
12
14
  export default ContainersBox;
@@ -11,7 +11,7 @@ var react_1 = __importDefault(require("react"));
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
12
  var Containers_1 = require("../Containers");
13
13
  var ContainersBox = function (_a) {
14
- var layoutType = _a.layoutType, tabContent = _a.tabContent, content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor;
14
+ var layoutType = _a.layoutType, tabContent = _a.tabContent, content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
15
15
  return (react_1.default.createElement(S_ContainersBox, null,
16
16
  {
17
17
  MSA_1: react_1.default.createElement(react_1.default.Fragment, null),
@@ -26,7 +26,7 @@ var ContainersBox = function (_a) {
26
26
  MSH_1: react_1.default.createElement(Containers_1.TabContainer, { tabContent: tabContent })
27
27
  }[layoutType],
28
28
  react_1.default.createElement(S_BottomWrapper, { layoutType: layoutType },
29
- react_1.default.createElement(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor }))));
29
+ react_1.default.createElement(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2 }))));
30
30
  };
31
31
  var S_ContainersBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n height: 100%;\n flex-direction: column;\n"], ["\n display: flex;\n height: 100%;\n flex-direction: column;\n"])));
32
32
  var S_BottomWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex: 1;\n overflow: hidden;\n"], ["\n flex: 1;\n overflow: hidden;\n"])));
@@ -18,6 +18,9 @@ export declare type ContentSheetProps = {
18
18
  paddingLeft?: PaddingSpacingType;
19
19
  overrideCSS?: CSSProperties;
20
20
  children: React.ReactNode;
21
+ loadingWidth?: string;
22
+ loadingHeight?: string;
23
+ isLoading?: boolean;
21
24
  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
22
25
  };
23
26
  export declare type StyleProps = {
@@ -52,5 +55,5 @@ declare const paddingSpacing: {
52
55
  readonly spacing_m: "spacingM";
53
56
  readonly spacing_n: "spacingN";
54
57
  };
55
- declare function ContentSheet({ width, height, backgroundColorTheme, overrideBackgroundColorKey, borderMode, borderWidth, borderColorTheme, overrideBorderColorKey, shapeType, radius, paddingTop, paddingRight, paddingBottom, paddingLeft, overrideCSS, children, onClick }: ContentSheetProps): JSX.Element;
58
+ declare function ContentSheet({ width, height, backgroundColorTheme, overrideBackgroundColorKey, borderMode, borderWidth, borderColorTheme, overrideBorderColorKey, shapeType, radius, paddingTop, paddingRight, paddingBottom, paddingLeft, overrideCSS, children, loadingWidth, loadingHeight, isLoading, onClick }: ContentSheetProps): JSX.Element;
56
59
  export default ContentSheet;
@@ -28,6 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
+ var styles_1 = require("../../../common/styles");
31
32
  var backgroundColorTheme = {
32
33
  transparent: 'ui_cpnt_sheet_base_03',
33
34
  white: 'ui_cpnt_sheet_base_white',
@@ -58,13 +59,19 @@ var paddingSpacing = {
58
59
  spacing_n: 'spacingN'
59
60
  };
60
61
  function ContentSheet(_a) {
61
- var width = _a.width, height = _a.height, _b = _a.backgroundColorTheme, backgroundColorTheme = _b === void 0 ? 'base3' : _b, overrideBackgroundColorKey = _a.overrideBackgroundColorKey, _c = _a.borderMode, borderMode = _c === void 0 ? 'none' : _c, _d = _a.borderWidth, borderWidth = _d === void 0 ? 1 : _d, _e = _a.borderColorTheme, borderColorTheme = _e === void 0 ? 'grey' : _e, overrideBorderColorKey = _a.overrideBorderColorKey, _f = _a.shapeType, shapeType = _f === void 0 ? 'rectangle' : _f, _g = _a.radius, radius = _g === void 0 ? 24 : _g, _h = _a.paddingTop, paddingTop = _h === void 0 ? 'spacing_e' : _h, _j = _a.paddingRight, paddingRight = _j === void 0 ? 'spacing_e' : _j, _k = _a.paddingBottom, paddingBottom = _k === void 0 ? 'spacing_e' : _k, _l = _a.paddingLeft, paddingLeft = _l === void 0 ? 'spacing_e' : _l, overrideCSS = _a.overrideCSS, children = _a.children, onClick = _a.onClick;
62
+ var width = _a.width, height = _a.height, _b = _a.backgroundColorTheme, backgroundColorTheme = _b === void 0 ? 'base3' : _b, overrideBackgroundColorKey = _a.overrideBackgroundColorKey, _c = _a.borderMode, borderMode = _c === void 0 ? 'none' : _c, _d = _a.borderWidth, borderWidth = _d === void 0 ? 1 : _d, _e = _a.borderColorTheme, borderColorTheme = _e === void 0 ? 'grey' : _e, overrideBorderColorKey = _a.overrideBorderColorKey, _f = _a.shapeType, shapeType = _f === void 0 ? 'rectangle' : _f, _g = _a.radius, radius = _g === void 0 ? 24 : _g, _h = _a.paddingTop, paddingTop = _h === void 0 ? 'spacing_e' : _h, _j = _a.paddingRight, paddingRight = _j === void 0 ? 'spacing_e' : _j, _k = _a.paddingBottom, paddingBottom = _k === void 0 ? 'spacing_e' : _k, _l = _a.paddingLeft, paddingLeft = _l === void 0 ? 'spacing_e' : _l, overrideCSS = _a.overrideCSS, children = _a.children, loadingWidth = _a.loadingWidth, loadingHeight = _a.loadingHeight, isLoading = _a.isLoading, onClick = _a.onClick;
62
63
  var handleClick = function (e) {
63
64
  if (onClick) {
64
65
  onClick(e);
65
66
  }
66
67
  };
67
- return (react_1.default.createElement(S_ContentSheet, { "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
68
+ var ContentSheetVariation = function () {
69
+ if (isLoading) {
70
+ return (react_1.default.createElement(S_LoadingContentSheet, { "$width": width !== null && width !== void 0 ? width : loadingWidth, "$height": height !== null && height !== void 0 ? height : loadingHeight, shapeType: shapeType, "$radius": radius }));
71
+ }
72
+ return (react_1.default.createElement(S_ContentSheet, { "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
73
+ };
74
+ return ContentSheetVariation();
68
75
  }
69
76
  var radiusStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: ", ";\n"], ["\n border-radius: ", ";\n"])), function (_a) {
70
77
  var $radius = _a.$radius;
@@ -127,5 +134,6 @@ var S_ContentSheet = styled_components_1.default.div(templateObject_7 || (templa
127
134
  var paddingLeft = _a.paddingLeft;
128
135
  return paddingLeft !== 'none' && paddingLeftStyle;
129
136
  }, overrideStyle);
137
+ var S_LoadingContentSheet = (0, styled_components_1.default)(S_ContentSheet)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), styles_1.skeletonLoadingStyle);
130
138
  exports.default = ContentSheet;
131
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
139
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.5.11",
3
+ "version": "1.6.1",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,9 +1,9 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.5.11]
2
+ ## [v1.6.1]
3
3
 
4
4
  ### Component
5
5
  * DynamicDesktopNavBar
6
- * PrimaryMenu들을 좌우로 스크롤 해주는 버튼의 배경 컬러키 변경
6
+ * colorTheme prop 추가 (transparent)
7
7
 
8
8
  ### Color
9
- * 컬러 키 값 22.11.10 12시 40분 기준 싱크
9
+ * 컬러 키 값 22.11.14 12시 47분 기준 싱크