@bitrix24/b24ui-nuxt 0.5.6 → 0.5.8

package/dist/meta.mjs

@@ -42353,6 +42353,23 @@ const B24UIMeta = {
             }
           }
         },
+        {
+          "name": "stepSnapping",
+          "global": false,
+          "description": "When `false`, prevents the value from snapping to the nearest increment of the step value",
+          "tags": [],
+          "required": false,
+          "type": "boolean | undefined",
+          "schema": {
+            "kind": "enum",
+            "type": "boolean | undefined",
+            "schema": {
+              "0": "undefined",
+              "1": "false",
+              "2": "true"
+            }
+          }
+        },
         {
           "name": "formatOptions",
           "global": false,
@@ -42372,6 +42389,23 @@ const B24UIMeta = {
               }
             }
           }
+        },
+        {
+          "name": "disableWheelChange",
+          "global": false,
+          "description": "When `true`, prevents the value from changing on wheel scroll.",
+          "tags": [],
+          "required": false,
+          "type": "boolean | undefined",
+          "schema": {
+            "kind": "enum",
+            "type": "boolean | undefined",
+            "schema": {
+              "0": "undefined",
+              "1": "false",
+              "2": "true"
+            }
+          }
         }
       ],
       "slots": [
@@ -53233,6 +53267,29 @@ const B24UIMeta = {
             }
           }
         },
+        {
+          "name": "variant",
+          "global": false,
+          "description": "",
+          "tags": [
+            {
+              "name": "defaultValue",
+              "text": "'list'"
+            }
+          ],
+          "required": false,
+          "type": "\"table\" | \"list\" | \"card\" | undefined",
+          "schema": {
+            "kind": "enum",
+            "type": "\"table\" | \"list\" | \"card\" | undefined",
+            "schema": {
+              "0": "undefined",
+              "1": "\"table\"",
+              "2": "\"list\"",
+              "3": "\"card\""
+            }
+          }
+        },
         {
           "name": "color",
           "global": false,
@@ -53284,19 +53341,42 @@ const B24UIMeta = {
           },
           "default": "\"vertical\""
         },
+        {
+          "name": "indicator",
+          "global": false,
+          "description": "Position of the indicator.",
+          "tags": [
+            {
+              "name": "defaultValue",
+              "text": "'start'"
+            }
+          ],
+          "required": false,
+          "type": "\"start\" | \"end\" | \"hidden\" | undefined",
+          "schema": {
+            "kind": "enum",
+            "type": "\"start\" | \"end\" | \"hidden\" | undefined",
+            "schema": {
+              "0": "undefined",
+              "1": "\"start\"",
+              "2": "\"end\"",
+              "3": "\"hidden\""
+            }
+          }
+        },
         {
           "name": "b24ui",
           "global": false,
           "description": "",
           "tags": [],
           "required": false,
-          "type": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: string; container: string; wrapper: string; label: string; description: string; }> | undefined",
+          "type": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: \"start\" | \"end\" | \"hidden\"; container: string; wrapper: string; label: string; description: string; }> | undefined",
           "schema": {
             "kind": "enum",
-            "type": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: string; container: string; wrapper: string; label: string; description: string; }> | undefined",
+            "type": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: \"start\" | \"end\" | \"hidden\"; container: string; wrapper: string; label: string; description: string; }> | undefined",
             "schema": {
               "0": "undefined",
-              "1": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: string; container: string; wrapper: string; label: string; description: string; }>"
+              "1": "Partial<{ root: string; fieldset: string; legend: string; item: string; base: string; indicator: \"start\" | \"end\" | \"hidden\"; container: string; wrapper: string; label: string; description: string; }>"
             }
           }
         },
@@ -64211,23 +64291,6 @@ const B24UIMeta = {
           "schema": "any",
           "default": "\"div\""
         },
