@wishket/design-system 1.0.10 → 1.1.0

package/dist/Components/Atoms/Label/Label.d.ts

@@ -1,8 +1,8 @@
 import { ComponentProps } from 'react';
 import { SystemIconName } from '../SystemIcon/SystemIcon.types';
 export interface LabelRootProps extends ComponentProps<'div'> {
-    variant?: 'text' | 'outlined' | 'filled';
-    color?: 'primary' | 'gray';
+    type?: 'text' | 'outlined' | 'filled';
+    variant?: 'primary' | 'gray';
     size?: 'sm' | 'md';
     canHover?: boolean;
 }
@@ -10,7 +10,7 @@ export interface LabelIconProps extends ComponentProps<'div'> {
     icon?: SystemIconName;
 }
 declare const Label: {
-    Root: ({ children, className, size, variant, color, ref, canHover, ...rest }: LabelRootProps) => import("react/jsx-runtime").JSX.Element;
+    Root: ({ children, className, size, type, variant, ref, canHover, ...rest }: LabelRootProps) => import("react/jsx-runtime").JSX.Element;
     Text: ({ children, className }: ComponentProps<'div'>) => import("react/jsx-runtime").JSX.Element;
     Icon: ({ children, className, icon }: LabelIconProps) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/Components/Atoms/Label/Label.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var r=require("../../../_virtual/_tslib.js"),e=require("react/jsx-runtime"),t=require("react"),a=require("tailwind-merge"),i=require("../Box/Box.js"),n=require("../Typography/Typography.js"),o=require("../SystemIcon/SystemIcon.js"),s=t.createContext({variant:"",color:"",size:""}),c={Root:function(n){function o(r){return t.isValidElement(r)&&"function"==typeof r.type&&r.type.toString().includes("icon")}var c=n.children,l=n.className,d=n.size,y=void 0===d?"md":d,d=n.variant,g=void 0===d?"text":d,d=n.color,p=void 0===d?"primary":d,d=(n.ref,n.canHover),m=void 0!==d&&d,d=r.__rest(n,["children","className","size","variant","color","ref","canHover"]),n=t.Children.toArray(c),u=n.length-1,x=o(n[0]),v=o(n[u]);return e.jsx(s.Provider,{value:{variant:g,color:p,size:y},children:e.jsx(i,r.__assign({"data-testid":"design-system-label",className:a.twMerge("flex w-fit items-center","sm"===y&&"gap-1","md"===y&&"gap-1.5",function(){var r="sm"===y,e="rounded-lg px-2";if("text"!==g)return"outlined"===g?a.twMerge(e,r?"border py-px":"border py-0",x&&"pl-1.5",v&&"pr-1.5"):a.twMerge(e,r?"py-0.5":"py-px",x&&"pl-1.5",v&&"pr-1.5")}(),m&&"cursor-pointer",function(){var r="outlined"===g;if("text"!==g)return"gray"===p?r?m?"bg-w-gray-10 border-w-gray-200 hover:border-w-gray-400":"bg-w-gray-10 border-w-gray-200":m?"bg-w-gray-10 hover:bg-w-gray-200":"bg-w-gray-10":r?m?"bg-primary-50 border-primary-200 hover:border-primary":"bg-primary-50 border-primary-200":m?"bg-primary-50 hover:bg-primary-100":"bg-primary-50"}(),l)},d,{children:c}))})},Text:function(r){var i=r.children,r=r.className,o=t.useContext(s),c=o.variant,l=o.color,o=o.size;return e.jsx(n,{variant:"md"===o?"body2":"caption1","data-testid":"design-system-label--text",className:a.twMerge("select-none text-w-gray-600",!("text"===c)&&"primary"===l&&"text-primary",r),children:i})},Icon:function(r){var n=r.children,c=r.className,r=r.icon,l=t.useContext(s),d=l.variant,l=l.color;return e.jsxs(i,{"data-testid":"design-system-label--icon",className:a.twMerge("aspect-w-[14px] size-[14px] shrink-0 object-contain",!r&&c),children:[r&&e.jsx(o,{name:r,className:a.twMerge("text-w-gray-400","primary"===l&&"text-primary","text"===d&&"text-w-gray-400",c)}),n]})}};module.exports=c;
+"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("react"),a=require("tailwind-merge"),i=require("../Box/Box.js"),n=require("../Typography/Typography.js"),s=require("../SystemIcon/SystemIcon.js"),o=t.createContext({type:"",variant:"",size:""}),y={Root:function(n){function s(r){return t.isValidElement(r)&&"function"==typeof r.type&&r.type.toString().includes("icon")}var y=n.children,p=n.className,c=n.size,d=void 0===c?"md":c,c=n.type,g=void 0===c?"text":c,c=n.variant,l=void 0===c?"primary":c,c=(n.ref,n.canHover),m=void 0!==c&&c,c=e.__rest(n,["children","className","size","type","variant","ref","canHover"]),n=t.Children.toArray(y),u=n.length-1,x=s(n[0]),v=s(n[u]);return r.jsx(o.Provider,{value:{type:g,variant:l,size:d},children:r.jsx(i,e.__assign({"data-testid":"design-system-label",className:a.twMerge("flex w-fit items-center","sm"===d&&"gap-1","md"===d&&"gap-1.5",function(){var r="sm"===d,e="rounded-lg px-2";if("text"!==g)return"outlined"===g?a.twMerge(e,r?"border py-px":"border py-0",x&&"pl-1.5",v&&"pr-1.5"):a.twMerge(e,r?"py-0.5":"py-px",x&&"pl-1.5",v&&"pr-1.5")}(),m&&"cursor-pointer",function(){var r="outlined"===g;if("text"!==g)return"gray"===l?r?m?"bg-w-gray-10 border-w-gray-200 hover:border-w-gray-400":"bg-w-gray-10 border-w-gray-200":m?"bg-w-gray-10 hover:bg-w-gray-200":"bg-w-gray-10":r?m?"bg-primary-50 border-primary-200 hover:border-primary":"bg-primary-50 border-primary-200":m?"bg-primary-50 hover:bg-primary-100":"bg-primary-50"}(),p)},c,{children:y}))})},Text:function(e){var i=e.children,e=e.className,s=t.useContext(o),y=s.type,p=s.variant,s=s.size;return r.jsx(n,{variant:"md"===s?"body2":"caption1","data-testid":"design-system-label--text",className:a.twMerge("select-none text-w-gray-600",!("text"===y)&&"primary"===p&&"text-primary",e),children:i})},Icon:function(e){var n=e.children,y=e.className,e=e.icon,p=t.useContext(o),c=p.type,p=p.variant;return r.jsxs(i,{"data-testid":"design-system-label--icon",className:a.twMerge("aspect-w-[14px] size-[14px] shrink-0 object-contain",!e&&y),children:[e&&r.jsx(s,{name:e,className:a.twMerge("text-w-gray-400","primary"===p&&"text-primary","text"===c&&"text-w-gray-400",y)}),n]})}};module.exports=y;

package/dist/Components/Atoms/Label/Label.stories.d.ts

@@ -1,10 +1,10 @@
 import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ children, className, size, variant, color, ref, canHover, ...rest }: import("./Label").LabelRootProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ children, className, size, type, variant, ref, canHover, ...rest }: import("./Label").LabelRootProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     argTypes: {
-        variant: {
+        type: {
             control: string;
             options: string[];
         };

package/dist/Components/Atoms/SkillLabel/SkillLabel.parts.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../Box/Box.js"),t=require("../Typography/Typography.js");exports.Icon=function(s){var t=s.className,s=s.iconUrl;return e.jsx("img",{"data-testid":"design-system-skill-chip--icon",src:s,alt:"icon",width:24,height:24,className:r.twMerge("size-6 shrink-0 rounded-full object-cover",t)})},exports.Root=function(t){var i=t.children,t=t.className;return e.jsx(s,{"data-testid":"design-system-skill-chip",className:r.twMerge("flex h-9 w-fit shrink-0 select-none items-center gap-2 rounded-xl border border-gray-200 py-[5px] pl-[7px] pr-[15px]",t),children:i})},exports.Text=function(s){var i=s.children,s=s.className;return e.jsx(t,{variant:"body2",className:r.twMerge("text-w-gray-900",s),children:i})};
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../Box/Box.js"),t=require("../Typography/Typography.js");exports.Icon=function(s){var t=s.className,s=s.iconUrl;return e.jsx("img",{"data-testid":"design-system-skill-chip--icon",src:s,alt:"icon",width:24,height:24,className:r.twMerge("size-6 shrink-0 rounded-full object-cover",t)})},exports.Root=function(t){var i=t.children,t=t.className;return e.jsx(s,{"data-testid":"design-system-skill-chip",className:r.twMerge("flex h-9 w-fit shrink-0 select-none items-center gap-2 rounded-xl border border-w-gray-200 py-[5px] pl-[7px] pr-[15px]",t),children:i})},exports.Text=function(s){var i=s.children,s=s.className;return e.jsx(t,{variant:"body2",className:r.twMerge("text-w-gray-900",s),children:i})};

package/dist/Components/Molecules/PlainTooltip/PlainTooltip.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps } from 'react';
+export interface TooltipProps extends ComponentProps<'div'> {
+    variant?: 'up' | 'down' | 'left' | 'right';
+    title?: string;
+    description?: string;
+}
+declare const PlainTooltip: ({ variant, children, className, }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
+export default PlainTooltip;

package/dist/Components/Molecules/PlainTooltip/PlainTooltip.js

@@ -0,0 +1 @@
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),r=require("../../Atoms/Typography/Typography.js"),s=(require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/Box/Box.js")),a=(require("../../../_virtual/_tslib.js"),require("../../Atoms/Radio/Radio.js"),require("react"),require("../../Atoms/SystemIcon/Icons/Small/SmallScrap.js"),require("../../Atoms/SystemIcon/Icons/Small/SmallBell.js"),require("../../Atoms/SystemIcon/Icons/Medium/MediumEdit.js"),require("../../Atoms/TextField/TextField.js"),require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),require("./PlainTooltip.parts.js"));module.exports=function(i){var o=i.variant,o=void 0===o?"up":o,l=i.children,i=i.className;return e.jsx(s,{"data-testid":"design-system-plain-toolTip",className:i,children:e.jsxs(s,{className:"relative h-fit w-fit select-none border-none opacity-80 outline-none","data-testid":"design-system-plain-toolTip--container",children:[e.jsx(a.Arrow,{testId:"design-system-plain-toolTip--arrow",className:t.twMerge("absolute z-10","down"===o&&"-bottom-[7px] left-1/2 translate-x-[-50%] -rotate-90","up"===o&&"-top-[7px] left-1/2 translate-x-[-50%] rotate-90","left"===o&&"-left-[4.8px] top-1/2 translate-y-[-50%] rotate-0","right"===o&&"-right-[4.8px] top-1/2 translate-y-[-50%] rotate-180")}),e.jsx(s,{className:"z-0 flex h-auto min-h-[28px] w-full items-center justify-center rounded-lg bg-w-black px-3 py-1 text-center",children:e.jsx(r,{variant:"body3",className:"whitespace-pre text-wrap break-all font-medium text-w-white opacity-100",children:l})})]})})};

package/dist/Components/Molecules/{Tooltip/Tooltip.stories.d.ts → PlainTooltip/PlainTooltip.stories.d.ts}

@@ -1,10 +1,10 @@
 import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ direction, children, className, variant, title, description, }: import("./Tooltip").TooltipProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ variant, children, className, }: import("./PlainTooltip").TooltipProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     argTypes: {
-        direction: {
+        variant: {
             control: string;
             options: string[];
         };
@@ -25,4 +25,3 @@ export declare const Up: Story;
 export declare const Down: Story;
 export declare const Left: Story;
 export declare const Right: Story;
-export declare const Rich: Story;

package/dist/Components/Molecules/PlainTooltip/index.d.ts

@@ -0,0 +1,2 @@
+import PlainTooltip from './PlainTooltip';
+export default PlainTooltip;

package/dist/Components/Molecules/PlainTooltip/index.js

@@ -0,0 +1 @@
+"use strict";var e=require("./PlainTooltip.js");module.exports=e;

package/dist/Components/Molecules/RichTooltip/RichTooltip.d.ts

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from 'react';
+export interface RichTooltipProps extends PropsWithChildren {
+    title?: string;
+    description?: string;
+    className?: string;
+}
+declare const RichTooltip: ({ title, description, className, children, }: RichTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export default RichTooltip;

package/dist/Components/Molecules/RichTooltip/RichTooltip.js

@@ -0,0 +1 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../../Atoms/Typography/Typography.js"),t=(require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/Box/Box.js"));require("../../../_virtual/_tslib.js"),require("../../Atoms/Radio/Radio.js"),require("react"),require("../../Atoms/SystemIcon/Icons/Small/SmallScrap.js"),require("../../Atoms/SystemIcon/Icons/Small/SmallBell.js"),require("../../Atoms/SystemIcon/Icons/Medium/MediumEdit.js"),require("../../Atoms/TextField/TextField.js"),require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),module.exports=function(i){var a=i.title,o=i.description,l=i.className,i=i.children;return e.jsxs(t,{className:r.twMerge("flex w-full flex-col gap-1 rounded-xl bg-white px-6 py-5 shadow-graymedium tablet:w-80",l),"data-testid":"design-system-rich-tooltip",children:[a&&e.jsx(t,{className:"flex w-full items-start justify-between gap-4",children:e.jsx(s,{variant:"body2",className:"font-medium text-w-gray-900",children:a})}),o&&e.jsx(s,{variant:"body3",className:"text-w-gray-400",children:o}),i]})};

