@bothub-chat/ui 2.48.1-fix-message-79720dcc-0313-4bb2-ac15-912e6fc16d36 → 2.48.1-fix-refactor-2b2ac2ff-898d-489a-83f0-2a58a894046a

package/dist/components/select-field/select-modal/option/list/index.js

@@ -0,0 +1 @@
+import{__rest as i}from"tslib";import{jsx as o,jsxs as n,Fragment as e}from"react/jsx-runtime";import{useCallback as s}from"react";import{SelectFieldOptionsStyled as t,SelectFieldOptionSide as r,SelectFieldDivider as d,SelectFieldOptionLabel as c,SelectFieldEmpty as p,SelectFieldEmptyText as m,SelectFieldRadioTitleAndRadio as l,SelectFieldRadioLabel as a,SelectFieldRadioDescription as x,SelectFieldRadio as j,SelectFieldRadioLabelWrapper as b}from"./styled.js";import{Tooltip as u}from"../../../../tooltip/index.js";import{IconProvider as g}from"../../../../icon/context.js";import"../../../../icon/styled.js";import"../../../../../theme/index.js";import{SelectFieldCollapseOption as h}from"../collapse/index.js";import{SearchDataIcon as f}from"../../../../../icons/search-data/index.js";import{Radio as v}from"../../../../radio/index.js";import{SelectFieldOptionStyled as y,SelectFieldOptionText as w}from"../select-field-option/styled.js";import{SelectFieldOption as k}from"../select-field-option/index.js";import"../../../../../icons/arrow-down/index.js";import"../../../../../icons/arrow-narrow-left/index.js";import"../../../../../icons/arrow-narrow-right/index.js";import"../../../../../icons/arrow-up/index.js";import"../../../../../icons/bitcoin/index.js";import"../../../../../icons/bot-circle/index.js";import"../../../../../icons/bothub-agg/index.js";import"../../../../../icons/business-colored/index.js";import"../../../../../icons/check-circle/index.js";import"../../../../../icons/close/index.js";import"../../../../../icons/email-circle/index.js";import"../../../../../icons/language/index.js";import"../../../../../icons/lock-circle/index.js";import"../../../../../icons/menu/index.js";import"../../../../../icons/medium-circle/index.js";import"../../../../../icons/tg-circle/index.js";import"../../../../../icons/tg-colored/index.js";import"../../../../../icons/youcassa/index.js";import"../../../../../icons/dashboard/index.js";import"../../../../../icons/user-profile/index.js";import"../../../../../icons/logout/index.js";import"../../../../../icons/habr-2/index.js";import"../../../../../icons/arrow-2-down/index.js";import"../../../../../icons/links/index.js";import"../../../../../icons/free/index.js";import"../../../../../icons/hotness/index.js";import"../../../../../icons/checked/index.js";import"../../../../../icons/ai/index.js";import"../../../../../icons/bookmarks/index.js";import"../../../../../icons/bookmarks-big/index.js";import"../../../../../icons/chat/index.js";import"../../../../../icons/chats/index.js";import"../../../../../icons/coder/index.js";import"../../../../../icons/copy/index.js";import"../../../../../icons/edit/index.js";import"../../../../../icons/presets-big/index.js";import"../../../../../icons/referal/index.js";import"../../../../../icons/restore/index.js";import"../../../../../icons/tariff/index.js";import"../../../../../icons/trash/index.js";import"../../../../../icons/update/index.js";import"../../../../../icons/menu-dot/index.js";import"../../../../../icons/plus-2/index.js";import"../../../../../icons/plus-1/index.js";import"../../../../../icons/send/index.js";import"../../../../../icons/settings/index.js";import"../../../../../icons/habr/index.js";import"../../../../../icons/check-small/index.js";import"../../../../../icons/stop/index.js";import"../../../../../icons/thumb-up/index.js";import"../../../../../icons/thumb-down/index.js";import"../../../../../icons/star/index.js";import"../../../../../icons/info-big/index.js";import"../../../../../icons/warning-big/index.js";import"../../../../../icons/error-big/index.js";import"../../../../../icons/success-big/index.js";import"../../../../../icons/mj/index.js";import"../../../../../icons/card/index.js";import"../../../../../icons/arrow-narrow-up/index.js";import"../../../../../icons/arrow-narrow-down/index.js";import"../../../../../icons/filters/index.js";import"../../../../../icons/info/index.js";import"../../../../../icons/search-circle/index.js";import"../../../../../icons/save/index.js";import"../../../../../icons/light/index.js";import"../../../../../icons/dark/index.js";import"../../../../../icons/email-colored/index.js";import"../../../../../icons/action-chat/index.js";import"../../../../../icons/attach/index.js";import"../../../../../icons/avatar-add/index.js";import"../../../../../icons/brush/index.js";import"../../../../../icons/calendar/index.js";import"../../../../../icons/claude/index.js";import"../../../../../icons/cookie/index.js";import"../../../../../icons/dalle/index.js";import"../../../../../icons/download-img/index.js";import"../../../../../icons/error/index.js";import"../../../../../icons/expand/index.js";import"../../../../../icons/eye/index.js";import"../../../../../icons/face/index.js";import"../../../../../icons/gear/index.js";import"../../../../../icons/gear-min/index.js";import"../../../../../icons/generation/index.js";import"../../../../../icons/gpt-3_5/index.js";import"../../../../../icons/gpt-4/index.js";import"../../../../../icons/imagine/index.js";import"../../../../../icons/imagine-2/index.js";import"../../../../../icons/loader/index.js";import"../../../../../icons/loader-circular/index.js";import"../../../../../icons/loader-circular-gradient/index.js";import"../../../../../icons/loader-circular-gradient-2/index.js";import"../../../../../icons/minus/index.js";import"../../../../../icons/mj-white/index.js";import"../../../../../icons/prompt/index.js";import"../../../../../icons/rabbit/index.js";import"../../../../../icons/ratio-1x1/index.js";import"../../../../../icons/ratio-2x3/index.js";import"../../../../../icons/ratio-3x2/index.js";import"../../../../../icons/ratio-4x5/index.js";import"../../../../../icons/ratio-4x7/index.js";import"../../../../../icons/ratio-5x4/index.js";import"../../../../../icons/ratio-7x4/index.js";import"../../../../../icons/ratio-16x9/index.js";import"../../../../../icons/ratio-9x16/index.js";import"../../../../../icons/ratio-21x9/index.js";import"../../../../../icons/ratio-9x21/index.js";import"../../../../../icons/refferal-min/index.js";import"../../../../../icons/square/index.js";import"../../../../../icons/turtle/index.js";import"../../../../../icons/upscale/index.js";import"../../../../../icons/withdraw/index.js";import"../../../../../icons/search-plus/index.js";import"../../../../../icons/lightning/index.js";import"../../../../../icons/blog-circle/index.js";import"../../../../../icons/stripe/index.js";import"../../../../../icons/corporate/index.js";import"../../../../../icons/public/index.js";import"../../../../../icons/private/index.js";import"../../../../../icons/mistral/index.js";import"../../../../../icons/gemini/index.js";import"../../../../../icons/search-simple/index.js";import"../../../../../icons/sad-robot/index.js";import"../../../../../icons/model/index.js";import"../../../../../icons/phone-colored/index.js";import"../../../../../icons/questions/index.js";import"../../../../../icons/pdf-big/index.js";import"../../../../../icons/xls-big/index.js";import"../../../../../icons/word-big/index.js";import"../../../../../icons/txt-big/index.js";import"../../../../../icons/pdf/index.js";import"../../../../../icons/xls/index.js";import"../../../../../icons/word/index.js";import"../../../../../icons/txt/index.js";import"../../../../../icons/bothub-logo-gradient/index.js";import"../../../../../icons/telegram-logo-gradient/index.js";import"../../../../../icons/decline-circle/index.js";import"../../../../../icons/simple-gear-bg/index.js";import"../../../../../icons/advanced-filter/index.js";import"../../../../../icons/big-corporate/index.js";import"../../../../../icons/big-mj/index.js";import"../../../../../icons/big-models/index.js";import"../../../../../icons/big-stats/index.js";import"../../../../../icons/big-success/index.js";import"../../../../../icons/big-users/index.js";import"../../../../../icons/optional-presets/index.js";import"../../../../../icons/wallet-withdraw/index.js";import"../../../../../icons/big-presets/index.js";import"../../../../../icons/big-favorite/index.js";import"../../../../../icons/big-referal/index.js";import"../../../../../icons/attach-file/index.js";import"../../../../../icons/attach-file-big/index.js";import"../../../../../icons/voice/index.js";import"../../../../../icons/play-button/index.js";import"../../../../../icons/pause-button/index.js";import"../../../../../icons/text-read/index.js";import"../../../../../icons/text-hide/index.js";import"../../../../../icons/best-chat-bots/index.js";import"../../../../../icons/upload/index.js";import"../../../../../icons/enter/index.js";import"../../../../../icons/discord/index.js";import"../../../../../icons/discord-circle/index.js";import"../../../../../icons/black-forest-labs/index.js";import"../../../../../icons/flux/index.js";import"../../../../../icons/stable-diffusion/index.js";import"../../../../../icons/stability-ai/index.js";import"../../../../../icons/article-generator/index.js";import"../../../../../icons/success/index.js";import"../../../../../icons/google/index.js";import"../../../../../icons/yandex/index.js";import"../../../../../icons/vk/index.js";import"../../../../../icons/resend/index.js";import"../../../../../icons/big-article/index.js";import"../../../../../icons/add-chat/index.js";import"../../../../../icons/add-group/index.js";import"../../../../../icons/drag-dot/index.js";import"../../../../../icons/add-folder/index.js";import"../../../../../icons/temp-chat/index.js";import"../../../../../icons/delete-chat/index.js";import"../../../../../icons/sidebar-chat/index.js";import"../../../../../icons/organization/index.js";import"../../../../../icons/simple-gear/index.js";import"../../../../../icons/text-bold/index.js";import"../../../../../icons/text-italic/index.js";import"../../../../../icons/text-underline/index.js";import"../../../../../icons/text-strikethrough/index.js";import"../../../../../icons/refresh/index.js";import"../../../../../icons/copy-variants/index.js";import"../../../../../icons/sort-ascending/index.js";import"../../../../../icons/sort-descending/index.js";import"../../../../../icons/quote/index.js";import"../../../../../icons/url-circle/index.js";import"../../../../../icons/show-ui/index.js";import"../../../../../icons/hide-ui/index.js";import"../../../../../icons/sort-user/index.js";import"../../../../../icons/happy-robot/index.js";import"../../../../../icons/happy-robot-gradient/index.js";import"../../../../../icons/min-window/index.js";import"../../../../../icons/max-window/index.js";import"../../../../../icons/manage-chat/index.js";import"../../../../../icons/analyze-urls/index.js";import"../../../../../icons/web-search/index.js";import"../../../../../icons/include-context/index.js";import"../../../../../icons/queue/index.js";import"../../../../../icons/sort-alphabet-ascending/index.js";import"../../../../../icons/sort-alphabet-descending/index.js";import"../../../../../icons/sort-date-ascending/index.js";import"../../../../../icons/sort-date-descending/index.js";import"../../../../../icons/cot-r1/index.js";import"../../../../../icons/news/index.js";import"../../../../../icons/volume/index.js";import"../../../../../icons/flag-ru/index.js";import"../../../../../icons/flag-kz/index.js";import"../../../../../icons/print/index.js";import"../../../../../icons/pc-icon-1/index.js";import"../../../../../icons/pc-icon-2/index.js";import"../../../../../icons/pc-icon-3/index.js";import"../../../../../icons/star-unfilled/index.js";import"../../../../../icons/image-generation/index.js";import"../../../../../icons/speech-synthesys/index.js";import"../../../../../icons/transcription/index.js";import"../../../../../icons/text-rewrite/index.js";import"../../../../../icons/code-generation/index.js";import"../../../../../icons/essay-generation/index.js";import"../../../../../icons/spelling/index.js";import"../../../../../icons/text-generation/index.js";import"../../../../../icons/traffic-analisys/index.js";import"../../../../../icons/fav-profile/index.js";import"../../../../../icons/exclamation/index.js";import"../../../../../icons/article/index.js";import"../../../../../icons/setchel/index.js";import"../../../../../icons/assembly/index.js";import"../../../../../icons/data-visualisation/index.js";import"../../../../../icons/document-analisys/index.js";import"../../../../../icons/problem-solvment/index.js";import"../../../../../icons/setting-analisys/index.js";import"../../../../../icons/translation/index.js";import{StarsIcon as z}from"../../../../../icons/stars/index.js";import"../../../../../icons/academy/index.js";import"../../../../../icons/articles/index.js";import"../../../../../icons/blog-post/index.js";import"../../../../../icons/book/index.js";import"../../../../../icons/bow-tie/index.js";import"../../../../../icons/case-study/index.js";import"../../../../../icons/comments/index.js";import"../../../../../icons/guide/index.js";import"../../../../../icons/marketing/index.js";import"../../../../../icons/post/index.js";import"../../../../../icons/report/index.js";import"../../../../../icons/review/index.js";import"../../../../../icons/scientific-article/index.js";import"../../../../../icons/selling-text/index.js";import"../../../../../icons/textbook/index.js";import"../../../../../icons/wind/index.js";import"../../../../../icons/grok/index.js";import"../../../../../icons/deepseek/index.js";import"../../../../../icons/grid-horizontal/index.js";import"../../../../../icons/grid-vertical/index.js";import"../../../../../icons/star-gradient/index.js";import"../../../../../icons/qwen/index.js";import"../../../../../icons/sidebar-toggle-left/index.js";import"../../../../../icons/sidebar-toggle-right/index.js";import"../../../../../icons/system/index.js";import"../../../../../icons/selector/index.js";import"../../../../../icons/video-camera/index.js";import"../../../../../icons/music-note/index.js";import"../../../../../icons/add-profile/index.js";import"../../../../../icons/token-counter/index.js";import"../../../../../icons/customer-support/index.js";import"../../../../../icons/sort-alphabet-top-bottom/index.js";import"../../../../../icons/sort-alphabet-bottom-top/index.js";import"../../../../../icons/pause/index.js";import"../../../../../icons/play/index.js";import"../../../../../icons/restore-2/index.js";import"../../../../../icons/video-generation/index.js";import"../../../../../icons/veo-model/index.js";import"../../../../../icons/runway/index.js";import"../../../../../icons/queue-select/index.js";import"../../../../../icons/apple/index.js";import"../../../../../icons/mail-colored/index.js";import"../../../../../icons/shield/index.js";import"../../../../../icons/stars-gradient/index.js";import"../../../../../icons/fire/index.js";import"../../../../../icons/brain/index.js";import"../../../../../icons/mj-purple/index.js";import"../../../../../icons/claude-black/index.js";import"../../../../../icons/vk-filled/index.js";import"../../../../../icons/tg/index.js";import"../../../../../icons/gift/index.js";import"../../../../../icons/exchange/index.js";import"../../../../../icons/time/index.js";import{useTheme as $}from"../../../../../theme/hook.js";import{TooltipConsumer as C}from"../../../../tooltip/context.js";const O=M=>{var{value:L,data:q,size:E,disableSelect:T=!1,selectedColor:A,onOptionClick:P}=M,S=i(M,["value","data","size","disableSelect","selectedColor","onOptionClick"]);const D=$(),N=s(i=>{null==P||P(i)},[P]);return o(t,Object.assign({$size:E},S,{children:q.map((i,s)=>{var t,$,M,q,S,_,B,F,G,H,I,J,K,Q,R;if("string"==typeof i){let n;return n=!(!L||Array.isArray(L))&&("string"==typeof L?i===L:i===L.value),o(y,{$selected:n,$disabled:!1,$size:E,$selectedColor:A,"data-test":i,onClick:N.bind(null,i),children:o(r,{children:o(w,{$selected:n,$size:E,children:i})})},s)}if("divider"===i.type)return o(d,{},null!==($=null!==(t=i.id)&&void 0!==t?t:i.value)&&void 0!==$?$:`divider-${s}`);if("label"===i.type)return o(c,{children:i.label},null!==(q=null!==(M=i.id)&&void 0!==M?M:i.value)&&void 0!==q?q:`label-${s}`);if("empty"===i.type&&i.label)return n(p,{$size:E,children:[o(g,{size:34,fill:D.colors.grayScale.gray1,children:null!==(S=i.icon)&&void 0!==S?S:o(f,{})}),o(m,{children:i.label})]},null!==(B=null!==(_=i.id)&&void 0!==_?_:i.value)&&void 0!==B?B:`empty-${s}`);if("radio"===i.type){const t=o=>{o.preventDefault(),N(i)},r=null!==(G=null!==(F=i.id)&&void 0!==F?F:i.value)&&void 0!==G?G:`radio-${s}`,d={$selected:i.selected,$disabled:i.disabled,onClick:t,children:n(e,{children:[n(l,{children:[i.label&&o(a,{$size:E,children:i.label}),o(v,{type:"radio",checked:null!==(H=i.selected)&&void 0!==H&&H,name:i.radioName,disabled:i.disabled,icon:i.disabled?i.end:void 0})]}),i.description&&o(x,{children:i.description})]})};return i.tooltip||i.label&&i.label.length>64?o(u,Object.assign({},i.tooltip,i.label&&i.label.length>64&&{placement:"top-left",label:i.label,disabled:!1},{children:o(C,{children:({handleTooltipMouseEnter:e,handleTooltipMouseLeave:s})=>n(j,Object.assign({},d,{onPointerDown:e,onPointerLeave:s,onMouseEnter:e,onMouseLeave:s,onClick:t,"data-test":i.label,children:[n(l,{children:[i.icon&&o(g,{size:"large"===E?24:16,children:i.icon}),i.label&&n(b,{children:[o(a,{$size:E,children:i.label}),i.best_model&&o(z,{size:18})]}),o(v,{type:"radio",checked:!!i.selected,name:i.radioName,disabled:i.disabled,icon:i.disabled?i.end:void 0})]}),i.description&&o(x,{children:i.description})]}))})}),r):o(j,Object.assign({"data-test":i.label},d),r)}if("collapse"===i.type&&i.data){const n={size:E,item:i,onClick:i.onClick,icon:i.disabled?i.end:void 0,children:o(O,{value:L,data:null!==(I=i.data)&&void 0!==I?I:[],size:E,disableSelect:T,onOptionClick:P,selectedColor:A})},e=null!==(K=null!==(J=i.id)&&void 0!==J?J:i.value)&&void 0!==K?K:`collapse-${s}`;return i.tooltip||i.label&&i.label.length>64?o(u,Object.assign({},i.tooltip,i.label&&i.label.length>64&&{placement:"top-left",label:i.label,disabled:!1},{children:o(C,{children:({handleTooltipMouseEnter:i,handleTooltipMouseLeave:e})=>o(h,Object.assign({},n,{onPointerDown:i,onPointerLeave:e,onMouseEnter:i,onMouseLeave:e}))})}),e):o(h,Object.assign({},n),e)}const U=!!i.disabled;let V;V=!(!L||Array.isArray(L))&&(("string"==typeof L?i.value===L:i.value===L.value)&&!T);const W=null!==(R=null!==(Q=i.id)&&void 0!==Q?Q:i.value)&&void 0!==R?R:s,X={item:i,selected:V,disabled:U,size:E,selectedColor:A,onClick:N.bind(null,i)};return i.tooltip||i.label&&i.label.length>64?o(u,Object.assign({},i.tooltip,i.label&&i.label.length>64&&{placement:"top-left",label:i.label,disabled:!1},{children:o(C,{children:({handleTooltipMouseEnter:n,handleTooltipMouseLeave:e})=>o(k,Object.assign({},X,{onMouseEnter:n,onMouseLeave:e,"data-test":i.label}))})}),W):o(k,Object.assign({"data-test":i.label},X),W)})}))};export{O as SelectFieldOptions};

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

