@bothub-chat/ui 2.48.1-fix-message-79169952-1f6d-4889-beff-6002523e5f27 → 2.48.1-fix-message-79720dcc-0313-4bb2-ac15-912e6fc16d36

package/dist/components/scrollbar/shadow/styled.js

@@ -1 +1 @@
-import{styled as t,css as e}from"styled-components";import{animated as o}from"@react-spring/web";import{adaptive as i}from"../../../adaptive/index.js";const s=t.span.withConfig({displayName:"styled__ScrollbarShadowStyled",componentId:"sc-mta907-0"})(["display:inline-flex;position:absolute;z-index:",";pointer-events:none;overflow:hidden;"," "," ",""],({theme:t})=>t.zIndex.scrollbarShadow,({$side:t})=>{switch(t){case"left":case"top":return e(["top:0px;left:0px;"]);case"right":return e(["top:0px;right:0px;"]);case"bottom":return e(["bottom:0px;left:0px;"])}},({$side:t,$scrollbarSize:o,$disabled:i})=>{if(i)switch(t){case"left":case"right":return e(["height:100%;"]);case"top":case"bottom":return e(["width:100%;"])}switch(t){case"left":case"right":return e(["height:calc(100% - ","px);"],o);case"top":case"bottom":return e(["width:calc(100% - ","px);"],o)}},i(({$side:t})=>{switch(t){case"left":case"right":return{touch:e(["height:100%;"])};case"top":case"bottom":return{touch:e(["width:100%;"])}}})),r=t(o.span).withConfig({displayName:"styled__ScrollbarShadowContent",componentId:"sc-mta907-1"})(["display:inline-flex;position:relative;width:100%;height:100%;"]);export{r as ScrollbarShadowContent,s as ScrollbarShadowStyled};
+import{styled as t,css as e}from"styled-components";import{animated as o}from"@react-spring/web";import{adaptive as i}from"../../../adaptive/index.js";const s=t.span.withConfig({displayName:"styled__ScrollbarShadowStyled",componentId:"sc-mta907-0"})(["display:inline-flex;position:absolute;z-index:",";pointer-events:none;overflow:hidden;"," "," ",""],(({theme:t})=>t.zIndex.scrollbarShadow),(({$side:t})=>{switch(t){case"left":case"top":return e(["top:0px;left:0px;"]);case"right":return e(["top:0px;right:0px;"]);case"bottom":return e(["bottom:0px;left:0px;"])}}),(({$side:t,$scrollbarSize:o,$disabled:i})=>{if(i)switch(t){case"left":case"right":return e(["height:100%;"]);case"top":case"bottom":return e(["width:100%;"])}switch(t){case"left":case"right":return e(["height:calc(100% - ","px);"],o);case"top":case"bottom":return e(["width:calc(100% - ","px);"],o)}}),i((({$side:t})=>{switch(t){case"left":case"right":return{touch:e(["height:100%;"])};case"top":case"bottom":return{touch:e(["width:100%;"])}}}))),r=t(o.span).withConfig({displayName:"styled__ScrollbarShadowContent",componentId:"sc-mta907-1"})(["display:inline-flex;position:relative;width:100%;height:100%;"]);export{r as ScrollbarShadowContent,s as ScrollbarShadowStyled};

package/dist/components/scrollbar/style/styled.js

@@ -1 +1 @@
-import{css as r}from"styled-components";const o=r(["&::-webkit-scrollbar{width:6px;height:6px;background:",";}&::-webkit-scrollbar-thumb{background:",";}&::-webkit-scrollbar-track{background:",";}&::-webkit-scrollbar-corner{display:none;}"],({theme:r})=>r.colors.grayScale.gray4,({theme:r})=>r.colors.accent.primaryLight,({theme:r})=>r.colors.grayScale.gray5);export{o as ScrollbarStyle};
+import{css as r}from"styled-components";const o=r(["&::-webkit-scrollbar{width:6px;height:6px;background:",";}&::-webkit-scrollbar-thumb{background:",";}&::-webkit-scrollbar-track{background:",";}&::-webkit-scrollbar-corner{display:none;}"],(({theme:r})=>r.colors.grayScale.gray4),(({theme:r})=>r.colors.accent.primaryLight),(({theme:r})=>r.colors.grayScale.gray5));export{o as ScrollbarStyle};

package/dist/components/scrollbar/styled.d.ts

@@ -11,7 +11,7 @@ export interface ScrollbarContentProps {
 }
 export declare const ScrollbarContent: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ScrollbarContentProps>>;
 export declare const ScrollbarShadows: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").Ref<HTMLDivElement> | undefined;
+    ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -60,10 +60,6 @@ export declare const ScrollbarShadows: import("styled-components").IStyledCompon
     results?: number | undefined | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
-    popover?: "" | "auto" | "manual" | undefined | undefined;
-    popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
-    popoverTarget?: string | undefined | undefined;
-    inert?: boolean | undefined | undefined;
     inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
     is?: string | undefined | undefined;
     exportparts?: string | undefined | undefined;
@@ -273,8 +269,6 @@ export declare const ScrollbarShadows: import("styled-components").IStyledCompon
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onScrollEnd?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onScrollEndCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
@@ -283,14 +277,6 @@ export declare const ScrollbarShadows: import("styled-components").IStyledCompon
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
-    onBeforeToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancel?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRun?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStart?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
 }>;

package/dist/components/scrollbar/styled.js