package/dist/Components/Molecules/RichTooltip/RichTooltip.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import RichTooltip from './RichTooltip';
+declare const meta: Meta<typeof RichTooltip>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/Components/Molecules/RichTooltip/index.d.ts

@@ -0,0 +1,2 @@
+import RichTooltip from './RichTooltip';
+export default RichTooltip;

package/dist/Components/Molecules/RichTooltip/index.js

@@ -0,0 +1 @@
+"use strict";var e=require("./RichTooltip.js");module.exports=e;

package/dist/Components/Molecules/index.d.ts

@@ -11,6 +11,7 @@ export { default as Pagination } from './Pagination';
 export { default as Drawer } from './Drawer';
 export { default as SnackBar } from './SnackBar';
 export type { SnackBarProps } from './SnackBar';
-export { default as Tooltip } from './Tooltip';
+export { default as PlainTooltip } from './PlainTooltip';
+export { default as RichTooltip } from './RichTooltip';
 export { default as RangeSlider } from './RangeSlider';
 export { default as RadioGroup } from './RadioGroup';

package/dist/Components/Organisms/TextTab/TextTab.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 declare const TextTab: {
-    Root: ({ children, defaultActive, isFit, hasPadding, onChange, }: import("./TextTab.types").RootProps) => import("react/jsx-runtime").JSX.Element;
+    Root: ({ children, defaultActive, isFit, hasPadding, isFull, onChange, }: import("./TextTab.types").RootProps) => import("react/jsx-runtime").JSX.Element;
     Tabs: ({ children }: {
         children?: import("react").ReactNode;
     }) => import("react/jsx-runtime").JSX.Element;

package/dist/Components/Organisms/TextTab/TextTab.parts.d.ts

@@ -1,6 +1,6 @@
 import { PropsWithChildren } from 'react';
 import { PanelProps, RootProps, TabProps } from './TextTab.types';
-declare const Root: ({ children, defaultActive, isFit, hasPadding, onChange, }: RootProps) => import("react/jsx-runtime").JSX.Element;
+declare const Root: ({ children, defaultActive, isFit, hasPadding, isFull, onChange, }: RootProps) => import("react/jsx-runtime").JSX.Element;
 declare const Tabs: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
 declare const Tab: ({ children, index, className, barColor, disabled, badgeNumber, iconName, }: TabProps) => import("react/jsx-runtime").JSX.Element;
 declare const Panel: ({ children, index }: PanelProps) => false | import("react/jsx-runtime").JSX.Element;

package/dist/Components/Organisms/TextTab/TextTab.parts.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("tailwind-merge"),r=require("../../Atoms/Typography/Typography.js"),i=(require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/CountBadge/CountBadge.js")),s=require("../../Atoms/Box/Box.js"),n=(require("../../../_virtual/_tslib.js"),require("../../Atoms/Radio/Radio.js"),require("../../Atoms/SystemIcon/SystemIcon.js")),o=(require("../../Atoms/TextField/TextField.js"),require("../../Atoms/Divider/Divider.js")),l=(require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),t.createContext({activeTab:0,defaultActive:0,animationDirection:"right",isFit:!0,hasPadding:!1,handleTabClick:function(e){}}));exports.Panel=function(a){var i=a.children,a=a.index;return t.useContext(l).activeTab===a&&e.jsx(s,{"data-testid":"design-system-textTab--content",children:i})},exports.Root=function(a){function i(e){if(e===d)return m(void 0);d<e&&m("right"),e<d&&m("left"),null!=c&&c(e),u(e)}var r=a.children,s=a.defaultActive,n=void 0===s?0:s,s=a.isFit,s=void 0===s||s,o=a.hasPadding,o=void 0!==o&&o,c=a.onChange,a=t.useState(n),d=a[0],u=a[1],a=t.useState(void 0),x=a[0],m=a[1];return t.useEffect(function(){i(n)},[n]),e.jsx(l.Provider,{value:{activeTab:d,animationDirection:x,defaultActive:n,isFit:s,hasPadding:o,handleTabClick:i},children:r})},exports.Tab=function(o){var c=o.children,d=o.index,u=o.className,x=o.barColor,m=o.disabled,g=void 0!==m&&m,m=o.badgeNumber,o=o.iconName,h=t.useContext(l),f=h.isFit,b=h.handleTabClick,v=h.activeTab,h=h.animationDirection,v=d===v;return e.jsx(s,{tabIndex:0,"data-testid":"design-system-textTab--item-".concat(d),className:a.twMerge("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",g&&"cursor-not-allowed",u),onClick:function(){g||b(d)},children:e.jsxs(s,{className:a.twMerge("relative flex w-max flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!f&&"px-[33.5px]",v&&"font-medium text-w-gray-900"),children:[o&&e.jsx(s,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:e.jsx(n,{name:o,className:a.twMerge("size-4 text-w-gray-600 group-hover:text-w-gray-900",v&&"text-w-gray-900")})}),e.jsx(r,{variant:"body1",className:"relative",children:c}),m&&e.jsx(i,{text:m,className:"relative",variant:"gray"}),e.jsx("span",{"data-testid":"design-system-textTab--underbar-".concat(d),className:a.twMerge("absolute -bottom-px left-0 h-0.5 w-full rounded-t-lg bg-transparent",v&&"bg-w-gray-900 transition duration-500 ease-out ".concat("right"===(h||"")?"-left-1/2 translate-x-1/2":"left-1/2 -translate-x-1/2"),x)})]})})},exports.Tabs=function(i){var i=i.children,r=t.useContext(l).hasPadding;return e.jsxs(e.Fragment,{children:[e.jsx(s,{className:a.twJoin("block w-full items-start overflow-x-scroll scrollbar-hide",r&&"px-9"),"data-testid":"design-system-textTab--container",children:e.jsx(s,{className:"mb-px inline-flex min-w-max gap-10",children:i})}),e.jsx(o,{className:"w-full"})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("tailwind-merge"),a=require("../../Atoms/Typography/Typography.js"),i=(require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/CountBadge/CountBadge.js")),s=require("../../Atoms/Box/Box.js"),n=(require("../../../_virtual/_tslib.js"),require("../../Atoms/Radio/Radio.js"),require("../../Atoms/SystemIcon/SystemIcon.js")),o=(require("../../Atoms/TextField/TextField.js"),require("../../Atoms/Divider/Divider.js")),l=(require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),t.createContext({activeTab:0,defaultActive:0,animationDirection:"right",isFit:!0,hasPadding:!1,isFull:!1,handleTabClick:function(e){}}));exports.Panel=function(r){var i=r.children,r=r.index;return t.useContext(l).activeTab===r&&e.jsx(s,{"data-testid":"design-system-textTab--content",children:i})},exports.Root=function(r){var i=r.children,a=r.defaultActive,a=void 0===a?0:a,s=r.isFit,s=void 0===s||s,n=r.hasPadding,n=void 0!==n&&n,o=r.isFull,o=void 0!==o&&o,d=r.onChange,r=t.useState(a),c=r[0],u=r[1],r=t.useState(void 0),x=r[0],m=r[1];return e.jsx(l.Provider,{value:{activeTab:c,animationDirection:x,defaultActive:a,isFit:s,hasPadding:n,handleTabClick:function(e){if(e===c)return m(void 0);c<e&&m("right"),e<c&&m("left"),null!=d&&d(e),u(e)},isFull:o},children:i})},exports.Tab=function(o){var d=o.children,c=o.index,u=o.className,x=o.barColor,m=o.disabled,g=void 0!==m&&m,m=o.badgeNumber,o=o.iconName,h=t.useContext(l),f=h.isFit,v=h.handleTabClick,b=h.activeTab,j=h.animationDirection,h=h.isFull,b=c===b;return e.jsx(s,{tabIndex:0,"data-testid":"design-system-textTab--item-".concat(c),className:r.twMerge("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",g&&"cursor-not-allowed",h&&"w-full",u),onClick:function(){g||v(c)},children:e.jsxs(s,{className:r.twMerge("relative flex w-max flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!f&&"px-[33.5px]",h&&"w-full px-0",b&&"font-medium text-w-gray-900"),children:[o&&e.jsx(s,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:e.jsx(n,{name:o,className:r.twMerge("size-4 text-w-gray-600 group-hover:text-w-gray-900",b&&"text-w-gray-900")})}),e.jsx(a,{variant:"body1",className:"relative",children:d}),m&&e.jsx(i,{text:m,className:"relative",variant:"gray"}),e.jsx("span",{"data-testid":"design-system-textTab--underbar-".concat(c),className:r.twMerge("absolute -bottom-px left-0 h-0.5 w-full rounded-t-lg bg-transparent",b&&"bg-w-gray-900 transition duration-500 ease-out ".concat("right"===(j||"")?"-left-1/2 translate-x-1/2":"left-1/2 -translate-x-1/2"),x)})]})})},exports.Tabs=function(i){var i=i.children,a=t.useContext(l),n=a.hasPadding,a=a.isFull;return e.jsxs(e.Fragment,{children:[e.jsx(s,{className:r.twJoin("block w-full items-start overflow-x-scroll scrollbar-hide",n&&"px-9"),"data-testid":"design-system-textTab--container",children:e.jsx(s,{className:r.twMerge("mb-px inline-flex w-full gap-10",a&&"gap-0"),children:i})}),e.jsx(o,{className:"w-full"})]})};