@@ -4,7 +4,7 @@ export interface SelectFieldOptionsStyledProps {
 }
 export declare const SelectFieldOptionsStyled: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, SelectFieldOptionsStyledProps>>;
 export declare const SelectFieldDivider: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
+    ref?: import("react").Ref<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -53,6 +53,10 @@ export declare const SelectFieldDivider: import("styled-components").IStyledComp
     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;
@@ -262,6 +266,8 @@ export declare const SelectFieldDivider: import("styled-components").IStyledComp
     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;
@@ -270,8 +276,16 @@ export declare const SelectFieldDivider: import("styled-components").IStyledComp
     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;
 }>;
 export interface SelectFieldEmptyProps {
     $size: SelectFieldSize;
@@ -282,7 +296,7 @@ export declare const SelectFieldRadio: import("styled-components").IStyledCompon
     $disabled?: boolean;
 }>>;
 export declare const SelectFieldRadioTitleAndRadio: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").LegacyRef<HTMLLabelElement> | undefined;
+    ref?: import("react").Ref<HTMLLabelElement> | undefined;
     key?: import("react").Key | null | undefined;
     form?: string | undefined | undefined;
     htmlFor?: string | undefined | undefined;
@@ -333,6 +347,10 @@ export declare const SelectFieldRadioTitleAndRadio: 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;
@@ -542,6 +560,8 @@ export declare const SelectFieldRadioTitleAndRadio: import("styled-components").
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLLabelElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLLabelElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLLabelElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLLabelElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLLabelElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLLabelElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLLabelElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLLabelElement> | undefined;
@@ -550,12 +570,25 @@ export declare const SelectFieldRadioTitleAndRadio: import("styled-components").
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLLabelElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLLabelElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLLabelElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLLabelElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLLabelElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLLabelElement> | undefined;
 }>;
 export declare const SelectFieldRadioLabel: import("styled-components").IStyledComponent<"web", {
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -604,6 +637,10 @@ export declare const SelectFieldRadioLabel: import("styled-components").IStyledC
     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;
@@ -812,6 +849,8 @@ export declare const SelectFieldRadioLabel: import("styled-components").IStyledC
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -820,18 +859,21 @@ export declare const SelectFieldRadioLabel: import("styled-components").IStyledC
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
     $size: SelectFieldSize;
 }>;
 export declare const SelectFieldRadioLabelWrapper: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