@@ -1 +1 @@
-import{styled as e,css as o}from"styled-components";import{adaptive as r}from"../../adaptive/index.js";const i=e.div.withConfig({displayName:"styled__ScrollbarStyled",componentId:"sc-tlqpsa-0"})(["position:relative;width:inherit;height:inherit;overflow:",";"],({$overflow:e})=>{switch(e){case"auto":return"hidden";case"visible":return"visible"}}),t=e.div.withConfig({displayName:"styled__ScrollbarContent",componentId:"sc-tlqpsa-1"})(["position:relative;width:inherit;height:inherit;overflow:",";",""],({$overflow:e})=>{switch(e){case"auto":return"auto";case"visible":return"visible"}},({theme:e,$disabled:i,$size:t,$variant:a})=>i?o(["&::-webkit-scrollbar{display:none;}"]):o(["&::-webkit-scrollbar{width:",";height:",";background:",";","}&::-webkit-scrollbar-thumb{background:",";","}&::-webkit-scrollbar-track{background:",";","}&::-webkit-scrollbar-corner{display:none;}",""],`${t}px`,`${t}px`,e.colors.grayScale.gray4,"secondary"===a&&o(["border-radius:",";"],t/2+"px"),"light"===e.mode?e.colors.accent.primary:e.colors.accent.primaryLight,"secondary"===a&&o(["border-radius:",";"],t/2+"px"),({theme:e})=>"light"===e.mode?e.colors.grayScale.gray4:e.colors.grayScale.gray5,"secondary"===a&&o(["border-radius:",";"],t/2+"px"),r(()=>({touch:o(["&::-webkit-scrollbar{display:none;}"])})))),a=e.div.withConfig({displayName:"styled__ScrollbarShadows",componentId:"sc-tlqpsa-2"})(["position:absolute;top:0px;bottom:0px;left:0px;right:0px;pointer-events:none;"]);export{t as ScrollbarContent,a as ScrollbarShadows,i as ScrollbarStyled};
+import{styled as e,css as o}from"styled-components";import{adaptive as r}from"../../adaptive/index.js";const i=e.div.withConfig({displayName:"styled__ScrollbarStyled",componentId:"sc-tlqpsa-0"})(["position:relative;width:inherit;height:inherit;overflow:",";"],(({$overflow:e})=>{switch(e){case"auto":return"hidden";case"visible":return"visible"}})),t=e.div.withConfig({displayName:"styled__ScrollbarContent",componentId:"sc-tlqpsa-1"})(["position:relative;width:inherit;height:inherit;overflow:",";",""],(({$overflow:e})=>{switch(e){case"auto":return"auto";case"visible":return"visible"}}),(({theme:e,$disabled:i,$size:t,$variant:a})=>i?o(["&::-webkit-scrollbar{display:none;}"]):o(["&::-webkit-scrollbar{width:",";height:",";background:",";","}&::-webkit-scrollbar-thumb{background:",";","}&::-webkit-scrollbar-track{background:",";","}&::-webkit-scrollbar-corner{display:none;}",""],`${t}px`,`${t}px`,e.colors.grayScale.gray4,"secondary"===a&&o(["border-radius:",";"],t/2+"px"),"light"===e.mode?e.colors.accent.primary:e.colors.accent.primaryLight,"secondary"===a&&o(["border-radius:",";"],t/2+"px"),(({theme:e})=>"light"===e.mode?e.colors.grayScale.gray4:e.colors.grayScale.gray5),"secondary"===a&&o(["border-radius:",";"],t/2+"px"),r((()=>({touch:o(["&::-webkit-scrollbar{display:none;}"])})))))),a=e.div.withConfig({displayName:"styled__ScrollbarShadows",componentId:"sc-tlqpsa-2"})(["position:absolute;top:0px;bottom:0px;left:0px;right:0px;pointer-events:none;"]);export{t as ScrollbarContent,a as ScrollbarShadows,i as ScrollbarStyled};

package/dist/components/section/styled.d.ts

@@ -11,4 +11,6 @@ export declare const SectionContent: import("styled-components").IStyledComponen
 export interface SectionContainerProps {
     $fullHeight: boolean;
 }
-export declare const SectionContainer: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("@/ui/components/container").ContainerProps, SectionContainerProps>>;
+export declare const SectionContainer: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<Omit<import("@/ui/components/container").ContainerProps, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, SectionContainerProps>>;

package/dist/components/section/styled.js

@@ -1,18 +1,18 @@
-import{styled as e,css as i}from"styled-components";import t from"./assets/bg-lines.svg.js";import{Container as o}from"../container/index.js";const n=e.section.withConfig({displayName:"styled__SectionStyled",componentId:"sc-1rvaal9-0"})(["background:",";"," "," ",""],({theme:e})=>e.colors.base.black,({$bgLines:e})=>e&&i`
+import{styled as e,css as i}from"styled-components";import t from"./assets/bg-lines.svg.js";import{Container as o}from"../container/index.js";const n=e.section.withConfig({displayName:"styled__SectionStyled",componentId:"sc-1rvaal9-0"})(["background:",";"," "," ",""],(({theme:e})=>e.colors.base.black),(({$bgLines:e})=>e&&i`
       background-image: url(${JSON.stringify(t)});
       background-position: center;
       background-repeat: no-repeat;
       background-size: 1291px 4797px;
-    `,({$bg:e})=>e&&i`
+    `),(({$bg:e})=>e&&i`
       position: relative;
       overflow: hidden;
-    `,({$fullHeight:e})=>e&&i`
+    `),(({$fullHeight:e})=>e&&i`
       min-height: calc(100vh - ${({theme:e})=>e.header.height});
       @media (max-width: ${({theme:e})=>e.mobile.maxWidth}) {
         min-height: calc(100vh - ${({theme:e})=>e.header.mobile.height});
       }
-    `),a=e.div.withConfig({displayName:"styled__SectionContent",componentId:"sc-1rvaal9-1"})(["position:relative;",""],({$fullHeight:e})=>e&&i`
+    `)),a=e.div.withConfig({displayName:"styled__SectionContent",componentId:"sc-1rvaal9-1"})(["position:relative;",""],(({$fullHeight:e})=>e&&i`
       min-height: inherit;
-    `),h=e(o).withConfig({displayName:"styled__SectionContainer",componentId:"sc-1rvaal9-2"})(["",""],({$fullHeight:e})=>e&&i`
+    `)),h=e(o).withConfig({displayName:"styled__SectionContainer",componentId:"sc-1rvaal9-2"})(["",""],(({$fullHeight:e})=>e&&i`
       min-height: inherit;
-    `);export{h as SectionContainer,a as SectionContent,n as SectionStyled};
+    `));export{h as SectionContainer,a as SectionContent,n as SectionStyled};

package/dist/components/select-field/context.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 export interface SelectFieldContextValue {
-    selectRef: React.RefObject<HTMLElement | null>;
+    selectRef: React.RefObject<HTMLElement>;
     handleSelectClick: React.MouseEventHandler<HTMLElement>;
 }
 export declare const SelectFieldContext: React.Context<SelectFieldContextValue>;