-        {
-          "name": "useSidebar",
-          "global": false,
-          "description": "",
-          "tags": [],
-          "required": false,
-          "type": "boolean | undefined",
-          "schema": {
-            "kind": "enum",
-            "type": "boolean | undefined",
-            "schema": {
-              "0": "undefined",
-              "1": "false",
-              "2": "true"
-            }
-          }
-        },
         {
           "name": "useLightContent",
           "global": false,
@@ -65312,23 +65375,6 @@ const B24UIMeta = {
           "schema": "any",
           "default": "\"div\""
         },
-        {
-          "name": "useSidebar",
-          "global": false,
-          "description": "",
-          "tags": [],
-          "required": false,
-          "type": "boolean | undefined",
-          "schema": {
-            "kind": "enum",
-            "type": "boolean | undefined",
-            "schema": {
-              "0": "undefined",
-              "1": "false",
-              "2": "true"
-            }
-          }
-        },
         {
           "name": "useLightContent",
           "global": false,
@@ -65344,7 +65390,8 @@ const B24UIMeta = {
               "1": "false",
               "2": "true"
             }
-          }
+          },
+          "default": "true"
         },
         {
           "name": "b24ui",

package/dist/module.cjs

@@ -2,7 +2,7 @@
 
 const defu = require('defu');
 const kit = require('@nuxt/kit');
-const templates = require('./shared/b24ui-nuxt.GF6icKT2.cjs');
+const templates = require('./shared/b24ui-nuxt.B9fPD5yO.cjs');
 require('node:url');
 require('scule');
 

package/dist/module.json

@@ -5,7 +5,7 @@
     "nuxt": ">=3.16.0"
   },
   "docs": "https://bitrix24.github.io/b24ui/guide/installation-nuxt-app.html",
-  "version": "0.5.6",
+  "version": "0.5.8",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -1,6 +1,6 @@
 import { defu } from 'defu';
 import { defineNuxtModule, createResolver, addVitePlugin, addPlugin, addComponentsDir, addImportsDir, hasNuxtModule, installModule } from '@nuxt/kit';
-import { d as defaultOptions, a as getDefaultUiConfig, b as addTemplates } from './shared/b24ui-nuxt.Cdw6m70Y.mjs';
+import { d as defaultOptions, a as getDefaultUiConfig, b as addTemplates } from './shared/b24ui-nuxt.DBFS6LH7.mjs';
 import 'node:url';
 import 'scule';
 

package/dist/runtime/components/Avatar.vue