+    ref?: import("react").Ref<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -880,6 +922,10 @@ export declare const SelectFieldRadioLabelWrapper: import("styled-components").I
     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;
@@ -1089,6 +1135,8 @@ export declare const SelectFieldRadioLabelWrapper: import("styled-components").I
     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;
@@ -1097,12 +1145,25 @@ export declare const SelectFieldRadioLabelWrapper: import("styled-components").I
     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;
 }>;
 export declare const SelectFieldRadioDescription: import("styled-components").IStyledComponent<"web", {
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -1151,6 +1212,10 @@ export declare const SelectFieldRadioDescription: import("styled-components").IS
     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;
@@ -1359,6 +1424,8 @@ export declare const SelectFieldRadioDescription: import("styled-components").IS
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -1367,18 +1434,26 @@ export declare const SelectFieldRadioDescription: import("styled-components").IS
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
 }>;
 export declare const SelectFieldEmptyText: import("styled-components").IStyledComponent<"web", {
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -1427,6 +1502,10 @@ export declare const SelectFieldEmptyText: import("styled-components").IStyledCo
     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;
@@ -1635,6 +1714,8 @@ export declare const SelectFieldEmptyText: import("styled-components").IStyledCo
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -1643,17 +1724,20 @@ export declare const SelectFieldEmptyText: import("styled-components").IStyledCo
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
 }>;
 export declare const SelectFieldOptionSide: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