package/dist/components/select-field/index.d.ts

@@ -1,5 +1,5 @@
-import { SelectModalGeneralProps } from './select-modal';
 import { SelectFieldInputChangeEventHandler, SelectFieldInputType } from './types';
+import { SelectModalGeneralProps } from './select-modal';
 import { UseSelectFieldProps } from './useSelectField';
 export type SelectFieldProps = {
     className?: string;
@@ -13,6 +13,7 @@ export type SelectFieldProps = {
     inputValue?: string;
     clearable?: boolean;
     loading?: boolean;
+    padding?: [number, number];
     dataTest?: string;
     onInputChange?: SelectFieldInputChangeEventHandler;
     onPointerLeave?: React.PointerEventHandler<HTMLDivElement>;

package/dist/components/select-field/index.js

@@ -1 +1 @@
-import{__rest as e}from"tslib";import{jsx as l,jsxs as t,Fragment as a}from"react/jsx-runtime";import{useCallback as r,useState as i,useMemo as o}from"react";import{SelectFieldLabel as n,SelectFieldStyled as d,SelectFieldInput as s,SelectFieldSkeleton as c,SelectFieldInputLeftSide as u,SelectFieldSearchIcon as p,SelectFieldInputNative as h,SelectFieldPlaceholder as m,SelectFieldInputSide as b,SelectFieldClearButton as f,SelectFieldLoader as S,SelectFieldArrow as y,SelectFieldErrorText as C}from"./styled.js";export{SelectFieldColorValueText,SelectFieldValue,SelectFieldValueColor,SelectFieldValueList,SelectFieldValueListItem,SelectFieldValueText,SelectFieldValues}from"./styled.js";import{Skeleton as g}from"../skeleton/index.js";import{SelectModal as $}from"./select-modal/index.js";import{SelectFieldInputValue as v}from"./nodes/value/index.js";import{SelectFieldProvider as k}from"./context.js";export{SelectFieldConsumer,SelectFieldContext,useSelectFieldContext}from"./context.js";import{useSelectField as x}from"./useSelectField.js";const V=V=>{var{className:F,label:W,placeholder:j,data:P,fullWidth:O=!1,contentWidth:I,error:T,skeleton:A=!1,blur:L=!1,size:z="small",disableSelect:M=!1,disableScrollbar:N=!1,empty:R,after:w,loading:B=!1,enableInput:D=!1,inputType:q="text",inputValue:E,clearable:G=!1,disablePortal:H,tabs:J,search:K,searchPlaceholder:Q,resetStyleState:U,children:X,modalWidth:Y,dataTest:Z,selectedColor:_,compactWidth:ee,modalStyles:le,openedModel:te,onSearch:ae,onOptionClick:re,onInputChange:ie,onPointerLeave:oe}=V,ne=e(V,["className","label","placeholder","data","fullWidth","contentWidth","error","skeleton","blur","size","disableSelect","disableScrollbar","empty","after","loading","enableInput","inputType","inputValue","clearable","disablePortal","tabs","search","searchPlaceholder","resetStyleState","children","modalWidth","dataTest","selectedColor","compactWidth","modalStyles","openedModel","onSearch","onOptionClick","onInputChange","onPointerLeave"]);const de=x(ne),{isOpen:se,triggerRef:ce,value:ue,disabled:pe,multiple:he,handleClose:me,handleInputClick:be,setValue:fe}=de,Se=e(de,["isOpen","triggerRef","value","disabled","multiple","handleClose","handleInputClick","setValue"]),ye=r(e=>{null==ie||ie(e)},[ie]),[Ce,ge]=void 0===E?i(""):[E,ye],[$e,ve]=i(!1),ke=o(()=>D&&"search"===q,[D,q]),xe=o(()=>he&&Array.isArray(ue)&&ue.length>0,[he,ue]),Ve=o(()=>A?l(n,{children:l(g,{width:100})}):"string"==typeof W?l(n,{children:W}):W,[A,W]),Fe=r((e,l)=>{if(l.stopPropagation(),Array.isArray(ue)){if("string"==typeof e)return void fe(ue.filter(l=>"string"==typeof l?l!==e:l.value!==e));fe(ue.filter(l=>"string"==typeof l?l!==e.value:l.value!==e.value))}me()},[ue]),We=r(e=>{ge(e.currentTarget.value)},[ge]),je=r(()=>{fe(null),ge("")},[fe,ge]);return l(k,{selectRef:ce,handleSelectClick:be.bind(null,!1),children:t(d,{$fullWidth:O,$disabled:pe,className:F,onPointerLeave:oe,children:[Ve,null!=X?X:l(a,{children:A?l(s,{$open:!1,$error:!1,$disabled:!1,$skeleton:!0,$loading:!1,$blur:L,$multiple:!1,ref:ce,children:l(c,{})}):t(s,{$open:se,$error:!!T,$disabled:pe,$skeleton:!1,$blur:L,$loading:B,$multiple:xe,ref:ce,onClick:be.bind(null,!1),"data-test":Z,children:[t(u,{children:[(!ue||Array.isArray(ue)&&0===ue.length)&&t(a,{children:[ke&&l(p,{$focus:$e}),D?l(h,{type:q,value:Ce,placeholder:j,disabled:pe,onClick:be.bind(null,!0),onChange:We,onFocus:ve.bind(null,!0),onBlur:ve.bind(null,!1)}):l(m,{$open:se,children:j})]}),l(v,{value:ue,handleValueDelete:Fe})]}),t(b,{children:[(ue&&(G||D)||ke&&!B&&Ce)&&l(f,{onClick:je}),B&&l(S,{}),l(y,{$isOpen:se})]})]})}),l($,Object.assign({},Se,{isOpen:se,data:P,contentWidth:I,size:z,disableSelect:M,disableScrollbar:N,empty:R,after:w,tabs:J,search:K,searchPlaceholder:Q,resetStyleState:U,blur:L,disablePortal:H,value:ue,multiple:he,onSearch:ae,onOptionClick:re,handleClose:me,setValue:fe,modalWidth:Y,selectedColor:_,compactWidth:ee,modalStyles:le,openedModel:te})),T&&l(C,{children:T})]})})};export{V as SelectField,y as SelectFieldArrow,f as SelectFieldClearButton,C as SelectFieldErrorText,s as SelectFieldInput,u as SelectFieldInputLeftSide,h as SelectFieldInputNative,b as SelectFieldInputSide,n as SelectFieldLabel,S as SelectFieldLoader,m as SelectFieldPlaceholder,k as SelectFieldProvider,p as SelectFieldSearchIcon,c as SelectFieldSkeleton,d as SelectFieldStyled,$ as SelectModal,x as useSelectField};
+import{__rest as e}from"tslib";import{jsx as l,jsxs as t,Fragment as r}from"react/jsx-runtime";import{useCallback as o,useState as n}from"react";import{SelectFieldStyled as a,SelectFieldLabel as i,SelectFieldInput as d,SelectFieldInputLeftSide as s,SelectFieldSearchIcon as c,SelectFieldInputNative as h,SelectFieldPlaceholder as p,SelectFieldValue as u,SelectFieldValueText as m,SelectFieldValueColor as b,SelectFieldColorValueText as f,SelectFieldValues as y,SelectFieldValueList as g,SelectFieldValueListItem as v,SelectFieldInputSide as S,SelectFieldClearButton as C,SelectFieldLoader as $,SelectFieldArrow as j,SelectFieldSkeleton as k,SelectFieldErrorText as x}from"./styled.js";import"../../theme/index.js";import{Skeleton as W}from"../skeleton/index.js";import{IconProvider as A}from"../icon/context.js";import"../icon/styled.js";import{Tooltip as P}from"../tooltip/index.js";import{SelectFieldProvider as M}from"./context.js";export{SelectFieldConsumer,SelectFieldContext,useSelectFieldContext}from"./context.js";import{SelectModal as O}from"./select-modal/index.js";import{useSelectField as T}from"./useSelectField.js";import{useTheme as I}from"../../theme/hook.js";import{TooltipConsumer as F}from"../tooltip/context.js";const L=L=>{var{className:V,label:z,placeholder:N,data:R,fullWidth:w=!1,contentWidth:D,error:E,skeleton:Z=!1,blur:B=!1,size:q="small",disableSelect:G=!1,disableScrollbar:H=!1,empty:J,after:K,loading:Q=!1,enableInput:U=!1,inputType:X="text",inputValue:Y,clearable:_=!1,disablePortal:ee,tabs:le,search:te,searchPlaceholder:re,resetStyleState:oe,children:ne,modalWidth:ae,dataTest:ie,selectedColor:de,compactWidth:se,modalStyles:ce,openedModel:he,onSearch:pe,onOptionClick:ue,onInputChange:me,onPointerLeave:be}=L,fe=e(L,["className","label","placeholder","data","fullWidth","contentWidth","error","skeleton","blur","size","disableSelect","disableScrollbar","empty","after","loading","enableInput","inputType","inputValue","clearable","disablePortal","tabs","search","searchPlaceholder","resetStyleState","children","modalWidth","dataTest","selectedColor","compactWidth","modalStyles","openedModel","onSearch","onOptionClick","onInputChange","onPointerLeave"]);const ye=T(fe),{isOpen:ge,triggerRef:ve,value:Se,disabled:Ce,multiple:$e,handleClose:je,handleInputClick:ke,setValue:xe}=ye,We=e(ye,["isOpen","triggerRef","value","disabled","multiple","handleClose","handleInputClick","setValue"]),Ae=I(),Pe=o((e=>{null==me||me(e)}),[me]);let[Me,Oe]=n("");void 0!==Y&&([Me,Oe]=[Y,Pe]);const[Te,Ie]=n(!1),Fe=o(((e,l)=>{l.stopPropagation(),Array.isArray(Se)&&xe("string"==typeof e?Se.filter((l=>"string"==typeof l?l!==e:l.value!==e)):Se.filter((l=>"string"==typeof l?l!==e.value:l.value!==e.value))),je()}),[Se]),Le=o((e=>{Oe(e.currentTarget.value)}),[Oe]),Ve=o((()=>{xe(null),Oe("")}),[xe,Oe]);return l(M,{selectRef:ve,handleSelectClick:ke.bind(null,!1),children:t(a,{$fullWidth:w,$disabled:Ce,className:V,onPointerLeave:be,children:[z&&Z&&l(i,{children:l(W,{width:100})}),"string"==typeof z&&!Z&&l(i,{children:z}),"string"!=typeof z&&!Z&&z,ne,!ne&&t(r,{children:[!Z&&t(d,{$open:ge,$error:!!E,$disabled:Ce,$skeleton:!1,$blur:B,$loading:Q,$multiple:$e&&Array.isArray(Se)&&Se.length>0,ref:ve,onClick:ke.bind(null,!1),"data-test":ie,children:[t(s,{children:[(!Se||Array.isArray(Se)&&0===Se.length)&&t(r,{children:[U&&"search"===X&&l(c,{$focus:Te}),U&&l(h,{type:X,value:Me,placeholder:N,disabled:Ce,onClick:ke.bind(null,!0),onChange:Le,onFocus:Ie.bind(null,!0),onBlur:Ie.bind(null,!1)}),!U&&l(p,{$open:ge,children:N})]}),"string"==typeof Se&&""!==Se&&l(u,{children:l(m,{children:Se})}),Se&&"object"==typeof Se&&!Array.isArray(Se)&&t(u,{children:[Se.icon&&l(A,{fill:Ae.colors.base.white,size:18,children:Se.icon}),Se.color&&l(b,{$color:Se.color}),Se.label&&l(P,{label:Se.label,placement:"top-left",disabled:Se.label.length<=128,children:l(F,{children:({handleTooltipMouseEnter:e,handleTooltipMouseLeave:t})=>l(f,{onMouseEnter:e,onMouseLeave:t,children:Se.label})})}),!Se.label&&Se.value&&l(f,{children:Se.value})]}),Array.isArray(Se)&&Se.length>0&&l(y,{children:l(g,{children:Se.map(((e,t)=>{var r,o,n;return"string"==typeof e?l(v,{onDelete:Fe.bind(null,e),children:e},e):l(v,{onDelete:Fe.bind(null,e),children:null!==(r=e.label)&&void 0!==r?r:e.value},null!==(n=null!==(o=e.id)&&void 0!==o?o:e.value)&&void 0!==n?n:t)}))})})]}),t(S,{children:[(_&&Se||U&&"search"===X&&!Q&&Me||U&&Se)&&l(C,{onClick:Ve}),Q&&l($,{}),l(j,{style:{transform:ge?"rotateZ(180deg)":"rotateZ(0deg)"}})]})]}),Z&&l(d,{$open:!1,$error:!1,$disabled:!1,$skeleton:!0,$loading:!1,$blur:B,$multiple:!1,ref:ve,children:l(k,{})})]}),l(O,Object.assign({},We,{isOpen:ge,data:R,contentWidth:D,size:q,disableSelect:G,disableScrollbar:H,empty:J,after:K,tabs:le,search:te,searchPlaceholder:re,resetStyleState:oe,blur:B,disablePortal:ee,value:Se,multiple:$e,onSearch:pe,onOptionClick:ue,handleClose:je,setValue:xe,modalWidth:ae,selectedColor:de,compactWidth:se,modalStyles:ce,openedModel:he})),E&&l(x,{children:E})]})})};export{L as SelectField,j as SelectFieldArrow,C as SelectFieldClearButton,f as SelectFieldColorValueText,x as SelectFieldErrorText,d as SelectFieldInput,s as SelectFieldInputLeftSide,h as SelectFieldInputNative,S as SelectFieldInputSide,i as SelectFieldLabel,$ as SelectFieldLoader,p as SelectFieldPlaceholder,M as SelectFieldProvider,c as SelectFieldSearchIcon,k as SelectFieldSkeleton,a as SelectFieldStyled,u as SelectFieldValue,b as SelectFieldValueColor,g as SelectFieldValueList,v as SelectFieldValueListItem,m as SelectFieldValueText,y as SelectFieldValues,O as SelectModal,T as useSelectField};

package/dist/components/select-field/option/collapse/index.js

@@ -0,0 +1 @@
+import{__rest as t}from"tslib";import{jsxs as o,jsx as e}from"react/jsx-runtime";import{useState as i,useLayoutEffect as r}from"react";import{SelectFieldCollapseOptionStyled as s,SelectFieldCollapseOptionHead as l,SelectFieldCollapseOptionHeadSide as n,SelectFieldCollapseOptionText as c,SelectFieldCollapseOptionArrow as p,SelectFieldCollapseOptionBody as d}from"./styled.js";import{IconProvider as m}from"../../../icon/context.js";import"../../../icon/styled.js";import"@react-spring/web";import"react-dom";import"../../../portal/styled.js";import"../../../tooltip/styled.js";import"../../../tooltip/arrow/styled.js";import"../../../../theme/index.js";import"../../../tooltip/context.js";import{useTheme as a}from"../../../../theme/hook.js";const f=f=>{var j,h,{size:b,item:y,children:g,onClick:z,icon:$}=f,u=t(f,["size","item","children","onClick","icon"]);const x=a(),[k,v]=i("string"!=typeof y&&(null!==(j=y.open)&&void 0!==j&&j));let w;w="string"!=typeof y&&!!y.disabled,r((()=>{"string"!=typeof y&&v(Boolean(y.open))}),[y]);const C="string"==typeof y?y:null!==(h=y.label)&&void 0!==h?h:y.value;return o(s,Object.assign({},u,{$size:b,"data-test":C,children:[o(l,Object.assign({$disabled:w,$size:b},!w&&{onClick:()=>{v((t=>!t)),z&&z(y)}},{children:[o(n,{$size:b,children:["object"==typeof y&&y.icon&&e(m,{size:"large"===b?24:16,fill:x.colors.base.white,children:y.icon}),e(c,{$size:b,$bold:"object"==typeof y&&y.bold,children:C})]}),e(n,{$size:b,children:$||e(p,{style:{transform:k?"rotateZ(180deg)":"rotateZ(0deg)"}})})]})),k&&e(d,{children:g})]}))};export{f as SelectFieldCollapseOption};

package/dist/components/select-field/{select-modal/option → option}/collapse/styled.d.ts

@@ -18,15 +18,17 @@ export interface SelectFieldCollapseOptionTextAttrsProps {
 export interface SelectFieldCollapseOptionTextProps {
     $bold?: boolean;
 }
-export declare const SelectFieldCollapseOptionText: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("@/ui/components/typography").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, import("@/ui/components/typography").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, SelectFieldCollapseOptionTextAttrsProps>, SelectFieldCollapseOptionTextProps>>;
+export declare const SelectFieldCollapseOptionText: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<Omit<import("@/ui/components/typography").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, Omit<import("@/ui/components/typography").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}>, SelectFieldCollapseOptionTextAttrsProps>, SelectFieldCollapseOptionTextProps>>;
 export declare const SelectFieldCollapseOptionArrow: import("styled-components").IStyledComponent<"web", {
     size?: number | undefined;
     fill?: string | undefined;
     enableTooltip?: boolean | undefined;
     string?: number | string | undefined | undefined;
     mode?: number | string | undefined | undefined;
-    filter?: string | undefined | undefined;
-    values?: string | undefined | undefined;
     children?: import("react").ReactNode;
     end?: number | string | undefined | undefined;
     accumulate?: "none" | "sum" | undefined | undefined;
@@ -250,8 +252,6 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<SVGSVGElement> | undefined;
     onScroll?: import("react").UIEventHandler<SVGSVGElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<SVGSVGElement> | undefined;
-    onScrollEnd?: import("react").UIEventHandler<SVGSVGElement> | undefined;
-    onScrollEndCapture?: import("react").UIEventHandler<SVGSVGElement> | undefined;
     onWheel?: import("react").WheelEventHandler<SVGSVGElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<SVGSVGElement> | undefined;
     onAnimationStartCapture?: import("react").AnimationEventHandler<SVGSVGElement> | undefined;
@@ -259,91 +259,25 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     onAnimationEndCapture?: import("react").AnimationEventHandler<SVGSVGElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<SVGSVGElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<SVGSVGElement> | undefined;
-    onToggle?: import("react").ToggleEventHandler<SVGSVGElement> | undefined;
-    onBeforeToggle?: import("react").ToggleEventHandler<SVGSVGElement> | undefined;
-    onTransitionCancel?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
-    onTransitionCancelCapture?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
-    onTransitionRun?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
-    onTransitionRunCapture?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
-    onTransitionStart?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
-    onTransitionStartCapture?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
     clipPath?: string | undefined | undefined;
+    filter?: string | undefined | undefined;
     mask?: string | undefined | undefined;
     path?: string | undefined | undefined;
-    transform?: string | undefined | undefined;
-    z?: number | string | undefined | undefined;
-    rotate?: number | string | undefined | undefined;
-    scale?: number | string | undefined | undefined;
-    cursor?: number | string | undefined | undefined;
-    direction?: number | string | undefined | undefined;
-    display?: number | string | undefined | undefined;
-    fontFamily?: string | undefined | undefined;
-    fontSize?: number | string | undefined | undefined;
-    fontSizeAdjust?: number | string | undefined | undefined;
-    fontStretch?: number | string | undefined | undefined;
-    fontStyle?: number | string | undefined | undefined;
-    fontVariant?: number | string | undefined | undefined;
-    fontWeight?: number | string | undefined | undefined;
     height?: number | string | undefined | undefined;
-    imageRendering?: number | string | undefined | undefined;
-    letterSpacing?: number | string | undefined | undefined;
-    opacity?: number | string | undefined | undefined;
-    order?: number | string | undefined | undefined;
-    paintOrder?: number | string | undefined | undefined;
-    pointerEvents?: number | string | undefined | undefined;
-    textRendering?: number | string | undefined | undefined;
-    unicodeBidi?: number | string | undefined | undefined;
-    visibility?: number | string | undefined | undefined;
-    width?: number | string | undefined | undefined;
-    wordSpacing?: number | string | undefined | undefined;
-    writingMode?: number | string | undefined | undefined;
-    offset?: number | string | undefined | undefined;
-    overflow?: number | string | undefined | undefined;
-    textDecoration?: number | string | undefined | undefined;
-    azimuth?: number | string | undefined | undefined;
-    alignmentBaseline?: "auto" | "baseline" | "before-edge" | "text-before-edge" | "middle" | "central" | "after-edge" | "text-after-edge" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "inherit" | undefined | undefined;
-    baselineShift?: number | string | undefined | undefined;
-    clipRule?: number | string | undefined | undefined;
-    colorInterpolation?: number | string | undefined | undefined;
-    colorRendering?: number | string | undefined | undefined;
-    dominantBaseline?: number | string | undefined | undefined;
-    fillOpacity?: number | string | undefined | undefined;
-    fillRule?: "nonzero" | "evenodd" | "inherit" | undefined | undefined;
-    floodColor?: number | string | undefined | undefined;
-    floodOpacity?: number | string | undefined | undefined;
-    glyphOrientationVertical?: number | string | undefined | undefined;
-    lightingColor?: number | string | undefined | undefined;
-    markerEnd?: string | undefined | undefined;
-    markerMid?: string | undefined | undefined;
-    markerStart?: string | undefined | undefined;
-    shapeRendering?: number | string | undefined | undefined;
-    stopColor?: string | undefined | undefined;
-    stopOpacity?: number | string | undefined | undefined;
-    strokeDasharray?: string | number | undefined | undefined;
-    strokeDashoffset?: string | number | undefined | undefined;
-    strokeLinecap?: "butt" | "round" | "square" | "inherit" | undefined | undefined;
-    strokeLinejoin?: "miter" | "round" | "bevel" | "inherit" | undefined | undefined;
-    strokeMiterlimit?: number | string | undefined | undefined;
-    strokeOpacity?: number | string | undefined | undefined;
-    strokeWidth?: number | string | undefined | undefined;
-    textAnchor?: string | undefined | undefined;
-    vectorEffect?: number | string | undefined | undefined;
-    viewBox?: string | undefined | undefined;
-    from?: number | string | undefined | undefined;
-    to?: number | string | undefined | undefined;
-    target?: string | undefined | undefined;
-    type?: string | undefined | undefined;
-    r?: number | string | undefined | undefined;
-    name?: string | undefined | undefined;
     max?: number | string | undefined | undefined;
     media?: string | undefined | undefined;
     method?: string | undefined | undefined;
     min?: number | string | undefined | undefined;
+    name?: string | undefined | undefined;
+    target?: string | undefined | undefined;
+    type?: string | undefined | undefined;
+    width?: number | string | undefined | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     accentHeight?: number | string | undefined | undefined;
     additive?: "replace" | "sum" | undefined | undefined;
+    alignmentBaseline?: "auto" | "baseline" | "before-edge" | "text-before-edge" | "middle" | "central" | "after-edge" | "text-after-edge" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "inherit" | undefined | undefined;
     allowReorder?: "no" | "yes" | undefined | undefined;
     amplitude?: number | string | undefined | undefined;
     arabicForm?: "initial" | "medial" | "terminal" | "isolated" | undefined | undefined;
@@ -351,7 +285,9 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     attributeName?: string | undefined | undefined;
     attributeType?: string | undefined | undefined;
     autoReverse?: (boolean | "false" | "true") | undefined;
+    azimuth?: number | string | undefined | undefined;
     baseFrequency?: number | string | undefined | undefined;
+    baselineShift?: number | string | undefined | undefined;
     baseProfile?: number | string | undefined | undefined;
     bbox?: number | string | undefined | undefined;
     begin?: number | string | undefined | undefined;
@@ -360,17 +296,24 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     calcMode?: number | string | undefined | undefined;
     capHeight?: number | string | undefined | undefined;
     clipPathUnits?: number | string | undefined | undefined;
+    clipRule?: number | string | undefined | undefined;
+    colorInterpolation?: number | string | undefined | undefined;
     colorInterpolationFilters?: "auto" | "sRGB" | "linearRGB" | "inherit" | undefined | undefined;
     colorProfile?: number | string | undefined | undefined;
+    colorRendering?: number | string | undefined | undefined;
     contentScriptType?: number | string | undefined | undefined;
     contentStyleType?: number | string | undefined | undefined;
+    cursor?: number | string | undefined | undefined;
     cx?: number | string | undefined | undefined;
     cy?: number | string | undefined | undefined;
     d?: string | undefined | undefined;
     decelerate?: number | string | undefined | undefined;
     descent?: number | string | undefined | undefined;
     diffuseConstant?: number | string | undefined | undefined;
+    direction?: number | string | undefined | undefined;
+    display?: number | string | undefined | undefined;
     divisor?: number | string | undefined | undefined;
+    dominantBaseline?: number | string | undefined | undefined;
     dur?: number | string | undefined | undefined;
     dx?: number | string | undefined | undefined;
     dy?: number | string | undefined | undefined;
@@ -379,23 +322,37 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     enableBackground?: number | string | undefined | undefined;
     exponent?: number | string | undefined | undefined;
     externalResourcesRequired?: (boolean | "false" | "true") | undefined;
+    fillOpacity?: number | string | undefined | undefined;
+    fillRule?: "nonzero" | "evenodd" | "inherit" | undefined | undefined;
     filterRes?: number | string | undefined | undefined;
     filterUnits?: number | string | undefined | undefined;
+    floodColor?: number | string | undefined | undefined;
+    floodOpacity?: number | string | undefined | undefined;
     focusable?: "auto" | (boolean | "false" | "true") | undefined;
+    fontFamily?: string | undefined | undefined;
+    fontSize?: number | string | undefined | undefined;
+    fontSizeAdjust?: number | string | undefined | undefined;
+    fontStretch?: number | string | undefined | undefined;
+    fontStyle?: number | string | undefined | undefined;
+    fontVariant?: number | string | undefined | undefined;
+    fontWeight?: number | string | undefined | undefined;
     format?: number | string | undefined | undefined;
     fr?: number | string | undefined | undefined;
+    from?: number | string | undefined | undefined;
     fx?: number | string | undefined | undefined;
     fy?: number | string | undefined | undefined;
     g1?: number | string | undefined | undefined;
     g2?: number | string | undefined | undefined;
     glyphName?: number | string | undefined | undefined;
     glyphOrientationHorizontal?: number | string | undefined | undefined;
+    glyphOrientationVertical?: number | string | undefined | undefined;
     glyphRef?: number | string | undefined | undefined;
     gradientTransform?: string | undefined | undefined;
     gradientUnits?: string | undefined | undefined;
     horizAdvX?: number | string | undefined | undefined;
     horizOriginX?: number | string | undefined | undefined;
     href?: string | undefined | undefined;
+    imageRendering?: number | string | undefined | undefined;
     in2?: number | string | undefined | undefined;
     in?: string | undefined | undefined;
     intercept?: number | string | undefined | undefined;
@@ -411,24 +368,35 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     keySplines?: number | string | undefined | undefined;
     keyTimes?: number | string | undefined | undefined;
     lengthAdjust?: number | string | undefined | undefined;
+    letterSpacing?: number | string | undefined | undefined;
+    lightingColor?: number | string | undefined | undefined;
     limitingConeAngle?: number | string | undefined | undefined;
+    markerEnd?: string | undefined | undefined;
     markerHeight?: number | string | undefined | undefined;
+    markerMid?: string | undefined | undefined;
+    markerStart?: string | undefined | undefined;
     markerUnits?: number | string | undefined | undefined;
     markerWidth?: number | string | undefined | undefined;
     maskContentUnits?: number | string | undefined | undefined;
     maskUnits?: number | string | undefined | undefined;
     numOctaves?: number | string | undefined | undefined;
+    offset?: number | string | undefined | undefined;
+    opacity?: number | string | undefined | undefined;
     operator?: number | string | undefined | undefined;
+    order?: number | string | undefined | undefined;
     orient?: number | string | undefined | undefined;
     orientation?: number | string | undefined | undefined;
     origin?: number | string | undefined | undefined;
+    overflow?: number | string | undefined | undefined;
     overlinePosition?: number | string | undefined | undefined;
     overlineThickness?: number | string | undefined | undefined;
+    paintOrder?: number | string | undefined | undefined;
     panose1?: number | string | undefined | undefined;
     pathLength?: number | string | undefined | undefined;
     patternContentUnits?: string | undefined | undefined;
     patternTransform?: number | string | undefined | undefined;
     patternUnits?: string | undefined | undefined;
+    pointerEvents?: number | string | undefined | undefined;
     points?: string | undefined | undefined;
     pointsAtX?: number | string | undefined | undefined;
     pointsAtY?: number | string | undefined | undefined;
@@ -436,6 +404,7 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     preserveAlpha?: (boolean | "false" | "true") | undefined;
     preserveAspectRatio?: string | undefined | undefined;
     primitiveUnits?: number | string | undefined | undefined;
+    r?: number | string | undefined | undefined;
     radius?: number | string | undefined | undefined;
     refX?: number | string | undefined | undefined;
     refY?: number | string | undefined | undefined;
@@ -446,9 +415,12 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     requiredFeatures?: number | string | undefined | undefined;
     restart?: number | string | undefined | undefined;
     result?: string | undefined | undefined;
+    rotate?: number | string | undefined | undefined;
     rx?: number | string | undefined | undefined;
     ry?: number | string | undefined | undefined;
+    scale?: number | string | undefined | undefined;
     seed?: number | string | undefined | undefined;
+    shapeRendering?: number | string | undefined | undefined;
     slope?: number | string | undefined | undefined;
     spacing?: number | string | undefined | undefined;
     specularConstant?: number | string | undefined | undefined;
@@ -460,30 +432,52 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     stemh?: number | string | undefined | undefined;
     stemv?: number | string | undefined | undefined;
     stitchTiles?: number | string | undefined | undefined;
+    stopColor?: string | undefined | undefined;
+    stopOpacity?: number | string | undefined | undefined;
     strikethroughPosition?: number | string | undefined | undefined;
     strikethroughThickness?: number | string | undefined | undefined;
+    strokeDasharray?: string | number | undefined | undefined;
+    strokeDashoffset?: string | number | undefined | undefined;
+    strokeLinecap?: "butt" | "round" | "square" | "inherit" | undefined | undefined;
+    strokeLinejoin?: "miter" | "round" | "bevel" | "inherit" | undefined | undefined;
+    strokeMiterlimit?: number | string | undefined | undefined;
+    strokeOpacity?: number | string | undefined | undefined;
+    strokeWidth?: number | string | undefined | undefined;
     surfaceScale?: number | string | undefined | undefined;
     systemLanguage?: number | string | undefined | undefined;
     tableValues?: number | string | undefined | undefined;
     targetX?: number | string | undefined | undefined;
     targetY?: number | string | undefined | undefined;
+    textAnchor?: string | undefined | undefined;
+    textDecoration?: number | string | undefined | undefined;
     textLength?: number | string | undefined | undefined;
+    textRendering?: number | string | undefined | undefined;
+    to?: number | string | undefined | undefined;
+    transform?: string | undefined | undefined;
+    transformOrigin?: string | undefined | undefined;
     u1?: number | string | undefined | undefined;
     u2?: number | string | undefined | undefined;
     underlinePosition?: number | string | undefined | undefined;
     underlineThickness?: number | string | undefined | undefined;
+    unicodeBidi?: number | string | undefined | undefined;
     unicodeRange?: number | string | undefined | undefined;
     unitsPerEm?: number | string | undefined | undefined;
     vAlphabetic?: number | string | undefined | undefined;
+    values?: string | undefined | undefined;
+    vectorEffect?: number | string | undefined | undefined;
     version?: string | undefined | undefined;
     vertAdvY?: number | string | undefined | undefined;
     vertOriginX?: number | string | undefined | undefined;
     vertOriginY?: number | string | undefined | undefined;
     vHanging?: number | string | undefined | undefined;
     vIdeographic?: number | string | undefined | undefined;
+    viewBox?: string | undefined | undefined;
     viewTarget?: number | string | undefined | undefined;
+    visibility?: number | string | undefined | undefined;
     vMathematical?: number | string | undefined | undefined;
     widths?: number | string | undefined | undefined;
+    wordSpacing?: number | string | undefined | undefined;
+    writingMode?: number | string | undefined | undefined;
     x1?: number | string | undefined | undefined;
     x2?: number | string | undefined | undefined;
     xChannelSelector?: string | undefined | undefined;
@@ -503,10 +497,11 @@ export declare const SelectFieldCollapseOptionArrow: import("styled-components")
     y1?: number | string | undefined | undefined;
     y2?: number | string | undefined | undefined;
     yChannelSelector?: string | undefined | undefined;
+    z?: number | string | undefined | undefined;
     zoomAndPan?: string | undefined | undefined;
 }>;
 export declare const SelectFieldCollapseOptionBody: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").Ref<HTMLDivElement> | undefined;
+    ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -555,10 +550,6 @@ export declare const SelectFieldCollapseOptionBody: import("styled-components").
     results?: number | undefined | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
-    popover?: "" | "auto" | "manual" | undefined | undefined;
-    popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
-    popoverTarget?: string | undefined | undefined;
-    inert?: boolean | undefined | undefined;
     inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
     is?: string | undefined | undefined;
     exportparts?: string | undefined | undefined;
@@ -768,8 +759,6 @@ export declare const SelectFieldCollapseOptionBody: import("styled-components").
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onScrollEnd?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onScrollEndCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
@@ -778,14 +767,6 @@ export declare const SelectFieldCollapseOptionBody: import("styled-components").
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
-    onBeforeToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancel?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRun?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStart?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
 }>;

package/dist/components/select-field/option/collapse/styled.js

@@ -0,0 +1,16 @@
+import{styled as e,css as t}from"styled-components";import{Typography as s}from"../../../typography/index.js";import{ArrowDownIcon as i}from"../../../../icons/arrow-down/index.js";const n=e.div.withConfig({displayName:"styled__SelectFieldCollapseOptionStyled",componentId:"sc-qnvtt4-0"})(["display:flex;flex-direction:column;width:100%;gap:","px;"],(({$size:e})=>{switch(e){case"small":return 4;case"md":return 6;case"large":return 8}})),o=e.div.withConfig({displayName:"styled__SelectFieldCollapseOptionHead",componentId:"sc-qnvtt4-1"})(["display:flex;justify-content:space-between;align-items:center;padding:","px;border-radius:6px;gap:","px;"," user-select:none;"],(({$size:e})=>{switch(e){case"small":return 8;case"md":return 12;case"large":return 10}}),(({$size:e})=>{switch(e){case"small":case"large":return 8;case"md":return 10}}),(({theme:e,$disabled:s})=>s?t`
+        cursor: not-allowed;
+        &:hover {
+          background: ${"light"===e.mode?"rgba(0, 0, 0, 0.05)":"rgba(255, 255, 255, 0.05)"};
+        }
+        & > ${a}:first-child {
+          opacity: 0.5;
+        }
+      `:t`
+      cursor: pointer;
+      &:hover {
+        background: ${e.colors.accent.primary}33;
+      }
+    `)),a=e.div.withConfig({displayName:"styled__SelectFieldCollapseOptionHeadSide",componentId:"sc-qnvtt4-2"})(["display:flex;align-items:center;gap:","px;"],(({$size:e})=>{switch(e){case"small":case"large":return 8;case"md":return 10}})),l=e(s).attrs((e=>({variant:"large"===e.$size?"body-m-semibold":"input-sm"}))).withConfig({displayName:"styled__SelectFieldCollapseOptionText",componentId:"sc-qnvtt4-3"})(["",""],(({$bold:e})=>e&&t`
+      font-weight: 500;
+    `)),r=e(i).attrs({size:16}).withConfig({displayName:"styled__SelectFieldCollapseOptionArrow",componentId:"sc-qnvtt4-4"})(["transition:transform 0.2s ease-in-out;"]),d=e.div.withConfig({displayName:"styled__SelectFieldCollapseOptionBody",componentId:"sc-qnvtt4-5"})([""]);export{r as SelectFieldCollapseOptionArrow,d as SelectFieldCollapseOptionBody,o as SelectFieldCollapseOptionHead,a as SelectFieldCollapseOptionHeadSide,n as SelectFieldCollapseOptionStyled,l as SelectFieldCollapseOptionText};