@bitrix24/b24ui-nuxt 0.6.7 → 0.7.0

package/dist/runtime/prose/Pre.vue

@@ -20,7 +20,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <Primitive :as="as" :class="b24ui.root({ class: [props.class, props.b24ui?.root] })" :style="props.style">
+  <Primitive :as="as" :class="b24ui.root({ class: [props.b24ui?.root, props.class] })" :style="props.style">
     <pre
       :class="b24ui.base({ class: props.b24ui?.base })"
     ><slot /></pre>

package/dist/runtime/prose/Strong.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <strong :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <strong :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </strong>
 </template>

package/dist/runtime/prose/Table.vue

@@ -25,7 +25,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 <template>
   <B24TableWrapper
     :as="as"
-    :class="b24ui.root({ class: [props.class, props.b24ui?.root] })"
+    :class="b24ui.root({ class: [props.b24ui?.root, props.class] })"
     :zebra="props.zebra"
     :row-hover="props.rowHover"
     :rounded="props.rounded"

package/dist/runtime/prose/Tbody.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <tbody :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <tbody :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </tbody>
 </template>

package/dist/runtime/prose/Td.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <td :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <td :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </td>
 </template>

package/dist/runtime/prose/Th.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <th :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <th :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </th>
 </template>

package/dist/runtime/prose/Thead.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <thead :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <thead :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </thead>
 </template>

package/dist/runtime/prose/Tr.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <tr :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <tr :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </tr>
 </template>

package/dist/runtime/prose/Ul.vue

@@ -16,7 +16,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.prose?.
 </script>
 
 <template>
-  <ul :class="b24ui.base({ class: [props.class, props.b24ui?.base] })">
+  <ul :class="b24ui.base({ class: [props.b24ui?.base, props.class] })">
     <slot />
   </ul>
 </template>

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

@@ -4,28 +4,29 @@ import type { Schema as JoiSchema } from 'joi';
 import type { ObjectSchema as YupObjectSchema } from 'yup';
 import type { GetObjectField } from './utils';
 import type { Struct as SuperstructSchema } from 'superstruct';