@@ -42,7 +42,7 @@ export interface AvatarSlots {
 
 <script setup lang="ts">
 import { ref, computed, watch } from 'vue'
-import { Primitive } from 'reka-ui'
+import { Primitive, Slot } from 'reka-ui'
 import ImageComponent from '#build/b24ui-image-component'
 import { useAvatarGroup } from '../composables/useAvatarGroup'
 
@@ -105,9 +105,11 @@ function onError() {
       @error="onError"
     />
 
-    <slot v-else>
-      <Component :is="icon" v-if="icon" :class="b24ui.icon({ class: props.b24ui?.icon })" />
-      <span v-else :class="b24ui.fallback({ class: props.b24ui?.fallback })">{{ fallback || '&nbsp;' }}</span>
-    </slot>
+    <Slot v-else v-bind="$attrs">
+      <slot>
+        <Component :is="icon" v-if="icon" :class="b24ui.icon({ class: props.b24ui?.icon })" />
+        <span v-else :class="b24ui.fallback({ class: props.b24ui?.fallback })">{{ fallback || '&nbsp;' }}</span>
+      </slot>
+    </Slot>
   </Primitive>
 </template>

package/dist/runtime/components/DropdownMenuContent.vue

@@ -38,6 +38,7 @@ import { computed } from 'vue'
 import { DropdownMenu } from 'reka-ui/namespaced'
 import { useForwardPropsEmits } from 'reka-ui'
 import { reactiveOmit, createReusableTemplate } from '@vueuse/core'
+import { useLocale } from '../composables/useLocale'
 import { omit, get, isArrayOfArray } from '../utils'
 import { pickLinkProps } from '../utils/link'
 import icons from '../dictionary/icons'
@@ -52,11 +53,13 @@ const props = defineProps<DropdownMenuContentProps<T>>()
 const emits = defineEmits<DropdownMenuContentEmits>()
 const slots = defineSlots<DropdownMenuContentSlots<T>>()
 
+const { dir } = useLocale()
 const contentProps = useForwardPropsEmits(reactiveOmit(props, 'sub', 'items', 'portal', 'labelKey', 'checkedIcon', 'externalIcon', 'class', 'b24ui', 'b24uiOverride'), emits)
 const proxySlots = omit(slots, ['default'])
 
 const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate<{ item: DropdownMenuItem, active?: boolean, index: number }>()
 
+const childrenIcon = computed(() => dir.value === 'rtl' ? icons.chevronLeft : icons.chevronRight)
 const groups = computed<DropdownMenuItem[][]>(() =>
   props.items?.length
     ? isArrayOfArray(props.items)
@@ -102,7 +105,7 @@ const groups = computed<DropdownMenuItem[][]>(() =>
       <span :class="b24ui.itemTrailing({ class: b24uiOverride?.itemTrailing })">
         <slot :name="((item.slot ? `${item.slot}-trailing`: 'item-trailing') as keyof DropdownMenuContentSlots<T>)" :item="(item as Extract<NestedItem<T>, { slot: string; }>)" :active="active" :index="index">
           <Component
-            :is="icons.chevronRight"
+            :is="childrenIcon"
             v-if="item.children?.length"
             :class="b24ui.itemTrailingIcon({ class: b24uiOverride?.itemTrailingIcon, color: item?.color, active })"
           />
@@ -147,7 +150,6 @@ const groups = computed<DropdownMenuItem[][]>(() =>
               :b24ui-override="b24uiOverride"
               :portal="portal"
               :items="(item.children as T)"
-              side="right"
               align="start"
               :align-offset="-4"
               :side-offset="3"
@@ -156,7 +158,7 @@ const groups = computed<DropdownMenuItem[][]>(() =>
               :external-icon="externalIcon"
               v-bind="item.content"
             >
-              <template v-for="(_, name) in proxySlots" #[name]="slotData: any">
+              <template v-for="(_, name) in proxySlots" #[name]="slotData">
                 <slot :name="(name as keyof DropdownMenuContentSlots<T>)" v-bind="slotData" />
               </template>
             </B24DropdownMenuContent>

package/dist/runtime/components/InputMenu.vue

@@ -397,6 +397,7 @@ function onRemoveTag(event: any) {
     const modelValue = props.modelValue as GetModelValue<T, VK, true>
     const filteredValue = modelValue.filter(value => !isEqual(value, event))
     emits('update:modelValue', filteredValue as GetModelValue<T, VK, M>)
+    onUpdate(filteredValue)
   }
 }
 
@@ -547,7 +548,7 @@ defineExpose({
                 :class="b24ui.item({ class: props.b24ui?.item, colorItem: isInputItem(item) ? item?.color : undefined })"
                 :disabled="isInputItem(item) && item.disabled"
                 :value="props.valueKey && isInputItem(item) ? get(item, String(props.valueKey)) : item"
-                @select="isInputItem(item) && item.onSelect"
+                @select="isInputItem(item) && item.onSelect?.($event)"
               >
                 <slot name="item" :item="(item as NestedItem<T>)" :index="index">
                   <slot name="item-leading" :item="(item as NestedItem<T>)" :index="index">

package/dist/runtime/components/InputNumber.vue

@@ -14,7 +14,7 @@ const inputNumber = tv({ extend: tv(theme), ...(appConfigInputNumber.b24ui?.inpu
 
 type InputNumberVariants = VariantProps<typeof inputNumber>
 
-export interface InputNumberProps extends Pick<NumberFieldRootProps, 'modelValue' | 'defaultValue' | 'min' | 'max' | 'step' | 'disabled' | 'required' | 'id' | 'name' | 'formatOptions'> {
+export interface InputNumberProps extends Pick<NumberFieldRootProps, 'modelValue' | 'defaultValue' | 'min' | 'max' | 'stepSnapping' | 'step' | 'disabled' | 'required' | 'id' | 'name' | 'formatOptions' | 'disableWheelChange'> {
   /**
    * The element or component this component should render as.
    * @defaultValue 'div'
@@ -137,7 +137,7 @@ const props = withDefaults(defineProps<InputNumberProps>(), {
 const emits = defineEmits<InputNumberEmits>()
 defineSlots<InputNumberSlots>()
 
-const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'modelValue', 'defaultValue', 'min', 'max', 'step', 'formatOptions'), emits)
+const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'modelValue', 'defaultValue', 'min', 'max', 'step', 'stepSnapping', 'formatOptions', 'disableWheelChange'), emits)
 
 const { emitFormBlur, emitFormFocus, emitFormChange, emitFormInput, id, color, size, name, highlight, disabled, ariaAttrs } = useFormField<InputNumberProps>(props)
 

package/dist/runtime/components/RadioGroup.vue

@@ -49,6 +49,10 @@ export interface RadioGroupProps<T extends RadioGroupItem = RadioGroupItem> exte
    * @defaultValue 'md'
    */
   size?: RadioGroupVariants['size']
+  /**
+   * @defaultValue 'list'
+   */
+  variant?: RadioGroupVariants['variant']
   /**
    * @defaultValue 'primary'
    */
@@ -58,6 +62,11 @@ export interface RadioGroupProps<T extends RadioGroupItem = RadioGroupItem> exte
    * @defaultValue 'vertical'
    */
   orientation?: RadioGroupRootProps['orientation']
+  /**
+   * Position of the indicator.
+   * @defaultValue 'start'
+   */
+  indicator?: RadioGroupVariants['indicator']
   class?: any
   b24ui?: Partial<typeof radioGroup.slots>
 }
@@ -101,7 +110,9 @@ const b24ui = computed(() => radioGroup({
   color: color.value,
   disabled: disabled.value,
   required: props.required,
-  orientation: props.orientation
+  orientation: props.orientation,
+  variant: props.variant,
+  indicator: props.indicator
 }))
 
 function normalizeItem(item: any) {
@@ -167,7 +178,7 @@ function onUpdate(value: any) {
           {{ legend }}
         </slot>
       </legend>
-      <div v-for="item in normalizedItems" :key="item.value" :class="b24ui.item({ class: props.b24ui?.item })">
+      <component :is="variant === 'list' ? 'div' : Label" v-for="item in normalizedItems" :key="item.value" :class="b24ui.item({ class: props.b24ui?.item })">
         <div :class="b24ui.container({ class: props.b24ui?.container })">
           <RadioGroupItem
             :id="item.id"
@@ -180,18 +191,18 @@ function onUpdate(value: any) {
         </div>
 
         <div :class="b24ui.wrapper({ class: props.b24ui?.wrapper })">
-          <Label :class="b24ui.label({ class: props.b24ui?.label })" :for="item.id">
+          <component :is="variant === 'list' ? Label : 'p'" :class="b24ui.label({ class: props.b24ui?.label })" :for="item.id">
             <slot name="label" :item="item" :model-value="(modelValue as RadioGroupValue)">
               {{ item.label }}
             </slot>
-          </Label>
+          </component>
           <p v-if="item.description || !!slots.description" :class="b24ui.description({ class: props.b24ui?.description })">
             <slot name="description" :item="item" :model-value="(modelValue as RadioGroupValue)">
               {{ item.description }}
             </slot>
           </p>
         </div>
-      </div>
+      </component>
     </fieldset>
   </RadioGroupRoot>
 </template>

package/dist/runtime/components/SelectMenu.vue

@@ -495,7 +495,7 @@ function isSelectItem(item: SelectMenuItem): item is _SelectMenuItem {
                     :class="b24ui.item({ class: props.b24ui?.item, colorItem: isSelectItem(item) ? item?.color : undefined })"
                     :disabled="isSelectItem(item) && item.disabled"
                     :value="props.valueKey && isSelectItem(item) ? get(item, props.valueKey as string) : item"
-                    @select="isSelectItem(item) && item.onSelect"
+                    @select="isSelectItem(item) && item.onSelect?.($event)"
                   >
                     <slot name="item" :item="(item as NestedItem<T>)" :index="index">
                       <slot name="item-leading" :item="(item as NestedItem<T>)" :index="index">

package/dist/runtime/components/SidebarLayout.vue

@@ -15,7 +15,6 @@ export interface SidebarLayoutProps {
    * @defaultValue 'div'
    */
   as?: any
-  useSidebar?: boolean
   useLightContent?: boolean
   class?: any
   b24ui?: Partial<typeof sidebarLayout.slots>

package/dist/runtime/components/StackedLayout.vue

@@ -18,7 +18,6 @@ export interface StackedLayoutProps {
    * @defaultValue 'div'
    */
   as?: any
-  useSidebar?: boolean
   useLightContent?: boolean
   class?: any
   b24ui?: Partial<typeof stackedLayout.slots>
@@ -53,7 +52,8 @@ import MenuIcon from '@bitrix24/b24icons-vue/main/MenuIcon'
 import Cross50Icon from '@bitrix24/b24icons-vue/actions/Cross50Icon'
 
 const props = withDefaults(defineProps<StackedLayoutProps>(), {
-  as: 'div'
+  as: 'div',
+  useLightContent: true
 })
 const slots = defineSlots<StackedLayoutSlots>()
 

package/dist/runtime/composables/useOverlay.d.ts

@@ -1,5 +1,6 @@
 import type { Component } from 'vue';
-import type { ComponentProps } from 'vue-component-type-helpers';
+import type { ComponentProps, ComponentEmit } from 'vue-component-type-helpers';
+type CloseEventArgType<T> = T extends (event: 'close', args_0: infer R) => void ? R : never;
 export type OverlayOptions<OverlayAttrs = Record<string, any>> = {
     defaultOpen?: boolean;
     props?: OverlayAttrs;
@@ -14,7 +15,7 @@ type ManagedOverlayOptionsPrivate<T extends Component> = {
 };
 export type Overlay = OverlayOptions<Component> & ManagedOverlayOptionsPrivate<Component>;
 interface OverlayInstance<T> {
-    open: (props?: ComponentProps<T>) => Promise<any>;
+    open: (props?: ComponentProps<T>) => Promise<CloseEventArgType<ComponentEmit<T>>>;
     close: (value?: any) => void;
     patch: (props: Partial<ComponentProps<T>>) => void;
 }

package/dist/runtime/vue/stubs.d.ts

@@ -31,7 +31,12 @@ export declare function useNuxtApp(): {
     payload: {
         serverRendered: boolean;
     };
+    hooks: import("hookable").Hookable<Record<string, any>, string>;
+    hook: <NameT extends string>(name: NameT, function_: any, options?: {
+        allowDeprecated?: boolean;
+    }) => () => void;
 };
+export declare function useRuntimeHook(name: string, fn: (...args: any[]) => void): void;
 export declare function defineNuxtPlugin(plugin: (nuxtApp: NuxtApp) => void): {
     install(app: import("vue").App<any>): void;
 };

package/dist/runtime/vue/stubs.js

@@ -1,4 +1,5 @@
-import { ref } from "vue";
+import { ref, onScopeDispose } from "vue";
+import { createHooks } from "hookable";
 import appConfig from "#build/app.config";
 import { useColorMode as useColorModeVueUse } from "@vueuse/core";
 export { useHead } from "@unhead/vue";
@@ -52,12 +53,20 @@ export const useState = (key, init) => {
   state[key] = value;
   return value;
 };
+const hooks = createHooks();
 export function useNuxtApp() {
   return {
     isHydrating: true,
-    payload: { serverRendered: false }
+    payload: { serverRendered: false },
+    hooks,
+    hook: hooks.hook
   };
 }
+export function useRuntimeHook(name, fn) {
+  const nuxtApp = useNuxtApp();
+  const unregister = nuxtApp.hook(name, fn);
+  onScopeDispose(unregister);
+}
 export function defineNuxtPlugin(plugin) {
   return {
     install(app) {