@shoplflow/templates 0.0.19 → 0.0.22

package/dist/index.cjs

@@ -1,15 +1,17 @@
 'use strict';
 
 var base = require('@shoplflow/base');
-var jsxRuntime = require('react/jsx-runtime');
 var styled = require('@emotion/styled');
 var shoplAssets = require('@shoplflow/shopl-assets');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -25,10 +27,19 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var Example = ({ text }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(base.Stack.Horizontal, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: text }) });
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
 };
-exports.Example = Example;
 var getTypographyAndColor = (depth) => {
   switch (depth) {
     case 1:
@@ -80,8 +91,9 @@ var Header = ({ depth, title, isRequired, count, helpIconProps }) => {
     helpIconProps && /* @__PURE__ */ jsxRuntime.jsx(TitleGroupHelpIcon, __spreadValues({}, helpIconProps))
   ] });
 };
-var Description = ({ description }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(base.StackContainer, { minHeight: "30px", height: "auto", children: /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "paragraph1", color: "neutral500", wordBreak: "break-all", children: description }) });
+var Description = (_a) => {
+  var _b = _a, { description } = _b, rest = __objRest(_b, ["description"]);
+  return /* @__PURE__ */ jsxRuntime.jsx(base.StackContainer.Vertical, { padding: "0px 0px 12px", height: "auto", children: /* @__PURE__ */ jsxRuntime.jsx(base.Text, __spreadProps(__spreadValues({ typography: "paragraph1", color: "neutral500", wordBreak: "break-all", whiteSpace: "pre-line" }, rest), { children: description })) });
 };
 var TitleGroup = ({ children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(base.Stack.Vertical, { width: "100%", "data-shoplflow": "Title", children });

package/dist/index.d.cts

@@ -1,20 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { TooltipProps } from '@shoplflow/base';
+import { TextProps, TooltipProps } from '@shoplflow/base';
 import { ChildrenProps } from '@shoplflow/base/src/utils/type/ComponentProps';
 import { ReactNode } from 'react';
 
-declare type ExampleProps = {
-    text: string;
-};
-
-declare const Example: ({ text }: ExampleProps) => react_jsx_runtime.JSX.Element;
-
 declare type ActionsProps = {
     children: ReactNode;
 };
 declare type DescriptionProps = {
-    description: string;
-};
+    description?: string;
+} & TextProps;
 declare type TitleGroupHelpIconProps = {
     /**
      * 툴팁 내용, 없을 경우 Tooltip 미노출
@@ -68,7 +62,7 @@ declare const TitleGroup: {
     HeaderBox: ({ children }: ChildrenProps) => react_jsx_runtime.JSX.Element;
     Header: ({ depth, title, isRequired, count, helpIconProps }: TitleGroupHeaderProps) => react_jsx_runtime.JSX.Element;
     Actions: ({ children }: ActionsProps) => react_jsx_runtime.JSX.Element;
-    Description: ({ description }: DescriptionProps) => react_jsx_runtime.JSX.Element;
+    Description: ({ description, ...rest }: DescriptionProps) => react_jsx_runtime.JSX.Element;
 };
 
-export { ActionsProps, DescriptionProps, Example, ExampleProps, TitleGroup, TitleGroupHeaderProps, TitleGroupHelpIconProps, TitleGroupProps };
+export { ActionsProps, DescriptionProps, TitleGroup, TitleGroupHeaderProps, TitleGroupHelpIconProps, TitleGroupProps };

package/dist/index.d.ts

@@ -1,20 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { TooltipProps } from '@shoplflow/base';
+import { TextProps, TooltipProps } from '@shoplflow/base';
 import { ChildrenProps } from '@shoplflow/base/src/utils/type/ComponentProps';
 import { ReactNode } from 'react';
 
-declare type ExampleProps = {
-    text: string;
-};
-
-declare const Example: ({ text }: ExampleProps) => react_jsx_runtime.JSX.Element;
-
 declare type ActionsProps = {
     children: ReactNode;
 };
 declare type DescriptionProps = {
-    description: string;
-};
+    description?: string;
+} & TextProps;
 declare type TitleGroupHelpIconProps = {
     /**
      * 툴팁 내용, 없을 경우 Tooltip 미노출
@@ -68,7 +62,7 @@ declare const TitleGroup: {
     HeaderBox: ({ children }: ChildrenProps) => react_jsx_runtime.JSX.Element;
     Header: ({ depth, title, isRequired, count, helpIconProps }: TitleGroupHeaderProps) => react_jsx_runtime.JSX.Element;
     Actions: ({ children }: ActionsProps) => react_jsx_runtime.JSX.Element;
-    Description: ({ description }: DescriptionProps) => react_jsx_runtime.JSX.Element;
+    Description: ({ description, ...rest }: DescriptionProps) => react_jsx_runtime.JSX.Element;
 };
 
-export { ActionsProps, DescriptionProps, Example, ExampleProps, TitleGroup, TitleGroupHeaderProps, TitleGroupHelpIconProps, TitleGroupProps };
+export { ActionsProps, DescriptionProps, TitleGroup, TitleGroupHeaderProps, TitleGroupHelpIconProps, TitleGroupProps };

package/dist/index.js

@@ -1,9 +1,11 @@
 import { colorTokens, Stack, StackContainer, Text, Tooltip, IconButton, Icon } from '@shoplflow/base';
-import { jsx, jsxs } from 'react/jsx-runtime';
 import styled from '@emotion/styled';
 import { HelpLineIcon } from '@shoplflow/shopl-assets';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -19,10 +21,19 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var Example = ({ text }) => {
-  return /* @__PURE__ */ jsx(Stack.Horizontal, { children: /* @__PURE__ */ jsx("div", { children: text }) });
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
 };
-var Example_default = Example;
 var getTypographyAndColor = (depth) => {
   switch (depth) {
     case 1:
@@ -74,8 +85,9 @@ var Header = ({ depth, title, isRequired, count, helpIconProps }) => {
     helpIconProps && /* @__PURE__ */ jsx(TitleGroupHelpIcon, __spreadValues({}, helpIconProps))
   ] });
 };
