@bitrix24/b24ui-nuxt 0.4.4 → 0.4.6

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.BRwBcdAH.mjs';
+import { d as defaultOptions, a as getDefaultUiConfig, b as addTemplates } from './shared/b24ui-nuxt.BiEJAB1L.mjs';
 import 'node:url';
 import 'scule';
 
@@ -9,7 +9,7 @@ const module = defineNuxtModule({
     name: "b24ui",
     configKey: "b24ui",
     compatibility: {
-      nuxt: ">=3.13.1"
+      nuxt: ">=3.16.0"
     },
     docs: "https://bitrix24.github.io/b24ui/guide/installation-nuxt-app.html"
   },

package/dist/runtime/components/App.vue

@@ -1,12 +1,11 @@
 <script lang="ts">
 import type { ConfigProviderProps, TooltipProviderProps } from 'reka-ui'
-import { localeContextInjectionKey } from '../composables/useLocale'
-import type { ToasterProps, Locale } from '../types'
+import type { ToasterProps, Locale, Messages } from '../types'
 
-export interface AppProps extends Omit<ConfigProviderProps, 'useId' | 'dir' | 'locale'> {
+export interface AppProps<T extends Messages = Messages> extends Omit<ConfigProviderProps, 'useId' | 'dir' | 'locale'> {
   tooltip?: TooltipProviderProps
   toaster?: ToasterProps | null
-  locale?: Locale
+  locale?: Locale<T>
 }
 
 export interface AppSlots {
@@ -18,14 +17,15 @@ export default {
 }
 </script>
 
-<script setup lang="ts">
+<script setup lang="ts" generic="T extends Messages = Messages">
 import { toRef, useId, provide } from 'vue'
 import { ConfigProvider, TooltipProvider, useForwardProps } from 'reka-ui'
 import { reactivePick } from '@vueuse/core'
+import { localeContextInjectionKey } from '../composables/useLocale'
 import B24Toaster from './Toaster.vue'
 import B24OverlayProvider from './OverlayProvider.vue'
 
-const props = defineProps<AppProps>()
+const props = defineProps<AppProps<T>>()
 defineSlots<AppSlots>()
 
 const configProviderProps = useForwardProps(reactivePick(props, 'scrollBody'))

package/dist/runtime/components/Button.vue

@@ -98,6 +98,7 @@ import { omit } from '../utils'
 import { pickLinkProps } from '../utils/link'
 import B24Avatar from './Avatar.vue'
 import B24Link from './Link.vue'
+import B24LinkBase from './LinkBase.vue'
 import ChevronDownIcon from '@bitrix24/b24icons-vue/actions/ChevronDownIcon'
 import LoaderWaitIcon from '@bitrix24/b24icons-vue/animated/LoaderWaitIcon'
 import LoaderClockIcon from '@bitrix24/b24icons-vue/animated/LoaderClockIcon'

package/dist/runtime/components/Form.vue

@@ -68,7 +68,7 @@ onMounted(async () => {
       nestedForms.value.set(event.formId, { validate: event.validate })
     } else if (event.type === 'detach') {
       nestedForms.value.delete(event.formId)
-    } else if (props.validateOn?.includes(event.type)) {
+    } else if (props.validateOn?.includes(event.type) && !loading.value) {
       if (event.type !== 'input') {
         await _validate({ name: event.name, silent: true, nested: false })
       } else if (event.eager || blurredFields.has(event.name)) {

package/dist/runtime/components/Input.vue

@@ -125,7 +125,7 @@ const props = withDefaults(defineProps<InputProps>(), {
 const emits = defineEmits<InputEmits>()
 const slots = defineSlots<InputSlots>()
 
-const [modelValue, modelModifiers] = defineModel<string | number>()
+const [modelValue, modelModifiers] = defineModel<string | number | null>()
 
 const { emitFormBlur, emitFormInput, emitFormChange, size: formGroupSize, color, id, name, highlight, disabled, emitFormFocus, ariaAttrs } = useFormField<InputProps>(props, { deferInputValidation: true })
 const { orientation, size: buttonGroupSize } = useButtonGroup<InputProps>(props)
@@ -162,15 +162,19 @@ function autoFocus() {
 }
 
 // Custom function to handle the v-model properties
-function updateInput(value: string) {
+function updateInput(value: string | null) {
   if (modelModifiers.trim) {
-    value = value.trim()
+    value = value?.trim() ?? null
   }
 
   if (modelModifiers.number || props.type === 'number') {
     value = looseToNumber(value)
   }
 
+  if (modelModifiers.nullify) {
+    value ||= null
+  }
+
   modelValue.value = value
   emitFormInput()
 }

package/dist/runtime/components/LinkBase.vue

@@ -1,4 +1,6 @@
 <script lang="ts">
+import type { LinkProps } from '../types'
+
 export interface LinkBaseProps {
   as?: string
   type?: string
@@ -6,8 +8,8 @@ export interface LinkBaseProps {
   onClick?: ((e: MouseEvent) => void | Promise<void>) | Array<((e: MouseEvent) => void | Promise<void>)>
   href?: string
   navigate?: (e: MouseEvent) => void
-  rel?: string
-  target?: string
+  target?: LinkProps['target']
+  rel?: LinkProps['rel']
   isExternal?: boolean
 }
 </script>

package/dist/runtime/components/Textarea.vue

@@ -117,7 +117,7 @@ const props = withDefaults(defineProps<TextareaProps>(), {
 defineSlots<TextareaSlots>()
 const emits = defineEmits<TextareaEmits>()
 
-const [modelValue, modelModifiers] = defineModel<string | number>()
+const [modelValue, modelModifiers] = defineModel<string | number | null>()
 
 const { emitFormFocus, emitFormBlur, emitFormInput, emitFormChange, color, id, name, highlight, disabled, ariaAttrs } = useFormField<TextareaProps>(props, { deferInputValidation: true })
 
@@ -144,15 +144,19 @@ function autoFocus() {
 }
 
 // Custom function to handle the v-model properties
-function updateInput(value: string) {
+function updateInput(value: string | null) {
   if (modelModifiers.trim) {
-    value = value.trim()
+    value = value?.trim() ?? null
   }
 
   if (modelModifiers.number) {
     value = looseToNumber(value)
   }
 
+  if (modelModifiers.nullify) {
+    value ||= null
+  }
+
   modelValue.value = value
   emitFormInput()
 }

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

@@ -1,9 +1,9 @@
-import type { Locale, Direction, Messages } from '../types/locale';
-interface DefineLocaleOptions {
+import type { Locale, Direction } from '../types/locale';
+interface DefineLocaleOptions<M> {
     name: string;
     code: string;
     dir?: Direction;
-    messages: Messages;
+    messages: M;
 }
-export declare function defineLocale(options: DefineLocaleOptions): Locale;
+export declare function defineLocale<M>(options: DefineLocaleOptions<M>): Locale<M>;
 export {};

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

@@ -1,4 +1,4 @@
 import type { InjectionKey, Ref } from 'vue';
-import type { Locale } from '../types/locale';
-export declare const localeContextInjectionKey: InjectionKey<Ref<Locale | undefined>>;
-export declare const useLocale: (localeOverrides?: Ref<Locale | undefined>) => import("../utils/locale").LocaleContext;
+import type { Locale, Messages } from '../types/locale';
+export declare const localeContextInjectionKey: InjectionKey<Ref<Locale<unknown> | undefined>>;
+export declare const useLocale: (localeOverrides?: Ref<Locale<Messages> | undefined>) => import("../utils/locale").LocaleContext<Messages>;

package/dist/runtime/composables/useLocale.js

@@ -1,10 +1,10 @@
-import { computed, inject, ref } from "vue";
+import { computed, inject, toRef } from "vue";
+import { createSharedComposable } from "@vueuse/core";
 import { buildLocaleContext } from "../utils/locale.js";
 import en from "../locale/en.js";
-import { createSharedComposable } from "@vueuse/core";
 export const localeContextInjectionKey = Symbol("bitrix24-ui.locale-context");
 const _useLocale = (localeOverrides) => {
-  const locale = localeOverrides || inject(localeContextInjectionKey, ref());
+  const locale = localeOverrides || toRef(inject(localeContextInjectionKey));
   return buildLocaleContext(computed(() => locale.value || en));
 };
 export const useLocale = createSharedComposable(_useLocale);

package/dist/runtime/locale/ar.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/br.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/de.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/en.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/fr.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/id.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/index.d.ts

@@ -27,7 +27,7 @@
  */
 export { default as en } from './en';
 export { default as de } from './de';
-export { default as es } from './la';
+export { default as la } from './la';
 export { default as br } from './br';
 export { default as fr } from './fr';
 export { default as it } from './it';

package/dist/runtime/locale/index.js

@@ -1,6 +1,6 @@
 export { default as en } from "./en.js";
 export { default as de } from "./de.js";
-export { default as es } from "./la.js";
+export { default as la } from "./la.js";
 export { default as br } from "./br.js";
 export { default as fr } from "./fr.js";
 export { default as it } from "./it.js";

package/dist/runtime/locale/it.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/ja.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/kz.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/la.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/ms.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/pl.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/ru.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/sc.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/tc.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/th.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/tr.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/ua.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/locale/vn.d.ts

@@ -1,2 +1,3 @@
-declare const _default: import("../types").Locale;
+import type { Messages } from '../types';
+declare const _default: import("../types").Locale<Messages>;
 export default _default;

package/dist/runtime/prose/A.vue

@@ -27,6 +27,6 @@ const b24ui = proseA({})
 
 <template>
   <a
-    :class="b24ui.base({ class: props.b24ui?.base })"
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
   ><slot /></a>
 </template>

package/dist/runtime/prose/Code.vue

@@ -37,6 +37,6 @@ const b24ui = computed(() => proseCode({
 
 <template>
   <code
-    :class="b24ui.base({ class: props.b24ui?.base })"
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
   ><slot /></code>
 </template>

package/dist/runtime/prose/Img.vue

@@ -0,0 +1,32 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/img'
+import { tv } from '../utils/tv'
+
+const appConfigProseImg = _appConfig as AppConfig & { b24ui: { prose: { img: Partial<typeof theme> } } }
+
+const proseImg = tv({ extend: tv(theme), ...(appConfigProseImg.b24ui?.prose?.img || {}) })
+
+export interface proseImgProps {
+  class?: any
+  b24ui?: Partial<typeof proseImg.slots>
+}
+
+export interface proseImgSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseImgProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseImg({})
+</script>
+
+<template>
+  <img
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+</template>

package/dist/runtime/prose/Table.vue

@@ -0,0 +1,74 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/table'
+import { tv } from '../utils/tv'
+
+const appConfigProseTable = _appConfig as AppConfig & { b24ui: { prose: { table: Partial<typeof theme> } } }
+
+const proseTable = tv({ extend: tv(theme), ...(appConfigProseTable.b24ui?.prose?.table || {}) })
+
+export interface proseTableProps {
+  /**
+   * The element or component this component should render as.
+   * @defaultValue 'div'
+   */
+  as?: any
+  /**
+   * @defaultValue true
+   */
+  rounded?: boolean
+  /**
+   * @defaultValue true
+   */
+  zebra?: boolean
+  /**
+   * @defaultValue false
+   */
+  rowHover?: boolean
+  /**
+   * @defaultValue false
+   */
+  bordered?: boolean
+  class?: any
+  b24ui?: Partial<typeof proseTable.slots>
+}
+
+export interface proseTableSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+import B24TableWrapper from './../components/content/TableWrapper.vue'
+
+defineOptions({ inheritAttrs: false })
+
+const props = withDefaults(defineProps<proseTableProps>(), {
+  as: 'div',
+  rounded: true,
+  zebra: true,
+  rowHover: true,
+  bordered: true
+})
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseTable({})
+</script>
+
+<template>
+  <B24TableWrapper
+    :as="as"
+    :class="b24ui.root({ class: [props.class, props.b24ui?.root] })"
+    :zebra="props.zebra"
+    :row-hover="props.rowHover"
+    :rounded="props.rounded"
+    :bordered="props.bordered"
+  >
+    <table
+      :class="b24ui.base({ class: props.b24ui?.base })"
+    >
+      <slot />
+    </table>
+  </B24TableWrapper>
+</template>

package/dist/runtime/prose/Tbody.vue

@@ -0,0 +1,34 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/tbody'
+import { tv } from '../utils/tv'
+
+const appConfigProseTbody = _appConfig as AppConfig & { b24ui: { prose: { tbody: Partial<typeof theme> } } }
+
+const proseTbody = tv({ extend: tv(theme), ...(appConfigProseTbody.b24ui?.prose?.tbody || {}) })
+
+export interface proseTbodyProps {
+  class?: any
+  b24ui?: Partial<typeof proseTbody.slots>
+}
+
+export interface proseTbodySlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseTbodyProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseTbody({})
+</script>
+
+<template>
+  <tbody
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+    <slot />
+  </tbody>
+</template>

package/dist/runtime/prose/Td.vue

@@ -0,0 +1,34 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/td'
+import { tv } from '../utils/tv'
+
+const appConfigProseTd = _appConfig as AppConfig & { b24ui: { prose: { td: Partial<typeof theme> } } }
+
+const proseTd = tv({ extend: tv(theme), ...(appConfigProseTd.b24ui?.prose?.td || {}) })
+
+export interface proseTdProps {
+  class?: any
+  b24ui?: Partial<typeof proseTd.slots>
+}
+
+export interface proseTdSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseTdProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseTd({})
+</script>
+
+<template>
+  <td
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+    <slot />
+  </td>
+</template>

package/dist/runtime/prose/Th.vue

@@ -0,0 +1,34 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/th'
+import { tv } from '../utils/tv'
+
+const appConfigProseTh = _appConfig as AppConfig & { b24ui: { prose: { th: Partial<typeof theme> } } }
+
+const proseTh = tv({ extend: tv(theme), ...(appConfigProseTh.b24ui?.prose?.th || {}) })
+
+export interface proseThProps {
+  class?: any
+  b24ui?: Partial<typeof proseTh.slots>
+}
+
+export interface proseThSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseThProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseTh({})
+</script>
+
+<template>
+  <th
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+    <slot />
+  </th>
+</template>

package/dist/runtime/prose/Thead.vue

@@ -0,0 +1,34 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/thead'
+import { tv } from '../utils/tv'
+
+const appConfigProseThead = _appConfig as AppConfig & { b24ui: { prose: { thead: Partial<typeof theme> } } }
+
+const proseThead = tv({ extend: tv(theme), ...(appConfigProseThead.b24ui?.prose?.thead || {}) })
+
+export interface proseTheadProps {
+  class?: any
+  b24ui?: Partial<typeof proseThead.slots>
+}
+
+export interface proseTheadSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseTheadProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseThead({})
+</script>
+
+<template>
+  <thead
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+    <slot />
+  </thead>
+</template>

package/dist/runtime/prose/Tr.vue

@@ -0,0 +1,34 @@
+<script lang="ts">
+import type { AppConfig } from '@nuxt/schema'
+import _appConfig from '#build/app.config'
+import theme from '#build/b24ui/prose/tr'
+import { tv } from '../utils/tv'
+
+const appConfigProseTr = _appConfig as AppConfig & { b24ui: { prose: { tr: Partial<typeof theme> } } }
+
+const proseTr = tv({ extend: tv(theme), ...(appConfigProseTr.b24ui?.prose?.tr || {}) })
+
+export interface proseTrProps {
+  class?: any
+  b24ui?: Partial<typeof proseTr.slots>
+}
+
+export interface proseTrSlots {
+  default(props?: {}): any
+}
+</script>
+
+<script setup lang="ts">
+const props = defineProps<proseTrProps>()
+
+// eslint-disable-next-line vue/no-dupe-keys
+const b24ui = proseTr({})
+</script>
+
+<template>
+  <tr
+    :class="b24ui.base({ class: [props.class, props.b24ui?.base] })"
+  >
+    <slot />
+  </tr>
+</template>

package/dist/runtime/types/index.d.ts

@@ -51,6 +51,13 @@ export * from '../prose/Ol.vue';
 export * from '../prose/Ul.vue';
 export * from '../prose/Li.vue';
 export * from '../prose/Hr.vue';
+export * from '../prose/Table.vue';
+export * from '../prose/Thead.vue';
+export * from '../prose/Tbody.vue';
+export * from '../prose/Tr.vue';
+export * from '../prose/Th.vue';
+export * from '../prose/Td.vue';
+export * from '../prose/Img.vue';
 export * from '../prose/Code.vue';
 export * from '../prose/Pre.vue';
 export * from './form';