+    ref?: import("react").Ref<HTMLDivElement> | undefined;
     key?: import("react").Key | null | undefined;
     defaultChecked?: boolean | undefined | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1702,6 +1786,10 @@ export declare const SelectFieldOptionSide: import("styled-components").IStyledC
     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;
@@ -1911,6 +1999,8 @@ export declare const SelectFieldOptionSide: import("styled-components").IStyledC
     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;
@@ -1919,12 +2009,25 @@ export declare const SelectFieldOptionSide: import("styled-components").IStyledC
     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;
 }>;
 export declare const SelectFieldOptionLabel: import("styled-components").IStyledComponent<"web", {
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -1973,6 +2076,10 @@ export declare const SelectFieldOptionLabel: import("styled-components").IStyled
     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;
@@ -2181,6 +2288,8 @@ export declare const SelectFieldOptionLabel: import("styled-components").IStyled
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -2189,12 +2298,15 @@ export declare const SelectFieldOptionLabel: import("styled-components").IStyled
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
 }>;

package/dist/components/select-field/select-modal/option/list/styled.js

@@ -0,0 +1 @@
+import{styled as e,css as i}from"styled-components";import{Typography as t}from"../../../../typography/index.js";const a=e.div.withConfig({displayName:"styled__SelectFieldOptionsStyled",componentId:"sc-ugyiao-0"})(["display:flex;width:100%;flex-direction:column;gap:","px;"],({$size:e})=>{switch(e){case"small":return 4;case"md":return 6;case"large":return 8}}),o=e.div.withConfig({displayName:"styled__SelectFieldDivider",componentId:"sc-ugyiao-1"})(["display:flex;flex-shrink:0;width:100%;height:1px;background:",";"],({theme:e})=>e.colors.grayScale.gray3),l=e.div.withConfig({displayName:"styled__SelectFieldEmpty",componentId:"sc-ugyiao-2"})(["display:flex;flex-direction:column;align-items:center;width:100%;gap:8px;padding:","px;"],({$size:e})=>{switch(e){case"small":return 8;case"md":case"large":return 12}}),d=e.div.withConfig({displayName:"styled__SelectFieldRadio",componentId:"sc-ugyiao-3"})(["display:flex;flex-direction:column;gap:10px;padding:10px;cursor:pointer;position:relative;& > *{position:relative;z-index:1;}&:before{content:'';display:block;position:absolute;border-radius:8px;inset:0;opacity:0.2;transition:background 0.2s;",";}&:hover:before{background-color:",";}",""],({$selected:e})=>e&&i(["background:linear-gradient( 90deg,rgba(28,100,242,1) 0%,rgba(212,28,242,1) 100% );"]),({theme:e})=>e.colors.accent.primary,({$disabled:e})=>e&&i(["cursor:not-allowed;& > * > ","{opacity:0.5;}"],s)),n=e.label.withConfig({displayName:"styled__SelectFieldRadioTitleAndRadio",componentId:"sc-ugyiao-4"})(["display:flex;justify-content:space-between;align-items:center;gap:8px;cursor:inherit;"]),s=e(t).attrs(e=>({variant:"large"===e.$size?"body-m-semibold":"input-sm"})).withConfig({displayName:"styled__SelectFieldRadioLabel",componentId:"sc-ugyiao-5"})([""]),r=e.div.withConfig({displayName:"styled__SelectFieldRadioLabelWrapper",componentId:"sc-ugyiao-6"})(["display:flex;width:100%;align-items:start;gap:5px;"]),c=e(t).attrs({variant:"body-m-regular"}).withConfig({displayName:"styled__SelectFieldRadioDescription",componentId:"sc-ugyiao-7"})([""]),p=e(t).attrs({variant:"input-sm"}).withConfig({displayName:"styled__SelectFieldEmptyText",componentId:"sc-ugyiao-8"})(["text-align:center;color:",";"],({theme:e})=>e.colors.grayScale.gray1),y=e.div.withConfig({displayName:"styled__SelectFieldOptionSide",componentId:"sc-ugyiao-9"})(["display:flex;align-items:center;gap:8px;"]),g=e(t).attrs({variant:"body-m-medium"}).withConfig({displayName:"styled__SelectFieldOptionLabel",componentId:"sc-ugyiao-10"})(["padding-right:8px;"]);export{o as SelectFieldDivider,l as SelectFieldEmpty,p as SelectFieldEmptyText,g as SelectFieldOptionLabel,y as SelectFieldOptionSide,a as SelectFieldOptionsStyled,d as SelectFieldRadio,c as SelectFieldRadioDescription,s as SelectFieldRadioLabel,r as SelectFieldRadioLabelWrapper,n as SelectFieldRadioTitleAndRadio};

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