package/dist/Components/Organisms/TextTab/TextTab.stories.d.ts

@@ -6,3 +6,4 @@ export default meta;
 type Story = StoryObj<RootProps>;
 export declare const Default: Story;
 export declare const WithScroll: Story;
+export declare const IsFull: Story;

package/dist/Components/Organisms/TextTab/TextTab.types.d.ts

@@ -4,6 +4,7 @@ export interface RootProps extends PropsWithChildren {
     defaultActive?: number;
     isFit?: boolean;
     hasPadding?: boolean;
+    isFull?: boolean;
     onChange?: (index: number) => void;
 }
 export interface TabProps extends PropsWithChildren {
@@ -23,5 +24,6 @@ export type TabContextType = {
     animationDirection: 'right' | 'left' | undefined;
     isFit: boolean;
     hasPadding: boolean;
+    isFull: boolean;
     handleTabClick: (index: number) => void;
 };

package/dist/Components/Organisms/WithRichTooltip/WithRichTooltip.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+export interface WithRichTooltipProps extends PropsWithChildren {
+    size?: 'sm' | 'md';
+    variant?: 'right' | 'down';
+    title?: string;
+    description?: string;
+    className?: string;
+}
+declare const WithRichTooltip: ({ size, variant, title, description, children, className, }: WithRichTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export default WithRichTooltip;

package/dist/Components/Organisms/WithRichTooltip/WithRichTooltip.js

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),i=require("react"),r=(require("../../../_virtual/_tslib.js"),require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/Box/Box.js")),s=(require("../../Atoms/Radio/Radio.js"),require("../../Atoms/SystemIcon/SystemIcon.js")),o=(require("../../Atoms/TextField/TextField.js"),require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),require("../../Molecules/RichTooltip/RichTooltip.js"));module.exports=function(n){var c=n.size,c=void 0===c?"md":c,a=n.variant,a=void 0===a?"right":a,l=n.title,m=n.description,u=n.children,n=n.className,d="md"===c?"medium_information":"small_information",h="right"===a,a="down"===a,x=i.useState(!1),j=x[0],p=x[1];return e.jsxs(r,{className:"relative h-fit w-fit","data-testid":"design-system-withRichTooltip",children:[e.jsx(r,{"data-testid":"design-system-withRichTooltip--trigger",className:"flex h-fit w-fit shrink-0 items-center justify-center",onMouseEnter:function(){return p(!0)},onMouseLeave:function(){return p(!1)},onClick:function(){return p(function(e){return!e})},children:e.jsx(s,{name:d,className:"text-w-gray-400",testId:"md"===c?"design-system-withRichTooltip--trigger-icon-md":"design-system-withRichTooltip--trigger-icon-sm"})}),j&&e.jsx(o,{title:l,description:m,className:t.twMerge("absolute",h&&"left-[calc(100%_+_12px)] top-0",a&&"left-0 top-[calc(100%_+_12px)]",n),children:u})]})};

package/dist/Components/Organisms/WithRichTooltip/WithRichTooltip.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import WithRichTooltip from './WithRichTooltip';
+declare const meta: Meta<typeof WithRichTooltip>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/Components/Organisms/WithRichTooltip/index.d.ts

@@ -0,0 +1,2 @@
+import WithRichTooltip from './WithRichTooltip';
+export default WithRichTooltip;

package/dist/Components/Organisms/WithRichTooltip/index.js

@@ -0,0 +1 @@
+"use strict";var e=require("./WithRichTooltip.js");module.exports=e;

package/dist/Components/Organisms/index.d.ts

@@ -8,3 +8,4 @@ export type { SkillItem, LegacySkillItem } from './Autocomplete';
 export { default as TableOfContents } from './TableOfContents';
 export type { TableOfContentsProps, ContentItem } from './TableOfContents';
 export { default as Dialog } from './Dialog';
+export { default as WithRichTooltip } from './WithRichTooltip';

package/dist/index.js

@@ -1 +1 @@
-"use strict";var e=require("./Components/Atoms/Typography/Typography.js"),o=require("./Components/Atoms/Checkbox/Checkbox.js"),t=require("./Components/Atoms/CountBadge/CountBadge.js"),s=require("./Components/Atoms/Box/Box.js"),r=require("./Components/Atoms/ProductIcon/ProductIcon.js"),n=require("./Components/Atoms/Radio/Radio.js"),i=require("./Components/Atoms/Button/Button.js"),p=require("./Components/Atoms/LoadingIndicator/LoadingIndicator.js"),a=require("./Components/Atoms/TextField/TextField.js"),u=require("./Components/Atoms/Divider/Divider.js"),m=require("./Components/Atoms/ServiceLogo/ServiceLogo.js"),x=require("./Components/Atoms/Avatar/Avatar.js"),C=require("./Components/Atoms/Switch/Switch.js"),l=require("./Components/Atoms/SystemIcon/SystemIcon.js"),c=require("./Components/Atoms/NewBadge/NewBadge.js"),d=require("./Components/Atoms/ChoiceChip/ChoiceChip.js"),j=require("./Components/Atoms/Textarea/Textarea.js"),q=require("./Components/Atoms/IconButton/IconButton.js"),g=require("./Components/Atoms/SkillLabel/SkillLabel.js"),B=require("./Components/Atoms/ImageLabel/ImageLabel.js"),h=require("./Components/Atoms/Label/Label.js"),L=require("./Components/Atoms/ModalContext/ModalContext.js"),T=require("./Components/Molecules/WithBadge/WithBadge.js"),A=require("./Components/Molecules/GridLayout/GridLayout.js"),b=require("./Components/Molecules/CheckboxList/CheckboxList.js"),M=require("./Components/Molecules/CheckboxCard/CheckboxCard.js"),S=require("./Components/Molecules/RadioList/RadioList.js"),k=require("./Components/Molecules/MessageBox/MessageBox.js"),I=require("./Components/Molecules/TextButton/TextButton.js"),w=require("./Components/Molecules/InputChip/InputChip.js"),D=require("./Components/Molecules/List/List.js"),y=require("./Components/Molecules/Pagination/Pagination.js"),R=require("./Components/Molecules/Drawer/Drawer.js"),O=require("./Components/Molecules/SnackBar/SnackBar.js"),v=require("./Components/Molecules/Tooltip/Tooltip.js"),G=require("./Components/Molecules/RangeSlider/RangeSlider.js"),F=require("./Components/Molecules/RadioGroup/RadioGroup.js"),N=require("./Components/Organisms/TextTab/TextTab.js"),P=require("./Components/Organisms/GNBList/GNBList.js"),W=require("./Components/Organisms/TextFieldDropdown/TextFieldDropdown.js"),f=require("./Components/Organisms/TextButtonsDropdown/TextButtonsDropdown.js"),z=require("./Components/Organisms/WithSnackBar/WithSnackBar.js"),E=require("./Components/Organisms/Autocomplete/Autocomplete.js"),H=require("./Components/Organisms/TableOfContents/TableOfContents.js"),J=require("./Components/Organisms/Dialog/Dialog.js");exports.Typography=e,exports.Checkbox=o,exports.CountBadge=t,exports.Box=s,exports.ProductIcon=r,exports.Radio=n,exports.Button=i,exports.LoadingIndicator=p,exports.TextField=a,exports.Divider=u,exports.ServiceLogo=m,exports.Avatar=x,exports.Switch=C,exports.SystemIcon=l,exports.NewBadge=c,exports.ChoiceChip=d,exports.Textarea=j,exports.IconButton=q,exports.SkillLabel=g,exports.ImageLabel=B,exports.Label=h,exports.ModalContext=L,exports.WithBadge=T,exports.GridLayout=A,exports.CheckboxList=b,exports.CheckboxCard=M,exports.RadioList=S,exports.MessageBox=k,exports.TextButton=I,exports.InputChip=w,exports.List=D,exports.Pagination=y,exports.Drawer=R,exports.SnackBar=O,exports.Tooltip=v,exports.RangeSlider=G,exports.RadioGroup=F,exports.TextTab=N,exports.GNBList=P,exports.TextFieldDropdown=W,exports.TextButtonsDropdown=f,exports.WithSnackBar=z,exports.Autocomplete=E,exports.TableOfContents=H,exports.Dialog=J;
+"use strict";var e=require("./Components/Atoms/Typography/Typography.js"),o=require("./Components/Atoms/Checkbox/Checkbox.js"),t=require("./Components/Atoms/CountBadge/CountBadge.js"),s=require("./Components/Atoms/Box/Box.js"),r=require("./Components/Atoms/ProductIcon/ProductIcon.js"),n=require("./Components/Atoms/Radio/Radio.js"),i=require("./Components/Atoms/Button/Button.js"),p=require("./Components/Atoms/LoadingIndicator/LoadingIndicator.js"),a=require("./Components/Atoms/TextField/TextField.js"),u=require("./Components/Atoms/Divider/Divider.js"),m=require("./Components/Atoms/ServiceLogo/ServiceLogo.js"),x=require("./Components/Atoms/Avatar/Avatar.js"),l=require("./Components/Atoms/Switch/Switch.js"),C=require("./Components/Atoms/SystemIcon/SystemIcon.js"),c=require("./Components/Atoms/NewBadge/NewBadge.js"),d=require("./Components/Atoms/ChoiceChip/ChoiceChip.js"),j=require("./Components/Atoms/Textarea/Textarea.js"),q=require("./Components/Atoms/IconButton/IconButton.js"),g=require("./Components/Atoms/SkillLabel/SkillLabel.js"),h=require("./Components/Atoms/ImageLabel/ImageLabel.js"),B=require("./Components/Atoms/Label/Label.js"),T=require("./Components/Atoms/ModalContext/ModalContext.js"),L=require("./Components/Molecules/WithBadge/WithBadge.js"),A=require("./Components/Molecules/GridLayout/GridLayout.js"),b=require("./Components/Molecules/CheckboxList/CheckboxList.js"),M=require("./Components/Molecules/CheckboxCard/CheckboxCard.js"),S=require("./Components/Molecules/RadioList/RadioList.js"),k=require("./Components/Molecules/MessageBox/MessageBox.js"),I=require("./Components/Molecules/TextButton/TextButton.js"),R=require("./Components/Molecules/InputChip/InputChip.js"),w=require("./Components/Molecules/List/List.js"),D=require("./Components/Molecules/Pagination/Pagination.js"),y=require("./Components/Molecules/Drawer/Drawer.js"),O=require("./Components/Molecules/SnackBar/SnackBar.js"),v=require("./Components/Molecules/PlainTooltip/PlainTooltip.js"),G=require("./Components/Molecules/RichTooltip/RichTooltip.js"),P=require("./Components/Molecules/RangeSlider/RangeSlider.js"),W=require("./Components/Molecules/RadioGroup/RadioGroup.js"),F=require("./Components/Organisms/TextTab/TextTab.js"),N=require("./Components/Organisms/GNBList/GNBList.js"),f=require("./Components/Organisms/TextFieldDropdown/TextFieldDropdown.js"),z=require("./Components/Organisms/TextButtonsDropdown/TextButtonsDropdown.js"),E=require("./Components/Organisms/WithSnackBar/WithSnackBar.js"),H=require("./Components/Organisms/Autocomplete/Autocomplete.js"),J=require("./Components/Organisms/TableOfContents/TableOfContents.js"),K=require("./Components/Organisms/Dialog/Dialog.js"),Q=require("./Components/Organisms/WithRichTooltip/WithRichTooltip.js");exports.Typography=e,exports.Checkbox=o,exports.CountBadge=t,exports.Box=s,exports.ProductIcon=r,exports.Radio=n,exports.Button=i,exports.LoadingIndicator=p,exports.TextField=a,exports.Divider=u,exports.ServiceLogo=m,exports.Avatar=x,exports.Switch=l,exports.SystemIcon=C,exports.NewBadge=c,exports.ChoiceChip=d,exports.Textarea=j,exports.IconButton=q,exports.SkillLabel=g,exports.ImageLabel=h,exports.Label=B,exports.ModalContext=T,exports.WithBadge=L,exports.GridLayout=A,exports.CheckboxList=b,exports.CheckboxCard=M,exports.RadioList=S,exports.MessageBox=k,exports.TextButton=I,exports.InputChip=R,exports.List=w,exports.Pagination=D,exports.Drawer=y,exports.SnackBar=O,exports.PlainTooltip=v,exports.RichTooltip=G,exports.RangeSlider=P,exports.RadioGroup=W,exports.TextTab=F,exports.GNBList=N,exports.TextFieldDropdown=f,exports.TextButtonsDropdown=z,exports.WithSnackBar=E,exports.Autocomplete=H,exports.TableOfContents=J,exports.Dialog=K,exports.WithRichTooltip=Q;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wishket/design-system",
-  "version": "1.0.10",
+  "version": "1.1.0",
   "description": "Wishket Design System",
   "main": "dist/index.js",
   "module": "dist/index.es.js",

package/dist/Components/Molecules/Tooltip/Tooltip.d.ts

@@ -1,9 +0,0 @@
-import { ComponentProps } from 'react';
-export interface TooltipProps extends ComponentProps<'div'> {
-    variant?: 'plain' | 'rich';
-    direction?: 'up' | 'down' | 'left' | 'right';
-    title?: string;
-    description?: string;
-}
-declare const Tooltip: ({ direction, children, className, variant, title, description, }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
-export default Tooltip;

package/dist/Components/Molecules/Tooltip/Tooltip.js

@@ -1 +0,0 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),s=require("../../Atoms/Typography/Typography.js"),r=(require("../../Atoms/Checkbox/Checkbox.js"),require("../../Atoms/Box/Box.js")),a=(require("../../../_virtual/_tslib.js"),require("../../Atoms/Radio/Radio.js"),require("react"),require("../../Atoms/SystemIcon/Icons/Small/SmallScrap.js"),require("../../Atoms/SystemIcon/Icons/Small/SmallBell.js"),require("../../Atoms/SystemIcon/Icons/Medium/MediumEdit.js"),require("../../Atoms/TextField/TextField.js"),require("../../Atoms/ChoiceChip/ChoiceChip.js"),require("../../Atoms/Label/Label.js"),require("../../Atoms/ModalContext/ModalContext.parts.js"),require("./Tooltip.parts.js"));module.exports=function(i){var o=i.direction,o=void 0===o?"up":o,l=i.children,n=i.className,d=i.variant,c=i.title,i=i.description;return e.jsx(r,{"data-testid":"design-system-toolTip",className:n,children:"rich"===(void 0===d?"plain":d)?e.jsxs(r,{className:t.twMerge("flex w-full flex-col gap-1 rounded-xl bg-white px-6 py-5 shadow-graymedium tablet:w-80 desktop:w-80"),"data-testid":"design-system-toolTip--rich",children:[e.jsx(r,{className:"flex w-full items-start justify-between gap-4",children:e.jsx(s,{variant:"body2",className:"font-medium text-w-gray-900",children:c})}),e.jsx(s,{variant:"body3",className:"text-w-gray-400",children:i})]}):e.jsxs(r,{className:"relative h-fit w-fit select-none border-none opacity-80 outline-none","data-testid":"design-system-toolTip--plain",children:[e.jsx(a.Arrow,{testId:"design-system-toolTip--arrow",className:t.twMerge("absolute z-10","down"===o&&"-bottom-[7px] left-1/2 translate-x-[-50%] -rotate-90","up"===o&&"-top-[7px] left-1/2 translate-x-[-50%] rotate-90","left"===o&&"-left-[4.8px] top-1/2 translate-y-[-50%] rotate-0","right"===o&&"-right-[4.8px] top-1/2 translate-y-[-50%] rotate-180")}),e.jsx(r,{className:"z-0 flex h-auto min-h-[28px] w-full items-center justify-center rounded-lg bg-w-black px-3 py-1 text-center",children:e.jsx(s,{variant:"body3",className:"whitespace-pre text-wrap break-all font-medium text-w-white opacity-100",children:l})})]})})};

package/dist/Components/Molecules/Tooltip/index.d.ts

@@ -1,2 +0,0 @@
-import Tooltip from './Tooltip';
-export default Tooltip;

package/dist/Components/Molecules/Tooltip/index.js

@@ -1 +0,0 @@
-"use strict";var e=require("./Tooltip.js");module.exports=e;