@wishket/design-system 1.6.2 → 1.7.0

package/dist/Components/Base/Layouts/FullBleed/FullBleed.d.ts

@@ -3,6 +3,7 @@ interface FullBleedProps extends ComponentPropsWithRef<'div'> {
     className?: string;
     insideContainerClassName?: string;
     maxWidth?: string;
+    paddingAdjustment?: string | number;
 }
 /**
  * 화면 전체 너비를 활용하는 레이아웃 컴포넌트
@@ -11,6 +12,7 @@ interface FullBleedProps extends ComponentPropsWithRef<'div'> {
  * @param {string} [props.maxWidth] - 최대 너비 설정
  * @param {string} [props.className] - 외부 컨테이너 클래스
  * @param {string} [props.insideContainerClassName] - 내부 컨테이너 클래스
+ * @param {string | number} [props.paddingAdjustment] - 패딩 보정값(단위 : px)
  */
 declare const FullBleed: import("react").ForwardRefExoticComponent<Omit<FullBleedProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default FullBleed;

package/dist/Components/Base/Layouts/FullBleed/FullBleed.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("react"),d=require("tailwind-merge"),i=require("./FullBleed.utils.js"),l=t.forwardRef(function(l,r){var c=l.className,n=l.insideContainerClassName,s=l.maxWidth,s=void 0===s?"1200px":s,o=l.children,l=e.__rest(l,["className","insideContainerClassName","maxWidth","children"]),m=t.useState(function(){return i.calculateScrollbarWidth()}),p=m[0],x=m[1],m=i.getPaddingFromClassName(n,"mobile"),g=i.getPaddingFromClassName(n,"tablet"),u=i.getPaddingFromClassName(n,"desktop"),g=(t.useEffect(function(){x(i.calculateScrollbarWidth())},[]),{"--dynamic-padding-left-tablet":"max(".concat(g.left||g.x,"px, ").concat(m.left||m.x,"px)"),"--dynamic-padding-right-tablet":"max(".concat(g.right||g.x,"px, ").concat(m.right||m.x,"px)"),"--dynamic-padding-left-desktop":"max(calc((100dvw - ".concat(s,")/2 + ").concat(m.left+m.right||2*m.x,"px), ").concat(u.x,"px)"),"--dynamic-padding-right-desktop":"max(calc((100dvw - ".concat(s,")/2 + ").concat(m.right+m.left||2*m.x,"px), ").concat(u.x,"px)")}),s={"--dynamic-bleed-width":"calc(100dvw - ".concat(p,"px)")};return a.jsx("div",{"data-testid":"design-system-full-bleed",children:a.jsx("div",{"data-testid":"design-system-full-bleed--container",className:d.twMerge("relative left-1/2 top-0 h-full w-[var(--dynamic-bleed-width)] -translate-x-1/2",c),style:s,children:a.jsx("div",e.__assign({"data-testid":"design-system-full-bleed--container-inside",className:d.twMerge("flex w-full overflow-x-auto px-5 scrollbar-hide","tablet:pl-[var(--dynamic-padding-left-tablet)] tablet:pr-[var(--dynamic-padding-right-tablet)]","desktop:pl-[var(--dynamic-padding-left-desktop)] desktop:pr-[var(--dynamic-padding-right-desktop)]",n),style:g,ref:r},l,{children:o}))})})});l.displayName="FullBleed",module.exports=l;
+"use strict";var e=require("../../../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("react"),d=require("tailwind-merge"),i=require("./FullBleed.utils.js"),l=t.forwardRef(function(l,c){var n=l.className,r=l.insideContainerClassName,s=l.maxWidth,s=void 0===s?"1200px":s,o=l.paddingAdjustment,o=void 0===o?8.5:o,m=l.children,l=e.__rest(l,["className","insideContainerClassName","maxWidth","paddingAdjustment","children"]),p=t.useState(function(){return i.calculateScrollbarWidth()}),x=p[0],g=p[1],p=i.getPaddingFromClassName(r,"mobile"),u=i.getPaddingFromClassName(r,"tablet"),f=i.getPaddingFromClassName(r,"desktop"),u=(t.useEffect(function(){g(i.calculateScrollbarWidth())},[]),{"--dynamic-padding-left-tablet":"max(".concat(u.left||u.x,"px, ").concat(p.left||p.x,"px)"),"--dynamic-padding-right-tablet":"max(".concat(u.right||u.x,"px, ").concat(p.right||p.x,"px)"),"--dynamic-padding-left-desktop":"calc(max(calc((100dvw - ".concat(s,")/2 + ").concat(p.left||p.x,"px + ").concat(o,"px), ").concat(f.x,"px))"),"--dynamic-padding-right-desktop":"calc(max(calc((100dvw - ".concat(s,")/2 + ").concat(p.right||p.x,"px + ").concat(o,"px), ").concat(f.x,"px))")}),s={"--dynamic-bleed-width":"calc(100dvw - ".concat(x,"px)")};return a.jsx("div",{"data-testid":"design-system-full-bleed",children:a.jsx("div",{"data-testid":"design-system-full-bleed--container",className:d.twMerge("relative left-1/2 top-0 h-full w-[var(--dynamic-bleed-width)] -translate-x-1/2",n),style:s,children:a.jsx("div",e.__assign({"data-testid":"design-system-full-bleed--container-inside",className:d.twMerge("flex w-full overflow-x-auto px-5 scrollbar-hide","tablet:pl-[var(--dynamic-padding-left-tablet)] tablet:pr-[var(--dynamic-padding-right-tablet)]","desktop:pl-[var(--dynamic-padding-left-desktop)] desktop:pr-[var(--dynamic-padding-right-desktop)]",r),style:u,ref:c},l,{children:m}))})})});l.displayName="FullBleed",module.exports=l;

package/dist/Components/Inputs/Checkbox/Checkbox.parts.js

@@ -1 +1 @@
-"use strict";var r=require("react/jsx-runtime"),e=require("tailwind-merge"),t="text-w-white group-hover:text-w-white",o="text-w-gray-200 group-hover:text-w-gray-200",s="stroke-dasharray-[16] stroke-dashoffset-[16] animate-checkbox-check",a=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-transparent",a&&(!d&&i?t:"text-transparent")),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},i=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-w-gray-200 group-hover:text-w-primary",d&&!i&&"text-w-red-500 group-hover:text-w-red-500",a&&(!d&&i?t:o)),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},d=function(t){var o=t.className,s=t.checked,a=t.disabled,t=t.isError,i="text-w-gray-100";return r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge(t?a?i:"text-w-red-500":a?s?"text-primary-100":i:s?"text-primary":"text-w-gray-200",o),"data-testid":"design-system--sub-checkbox",children:r.jsx("path",{d:"M4 8.76667L7.75004 12.5L14.0001 5.5",stroke:"currentColor",strokeWidth:"1.4",strokeLinecap:"round",strokeLinejoin:"round"})})};exports.CheckboxButton=function(t){var o=t.type,s=t.disabled,n=t.checked,n=void 0!==n&&n,c=t.isError,l=t.isFocused,t=t.className,w="circle"===o?"rounded-full":"rounded";return"sub"===o?r.jsx(d,{className:t,checked:n,disabled:s,isError:c}):r.jsxs("div",{className:e.twMerge("group relative m-px box-border size-4 cursor-pointer border",w,s?n?c?"bg-w-gray-50 border-w-gray-200 cursor-not-allowed":"bg-primary-100 border-primary-100 cursor-not-allowed":"border-w-gray-200 bg-w-gray-50 cursor-not-allowed":l&&!c?n?"bg-primary-500 border-primary-500":"border-primary-500 bg-w-white":c?n?"border-w-red-500 bg-w-red-500":"border-w-red-500 bg-w-white":n?"bg-primary-500 border-primary-500":"group-hover:border-primary-500 border-w-gray-200 bg-white",t),role:"checkbox-button",children:["box"===o&&r.jsx(a,{checked:n,isError:c,disabled:s}),"circle"===o&&r.jsx(i,{checked:n,isError:c,disabled:s})]})};
+"use strict";var r=require("react/jsx-runtime"),e=require("tailwind-merge"),t="text-w-white group-hover:text-w-white",o="text-w-gray-200 group-hover:text-w-gray-200",s="stroke-dasharray-[16] stroke-dashoffset-[16] animate-checkbox-check",a=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-transparent",a&&(!d&&i?t:"text-transparent")),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},i=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-w-gray-200 group-hover:text-w-primary",d&&!i&&"text-w-red-500 group-hover:text-w-red-500",a&&(!d&&i?t:o)),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},d=function(t){var o=t.role,s=t.className,a=t.checked,i=t.disabled,t=t.isError,d="text-w-gray-100";return r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",role:o,className:e.twMerge("cursor-pointer",i&&"cursor-not-allowed",t?i?d:"text-w-red-500":i?a?"text-primary-100":d:a?"text-primary":"text-w-gray-200",s),"data-testid":"design-system--sub-checkbox",children:r.jsx("path",{d:"M4 8.76667L7.75004 12.5L14.0001 5.5",stroke:"currentColor",strokeWidth:"1.4",strokeLinecap:"round",strokeLinejoin:"round"})})};exports.CheckboxButton=function(t){var o=t.type,s=t.disabled,n=t.checked,n=void 0!==n&&n,c=t.isError,l=t.isFocused,t=t.className,w="circle"===o?"rounded-full":"rounded";return"sub"===o?r.jsx(d,{role:"checkbox-button",className:t,checked:n,disabled:s,isError:c}):r.jsxs("div",{className:e.twMerge("group relative m-px box-border size-4 cursor-pointer border",w,s?n?c?"bg-w-gray-50 border-w-gray-200 cursor-not-allowed":"bg-primary-100 border-primary-100 cursor-not-allowed":"border-w-gray-200 bg-w-gray-50 cursor-not-allowed":l&&!c?n?"bg-primary-500 border-primary-500":"border-primary-500 bg-w-white":c?n?"border-w-red-500 bg-w-red-500":"border-w-red-500 bg-w-white":n?"bg-primary-500 border-primary-500":"group-hover:border-primary-500 border-w-gray-200 bg-white",t),role:"checkbox-button",children:["box"===o&&r.jsx(a,{checked:n,isError:c,disabled:s}),"circle"===o&&r.jsx(i,{checked:n,isError:c,disabled:s})]})};

package/dist/Components/Inputs/Checkbox/Checkbox.types.d.ts

@@ -12,6 +12,7 @@ export interface CheckMarkProps {
 }
 export type CheckboxProps = CheckboxButtonProps & ComponentPropsWithRef<'input'>;
 export interface SubCheckboxProps {
+    role?: string;
     className?: string;
     checked?: boolean;
     disabled?: boolean;

package/dist/Components/Inputs/SearchField/SearchField.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("react"),t=(require("tailwind-merge"),require("../../Base/Layouts/Box/Box.js")),a=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),n=require("../TextButtonDropdown/TextButtonDropdown.js"),i=require("../TextFieldContainer/TextFieldContainer.js"),u=require("../Input/Input.js");require("../Input/PasswordInput.js"),require("../Input/LableInput.js"),require("../Input/InputTypeSelector.js"),module.exports=function(l){l.type;var o=l.onSearch,c=(l.className,l.disabled),d=l.spellCheck,p=l.onFocus,j=l.onBlur,m=l.filters,l=e.__rest(l,["type","onSearch","className","disabled","spellCheck","onFocus","onBlur","filters"]),x=r.useState(!1),q=x[0],h=x[1];return s.jsx("form",{onSubmit:function(e){e.preventDefault(),o()},"data-testid":"design-system-search-field",children:s.jsx("label",{className:"cursor-text",children:s.jsxs(i,{isFocused:q,isDisabled:c,children:[!!m&&s.jsx(t,{className:"shrink-0",children:s.jsx(n,e.__assign({},m))}),s.jsx(u,e.__assign({onFocus:function(e){h(!0),null!=p&&p(e)},onBlur:function(e){h(!1),null!=j&&j(e)},spellCheck:d||!1},l)),s.jsx("button",{type:"submit",className:"shrink-0",children:s.jsx(a,{name:"medium_search",className:"pointer-events-none text-w-gray-600"})})]})})})};
+"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("react"),t=(require("tailwind-merge"),require("../../Base/Layouts/Box/Box.js")),a=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),i=require("../TextButtonDropdown/TextButtonDropdown.js"),n=require("../TextFieldContainer/TextFieldContainer.js"),l=require("../Input/Input.js");require("../Input/PasswordInput.js"),require("../Input/LableInput.js"),require("../Input/InputTypeSelector.js"),module.exports=function(u){u.type;var o=u.onSearch,c=(u.className,u.disabled),d=u.spellCheck,p=u.onFocus,j=u.onBlur,m=u.filters,u=e.__rest(u,["type","onSearch","className","disabled","spellCheck","onFocus","onBlur","filters"]),x=r.useState(!1),q=x[0],h=x[1];return s.jsx("form",{onSubmit:function(e){e.preventDefault(),o()},"data-testid":"design-system-search-field",children:s.jsx("label",{className:"cursor-text",children:s.jsxs(n,{isFocused:q,isDisabled:c,className:"overflow-visible",children:[!!m&&s.jsx(t,{className:"shrink-0",children:s.jsx(i,e.__assign({},m))}),s.jsx(l,e.__assign({onFocus:function(e){h(!0),null!=p&&p(e)},onBlur:function(e){h(!1),null!=j&&j(e)},spellCheck:d||!1,disabled:c},u)),s.jsx("button",{type:"submit",className:"shrink-0",children:s.jsx(a,{name:"medium_search",className:"pointer-events-none text-w-gray-600"})})]})})})};

package/dist/Components/Inputs/SegmentedControl/SegmentedControl.d.ts

@@ -1,9 +1,11 @@
+type SegmentedControlSize = 'sm' | 'md';
 interface SegmentedControlProps {
     valueList: {
         key: string;
         name: string;
     }[];
     selectedValue: string;
+    size?: SegmentedControlSize;
     name?: string;
     onChange: (value: string) => void;
 }
@@ -11,6 +13,7 @@ interface SegmentedControlProps {
  * 여러 옵션 중 하나를 선택할 수 있는 세그먼트 컨트롤 컴포넌트입니다.
  *
  * @param {Object} props
+ * @param {'sm' | 'md'} [props.size='md'] - 세그먼트 컨트롤 크기
  * @param {Array<{key: string, name: string}>} props.valueList - 선택 가능한 옵션들의 배열 ({key, name}[])
  * @param {string} props.selectedValue - 현재 선택된 옵션의 key 값
  * @param {string} [props.name='segmented-control'] - 라디오 그룹의 name 속성
@@ -35,5 +38,5 @@ interface SegmentedControlProps {
  * );
  * ```
  */
-declare const SegmentedControl: ({ valueList, selectedValue, name, onChange, }: SegmentedControlProps) => import("react/jsx-runtime").JSX.Element;
+declare const SegmentedControl: ({ valueList, selectedValue, size, name, onChange, }: SegmentedControlProps) => import("react/jsx-runtime").JSX.Element;
 export default SegmentedControl;

package/dist/Components/Inputs/SegmentedControl/SegmentedControl.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),a=require("../../Base/Typography/Typography.js"),t=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js"),module.exports=function(n){var s=n.valueList,i=n.selectedValue,l=n.name,d=void 0===l?"segmented-control":l,u=n.onChange;return e.jsx(t,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":"segmented control","data-testid":"design-system--segmented-control",children:s.map(function(t,n){var l=n===s.length-1,o=i===t.key;return e.jsxs("label",{className:r.twJoin("relative cursor-pointer",o?"border border-primary bg-primary-50 px-[15px] py-[11px] text-primary":"bg-w-gray-50 px-4 py-3 text-w-gray-300",0===n&&"rounded-l-xl",l&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[e.jsx("input",{type:"radio",name:d,value:t.key,checked:o,"aria-checked":o,onChange:function(e){return u(e.target.value)},className:"absolute h-0 w-0 opacity-0"}),e.jsx(a,{variant:"body1",children:t.name})]},t.key)})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),t=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js"),module.exports=function(s){var o=s.valueList,i=s.selectedValue,n=s.size,u=void 0===n?"md":n,n=s.name,c=void 0===n?"segmented-control":n,m=s.onChange,p={sm:{selected:"px-[15px] py-[7px]",unselected:"px-4 py-2"},md:{selected:"px-[15px] py-[11px]",unselected:"px-4 py-3"}};return e.jsx(a,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":"segmented control","data-testid":"design-system--segmented-control",children:o.map(function(a,s){var n=s===o.length-1,l=i===a.key,d=l&&"sm"===u;return e.jsxs("label",{className:r.twJoin("relative cursor-pointer select-none text-center",l?"border border-primary bg-primary-10 text-primary":"bg-w-gray-50 text-w-gray-300",l?p[u].selected:p[u].unselected,0===s&&"rounded-l-xl",n&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[e.jsx("input",{type:"radio",name:c,value:a.key,checked:l,"aria-checked":l,onChange:function(e){return m(e.target.value)},className:"absolute h-0 w-0 opacity-0"}),e.jsx(t,{variant:"md"===u?"body1":"body2",className:r.twJoin(d?"font-medium":"font-normal"),children:a.name})]},a.key)})})};

package/dist/Components/Inputs/TextFieldContainer/TextFieldContainer.d.ts

@@ -12,7 +12,8 @@ interface TextFieldContainerProps extends PropsWithChildren {
     isTextarea?: boolean;
     isAutoComplete?: boolean;
     testId?: string;
+    className?: string;
     onClick?: () => void;
 }
-declare const TextFieldContainer: ({ children, leadingIcon, trailingIcon, isLeadingIconSolid, isTrailingIconSolid, measure, isFocused, isDisabled, isError, onClick, isTextarea, isAutoComplete, testId, }: TextFieldContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const TextFieldContainer: ({ children, className, leadingIcon, trailingIcon, isLeadingIconSolid, isTrailingIconSolid, measure, isFocused, isDisabled, isError, onClick, isTextarea, isAutoComplete, testId, }: TextFieldContainerProps) => import("react/jsx-runtime").JSX.Element;
 export default TextFieldContainer;

package/dist/Components/Inputs/TextFieldContainer/TextFieldContainer.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),i=require("../../Base/Typography/Typography.js"),s=require("../../Base/Layouts/Box/Box.js"),a=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));module.exports=function(t){var l=t.children,o=t.leadingIcon,n=t.trailingIcon,d=t.isLeadingIconSolid,c=t.isTrailingIconSolid,u=t.measure,y=t.isFocused,g=t.isDisabled,x=t.isError,m=t.onClick,p=t.isTextarea,w=t.isAutoComplete,t=t.testId;return e.jsxs(s,{className:r.twMerge("group flex w-full items-center gap-3 overflow-hidden rounded-xl border bg-w-white px-4 py-[11px]",g?"border-w-gray-200":x?"border-w-red-500":y?"border-primary":"border-w-gray-200 hover:border-primary",g&&"cursor-not-allowed bg-w-gray-10",p&&"relative p-0",w&&"flex-wrap"),"data-testid":t||"design-system--text-field-container",onClick:m,children:[o&&e.jsx(a,{name:o,solid:d,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-leading-icon"}),l,u&&e.jsx(i,{variant:"body1",className:"w-fit shrink-0 text-w-gray-400",children:u}),n&&e.jsx(a,{name:n,solid:c,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-trailing-icon"})]})};
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));module.exports=function(t){var l=t.children,o=t.className,n=t.leadingIcon,d=t.trailingIcon,c=t.isLeadingIconSolid,u=t.isTrailingIconSolid,y=t.measure,g=t.isFocused,m=t.isDisabled,x=t.isError,p=t.onClick,w=t.isTextarea,b=t.isAutoComplete,t=t.testId;return e.jsxs(a,{className:r.twMerge("group flex w-full items-center gap-3 overflow-hidden rounded-xl border bg-w-white px-4 py-[11px]",m?"border-w-gray-200":x?"border-w-red-500":g?"border-primary":"border-w-gray-200 hover:border-primary",m&&"cursor-not-allowed bg-w-gray-10",w&&"relative p-0",b&&"flex-wrap",o),"data-testid":t||"design-system--text-field-container",onClick:p,children:[n&&e.jsx(i,{name:n,solid:c,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-leading-icon"}),l,y&&e.jsx(s,{variant:"body1",className:"w-fit shrink-0 text-w-gray-400",children:y}),d&&e.jsx(i,{name:d,solid:u,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-trailing-icon"})]})};

package/dist/config/tailwind-plugins.js

@@ -5,6 +5,7 @@ export const customizedPlugin = plugin(function ({ addUtilities, addBase, addVar
     '.scrollbar-list': {
       '&::-webkit-scrollbar': {
         width: '18px',
+        height: '18px',
       },
       '&::-webkit-scrollbar-track': {
         background: 'transparent',

package/package.json

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