@@ -0,0 +1 @@
+import{__rest as e}from"tslib";import{jsxs as o,jsx as l,Fragment as r}from"react/jsx-runtime";import{IconProvider as t}from"../../../../icon/context.js";import"../../../../icon/styled.js";import"react";import"@react-spring/web";import"react-markdown";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{SelectFieldOptionSide as i}from"../list/styled.js";import{SelectFieldOptionStyled as c,SelectFieldOptionText as s,SelectFieldOptionColor as d,SelectFieldColorOptionText as a}from"./styled.js";import{useTheme as m}from"../../../../../theme/hook.js";const n=n=>{var{item:p,selected:b,disabled:h,size:j,selectedColor:$}=n,g=e(n,["item","selected","disabled","size","selectedColor"]);const y=m();return o(c,Object.assign({$selected:b,$disabled:h,$size:j,$backgroundHoverColor:p.backgroundHoverColor,$selectedColor:$},g,{children:[o(i,{children:[p.icon&&l(t,{fill:y.colors.base.white,size:"large"===j?24:18,children:p.icon}),!p.color&&o(s,{$selected:b,$size:j,$bold:p.bold,children:[p.label&&o(r,{children:[p.label.slice(0,64),p.label.length>64&&"..."]}),!p.label&&p.value]}),p.color&&l(d,{$color:p.color===y.colors.accent.primary&&b?y.colors.accent.primaryLight:p.color}),p.color&&o(a,{$selected:b,children:[p.label&&o(r,{children:[p.label.slice(0,64),p.label.length>64&&"..."]}),!p.label&&p.value]})]}),p.end&&l(i,{children:l(t,{size:16,children:p.end})})]}))};export{n as SelectFieldOption};

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

