@bitrix24/b24ui-nuxt 2.0.8 → 2.1.0

package/dist/runtime/components/App.d.vue.ts

@@ -1,6 +1,6 @@
 import type { ConfigProviderProps, TooltipProviderProps } from 'reka-ui';
 import type { ToasterProps, Locale, Messages } from '../types';
-export interface AppProps<T extends Messages = Messages> extends Omit<ConfigProviderProps, 'useId' | 'dir' | 'locale'> {
+export interface AppProps<T extends Messages = Messages> extends Omit<ConfigProviderProps, 'useId' | 'locale'> {
     tooltip?: TooltipProviderProps;
     toaster?: ToasterProps | null;
     locale?: Locale<T>;

package/dist/runtime/components/App.vue

@@ -17,6 +17,7 @@ const props = defineProps({
   toaster: { type: [Object, null], required: false },
   locale: { type: Object, required: false },
   portal: { type: [Boolean, String], required: false, skipCheck: true, default: "body" },
+  dir: { type: String, required: false },
   scrollBody: { type: [Boolean, Object], required: false },
   nonce: { type: String, required: false }
 });
@@ -31,7 +32,7 @@ provide(portalTargetInjectionKey, portal);
 </script>
 
 <template>
-  <ConfigProvider :use-id="() => useId()" :dir="locale?.dir" :locale="locale?.code" v-bind="configProviderProps">
+  <ConfigProvider :use-id="() => useId()" :dir="props.dir || locale?.dir" :locale="locale?.code" v-bind="configProviderProps">
     <TooltipProvider v-bind="tooltipProps">
       <B24Toaster v-if="toaster !== null" v-bind="toasterProps">
         <slot />

package/dist/runtime/components/App.vue.d.ts

@@ -1,6 +1,6 @@
 import type { ConfigProviderProps, TooltipProviderProps } from 'reka-ui';
 import type { ToasterProps, Locale, Messages } from '../types';
-export interface AppProps<T extends Messages = Messages> extends Omit<ConfigProviderProps, 'useId' | 'dir' | 'locale'> {
+export interface AppProps<T extends Messages = Messages> extends Omit<ConfigProviderProps, 'useId' | 'locale'> {
     tooltip?: TooltipProviderProps;
     toaster?: ToasterProps | null;
     locale?: Locale<T>;

package/dist/runtime/components/Avatar.d.vue.ts

@@ -1,9 +1,10 @@
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/avatar';
 import type { IconComponent, ChipProps } from '../types';
+import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type Avatar = ComponentConfig<typeof theme, AppConfig, 'avatar'>;
-export interface AvatarProps {
+export interface AvatarProps extends /** @vue-ignore */ Omit<ImgHTMLAttributes, 'src' | 'alt'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'span'

package/dist/runtime/components/Avatar.vue.d.ts

@@ -1,9 +1,10 @@
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/avatar';
 import type { IconComponent, ChipProps } from '../types';
+import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type Avatar = ComponentConfig<typeof theme, AppConfig, 'avatar'>;
-export interface AvatarProps {
+export interface AvatarProps extends /** @vue-ignore */ Omit<ImgHTMLAttributes, 'src' | 'alt'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'span'

package/dist/runtime/components/Button.vue

@@ -60,6 +60,7 @@ const props = defineProps({
   prefetch: { type: Boolean, required: false },
   prefetchOn: { type: [String, Object], required: false },
   noPrefetch: { type: Boolean, required: false },
+  trailingSlash: { type: String, required: false },
   exactActiveClass: { type: String, required: false },
   ariaCurrentValue: { type: String, required: false },
   viewTransition: { type: Boolean, required: false },

package/dist/runtime/components/ChatPrompt.d.vue.ts

@@ -33,7 +33,7 @@ export interface ChatPromptSlots extends TextareaSlots {
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPromptProps & {
     modelValue?: string;
 }, {
-    textareaRef: HTMLTextAreaElement | null | undefined;
+    textareaRef: Readonly<import("vue").Ref<HTMLTextAreaElement | null | undefined, HTMLTextAreaElement | null | undefined>>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (event: Event) => any;
     submit: (event: Event) => any;
@@ -45,10 +45,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPr
     onSubmit?: ((event: Event) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
+    rows: number;
     as: any;
     autofocus: boolean;
     autoresize: boolean;
-    rows: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatPromptSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ChatPrompt.vue

@@ -3,7 +3,7 @@ import theme from "#build/b24ui/chat-prompt";
 </script>
 
 <script setup>
-import { computed, useTemplateRef } from "vue";
+import { computed, toRef, useTemplateRef } from "vue";
 import { Primitive, useForwardProps } from "reka-ui";
 import { reactivePick } from "@vueuse/core";
 import { useAppConfig } from "#imports";
@@ -40,6 +40,7 @@ const getProxySlots = () => omit(slots, ["header", "footer", "default"]);
 const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.chatPrompt || {} })({
   variant: props.variant
 }));
+const textareaRef = useTemplateRef("textareaRef");
 function submit(e) {
   if (model.value.trim() === "") {
     return;
@@ -47,12 +48,11 @@ function submit(e) {
   emits("submit", e);
 }
 function blur(e) {
-  textarea.value?.textareaRef?.blur();
+  textareaRef.value?.textareaRef?.blur();
   emits("close", e);
 }
-const textarea = useTemplateRef("textarea");
 defineExpose({
-  textareaRef: textarea.value?.textareaRef
+  textareaRef: toRef(() => textareaRef.value?.textareaRef)
 });
 </script>
 
@@ -63,7 +63,7 @@ defineExpose({
     </div>
 
     <B24Textarea
-      ref="textarea"
+      ref="textareaRef"
       v-model="model"
       :placeholder="placeholder || t('chatPrompt.placeholder')"
       :disabled="Boolean(error) || disabled"

package/dist/runtime/components/ChatPrompt.vue.d.ts

@@ -33,7 +33,7 @@ export interface ChatPromptSlots extends TextareaSlots {
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPromptProps & {
     modelValue?: string;
 }, {
-    textareaRef: HTMLTextAreaElement | null | undefined;
+    textareaRef: Readonly<import("vue").Ref<HTMLTextAreaElement | null | undefined, HTMLTextAreaElement | null | undefined>>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (event: Event) => any;
     submit: (event: Event) => any;
@@ -45,10 +45,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPr
     onSubmit?: ((event: Event) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
+    rows: number;
     as: any;
     autofocus: boolean;
     autoresize: boolean;
-    rows: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatPromptSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ChatPromptSubmit.d.vue.ts

@@ -4,7 +4,7 @@ import theme from '#build/b24ui/chat-prompt-submit';
 import type { ButtonProps, ButtonSlots, IconComponent } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type ChatPromptSubmit = ComponentConfig<typeof theme, AppConfig, 'chatPromptSubmit'>;
-export interface ChatPromptSubmitProps extends /** @vue-ignore */ Pick<ButtonProps, 'size' | 'label'> {
+export interface ChatPromptSubmitProps extends Omit<ButtonProps, 'icon' | 'color'> {
     status?: ChatStatus;
     /**
      * The icon displayed in the button when the status is `ready`.
@@ -64,11 +64,11 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPr
     onStop?: (() => any) | undefined;
     onReload?: (() => any) | undefined;
 }>, {
-    color: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
     status: ChatStatus;
-    streamingColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
-    submittedColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
-    errorColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    color: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    streamingColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    submittedColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    errorColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ButtonSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ChatPromptSubmit.vue

@@ -4,12 +4,15 @@ import theme from "#build/b24ui/chat-prompt-submit";
 
 <script setup>
 import { computed } from "vue";
+import { useForwardProps } from "reka-ui";
+import { reactiveOmit } from "@vueuse/core";
 import { useAppConfig } from "#imports";
 import { useLocale } from "../composables/useLocale";
 import { transformUI } from "../utils";
 import { tv } from "../utils/tv";
 import icons from "../dictionary/icons";
 import B24Button from "./Button.vue";
+defineOptions({ inheritAttrs: false });
 const props = defineProps({
   status: { type: String, required: false, default: "ready" },
   icon: { type: [Function, Object], required: false },
@@ -21,13 +24,54 @@ const props = defineProps({
   errorIcon: { type: [Function, Object], required: false },
   errorColor: { type: null, required: false, default: "air-primary-alert" },
   b24ui: { type: void 0, required: false },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  label: { type: String, required: false },
+  activeColor: { type: null, required: false },
+  depth: { type: null, required: false },
+  activeDepth: { type: null, required: false },
+  size: { type: null, required: false },
+  rounded: { type: Boolean, required: false },
+  block: { type: Boolean, required: false },
+  loadingAuto: { type: Boolean, required: false },
+  normalCase: { type: Boolean, required: false },
+  useWait: { type: Boolean, required: false },
+  useClock: { type: Boolean, required: false },
+  useDropdown: { type: Boolean, required: false },
+  onClick: { type: [Function, Array], required: false },
+  activeClass: { type: String, required: false },
+  inactiveClass: { type: String, required: false },
+  avatar: { type: Object, required: false },
+  loading: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  type: { type: null, required: false },
+  disabled: { type: Boolean, required: false },
+  active: { type: Boolean, required: false },
+  exact: { type: Boolean, required: false },
+  exactQuery: { type: [Boolean, String], required: false },
+  exactHash: { type: Boolean, required: false },
+  isAction: { type: Boolean, required: false },
+  to: { type: null, required: false },
+  href: { type: null, required: false },
+  external: { type: Boolean, required: false },
+  target: { type: [String, Object, null], required: false },
+  rel: { type: [String, Object, null], required: false },
+  noRel: { type: Boolean, required: false },
+  prefetchedClass: { type: String, required: false },
+  prefetch: { type: Boolean, required: false },
+  prefetchOn: { type: [String, Object], required: false },
+  noPrefetch: { type: Boolean, required: false },
+  trailingSlash: { type: String, required: false },
+  exactActiveClass: { type: String, required: false },
+  ariaCurrentValue: { type: String, required: false },
+  viewTransition: { type: Boolean, required: false },
+  replace: { type: Boolean, required: false }
 });
 const emits = defineEmits(["stop", "reload"]);
 const slots = defineSlots();
 const { t } = useLocale();
 const appConfig = useAppConfig();
-const buttonProps = computed(() => ({
+const buttonProps = useForwardProps(reactiveOmit(props, "icon", "color", "status", "streamingIcon", "streamingColor", "submittedIcon", "submittedColor", "errorIcon", "errorColor", "class", "b24ui"));
+const statusButtonProps = computed(() => ({
   ready: {
     icon: props.icon || icons.imSend,
     color: props.color,
@@ -60,9 +104,14 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.chatPro
 
 <template>
   <B24Button
+    v-bind="{
+  ...buttonProps,
+  ...statusButtonProps,
+  'aria-label': t('chatPromptSubmit.label'),
+  'rounded': true,
+  ...$attrs
+}"
     :aria-label="t('chatPromptSubmit.label')"
-    rounded
-    v-bind="buttonProps"
     :class="b24ui.base({ class: [props.b24ui?.base, props.class] })"
     :b24ui="transformUI(b24ui, props.b24ui)"
   >

package/dist/runtime/components/ChatPromptSubmit.vue.d.ts

@@ -4,7 +4,7 @@ import theme from '#build/b24ui/chat-prompt-submit';
 import type { ButtonProps, ButtonSlots, IconComponent } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type ChatPromptSubmit = ComponentConfig<typeof theme, AppConfig, 'chatPromptSubmit'>;
-export interface ChatPromptSubmitProps extends /** @vue-ignore */ Pick<ButtonProps, 'size' | 'label'> {
+export interface ChatPromptSubmitProps extends Omit<ButtonProps, 'icon' | 'color'> {
     status?: ChatStatus;
     /**
      * The icon displayed in the button when the status is `ready`.
@@ -64,11 +64,11 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ChatPr
     onStop?: (() => any) | undefined;
     onReload?: (() => any) | undefined;
 }>, {
-    color: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
     status: ChatStatus;
-    streamingColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
-    submittedColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
-    errorColor: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    color: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    streamingColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    submittedColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    errorColor: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ButtonSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Checkbox.d.vue.ts

@@ -1,9 +1,10 @@
 import type { CheckboxRootProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/checkbox';
+import type { ButtonHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type Checkbox = ComponentConfig<typeof theme, AppConfig, 'checkbox'>;
-export interface CheckboxProps extends Pick<CheckboxRootProps, 'disabled' | 'required' | 'name' | 'value' | 'id' | 'defaultValue'> {
+export interface CheckboxProps extends Pick<CheckboxRootProps, 'disabled' | 'required' | 'name' | 'value' | 'id' | 'defaultValue'>, /** @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled' | 'name'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'div'

package/dist/runtime/components/Checkbox.vue.d.ts

@@ -1,9 +1,10 @@
 import type { CheckboxRootProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/checkbox';
+import type { ButtonHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type Checkbox = ComponentConfig<typeof theme, AppConfig, 'checkbox'>;
-export interface CheckboxProps extends Pick<CheckboxRootProps, 'disabled' | 'required' | 'name' | 'value' | 'id' | 'defaultValue'> {
+export interface CheckboxProps extends Pick<CheckboxRootProps, 'disabled' | 'required' | 'name' | 'value' | 'id' | 'defaultValue'>, /** @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled' | 'name'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'div'

package/dist/runtime/components/CommandPalette.vue

@@ -22,6 +22,7 @@ import B24LinkBase from "./LinkBase.vue";
 import B24Link from "./Link.vue";
 import B24Input from "./Input.vue";
 import B24Kbd from "./Kbd.vue";
+defineOptions({ inheritAttrs: false });
 const props = defineProps({
   as: { type: null, required: false },
   icon: { type: [Function, Object], required: false },
@@ -152,7 +153,7 @@ const filteredGroups = computed(() => {
   }, [...fuseGroups]);
 });
 const filteredItems = computed(() => filteredGroups.value.flatMap((group) => group.items || []));
-const listboxRootRef = useTemplateRef("listboxRootRef");
+const rootRef = useTemplateRef("rootRef");
 function navigate(item) {
   if (!item.children?.length) {
     return;
@@ -165,7 +166,7 @@ function navigate(item) {
     items: item.children
   });
   searchTerm.value = "";
-  listboxRootRef.value?.highlightFirstItem();
+  rootRef.value?.highlightFirstItem();
 }
 function navigateBack() {
   if (!history.value.length) {
@@ -173,7 +174,7 @@ function navigateBack() {
   }
   history.value.pop();
   searchTerm.value = "";
-  listboxRootRef.value?.highlightFirstItem();
+  rootRef.value?.highlightFirstItem();
 }
 function onBackspace() {
   if (!searchTerm.value) {
@@ -326,7 +327,7 @@ function onSelect(e, item) {
     </ListboxItem>
   </DefineItemTemplate>
 
-  <ListboxRoot v-bind="rootProps" ref="listboxRootRef" :selection-behavior="selectionBehavior" :class="b24ui.root({ class: [props.b24ui?.root, props.class] })">
+  <ListboxRoot v-bind="{ ...rootProps, ...$attrs }" ref="rootRef" :selection-behavior="selectionBehavior" :class="b24ui.root({ class: [props.b24ui?.root, props.class] })">
     <ListboxFilter v-model="searchTerm" as-child>
       <B24Input
         :placeholder="placeholder"

package/dist/runtime/components/DashboardSearch.d.vue.ts

@@ -4,6 +4,9 @@ import theme from '#build/b24ui/dashboard-search';
 import type { ButtonProps, InputProps, ModalProps, CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem, IconComponent } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearch = ComponentConfig<typeof theme, AppConfig, 'dashboardSearch'>;
+/**
+ * @memo not use loadingIcon
+ */
 export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal'> {
     /**
      * The icon displayed in the input.
@@ -23,12 +26,6 @@ export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPale
     autofocus?: boolean;
     /** When `true`, the loading icon will be displayed. */
     loading?: boolean;
-    /**
-     * The icon when the `loading` prop is `true`.
-     * @defaultValue icons.loading
-     * @IconComponent
-     */
-    loadingIcon?: IconComponent;
     /**
      * Display a close button in the input (useful when inside a Modal for example).
      * `{ size: 'sm', color: 'air-tertiary-no-accent' }`{lang="ts-type"}

package/dist/runtime/components/DashboardSearch.vue

@@ -19,7 +19,6 @@ const props = defineProps({
   placeholder: { type: String, required: false },
   autofocus: { type: Boolean, required: false },
   loading: { type: Boolean, required: false },
-  loadingIcon: { type: [Function, Object], required: false },
   close: { type: [Boolean, Object], required: false, default: true },
   closeIcon: { type: [Function, Object], required: false },
   shortcut: { type: String, required: false, default: "meta_k" },
@@ -47,7 +46,7 @@ useRuntimeHook("dashboard:search:toggle", () => {
 const { t } = useLocale();
 const colorMode = useColorMode();
 const appConfig = useAppConfig();
-const commandPaletteProps = useForwardProps(reactivePick(props, "icon", "placeholder", "autofocus", "loading", "loadingIcon", "close", "closeIcon"));
+const commandPaletteProps = useForwardProps(reactivePick(props, "icon", "placeholder", "autofocus", "loading", "close", "closeIcon"));
 const modalProps = useForwardProps(reactivePick(props, "overlay", "transition", "content", "dismissible", "fullscreen", "modal", "portal"));
 const getProxySlots = () => omit(slots, ["content"]);
 const fuse = computed(() => defu({}, props.fuse, {
@@ -93,6 +92,7 @@ const groups = computed(() => {
   }
   return groups2;
 });
+const commandPaletteRef = useTemplateRef("commandPaletteRef");
 function onSelect(item) {
   if (item.disabled) {
     return;
@@ -106,7 +106,6 @@ defineShortcuts({
     handler: () => open.value = !open.value
   }
 });
-const commandPaletteRef = useTemplateRef("commandPaletteRef");
 defineExpose({
   commandPaletteRef
 });

package/dist/runtime/components/DashboardSearch.vue.d.ts

@@ -4,6 +4,9 @@ import theme from '#build/b24ui/dashboard-search';
 import type { ButtonProps, InputProps, ModalProps, CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem, IconComponent } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearch = ComponentConfig<typeof theme, AppConfig, 'dashboardSearch'>;
+/**
+ * @memo not use loadingIcon
+ */
 export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal'> {
     /**
      * The icon displayed in the input.
@@ -23,12 +26,6 @@ export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPale
     autofocus?: boolean;
     /** When `true`, the loading icon will be displayed. */
     loading?: boolean;
-    /**
-     * The icon when the `loading` prop is `true`.
-     * @defaultValue icons.loading
-     * @IconComponent
-     */
-    loadingIcon?: IconComponent;
     /**
      * Display a close button in the input (useful when inside a Modal for example).
      * `{ size: 'sm', color: 'air-tertiary-no-accent' }`{lang="ts-type"}

package/dist/runtime/components/DashboardSearchButton.d.vue.ts

@@ -3,7 +3,7 @@ import theme from '#build/b24ui/dashboard-search-button';
 import type { ButtonProps, ButtonSlots, IconComponent, KbdProps, TooltipProps } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearchButton = ComponentConfig<typeof theme, AppConfig, 'dashboardSearchButton'>;
-export interface DashboardSearchButtonProps {
+export interface DashboardSearchButtonProps extends Omit<ButtonProps, 'icon' | 'label' | 'color'> {
     /**
      * The icon displayed in the button.
      * @defaultValue icons.search
@@ -20,7 +20,6 @@ export interface DashboardSearchButtonProps {
      * @defaultValue 'air-tertiary-no-accent'
      */
     color?: ButtonProps['color'];
-    size?: ButtonProps['size'];
     /**
      * Whether the button is collapsed.
      * @defaultValue false
@@ -41,7 +40,7 @@ export interface DashboardSearchButtonProps {
     class?: any;
 }
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DashboardSearchButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardSearchButtonProps> & Readonly<{}>, {
-    color: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    color: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
     tooltip: boolean | TooltipProps;
     kbds: KbdProps["value"][] | KbdProps[];
     collapsed: boolean;

package/dist/runtime/components/DashboardSearchButton.vue

@@ -6,10 +6,10 @@ import theme from "#build/b24ui/dashboard-search-button";
 import { computed, toRef } from "vue";
 import { useForwardProps } from "reka-ui";
 import { defu } from "defu";
-import { reactivePick, createReusableTemplate } from "@vueuse/core";
+import { reactiveOmit, createReusableTemplate } from "@vueuse/core";
 import { useAppConfig } from "#imports";
 import { useLocale } from "../composables/useLocale";
-import { useDashboard } from "@bitrix24/b24ui-nuxt/utils/dashboard";
+import { useDashboard } from "../utils/dashboard";
 import { omit, transformUI } from "../utils";
 import { tv } from "../utils/tv";
 import icons from "../dictionary/icons";
@@ -21,17 +21,55 @@ const props = defineProps({
   icon: { type: [Function, Object], required: false },
   label: { type: String, required: false },
   color: { type: null, required: false, default: "air-tertiary-no-accent" },
-  size: { type: null, required: false },
   collapsed: { type: Boolean, required: false, default: false },
   tooltip: { type: [Boolean, Object], required: false, default: false },
   kbds: { type: Array, required: false, default: () => ["meta", "k"] },
   b24ui: { type: void 0, required: false },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  activeColor: { type: null, required: false },
+  depth: { type: null, required: false },
+  activeDepth: { type: null, required: false },
+  size: { type: null, required: false },
+  rounded: { type: Boolean, required: false },
+  block: { type: Boolean, required: false },
+  loadingAuto: { type: Boolean, required: false },
+  normalCase: { type: Boolean, required: false },
+  useWait: { type: Boolean, required: false },
+  useClock: { type: Boolean, required: false },
+  useDropdown: { type: Boolean, required: false },
+  onClick: { type: [Function, Array], required: false },
+  activeClass: { type: String, required: false },
+  inactiveClass: { type: String, required: false },
+  avatar: { type: Object, required: false },
+  loading: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  type: { type: null, required: false },
+  disabled: { type: Boolean, required: false },
+  active: { type: Boolean, required: false },
+  exact: { type: Boolean, required: false },
+  exactQuery: { type: [Boolean, String], required: false },
+  exactHash: { type: Boolean, required: false },
+  isAction: { type: Boolean, required: false },
+  to: { type: null, required: false },
+  href: { type: null, required: false },
+  external: { type: Boolean, required: false },
+  target: { type: [String, Object, null], required: false },
+  rel: { type: [String, Object, null], required: false },
+  noRel: { type: Boolean, required: false },
+  prefetchedClass: { type: String, required: false },
+  prefetch: { type: Boolean, required: false },
+  prefetchOn: { type: [String, Object], required: false },
+  noPrefetch: { type: Boolean, required: false },
+  trailingSlash: { type: String, required: false },
+  exactActiveClass: { type: String, required: false },
+  ariaCurrentValue: { type: String, required: false },
+  viewTransition: { type: Boolean, required: false },
+  replace: { type: Boolean, required: false }
 });
 const slots = defineSlots();
 const [DefineButtonTemplate, ReuseButtonTemplate] = createReusableTemplate();
 const getProxySlots = () => omit(slots, ["trailing"]);
-const rootProps = useForwardProps(reactivePick(props, "color", "size"));
+const buttonProps = useForwardProps(reactiveOmit(props, "icon", "label", "collapsed", "tooltip", "kbds", "class", "b24ui"));
 const tooltipProps = toRef(() => defu(typeof props.tooltip === "boolean" ? {} : props.tooltip, { delayDuration: 0, content: { side: "right" } }));
 const { t } = useLocale();
 const appConfig = useAppConfig();
@@ -46,7 +84,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.dashboa
       :icon="icon || icons.search"
       :label="label || t('dashboardSearchButton.label')"
       v-bind="{
-  ...rootProps,
+  ...buttonProps,
   ...collapsed ? {
     'label': void 0,
     'aria-label': label || t('dashboardSearchButton.label')

package/dist/runtime/components/DashboardSearchButton.vue.d.ts

@@ -3,7 +3,7 @@ import theme from '#build/b24ui/dashboard-search-button';
 import type { ButtonProps, ButtonSlots, IconComponent, KbdProps, TooltipProps } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearchButton = ComponentConfig<typeof theme, AppConfig, 'dashboardSearchButton'>;
-export interface DashboardSearchButtonProps {
+export interface DashboardSearchButtonProps extends Omit<ButtonProps, 'icon' | 'label' | 'color'> {
     /**
      * The icon displayed in the button.
      * @defaultValue icons.search
@@ -20,7 +20,6 @@ export interface DashboardSearchButtonProps {
      * @defaultValue 'air-tertiary-no-accent'
      */
     color?: ButtonProps['color'];
-    size?: ButtonProps['size'];
     /**
      * Whether the button is collapsed.
      * @defaultValue false
@@ -41,7 +40,7 @@ export interface DashboardSearchButtonProps {
     class?: any;
 }
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DashboardSearchButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardSearchButtonProps> & Readonly<{}>, {
-    color: "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "default" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
+    color: "default" | "link" | "air-primary" | "air-primary-success" | "air-primary-alert" | "air-primary-copilot" | "air-secondary" | "air-secondary-accent" | "air-secondary-accent-1" | "air-tertiary" | "danger" | "success" | "warning" | "primary" | "secondary" | "collab" | "ai" | "air-secondary-alert" | "air-secondary-accent-2" | "air-secondary-no-accent" | "air-tertiary-accent" | "air-tertiary-no-accent" | "air-selection" | "air-boost";
     tooltip: boolean | TooltipProps;
     kbds: KbdProps["value"][] | KbdProps[];
     collapsed: boolean;

package/dist/runtime/components/Error.d.vue.ts

@@ -35,8 +35,8 @@ export interface ErrorSlots {
     links(props?: {}): any;
 }
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ErrorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ErrorProps> & Readonly<{}>, {
-    clear: boolean | Partial<ButtonProps>;
     redirect: string;
+    clear: boolean | Partial<ButtonProps>;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ErrorSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Error.vue.d.ts

@@ -35,8 +35,8 @@ export interface ErrorSlots {
     links(props?: {}): any;
 }
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ErrorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ErrorProps> & Readonly<{}>, {
-    clear: boolean | Partial<ButtonProps>;
     redirect: string;
+    clear: boolean | Partial<ButtonProps>;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ErrorSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;