@lotte-innovate/ui-component-test 0.0.9 → 0.0.11

package/dist/stories/toggle/{ToggleGroup.stories.js → ToggleGroup.stories.jsx}

@@ -20,7 +20,6 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { commonArgTypes, sizeOptions, appearanceOptions } from '../../constants';
 import { FontBoldIcon, FontItalicIcon, UnderlineIcon } from '@radix-ui/react-icons';
 import { ToggleGroup, ToggleGroupItem } from '../../components/ToggleGroup';
@@ -78,17 +77,51 @@ var meta = {
 export default meta;
 export var Default = function (_a) {
     var args = __rest(_a, []);
-    return (_jsxs(ToggleGroup, __assign({ type: 'single', defaultValue: 'left', "aria-label": "Text alignment" }, args, { children: [_jsx(ToggleGroupItem, __assign({ value: "left", "aria-label": "Left aligned" }, args, { children: _jsx(FontBoldIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "center", "aria-label": "Center aligned" }, args, { children: _jsx(FontItalicIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "right", "aria-label": "Right aligned" }, args, { children: _jsx(UnderlineIcon, {}) }))] })));
+    return (<ToggleGroup type={'single'} defaultValue={'left'} aria-label="Text alignment" {...args}>
+      <ToggleGroupItem value="left" aria-label="Left aligned" {...args}>
+        <FontBoldIcon />
+      </ToggleGroupItem>
+      <ToggleGroupItem value="center" aria-label="Center aligned" {...args}>
+        <FontItalicIcon />
+      </ToggleGroupItem>
+      <ToggleGroupItem value="right" aria-label="Right aligned" {...args}>
+        <UnderlineIcon />
+      </ToggleGroupItem>
+    </ToggleGroup>);
 };
 export var Size = function (_a) {
     var args = __rest(_a, []);
-    return (_jsx("div", { className: "flex items-center space-x-4", children: sizeOptions
+    return (<div className="flex items-center space-x-4">
+    {sizeOptions
             .filter(function (size) { return !['x-small', 'x-large'].includes(size); })
-            .map(function (size) { return (_jsxs(ToggleGroup, __assign({ type: 'single', defaultValue: 'left', "aria-label": "Text alignment" }, args, { children: [_jsx(ToggleGroupItem, __assign({ value: "left", "aria-label": "Left aligned" }, args, { size: size, children: _jsx(FontBoldIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "center", "aria-label": "Center aligned" }, args, { size: size, children: _jsx(FontItalicIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "right", "aria-label": "Right aligned" }, args, { size: size, children: _jsx(UnderlineIcon, {}) }))] }), size)); }) }));
+            .map(function (size) { return (<ToggleGroup key={size} type={'single'} defaultValue={'left'} aria-label="Text alignment" {...args}>
+          <ToggleGroupItem value="left" aria-label="Left aligned" {...args} size={size}>
+            <FontBoldIcon />
+          </ToggleGroupItem>
+          <ToggleGroupItem value="center" aria-label="Center aligned" {...args} size={size}>
+            <FontItalicIcon />
+          </ToggleGroupItem>
+          <ToggleGroupItem value="right" aria-label="Right aligned" {...args} size={size}>
+            <UnderlineIcon />
+          </ToggleGroupItem>
+        </ToggleGroup>); })}
+  </div>);
 };
 export var Appearance = function (_a) {
     var args = __rest(_a, []);
-    return (_jsx("div", { className: "flex items-center space-x-4", children: appearanceOptions
+    return (<div className="flex items-center space-x-4">
+    {appearanceOptions
             .filter(function (appearance) { return !['classic', 'solid'].includes(appearance); })
-            .map(function (appearance) { return (_jsxs(ToggleGroup, __assign({ type: 'single', defaultValue: 'left', "aria-label": "Text alignment" }, args, { children: [_jsx(ToggleGroupItem, __assign({ value: "left", "aria-label": "Left aligned" }, args, { appearance: appearance, children: _jsx(FontBoldIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "center", "aria-label": "Center aligned" }, args, { appearance: appearance, children: _jsx(FontItalicIcon, {}) })), _jsx(ToggleGroupItem, __assign({ value: "right", "aria-label": "Right aligned" }, args, { appearance: appearance, children: _jsx(UnderlineIcon, {}) }))] }), appearance)); }) }));
+            .map(function (appearance) { return (<ToggleGroup key={appearance} type={'single'} defaultValue={'left'} aria-label="Text alignment" {...args}>
+          <ToggleGroupItem value="left" aria-label="Left aligned" {...args} appearance={appearance}>
+            <FontBoldIcon />
+          </ToggleGroupItem>
+          <ToggleGroupItem value="center" aria-label="Center aligned" {...args} appearance={appearance}>
+            <FontItalicIcon />
+          </ToggleGroupItem>
+          <ToggleGroupItem value="right" aria-label="Right aligned" {...args} appearance={appearance}>
+            <UnderlineIcon />
+          </ToggleGroupItem>
+        </ToggleGroup>); })}
+  </div>);
 };

package/dist/stories/tooltip/Tooltip.stories.d.ts

@@ -84,10 +84,10 @@ declare const meta: {
 export default meta;
 export declare const Default: ({ ...args }: {
     [x: string]: any;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export declare const Radius: ({ ...args }: {
     [x: string]: any;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export declare const Position: ({ ...args }: {
     [x: string]: any;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;

package/dist/stories/tooltip/{Tooltip.stories.js → Tooltip.stories.jsx}

@@ -20,7 +20,6 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
 import { Tooltip } from '../../components/Tooltip/index';
 import { commonArgTypes, radiusOptions } from '../../constants';
 var meta = {
@@ -66,13 +65,27 @@ var meta = {
 export default meta;
 export var Default = function (_a) {
     var args = __rest(_a, []);
-    return (_jsx(Tooltip, __assign({ content: "\uD234\uD301 \uCEF4\uD3EC\uB10C\uD2B8 \uB0B4\uC6A9\uC785\uB2C8\uB2E4." }, args, { children: _jsx("div", { children: "\uB9C8\uC6B0\uC2A4 \uCEE4\uC11C\uB97C \uC62C\uB824\uC8FC\uC138\uC694" }) })));
+    return (<Tooltip content="툴팁 컴포넌트 내용입니다." {...args}>
+    <div>마우스 커서를 올려주세요</div>
+  </Tooltip>);
 };
 export var Radius = function (_a) {
     var args = __rest(_a, []);
-    return (_jsx("div", { className: "", children: radiusOptions.map(function (radius, index) { return (_jsx("div", { className: "flex pt-3 items-center space-x-2", children: _jsx(Tooltip, __assign({ content: "\uD234\uD301 \uCEF4\uD3EC\uB10C\uD2B8 \uB0B4\uC6A9\uC785\uB2C8\uB2E4.", radius: radius }, args, { children: _jsx("div", { children: "\uB9C8\uC6B0\uC2A4 \uCEE4\uC11C\uB97C \uC62C\uB824\uC8FC\uC138\uC694" }) })) }, radius)); }) }));
+    return (<div className="">
+    {radiusOptions.map(function (radius, index) { return (<div key={radius} className="flex pt-3 items-center space-x-2">
+        <Tooltip content="툴팁 컴포넌트 내용입니다." radius={radius} {...args}>
+          <div>마우스 커서를 올려주세요</div>
+        </Tooltip>
+      </div>); })}
+  </div>);
 };
 export var Position = function (_a) {
     var args = __rest(_a, []);
-    return (_jsx("div", { className: "", children: ['top', 'right', 'left', 'bottom'].map(function (side, index) { return (_jsx("div", { className: "flex pt-3 items-center space-x-2", children: _jsx(Tooltip, __assign({ content: "\uD234\uD301 \uCEF4\uD3EC\uB10C\uD2B8 \uB0B4\uC6A9\uC785\uB2C8\uB2E4.", side: side }, args, { children: _jsx("div", { children: "\uB9C8\uC6B0\uC2A4 \uCEE4\uC11C\uB97C \uC62C\uB824\uC8FC\uC138\uC694" }) })) }, side)); }) }));
+    return (<div className="">
+    {['top', 'right', 'left', 'bottom'].map(function (side, index) { return (<div key={side} className="flex pt-3 items-center space-x-2">
+        <Tooltip content="툴팁 컴포넌트 내용입니다." side={side} {...args}>
+          <div>마우스 커서를 올려주세요</div>
+        </Tooltip>
+      </div>); })}
+  </div>);
 };