@@ -4,8 +4,13 @@ export interface SelectFieldOptionTextProps {
     $bold?: boolean;
 }
 export declare const SelectFieldOptionText: import("styled-components").IStyledComponent<"web", {
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -54,6 +59,10 @@ export declare const SelectFieldOptionText: import("styled-components").IStyledC
     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;
@@ -262,6 +271,8 @@ export declare const SelectFieldOptionText: import("styled-components").IStyledC
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -270,14 +281,17 @@ export declare const SelectFieldOptionText: import("styled-components").IStyledC
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
     $selected: boolean;
     $bold?: boolean | undefined;
     $size: SelectFieldSize;
@@ -286,8 +300,13 @@ export interface SelectFieldColorOptionTextProps {
     $selected: boolean;
 }
 export declare const SelectFieldColorOptionText: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<{
-    children?: import("react").ReactNode;
     variant?: import("@/ui/components/typography").TypographyVariant | undefined;
+    component?: import("@/ui/components/typography").TypographyComponent | undefined;
+    align?: import("@/ui/components/typography").TypographyAlign | undefined;
+    fullWidth?: boolean | undefined;
+    href?: string | undefined;
+    target?: import("react").HTMLAttributeAnchorTarget | undefined;
+    children?: import("react").ReactNode;
     hidden?: boolean | undefined | undefined;
     color?: string | undefined | undefined;
     content?: string | undefined | undefined;
@@ -336,6 +355,10 @@ export declare const SelectFieldColorOptionText: import("styled-components").ISt
     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;
@@ -544,6 +567,8 @@ export declare const SelectFieldColorOptionText: import("styled-components").ISt
     onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
     onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEnd?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
+    onScrollEndCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
     onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
@@ -552,14 +577,17 @@ export declare const SelectFieldColorOptionText: import("styled-components").ISt
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
+    onToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onBeforeToggle?: import("react").ToggleEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancel?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
-    target?: import("react").HTMLAttributeAnchorTarget | undefined;
-    href?: string | undefined;
-    align?: import("@/ui/components/typography").TypographyAlign | undefined;
-    component?: import("@/ui/components/typography").TypographyComponent | undefined;
-    fullWidth?: boolean | undefined;
-    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;
+    onTransitionRun?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStart?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
+    ref?: import("react").Ref<HTMLSpanElement> | undefined;
 }, SelectFieldColorOptionTextProps>>;
 export interface SelectFieldOptionColorProps {
     $color: string;