-var Description = ({ description }) => {
-  return /* @__PURE__ */ jsx(StackContainer, { minHeight: "30px", height: "auto", children: /* @__PURE__ */ jsx(Text, { typography: "paragraph1", color: "neutral500", wordBreak: "break-all", children: description }) });
+var Description = (_a) => {
+  var _b = _a, { description } = _b, rest = __objRest(_b, ["description"]);
+  return /* @__PURE__ */ jsx(StackContainer.Vertical, { padding: "0px 0px 12px", height: "auto", children: /* @__PURE__ */ jsx(Text, __spreadProps(__spreadValues({ typography: "paragraph1", color: "neutral500", wordBreak: "break-all", whiteSpace: "pre-line" }, rest), { children: description })) });
 };
 var TitleGroup = ({ children }) => {
   return /* @__PURE__ */ jsx(Stack.Vertical, { width: "100%", "data-shoplflow": "Title", children });
@@ -86,4 +98,4 @@ TitleGroup.Actions = Actions;
 TitleGroup.Description = Description;
 var TitleGroup_default = TitleGroup;
 
-export { Example_default as Example, TitleGroup_default as TitleGroup };
+export { TitleGroup_default as TitleGroup };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shoplflow/templates",
-  "version": "0.0.19",
+  "version": "0.0.22",
   "type": "module",
   "license": "Apache-2.0",
   "main": "dist/index.js",
@@ -87,10 +87,10 @@
     "react-datepicker": "^7.3.0",
     "react-dom": "^18.2.0",
     "simplebar-react": "^3.2.6",
-    "@shoplflow/base": "^0.32.38",
-    "@shoplflow/shopl-assets": "^0.11.3",
+    "@shoplflow/base": "^0.32.39",
+    "@shoplflow/utils": "^0.6.5",
     "@shoplflow/hada-assets": "^0.1.3",
-    "@shoplflow/utils": "^0.6.5"
+    "@shoplflow/shopl-assets": "^0.11.4"
   },
   "scripts": {
     "type-check": "tsc --noEmit",