-export interface Form<T extends object> {
-    validate(opts?: {
-        name?: keyof T | (keyof T)[];
+export interface Form<S extends FormSchema> {
+    validate<T extends boolean>(opts?: {
+        name?: keyof FormData<S, false> | (keyof FormData<S, false>)[];
         silent?: boolean;
         nested?: boolean;
-        transform?: boolean;
-    }): Promise<T | false>;
+        transform?: T;
+    }): Promise<FormData<S, T> | false>;
     clear(path?: string): void;
     errors: Ref<FormError[]>;
-    setErrors(errs: FormError[], name?: keyof T): void;
-    getErrors(name?: keyof T): FormError[];
+    setErrors(errs: FormError[], name?: keyof FormData<S, false>): void;
+    getErrors(name?: keyof FormData<S, false>): FormError[];
     submit(): Promise<void>;
     disabled: ComputedRef<boolean>;
     dirty: ComputedRef<boolean>;
     loading: Ref<boolean>;
-    dirtyFields: DeepReadonly<Set<keyof T>>;
-    touchedFields: DeepReadonly<Set<keyof T>>;
-    blurredFields: DeepReadonly<Set<keyof T>>;
+    dirtyFields: ReadonlySet<DeepReadonly<keyof FormData<S, false>>>;
+    touchedFields: ReadonlySet<DeepReadonly<keyof FormData<S, false>>>;
+    blurredFields: ReadonlySet<DeepReadonly<keyof FormData<S, false>>>;
 }
 export type FormSchema<I extends object = object, O extends object = I> = YupObjectSchema<I> | JoiSchema<I> | SuperstructSchema<any, any> | StandardSchemaV1<I, O>;
 export type InferInput<Schema> = Schema extends StandardSchemaV1 ? StandardSchemaV1.InferInput<Schema> : Schema extends YupObjectSchema<infer I> ? I : Schema extends JoiSchema<infer I> ? I : Schema extends SuperstructSchema<infer I, any> ? I : Schema extends StandardSchemaV1 ? StandardSchemaV1.InferInput<Schema> : never;
 export type InferOutput<Schema> = Schema extends StandardSchemaV1 ? StandardSchemaV1.InferOutput<Schema> : Schema extends YupObjectSchema<infer O> ? O : Schema extends JoiSchema<infer O> ? O : Schema extends SuperstructSchema<infer O, any> ? O : never;
+export type FormData<S extends FormSchema, T extends boolean = true> = T extends true ? InferOutput<S> : InferInput<S>;
 export type FormInputEvents = 'input' | 'blur' | 'change' | 'focus';
 export interface FormError<P extends string = string> {
     name?: P;

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

@@ -1,3 +1,4 @@
+export * from '../components/Accordion.vue';
 export * from '../components/Advice.vue';
 export * from '../components/Alert.vue';
 export * from '../components/App.vue';

package/dist/runtime/types/index.js

@@ -1,3 +1,4 @@
+export * from "../components/Accordion.vue";
 export * from "../components/Advice.vue";
 export * from "../components/Alert.vue";
 export * from "../components/App.vue";

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

@@ -51,6 +51,7 @@ export type Direction = 'ltr' | 'rtl';
 export type Locale<M> = {
     name: string;
     code: string;
+    locale: string;
     dir: Direction;
     messages: M;
 };

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

@@ -0,0 +1,53 @@
+import type { ClassValue, TVVariants, TVCompoundVariants, TVDefaultVariants } from 'tailwind-variants';
+/**
+ * Defines the AppConfig object based on the tailwind-variants configuration.
+ */
+export type TVConfig<T extends Record<string, any>> = {
+    [P in keyof T]?: {
+        [K in keyof T[P] as K extends 'base' | 'slots' | 'variants' | 'compoundVariants' | 'defaultVariants' ? K : never]?: K extends 'base' ? ClassValue : K extends 'slots' ? {
+            [S in keyof T[P]['slots']]?: ClassValue;
+        } : K extends 'variants' ? TVVariants<T[P]['slots'], ClassValue, T[P]['variants']> : K extends 'compoundVariants' ? TVCompoundVariants<T[P]['variants'], T[P]['slots'], ClassValue, object, undefined> : K extends 'defaultVariants' ? TVDefaultVariants<T[P]['variants'], T[P]['slots'], object, undefined> : never;
+    };
+};
+/**
+ * Utility type to flatten intersection types for better IDE hover information.
+ * @template T The type to flatten.
+ */
+type Id<T> = {} & {
+    [P in keyof T]: T[P];
+};
+type ComponentVariants<T extends {
+    variants?: Record<string, Record<string, any>>;
+}> = {
+    [K in keyof T['variants']]: keyof T['variants'][K];
+};
+type ComponentSlots<T extends {
+    slots?: Record<string, any>;
+}> = Id<{
+    [K in keyof T['slots']]?: ClassValue;
+}>;
+type GetComponentAppConfig<A, U extends string, K extends string> = A extends Record<U, Record<K, any>> ? A[U][K] : {};
+type ComponentAppConfig<T, A extends Record<string, any>, K extends string, U extends string = 'b24ui' | 'b24ui.content' | 'b24ui.prose'> = A & (U extends 'b24ui' ? {
+    b24ui?: Record<K, Partial<T>>;
+} : U extends 'b24ui.content' ? {
+    b24ui?: {
+        content?: Record<K, Partial<T>>;
+    };
+} : U extends 'b24ui.prose' ? {
+    b24ui?: {
+        prose?: Record<K, Partial<T>>;
+    };
+} : never);
+/**
+ * Defines the configuration shape expected for a component.
+ * @template T The component's theme imported from `#build/b24ui/*`.
+ * @template A The base AppConfig type from `@nuxt/schema`.
+ * @template K The key identifying the component (e.g., 'badge').
+ * @template U The top-level key in AppConfig ('b24ui').
+ */
+export type ComponentConfig<T extends Record<string, any>, A extends Record<string, any>, K extends string, U extends 'b24ui' | 'b24ui.content' | 'b24ui.prose' = 'b24ui'> = {
+    AppConfig: ComponentAppConfig<T, A, K, U>;
+    variants: ComponentVariants<T & GetComponentAppConfig<A, U, K>>;
+    slots: ComponentSlots<T>;
+};
+export {};

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

@@ -1,13 +1,7 @@
-import type { AcceptableValue as _AcceptableValue } from 'reka-ui';
-import type { ClassValue } from 'tailwind-variants';
 import type { VNode } from 'vue';
-export interface TightMap<O = any> {
-    [key: string]: TightMap | O;
-}
-export type DeepPartial<T, O = any> = {
-    [P in keyof T]?: T[P] extends Array<string> ? string : T[P] extends object ? DeepPartial<T[P], O> : T[P];
-} & {
-    [key: string]: O | TightMap<O>;
+import type { AcceptableValue as _AcceptableValue } from 'reka-ui';
+export type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P] | undefined;
 };
 export type DynamicSlotsKeys<Name extends string | undefined, Suffix extends string | undefined = undefined> = (Name extends string ? Suffix extends string ? Name | `${Name}-${Suffix}` : Name : never);
 export type DynamicSlots<T extends {
@@ -44,45 +38,4 @@ export type StringOrVNode = string | VNode | (() => VNode);
 export type EmitsToProps<T> = {
     [K in keyof T as `on${Capitalize<string & K>}`]: T[K] extends [...args: infer Args] ? (...args: Args) => void : never;
 };
-/**
- * Utility type to flatten intersection types for better IDE hover information.
- * @template T The type to flatten.
- */
-type Id<T> = {} & {
-    [P in keyof T]: T[P];
-};
-type ComponentVariants<T extends {
-    variants?: Record<string, Record<string, any>>;
-}> = {
-    [K in keyof T['variants']]: keyof T['variants'][K];
-};
-type ComponentSlots<T extends {
-    slots?: Record<string, any>;
-}> = Id<{
-    [K in keyof T['slots']]?: ClassValue;
-}>;
-type GetComponentAppConfig<A, U extends string, K extends string> = A extends Record<U, Record<K, any>> ? A[U][K] : {};
-type ComponentAppConfig<T, A extends Record<string, any>, K extends string, U extends string = 'b24ui' | 'b24ui.content' | 'b24ui.prose'> = A & (U extends 'b24ui' ? {
-    b24ui?: Record<K, Partial<T>>;
-} : U extends 'b24ui.content' ? {
-    b24ui?: {
-        content?: Record<K, Partial<T>>;
-    };
-} : U extends 'b24ui.prose' ? {
-    b24ui?: {
-        prose?: Record<K, Partial<T>>;
-    };
-} : never);
-/**
- * Defines the configuration shape expected for a component.
- * @template T The component's theme imported from `#build/b24ui/*`.
- * @template A The base AppConfig type from `@nuxt/schema`.
- * @template K The key identifying the component (e.g., 'badge').
- * @template U The top-level key in AppConfig ('b24ui').
- */
-export type ComponentConfig<T extends Record<string, any>, A extends Record<string, any>, K extends string, U extends 'b24ui' | 'b24ui.content' | 'b24ui.prose' = 'b24ui'> = {
-    AppConfig: ComponentAppConfig<T, A, K, U>;
-    variants: ComponentVariants<T & GetComponentAppConfig<A, U, K>>;
-    slots: ComponentSlots<T>;
-};
-export {};
+export * from './tv';

package/dist/runtime/types/utils.js

@@ -0,0 +1 @@
+export * from "./tv.js";

package/dist/runtime/utils/link.d.ts

@@ -4,3 +4,4 @@ export declare function pickLinkProps(link: LinkProps & {
 }): import("@vueuse/core").ReactivePickReturn<LinkProps & {
     [key: string]: any;
 }, string>;
+export declare function isPartiallyEqual(item1: any, item2: any): boolean;

package/dist/runtime/utils/link.js

@@ -1,4 +1,5 @@
 import { reactivePick } from "@vueuse/core";
+import { isEqual, diff } from "ohash/utils";
 export function pickLinkProps(link) {
   const keys = Object.keys(link);
   const ariaKeys = keys.filter((key) => key.startsWith("aria-"));
@@ -33,3 +34,14 @@ export function pickLinkProps(link) {
   ];
   return reactivePick(link, ...propsToInclude);
 }
+export function isPartiallyEqual(item1, item2) {
+  const diffedKeys = diff(item1, item2).reduce((filtered, q) => {
+    if (q.type === "added") {
+      filtered.add(q.key);
+    }
+    return filtered;
+  }, /* @__PURE__ */ new Set());
+  const item1Filtered = Object.fromEntries(Object.entries(item1).filter(([key]) => !diffedKeys.has(key)));
+  const item2Filtered = Object.fromEntries(Object.entries(item2).filter(([key]) => !diffedKeys.has(key)));
+  return isEqual(item1Filtered, item2Filtered);
+}

package/dist/runtime/vue/components/Link.vue

@@ -3,15 +3,16 @@ import theme from "#build/b24ui/link";
 </script>
 
 <script setup>
-import { computed, getCurrentInstance } from "vue";
+import { computed } from "vue";
 import { defu } from "defu";
-import { isEqual, diff } from "ohash/utils";
+import { isEqual } from "ohash/utils";
 import { useForwardProps } from "reka-ui";
 import { reactiveOmit } from "@vueuse/core";
 import { hasProtocol } from "ufo";
 import { useRoute, RouterLink } from "vue-router";
 import { useAppConfig } from "#imports";
 import { tv } from "../../utils/tv";
+import { isPartiallyEqual } from "../../utils/link";
 import B24LinkBase from "./../../components/LinkBase.vue";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
@@ -44,20 +45,9 @@ const props = defineProps({
   replace: { type: Boolean, required: false }
 });
 defineSlots();
-const hasRouter = computed(() => {
-  const app = getCurrentInstance()?.appContext.app;
-  return !!app?.config?.globalProperties?.$router;
-});
-const route = computed(() => {
-  if (!hasRouter.value) return null;
-  try {
-    return useRoute();
-  } catch {
-    return null;
-  }
-});
+const route = useRoute();
 const appConfig = useAppConfig();
-const routerLinkProps = useForwardProps(reactiveOmit(props, "as", "type", "disabled", "active", "exact", "exactQuery", "exactHash", "activeClass", "inactiveClass", "to", "raw", "class"));
+const routerLinkProps = useForwardProps(reactiveOmit(props, "as", "type", "disabled", "active", "exact", "exactQuery", "exactHash", "activeClass", "inactiveClass", "to", "href", "raw", "custom", "class"));
 const b24ui = computed(() => tv({
   extend: tv(theme),
   ...defu({
@@ -69,34 +59,29 @@ const b24ui = computed(() => tv({
     }
   }, appConfig.b24ui?.link || {})
 }));
-function isPartiallyEqual(item1, item2) {
-  const diffedKeys = diff(item1, item2).reduce((filtered, q) => {
-    if (q.type === "added") {
-      filtered.add(q.key);
-    }
-    return filtered;
-  }, /* @__PURE__ */ new Set());
-  const item1Filtered = Object.fromEntries(Object.entries(item1).filter(([key]) => !diffedKeys.has(key)));
-  const item2Filtered = Object.fromEntries(Object.entries(item2).filter(([key]) => !diffedKeys.has(key)));
-  return isEqual(item1Filtered, item2Filtered);
-}
+const to = computed(() => props.to ?? props.href);
 const isExternal = computed(() => {
-  if (!props.to) return false;
-  return typeof props.to === "string" && hasProtocol(props.to, { acceptRelative: true });
+  if (props.external) {
+    return true;
+  }
+  if (!to.value) {
+    return false;
+  }
+  return typeof to.value === "string" && hasProtocol(to.value, { acceptRelative: true });
 });
 function isLinkActive({ route: linkRoute, isActive, isExactActive }) {
   if (props.active !== void 0) {
     return props.active;
   }
-  if (!props.to || !route.value) {
+  if (!to.value) {
     return false;
   }
   if (props.exactQuery === "partial") {
-    if (!isPartiallyEqual(linkRoute.query, route.value.query)) return false;
+    if (!isPartiallyEqual(linkRoute.query, route.query)) return false;
   } else if (props.exactQuery === true) {
-    if (!isEqual(linkRoute.query, route.value.query)) return false;
+    if (!isEqual(linkRoute.query, route.query)) return false;
   }
-  if (props.exactHash && linkRoute.hash !== route.value.hash) {
+  if (props.exactHash && linkRoute.hash !== route.hash) {
     return false;
   }
   if (props.exact && isExactActive) {
@@ -122,8 +107,8 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
 </script>
 
 <template>
-  <template v-if="hasRouter && !isExternal">
-    <RouterLink v-slot="{ href, navigate, route: linkRoute, isActive, isExactActive }" v-bind="routerLinkProps" :to="to || '#'" custom>
+  <template v-if="!isExternal && !!to">
+    <RouterLink v-slot="{ href, navigate, route: linkRoute, isActive, isExactActive }" v-bind="routerLinkProps" :to="to" custom>
       <template v-if="custom">
         <slot
           v-bind="{
@@ -133,7 +118,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   type,
   disabled,
   target: props.target ? props.target : void 0,
-  href: to ? href : void 0,
+  href,
   navigate,
   active: isLinkActive({ route: linkRoute, isActive, isExactActive })
 }"
@@ -147,7 +132,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   as,
   type,
   disabled,
-  href: to ? href : void 0,
+  href,
   navigate
 }"
         :class="resolveLinkClass({ route: linkRoute, isActive, isExactActive })"
@@ -167,7 +152,8 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   disabled,
   href: to,
   target: isExternal ? '_blank' : void 0,
-  active: props?.active || false
+  active,
+  isExternal
 }"
       />
     </template>
@@ -179,12 +165,12 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   type,
   disabled,
   href: to,
-  target: isExternal ? '_blank' : void 0
+  target: isExternal ? '_blank' : void 0,
+  isExternal
 }"
-      :is-external="isExternal"
       :class="resolveLinkClass()"
     >
-      <slot :active="props?.active || false" />
+      <slot :active="active" />
     </B24LinkBase>
   </template>
 </template>

package/dist/runtime/vue/composables/useAppConfig.js

@@ -1,2 +1,4 @@
+import { reactive } from "vue";
 import appConfig from "#build/app.config";
-export const useAppConfig = () => appConfig;
+const _appConfig = reactive(appConfig);
+export const useAppConfig = () => _appConfig;

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

@@ -2,6 +2,7 @@ import type { Ref } from 'vue';
 import type { NuxtApp } from '#app';
 export { useHead } from '@unhead/vue';
 export { useRoute, useRouter } from 'vue-router';
+export { useAppConfig } from './composables/useAppConfig';
 export { defineShortcuts } from '../composables/defineShortcuts';
 export { defineLocale } from '../composables/defineLocale';
 export { useLocale } from '../composables/useLocale';
@@ -16,7 +17,6 @@ export declare const useColorMode: () => {
     readonly value: import("@vueuse/core").BasicColorMode;
     forced: boolean;
 };
-export declare const useAppConfig: () => any;
 export declare const useCookie: <T = string>(_name: string, _options?: Record<string, any>) => {
     value: Ref<T, T>;
     get: () => T;

package/dist/runtime/vue/stubs.js

@@ -4,6 +4,7 @@ import appConfig from "#build/app.config";
 import { useColorMode as useColorModeVueUse } from "@vueuse/core";
 export { useHead } from "@unhead/vue";
 export { useRoute, useRouter } from "vue-router";
+export { useAppConfig } from "./composables/useAppConfig.js";
 export { defineShortcuts } from "../composables/defineShortcuts.js";
 export { defineLocale } from "../composables/defineLocale.js";
 export { useLocale } from "../composables/useLocale.js";
@@ -29,7 +30,6 @@ export const useColorMode = () => {
     forced: false
   };
 };
-export const useAppConfig = () => appConfig;
 export const useCookie = (_name, _options = {}) => {
   const value = ref(null);
   return {